Merge pull request 'Branch_ccc' (#10) from Branch_ccc into master
Reviewed-on: #10
This commit is contained in:
commit
6703db7cc5
165
components/fui-icon/fui-icon.js
Normal file
165
components/fui-icon/fui-icon.js
Normal file
@ -0,0 +1,165 @@
|
||||
export default {
|
||||
"addressbook":"\ue80c",
|
||||
"addfriends-fill": "\ue80a",
|
||||
"addfriends": "\ue80b",
|
||||
"backspace-fill": "\ue808",
|
||||
"backspace": "\ue809",
|
||||
"bankcard-fill": "\ue806",
|
||||
"bankcard": "\ue807",
|
||||
"camera-fill": "\ue804",
|
||||
"camera": "\ue805",
|
||||
"captcha-fill": "\ue802",
|
||||
"captcha": "\ue803",
|
||||
"cart-fill": "\ue800",
|
||||
"cart": "\ue801",
|
||||
"classify": "\ue7fe",
|
||||
"classify-fill": "\ue7ff",
|
||||
"comment-fill": "\ue7fc",
|
||||
"comment": "\ue7fd",
|
||||
"community-fill": "\ue7fa",
|
||||
"community": "\ue7fb",
|
||||
"coupon-fill": "\ue7f8",
|
||||
"coupon": "\ue7f9",
|
||||
"delete": "\ue7f6",
|
||||
"delete-fill": "\ue7f7",
|
||||
"edit": "\ue7f4",
|
||||
"edit-fill": "\ue7f5",
|
||||
"fabulous-fill": "\ue7f2",
|
||||
"fabulous": "\ue7f3",
|
||||
"find": "\ue7f0",
|
||||
"find-fill": "\ue7f1",
|
||||
"help-fill": "\ue7ee",
|
||||
"help": "\ue7ef",
|
||||
"home-fill": "\ue7ec",
|
||||
"home": "\ue7ed",
|
||||
"idcard-fill": "\ue7ea",
|
||||
"idcard": "\ue7eb",
|
||||
"info": "\ue7e8",
|
||||
"info-fill": "\ue7e9",
|
||||
"invite-fill": "\ue7e6",
|
||||
"invite": "\ue7e7",
|
||||
"kefu-fill": "\ue7e4",
|
||||
"kefu": "\ue7e5",
|
||||
"like-fill": "\ue7e2",
|
||||
"like": "\ue7e3",
|
||||
"location": "\ue7e0",
|
||||
"location-fill": "\ue7e1",
|
||||
"lock": "\ue7de",
|
||||
"lock-fill": "\ue7df",
|
||||
"mail-fill": "\ue7dc",
|
||||
"mail": "\ue7dd",
|
||||
"message": "\ue7da",
|
||||
"message-fill": "\ue7db",
|
||||
"mobile-fill": "\ue7d8",
|
||||
"mobile": "\ue7d9",
|
||||
"more": "\ue7d6",
|
||||
"more-fill": "\ue7d7",
|
||||
"my-fill": "\ue7d4",
|
||||
"my": "\ue7d5",
|
||||
"principal":"\ue80d",
|
||||
"notice-fill": "\ue7d2",
|
||||
"notice": "\ue7d3",
|
||||
"order": "\ue7d0",
|
||||
"order-fill": "\ue7d1",
|
||||
"picture": "\ue7ce",
|
||||
"picture-fill": "\ue7cf",
|
||||
"setup-fill": "\ue7cc",
|
||||
"setup": "\ue7cd",
|
||||
"share": "\ue7ca",
|
||||
"share-fill": "\ue7cb",
|
||||
"shop": "\ue7c8",
|
||||
"shop-fill": "\ue7c9",
|
||||
"star-fill": "\ue7c5",
|
||||
"star": "\ue7c6",
|
||||
"starhalf": "\ue7c7",
|
||||
"stepon-fill": "\ue7c3",
|
||||
"stepon": "\ue7c4",
|
||||
"wait-fill": "\ue7c1",
|
||||
"wait": "\ue7c2",
|
||||
"warning": "\ue7bf",
|
||||
"warning-fill": "\ue7c0",
|
||||
"plus": "\ue7bc",
|
||||
"plussign-fill": "\ue7bd",
|
||||
"plussign": "\ue7be",
|
||||
"minus": "\ue7b9",
|
||||
"minussign": "\ue7ba",
|
||||
"minussign-fill": "\ue7bb",
|
||||
"close": "\ue7b8",
|
||||
"clear": "\ue7b6",
|
||||
"clear-fill": "\ue7b7",
|
||||
"checkbox-fill": "\ue7b5",
|
||||
"checkround": "\ue7b4",
|
||||
"checkbox": "\ue7b3",
|
||||
"check": "\ue7b2",
|
||||
"pulldown-fill": "\ue7ae",
|
||||
"pullup": "\ue7af",
|
||||
"pullup-fill": "\ue7b0",
|
||||
"pulldown": "\ue7b1",
|
||||
"roundright-fill": "\ue7ac",
|
||||
"roundright": "\ue7ad",
|
||||
"arrowright": "\ue7a9",
|
||||
"arrowleft": "\ue7aa",
|
||||
"arrowdown": "\ue7ab",
|
||||
"left": "\ue7a6",
|
||||
"up": "\ue7a7",
|
||||
"right": "\ue7a8",
|
||||
"back": "\ue7a3",
|
||||
"top": "\ue7a4",
|
||||
"dropdown": "\ue7a5",
|
||||
"turningleft": "\ue79f",
|
||||
"turningup": "\ue7a0",
|
||||
"turningright": "\ue7a1",
|
||||
"turningdown": "\ue7a2",
|
||||
"refresh": "\ue79c",
|
||||
"loading": "\ue79d",
|
||||
"search": "\ue79e",
|
||||
"rotate": "\ue79b",
|
||||
"screen": "\ue79a",
|
||||
"signin": "\ue799",
|
||||
"calendar": "\ue798",
|
||||
"scan": "\ue797",
|
||||
"qrcode": "\ue796",
|
||||
"wallet": "\ue795",
|
||||
"telephone": "\ue794",
|
||||
"visible": "\ue793",
|
||||
"invisible": "\ue792",
|
||||
"menu": "\ue78e",
|
||||
"operate": "\ue78f",
|
||||
"slide": "\ue790",
|
||||
"list": "\ue791",
|
||||
"nonetwork": "\ue78d",
|
||||
"partake": "\ue78c",
|
||||
"qa": "\ue78b",
|
||||
"barchart": "\ue788",
|
||||
"piechart": "\ue789",
|
||||
"linechart": "\ue78a",
|
||||
"at": "\ue787",
|
||||
"face": "\ue77f",
|
||||
"redpacket": "\ue780",
|
||||
"suspend": "\ue781",
|
||||
"link": "\ue782",
|
||||
"keyboard": "\ue783",
|
||||
"play": "\ue784",
|
||||
"video": "\ue785",
|
||||
"voice": "\ue786",
|
||||
"sina": "\ue77a",
|
||||
"browser": "\ue77b",
|
||||
"moments": "\ue77c",
|
||||
"qq": "\ue77d",
|
||||
"wechat": "\ue77e",
|
||||
"balance": "\ue779",
|
||||
"bankcardpay": "\ue778",
|
||||
"wxpay": "\ue777",
|
||||
"alipay": "\ue776",
|
||||
"payment":"\ue818",
|
||||
"receive":"\ue817",
|
||||
"sendout":"\ue816",
|
||||
"evaluate":"\ue815",
|
||||
"aftersale":"\ue814",
|
||||
"warehouse":"\ue813",
|
||||
"transport":"\ue812",
|
||||
"delivery":"\ue811",
|
||||
"switch":"\ue810",
|
||||
"goods":"\ue80f",
|
||||
"goods-fill":"\ue80e"
|
||||
}
|
BIN
components/fui-icon/fui-icon.ttf
Normal file
BIN
components/fui-icon/fui-icon.ttf
Normal file
Binary file not shown.
150
components/fui-icon/fui-icon.vue
Normal file
150
components/fui-icon/fui-icon.vue
Normal file
@ -0,0 +1,150 @@
|
||||
<template>
|
||||
<!-- #ifndef APP-NVUE -->
|
||||
<text :style="{ color:getColor, fontSize: getSize, fontWeight: fontWeight}" class="fui-icon"
|
||||
:class="[!getColor && !primary?'fui-icon__color':'',primary && (!color || color===true)?'fui-icon__active-color':'',disabled?'fui-icon__not-allowed':'',customPrefix && customPrefix!==true?customPrefix:'',customPrefix && customPrefix!==true?name:'']"
|
||||
@click="handleClick">{{ icons[name] || '' }}</text>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef APP-NVUE -->
|
||||
<text
|
||||
:style="{ color: primary && (!color || color===true)?primaryColor:getColor, fontSize: getSize,lineHeight:getSize, fontWeight: fontWeight}"
|
||||
class="fui-icon" :class="[customPrefix && customPrefix!==true?customPrefix:'']"
|
||||
@click="handleClick">{{ customPrefix && customPrefix!==true?name:icons[name] }}</text>
|
||||
<!-- #endif -->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import icons from './fui-icon.js';
|
||||
// #ifdef APP-NVUE
|
||||
var domModule = weex.requireModule('dom');
|
||||
import fuiicons from './fui-icon.ttf'
|
||||
domModule.addRule('fontFace', {
|
||||
'fontFamily': 'fuiFont',
|
||||
'src': "url('" + fuiicons + "')"
|
||||
});
|
||||
// #endif
|
||||
|
||||
export default {
|
||||
name: "fui-icon",
|
||||
emits: ['click'],
|
||||
// #ifdef MP-WEIXIN
|
||||
options: {
|
||||
addGlobalClass: true
|
||||
},
|
||||
// #endif
|
||||
props: {
|
||||
name: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
size: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
},
|
||||
//rpx | px
|
||||
unit: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
color: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
//字重
|
||||
fontWeight: {
|
||||
type: [Number, String],
|
||||
default: 'normal'
|
||||
},
|
||||
//是否禁用点击
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
params: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
},
|
||||
customPrefix: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
//是否显示为主色调,color为空时有效。【内部使用】
|
||||
primary: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
getSize() {
|
||||
const size = (uni.$fui && uni.$fui.fuiIcon && uni.$fui.fuiIcon.size) || 64
|
||||
const unit = (uni.$fui && uni.$fui.fuiIcon && uni.$fui.fuiIcon.unit) || 'rpx'
|
||||
return (this.size || size) + (this.unit || unit)
|
||||
},
|
||||
primaryColor() {
|
||||
const app = uni && uni.$fui && uni.$fui.color;
|
||||
return (app && app.primary) || '#465CFF';
|
||||
},
|
||||
getColor() {
|
||||
const app = uni && uni.$fui && uni.$fui.fuiIcon;
|
||||
let color = this.color;
|
||||
if (!color || (color && color === true)) {
|
||||
color = (app && app.color)
|
||||
}
|
||||
// #ifdef APP-NVUE
|
||||
if (!color || color === true) {
|
||||
color = '#333333'
|
||||
}
|
||||
// #endif
|
||||
return color;
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
icons: icons
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
handleClick() {
|
||||
if (this.disabled) return;
|
||||
this.$emit('click', {
|
||||
params: this.params
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* #ifndef APP-NVUE */
|
||||
/* 头条小程序组件内不能引入字体,需要在父级页面引入字体文件*/
|
||||
@font-face {
|
||||
font-family: fuiFont;
|
||||
src: url("./fui-icon.ttf") format("truetype");
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
.fui-icon {
|
||||
font-family: fuiFont;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
/* #ifdef H5 */
|
||||
cursor: pointer;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-icon__color {
|
||||
color: var(--fui-color-section, #333333) !important;
|
||||
}
|
||||
|
||||
.fui-icon__active-color {
|
||||
color: var(--fui-color-primary, #465CFF) !important;
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
|
||||
.fui-icon__not-allowed {
|
||||
/* #ifdef H5 */
|
||||
cursor: not-allowed !important;
|
||||
/* #endif */
|
||||
}
|
||||
</style>
|
206
components/fui-toast/fui-toast.vue
Normal file
206
components/fui-toast/fui-toast.vue
Normal file
@ -0,0 +1,206 @@
|
||||
<template>
|
||||
<view class="fui-toast__wrap" :class="{'fui-toast__show':visible}" v-if="visible || !isNvue" ref="fui_toast_ani">
|
||||
<view class="fui-toast__inner"
|
||||
:style="{paddingTop:padding[0] || 0,paddingRight:padding[1] || 0,paddingBottom:padding[2] || padding[0] || 0,paddingLeft:padding[3] || padding[1] || 0,background:background,zIndex:zIndex}">
|
||||
<slot></slot>
|
||||
<view class="fui-toast__icon-box" v-if="src" :style="{width:width+'rpx',height:width+'rpx'}">
|
||||
<image class="fui-toast__icon" :src="src" :style="{width:width+'rpx',height:width+'rpx'}">
|
||||
</image>
|
||||
</view>
|
||||
<text class="fui-toast__text" :style="{fontSize:size+'rpx',color:color}" v-if="text">{{text}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// #ifdef APP-NVUE
|
||||
const animation = uni.requireNativePlugin('animation');
|
||||
// #endif
|
||||
export default {
|
||||
name: "fui-toast",
|
||||
props: {
|
||||
padding: {
|
||||
type: Array,
|
||||
default () {
|
||||
return ['32rpx', '32rpx']
|
||||
}
|
||||
},
|
||||
background: {
|
||||
type: String,
|
||||
default: 'rgba(0,0,0,.6)'
|
||||
},
|
||||
//图标宽度(高度与宽度一致)rpx
|
||||
width: {
|
||||
type: [Number, String],
|
||||
default: 64
|
||||
},
|
||||
size: {
|
||||
type: [Number, String],
|
||||
default: 30
|
||||
},
|
||||
color: {
|
||||
type: String,
|
||||
default: '#fff'
|
||||
},
|
||||
zIndex: {
|
||||
type: Number,
|
||||
default: 1001
|
||||
}
|
||||
},
|
||||
data() {
|
||||
let isNvue = false;
|
||||
// #ifdef APP-NVUE
|
||||
isNvue = true;
|
||||
// #endif
|
||||
return {
|
||||
timer: null,
|
||||
visible: false,
|
||||
src: '',
|
||||
text: '',
|
||||
isNvue: isNvue
|
||||
};
|
||||
},
|
||||
// #ifndef VUE3
|
||||
beforeDestroy() {
|
||||
clearTimeout(this.timer);
|
||||
this.timer = null;
|
||||
},
|
||||
// #endif
|
||||
// #ifdef VUE3
|
||||
beforeUnmount() {
|
||||
clearTimeout(this.timer);
|
||||
this.timer = null;
|
||||
},
|
||||
// #endif
|
||||
methods: {
|
||||
// #ifdef APP-NVUE
|
||||
_animation(type, duration = 2000) {
|
||||
if (!this.$refs['fui_toast_ani']) return;
|
||||
animation.transition(
|
||||
this.$refs['fui_toast_ani'].ref, {
|
||||
styles: {
|
||||
opacity: type ? 1 : 0
|
||||
},
|
||||
duration: 300, //ms
|
||||
timingFunction: 'ease-in-out',
|
||||
needLayout: false,
|
||||
delay: 0 //ms
|
||||
},
|
||||
() => {
|
||||
if (!type) {
|
||||
this.visible = false;
|
||||
} else {
|
||||
this.timer = setTimeout(() => {
|
||||
this._animation(false)
|
||||
clearTimeout(this.timer);
|
||||
this.timer = null;
|
||||
}, duration);
|
||||
}
|
||||
}
|
||||
);
|
||||
},
|
||||
// #endif
|
||||
show: function(options) {
|
||||
clearTimeout(this.timer);
|
||||
let {
|
||||
duration = 2000,
|
||||
src = '',
|
||||
text = ''
|
||||
} = options;
|
||||
this.text = text;
|
||||
this.src = src;
|
||||
// #ifdef APP-NVUE
|
||||
this.visible = true;
|
||||
// #endif
|
||||
this.$nextTick(() => {
|
||||
setTimeout(() => {
|
||||
// #ifdef APP-NVUE
|
||||
this._animation(true, duration)
|
||||
// #endif
|
||||
// #ifndef APP-NVUE
|
||||
this.visible = true;
|
||||
this.timer = setTimeout(() => {
|
||||
this.visible = false;
|
||||
clearTimeout(this.timer);
|
||||
this.timer = null;
|
||||
}, duration);
|
||||
// #endif
|
||||
}, 50);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.fui-toast__wrap {
|
||||
position: fixed;
|
||||
/* #ifdef APP-NVUE */
|
||||
left: 64rpx;
|
||||
right: 64rpx;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
/* #endif */
|
||||
/* #ifndef APP-NVUE */
|
||||
left: 15%;
|
||||
right: 15%;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
/* #endif */
|
||||
background-color: rgba(0, 0, 0, 0);
|
||||
z-index: 1002;
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
visibility: hidden;
|
||||
/* #endif */
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
/* #ifndef APP-NVUE */
|
||||
transition-property: opacity, visibility;
|
||||
transition-timing-function: ease-in-out;
|
||||
transition-duration: 0.3s;
|
||||
/* #endif */
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.fui-toast__inner {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
/* #endif */
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-toast__show {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
.fui-toast__icon-box {
|
||||
padding-bottom: 20rpx;
|
||||
/* #ifndef APP-NVUE */
|
||||
box-sizing: content-box;
|
||||
flex-shrink: 0;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
.fui-toast__icon {
|
||||
display: block;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
.fui-toast__text {
|
||||
font-weight: 400;
|
||||
text-align: center;
|
||||
/* #ifndef APP-NVUE */
|
||||
word-break: break-all;
|
||||
/* #endif */
|
||||
}
|
||||
</style>
|
@ -196,9 +196,14 @@
|
||||
"plugins": {},
|
||||
"lazyCodeLoading": "requiredComponents",
|
||||
"usingComponents": {},
|
||||
"permission": {},
|
||||
"permission": {
|
||||
"scope.userLocation": {
|
||||
"desc": "你的位置信息将用于选择定位"
|
||||
}
|
||||
},
|
||||
"requiredPrivateInfos": [
|
||||
"chooseAddress"
|
||||
"chooseAddress",
|
||||
"getLocation"
|
||||
]
|
||||
},
|
||||
"mp-alipay": {
|
||||
|
111
package.json
111
package.json
@ -1,105 +1,20 @@
|
||||
{
|
||||
"id": "shopro",
|
||||
"name": "shopro",
|
||||
"displayName": "芋道商城",
|
||||
"version": "2.1.0",
|
||||
"description": "芋道商城,一套代码,同时发行到iOS、Android、H5、微信小程序多个平台,请使用手机扫码快速体验强大功能",
|
||||
"scripts": {
|
||||
"prettier": "prettier --write \"{pages,sheep}/**/*.{js,json,tsx,css,less,scss,vue,html,md}\"",
|
||||
"build:prod": "vue-cli-service build --mode prod",
|
||||
"build:dev": "vue-cli-service build --mode dev"
|
||||
},
|
||||
"repository": "https://github.com/sheepjs/shop.git",
|
||||
"id": "fui-toast",
|
||||
"name": "Toast 轻提示(fui-toast)",
|
||||
"version": "v2.3.0",
|
||||
"description": "FirstUI Toast 轻提示,一种轻量级反馈/提示,适合用于页面转场、数据交互的等场景中。",
|
||||
"keywords": [
|
||||
"商城",
|
||||
"B2C",
|
||||
"商城模板"
|
||||
"Toast",
|
||||
"轻提示",
|
||||
"组件",
|
||||
"FirstUI",
|
||||
"Nvue"
|
||||
],
|
||||
"author": "",
|
||||
"license": "MIT",
|
||||
"bugs": {
|
||||
"url": "https://github.com/sheepjs/shop/issues"
|
||||
},
|
||||
"homepage": "https://github.com/dcloudio/hello-uniapp#readme",
|
||||
"dcloudext": {
|
||||
"category": [
|
||||
"前端页面模板",
|
||||
"uni-app前端项目模板"
|
||||
],
|
||||
"sale": {
|
||||
"regular": {
|
||||
"price": "0.00"
|
||||
"前端组件",
|
||||
"通用组件"
|
||||
]
|
||||
},
|
||||
"sourcecode": {
|
||||
"price": "0.00"
|
||||
}
|
||||
},
|
||||
"contact": {
|
||||
"qq": ""
|
||||
},
|
||||
"declaration": {
|
||||
"ads": "无",
|
||||
"data": "无",
|
||||
"permissions": "无"
|
||||
},
|
||||
"npmurl": ""
|
||||
},
|
||||
"uni_modules": {
|
||||
"dependencies": [],
|
||||
"encrypt": [],
|
||||
"platforms": {
|
||||
"cloud": {
|
||||
"tcb": "u",
|
||||
"aliyun": "u"
|
||||
},
|
||||
"client": {
|
||||
"App": {
|
||||
"app-vue": "y",
|
||||
"app-nvue": "u"
|
||||
},
|
||||
"H5-mobile": {
|
||||
"Safari": "y",
|
||||
"Android Browser": "y",
|
||||
"微信浏览器(Android)": "y",
|
||||
"QQ浏览器(Android)": "y"
|
||||
},
|
||||
"H5-pc": {
|
||||
"Chrome": "y",
|
||||
"IE": "y",
|
||||
"Edge": "y",
|
||||
"Firefox": "y",
|
||||
"Safari": "y"
|
||||
},
|
||||
"小程序": {
|
||||
"微信": "y",
|
||||
"阿里": "u",
|
||||
"百度": "u",
|
||||
"字节跳动": "u",
|
||||
"QQ": "u",
|
||||
"京东": "u"
|
||||
},
|
||||
"快应用": {
|
||||
"华为": "u",
|
||||
"联盟": "u"
|
||||
},
|
||||
"Vue": {
|
||||
"vue2": "u",
|
||||
"vue3": "y"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"dayjs": "^1.11.7",
|
||||
"lodash": "^4.17.21",
|
||||
"lodash-es": "^4.17.21",
|
||||
"luch-request": "^3.0.8",
|
||||
"pinia": "^2.0.33",
|
||||
"pinia-plugin-persist-uni": "^1.2.0",
|
||||
"weixin-js-sdk": "^1.6.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"prettier": "^2.8.7",
|
||||
"vconsole": "^3.15.0"
|
||||
}
|
||||
"displayName": "Toast 轻提示(fui-toast)"
|
||||
}
|
60
pages.json
60
pages.json
@ -46,6 +46,32 @@
|
||||
"group": "商城"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/seeding/seeding",
|
||||
"style": {
|
||||
"navigationBarTitleText": "社区种草",
|
||||
"enablePullDownRefresh": true
|
||||
},
|
||||
"meta": {
|
||||
"auth": false,
|
||||
"sync": true,
|
||||
"title": "社区种草",
|
||||
"group": "商城"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/subscribe/success_tolse",
|
||||
"style": {
|
||||
"navigationBarTitleText": "预约成功",
|
||||
"enablePullDownRefresh": true
|
||||
},
|
||||
"meta": {
|
||||
"auth": false,
|
||||
"sync": true,
|
||||
"title": "预约成功",
|
||||
"group": "商城"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/reservation_record/reservation_record",
|
||||
"style": {
|
||||
@ -214,17 +240,6 @@
|
||||
"group": "商品"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "sales",
|
||||
"style": {
|
||||
"navigationBarTitleText": "促销商品"
|
||||
},
|
||||
"meta": {
|
||||
"sync": true,
|
||||
"title": "促销商品",
|
||||
"group": "商品"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "list",
|
||||
"style": {
|
||||
@ -366,6 +381,18 @@
|
||||
"group": "用户中心"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "user_vip/agreement",
|
||||
"style": {
|
||||
"navigationBarTitleText": "会员协议"
|
||||
},
|
||||
"meta": {
|
||||
"auth": true,
|
||||
"sync": true,
|
||||
"title": "会员协议",
|
||||
"group": "用户中心"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "user_vip/index",
|
||||
"style": {
|
||||
@ -780,6 +807,17 @@
|
||||
"group": "营销活动"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "point/exchange_listall",
|
||||
"style": {
|
||||
"navigationBarTitleText": "兑换记录"
|
||||
},
|
||||
"meta": {
|
||||
"sync": true,
|
||||
"title": "兑换记录",
|
||||
"group": "营销活动"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "point/exchange_success",
|
||||
"style": {
|
||||
|
@ -1,7 +1,7 @@
|
||||
<!-- 拼团活动列表 -->
|
||||
<template>
|
||||
<s-layout navbar="inner" :bgStyle="{ color: '#FE832A' }">
|
||||
<view class="page-bg" :style="[{ marginTop: '-' + Number(statusBarHeight + 88) + 'rpx' }]" />
|
||||
<view class="page-bg" :class="state.themeType ? `${state.themeType}v` : ''" :style="[{ marginTop: '-' + Number(statusBarHeight + 88) + 'rpx' }]" />
|
||||
<view class="list-content">
|
||||
<!-- 参团会员统计 -->
|
||||
<view class="content-header ss-flex-col ss-col-center ss-row-center">
|
||||
@ -17,7 +17,7 @@
|
||||
<i>···</i>
|
||||
</span>
|
||||
</view>
|
||||
<text class="pic_count">{{ state.summaryData.userCount || 0 }}人参与</text>
|
||||
<text class="pic_count" :class="state.themeType ? state.themeType : ''">{{ state.summaryData.userCount || 0 }}人参与</text>
|
||||
</view>
|
||||
</view>
|
||||
<scroll-view
|
||||
@ -36,7 +36,7 @@
|
||||
@click="sheep.$router.go('/pages/goods/groupon', { id: item.id })"
|
||||
>
|
||||
<template v-slot:cart>
|
||||
<button class="ss-reset-button cart-btn">去拼团</button>
|
||||
<button class="ss-reset-button cart-btn" :class="state.themeType ? state.themeType : ''">去拼团</button>
|
||||
</template>
|
||||
</s-goods-column>
|
||||
</view>
|
||||
@ -53,11 +53,11 @@
|
||||
</s-layout>
|
||||
</template>
|
||||
<script setup>
|
||||
import { reactive } from 'vue';
|
||||
import { reactive,computed } from 'vue';
|
||||
import { onLoad, onReachBottom } from '@dcloudio/uni-app';
|
||||
import sheep from '@/sheep';
|
||||
import CombinationApi from '@/sheep/api/promotion/combination';
|
||||
|
||||
const app = computed(() => sheep.$store('app'));
|
||||
const { safeAreaInsets, safeArea } = sheep.$platform.device;
|
||||
const sysNavBar = sheep.$platform.navbar;
|
||||
const statusBarHeight = sheep.$platform.device.statusBarHeight * 2;
|
||||
@ -74,6 +74,7 @@
|
||||
},
|
||||
loadStatus: '',
|
||||
summaryData: {},
|
||||
themeType:app.value.platform.themeType
|
||||
});
|
||||
|
||||
// 加载统计数据
|
||||
@ -122,6 +123,22 @@
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/fea9ad54f32d4705a633874efd534e70e507030ea5a7604b0110fdf7292f1f4d.png');
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.lvv{
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/ed254fe4a03c16933e608f8adeb3e700a24ec4620064746a516c10da395b9395.png') !important;
|
||||
background-size: 100% 100% !important;
|
||||
}
|
||||
.bluev{
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/8728b7f2de5a0d2d8a74ef0c17a275f82b265a3d8d11993ec7c424c3ad454f0b.png') !important;
|
||||
background-size: 100% 100% !important;
|
||||
}
|
||||
.pinkv{
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/b44a3035cd4f676504a7003607bfb9aa457ffe1335c12d1e26dcffb45e3bfec8.png') !important;
|
||||
background-size: 100% 100% !important;
|
||||
}
|
||||
.orangev{
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/ebc89def2a0cf1db1ce6b5aec26407e24e49c85dcf81a1d1c759afe414da033f.png') !important;
|
||||
background-size: 100% 100% !important;
|
||||
}
|
||||
.list-content {
|
||||
position: relative;
|
||||
z-index: 3;
|
||||
@ -220,6 +237,7 @@
|
||||
font-size: 24rpx;
|
||||
color: #fff;
|
||||
background: linear-gradient(90deg, #ff6600 0%, #fe832a 100%);
|
||||
// background: rgba(72,204,82);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -34,7 +34,7 @@
|
||||
{{item.properties.map((property) => property.valueName).join(' ')}}
|
||||
</view>
|
||||
<view class="b">
|
||||
10积分(待对接接口)
|
||||
{{state.orderInfo.usePoint}}积分
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -74,7 +74,7 @@
|
||||
支付积分
|
||||
</view>
|
||||
<view class="r">
|
||||
10(待接口对接)
|
||||
{{state.orderInfo.usePoint}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
@ -24,7 +24,7 @@
|
||||
<!-- <text class="card-c">×</text> -->
|
||||
<view class="card-r">-{{item.usePoint}} 积分</view>
|
||||
</view>
|
||||
<view class="r-cart" @click="sheep.$router.go('/pages/activity/point/exchange_detail', { id: '1' })">查看详情</view>
|
||||
<view class="r-cart" @click="sheep.$router.go('/pages/activity/point/exchange_detail', { id: item.id })">查看详情</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
48
pages/activity/point/exchange_listall.vue
Normal file
48
pages/activity/point/exchange_listall.vue
Normal file
@ -0,0 +1,48 @@
|
||||
<!-- 自定义页面:支持装修 -->
|
||||
<template>
|
||||
<s-layout title="商品列表" :bgStyle="{ color: '#fff' }">
|
||||
<view style="margin-top:10px;">
|
||||
<s-block v-for="(item, index) in state.components" :key="index">
|
||||
<!-- <s-block-item :type="item.id" :data="item.property" :styles="item.property.style" /> -->
|
||||
<!-- 营销组件:积分商城 -->
|
||||
<s-point-block v-if="item.id === 'PromotionPoint'" :data="item.property" :styles="item.property.style" />
|
||||
</s-block>
|
||||
</view>
|
||||
</s-layout>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive } from 'vue';
|
||||
import { onLoad, onPageScroll } from '@dcloudio/uni-app';
|
||||
import DiyApi from '@/sheep/api/promotion/diy';
|
||||
|
||||
const state = reactive({
|
||||
name: '',
|
||||
components: [],
|
||||
navigationBar: {},
|
||||
page: {},
|
||||
});
|
||||
onLoad(async (options) => {
|
||||
let id = options.id
|
||||
|
||||
// #ifdef MP
|
||||
// 小程序预览自定义页面
|
||||
if (options.scene) {
|
||||
const sceneParams = decodeURIComponent(options.scene).split('=');
|
||||
id = sceneParams[1];
|
||||
}
|
||||
// #endif
|
||||
|
||||
const { code, data } = await DiyApi.getDiyPage(id);
|
||||
if (code === 0) {
|
||||
state.name = data.name;
|
||||
state.components = data.property?.components;
|
||||
state.navigationBar = data.property?.navigationBar;
|
||||
state.page = data.property?.page;
|
||||
}
|
||||
});
|
||||
|
||||
onPageScroll(() => {});
|
||||
</script>
|
||||
|
||||
<style></style>
|
@ -10,7 +10,7 @@
|
||||
订单编号
|
||||
</view>
|
||||
<view class="r">
|
||||
wx23556151561321321351213
|
||||
{{ state.orderInfo.no }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="ddxx">
|
||||
@ -18,7 +18,7 @@
|
||||
兑换时间
|
||||
</view>
|
||||
<view class="r">
|
||||
2024-10-18 15:46:03
|
||||
{{ sheep.$helper.timeFormat(state.orderInfo.createTime, 'yyyy-mm-dd hh:MM:ss') }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="ddxx">
|
||||
@ -31,18 +31,18 @@
|
||||
</view>
|
||||
<view class="ddxx">
|
||||
<view class="l">
|
||||
支付方式
|
||||
支付积分
|
||||
</view>
|
||||
<view class="r">
|
||||
10
|
||||
{{state.orderInfo.usePoint}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="fgx"></view>
|
||||
|
||||
<view class="ck-detail">
|
||||
<view class="ck-detail" @click="sheep.$router.redirect('/pages/activity/point/exchange_detail',{id:state.id})">
|
||||
查看详情
|
||||
</view>
|
||||
<view class="bk-home">
|
||||
<view class="bk-home" @click="sheep.$router.redirect('/pages/index/index');">
|
||||
返回首页
|
||||
</view>
|
||||
</view>
|
||||
@ -50,51 +50,192 @@
|
||||
</template>
|
||||
<script setup>
|
||||
import sheep from '@/sheep';
|
||||
import { onLoad, onReachBottom } from '@dcloudio/uni-app';
|
||||
import { reactive, ref } from 'vue';
|
||||
import PointApi from '@/sheep/api/promotion/point';
|
||||
import SLayout from '@/sheep/components/s-layout/s-layout.vue';
|
||||
import {
|
||||
onLoad
|
||||
} from '@dcloudio/uni-app';
|
||||
import {
|
||||
reactive,
|
||||
ref
|
||||
} from 'vue';
|
||||
import {
|
||||
isEmpty
|
||||
} from 'lodash-es';
|
||||
import {
|
||||
fen2yuan,
|
||||
formatOrderStatus,
|
||||
formatOrderStatusDescription,
|
||||
handleOrderButtons,
|
||||
} from '@/sheep/hooks/useGoods';
|
||||
import OrderApi from '@/sheep/api/trade/order';
|
||||
import DeliveryApi from '@/sheep/api/trade/delivery';
|
||||
import PickUpVerify from '@/pages/order/pickUpVerify.vue';
|
||||
|
||||
// 计算页面高度
|
||||
const { safeAreaInsets, safeArea } = sheep.$platform.device;
|
||||
const statusBarHeight = sheep.$platform.device.statusBarHeight * 2;
|
||||
const pageHeight =
|
||||
(safeArea.height + safeAreaInsets.bottom) * 2 + statusBarHeight - sheep.$platform.navbar - 350;
|
||||
const headerBg = sheep.$url.css('/static/img/shop/order/order_bg.png');
|
||||
|
||||
const sPointCardRef = ref();
|
||||
// 查询活动列表
|
||||
const activityPageParams = reactive({
|
||||
pageNo: 1, // 页码
|
||||
pageSize: 5, // 每页数量
|
||||
const state = reactive({
|
||||
orderInfo: {},
|
||||
merchantTradeNo: '', // 商户订单号
|
||||
comeinType: '', // 进入订单详情的来源类型
|
||||
id:0
|
||||
});
|
||||
|
||||
const activityTotal = ref(0); // 活动总数
|
||||
const activityCount = ref(0); // 已加载活动数量
|
||||
const loadStatus = ref(''); // 页面加载状态
|
||||
async function getActivityList() {
|
||||
loadStatus.value = 'loading';
|
||||
const { data } = await PointApi.getPointActivityPage(activityPageParams);
|
||||
await sPointCardRef.value.concatActivity(data.list);
|
||||
activityCount.value = sPointCardRef.value.getActivityCount();
|
||||
activityTotal.value = data.total;
|
||||
// ========== 门店自提(核销) ==========
|
||||
const systemStore = ref({}); // 门店信息
|
||||
|
||||
loadStatus.value = activityCount.value < activityTotal.value ? 'more' : 'noMore';
|
||||
}
|
||||
// 复制
|
||||
const onCopy = () => {
|
||||
sheep.$helper.copyText(state.orderInfo.no);
|
||||
};
|
||||
|
||||
// 加载更多
|
||||
function loadMore() {
|
||||
if (state.loadStatus !== 'noMore') {
|
||||
activityPageParams.pageNo += 1;
|
||||
getActivityList();
|
||||
}
|
||||
}
|
||||
|
||||
// 上拉加载更多
|
||||
onReachBottom(() => {
|
||||
loadMore();
|
||||
// 去支付
|
||||
function onPay(payOrderId) {
|
||||
sheep.$router.go('/pages/pay/index', {
|
||||
id: payOrderId,
|
||||
});
|
||||
onLoad(() => {
|
||||
getActivityList();
|
||||
}
|
||||
|
||||
// 查看商品
|
||||
function onGoodsDetail(id) {
|
||||
sheep.$router.go('/pages/goods/index', {
|
||||
id,
|
||||
});
|
||||
}
|
||||
|
||||
// 取消订单
|
||||
async function onCancel(orderId) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确定要取消订单吗?',
|
||||
success: async function(res) {
|
||||
if (!res.confirm) {
|
||||
return;
|
||||
}
|
||||
const {
|
||||
code
|
||||
} = await OrderApi.cancelOrder(orderId);
|
||||
if (code === 0) {
|
||||
await getOrderDetail(orderId);
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
// 查看物流
|
||||
async function onExpress(id) {
|
||||
sheep.$router.go('/pages/order/express/log', {
|
||||
id,
|
||||
});
|
||||
}
|
||||
|
||||
// 确认收货 TODO 芋艿:待测试
|
||||
async function onConfirm(orderId, ignore = false) {
|
||||
// 需开启确认收货组件
|
||||
// todo: 芋艿:待接入微信
|
||||
// 1.怎么检测是否开启了发货组件功能?如果没有开启的话就不能在这里return出去
|
||||
// 2.如果开启了走mpConfirm方法,需要在App.vue的show方法中拿到确认收货结果
|
||||
let isOpenBusinessView = true;
|
||||
if (
|
||||
sheep.$platform.name === 'WechatMiniProgram' &&
|
||||
!isEmpty(state.orderInfo.wechat_extra_data) &&
|
||||
isOpenBusinessView &&
|
||||
!ignore
|
||||
) {
|
||||
mpConfirm(orderId);
|
||||
return;
|
||||
}
|
||||
|
||||
// 正常的确认收货流程
|
||||
const {
|
||||
code
|
||||
} = await OrderApi.receiveOrder(orderId);
|
||||
if (code === 0) {
|
||||
await getOrderDetail(orderId);
|
||||
}
|
||||
}
|
||||
|
||||
// #ifdef MP-WEIXIN
|
||||
// 小程序确认收货组件
|
||||
function mpConfirm(orderId) {
|
||||
if (!wx.openBusinessView) {
|
||||
sheep.$helper.toast(`请升级微信版本`);
|
||||
return;
|
||||
}
|
||||
wx.openBusinessView({
|
||||
businessType: 'weappOrderConfirm',
|
||||
extraData: {
|
||||
merchant_trade_no: state.orderInfo.wechat_extra_data.merchant_trade_no,
|
||||
transaction_id: state.orderInfo.wechat_extra_data.transaction_id,
|
||||
},
|
||||
success(response) {
|
||||
console.log('success:', response);
|
||||
if (response.errMsg === 'openBusinessView:ok') {
|
||||
if (response.extraData.status === 'success') {
|
||||
onConfirm(orderId, true);
|
||||
}
|
||||
}
|
||||
},
|
||||
fail(error) {
|
||||
console.log('error:', error);
|
||||
},
|
||||
complete(result) {
|
||||
console.log('result:', result);
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
// #endif
|
||||
|
||||
// 评价
|
||||
function onComment(id) {
|
||||
sheep.$router.go('/pages/goods/comment/add', {
|
||||
id,
|
||||
});
|
||||
}
|
||||
|
||||
const pickUpVerifyRef = ref();
|
||||
|
||||
async function getOrderDetail(id) {
|
||||
// 对详情数据进行适配
|
||||
let res;
|
||||
if (state.comeinType === 'wechat') {
|
||||
// TODO 芋艿:微信场景下
|
||||
res = await OrderApi.getOrder(id, {
|
||||
merchant_trade_no: state.merchantTradeNo,
|
||||
});
|
||||
} else {
|
||||
res = await OrderApi.getOrder(id);
|
||||
}
|
||||
if (res.code === 0) {
|
||||
state.orderInfo = res.data;
|
||||
handleOrderButtons(state.orderInfo);
|
||||
// 配送方式:门店自提
|
||||
if (res.data.pickUpStoreId) {
|
||||
const {
|
||||
data
|
||||
} = await DeliveryApi.getDeliveryPickUpStore(res.data.pickUpStoreId);
|
||||
systemStore.value = data || {};
|
||||
}
|
||||
if (state.orderInfo.deliveryType === 2 && state.orderInfo.payStatus) {
|
||||
pickUpVerifyRef.value && pickUpVerifyRef.value.markCode(res.data.pickUpVerifyCode);
|
||||
}
|
||||
} else {
|
||||
sheep.$router.back();
|
||||
}
|
||||
}
|
||||
|
||||
onLoad(async (options) => {
|
||||
let id = 0;
|
||||
if (options.id) {
|
||||
id = options.id;
|
||||
state.id = options.id;
|
||||
}
|
||||
// TODO 芋艿:下面两个变量,后续接入
|
||||
state.comeinType = options.comein_type;
|
||||
if (state.comeinType === 'wechat') {
|
||||
state.merchantTradeNo = options.merchant_trade_no;
|
||||
}
|
||||
await getOrderDetail(id);
|
||||
});
|
||||
</script>
|
||||
|
||||
|
@ -8,15 +8,8 @@
|
||||
></view> -->
|
||||
<!-- 时间段轮播图 -->
|
||||
<view class="header" v-if="activeTimeConfig?.sliderPicUrls?.length > 0">
|
||||
<swiper
|
||||
indicator-dots="true"
|
||||
autoplay="true"
|
||||
:circular="true"
|
||||
interval="3000"
|
||||
duration="1500"
|
||||
indicator-color="rgba(255,255,255,0.6)"
|
||||
indicator-active-color="#fff"
|
||||
>
|
||||
<swiper indicator-dots="true" autoplay="true" :circular="true" interval="3000" duration="1500"
|
||||
indicator-color="rgba(255,255,255,0.6)" indicator-active-color="#fff">
|
||||
<block v-for="(picUrl, index) in activeTimeConfig.sliderPicUrls" :key="index">
|
||||
<swiper-item class="borRadius14">
|
||||
<image :src="picUrl" class="slide-image borRadius14" lazy-load />
|
||||
@ -29,24 +22,12 @@
|
||||
<!-- 左侧图标 -->
|
||||
<view class="time-icon">
|
||||
<!-- TODO 芋艿:图片统一维护 -->
|
||||
<image
|
||||
class="ss-w-100 ss-h-100"
|
||||
src="http://mall.yudao.iocoder.cn/static/images/priceTag.png"
|
||||
/>
|
||||
<image class="ss-w-100 ss-h-100" src="http://mall.yudao.iocoder.cn/static/images/priceTag.png" />
|
||||
</view>
|
||||
<scroll-view
|
||||
class="time-list"
|
||||
:scroll-into-view="activeTimeElId"
|
||||
scroll-x
|
||||
scroll-with-animation
|
||||
>
|
||||
<view
|
||||
v-for="(config, index) in timeConfigList"
|
||||
:key="index"
|
||||
:class="['item', { active: activeTimeIndex === index }]"
|
||||
:id="`timeItem${index}`"
|
||||
@tap="handleChangeTimeConfig(index,config.id)"
|
||||
>
|
||||
<scroll-view class="time-list" :scroll-into-view="activeTimeElId" scroll-x scroll-with-animation>
|
||||
<view v-for="(config, index) in timeConfigList" :key="index"
|
||||
:class="['item', { active: activeTimeIndex === index }]" :id="`timeItem${index}`"
|
||||
@tap="handleChangeTimeConfig(index,config.id)">
|
||||
<!-- 活动起始时间 -->
|
||||
<view class="time">{{ config.startTime }}</view>
|
||||
<!-- 活动状态 -->
|
||||
@ -78,37 +59,25 @@
|
||||
</view> -->
|
||||
|
||||
<!-- 活动列表 -->
|
||||
<scroll-view
|
||||
class="scroll-box"
|
||||
:style="{ height: pageHeight + 'rpx' }"
|
||||
scroll-y="true"
|
||||
:scroll-with-animation="false"
|
||||
:enable-back-to-top="true"
|
||||
>
|
||||
<scroll-view class="scroll-box" :style="{ height: pageHeight + 'rpx' }" scroll-y="true"
|
||||
:scroll-with-animation="false" :enable-back-to-top="true">
|
||||
<view class="goods-box ss-m-b-20" v-for="activity in activityList" :key="activity.id">
|
||||
<s-goods-column
|
||||
size="lg"
|
||||
:data="{ ...activity, price: activity.seckillPrice }"
|
||||
:goodsFields="goodsFields"
|
||||
:seckillTag="true"
|
||||
@click="sheep.$router.go('/pages/goods/seckill', { id: activity.id })"
|
||||
>
|
||||
<s-goods-column size="lg" :data="{ ...activity, price: activity.seckillPrice }"
|
||||
:goodsFields="goodsFields" :seckillTag="true"
|
||||
@click="sheep.$router.go('/pages/goods/seckill', { id: activity.id })">
|
||||
<!-- 抢购进度 -->
|
||||
<template #activity>
|
||||
<view class="limit"
|
||||
>限量
|
||||
<text class="ss-m-l-5">{{ activity.stock }} {{ activity.unitName }}</text></view
|
||||
>
|
||||
<view class="limit">限量
|
||||
<text class="ss-m-l-5">{{ activity.stock }} {{ activity.unitName }}</text>
|
||||
</view>
|
||||
<su-progress :percentage="activity.percent" strokeWidth="10" textInside isAnimate />
|
||||
</template>
|
||||
<!-- 抢购按钮 -->
|
||||
<template #cart>
|
||||
<button
|
||||
:class="[
|
||||
<button :class="[
|
||||
'ss-reset-button cart-btn',
|
||||
{ disabled: activeTimeConfig.status === TimeStatusEnum.END },
|
||||
]"
|
||||
>
|
||||
]">
|
||||
<span v-if="activeTimeConfig?.status === TimeStatusEnum.WAIT_START">未开始</span>
|
||||
<span v-else-if="activeTimeConfig?.status === TimeStatusEnum.STARTED">马上抢</span>
|
||||
<span v-else>已结束</span>
|
||||
@ -116,29 +85,39 @@
|
||||
</template>
|
||||
</s-goods-column>
|
||||
</view>
|
||||
<uni-load-more
|
||||
v-if="activityTotal > 0"
|
||||
:status="loadStatus"
|
||||
:content-text="{
|
||||
<uni-load-more v-if="activityTotal > 0" :status="loadStatus" :content-text="{
|
||||
contentdown: '上拉加载更多',
|
||||
}"
|
||||
@tap="loadMore"
|
||||
/>
|
||||
}" @tap="loadMore" />
|
||||
</scroll-view>
|
||||
</view>
|
||||
</s-layout>
|
||||
</template>
|
||||
<script setup>
|
||||
import { reactive, computed, ref, nextTick } from 'vue';
|
||||
import { onLoad, onReachBottom } from '@dcloudio/uni-app';
|
||||
import {
|
||||
reactive,
|
||||
computed,
|
||||
ref,
|
||||
nextTick
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad,
|
||||
onReachBottom
|
||||
} from '@dcloudio/uni-app';
|
||||
import sheep from '@/sheep';
|
||||
import { useDurationTime } from '@/sheep/hooks/useGoods';
|
||||
import {
|
||||
useDurationTime
|
||||
} from '@/sheep/hooks/useGoods';
|
||||
import SeckillApi from '@/sheep/api/promotion/seckill';
|
||||
import dayjs from 'dayjs';
|
||||
import { TimeStatusEnum } from '@/sheep/util/const';
|
||||
import {
|
||||
TimeStatusEnum
|
||||
} from '@/sheep/util/const';
|
||||
|
||||
// 计算页面高度
|
||||
const { safeAreaInsets, safeArea } = sheep.$platform.device;
|
||||
const {
|
||||
safeAreaInsets,
|
||||
safeArea
|
||||
} = sheep.$platform.device;
|
||||
const statusBarHeight = sheep.$platform.device.statusBarHeight * 2;
|
||||
const pageHeight =
|
||||
(safeArea.height + safeAreaInsets.bottom) * 2 + statusBarHeight - sheep.$platform.navbar - 350;
|
||||
@ -146,10 +125,18 @@
|
||||
|
||||
// 商品控件显示的字段(不显示库存、销量。改为显示自定义的进度条)
|
||||
const goodsFields = {
|
||||
name: { show: true },
|
||||
introduction: { show: true },
|
||||
price: { show: true },
|
||||
marketPrice: { show: true },
|
||||
name: {
|
||||
show: true
|
||||
},
|
||||
introduction: {
|
||||
show: true
|
||||
},
|
||||
price: {
|
||||
show: true
|
||||
},
|
||||
marketPrice: {
|
||||
show: true
|
||||
},
|
||||
};
|
||||
|
||||
//#region 时间段
|
||||
@ -157,7 +144,9 @@
|
||||
const timeConfigList = ref([]);
|
||||
// 查询时间段
|
||||
const getSeckillConfigList = async () => {
|
||||
const { data } = await SeckillApi.getSeckillConfigList();
|
||||
const {
|
||||
data
|
||||
} = await SeckillApi.getSeckillConfigList();
|
||||
const now = dayjs();
|
||||
const today = now.format('YYYY-MM-DD');
|
||||
// 判断时间段的状态
|
||||
@ -174,7 +163,7 @@
|
||||
}
|
||||
});
|
||||
timeConfigList.value = data;
|
||||
console.log(timeConfigList.value[0]?.id,"timeConfigList.value[0]?.id");
|
||||
console.log(timeConfigList.value[0]?.id, "timeConfigList.value[0]?.id");
|
||||
// 默认选中进行中的活动
|
||||
handleChangeTimeConfig(activeTimeIndex.value, timeConfigList.value[0]?.id);
|
||||
// 滚动到进行中的时间段
|
||||
@ -192,7 +181,7 @@
|
||||
const activeTimeConfig = computed(() => timeConfigList.value[activeTimeIndex.value]); // 当前选中的时间段
|
||||
const handleChangeTimeConfig = (index, config) => {
|
||||
activeTimeIndex.value = index;
|
||||
console.log(config,'config')
|
||||
console.log(config, 'config')
|
||||
// 查询活动列表
|
||||
activityPageParams.pageNo = 1;
|
||||
activityList.value = [];
|
||||
@ -222,8 +211,10 @@
|
||||
const loadStatus = ref(''); // 页面加载状态
|
||||
async function getActivityList(id) {
|
||||
loadStatus.value = 'loading';
|
||||
activityPageParams.configId= id;
|
||||
const { data } = await SeckillApi.getSeckillActivityPage(activityPageParams);
|
||||
activityPageParams.configId = id;
|
||||
const {
|
||||
data
|
||||
} = await SeckillApi.getSeckillActivityPage(activityPageParams);
|
||||
data.list.forEach((activity) => {
|
||||
// 计算抢购进度
|
||||
activity.percent = parseInt(
|
||||
@ -269,6 +260,7 @@
|
||||
margin: 0 auto 0 auto;
|
||||
border-radius: 14rpx;
|
||||
overflow: hidden;
|
||||
|
||||
swiper {
|
||||
height: 330rpx !important;
|
||||
border-radius: 14rpx;
|
||||
@ -280,6 +272,7 @@
|
||||
height: 100%;
|
||||
border-radius: 14rpx;
|
||||
overflow: hidden;
|
||||
|
||||
img {
|
||||
border-radius: 14rpx;
|
||||
}
|
||||
@ -291,10 +284,12 @@
|
||||
width: 75rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
|
||||
// 时间段列表
|
||||
.time-list {
|
||||
width: 596rpx;
|
||||
white-space: nowrap;
|
||||
|
||||
// 时间段
|
||||
.item {
|
||||
display: inline-block;
|
||||
@ -304,17 +299,20 @@
|
||||
box-sizing: border-box;
|
||||
margin-right: 30rpx;
|
||||
width: 130rpx;
|
||||
|
||||
// 开始时间
|
||||
.time {
|
||||
font-size: 36rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
// 选中的时间段
|
||||
&.active {
|
||||
.time {
|
||||
color: var(--ui-BG-Main);
|
||||
}
|
||||
|
||||
// 状态
|
||||
.status {
|
||||
height: 30rpx;
|
||||
@ -335,6 +333,7 @@
|
||||
margin: 0 20rpx 0 20rpx;
|
||||
// background: #fff;
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
|
||||
.content-header {
|
||||
width: 100%;
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
@ -346,6 +345,7 @@
|
||||
height: 64rpx;
|
||||
background: rgba($color: #fff, $alpha: 0.66);
|
||||
border-radius: 32px;
|
||||
|
||||
// 场次倒计时内容
|
||||
.countdown-title {
|
||||
font-size: 28rpx;
|
||||
@ -353,10 +353,12 @@
|
||||
color: #333333;
|
||||
line-height: 28rpx;
|
||||
}
|
||||
|
||||
// 场次倒计时
|
||||
.countdown-time {
|
||||
font-size: 28rpx;
|
||||
color: rgba(#ed3c30, 0.23);
|
||||
|
||||
// 场次倒计时:小时部分
|
||||
.countdown-h {
|
||||
font-size: 24rpx;
|
||||
@ -368,6 +370,7 @@
|
||||
background: rgba(#ed3c30, 0.23);
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
|
||||
// 场次倒计时:分钟、秒
|
||||
.countdown-num {
|
||||
font-size: 24rpx;
|
||||
@ -382,12 +385,15 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 活动列表
|
||||
.scroll-box {
|
||||
height: 900rpx;
|
||||
|
||||
// 活动
|
||||
.goods-box {
|
||||
position: relative;
|
||||
|
||||
// 抢购按钮
|
||||
.cart-btn {
|
||||
position: absolute;
|
||||
@ -407,6 +413,7 @@
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
// 秒杀限量商品数
|
||||
.limit {
|
||||
font-size: 22rpx;
|
||||
|
@ -68,9 +68,9 @@
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="clear: both;"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 签到说明 -->
|
||||
<view class="new-qdsm">
|
||||
@ -572,15 +572,16 @@
|
||||
position: relative;
|
||||
|
||||
.sign-list {
|
||||
width: 86%;
|
||||
margin: 0 auto;
|
||||
padding: 20px;
|
||||
background: white;
|
||||
margin: 0 7px;
|
||||
border-radius: 18px;
|
||||
|
||||
.new-top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 0 10px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.left {
|
||||
@ -612,12 +613,20 @@
|
||||
}
|
||||
|
||||
.new-bottom {
|
||||
width: 100%;
|
||||
display: grid;
|
||||
margin-top: 5px;
|
||||
// grid-template-columns: repeat(auto-fill, 22%);
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
grid-template-rows: 100px;
|
||||
grid-auto-rows: 100px;
|
||||
justify-content: center;
|
||||
grid-gap: 5px;
|
||||
padding: 5px;
|
||||
|
||||
.new-l {
|
||||
padding: 5px;
|
||||
// padding: 5px;
|
||||
float: left;
|
||||
width: 21.9%;
|
||||
width: 100%;
|
||||
|
||||
.new-list {
|
||||
padding: 5px 5px;
|
||||
@ -680,10 +689,10 @@
|
||||
|
||||
.new-7 {
|
||||
position: relative;
|
||||
width: 134px;
|
||||
width: 178%;
|
||||
padding: 5px 10px;
|
||||
padding-bottom: 0;
|
||||
height: 80px;
|
||||
height: 80%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
|
@ -2,7 +2,6 @@
|
||||
<!-- 聊天虚拟列表 -->
|
||||
<z-paging
|
||||
ref="pagingRef"
|
||||
v-model="messageList"
|
||||
use-chat-record-mode
|
||||
use-virtual-list
|
||||
cell-height-mode="dynamic"
|
||||
@ -18,7 +17,7 @@
|
||||
>
|
||||
<template #top>
|
||||
<!-- 撑一下顶部导航 -->
|
||||
<view style="height: 45px"></view>
|
||||
<view :style="{height:hei+'px'}"></view>
|
||||
</template>
|
||||
<!-- style="transform: scaleY(-1)"必须写,否则会导致列表倒置!!! -->
|
||||
<!-- 注意不要直接在chat-item组件标签上设置style,因为在微信小程序中是无效的,请包一层view -->
|
||||
@ -28,7 +27,6 @@
|
||||
<MessageListItem
|
||||
:message="item"
|
||||
:message-index="index"
|
||||
:message-list="messageList"
|
||||
></MessageListItem>
|
||||
</view>
|
||||
</template>
|
||||
@ -48,8 +46,12 @@
|
||||
import { reactive, ref } from 'vue';
|
||||
import KeFuApi from '@/sheep/api/promotion/kefu';
|
||||
import { isEmpty } from '@/sheep/helper/utils';
|
||||
|
||||
const messageList = ref([]); // 消息列表
|
||||
const props = defineProps({
|
||||
hei: {
|
||||
type: [Object, String, Number],
|
||||
default() {},
|
||||
},
|
||||
});
|
||||
const showNewMessageTip = ref(false); // 显示有新消息提示
|
||||
const backToTopStyle = reactive({
|
||||
width: '100px',
|
||||
@ -72,14 +74,17 @@
|
||||
queryParams.pageSize = pageSize;
|
||||
await getMessageList();
|
||||
};
|
||||
const msss = ref([]);
|
||||
// 获得消息分页列表
|
||||
const getMessageList = async () => {
|
||||
const { data } = await KeFuApi.getKefuMessagePage(queryParams);
|
||||
if (isEmpty(data.list)) {
|
||||
return;
|
||||
}
|
||||
msss.value = data.list
|
||||
pagingRef.value.completeByTotal(data.list, data.total);
|
||||
};
|
||||
const emits = defineEmits(['cc']);
|
||||
/** 刷新消息列表 */
|
||||
const refreshMessageList = (message = undefined) => {
|
||||
if (queryParams.pageNo != 1 && message !== undefined) {
|
||||
@ -89,6 +94,8 @@
|
||||
return;
|
||||
}
|
||||
pagingRef.value.reload();
|
||||
console.log("--data1---")
|
||||
emits("cc", msss.value[msss.value.length-1].kefuName)
|
||||
};
|
||||
/** 滚动到最新消息 */
|
||||
const onBackToTopClick = (event) => {
|
||||
|
@ -93,7 +93,7 @@
|
||||
class="chat-avatar ss-m-l-24"
|
||||
:src="
|
||||
sheep.$url.cdn(message.senderAvatar) ||
|
||||
sheep.$url.static('/static/img/shop/chat/default.png')
|
||||
sheep.$url.static('https://zysc.fjptzykj.com:3000/shangcheng/d1e722fb4a257a9ab28c7aca2df004d0159a8ee9cc1d02bccf7ef27b55fcc526.png')
|
||||
"
|
||||
mode="aspectFill"
|
||||
>
|
||||
@ -141,7 +141,7 @@
|
||||
}
|
||||
return false;
|
||||
});
|
||||
|
||||
import { kefuPath } from '@/sheep/config';
|
||||
// 处理表情
|
||||
function replaceEmoji(data) {
|
||||
let newData = data;
|
||||
@ -154,7 +154,7 @@
|
||||
newData = newData.replace(
|
||||
item,
|
||||
`<img class="chat-img" style="width: 24px;height: 24px;margin: 0 3px;" src="${sheep.$url.cdn(
|
||||
'/static/img/chat/emoji/' + emojiFile,
|
||||
kefuPath + '/shangcheng/asserts/' + emojiFile,
|
||||
)}"/>`,
|
||||
);
|
||||
});
|
||||
|
@ -20,7 +20,7 @@
|
||||
v-for="item in emoji"
|
||||
:key="item"
|
||||
class="emoji-img"
|
||||
:src="sheep.$url.cdn(`/static/img/chat/emoji/${item.file}`)"
|
||||
:src="`${kefuPath}/shangcheng/asserts/${item.file}`"
|
||||
@tap="onEmoji(item)"
|
||||
>
|
||||
</image>
|
||||
@ -37,7 +37,7 @@
|
||||
>
|
||||
<image
|
||||
class="icon"
|
||||
:src="sheep.$url.static('/static/img/shop/chat/image.png')"
|
||||
:src="sheep.$url.static('https://zysc.fjptzykj.com:3000/shangcheng/5f4b6964b144be9a309aa45560c2b82515f2b5557e4f44fcd1b9795b3cc28757.png')"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
</s-uploader>
|
||||
@ -46,7 +46,7 @@
|
||||
<view class="goods" @tap="onShowSelect('goods')">
|
||||
<image
|
||||
class="icon"
|
||||
:src="sheep.$url.static('/static/img/shop/chat/goods.png')"
|
||||
:src="sheep.$url.static('https://zysc.fjptzykj.com:3000/shangcheng/b18fdf64dbe03b39290a0a96d5b90ae1cc6f9d80da13c1c47eaacc47c2710a7c.png')"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
<view>商品</view>
|
||||
@ -54,7 +54,7 @@
|
||||
<view class="order" @tap="onShowSelect('order')">
|
||||
<image
|
||||
class="icon"
|
||||
:src="sheep.$url.static('/static/img/shop/chat/order.png')"
|
||||
:src="sheep.$url.static('https://zysc.fjptzykj.com:3000/shangcheng/f6c484a459e843baeb729603ae221b6d3ab384b56c2d891ae53b0ee4205477a9.png')"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
<view>订单</view>
|
||||
@ -71,7 +71,7 @@
|
||||
*/
|
||||
import { emojiPage } from '@/pages/chat/util/emoji';
|
||||
import sheep from '@/sheep';
|
||||
|
||||
import { kefuPath } from '@/sheep/config';
|
||||
const props = defineProps({
|
||||
// 工具模式
|
||||
toolsMode: {
|
||||
|
@ -1,13 +1,15 @@
|
||||
<template>
|
||||
<!-- :title="!isReconnecting ? '连接客服成功' : '会话重连中'" -->
|
||||
<!-- :title="kefuName" -->
|
||||
<s-layout
|
||||
class="chat-wrap"
|
||||
:title="!isReconnecting ? '连接客服成功' : '会话重连中'"
|
||||
title="众悦商城客服"
|
||||
navbar="inner"
|
||||
>
|
||||
<!-- 覆盖头部导航栏背景颜色 -->
|
||||
<div class="page-bg" :style="{ height: sys_navBar + 'px' }"></div>
|
||||
<!-- 聊天区域 -->
|
||||
<MessageList ref="messageListRef">
|
||||
<MessageList ref="messageListRef" :hei="sys_navBar" @cc="ss">
|
||||
<template #bottom>
|
||||
<message-input
|
||||
v-model="chat.msg"
|
||||
@ -55,9 +57,12 @@
|
||||
import FileApi from '@/sheep/api/infra/file';
|
||||
import KeFuApi from '@/sheep/api/promotion/kefu';
|
||||
import { useWebSocket } from '@/sheep/hooks/useWebSocket';
|
||||
|
||||
const kefuName = ref('众悦商城客服');
|
||||
const sys_navBar = sheep.$platform.navbar;
|
||||
|
||||
function ss(val){
|
||||
console.log('ss进来了',val)
|
||||
kefuName.value = val;
|
||||
}
|
||||
const chat = reactive({
|
||||
msg: '',
|
||||
scrollInto: '',
|
||||
@ -179,7 +184,9 @@
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
.chat-wrap {
|
||||
|
||||
.page-bg {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
|
File diff suppressed because one or more lines are too long
191
pages/commission/components/account-info-tow.vue
Normal file
191
pages/commission/components/account-info-tow.vue
Normal file
@ -0,0 +1,191 @@
|
||||
<!-- 分销账户:展示基本统计信息 -->
|
||||
<template>
|
||||
<view class="new-main">
|
||||
<view class="account-card">
|
||||
<view class="account-card-box">
|
||||
<view class="ss-flex ss-row-between card-box-header">
|
||||
<view class="ss-flex">
|
||||
<!-- <view class="header-title ss-m-r-16">账户信息</view> -->
|
||||
<button class="ss-reset-button look-btn ss-flex" @tap="state.showMoney = !state.showMoney">
|
||||
<uni-icons :type="state.showMoney ? 'eye-filled' : 'eye-slash-filled'" color="#A57A55"
|
||||
size="20" />
|
||||
</button>
|
||||
</view>
|
||||
<view class="ss-flex" @tap="sheep.$router.go('/pages/commission/wallet')">
|
||||
<view class="header-title ss-m-r-4">提现记录</view>
|
||||
<text class="cicon-play-arrow" />
|
||||
</view>
|
||||
</view>
|
||||
<!-- 提现金额 -->
|
||||
<view class="ss-flex new-cont">
|
||||
<view class="ss-flex-1 ss-flex-col ">
|
||||
<view class="item-title">可提现(元)</view>
|
||||
<view class="item-detail">
|
||||
{{ state.showMoney ? fen2yuan(state.brokerageInfo.brokeragePrice) : '***' }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="ss-flex-1 ss-flex-col ss-col-center new-btn"
|
||||
@tap="sheep.$router.go('/pages/commission/withdraw')"
|
||||
>
|
||||
立即提现
|
||||
</view>
|
||||
</view>
|
||||
<!-- 收益 -->
|
||||
<view class="card-content ss-flex">
|
||||
<view class="ss-flex-1 ss-flex-col ss-col-center">
|
||||
<view class="item-title">当前收益(元)</view>
|
||||
<view class="item-detail">
|
||||
{{ state.showMoney ? fen2yuan(state.summary.brokeragePrice || 0) : '***' }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="ss-flex-1 ss-flex-col ss-col-center">
|
||||
<view class="item-title">昨天收益(元)</view>
|
||||
<view class="item-detail">
|
||||
{{ state.showMoney ? fen2yuan(state.summary.yesterdayPrice || 0) : '***' }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="ss-flex-1 ss-flex-col ss-col-center">
|
||||
<view class="item-title">累计已提(元)</view>
|
||||
<view class="item-detail">
|
||||
{{ state.showMoney ? fen2yuan(state.summary.withdrawPrice || 0) : '***' }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import sheep from '@/sheep';
|
||||
import {
|
||||
computed,
|
||||
reactive,
|
||||
onMounted,
|
||||
onBeforeMount
|
||||
} from 'vue';
|
||||
import BrokerageApi from '@/sheep/api/trade/brokerage';
|
||||
import {
|
||||
fen2yuan
|
||||
} from '@/sheep/hooks/useGoods';
|
||||
|
||||
const userInfo = computed(() => sheep.$store('user').userInfo);
|
||||
|
||||
const state = reactive({
|
||||
showMoney: false,
|
||||
summary: {},
|
||||
brokerageInfo: {}, // 分销信息
|
||||
arr:{}
|
||||
});
|
||||
|
||||
// 获得分销信息
|
||||
async function getBrokerageUser() {
|
||||
const { data, code } = await BrokerageApi.getBrokerageUser();
|
||||
if (code === 0) {
|
||||
state.brokerageInfo = data;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
onMounted(async () => {
|
||||
let {
|
||||
code,
|
||||
data
|
||||
} = await BrokerageApi.getBrokerageUserSummary();
|
||||
if (code === 0) {
|
||||
state.summary = data || {};
|
||||
}
|
||||
});
|
||||
onBeforeMount(() => {
|
||||
getBrokerageUser();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.new-main{
|
||||
width: 100%;
|
||||
}
|
||||
.account-card {
|
||||
width: 694rpx;
|
||||
margin: 0 auto;
|
||||
padding: 2rpx;
|
||||
// background: linear-gradient(180deg, #ffffff 0.88%, #fff9ec 100%);
|
||||
border-radius: 12rpx 12rpx 0 0;
|
||||
z-index: 3;
|
||||
position: relative;
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/423af1ff70d4e80ca7bd4ede17b9fe63800aaffd2e4e8b5b7584ab5bf5884996.png') no-repeat;
|
||||
background-size: cover;
|
||||
|
||||
|
||||
|
||||
.account-card-box {
|
||||
|
||||
// background: #ffefd6;
|
||||
.new-cont {
|
||||
padding: 0 45rpx;
|
||||
|
||||
.new-btn {
|
||||
background: rgba(178, 102, 67);
|
||||
border-radius: 22px;
|
||||
padding: 8px 0;
|
||||
font-size: 16px;
|
||||
color: white;
|
||||
font-weight:700;
|
||||
}
|
||||
|
||||
.item-title {
|
||||
color: rgba(139, 105, 87, 1);
|
||||
}
|
||||
|
||||
.item-detail {
|
||||
color: rgba(81, 41, 24, 1);
|
||||
font-size: 31px;
|
||||
}
|
||||
}
|
||||
|
||||
.card-box-header {
|
||||
padding: 0 45rpx;
|
||||
height: 72rpx;
|
||||
// box-shadow: 0px 2px 6px #f2debe;
|
||||
|
||||
.header-title {
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
color: #a17545;
|
||||
line-height: 30rpx;
|
||||
}
|
||||
|
||||
.cicon-play-arrow {
|
||||
color: #a17545;
|
||||
font-size: 24rpx;
|
||||
line-height: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.card-content {
|
||||
height: 190rpx;
|
||||
// background: #fdfae9;
|
||||
|
||||
.item-title {
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
color: rgba(139, 105, 87, 1);
|
||||
line-height: 30rpx;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.item-detail {
|
||||
font-size: 36rpx;
|
||||
font-family: OPPOSANS;
|
||||
font-weight: bold;
|
||||
color: #692e04;
|
||||
line-height: 30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
@ -2,10 +2,45 @@
|
||||
<template>
|
||||
<view class="new-main">
|
||||
<view class="account-card">
|
||||
<view class="new-ljsy">
|
||||
<view class="l dd">
|
||||
<!-- <view class="l-img">
|
||||
<image src="https://zysc.fjptzykj.com:3000/shangcheng/7624fd0e447748a5f8f4532d89a416cf7f962644e588c99d7e8c8baeab7ee91f.png" class="img"></image>
|
||||
</view> -->
|
||||
<view class="l-text">
|
||||
|
||||
<view class="l-text-b">
|
||||
累计收益(元)
|
||||
</view>
|
||||
<view class="l-text-t">
|
||||
{{
|
||||
fen2yuan(state.summary2.withdrawPrice || 0)
|
||||
}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="l r" @click="sheep.$router.go('/pages/commission/team')">
|
||||
<!-- <view class="l-img">
|
||||
<image src="https://zysc.fjptzykj.com:3000/shangcheng/6575e409f7656efb2821b2159ca0a26916f83f037fc533f9f19aa141c412ee2c.png" class="img"></image>
|
||||
</view> -->
|
||||
<view class="l-text">
|
||||
|
||||
<view class="l-text-b">
|
||||
我的团队
|
||||
</view>
|
||||
<view class="l-text-t">
|
||||
{{
|
||||
state.arr2.firstBrokerageUserCount + state.arr2.secondBrokerageUserCount ||
|
||||
0
|
||||
}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="account-card-box">
|
||||
<view class="ss-flex ss-row-between card-box-header">
|
||||
<!--<view class="ss-flex ss-row-between card-box-header">
|
||||
<view class="ss-flex">
|
||||
<!-- <view class="header-title ss-m-r-16">账户信息</view> -->
|
||||
<button class="ss-reset-button look-btn ss-flex" @tap="state.showMoney = !state.showMoney">
|
||||
<uni-icons :type="state.showMoney ? 'eye-filled' : 'eye-slash-filled'" color="#A57A55"
|
||||
size="20" />
|
||||
@ -15,19 +50,23 @@
|
||||
<view class="header-title ss-m-r-4">提现记录</view>
|
||||
<text class="cicon-play-arrow" />
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<!-- 提现金额 -->
|
||||
<view class="ss-flex new-cont">
|
||||
<view class="new-cont">
|
||||
<view class="ss-flex-1 ss-flex-col ">
|
||||
<view class="item-title">可提现(元)</view>
|
||||
<view class="item-detail">
|
||||
{{ state.showMoney ? fen2yuan(state.brokerageInfo.brokeragePrice) : '***' }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="ss-flex-1 ss-flex-col ss-col-center new-btn"
|
||||
<!-- <view class="ss-flex-1 ss-flex-col ss-col-center new-btn"
|
||||
@tap="sheep.$router.go('/pages/commission/withdraw')"
|
||||
>
|
||||
立即提现
|
||||
</view> -->
|
||||
<view class="sss" @tap="sheep.$router.go('/pages/commission/wallet')">
|
||||
<view class="header-title ss-m-r-4">提现记录</view>
|
||||
<image class="menu-icon-you" src="@/static/images/dayu.png" mode="aspectFill"></image>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 收益 -->
|
||||
@ -51,15 +90,24 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="ss-flex-1 ss-flex-col ss-col-center new-btn"
|
||||
@tap="sheep.$router.go('/pages/commission/withdraw')">
|
||||
立即提现
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
<!-- 菜单栏 -->
|
||||
<commission-menu />
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import commissionMenu from './commission-menu.vue';
|
||||
import sheep from '@/sheep';
|
||||
import {
|
||||
computed,
|
||||
@ -75,15 +123,39 @@
|
||||
const userInfo = computed(() => sheep.$store('user').userInfo);
|
||||
|
||||
const state = reactive({
|
||||
showMoney: false,
|
||||
showMoney: true,
|
||||
summary: {},
|
||||
brokerageInfo: {}, // 分销信息
|
||||
arr:{}
|
||||
arr: {},
|
||||
summary2: {},
|
||||
arr2: {}
|
||||
});
|
||||
|
||||
async function getAgentInfo() {
|
||||
const {
|
||||
code,
|
||||
data
|
||||
} = await BrokerageApi.getBrokerageUserSummary();
|
||||
if (code !== 0) {
|
||||
return;
|
||||
}
|
||||
state.summary2 = data;
|
||||
}
|
||||
onBeforeMount(async () => {
|
||||
getAgentInfo();
|
||||
// 概要数据
|
||||
let {
|
||||
data
|
||||
} = await BrokerageApi.getBrokerageUserSummary();
|
||||
state.arr2 = data;
|
||||
});
|
||||
|
||||
// 获得分销信息
|
||||
async function getBrokerageUser() {
|
||||
const { data, code } = await BrokerageApi.getBrokerageUser();
|
||||
const {
|
||||
data,
|
||||
code
|
||||
} = await BrokerageApi.getBrokerageUser();
|
||||
if (code === 0) {
|
||||
state.brokerageInfo = data;
|
||||
}
|
||||
@ -106,44 +178,133 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.new-main{
|
||||
width: 100%;
|
||||
.menu-icon-you {
|
||||
width: 38rpx;
|
||||
height: 38rpx;
|
||||
}
|
||||
.account-card {
|
||||
width: 694rpx;
|
||||
|
||||
.new-btn {
|
||||
width: 85%;
|
||||
margin: 0 auto;
|
||||
background: rgba(235, 70, 39);
|
||||
padding: 12px 0;
|
||||
border-radius: 20px;
|
||||
color: white;
|
||||
font-weight:700;
|
||||
}
|
||||
|
||||
.new-ljsy {
|
||||
// width: 100%;
|
||||
// background:white;
|
||||
padding: 8px 13px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
.l {
|
||||
// background: rgba(254,244,237);
|
||||
// background:url('https://zysc.fjptzykj.com/admin-api/infra/file/25/get/8e878e15d22f68e0187a953aeba31b80423b7e3fafa8e4aa9f237477ac0fd519.png') rgba(254,244,237,1);
|
||||
width: 43%;
|
||||
height: 85px;
|
||||
border-radius: 12px;
|
||||
background-size: cover;
|
||||
// position:relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: left;
|
||||
|
||||
&.dd {
|
||||
margin-right: 5%;
|
||||
}
|
||||
|
||||
.l-text {
|
||||
|
||||
// position:absolute;
|
||||
// top:50%;
|
||||
// transform: translateY(-50%);
|
||||
// left:70px;
|
||||
.l-text-t {
|
||||
font-size: 27px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.l-text-b {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.l-img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
margin-right: 10px;
|
||||
|
||||
.img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.r {
|
||||
|
||||
// background:url('https://zysc.fjptzykj.com/admin-api/infra/file/25/get/b18f31e528ad0ab1026441faba07cb9e64723ffa511d103324fcd65fcaaf1557.png') rgba(254,244,237,1);
|
||||
// background-size: cover;
|
||||
.l-text {
|
||||
// left:80px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.new-main {
|
||||
width: 100%;
|
||||
margin: 15px auto !important;
|
||||
}
|
||||
|
||||
.account-card {
|
||||
// width: 694rpx;
|
||||
margin: 0 15px;
|
||||
padding: 2rpx;
|
||||
// background: linear-gradient(180deg, #ffffff 0.88%, #fff9ec 100%);
|
||||
border-radius: 12rpx 12rpx 0 0;
|
||||
// border-radius: 12rpx 12rpx 0 0;
|
||||
z-index: 3;
|
||||
position: relative;
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/423af1ff70d4e80ca7bd4ede17b9fe63800aaffd2e4e8b5b7584ab5bf5884996.png') no-repeat;
|
||||
background-size: cover;
|
||||
|
||||
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/cbbe23772e68ed5fc5c18d193f9f674d6e87ccddd422e0df6af6cab5dfea6c27.png') no-repeat;
|
||||
background-size: 100%;
|
||||
padding-bottom: 25px;
|
||||
border-radius: 18px;
|
||||
|
||||
.account-card-box {
|
||||
|
||||
// background: #ffefd6;
|
||||
.new-cont {
|
||||
padding: 0 45rpx;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 13px;
|
||||
.sss{
|
||||
display:flex;
|
||||
height:20px;
|
||||
align-items:center;
|
||||
.header-title{
|
||||
color:rgba(194,194,194);
|
||||
}
|
||||
}
|
||||
.new-btn {
|
||||
background: rgba(178, 102, 67);
|
||||
border-radius: 22px;
|
||||
padding: 8px 0;
|
||||
font-size: 16px;
|
||||
color: white;
|
||||
font-weight:700;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.item-title {
|
||||
color: rgba(139, 105, 87, 1);
|
||||
color: rgba(142, 144, 145, 1);
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.item-detail {
|
||||
color: rgba(81, 41, 24, 1);
|
||||
font-size: 31px;
|
||||
color: rgba(231, 91, 79, 1);
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -173,16 +334,16 @@
|
||||
.item-title {
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
color: rgba(139, 105, 87, 1);
|
||||
color: rgba(142, 144, 145, 1);
|
||||
line-height: 30rpx;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.item-detail {
|
||||
font-size: 36rpx;
|
||||
font-size: 20px;
|
||||
font-family: OPPOSANS;
|
||||
font-weight: bold;
|
||||
color: #692e04;
|
||||
color: rgba(80, 80, 80, 1);
|
||||
line-height: 30rpx;
|
||||
}
|
||||
}
|
||||
|
227
pages/commission/components/commission-info-tow.vue
Normal file
227
pages/commission/components/commission-info-tow.vue
Normal file
@ -0,0 +1,227 @@
|
||||
<!-- 分销商信息 -->
|
||||
<template>
|
||||
<!-- 用户资料 -->
|
||||
<view class="user-card ss-flex ss-col-bottom">
|
||||
<view class="card-top ss-flex ss-row-between">
|
||||
<view class="ss-flex">
|
||||
<view class="head-img-box">
|
||||
<image class="head-img" :src="sheep.$url.cdn(userInfo.avatar)" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="ss-flex-col">
|
||||
<view class="user-name" style="color:white;">{{ userInfo.nickname }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 账户信息 -->
|
||||
<account-info style="margin: 0 auto;" />
|
||||
</view>
|
||||
<view class="new-ljsy">
|
||||
<view class="l dd">
|
||||
<view class="l-img">
|
||||
<image src="https://zysc.fjptzykj.com:3000/shangcheng/7624fd0e447748a5f8f4532d89a416cf7f962644e588c99d7e8c8baeab7ee91f.png" class="img"></image>
|
||||
</view>
|
||||
<view class="l-text">
|
||||
<view class="l-text-t">
|
||||
{{
|
||||
fen2yuan(state.summary.withdrawPrice || 0)
|
||||
}}
|
||||
</view>
|
||||
<view class="l-text-b">
|
||||
累计收益(元)
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="l r" @click="sheep.$router.go('/pages/commission/team')">
|
||||
<view class="l-img">
|
||||
<image src="https://zysc.fjptzykj.com:3000/shangcheng/6575e409f7656efb2821b2159ca0a26916f83f037fc533f9f19aa141c412ee2c.png" class="img"></image>
|
||||
</view>
|
||||
<view class="l-text">
|
||||
<view class="l-text-t">
|
||||
{{
|
||||
state.arr.firstBrokerageUserCount + state.arr.secondBrokerageUserCount ||
|
||||
0
|
||||
}}
|
||||
</view>
|
||||
<view class="l-text-b">
|
||||
我的团队
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import accountInfo from './account-info.vue';
|
||||
import sheep from '@/sheep';
|
||||
import BrokerageApi from '@/sheep/api/trade/brokerage';
|
||||
import {
|
||||
computed,
|
||||
reactive,
|
||||
onBeforeMount
|
||||
} from 'vue';
|
||||
import {
|
||||
fen2yuan
|
||||
} from '@/sheep/hooks/useGoods';
|
||||
const userInfo = computed(() => sheep.$store('user').userInfo);
|
||||
const headerBg = sheep.$url.css('/static/img/shop/commission/background.png');
|
||||
|
||||
|
||||
const state = reactive({
|
||||
showMoney: false,
|
||||
summary:{},
|
||||
arr:{}
|
||||
});
|
||||
|
||||
async function getAgentInfo() {
|
||||
const { code, data } = await BrokerageApi.getBrokerageUserSummary();
|
||||
if (code !== 0) {
|
||||
return;
|
||||
}
|
||||
state.summary = data;
|
||||
}
|
||||
onBeforeMount(async() => {
|
||||
getAgentInfo();
|
||||
// 概要数据
|
||||
let { data } = await BrokerageApi.getBrokerageUserSummary();
|
||||
state.arr = data;
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.new-ljsy {
|
||||
width:100%;
|
||||
background:white;
|
||||
padding: 20px 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.l {
|
||||
background: rgba(254,244,237);
|
||||
// background:url('https://zysc.fjptzykj.com/admin-api/infra/file/25/get/8e878e15d22f68e0187a953aeba31b80423b7e3fafa8e4aa9f237477ac0fd519.png') rgba(254,244,237,1);
|
||||
width:43%;
|
||||
height:85px;
|
||||
border-radius: 12px;
|
||||
background-size: cover;
|
||||
// position:relative;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content: center;
|
||||
&.dd{
|
||||
margin-right: 5%;
|
||||
}
|
||||
.l-text{
|
||||
// position:absolute;
|
||||
// top:50%;
|
||||
// transform: translateY(-50%);
|
||||
// left:70px;
|
||||
.l-text-t{
|
||||
font-size:20px;
|
||||
font-weight: 700;
|
||||
}
|
||||
.l-text-b{
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
.l-img{
|
||||
width:40px;
|
||||
height:40px;
|
||||
margin-right:10px;
|
||||
.img{
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.r {
|
||||
// background:url('https://zysc.fjptzykj.com/admin-api/infra/file/25/get/b18f31e528ad0ab1026441faba07cb9e64723ffa511d103324fcd65fcaaf1557.png') rgba(254,244,237,1);
|
||||
// background-size: cover;
|
||||
.l-text{
|
||||
// left:80px;
|
||||
}
|
||||
}
|
||||
}
|
||||
// 用户资料卡片
|
||||
.user-card {
|
||||
width: 100%;
|
||||
height: 580rpx;
|
||||
// margin: -88rpx 20rpx 0 20rpx;
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/c4f941683d41701ac7f182824791ff43b5f7e70fb527b4d4d153416d6065c44f.png') no-repeat;
|
||||
// background: url('https://zysc.fjptzykj.com:3000/shangcheng/4bcaa2803c9cc953353d22db804b952b333e97d2a0d57266a00baf0c07379efa.png') no-repeat;
|
||||
// background:#ff3000;
|
||||
background-size: 100% 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.head-img-box {
|
||||
margin-right: 20rpx;
|
||||
width: 62rpx;
|
||||
height: 62rpx;
|
||||
border-radius: 50%;
|
||||
position: relative;
|
||||
background: #fce0ad;
|
||||
|
||||
.head-img {
|
||||
width: 62rpx;
|
||||
height: 62rpx;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
}
|
||||
|
||||
.card-top {
|
||||
box-sizing: border-box;
|
||||
margin-top: 46px;
|
||||
margin-left: 16px;
|
||||
|
||||
.user-name {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #692e04;
|
||||
line-height: 30rpx;
|
||||
}
|
||||
|
||||
.log-btn {
|
||||
width: 84rpx;
|
||||
height: 42rpx;
|
||||
border: 2rpx solid rgba(#ffffff, 0.33);
|
||||
border-radius: 21rpx;
|
||||
font-size: 22rpx;
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.look-btn {
|
||||
color: #fff;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.user-info-box {
|
||||
.tag-box {
|
||||
background: #ff6000;
|
||||
border-radius: 18rpx;
|
||||
line-height: 36rpx;
|
||||
|
||||
.tag-img {
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
border-radius: 50%;
|
||||
margin-left: -2rpx;
|
||||
}
|
||||
|
||||
.tag-title {
|
||||
font-size: 24rpx;
|
||||
padding: 0 10rpx;
|
||||
font-weight: 500;
|
||||
line-height: 36rpx;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
@ -13,41 +13,10 @@
|
||||
</view>
|
||||
</view>
|
||||
<!-- 账户信息 -->
|
||||
<account-info style="margin: 0 auto;" />
|
||||
</view>
|
||||
<view class="new-ljsy">
|
||||
<view class="l dd">
|
||||
<view class="l-img">
|
||||
<image src="https://zysc.fjptzykj.com:3000/shangcheng/7624fd0e447748a5f8f4532d89a416cf7f962644e588c99d7e8c8baeab7ee91f.png" class="img"></image>
|
||||
</view>
|
||||
<view class="l-text">
|
||||
<view class="l-text-t">
|
||||
{{
|
||||
fen2yuan(state.summary.withdrawPrice || 0)
|
||||
}}
|
||||
</view>
|
||||
<view class="l-text-b">
|
||||
累计收益(元)
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="l r" @click="sheep.$router.go('/pages/commission/team')">
|
||||
<view class="l-img">
|
||||
<image src="https://zysc.fjptzykj.com:3000/shangcheng/6575e409f7656efb2821b2159ca0a26916f83f037fc533f9f19aa141c412ee2c.png" class="img"></image>
|
||||
</view>
|
||||
<view class="l-text">
|
||||
<view class="l-text-t">
|
||||
{{
|
||||
state.arr.firstBrokerageUserCount + state.arr.secondBrokerageUserCount ||
|
||||
0
|
||||
}}
|
||||
</view>
|
||||
<view class="l-text-b">
|
||||
我的团队
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<account-info />
|
||||
</view>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
@ -68,8 +37,6 @@
|
||||
|
||||
const state = reactive({
|
||||
showMoney: false,
|
||||
summary:{},
|
||||
arr:{}
|
||||
});
|
||||
|
||||
async function getAgentInfo() {
|
||||
@ -88,64 +55,15 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.new-ljsy {
|
||||
width:100%;
|
||||
background:white;
|
||||
padding: 20px 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.l {
|
||||
background: rgba(254,244,237);
|
||||
// background:url('https://zysc.fjptzykj.com/admin-api/infra/file/25/get/8e878e15d22f68e0187a953aeba31b80423b7e3fafa8e4aa9f237477ac0fd519.png') rgba(254,244,237,1);
|
||||
width:43%;
|
||||
height:85px;
|
||||
border-radius: 12px;
|
||||
background-size: cover;
|
||||
// position:relative;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content: center;
|
||||
&.dd{
|
||||
margin-right: 5%;
|
||||
}
|
||||
.l-text{
|
||||
// position:absolute;
|
||||
// top:50%;
|
||||
// transform: translateY(-50%);
|
||||
// left:70px;
|
||||
.l-text-t{
|
||||
font-size:20px;
|
||||
font-weight: 700;
|
||||
}
|
||||
.l-text-b{
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
.l-img{
|
||||
width:40px;
|
||||
height:40px;
|
||||
margin-right:10px;
|
||||
.img{
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.r {
|
||||
// background:url('https://zysc.fjptzykj.com/admin-api/infra/file/25/get/b18f31e528ad0ab1026441faba07cb9e64723ffa511d103324fcd65fcaaf1557.png') rgba(254,244,237,1);
|
||||
// background-size: cover;
|
||||
.l-text{
|
||||
// left:80px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 用户资料卡片
|
||||
.user-card {
|
||||
width: 100%;
|
||||
height: 580rpx;
|
||||
// margin: -88rpx 20rpx 0 20rpx;
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/c4f941683d41701ac7f182824791ff43b5f7e70fb527b4d4d153416d6065c44f.png') no-repeat;
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/ae736076156e99710f417fe5619cd0be47a2fad082a192dbbd6dcbc2bbc65eea.png') no-repeat;
|
||||
// background: url('https://zysc.fjptzykj.com:3000/shangcheng/4bcaa2803c9cc953353d22db804b952b333e97d2a0d57266a00baf0c07379efa.png') no-repeat;
|
||||
// background:#ff3000;
|
||||
background-size: 100% 100%;
|
||||
|
@ -63,7 +63,7 @@
|
||||
list: [],
|
||||
total: 0,
|
||||
pageNo: 1,
|
||||
pageSize: 1,
|
||||
pageSize: 8,
|
||||
},
|
||||
});
|
||||
|
||||
|
@ -8,9 +8,9 @@
|
||||
<image class="menu-icon " :src="sheep.$url.static(item.img)" mode="aspectFill"></image>
|
||||
<view>{{ item.title }}</view>
|
||||
</view>
|
||||
<view class="r">
|
||||
<!-- <view class="r">
|
||||
<image class="menu-icon-you" src="@/static/images/dayu.png" mode="aspectFill"></image>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -41,32 +41,32 @@
|
||||
|
||||
const state = reactive({
|
||||
menuListnew: [{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/82255ab9cb8fa91b261a1976c81a7c761c34a8aa3d3fc12864b3b83158d22267.png',
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/38fcbd2619cac8f4134efdf6ddf98a098d7ec4920be09c399d3e05b26699cfc3.png',
|
||||
title: '推广名片',
|
||||
path: 'action:showShareModal',
|
||||
},
|
||||
{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/3aca872c5c25923b883b98364ca7525bcb7d176cf89769bab429fed090c75adb.png',
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/d6fd382e25839128b4231616b5414b09964f998faaed300fd71b093d0545b4c9.png',
|
||||
title: '佣金明细',
|
||||
path: '/pages/commission/wallet',
|
||||
},
|
||||
{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/512aaaf15aeedc1fd5ad6dc14161d83a4c4ecee33ae2428986c8ecbf0c420fa7.png',
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/fb1773e483bdf5889657ad0c6113327051a337514d5de0bce3d14a744d1f2b0c.png',
|
||||
title: '分销订单',
|
||||
path: '/pages/commission/order',
|
||||
},
|
||||
{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/6b61f1357f2f5a4a211c0bb4bac3d85c6e85958e0bfd04d0045d6c83e98085b7.png',
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/7553f1ef8dd48b2fce3fc3a56eb40fe04a6099fe7744f26b5e2481050ab940e7.png',
|
||||
title: '推广商品',
|
||||
path: '/pages/commission/goods',
|
||||
},
|
||||
{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/e488e0f84bd4da1edfe75ccfbcc16acf8c60073409f03406bb350573b43769a8.png',
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/59061d8cd61d6488f5ec24eb4e04b09308862c54cbde8e5e38d58cb38a0098d9.png',
|
||||
title: '推广排行',
|
||||
path: '/pages/commission/promoter',
|
||||
},
|
||||
{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/28d6bf4595172ed0a1cdc693483eef018f7f1242be35106bb12ce3ca21940753.png',
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/4207ccd490ee40e80c21a6bdf6df62cc89b20cf36cf26fed1559704b7e61b131.png',
|
||||
title: '佣金排行',
|
||||
path: '/pages/commission/commission-ranking',
|
||||
},
|
||||
@ -120,27 +120,30 @@
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.new-menu {
|
||||
width: 100%;
|
||||
margin:0 15px;
|
||||
background: white;
|
||||
|
||||
margin-top:10px;
|
||||
border-radius: 18px;
|
||||
padding:25px 0;
|
||||
padding-bottom:0;
|
||||
.new-menu-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
padding: 0 20px;
|
||||
// display: flex;
|
||||
// flex-wrap: wrap;
|
||||
// align-items: center;
|
||||
// padding: 0 20px;
|
||||
|
||||
.new-menu-item {
|
||||
float: left;
|
||||
width: 50%;
|
||||
// margin-bottom:19px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom:19px;
|
||||
justify-content: center;
|
||||
.l {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
width: 50%;
|
||||
margin-bottom: 25px;
|
||||
// width: 50%;
|
||||
.menu-icon{
|
||||
margin-right: 10px;
|
||||
}
|
||||
@ -208,8 +211,8 @@
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
width: 45rpx;
|
||||
height: 45rpx;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
background: #ffffff;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
226
pages/commission/components/commission-menu2.vue
Normal file
226
pages/commission/components/commission-menu2.vue
Normal file
@ -0,0 +1,226 @@
|
||||
<!-- 分销:商菜单栏 -->
|
||||
<template>
|
||||
<view class="ss-flex-col new-menu">
|
||||
<view class="new-menu-list">
|
||||
<view class="new-menu-item" v-for="(item, index) in state.menuListnew" :key="index"
|
||||
@tap="sheep.$router.go(item.path)">
|
||||
<view class="l">
|
||||
<image class="menu-icon " :src="sheep.$url.static(item.img)" mode="aspectFill"></image>
|
||||
<view>{{ item.title }}</view>
|
||||
</view>
|
||||
<view class="r">
|
||||
<image class="menu-icon-you" src="@/static/images/dayu.png" mode="aspectFill"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="menu-box ss-flex-col">
|
||||
<view class="header-box">
|
||||
<image class="header-bg"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/eb9244a1f0662a699869d47287a477bd16147030ff25c9573395036192b86d91.png" />
|
||||
<view class="ss-flex header-title">
|
||||
<view class="title">功能专区</view>
|
||||
<text class="cicon-forward"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="menu-list ss-flex ss-flex-wrap">
|
||||
<view v-for="(item, index) in state.menuList" :key="index" class="item-box ss-flex-col ss-col-center"
|
||||
@tap="sheep.$router.go(item.path)">
|
||||
<image class="menu-icon ss-m-b-10" :src="sheep.$url.static(item.img)" mode="aspectFill"></image>
|
||||
<view>{{ item.title }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import sheep from '@/sheep';
|
||||
import {
|
||||
reactive
|
||||
} from 'vue';
|
||||
|
||||
const state = reactive({
|
||||
menuListnew: [{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/82255ab9cb8fa91b261a1976c81a7c761c34a8aa3d3fc12864b3b83158d22267.png',
|
||||
title: '推广名片',
|
||||
path: 'action:showShareModal',
|
||||
},
|
||||
{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/3aca872c5c25923b883b98364ca7525bcb7d176cf89769bab429fed090c75adb.png',
|
||||
title: '佣金明细',
|
||||
path: '/pages/commission/wallet',
|
||||
},
|
||||
{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/512aaaf15aeedc1fd5ad6dc14161d83a4c4ecee33ae2428986c8ecbf0c420fa7.png',
|
||||
title: '分销订单',
|
||||
path: '/pages/commission/order',
|
||||
},
|
||||
{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/6b61f1357f2f5a4a211c0bb4bac3d85c6e85958e0bfd04d0045d6c83e98085b7.png',
|
||||
title: '推广商品',
|
||||
path: '/pages/commission/goods',
|
||||
},
|
||||
{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/e488e0f84bd4da1edfe75ccfbcc16acf8c60073409f03406bb350573b43769a8.png',
|
||||
title: '推广排行',
|
||||
path: '/pages/commission/promoter',
|
||||
},
|
||||
{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/28d6bf4595172ed0a1cdc693483eef018f7f1242be35106bb12ce3ca21940753.png',
|
||||
title: '佣金排行',
|
||||
path: '/pages/commission/commission-ranking',
|
||||
},
|
||||
],
|
||||
menuList: [{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/ec41e4f5b45c087232aab8d088019a1e9d781b9bde0f54ddbb18e90230b83255.png',
|
||||
title: '我的团队',
|
||||
path: '/pages/commission/team',
|
||||
},
|
||||
{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/228c9cd847514f99ca1181b4d413c24e482ab46459a557e3b934facb32ab546d.png',
|
||||
title: '佣金明细',
|
||||
path: '/pages/commission/wallet',
|
||||
},
|
||||
{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/bb763f93be24f6d5c8c2948e512b95597d748f576277cc2d91f452fb3741e5a3.png',
|
||||
title: '分销订单',
|
||||
path: '/pages/commission/order',
|
||||
},
|
||||
{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/326f6fe148cd6c8328297731bd63674a3a86340f937dfd1a376e435e34b5073e.png',
|
||||
title: '推广商品',
|
||||
path: '/pages/commission/goods',
|
||||
},
|
||||
// {
|
||||
// img: 'https://zysc.fjptzykj.com:3000/shangcheng/fe729044c3c0874d93435151bb204dede3d1dfbc0e2d03d09e2f76534e7cb8ba.png',
|
||||
// title: '我的资料',
|
||||
// path: '/pages/commission/apply',
|
||||
// isAgentFrom: true,
|
||||
// },
|
||||
// todo @芋艿:邀请海报需要登录后的个人数据
|
||||
{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/f238f60d6e45080cdbbd294c344d3e2fc3a30c34ccb9345e931b0c5aa9e90645.png',
|
||||
title: '邀请海报',
|
||||
path: 'action:showShareModal',
|
||||
},
|
||||
// TODO @芋艿:缺少 icon
|
||||
{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/d6bc7dbec1333e554a4781cbfae023e590a555dfca12784615023ae43bd2bf46.png',
|
||||
title: '推广排行',
|
||||
path: '/pages/commission/promoter',
|
||||
},
|
||||
{
|
||||
img: 'https://zysc.fjptzykj.com:3000/shangcheng/4332d64835bb4aedc05636950f7cd7dcbab085f0f72f42eee4d87799947a7108.png',
|
||||
title: '佣金排行',
|
||||
path: '/pages/commission/commission-ranking',
|
||||
},
|
||||
],
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.new-menu {
|
||||
width: 100%;
|
||||
background: white;
|
||||
|
||||
.new-menu-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
padding: 0 20px;
|
||||
|
||||
.new-menu-item {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom:19px;
|
||||
.l {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
width: 50%;
|
||||
.menu-icon{
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.r {
|
||||
width: 4%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.menu-box {
|
||||
margin: 0 auto;
|
||||
width: 690rpx;
|
||||
margin-bottom: 20rpx;
|
||||
margin-top: 20rpx;
|
||||
border-radius: 12rpx;
|
||||
z-index: 3;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.header-box {
|
||||
width: 690rpx;
|
||||
height: 76rpx;
|
||||
position: relative;
|
||||
|
||||
.header-bg {
|
||||
width: 690rpx;
|
||||
height: 76rpx;
|
||||
}
|
||||
|
||||
.header-title {
|
||||
position: absolute;
|
||||
left: 20rpx;
|
||||
top: 24rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
color: #ffffff;
|
||||
line-height: 30rpx;
|
||||
}
|
||||
|
||||
.cicon-forward {
|
||||
font-size: 30rpx;
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
line-height: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-list {
|
||||
padding: 50rpx 0 10rpx 0;
|
||||
background: #fdfae9;
|
||||
border-radius: 0 0 12rpx 12rpx;
|
||||
}
|
||||
|
||||
.item-box {
|
||||
width: 25%;
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
width: 45rpx;
|
||||
height: 45rpx;
|
||||
background: #ffffff;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.menu-icon-you{
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
}
|
||||
|
||||
.menu-title {
|
||||
font-size: 26rpx;
|
||||
font-weight: 500;
|
||||
color: #ffffff;
|
||||
}
|
||||
</style>
|
@ -78,11 +78,12 @@
|
||||
|
||||
// TODO 芋艿:分享的接入
|
||||
function onShareGoods(goodsInfo) {
|
||||
console.log(goodsInfo,"/pages/index/cart")
|
||||
state.shareInfo = $share.getShareInfo(
|
||||
{
|
||||
title: goodsInfo.title,
|
||||
image: sheep.$url.cdn(goodsInfo.image),
|
||||
desc: goodsInfo.subtitle,
|
||||
title: goodsInfo.name,
|
||||
image: sheep.$url.cdn(goodsInfo.picUrl),
|
||||
desc: goodsInfo.introduction,
|
||||
params: {
|
||||
page: '2',
|
||||
query: goodsInfo.id,
|
||||
@ -90,10 +91,10 @@
|
||||
},
|
||||
{
|
||||
type: 'goods', // 商品海报
|
||||
title: goodsInfo.title, // 商品标题
|
||||
image: sheep.$url.cdn(goodsInfo.image), // 商品主图
|
||||
price: goodsInfo.price[0], // 商品价格
|
||||
original_price: goodsInfo.original_price, // 商品原价
|
||||
title: goodsInfo.name, // 商品标题
|
||||
image: sheep.$url.cdn(goodsInfo.picUrl), // 商品主图
|
||||
price: fen2yuan(goodsInfo.price), // 商品价格
|
||||
marketPrice: fen2yuan(goodsInfo.marketPrice), // 商品原价
|
||||
},
|
||||
);
|
||||
showShareModal();
|
||||
|
@ -13,7 +13,7 @@
|
||||
<!-- 账户信息 -->
|
||||
<!-- <account-info /> -->
|
||||
<!-- 菜单栏 -->
|
||||
<commission-menu />
|
||||
<!-- <commission-menu /> -->
|
||||
<!-- 分销记录 -->
|
||||
<!-- <commission-log /> -->
|
||||
|
||||
|
@ -97,7 +97,7 @@
|
||||
list: [],
|
||||
total: 0,
|
||||
pageNo: 1,
|
||||
pageSize: 1,
|
||||
pageSize: 8,
|
||||
},
|
||||
});
|
||||
|
||||
@ -128,7 +128,7 @@
|
||||
state.loadStatus = 'loading';
|
||||
let { code, data } = await BrokerageApi.getBrokerageRecordPage({
|
||||
pageSize: state.pagination.pageSize,
|
||||
pageNo: state.pagination.pageSize,
|
||||
pageNo: state.pagination.pageNo,
|
||||
bizType: 1, // 获得推广佣金
|
||||
status: state.currentTab > 0 ? state.currentTab : undefined,
|
||||
});
|
||||
|
@ -150,7 +150,7 @@
|
||||
import { onLoad, onReachBottom } from '@dcloudio/uni-app';
|
||||
import sheep from '@/sheep';
|
||||
import dayjs from 'dayjs';
|
||||
import _ from 'lodash';
|
||||
import _ from 'lodash-es';
|
||||
import BrokerageApi from '@/sheep/api/trade/brokerage';
|
||||
import { fen2yuan } from '@/sheep/hooks/useGoods';
|
||||
import { resetPagination } from '@/sheep/util';
|
||||
@ -168,7 +168,7 @@
|
||||
list: [],
|
||||
total: 0,
|
||||
pageNo: 1,
|
||||
pageSize: 1,
|
||||
pageSize: 8,
|
||||
},
|
||||
loadStatus: '',
|
||||
|
||||
|
@ -80,7 +80,8 @@
|
||||
await OrderApi.createOrderItemComment(comment);
|
||||
}
|
||||
// 都评论好,返回
|
||||
sheep.$router.back();
|
||||
// sheep.$router.back();
|
||||
sheep.$router.redirect('/pages/order/list');
|
||||
}
|
||||
|
||||
onLoad(async (options) => {
|
||||
|
@ -3,7 +3,7 @@
|
||||
<view class="detail-comment-card bg-white">
|
||||
<view class="card-header ss-flex ss-col-center ss-row-between ss-p-b-30">
|
||||
<view class="ss-flex ss-col-center">
|
||||
<view class="line"></view>
|
||||
<view class="line" :class="state.themeType ? `${state.themeType}` : ''"></view>
|
||||
<view class="title ss-m-l-20 ss-m-r-10">评价</view>
|
||||
<view class="des">({{ state.total }})</view>
|
||||
</view>
|
||||
@ -32,11 +32,11 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, onBeforeMount } from 'vue';
|
||||
import { reactive, onBeforeMount,computed } from 'vue';
|
||||
import sheep from '@/sheep';
|
||||
import CommentApi from '@/sheep/api/product/comment';
|
||||
import commentItem from './comment-item.vue';
|
||||
|
||||
const app = computed(() => sheep.$store('app'));
|
||||
const props = defineProps({
|
||||
goodsId: {
|
||||
type: [Number, String],
|
||||
@ -47,6 +47,7 @@
|
||||
const state = reactive({
|
||||
commentList: [], // 评论列表,只展示最近的 3 条
|
||||
total: 0, // 总评论数
|
||||
themeType: app.value.platform.themeType
|
||||
});
|
||||
|
||||
async function getComment(id) {
|
||||
|
@ -2,7 +2,7 @@
|
||||
<template>
|
||||
<view class="detail-content-card bg-white ss-m-x-20 ss-p-t-20">
|
||||
<view class="card-header ss-flex ss-col-center ss-m-b-30 ss-m-l-20">
|
||||
<view class="line"></view>
|
||||
<view class="line" :class="state.themeType ? `${state.themeType}` : ''"></view>
|
||||
<view class="title ss-m-l-20 ss-m-r-20">详情</view>
|
||||
</view>
|
||||
<view class="card-content">
|
||||
@ -12,8 +12,19 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
reactive,
|
||||
computed
|
||||
} from 'vue';
|
||||
import sheep from '@/sheep';
|
||||
const { safeAreaInsets } = sheep.$platform.device;
|
||||
const app = computed(() => sheep.$store('app'));
|
||||
const state = reactive({
|
||||
themeType: app.value.platform.themeType
|
||||
});
|
||||
|
||||
const {
|
||||
safeAreaInsets
|
||||
} = sheep.$platform.device;
|
||||
|
||||
const props = defineProps({
|
||||
content: {
|
||||
|
@ -29,7 +29,7 @@
|
||||
<view class="tab-title" :class="state.curTab === item.value ? 'cur-tab-title' : ''">
|
||||
{{ item.label }}
|
||||
</view>
|
||||
<view v-show="state.curTab === item.value" class="tab-line"></view>
|
||||
<view v-show="state.curTab === item.value" class="tab-line" :class="state.themeType ? state.themeType : ''"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -41,12 +41,12 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive } from 'vue';
|
||||
import { reactive, computed } from 'vue';
|
||||
import { onPageScroll } from '@dcloudio/uni-app';
|
||||
import sheep from '@/sheep';
|
||||
import throttle from '@/sheep/helper/throttle.js';
|
||||
import { showMenuTools, closeMenuTools } from '@/sheep/hooks/useModal';
|
||||
|
||||
const app = computed(() => sheep.$store('app'));
|
||||
const sys_statusBar = sheep.$platform.device.statusBarHeight;
|
||||
const sys_navBar = sheep.$platform.navbar;
|
||||
const capsuleStyle = {
|
||||
@ -74,6 +74,7 @@
|
||||
to: 'detail-content-selector',
|
||||
},
|
||||
],
|
||||
themeType:app.value.platform.themeType
|
||||
});
|
||||
const emits = defineEmits(['clickLeft']);
|
||||
const hasHistory = sheep.$router.hasHistory();
|
||||
|
@ -32,7 +32,7 @@
|
||||
>
|
||||
<image
|
||||
class="item-icon"
|
||||
src="/static/images/service.png"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/2f8b9d197059eb62e9dc212392a42fb481275b31f2af9c35033070ea15b71167.png"
|
||||
mode="aspectFit"
|
||||
/>
|
||||
<view class="item-title">客服</view>
|
||||
|
File diff suppressed because one or more lines are too long
@ -101,22 +101,24 @@
|
||||
/>
|
||||
|
||||
<!-- 活动跳转:拼团/秒杀/砍价活动 -->
|
||||
<detail-activity-tip
|
||||
<!-- <detail-activity-tip
|
||||
v-if="state.activityList.length > 0"
|
||||
:activity-list="state.activityList"
|
||||
/>
|
||||
/> -->
|
||||
|
||||
<!-- 详情 tabbar -->
|
||||
<detail-tabbar v-model="state.goodsInfo">
|
||||
<view class="buy-box ss-flex ss-col-center ss-p-r-20" v-if="state.goodsInfo.stock > 0">
|
||||
<button
|
||||
class="ss-reset-button add-btn ui-Shadow-Main"
|
||||
:class="state.themeType ? `${state.themeType}v` : ''"
|
||||
@tap="state.showSelectSku = true"
|
||||
>
|
||||
加入购物车
|
||||
</button>
|
||||
<button
|
||||
class="ss-reset-button buy-btn ui-Shadow-Main"
|
||||
:class="state.themeType ? state.themeType : ''"
|
||||
@tap="state.showSelectSku = true"
|
||||
>
|
||||
立即购买
|
||||
@ -167,6 +169,7 @@
|
||||
onPageScroll(() => {});
|
||||
|
||||
const isLogin = computed(() => sheep.$store('user').isLogin);
|
||||
const app = computed(() => sheep.$store('app'));
|
||||
const state = reactive({
|
||||
goodsId: 0,
|
||||
skeletonLoading: true, // SPU 加载中
|
||||
@ -178,6 +181,7 @@
|
||||
showActivityModel: false, // 【满减送/限时折扣】是否展示 Activity 营销活动的弹窗
|
||||
activityInfo: [], // 【满减送/限时折扣】可参与的 Activity 营销活动的列表
|
||||
activityList: [], // 【秒杀/拼团/砍价】可参与的 Activity 营销活动的列表
|
||||
themeType:app.value.platform.themeType
|
||||
});
|
||||
|
||||
// 规格变更
|
||||
@ -318,6 +322,22 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.bluev{
|
||||
background-color:rgba(33,202,254) !important;
|
||||
color:white !important;
|
||||
}
|
||||
.lvv{
|
||||
background-color:rgba(253,157,17) !important;
|
||||
color:white !important;
|
||||
}
|
||||
.pinkv{
|
||||
background-color:black !important;
|
||||
color:white !important;
|
||||
}
|
||||
.orangev{
|
||||
background-color:rgba(253,157,17) !important;
|
||||
color:white !important;
|
||||
}
|
||||
.detail-card {
|
||||
background-color: #ffff;
|
||||
margin: 14rpx 20rpx;
|
||||
|
@ -1,11 +1,15 @@
|
||||
<template>
|
||||
<s-layout
|
||||
<!-- <s-layout
|
||||
navbar="normal"
|
||||
:leftWidth="0"
|
||||
:rightWidth="0"
|
||||
tools="search"
|
||||
:defaultSearch="state.keyword"
|
||||
@search="onSearch"
|
||||
> -->
|
||||
<s-layout
|
||||
navbar="normal"
|
||||
title="商品列表"
|
||||
>
|
||||
<!-- 筛选 -->
|
||||
<su-sticky bgColor="#fff">
|
||||
|
@ -388,7 +388,7 @@
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
margin-left: -36rpx;
|
||||
background-image: v-bind(disabledBtnBg);
|
||||
background-image: url('@/static/images/activity-btn-disabled.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #999999;
|
||||
|
@ -1,389 +0,0 @@
|
||||
<template>
|
||||
<s-layout navbar="normal" :leftWidth="0" :rightWidth="0" >
|
||||
<!-- 筛选 -->
|
||||
<!-- <su-sticky bgColor="#fff">
|
||||
<view class="ss-flex">
|
||||
<view class="ss-flex-1">
|
||||
<su-tabs :list="state.tabList" :scrollable="false" @change="onTabsChange"
|
||||
:current="state.currentTab" />
|
||||
</view>
|
||||
<view class="list-icon" @tap="state.iconStatus = !state.iconStatus">
|
||||
<text v-if="state.iconStatus" class="sicon-goods-list" />
|
||||
<text v-else class="sicon-goods-card" />
|
||||
</view>
|
||||
</view>
|
||||
</su-sticky> -->
|
||||
<view class="title">
|
||||
促销商品
|
||||
</view>
|
||||
<!-- 弹窗 -->
|
||||
<su-popup :show="state.showFilter" type="top" round="10" :space="sys_navBar + 38" backgroundColor="#F6F6F6"
|
||||
:zIndex="10" @close="state.showFilter = false">
|
||||
<view class="filter-list-box">
|
||||
<view class="filter-item" v-for="(item, index) in state.tabList[state.currentTab].list"
|
||||
:key="item.value" :class="[{ 'filter-item-active': index === state.curFilter }]"
|
||||
@tap="onFilterItem(index)">
|
||||
{{ item.label }}
|
||||
</view>
|
||||
</view>
|
||||
</su-popup>
|
||||
|
||||
<!-- 情况一:单列布局 -->
|
||||
<view class="goods-list ss-m-t-20">
|
||||
<view class="ss-p-l-20 ss-p-r-20 ss-m-b-20" v-for="item in state.pagination.list" :key="item.id">
|
||||
<s-goods-column class="" size="lg" :data="item" :topRadius="10" :bottomRadius="10"
|
||||
@click="sheep.$router.go('/pages/goods/index', { id: item.id })" />
|
||||
</view>
|
||||
</view>
|
||||
<!-- 情况二:双列布局 -->
|
||||
<!-- <view v-if="!state.iconStatus && state.pagination.total > 0"
|
||||
class="ss-flex ss-flex-wrap ss-p-x-20 ss-m-t-20 ss-col-top">
|
||||
<view class="goods-list-box">
|
||||
<view class="left-list" v-for="item in state.leftGoodsList" :key="item.id">
|
||||
<s-goods-column class="goods-md-box" size="md" :data="item" :topRadius="10" :bottomRadius="10"
|
||||
@click="sheep.$router.go('/pages/goods/index', { id: item.id })"
|
||||
@getHeight="mountMasonry($event, 'left')">
|
||||
<template v-slot:cart>
|
||||
<button class="ss-reset-button cart-btn" />
|
||||
</template>
|
||||
</s-goods-column>
|
||||
</view>
|
||||
</view>
|
||||
<view class="goods-list-box">
|
||||
<view class="right-list" v-for="item in state.rightGoodsList" :key="item.id">
|
||||
<s-goods-column class="goods-md-box" size="md" :topRadius="10" :bottomRadius="10" :data="item"
|
||||
@click="sheep.$router.go('/pages/goods/index', { id: item.id })"
|
||||
@getHeight="mountMasonry($event, 'right')">
|
||||
<template v-slot:cart>
|
||||
<button class="ss-reset-button cart-btn" />
|
||||
</template>
|
||||
</s-goods-column>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<uni-load-more v-if="state.pagination.total > 0" :status="state.loadStatus" :content-text="{
|
||||
contentdown: '上拉加载更多',
|
||||
}" @tap="loadMore" />
|
||||
<s-empty v-if="state.pagination.total === 0" icon="/static/soldout-empty.png" text="暂无商品" />
|
||||
</s-layout>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
reactive
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad,
|
||||
onReachBottom
|
||||
} from '@dcloudio/uni-app';
|
||||
import sheep from '@/sheep';
|
||||
import _ from 'lodash';
|
||||
import {
|
||||
resetPagination
|
||||
} from '@/sheep/util';
|
||||
import SpuApi from '@/sheep/api/product/spu';
|
||||
|
||||
const sys_navBar = sheep.$platform.navbar;
|
||||
const emits = defineEmits(['close', 'change']);
|
||||
|
||||
const state = reactive({
|
||||
pagination: {
|
||||
list: [],
|
||||
total: 0,
|
||||
pageNo: 1,
|
||||
pageSize: 6,
|
||||
},
|
||||
currentSort: undefined,
|
||||
currentOrder: undefined,
|
||||
currentTab: 0, // 当前选中的 tab
|
||||
curFilter: 0, // 当前选中的 list 筛选项
|
||||
showFilter: false,
|
||||
iconStatus: false, // true - 单列布局;false - 双列布局
|
||||
keyword: '',
|
||||
categoryId: 0,
|
||||
tabList: [{
|
||||
name: '综合推荐',
|
||||
list: [{
|
||||
label: '综合推荐',
|
||||
},
|
||||
{
|
||||
label: '价格升序',
|
||||
sort: 'price',
|
||||
order: true,
|
||||
},
|
||||
{
|
||||
label: '价格降序',
|
||||
sort: 'price',
|
||||
order: false,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: '销量',
|
||||
sort: 'salesCount',
|
||||
order: false,
|
||||
},
|
||||
{
|
||||
name: '新品优先',
|
||||
value: 'createTime',
|
||||
order: false,
|
||||
},
|
||||
],
|
||||
loadStatus: '',
|
||||
leftGoodsList: [], // 双列布局 - 左侧商品
|
||||
rightGoodsList: [], // 双列布局 - 右侧商品
|
||||
});
|
||||
|
||||
// 加载瀑布流
|
||||
let count = 0;
|
||||
let leftHeight = 0;
|
||||
let rightHeight = 0;
|
||||
|
||||
// 处理双列布局 leftGoodsList + rightGoodsList
|
||||
function mountMasonry(height = 0, where = 'left') {
|
||||
if (!state.pagination.list[count]) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (where === 'left') {
|
||||
leftHeight += height;
|
||||
} else {
|
||||
rightHeight += height;
|
||||
}
|
||||
if (leftHeight <= rightHeight) {
|
||||
state.leftGoodsList.push(state.pagination.list[count]);
|
||||
} else {
|
||||
state.rightGoodsList.push(state.pagination.list[count]);
|
||||
}
|
||||
count++;
|
||||
}
|
||||
|
||||
// 清空列表
|
||||
function emptyList() {
|
||||
resetPagination(state.pagination);
|
||||
state.leftGoodsList = [];
|
||||
state.rightGoodsList = [];
|
||||
count = 0;
|
||||
leftHeight = 0;
|
||||
rightHeight = 0;
|
||||
}
|
||||
|
||||
// 搜索
|
||||
function onSearch(e) {
|
||||
state.keyword = e;
|
||||
emptyList();
|
||||
getList(state.currentSort, state.currentOrder);
|
||||
}
|
||||
|
||||
// 点击
|
||||
function onTabsChange(e) {
|
||||
// 如果点击的是【综合推荐】,则直接展开或者收起筛选项
|
||||
if (state.tabList[e.index].list) {
|
||||
state.currentTab = e.index;
|
||||
state.showFilter = !state.showFilter;
|
||||
return;
|
||||
}
|
||||
state.showFilter = false;
|
||||
|
||||
// 如果点击的是【销量】或者【新品优先】,则直接切换 tab
|
||||
if (e.index === state.currentTab) {
|
||||
return;
|
||||
}
|
||||
|
||||
state.currentTab = e.index;
|
||||
state.currentSort = e.sort;
|
||||
state.currentOrder = e.order;
|
||||
emptyList();
|
||||
getList(e.sort, e.order);
|
||||
}
|
||||
|
||||
// 点击 tab 的 list 筛选项
|
||||
const onFilterItem = (val) => {
|
||||
// 如果点击的是当前的筛选项,则直接收起筛选项,不要加载数据
|
||||
// 这里选择 tabList[0] 的原因,是目前只有它有 list
|
||||
if (
|
||||
state.currentSort === state.tabList[0].list[val].sort &&
|
||||
state.currentOrder === state.tabList[0].list[val].order
|
||||
) {
|
||||
state.showFilter = false;
|
||||
return;
|
||||
}
|
||||
state.showFilter = false;
|
||||
|
||||
// 设置筛选条件
|
||||
state.curFilter = val;
|
||||
state.tabList[0].name = state.tabList[0].list[val].label;
|
||||
state.currentSort = state.tabList[0].list[val].sort;
|
||||
state.currentOrder = state.tabList[0].list[val].order;
|
||||
// 清空 + 加载数据
|
||||
emptyList();
|
||||
getList();
|
||||
};
|
||||
|
||||
async function getList() {
|
||||
state.loadStatus = 'loading';
|
||||
const {
|
||||
code,
|
||||
data
|
||||
} = await SpuApi.getSpusales({
|
||||
pageNo: state.pagination.pageNo,
|
||||
pageSize: state.pagination.pageSize,
|
||||
sortField: state.currentSort,
|
||||
sortAsc: state.currentOrder,
|
||||
categoryId: state.categoryId,
|
||||
keyword: state.keyword,
|
||||
recommendBenefit:1
|
||||
});
|
||||
if (code !== 0) {
|
||||
return;
|
||||
}
|
||||
state.pagination.list = _.concat(state.pagination.list, data.list);
|
||||
state.pagination.total = data.total;
|
||||
state.loadStatus = state.pagination.list.length < state.pagination.total ? 'more' : 'noMore';
|
||||
mountMasonry();
|
||||
}
|
||||
|
||||
// 加载更多
|
||||
function loadMore() {
|
||||
if (state.loadStatus === 'noMore') {
|
||||
return;
|
||||
}
|
||||
state.pagination.pageNo++;
|
||||
getList(state.currentSort, state.currentOrder);
|
||||
}
|
||||
|
||||
// 获取促销列表
|
||||
const getSpu = async (id) => {
|
||||
const data = await SpuApi.getSpusales({recommendBenefit:1});
|
||||
console.log(data, "我要留了")
|
||||
};
|
||||
|
||||
onLoad((options) => {
|
||||
state.categoryId = options.categoryId;
|
||||
state.keyword = options.keyword;
|
||||
getList(state.currentSort, state.currentOrder);
|
||||
});
|
||||
|
||||
// 上拉加载更多
|
||||
onReachBottom(() => {
|
||||
loadMore();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.title{
|
||||
text-align: center;
|
||||
padding: 10px 0;
|
||||
position: relative;
|
||||
&:after {
|
||||
position: absolute;
|
||||
content:'';
|
||||
top: 50%;
|
||||
left: 98px;
|
||||
width: 100px;
|
||||
height:2px;
|
||||
background:#dadada;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
&:before {
|
||||
position: absolute;
|
||||
content:'';
|
||||
height:2px;
|
||||
top: 50%;
|
||||
right: 0;
|
||||
width: 100px;
|
||||
background:#dadada;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
}
|
||||
.goods-list-box {
|
||||
width: 50%;
|
||||
box-sizing: border-box;
|
||||
|
||||
.left-list {
|
||||
margin-right: 10rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.right-list {
|
||||
margin-left: 10rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.goods-box {
|
||||
&:nth-last-of-type(1) {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
&:nth-child(2n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.list-icon {
|
||||
width: 80rpx;
|
||||
|
||||
.sicon-goods-card {
|
||||
font-size: 40rpx;
|
||||
}
|
||||
|
||||
.sicon-goods-list {
|
||||
font-size: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.goods-card {
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.list-filter-tabs {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.filter-list-box {
|
||||
padding: 28rpx 52rpx;
|
||||
|
||||
.filter-item {
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
line-height: normal;
|
||||
margin-bottom: 24rpx;
|
||||
|
||||
&:nth-last-child(1) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.filter-item-active {
|
||||
color: var(--ui-BG-Main);
|
||||
}
|
||||
}
|
||||
|
||||
.tab-item {
|
||||
height: 50px;
|
||||
position: relative;
|
||||
z-index: 11;
|
||||
|
||||
.tab-title {
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.cur-tab-title {
|
||||
font-weight: $font-weight-bold;
|
||||
}
|
||||
|
||||
.tab-line {
|
||||
width: 60rpx;
|
||||
height: 6rpx;
|
||||
border-radius: 6rpx;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 10rpx;
|
||||
background-color: var(--ui-BG-Main);
|
||||
z-index: 12;
|
||||
}
|
||||
}
|
||||
</style>
|
File diff suppressed because one or more lines are too long
@ -90,7 +90,7 @@
|
||||
</button>
|
||||
<button
|
||||
v-else
|
||||
class="ss-reset-button ui-BG-Main-Gradient pay-btn ui-Shadow-Main"
|
||||
class="ss-reset-button pay-btn ui-Shadow-Main"
|
||||
@tap="onConfirm"
|
||||
>
|
||||
去结算
|
||||
@ -216,6 +216,8 @@
|
||||
line-height: 28rpx;
|
||||
font-weight: 500;
|
||||
border-radius: 40rpx;
|
||||
background:#e93422;
|
||||
color:white;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -5,49 +5,34 @@
|
||||
<view class="three-level-wrap ss-flex ss-col-top" :style="[{ height: pageHeight + 'px' }]">
|
||||
<!-- 商品分类(左) -->
|
||||
<scroll-view class="side-menu-wrap" scroll-y :style="[{ height: pageHeight + 'px' }]">
|
||||
<view
|
||||
class="menu-item ss-flex"
|
||||
v-for="(item, index) in state.categoryList"
|
||||
:key="item.id"
|
||||
:class="[{ 'menu-item-active': index === state.activeMenu }]"
|
||||
@tap="onMenu(index)"
|
||||
>
|
||||
<view class="menu-item ss-flex" v-for="(item, index) in state.categoryList" :key="item.id"
|
||||
:class="[{ 'menu-item-active': index === state.activeMenu }]" @tap="onMenu(index)">
|
||||
<view class="menu-title ss-line-1">
|
||||
{{ item.name }}
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<!-- 商品分类(右) -->
|
||||
<scroll-view
|
||||
class="goods-list-box"
|
||||
scroll-y
|
||||
:style="[{ height: pageHeight + 'px' }]"
|
||||
v-if="state.categoryList?.length"
|
||||
>
|
||||
<!-- <image
|
||||
v-if="state.categoryList[state.activeMenu].picUrl"
|
||||
class="banner-img"
|
||||
:src="sheep.$url.cdn(state.categoryList[state.activeMenu].picUrl)"
|
||||
mode="widthFix"
|
||||
/> -->
|
||||
<scroll-view class="goods-list-box" scroll-y :style="[{ height: pageHeight + 'px' }]"
|
||||
v-if="state.categoryList?.length">
|
||||
|
||||
|
||||
<!-- <image v-if="state.categoryList[state.activeMenu].picUrl" class="banner-img" :src="sheep.$url.cdn(state.categoryList[state.activeMenu].picUrl)" mode="widthFix"/> -->
|
||||
<first-one v-if="state.style === 'first_one'" :pagination="state.pagination" />
|
||||
<first-two v-if="state.style === 'first_two'" :pagination="state.pagination" />
|
||||
<second-one
|
||||
v-if="state.style === 'second_one'"
|
||||
:data="state.categoryList"
|
||||
:activeMenu="state.activeMenu"
|
||||
/>
|
||||
<uni-load-more
|
||||
v-if="
|
||||
<!-- 样式1 -->
|
||||
<second-one v-show="state.typeId === '1'" :data="state.categoryList"
|
||||
:activeMenu="state.activeMenu" />
|
||||
<!-- 样式2 -->
|
||||
<second-second ref="secondRef" v-show="state.typeId === '2'" :data="state.categoryList"
|
||||
:activeMenu="state.activeMenu" />
|
||||
|
||||
<uni-load-more v-if="
|
||||
(state.style === 'first_one' || state.style === 'first_two') &&
|
||||
state.pagination.total > 0
|
||||
"
|
||||
:status="state.loadStatus"
|
||||
:content-text="{
|
||||
" :status="state.loadStatus" :content-text="{
|
||||
contentdown: '点击查看更多',
|
||||
}"
|
||||
@tap="loadMore"
|
||||
/>
|
||||
}" @tap="loadMore" />
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
@ -56,16 +41,25 @@
|
||||
|
||||
<script setup>
|
||||
import secondOne from './components/second-one.vue';
|
||||
import secondSecond from './components/second-second.vue';
|
||||
import firstOne from './components/first-one.vue';
|
||||
import firstTwo from './components/first-two.vue';
|
||||
import sheep from '@/sheep';
|
||||
import CategoryApi from '@/sheep/api/product/category';
|
||||
import SpuApi from '@/sheep/api/product/spu';
|
||||
import { onLoad, onReachBottom } from '@dcloudio/uni-app';
|
||||
import { computed, reactive } from 'vue';
|
||||
import {
|
||||
onLoad,
|
||||
onReachBottom
|
||||
} from '@dcloudio/uni-app';
|
||||
import {
|
||||
computed,
|
||||
reactive,
|
||||
ref
|
||||
} from 'vue';
|
||||
import _ from 'lodash';
|
||||
import { handleTree } from '@/sheep/util';
|
||||
|
||||
import {
|
||||
handleTree
|
||||
} from '@/sheep/util';
|
||||
const state = reactive({
|
||||
style: 'second_one', // first_one(一级 - 样式一), first_two(二级 - 样式二), second_one(二级)
|
||||
categoryList: [], // 商品分类树
|
||||
@ -79,23 +73,37 @@
|
||||
pageSize: 6,
|
||||
},
|
||||
loadStatus: '',
|
||||
typeId:'1'
|
||||
});
|
||||
const app = computed(() => sheep.$store('app'));
|
||||
state.typeId = app.value.platform.goodsType;//判断是什么样式
|
||||
// console.log(app.value.platform.goodsType,"------------------------")
|
||||
const secondRef = ref(null);
|
||||
|
||||
const { safeArea } = sheep.$platform.device;
|
||||
const {
|
||||
safeArea
|
||||
} = sheep.$platform.device;
|
||||
const pageHeight = computed(() => safeArea.height - 44 - 50);
|
||||
|
||||
// 加载商品分类
|
||||
async function getList() {
|
||||
const { code, data } = await CategoryApi.getCategoryList();
|
||||
const {
|
||||
code,
|
||||
data
|
||||
} = await CategoryApi.getCategoryList();
|
||||
if (code !== 0) {
|
||||
return;
|
||||
}
|
||||
state.categoryList = handleTree(data);
|
||||
// console.log(state.categoryList,"ssssssssssssss")
|
||||
}
|
||||
|
||||
// 选中菜单
|
||||
const onMenu = (val) => {
|
||||
state.activeMenu = val;
|
||||
if (state.style === 'second_one' && secondRef.value) {
|
||||
secondRef.value.onFilterItem(state.categoryList[state.activeMenu].children[0].id);
|
||||
}
|
||||
if (state.style === 'first_one' || state.style === 'first_two') {
|
||||
state.pagination.pageNo = 1;
|
||||
state.pagination.list = [];
|
||||
@ -148,9 +156,9 @@
|
||||
.s-category {
|
||||
:deep() {
|
||||
.side-menu-wrap {
|
||||
width: 200rpx;
|
||||
width: 170rpx;
|
||||
height: 100%;
|
||||
padding-left: 12rpx;
|
||||
// padding-left: 12rpx;
|
||||
background-color: #f6f6f6;
|
||||
|
||||
.menu-item {
|
||||
@ -161,22 +169,21 @@
|
||||
|
||||
.menu-title {
|
||||
line-height: 32rpx;
|
||||
font-size: 30rpx;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #333;
|
||||
margin-left: 28rpx;
|
||||
// margin-left: 28rpx;
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
&::before {
|
||||
content: '';
|
||||
width: 64rpx;
|
||||
height: 12rpx;
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
background: linear-gradient(90deg,
|
||||
var(--ui-BG-Main-gradient),
|
||||
var(--ui-BG-Main-light)
|
||||
) !important;
|
||||
var(--ui-BG-Main-light)) !important;
|
||||
position: absolute;
|
||||
left: -64rpx;
|
||||
bottom: 0;
|
||||
@ -187,16 +194,17 @@
|
||||
|
||||
&.menu-item-active {
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx 0 0 20rpx;
|
||||
|
||||
// border-radius: 20rpx 0 0 20rpx;
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: -20rpx;
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
background: radial-gradient(circle at 0 100%, transparent 20rpx, #fff 0);
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 2px;
|
||||
height: 100%;
|
||||
// background: radial-gradient(circle at 0 100%, transparent 20rpx, #fff 0);
|
||||
background: rgba(236, 72, 29);
|
||||
}
|
||||
|
||||
&::after {
|
||||
@ -211,10 +219,10 @@
|
||||
|
||||
.menu-title {
|
||||
font-weight: 600;
|
||||
|
||||
&::before {
|
||||
left: 0;
|
||||
}
|
||||
color: rgba(236, 72, 29);
|
||||
// &::before {
|
||||
// left: 0;
|
||||
// }
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -222,8 +230,9 @@
|
||||
|
||||
.goods-list-box {
|
||||
background-color: #fff;
|
||||
width: calc(100vw - 100px);
|
||||
padding: 10px;
|
||||
width: calc(100vw - 85px);
|
||||
padding: 10px 0;
|
||||
|
||||
}
|
||||
|
||||
.banner-img {
|
||||
|
@ -1,8 +1,8 @@
|
||||
<!-- 分类展示:second-one 风格 -->
|
||||
<template>
|
||||
<view>
|
||||
<view style=" padding: 0 15px;">
|
||||
<!-- 一级分类的名字 -->
|
||||
<view class="title-box ss-flex ss-col-center ss-row-center ss-p-b-30">
|
||||
<view class="second-one ss-flex ss-col-center ss-row-center ss-p-b-30">
|
||||
<view class="title-line-left" />
|
||||
<view class="title-text ss-p-x-20">{{ props.data[activeMenu].name }}</view>
|
||||
<view class="title-line-right" />
|
||||
|
328
pages/index/components/second-second.vue
Normal file
328
pages/index/components/second-second.vue
Normal file
@ -0,0 +1,328 @@
|
||||
<!-- 分类展示:second-one 风格 -->
|
||||
<template>
|
||||
<view>
|
||||
<view class="top_class">
|
||||
<scroll-view scroll-x class="scroll">
|
||||
<view @click="onFilterItem(item.id)" class="list on"
|
||||
v-for="(item, index) in props.data[activeMenu].children" :key="index">
|
||||
{{item.name}}
|
||||
</view>
|
||||
<!-- 为了不让标按钮覆盖按钮 -->
|
||||
<view v-if="props.data[activeMenu].children.length > 5" class="list" style="width:0;"> </view>
|
||||
</scroll-view>
|
||||
<view class="rit" v-if="props.data[activeMenu].children.length > 5">
|
||||
<image
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/475ffa1c11d2bdb4997efb0ba4dfab0b971630ca9e140fa90686c7206db53c82.png"
|
||||
class="img"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="" v-for="data in state.pagination.list" :key="data.id">
|
||||
<!-- <s-goods-column class="" size="lg" :data="data" :topRadius="10" :bottomRadius="10"
|
||||
@click="sheep.$router.go('/pages/goods/index', { id: item.id })" /> -->
|
||||
<view class="ss-goods-wrap">
|
||||
<view class="lg-goods-card ss-flex ss-col-stretch" style=""
|
||||
@click="sheep.$router.go('/pages/goods/index', { id: data.id })">
|
||||
<image class="lg-img-box" :src="sheep.$url.cdn(data.image || data.picUrl)" mode="aspectFill" />
|
||||
<view class="lg-goods-content ss-flex-1 ss-flex-col ss-p-b-10 ">
|
||||
<view class="b">
|
||||
<view class="lg-goods-title ss-line-2">
|
||||
{{ data.title || data.name }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="pppp">
|
||||
<view class="ss-flex ss-col-bottom font-OPPOSANS">
|
||||
<view class="sl-goods-price ss-m-r-12">
|
||||
<!-- 活动价格 -->
|
||||
<text class="price-unit ss-font-24">¥</text>
|
||||
<text class="price">
|
||||
{{ isArray(data.price) ? fen2yuan(data.price[0]) : fen2yuan(data.price) }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
<slot name="cart">
|
||||
<view class="buy-box ss-flex ss-col-center ss-row-center"> 去购买</view>
|
||||
</slot>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<uni-load-more v-if="state.pagination.total > 0" :status="state.loadStatus" :content-text="{
|
||||
contentdown: '上拉加载更多',
|
||||
}" @tap="loadMore" />
|
||||
<s-empty v-if="state.pagination.total === 0" icon="/static/soldout-empty.png" text="暂无商品" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
fen2yuan,
|
||||
formatExchange,
|
||||
formatSales,
|
||||
formatStock,
|
||||
getRewardActivityRuleItemDescriptions,
|
||||
} from '@/sheep/hooks/useGoods';
|
||||
import {
|
||||
isArray
|
||||
} from 'lodash-es';
|
||||
import {
|
||||
onLoad,
|
||||
onReachBottom
|
||||
} from '@dcloudio/uni-app';
|
||||
import sheep from '@/sheep';
|
||||
import SpuApi from '@/sheep/api/product/spu';
|
||||
import {
|
||||
reactive,
|
||||
defineExpose
|
||||
} from 'vue';
|
||||
import _ from 'lodash';
|
||||
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
activeMenu: [Number, String],
|
||||
});
|
||||
|
||||
const state = reactive({
|
||||
pagination: {
|
||||
list: [],
|
||||
total: 0,
|
||||
pageNo: 1,
|
||||
pageSize: 6,
|
||||
},
|
||||
currentSort: undefined,
|
||||
currentOrder: undefined,
|
||||
currentTab: 0, // 当前选中的 tab
|
||||
curFilter: 0, // 当前选中的 list 筛选项
|
||||
showFilter: false,
|
||||
iconStatus: false, // true - 单列布局;false - 双列布局
|
||||
keyword: '',
|
||||
categoryId: 0,
|
||||
loadStatus: ''
|
||||
});
|
||||
|
||||
// 清空列表
|
||||
function emptyList() {
|
||||
state.pagination.list = [];
|
||||
}
|
||||
const onFilterItem = (id) => {
|
||||
// 清空 + 加载数据
|
||||
emptyList();
|
||||
getList(id);
|
||||
};
|
||||
async function getList(id) {
|
||||
console.log(id)
|
||||
state.loadStatus = 'loading';
|
||||
const {
|
||||
code,
|
||||
data
|
||||
} = await SpuApi.getSpuPage({
|
||||
pageNo: state.pagination.pageNo,
|
||||
pageSize: state.pagination.pageSize,
|
||||
sortField: state.currentSort,
|
||||
sortAsc: state.currentOrder,
|
||||
categoryId: id,
|
||||
keyword: state.keyword,
|
||||
});
|
||||
if (code !== 0) {
|
||||
return;
|
||||
}
|
||||
state.pagination.list = _.concat(state.pagination.list, data.list);
|
||||
state.pagination.total = data.total;
|
||||
state.loadStatus = state.pagination.list.length < state.pagination.total ? 'more' : 'noMore';
|
||||
};
|
||||
|
||||
// 加载更多
|
||||
function loadMore() {
|
||||
if (state.loadStatus === 'noMore') {
|
||||
return;
|
||||
}
|
||||
state.pagination.pageNo++;
|
||||
getList();
|
||||
}
|
||||
console.log(props.data[props.activeMenu].id, "state.pagination.list")
|
||||
getList(props.data[props.activeMenu].id);
|
||||
// onLoad((options) => {
|
||||
// // state.categoryId = options.categoryId;
|
||||
// // state.keyword = options.keyword;
|
||||
// });
|
||||
|
||||
// 上拉加载更多
|
||||
onReachBottom(() => {
|
||||
loadMore();
|
||||
});
|
||||
|
||||
defineExpose({
|
||||
onFilterItem
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
//lg
|
||||
.lg-goods-card {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
background-color: $white;
|
||||
// height: 280rpx;
|
||||
border-radius: 10px !important;
|
||||
padding: 10px;
|
||||
.price-unit{
|
||||
color:#df2f29;
|
||||
font-weight:700;
|
||||
}
|
||||
.lg-img-box {
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
margin-right: 20rpx;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.price{
|
||||
color:#df2f29;
|
||||
font-weight:700;
|
||||
}
|
||||
.lg-goods-title {
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
// margin-top:7px;
|
||||
// line-height: 36rpx;
|
||||
// width: 410rpx;
|
||||
}
|
||||
|
||||
.lg-goods-subtitle {
|
||||
font-size: 24rpx;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
// line-height: 30rpx;
|
||||
// width: 410rpx;
|
||||
}
|
||||
|
||||
.lg-goods-price {
|
||||
font-size: 30rpx;
|
||||
color: $red;
|
||||
line-height: 36rpx;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.tag-box {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.top_class {
|
||||
position: relative;
|
||||
padding: 0 10px;
|
||||
|
||||
.scroll {
|
||||
white-space: nowrap;
|
||||
margin-bottom: 10px;
|
||||
|
||||
.list {
|
||||
padding: 3px 15px;
|
||||
background: rgba(248, 248, 248);
|
||||
color: rgba(179, 179, 179);
|
||||
display: inline-block;
|
||||
border-radius: 13px;
|
||||
margin-right: 10px;
|
||||
|
||||
&.on {
|
||||
background: rgba(255, 235, 234);
|
||||
color: rgba(223, 47, 41);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.rit {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 40px;
|
||||
height: 100%;
|
||||
background-color: white;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
|
||||
.img {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.title-box {
|
||||
|
||||
.title-line-left,
|
||||
.title-line-right {
|
||||
width: 15px;
|
||||
height: 1px;
|
||||
background: #d2d2d2;
|
||||
}
|
||||
}
|
||||
|
||||
.goods-item {
|
||||
width: calc((100% - 20px) / 3);
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
&:nth-of-type(3n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.goods-img {
|
||||
width: calc((100vw - 140px) / 3);
|
||||
height: calc((100vw - 140px) / 3);
|
||||
}
|
||||
|
||||
.goods-title {
|
||||
font-size: 26rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
line-height: 40rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.goods-price {
|
||||
color: $red;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
.lg-goods-content{
|
||||
.b{
|
||||
min-height: 37px;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
}
|
||||
.pppp{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-top: 10px;
|
||||
// padding-right: 10px;
|
||||
.buy-box {
|
||||
bottom: 20rpx;
|
||||
right: 20rpx;
|
||||
z-index: 2;
|
||||
width: 58px;
|
||||
padding:3px 0;
|
||||
// background: linear-gradient(90deg, #fe8900, #ff5e00);
|
||||
background: #df2f29;
|
||||
border-radius: 25rpx;
|
||||
font-size: 12px;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
@ -2,35 +2,27 @@
|
||||
<template>
|
||||
<view v-if="template">
|
||||
|
||||
<s-layout
|
||||
title="首页"
|
||||
navbar="normal"
|
||||
tools="search"
|
||||
tabbar="/pages/index/index"
|
||||
:bgStyle="template.page"
|
||||
:navbarStyle="template.navigationBar"
|
||||
onShareAppMessage
|
||||
@search="(e) => { console.log(e,'eeeeeeeeeeee') }"
|
||||
headerBtns='headerBtns'
|
||||
backgroundColor="rgba(248,83,42)"
|
||||
opacityBgUi='ll'
|
||||
:navBg="true"
|
||||
>
|
||||
<s-layout title="首页" navbar="normal" tools="search" tabbar="/pages/index/index" :bgStyle="template.page"
|
||||
:navbarStyle="template.navigationBar" onShareAppMessage @search="(e) => { console.log(e,'eeeeeeeeeeee') }"
|
||||
headerBtns='headerBtns' backgroundColor="#e93422" opacityBgUi='ll' :navBg="true">
|
||||
<view class="new-bg"></view>
|
||||
<s-block
|
||||
v-for="(item, index) in template.components"
|
||||
:key="index"
|
||||
:styles="item.property.style"
|
||||
>
|
||||
<s-block-item :type="item.id" :data="item.property" :styles="item.property.style" />
|
||||
|
||||
<s-block v-for="(item, index) in template.components" :key="index" :styles="item.property.style">
|
||||
<s-block-item :type="item.id" :data="item.property" :styles="item.property.style" :fl="true" />
|
||||
</s-block>
|
||||
</s-layout>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed } from 'vue';
|
||||
import { onLoad, onPageScroll, onPullDownRefresh } from '@dcloudio/uni-app';
|
||||
import {
|
||||
computed
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad,
|
||||
onPageScroll,
|
||||
onPullDownRefresh
|
||||
} from '@dcloudio/uni-app';
|
||||
import sheep from '@/sheep';
|
||||
import $share from '@/sheep/platform/share';
|
||||
// 隐藏原生tabBar
|
||||
@ -88,7 +80,7 @@
|
||||
// 下拉刷新
|
||||
onPullDownRefresh(() => {
|
||||
sheep.$store('app').init();
|
||||
setTimeout(function () {
|
||||
setTimeout(function() {
|
||||
uni.stopPullDownRefresh();
|
||||
}, 800);
|
||||
});
|
||||
@ -97,10 +89,12 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.new-bg{
|
||||
background:rgba(248,83,42);
|
||||
width:100%;
|
||||
height:50px;
|
||||
.new-bg {
|
||||
background: #e93422;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
@ -277,9 +277,10 @@
|
||||
id: data.id,
|
||||
});
|
||||
}else{
|
||||
sheep.$router.redirect('/pages/activity/point/exchange_detail', {
|
||||
sheep.$router.redirect('/pages/activity/point/exchange_success', {
|
||||
id: data.id,
|
||||
});
|
||||
// sheep.$helper.toast('是这里');
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -1,57 +1,72 @@
|
||||
<!-- 订单详情 -->
|
||||
<template>
|
||||
<s-layout title="订单详情" class="index-wrap" navbar="inner">
|
||||
<s-layout title="订单详情" navbar="normal">
|
||||
<view class="new-overflow">
|
||||
<!-- 订单状态 TODO -->
|
||||
<view
|
||||
class="state-box ss-flex-col ss-col-center ss-row-right"
|
||||
:style="[
|
||||
<!-- <view class="state-box ss-col-center new-class" :style="[
|
||||
{
|
||||
marginTop: '-' + Number(statusBarHeight + 88) + 'rpx',
|
||||
paddingTop: Number(statusBarHeight + 88) + 'rpx',
|
||||
},
|
||||
]"
|
||||
>
|
||||
<view class="ss-flex ss-m-t-32 ss-m-b-20">
|
||||
<image
|
||||
v-if="
|
||||
]"> -->
|
||||
<view class="state-box ss-col-center new-class">
|
||||
<view class="ss-flex ss-m-t-32 ss-m-b-20 ">
|
||||
<!-- 待付款 -->
|
||||
<image v-if=" state.orderInfo.status === 0 " class="state-img"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/8761518e0fa2e892fa65f9c3f79456a23a4dab1796b7069b8a5482ac79d00811.png">
|
||||
</image>
|
||||
|
||||
<!-- 待收货 -->
|
||||
<image v-if=" state.orderInfo.status === 20 " class="state-img"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/5aa87fed5713160eb6e7f2cf8697d426d52abac9ede40a1011e8d3296266487e.png">
|
||||
</image>
|
||||
|
||||
<!-- 待评价 -->
|
||||
<image v-if=" state.orderInfo.status === 30 && state.orderInfo.buttons?.includes('comment')"
|
||||
class="state-img"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/b729e67ba7b6039676a43b28ca855228ed82914f7669482b938e9696ed9cc798.png">
|
||||
</image>
|
||||
<!-- 已完成 -->
|
||||
<image v-if=" state.orderInfo.status === 30 && !state.orderInfo.buttons?.includes('comment')"
|
||||
class="state-img"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/7b1b2022173b3b6812ad256c836b4c5c67b6aa63a203c7d142ae90802a416e7b.png">
|
||||
</image>
|
||||
|
||||
<image v-if="
|
||||
state.orderInfo.status_code == 'unpaid' ||
|
||||
state.orderInfo.status === 10 || // 待发货
|
||||
state.orderInfo.status_code == 'nocomment'
|
||||
"
|
||||
class="state-img"
|
||||
:src="sheep.$url.static('/static/img/shop/order/order_loading.png')"
|
||||
>
|
||||
" class="state-img"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/b78f86e49f0408b005c79246af63707c86a855b2dd39556f2fdce7653d95b227.png">
|
||||
</image>
|
||||
<image
|
||||
v-if="
|
||||
<image v-if="
|
||||
state.orderInfo.status_code == 'completed' ||
|
||||
state.orderInfo.status_code == 'refund_agree'
|
||||
"
|
||||
class="state-img"
|
||||
:src="sheep.$url.static('/static/img/shop/order/order_success.png')"
|
||||
>
|
||||
" class="state-img"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/b78f86e49f0408b005c79246af63707c86a855b2dd39556f2fdce7653d95b227.png">
|
||||
</image>
|
||||
<image
|
||||
v-if="state.orderInfo.status_code == 'cancel' || state.orderInfo.status_code == 'closed'"
|
||||
<image v-if="state.orderInfo.status_code == 'cancel' || state.orderInfo.status_code == 'closed'"
|
||||
class="state-img"
|
||||
:src="sheep.$url.static('/static/img/shop/order/order_close.png')"
|
||||
>
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/b78f86e49f0408b005c79246af63707c86a855b2dd39556f2fdce7653d95b227.png">
|
||||
</image>
|
||||
<image
|
||||
v-if="state.orderInfo.status_code == 'noget'"
|
||||
class="state-img"
|
||||
:src="sheep.$url.static('/static/img/shop/order/order_express.png')"
|
||||
>
|
||||
<image v-if="state.orderInfo.status_code == 'noget'" class="state-img"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/b78f86e49f0408b005c79246af63707c86a855b2dd39556f2fdce7653d95b227.png">
|
||||
</image>
|
||||
<view class="ss-font-30">{{ formatOrderStatus(state.orderInfo) }}</view>
|
||||
<!-- <view class="ss-font-30">{{ formatOrderStatus(state.orderInfo) }}</view> -->
|
||||
</view>
|
||||
<view class="ss-font-26 ss-m-x-20 ss-m-b-70">
|
||||
<view class="ss-font-26 ss-m-x-20 ">
|
||||
{{ formatOrderStatusDescription(state.orderInfo) }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 收货地址 -->
|
||||
<view class="order-address-box" v-if="state.orderInfo.receiverAreaId > 0">
|
||||
|
||||
<uni-section title="" type="line" padding>
|
||||
<uni-steps :options="state.list1" :active="state.active" active-color="rgba(214,68,49)" />
|
||||
</uni-section>
|
||||
|
||||
<view class="new-address">
|
||||
<view class="ss-flex ss-col-center">
|
||||
<text class="address-username">
|
||||
{{ state.orderInfo.receiverName }}
|
||||
@ -62,56 +77,41 @@
|
||||
{{ state.orderInfo.receiverAreaName }} {{ state.orderInfo.receiverDetailAddress }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view
|
||||
class="detail-goods"
|
||||
:style="[{ marginTop: state.orderInfo.receiverAreaId > 0 ? '0' : '-40rpx' }]"
|
||||
>
|
||||
<view class="detail-goods" :style="[{ marginTop: state.orderInfo.receiverAreaId > 0 ? '0' : '-40rpx' }]">
|
||||
<!-- 订单信 -->
|
||||
<view class="order-list" v-for="item in state.orderInfo.items" :key="item.goods_id">
|
||||
<view class="order-card">
|
||||
<s-goods-item
|
||||
@tap="onGoodsDetail(item.spuId)"
|
||||
:img="item.picUrl"
|
||||
:title="item.spuName"
|
||||
<s-goods-item @tap="onGoodsDetail(item.spuId)" :img="item.picUrl" :title="item.spuName"
|
||||
:skuText="item.properties.map((property) => property.valueName).join(' ')"
|
||||
:price="item.price"
|
||||
:num="item.count"
|
||||
>
|
||||
:price="item.price" :num="item.count">
|
||||
<template #tool>
|
||||
<view class="ss-flex">
|
||||
<button
|
||||
class="ss-reset-button apply-btn"
|
||||
<button class="ss-reset-button apply-btn"
|
||||
v-if="[10, 20, 30].includes(state.orderInfo.status) && item.afterSaleStatus === 0"
|
||||
@tap.stop="
|
||||
sheep.$router.go('/pages/order/aftersale/apply', {
|
||||
orderId: state.orderInfo.id,
|
||||
itemId: item.id,
|
||||
})
|
||||
"
|
||||
>
|
||||
">
|
||||
申请售后
|
||||
</button>
|
||||
<button
|
||||
class="ss-reset-button apply-btn"
|
||||
v-if="item.afterSaleStatus === 10"
|
||||
<button class="ss-reset-button apply-btn" v-if="item.afterSaleStatus === 10"
|
||||
@tap.stop="
|
||||
sheep.$router.go('/pages/order/aftersale/detail', {
|
||||
id: item.afterSaleId,
|
||||
})
|
||||
"
|
||||
>
|
||||
">
|
||||
退款中
|
||||
</button>
|
||||
<button
|
||||
class="ss-reset-button apply-btn"
|
||||
v-if="item.afterSaleStatus === 20"
|
||||
<button class="ss-reset-button apply-btn" v-if="item.afterSaleStatus === 20"
|
||||
@tap.stop="
|
||||
sheep.$router.go('/pages/order/aftersale/detail', {
|
||||
id: item.afterSaleId,
|
||||
})
|
||||
"
|
||||
>
|
||||
">
|
||||
退款成功
|
||||
</button>
|
||||
</view>
|
||||
@ -191,10 +191,7 @@
|
||||
<text class="title">{{ state.orderInfo.payStatus ? '已付款' : '需付款' }}</text>
|
||||
<text class="detail all-price">¥{{ fen2yuan(state.orderInfo.payPrice) }}</text>
|
||||
</view>
|
||||
<view
|
||||
class="notice-item all-rpice-item ss-flex ss-m-t-20"
|
||||
v-if="state.orderInfo.refundPrice > 0"
|
||||
>
|
||||
<view class="notice-item all-rpice-item ss-flex ss-m-t-20" v-if="state.orderInfo.refundPrice > 0">
|
||||
<text class="title">已退款</text>
|
||||
<text class="detail all-price">¥{{ fen2yuan(state.orderInfo.refundPrice) }}</text>
|
||||
</view>
|
||||
@ -204,62 +201,53 @@
|
||||
<!-- TODO: 查看物流、等待成团、评价完后返回页面没刷新页面 -->
|
||||
<su-fixed bottom placeholder bg="bg-white" v-if="state.orderInfo.buttons?.length">
|
||||
<view class="footer-box ss-flex ss-col-center ss-row-right">
|
||||
<button
|
||||
class="ss-reset-button cancel-btn"
|
||||
v-if="state.orderInfo.buttons?.includes('cancel')"
|
||||
@tap="onCancel(state.orderInfo.id)"
|
||||
>
|
||||
<button class="ss-reset-button cancel-btn" v-if="state.orderInfo.buttons?.includes('cancel')"
|
||||
@tap="onCancel(state.orderInfo.id)">
|
||||
取消订单
|
||||
</button>
|
||||
<button
|
||||
class="ss-reset-button pay-btn ui-BG-Main-Gradient"
|
||||
v-if="state.orderInfo.buttons?.includes('pay')"
|
||||
@tap="onPay(state.orderInfo.payOrderId)"
|
||||
>
|
||||
<button class="ss-reset-button pay-btn ui-BG-Main-Gradient"
|
||||
v-if="state.orderInfo.buttons?.includes('pay')" @tap="onPay(state.orderInfo.payOrderId)">
|
||||
继续支付
|
||||
</button>
|
||||
<button
|
||||
class="ss-reset-button cancel-btn"
|
||||
v-if="state.orderInfo.buttons?.includes('combination')"
|
||||
<button class="ss-reset-button cancel-btn" v-if="state.orderInfo.buttons?.includes('combination')"
|
||||
@tap="
|
||||
sheep.$router.go('/pages/activity/groupon/detail', {
|
||||
id: state.orderInfo.combinationRecordId,
|
||||
})
|
||||
"
|
||||
>
|
||||
">
|
||||
拼团详情
|
||||
</button>
|
||||
<button
|
||||
class="ss-reset-button cancel-btn"
|
||||
v-if="state.orderInfo.buttons?.includes('express')"
|
||||
@tap="onExpress(state.orderInfo.id)"
|
||||
>
|
||||
<button class="ss-reset-button cancel-btn" v-if="state.orderInfo.buttons?.includes('express')"
|
||||
@tap="onExpress(state.orderInfo.id)">
|
||||
查看物流
|
||||
</button>
|
||||
<button
|
||||
class="ss-reset-button cancel-btn"
|
||||
v-if="state.orderInfo.buttons?.includes('confirm')"
|
||||
@tap="onConfirm(state.orderInfo.id)"
|
||||
>
|
||||
<button class="ss-reset-button cancel-btn" v-if="state.orderInfo.buttons?.includes('confirm')"
|
||||
@tap="onConfirm(state.orderInfo.id)">
|
||||
确认收货
|
||||
</button>
|
||||
<button
|
||||
class="ss-reset-button cancel-btn"
|
||||
v-if="state.orderInfo.buttons?.includes('comment')"
|
||||
@tap="onComment(state.orderInfo.id)"
|
||||
>
|
||||
<button class="ss-reset-button cancel-btn" v-if="state.orderInfo.buttons?.includes('comment')"
|
||||
@tap="onComment(state.orderInfo.id)">
|
||||
评价
|
||||
</button>
|
||||
</view>
|
||||
</su-fixed>
|
||||
|
||||
</view>
|
||||
</s-layout>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import sheep from '@/sheep';
|
||||
import { onLoad } from '@dcloudio/uni-app';
|
||||
import { reactive, ref } from 'vue';
|
||||
import { isEmpty } from 'lodash-es';
|
||||
import {
|
||||
onLoad
|
||||
} from '@dcloudio/uni-app';
|
||||
import {
|
||||
reactive,
|
||||
ref
|
||||
} from 'vue';
|
||||
import {
|
||||
isEmpty
|
||||
} from 'lodash-es';
|
||||
import {
|
||||
fen2yuan,
|
||||
formatOrderStatus,
|
||||
@ -277,6 +265,18 @@
|
||||
orderInfo: {},
|
||||
merchantTradeNo: '', // 商户订单号
|
||||
comeinType: '', // 进入订单详情的来源类型
|
||||
list1: [{
|
||||
title: '待付款'
|
||||
}, {
|
||||
title: '待发货'
|
||||
}, {
|
||||
title: '待收货'
|
||||
}, {
|
||||
title: '待评价'
|
||||
}, {
|
||||
title: '已完成'
|
||||
}], // 订单状态步骤条
|
||||
active: 0
|
||||
});
|
||||
|
||||
// ========== 门店自提(核销) ==========
|
||||
@ -310,7 +310,9 @@
|
||||
if (!res.confirm) {
|
||||
return;
|
||||
}
|
||||
const { code } = await OrderApi.cancelOrder(orderId);
|
||||
const {
|
||||
code
|
||||
} = await OrderApi.cancelOrder(orderId);
|
||||
if (code === 0) {
|
||||
await getOrderDetail(orderId);
|
||||
}
|
||||
@ -343,7 +345,9 @@
|
||||
}
|
||||
|
||||
// 正常的确认收货流程
|
||||
const { code } = await OrderApi.receiveOrder(orderId);
|
||||
const {
|
||||
code
|
||||
} = await OrderApi.receiveOrder(orderId);
|
||||
if (code === 0) {
|
||||
await getOrderDetail(orderId);
|
||||
}
|
||||
@ -403,15 +407,43 @@
|
||||
}
|
||||
if (res.code === 0) {
|
||||
state.orderInfo = res.data;
|
||||
|
||||
|
||||
|
||||
handleOrderButtons(state.orderInfo);
|
||||
// 配送方式:门店自提
|
||||
if (res.data.pickUpStoreId) {
|
||||
const { data } = await DeliveryApi.getDeliveryPickUpStore(res.data.pickUpStoreId);
|
||||
const {
|
||||
data
|
||||
} = await DeliveryApi.getDeliveryPickUpStore(res.data.pickUpStoreId);
|
||||
systemStore.value = data || {};
|
||||
}
|
||||
if (state.orderInfo.deliveryType === 2 && state.orderInfo.payStatus) {
|
||||
pickUpVerifyRef.value && pickUpVerifyRef.value.markCode(res.data.pickUpVerifyCode);
|
||||
}
|
||||
|
||||
console.log("打印微信----", state.orderInfo.buttons)
|
||||
|
||||
if (res.data.status == 30 && res.data.buttons?.includes('comment')) {
|
||||
state.active = 3;
|
||||
} else {
|
||||
switch (res.data.status) {
|
||||
case 10:
|
||||
state.active = 1;
|
||||
break;
|
||||
case 30:
|
||||
if (!state.orderInfo.buttons?.includes('comment')) {
|
||||
state.active = 4;
|
||||
}
|
||||
break;
|
||||
case 20:
|
||||
state.active = 2;
|
||||
break;
|
||||
case 0:
|
||||
state.active = 0;
|
||||
break;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
sheep.$router.back();
|
||||
}
|
||||
@ -432,6 +464,20 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.new-overflow{
|
||||
overflow: hidden;
|
||||
}
|
||||
.new-class {
|
||||
display: flex;
|
||||
// justify-content: center;
|
||||
padding: 11px 29px;
|
||||
}
|
||||
|
||||
.new-address {
|
||||
padding-top: 30px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.score-img {
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
@ -450,9 +496,10 @@
|
||||
|
||||
.state-box {
|
||||
color: rgba(#fff, 0.9);
|
||||
width: 100%;
|
||||
background: v-bind(headerBg) no-repeat,
|
||||
linear-gradient(90deg, var(--ui-BG-Main), var(--ui-BG-Main-gradient));
|
||||
// width: 100%;
|
||||
// background: v-bind(headerBg) no-repeat,
|
||||
// linear-gradient(90deg, var(--ui-BG-Main), var(--ui-BG-Main-gradient));
|
||||
background: rgba(214, 68, 49);
|
||||
background-size: 750rpx 100%;
|
||||
box-sizing: border-box;
|
||||
|
||||
@ -466,8 +513,9 @@
|
||||
.order-address-box {
|
||||
background-color: #fff;
|
||||
border-radius: 10rpx;
|
||||
margin: -50rpx 20rpx 16rpx 20rpx;
|
||||
padding: 44rpx 34rpx 42rpx 20rpx;
|
||||
// margin: 15px 20rpx 16rpx 20rpx;
|
||||
margin-bottom: 10px;
|
||||
padding: 44rpx 0 42rpx 0;
|
||||
font-size: 30rpx;
|
||||
box-sizing: border-box;
|
||||
font-weight: 500;
|
||||
@ -487,7 +535,7 @@
|
||||
|
||||
.detail-goods {
|
||||
border-radius: 10rpx;
|
||||
margin: 0 20rpx 20rpx 20rpx;
|
||||
margin: 0 0 20rpx 0;
|
||||
|
||||
.order-list {
|
||||
margin-bottom: 20rpx;
|
||||
@ -526,7 +574,7 @@
|
||||
.notice-box {
|
||||
background: #fff;
|
||||
border-radius: 10rpx;
|
||||
margin: 0 20rpx 20rpx 20rpx;
|
||||
margin: 0 0 20rpx 0;
|
||||
|
||||
.notice-box__head {
|
||||
font-size: 30rpx;
|
||||
@ -588,7 +636,7 @@
|
||||
background-color: #fff;
|
||||
border-radius: 10rpx;
|
||||
padding: 20rpx;
|
||||
margin: 0 20rpx 20rpx 20rpx;
|
||||
margin: 0 0 20rpx 0;
|
||||
|
||||
.notice-item {
|
||||
line-height: 70rpx;
|
||||
|
@ -2,21 +2,12 @@
|
||||
<template>
|
||||
<s-layout title="我的订单">
|
||||
<su-sticky bgColor="#fff">
|
||||
<su-tabs
|
||||
:list="tabMaps"
|
||||
:scrollable="false"
|
||||
@change="onTabsChange"
|
||||
:current="state.currentTab"
|
||||
/>
|
||||
<su-tabs :list="tabMaps" :scrollable="false" @change="onTabsChange" :current="state.currentTab" />
|
||||
</su-sticky>
|
||||
<s-empty v-if="state.pagination.total === 0" icon="/static/order-empty.png" text="暂无订单" />
|
||||
<view v-if="state.pagination.total > 0">
|
||||
<view
|
||||
class="bg-white order-list-card-box ss-r-10 ss-m-t-14 ss-m-20"
|
||||
v-for="order in state.pagination.list"
|
||||
:key="order.id"
|
||||
@tap="onOrderDetail(order.id)"
|
||||
>
|
||||
<view class="bg-white order-list-card-box ss-r-10 ss-m-t-14 ss-m-20" v-for="order in state.pagination.list"
|
||||
:key="order.id" @tap="onOrderDetail(order.id)">
|
||||
<view class="order-card-header ss-flex ss-col-center ss-row-between ss-p-x-20">
|
||||
<view class="order-no">订单号:{{ order.no }}</view>
|
||||
<view class="order-state ss-font-26" :class="formatOrderColor(order)">
|
||||
@ -24,81 +15,49 @@
|
||||
</view>
|
||||
</view>
|
||||
<view class="border-bottom" v-for="item in order.items" :key="item.id">
|
||||
<s-goods-item
|
||||
:img="item.picUrl"
|
||||
:title="item.spuName"
|
||||
:skuText="item.properties.map((property) => property.valueName).join(' ')"
|
||||
:price="item.price"
|
||||
:num="item.count"
|
||||
/>
|
||||
<s-goods-item :img="item.picUrl" :title="item.spuName"
|
||||
:skuText="item.properties.map((property) => property.valueName).join(' ')" :price="item.price"
|
||||
:num="item.count" />
|
||||
</view>
|
||||
<view class="pay-box ss-m-t-30 ss-flex ss-row-right ss-p-r-20">
|
||||
<view class="ss-flex ss-col-center">
|
||||
<view class="discounts-title pay-color"
|
||||
>共 {{ order.productCount }} 件商品,总金额:</view
|
||||
>
|
||||
<view class="discounts-title pay-color">共 {{ order.productCount }} 件商品,总金额:</view>
|
||||
<view class="discounts-money pay-color"> ¥{{ fen2yuan(order.payPrice) }} </view>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
class="order-card-footer ss-flex ss-col-center ss-p-x-20"
|
||||
:class="order.buttons.length > 3 ? 'ss-row-between' : 'ss-row-right'"
|
||||
>
|
||||
<view class="order-card-footer ss-flex ss-col-center ss-p-x-20"
|
||||
:class="order.buttons.length > 3 ? 'ss-row-between' : 'ss-row-right'">
|
||||
<view class="ss-flex ss-col-center">
|
||||
<button
|
||||
v-if="order.buttons.includes('combination')"
|
||||
class="tool-btn ss-reset-button"
|
||||
@tap.stop="onOrderGroupon(order)"
|
||||
>
|
||||
<button v-if="order.buttons.includes('combination')" class="tool-btn ss-reset-button"
|
||||
@tap.stop="onOrderGroupon(order)">
|
||||
拼团详情
|
||||
</button>
|
||||
<button
|
||||
v-if="order.buttons.length === 0"
|
||||
class="tool-btn ss-reset-button"
|
||||
@tap.stop="onOrderDetail(order.id)"
|
||||
>
|
||||
<button v-if="order.buttons.length === 0" class="tool-btn ss-reset-button"
|
||||
@tap.stop="onOrderDetail(order.id)">
|
||||
查看详情
|
||||
</button>
|
||||
<button
|
||||
v-if="order.buttons.includes('confirm')"
|
||||
class="tool-btn ss-reset-button"
|
||||
@tap.stop="onConfirm(order)"
|
||||
>
|
||||
<button v-if="order.buttons.includes('confirm')" class="tool-btn ss-reset-button"
|
||||
@tap.stop="onConfirm(order)">
|
||||
确认收货
|
||||
</button>
|
||||
<button
|
||||
v-if="order.buttons.includes('express')"
|
||||
class="tool-btn ss-reset-button"
|
||||
@tap.stop="onExpress(order.id)"
|
||||
>
|
||||
<button v-if="order.buttons.includes('express')" class="tool-btn ss-reset-button"
|
||||
@tap.stop="onExpress(order.id)">
|
||||
查看物流
|
||||
</button>
|
||||
<button
|
||||
v-if="order.buttons.includes('cancel')"
|
||||
class="tool-btn ss-reset-button"
|
||||
@tap.stop="onCancel(order.id)"
|
||||
>
|
||||
<button v-if="order.buttons.includes('cancel')" class="tool-btn ss-reset-button"
|
||||
@tap.stop="onCancel(order.id)">
|
||||
取消订单
|
||||
</button>
|
||||
<button
|
||||
v-if="order.buttons.includes('comment')"
|
||||
class="tool-btn ss-reset-button"
|
||||
@tap.stop="onComment(order.id)"
|
||||
>
|
||||
<button v-if="order.buttons.includes('comment')" class="tool-btn ss-reset-button"
|
||||
@tap.stop="onComment(order.id)">
|
||||
评价
|
||||
</button>
|
||||
<button
|
||||
v-if="order.buttons.includes('delete')"
|
||||
class="delete-btn ss-reset-button"
|
||||
@tap.stop="onDelete(order.id)"
|
||||
>
|
||||
<button v-if="order.buttons.includes('delete')" class="delete-btn ss-reset-button"
|
||||
@tap.stop="onDelete(order.id)">
|
||||
删除订单
|
||||
</button>
|
||||
<button
|
||||
v-if="order.buttons.includes('pay')"
|
||||
class="tool-btn ss-reset-button ui-BG-Main-Gradient"
|
||||
@tap.stop="onPay(order.payOrderId)"
|
||||
>
|
||||
<button v-if="order.buttons.includes('pay')"
|
||||
class="tool-btn ss-reset-button ui-BG-Main-Gradient" @tap.stop="onPay(order.payOrderId)">
|
||||
继续支付
|
||||
</button>
|
||||
</view>
|
||||
@ -107,20 +66,21 @@
|
||||
</view>
|
||||
|
||||
<!-- 加载更多 -->
|
||||
<uni-load-more
|
||||
v-if="state.pagination.total > 0"
|
||||
:status="state.loadStatus"
|
||||
:content-text="{
|
||||
<uni-load-more v-if="state.pagination.total > 0" :status="state.loadStatus" :content-text="{
|
||||
contentdown: '上拉加载更多',
|
||||
}"
|
||||
@tap="loadMore"
|
||||
/>
|
||||
}" @tap="loadMore" />
|
||||
</s-layout>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive } from 'vue';
|
||||
import { onLoad, onReachBottom, onPullDownRefresh } from '@dcloudio/uni-app';
|
||||
import {
|
||||
reactive
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad,
|
||||
onReachBottom,
|
||||
onPullDownRefresh
|
||||
} from '@dcloudio/uni-app';
|
||||
import {
|
||||
fen2yuan,
|
||||
formatOrderColor,
|
||||
@ -129,9 +89,13 @@
|
||||
} from '@/sheep/hooks/useGoods';
|
||||
import sheep from '@/sheep';
|
||||
import _ from 'lodash';
|
||||
import { isEmpty } from 'lodash';
|
||||
import {
|
||||
isEmpty
|
||||
} from 'lodash';
|
||||
import OrderApi from '@/sheep/api/trade/order';
|
||||
import { resetPagination } from '@/sheep/util';
|
||||
import {
|
||||
resetPagination
|
||||
} from '@/sheep/util';
|
||||
|
||||
// 数据
|
||||
const state = reactive({
|
||||
@ -145,8 +109,7 @@
|
||||
loadStatus: '',
|
||||
});
|
||||
|
||||
const tabMaps = [
|
||||
{
|
||||
const tabMaps = [{
|
||||
name: '全部',
|
||||
},
|
||||
{
|
||||
@ -224,7 +187,9 @@
|
||||
}
|
||||
|
||||
// 正常的确认收货流程
|
||||
const { code } = await OrderApi.receiveOrder(order.id);
|
||||
const {
|
||||
code
|
||||
} = await OrderApi.receiveOrder(order.id);
|
||||
if (code === 0) {
|
||||
resetPagination(state.pagination);
|
||||
await getOrderList();
|
||||
@ -275,11 +240,13 @@
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确定要取消订单吗?',
|
||||
success: async function (res) {
|
||||
success: async function(res) {
|
||||
if (!res.confirm) {
|
||||
return;
|
||||
}
|
||||
const { code } = await OrderApi.cancelOrder(orderId);
|
||||
const {
|
||||
code
|
||||
} = await OrderApi.cancelOrder(orderId);
|
||||
if (code === 0) {
|
||||
// 修改数据的状态
|
||||
let index = state.pagination.list.findIndex((order) => order.id === orderId);
|
||||
@ -296,9 +263,11 @@
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确定要删除订单吗?',
|
||||
success: async function (res) {
|
||||
success: async function(res) {
|
||||
if (res.confirm) {
|
||||
const { code } = await OrderApi.deleteOrder(orderId);
|
||||
const {
|
||||
code
|
||||
} = await OrderApi.deleteOrder(orderId);
|
||||
if (code === 0) {
|
||||
// 删除数据
|
||||
let index = state.pagination.list.findIndex((order) => order.id === orderId);
|
||||
@ -312,7 +281,10 @@
|
||||
// 获取订单列表
|
||||
async function getOrderList() {
|
||||
state.loadStatus = 'loading';
|
||||
let { code, data } = await OrderApi.getOrderPage({
|
||||
let {
|
||||
code,
|
||||
data
|
||||
} = await OrderApi.getOrderPage({
|
||||
pageNo: state.pagination.pageNo,
|
||||
pageSize: state.pagination.pageSize,
|
||||
status: tabMaps[state.currentTab].value,
|
||||
@ -352,7 +324,7 @@
|
||||
onPullDownRefresh(() => {
|
||||
resetPagination(state.pagination);
|
||||
getOrderList();
|
||||
setTimeout(function () {
|
||||
setTimeout(function() {
|
||||
uni.stopPullDownRefresh();
|
||||
}, 800);
|
||||
});
|
||||
@ -421,8 +393,7 @@
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.order-state {
|
||||
}
|
||||
.order-state {}
|
||||
}
|
||||
|
||||
.pay-box {
|
||||
|
@ -1,7 +1,7 @@
|
||||
<!-- 收银台 -->
|
||||
<template>
|
||||
<s-layout title="收银台">
|
||||
<view class="bg-white ss-modal-box ss-flex-col">
|
||||
<view class=" ss-modal-box ss-flex-col">
|
||||
<!-- 订单信息 -->
|
||||
<view class="modal-header ss-flex-col ss-col-center ss-row-center">
|
||||
<view class="money-box ss-m-b-20">
|
||||
@ -14,39 +14,33 @@
|
||||
|
||||
<!-- 支付方式 -->
|
||||
<view class="modal-content ss-flex-1">
|
||||
<view class="pay-title ss-p-l-30 ss-m-y-30">选择支付方式</view>
|
||||
<view class="pay-title ss-p-l-30 " style="margin-top: 15px;">支付方式</view>
|
||||
<radio-group @change="onTapPay">
|
||||
<label class="pay-type-item" v-for="item in state.payMethods" :key="item.title">
|
||||
<view
|
||||
class="pay-item ss-flex ss-col-center ss-row-between ss-p-x-30 border-bottom"
|
||||
<view class="pay-item ss-flex ss-col-center ss-row-between ss-p-x-30 border-bottom"
|
||||
:class="{ 'disabled-pay-item': item.disabled }"
|
||||
>
|
||||
<view class="ss-flex ss-col-center">
|
||||
<image
|
||||
class="pay-icon"
|
||||
v-if="item.disabled"
|
||||
:src="sheep.$url.static('/static/img/shop/pay/cod_disabled.png')"
|
||||
mode="aspectFit"
|
||||
/>
|
||||
<image
|
||||
class="pay-icon"
|
||||
v-else
|
||||
:src="sheep.$url.static(item.icon)"
|
||||
mode="aspectFit"
|
||||
/>
|
||||
<text class="pay-title">{{ item.title }}</text>
|
||||
v-if="!item.disabled">
|
||||
<view class="ss-flex ss-col-center ggbon">
|
||||
<image class="pay-icon"
|
||||
v-if="item.value == 'wechat'"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/f7abe1733a9f4377b85e5c289ac7925f88f3804e563695346549e08ae6086542.png"
|
||||
mode="aspectFit" />
|
||||
<image class="pay-icon"
|
||||
v-if="item.value == 'wallet'"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/0d7fbb299d587542189b204bcfd32e313340c0c956a8187884f7e544b2cad4ae.png"
|
||||
mode="aspectFit" />
|
||||
<view class="new-class">
|
||||
<view class="pay-title">{{ item.title }}</view>
|
||||
<view class="userInfo-money" v-if="item.value == 'wechat'">使用微信快捷支付</view>
|
||||
<view class="userInfo-money ss-m-r-10" v-if="item.value === 'wallet'">
|
||||
可用余额<text class="b">¥{{ fen2yuan(userWallet.balance) }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="check-box ss-flex ss-col-center ss-p-l-10">
|
||||
<view class="userInfo-money ss-m-r-10" v-if="item.value === 'wallet'">
|
||||
余额: {{ fen2yuan(userWallet.balance) }}元
|
||||
</view>
|
||||
<radio
|
||||
:value="item.value"
|
||||
color="var(--ui-BG-Main)"
|
||||
style="transform: scale(0.8)"
|
||||
:disabled="item.disabled"
|
||||
:checked="state.payment === item.value"
|
||||
/>
|
||||
|
||||
<radio :value="item.value" color="var(--ui-BG-Main)" style="transform: scale(0.8)"
|
||||
:disabled="item.disabled" :checked="state.payment === item.value" />
|
||||
</view>
|
||||
</view>
|
||||
</label>
|
||||
@ -61,28 +55,37 @@
|
||||
<button v-else-if="state.payStatus === -1" class="ss-reset-button past-due-btn" disabled>
|
||||
支付已过期
|
||||
</button>
|
||||
<button
|
||||
v-else
|
||||
class="ss-reset-button save-btn"
|
||||
@tap="onPay"
|
||||
:disabled="state.payStatus !== 1"
|
||||
:class="{ 'disabled-btn': state.payStatus !== 1 }"
|
||||
>
|
||||
立即支付
|
||||
<button v-else class="ss-reset-button save-btn" @tap="onPay" :disabled="state.payStatus !== 1"
|
||||
:class="{ 'disabled-btn': state.payStatus !== 1 }">
|
||||
确定支付
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</s-layout>
|
||||
</template>
|
||||
<script setup>
|
||||
import { computed, reactive } from 'vue';
|
||||
import { onLoad } from '@dcloudio/uni-app';
|
||||
import {
|
||||
computed,
|
||||
reactive
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad
|
||||
} from '@dcloudio/uni-app';
|
||||
import sheep from '@/sheep';
|
||||
import { fen2yuan, useDurationTime } from '@/sheep/hooks/useGoods';
|
||||
import {
|
||||
fen2yuan,
|
||||
useDurationTime
|
||||
} from '@/sheep/hooks/useGoods';
|
||||
import PayOrderApi from '@/sheep/api/pay/order';
|
||||
import PayChannelApi from '@/sheep/api/pay/channel';
|
||||
import { getPayMethods } from '@/sheep/platform/pay';
|
||||
|
||||
import {
|
||||
getPayMethods
|
||||
} from '@/sheep/platform/pay';
|
||||
import request from '@/sheep/request';
|
||||
import {
|
||||
baseUrl,
|
||||
apiPath
|
||||
} from '@/sheep/config';
|
||||
const userWallet = computed(() => sheep.$store('user').userWallet);
|
||||
|
||||
// 检测支付环境
|
||||
@ -92,23 +95,55 @@
|
||||
payStatus: 0, // 0=检测支付环境, -2=未查询到支付单信息, -1=支付已过期, 1=待支付,2=订单已支付
|
||||
payMethods: [], // 可选的支付方式
|
||||
payment: '', // 选中的支付方式
|
||||
vip: '' ,//vip卡支付
|
||||
vipid:'',//vip支付id需要
|
||||
cardName:'',//vip卡类型
|
||||
hideWalletPay:false//是否开启余额支付
|
||||
});
|
||||
|
||||
const onPay = () => {
|
||||
if (state.payment === '') {
|
||||
console.log(state.vipid, "sssssssssssss")
|
||||
sheep.$helper.toast('请选择支付方式');
|
||||
return;
|
||||
}
|
||||
if (state.payment === 'wallet') {
|
||||
if (state.vip == "vip") {
|
||||
console.log("-------sssss----")
|
||||
let data = {
|
||||
id: state.vipid,
|
||||
cardName: state.cardName,
|
||||
payChannel: "wallet"
|
||||
}
|
||||
// 定义方法
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/pay/member/update`,
|
||||
method: 'post',
|
||||
data,
|
||||
custom: {
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
console.log(res, "sss")
|
||||
if(res.data){
|
||||
sheep.$helper.toast('开通成功');
|
||||
setTimeout(()=>{
|
||||
sheep.$router.go('/pages/index/user')
|
||||
},1500)
|
||||
}
|
||||
});
|
||||
} else {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确定要支付吗?',
|
||||
success: function (res) {
|
||||
success: function(res) {
|
||||
if (res.confirm) {
|
||||
sheep.$platform.pay(state.payment, state.orderType, state.orderInfo.id);
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
} else {
|
||||
sheep.$platform.pay(state.payment, state.orderType, state.orderInfo.id);
|
||||
}
|
||||
@ -156,7 +191,10 @@
|
||||
// 设置支付订单信息
|
||||
async function setOrder(id) {
|
||||
// 获得支付订单信息
|
||||
const { data, code } = await PayOrderApi.getOrder(id);
|
||||
const {
|
||||
data,
|
||||
code
|
||||
} = await PayOrderApi.getOrder(id);
|
||||
if (code !== 0 || !data) {
|
||||
state.payStatus = -2;
|
||||
return;
|
||||
@ -170,11 +208,15 @@
|
||||
|
||||
// 获得支付方式
|
||||
async function setPayMethods() {
|
||||
const { data, code } = await PayChannelApi.getEnableChannelCodeList(state.orderInfo.appId);
|
||||
const {
|
||||
data,
|
||||
code
|
||||
} = await PayChannelApi.getEnableChannelCodeList(state.orderInfo.appId, state.hideWalletPay);
|
||||
if (code !== 0) {
|
||||
return;
|
||||
}
|
||||
state.payMethods = getPayMethods(data);
|
||||
console.log(state.payMethods,"state.payMethods")
|
||||
}
|
||||
|
||||
onLoad((options) => {
|
||||
@ -188,6 +230,10 @@
|
||||
}
|
||||
// 获得支付订单信息
|
||||
let id = options.id;
|
||||
state.vip = options.type
|
||||
state.vipid = options.vipid
|
||||
state.cardName = options.cardName
|
||||
state.hideWalletPay = options.hideWalletPay
|
||||
if (options.orderType) {
|
||||
state.orderType = options.orderType;
|
||||
}
|
||||
@ -199,8 +245,8 @@
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.pay-icon {
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
margin-right: 26rpx;
|
||||
}
|
||||
|
||||
@ -212,7 +258,7 @@
|
||||
padding: 60rpx 20rpx 40rpx;
|
||||
|
||||
.money-text {
|
||||
color: $red;
|
||||
color: rgba(210, 79, 62);
|
||||
font-size: 46rpx;
|
||||
font-weight: bold;
|
||||
font-family: OPPOSANS;
|
||||
@ -225,7 +271,10 @@
|
||||
|
||||
.time-text {
|
||||
font-size: 26rpx;
|
||||
color: $gray-b;
|
||||
color: rgba(210, 79, 62);
|
||||
background: white;
|
||||
border-radius: 13px;
|
||||
padding:5px 15px;
|
||||
}
|
||||
|
||||
.close-icon {
|
||||
@ -239,11 +288,13 @@
|
||||
|
||||
.modal-content {
|
||||
overflow-y: auto;
|
||||
|
||||
margin:0 12px;
|
||||
background:white;
|
||||
border-radius:8px;
|
||||
.pay-title {
|
||||
font-size: 26rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
color: rgba(157,157,157);
|
||||
}
|
||||
|
||||
.pay-tip {
|
||||
@ -252,8 +303,18 @@
|
||||
}
|
||||
|
||||
.pay-item {
|
||||
height: 86rpx;
|
||||
height: 58px;
|
||||
padding:10px 10px;
|
||||
.ggbon{
|
||||
.new-class{
|
||||
.pay-title{
|
||||
font-size:16px;
|
||||
color:black;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.disabled-pay-item {
|
||||
.pay-title {
|
||||
color: #999999;
|
||||
@ -264,6 +325,10 @@
|
||||
font-size: 26rpx;
|
||||
color: #bbbbbb;
|
||||
line-height: normal;
|
||||
.b{
|
||||
margin-left:10px;
|
||||
color:rgba(230,205,154);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -271,9 +336,11 @@
|
||||
width: 710rpx;
|
||||
height: 80rpx;
|
||||
border-radius: 40rpx;
|
||||
background: linear-gradient(90deg, var(--ui-BG-Main), var(--ui-BG-Main-gradient));
|
||||
// background: linear-gradient(90deg, var(--ui-BG-Main), var(--ui-BG-Main-gradient));
|
||||
background: rgba(210, 79, 62);
|
||||
color: $white;
|
||||
}
|
||||
|
||||
.disabled-btn {
|
||||
background: #e5e5e5;
|
||||
color: #999999;
|
||||
|
@ -101,6 +101,7 @@
|
||||
sheep.$router.go('/pages/pay/index', {
|
||||
id: data.payOrderId,
|
||||
orderType: 'recharge',
|
||||
hideWalletPay:true
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -1,73 +1,92 @@
|
||||
<!-- 支付结果页面 -->
|
||||
<template>
|
||||
<s-layout title="支付结果" :bgStyle="{ color: '#FFF' }">
|
||||
<view class="pay-result-box ss-flex-col ss-row-center ss-col-center">
|
||||
<!-- 信息展示 -->
|
||||
<view class="pay-waiting ss-m-b-30" v-if="payResult === 'waiting'" />
|
||||
<view class="main">
|
||||
<image
|
||||
class="pay-img ss-m-b-30"
|
||||
v-if="payResult === 'success'"
|
||||
:src="sheep.$url.static('/static/img/shop/order/order_pay_success.gif')"
|
||||
/>
|
||||
<image
|
||||
class="pay-img ss-m-b-30"
|
||||
v-if="['failed', 'closed'].includes(payResult)"
|
||||
:src="sheep.$url.static('/static/img/shop/order/order_paty_fail.gif')"
|
||||
/>
|
||||
<view class="tip-text ss-m-b-30" v-if="payResult === 'success'">支付成功</view>
|
||||
<view class="tip-text ss-m-b-30" v-if="payResult === 'failed'">支付失败</view>
|
||||
<view class="tip-text ss-m-b-30" v-if="payResult === 'closed'">该订单已关闭</view>
|
||||
<view class="tip-text ss-m-b-30" v-if="payResult === 'waiting'">检测支付结果...</view>
|
||||
<view class="pay-total-num ss-flex" v-if="payResult === 'success'">
|
||||
<view>¥{{ fen2yuan(state.orderInfo.price) }}</view>
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/7bab925772a5b878b75dcc35e5ebd1d6e6c2e776752554526a71ecd1371c24db.png"
|
||||
class="img" mode=""></image>
|
||||
<view class="title" v-if="payResult === 'success'">订单支付成功</view>
|
||||
<view class="title" v-if="payResult === 'failed'">支付失败</view>
|
||||
<view class="title" v-if="payResult === 'closed'">该订单已关闭</view>
|
||||
<view class="title" v-if="payResult === 'waiting'">检测支付结果...</view>
|
||||
<!-- <view class="title">订单支付成功</view> -->
|
||||
<view class="fgx"></view>
|
||||
<view class="ddxx">
|
||||
<view class="l">
|
||||
订单号
|
||||
</view>
|
||||
|
||||
<!-- 操作区 -->
|
||||
<view class="btn-box ss-flex ss-row-center ss-m-t-50">
|
||||
<button class="back-btn ss-reset-button" @tap="sheep.$router.go('/pages/index/index')">
|
||||
返回首页
|
||||
</button>
|
||||
<button
|
||||
class="check-btn ss-reset-button"
|
||||
v-if="payResult === 'failed'"
|
||||
@tap="
|
||||
sheep.$router.redirect('/pages/pay/index', { id: state.id, orderType: state.orderType })
|
||||
"
|
||||
>
|
||||
<view class="r">
|
||||
{{ state.orderInfo.no }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="ddxx">
|
||||
<view class="l">
|
||||
下单时间
|
||||
</view>
|
||||
<view class="r">
|
||||
{{ sheep.$helper.timeFormat(state.orderInfo.createTime, 'yyyy-mm-dd hh:MM:ss') }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="ddxx">
|
||||
<view class="l">
|
||||
支付方式
|
||||
</view>
|
||||
<view class="r">
|
||||
支付余额
|
||||
</view>
|
||||
</view>
|
||||
<view class="ddxx">
|
||||
<view class="l">
|
||||
支付余额
|
||||
</view>
|
||||
<view class="r">
|
||||
¥{{ fen2yuan(state.orderInfo.price) }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="fgx"></view>
|
||||
<view class="ck-detail" v-if="payResult === 'failed'" @tap="sheep.$router.redirect('/pages/pay/index', { id: state.id, orderType: state.orderType })">
|
||||
重新支付
|
||||
</button>
|
||||
<button class="check-btn ss-reset-button" v-if="payResult === 'success'" @tap="onOrder">
|
||||
查看订单
|
||||
</button>
|
||||
<!-- TODO 芋艿:拼团接入 -->
|
||||
<button
|
||||
class="check-btn ss-reset-button"
|
||||
v-if="payResult === 'success' && state.tradeOrder.type === 3"
|
||||
@tap="sheep.$router.redirect('/pages/activity/groupon/order')"
|
||||
>
|
||||
</view>
|
||||
<view class="ck-detail" v-if="payResult === 'success' && state.tradeOrder.type === 3" @tap="sheep.$router.redirect('/pages/activity/groupon/order')">
|
||||
我的拼团
|
||||
</button>
|
||||
</view>
|
||||
<view class="ck-detail" v-if="payResult === 'success'" @tap="onOrder">
|
||||
查看订单
|
||||
</view>
|
||||
<view class="bk-home" @click="sheep.$router.go('/pages/index/index');">
|
||||
返回首页
|
||||
</view>
|
||||
|
||||
<!-- TODO 芋艿:订阅 -->
|
||||
<!-- #ifdef MP -->
|
||||
<view class="subscribe-box ss-flex ss-m-t-44">
|
||||
<!-- <view class="subscribe-box ss-flex ss-m-t-44">
|
||||
<image class="subscribe-img" :src="sheep.$url.static('/static/img/shop/order/cargo.png')" />
|
||||
<view class="subscribe-title ss-m-r-48 ss-m-l-16">获取实时发货信息与订单状态</view>
|
||||
<view class="subscribe-start" @tap="subscribeMessage">立即订阅</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</s-layout>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onLoad, onHide, onShow } from '@dcloudio/uni-app';
|
||||
import { reactive, computed } from 'vue';
|
||||
import { isEmpty } from 'lodash';
|
||||
import {
|
||||
onLoad,
|
||||
onHide,
|
||||
onShow
|
||||
} from '@dcloudio/uni-app';
|
||||
import {
|
||||
reactive,
|
||||
computed
|
||||
} from 'vue';
|
||||
import {
|
||||
isEmpty
|
||||
} from 'lodash';
|
||||
import sheep from '@/sheep';
|
||||
import PayOrderApi from '@/sheep/api/pay/order';
|
||||
import { fen2yuan } from '../../sheep/hooks/useGoods';
|
||||
import {
|
||||
fen2yuan
|
||||
} from '../../sheep/hooks/useGoods';
|
||||
import OrderApi from '@/sheep/api/trade/order';
|
||||
|
||||
const state = reactive({
|
||||
@ -99,7 +118,10 @@
|
||||
async function getOrderInfo(id) {
|
||||
state.counter++;
|
||||
// 1. 加载订单信息
|
||||
const { data, code } = await PayOrderApi.getOrder(id);
|
||||
const {
|
||||
data,
|
||||
code
|
||||
} = await PayOrderApi.getOrder(id);
|
||||
if (code === 0) {
|
||||
state.orderInfo = data;
|
||||
if (!state.orderInfo || state.orderInfo.status === 30) {
|
||||
@ -115,7 +137,10 @@
|
||||
// #endif
|
||||
// 特殊:获得商品订单信息
|
||||
if (state.orderType === 'goods') {
|
||||
const { data, code } = await OrderApi.getOrder(state.orderInfo.merchantOrderId);
|
||||
const {
|
||||
data,
|
||||
code
|
||||
} = await OrderApi.getOrder(state.orderInfo.merchantOrderId);
|
||||
if (code === 0) {
|
||||
state.tradeOrder = data;
|
||||
}
|
||||
@ -187,101 +212,76 @@
|
||||
state.counter = 0;
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scope>
|
||||
.main {
|
||||
background: white;
|
||||
width: 85%;
|
||||
padding: 15px;
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
border-radius: 12px;
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@keyframes rotation {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
.img {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
margin-top: -52px;
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.score-img {
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
margin: 0 4rpx;
|
||||
}
|
||||
|
||||
.pay-result-box {
|
||||
padding: 60rpx 0;
|
||||
|
||||
.pay-waiting {
|
||||
margin-top: 20rpx;
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
border: 10rpx solid rgb(233, 231, 231);
|
||||
border-bottom-color: rgb(204, 204, 204);
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
// -webkit-animation: rotation 1s linear infinite;
|
||||
animation: rotation 1s linear infinite;
|
||||
}
|
||||
|
||||
.pay-img {
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
}
|
||||
|
||||
.tip-text {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.pay-total-num {
|
||||
font-size: 36rpx;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
font-family: OPPOSANS;
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
width: 100%;
|
||||
|
||||
.back-btn {
|
||||
width: 190rpx;
|
||||
height: 70rpx;
|
||||
font-size: 28rpx;
|
||||
border: 2rpx solid #dfdfdf;
|
||||
border-radius: 35rpx;
|
||||
font-weight: 400;
|
||||
color: #595959;
|
||||
}
|
||||
|
||||
.check-btn {
|
||||
width: 190rpx;
|
||||
height: 70rpx;
|
||||
font-size: 28rpx;
|
||||
border: 2rpx solid #dfdfdf;
|
||||
border-radius: 35rpx;
|
||||
font-weight: 400;
|
||||
color: #595959;
|
||||
margin-left: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.subscribe-box {
|
||||
.subscribe-img {
|
||||
width: 44rpx;
|
||||
height: 44rpx;
|
||||
}
|
||||
|
||||
.subscribe-title {
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
line-height: 36rpx;
|
||||
color: #434343;
|
||||
}
|
||||
|
||||
.subscribe-start {
|
||||
color: var(--ui-BG-Main);
|
||||
.title {
|
||||
text-align: center;
|
||||
font-size: 18px;
|
||||
margin: 15px 0;
|
||||
font-weight: 700;
|
||||
font-size: 32rpx;
|
||||
line-height: 36rpx;
|
||||
}
|
||||
|
||||
.ddxx {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 10px 0;
|
||||
|
||||
.l {
|
||||
font-size: 17px;
|
||||
}
|
||||
|
||||
.r {
|
||||
font-size: 16px;
|
||||
color: rbga(102, 102, 102);
|
||||
}
|
||||
}
|
||||
|
||||
.fgx {
|
||||
margin: 20px 0;
|
||||
height: 1px;
|
||||
width: 100%;
|
||||
background: rgba(239, 239, 239);
|
||||
}
|
||||
|
||||
.ck-detail {
|
||||
// background: rgba(254,92,45);
|
||||
background: rgba(230, 50, 34);
|
||||
padding: 10px 0;
|
||||
color: white;
|
||||
font-size: 19px;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
margin-bottom: 15px;
|
||||
border-radius: 31px;
|
||||
}
|
||||
|
||||
.bk-home {
|
||||
border: 1px solid rgba(230, 50, 34);
|
||||
padding: 10px 0;
|
||||
color: rgba(230, 50, 34);
|
||||
font-size: 19px;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
border-radius: 31px;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
|
@ -5,17 +5,18 @@
|
||||
<view class="card" v-for="(item, index) in reservationList" :key="index">
|
||||
<view class="card-content">
|
||||
<text class="type">预约信息</text>
|
||||
<text class="time">订单日期:{{ sheep.$helper.timeFormat(item.createTime, 'yyyy-mm-dd') }}</text>
|
||||
<text class="time">订单日期:{{ sheep.$helper.timeFormat(item.creatTime, 'yyyy-mm-dd') }}</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="address">预约姓名:<text class="title">{{ item.technicianName }}</text></text>
|
||||
<text class="address">预约电话:<text class="title">{{ item.memberphone }}</text></text>
|
||||
<text class="address">预约姓名:<text class="title">{{ item.name }}</text></text>
|
||||
<text class="address">预约电话:<text class="title">{{ item.phone }}</text></text>
|
||||
<text class="address">预约时间:<text
|
||||
class="title">{{ sheep.$helper.timeFormat(item.reAddTime, 'yyyy-mm-dd') }}</text></text>
|
||||
<text class="address">门店名称:<text class="title">{{ item.brandName }}</text> </text>
|
||||
<div class="address-container">
|
||||
class="title">{{ item.timeQuantum }}</text></text>
|
||||
<text class="address">项目名称:<text class="title">{{ item.projectName }}</text> </text>
|
||||
<text class="address">项目套餐:<text class="title">{{ item.technicianName }}</text> </text>
|
||||
<!-- <div class="address-container">
|
||||
<text class="address">门店地址:<text class="title">{{ item.brandaddress }}</text></text>
|
||||
</div>
|
||||
</div> -->
|
||||
<text class="address">备注留言:<text class="title">{{ item.remark }}</text></text>
|
||||
</view>
|
||||
<view>
|
||||
@ -68,16 +69,17 @@
|
||||
// 定义方法
|
||||
function getList() {
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/h5/reservation/list`,
|
||||
url: `${baseUrl}${apiPath}/h5/reservation/reservationInfo`,
|
||||
method: 'GET',
|
||||
params: {
|
||||
userId: memberId.value,
|
||||
},
|
||||
// params: {
|
||||
// userId: memberId.value,
|
||||
// },
|
||||
custom: {
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
reservationList.value = res.data.list;
|
||||
console.log(res,"-------------")
|
||||
reservationList.value = res.data;
|
||||
});
|
||||
}
|
||||
|
||||
|
193
pages/seeding/seeding.vue
Normal file
193
pages/seeding/seeding.vue
Normal file
@ -0,0 +1,193 @@
|
||||
<template>
|
||||
<s-layout title="社区种草" :bgStyle="{ color: '#fff' }">
|
||||
<view class="seeding">
|
||||
<view class="list" v-for="(item,index) in getData" :key="index">
|
||||
<view class="top">
|
||||
<view class="l">
|
||||
<image :src="item.picUrl" class="img"></image>
|
||||
</view>
|
||||
<view class="r">
|
||||
<view class="name">{{item.nickname}}</view>
|
||||
<view class="time">{{sheep.$helper.timeFormat(item.createTime, 'yyyy-mm-dd hh:MM:ss')}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content">
|
||||
{{item.content}}
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="ck"><image src="https://zysc.fjptzykj.com:3000/shangcheng/fa998f749128876ceba66145c9c543f5650aaa16a71da8123c436ddb45071dc5.png" class="img"></image>{{item.lookCount}}</view>
|
||||
<view class="ck"><image src="https://zysc.fjptzykj.com:3000/shangcheng/6141e7edbc442871fdf4fb321cbb842b41509d0b527338b1b02b6e96ff976dcb.png" class="img"></image>{{item.likeCount}}</view>
|
||||
<view class="ck"><image src="https://zysc.fjptzykj.com:3000/shangcheng/88994efd6eec03acb0b09c38f43ad2b5f78744ec2a99f1ab2bbb6a70c20fd386.png" class="img"></image>{{item.commentCount}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="btn" v-if="isShow">
|
||||
<input class="content_cs" v-model="content"></input>
|
||||
|
||||
<input class="pic content_cs" v-model="picUrl"/>
|
||||
</view>
|
||||
<view class="dd" @click="fabu" v-if="!isShow">
|
||||
我想发布动态
|
||||
</view>
|
||||
<view class="dd" @click="setlist" v-if="isShow">
|
||||
确定
|
||||
</view>
|
||||
</view>
|
||||
</s-layout>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import request from '@/sheep/request';
|
||||
import sheep from '@/sheep';
|
||||
import {
|
||||
baseUrl,
|
||||
apiPath
|
||||
} from '@/sheep/config';
|
||||
import {
|
||||
ref
|
||||
} from 'vue'
|
||||
|
||||
const getData = ref([]);
|
||||
const content = ref('请输入要发送的内容');
|
||||
const picUrl = ref('请输入路径');
|
||||
const isShow = ref(false);
|
||||
|
||||
// 查询项目列表
|
||||
function getlist() {
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/promotion/circle/page`,
|
||||
method: 'GET',
|
||||
params: {
|
||||
// id: this.brandId
|
||||
},
|
||||
custom: {
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
getData.value = res.data.list;
|
||||
});
|
||||
}
|
||||
|
||||
//发布动态按钮
|
||||
function fabu(){
|
||||
isShow.value = !isShow.value
|
||||
}
|
||||
|
||||
// 添加数据
|
||||
function setlist() {
|
||||
console.log(content.value,"content.value")
|
||||
if(!content.value){
|
||||
sheep.$helper.toast('内容不能为空');
|
||||
|
||||
}else if(!picUrl.value){
|
||||
sheep.$helper.toast('头像不能为空');
|
||||
|
||||
}else{
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/promotion/circle/create`,
|
||||
method: 'post',
|
||||
data: {
|
||||
content: content.value,
|
||||
picUrl:picUrl.value
|
||||
},
|
||||
custom: {
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
console.log(res,"是否成功")
|
||||
if(res.data){
|
||||
isShow.value = false;
|
||||
sheep.$helper.toast('提交成功')
|
||||
getlist();
|
||||
}else{
|
||||
sheep.$helper.toast('提交失败')
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
getlist();
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.seeding{
|
||||
.list{
|
||||
background:white;
|
||||
margin:10px;
|
||||
margin-bottom:5px;
|
||||
padding:10px;
|
||||
.top{
|
||||
display:flex;
|
||||
align-items:center;
|
||||
|
||||
.l{
|
||||
margin-right: 10px;
|
||||
.img{
|
||||
width:40px;
|
||||
height:40px;
|
||||
}
|
||||
}
|
||||
.r{
|
||||
.name{
|
||||
font-weight:700;
|
||||
}
|
||||
.time{
|
||||
font-size: 12px;
|
||||
color: rgba(163, 163, 163);
|
||||
}
|
||||
}
|
||||
}
|
||||
.content{
|
||||
margin-top: 10px;
|
||||
}
|
||||
.bottom{
|
||||
display:flex;
|
||||
justify-content: flex-end;
|
||||
.ck{
|
||||
display:flex;
|
||||
align-items: center;
|
||||
margin-right:20px;
|
||||
color: rgba(163, 163, 163);
|
||||
.img{
|
||||
width:20px;
|
||||
height:20px;
|
||||
margin-right:8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn{
|
||||
margin-top:50px;
|
||||
background:white;
|
||||
display:flex;
|
||||
justify-content:center;
|
||||
flex-wrap:wrap;
|
||||
.content_cs{
|
||||
width:100%;
|
||||
text-align:center;
|
||||
padding: 10px;
|
||||
margin:20px 0;
|
||||
margin-bottom:10px;
|
||||
background-color: rgba(246, 246, 246);
|
||||
}
|
||||
.pic{
|
||||
width:100%;
|
||||
text-align:center;
|
||||
}
|
||||
}
|
||||
.dd{
|
||||
width:100%;
|
||||
text-align:center;
|
||||
background:red;
|
||||
color:white;
|
||||
width:50%;
|
||||
margin:0 auto;
|
||||
padding:10px;
|
||||
margin-bottom:30px;
|
||||
border-radius:15px;
|
||||
}
|
||||
</style>
|
@ -32,46 +32,6 @@
|
||||
<image src="@/static/images/dayu.png" class="img"></image>
|
||||
</view>
|
||||
</picker>
|
||||
<!-- 项目选择列表 -->
|
||||
<view class="new-project">
|
||||
<view class="list" @click="onradio(item)" :class="this.techid == item.id ? 'on': ''"
|
||||
v-for="(item, index) in techList" :key="index">
|
||||
<view class="l">
|
||||
<image
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/e940fb45cc53df01980b7069432d5101e104014fbb3cd24862d08c1ffba9df68.png"
|
||||
class='img'></image>
|
||||
</view>
|
||||
<view class="r">
|
||||
<view class="tt">
|
||||
<image class='img img1'
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/d0a91de26065e4753357ed32f301d2ed9c8a9b10e789c9cddf5f5a93903af9da.png">
|
||||
</image>
|
||||
<image class='img img2'
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/f9e69fd9b1e60481f3ba926d1942d65e34c90916329823a16ce703f6fe36b2e9.png">
|
||||
</image>
|
||||
关于UI视觉设计方案需求评审
|
||||
</view>
|
||||
<view class="tt ttr">
|
||||
<image class='img img1'
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/10b4a5f0abb36bb1a4ef71f36ffc867330d34844abd897a59889dc9a61b9c2af.png">
|
||||
</image>
|
||||
<image class='img img2'
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/a4a5541795df5e89912762bfb29900d8ab420abbda2753b2d22741e29e0ea150.png">
|
||||
</image>
|
||||
关于UI视觉设计方案需求评审
|
||||
</view>
|
||||
<view class="tt ttr">
|
||||
<image class='img img1'
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/f197edf433c7c80703de38cf49f9bbef64192de14ec284950a023d68bcad792a.png">
|
||||
</image>
|
||||
<image class='img img2'
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/ca834c977ae99a35db90b5cef48c729c9ce953840a86847cb926d9752f58c0d7.png">
|
||||
</image>
|
||||
关于UI视觉设计方案需求评审
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="title">
|
||||
<image
|
||||
@ -79,7 +39,7 @@
|
||||
class="img"></image>
|
||||
<text class='text'>套餐选择</text>
|
||||
</view>
|
||||
<picker mode="selector" :range="brandNameList" @change="onClinicChange">
|
||||
<picker mode="selector" :range="brandNameList3" @change="onClinicChange3">
|
||||
<view class="clinic-select-value">
|
||||
<text>{{ll3}}</text>
|
||||
<image src="@/static/images/dayu.png" class="img"></image>
|
||||
@ -96,15 +56,9 @@
|
||||
<scroll-view class="scroll-view_H" scroll-x="true" @scroll="scroll" scroll-left="120">
|
||||
<view class="scroll-view-item_H" v-for="(item, index) in dateList" :key="index"
|
||||
@click="selectDate(index)">
|
||||
<view class="date-item" v-if="addDate==item.addDate"
|
||||
style="background-color: rgba(228,241,255);border: 1px solid rgba(3,150,248);">
|
||||
<text class="date" style="color: black;">{{ item.formattedDate }}</text>
|
||||
<text class="weekday" style="color: rgba(82,82,2,83);">{{ item.weekday }}</text>
|
||||
</view>
|
||||
<view class="date-item" v-if="addDate!=item.addDate">
|
||||
|
||||
<text class="date">{{ item.formattedDate }}</text>
|
||||
<text class="weekday">{{ item.weekday }}</text>
|
||||
<view class="date-item" :class="brandId4 == item.id ? 'on':''">
|
||||
<text class="date" style="color: black;">{{ item.days.slice(5) }}</text>
|
||||
<text class="weekday" style="color: rgba(82,82,2,83);">{{ item.week }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
@ -119,27 +73,19 @@
|
||||
</view>
|
||||
|
||||
<view class="date-list">
|
||||
<view class="new-nei" v-for="(item, index) in serviceTime" :key="index">
|
||||
<view class="date-list-new" @click="selecthsstr(index)" :class="hsstr==item.str ? 'on':''">
|
||||
<view class="date-itemstr" v-if="hsstr==item.str">
|
||||
<text class="weekday">{{ item.str }}</text>
|
||||
</view>
|
||||
<view class="new-nei" v-for="(item, index) in brandList4" :key="index">
|
||||
<view class="date-list-new" @click="selecthsstr(index,item.status)"
|
||||
:class="{'on' : brandId5 == item.id,'hui' : item.status == 0}" v-if="brandList3.length>0">
|
||||
<view class="date-itemstr">
|
||||
<view class="weekday">{{ item.timeQuantum }}</view>
|
||||
|
||||
<view v-if="item.ym==='true'" class="new-jk">
|
||||
<view class="date-itemym" v-if="hsstr!=item.str">
|
||||
<text class="weekdayym">约满</text><br />
|
||||
<text class="weekday">{{ item.str }}</text>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="item.ym==='false'" class="new-jk">
|
||||
<view class="date-itemstr" v-if="hsstr!=item.str">
|
||||
<text class="weekday">{{ item.str }}</text>
|
||||
</view>
|
||||
<view class="weekday">剩余{{item.residueNumber}}</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="clear:both;"></view>
|
||||
</view>
|
||||
|
||||
<view class="title" style="margin-top:10px;">
|
||||
@ -151,43 +97,20 @@
|
||||
|
||||
<view class="yyxx-input">
|
||||
<view class="name">
|
||||
姓名:<input class="int" placeholder="请输入您的名字" placeholder-style="color:rgba(204,204,204)" />
|
||||
姓名:<input class="int" v-model="name" placeholder="请输入您的名字"
|
||||
placeholder-style="color:rgba(204,204,204)" />
|
||||
</view>
|
||||
<view class="phone">
|
||||
电话:<input class="int" placeholder="请输入您的电话" placeholder-style="color:rgba(204,204,204)" />
|
||||
电话:<input class="int" v-model="phone" placeholder="请输入您的电话"
|
||||
placeholder-style="color:rgba(204,204,204)" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="footer" @click="handleSubmit">
|
||||
<view class="footer" @click="brandlists9">
|
||||
立即预约
|
||||
</view>
|
||||
</view>
|
||||
<view class="container">
|
||||
<radio-group>
|
||||
<view class="doctor-list">
|
||||
<!-- {{techList}} -->
|
||||
<view class="doctor-card" v-for="(item, index) in techList" :key="index">
|
||||
<view class="doctor-info">
|
||||
<image class="doctor-avatar" :src="'https://sfyjk.com/api'+item.photo" mode="aspectFill">
|
||||
</image>
|
||||
<text class="doctor-name">{{ item.technicianName }}</text>
|
||||
<text class="doctor-name" style="float: right;margin-right: 20px;">{{item.typeName}}</text>
|
||||
|
||||
<!-- <text class="doctor-specialty" v-if="item.content">介绍: {{item.content.substr(0, 20)}}...</text> -->
|
||||
</view>
|
||||
<radio style="float: right;" :value="item.id" @click="onradio(item)" :checked="index==0">
|
||||
</radio>
|
||||
<div v-if="techid == item.id">
|
||||
<view class="info-title">服务范围</view>
|
||||
<rich-text style="white-space: pre-wrap;" :nodes="item.serviceScope"></rich-text>
|
||||
<view class="info-title">介绍</view>
|
||||
<rich-text style="white-space: pre-wrap;" :nodes="item.content"></rich-text>
|
||||
</div>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</radio-group>
|
||||
</view>
|
||||
<fui-toast ref="toast"></fui-toast>
|
||||
</s-layout>
|
||||
</template>
|
||||
|
||||
@ -234,10 +157,15 @@
|
||||
brandList: [], //门店列表数据
|
||||
brandList2: [], //项目列表数据
|
||||
brandList3: [], //套餐列表数据
|
||||
brandNameList: [],//门店列表
|
||||
brandNameList2: [],//项目列表
|
||||
brandNameList3: [],//套餐列表
|
||||
brandId: "",//门店当前选中id
|
||||
brandList4: [], //时段列表数据
|
||||
brandNameList: [], //门店列表
|
||||
brandNameList2: [], //项目列表
|
||||
brandNameList3: [], //套餐列表
|
||||
brandId: "", //门店当前选中id
|
||||
brandId2: "", //项目当前选中id
|
||||
brandId3: "", //套餐当前选中id
|
||||
brandId4: "", //预约日期当前选中id
|
||||
brandId5: "", //时段当前选中id
|
||||
brandName: "",
|
||||
selectedDayIndex: 0,
|
||||
selecttypeIndex: 0,
|
||||
@ -246,46 +174,75 @@
|
||||
ll: '请选择',
|
||||
ll2: '请选择',
|
||||
ll3: '请选择',
|
||||
gg: '请选择'
|
||||
ll5: '请选择', //时间段日常显示
|
||||
ll6: '请选择', //时间段日常显示
|
||||
gg: '请选择',
|
||||
dateIndex: '', //时间的状态
|
||||
name: '',
|
||||
phone: ''
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.isLogin = computed(() => sheep.$store('user').isLogin);
|
||||
this.memberId = computed(() => sheep.$store('user').userInfo).value.id
|
||||
this.brandlists();//调用门店列表
|
||||
// this.brandlists2();//调用项目列表
|
||||
// this.brandlists3();//调用套餐列表
|
||||
this.generateDateList();
|
||||
this.addDate = this.dateList[0].addDate;
|
||||
this.gettypeList();
|
||||
console.log(apiPath, baseUrl, "import.meta.env.SHOPRO_API_PATH")
|
||||
this.brandlists(); //调用门店列表
|
||||
|
||||
},
|
||||
methods: {
|
||||
onClinicChange(event) {
|
||||
|
||||
this.brandId = ''
|
||||
this.brandId2 = ''
|
||||
this.brandId3 = ''
|
||||
this.brandId4 = ''
|
||||
this.brandId5 = ''
|
||||
this.name = ''
|
||||
this.phone = ''
|
||||
this.ll2 = '请选择'
|
||||
this.ll3 = '请选择'
|
||||
this.brandNameList2 = []
|
||||
this.brandNameList3 = []
|
||||
this.dateList = []
|
||||
this.brandList3 = []
|
||||
|
||||
const selectedClinicIndex = event.detail.value;
|
||||
this.selectedClinicIndex = selectedClinicIndex;
|
||||
this.ll = this.brandList[selectedClinicIndex].name
|
||||
// console.log("dddddddddddd")
|
||||
// this.ll = this.brandList.list[selectedClinicIndex].name
|
||||
this.brandId = this.brandList[selectedClinicIndex].id
|
||||
this.brandlists2();
|
||||
},
|
||||
onClinicChange2(event) {
|
||||
|
||||
this.brandId3 = ''
|
||||
this.brandId4 = ''
|
||||
this.brandId5 = ''
|
||||
this.name = ''
|
||||
this.phone = ''
|
||||
this.ll3 = '请选择'
|
||||
this.brandNameList3 = []
|
||||
this.dateList = []
|
||||
this.brandList3 = []
|
||||
|
||||
const selectedClinicIndex = event.detail.value;
|
||||
this.selectedClinicIndex2 = selectedClinicIndex;
|
||||
this.ll2 = this.brandList2[selectedClinicIndex].name
|
||||
// this.brandId = this.brandList.list[selectedClinicIndex].id
|
||||
console.log("------onClinicChange2------")
|
||||
// this.ll = this.brandList.list[selectedClinicIndex].name
|
||||
// this.technicianList();
|
||||
this.brandId2 = this.brandList2[selectedClinicIndex].id
|
||||
this.setDate();
|
||||
this.brandlists3();
|
||||
},
|
||||
onClinicChange3(event) {
|
||||
|
||||
|
||||
const selectedClinicIndex = event.detail.value;
|
||||
this.selectedClinicIndex3 = selectedClinicIndex;
|
||||
this.ll3 = this.brandList3[selectedClinicIndex].name
|
||||
this.brandId3 = this.brandList3[selectedClinicIndex].id
|
||||
},
|
||||
ontype(event) {
|
||||
const selecttypeIndex = event.detail.value;
|
||||
this.selecttypeIndex = selecttypeIndex;
|
||||
this.typename = this.typeList[selecttypeIndex].dictValue
|
||||
this.type = this.typeList[selecttypeIndex].value
|
||||
console.log(this.type, "this.type")
|
||||
this.gg = this.typeList[selecttypeIndex].label
|
||||
this.technicianList();
|
||||
},
|
||||
@ -306,6 +263,8 @@
|
||||
},
|
||||
// 查询项目列表
|
||||
brandlists2() {
|
||||
this.brandNameList2 = [];
|
||||
this.brandList2 = [];
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/h5/project/getProject`,
|
||||
method: 'GET',
|
||||
@ -316,231 +275,153 @@
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
// this.brandList2 = res.data
|
||||
console.log(res,"------brandList2------")
|
||||
// for (var i = 0; i < this.brandList2.length; i++) {
|
||||
// this.brandNameList2.push(this.brandList2[i].name)
|
||||
// }
|
||||
this.brandList2 = res.data
|
||||
for (var i = 0; i < this.brandList2.length; i++) {
|
||||
this.brandNameList2.push(this.brandList2[i].name)
|
||||
}
|
||||
});
|
||||
},
|
||||
// 查询套餐列表
|
||||
brandlists3() {
|
||||
// 查询日期列表
|
||||
setDate() {
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/h5/technician/getTecchnician`,
|
||||
url: `${baseUrl}${apiPath}/h5/projectday/getProjectday`,
|
||||
method: 'GET',
|
||||
params: {
|
||||
id: this.brandId2
|
||||
},
|
||||
custom: {
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
this.dateList = res.data;
|
||||
});
|
||||
},
|
||||
// 查询套餐列表
|
||||
brandlists3() {
|
||||
this.brandList3 = []
|
||||
this.brandNameList3 = []
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/h5/technician/getTechnician`,
|
||||
method: 'GET',
|
||||
params: {
|
||||
id: this.brandId2
|
||||
},
|
||||
custom: {
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
if (res) {
|
||||
|
||||
}
|
||||
this.brandList3 = res.data
|
||||
for (var i = 0; i < this.brandList3.length; i++) {
|
||||
this.brandNameList3.push(this.brandList3[i].name)
|
||||
}
|
||||
});
|
||||
},
|
||||
gettypeList() {
|
||||
// 查询预约时段列表
|
||||
brandlists4() {
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/h5/reservation/type`,
|
||||
method: 'GET',
|
||||
custom: {
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
console.log(res, "typeListtypeList")
|
||||
this.typeList = res.data
|
||||
for (var i = 0; i < this.typeList.length; i++) {
|
||||
this.typenameList.push(this.typeList[i].label);
|
||||
}
|
||||
console.log(this.typenameList)
|
||||
});
|
||||
},
|
||||
// 查询医生列表
|
||||
technicianList() {
|
||||
console.log("有没有进来technicianList");
|
||||
this.techid = null,
|
||||
this.serviceTime = []
|
||||
this.hsstr = ""
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/h5/technician/list`,
|
||||
url: `${baseUrl}${apiPath}/h5/configuration/getConfiguration`,
|
||||
method: 'GET',
|
||||
params: {
|
||||
type: this.type,
|
||||
brandId: this.brandId
|
||||
projectdayId: this.brandId4,
|
||||
technicianId: this.brandId3
|
||||
},
|
||||
custom: {
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
console.log(res)
|
||||
this.techList = res.data.list
|
||||
console.log(this.techList)
|
||||
if (this.techList.length > 0) {
|
||||
this.techid = this.techList[0].id
|
||||
var item = {
|
||||
id: this.techid
|
||||
}
|
||||
this.onradio(item);
|
||||
}
|
||||
|
||||
console.log(this.techList)
|
||||
this.brandList4 = res.data
|
||||
});
|
||||
},
|
||||
|
||||
onradio(item) {
|
||||
this.techid = item.id
|
||||
this.serviceTime = []
|
||||
this.hsstr = ""
|
||||
// 提交表单接口
|
||||
brandlists9() {
|
||||
if (!this.brandId) {
|
||||
sheep.$helper.toast('请选择门店')
|
||||
} else if (!this.brandId2) {
|
||||
sheep.$helper.toast('请选择项目')
|
||||
} else if (!this.brandId3) {
|
||||
sheep.$helper.toast('请选择套餐')
|
||||
} else if (!this.brandId4) {
|
||||
sheep.$helper.toast('请选择预约日期')
|
||||
} else if (!this.brandId5) {
|
||||
sheep.$helper.toast('请选择预约时段')
|
||||
} else if (!this.name) {
|
||||
sheep.$helper.toast('请填写姓名')
|
||||
} else if (!this.phone) {
|
||||
sheep.$helper.toast('请填写电话')
|
||||
} else {
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/h5/technician/h5xq`,
|
||||
url: `${baseUrl}${apiPath}/h5/reservation/addReservation`,
|
||||
method: 'GET',
|
||||
params: {
|
||||
addDate: this.addDate,
|
||||
id: this.techid
|
||||
brandId: this.brandId,
|
||||
projectId: this.brandId2,
|
||||
technicianId: this.brandId3,
|
||||
projectdayId: this.brandId4,
|
||||
timeId: this.brandId5,
|
||||
name: this.name,
|
||||
phone: this.phone
|
||||
},
|
||||
custom: {
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
console.log(res);
|
||||
var serviceTime = JSON.parse(res.data.serviceTime)
|
||||
console.log(serviceTime, "serviceTimeserviceTimeserviceTime")
|
||||
if (serviceTime) {
|
||||
for (let i = 0; i < serviceTime.length; i++) {
|
||||
console.log(serviceTime[i].end)
|
||||
console.log(serviceTime[i].start)
|
||||
console.log(serviceTime[i].ym)
|
||||
if (serviceTime[i].end && serviceTime[i].start) {
|
||||
this.sjd = {},
|
||||
this.sjd.str = serviceTime[i].start.toString() + "-" + serviceTime[
|
||||
i].end.toString()
|
||||
this.sjd.ym = serviceTime[i].ym
|
||||
this.serviceTime.push(this.sjd)
|
||||
if (res.code == 0) {
|
||||
|
||||
|
||||
sheep.$router.go('/pages/subscribe/success_tolse', {
|
||||
brandId: this.ll, //门店名称
|
||||
projectId: this.ll2, //项目名称
|
||||
technicianId: this.ll3, //套餐名称
|
||||
projectdayId: this.ll5, //预约日期
|
||||
timeId: this.ll6, //预约时段
|
||||
name: this.name, //名字
|
||||
phone: this.phone //电话
|
||||
})
|
||||
|
||||
|
||||
|
||||
// let options = {}
|
||||
//提示信息
|
||||
// options.text = '提交成功';
|
||||
//图标图片地址
|
||||
// options.src = "https://zysc.fjptzykj.com:3000/shangcheng/44252dee36b3ba686967c33e911b15c565f5ccc4c7b2a9f56e43418da949b7c2.png";
|
||||
// this.$refs.toast.show(options)
|
||||
// setTimeout(()=>{
|
||||
// sheep.$router.go('/pages/index/user')
|
||||
// },1000)
|
||||
}
|
||||
}
|
||||
}
|
||||
console.log(this.serviceTime, "this.serviceTime")
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
selectDay(index) {
|
||||
this.selectedDayIndex = index;
|
||||
},
|
||||
handleSwiperChange(event) {
|
||||
this.selectedDayIndex = event.mp.detail.current;
|
||||
},
|
||||
formatDate(date) {
|
||||
const options = {
|
||||
month: "2-digit",
|
||||
day: "2-digit"
|
||||
};
|
||||
return date.toLocaleDateString("en-US", options);
|
||||
},
|
||||
handleSubmit() {
|
||||
this.memberId = computed(() => sheep.$store('user').userInfo).value.id
|
||||
if (!this.memberId) {
|
||||
if (sheep.$platform.name === 'WechatMiniProgram') {
|
||||
// showAuthModal('wechatMiniLogin')
|
||||
// 删除前五位数字
|
||||
delete(val) {},
|
||||
//查看时段接口
|
||||
selectDate(index) {
|
||||
if (this.brandId3 == '') {
|
||||
sheep.$helper.toast('请先选择套餐')
|
||||
return;
|
||||
}
|
||||
showAuthModal('accountLogin')
|
||||
} else {
|
||||
this.memberId = computed(() => sheep.$store('user').userInfo).value.id
|
||||
if (!this.brandId) {
|
||||
sheep.$helper.toast('请选择医馆')
|
||||
} else if (!this.techid) {
|
||||
sheep.$helper.toast('请选择技师')
|
||||
} else if (!this.addDate) {
|
||||
sheep.$helper.toast('请选择预约时间')
|
||||
} else if (!this.hsstr) {
|
||||
sheep.$helper.toast('请选择预约时间段')
|
||||
} else if (this.memberId) {
|
||||
request({
|
||||
url: `${baseUrl}/app-api/h5/reservation/add`,
|
||||
method: 'post',
|
||||
params: {
|
||||
type: this.type,
|
||||
brandId: this.brandId,
|
||||
technicianId: this.techid,
|
||||
reAddTime: this.addDate,
|
||||
hsstr: this.hsstr,
|
||||
userId: this.memberId,
|
||||
this.dateIndex = index;
|
||||
this.brandId4 = this.dateList[index].id;
|
||||
this.ll5 = this.dateList[index].days;
|
||||
this.brandlists4();
|
||||
},
|
||||
custom: {
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
uni.showModal({
|
||||
title: '预约提示',
|
||||
content: '预约成功!',
|
||||
success: function(res) {
|
||||
if (res.confirm) {
|
||||
uni.switchTab({
|
||||
url: '/pages/index/user'
|
||||
});
|
||||
} else {
|
||||
uni.switchTab({
|
||||
url: '/pages/index/user'
|
||||
});
|
||||
selecthsstr(index, status) {
|
||||
console.log(this.brandList4[index].timeQuantum, "查看时段")
|
||||
if (status == 0) {
|
||||
this.brandId5 = '';
|
||||
sheep.$helper.toast('该时间段已约满')
|
||||
return;
|
||||
}
|
||||
this.brandId5 = this.brandList4[index].id;
|
||||
this.ll6 = this.brandList4[index].timeQuantum;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
console.log("立即预约");
|
||||
},
|
||||
|
||||
|
||||
generateDateList() {
|
||||
const weekDays = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
|
||||
const today = new Date();
|
||||
for (let i = 0; i < 7; i++) {
|
||||
const date = new Date(today);
|
||||
date.setDate(date.getDate() + i);
|
||||
const formattedDate =
|
||||
// `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')}`;
|
||||
`${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')}`;
|
||||
const weekday = weekDays[date.getDay()];
|
||||
const addDate =
|
||||
`${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')}`;
|
||||
this.dateList.push({
|
||||
date,
|
||||
formattedDate,
|
||||
addDate,
|
||||
weekday
|
||||
});
|
||||
}
|
||||
},
|
||||
selectDate(index) {
|
||||
this.addDate = this.dateList[index].addDate
|
||||
if (this.techid) {
|
||||
var item = {
|
||||
id: this.techid
|
||||
}
|
||||
this.onradio(item);
|
||||
}
|
||||
|
||||
// 处理选中日期的逻辑,例如触发事件、更新状态等
|
||||
console.log('Selected date:', this.addDate);
|
||||
},
|
||||
selecthsstr(index) {
|
||||
console.log(this.serviceTime[index].str)
|
||||
console.log(this.serviceTime[index].ym)
|
||||
if (this.serviceTime[index].ym === "true") {
|
||||
|
||||
} else if (this.serviceTime[index].ym === "false") {
|
||||
this.hsstr = this.serviceTime[index].str
|
||||
}
|
||||
|
||||
// 处理选中日期的逻辑,例如触发事件、更新状态等
|
||||
console.log('this.serviceTimesss:', this.serviceTime[index].ym);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@ -728,22 +609,28 @@
|
||||
border-radius: 6px;
|
||||
|
||||
&.on {
|
||||
background: rgb(0, 149, 248);
|
||||
|
||||
.date-itemstr {
|
||||
|
||||
// background-color: #ff5541;
|
||||
.weekday {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
background: #e4f1ff;
|
||||
|
||||
.date-itemstr {
|
||||
|
||||
// background-color: #ff5541;
|
||||
.weekday {}
|
||||
}
|
||||
}
|
||||
|
||||
&.hui {
|
||||
user-select: none;
|
||||
background: #f6f6f6;
|
||||
}
|
||||
|
||||
.date-itemstr {
|
||||
|
||||
// background-color: #ff5541;
|
||||
.weekday {
|
||||
color: black;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.new-jk {
|
||||
.date-itemym {
|
||||
@ -766,27 +653,33 @@
|
||||
border-radius: 8px;
|
||||
float: left;
|
||||
margin: 5px;
|
||||
padding: 5px;
|
||||
width: 26px;
|
||||
height: 30px;
|
||||
border: 1px solid rgba(229, 229, 229);
|
||||
padding: 8px 0;
|
||||
width: 59px;
|
||||
height: 46px;
|
||||
border: 1px solid #e5e5e5;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
background-color: white;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
|
||||
&:hover {
|
||||
// background-color: #ff5541;
|
||||
}
|
||||
|
||||
&.on {
|
||||
background-color: rgba(228, 241, 255);
|
||||
border: 1px solid rgba(3, 150, 248);
|
||||
}
|
||||
|
||||
.date {
|
||||
font-size: 8px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.weekday {
|
||||
margin-top: 5px;
|
||||
font-size: 10px;
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
|
177
pages/subscribe/success_tolse.vue
Normal file
177
pages/subscribe/success_tolse.vue
Normal file
@ -0,0 +1,177 @@
|
||||
<template>
|
||||
<s-layout title="预约成功" :bgStyle="{ color: '#fff' }">
|
||||
<view class="main">
|
||||
<view class="main-t">
|
||||
<view class="img-t">
|
||||
<image
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/ab5eb1046be1b2d98fbab61cd1925301725b7a6d2d263fc22ea1a788e39df38d.png"
|
||||
class="img"></image>
|
||||
</view>
|
||||
<view class="img-b">
|
||||
预约成功
|
||||
</view>
|
||||
</view>
|
||||
<view class="main-b">
|
||||
<view class="list">
|
||||
<view class="name">姓名</view>
|
||||
<view class="name-value">{{ item.name }}</view>
|
||||
</view>
|
||||
<view class="list">
|
||||
<view class="name">电话</view>
|
||||
<view class="name-value">{{ item.phone }}</view>
|
||||
</view>
|
||||
<view class="list">
|
||||
<view class="name">预约门店</view>
|
||||
<view class="name-value">{{item.brandId}}</view>
|
||||
</view>
|
||||
<view class="list">
|
||||
<view class="name">项目套餐</view>
|
||||
<view class="name-value">{{item.projectId}} {{ item.technicianId }}</view>
|
||||
</view>
|
||||
<view class="list">
|
||||
<view class="name">预约时间</view>
|
||||
<view class="name-value">{{ item.projectdayId }} {{item.timeId}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="btn" @click="sheep.$router.go('/pages/index/user')">
|
||||
确认
|
||||
</view>
|
||||
</s-layout>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
ref,
|
||||
computed,
|
||||
onMounted
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad
|
||||
} from '@dcloudio/uni-app';
|
||||
import request from '@/sheep/request';
|
||||
import {
|
||||
baseUrl,
|
||||
apiPath
|
||||
} from '@/sheep/config';
|
||||
import sheep from '@/sheep';
|
||||
export default {
|
||||
setup() {
|
||||
// 使用 ref 创建响应式数据
|
||||
const memberId = ref(null);
|
||||
const reservationList = ref([]);
|
||||
const page = ref(1);
|
||||
const limit = ref(10);
|
||||
const totalPages = ref(1);
|
||||
const item = ref({});
|
||||
|
||||
// 使用 computed 创建计算属性
|
||||
const userInfo = computed(() => sheep.$store('user').userInfo);
|
||||
memberId.value = userInfo.value.id;
|
||||
|
||||
// 使用 onMounted 生命周期钩子
|
||||
onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
onLoad((options) => {
|
||||
if (options) {
|
||||
item.value = options;
|
||||
console.log(item.value,"-------------------")
|
||||
}
|
||||
});
|
||||
// 定义方法
|
||||
function getList() {
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/h5/reservation/reservationInfo`,
|
||||
method: 'GET',
|
||||
custom: {
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
reservationList.value = res.data;
|
||||
});
|
||||
}
|
||||
|
||||
// 将响应式数据和方法暴露给模板
|
||||
return {
|
||||
memberId,
|
||||
reservationList,
|
||||
page,
|
||||
limit,
|
||||
totalPages,
|
||||
getList,
|
||||
sheep,
|
||||
item
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scope lang="scss">
|
||||
.main {
|
||||
background: white;
|
||||
margin: 15px 15px;
|
||||
border-radius: 12px;
|
||||
padding-bottom: 10px;
|
||||
|
||||
.main-t {
|
||||
.img-t {
|
||||
padding-bottom: 20px;
|
||||
|
||||
.img {
|
||||
width: 143px;
|
||||
height: 106px;
|
||||
display: block;
|
||||
margin: 10px auto;
|
||||
padding-top: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
.img-b {
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
font-weight: 700;
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
border-bottom: 1px solid rgba(233, 233, 233);
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.main-b {
|
||||
margin: 10px auto;
|
||||
width: 90%;
|
||||
margin-top: 40px;
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
margin:10px 0;
|
||||
.name {
|
||||
font-size: 17px;
|
||||
color: rgba(101, 101, 101);
|
||||
}
|
||||
|
||||
.name-value {
|
||||
font-size: 17px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
position: absolute;
|
||||
bottom: 60px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
border-radius: 16px;
|
||||
background: rgba(0, 149, 248);
|
||||
text-align: center;
|
||||
color: white;
|
||||
width: 89%;
|
||||
padding: 10px 0;
|
||||
}
|
||||
</style>
|
@ -1,70 +1,34 @@
|
||||
<!-- 收货地址的新增/编辑 -->
|
||||
<template>
|
||||
<s-layout :title="state.model.id ? '编辑地址' : '新增地址'">
|
||||
<uni-forms
|
||||
ref="addressFormRef"
|
||||
v-model="state.model"
|
||||
:rules="rules"
|
||||
validateTrigger="bind"
|
||||
labelWidth="160"
|
||||
labelAlign="left"
|
||||
border
|
||||
:labelStyle="{ fontWeight: 'bold' }"
|
||||
>
|
||||
<uni-forms ref="addressFormRef" v-model="state.model" :rules="rules" validateTrigger="bind" labelWidth="160"
|
||||
labelAlign="left" border :labelStyle="{ fontWeight: 'bold' }">
|
||||
<view class="bg-white form-box ss-p-x-30">
|
||||
<uni-forms-item name="name" label="收货人" class="form-item">
|
||||
<uni-easyinput
|
||||
v-model="state.model.name"
|
||||
placeholder="请填写收货人姓名"
|
||||
:inputBorder="false"
|
||||
placeholderStyle="color:#BBBBBB;font-size:30rpx;font-weight:400;line-height:normal"
|
||||
/>
|
||||
<uni-easyinput v-model="state.model.name" placeholder="请填写收货人姓名" :inputBorder="false"
|
||||
placeholderStyle="color:#BBBBBB;font-size:30rpx;font-weight:400;line-height:normal" />
|
||||
</uni-forms-item>
|
||||
|
||||
<uni-forms-item name="mobile" label="手机号" class="form-item">
|
||||
<uni-easyinput
|
||||
v-model="state.model.mobile"
|
||||
type="number"
|
||||
placeholder="请输入手机号"
|
||||
:inputBorder="false"
|
||||
placeholderStyle="color:#BBBBBB;font-size:30rpx;font-weight:400;line-height:normal"
|
||||
>
|
||||
<uni-easyinput v-model="state.model.mobile" type="number" placeholder="请输入手机号" :inputBorder="false"
|
||||
placeholderStyle="color:#BBBBBB;font-size:30rpx;font-weight:400;line-height:normal">
|
||||
</uni-easyinput>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item
|
||||
name="areaName"
|
||||
label="省市区"
|
||||
@tap="state.showRegion = true"
|
||||
class="form-item"
|
||||
>
|
||||
<uni-easyinput
|
||||
v-model="state.model.areaName"
|
||||
disabled
|
||||
:inputBorder="false"
|
||||
<uni-forms-item name="areaName" label="省市区" @tap="state.showRegion = true" class="form-item">
|
||||
<uni-easyinput v-model="state.model.areaName" disabled :inputBorder="false"
|
||||
:styles="{ disableColor: '#fff', color: '#333' }"
|
||||
placeholderStyle="color:#BBBBBB;font-size:30rpx;font-weight:400;line-height:normal"
|
||||
placeholder="请选择省市区"
|
||||
>
|
||||
placeholder="请选择省市区">
|
||||
<template v-slot:right>
|
||||
<uni-icons type="right" />
|
||||
</template>
|
||||
</uni-easyinput>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item
|
||||
name="detailAddress"
|
||||
label="详细地址"
|
||||
:formItemStyle="{ alignItems: 'flex-start' }"
|
||||
:labelStyle="{ lineHeight: '5em' }"
|
||||
class="textarea-item"
|
||||
>
|
||||
<uni-easyinput
|
||||
:inputBorder="false"
|
||||
type="textarea"
|
||||
v-model="state.model.detailAddress"
|
||||
<uni-forms-item name="detailAddress" label="详细地址" :formItemStyle="{ alignItems: 'flex-start' }"
|
||||
:labelStyle="{ lineHeight: '5em' }" class="textarea-item">
|
||||
<uni-easyinput :inputBorder="false" type="textarea" v-model="state.model.detailAddress"
|
||||
placeholderStyle="color:#BBBBBB;font-size:30rpx;font-weight:400;line-height:normal"
|
||||
placeholder="请输入详细地址"
|
||||
clearable
|
||||
/>
|
||||
placeholder="请输入详细地址" clearable />
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
<view class="ss-m-y-20 bg-white ss-p-x-30 ss-flex ss-row-between ss-col-center default-box">
|
||||
@ -84,20 +48,24 @@
|
||||
</su-fixed>
|
||||
|
||||
<!-- 省市区弹窗 -->
|
||||
<su-region-picker
|
||||
:show="state.showRegion"
|
||||
@cancel="state.showRegion = false"
|
||||
@confirm="onRegionConfirm"
|
||||
/>
|
||||
<su-region-picker :show="state.showRegion" @cancel="state.showRegion = false" @confirm="onRegionConfirm" />
|
||||
</s-layout>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, unref } from 'vue';
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
unref
|
||||
} from 'vue';
|
||||
import sheep from '@/sheep';
|
||||
import { onLoad } from '@dcloudio/uni-app';
|
||||
import {
|
||||
onLoad
|
||||
} from '@dcloudio/uni-app';
|
||||
import _ from 'lodash';
|
||||
import { mobile } from '@/sheep/validate/form';
|
||||
import {
|
||||
mobile
|
||||
} from '@/sheep/validate/form';
|
||||
import AreaApi from '@/sheep/api/system/area';
|
||||
import AddressApi from '@/sheep/api/member/address';
|
||||
|
||||
@ -105,40 +73,31 @@
|
||||
const state = reactive({
|
||||
showRegion: false,
|
||||
model: {
|
||||
name: '',
|
||||
mobile: '',
|
||||
detailAddress: '',
|
||||
|
||||
defaultStatus: false,
|
||||
areaName: '',
|
||||
},
|
||||
rules: {},
|
||||
});
|
||||
|
||||
const rules = {
|
||||
name: {
|
||||
rules: [
|
||||
{
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '请输入收货人姓名',
|
||||
},
|
||||
],
|
||||
}, ],
|
||||
},
|
||||
mobile,
|
||||
detailAddress: {
|
||||
rules: [
|
||||
{
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '请输入详细地址',
|
||||
},
|
||||
],
|
||||
}, ],
|
||||
},
|
||||
areaName: {
|
||||
rules: [
|
||||
{
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '请选择您的位置',
|
||||
},
|
||||
],
|
||||
}, ],
|
||||
},
|
||||
};
|
||||
|
||||
@ -176,10 +135,12 @@
|
||||
const formData = {
|
||||
...state.model,
|
||||
};
|
||||
const { code } =
|
||||
state.model.id > 0
|
||||
? await AddressApi.updateAddress(formData)
|
||||
: await AddressApi.createAddress(formData);
|
||||
const {
|
||||
code
|
||||
} =
|
||||
state.model.id > 0 ?
|
||||
await AddressApi.updateAddress(formData) :
|
||||
await AddressApi.createAddress(formData);
|
||||
if (code === 0) {
|
||||
sheep.$router.back();
|
||||
}
|
||||
@ -190,11 +151,13 @@
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确认删除此收货地址吗?',
|
||||
success: async function (res) {
|
||||
success: async function(res) {
|
||||
if (!res.confirm) {
|
||||
return;
|
||||
}
|
||||
const { code } = await AddressApi.deleteAddress(state.model.id);
|
||||
const {
|
||||
code
|
||||
} = await AddressApi.deleteAddress(state.model.id);
|
||||
if (code === 0) {
|
||||
sheep.$router.back();
|
||||
}
|
||||
@ -207,7 +170,10 @@
|
||||
getAreaData();
|
||||
// 情况一:基于 id 获得收件地址
|
||||
if (options.id) {
|
||||
let { code, data } = await AddressApi.getAddress(options.id);
|
||||
let {
|
||||
code,
|
||||
data
|
||||
} = await AddressApi.getAddress(options.id);
|
||||
if (code !== 0) {
|
||||
return;
|
||||
}
|
||||
|
@ -2,47 +2,41 @@
|
||||
<template>
|
||||
<s-layout title="收货地址" :bgStyle="{ color: '#FFF' }">
|
||||
<view v-if="state.list.length">
|
||||
<s-address-item
|
||||
hasBorderBottom
|
||||
v-for="item in state.list"
|
||||
:key="item.id"
|
||||
:item="item"
|
||||
@tap="onSelect(item)"
|
||||
/>
|
||||
<s-address-item hasBorderBottom v-for="item in state.list" :key="item.id" :item="item" @tap="onSelect(item)"
|
||||
@cc="getList" />
|
||||
</view>
|
||||
|
||||
<su-fixed bottom placeholder>
|
||||
<view class="footer-box ss-flex ss-row-between ss-p-20">
|
||||
<!-- 微信小程序和微信H5 -->
|
||||
<button
|
||||
v-if="['WechatMiniProgram', 'WechatOfficialAccount'].includes(sheep.$platform.name)"
|
||||
<button v-if="['WechatMiniProgram', 'WechatOfficialAccount'].includes(sheep.$platform.name)"
|
||||
@tap="importWechatAddress"
|
||||
class="border ss-reset-button sync-wxaddress ss-m-20 ss-flex ss-row-center ss-col-center"
|
||||
>
|
||||
class="border ss-reset-button sync-wxaddress ss-m-20 ss-flex ss-row-center ss-col-center">
|
||||
<text class="cicon-weixin ss-p-r-10" style="color: #09bb07; font-size: 40rpx"></text>
|
||||
导入微信地址
|
||||
</button>
|
||||
<button
|
||||
class="add-btn ss-reset-button ui-Shadow-Main"
|
||||
@tap="sheep.$router.go('/pages/user/address/edit')"
|
||||
>
|
||||
<button class="add-btn ss-reset-button ui-Shadow-Main"
|
||||
@tap="sheep.$router.go('/pages/user/address/edit')">
|
||||
新增收货地址
|
||||
</button>
|
||||
</view>
|
||||
</su-fixed>
|
||||
<s-empty
|
||||
v-if="state.list.length === 0 && !state.loading"
|
||||
text="暂无收货地址"
|
||||
icon="/static/data-empty.png"
|
||||
/>
|
||||
<s-empty v-if="state.list.length === 0 && !state.loading" text="暂无收货地址" icon="/static/data-empty.png" />
|
||||
</s-layout>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, onBeforeMount } from 'vue';
|
||||
import { onShow } from '@dcloudio/uni-app';
|
||||
import {
|
||||
reactive,
|
||||
onBeforeMount
|
||||
} from 'vue';
|
||||
import {
|
||||
onShow
|
||||
} from '@dcloudio/uni-app';
|
||||
import sheep from '@/sheep';
|
||||
import { isEmpty } from 'lodash';
|
||||
import {
|
||||
isEmpty
|
||||
} from 'lodash';
|
||||
import AreaApi from '@/sheep/api/system/area';
|
||||
import AddressApi from '@/sheep/api/member/address';
|
||||
|
||||
@ -110,6 +104,11 @@
|
||||
// #endif
|
||||
}
|
||||
|
||||
function getList(val) {
|
||||
AddressApi.getAddressList().then((res) => {
|
||||
state.list = res.data
|
||||
})
|
||||
}
|
||||
onShow(async () => {
|
||||
state.list = (await AddressApi.getAddressList()).data;
|
||||
state.loading = false;
|
||||
|
@ -10,35 +10,50 @@
|
||||
<view class="store-address line1">
|
||||
{{ item.areaName }}{{ ', ' + item.detailAddress }}
|
||||
</view>
|
||||
<view class="store-address line1">
|
||||
营业时间:{{item?.openingTime[0] + ":" + item?.openingTime[1]}}-{{item?.closingTime[0] + ":" + item?.closingTime[1]}}
|
||||
</view>
|
||||
<view class="status" v-if="item?.stat == 0">未营业</view>
|
||||
<view class="status" v-if="item?.stat == 1">营业中</view>
|
||||
</view>
|
||||
<view class="row-right ss-flex-col ss-col-center">
|
||||
<view>
|
||||
<!-- #ifdef H5 -->
|
||||
<a class="store-phone" :href="'tel:' + item.phone">
|
||||
<!-- <a class="store-phone" :href="'tel:' + item.phone">
|
||||
<view class="iconfont">
|
||||
<view class="ss-rest-button">
|
||||
<text class="_icon-forward" />
|
||||
</view>
|
||||
</view>
|
||||
</a>
|
||||
</a> -->
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP -->
|
||||
<view class="store-phone" @click="call(item.phone)">
|
||||
<!-- <view class="store-phone" @click="call(item.phone)">
|
||||
<view class="iconfont">
|
||||
<view class="ss-rest-button">
|
||||
<text class="_icon-forward" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
<view class="store-distance ss-flex ss-row-center" @tap.stop="showMaoLocation(item)">
|
||||
<text class="addressTxt" v-if="item.distance">距离{{ item.distance.toFixed(2) }}千米</text>
|
||||
<text class="addressTxt" v-else>查看地图</text>
|
||||
<view class="iconfont">
|
||||
<view class="store-distance ss-flex ss-row-center">
|
||||
<view class="addressTxt" v-if="item.distance==0 || item.distance">
|
||||
距离{{ item.distance.toFixed(2) }}km</view>
|
||||
<!-- <text class="addressTxt" v-else>查看地图</text> -->
|
||||
<!-- <view class="iconfont">
|
||||
<view class="ss-rest-button">
|
||||
<text class="_icon-forward" />
|
||||
</view>
|
||||
</view> -->
|
||||
|
||||
<view class="tb">
|
||||
<image @tap.stop="showMaoLocation(item)" style="margin-right:10px;"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/c7362f85726ef0030b407f1c3749c710ca0caa51fee5cc8ffbb64e11226354a8.png"
|
||||
class="img"></image>
|
||||
<image @click.stop="call(item.phone)"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/535ee6f79e04d4b6e46fcfa59ed052f214ad6ab756c340c0c040e68357f68e9a.png"
|
||||
class="img"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -49,8 +64,13 @@
|
||||
|
||||
<script setup>
|
||||
import DeliveryApi from '@/sheep/api/trade/delivery';
|
||||
import { onMounted, reactive } from 'vue';
|
||||
import { onLoad } from '@dcloudio/uni-app';
|
||||
import {
|
||||
onMounted,
|
||||
reactive
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad
|
||||
} from '@dcloudio/uni-app';
|
||||
import sheep from '@/sheep';
|
||||
|
||||
const LONGITUDE = 'user_longitude';
|
||||
@ -73,9 +93,8 @@
|
||||
const selfLocation = () => {
|
||||
// #ifdef H5
|
||||
const jsWxSdk = sheep.$platform.useProvider('wechat').jsWxSdk;
|
||||
if (jsWxSdk.isWechat()) {
|
||||
if (!!jsWxSdk?.isWechat()) {
|
||||
jsWxSdk.getLocation((res) => {
|
||||
console.log(res);
|
||||
state.user_latitude = res.latitude;
|
||||
state.user_longitude = res.longitude;
|
||||
uni.setStorageSync(LATITUDE, res.latitude);
|
||||
@ -87,19 +106,24 @@
|
||||
uni.getLocation({
|
||||
type: 'gcj02',
|
||||
success: (res) => {
|
||||
console.log(res.latitude, "--------经纬度-----");
|
||||
try {
|
||||
state.user_latitude = res.latitude;
|
||||
state.user_longitude = res.longitude;
|
||||
uni.setStorageSync(LATITUDE, res.latitude);
|
||||
uni.setStorageSync(LONGITUDE, res.longitude);
|
||||
} catch {
|
||||
}
|
||||
} catch {}
|
||||
|
||||
getList();
|
||||
},
|
||||
complete: () => {
|
||||
getList();
|
||||
},
|
||||
fail(error) {
|
||||
console.log(error, "错误")
|
||||
}
|
||||
});
|
||||
console.log("有执行")
|
||||
// #ifdef H5
|
||||
}
|
||||
// #endif
|
||||
@ -148,10 +172,15 @@
|
||||
return;
|
||||
}
|
||||
state.loading = true;
|
||||
const { data, code } = await DeliveryApi.getDeliveryPickUpStoreList({
|
||||
console.log(state.user_latitude, state.user_longitude, "------user_longitude-------")
|
||||
const data2 = {
|
||||
latitude: state.user_latitude,
|
||||
longitude: state.user_longitude,
|
||||
});
|
||||
};
|
||||
const {
|
||||
data,
|
||||
code
|
||||
} = await DeliveryApi.getDeliveryPickUpStoreList(data2);
|
||||
if (code !== 0) {
|
||||
return;
|
||||
}
|
||||
@ -171,12 +200,26 @@
|
||||
try {
|
||||
state.user_latitude = uni.getStorageSync(LATITUDE);
|
||||
state.user_longitude = uni.getStorageSync(LONGITUDE);
|
||||
console.log(state.user_latitude, state.user_longitude, "user_longitude");
|
||||
} catch (e) {
|
||||
// error
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.status {
|
||||
background: rgba(214, 81, 42);
|
||||
width: 40px;
|
||||
text-align: center;
|
||||
color: white;
|
||||
border-radius: 3px;
|
||||
margin-top: 5px;
|
||||
font-size: 20rpx;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
}
|
||||
|
||||
.line1 {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@ -193,18 +236,19 @@
|
||||
|
||||
.storeBox {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
|
||||
.storeBox-box {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
// width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 23rpx 0;
|
||||
justify-content: space-between;
|
||||
padding: 23rpx;
|
||||
justify-content: space-around;
|
||||
border-bottom: 1px solid #eee;
|
||||
margin: 10px 10px;
|
||||
boeder-radius: 10px;
|
||||
}
|
||||
|
||||
.store-cent {
|
||||
@ -214,27 +258,42 @@
|
||||
}
|
||||
|
||||
.store-cent-left {
|
||||
width: 177px;
|
||||
// flex: 2;
|
||||
// width: 177px;
|
||||
flex: 1;
|
||||
max-width: 156px;
|
||||
position: relative;
|
||||
padding-right: 10px;
|
||||
|
||||
&::after {
|
||||
position: absolute;
|
||||
content: '';
|
||||
width: 1px;
|
||||
height: 100%;
|
||||
background: rgba(223, 223, 223);
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.store-img {
|
||||
// flex: 1;
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 6rpx;
|
||||
margin-right: 22rpx;
|
||||
}
|
||||
|
||||
.store-img .img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 31px;
|
||||
}
|
||||
|
||||
.store-name {
|
||||
color: #282828;
|
||||
font-size: 30rpx;
|
||||
margin-bottom: 22rpx;
|
||||
font-size: 26rpx;
|
||||
margin-bottom: 5px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
@ -259,6 +318,24 @@
|
||||
.store-distance {
|
||||
font-size: 22rpx;
|
||||
color: #e83323;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.addressTxt {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.tb {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
|
||||
.img {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
@ -266,7 +343,8 @@
|
||||
}
|
||||
|
||||
.row-right {
|
||||
flex: 2;
|
||||
// flex: 1;
|
||||
margin-left: 10px;
|
||||
//display: flex;
|
||||
//flex-direction: column;
|
||||
//align-items: flex-end;
|
||||
|
45
pages/user/user_vip/agreement.vue
Normal file
45
pages/user/user_vip/agreement.vue
Normal file
@ -0,0 +1,45 @@
|
||||
<!-- 会员信息 -->
|
||||
<template>
|
||||
<s-layout navbar="normal" title="会员协议">
|
||||
<view class="main" v-html="data">
|
||||
|
||||
</view>
|
||||
</s-layout>
|
||||
</template>
|
||||
<script setup>
|
||||
import {
|
||||
computed,
|
||||
reactive,
|
||||
onBeforeMount,
|
||||
onMounted,
|
||||
ref
|
||||
} from 'vue';
|
||||
import request from '@/sheep/request';
|
||||
import {
|
||||
baseUrl,
|
||||
apiPath
|
||||
} from '@/sheep/config';
|
||||
import sheep from '@/sheep';
|
||||
const data = ref([]);
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/member/paid-member-agree/get`,
|
||||
method: 'GET',
|
||||
params: {
|
||||
},
|
||||
custom: {
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
data.value = res.data.content
|
||||
});
|
||||
// 使用 onMounted 生命周期钩子
|
||||
onMounted(() => {
|
||||
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.main{
|
||||
width: 93%;
|
||||
margin:10px auto;
|
||||
}
|
||||
</style>
|
@ -12,7 +12,7 @@
|
||||
<view class="text acea-row row-middle">
|
||||
<view class="name line1">
|
||||
<!-- {{ userInfo.nickname }} -->
|
||||
ai豆
|
||||
{{userInfo.nickname}}
|
||||
</view>
|
||||
<!-- <view class="vip" v-if='userInfo.level'> -->
|
||||
<view class="vip">
|
||||
@ -20,7 +20,7 @@
|
||||
<!-- {{ userInfo.level.name }} -->
|
||||
|
||||
|
||||
白金会员
|
||||
{{userInfo.level.name}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -29,7 +29,7 @@
|
||||
<zmxy-slideshow :items="levelList" :autoplay="false"></zmxy-slideshow>
|
||||
<!-- TODO -->
|
||||
<view class="experience">
|
||||
<view class="title">当前经验值</view>
|
||||
<view class="title">当前经验值:{{userInfo.experience}}</view>
|
||||
<view class="num">
|
||||
<!-- {{ userInfo.experience }} -->
|
||||
</view>
|
||||
@ -133,7 +133,8 @@
|
||||
<view class="info line1">购买商品可获得对应是经验值</view>
|
||||
</view>
|
||||
</view>
|
||||
<navigator url="/pages/index/category" class="button" hover-class="none">去获取</navigator>
|
||||
<!-- <navigator class="button" hover-class="none" open-type='switchTab'>去获取</navigator> -->
|
||||
<view class="button" @click="sheep.$router.redirect('/pages/index/category')">去获取</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -174,6 +175,10 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
computed
|
||||
} from 'vue';
|
||||
import sheep from '@/sheep';
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
@ -184,6 +189,8 @@
|
||||
mapGetters
|
||||
} from "vuex";
|
||||
import getExper from '@/sheep/api/member/level';
|
||||
const userInfo = computed(() => sheep.$store('user').userInfo);
|
||||
console.log(userInfo.value,"isLoginisLogin")
|
||||
// import dayjs from './dayjs/dayjs.min.js';
|
||||
|
||||
// const store = useStore();
|
||||
@ -271,7 +278,7 @@
|
||||
|
||||
.swiper {
|
||||
position: relative;
|
||||
top: -353px;
|
||||
top: -288px;
|
||||
|
||||
.new-img {
|
||||
width: 90%;
|
||||
@ -300,7 +307,7 @@
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: 100%;
|
||||
height: 415px;
|
||||
height: 348px;
|
||||
background-color: #3b5086;
|
||||
|
||||
.picTxt {
|
||||
@ -351,8 +358,8 @@
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: 690rpx;
|
||||
height: 360rpx;
|
||||
margin: -315px auto 0 auto;
|
||||
height: 144px;
|
||||
margin: -275px auto 0 auto;
|
||||
border-radius: 23rpx;
|
||||
padding: 22rpx 27rpx;
|
||||
box-sizing: border-box;
|
||||
@ -535,7 +542,7 @@
|
||||
.public_title {
|
||||
color: #282828;
|
||||
font-size: 30rpx;
|
||||
|
||||
align-items: center;
|
||||
.icons {
|
||||
width: 6rpx;
|
||||
height: 28rpx;
|
||||
|
@ -1,6 +1,7 @@
|
||||
<!-- 会员信息 -->
|
||||
<template>
|
||||
<s-layout navbar="inner" title="SVIP会员专享" :statusBar="true" :bgStyle="{ color: '#FE832A', backgroundColor:'white' }" navbarbackgroundColor="rgba(57,55,54)">
|
||||
<s-layout navbar="inner" title="SVIP会员专享" :statusBar="true" :bgStyle="{ color: '#FE832A', backgroundColor:'white' }"
|
||||
navbarbackgroundColor="rgba(57,55,54)">
|
||||
<view class='vip-main'>
|
||||
<view class="vip-top">
|
||||
<image
|
||||
@ -14,16 +15,26 @@
|
||||
<view class="t">{{ userInfo.nickname }}
|
||||
<image src="" class="img"></image>
|
||||
</view>
|
||||
<view class="c">您与众悦e家商场的第101天</view>
|
||||
<view class="b">开通即享会员权益</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="r">
|
||||
开通会员
|
||||
</view>
|
||||
<view class="c" v-if="!userInfo.activate">您与众悦e家商场的第101天</view>
|
||||
<view class="b" v-if="!userInfo.activate">开通即享会员权益</view>
|
||||
<view class="b" v-if="userInfo.activate">
|
||||
<text v-if="userInfo.cardName != '永久'">
|
||||
SVIP会员
|
||||
{{ sheep.$helper.timeFormat(userInfo.cardExpirationTime, 'yyyy-mm-dd') }} 到期</text>
|
||||
<text class="b" v-if="userInfo.cardName == '永久'">永久SVIP会员</text>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="r" v-if="!userInfo.activate && userInfo.cardName != '永久'">
|
||||
<text>立即开通</text>
|
||||
</view>
|
||||
<view class="r" v-if="userInfo.activate && userInfo.cardName != '永久'">
|
||||
<text>续费会员</text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="vipLv" v-if="userInfo.activate">当前卡片:{{userInfo.cardName}}</view> -->
|
||||
</view>
|
||||
<view class="vip-zxq">
|
||||
<image
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/d865a7766bf5ccbfb76e97f3fd65bcfdc37a612fe94878b7a899adab869360f8.png"
|
||||
@ -32,9 +43,7 @@
|
||||
<view class="item" v-for="(item, index) in vipList2" :key="index">
|
||||
<view class="new-nei">
|
||||
<view class="l">
|
||||
<image
|
||||
:src="item.iconUrl"
|
||||
class="l-img"></image>
|
||||
<image :src="item.iconUrl" class="l-img"></image>
|
||||
</view>
|
||||
<view class="r">
|
||||
<view class="t">
|
||||
@ -52,30 +61,33 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="vip-kt">
|
||||
<view class="vip-kt" v-if="userInfo.cardName != '永久'">
|
||||
<view class="top">
|
||||
<text class="t1" v-if="userInfo.activate == 1">试用会员</text>
|
||||
<text class="t1" v-if="userInfo.activate == 2">开通会员</text>
|
||||
<!-- <text class="t1" v-if="userInfo.activate == 1">试用会员</text> -->
|
||||
<text class="t1" v-if="!userInfo.activate">开通会员</text>
|
||||
<text class="t2">有效期至</text>
|
||||
<text class="t3">2024-10-24</text>
|
||||
<text class="t3" v-if="timeAute">{{ timeAute }}</text>
|
||||
<text class="t3" v-else>{{ sheep.$helper.timeFormat(userInfo.cardExpirationTime, 'yyyy-mm-dd') }}</text>
|
||||
</view>
|
||||
<scroll-view class="scroll-view_H" scroll-x="true" @scroll="scroll" scroll-left="120">
|
||||
<view id="demo1" @click="vipFun(index,item.name)" class="scroll-view-item_H uni-bg-red" :class="valVip == index ? 'on' : ''" v-for="(item,index) in vipList" :key="index">
|
||||
<view id="demo1" @click="vipFun(index,item.name)" class="scroll-view-item_H uni-bg-red"
|
||||
:class="valVip == index ? 'on' : ''" v-for="(item,index) in vipList" :key="index">
|
||||
<view class="t">{{item.name}}</view>
|
||||
<view class="c">¥<text class="tx">{{item.specialPrice}}</text></view>
|
||||
<view class="b" v-if="index==0">试用1天</view>
|
||||
<view class="b" v-if="item.name=='试用'">试用1天</view>
|
||||
<view class="b sc" v-else>¥{{item.originalPrice}}</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
<view class="vip-text">
|
||||
购买即视为同意《<text class="ts">会员用户协议</text>》
|
||||
<view class="vip-text" v-if="userInfo.cardName != '永久'">
|
||||
购买即视为同意《<text class="ts"
|
||||
@click="sheep.$router.redirect('/pages/user/user_vip/agreement')">会员用户协议</text>》
|
||||
</view>
|
||||
<view class="vip-btn" @click="beclick()" v-if="userInfo.activate != 1">
|
||||
<!-- <view class="vip-btn" @click="beclick()" v-if="!userInfo.activate">
|
||||
立即试用
|
||||
</view>
|
||||
<view class="vip-btn" @click="beclick()" v-else>
|
||||
</view> -->
|
||||
<view class="vip-btn" @click="beclick()" v-if="userInfo.cardName != '永久'">
|
||||
立即开通
|
||||
</view>
|
||||
</view>
|
||||
@ -97,38 +109,49 @@
|
||||
import sheep from '@/sheep';
|
||||
const statusBarHeight = sheep.$platform.device.statusBarHeight * 2;
|
||||
const userInfo = computed(() => sheep.$store('user').userInfo);
|
||||
|
||||
const vipList = ref([]);
|
||||
const vipList2 = ref([]);
|
||||
const valVip = ref([]);
|
||||
const valVip = ref(88888);
|
||||
const nameVip = ref([]);
|
||||
const timeAute = ref();
|
||||
// 定义方法
|
||||
function getList() {
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/member/card/type/list`,
|
||||
method: 'GET',
|
||||
params: {
|
||||
},
|
||||
params: {},
|
||||
custom: {
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
console.log(res,"sss")
|
||||
vipList.value = res.data;
|
||||
});
|
||||
}
|
||||
|
||||
// vipFun
|
||||
let data = {
|
||||
cardName:nameVip.value
|
||||
cardName: nameVip.value
|
||||
}
|
||||
function vipFun(index,name) {
|
||||
|
||||
function vipFun(index, name) {
|
||||
valVip.value = index
|
||||
data.cardName = name
|
||||
if (name == '永久') {
|
||||
timeAute.value = '永久会员';
|
||||
} else {
|
||||
timeAute.value = sheep.$helper.timeFormat(vipList.value[index].cardExpirationTime, 'yyyy-mm-dd');
|
||||
}
|
||||
|
||||
console.log(userInfo.cardExpirationTime, "userInfo.cardExpirationTime")
|
||||
}
|
||||
|
||||
// beclick
|
||||
function beclick() {
|
||||
console.log(data.cardName,"nameVip.value")
|
||||
if (data.cardName == '') {
|
||||
sheep.$helper.toast('请选择')
|
||||
return;
|
||||
};
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/pay/member/create`,
|
||||
method: 'post',
|
||||
@ -137,11 +160,20 @@
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
console.log(res,"-----------试用---------------")
|
||||
if(res.code == 200){
|
||||
if (res.code == 0) {
|
||||
if (data.cardName == "试用") {
|
||||
sheep.$helper.toast('试用开通成功');
|
||||
sheep.$router.go('/pages/index/user')
|
||||
}else{
|
||||
// sheep.$router.go('/pages/index/user')
|
||||
} else {
|
||||
sheep.$router.go('/pages/pay/index', {
|
||||
id: res.data.payOrderId,
|
||||
type: 'vip',
|
||||
vipid: res.data.id,
|
||||
cardName: data.cardName
|
||||
})
|
||||
}
|
||||
|
||||
} else {
|
||||
sheep.$helper.toast(res.msg);
|
||||
}
|
||||
|
||||
@ -153,13 +185,11 @@
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/member/benefit/list`,
|
||||
method: 'GET',
|
||||
params: {
|
||||
},
|
||||
params: {},
|
||||
custom: {
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
console.log(res,"sss")
|
||||
vipList2.value = res.data;
|
||||
});
|
||||
}
|
||||
@ -179,6 +209,13 @@
|
||||
// background: rgba(57, 55, 54);
|
||||
position: relative;
|
||||
|
||||
.vipLv {
|
||||
position: absolute;
|
||||
bottom: 93px;
|
||||
right: 10%;
|
||||
color: #8a745c;
|
||||
}
|
||||
|
||||
.img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
@ -209,7 +246,7 @@
|
||||
|
||||
.text {
|
||||
.t {
|
||||
font-size: 18px;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
|
||||
.img {
|
||||
@ -225,7 +262,7 @@
|
||||
|
||||
.b {
|
||||
color: rgba(201, 141, 99);
|
||||
font-size: 13px;
|
||||
font-size: 12px;
|
||||
margin-top: 7px;
|
||||
}
|
||||
}
|
||||
@ -233,18 +270,21 @@
|
||||
|
||||
.r {
|
||||
color: #8a745c;
|
||||
font-size: 15px;
|
||||
padding: 5px 15px;
|
||||
font-size: 12px;
|
||||
padding: 5px 10px;
|
||||
background: white;
|
||||
border-radius: 15px;
|
||||
border-radius: 0 11px 0 11px;
|
||||
position: absolute;
|
||||
right: 7px;
|
||||
bottom: 64px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.vip-zxq {
|
||||
.img {
|
||||
width: 77%;
|
||||
height: 89px;
|
||||
width: 63%;
|
||||
height: 68px;
|
||||
margin: 0 auto;
|
||||
display: block;
|
||||
margin-top: 20px;
|
||||
@ -269,8 +309,8 @@
|
||||
align-items: center;
|
||||
|
||||
.l-img {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
@ -311,43 +351,52 @@
|
||||
color: rgba(174, 90, 42);
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-view_H {
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
|
||||
.scroll-view-item_H {
|
||||
width: 113px;
|
||||
display: inline-block;
|
||||
background-color: white;
|
||||
border: 1px solid rgba(214,214,214);
|
||||
margin-right:15px;
|
||||
border: 1px solid rgba(214, 214, 214);
|
||||
margin-right: 15px;
|
||||
border-radius: 10px;
|
||||
margin-top:15px;
|
||||
padding:15px 0;
|
||||
&.on{
|
||||
background-color: rgba(254,247,236);
|
||||
border: 1px solid rgba(252,194,130);
|
||||
margin-top: 15px;
|
||||
padding: 10px 3px;
|
||||
width: 100px;
|
||||
|
||||
&.on {
|
||||
background-color: rgba(254, 247, 236);
|
||||
border: 1px solid rgba(252, 194, 130);
|
||||
}
|
||||
.t{
|
||||
color:rgba(117,78,25);
|
||||
|
||||
.t {
|
||||
color: rgba(117, 78, 25);
|
||||
font-weight: 700;
|
||||
font-size:20px;
|
||||
font-size: 15px;
|
||||
text-align: center;
|
||||
}
|
||||
.c{
|
||||
color:rgba(117,78,25);
|
||||
|
||||
.c {
|
||||
color: rgba(117, 78, 25);
|
||||
// color: rgba(117, 78, 25);
|
||||
font-weight: 700;
|
||||
font-size:15px;
|
||||
font-size: 15px;
|
||||
text-align: center;
|
||||
padding:10px 0;
|
||||
.tx{
|
||||
font-size:27px;
|
||||
padding: 10px 0;
|
||||
|
||||
.tx {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
.b{
|
||||
color:rgba(173,173,173);
|
||||
font-size:16px;
|
||||
|
||||
.b {
|
||||
color: rgba(173, 173, 173);
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
&.sc{
|
||||
|
||||
&.sc {
|
||||
text-decoration: line-through;
|
||||
}
|
||||
}
|
||||
@ -359,6 +408,7 @@
|
||||
text-align: center;
|
||||
color: rgba(157, 157, 157);
|
||||
margin: 15px 0;
|
||||
font-size: 13px;
|
||||
|
||||
.ts {
|
||||
color: rgba(174, 90, 42);
|
||||
@ -370,7 +420,7 @@
|
||||
background: rgba(254, 220, 137);
|
||||
text-align: center;
|
||||
margin: 0 15px;
|
||||
border-radius: 20px;
|
||||
border-radius: 9px;
|
||||
color: rgba(95, 53, 38);
|
||||
}
|
||||
|
||||
|
@ -1,12 +1,26 @@
|
||||
<!-- 我的积分 -->
|
||||
<template>
|
||||
<s-layout class="wallet-wrap" title="我的积分" navbar="inner">
|
||||
<s-layout class="wallet-wrap" title="我的积分" navbar="inner" :bgStyle="{ backgroundColor: '#fff'}">
|
||||
<view class="header-box ss-flex ss-flex-col ss-row-center ss-col-center" :style="[
|
||||
{
|
||||
marginTop: '-' + Number(statusBarHeight + 88) + 'rpx',
|
||||
paddingTop: Number(statusBarHeight + 88) + 'rpx',
|
||||
},
|
||||
]">
|
||||
<view class="filter-box ss-p-x-30 ss-flex ss-col-center ss-row-between" :style="[{top: Number(statusBarHeight + 88) + 'rpx'}]" v-if="state.isShow == 1">
|
||||
<uni-datetime-picker v-model="state.date" type="daterange" @change="onChangeTime" :end="state.today">
|
||||
<button class="ss-reset-button date-btn">
|
||||
<text>{{ dateFilterText }}</text>
|
||||
<text class="cicon-drop-down ss-seldate-icon"></text>
|
||||
</button>
|
||||
</uni-datetime-picker>
|
||||
|
||||
<!-- TODO 芋艿:优化 -->
|
||||
<!-- <view class="total-box">-->
|
||||
<!-- <view class="ss-m-b-10">总收入¥{{ state.pagination.income }}</view>-->
|
||||
<!-- <view>总支出¥{{ -state.pagination.expense }}</view>-->
|
||||
<!-- </view>-->
|
||||
</view>
|
||||
<view class="header-bg">
|
||||
<view class="bg" />
|
||||
</view>
|
||||
@ -19,12 +33,12 @@
|
||||
|
||||
<view class="new-point">
|
||||
<view class="l">
|
||||
<view class="b">1000</view>
|
||||
<view class="c">累计积分(带对接接口)</view>
|
||||
<view class="b">{{state.pointData?.addUp}}</view>
|
||||
<view class="c">累计积分</view>
|
||||
</view>
|
||||
<view class="l">
|
||||
<view class="b">1000</view>
|
||||
<view class="c">累计消费(带对接接口)</view>
|
||||
<view class="b">{{state.pointData?.reduce}}</view>
|
||||
<view class="c">累计消费</view>
|
||||
</view>
|
||||
<view class="l">
|
||||
<view class="b">0</view>
|
||||
@ -56,20 +70,7 @@
|
||||
<!-- tab -->
|
||||
<!-- <su-sticky :customNavHeight="sys_navBar"> -->
|
||||
<!-- 统计 -->
|
||||
<view class="filter-box ss-p-x-30 ss-flex ss-col-center ss-row-between" v-if="state.isShow == 1">
|
||||
<uni-datetime-picker v-model="state.date" type="daterange" @change="onChangeTime" :end="state.today">
|
||||
<button class="ss-reset-button date-btn">
|
||||
<text>{{ dateFilterText }}</text>
|
||||
<text class="cicon-drop-down ss-seldate-icon"></text>
|
||||
</button>
|
||||
</uni-datetime-picker>
|
||||
|
||||
<!-- TODO 芋艿:优化 -->
|
||||
<!-- <view class="total-box">-->
|
||||
<!-- <view class="ss-m-b-10">总收入¥{{ state.pagination.income }}</view>-->
|
||||
<!-- <view>总支出¥{{ -state.pagination.expense }}</view>-->
|
||||
<!-- </view>-->
|
||||
</view>
|
||||
<!-- <su-tabs :list="tabMaps" @change="onChange" :scrollable="false" :current="state.currentTab"></su-tabs> -->
|
||||
<!-- </su-sticky> -->
|
||||
<!-- icon -->
|
||||
@ -114,6 +115,11 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import request from '@/sheep/request';
|
||||
import {
|
||||
baseUrl,
|
||||
apiPath
|
||||
} from '@/sheep/config';
|
||||
import sheep from '@/sheep';
|
||||
import {
|
||||
onLoad,
|
||||
@ -145,7 +151,8 @@
|
||||
loadStatus: '',
|
||||
date: [],
|
||||
today: '',
|
||||
isShow: 1
|
||||
isShow: 1,
|
||||
pointData:[]
|
||||
});
|
||||
|
||||
const tabMaps = [{
|
||||
@ -170,6 +177,18 @@
|
||||
}
|
||||
});
|
||||
|
||||
//
|
||||
//
|
||||
function brandlists3() {
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/member/point/record/getPointInfo`,
|
||||
method: 'GET',
|
||||
}).then((res) => {
|
||||
console.log(res, "------brandList3---------");
|
||||
state.pointData = res.data;
|
||||
});
|
||||
}
|
||||
|
||||
async function getLogList() {
|
||||
state.loadStatus = 'loading';
|
||||
let {
|
||||
@ -194,6 +213,7 @@
|
||||
state.today = dayjs().format('YYYY-MM-DD');
|
||||
state.date = [state.today, state.today];
|
||||
getLogList();
|
||||
brandlists3();
|
||||
});
|
||||
|
||||
function onChange(e) {
|
||||
@ -247,9 +267,9 @@
|
||||
}
|
||||
|
||||
.c {
|
||||
font-size: 18px;
|
||||
font-size: 15px;
|
||||
color: rgba(198, 179, 114);
|
||||
width: 50%;
|
||||
width: 40%;
|
||||
font-weight: 700;
|
||||
line-height: 26px;
|
||||
}
|
||||
@ -270,7 +290,7 @@
|
||||
background-size: 750rpx 100%;
|
||||
padding: 0 0 0 0;
|
||||
box-sizing: border-box;
|
||||
|
||||
position:relative;
|
||||
.new-tab {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
@ -282,7 +302,7 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 45%;
|
||||
padding: 13px 0;
|
||||
padding: 9px 0;
|
||||
background: rgba(247, 247, 247);
|
||||
border-radius: 10px 0 0 0;
|
||||
|
||||
@ -292,8 +312,8 @@
|
||||
|
||||
.img,
|
||||
.img2 {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
@ -314,8 +334,9 @@
|
||||
}
|
||||
|
||||
.tx {
|
||||
font-size: 18px;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color:rgba(187,187,187);
|
||||
}
|
||||
}
|
||||
|
||||
@ -377,7 +398,8 @@
|
||||
height: 114rpx;
|
||||
background-color: $bg-page;
|
||||
background: rgb(193, 145, 81);
|
||||
|
||||
position:absolute;
|
||||
left:-20px;
|
||||
.total-box {
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
@ -385,13 +407,13 @@
|
||||
}
|
||||
|
||||
.date-btn {
|
||||
background-color: $white;
|
||||
background-color: rgb(254, 242, 219);
|
||||
line-height: 54rpx;
|
||||
border-radius: 27rpx;
|
||||
border-radius:0 27rpx 27rpx 0;
|
||||
padding: 0 20rpx;
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
color: $dark-6;
|
||||
color: rgba(137,118,76);
|
||||
|
||||
.ss-seldate-icon {
|
||||
font-size: 50rpx;
|
||||
|
@ -2,11 +2,11 @@ import request from '@/sheep/request';
|
||||
|
||||
const PayChannelApi = {
|
||||
// 获得指定应用的开启的支付渠道编码列表
|
||||
getEnableChannelCodeList: (appId) => {
|
||||
getEnableChannelCodeList: (appId, hideWalletPay) => {
|
||||
return request({
|
||||
url: '/pay/channel/get-enable-code-list',
|
||||
method: 'GET',
|
||||
params: { appId },
|
||||
params: { appId, hideWalletPay:hideWalletPay },
|
||||
});
|
||||
},
|
||||
};
|
||||
|
@ -9,9 +9,10 @@ const DeliveryApi = {
|
||||
});
|
||||
},
|
||||
// 获得自提门店列表
|
||||
getDeliveryPickUpStoreList: () => {
|
||||
getDeliveryPickUpStoreList: (data) => {
|
||||
return request({
|
||||
url: `/trade/delivery/pick-up-store/list`,
|
||||
params:data,
|
||||
method: 'get',
|
||||
});
|
||||
},
|
||||
|
@ -1,11 +1,12 @@
|
||||
<!-- 地址卡片 -->
|
||||
<template>
|
||||
<view
|
||||
class="address-item ss-flex ss-row-between ss-col-center"
|
||||
:class="[{ 'border-bottom': props.hasBorderBottom }]"
|
||||
>
|
||||
<view class="address-item ss-flex ss-row-between ss-col-center"
|
||||
:class="[{ 'border-bottom': props.hasBorderBottom }]">
|
||||
<image class="imgs"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/0f01dda22fb349c40c4659d73cb346a1423fee44c9d53eb07bdae1a1e11b5299.png">
|
||||
</image>
|
||||
<view class="item-left" v-if="!isEmpty(props.item)">
|
||||
<view class="area-text ss-flex ss-col-center">
|
||||
<!-- <view class="area-text ss-flex ss-col-center">
|
||||
<uni-tag
|
||||
class="ss-m-r-10"
|
||||
size="small"
|
||||
@ -14,22 +15,45 @@
|
||||
text="默认"
|
||||
/>
|
||||
{{ props.item.areaName }}
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="address-text">
|
||||
{{ props.item.detailAddress }}
|
||||
收货人:{{ props.item.name }} {{ props.item.mobile }}
|
||||
</view>
|
||||
<view class="person-text"> {{ props.item.name }} {{ props.item.mobile }} </view>
|
||||
<view class="person-text">收货地址: {{ props.item.areaName }} {{ props.item.detailAddress }}</view>
|
||||
</view>
|
||||
<view v-else>
|
||||
<view class="address-text ss-m-b-10">请选择收货地址</view>
|
||||
</view>
|
||||
<slot>
|
||||
<button class="ss-reset-button edit-btn" @tap.stop="onEdit">
|
||||
<!-- <button class="ss-reset-button edit-btn" @tap.stop="onEdit">
|
||||
<view class="edit-icon ss-flex ss-row-center ss-col-center">
|
||||
<image :src="sheep.$url.static('/static/img/shop/user/address/edit.png')" />
|
||||
<image
|
||||
:src="sheep.$url.static('https://zysc.fjptzykj.com:3000/shangcheng/f6c484a459e843baeb729603ae221b6d3ab384b56c2d891ae53b0ee4205477a9.png')" />
|
||||
</view>
|
||||
</button>
|
||||
</button> -->
|
||||
</slot>
|
||||
<view class="bottom">
|
||||
<view class="left" @click.stop="auto(props.item)">
|
||||
<view class="radio">
|
||||
<image class="img"
|
||||
v-if="props.item.defaultStatus"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/1d07aff7a6a0a3a5f09ed68407bd4bb9c589b62dba04b23d61b7027453b2894e.png">
|
||||
</image>
|
||||
</view>设为默认
|
||||
</view>
|
||||
<view class='right'>
|
||||
<view class="edit-icon" @click.stop="onEdit">
|
||||
<image class="img"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/82a9c12d309bf1a7f11e581ac31230e3847f2aaf2f31591b4d3aed7ee506ff54.png" />
|
||||
编辑
|
||||
</view>
|
||||
<view class="edit-icon" @click.stop="onDelete(props.item.id)">
|
||||
<image class="img"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/efbc57f84ba2740666f17f3cfcd1b607af5e3c520eca27814e5cda11c9715494.png" />
|
||||
删除
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -45,11 +69,15 @@
|
||||
* @slot - 默认插槽
|
||||
*/
|
||||
import sheep from '@/sheep';
|
||||
import { isEmpty } from 'lodash';
|
||||
import AddressApi from '@/sheep/api/member/address';
|
||||
import {
|
||||
isEmpty
|
||||
} from 'lodash';
|
||||
const emits = defineEmits(['cc']);
|
||||
const props = defineProps({
|
||||
item: {
|
||||
type: Object,
|
||||
default() {},
|
||||
default () {},
|
||||
},
|
||||
hasBorderBottom: {
|
||||
type: Boolean,
|
||||
@ -57,19 +85,104 @@
|
||||
},
|
||||
});
|
||||
|
||||
// 删除收货地址
|
||||
const onDelete = (id) => {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确认删除此收货地址吗?',
|
||||
success: async function (res) {
|
||||
if (!res.confirm) {
|
||||
return;
|
||||
}
|
||||
const { code } = await AddressApi.deleteAddress(id);
|
||||
if (code === 0) {
|
||||
emits("cc", "2222")
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const onEdit = () => {
|
||||
sheep.$router.go('/pages/user/address/edit', {
|
||||
id: props.item.id,
|
||||
});
|
||||
};
|
||||
|
||||
function auto(item){
|
||||
item.defaultStatus = !item.defaultStatus;
|
||||
AddressApi.updateAddress(item).then((res)=>{
|
||||
emits("cc", "2222")
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.address-item {
|
||||
background: white;
|
||||
padding: 24rpx 30rpx;
|
||||
position: relative;
|
||||
flex-wrap: wrap;
|
||||
padding-bottom: 0;
|
||||
|
||||
.bottom {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 10px 0;
|
||||
|
||||
.img {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
.radio {
|
||||
border: 1px solid #dddddd;
|
||||
border-radius: 50%;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.edit-icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
.img {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.imgs {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
}
|
||||
|
||||
.item-left {
|
||||
width: 600rpx;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #fafafa;
|
||||
padding: 6px 0;
|
||||
padding-bottom: 13px;
|
||||
}
|
||||
|
||||
.area-text {
|
||||
@ -79,15 +192,16 @@
|
||||
}
|
||||
|
||||
.address-text {
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
color: #333333;
|
||||
line-height: 48rpx;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.person-text {
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
color: $dark-9;
|
||||
}
|
||||
}
|
||||
@ -103,6 +217,7 @@
|
||||
height: 24rpx;
|
||||
}
|
||||
}
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
@ -31,7 +31,7 @@
|
||||
<s-hotzone-block v-if="type === 'HotZone'" :data="data" :styles="styles" />
|
||||
|
||||
<!-- 商品组件:商品卡片 -->
|
||||
<s-goods-card v-if="type === 'ProductCard'" :data="data" :styles="styles" />
|
||||
<s-goods-card v-if="type === 'ProductCard'" :data="data" :styles="styles" :fl="fl" />
|
||||
<!-- 商品组件:商品栏 -->
|
||||
<s-goods-shelves v-if="type === 'ProductList'" :data="data" :styles="styles" />
|
||||
|
||||
@ -45,6 +45,8 @@
|
||||
<s-live-block v-if="type === 'MpLive'" :data="data" :styles="styles" />
|
||||
<!-- 营销组件:优惠券 -->
|
||||
<s-coupon-block v-if="type === 'CouponCard'" :data="data" :styles="styles" />
|
||||
<!-- 营销组件:魔方 -->
|
||||
<s-mof-block v-if="type === 'MenuGridTow'" :data="data" :styles="styles" />
|
||||
<!-- 营销组件:文章 -->
|
||||
<!-- <s-richtext-block v-if="type === 'PromotionArticle'" :data="data" :styles="styles" /> -->
|
||||
<view class="floxt" v-if="type === 'PromotionArticle'">
|
||||
@ -68,10 +70,8 @@
|
||||
<view v-if="type === 'UserOrder'" class="new-huiy" @click="
|
||||
sheep.$router.go('/pages/user/user_vip/list')
|
||||
">
|
||||
<view class="new-button" v-if="userInfo.activate == 1">正在试用</view>
|
||||
<view class="new-button" v-if="userInfo.activate == 2">开通</view>
|
||||
<view class="new-button" v-if="userInfo.activate == 3">永久</view>
|
||||
<view class="new-button" v-if="userInfo.activate == 0">立即开通</view>
|
||||
<view class="new-button" v-if="userInfo.activate && userInfo.activate != 4">已开通</view>
|
||||
<view class="new-button" v-if="userInfo.activate == 0 || userInfo.activate == 4">立即开通</view>
|
||||
<image class="seckill1" mode="aspectFit"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/64776e2edc3c2f15295e7c3976ba301e08f9170f99a2e845d8f33bd65179b177.png" />
|
||||
</view>
|
||||
@ -123,6 +123,10 @@
|
||||
type: Object,
|
||||
default () {},
|
||||
},
|
||||
fl: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
}
|
||||
});
|
||||
|
||||
function path(id) {
|
||||
|
@ -2,29 +2,33 @@
|
||||
<template>
|
||||
<!-- 商品卡片 -->
|
||||
<view>
|
||||
<view class="new-fenlei" v-if="fl">
|
||||
<view class="list" :class="state.isShow == 'recommendNew' ? 'on' : ''" @click="classValue('recommendNew')">
|
||||
<view class="t">首页新品</view>
|
||||
<view class="b">最新出炉</view>
|
||||
</view>
|
||||
<view class="list" :class="state.isShow == 'recommendBest' ? 'on' : ''" @click="classValue('recommendBest')">
|
||||
<view class="t">精品推荐</view>
|
||||
<view class="b">猜你喜欢</view>
|
||||
</view>
|
||||
<view class="list" :class="state.isShow == 'recommendHot' ? 'on' : ''" @click="classValue('recommendHot')">
|
||||
<view class="t">热门榜单</view>
|
||||
<view class="b">好评如云</view>
|
||||
</view>
|
||||
<view class="list" :class="state.isShow == 'recommendGood' ? 'on' : ''" @click="classValue('recommendGood')">
|
||||
<view class="t">促销单品</view>
|
||||
<view class="b">多买多销</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 布局1. 单列大图(上图,下内容)-->
|
||||
<view
|
||||
v-if="layoutType === LayoutTypeEnum.ONE_COL_BIG_IMG && state.goodsList.length"
|
||||
class="goods-sl-box"
|
||||
>
|
||||
<view
|
||||
class="goods-box"
|
||||
v-for="item in state.goodsList"
|
||||
:key="item.id"
|
||||
:style="[{ marginBottom: data.space * 2 + 'rpx' }]"
|
||||
>
|
||||
<s-goods-column
|
||||
class=""
|
||||
size="sl"
|
||||
:goodsFields="data.fields"
|
||||
:tagStyle="data.badge"
|
||||
:data="item"
|
||||
:titleColor="data.fields.name?.color"
|
||||
:subTitleColor="data.fields.introduction.color"
|
||||
:topRadius="data.borderRadiusTop"
|
||||
:bottomRadius="data.borderRadiusBottom"
|
||||
@click="sheep.$router.go('/pages/goods/index', { id: item.id })"
|
||||
>
|
||||
<view v-if="layoutType === LayoutTypeEnum.ONE_COL_BIG_IMG && state.goodsList.length" class="goods-sl-box">
|
||||
|
||||
<view class="goods-box" v-for="item in state.goodsList" :key="item.id"
|
||||
:style="[{ marginBottom: data.space * 2 + 'rpx' }]">
|
||||
<s-goods-column class="" size="sl" :goodsFields="data.fields" :tagStyle="data.badge" :data="item"
|
||||
:titleColor="data.fields.name?.color" :subTitleColor="data.fields.introduction.color"
|
||||
:topRadius="data.borderRadiusTop" :bottomRadius="data.borderRadiusBottom"
|
||||
@click="sheep.$router.go('/pages/goods/index', { id: item.id })">
|
||||
<!-- 购买按钮 -->
|
||||
<template v-slot:cart>
|
||||
<button class="ss-reset-button cart-btn" :style="[buyStyle]">
|
||||
@ -36,30 +40,18 @@
|
||||
</view>
|
||||
|
||||
<!-- 布局2. 双列(每一列:上图,下内容)-->
|
||||
<view
|
||||
v-if="layoutType === LayoutTypeEnum.TWO_COL && state.goodsList.length"
|
||||
class="goods-md-wrap ss-flex ss-flex-wrap ss-col-top"
|
||||
>
|
||||
<view v-if="layoutType === LayoutTypeEnum.TWO_COL && state.goodsList.length"
|
||||
class="goods-md-wrap ss-flex ss-flex-wrap ss-col-top">
|
||||
<view class="goods-list-box">
|
||||
<view
|
||||
class="left-list"
|
||||
:style="[{ paddingRight: data.space + 'rpx', marginBottom: data.space + 'px' }]"
|
||||
v-for="item in state.leftGoodsList"
|
||||
:key="item.id"
|
||||
>
|
||||
<s-goods-column
|
||||
class="goods-md-box"
|
||||
size="md"
|
||||
:goodsFields="data.fields"
|
||||
:tagStyle="data.badge"
|
||||
:data="item"
|
||||
:titleColor="data.fields.name?.color"
|
||||
:subTitleColor="data.fields.introduction.color"
|
||||
:topRadius="data.borderRadiusTop"
|
||||
:bottomRadius="data.borderRadiusBottom"
|
||||
:titleWidth="330 - marginLeft - marginRight"
|
||||
<view class="left-list" :style="[{ paddingRight: data.space + 'rpx', marginBottom: data.space + 'px' }]"
|
||||
v-for="item in state.leftGoodsList" :key="item.id">
|
||||
<!-- <view class="left-list" :style="[{ paddingRight: data.space + 'rpx', marginBottom: data.space + 'px' }]"
|
||||
v-for="item in state.goodsList" :key="item.id"> -->
|
||||
<s-goods-column class="goods-md-box" size="md" :goodsFields="data.fields" :tagStyle="data.badge"
|
||||
:data="item" :titleColor="data.fields.name?.color"
|
||||
:subTitleColor="data.fields.introduction.color" :topRadius="data.borderRadiusTop"
|
||||
:bottomRadius="data.borderRadiusBottom" :titleWidth="330 - marginLeft - marginRight"
|
||||
@click="sheep.$router.go('/pages/goods/index', { id: item.id })"
|
||||
@getHeight="calculateGoodsColumn($event, 'left')"
|
||||
>
|
||||
<!-- 购买按钮 -->
|
||||
<template v-slot:cart>
|
||||
@ -71,27 +63,14 @@
|
||||
</view>
|
||||
</view>
|
||||
<view class="goods-list-box">
|
||||
<view
|
||||
class="right-list"
|
||||
:style="[{ paddingLeft: data.space + 'rpx', marginBottom: data.space + 'px' }]"
|
||||
v-for="item in state.rightGoodsList"
|
||||
:key="item.id"
|
||||
>
|
||||
<s-goods-column
|
||||
class="goods-md-box"
|
||||
size="md"
|
||||
:goodsFields="data.fields"
|
||||
:tagStyle="data.badge"
|
||||
:data="item"
|
||||
:titleColor="data.fields.name?.color"
|
||||
:subTitleColor="data.fields.introduction.color"
|
||||
:topRadius="data.borderRadiusTop"
|
||||
:bottomRadius="data.borderRadiusBottom"
|
||||
:titleWidth="330 - marginLeft - marginRight"
|
||||
<view class="right-list" :style="[{ paddingLeft: data.space + 'rpx', marginBottom: data.space + 'px' }]"
|
||||
v-for="item in state.rightGoodsList" :key="item.id">
|
||||
<s-goods-column class="goods-md-box" size="md" :goodsFields="data.fields" :tagStyle="data.badge"
|
||||
:data="item" :titleColor="data.fields.name?.color"
|
||||
:subTitleColor="data.fields.introduction.color" :topRadius="data.borderRadiusTop"
|
||||
:bottomRadius="data.borderRadiusBottom" :titleWidth="330 - marginLeft - marginRight"
|
||||
@click="sheep.$router.go('/pages/goods/index', { id: item.id })"
|
||||
@getHeight="calculateGoodsColumn($event, 'right')"
|
||||
>
|
||||
<!-- 购买按钮 -->
|
||||
<template v-slot:cart>
|
||||
<button class="ss-reset-button cart-btn" :style="[buyStyle]">
|
||||
{{ btnBuy.type === 'text' ? btnBuy.text : '' }}
|
||||
@ -103,28 +82,14 @@
|
||||
</view>
|
||||
|
||||
<!-- 布局3. 单列小图(左图,右内容) -->
|
||||
<view
|
||||
v-if="layoutType === LayoutTypeEnum.ONE_COL_SMALL_IMG && state.goodsList.length"
|
||||
class="goods-lg-box"
|
||||
>
|
||||
<view
|
||||
class="goods-box"
|
||||
:style="[{ marginBottom: data.space + 'px' }]"
|
||||
v-for="item in state.goodsList"
|
||||
:key="item.id"
|
||||
>
|
||||
<s-goods-column
|
||||
class="goods-card"
|
||||
size="lg"
|
||||
:goodsFields="data.fields"
|
||||
:data="item"
|
||||
:tagStyle="data.badge"
|
||||
:titleColor="data.fields.name?.color"
|
||||
:subTitleColor="data.fields.introduction.color"
|
||||
:topRadius="data.borderRadiusTop"
|
||||
<view v-if="layoutType === LayoutTypeEnum.ONE_COL_SMALL_IMG && state.goodsList.length" class="goods-lg-box">
|
||||
<view class="goods-box" :style="[{ marginBottom: data.space + 'px' }]" v-for="item in state.goodsList"
|
||||
:key="item.id">
|
||||
<s-goods-column class="goods-card" size="lg" :goodsFields="data.fields" :data="item"
|
||||
:tagStyle="data.badge" :titleColor="data.fields.name?.color"
|
||||
:subTitleColor="data.fields.introduction.color" :topRadius="data.borderRadiusTop"
|
||||
:bottomRadius="data.borderRadiusBottom"
|
||||
@tap="sheep.$router.go('/pages/goods/index', { id: item.id })"
|
||||
>
|
||||
@tap="sheep.$router.go('/pages/goods/index', { id: item.id })">
|
||||
<!-- 购买按钮 -->
|
||||
<template v-slot:cart>
|
||||
<button class="ss-reset-button cart-btn" :style="[buyStyle]">
|
||||
@ -138,10 +103,21 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
|
||||
import request from '@/sheep/request';
|
||||
import {
|
||||
baseUrl,
|
||||
apiPath
|
||||
} from '@/sheep/config';
|
||||
|
||||
/**
|
||||
* 商品卡片
|
||||
*/
|
||||
import { computed, reactive, onMounted } from 'vue';
|
||||
import {
|
||||
computed,
|
||||
reactive,
|
||||
onMounted
|
||||
} from 'vue';
|
||||
import sheep from '@/sheep';
|
||||
import SpuApi from '@/sheep/api/product/spu';
|
||||
|
||||
@ -159,20 +135,33 @@
|
||||
goodsList: [],
|
||||
leftGoodsList: [],
|
||||
rightGoodsList: [],
|
||||
isShow:'recommendNew',
|
||||
count:0
|
||||
});
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
default() {},
|
||||
default () {},
|
||||
},
|
||||
styles: {
|
||||
type: Object,
|
||||
default() {},
|
||||
default () {},
|
||||
},
|
||||
fl: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
});
|
||||
|
||||
const { layoutType, btnBuy, spuIds } = props.data ?? {};
|
||||
const { marginLeft, marginRight } = props.styles ?? {};
|
||||
const {
|
||||
layoutType,
|
||||
btnBuy,
|
||||
spuIds
|
||||
} = props.data ?? {};
|
||||
const {
|
||||
marginLeft,
|
||||
marginRight
|
||||
} = props.styles ?? {};
|
||||
|
||||
// 购买按钮样式
|
||||
const buyStyle = computed(() => {
|
||||
@ -195,7 +184,7 @@
|
||||
|
||||
//region 商品瀑布流布局
|
||||
// 下一个要处理的商品索引
|
||||
let count = 0;
|
||||
// let count = 0;
|
||||
// 左列的高度
|
||||
let leftHeight = 0;
|
||||
// 右列的高度
|
||||
@ -206,20 +195,22 @@
|
||||
* @param height 商品的高度
|
||||
* @param where 添加到哪一列
|
||||
*/
|
||||
function calculateGoodsColumn(height = 0, where = 'left') {
|
||||
function calculateGoodsColumn() {
|
||||
// 处理完
|
||||
if (!state.goodsList[count]) return;
|
||||
// if (!state.goodsList[state.count]) return;
|
||||
|
||||
// 增加列的高度
|
||||
if (where === 'left') leftHeight += height;
|
||||
if (where === 'right') rightHeight += height;
|
||||
// if (where === 'left') leftHeight += height;
|
||||
// if (where === 'right') rightHeight += height;
|
||||
// 添加到矮的一列
|
||||
if (leftHeight <= rightHeight) {
|
||||
state.leftGoodsList.push(state.goodsList[count]);
|
||||
if (state.count % 2 == 0) {
|
||||
state.leftGoodsList.push(state.goodsList[state.count]);
|
||||
} else {
|
||||
state.rightGoodsList.push(state.goodsList[count]);
|
||||
state.rightGoodsList.push(state.goodsList[state.count]);
|
||||
}
|
||||
// console.log();
|
||||
// 计数
|
||||
count++;
|
||||
state.count++;
|
||||
}
|
||||
//endregion
|
||||
|
||||
@ -229,35 +220,123 @@
|
||||
* @return {Promise<undefined>} 商品列表
|
||||
*/
|
||||
async function getGoodsListByIds(ids) {
|
||||
const { data } = await SpuApi.getSpuListByIds(ids);
|
||||
const {
|
||||
data
|
||||
} = await SpuApi.getSpuListByIds(ids);
|
||||
return data;
|
||||
}
|
||||
|
||||
|
||||
// 分类的数据
|
||||
function classValue(val) {
|
||||
state.isShow = val;
|
||||
request({
|
||||
url: `${baseUrl}${apiPath}/product/spu/getActivityGoods`,
|
||||
method: 'GET',
|
||||
params: {
|
||||
// projectdayId: this.brandId4,
|
||||
// technicianId: this.brandId3
|
||||
activityType:val
|
||||
},
|
||||
custom: {
|
||||
showLoading: false,
|
||||
},
|
||||
}).then((res) => {
|
||||
// 分列
|
||||
leftHeight = 0;
|
||||
rightHeight = 0;
|
||||
// state.goodsList = [];
|
||||
state.goodsList = res.data;
|
||||
|
||||
state.count = 0
|
||||
// console.log(state.goodsList,"-----state.goodsList")
|
||||
state.leftGoodsList = []
|
||||
state.rightGoodsList = []
|
||||
// 重新计算商品列
|
||||
res.data.forEach((item) => {
|
||||
calculateGoodsColumn();
|
||||
});
|
||||
|
||||
});
|
||||
}
|
||||
// 初始化
|
||||
onMounted(async () => {
|
||||
if(props.fl){
|
||||
}
|
||||
// 加载商品列表
|
||||
if(!props.fl){
|
||||
state.goodsList = await getGoodsListByIds(spuIds.join(','));
|
||||
// 只有双列布局时需要
|
||||
if (layoutType === LayoutTypeEnum.TWO_COL) {
|
||||
// 分列
|
||||
calculateGoodsColumn();
|
||||
}
|
||||
}else{
|
||||
classValue("recommendNew");
|
||||
}
|
||||
|
||||
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.goods-md-wrap {
|
||||
.new-fenlei {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
margin:10px 0;
|
||||
justify-content: space-around;
|
||||
.list {
|
||||
width: 24%;
|
||||
&.on{
|
||||
.t {
|
||||
color: #e93422;
|
||||
}
|
||||
|
||||
.b {
|
||||
background: #e93422;
|
||||
color:white;
|
||||
}
|
||||
}
|
||||
.t {
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.b {
|
||||
// background: rgba(255, 102, 7);
|
||||
text-align: center;
|
||||
color: rgba(153,153,153);
|
||||
border-radius: 15px;
|
||||
width: 63%;
|
||||
margin: 0 auto;
|
||||
font-size: 12px;
|
||||
margin-top:5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// .goods-md-wrap {
|
||||
// width: 100%;
|
||||
// }
|
||||
|
||||
.goods-list-box {
|
||||
width: 50%;
|
||||
box-sizing: border-box;
|
||||
::v-deep &{
|
||||
.left-list, .right-list{
|
||||
// width:48%;
|
||||
}
|
||||
.left-list:nth-child(3n+2){
|
||||
margin-right:0;
|
||||
}
|
||||
}
|
||||
.left-list {
|
||||
&:nth-last-child(1) {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.right-list {
|
||||
&:nth-last-child(1) {
|
||||
margin-bottom: 0 !important;
|
||||
|
@ -170,8 +170,8 @@
|
||||
<image class="tag-icon" :src="sheep.$url.cdn(tagStyle.src || tagStyle.imgUrl)"></image>
|
||||
</view>
|
||||
<!-- <view v-if="seckillTag" class="seckill-tag ss-flex ss-row-center">秒杀</view> -->
|
||||
<view v-if="grouponTag" class="groupon-tag ss-flex ss-row-center">
|
||||
<view class="tag-icon">拼团</view>
|
||||
<view v-if="grouponTag" class="groupon-tag ss-flex ss-row-center" :class="state.themeType ? state.themeType : ''">
|
||||
<view class="tag-icon" :class="state.themeType ? state.themeType : ''">拼团</view>
|
||||
</view>
|
||||
<image class="lg-img-box" :src="sheep.$url.cdn(data.image || data.picUrl)" mode="aspectFill" />
|
||||
<view class="lg-goods-content ss-flex-1 ss-flex-col ss-row-between ss-p-b-10 ">
|
||||
@ -350,6 +350,7 @@
|
||||
*
|
||||
*/
|
||||
import {
|
||||
reactive,
|
||||
computed,
|
||||
getCurrentInstance,
|
||||
nextTick,
|
||||
@ -369,7 +370,11 @@
|
||||
import {
|
||||
PromotionActivityTypeEnum
|
||||
} from '@/sheep/util/const';
|
||||
|
||||
const app = computed(() => sheep.$store('app'));
|
||||
const state = reactive({
|
||||
themeType:app.value.platform.themeType
|
||||
});
|
||||
// console.log(PromotionActivityTypeEnum,"PromotionActivityTypeEnum")
|
||||
// 接收参数
|
||||
const props = defineProps({
|
||||
goodsFields: {
|
||||
|
@ -147,7 +147,7 @@
|
||||
data: activity
|
||||
} = await CombinationApi.getCombinationActivity(props.data.activityId);
|
||||
const ss = await SpuApi.getSpulist();
|
||||
console.log(ss, "getSpuListByIds")
|
||||
// console.log(ss, "getSpuListByIds")
|
||||
productList.value = ss.data;
|
||||
});
|
||||
</script>
|
||||
|
283
sheep/components/s-mof-block/s-mof-block.vue
Normal file
283
sheep/components/s-mof-block/s-mof-block.vue
Normal file
@ -0,0 +1,283 @@
|
||||
<!-- 全局 - 快捷入口 -->
|
||||
<template>
|
||||
<view class='new_czbk'>
|
||||
<view class="t">
|
||||
<text class="left-font">超值爆款</text>
|
||||
<view class="sub">美好生活由此开始</view>
|
||||
</view>
|
||||
<view class="new-list">
|
||||
<!-- <view class="item" @click="sheep.$router.go('/pages/goods/sales', {
|
||||
activityType: 'recommendBest',
|
||||
});"> -->
|
||||
<view class="item" @click="sheep.$router.go(`${props.data.list[0].url}`);">
|
||||
<view class="nei">
|
||||
<view class="l">
|
||||
<view class="t">今日推荐</view>
|
||||
<view class="c">店主诚意推荐品质商品</view>
|
||||
<view class="b">
|
||||
<!-- GO! -->
|
||||
<image
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/40a7582be7aeb5a6047415ab3a6728439a2798a4752ffcc1c063d66a534aa630.png"
|
||||
class="img"></image>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="r">
|
||||
<image
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/c80faeeeb2d6dadcdbe7e6d1a4caa06869b94301612cdf157414a10559b38267.png"
|
||||
class="img"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="item" @click="sheep.$router.go('/pages/goods/sales', {
|
||||
activityType: 'recommendHot',
|
||||
});"> -->
|
||||
<view class="item" @click="sheep.$router.go(`${props.data.list[1].url}`);">
|
||||
<view class="nei">
|
||||
<view class="l">
|
||||
<view class="t">热门榜单</view>
|
||||
<view class="c">店主诚意推荐品质商品</view>
|
||||
<view class="b">
|
||||
<!-- GO! -->
|
||||
<image
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/5c72fc99989bf0a7e59b57f519c76c9a98cb20478384e20b1b934aa8f80cc598.png"
|
||||
class="img"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="r">
|
||||
<image
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/904fd4848fde8025ccc17693662efd5b7bf5ec3f2656ecc7de407c8c46f910b2.png"
|
||||
class="img"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="item" @click="sheep.$router.go('/pages/goods/sales', {
|
||||
activityType: 'recommendNew',
|
||||
});"> -->
|
||||
<view class="item" @click="sheep.$router.go(`${props.data.list[2].url}`);">
|
||||
<view class="nei">
|
||||
<view class="l">
|
||||
<view class="t">首发新品</view>
|
||||
<view class="c">新品上架等 你来拿</view>
|
||||
<view class="b">
|
||||
<!-- GO! -->
|
||||
<image
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/ebb2fc0512d1bd6a6d21a2c07f6603bfd2ea6f7e23377eb4cd8118d89d666589.png"
|
||||
class="img"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="r">
|
||||
<image
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/7c71cbf2c757418302ea9ef2952893c24e1d46c4cc35a821f56be0f315bcabb0.png"
|
||||
class="img"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="item" @click="sheep.$router.go('/pages/goods/sales', {
|
||||
activityType: 'recommendGood',
|
||||
});"> -->
|
||||
<view class="item" @click="sheep.$router.go(`${props.data.list[3].url}`);">
|
||||
<view class="nei">
|
||||
<view class="l">
|
||||
<view class="t">促销单品</view>
|
||||
<view class="c">综合评选好 产品</view>
|
||||
<view class="b">
|
||||
<!-- GO! -->
|
||||
<image
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/aac8baa7a6feb9ee3459d1cf75ba9a7e8bacb5d93c88ac95c1b0ecd29b847f96.png"
|
||||
class="img"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="r">
|
||||
<image
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/8a61c35d82702c61f97ef3db43a8d6755b2eca3d78a22dbaa55851e815e96a23.png"
|
||||
class="img"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="clear:both;"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
reactive,
|
||||
computed
|
||||
} from 'vue';
|
||||
import sheep from '@/sheep';
|
||||
import {
|
||||
showMenuTools,
|
||||
closeMenuTools
|
||||
} from '@/sheep/hooks/useModal';
|
||||
// 接受参数
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
default: {},
|
||||
}
|
||||
});
|
||||
|
||||
console.log("====++++=====",props.data)
|
||||
const show = computed(() => sheep.$store('modal').menu);
|
||||
|
||||
function onClick(item) {
|
||||
closeMenuTools();
|
||||
if (item.url) sheep.$router.go(item.url);
|
||||
}
|
||||
|
||||
const list = [{
|
||||
url: '/pages/index/index',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/f4e03230b5cb9b2bf789b67df43125af1b3cef9c2abf4d8bca8f6fa5ded16a20.png',
|
||||
title: '首页',
|
||||
},
|
||||
{
|
||||
url: '/pages/index/search',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/96a288f2a0043c8defaa37e922828b3092ba785e1c191bf18f20dbd462261f7a.png',
|
||||
title: '搜索',
|
||||
},
|
||||
{
|
||||
url: '/pages/index/user',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/227699332b8ae736e220852e60215072eb2805478dab4909e085f89aeb3604cf.png',
|
||||
title: '个人中心',
|
||||
},
|
||||
{
|
||||
url: '/pages/index/cart',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/a45981116198a65db5f28ffd070f0078cfa66ac932a0136bf45ba7e8f401a1d0.png',
|
||||
title: '购物车',
|
||||
},
|
||||
{
|
||||
url: '/pages/user/goods-log',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/7e5ecfb841f2d89b778e1070ef867c17ccda48a5fea14a149f8eb1ce6aa26a87.png',
|
||||
title: '浏览记录',
|
||||
},
|
||||
{
|
||||
url: '/pages/user/goods-collect',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/9f83f4dc3cbf8b1e8e747f8dd79a260feaf65fa9ef3f2e2224015779f85119a1.png',
|
||||
title: '我的收藏',
|
||||
},
|
||||
{
|
||||
url: '/pages/chat/index',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/739f3165045b1552b71176297dab45eda2e192b976e25b1a458a8781a61b7557.png',
|
||||
title: '客服',
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.new_czbk {
|
||||
width: 100%;
|
||||
background: rgba(255, 229, 227);
|
||||
border-radius: 5px;
|
||||
margin: 0 auto;
|
||||
padding: 5px 0;
|
||||
// margin-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
padding-top: 10px;
|
||||
|
||||
&>.t {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 10px;
|
||||
|
||||
.left-font {
|
||||
color: rgba(252, 60, 62);
|
||||
font-size: 17px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.sub {
|
||||
background: rgba(248, 79, 43);
|
||||
color: white;
|
||||
border-radius: 20px 0px 20px 0px;
|
||||
padding: 0 13px;
|
||||
margin-left: 10px;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
.new-list {
|
||||
// width: 100%;
|
||||
margin-right: 10px;
|
||||
|
||||
.item {
|
||||
float: left;
|
||||
width: 50%;
|
||||
|
||||
.nei {
|
||||
margin: 10px;
|
||||
margin-right: 0;
|
||||
margin-bottom: 0;
|
||||
background: white;
|
||||
border-radius: 10px;
|
||||
padding: 8px 10px;
|
||||
display: flex;
|
||||
|
||||
.l {
|
||||
width: 50%;
|
||||
|
||||
.t {
|
||||
// font-size: 17px;
|
||||
}
|
||||
|
||||
.c {
|
||||
color: rgba(153, 153, 153);
|
||||
font-size: 12px;
|
||||
margin: 3px 0;
|
||||
}
|
||||
|
||||
.b {
|
||||
// display: flex;
|
||||
// align-items: center;
|
||||
// justify-content: space-around;
|
||||
// background: #329cff;
|
||||
// margin: 0 3px;
|
||||
// border-radius: 15px;
|
||||
// color: white;
|
||||
// font-weight: 700;
|
||||
// padding: 0px 9px;
|
||||
// font-style: oblique;
|
||||
|
||||
.img {
|
||||
width: 76%;
|
||||
height: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.r {
|
||||
width: 49%;
|
||||
|
||||
.img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// @media (max-width: 435px) {
|
||||
// .new_czbk {
|
||||
// .new-list {
|
||||
// .item {
|
||||
// width: 47%;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// @media (max-width: 379px) {
|
||||
// .new_czbk {
|
||||
// .new-list {
|
||||
// .item {
|
||||
// width: 46%;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
</style>
|
@ -16,11 +16,7 @@
|
||||
:key="item.title" @tap="sheep.$router.go(item.path, { type: item.value })">
|
||||
<uni-badge class="uni-badge-left-margin" :text="numData.orderCount[item.count]" absolute="rightTop"
|
||||
size="small">
|
||||
<image v-if="index == 0" class="item-icon" :src="imag0" mode="aspectFit" />
|
||||
<image v-if="index == 1" class="item-icon" :src="imag1" mode="aspectFit" />
|
||||
<image v-if="index == 2" class="item-icon" :src="imag2" mode="aspectFit" />
|
||||
<image v-if="index == 3" class="item-icon" :src="imag3" mode="aspectFit" />
|
||||
<image v-if="index == 4" class="item-icon" :src="imag4" mode="aspectFit" />
|
||||
<image class="item-icon" :src="item.icon" mode="aspectFit" />
|
||||
</uni-badge>
|
||||
<view class="menu-title">{{ item.title }}</view>
|
||||
</view>
|
||||
@ -39,13 +35,21 @@
|
||||
*/
|
||||
import sheep from '@/sheep';
|
||||
import {
|
||||
computed
|
||||
computed,
|
||||
reactive,
|
||||
ref
|
||||
} from 'vue';
|
||||
const app = computed(() => sheep.$store('app'));
|
||||
const state = reactive({
|
||||
themeType: app.value.platform.themeType
|
||||
});
|
||||
const orderMap = ref([]);
|
||||
|
||||
const orderMap = [{
|
||||
if (state.themeType == 'lv') {
|
||||
orderMap.value = [{
|
||||
title: '待付款',
|
||||
value: '1',
|
||||
icon: '/static/img/shop/order/no_pay.png',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/853135945c3ba85e1e59b7b4998fc058353b0d6a293d123a7208ea119bbc3511.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'unpaid',
|
||||
count: 'unpaidCount',
|
||||
@ -53,7 +57,7 @@
|
||||
{
|
||||
title: '待发货',
|
||||
value: '2',
|
||||
icon: '/static/img/shop/order/no_take.png',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/c9957347129a658ed5c9217bd913e4ecd8d05b161f9ba7931a7f9915657dde14.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'take',
|
||||
count: 'undeliveredCount',
|
||||
@ -61,7 +65,7 @@
|
||||
{
|
||||
title: '待收货',
|
||||
value: '3',
|
||||
icon: '/static/img/shop/order/no_take.png',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/cdd41605506b625510a90ce6d8194ad4b66be37ec5bdf6a56ddcf8d9206eff40.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'noget',
|
||||
count: 'deliveredCount',
|
||||
@ -69,7 +73,7 @@
|
||||
{
|
||||
title: '待评价',
|
||||
value: '4',
|
||||
icon: '/static/img/shop/order/no_comment.png',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/c2c90f1a7bee3d1d0e933b7ab7c5b186b4dbc0adf8748ceb4e69cabcbfab136f.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'nocomment',
|
||||
count: 'uncommentedCount',
|
||||
@ -77,7 +81,178 @@
|
||||
{
|
||||
title: '退款/售后',
|
||||
value: '0',
|
||||
icon: '/static/img/shop/order/change_order.png',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/d392c395c9aa2fa0a6d250b4bad574909945f56cb480b7a05707c4f4e7e23b19.png',
|
||||
path: '/pages/order/aftersale/list',
|
||||
type: 'aftersale',
|
||||
count: 'afterSaleCount',
|
||||
}
|
||||
]
|
||||
} else if (state.themeType == 'blue') {
|
||||
orderMap.value = [{
|
||||
title: '待付款',
|
||||
value: '1',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/e947004cbd4ffa27cc5b0b752da5cebfc4133a280961711c581025ff2e28e04b.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'unpaid',
|
||||
count: 'unpaidCount',
|
||||
},
|
||||
{
|
||||
title: '待发货',
|
||||
value: '2',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/1658843d761c5d2a130feeabe86b82f11ef6f9546db4fd013eb94ab4d759858f.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'take',
|
||||
count: 'undeliveredCount',
|
||||
},
|
||||
{
|
||||
title: '待收货',
|
||||
value: '3',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/6c69c4f4b1887889a0d0a5ca34a26582a8ba4f0600ae2db3ea6c76a67fcdab59.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'noget',
|
||||
count: 'deliveredCount',
|
||||
},
|
||||
{
|
||||
title: '待评价',
|
||||
value: '4',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/71e01ef9cfe2c54695169248f142dd28d37b56b61fc36622b98b415b70e7b495.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'nocomment',
|
||||
count: 'uncommentedCount',
|
||||
},
|
||||
{
|
||||
title: '退款/售后',
|
||||
value: '0',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/3bcf948bf269e61d0fe709836b2d36f646bfc3adbc968efc9404e41e7be6f04d.png',
|
||||
path: '/pages/order/aftersale/list',
|
||||
type: 'aftersale',
|
||||
count: 'afterSaleCount',
|
||||
}
|
||||
]
|
||||
|
||||
} else if (state.themeType == 'pink') {
|
||||
orderMap.value = [{
|
||||
title: '待付款',
|
||||
value: '1',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/f8efe1b47be8b8059469ff33fc401c1c89330409acf9ce7f979528cc3aad3441.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'unpaid',
|
||||
count: 'unpaidCount',
|
||||
},
|
||||
{
|
||||
title: '待发货',
|
||||
value: '2',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/ca96eec5b194101a6aec6d4088c944339b4552e01b605a8fc99a15859579b31f.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'take',
|
||||
count: 'undeliveredCount',
|
||||
},
|
||||
{
|
||||
title: '待收货',
|
||||
value: '3',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/74d8e6ec206bc7f33f577babd3aee0991cd57d4f4fe386bc30af0f37d11133ca.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'noget',
|
||||
count: 'deliveredCount',
|
||||
},
|
||||
{
|
||||
title: '待评价',
|
||||
value: '4',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/ffa9d0bfb0e2efcc213b2ff69d8da9a27bce77a6120eb338195cb1fd089147e0.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'nocomment',
|
||||
count: 'uncommentedCount',
|
||||
},
|
||||
{
|
||||
title: '退款/售后',
|
||||
value: '0',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/5d35ebc74ddb39d70b8c8a03d53aff9023f6f6cafec1a7e0a59f93b2379517c6.png',
|
||||
path: '/pages/order/aftersale/list',
|
||||
type: 'aftersale',
|
||||
count: 'afterSaleCount',
|
||||
}
|
||||
]
|
||||
|
||||
} else if (state.themeType == 'orange') {
|
||||
orderMap.value = [{
|
||||
title: '待付款',
|
||||
value: '1',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/0dd1d348022f3a4afc393e0ca1a903039feeb9931b18903790a12b3cb4d34c80.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'unpaid',
|
||||
count: 'unpaidCount',
|
||||
},
|
||||
{
|
||||
title: '待发货',
|
||||
value: '2',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/f7916da551b40545227bca74dde309a24c6516ba292087a4aed717cac2e499e6.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'take',
|
||||
count: 'undeliveredCount',
|
||||
},
|
||||
{
|
||||
title: '待收货',
|
||||
value: '3',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/6168b9bfe12ffda1805880f4da75546af803565a26ae034b2604f0280f818595.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'noget',
|
||||
count: 'deliveredCount',
|
||||
},
|
||||
{
|
||||
title: '待评价',
|
||||
value: '4',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/837009349108b9f5fee0c490d94c070367dae5312298ddf47421f4706ae884f1.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'nocomment',
|
||||
count: 'uncommentedCount',
|
||||
},
|
||||
{
|
||||
title: '退款/售后',
|
||||
value: '0',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/c1ae501cf8081e1402d85de5de66a63733f79f87d5599eeba98504f3246a9ef7.png',
|
||||
path: '/pages/order/aftersale/list',
|
||||
type: 'aftersale',
|
||||
count: 'afterSaleCount',
|
||||
}
|
||||
]
|
||||
|
||||
} else {
|
||||
orderMap.value = [{
|
||||
title: '待付款',
|
||||
value: '1',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/623cb21c48a8e74cad53266c2b51db74408871f85a7e6adcb375513011659197.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'unpaid',
|
||||
count: 'unpaidCount',
|
||||
},
|
||||
{
|
||||
title: '待发货',
|
||||
value: '2',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/908b654b1d00bdb10f0364607fa2799f1209f2e986cb58582f0dc6ebe52d9ce4.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'take',
|
||||
count: 'undeliveredCount',
|
||||
},
|
||||
{
|
||||
title: '待收货',
|
||||
value: '3',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/686bf80ff876ed116df99552e5649e10ed5a9cddcc7b3cd5adc641ec022366cf.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'noget',
|
||||
count: 'deliveredCount',
|
||||
},
|
||||
{
|
||||
title: '待评价',
|
||||
value: '4',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/a6bc4ea6f95aaaec8b12ce20886d2dd7e1db7b547ba1c52f8b4bebb35f3e7cf3.png',
|
||||
path: '/pages/order/list',
|
||||
type: 'nocomment',
|
||||
count: 'uncommentedCount',
|
||||
},
|
||||
{
|
||||
title: '退款/售后',
|
||||
value: '0',
|
||||
icon: 'https://zysc.fjptzykj.com:3000/shangcheng/f4f14b9cc394e0791928257174fa1b62e05a535f5556f07218f058ffc6cefe80.png',
|
||||
path: '/pages/order/aftersale/list',
|
||||
type: 'aftersale',
|
||||
count: 'afterSaleCount',
|
||||
@ -90,6 +265,8 @@
|
||||
// path: '/pages/order/list',
|
||||
// }
|
||||
];
|
||||
}
|
||||
|
||||
|
||||
const numData = computed(() => sheep.$store('user').numData);
|
||||
|
||||
|
@ -130,6 +130,7 @@
|
||||
btnBuy,
|
||||
activityIds
|
||||
} = props.data || {};
|
||||
|
||||
const {
|
||||
marginLeft,
|
||||
marginRight
|
||||
@ -217,7 +218,7 @@
|
||||
for (const activity of activityList) {
|
||||
state.spuList.push(await getSpuDetail(activity.spuId));
|
||||
}
|
||||
|
||||
console.log(state.spuList,"state.spuList");
|
||||
// 循环活动列表
|
||||
activityList.forEach((activity) => {
|
||||
// 查找对应的 spu 并更新价格
|
||||
|
@ -211,7 +211,7 @@
|
||||
// const { data: activity } = await SeckillApi.getSeckillActivity(props.data.activityId);
|
||||
// const { data: spu } = await SpuApi.getSpuDetail(activity.spuId);
|
||||
const data = await SpuApi.getSpuSeckilllist();
|
||||
console.log(data,"datadatadatadatadatadatadatadata")
|
||||
// console.log(data,"datadatadatadatadatadatadatadata")
|
||||
productList.value = data.data;
|
||||
});
|
||||
|
||||
|
@ -5,11 +5,7 @@
|
||||
<view class="ss-modal-box bg-white ss-flex-col">
|
||||
<view class="modal-header ss-flex ss-col-center">
|
||||
<view class="header-left ss-m-r-30">
|
||||
<image
|
||||
class="sku-image"
|
||||
:src="state.selectedSku.picUrl || goodsInfo.picUrl"
|
||||
mode="aspectFill"
|
||||
/>
|
||||
<image class="sku-image" :src="state.selectedSku.picUrl || goodsInfo.picUrl" mode="aspectFill" />
|
||||
</view>
|
||||
<view class="header-right ss-flex-col ss-row-between ss-flex-1">
|
||||
<view class="goods-title ss-line-2">{{ goodsInfo.name }}</view>
|
||||
@ -32,34 +28,35 @@
|
||||
<view class="sku-item ss-m-b-20" v-for="property in propertyList" :key="property.id">
|
||||
<view class="label-text ss-m-b-20">{{ property.name }}</view>
|
||||
<view class="ss-flex ss-col-center ss-flex-wrap">
|
||||
<button
|
||||
class="ss-reset-button spec-btn"
|
||||
v-for="value in property.values"
|
||||
:class="[
|
||||
<button class="ss-reset-button spec-btn" v-for="value in property.values" :class="[
|
||||
{
|
||||
'ui-BG-Main-Gradient': state.currentPropertyArray[property.id] === value.id,
|
||||
},
|
||||
{
|
||||
'disabled-btn': value.disabled === true,
|
||||
},
|
||||
]"
|
||||
:key="value.id"
|
||||
:disabled="value.disabled === true"
|
||||
@tap="onSelectSku(property.id, value.id)"
|
||||
>
|
||||
{
|
||||
'lv' : state.themeType == 'lv' && state.currentPropertyArray[property.id] === value.id,
|
||||
},
|
||||
{
|
||||
'blue' : state.themeType == 'blue' && state.currentPropertyArray[property.id] === value.id,
|
||||
},
|
||||
{
|
||||
'pink' : state.themeType == 'pink' && state.currentPropertyArray[property.id] === value.id,
|
||||
},
|
||||
{
|
||||
'orange' : state.themeType == 'orange' && state.currentPropertyArray[property.id] === value.id,
|
||||
},
|
||||
]" :key="value.id" :disabled="value.disabled === true" @tap="onSelectSku(property.id, value.id)">
|
||||
{{ value.name }}
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="buy-num-box ss-flex ss-col-center ss-row-between ss-m-b-40">
|
||||
<view class="label-text">购买数量</view>
|
||||
<su-number-box
|
||||
:min="1"
|
||||
:max="state.selectedSku.stock"
|
||||
:step="1"
|
||||
v-model="state.selectedSku.goods_num"
|
||||
@change="onNumberChange($event)"
|
||||
/>
|
||||
<su-number-box :min="1" :max="state.selectedSku.stock" :step="1"
|
||||
v-model="state.selectedSku.goods_num" @change="onNumberChange($event)"
|
||||
:vsl=state.themeType />
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
@ -67,10 +64,10 @@
|
||||
<!-- 操作区 -->
|
||||
<view class="modal-footer border-top">
|
||||
<view class="buy-box ss-flex ss-col-center ss-flex ss-col-center ss-row-center">
|
||||
<button class="ss-reset-button add-btn ui-Shadow-Main" @tap="onAddCart"
|
||||
>加入购物车</button
|
||||
>
|
||||
<button class="ss-reset-button buy-btn ui-Shadow-Main" @tap="onBuy">立即购买</button>
|
||||
<button :class="state.themeType ? `${state.themeType}v` : ''"
|
||||
class="ss-reset-button add-btn ui-Shadow-Main" @tap="onAddCart">加入购物车</button>
|
||||
<button :class="state.themeType ? state.themeType : ''"
|
||||
class="ss-reset-button buy-btn ui-Shadow-Main" @tap="onBuy">立即购买</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -78,15 +75,23 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, reactive, watch } from 'vue';
|
||||
import {
|
||||
computed,
|
||||
reactive,
|
||||
watch
|
||||
} from 'vue';
|
||||
import sheep from '@/sheep';
|
||||
import { formatStock, convertProductPropertyList, fen2yuan } from '@/sheep/hooks/useGoods';
|
||||
|
||||
import {
|
||||
formatStock,
|
||||
convertProductPropertyList,
|
||||
fen2yuan
|
||||
} from '@/sheep/hooks/useGoods';
|
||||
const app = computed(() => sheep.$store('app'));
|
||||
const emits = defineEmits(['change', 'addCart', 'buy', 'close']);
|
||||
const props = defineProps({
|
||||
goodsInfo: {
|
||||
type: Object,
|
||||
default() {},
|
||||
default () {},
|
||||
},
|
||||
show: {
|
||||
type: Boolean,
|
||||
@ -97,6 +102,7 @@
|
||||
const state = reactive({
|
||||
selectedSku: {}, // 选中的 SKU
|
||||
currentPropertyArray: [], // 当前选中的属性,实际是个 Map。key 是 property 编号,value 是 value 编号
|
||||
themeType: app.value.platform.themeType
|
||||
});
|
||||
|
||||
const propertyList = convertProductPropertyList(props.goodsInfo.skus);
|
||||
@ -114,8 +120,7 @@
|
||||
() => state.selectedSku,
|
||||
(newVal) => {
|
||||
emits('change', newVal);
|
||||
},
|
||||
{
|
||||
}, {
|
||||
immediate: true, // 立即执行
|
||||
deep: true, // 深度监听
|
||||
},
|
||||
@ -224,7 +229,8 @@
|
||||
// 如果当前 property id 不存在于有库存的 SKU 中,则禁用
|
||||
for (let valueIndex in propertyList[propertyIndex]['values']) {
|
||||
propertyList[propertyIndex]['values'][valueIndex]['disabled'] =
|
||||
noChooseValueIds.indexOf(propertyList[propertyIndex]['values'][valueIndex]['id']) < 0; // true 禁用 or false 不禁用
|
||||
noChooseValueIds.indexOf(propertyList[propertyIndex]['values'][valueIndex]['id']) <
|
||||
0; // true 禁用 or false 不禁用
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -295,6 +301,26 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.bluev {
|
||||
background-color: rgba(33, 202, 254) !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.lvv {
|
||||
background-color: rgba(253, 157, 17) !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.pinkv {
|
||||
background-color: black !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.orangev {
|
||||
background-color: rgba(253, 157, 17) !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
// 购买
|
||||
.buy-box {
|
||||
padding: 10rpx 0;
|
||||
|
@ -1,15 +1,16 @@
|
||||
<!-- 海报弹窗 -->
|
||||
<template>
|
||||
<su-popup :show="show" round="10" @close="onClosePoster" type="center" class="popup-box">
|
||||
<view class="ss-flex-col ss-col-center ss-row-center">
|
||||
<view class="ss-flex-col ss-col-center ss-row-center"
|
||||
:style="{
|
||||
height: poster.css.height + 'px',
|
||||
width: poster.css.width + 'px',
|
||||
}">
|
||||
<image
|
||||
v-if="!!painterImageUrl"
|
||||
class="poster-img"
|
||||
:src="painterImageUrl"
|
||||
:style="{
|
||||
height: poster.css.height + 'px',
|
||||
width: poster.css.width + 'px',
|
||||
}"
|
||||
|
||||
:show-menu-by-longpress="true"
|
||||
/>
|
||||
</view>
|
||||
@ -17,7 +18,6 @@
|
||||
class="poster-btn-box ss-m-t-20 ss-flex ss-row-between ss-col-center"
|
||||
v-if="!!painterImageUrl"
|
||||
>
|
||||
<button class="cancel-btn ss-reset-button" @tap="onClosePoster">取消</button>
|
||||
<button class="save-btn ss-reset-button ui-BG-Main" @tap="onSavePoster">
|
||||
{{
|
||||
['wechatOfficialAccount', 'H5'].includes(sheep.$platform.name)
|
||||
@ -25,6 +25,7 @@
|
||||
: '保存图片'
|
||||
}}
|
||||
</button>
|
||||
<button class="cancel-btn ss-reset-button" @tap="onClosePoster">取消</button>
|
||||
</view>
|
||||
<!-- 海报画板:默认隐藏只用来生成海报。生成方式为主动调用 -->
|
||||
<l-painter
|
||||
@ -65,6 +66,7 @@
|
||||
css: {
|
||||
// 根节点若无尺寸,自动获取父级节点
|
||||
width: sheep.$platform.device.windowWidth * 0.9,
|
||||
// width: 1 * 0.9,
|
||||
height: 550,
|
||||
},
|
||||
views: [],
|
||||
@ -137,10 +139,11 @@
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: -80rpx;
|
||||
bottom: -172rpx;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.cancel-btn {
|
||||
width: 240rpx;
|
||||
width: 100%;
|
||||
height: 70rpx;
|
||||
line-height: 70rpx;
|
||||
background: $white;
|
||||
@ -148,10 +151,11 @@
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
color: $dark-9;
|
||||
margin-top:10px;
|
||||
}
|
||||
|
||||
.save-btn {
|
||||
width: 240rpx;
|
||||
width: 100%;
|
||||
height: 70rpx;
|
||||
line-height: 70rpx;
|
||||
border-radius: 35rpx;
|
||||
@ -162,5 +166,7 @@
|
||||
|
||||
.poster-img {
|
||||
border-radius: 20rpx;
|
||||
width: 100%;
|
||||
height:100%;
|
||||
}
|
||||
</style>
|
||||
|
@ -1,24 +1,12 @@
|
||||
<template>
|
||||
<view class="u-page__item" v-if="tabbar?.items?.length > 0">
|
||||
<su-tabbar
|
||||
:value="path"
|
||||
:fixed="true"
|
||||
:placeholder="true"
|
||||
:safeAreaInsetBottom="true"
|
||||
:inactiveColor="tabbar.style.color"
|
||||
:activeColor="tabbar.style.activeColor"
|
||||
:midTabBar="tabbar.mode === 2"
|
||||
:customStyle="tabbarStyle"
|
||||
>
|
||||
<su-tabbar-item
|
||||
v-for="(item, index) in tabbar.items"
|
||||
:key="item.text"
|
||||
:text="item.text"
|
||||
:name="item.url"
|
||||
:isCenter="getTabbarCenter(index)"
|
||||
:centerImage="sheep.$url.cdn(item.iconUrl)"
|
||||
<su-tabbar :value="path" :fixed="true" :placeholder="true" :safeAreaInsetBottom="true"
|
||||
:inactiveColor="tabbar.style.color" :activeColor="tabbar.style.activeColor" :midTabBar="tabbar.mode === 2"
|
||||
:customStyle="tabbarStyle">
|
||||
<su-tabbar-item v-for="(item, index) in Citrn" :key="item.text" :text="item.text" :name="item.url"
|
||||
:isCenter="getTabbarCenter(index)" :centerImage="sheep.$url.cdn(item.iconUrl)"
|
||||
@tap="sheep.$router.go(item.url)"
|
||||
>
|
||||
:vl="state.themeType">
|
||||
<template v-slot:active-icon>
|
||||
<image class="u-page__item__slot-icon" :src="sheep.$url.cdn(item.activeIconUrl)"></image>
|
||||
</template>
|
||||
@ -31,17 +19,171 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, unref } from 'vue';
|
||||
import {
|
||||
computed,
|
||||
unref,
|
||||
ref,
|
||||
reactive
|
||||
} from 'vue';
|
||||
import sheep from '@/sheep';
|
||||
|
||||
const app = computed(() => sheep.$store('app'));
|
||||
const state = reactive({
|
||||
themeType:app.value.platform.themeType
|
||||
});
|
||||
const tabbar = computed(() => {
|
||||
return sheep.$store('app').template.basic?.tabbar;
|
||||
});
|
||||
console.log('--------', tabbar.value.items)
|
||||
const Citrn = ref([]);
|
||||
|
||||
|
||||
|
||||
|
||||
if (state.themeType == 'lv') {
|
||||
Citrn.value = [{
|
||||
text: "首页",
|
||||
url: "/pages/index/index",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/1-001.png",
|
||||
activeIconUrl: "https://zysc.fjptzykj.com:3000/shangcheng/fdece57673d74d956692edad8c83e85b62503f90f1286cfcbfa9e1c564e127f0.png"
|
||||
},
|
||||
{
|
||||
text: "分类",
|
||||
url: "/pages/index/category?id=3",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/2-001.png",
|
||||
activeIconUrl: "https://zysc.fjptzykj.com:3000/shangcheng/3f681bdfd791d2170fff188be799c588b60a3ceb5b9cd22b8b94a1ae508783d4.png"
|
||||
},
|
||||
{
|
||||
text: "购物车",
|
||||
url: "/pages/index/cart",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/3-001.png",
|
||||
activeIconUrl: "https://zysc.fjptzykj.com:3000/shangcheng/c8e2bc5e2d49ad959951e52c4f4020d6b794310389a09138e1b454be6d6086ec.png"
|
||||
},
|
||||
{
|
||||
text: "我的",
|
||||
url: "/pages/index/user",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/4-001.png",
|
||||
activeIconUrl: "https://zysc.fjptzykj.com:3000/shangcheng/cfd3ca7242acfa44b890c66b43ea39dc83de0570a20718251c73785540085002.png"
|
||||
}
|
||||
];
|
||||
} else if (state.themeType == 'blue') {
|
||||
Citrn.value = [{
|
||||
text: "首页",
|
||||
url: "/pages/index/index",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/1-001.png",
|
||||
activeIconUrl: "https://zysc.fjptzykj.com:3000/shangcheng/d353e289077f36dab00bb39b161e04364e8d5c1f8e86b2c8ad77e2efc8b38c80.png"
|
||||
},
|
||||
{
|
||||
text: "分类",
|
||||
url: "/pages/index/category?id=3",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/2-001.png",
|
||||
activeIconUrl: "https://zysc.fjptzykj.com:3000/shangcheng/ffdbfc0244b68cbc0985339049e9b5b5cddf16e50cf4c0ec7326efd61dc5334d.png"
|
||||
},
|
||||
{
|
||||
text: "购物车",
|
||||
url: "/pages/index/cart",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/3-001.png",
|
||||
activeIconUrl: "https://zysc.fjptzykj.com:3000/shangcheng/5d399948d0d391a2ae88fb29049ced561106d7bc6d3bae525c32f3f6dfb92677.png"
|
||||
},
|
||||
{
|
||||
text: "我的",
|
||||
url: "/pages/index/user",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/4-001.png",
|
||||
activeIconUrl: "https://zysc.fjptzykj.com:3000/shangcheng/4a5387da733de9a9b2bfe921d0a3f09031cc6da7d3bf1b6125eb6635c9e5f7e9.png"
|
||||
}
|
||||
];
|
||||
|
||||
} else if (state.themeType == 'pink') {
|
||||
Citrn.value = [{
|
||||
text: "首页",
|
||||
url: "/pages/index/index",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/1-001.png",
|
||||
activeIconUrl: "https://zysc.fjptzykj.com:3000/shangcheng/0af8fd1f7dd91b22ce8480a4f75591d237f3a359a9d991e4eb333eda96f755fe.png"
|
||||
},
|
||||
{
|
||||
text: "分类",
|
||||
url: "/pages/index/category?id=3",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/2-001.png",
|
||||
activeIconUrl: "https://zysc.fjptzykj.com:3000/shangcheng/15548546af5bd5e13ff5c69c5acab5ab0d3d0333b63d583fd0470f3d48bf4e76.png"
|
||||
},
|
||||
{
|
||||
text: "购物车",
|
||||
url: "/pages/index/cart",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/3-001.png",
|
||||
activeIconUrl: "https://zysc.fjptzykj.com:3000/shangcheng/27ed7f014ba28a6c257c84c2ad6e8c73335d8e9df2076db4aedff1c5d03c66ba.png"
|
||||
},
|
||||
{
|
||||
text: "我的",
|
||||
url: "/pages/index/user",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/4-001.png",
|
||||
activeIconUrl: "https://zysc.fjptzykj.com:3000/shangcheng/059277d5bfe7b44ee74cece09fbe8515f5d021f20b2a9729590265cdf893f31a.png"
|
||||
}
|
||||
];
|
||||
|
||||
} else if (state.themeType == 'orange') {
|
||||
Citrn.value = [{
|
||||
text: "首页",
|
||||
url: "/pages/index/index",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/1-001.png",
|
||||
activeIconUrl: "https://zysc.fjptzykj.com:3000/shangcheng/aab810be4dea52817656ac3ae17ed418561bc4b12b4e33116cb68abaf362311f.png"
|
||||
},
|
||||
{
|
||||
text: "分类",
|
||||
url: "/pages/index/category?id=3",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/2-001.png",
|
||||
activeIconUrl: "https://zysc.fjptzykj.com:3000/shangcheng/c972bdc6808b37c9c88eac52bb8feb2bf787874a64b45a5ac3e41be60dee0994.png"
|
||||
},
|
||||
{
|
||||
text: "购物车",
|
||||
url: "/pages/index/cart",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/3-001.png",
|
||||
activeIconUrl: "https://zysc.fjptzykj.com:3000/shangcheng/69febc6f7f2371180ae3e11c25bf46c046bdb1b80a14f0b5df3abbea060f47ac.png"
|
||||
},
|
||||
{
|
||||
text: "我的",
|
||||
url: "/pages/index/user",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/4-001.png",
|
||||
activeIconUrl: "https://zysc.fjptzykj.com:3000/shangcheng/de40b82a64b9554092cc7c35621ce1a438bbf234e9b43567790a7b9bc1b8f618.png"
|
||||
}
|
||||
];
|
||||
|
||||
} else {
|
||||
Citrn.value = [{
|
||||
text: "首页",
|
||||
url: "/pages/index/index",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/1-001.png",
|
||||
activeIconUrl: "http://mall.yudao.iocoder.cn/static/images/1-002.png"
|
||||
},
|
||||
{
|
||||
text: "分类",
|
||||
url: "/pages/index/category?id=3",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/2-001.png",
|
||||
activeIconUrl: "http://mall.yudao.iocoder.cn/static/images/2-002.png"
|
||||
},
|
||||
{
|
||||
text: "购物车",
|
||||
url: "/pages/index/cart",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/3-001.png",
|
||||
activeIconUrl: "http://mall.yudao.iocoder.cn/static/images/3-002.png"
|
||||
},
|
||||
{
|
||||
text: "我的",
|
||||
url: "/pages/index/user",
|
||||
iconUrl: "http://mall.yudao.iocoder.cn/static/images/4-001.png",
|
||||
activeIconUrl: "http://mall.yudao.iocoder.cn/static/images/4-002.png"
|
||||
}
|
||||
];
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
const tabbarStyle = computed(() => {
|
||||
const backgroundStyle = tabbar.value.style;
|
||||
if (backgroundStyle.bgType === 'color') {
|
||||
return { background: backgroundStyle.bgColor };
|
||||
return {
|
||||
background: backgroundStyle.bgColor
|
||||
};
|
||||
}
|
||||
if (backgroundStyle.bgType === 'img')
|
||||
return {
|
||||
@ -53,9 +195,9 @@
|
||||
|
||||
const getTabbarCenter = (index) => {
|
||||
if (unref(tabbar).mode !== 2) return false;
|
||||
return unref(tabbar).items % 2 > 0
|
||||
? Math.ceil(unref(tabbar).items.length / 2) === index + 1
|
||||
: false;
|
||||
return unref(tabbar).items % 2 > 0 ?
|
||||
Math.ceil(unref(tabbar).items.length / 2) === index + 1 :
|
||||
false;
|
||||
};
|
||||
|
||||
const props = defineProps({
|
||||
|
@ -1,7 +1,11 @@
|
||||
<!-- 装修用户组件:用户卡片 -->
|
||||
<template>
|
||||
<view class="ss-user-info-wrap ss-p-t-50" style="z-index: 9999;">
|
||||
<image class="seckill" src="@/static/images/seckilbg.png"></image>
|
||||
<image class="seckill" src="https://zysc.fjptzykj.com:3000/shangcheng/e08f161b6bf1eddf5132fe4c4b087d75f7e77590a2f546147bd094593db83eb0.png" v-if="state.themeType == ''"></image>
|
||||
<image class="seckill" src="https://zysc.fjptzykj.com:3000/shangcheng/7925fd9e2c1df9cd29462c946f7c54d89d148b03d5fd366864636c3343282a2b.png" v-if="state.themeType == 'lv'"></image>
|
||||
<image class="seckill" src="https://zysc.fjptzykj.com:3000/shangcheng/b350b54f38628fcb465805b81d624717dc83598604c4e58c674ae8558dc7386c.png" v-if="state.themeType == 'blue'"></image>
|
||||
<image class="seckill" src="https://zysc.fjptzykj.com:3000/shangcheng/806e2d991890cab22cbeeb6ac549d5d6179f04099203e3db0256ca25544bfb5a.png" v-if="state.themeType == 'pink'"></image>
|
||||
<image class="seckill" src="https://zysc.fjptzykj.com:3000/shangcheng/ad23c1846977e232b50c3382d526b4d0d8bf2694b04f8090b2e873381cccab8b.png" v-if="state.themeType == 'orange'"></image>
|
||||
<view class="ss-flex ss-col-center ss-row-between ">
|
||||
<view class="left-box ss-flex ss-col-center ss-m-l-36">
|
||||
<view class="avatar-box ss-m-r-24">
|
||||
@ -10,10 +14,17 @@
|
||||
? sheep.$url.cdn(userInfo.avatar)
|
||||
: defaultAvatar
|
||||
" mode="aspectFill" @tap="sheep.$router.go('/pages/user/info')"></image>
|
||||
<image v-if="userInfo.activate && userInfo.activate != 4" class="vipCard"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/8064149c53fe05f8d20263fba31992da2d24a751877a4ddcc696d7f53b5cc771.png">
|
||||
</image>
|
||||
</view>
|
||||
<view>
|
||||
<view style="z-index:22222;">
|
||||
<view class="nickname-box ss-flex ss-col-center">
|
||||
<view class="nick-name ss-m-r-20">{{ userInfo?.nickname || nickname }}</view>
|
||||
<view class="vipImg" v-if="userInfo.activate && userInfo.activate != 4">
|
||||
<image class="img"
|
||||
src="https://zysc.fjptzykj.com:3000/shangcheng/0419db3d6a991486176256374c05c2834006fd42b3f5f80e3ff385b027b7c34f.png" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="nickname-box ss-flex ss-col-center">
|
||||
<view class="nick-name ss-m-r-20">{{ userInfo?.mobile || mobile }}</view>
|
||||
@ -30,13 +41,13 @@
|
||||
</view>
|
||||
</view>
|
||||
<!-- 提示绑定手机号 先隐藏 yudao 需要再修改 -->
|
||||
<view class="bind-mobile-box ss-flex ss-row-between ss-col-center" v-if="isLogin && !userInfo.mobile">
|
||||
<!-- <view class="bind-mobile-box ss-flex ss-row-between ss-col-center" v-if="isLogin && !userInfo.mobile">
|
||||
<view class="ss-flex">
|
||||
<text class="cicon-mobile-o" />
|
||||
<view class="mobile-title ss-m-l-20"> 点击绑定手机号确保账户安全 </view>
|
||||
</view>
|
||||
<button class="ss-reset-button bind-btn" @tap="onBind">去绑定</button>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -66,7 +77,10 @@
|
||||
showShareModal,
|
||||
showAuthModal
|
||||
} from '@/sheep/hooks/useModal';
|
||||
|
||||
const app = computed(() => sheep.$store('app'));
|
||||
const state = reactive({
|
||||
themeType: app.value.platform.themeType
|
||||
});
|
||||
// 用户信息
|
||||
const userInfo = computed(() => sheep.$store('user').userInfo);
|
||||
console.log('用户信息', userInfo);
|
||||
@ -108,7 +122,17 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.qiandao{
|
||||
.vipImg {
|
||||
width: 42px;
|
||||
height: 16px;
|
||||
|
||||
.img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.qiandao {
|
||||
width: 50px;
|
||||
height: 30px;
|
||||
background: yellow;
|
||||
@ -125,12 +149,26 @@
|
||||
.avatar-box {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
.avatar-img {
|
||||
width: 97%;
|
||||
height: 93%;
|
||||
left: 1px;
|
||||
top: 1px;
|
||||
border-radius: 50%;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.vipCard {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: -2px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -180,12 +218,13 @@
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
|
||||
.seckill {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top:0;
|
||||
left:0;
|
||||
height:217px;
|
||||
z-index:0;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 217px;
|
||||
z-index: 0;
|
||||
}
|
||||
</style>
|
@ -12,9 +12,11 @@ console.log(`[芋道商城 ${version}] http://doc.iocoder.cn`);
|
||||
export const apiPath = import.meta.env.SHOPRO_API_PATH;
|
||||
export const staticUrl = import.meta.env.SHOPRO_STATIC_URL;
|
||||
export const websocketPath = import.meta.env.SHOPRO_WEBSOCKET_PATH;
|
||||
export const kefuPath = import.meta.env.SHOPRO_KEFU_PATH;
|
||||
export default {
|
||||
baseUrl,
|
||||
apiPath,
|
||||
staticUrl,
|
||||
websocketPath,
|
||||
kefuPath
|
||||
};
|
||||
|
@ -8,6 +8,11 @@ import AuthUtil from '@/sheep/api/member/auth';
|
||||
// 打开授权弹框
|
||||
export function showAuthModal(type = 'smsLogin') {
|
||||
const modal = $store('modal');
|
||||
// #ifdef MP
|
||||
modal.$patch((state) => {
|
||||
state.auth = '';
|
||||
});
|
||||
// #endif
|
||||
if (modal.auth !== '') {
|
||||
closeAuthModal();
|
||||
setTimeout(() => {
|
||||
|
@ -2,7 +2,9 @@ import sheep from '@/sheep';
|
||||
// #ifdef H5
|
||||
import $wxsdk from '@/sheep/libs/sdk-h5-weixin';
|
||||
// #endif
|
||||
import { getRootUrl } from '@/sheep/helper';
|
||||
import {
|
||||
getRootUrl
|
||||
} from '@/sheep/helper';
|
||||
import PayOrderApi from '@/sheep/api/pay/order';
|
||||
|
||||
/**
|
||||
@ -122,7 +124,10 @@ export default class SheepPay {
|
||||
// #ifdef H5
|
||||
// 微信公众号 JSSDK 支付
|
||||
async wechatOfficialAccountPay() {
|
||||
let { code, data } = await this.prepay('wx_pub');
|
||||
let {
|
||||
code,
|
||||
data
|
||||
} = await this.prepay('wx_pub');
|
||||
if (code !== 0) {
|
||||
return;
|
||||
}
|
||||
@ -148,7 +153,10 @@ export default class SheepPay {
|
||||
|
||||
// 浏览器微信 H5 支付 TODO 芋艿:待接入
|
||||
async wechatWapPay() {
|
||||
const { error, data } = await this.prepay();
|
||||
const {
|
||||
error,
|
||||
data
|
||||
} = await this.prepay();
|
||||
if (error === 0) {
|
||||
const redirect_url = `${getRootUrl()}pages/pay/result?id=${this.id}&payment=${
|
||||
this.payment
|
||||
@ -159,7 +167,10 @@ export default class SheepPay {
|
||||
|
||||
// 支付链接 TODO 芋艿:待接入
|
||||
async redirectPay() {
|
||||
let { error, data } = await this.prepay();
|
||||
let {
|
||||
error,
|
||||
data
|
||||
} = await this.prepay();
|
||||
if (error === 0) {
|
||||
const redirect_url = `${getRootUrl()}pages/pay/result?id=${this.id}&payment=${
|
||||
this.payment
|
||||
@ -173,7 +184,10 @@ export default class SheepPay {
|
||||
// 微信小程序支付
|
||||
async wechatMiniProgramPay() {
|
||||
// let that = this;
|
||||
let { code, data } = await this.prepay('wx_lite');
|
||||
let {
|
||||
code,
|
||||
data
|
||||
} = await this.prepay('wx_lite');
|
||||
if (code !== 0) {
|
||||
return;
|
||||
}
|
||||
@ -201,20 +215,27 @@ export default class SheepPay {
|
||||
|
||||
// 余额支付
|
||||
async walletPay() {
|
||||
const { code } = await this.prepay('wallet');
|
||||
const {
|
||||
code
|
||||
} = await this.prepay('wallet');
|
||||
code === 0 && this.payResult('success');
|
||||
}
|
||||
|
||||
// 模拟支付
|
||||
async mockPay() {
|
||||
const { code } = await this.prepay('mock');
|
||||
const {
|
||||
code
|
||||
} = await this.prepay('mock');
|
||||
code === 0 && this.payResult('success');
|
||||
}
|
||||
|
||||
// 支付宝复制链接支付 TODO 芋艿:待接入
|
||||
async copyPayLink() {
|
||||
let that = this;
|
||||
let { error, data } = await this.prepay();
|
||||
let {
|
||||
error,
|
||||
data
|
||||
} = await this.prepay();
|
||||
if (error === 0) {
|
||||
// 引入showModal 点击确认 复制链接;
|
||||
uni.showModal({
|
||||
@ -233,7 +254,10 @@ export default class SheepPay {
|
||||
// 支付宝支付 TODO 芋艿:待接入
|
||||
async alipay() {
|
||||
let that = this;
|
||||
const { error, data } = await this.prepay();
|
||||
const {
|
||||
error,
|
||||
data
|
||||
} = await this.prepay();
|
||||
if (error === 0) {
|
||||
uni.requestPayment({
|
||||
provider: 'alipay',
|
||||
@ -255,7 +279,10 @@ export default class SheepPay {
|
||||
// 微信支付 TODO 芋艿:待接入
|
||||
async wechatAppPay() {
|
||||
let that = this;
|
||||
let { error, data } = await this.prepay();
|
||||
let {
|
||||
error,
|
||||
data
|
||||
} = await this.prepay();
|
||||
if (error === 0) {
|
||||
uni.requestPayment({
|
||||
provider: 'wxpay',
|
||||
@ -284,7 +311,7 @@ export default class SheepPay {
|
||||
uni.showModal({
|
||||
title: '微信支付',
|
||||
content: '请先绑定微信再使用微信支付',
|
||||
success: function (res) {
|
||||
success: function(res) {
|
||||
if (res.confirm) {
|
||||
sheep.$platform.useProvider('wechat').bind();
|
||||
}
|
||||
@ -294,37 +321,37 @@ export default class SheepPay {
|
||||
}
|
||||
|
||||
export function getPayMethods(channels) {
|
||||
const payMethods = [
|
||||
{
|
||||
const payMethods = [{
|
||||
icon: '/static/img/shop/pay/wechat.png',
|
||||
title: '微信支付',
|
||||
value: 'wechat',
|
||||
disabled: true,
|
||||
},
|
||||
{
|
||||
icon: '/static/img/shop/pay/alipay.png',
|
||||
title: '支付宝支付',
|
||||
value: 'alipay',
|
||||
disabled: true,
|
||||
},
|
||||
{
|
||||
icon: '/static/img/shop/pay/wallet.png',
|
||||
title: '余额支付',
|
||||
value: 'wallet',
|
||||
disabled: true,
|
||||
},
|
||||
{
|
||||
icon: '/static/img/shop/pay/apple.png',
|
||||
title: 'Apple Pay',
|
||||
value: 'apple',
|
||||
disabled: true,
|
||||
},
|
||||
{
|
||||
icon: '/static/img/shop/pay/wallet.png',
|
||||
title: '模拟支付',
|
||||
value: 'mock',
|
||||
disabled: true,
|
||||
},
|
||||
// {
|
||||
// icon: '/static/img/shop/pay/alipay.png',
|
||||
// title: '支付宝支付',
|
||||
// value: 'alipay',
|
||||
// disabled: true,
|
||||
// },
|
||||
|
||||
// {
|
||||
// icon: '/static/img/shop/pay/apple.png',
|
||||
// title: 'Apple Pay',
|
||||
// value: 'apple',
|
||||
// disabled: true,
|
||||
// },
|
||||
// {
|
||||
// icon: '/static/img/shop/pay/wallet.png',
|
||||
// title: '模拟支付',
|
||||
// value: 'mock',
|
||||
// disabled: true,
|
||||
// },
|
||||
];
|
||||
const platform = sheep.$platform.name;
|
||||
|
||||
@ -338,26 +365,26 @@ export function getPayMethods(channels) {
|
||||
wechatMethod.disabled = false;
|
||||
}
|
||||
wechatMethod.disabled = false; // TODO 芋艿:临时测试
|
||||
|
||||
// 2. 处理【支付宝支付】
|
||||
const alipayMethod = payMethods[1];
|
||||
if (
|
||||
(platform === 'WechatOfficialAccount' && channels.includes('alipay_wap')) ||
|
||||
(platform === 'WechatMiniProgram' && channels.includes('alipay_wap')) ||
|
||||
(platform === 'App' && channels.includes('alipay_app'))
|
||||
) {
|
||||
alipayMethod.disabled = false;
|
||||
}
|
||||
// 3. 处理【余额支付】
|
||||
const walletMethod = payMethods[2];
|
||||
const walletMethod = payMethods[1];
|
||||
if (channels.includes('wallet')) {
|
||||
walletMethod.disabled = false;
|
||||
}
|
||||
// 4. 处理【苹果支付】TODO 芋艿:未来接入
|
||||
// 5. 处理【模拟支付】
|
||||
const mockMethod = payMethods[4];
|
||||
if (channels.includes('mock')) {
|
||||
mockMethod.disabled = false;
|
||||
}
|
||||
// // 2. 处理【支付宝支付】
|
||||
// const alipayMethod = payMethods[1];
|
||||
// if (
|
||||
// (platform === 'WechatOfficialAccount' && channels.includes('alipay_wap')) ||
|
||||
// (platform === 'WechatMiniProgram' && channels.includes('alipay_wap')) ||
|
||||
// (platform === 'App' && channels.includes('alipay_app'))
|
||||
// ) {
|
||||
// alipayMethod.disabled = false;
|
||||
// }
|
||||
|
||||
// // 4. 处理【苹果支付】TODO 芋艿:未来接入
|
||||
// // 5. 处理【模拟支付】
|
||||
// const mockMethod = payMethods[4];
|
||||
// if (channels.includes('mock')) {
|
||||
// mockMethod.disabled = false;
|
||||
// }
|
||||
return payMethods;
|
||||
}
|
@ -25,3 +25,18 @@ page {
|
||||
color: transparent;
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* 主题颜色 */
|
||||
|
||||
.lv{
|
||||
background:rgba(72,204,82) !important;
|
||||
}
|
||||
.blue{
|
||||
background:rgba(28,165,233) !important;
|
||||
}
|
||||
.pink{
|
||||
background:#ff448f !important;
|
||||
}
|
||||
.orange{
|
||||
background:#fe5c2d !important;
|
||||
}
|
@ -1,5 +1,7 @@
|
||||
import DiyApi from '@/sheep/api/promotion/diy';
|
||||
import { defineStore } from 'pinia';
|
||||
import {
|
||||
defineStore
|
||||
} from 'pinia';
|
||||
import $platform from '@/sheep/platform';
|
||||
import $router from '@/sheep/router';
|
||||
import user from './user';
|
||||
@ -27,6 +29,7 @@ const app = defineStore({
|
||||
linkAddress: '', // 复制链接地址
|
||||
},
|
||||
bind_mobile: 0, // 登陆后绑定手机号提醒 (弱提醒,可手动关闭)
|
||||
goodsType: '' //商城分类样式
|
||||
},
|
||||
template: {
|
||||
// 店铺装修模板
|
||||
@ -55,8 +58,8 @@ const app = defineStore({
|
||||
}
|
||||
|
||||
// 加载装修配置
|
||||
await adaptTemplate(this.template, templateId);
|
||||
|
||||
const res2 = await adaptTemplate(this.template, templateId);
|
||||
console.log(res2,"--------------")
|
||||
// TODO 芋艿:未来支持管理后台可配;对应 https://api.shopro.sheepjs.com/shop/api/init
|
||||
if (true) {
|
||||
this.info = {
|
||||
@ -74,12 +77,14 @@ const app = defineStore({
|
||||
methods: ['poster', 'link'],
|
||||
linkAddress: 'http://127.0.0.1:3000', // TODO 芋艿:可以考虑改到 .env 那
|
||||
posterInfo: {
|
||||
user_bg: '/shangcheng/user-poster-bg.png',
|
||||
user_bg: '/shangcheng/baa4f41883b4bb8880ff83281f258418281ea0383c505001300ca2953299db8a.png',
|
||||
goods_bg: '/shangcheng/goods-poster-bg.png',
|
||||
groupon_bg: '/shangcheng/groupon-poster-bg.png',
|
||||
},
|
||||
},
|
||||
bind_mobile: 0,
|
||||
goodsType:res2.goodsType,
|
||||
themeType:res2.themeType
|
||||
};
|
||||
this.has_wechat_trade_managed = 0;
|
||||
|
||||
@ -100,20 +105,20 @@ const app = defineStore({
|
||||
},
|
||||
persist: {
|
||||
enabled: true,
|
||||
strategies: [
|
||||
{
|
||||
strategies: [{
|
||||
key: 'app-store',
|
||||
},
|
||||
],
|
||||
}, ],
|
||||
},
|
||||
});
|
||||
|
||||
// todo: @owen 先做数据适配,后期重构
|
||||
const adaptTemplate = async (appTemplate, templateId) => {
|
||||
const { data: diyTemplate } = templateId
|
||||
const {
|
||||
data: diyTemplate
|
||||
} = templateId
|
||||
? // 查询指定模板,一般是预览时使用
|
||||
await DiyApi.getDiyTemplate(templateId)
|
||||
: await DiyApi.getUsedDiyTemplate();
|
||||
await DiyApi.getDiyTemplate(templateId) :
|
||||
await DiyApi.getUsedDiyTemplate();
|
||||
// 模板不存在
|
||||
if (!diyTemplate) {
|
||||
$router.error('TemplateError');
|
||||
@ -129,6 +134,7 @@ const adaptTemplate = async (appTemplate, templateId) => {
|
||||
}
|
||||
appTemplate.home = diyTemplate?.home;
|
||||
appTemplate.user = diyTemplate?.user;
|
||||
return diyTemplate
|
||||
};
|
||||
|
||||
export default app;
|
@ -11,6 +11,10 @@
|
||||
'uni-numbox--disabled': inputValue <= min || disabled,
|
||||
'groupon-btn': activity === 'groupon',
|
||||
'seckill-btn': activity === 'seckill',
|
||||
'lvv' : vsl == 'lv',
|
||||
'bluev' : vsl == 'blue',
|
||||
'pinkv' : vsl == 'pink',
|
||||
'orangev' : vsl == 'orange',
|
||||
}"
|
||||
@click="_calcValue('minus')"
|
||||
></text>
|
||||
@ -33,6 +37,10 @@
|
||||
'uni-numbox--disabled': inputValue >= max || disabled,
|
||||
'groupon-btn': activity === 'groupon',
|
||||
'seckill-btn': activity === 'seckill',
|
||||
'lvv' : vsl == 'lv',
|
||||
'bluev' : vsl == 'blue',
|
||||
'pinkv' : vsl == 'pink',
|
||||
'orangev' : vsl == 'orange',
|
||||
}"
|
||||
@click="_calcValue('plus')"
|
||||
></text>
|
||||
@ -59,6 +67,10 @@
|
||||
name: 'UniNumberBox',
|
||||
emits: ['change', 'input', 'update:modelValue', 'blur', 'focus'],
|
||||
props: {
|
||||
vsl:{
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
value: {
|
||||
type: [Number, String],
|
||||
default: 1,
|
||||
@ -185,6 +197,18 @@
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.bluev{
|
||||
color:rgba(28,165,233) !important;
|
||||
}
|
||||
.lvv{
|
||||
color:rgba(72,204,82) !important;
|
||||
}
|
||||
.pinkv{
|
||||
color:#ff448f !important;
|
||||
}
|
||||
.orangev{
|
||||
color:#fe5c2d !important;
|
||||
}
|
||||
.uni-numbox .uni-numbox--disabled {
|
||||
color: #c0c0c0 !important;
|
||||
/* #ifdef H5 */
|
||||
|
@ -25,6 +25,6 @@
|
||||
height: var(--status-bar-height);
|
||||
}
|
||||
.ss {
|
||||
background: rgba(248, 83, 42);
|
||||
background: #e93422;
|
||||
}
|
||||
</style>
|
@ -32,6 +32,7 @@
|
||||
:style="{
|
||||
color: isActive ? parentData.activeColor : parentData.color,
|
||||
}"
|
||||
:class="vl && isActive ? `${vl}v` : ''"
|
||||
>
|
||||
{{ text }}
|
||||
</text>
|
||||
@ -65,6 +66,10 @@
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
vl: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
// 跳转的页面路径
|
||||
url: {
|
||||
type: String,
|
||||
@ -185,6 +190,18 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.lvv{
|
||||
color:rgba(72,204,82) !important;
|
||||
}
|
||||
.bluev{
|
||||
color:rgba(28,165,233) !important;
|
||||
}
|
||||
.pinkv{
|
||||
color: #ff448f !important;
|
||||
}
|
||||
.orangev{
|
||||
color: #fe5c2d !important;
|
||||
}
|
||||
.tabbar-center-item {
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
|
Binary file not shown.
Before Width: | Height: | Size: 82 KiB |
@ -339,7 +339,11 @@ by ZXLee
|
||||
</script>
|
||||
<script src="./js/z-paging-main.js" />
|
||||
|
||||
<style scoped>
|
||||
<style scoped lang="scss">
|
||||
@import "./css/z-paging-main.css";
|
||||
@import "./css/z-paging-static.css";
|
||||
|
||||
.zp-list-cell{
|
||||
padding: 0 15px;
|
||||
}
|
||||
</style>
|
||||
|
Loading…
Reference in New Issue
Block a user