615 lines
18 KiB
Vue
615 lines
18 KiB
Vue
<template>
|
||
<view class="pages-mine" v-if="mineInfo.id">
|
||
<uni-nav-bar :fixed="true" :shadow="false" :statusBar="true" title="我的" :color="color"
|
||
:backgroundColor="color == '#ffffff' ?``:`#ffffff`">
|
||
</uni-nav-bar>
|
||
<view :style="{height:`${configInfo.navBarHeight}px`}"></view>
|
||
<view mode="aspectFill" lazy-load class="mine-index-bg abs"></view>
|
||
<block v-if="user_type == 1">
|
||
<auth :needAuth="true" :must="true" class="pl-lg pr-lg pb-lg" v-if="userInfo && !userInfo.nickName"
|
||
@go="$util.goUrl({url:`/pages/login?type=1`})">
|
||
<view class="pl-lg flex-center">
|
||
<image mode="aspectFill" lazy-load class="avatar radius"
|
||
src="/static/image/mine/default-user.png">
|
||
</image>
|
||
<view class="flex-1 f-sm-title c-base text-bold ml-md">立即登录</view>
|
||
</view>
|
||
</auth>
|
||
<view class="rel pt-md pl-lg pr-lg pb-lg flex-center" v-else>
|
||
<image mode="aspectFill" lazy-load class="mt-md avatar radius" :src="userInfo.avatarUrl"></image>
|
||
<view class="flex-1 ml-md">
|
||
<view class="flex-center mb-lg">
|
||
<view class="flex-1 flex-center f-lg-title c-base text-bold">
|
||
<view class="mr-sm max-400 ellipsis">
|
||
{{ userInfo.nickName || `用户${userInfo.id}` }}
|
||
</view>
|
||
<!-- #ifdef APP-PLUS -->
|
||
<view class="flex-1"></view>
|
||
<!-- #endif -->
|
||
<!-- #ifndef APP-PLUS -->
|
||
<i class="flex-1"></i>
|
||
<!-- #endif -->
|
||
</view>
|
||
<view @tap.stop="$util.toCheckLogin({url:`/mine/pages/notice`})" class="notice-item rel">
|
||
<view class="abs fill-warning radius" v-if="mineInfo.no_read_info"></view>
|
||
<i class="iconfont icon-tongzhi c-base"></i>
|
||
</view>
|
||
<!-- #ifndef MP-WEIXIN -->
|
||
<view @tap.stop="$util.toCheckLogin({url:`/mine/pages/setting`})" class="notice-item ml-md">
|
||
<i class="iconfont icon-xitong text-bold c-base"></i>
|
||
</view>
|
||
<!-- #endif -->
|
||
</view>
|
||
<!--<view class="f-paragraph c-base" v-if="userInfo.phone"> {{userInfo.split_phone}} </view>-->
|
||
|
||
|
||
<view class="abs member-item pl-sm pr-sm fill-base flex-center">
|
||
<image lazy-load class="vip-icon" src="/static/image/mine/vip-icon.png">
|
||
</image>
|
||
<view class="f-desc ellipsis" :style="{color:primaryColor}">
|
||
{{mineInfo.id > 0 && mineInfo.member_title ? mineInfo.member_title :'普通会员'}}
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
</view>
|
||
</block>
|
||
|
||
<view class="pt-md pl-lg pr-lg pb-lg flex-center" v-if="user_type == 2">
|
||
<image mode="aspectFill" lazy-load class="avatar radius" :src="farmer_info.cover">
|
||
</image>
|
||
<view class="flex-1 ml-md">
|
||
<view class="f-lg-title c-base text-bold ellipsis" style="max-width: 520rpx;">{{farmer_info.title}}
|
||
</view>
|
||
<view class="flex-warp f-paragraph c-base">
|
||
<i class="iconfont icon-dingwei mr-sm" style="font-size: 28rpx;margin-top: 6rpx;"></i>
|
||
<view class="ellipsis-2" style="max-width: 490rpx;">{{farmer_info.address}}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 普通用户-->
|
||
<auth :needAuth="userInfo && !userInfo.nickName" :must="true"
|
||
@go="$util.toCheckLogin({url:`/mine/pages/balance/index`})" v-if="mineInfo.is_user">
|
||
<view class="stored-item flex-center pd-lg mt-sm ml-md mr-md fill-base box-shadow radius-20">
|
||
<view class="flex-1 mr-lg c-title">
|
||
<view class="f-lg-title text-bold">{{mineInfo.balance || 0}}</view>
|
||
<view class="f-caption c-caption">我的余额</view>
|
||
</view>
|
||
<view class="common-btn flex-center f-paragraph c-base radius" :style="{background:primaryColor}">
|
||
立即充值
|
||
</view>
|
||
</view>
|
||
</auth>
|
||
|
||
<!-- 地主/农场主 -->
|
||
<!-- balance 总金额，包含冻结资金 -->
|
||
<view class="stored-list flex-center pd-lg mt-sm ml-md mr-md fill-base box-shadow radius-20"
|
||
v-if="!mineInfo.is_user && user_type == 1">
|
||
<auth :needAuth="userInfo && !userInfo.nickName" :must="true"
|
||
@go="$util.toCheckLogin({url:`/mine/pages/balance/index`})" class="stored-item">
|
||
<view class="flex-center flex-column c-title">
|
||
<view class="f-lg-title text-bold">{{mineInfo.balance}}</view>
|
||
<view class="f-caption c-caption">我的余额</view>
|
||
</view>
|
||
</auth>
|
||
<auth :needAuth="userInfo && !userInfo.nickName" :must="true"
|
||
@go="$util.toCheckLogin({url:`/mine/pages/balance/index`})" class="stored-item">
|
||
<view class="flex-center flex-column c-title">
|
||
<view class="f-lg-title text-bold">{{mineInfo.frozen_cash}}</view>
|
||
<view class="f-caption c-caption">冻结资金</view>
|
||
</view>
|
||
</auth>
|
||
<auth :needAuth="userInfo && !userInfo.nickName" :must="true"
|
||
@go="$util.toCheckLogin({url:`/shop/pages/integral/record`})" class="stored-item">
|
||
<view class="flex-center flex-column c-title">
|
||
<view class="f-lg-title text-bold">{{mineInfo.integral}}</view>
|
||
<view class="f-caption c-caption">我的积分</view>
|
||
</view>
|
||
</auth>
|
||
</view>
|
||
|
||
<block v-if="user_type == 1">
|
||
|
||
<view class="mine-menu-list mt-md ml-md mr-md fill-base box-shadow radius-20">
|
||
<auth :needAuth="userInfo && !userInfo.nickName" :must="true"
|
||
@go="$util.toCheckLogin({url:`/shop/pages/order/list`})" class="common-nav-title mb-lg">
|
||
<view class="common-nav-title flex-center c-title pl-lg pr-md mb-lg b-1px-b">
|
||
<view class="f-title text-bold flex-1">商城订单</view>
|
||
<view class="f-caption flex-y-center">全部<i class="iconfont icon-right"></i></view>
|
||
</view>
|
||
</auth>
|
||
<view class="flex-warp pb-lg">
|
||
<auth :needAuth="userInfo && !userInfo.nickName" :must="true" @go="toJump('shopOrderList', index)"
|
||
v-for="(item, index) in shopOrderList" :key="index" class="item-child" style="width:20%">
|
||
<view class="flex-center flex-column f-caption c-title">
|
||
<image mode="aspectFill" lazy-load class="item-img" :src="item.img"></image>
|
||
<view>{{ item.text }}</view>
|
||
</view>
|
||
</auth>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="mine-menu-list mt-md ml-md mr-md fill-base box-shadow radius-20">
|
||
<view class="common-nav-title flex-center c-title pl-lg mb-lg b-1px-b">
|
||
<view class="f-title text-bold flex-1">农场管理</view>
|
||
</view>
|
||
<view class="flex-warp pb-lg">
|
||
<auth :needAuth="userInfo && !userInfo.nickName" :must="true" @go="toJump('toolList', index)"
|
||
v-for="(item, index) in toolList" :key="index" class="item-child" style="width:20%">
|
||
<view class="flex-center flex-column f-caption c-title">
|
||
<image mode="aspectFill" lazy-load class="item-img" :src="item.img"></image>
|
||
<view>{{ item.text }}</view>
|
||
</view>
|
||
</auth>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="mine-menu-list mt-md ml-md mr-md fill-base box-shadow radius-20">
|
||
<view class="common-nav-title flex-center c-title pl-lg mb-lg b-1px-b">
|
||
<view class="f-title text-bold flex-1">其他功能</view>
|
||
</view>
|
||
<view class="flex-warp pb-lg">
|
||
<auth :needAuth="userInfo && !userInfo.nickName" :must="true" @go="toJump('otherList', index)"
|
||
v-for="(item, index) in otherList" :key="index" class="item-child" style="width:20%">
|
||
<view class="flex-center flex-column f-caption c-title">
|
||
<image mode="aspectFill" lazy-load class="item-img" :src="item.img"></image>
|
||
<view>{{ item.text }}</view>
|
||
</view>
|
||
</auth>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="mine-menu-list mt-md ml-md mr-md fill-base box-shadow radius-20"
|
||
v-if="mineInfo.is_landlord && businessList.length > 0">
|
||
<view class="common-nav-title flex-center c-title pl-lg mb-lg b-1px-b">
|
||
<view class="f-title text-bold flex-1">商家专属</view>
|
||
</view>
|
||
<view class="flex-warp pb-lg">
|
||
<auth :needAuth="userInfo && !userInfo.nickName" :must="true" @go="toJump('businessList', index)"
|
||
v-for="(item, index) in businessList" :key="index" class="item-child" style="width:20%">
|
||
<view class="flex-center flex-column f-caption c-title">
|
||
<image mode="aspectFill" lazy-load class="item-img" :src="item.img"></image>
|
||
<view>{{ item.text }}</view>
|
||
</view>
|
||
</auth>
|
||
</view>
|
||
</view>
|
||
</block>
|
||
|
||
<block v-if="user_type == 2">
|
||
<view class="mine-menu-list rel ml-md mr-md fill-base box-shadow radius-20">
|
||
<view class="cancel-auth iconfont icon-biaoqian c-warning flex-center abs"
|
||
v-if="mineInfo.farmer_status == 3">
|
||
<view class="text-bold f-icontext abs">取消授权</view>
|
||
</view>
|
||
<view class="common-nav-title flex-center c-title pl-lg mb-lg b-1px-b">
|
||
<view class="f-title text-bold flex-1">订单管理</view>
|
||
</view>
|
||
<view class="flex-warp pb-lg">
|
||
<auth :needAuth="userInfo && !userInfo.nickName" :must="true" @go="toJump('orderList', index)"
|
||
v-for="(item, index) in orderList" :key="index" class="item-child" style="width:20%">
|
||
<view class="flex-center flex-column f-caption c-title">
|
||
<image mode="aspectFill" lazy-load class="item-img" :src="item.img"></image>
|
||
<view>{{ item.text }}</view>
|
||
</view>
|
||
</auth>
|
||
</view>
|
||
</view>
|
||
<view class="mine-menu-list mt-md ml-md mr-md fill-base box-shadow radius-20">
|
||
<view class="common-nav-title flex-center c-title pl-lg mb-lg b-1px-b">
|
||
<view class="f-title text-bold flex-1">其他功能</view>
|
||
</view>
|
||
<view class="flex-warp pb-lg">
|
||
<auth :needAuth="userInfo && !userInfo.nickName" :must="true" @go="toJump('manageList', index)"
|
||
v-for="(item, index) in manageList" :key="index" class="item-child" style="width:20%">
|
||
<view class="flex-center flex-column f-caption c-title">
|
||
<image mode="aspectFill" lazy-load class="item-img" :src="item.img"></image>
|
||
<view>{{ item.text }}</view>
|
||
</view>
|
||
</auth>
|
||
</view>
|
||
</view>
|
||
</block>
|
||
<view @tap.stop="toChange"
|
||
class="mine-menu-list flex-between mt-md ml-md mr-md pr-md fill-base box-shadow radius-20"
|
||
v-if="mineInfo.farmer_status == 2 || mineInfo.farmer_status == 3">
|
||
<view class="common-nav-title flex-center c-title pl-lg">
|
||
<view class="f-title text-bold flex-1">{{user_type == 1 ? '切换农场端' : '切换用户端'}}</view>
|
||
</view>
|
||
<i class="iconfont icon-right" style="font-size: 28rpx;"></i>
|
||
</view>
|
||
|
||
<view class="space-footer"></view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
mapState,
|
||
mapActions,
|
||
} from "vuex"
|
||
export default {
|
||
components: {},
|
||
data() {
|
||
return {
|
||
options: {},
|
||
color: '#ffffff',
|
||
// 商城订单
|
||
shopOrderList: [{
|
||
img: '/static/image/mine/no-pay.png',
|
||
text: '待支付',
|
||
url: '/shop/pages/order/list?tab=1'
|
||
}, {
|
||
img: '/static/image/mine/send.png',
|
||
text: '待发货',
|
||
url: '/shop/pages/order/list?tab=2'
|
||
}, {
|
||
img: '/static/image/mine/receiving.png',
|
||
text: '待收货',
|
||
url: '/shop/pages/order/list?tab=3'
|
||
}, {
|
||
img: '/static/image/mine/eval.png',
|
||
text: '已完成',
|
||
url: '/shop/pages/order/list?tab=4'
|
||
}, {
|
||
img: '/static/image/mine/refund.png',
|
||
text: '售后/退款',
|
||
url: '/shop/pages/refund/list'
|
||
}],
|
||
// 用户端 农场管理
|
||
toolList: [{
|
||
img: '/static/image/mine/land.png',
|
||
text: '我的土地',
|
||
url: '/land/pages/order/list'
|
||
}, {
|
||
img: '/static/image/mine/claim.png',
|
||
text: '我的认养',
|
||
url: '/claim/pages/order/list'
|
||
}, {
|
||
img: '/static/image/mine/monitor.png',
|
||
text: '我的监控',
|
||
url: '/home/pages/monitor/search'
|
||
}, {
|
||
img: '/static/image/mine/collage.png',
|
||
text: '我的众筹',
|
||
url: '/claim/pages/order/collage/list'
|
||
}, {
|
||
img: '/static/image/mine/evaluate.png',
|
||
text: '我的评价',
|
||
url: '/mine/pages/evaluate/list'
|
||
}],
|
||
// 用户端 其他功能
|
||
otherList: [{
|
||
img: '/static/image/mine/farm.png',
|
||
text: '附近农场',
|
||
url: '/home/pages/farm/list'
|
||
}, {
|
||
img: '/static/image/mine/coupon.png',
|
||
text: '我的卡券',
|
||
url: '/mine/pages/coupon/list'
|
||
}, {
|
||
img: '/static/image/mine/address.png',
|
||
text: '我的地址',
|
||
url: '/mine/pages/address/list'
|
||
}, {
|
||
img: '/static/image/mine/about.png',
|
||
text: '关于我们',
|
||
url: '/home/pages/about'
|
||
}],
|
||
// 用户端 商家专属
|
||
businessList: [{
|
||
img: '/static/image/mine/store-manage.png',
|
||
text: '店铺管理',
|
||
url: '/business/pages/store-manage'
|
||
}, {
|
||
img: '/static/image/mine/order.png',
|
||
text: '商城订单',
|
||
url: '/business/pages/order/list'
|
||
}],
|
||
// 农场端 其他
|
||
orderList: [{
|
||
img: '/static/image/mine/land.png',
|
||
text: '土地订单',
|
||
url: '/farmer/pages/order/land/list'
|
||
}, {
|
||
img: '/static/image/mine/claim.png',
|
||
text: '认养订单',
|
||
url: '/farmer/pages/order/claim/list'
|
||
}, {
|
||
img: '/static/image/mine/send-order.png',
|
||
text: '配送订单',
|
||
url: '/farmer/pages/order/distribution/list'
|
||
}],
|
||
// 农场端 其他功能
|
||
manageList: [{
|
||
img: '/static/image/mine/farm-manage.png',
|
||
text: '农场管理',
|
||
url: '/farmer/pages/apply?type=1'
|
||
}, {
|
||
img: '/static/image/mine/finance.png',
|
||
text: '财务管理',
|
||
url: '/farmer/pages/finance/index'
|
||
}],
|
||
farmer_info: {},
|
||
user_type: 1
|
||
}
|
||
},
|
||
computed: mapState({
|
||
primaryColor: state => state.config.configInfo.primaryColor,
|
||
subColor: state => state.config.configInfo.subColor,
|
||
configInfo: state => state.config.configInfo,
|
||
userInfo: state => state.user.userInfo,
|
||
mineInfo: state => state.user.mineInfo,
|
||
loginType: state => state.user.loginType,
|
||
}),
|
||
onShow() {
|
||
this.initIndex()
|
||
},
|
||
onPullDownRefresh() {
|
||
// #ifndef APP-PLUS
|
||
uni.showNavigationBarLoading()
|
||
// #endif
|
||
this.initRefresh()
|
||
uni.stopPullDownRefresh()
|
||
},
|
||
onPageScroll(e) {
|
||
let color = e.scrollTop < 20 ? '#ffffff' : '#000000'
|
||
if (this.color == color) return
|
||
this.color = color
|
||
this.$util.setNavigationBarColor({
|
||
color,
|
||
bg: 'none'
|
||
});
|
||
},
|
||
methods: {
|
||
...mapActions(['getConfigInfo', 'getUserInfo', 'getMineInfo', 'getAuthUserProfile']),
|
||
async initIndex(refresh = false) {
|
||
if (!this.configInfo.id || refresh) {
|
||
await this.getConfigInfo()
|
||
if (this.loginType == 'apple') {
|
||
this.updateUserItem({
|
||
key: 'isShowLogin',
|
||
val: false
|
||
})
|
||
}
|
||
}
|
||
await this.getUserInfo()
|
||
let [, farmer_info] = await Promise.all([this.getMineInfo(), this
|
||
.$api.farmer.farmerInfo()
|
||
])
|
||
this.farmer_info = farmer_info
|
||
let {
|
||
farmer_status,
|
||
fx_status
|
||
} = this.mineInfo
|
||
this.user_type = farmer_status == 2 || farmer_status == 3 ? this.user_type : 1
|
||
let arr = ['farmer_status', 'fx_status']
|
||
let textArr = {
|
||
farmer_status: {
|
||
text: '申请农场主',
|
||
list: {
|
||
img: '/static/image/mine/apply.png',
|
||
text: '申请农场主',
|
||
url: '/mine/pages/apply'
|
||
}
|
||
},
|
||
fx_status: {
|
||
text: '申请分销商',
|
||
list: {
|
||
img: '/static/image/mine/distribution.png',
|
||
text: '申请分销商',
|
||
url: '/mine/pages/distribution/apply'
|
||
},
|
||
list2: {
|
||
img: '/static/image/mine/distribution.png',
|
||
text: '分销中心',
|
||
url: '/mine/pages/distribution/index'
|
||
}
|
||
}
|
||
}
|
||
arr.map(item => {
|
||
if (this.mineInfo[item] != 2) {
|
||
let arr = this.otherList.filter(aitem => {
|
||
return aitem.text === textArr[item].text
|
||
})
|
||
if (arr.length === 0) {
|
||
this.otherList.push(textArr[item].list)
|
||
}
|
||
} else {
|
||
this.otherList.map((aitem, aindex) => {
|
||
if (aitem.text === textArr[item].text) {
|
||
this.otherList.splice(aindex, 1)
|
||
}
|
||
})
|
||
if (item === 'fx_status') {
|
||
let arr = this.otherList.filter(aitem => {
|
||
return aitem.text === '分销中心'
|
||
})
|
||
if (arr.length === 0) {
|
||
this.otherList.unshift(textArr[item].list2)
|
||
}
|
||
}
|
||
}
|
||
})
|
||
this.$util.hideAll()
|
||
},
|
||
initRefresh() {
|
||
this.initIndex(true)
|
||
},
|
||
async getUserProfile() {
|
||
// #ifdef MP-WEIXIN
|
||
uni.getUserProfile({
|
||
desc: '用于完善个人资料',
|
||
success: (res) => {
|
||
console.log(res, "=======res")
|
||
let {
|
||
userInfo = {}
|
||
} = res
|
||
this.getAuthUserProfile(userInfo)
|
||
},
|
||
fail: (res) => {
|
||
console.log(res, "=====fail");
|
||
}
|
||
})
|
||
// #endif
|
||
},
|
||
async toJump(key, index) {
|
||
let {
|
||
url,
|
||
text
|
||
} = this[key][index]
|
||
if (['申请农场主', '申请分销商'].includes(text)) {
|
||
this.toApply(text == '申请农场主' ? 1 : 2)
|
||
return
|
||
}
|
||
this.$util.log(url)
|
||
this.$util.toCheckLogin({
|
||
url
|
||
})
|
||
},
|
||
// 申请农场主/分销商
|
||
async toApply(type) {
|
||
await this.getMineInfo()
|
||
let {
|
||
farmer_status = -1,
|
||
fx_status = -1
|
||
} = this.mineInfo
|
||
let status = type == 1 ? farmer_status : fx_status
|
||
// -1未申请，1审核中，2审核通过，3取消授权，4审核失败
|
||
let url = status == -1 ? type == 1 ? `/farmer/pages/apply` : `/mine/pages/distribution/apply` :
|
||
`/mine/pages/apply-result?type=${type}`
|
||
this.$util.log(url)
|
||
this.$util.toCheckLogin({
|
||
url
|
||
})
|
||
},
|
||
// 切换商家端
|
||
toChange() {
|
||
let {
|
||
user_type
|
||
} = this
|
||
this.user_type = user_type == 1 ? 2 : 1
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.pages-mine {
|
||
|
||
.avatar {
|
||
width: 120rpx;
|
||
height: 120rpx;
|
||
border: 4rpx solid #EFF3FD;
|
||
transform: rotateZ(360deg);
|
||
}
|
||
|
||
.icon-shuaxin,
|
||
.icon-erweima {
|
||
font-size: 40rpx;
|
||
}
|
||
|
||
.member-item {
|
||
width: 150rpx;
|
||
height: 38rpx;
|
||
margin-top: -20rpx;
|
||
padding: 0 2rpx;
|
||
border-radius: 6rpx;
|
||
z-index: 1;
|
||
|
||
|
||
.vip-icon {
|
||
width: 28rpx;
|
||
height: 24rpx;
|
||
transform: scale(0.8);
|
||
}
|
||
|
||
.ellipsis {
|
||
max-width: 120rpx;
|
||
transform: scale(0.8);
|
||
}
|
||
|
||
}
|
||
|
||
.notice-item {
|
||
.iconfont {
|
||
font-size: 46rpx;
|
||
}
|
||
|
||
.fill-warning {
|
||
top: 6rpx;
|
||
right: 6rpx;
|
||
width: 10rpx;
|
||
height: 10rpx;
|
||
}
|
||
}
|
||
|
||
.stored-list {
|
||
|
||
.stored-item {
|
||
width: 33.33%;
|
||
}
|
||
}
|
||
|
||
.mine-count-list {
|
||
.cash-btn {
|
||
width: 138rpx;
|
||
height: 52rpx;
|
||
}
|
||
|
||
.icon-right {
|
||
font-size: 28rpx;
|
||
}
|
||
}
|
||
|
||
|
||
.mine-index-bg {
|
||
background: rgb(57, 181, 74);
|
||
height: 14.625rem;
|
||
width: 100%;
|
||
top: 0;
|
||
border-radius: 0 0 5% 5%;
|
||
z-index: -1;
|
||
}
|
||
|
||
|
||
.mine-menu-list {
|
||
|
||
.cancel-auth {
|
||
width: 110rpx;
|
||
height: 100rpx;
|
||
font-size: 100rpx;
|
||
top: 10rpx;
|
||
right: 20rpx;
|
||
z-index: 1;
|
||
|
||
.text-bold {
|
||
height: 26rpx;
|
||
transform: rotate(-32deg);
|
||
}
|
||
}
|
||
|
||
|
||
.menu-title {
|
||
height: 90rpx;
|
||
|
||
.iconfont {
|
||
font-size: 24rpx;
|
||
}
|
||
}
|
||
|
||
.item-child {
|
||
width: 20%;
|
||
margin: 10rpx 0;
|
||
|
||
.item-img {
|
||
width: 88rpx;
|
||
height: 88rpx;
|
||
margin-bottom: 15rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style>
|