750 lines
20 KiB
Vue
750 lines
20 KiB
Vue
<!--
|
|
* @Descripttion:
|
|
* @version:
|
|
* @Author: kBank
|
|
* @Date: 2022-11-21 15:11:22
|
|
-->
|
|
<template>
|
|
<view class="content">
|
|
<!-- <view class="index_header">
|
|
|
|
</view> -->
|
|
|
|
<view class="context">
|
|
<view class="subTxt">
|
|
<view class="subTxt1">{{'会员信息'}}</view>
|
|
</view>
|
|
<u-form :model="form"
|
|
labelAlign="right"
|
|
labelWidth="75"
|
|
:rules="rules"
|
|
ref="uForm">
|
|
<view class="kuang">
|
|
<u-form-item :label="'会员姓名'"
|
|
prop="memberName">
|
|
<u-input :placeholder="'请输入会员姓名'"
|
|
v-model.trim="form.memberName" />
|
|
</u-form-item>
|
|
<u-form-item :label="'联系方式'"
|
|
prop="phone">
|
|
<u-input :placeholder="'请输入联系方式'" type="number"
|
|
v-model.trim="form.phone" :maxlength="user.pkSettleCountry == 1?11:20" />
|
|
</u-form-item>
|
|
<u-form-item :label="'自然国家'"
|
|
@tap="changeCountry(0)">
|
|
<view class="disFlex justBwn ge">
|
|
<view class="disFlex">
|
|
<img class="countImg"
|
|
:src="form.pkCountryImg"
|
|
alt="">
|
|
<view>{{ form.pkCountryLabel }}</view>
|
|
</view>
|
|
<u-icon name="arrow-down"></u-icon>
|
|
</view>
|
|
</u-form-item>
|
|
<u-form-item :label="'结算国家'">
|
|
<view class="disFlex justBwn ge hui">
|
|
<view class="disFlex">
|
|
<img class="countImg"
|
|
:src="form.pkSettleCountryImg"
|
|
alt="">
|
|
<view>{{ form.pkSettleCountryLabel }}</view>
|
|
</view>
|
|
<u-icon name="arrow-down"></u-icon>
|
|
</view>
|
|
</u-form-item>
|
|
<u-form-item :label="'运输方式'">
|
|
<view class="pickerHui">
|
|
<u-input v-model="form.transTypeVal"
|
|
disabled
|
|
border="none"></u-input>
|
|
<u-icon name="arrow-down"></u-icon>
|
|
</view>
|
|
</u-form-item>
|
|
<u-form-item :label="'发货方式'">
|
|
<view class="pickerHui">
|
|
<u-input v-model="form.deliveryName"
|
|
disabled
|
|
:placeholder="'请选择发货方式'"
|
|
border="none"></u-input>
|
|
<u-icon name="arrow-down"></u-icon>
|
|
</view>
|
|
</u-form-item>
|
|
</view>
|
|
<view class="subTxt">
|
|
<view class="subTxt1">收货人信息</view>
|
|
</view>
|
|
<view class="kuang">
|
|
<view class="disFlex tit_t">
|
|
<view></view>
|
|
<!-- <view class="lan" @click="addAdress">新增收货人地址</view> -->
|
|
</view>
|
|
<u-form-item :label="'收货人'"
|
|
prop="recName">
|
|
<u-input v-model.trim="form.recName"
|
|
:placeholder="'请输入收货人'" />
|
|
</u-form-item>
|
|
<u-form-item :label="'收货电话'"
|
|
prop="recPhone">
|
|
<u-input v-model.trim="form.recPhone" type="number" maxlength="20"
|
|
:placeholder="'请输入收货电话'" />
|
|
</u-form-item>
|
|
<u-form-item :label="'收货地址'"
|
|
prop="diqu"
|
|
@click='getDiqu'>
|
|
<view class="picker">
|
|
<u-input v-model.trim="form.diqu"
|
|
:placeholder="'请选收货地址'"
|
|
border="none"></u-input>
|
|
<u-icon name="arrow-down"></u-icon>
|
|
</view>
|
|
</u-form-item>
|
|
<u-form-item :label="'详细地址'"
|
|
prop="recAddress">
|
|
<u--textarea v-model.trim="form.recAddress"
|
|
maxlength="200"
|
|
:placeholder="'请输入详细地址'"></u--textarea>
|
|
|
|
</u-form-item>
|
|
<u-form-item :label="'邮费'">
|
|
<u-input disabled
|
|
v-model="form.postage" />
|
|
</u-form-item>
|
|
<u-form-item :label="'备注'">
|
|
<u--textarea v-model="form.remark"
|
|
:placeholder="'请输入备注'"></u--textarea>
|
|
</u-form-item>
|
|
</view>
|
|
</u-form>
|
|
<!-- <view class="kuang">
|
|
<view class="kuang_t">
|
|
<view class="kuang_tl">
|
|
<view class="sTit">{{'商品主图'}}</view>
|
|
<img :src="allData.cover1"
|
|
alt="">
|
|
<view class="sTit">{{'商品名称'}}</view>
|
|
<view class="cTit">{{ allData.waresName }}</view>
|
|
</view>
|
|
<view class="kuang_tr">
|
|
<view class="sTit">{{'产品'}}</view>
|
|
<view v-for="item,index in allData.specsSkuParamsList"
|
|
:key="index">
|
|
<view class="cTit">
|
|
{{ item.productName }}{{ item.specsName }}*{{ item.quantity }}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="kuang_t">
|
|
<view class="kuang_tl">
|
|
<view class="sTit">{{'商品价格'}}(￥)</view>
|
|
<view class="cTit">{{ allData.waresPrice | numberToCurrency }}</view>
|
|
</view>
|
|
<view class="kuang_tr">
|
|
<view class="sTit">{{'商品数量'}}</view>
|
|
<view class="cTit">{{ allData.quantity }}</view>
|
|
</view>
|
|
</view>
|
|
</view> -->
|
|
<view class="subTxt">
|
|
<view class="subTxt1">商品信息</view>
|
|
</view>
|
|
<view class="goodList">
|
|
<view class="goodList_i">
|
|
<view class="goodList_it">
|
|
<img :src="allData.cover1"
|
|
class="cover"
|
|
alt="">
|
|
<view class="goodList_ir">
|
|
<view class="goodList_ib">
|
|
<view class="tit1">
|
|
{{ allData.waresName }}
|
|
</view>
|
|
<view class="tit5">
|
|
x{{ allData.quantity }}
|
|
</view>
|
|
</view>
|
|
<view class="goodList_ib">
|
|
<view class="tit2">
|
|
￥{{ allData.waresPrice | numberToCurrency }}
|
|
</view>
|
|
<!-- <view class="tit3">PV: {{ item.achieve | numberToCurrency | isLocal}}</view> -->
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view v-for="(item,sndex) in allData.specsSkuParamsList"
|
|
:key="sndex"
|
|
class="product_i">
|
|
<img :src="item.cover"
|
|
alt="">
|
|
<view class="product_il">
|
|
<view class="tit4">{{ item.productName }} {{ item.specsName }}</view>
|
|
<view class="tit5">x{{ item.quantity }}</view>
|
|
</view>
|
|
</view>
|
|
<view class="fen">
|
|
<!-- <view class="disFlex justBwn">
|
|
<view class="tit3">{{'商品业绩'}}(PV)</view>
|
|
<view class="tit1">{{ item.achieveAmount | numberToCurrency}}</view>
|
|
</view> -->
|
|
<view class="disFlex justBwn">
|
|
<view class="tit3">{{'金额小计'}}</view>
|
|
<view class="tit1">{{ allData.waresPrice | numberToCurrency}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<view class="kuang disFlex">
|
|
<u-checkbox-group v-model="agreementShow"
|
|
shape="circle"
|
|
activeColor="#005BAC"
|
|
@change="checkboxChange">
|
|
<u-checkbox :name="1">
|
|
</u-checkbox>
|
|
</u-checkbox-group>
|
|
<view class="tit3">{{'请阅读并同意'}}</view>
|
|
<view class="tit2"
|
|
@click="toAgree"> 《{{'购买协议'}}》</view>
|
|
</view>
|
|
</view>
|
|
<!-- 占空 -->
|
|
<view style="height:150rpx"></view>
|
|
<!-- 底部 -->
|
|
<view class="footer_f">
|
|
<view class="footer">
|
|
<view class="footer_l">
|
|
<view class="disFlex">
|
|
<view class="h1">{{'总价'}}</view>
|
|
<view class="r1">¥{{ allData.waresPrice | numberToCurrency}}</view>
|
|
</view>
|
|
<!-- <view class="disFlex">
|
|
<view class="h1">{{'业绩'}}</view>
|
|
<view class="l1">¥{{ achiveAmount | numberToCurrency}}</view>
|
|
</view> -->
|
|
</view>
|
|
<view class="footer_r">
|
|
<u-button type="success"
|
|
class="uBtn"
|
|
shape="circle"
|
|
:loading="isLoading"
|
|
:loadingText="'购买中'"
|
|
@tap="goBuy"
|
|
color="linear-gradient(to right, #005BAC, #005BAC )">{{'立即购买'}} </u-button>
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 选择国家 -->
|
|
<u-picker :show="isCountry"
|
|
@cancel='isCountry=false'
|
|
@confirm="sureCountry"
|
|
:columns="countryList"
|
|
keyName="label"></u-picker>
|
|
<agreement ref="agreement"></agreement>
|
|
<v-address ref="address"
|
|
:defaultCode="defaultCode"
|
|
@addressData="addressData"></v-address>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import address from '@/components/address.vue'
|
|
import * as api from '@/config/goods'
|
|
import * as regiest from '@/config/regiest'
|
|
|
|
import agreement from '@/components/agreement.vue'
|
|
export default {
|
|
components: {
|
|
'v-address': address,
|
|
agreement,
|
|
},
|
|
data() {
|
|
return {
|
|
specialArea: 7,
|
|
isCountry: false,
|
|
defaultCode: [],
|
|
form: {
|
|
deliveryName: '快递发货',
|
|
deliveryWay: 1,
|
|
postage: 0,
|
|
transType: 1,
|
|
transTypeVal: '陆运',
|
|
pkSettleCountry: '',
|
|
pkSettleCountryLabel: '',
|
|
pkSettleCountryImg: '',
|
|
pkCountry: '',
|
|
pkCountryLabel: '',
|
|
pkCountryImg: '',
|
|
},
|
|
deliList: [],
|
|
diqu: '',
|
|
allData: [],
|
|
goodsNum: 1,
|
|
agreementShow: [],
|
|
priceAmount: 0, //商品总价
|
|
achiveAmount: 0, //总业绩
|
|
totalMont: 0,
|
|
waresList: [],
|
|
isLoading: false,
|
|
centerCodeId: '',
|
|
rules: {
|
|
memberName: [
|
|
{
|
|
required: true,
|
|
message: '请输入会员姓名',
|
|
trigger: ['blur'],
|
|
},
|
|
],
|
|
phone: [{ validator: this.phonePass, trigger: ['blur'] }],
|
|
recName: [
|
|
{
|
|
required: true,
|
|
message: '请输入收货人',
|
|
trigger: ['change', 'blur'],
|
|
},
|
|
],
|
|
recPhone: [
|
|
{
|
|
required: true,
|
|
message: '请输入收货电话',
|
|
trigger: ['change', 'blur'],
|
|
},
|
|
{
|
|
min: 6,
|
|
message: '请输入正确联系电话',
|
|
trigger: 'blur'
|
|
},
|
|
{
|
|
max: 20,
|
|
message:'请输入正确联系电话',
|
|
trigger: 'blur'
|
|
},
|
|
],
|
|
diqu: [
|
|
{
|
|
required: true,
|
|
message: '请选择收货地址',
|
|
trigger: ['change', 'blur'],
|
|
},
|
|
],
|
|
recAddress: [
|
|
{
|
|
required: true,
|
|
message: '请输入详细地址',
|
|
trigger: ['change', 'blur'],
|
|
},
|
|
],
|
|
},
|
|
countryList: [],
|
|
placeParent:'',
|
|
user:''
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
this.user = uni.getStorageSync('User')
|
|
this.centerCodeId = this.user.memberCode
|
|
this.pkCountry = 1
|
|
this.allData = JSON.parse(options.allData)
|
|
console.log('%c [ this.allData ]-336', 'font-size:13px; background:#f67b85; color:#ffbfc9;', this.allData)
|
|
this.placeParent = uni.getStorageSync('placeParent')
|
|
this.allData.quantity = 1
|
|
this.setGoodlistType()
|
|
this.getGenerate()
|
|
this.getCountry()
|
|
// 发货方式
|
|
// this.getDeliveryList()
|
|
},
|
|
onShow() {},
|
|
methods: {
|
|
phonePass(rule, value, callback) {
|
|
if (!value) {
|
|
callback(new Error('请输入联系电话'))
|
|
return false
|
|
}
|
|
if(value.length<6||value.length>20){
|
|
callback(new Error('请输入正确联系方式'))
|
|
return false
|
|
}else{
|
|
regiest
|
|
.validPhone({
|
|
memberName: this.form.memberName,
|
|
phone: this.form.phone,
|
|
placeParent: this.placeParent,
|
|
})
|
|
.then((res) => {
|
|
if (res.code == 200) {
|
|
callback()
|
|
} else {
|
|
callback(new Error(res.msg))
|
|
}
|
|
})
|
|
}
|
|
|
|
},
|
|
getCountry() {
|
|
regiest.countryList().then((res) => {
|
|
let data = res.data.map((item) => {
|
|
return {
|
|
img: item.nationalFlag2,
|
|
id: item.pkId,
|
|
label: item.shortName,
|
|
}
|
|
})
|
|
this.countryList = [data]
|
|
this.countryList[0].forEach((item) => {
|
|
if (item.id == this.pkCountry) {
|
|
this.form.pkSettleCountry = item.id
|
|
this.form.pkSettleCountryLabel = item.label
|
|
this.form.pkSettleCountryImg = item.img
|
|
this.form.pkCountry = item.id
|
|
this.form.pkCountryLabel = item.label
|
|
this.form.pkCountryImg = item.img
|
|
}
|
|
// if (item.id == this.userInfo.pkCountry) {
|
|
// this.form.pkCountry = item.id
|
|
// this.form.pkCountryLabel = item.label
|
|
// this.form.pkCountryImg = item.img
|
|
// }
|
|
})
|
|
})
|
|
},
|
|
changeCountry(index) {
|
|
this.isCountry = true
|
|
this.countryIndex = index
|
|
},
|
|
sureCountry(e) {
|
|
console.log('%c [ e ]-418', 'font-size:13px; background:#b131b9; color:#f575fd;', e)
|
|
const { value } = e
|
|
this.form.pkCountry = value[0].id
|
|
this.form.pkCountryLabel = value[0].label
|
|
this.form.pkCountryImg = value[0].img
|
|
this.isCountry = false
|
|
},
|
|
// addAdress() {
|
|
// uni.navigateTo({
|
|
// url: '/pages/address/index',
|
|
// })
|
|
// },
|
|
toAgree() {
|
|
// agreeMent
|
|
this.$refs.agreement.openDig()
|
|
},
|
|
getGenerate() {
|
|
api.generate().then((res) => {
|
|
uni.setStorageSync('mToken', res.msg)
|
|
})
|
|
},
|
|
goBuy() {
|
|
this.$refs.uForm.validate().then((res) => {
|
|
if (this.agreementShow.length == 0) {
|
|
uni.showToast({
|
|
title: '请阅读并同意购买协议',
|
|
icon: 'none',
|
|
duration: 1500,
|
|
})
|
|
return
|
|
}
|
|
this.isLoading = true
|
|
api
|
|
.fansConfirm(
|
|
Object.assign({}, this.form, {
|
|
waresList: this.waresList,
|
|
})
|
|
)
|
|
.then((res) => {
|
|
this.isLoading = false
|
|
if (res.code == 200) {
|
|
uni.navigateTo({
|
|
url: '/pages/pay/hiPay?paramsPost=' + JSON.stringify(res.data),
|
|
})
|
|
}
|
|
})
|
|
})
|
|
},
|
|
setGoodlistType() {
|
|
let carList = {
|
|
quantity: 1,
|
|
pkWares: this.allData.pkId,
|
|
skuList: [],
|
|
}
|
|
this.allData.specsSkuParamsList.forEach((item) => {
|
|
carList.skuList.push({
|
|
pkWaresSku: item.pkWaresSpecsSku,
|
|
quantity: item.quantity,
|
|
})
|
|
})
|
|
this.waresList = [carList]
|
|
},
|
|
checkboxChange() {},
|
|
getDiqu() {
|
|
this.$refs.address.setShow()
|
|
},
|
|
confirmPopup() {},
|
|
addressData(diqu, obj) {
|
|
this.form.diqu = diqu
|
|
this.form.recProvince = obj.province
|
|
this.form.recCity = obj.city
|
|
this.form.recCounty = obj.county
|
|
this.$forceUpdate()
|
|
// this.setGoodlistType()
|
|
// this.queryAdressPostage()
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.content {
|
|
background: #f9f9f9;
|
|
}
|
|
.index_header {
|
|
background: #f9f9f9;
|
|
height: 330rpx;
|
|
}
|
|
.context {
|
|
position: relative;
|
|
// padding: 24rpx;
|
|
// margin-top: -360rpx;
|
|
}
|
|
.disFlex {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.just {
|
|
justify-content: space-between;
|
|
font-size: 12px;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
margin-bottom: 10rpx;
|
|
}
|
|
.kuang {
|
|
// margin-top: 20rpx;
|
|
padding: 20rpx 40rpx;
|
|
background: #fff;
|
|
// box-shadow: 0px 2px 10px 0px rgba(204, 204, 204, 0.5);
|
|
// border-radius: 10px 10px 10px 10px;
|
|
.tit_t {
|
|
justify-content: space-between;
|
|
font-size: 14px;
|
|
font-family: PingFang SC-Semibold, PingFang SC;
|
|
font-weight: 600;
|
|
color: #333333;
|
|
}
|
|
.lan {
|
|
font-size: 10px;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #289fff;
|
|
}
|
|
}
|
|
.picker {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
width: 100%;
|
|
border-width: 0.5px !important;
|
|
border-color: #dadbde !important;
|
|
border-style: solid;
|
|
border-radius: 4px;
|
|
padding: 6px 9px;
|
|
}
|
|
.pickerHui {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
width: 100%;
|
|
border-width: 0.5px !important;
|
|
border-color: #dadbde !important;
|
|
border-style: solid;
|
|
border-radius: 4px;
|
|
padding: 6px 9px;
|
|
background: #f5f7fa;
|
|
}
|
|
.kuang_t {
|
|
display: flex;
|
|
.kuang_tl {
|
|
flex: 1;
|
|
img {
|
|
width: 40px;
|
|
height: 40px;
|
|
border-radius: 6px 6px 6px 6px;
|
|
}
|
|
}
|
|
.kuang_tr {
|
|
flex: 1;
|
|
}
|
|
}
|
|
.sTit {
|
|
font-size: 12px;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #999999;
|
|
margin: 14rpx 0;
|
|
}
|
|
.cTit {
|
|
font-size: 13px;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
|
|
margin-bottom: 14rpx;
|
|
}
|
|
.footer_f {
|
|
position: fixed;
|
|
bottom: 0;
|
|
width: 100%;
|
|
z-index: 10;
|
|
box-shadow: 0px -2px 20px 0px rgba(204, 204, 204, 0.5);
|
|
}
|
|
.footer {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
padding: 20rpx 24rpx 40rpx 20rpx;
|
|
background: #fff;
|
|
.footer_l {
|
|
}
|
|
.footer_r {
|
|
// flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 20rpx;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
}
|
|
}
|
|
.h1 {
|
|
font-size: 10px;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
margin-right: 20rpx;
|
|
}
|
|
.r1 {
|
|
font-size: 18px;
|
|
font-family: PingFang SC-Semibold, PingFang SC;
|
|
font-weight: 600;
|
|
color: #ed4623;
|
|
}
|
|
.l1 {
|
|
font-size: 16px;
|
|
font-family: PingFang SC-Semibold, PingFang SC;
|
|
font-weight: 600;
|
|
color: #384a8a;
|
|
}
|
|
.tit2 {
|
|
font-size: 26rpx;
|
|
font-family: Source Han Sans CN;
|
|
font-weight: bold;
|
|
color: #005BAC;
|
|
}
|
|
.tit3 {
|
|
font-size: 26rpx;
|
|
font-family: Source Han Sans CN;
|
|
font-weight: 400;
|
|
color: #333;
|
|
}
|
|
.justBwn {
|
|
width: 100%;
|
|
justify-content: space-between;
|
|
}
|
|
.countImg {
|
|
width: 62rpx;
|
|
height: 41rpx;
|
|
margin-right: 20rpx;
|
|
}
|
|
.ge {
|
|
padding: 6px 9px;
|
|
border: 0.5px solid #dadbde;
|
|
border-radius: 4px;
|
|
font-size: 16px;
|
|
}
|
|
.hui {
|
|
background: #f5f7fa;
|
|
}
|
|
.subTxt {
|
|
background: #005BAC;
|
|
font-size: 28rpx;
|
|
font-family: Source Han Sans CN;
|
|
font-weight: bold;
|
|
color: #fff;
|
|
padding: 35rpx 27rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
.subTxt1 {
|
|
border-left: 4px solid #fff;
|
|
padding: 0 20rpx;
|
|
}
|
|
.subTxt2 {
|
|
display: flex;
|
|
align-items: center;
|
|
view {
|
|
margin-left: 20rpx;
|
|
}
|
|
}
|
|
}
|
|
.goodList {
|
|
display: flex;
|
|
padding: 20rpx;
|
|
border-bottom: 1px solid #eee;
|
|
background: #fff;
|
|
}
|
|
.cover {
|
|
width: 136rpx;
|
|
height: 136rpx;
|
|
background: #ffffff;
|
|
border: 1px solid #eeeeee;
|
|
border-radius: 10rpx;
|
|
}
|
|
.goodList_i {
|
|
flex: 1;
|
|
}
|
|
.goodList_it {
|
|
display: flex;
|
|
padding: 0rpx 0 20rpx 0rpx;
|
|
|
|
.goodList_ir {
|
|
margin-left: 20rpx;
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
.goodList_ib {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
img {
|
|
width: 56rpx;
|
|
height: 56rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.product_i {
|
|
display: flex;
|
|
align-items: center;
|
|
background: #F6F6F6;
|
|
padding: 28rpx;
|
|
.product_il {
|
|
display: flex;
|
|
align-items: center;
|
|
flex: 1;
|
|
justify-content: space-between;
|
|
margin-left: 20rpx;
|
|
}
|
|
img {
|
|
width: 50rpx;
|
|
height: 50rpx;
|
|
background: #ffffff;
|
|
border: 1px solid #dddddd;
|
|
border-radius: 10rpx;
|
|
}
|
|
}
|
|
.fen {
|
|
background: #F6F6F6;
|
|
padding: 0 28rpx 28rpx 28rpx;
|
|
}
|
|
</style>
|