chen
/
perry-mall
1
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

新增规格接口

master
chen 2022-02-24 11:21:51 +08:00
parent 2b7618a36e
commit 268fbd85f7
21 changed files with 482 additions and 398 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
components/auth-userInfo-mobile.vue
View File

@ -2,13 +2,13 @@
<view v-if="visible"> <view v-if="visible">
<!-- 用户信息授权 --> <!-- 用户信息授权 -->
<view v-if="userInfo_mobile" @touchmove.stop.prevent="moveHandle" :class="isAnimation==2?'card-box-userinfo':''" class="auth-box"> <view v-if="userInfo_mobile" @touchmove.stop.prevent="moveHandle" :class="isAnimation==2?'card-box-userinfo':''" class="auth-box">
<view :class="isAnimation==1?'card-box-userinfo':''"> <view :class="isAnimation==1?'card-box-userinfo':''" class="userinfo-box">
<view class="auth-top"> <view class="auth-top">
<image :src="appletImg" mode=""></image> <image :src="appletImg" mode="" lazy-load class="auth-img"></image>
<view class="auth-top-content"> <view class="auth-top-content">
<view>恒美植发客服代表提醒您：</view> <view class="userinfo-info">恒美植发客服代表提醒您：</view>
<view>您当前是游客身份</view> <view class="userinfo-info">您当前是游客身份</view>
<view>是否选择授权登录</view> <view class="userinfo-info">是否选择授权登录</view>
</view> </view>
</view> </view>
<view class="auth-center">申请 获取你的昵称、头像、地区及性别</view> <view class="auth-center">申请 获取你的昵称、头像、地区及性别</view>
@ -220,14 +220,14 @@
} }
</script> </script>
<style> <style scoped>
.auth-box {position: fixed;top: 0;right: 0;left: 0;bottom: 0;display: flex;justify-content: center;align-items: center;z-index: 3;} .auth-box {position: fixed;top: 0;right: 0;left: 0;bottom: 0;display: flex;justify-content: center;align-items: center;z-index: 3;}
.auth-box > view {background-color: #FFFFFF;border-radius: 10rpx;padding: 30rpx;box-shadow: 0rpx 0rpx 20rpx rgba(0,0,0,.5);margin: 0 100rpx;} .auth-box .userinfo-box{background-color: #FFFFFF;border-radius: 10rpx;padding: 30rpx;box-shadow: 0rpx 0rpx 20rpx rgba(0,0,0,.5);margin: 0 100rpx;}
.auth-top {display: flex;} .auth-top {display: flex;}
.auth-top image {width: 96rpx;height: 96rpx;flex-shrink: 0;} .auth-top .auth-img {width: 96rpx;height: 96rpx;flex-shrink: 0;}
.auth-top-content {margin-left: 20rpx;} .auth-top-content {margin-left: 20rpx;}
.auth-top-content view {font-size: 28rpx;margin-top: 20rpx;color: #999999;} .auth-top-content .userinfo-info {font-size: 28rpx;margin-top: 20rpx;color: #999999;}
.auth-top-content view:nth-child(1) {font-size: 30rpx;font-weight: bold;margin-top: 0;} .auth-top-content .userinfo-info:nth-child(1) {font-size: 30rpx;font-weight: bold;margin-top: 0;}
.auth-center {font-size: 28rpx;margin: 30rpx 0;border-bottom: 1rpx solid #F5F5F5;border-top: 1rpx solid #F5F5F5;padding: 20rpx 0;} .auth-center {font-size: 28rpx;margin: 30rpx 0;border-bottom: 1rpx solid #F5F5F5;border-top: 1rpx solid #F5F5F5;padding: 20rpx 0;}
.auth-bottom {display: flex;justify-content: center;align-items: center;font-size: 24rpx;} .auth-bottom {display: flex;justify-content: center;align-items: center;font-size: 24rpx;}
.btn {padding: 12rpx 40rpx;border-radius: 4rpx;} .btn {padding: 12rpx 40rpx;border-radius: 4rpx;}

2
components/containers/container-subgroup.vue
View File

@ -9,7 +9,7 @@
</view> </view>
</view> </view>
<view v-else :style="{paddingTop: statusBarHeight +'px'}" class="pad-zy30"> <view v-else :style="{paddingTop: statusBarHeight +'px'}" class="pad-zy30">
<slot></slot> <slot name="content"></slot>
</view> </view>
</view> </view>
</template> </template>

42
components/detail-bottom-nav/bottom-nav.vue
View File

@ -3,31 +3,31 @@
<!-- 底部按钮 --> <!-- 底部按钮 -->
<view class="bottom-nav-box display-between-center"> <view class="bottom-nav-box display-between-center">
<button type="default" @tap="immediatelyBuy">立即购买</button> <button type="default" @tap="immediatelyBuy">立即购买</button>
<button type="default" @tap="showFrame=true">加入购物车</button> <button type="default" @tap="addCartEv">加入购物车</button>
</view> </view>
<!-- 底部按钮弹框 --> <!-- 底部按钮弹框 -->
<view v-show="showFrame" class="frame-box" @tap="showFrame=false"> <view v-show="showFrame" class="frame-box" @tap="showFrame=false">
<view @tap.stop="showFrame=true"> <view @tap.stop="showFrame=true" class="item-box">
<view class="frame-top"> <view class="frame-top">
<image :src="shopImg" mode="aspectFill" lazy-load></image> <image class="frame-img" :src="shopImg" mode="aspectFill" lazy-load></image>
<view> <view class="frame-content">
<!-- 商品标题 --> <!-- 商品标题 -->
<view class="clips2 frame-title">{{detailObj.detail.name}}</view> <view class="clips2 frame-title">{{detailObj.detail.name}}</view>
<!-- 商品价格 --> <!-- 商品价格 -->
<view class="frame-price"> <view class="frame-price">
<!-- 折扣价 --> <!-- 折扣价 -->
<view>￥{{discountPrice}}</view> <view class="discount-box">￥{{discountPrice}}</view>
<!-- 原价 --> <!-- 原价 -->
<view style="text-decoration: line-through;">￥{{originalPrice}}</view> <view class="original-box">￥{{originalPrice}}</view>
</view> </view>
</view> </view>
</view> </view>
<!-- 商品尺寸、规格 --> <!-- 商品尺寸、规格 -->
<view class="frame-color-box"> <view class="frame-color-box">
<!-- 颜色 --> <!-- 颜色 -->
<drop-down></drop-down> <!-- <drop-down></drop-down> -->
<!-- 尺寸 --> <!-- 尺寸 -->
<drop-down :dropObj="dropObj" @chooseItem="chooseItem"></drop-down> <!-- <drop-down :dropObj="dropObj" @chooseItem="chooseItem"></drop-down> -->
</view> </view>
<!-- 商品库存 --> <!-- 商品库存 -->
<view class="frame-stock">库存：{{detailObj.detail.stock}}</view> <view class="frame-stock">库存：{{detailObj.detail.stock}}</view>
@ -38,7 +38,7 @@
<button @tap="deladdEvent(0)" :disabled="buyNum==1" class="item-btn display-center-center">-</button> <button @tap="deladdEvent(0)" :disabled="buyNum==1" class="item-btn display-center-center">-</button>
<!-- 输入框 --> <!-- 输入框 -->
<view class="input-box display-center-center"> <view class="input-box display-center-center">
<input type="text" v-model="buyNum" /> <input class="input" type="text" v-model="buyNum" />
</view> </view>
<!-- 加 --> <!-- 加 -->
<button @tap="deladdEvent(1)" class="item-btn display-center-center">+</button> <button @tap="deladdEvent(1)" class="item-btn display-center-center">+</button>
@ -46,8 +46,8 @@
</view> </view>
<!-- 立即购买、加入购物车按钮 --> <!-- 立即购买、加入购物车按钮 -->
<view class="frame-btn-box"> <view class="frame-btn-box">
<button type="default" @tap="immediatelyBuy">立即购买</button> <button class="btn" type="default" @tap="immediatelyBuy">立即购买</button>
<button type="default" @tap="addCartEv">加入购物车</button> <button class="btn" type="default" @tap="addCartEv">加入购物车</button>
</view> </view>
</view> </view>
</view> </view>
@ -92,9 +92,9 @@
}; };
}, },
mounted() { mounted() {
// 原价金额转换 // 原价
this.originalPrice = this.detailObj.detail.original_price; this.originalPrice = this.detailObj.detail.original_price;
// 折扣价金额转换 // 折扣价
this.discountPrice = this.detailObj.detail.price; this.discountPrice = this.detailObj.detail.price;
// 商品图片 // 商品图片
this.shopImg = this.$http + this.detailObj.detail.cover; this.shopImg = this.$http + this.detailObj.detail.cover;
@ -156,7 +156,7 @@
} }
</script> </script>
<style> <style scoped>
.display-center-center {display: flex;justify-content: center;align-items: center;} .display-center-center {display: flex;justify-content: center;align-items: center;}
.display-between-center{display: flex;justify-content: space-between;align-items: center;} .display-between-center{display: flex;justify-content: space-between;align-items: center;}
.bottom-nav-box{position: fixed;bottom: 0;left: 0;right: 0;padding: 20rpx 40rpx;background-color: #FFFFFF;} .bottom-nav-box{position: fixed;bottom: 0;left: 0;right: 0;padding: 20rpx 40rpx;background-color: #FFFFFF;}
@ -173,23 +173,23 @@
button:last-child{border: 1rpx solid #000000;background-color: #000000;} button:last-child{border: 1rpx solid #000000;background-color: #000000;}
.frame-box{position: fixed;top: 0;left: 0;bottom: 0;right: 0;background-color: rgba(0,0,0,.5);z-index: 12;} .frame-box{position: fixed;top: 0;left: 0;bottom: 0;right: 0;background-color: rgba(0,0,0,.5);z-index: 12;}
.frame-box > view{background-color: #FFFFFF;position: absolute;bottom: 0;left: 0;right: 0;padding: 30rpx;} .frame-box .item-box{background-color: #FFFFFF;position: absolute;bottom: 0;left: 0;right: 0;padding: 30rpx;}
.frame-top {display: flex;justify-content: space-between;} .frame-top {display: flex;justify-content: space-between;}
.frame-top image {width: 223rpx;height: 223rpx;border-radius: 20rpx;flex-shrink: 0;margin-right: 30rpx;margin-top: -80rpx;} .frame-top .frame-img {width: 223rpx;height: 223rpx;border-radius: 20rpx;flex-shrink: 0;margin-right: 30rpx;margin-top: -80rpx;}
.frame-top > view{width: 100%;display: flex;justify-content: space-between;flex-direction: column;} .frame-top .frame-content{width: 100%;display: flex;justify-content: space-between;flex-direction: column;}
.frame-title{font-size: 36rpx;color: #000000;line-height: 50rpx;} .frame-title{font-size: 36rpx;color: #000000;line-height: 50rpx;}
.frame-price{display: flex;align-items: center;} .frame-price{display: flex;align-items: center;}
.frame-price view:first-child{font-size: 40rpx;margin-right: 10rpx;} .frame-price .discount-box{font-size: 40rpx;margin-right: 10rpx;}
.frame-price view:last-child{font-size: 28rpx;color: #868695;} .frame-price .original-box{font-size: 28rpx;color: #868695;text-decoration: line-through;}
.frame-color-box{margin-top: 20rpx;} .frame-color-box{margin-top: 20rpx;}
.frame-btn-box{display: flex;align-items: center;justify-content: space-around;margin-top: 100rpx;} .frame-btn-box{display: flex;align-items: center;justify-content: space-around;margin-top: 100rpx;}
.frame-btn-box button{height: 80rpx;line-height: 80rpx!important;border-radius: 20rpx;} .frame-btn-box .btn{height: 80rpx;line-height: 80rpx!important;border-radius: 20rpx;}
.frame-stock{font-size: 24rpx;color: #000000;text-align: right;} .frame-stock{font-size: 24rpx;color: #000000;text-align: right;}
/* 加减按钮 */ /* 加减按钮 */
.frame-add-del{display: flex;justify-content: flex-end;} .frame-add-del{display: flex;justify-content: flex-end;}
.add-del-box{width: 180rpx;margin-top: 20rpx;} .add-del-box{width: 180rpx;margin-top: 20rpx;}
.input-box {width: 78rpx;height: 40rpx;font-size: 24rpx; border-radius: 16rpx;margin: 0 6rpx; border: 1rpx solid #000000;overflow: hidden;} .input-box {width: 78rpx;height: 40rpx;font-size: 24rpx; border-radius: 16rpx;margin: 0 6rpx; border: 1rpx solid #000000;overflow: hidden;}
input {text-align: center;} .input-box .input {text-align: center;}
.item-btn {width: 40rpx;height: 40rpx;border-radius: 12rpx;background-color: #000000!important;border: 1rpx solid #000000!important; color: #FFFFFF;padding: 0rpx;} .item-btn {width: 40rpx;height: 40rpx;border-radius: 12rpx;background-color: #000000!important;border: 1rpx solid #000000!important; color: #FFFFFF;padding: 0rpx;}
</style> </style>

12
components/drop-downs/drop-down.vue
View File

@ -6,8 +6,8 @@
<i class="icon icon-next colpeili flexs" style="transition: all .3s;" :style="{transform: `rotate(${showFrame ? '0' : '90'}deg)`}"></i> <i class="icon icon-next colpeili flexs" style="transition: all .3s;" :style="{transform: `rotate(${showFrame ? '0' : '90'}deg)`}"></i>
<view v-if="showFrame" class="drop animated " :class="showFrame?'fadeIn':'fadeOut'"> <view v-if="showFrame" class="drop animated " :class="showFrame?'fadeIn':'fadeOut'">
<view class="item-title" :class="activeItem==index?'itemActive':'itemMo'" <view class="item-title" :class="activeItem==index?'itemActive':'itemMo'"
@tap.stop="chooseItem(index,item.id,item.childrenTitle)" v-for="(item,index) in dropObj.childrenList" :key="index"> @tap.stop="chooseItem(index,item.id,item.title,dropObj.title)" v-for="(item,index) in dropObj.children" :key="index">
<view class="clips1">{{item.childrenTitle}}</view> <view class="clips1">{{item.title}}</view>
</view> </view>
</view> </view>
</view> </view>
@ -23,7 +23,7 @@
default:()=>{ default:()=>{
return { return {
title:'颜色', title:'颜色',
childrenList:[ children:[
{ {
id:1, id:1,
childrenTitle:'粉色' childrenTitle:'粉色'
@ -45,7 +45,7 @@
}; };
}, },
mounted() { mounted() {
if(this.dropObj.childrenList.length){ if(this.dropObj.children.length){
this.activeText = `请选择${this.dropObj.title}`; this.activeText = `请选择${this.dropObj.title}`;
} else { } else {
this.activeText = `暂无可选项`; this.activeText = `暂无可选项`;
@ -53,14 +53,14 @@
}, },
methods:{ methods:{
// 选择事件 // 选择事件
chooseItem(index,id,title){ chooseItem(index,id,title,mainTitle){
// 选中的下标 // 选中的下标
this.activeItem = index; this.activeItem = index;
// 选中的标题 // 选中的标题
this.activeText = title; this.activeText = title;
// 隐藏弹框 // 隐藏弹框
this.showFrame = false; this.showFrame = false;
this.$emit('chooseItem',{id:id,title:title}) this.$emit('chooseItem',{id:id,title:title,mainTitle:mainTitle})
}, },
// 调起选择弹框 // 调起选择弹框
tuneUpEv(){ tuneUpEv(){

4
components/foot-tab.vue
View File

@ -8,7 +8,7 @@
<!-- 后台动态改变的icon与标题 start --> <!-- 后台动态改变的icon与标题 start -->
<!-- tab-图标列表 --> <!-- tab-图标列表 -->
<view class="item-box" :style="{marginBottom: marginBottomNum +'px'}"> <view class="item-box" :style="{marginBottom: marginBottomNum +'px'}">
<view @tap="choosefoot(index)" <view @tap="choosefoot(index)" class="foot-icon"
:style="{width: 100 / imgList.length +'%'}" :style="{width: 100 / imgList.length +'%'}"
:class="index == isIcon ? 'centerBox' : ''" :class="index == isIcon ? 'centerBox' : ''"
v-for="(itemi,index) in imgList" :key="index"> v-for="(itemi,index) in imgList" :key="index">
@ -174,7 +174,7 @@
/* 图标-文字外框样式 start */ /* 图标-文字外框样式 start */
.item-box{display: flex;justify-content: space-around;align-items: center;} .item-box{display: flex;justify-content: space-around;align-items: center;}
.item-box>view{text-align: center;box-sizing: border-box;} .item-box .foot-icon,.item-box .foot-title{text-align: center;box-sizing: border-box;}
/* 图标-文字外框样式 end */ /* 图标-文字外框样式 end */
/* 突出的图标样式 start */ /* 突出的图标样式 start */

4
components/nothing-page.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<view class="nothing"> <view class="nothing">
<view class="nothing-box"> <view class="nothing-box">
<image :src="imgSrc" mode="aspectFill"></image> <image class="nothing-img" :src="imgSrc" mode="aspectFill" lazy-load></image>
<view class="nothing-con">{{content}}</view> <view class="nothing-con">{{content}}</view>
</view> </view>
</view> </view>
@ -31,6 +31,6 @@
<style scoped> <style scoped>
.nothing{position: fixed;top: 0;right: 0;left: 0;bottom: 0;display: flex;justify-content: center;align-items: center;} .nothing{position: fixed;top: 0;right: 0;left: 0;bottom: 0;display: flex;justify-content: center;align-items: center;}
.nothing-box{display: flex;justify-content: center;flex-direction: column;align-items: center;} .nothing-box{display: flex;justify-content: center;flex-direction: column;align-items: center;}
.nothing-box>image{width: 474rpx;height: 273rpx;} .nothing-box .nothing-img{width: 474rpx;height: 273rpx;}
.nothing-con{font-size: 24rpx;font-family: PingFang SC;font-weight: 500;line-height: 33rpx;color: #333333;text-align: center;} .nothing-con{font-size: 24rpx;font-family: PingFang SC;font-weight: 500;line-height: 33rpx;color: #333333;text-align: center;}
</style> </style>

4
components/payment-subgroup/payment.vue
View File

@ -14,7 +14,7 @@
props:{ props:{
totalPrice:{ totalPrice:{
type:String, type:String,
default: '0' default: "0.00"
} }
}, },
data() { data() {
@ -31,7 +31,7 @@
</script> </script>
<style> <style>
.display-between-center {display: flex;justify-content: space-between;align-items: center;} .display-between-center {display: flex;justify-content: space-between;align-items: center;}
.payment-foot-box{position: fixed;bottom: 0;left: 0;right: 0;height: 130rpx;background-color: #efefef;font-size: 30rpx;} .payment-foot-box{position: fixed;bottom: 0;left: 0;right: 0;height: 130rpx;background-color: #efefef;font-size: 30rpx;}
.payment-price{font-size: 36rpx;color: #f81c1c;font-weight: bold;margin-left: 60rpx;} .payment-price{font-size: 36rpx;color: #f81c1c;font-weight: bold;margin-left: 60rpx;}
.payment-settlement{width: 242rpx;height: 130rpx;background-color: #f81c1c;color: #FFFFFF;font-size: 36rpx;text-align: center;line-height: 130rpx;} .payment-settlement{width: 242rpx;height: 130rpx;background-color: #f81c1c;color: #FFFFFF;font-size: 36rpx;text-align: center;line-height: 130rpx;}

4
components/status-nav.vue
View File

@ -19,7 +19,7 @@
color: titleColor, color: titleColor,
justifyContent: ifCenter ? 'center' : '', justifyContent: ifCenter ? 'center' : '',
padding: ifCenter ? '0px' : `${ifReturn ? '0 38' : '0 15'}px`}"> padding: ifCenter ? '0px' : `${ifReturn ? '0 38' : '0 15'}px`}">
<view :class="['','clips1','clips2'][clipNumber]" :style="{maxWidth: ifCenter ? '360rpx' : '70%'}">{{navBarTitle}}</view> <view class="title-box" :class="['','clips1','clips2'][clipNumber]" :style="{maxWidth: ifCenter ? '360rpx' : '70%'}">{{navBarTitle}}</view>
</view> </view>
</view> </view>
<!-- 头部状态栏 end --> <!-- 头部状态栏 end -->
@ -144,5 +144,5 @@
font-size: 36rpx;font-weight: bold; font-size: 36rpx;font-weight: bold;
display: flex; display: flex;
} }
.tab-title view{margin-top: -4rpx;} .tab-title .title-box{margin-top: -4rpx;}
</style> </style>

3
jsFile/tools.js
View File

@ -377,7 +377,6 @@ const tools = {
} }
}, },
loginEv(){//执行登录事件 loginEv(){//执行登录事件
let that = this;
uni.login({ uni.login({
provider: 'weixin', provider: 'weixin',
success: (res)=> { success: (res)=> {
@ -385,7 +384,7 @@ const tools = {
let code = res.code; let code = res.code;
let obj = uni.getStorageSync('params') let obj = uni.getStorageSync('params')
var params = { var params = {
invite_code: uni.getStorageSync('is_active')=='' ? uni.getStorageSync('invite_code') : '', invite_code: uni.getStorageSync('is_active')!='' ? uni.getStorageSync('invite_code') : '',
code:code, code:code,
nickname: obj.nickname || '', nickname: obj.nickname || '',
avatar: obj.avatarUrl || '', avatar: obj.avatarUrl || '',

4
pages/login/agreement.vue
View File

@ -8,7 +8,9 @@
:navBarTitle="'登录'"></status-nav> :navBarTitle="'登录'"></status-nav>
<!-- 容器 --> <!-- 容器 -->
<container-subgroup> <container-subgroup>
<rich-text :nodes="content"></rich-text> <view slot="content">
<rich-text :nodes="content"></rich-text>
</view>
</container-subgroup> </container-subgroup>
</view> </view>
</template> </template>

36
pages/login/login.vue
View File

@ -8,23 +8,25 @@
:navBarTitle="'登录'"></status-nav> :navBarTitle="'登录'"></status-nav>
<!-- 容器 --> <!-- 容器 -->
<container-subgroup> <container-subgroup>
<view class='login-header'> <view slot="content">
<image class="infoImg" :style="{boxShadow: '0px 0px 20px '+ publicColor}" mode="aspectFit" :src="userInfo.avatarUrl || imgSrc"></image> <view class='login-header'>
<view class="logo-name">{{appletName}}</view> <image class="infoImg" :style="{boxShadow: '0px 0px 20px '+ publicColor}" mode="aspectFit" :src="userInfo.avatarUrl || imgSrc"></image>
</view> <view class="logo-name">{{appletName}}</view>
<view class="login-box"> </view>
<button class='login-btn' :style="{background:publicColor}" type='primary' @click="bindGetUserInfo">微信授权</button> <view class="login-box">
<view class="xie-box">登录代表您已同意<text @tap="goAgreement" class="xieCon">《用户服务协议》</text></view> <button class='login-btn' :style="{background:publicColor}" type='primary' @click="bindGetUserInfo">微信授权</button>
</view> <view class="xie-box">登录代表您已同意<text @tap="goAgreement" class="xieCon">《用户服务协议》</text></view>
<!-- 弹框 --> </view>
<view v-if="isShowP" class="disjcac posAll"> <!-- 弹框 -->
<view class="bacf radius20 width100 tank-box"> <view v-if="isShowP" class="disjcac posAll">
<view class="tc tank-box-itemone">请授权绑定手机号</view> <view class="bacf radius20 width100 tank-box">
<view class="fon28 colf pad-x30 pad-zy30 tc disjb"> <view class="tc tank-box-itemone">请授权绑定手机号</view>
<view class="pad-sx10 radius10 tank-btn" style="background-color: rgba(230, 230, 230,1);color: #000000;">暂不绑定</view> <view class="fon28 colf pad-x30 pad-zy30 tc disjb">
<view :style="{background:publicColor}" class="pad-sx10 radius10 tank-btn posir"> <view class="pad-sx10 radius10 tank-btn" style="background-color: rgba(230, 230, 230,1);color: #000000;">暂不绑定</view>
立即绑定 <view :style="{background:publicColor}" class="pad-sx10 radius10 tank-btn posir">
<button open-type="getPhoneNumber" @getphonenumber="getphonenumber" class="posia syxzo">立即绑定</button> 立即绑定
<button open-type="getPhoneNumber" @getphonenumber="getphonenumber" class="posia syxzo">立即绑定</button>
</view>
</view> </view>
</view> </view>
</view> </view>

4
pages/tabbar/cart/cart.vue
View File

@ -9,7 +9,9 @@
:fromWhere="1"></status-nav> :fromWhere="1"></status-nav>
<!-- 容器 --> <!-- 容器 -->
<container-subgroup> <container-subgroup>
<cart></cart> <view slot="content">
<cart></cart>
</view>
</container-subgroup> </container-subgroup>
</view> </view>
</template> </template>

101
pages/tabbar/cate/cate.vue
View File

@ -8,64 +8,66 @@
:navBarTitle="'分类'"></status-nav> :navBarTitle="'分类'"></status-nav>
<!-- 容器 --> <!-- 容器 -->
<container-subgroup> <container-subgroup>
<view class="pad30 sort-box mar-x20" style="margin-left: -30rpx;margin-right: -30rpx;" :style="{top: statusBarHeight+'px'}"> <view slot="content">
<view class="col0 fon38 disjbac fon50"> <view class="pad30 sort-box mar-x20" style="margin-left: -30rpx;margin-right: -30rpx;" :style="{top: statusBarHeight+'px'}">
<view>分类筛选</view> <view class="col0 fon38 disjbac fon50">
<i @tap="clikScreenIcon" class="icon icon-screen" style="font-size: 50rpx;"></i> <view>分类筛选</view>
</view> <i @tap="clikScreenIcon" class="icon icon-screen" style="font-size: 50rpx;"></i>
<view v-if="chooseCateList.length" class="disac fw fon24"> </view>
<view class="disac pad-sx10 pad-zy20 radius20 bac0 colf mar-y20 mar-s20" <view v-if="chooseCateList.length" class="disac fw fon24">
v-for="(item,index) in chooseCateList" :key="index" <view class="disac pad-sx10 pad-zy20 radius20 bac0 colf mar-y20 mar-s20"
@tap="delCate(index)"> v-for="(item,index) in chooseCateList" :key="index"
{{item}}<i class="icon icon-del-white mar-z20" style="font-size: 20rpx;"></i> @tap="delCate(index)">
{{item}}<i class="icon icon-del-white mar-z20" style="font-size: 20rpx;"></i>
</view>
</view> </view>
</view> </view>
</view> <!-- 列表 -->
<!-- 列表 --> <view class="disjbac fw">
<view class="disjbac fw"> <view @tap="goDetail(item.id)" class="width47 mar-s50 posir" v-for="(item,index) in dataList" :key="index">
<view @tap="goDetail(item.id)" class="width47 mar-s50 posir" v-for="(item,index) in dataList" :key="index"> <image :src="item.imgSrc" mode="aspectFill" style="width: 100%;height: 312rpx;border-radius: 30rpx;"></image>
<image :src="item.imgSrc" mode="aspectFill" style="width: 100%;height: 312rpx;border-radius: 30rpx;"></image> <view class="clips2 fon30 col0 linh50" style="height: 100rpx;">{{item.title}}</view>
<view class="clips2 fon30 col0 linh50" style="height: 100rpx;">{{item.title}}</view> <view class="fon30 colpeili">￥{{item.price}}</view>
<view class="fon30 colpeili">￥{{item.price}}</view> <view v-if="item.isActivity" class="posia fon24 colf pad-zy10 pad-s10 pad-x20 activity-img">限时优惠</view>
<view v-if="item.isActivity" class="posia fon24 colf pad-zy10 pad-s10 pad-x20 activity-img">限时优惠</view> </view>
</view> </view>
</view> <!-- 无更多 -->
<!-- 无更多 --> <pitera v-if="total==dataList.length"></pitera>
<pitera v-if="total==dataList.length"></pitera> <!-- 筛选框 -->
<!-- 筛选框 --> <view v-show="isScreen" @tap="isScreen=false" class="screen-box" :style="{top:statusBarHeight+'px'}">
<view v-show="isScreen" @tap="isScreen=false" class="screen-box" :style="{top:statusBarHeight+'px'}"> <view @tap.stop="isScreen=true" class="posir">
<view @tap.stop="isScreen=true" class="posir"> <view class="fon24">筛选</view>
<view class="fon24">筛选</view> <!-- 类型 -->
<!-- 类型 --> <view v-for="(item,index) in screenList" :key="index">
<view v-for="(item,index) in screenList" :key="index"> <view class="fon30 bold mar-sx20">{{item.mainTitle}}</view>
<view class="fon30 bold mar-sx20">{{item.mainTitle}}</view> <view class="disac fw fon24">
<view class="disac fw fon24"> <view class="disac pad-sx10 pad-zy20 radius20 mar-y20 mar-x20"
<view class="disac pad-sx10 pad-zy20 radius20 mar-y20 mar-x20" :class="childitem.isCheck ? 'bac0 colf' : 'colpeili'"
:class="childitem.isCheck ? 'bac0 colf' : 'colpeili'" v-for="(childitem,childindex) in item.childrenList" :key="childindex"
v-for="(childitem,childindex) in item.childrenList" :key="childindex" @tap.stop="chooseCate(index,childindex)">
@tap.stop="chooseCate(index,childindex)"> {{childitem.title}}<i v-if="childitem.isCheck" class="icon icon-check mar-z20" style="font-size: 30rpx;"></i>
{{childitem.title}}<i v-if="childitem.isCheck" class="icon icon-check mar-z20" style="font-size: 30rpx;"></i> </view>
</view> </view>
</view> </view>
</view> <!-- 价格 -->
<!-- 价格 --> <view class="sort-price">
<view class="sort-price"> <view class="fon30 bold mar-sx20">价格</view>
<view class="fon30 bold mar-sx20">价格</view> <view class="disac fon24">
<view class="disac fon24"> <input class="radius20 pad-zy20" v-model="minPrice" type="number" placeholder="0" />
<input class="radius20 pad-zy20" v-model="minPrice" type="number" placeholder="0" /> <view class="mar-zy20">~</view>
<view class="mar-zy20">~</view> <input class="radius20 pad-zy20" v-model="maxPrice" type="number" placeholder="9999" />
<input class="radius20 pad-zy20" v-model="maxPrice" type="number" placeholder="9999" /> </view>
</view>
<!-- 按钮 -->
<view class="disjbac fon30 screen-btn">
<view @tap.stop="isScreen=false" class="radius30 colpeili">取消</view>
<view @tap.stop="defineEv" class="radius30 colf">确定</view>
</view> </view>
</view> </view>
<!-- 按钮 -->
<view class="disjbac fon30 screen-btn">
<view @tap.stop="isScreen=false" class="radius30 colpeili">取消</view>
<view @tap.stop="defineEv" class="radius30 colf">确定</view>
</view>
</view> </view>
<!-- 全局客服 -->
<public-customer :nbottom="520"></public-customer>
</view> </view>
<!-- 全局客服 -->
<public-customer :nbottom="520"></public-customer>
</container-subgroup> </container-subgroup>
<!-- 底部tab --> <!-- 底部tab -->
<foot-tab :titleList="titleList" :imgList="imgList" :newcurrent='1'></foot-tab> <foot-tab :titleList="titleList" :imgList="imgList" :newcurrent='1'></foot-tab>
@ -215,6 +217,7 @@
this.screenList[mainIndex].childrenList.forEach((item,index)=>{ this.screenList[mainIndex].childrenList.forEach((item,index)=>{
item.isCheck = false; item.isCheck = false;
}) })
console.log(this.screenList);
// 设置分类id // 设置分类id
this.categoryId = this.screenList[0].childrenList[childrenIndex].id; this.categoryId = this.screenList[0].childrenList[childrenIndex].id;
// 设置限时优惠 // 设置限时优惠

46
pages/tabbar/my/my.vue
View File

@ -8,33 +8,35 @@
:navBarTitle="'个人中心'"></status-nav> :navBarTitle="'个人中心'"></status-nav>
<!-- 容器 --> <!-- 容器 -->
<container-subgroup> <container-subgroup>
<view class="disjcac fc"> <view slot="content">
<image class="mar-sx20" :src="userInfo.headimgurl" mode="aspectFill" style="width: 224rpx;height: 224rpx;border-radius: 60rpx;"></image> <view class="disjcac fc">
<view class="fon36 bold">{{userInfo.nickname}}</view> <image class="mar-sx20" :src="userInfo.headimgurl" mode="aspectFill" style="width: 224rpx;height: 224rpx;border-radius: 60rpx;"></image>
</view> <view class="fon36 bold">{{userInfo.nickname}}</view>
<!-- 我的订单状态 -->
<view style="margin-top: 100rpx;">
<view class="mar-x50 disjbac">
<view class="fon36 col0">我的订单</view>
<navigator url="/pagesA/myOrder/myOrder?index=0" hover-class="none">
<view class="disac colpeili">
<view class="fon24 mar-y10">全部订单</view>
<i class="icon icon-next bold400" style="font-size: 28rpx;"></i>
</view>
</navigator>
</view> </view>
<view class="disjbac fon28 col3 mar-x50"> <!-- 我的订单状态 -->
<view @tap="chooseOrderStatus(indexo)" v-for="(itemo,indexo) in orderStatus" :key="indexo"> <view style="margin-top: 100rpx;">
<view class="disac fc posir"> <view class="mar-x50 disjbac">
<image :src="itemo.src" :style="{width:[50,46,48,49,49][indexo]+'rpx',height:[44,40,42,44,45][indexo]+'rpx'}" class="icon-img" mode="widthFix"></image> <view class="fon36 col0">我的订单</view>
<view class="mar-sx10 fon24 col0">{{itemo.title}}</view> <navigator url="/pagesA/myOrder/myOrder?index=0" hover-class="none">
<view class="posia red-num" style="right: 0;top: 0;" v-if="itemo.num!=0">{{itemo.num}}</view> <view class="disac colpeili">
<view class="fon24 mar-y10">全部订单</view>
<i class="icon icon-next bold400" style="font-size: 28rpx;"></i>
</view>
</navigator>
</view>
<view class="disjbac fon28 col3 mar-x50">
<view @tap="chooseOrderStatus(indexo)" v-for="(itemo,indexo) in orderStatus" :key="indexo">
<view class="disac fc posir">
<image :src="itemo.src" :style="{width:[50,46,48,49,49][indexo]+'rpx',height:[44,40,42,44,45][indexo]+'rpx'}" class="icon-img" mode="widthFix"></image>
<view class="mar-sx10 fon24 col0">{{itemo.title}}</view>
<view class="posia red-num" style="right: 0;top: 0;" v-if="itemo.num!=0">{{itemo.num}}</view>
</view>
</view> </view>
</view> </view>
</view> </view>
<!-- 功能列表 -->
<function-list :list="funcList"></function-list>
</view> </view>
<!-- 功能列表 -->
<function-list :list="funcList"></function-list>
</container-subgroup> </container-subgroup>
<!-- 底部tab --> <!-- 底部tab -->
<foot-tab :titleList="titleList" :imgList="imgList" :newcurrent='2'></foot-tab> <foot-tab :titleList="titleList" :imgList="imgList" :newcurrent='2'></foot-tab>

70
pagesA/distributionCenter/distributionCenter.vue
View File

@ -4,44 +4,46 @@
<status-nav :navBarTitle="'分销中心'"></status-nav> <status-nav :navBarTitle="'分销中心'"></status-nav>
<!-- 容器 --> <!-- 容器 -->
<container-subgroup> <container-subgroup>
<!-- 标题 --> <view slot="content">
<view class="fon30 col0 mar-s30 mar-x10 tcenter">我的佣金</view> <!-- 标题 -->
<!-- 佣金 --> <view class="fon30 col0 mar-s30 mar-x10 tcenter">我的佣金</view>
<view class="fon72 peili-colorRed tcenter bold">￥{{commission}}</view> <!-- 佣金 -->
<!-- 统计 --> <view class="fon72 peili-colorRed tcenter bold">￥{{commission}}</view>
<view class="disja mar-s30"> <!-- 统计 -->
<view class="disjcac fc"> <view class="disja mar-s30">
<view class="fon24 colpeili">累计收益</view> <view class="disjcac fc">
<view class="fon36 col0 bold mar-s20">￥{{distributionInfo.commission_total}}</view> <view class="fon24 colpeili">累计收益</view>
</view> <view class="fon36 col0 bold mar-s20">￥{{distributionInfo.commission_total}}</view>
<view class="disjcac fc">
<view class="fon24 colpeili">累计提现</view>
<view class="fon36 col0 bold mar-s20">￥{{distributionInfo.withdrawal_total}}</view>
</view>
<view class="disjcac fc">
<view class="fon24 colpeili">分享好友</view>
<view class="fon36 col0 bold mar-s10">{{distributionInfo.invite_count}}</view>
</view>
</view>
<!-- 提现按钮 -->
<view @tap="tuneEv" class="withdrawal-btn radius30 colf fon36 tcenter peili-backColor mar-s50 mar-x30">立即提现</view>
<!-- 佣金记录 -->
<view class="fon36 col0 bold pad-sx20 bbot">佣金记录</view>
<!-- 列表 -->
<view v-if="dataList.length">
<view class="bbot pad-sx20" v-for="(item,index) in dataList" :key="index">
<view class="disjbac">
<view class="fon30 col0 bold">{{item.name}}</view>
<!-- <view class="fon24 colpeili">{{item.status}}</view> -->
</view> </view>
<view class="disjbac mar-s20"> <view class="disjcac fc">
<view class="fon24 colpeili">{{item.created_at}}</view> <view class="fon24 colpeili">累计提现</view>
<view class="fon30 peili-colorRed bold">-{{item.price}}</view> <view class="fon36 col0 bold mar-s20">￥{{distributionInfo.withdrawal_total}}</view>
</view>
<view class="disjcac fc">
<view class="fon24 colpeili">分享好友</view>
<view class="fon36 col0 bold mar-s10">{{distributionInfo.invite_count}}</view>
</view> </view>
</view> </view>
<!-- 提现按钮 -->
<view @tap="tuneEv" class="withdrawal-btn radius30 colf fon36 tcenter peili-backColor mar-s50 mar-x30">立即提现</view>
<!-- 佣金记录 -->
<view class="fon36 col0 bold pad-sx20 bbot">佣金记录</view>
<!-- 列表 -->
<view v-if="dataList.length">
<view class="bbot pad-sx20" v-for="(item,index) in dataList" :key="index">
<view class="disjbac">
<view class="fon30 col0 bold">{{item.name}}</view>
<!-- <view class="fon24 colpeili">{{item.status}}</view> -->
</view>
<view class="disjbac mar-s20">
<view class="fon24 colpeili">{{item.created_at}}</view>
<view class="fon30 peili-colorRed bold">-{{item.price}}</view>
</view>
</view>
</view>
<!-- 暂无 -->
<pitera v-if="total==dataList.length"></pitera>
</view> </view>
<!-- 暂无 -->
<pitera v-if="total==dataList.length"></pitera>
</container-subgroup> </container-subgroup>
<!-- 提现弹框 --> <!-- 提现弹框 -->
<view v-show="showwithdrawal" :style="{top: statusBarHeight+'px'}" @tap="showwithdrawal=false" class="withdrawal-box"> <view v-show="showwithdrawal" :style="{top: statusBarHeight+'px'}" @tap="showwithdrawal=false" class="withdrawal-box">

116
pagesA/getReadyDan/getReadyDan.vue
View File

@ -4,74 +4,74 @@
<status-nav :navBarTitle="'确认订单'"></status-nav> <status-nav :navBarTitle="'确认订单'"></status-nav>
<!-- 容器 --> <!-- 容器 -->
<container-subgroup> <container-subgroup>
<view class="bacf6 fon30 col3 radius20 mar-s20 disjbac pad-sx27-zy20"> <view slot="content">
<view class="bold">配送方式</view> <view class="bacf6 fon30 col3 radius20 mar-s20 disjbac pad-sx27-zy20">
<view class="disac"> <view class="bold">配送方式</view>
<view @tap="expressEv(0)" :class="isExpress?'activeT':'expressT'" :style="{background:isExpress?publicColor:''}">快递</view> <view class="disac">
<view @tap="expressEv(1)" :class="!isExpress?'activeT':'expressT'" :style="{background:isExpress?'':publicColor}">自提</view> <view @tap="expressEv(0)" :class="isExpress?'activeT':'expressT'" :style="{background:isExpress?publicColor:''}">快递</view>
<view @tap="expressEv(1)" :class="!isExpress?'activeT':'expressT'" :style="{background:isExpress?'':publicColor}">自提</view>
</view>
</view> </view>
</view> <!-- 地址信息 -->
<!-- 地址信息 --> <view v-if="isExpress" class="bacf6 fon30 col3 radius20 mar-s20 pad-sx27-zy20">
<view v-if="isExpress" class="bacf6 fon30 col3 radius20 mar-s20 pad-sx27-zy20"> <view class="bold">收件人信息</view>
<view class="bold">收件人信息</view> <navigator url="/pagesA/myAddress/myAddress?isWhere=0" hover-class="none">
<navigator url="/pagesA/myAddress/myAddress?isWhere=0" hover-class="none"> <view class="disjbac pad-s30">
<view class="disjbac pad-s30"> <view v-if="addressInfo!=''">
<view v-if="addressInfo!=''"> <view class="fon28 bold mar-x10">{{addressInfo.name}}<span class="mar-z20">{{userPphone}}</span></view>
<view class="fon28 bold mar-x10">{{addressInfo.name}}<span class="mar-z20">{{userPphone}}</span></view> <view class="fon24 col9">{{addressInfo.province_str}}{{addressInfo.city_str}}{{addressInfo.county_str || ''}}{{addressInfo.address || ''}}</view>
<view class="fon24 col9">{{addressInfo.province_str}}{{addressInfo.city_str}}{{addressInfo.county_str || ''}}{{addressInfo.address || ''}}</view> </view>
<view v-else class="fon24 col9">请完善收件人信息</view>
<i class="icon icon-next col0"></i>
</view> </view>
<view v-else class="fon24 col9">请完善收件人信息</view> </navigator>
<i class="icon icon-next col0"></i>
</view>
</navigator>
</view>
<!-- 自提地址 -->
<view v-else class="bacf6 fon30 col3 radius20 mar-s20 pad-sx27-zy20">
<view class="bold">自提地址</view>
<input type="number" maxlength="11" :focus="isFocus" @blur="blurEv" v-model="zPhone" class="mar-s50 mar-x20" style="border: 2rpx solid #E0E0E0;padding: 20rpx;border-radius: 10rpx;font-size: 24rpx;" placeholder="请输入收货人手机号" />
<view class="disjbac mar-s50">
<view>
<view class="fon28 bold mar-x20">佩丽饰品</view>
<view class="fon24 col9">{{goAddress}}</view>
</view>
<!-- 立即导航 -->
<view @tap="goThere(goAddress)" class="disjcac fc col0 fon24">
<i class="icon icon-navigate-now " style="font-size: 50rpx;"></i>
<view>立即导航</view>
</view>
<!-- <image src="/static/public/daoh.png" class="there" mode="aspectFill"></image> -->
</view> </view>
</view> <!-- 自提地址 -->
<!-- 订单信息 --> <view v-else class="bacf6 fon30 col3 radius20 mar-s20 pad-sx27-zy20">
<view class="bacf6 fon30 radius20 mar-s20 pad-sx27-zy20"> <view class="bold">自提地址</view>
<view class="bold">订单信息</view> <input type="number" maxlength="11" :focus="isFocus" @blur="blurEv" v-model="zPhone" class="mar-s50 mar-x20" style="border: 2rpx solid #E0E0E0;padding: 20rpx;border-radius: 10rpx;font-size: 24rpx;" placeholder="请输入收货人手机号" />
<view v-for="(item,index) in orderList" :key="index" class="fon26 col3 disjbac pad-sx50 disjbac bbot"> <view class="disjbac mar-s50">
<image @tap="goShopDetail(item.id)" :src="item.imgSrc" class="flexs order-image" mode="aspectFill"></image>
<view class="width100 disjb fw" style="height: 166rpx;">
<view> <view>
<view class="fon28 bold mar-x20">佩丽饰品</view>
<view class="fon24 col9">{{goAddress}}</view>
</view>
<!-- 立即导航 -->
<view @tap="goThere(goAddress)" class="disjcac fc col0 fon24">
<i class="icon icon-navigate-now " style="font-size: 50rpx;"></i>
<view>立即导航</view>
</view>
<!-- <image src="/static/public/daoh.png" class="there" mode="aspectFill"></image> -->
</view>
</view>
<!-- 订单信息 -->
<view class="bacf6 fon30 radius20 mar-s20 pad-sx27-zy20">
<view class="bold">订单信息</view>
<view v-for="(item,index) in orderList" :key="index" class="fon26 col3 disjbac pad-sx50 disjbac bbot">
<image @tap="goShopDetail(item.id)" :src="item.imgSrc" class="flexs order-image" mode="aspectFill"></image>
<view class="width100 disjb fc" style="height: 166rpx;">
<view @tap="goShopDetail(item.id)" class="fon30 col3 bold clips2">{{item.title}}</view> <view @tap="goShopDetail(item.id)" class="fon30 col3 bold clips2">{{item.title}}</view>
<!-- <view class="order-sy">{{item.sku_name}}</view> --> <!-- <view class="order-sy">{{item.sku_name}}</view> -->
</view> <view class="disjbac mar-s10 width100">
<view class="disjbac mar-s10 width100"> <view class="order-item-price">￥{{item.price}}</view>
<view class="order-item-price">￥{{item.price}}</view> <view class="fon30 col6">x{{item.num}}</view>
<view class="fon30 col6">x{{item.num}}</view> </view>
</view> </view>
</view> </view>
<view class="fon30 disjbac mar-s20 pad-s10">
<view class="col6">共{{allNum}}件</view>
<view class="bold colf8">应付款：{{allPrice}}</view>
</view>
</view> </view>
<view class="fon30 disjbac mar-s20 pad-s10"> <!-- 优惠 -->
<view class="col6">共{{allNum}}件</view> <view class="bacf6 fon30 col3 radius20 mar-s20 pad-sx27-zy20 disjbac">
<view class="bold colf8">应付款：{{allPrice}}</view> <view class="bold">折扣优惠</view>
<view class="colf8 bold">￥{{discountPrice}}</view>
</view>
<!-- 快递费用 -->
<view v-if="isExpress" class="bacf6 fon30 radius20 mar-s20 disjbac pad-sx27-zy20">
<view class="bold">快递费用</view>
<view class="colf8 bold">￥{{expressInfo.default_price}}</view>
</view> </view>
</view>
<!-- 优惠 -->
<view class="bacf6 fon30 col3 radius20 mar-s20 pad-sx27-zy20 disjbac">
<view class="bold">折扣优惠</view>
<view class="colf8 bold">￥{{discountPrice}}</view>
</view>
<!-- 快递费用 -->
<view v-if="isExpress" class="bacf6 fon30 radius20 mar-s20 disjbac pad-sx27-zy20">
<view class="bold">快递费用</view>
<view class="colf8 bold">￥{{expressInfo.default_price}}</view>
</view> </view>
</container-subgroup> </container-subgroup>
<!-- 底部导航 --> <!-- 底部导航 -->

32
pagesA/myAddress/myAddress.vue
View File

@ -5,25 +5,27 @@
<!-- 容器 --> <!-- 容器 -->
<view class="pad-x140"> <view class="pad-x140">
<container-subgroup> <container-subgroup>
<view v-if="loading"> <view slot="content">
<view @tap="goBack(index)" v-for="(item,index) in dataList" :key="index" class="bacf6 radius20 pad30 mar-s30"> <view v-if="loading">
<view class="pad-y20 disjbac"> <view @tap="goBack(index)" v-for="(item,index) in dataList" :key="index" class="bacf6 radius20 pad30 mar-s30">
<view class="fon28 col3 bold">{{item.userName}} {{item.userPhone}}</view> <view class="pad-y20 disjbac">
</view> <view class="fon28 col3 bold">{{item.userName}} {{item.userPhone}}</view>
<view class="fon24 col9 mar-s25">{{item.userAddress}}</view>
<view class="disjbac fon28 col3 mar-s32">
<view @tap.stop="setMo(index)" class="disac">
<i class="icon" :class="item.isActive ? 'icon-address-check' : 'icon-address-unchecked'" style="font-size: 36rpx;"></i>
<view class="mar-z10" :class="item.isActive?'':'col0'">设为默认地址</view>
</view> </view>
<view class="disac col0"> <view class="fon24 col9 mar-s25">{{item.userAddress}}</view>
<view @tap.stop="editAddress(index)">编辑</view> <view class="disjbac fon28 col3 mar-s32">
<view @tap.stop="delAddress(index)" class="mar-y10 mar-z50">删除</view> <view @tap.stop="setMo(index)" class="disac">
<i class="icon" :class="item.isActive ? 'icon-address-check' : 'icon-address-unchecked'" style="font-size: 36rpx;"></i>
<view class="mar-z10" :class="item.isActive?'':'col0'">设为默认地址</view>
</view>
<view class="disac col0">
<view @tap.stop="editAddress(index)">编辑</view>
<view @tap.stop="delAddress(index)" class="mar-y10 mar-z50">删除</view>
</view>
</view> </view>
</view> </view>
<view @tap.stop="obtainLngLat" class="posixzy address_add" :style="{backgroundColor:publicColor}" style="bottom: 20rpx;">新增地址</view>
<nothing-page v-if="dataList.length==0" :content="'暂无可用地址'"></nothing-page>
</view> </view>
<view @tap.stop="obtainLngLat" class="posixzy address_add" :style="{backgroundColor:publicColor}" style="bottom: 20rpx;">新增地址</view>
<nothing-page v-if="dataList.length==0" :content="'暂无可用地址'"></nothing-page>
</view> </view>
</container-subgroup> </container-subgroup>
</view> </view>

20
pagesB/aboutUs/aboutUs.vue
View File

@ -3,16 +3,18 @@
<!-- 状态栏 --> <!-- 状态栏 -->
<status-nav :navBarTitle="'关于我们'"></status-nav> <status-nav :navBarTitle="'关于我们'"></status-nav>
<!-- 容器 --> <!-- 容器 -->
<container-subgroup> <container-subgroup>
<!-- 地图 --> <view slot="content">
<view class="radius30" style="overflow: hidden;border: 2rpx solid #8c8c9b;"> <!-- 地图 -->
<map :latitude="lat" :longitude="lng" :enable-scroll="enableScroll" :enable-zoom="enableZoom" scale="11" style="height: 390rpx;width: 100%;"></map> <view class="radius30" style="overflow: hidden;border: 2rpx solid #8c8c9b;">
<map :latitude="lat" :longitude="lng" :enable-scroll="enableScroll" :enable-zoom="enableZoom" scale="11" style="height: 390rpx;width: 100%;"></map>
</view>
<!-- 导航按钮 -->
<view @tap="goThere" class="navigate-to-where mar-s30 radius30 bac0 colf fon36 tcenter">导航至佩丽</view>
<!-- 关于佩丽 -->
<view class="fon48 col0 mar-sx50">关于佩丽</view>
<rich-text :nodes="richText" class="fon30 colpeili line-h50"></rich-text>
</view> </view>
<!-- 导航按钮 -->
<view @tap="goThere" class="navigate-to-where mar-s30 radius30 bac0 colf fon36 tcenter">导航至佩丽</view>
<!-- 关于佩丽 -->
<view class="fon48 col0 mar-sx50">关于佩丽</view>
<rich-text :nodes="richText" class="fon30 colpeili line-h50"></rich-text>
</container-subgroup> </container-subgroup>
</view> </view>
</template> </template>

26
pagesB/disclaimers/disclaimers.vue
View File

@ -4,18 +4,20 @@
<status-nav :navBarTitle="'免责声明'"></status-nav> <status-nav :navBarTitle="'免责声明'"></status-nav>
<!-- 容器 --> <!-- 容器 -->
<container-subgroup> <container-subgroup>
<rich-text :nodes="disclaimerRich" class="fon24 colpeili line-h46"></rich-text> <view slot="content">
<!-- 标题 --> <rich-text :nodes="disclaimerRich" class="fon24 colpeili line-h46"></rich-text>
<!-- <view class="fon30 col0 mar-sx30 tcenter">责任条款</view> --> <!-- 标题 -->
<!-- 内容 --> <!-- <view class="fon30 col0 mar-sx30 tcenter">责任条款</view> -->
<!-- <view class="fon24 colpeili line-h40"> <!-- 内容 -->
<view>本网站所提供的信息，只供参考之用。</view> <!-- <view class="fon24 colpeili line-h40">
<view class="mar-sx30">本网站及其雇员一概毋须以任何方式就任何信息传递或传送的失误、不准确或错误对用户或任何其他人士负任何直接或间接的责任。</view> <view>本网站所提供的信息，只供参考之用。</view>
<view class="mar-sx30">在法律允许的范围内，本网站在此声明,不承担用户或任何人士就使用或未能使用本网站所提供的信息或任何链接或项目所引致的任何直接、间接、附带、从属、特殊、惩罚性或惩戒性的损害赔偿（包括但不限于收益、预期利润的损失或失去的业务、未实现预期的节省）。</view> <view class="mar-sx30">本网站及其雇员一概毋须以任何方式就任何信息传递或传送的失误、不准确或错误对用户或任何其他人士负任何直接或间接的责任。</view>
<view class="mar-sx30">本网站所提供的信息，若在任何司法管辖地区供任何人士使用或分发给任何人士时会违反该司法管辖地区的法律或条例的规定或会导致本网站或其第三方代理人受限于该司法管辖地区内的任何监管规定时，则该等信息不宜在该司法管辖地区供该等任何人士使用或分发给该等任何人士。用户须自行保证不会受限于任何限制或禁止用户使用或分发本网站所提供信息的当地的规定。</view> <view class="mar-sx30">在法律允许的范围内，本网站在此声明,不承担用户或任何人士就使用或未能使用本网站所提供的信息或任何链接或项目所引致的任何直接、间接、附带、从属、特殊、惩罚性或惩戒性的损害赔偿（包括但不限于收益、预期利润的损失或失去的业务、未实现预期的节省）。</view>
<view class="mar-sx30">本网站图片，文字之类版权申明，因为网站可以由注册用户自行上传图片或文字，本网站无法鉴别所上传图片或文字的知识版权，如果侵犯，请及时通知我们，本网站将在第一时间及时删除。</view> <view class="mar-sx30">本网站所提供的信息，若在任何司法管辖地区供任何人士使用或分发给任何人士时会违反该司法管辖地区的法律或条例的规定或会导致本网站或其第三方代理人受限于该司法管辖地区内的任何监管规定时，则该等信息不宜在该司法管辖地区供该等任何人士使用或分发给该等任何人士。用户须自行保证不会受限于任何限制或禁止用户使用或分发本网站所提供信息的当地的规定。</view>
<view class="mar-sx30">凡以任何方式登录本网站或直接、间接使用本网站资料者，视为自愿接受本网站声明的约束。</view> <view class="mar-sx30">本网站图片，文字之类版权申明，因为网站可以由注册用户自行上传图片或文字，本网站无法鉴别所上传图片或文字的知识版权，如果侵犯，请及时通知我们，本网站将在第一时间及时删除。</view>
</view> --> <view class="mar-sx30">凡以任何方式登录本网站或直接、间接使用本网站资料者，视为自愿接受本网站声明的约束。</view>
</view> -->
</view>
</container-subgroup> </container-subgroup>
</view> </view>
</template> </template>

186
pagesB/orderDetail/orderDetail.vue
View File

@ -4,109 +4,111 @@
<status-nav :navBarTitle="'订单详情'"></status-nav> <status-nav :navBarTitle="'订单详情'"></status-nav>
<!-- 容器 --> <!-- 容器 -->
<container-subgroup> <container-subgroup>
<!-- 订单类型 --> <view slot="content">
<block v-if="loading"> <!-- 订单类型 -->
<view class="bacf6 radius20 mar-s20 fon30 line-h50 pad30"> <block v-if="loading">
<view class="disjbac"> <view class="bacf6 radius20 mar-s20 fon30 line-h50 pad30">
<view>订单编号</view> <view class="disjbac">
<view class="bold">{{orderInfo.coding}}</view> <view>订单编号</view>
</view> <view class="bold">{{orderInfo.coding}}</view>
<view class="disjbac">
<view>下单时间</view>
<view class="bold">{{orderInfo.created_at}}</view>
</view>
<view class="disjbac">
<view>订单状态</view>
<view class="bold">
<view v-if="orderInfo.status=='waiting'" class="colf8">待付款</view>
<view v-if="orderInfo.status=='paid'" class="colf8">待发货</view>
<view v-if="orderInfo.status=='shipped'" style="color: #61cf00;">待收货</view>
<view v-if="orderInfo.status=='completed'" class="col0">已完成</view>
<view v-if="orderInfo.status=='closed'" class="col9">已取消</view>
</view> </view>
</view> <view class="disjbac">
</view> <view>下单时间</view>
<!-- 订单信息 --> <view class="bold">{{orderInfo.created_at}}</view>
<view class="bacf6 radius20 mar-s20 orderDetail-box"> </view>
<view v-for="(item,index) in orderInfo.skus" :key="index" class="fon26 col3 disjbac pad-sx50 disjbac bbot"> <view class="disjbac">
<image :src="item.sku_cover" class="flexs" mode="aspectFill" style="width: 224rpx; height: 224rpx;"></image> <view>订单状态</view>
<view class="width100 disjb fc" style="height: 224rpx;"> <view class="bold">
<view class="fon28 col3 bold clips2">{{item.spu_name}}</view> <view v-if="orderInfo.status=='waiting'" class="colf8">待付款</view>
<view class="orderDetail-sku" v-if="item.tag!=''">{{item.tag}}</view> <view v-if="orderInfo.status=='paid'" class="colf8">待发货</view>
<view class="mar-s10"> <view v-if="orderInfo.status=='shipped'" style="color: #61cf00;">待收货</view>
<view class="colf8 fon32 bold disjbac width100"><span>￥{{item.price}}</span><span class="fon28 col6 mar-z20 font4">x{{item.num}}</span></view> <view v-if="orderInfo.status=='completed'" class="col0">已完成</view>
<view v-if="orderInfo.status=='closed'" class="col9">已取消</view>
</view> </view>
</view> </view>
</view> </view>
<view class="fon28 disjbac mar-s40 mar-x20"> <!-- 订单信息 -->
<view class="col6">共{{allNum}}件</view> <view class="bacf6 radius20 mar-s20 orderDetail-box">
<view class="colf8 bold">共计：{{orderInfo.original_price}}</view> <view v-for="(item,index) in orderInfo.skus" :key="index" class="fon26 col3 disjbac pad-sx50 disjbac bbot">
</view> <image :src="item.sku_cover" class="flexs" mode="aspectFill" style="width: 224rpx; height: 224rpx;"></image>
</view> <view class="width100 disjb fc" style="height: 224rpx;">
<!-- 物流信息 --> <view class="fon28 col3 bold clips2">{{item.spu_name}}</view>
<view v-if="orderInfo.address!='自提'" class="bacf6 radius20 mar-s20 fon28 pad30"> <view class="orderDetail-sku" v-if="item.tag!=''">{{item.tag}}</view>
<view class="bold">物流信息</view> <view class="mar-s10">
<view class="bold col3 mar-s40 fon26 disjbac"> <view class="colf8 fon32 bold disjbac width100"><span>￥{{item.price}}</span><span class="fon28 col6 mar-z20 font4">x{{item.num}}</span></view>
<view>{{orderInfo.express_name}}：{{orderInfo.express_number||'暂无快递单号'}}</view> </view>
<view v-if="orderInfo.express_number" @tap="copyCont">复制</view> </view>
</view>
</view>
<!-- 地址信息 -->
<view v-if="orderInfo.address!='自提'" class="bacf6 radius20 mar-s20 pad30">
<view class="bold">收件人信息</view>
<view class="fon26 col3">
<view class="fon28 col3 bold" style="margin: 52rpx 0 20rpx 0;">{{addressInfo.userName}}<span class="mar-z10">{{addressInfo.userPhone}}</span></view>
<view class="fon24 col9">{{addressInfo.userAddress}}</view>
</view>
</view>
<view v-else class="bacf6 radius20 mar-s20 pad30">
<view class="disjbac">
<view>配送方式</view>
<view>自提</view>
</view>
<view class="fon26 col3 disjbac mar-s30">
<view>
<view class="fon28 col3 bold mar-x20">{{appletName}}</view>
<view class="fon24 col9">{{goAddress}}</view>
</view> </view>
<!-- 立即导航 --> <view class="fon28 disjbac mar-s40 mar-x20">
<view @tap="goThere(goAddress)" class="disjcac fc col0 fon24"> <view class="col6">共{{allNum}}件</view>
<i class="icon icon-navigate-now " style="font-size: 50rpx;"></i> <view class="colf8 bold">共计：{{orderInfo.original_price}}</view>
<view>立即导航</view>
</view> </view>
</view> </view>
</view> <!-- 物流信息 -->
<!-- 金额详情 --> <view v-if="orderInfo.address!='自提'" class="bacf6 radius20 mar-s20 fon28 pad30">
<view class="bacf6 radius20 mar-s20 fon30 col0 line-h60 pad30"> <view class="bold">物流信息</view>
<view class="disjbac"> <view class="bold col3 mar-s40 fon26 disjbac">
<view>商品总金额</view> <view>{{orderInfo.express_name}}：{{orderInfo.express_number||'暂无快递单号'}}</view>
<view class="colf8">￥{{orderInfo.original_price}}</view> <view v-if="orderInfo.express_number" @tap="copyCont">复制</view>
</view>
</view> </view>
<view class="disjbac"> <!-- 地址信息 -->
<view>折扣优惠</view> <view v-if="orderInfo.address!='自提'" class="bacf6 radius20 mar-s20 pad30">
<view class="colf8">0</view> <view class="bold">收件人信息</view>
<view class="fon26 col3">
<view class="fon28 col3 bold" style="margin: 52rpx 0 20rpx 0;">{{addressInfo.userName}}<span class="mar-z10">{{addressInfo.userPhone}}</span></view>
<view class="fon24 col9">{{addressInfo.userAddress}}</view>
</view>
</view> </view>
<view class="disjbac" v-if="orderInfo.address!='自提'"> <view v-else class="bacf6 radius20 mar-s20 pad30">
<view>快递费用</view> <view class="disjbac">
<view class="colf8">{{orderInfo.freight}}</view> <view>配送方式</view>
<view>自提</view>
</view>
<view class="fon26 col3 disjbac mar-s30">
<view>
<view class="fon28 col3 bold mar-x20">{{appletName}}</view>
<view class="fon24 col9">{{goAddress}}</view>
</view>
<!-- 立即导航 -->
<view @tap="goThere(goAddress)" class="disjcac fc col0 fon24">
<i class="icon icon-navigate-now " style="font-size: 50rpx;"></i>
<view>立即导航</view>
</view>
</view>
</view> </view>
<view class="disjbac"> <!-- 金额详情 -->
<view class="width100" style="text-align: right;">实付：</view> <view class="bacf6 radius20 mar-s20 fon30 col0 line-h60 pad30">
<view class="colf8 flexs bold">￥{{orderInfo.price}}</view> <view class="disjbac">
<view>商品总金额</view>
<view class="colf8">￥{{orderInfo.original_price}}</view>
</view>
<view class="disjbac">
<view>折扣优惠</view>
<view class="colf8">0</view>
</view>
<view class="disjbac" v-if="orderInfo.address!='自提'">
<view>快递费用</view>
<view class="colf8">{{orderInfo.freight}}</view>
</view>
<view class="disjbac">
<view class="width100" style="text-align: right;">实付：</view>
<view class="colf8 flexs bold">￥{{orderInfo.price}}</view>
</view>
</view> </view>
</view> <!-- 底部导航 -->
<!-- 底部导航 --> <view class="posixzy disja fe bacf pad-sx20 pad-y40">
<view class="posixzy disja fe bacf pad-sx20 pad-y40"> <!-- 取消订单 -->
<!-- 取消订单 --> <view @tap="cancleEv" v-if="orderInfo.status=='paid' || orderInfo.status=='waiting'" class="order-btn">取消订单</view>
<view @tap="cancleEv" v-if="orderInfo.status=='paid' || orderInfo.status=='waiting'" class="order-btn">取消订单</view> <!-- 立即支付 -->
<!-- 立即支付 --> <view @tap="paymentEv" v-if="orderInfo.status=='waiting'" class="order-btn" style="background-color: #f83030;color: #FFFFFF;">立即支付</view>
<view @tap="paymentEv" v-if="orderInfo.status=='waiting'" class="order-btn" style="background-color: #f83030;color: #FFFFFF;">立即支付</view> <!-- 确认收获 -->
<!-- 确认收获 --> <view @tap="confirmReceipt(orderInfo.id)" v-if="orderInfo.status=='shipped'" class="order-btn" style="background-color: #000000;color: #FFFFFF;">确认收货</view>
<view @tap="confirmReceipt(orderInfo.id)" v-if="orderInfo.status=='shipped'" class="order-btn" style="background-color: #000000;color: #FFFFFF;">确认收货</view> <!-- 再次购买 -->
<!-- 再次购买 --> <view @tap="againBuy" v-if="orderInfo.status=='completed' || orderInfo.status=='closed'" class="order-btn" style="background-color: #f83030;color: #FFFFFF;">再次购买</view>
<view @tap="againBuy" v-if="orderInfo.status=='completed' || orderInfo.status=='closed'" class="order-btn" style="background-color: #f83030;color: #FFFFFF;">再次购买</view> </view>
</view> </block>
</block> </view>
</container-subgroup> </container-subgroup>
</view> </view>
</template> </template>

144
pagesB/shopDetail/shopDetail.vue
View File

@ -5,38 +5,48 @@
<!-- 容器 --> <!-- 容器 -->
<view class="pad-x140" style="background-color: #fafafa;"> <view class="pad-x140" style="background-color: #fafafa;">
<container-subgroup> <container-subgroup>
<view style="margin: 0 -30rpx;"> <view slot="content">
<swiper-pu v-if="cateCurrent==0" :isplay="isAutoPlay" :browseP="true" :bannerList="bannerList" :newHeight="swiperHeight" :newRadius="'0'" :newBottom="'5'"></swiper-pu> <view style="margin: 0 -30rpx;">
</view> <swiper-pu v-if="cateCurrent==0" :isplay="isAutoPlay" :browseP="true" :bannerList="bannerList" :newHeight="swiperHeight" :newRadius="'0'" :newBottom="'5'"></swiper-pu>
<!-- 标题 --> </view>
<view class="mar-s30 mar-x20 fon36 bold clips2 line-h50">{{detailObj.name}}</view> <!-- 标题 -->
<!-- 描述 --> <view class="mar-s30 mar-x20 fon36 bold clips2 line-h50">{{detailObj.name}}</view>
<view class="colpeili fon30 clips3 line-h50">{{detailObj.subtitle}}</view> <!-- 描述 -->
<view class="disac mar-s20"> <view class="colpeili fon30 clips3 line-h50">{{detailObj.subtitle}}</view>
<!-- 是否限时优惠 --> <view class="disac mar-s20 mar-x50">
<view v-if="detailObj.tag!=''" class="fon24 colf pad-zy10 pad-s10 pad-x20 activity-img">限时优惠</view> <!-- 是否限时优惠 -->
<!-- 价格 --> <view v-if="detailObj.tag!=''" class="fon24 colf pad-zy10 pad-s10 pad-x20 activity-img">限时优惠</view>
<view class="disac"> <!-- 价格 -->
<view class="fon40 bold col0 mar-y10">￥{{discountPrice}}</view> <view class="disac">
<view class="fon30 colpeili" style="text-decoration: line-through;">￥{{originalPrice}}</view> <view class="fon40 bold col0 mar-y10">￥{{discountPrice}}</view>
<view class="fon30 colpeili" style="text-decoration: line-through;">￥{{originalPrice}}</view>
</view>
</view>
<view v-for="(item,index) in specList" :key="index">
<drop-down :dropObj="item" @chooseItem="chooseItem"></drop-down>
</view>
<!-- 颜色 -->
<!-- 尺寸 -->
<!-- <drop-down :dropObj="dropObj" @chooseItem="chooseItem"></drop-down> -->
<view class="pad-zy30" style="background-color: #FFFFFF;margin: 0 -30rpx;">
<!-- 作品介绍 -->
<view class="mar-s100 mar-x30 fon36 bold col0 tcenter pad-s50">作品介绍</view>
<!-- 富文本 -->
<rich-text :nodes="shopRich"></rich-text>
</view> </view>
</view>
<!-- 颜色 -->
<view class="mar-s50"><drop-down></drop-down></view>
<!-- 尺寸 -->
<drop-down :dropObj="dropObj" @chooseItem="chooseItem"></drop-down>
<view style="background-color: #FFFFFF;margin: 0 -30rpx;">
<!-- 作品介绍 -->
<view class="mar-s100 mar-x30 fon36 bold col0 tcenter pad-s50">作品介绍</view>
<!-- 富文本 -->
<rich-text :nodes="shopRich"></rich-text>
</view> </view>
</container-subgroup> </container-subgroup>
</view> </view>
<!-- 底部导航 --> <!-- 底部导航 -->
<view v-if="shopDetail!=''"> <!-- 底部按钮 -->
<bottom-nav :detailObj="shopDetail"></bottom-nav> <view class="bottom-nav-box display-between-center">
<button type="default" @tap="immediatelyBuy">立即购买</button>
<button type="default" @tap="addCart">加入购物车</button>
</view> </view>
<!-- <view v-if="shopDetail!=''">
<bottom-nav :detailObj="shopDetail"></bottom-nav>
</view> -->
<!-- 全局客服 --> <!-- 全局客服 -->
<public-customer <public-customer
:nbottom="180" :nbottom="180"
@ -67,6 +77,7 @@
return { return {
swiperHeight:uni.getSystemInfoSync().windowWidth, swiperHeight:uni.getSystemInfoSync().windowWidth,
cateCurrent:0, cateCurrent:0,
specList:[],//规格列表
dropObj:{ dropObj:{
title:'尺寸', title:'尺寸',
childrenList:[ childrenList:[
@ -90,6 +101,9 @@
buyNum:1,//购买数量 buyNum:1,//购买数量
csNum:0,//点击次数, csNum:0,//点击次数,
isAutoPlay:false, isAutoPlay:false,
specIdList:[],//多规格id
specCehckList:[],//存查询的规格数据
transmitData:[],//要传递的数据
} }
}, },
onShareAppMessage(res) { onShareAppMessage(res) {
@ -115,6 +129,19 @@
this.checkDetail(options.id); this.checkDetail(options.id);
}, },
methods: { methods: {
//规格查询接口
specsEv(id){
this.$requst.post('/api/spu/spec',{id}).then(res=>{
if(res.code==0){
this.specList = res.data.spec;
this.specCehckList = res.data.sku_list;
} else {
this.$toolAll.tools.showToast(res.msg);
}
}).catch(err=>{
this.$toolAll.tools.showToast(err.msg);
})
},
// 查询商品详情 // 查询商品详情
checkDetail(id){ checkDetail(id){
this.$requst.post('/api/spu/detail',{id}).then(res=>{ this.$requst.post('/api/spu/detail',{id}).then(res=>{
@ -122,8 +149,9 @@
// 设置商品详情 // 设置商品详情
this.detailObj = res.data.detail; this.detailObj = res.data.detail;
this.shopDetail = res.data; this.shopDetail = res.data;
// 调用查询规格事件
// 轮播 this.specsEv(id);
// 轮播 start
// 图片字符串转数组 // 图片字符串转数组
let arrImg = this.detailObj.images.split(',') let arrImg = this.detailObj.images.split(',')
arrImg.forEach(item=>{ arrImg.forEach(item=>{
@ -145,6 +173,7 @@
poster:'', poster:'',
} }
} }
// 轮播 end
// 原价金额转换 // 原价金额转换
// this.originalPrice = this.$toolAll.tools.changeNum(this.detailObj.original_price); // this.originalPrice = this.$toolAll.tools.changeNum(this.detailObj.original_price);
this.originalPrice = this.detailObj.original_price; this.originalPrice = this.detailObj.original_price;
@ -162,19 +191,41 @@
}, },
// 尺寸选择事件 // 尺寸选择事件
chooseItem(e){ chooseItem(e){
this.log(e); let specIndex = this.specList.findIndex(item=>item.title==e.mainTitle);
this.specIdList[specIndex*1] = e.id;
let specStr = this.specIdList.join('_');
this.transmitData = this.specCehckList.filter(item=>item.indexes==specStr);
console.log(this.transmitData);
}, },
addCart(){//添加购物车事件 // 立即购买
if(this.csNum==0){ immediatelyBuy(){
this.csNum++; // 调用加入购物车事件
this.$toolAll.tools.showToast('正在加入购物车...'); this.addCart(1);
this.$requst.post('order/shopping-cart-add',{sku_id:this.skuDetail.id,num:this.buyNum}).then(res=>{ },
if(res.code==0) { addCart(index=0){//添加购物车事件
this.$toolAll.tools.showToast('添加购物车成功(*^▽^*)'); if(this.transmitData.length){
this.cartNumEv(); if(this.csNum==0){
this.csNum = 0; this.csNum++;
} if(index==0){
}) this.$toolAll.tools.showToast('正在加入购物车...');
}
this.$requst.post('/api/order/shopping-cart-add',{sku_id:this.transmitData[0].id,num:1}).then(res=>{
if(res.code==0) {
if(index==1){
setTimeout(()=>{
uni.navigateTo({
url:'/pages/tabbar/cart/cart'
})
},500)
} else {
this.$toolAll.tools.showToast('添加购物车成功(*^▽^*)');
this.csNum = 0;
}
}
})
}
} else {
this.$toolAll.tools.showToast('请选择商品参数')
} }
}, },
} }
@ -182,4 +233,17 @@
</script> </script>
<style> <style>
.display-between-center{display: flex;justify-content: space-between;align-items: center;}
.bottom-nav-box{position: fixed;bottom: 0;left: 0;right: 0;padding: 20rpx 40rpx;background-color: #FFFFFF;}
button{
width: 310rpx;
height: 100rpx;
line-height: 100rpx!important;
border-radius: 30rpx;
font-size: 36rpx;
border: 1rpx solid #FFFFFF;
color: #FFFFFF!important;
}
button:first-child{border: 1rpx solid #f81c1c;background-color: #f81c1c;}
button:last-child{border: 1rpx solid #000000;background-color: #000000;}
</style> </style>