You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1492 lines
42 KiB
1492 lines
42 KiB
<template> |
|
<view class="container"> |
|
<!-- <page-meta :root-font-size="fontsize+'px'"></page-meta> --> <!--动态设置html字体大小--> |
|
<view class="content_box"> |
|
<view class="top_box"> |
|
<view class="title_box"> |
|
当前报名单：<span style="color:#D73232">报名单{{currentNum}}</span> |
|
</view> |
|
<view class="turn_box"> |
|
<p class="turn_item prev" @click="handlePrev" v-if="currentNum > 1">上一页</p> |
|
<p class="turn_item next" @click="handleNext" v-if="currentNum < orderNum" >下一页</p> |
|
</view> |
|
</view> |
|
<view class="rele_content"> |
|
<view class="form_box"> |
|
<view class="top_header"> |
|
<img class="top_img" :src="imgPrefix + 'top.png'" alt=""> |
|
</view> |
|
<view class="top_content"> |
|
<view class="title"> |
|
枕头定制信息表 |
|
</view> |
|
<view class="content"> |
|
<p style="font-size: 28rpx;">不满意一直换，直到满意为止。</p> |
|
<p style="font-size: 28rpx;"> |
|
<span style="color: hsl(354,74%,57%);margin-right: 10rpx;">统一定制价格：699元</span> |
|
包邮到家 |
|
</p> |
|
<p style="font-size: 28rpx;">如需定制请点击表格右下方小电话，长按二维码添加微信沟通付款。</p> |
|
<p style="font-size: 28rpx;">最终解释权归青岛易旅家居科技有限公司所有。</p> |
|
</view> |
|
</view> |
|
<view class="form_content"> |
|
<uni-forms ref="valiForm" :model="valiFormData" labelWidth="180px" validate-trigger="bind" |
|
label-position="top"> |
|
<uni-forms-item label="姓名" required name="username" :label-style="{'font-size':'40rpx'}"> |
|
<uni-easyinput :disabled="isDisabled" v-model="valiFormData.username" |
|
placeholder="请输入姓名" /> |
|
</uni-forms-item> |
|
<uni-forms-item label="手机" required name="phone"> |
|
<uni-easyinput type="digit" :disabled="isDisabled" v-model="valiFormData.phone" |
|
placeholder="请输入手机" /> |
|
</uni-forms-item> |
|
<!-- <uni-forms-item label="地址" required name="address"> |
|
<uni-data-picker v-model="valiFormData.city" :localdata="aCityData" popup-title="选择城市"> |
|
</uni-data-picker> |
|
<view class=""> |
|
<button class="button" type="primary" @click="toggle('bottom')"><text class="button-text">顶部</text></button> |
|
</view> |
|
|
|
<picker class="picker_box" :range="locationArr" @change="cityChange" mode="multiSelector" |
|
@columnchange="columnchange" :value="multiIndex"> |
|
<view class="city_box" v-if="province !== '' && city !== ''"> |
|
{{province}} / {{city}} {{district ? '/' : ''}} {{district}} |
|
</view> |
|
<view class="city_box" v-if="province == '' && city == '' && district == ''"> |
|
<span style="color: #999;">请选择地区</span> |
|
</view> |
|
</picker> |
|
<uni-easyinput class="address_item" v-model="valiFormData.address" placeholder="详细地址" /> |
|
</uni-forms-item> --> |
|
<uni-forms-item label="身高" required name="height"> |
|
<p class="item_txt">单位：厘米cm</p> |
|
<uni-easyinput type="digit" :disabled="isDisabled" v-model="valiFormData.height" |
|
placeholder="请输入身高" /> |
|
</uni-forms-item> |
|
<uni-forms-item label="体重" required name="weight"> |
|
<p class="item_txt">单位：公斤kg</p> |
|
<uni-easyinput type="digit" :disabled="isDisabled" v-model="valiFormData.weight" |
|
placeholder="请输入体重" /> |
|
</uni-forms-item> |
|
<uni-forms-item label="肩颈宽度" name="neckShoulderWidth"> |
|
<p class="item_txt">单位：厘米cm</p> |
|
<uni-easyinput type="digit" :disabled="isDisabled" v-model="valiFormData.neckShoulderWidth" |
|
placeholder="请输入肩颈宽度" /> |
|
</uni-forms-item> |
|
<uni-forms-item label="颈肩宽度示意图"> |
|
<view class="wid_pre"> |
|
<img class="wid_img" :src="imgPrefix + 'jian.png'" alt=""> |
|
<view class="img_tit"> |
|
颈肩宽度 |
|
</view> |
|
<!-- <uni-data-checkbox :disabled="isDisabled" v-model="valiFormData.width" |
|
:localdata="widthData" /> --> |
|
</view> |
|
</uni-forms-item> |
|
<uni-forms-item label="颈长" name="neckLength"> |
|
<p class="item_txt">单位：厘米cm</p> |
|
<uni-easyinput type="digit" :disabled="isDisabled" v-model="valiFormData.neckLength" |
|
placeholder="请输入颈长" /> |
|
</uni-forms-item> |
|
<uni-forms-item label="颈长示意图"> |
|
<view class="hei_pre"> |
|
<img class="hei_img" :src="imgPrefix + 'length.jpg'" alt=""> |
|
<view class="img_tit"> |
|
颈椎长度 |
|
</view> |
|
<!-- <uni-data-checkbox v-model="valiFormData.length" :localdata="lengthData" /> --> |
|
</view> |
|
</uni-forms-item> |
|
<uni-forms-item label="年龄"> |
|
<uni-data-checkbox :disabled="isDisabled" v-model="valiFormData.ageRange" |
|
:localdata="ageData" /> |
|
</uni-forms-item> |
|
<uni-forms-item label="您每晚的睡眠时间"> |
|
<uni-data-checkbox :disabled="isDisabled" v-model="valiFormData.sleepLength" |
|
:localdata="sleepData" /> |
|
</uni-forms-item> |
|
<uni-forms-item label="您习惯的睡眠姿势" required name="sleepingPosture"> |
|
<view class="pos_box"> |
|
<view class="pos_pre"> |
|
<img class="hei_img" :src="imgPrefix + 'yang.jpg'" alt=""> |
|
<uni-data-checkbox :disabled="isDisabled" v-model="valiFormData.sleepingPosture" |
|
:localdata="sleepPosData" /> |
|
</view> |
|
<view class="pos_pre"> |
|
<img class="hei_img" :src="imgPrefix + 'ce.jpg'" alt=""> |
|
<uni-data-checkbox :disabled="isDisabled" v-model="valiFormData.sleepingPosture" |
|
:localdata="sleepPosData1" /> |
|
</view> |
|
</view> |
|
|
|
</uni-forms-item> |
|
<uni-forms-item label="您习惯的枕头软硬度" required name="pillowHardness"> |
|
<uni-data-checkbox :disabled="isDisabled" v-model="valiFormData.pillowHardness" |
|
:localdata="posData" /> |
|
</uni-forms-item> |
|
<uni-forms-item label="您喜欢的枕头类型" required name="pillowMaterial"> |
|
<uni-data-checkbox :disabled="isDisabled" v-model="valiFormData.pillowMaterial" |
|
:localdata="matData" /> |
|
</uni-forms-item> |
|
<uni-forms-item label="您现在的颈椎出现问题了吗"> |
|
<uni-data-checkbox :disabled="isDisabled" v-model="valiFormData.cervicalVertebra" |
|
:localdata="cerData" /> |
|
</uni-forms-item> |
|
<uni-forms-item label="您的其他需求"> |
|
<uni-easyinput :disabled="isDisabled" type="textarea" |
|
v-model="valiFormData.otherNeed" /> |
|
</uni-forms-item> |
|
</uni-forms> |
|
|
|
<!-- <uni-popup ref="popup" background-color="#fff" @change="change"> |
|
<picker :range="locationArr" @change="cityChange" mode="multiSelector" @columnchange="columnchange" |
|
:value="multiIndex"> |
|
<view class="city_box" v-if="province !== '' && city !== ''"> |
|
{{province}} / {{city}} {{district ? '/' : ''}} {{district}} |
|
</view> |
|
<view class="city_box" v-if="province == '' && city == '' && district == ''"> |
|
<span style="color: #999;">请选择地区</span> |
|
</view> |
|
</picker> |
|
</uni-popup> --> |
|
</view> |
|
</view> |
|
<view class="footer"> |
|
<!-- <a href="#page_privacy_modal" data-toggle="modal">《隐私协议》</a> --> |
|
<span>提交即授权该表单收集你的填写信息</span> |
|
</view> |
|
<!-- <view class="mask_box" v-if="isShowCode"></view> --> |
|
<view class="phone_box" @click="clickPhone" v-if="widthScreen <= 500"> |
|
<uni-icons type="phone" size="30" color="#2eaadd"></uni-icons> |
|
</view> |
|
<view class="code_box" v-if="isShowCode" > |
|
<span style="color: #333;font-size: 28rpx;margin-bottom: 12rpx;">扫码添加</span> |
|
<image :show-menu-by-longpress="true" class="code_img" :src="imgPrefix + 'add.png'" alt=""></image> |
|
</view> |
|
<view class="link_box" v-if="widthScreen > 750" @click="isShowLink = !isShowLink"> |
|
<uni-icons type="phone" size="20" color="#2eaadd"></uni-icons> |
|
联系我们 |
|
</view> |
|
<view class="add_item" v-if="isShowLink"> |
|
<span style="color: #333;font-size: 28rpx;margin-bottom: 12rpx;">扫码添加</span> |
|
<img :show-menu-by-longpress="true" class="code_img" :src="imgPrefix + 'add.jpg'" alt=""> |
|
</view> |
|
</view> |
|
|
|
|
|
</view> |
|
<view class="bottom_con"> |
|
<p class="btn_box" @click="jumpOver">跳过</p> |
|
<p class="btn_box" :class="isDisabled ? 'dis_btn' : ''" @click="submit('valiForm')">提交</p> |
|
</view> |
|
</view> |
|
</template> |
|
<script> |
|
import aCityData from "../../../util/city.json"; |
|
import allCityData from "../../../util/all_city.json" |
|
const NET = require('@/util/request') |
|
const API = require('@/config/api') |
|
|
|
export default { |
|
data() { |
|
return { |
|
phoneNumber: '', |
|
imgPrefix: getApp().globalData.imgPrefix, |
|
isShowLink: false, |
|
fontsize: 12, |
|
// 校验表单数据 |
|
valiFormData: {}, |
|
isShowCode: false, |
|
aCityData, |
|
allCityData, |
|
userArea: '', |
|
province: '', |
|
city: '', |
|
district: '', |
|
widthScreen: '', |
|
locationIndex: 0, |
|
locationArr: [ |
|
[], |
|
[], |
|
[] |
|
], |
|
multiIndex: [0, 0, 0], |
|
select: '', |
|
rules: { |
|
username: { |
|
rules: [{ |
|
required: true, |
|
errorMessage: '姓名不能为空' |
|
}] |
|
}, |
|
phone: { |
|
rules: [{ |
|
required: true, |
|
errorMessage: '手机号不能为空' |
|
}, { |
|
validateFunction: function(rule, value, data, callback) { |
|
const moblie = /^1(3|4|5|6|7|8|9)\d{9}$/; |
|
if (!moblie.test(value)) { |
|
callback('请填写正确的手机号格式'); |
|
} else { |
|
return true; |
|
} |
|
} |
|
}] |
|
}, |
|
// address: { |
|
// rules: [{ |
|
// required: true, |
|
// errorMessage: '地址不能为空' |
|
// }] |
|
// }, |
|
height: { |
|
rules: [{ |
|
required: true, |
|
errorMessage: '身高不能为空' |
|
}, |
|
{ |
|
validateFunction: function(rule, value, data, callback) { |
|
// const moblie = /^(0{1}|[1-9]\d{0,3}|.{0})$/; |
|
const moblie = /^(\[1-9]|([1-9]\d+))(\.\d{0})?$/ |
|
if (!moblie.test(value)) { |
|
callback('身高应为大于10的整数'); |
|
} else { |
|
return true; |
|
} |
|
} |
|
} |
|
] |
|
}, |
|
weight: { |
|
rules: [{ |
|
required: true, |
|
errorMessage: '体重不能为空' |
|
}, |
|
{ |
|
validateFunction: function(rule, value, data, callback) { |
|
const moblie = /^(\[1-9]|([1-9]\d+))(\.\d{1,2})?$/; |
|
if (!moblie.test(value)) { |
|
callback('体重应大于10斤且小数点最多为两位'); |
|
} else { |
|
return true; |
|
} |
|
} |
|
} |
|
] |
|
}, |
|
neckShoulderWidth:{ |
|
rules:[{ |
|
validateFunction: function(rule, value, data, callback) { |
|
// const moblie = /^(\[1-9]|([1-9]\d+))(\.\d{1,2})?$/; |
|
const moblie = /^(\d|([1-9]\d+))(\.\d{1,2})?$/; |
|
if (!moblie.test(value)) { |
|
callback('请填写正确的肩颈宽度'); |
|
} else { |
|
return true; |
|
} |
|
} |
|
}] |
|
}, |
|
neckLength:{ |
|
rules:[{ |
|
validateFunction: function(rule, value, data, callback) { |
|
const moblie = /^(\d|([1-9]\d+))(\.\d{1,2})?$/; |
|
if (!moblie.test(value)) { |
|
callback('请填写正确的颈椎长度'); |
|
} else { |
|
return true; |
|
} |
|
} |
|
}] |
|
}, |
|
pillowHardness: { |
|
rules: [{ |
|
required: true, |
|
errorMessage: '请选择枕头软硬度' |
|
}] |
|
}, |
|
pillowMaterial: { |
|
rules: [{ |
|
required: true, |
|
errorMessage: '请选择枕头类型' |
|
}] |
|
}, |
|
sleepingPosture: { |
|
rules: [{ |
|
required: true, |
|
errorMessage: '请选择睡眠姿势' |
|
}] |
|
}, |
|
|
|
}, |
|
lengthData: [{ |
|
text: '颈椎长度', |
|
value: '1' |
|
}], |
|
widthData: [{ |
|
text: '颈肩宽度', |
|
value: '1' |
|
}], |
|
// 年龄数据源 |
|
ageData: [{ |
|
text: '18~30', |
|
value: '18~30' |
|
}, { |
|
text: '31~50', |
|
value: '31~50' |
|
}, { |
|
text: '51~60', |
|
value: '51~60' |
|
}, { |
|
text: '60以上', |
|
value: '60以上' |
|
}], |
|
//睡眠范围 |
|
sleepData: [{ |
|
text: '2~4小时', |
|
value: '2~4小时' |
|
}, { |
|
text: '4~6小时', |
|
value: '4~6小时' |
|
}, { |
|
text: '6~8小时', |
|
value: '6~8小时' |
|
}, { |
|
text: '8小时以上', |
|
value: '8小时以上' |
|
}], |
|
// 枕头软硬度 |
|
posData: [{ |
|
text: '偏硬', |
|
value: 1 |
|
}, { |
|
text: '适中', |
|
value: 2 |
|
}, { |
|
text: '偏软', |
|
value: 3 |
|
}], |
|
// 枕头材质 |
|
matData: [{ |
|
text: '羽丝绒枕', |
|
value: 1 |
|
}, |
|
{ |
|
text: '草本植物枕(荞麦、决明子等)', |
|
value: 2 |
|
}, |
|
{ |
|
text: '乳胶枕', |
|
value: 3 |
|
}, |
|
{ |
|
text: '慢回弹记忆枕', |
|
value: 4 |
|
}, |
|
{ |
|
text: '软管枕', |
|
value: 5 |
|
}, |
|
{ |
|
text: '其他', |
|
value: 6 |
|
}, |
|
], |
|
cerData: [{ |
|
text: "是", |
|
value: 1 |
|
}, |
|
{ |
|
text: "否", |
|
value: 0 |
|
}, |
|
], |
|
sleepPosData: [{ |
|
text: '仰睡', |
|
value: 1 |
|
}, |
|
|
|
], |
|
sleepPosData1: [{ |
|
text: '侧睡', |
|
value: 2 |
|
}, ], |
|
isDisabled: false, |
|
orderNo: '', |
|
orderNum: '', |
|
orderData: [], |
|
currentNum: null, |
|
pageFrom: '', |
|
formData: [], |
|
alreadyForm:{},//下一页表单已经填写的内容 |
|
} |
|
}, |
|
onShow() {}, |
|
onReady(){ |
|
this.$refs.valiForm.setRules(this.rules) |
|
}, |
|
onLoad(options) { |
|
// let srceenNunber=15; //因设计图是1920所有把设计图分为19.2份，所以html字体大小为100px |
|
let that = this; |
|
|
|
// //窗体改变大小触发事件 |
|
// uni.onWindowResize((res) => { |
|
// console.log('变化后的窗口宽度=' ,res.size.windowWidth); |
|
// that.fontsize=parseFloat(res.size.windowWidth)/srceenNunber; |
|
// }) |
|
|
|
// //打开获取屏幕大小 |
|
// uni.getSystemInfo({ |
|
// success(res) { |
|
// console.log('设备信息：',res); |
|
// that.fontsize=res.screenWidth/srceenNunber; |
|
// console.log('字体大小：',that.fontsize); |
|
// } |
|
// }) |
|
const res = uni.getSystemInfoSync(); |
|
that.widthScreen = res.screenWidth |
|
if (res.screenWidth < 750) { |
|
that.fontsize = 100 * (res.screenWidth / 750) |
|
} else if (res.screenWidth > 750 && res.screenWidth == 1920) { |
|
that.fontsize = 100 * (res.screenWidth / 3840) |
|
}; |
|
// console.log(this.a) |
|
this.getData() |
|
this.orderNo = options.orderNo |
|
this.orderNum = options.orderNum |
|
this.pageFrom = options.pageFrom |
|
|
|
// if(options.pageFrom == 'order'){ |
|
// this.phoneNumber = options.phone |
|
// // this.getInfo() |
|
// } |
|
this.getOrderInfo() |
|
// this.getCurrentArea('北京市') |
|
}, |
|
methods: { |
|
// 根据订单号获取已填写的订单信息 |
|
getOrderInfo(type) { |
|
uni.request({ |
|
url: getApp().globalData.baseUrl + '/blade-desk/custom-made-info/list-by-order-no?orderNo=' + |
|
this.orderNo, |
|
method: 'GET', |
|
header: { |
|
'Blade-Auth': 'bearer ' + uni.getStorageSync('token') |
|
}, |
|
success: (res) => { |
|
if (res.data.code == 200) { |
|
this.orderData = res.data.data; |
|
if(this.orderData.length == 0){ |
|
this.valiFormData = { |
|
phone:JSON.parse(uni.getStorageSync('userInfo')).phone, |
|
} |
|
}else{ |
|
this.valiFormData =JSON.parse(JSON.stringify(this.orderData[this.orderData.length - 1])) |
|
this.valiFormData.id = '' |
|
this.valiFormData.neckShoulderWidth = this.valiFormData |
|
.neckShoulderWidth == -1 ? '' : this.valiFormData.neckShoulderWidth; |
|
this.valiFormData.neckLength = this.valiFormData.neckLength == -1 ? '' : |
|
this.valiFormData.neckLength; |
|
this.valiFormData.ageRange = this.valiFormData.ageRange == -1 ? '' : this |
|
.valiFormData.ageRange; |
|
this.valiFormData.sleepLength = this.valiFormData.sleepLength == -1 ? '' : |
|
this.valiFormData.sleepLength; |
|
this.valiFormData.cervicalVertebra = this.valiFormData.cervicalVertebra == |
|
-1 ? '' : this.valiFormData.cervicalVertebra; |
|
this.valiFormData.otherNeed = this.valiFormData.otherNeed == -1 ? '' : this |
|
.valiFormData.otherNeed; |
|
} |
|
if (type == 'save') { |
|
if (this.orderData.length == this.orderNum) { |
|
if (this.pageFrom == 'order') { |
|
uni.navigateBack({ |
|
url: "/pages/pages_zhentou/order/order" |
|
}) |
|
} else { |
|
uni.redirectTo({ |
|
url: "/pages/pages_zhentou/order/order" |
|
}) |
|
} |
|
|
|
} else { |
|
this.currentNum = this.orderData.length + 1; |
|
} |
|
} else { |
|
if (this.orderData.length == this.orderNum) { |
|
this.currentNum = 1; |
|
this.valiFormData = this.orderData[0] |
|
this.valiFormData.neckShoulderWidth = this.valiFormData |
|
.neckShoulderWidth == -1 ? '' : this.valiFormData.neckShoulderWidth; |
|
this.valiFormData.neckLength = this.valiFormData.neckLength == -1 ? '' : |
|
this.valiFormData.neckLength; |
|
this.valiFormData.ageRange = this.valiFormData.ageRange == -1 ? '' : this |
|
.valiFormData.ageRange; |
|
this.valiFormData.sleepLength = this.valiFormData.sleepLength == -1 ? '' : |
|
this.valiFormData.sleepLength; |
|
this.valiFormData.cervicalVertebra = this.valiFormData.cervicalVertebra == |
|
-1 ? '' : this.valiFormData.cervicalVertebra; |
|
this.valiFormData.otherNeed = this.valiFormData.otherNeed == -1 ? '' : this |
|
.valiFormData.otherNeed; |
|
|
|
} else { |
|
this.currentNum = this.orderData.length + 1; |
|
} |
|
} |
|
} else if (res.data.code == 401) { |
|
this.doLogin() |
|
} else { |
|
uni.showToast({ |
|
title: res.data.msg, |
|
icon: 'none' |
|
}) |
|
} |
|
|
|
|
|
|
|
} |
|
}) |
|
}, |
|
handlePrev() { |
|
this.currentNum = this.currentNum - 1; |
|
// this.valiFormData = this.orderData[this.currentNum - 1]; |
|
if(this.currentNum == this.orderData.length){ |
|
this.alreadyForm = JSON.parse(JSON.stringify(this.valiFormData)) ; |
|
} |
|
|
|
if (!this.valiFormData) { |
|
this.valiFormData = {}; |
|
this.$nextTick(() =>{ |
|
this.$refs.valiForm.clearValidate() |
|
}) |
|
// this.valiFormData = this.orderData[this.currentNum - 2]; |
|
} else { |
|
this.isDisabled = true; |
|
this.valiFormData = this.orderData[this.currentNum - 1]; |
|
this.valiFormData.neckShoulderWidth = this.valiFormData.neckShoulderWidth == -1 ? '' : this |
|
.valiFormData.neckShoulderWidth; |
|
this.valiFormData.neckLength = this.valiFormData.neckLength == -1 ? '' : this.valiFormData.neckLength; |
|
this.valiFormData.ageRange = this.valiFormData.ageRange == -1 ? '' : this.valiFormData.ageRange; |
|
this.valiFormData.sleepLength = this.valiFormData.sleepLength == -1 ? '' : this.valiFormData |
|
.sleepLength; |
|
this.valiFormData.cervicalVertebra = this.valiFormData.cervicalVertebra == -1 ? '' : this.valiFormData |
|
.cervicalVertebra; |
|
this.valiFormData.otherNeed = this.valiFormData.otherNeed == -1 ? '' : this.valiFormData.otherNeed; |
|
}; |
|
}, |
|
jumpOver() { |
|
if (this.pageFrom == 'order') { |
|
uni.navigateBack({ |
|
url: "/pages/pages_zhentou/order/order" |
|
}) |
|
} else { |
|
uni.redirectTo({ |
|
url: "/pages/pages_zhentou/order/order" |
|
}) |
|
} |
|
}, |
|
handleNext() { |
|
if(!this.valiFormData.id){ |
|
uni.showToast({ |
|
title:'请先提交本表单', |
|
icon:'none' |
|
}) |
|
}else{ |
|
this.currentNum = this.currentNum + 1; |
|
console.log('this.alreadyForm ==>',this.alreadyForm) |
|
console.log('currentNum==>',this.currentNum) |
|
if(this.currentNum > this.orderData.length){ |
|
this.valiFormData = JSON.parse(JSON.stringify(this.orderData[this.currentNum - 2])); |
|
this.valiFormData.id = ''; |
|
this.isDisabled = false; |
|
console.log('123') |
|
if(JSON.stringify(this.alreadyForm) == '{}'){ |
|
console.log('456') |
|
this.valiFormData = this.valiFormData |
|
}else{ |
|
this.valiFormData = this.alreadyForm |
|
} |
|
}else{ |
|
this.valiFormData = JSON.parse(JSON.stringify(this.orderData[this.currentNum - 1])); |
|
this.isDisabled = true; |
|
} |
|
// this.valiFormData = this.orderData[this.currentNum - 1]; |
|
// if (!this.valiFormData) { |
|
|
|
// }else{ |
|
// this.isDisabled = true; |
|
// } |
|
|
|
// if(JSON.stringify(this.alreadyForm) == '{}'){ |
|
// this.valiFormData = this.valiFormData |
|
// }else{ |
|
// this.valiFormData = this.alreadyForm |
|
// } |
|
} |
|
// console.log(this.currentNum) |
|
// this.currentNum = this.currentNum + 1 |
|
// this.valiFormData = this.orderData[this.currentNum - 1]; |
|
// if (!this.valiFormData) { |
|
// console.log('123') |
|
// this.valiFormData = {} |
|
// this.$nextTick(() =>{ |
|
// this.$refs.valiForm.clearValidate() |
|
// }) |
|
// } else { |
|
// console.log('456') |
|
// this.valiFormData.neckShoulderWidth = this.valiFormData.neckShoulderWidth == -1 ? '' : this |
|
// .valiFormData.neckShoulderWidth; |
|
// this.valiFormData.neckLength = this.valiFormData.neckLength == -1 ? '' : this.valiFormData.neckLength; |
|
// this.valiFormData.ageRange = this.valiFormData.ageRange == -1 ? '' : this.valiFormData.ageRange; |
|
// this.valiFormData.sleepLength = this.valiFormData.sleepLength == -1 ? '' : this.valiFormData |
|
// .sleepLength; |
|
// this.valiFormData.cervicalVertebra = this.valiFormData.cervicalVertebra == -1 ? '' : this.valiFormData |
|
// .cervicalVertebra; |
|
// this.valiFormData.otherNeed = this.valiFormData.otherNeed == -1 ? '' : this.valiFormData.otherNeed; |
|
// } |
|
}, |
|
// 获取表单信息 |
|
getInfo() { |
|
uni.request({ |
|
// this.phoneNumber |
|
url: getApp().globalData.baseUrl + '/blade-desk/custom-made-info/get-newest?phone=15932584136', |
|
method: 'GET', |
|
header: { |
|
'Blade-Auth': 'bearer ' + uni.getStorageSync('token') |
|
}, |
|
success: (res) => { |
|
// console.log(res) |
|
if (res.data.code == 200) { |
|
this.valiFormData = { |
|
username: res.data.data.username == '-1' ? '' : res.data.data.username, |
|
ageRange: res.data.data.ageRange == '-1' ? '' : res.data.data.ageRange, |
|
height: res.data.data.height == '-1' ? '' : res.data.data.height, |
|
neckLength: res.data.data.neckLength == '-1' ? '' : res.data.data |
|
.neckLength, |
|
neckShoulderWidth: res.data.data.neckShoulderWidth == '-1' ? '' : res.data |
|
.data.neckShoulderWidth, |
|
pillowHardness: res.data.data.pillowHardness == '-1' ? '' : res.data.data |
|
.pillowHardness, |
|
pillowMaterial: res.data.data.pillowMaterial == '-1' ? '' : res.data.data |
|
.pillowMaterial, |
|
sleepingPosture: res.data.data.sleepingPosture == '-1' ? '' : res.data.data |
|
.sleepingPosture, |
|
status: res.data.data.status == '-1' ? '' : res.data.data.status, |
|
weight: res.data.data.weight == '-1' ? '' : res.data.data.weight, |
|
address: res.data.data.detail == '-1' ? '' : res.data.data.detail, |
|
sleepLength: res.data.data.sleepLength == '-1' ? '' : res.data.data |
|
.sleepLength, |
|
cervicalVertebra: res.data.data.cervicalVertebra == '-1' ? '' : res.data |
|
.data.cervicalVertebra, |
|
otherNeed: res.data.data.otherNeed == '-1' ? '' : res.data.data.otherNeed, |
|
phone: res.data.data.phone == '-1' ? '' : res.data.data.phone |
|
} |
|
this.province = res.data.data.province == '-1' ? '' : res.data.data.province; |
|
this.city = res.data.data.city == '-1' ? '' : res.data.data.city; |
|
this.district = res.data.data.district == '-1' ? '' : res.data.data.district; |
|
// this.getCurrentArea(this.province) |
|
console.log(this.valiFormData) |
|
if (this.valiFormData.username !== '' && |
|
this.valiFormData.phone !== '' && this.valiFormData.height !== '' && |
|
this.valiFormData.weight !== '' && this.valiFormData.pillowHardness !== '' && |
|
this.valiFormData.pillowMaterial !== '' && this.valiFormData |
|
.sleepingPosture !== '') { |
|
this.isDisabled = true |
|
} else { |
|
this.isDisabled = false |
|
} |
|
} else if (res.data.code == 401) { |
|
this.doLogin() |
|
} else { |
|
uni.showToast({ |
|
title: res.data.msg, |
|
icon: 'none' |
|
}) |
|
} |
|
} |
|
}) |
|
}, |
|
getCurrentArea(value) { |
|
this.allCityData.map((item, index) => { |
|
if (item.province == value) { |
|
this.multiIndex[0] = index |
|
item.citys.map((item1, index1) => { |
|
if (item1.city == this.province) { |
|
// console.log('111') |
|
this.locationArr[1].push(item.city); |
|
} |
|
if (item1.city == this.city) { |
|
|
|
} |
|
}) |
|
|
|
} |
|
}) |
|
}, |
|
toggle(type) { |
|
this.$refs.popup.open(type) |
|
}, |
|
clickPhone() { |
|
this.isShowCode = !this.isShowCode; |
|
}, |
|
getData() { |
|
// console.log(this.allCityData) |
|
this.allCityData.map(item => { |
|
this.locationArr[0].push(item.province); |
|
}) |
|
this.allCityData[0].citys[0].areas.map(item => { |
|
this.locationArr[1].push(item.area) |
|
}) |
|
|
|
// console.log(this.locationArr)/ |
|
}, |
|
cityChange(e) { |
|
// console.log(e) |
|
this.multiIndex = e.detail.value; |
|
// console.log(this.locationArr) |
|
this.province = this.locationArr[0][this.multiIndex[0]] |
|
this.city = this.locationArr[1][this.multiIndex[1]] |
|
this.district = this.locationArr[2][this.multiIndex[2]] |
|
}, |
|
columnchange(e) { |
|
let value = e.detail.value; |
|
// console.log(e.detail) |
|
if (e.detail.column == 0) { |
|
this.locationArr[1] = []; |
|
this.locationArr[2] = [] |
|
let tmp = this.allCityData.find(item => item.province == this.locationArr[0][value]) |
|
// console.log(tmp) |
|
if (tmp.citys.length == 1) { |
|
tmp.citys[0].areas.map(item => { |
|
this.locationArr[1].push(item.area) |
|
}) |
|
} else { |
|
tmp.citys.map(item => { |
|
this.locationArr[1].push(item.city) |
|
}) |
|
tmp.citys[0].areas.map(item => { |
|
this.locationArr[2].push(item.area); |
|
}) |
|
} |
|
// 第一列滑动 第二列 和第三列 都变为第一个 |
|
this.multiIndex = [value, 0, 0] |
|
|
|
} |
|
if (e.detail.column == 1) { |
|
this.locationArr[2] = []; |
|
this.multiIndex[1] = value; |
|
if (this.allCityData[this.multiIndex[0]].citys.length !== 1) { |
|
this.allCityData[this.multiIndex[0]].citys[value].areas.map(item => { |
|
this.locationArr[2].push(item.area) |
|
}) |
|
} |
|
this.multiIndex.splice(2, 1, 0) |
|
// console.log(this.multiIndex) |
|
} |
|
// 第三列滑动 |
|
if (e.detail.column === 2) { |
|
this.multiIndex[2] = e.detail.value |
|
} |
|
}, |
|
submit(ref) { |
|
if(this.isDisabled){ |
|
return; |
|
}else{ |
|
this.$refs[ref].validate().then(res => { |
|
// console.log(this.valiFormData); |
|
let params = {}; |
|
params = { |
|
username: this.valiFormData.username, |
|
phone: this.valiFormData.phone, |
|
province: this.province, |
|
city: this.city, |
|
district: this.district, |
|
detail: this.valiFormData.detail, |
|
height: this.valiFormData.height, |
|
weight: this.valiFormData.weight, |
|
sleepingPosture: this.valiFormData.sleepingPosture, |
|
pillowHardness: this.valiFormData.pillowHardness, |
|
pillowMaterial: this.valiFormData.pillowMaterial, |
|
neckShoulderWidth: this.valiFormData.neckShoulderWidth, |
|
neckLength: this.valiFormData.neckLength, |
|
ageRange: this.valiFormData.ageRange, |
|
sleepLength: this.valiFormData.sleepLength, |
|
cervicalVertebra: this.valiFormData.cervicalVertebra, |
|
otherNeed: this.valiFormData.otherNeed, |
|
orderNo: this.orderNo, |
|
id: this.valiFormData.id ? this.valiFormData.id : '', |
|
purchaseChannel:4 |
|
} |
|
// console.log(getApp().globalData.baseUrl) |
|
|
|
uni.request({ |
|
url: getApp().globalData.baseUrl + '/blade-desk/custom-made-info/save', |
|
data: params, |
|
method: 'post', |
|
success: res => { |
|
console.log(res) |
|
if (res.data.code == "200" || data.code === "") { |
|
uni.showToast({ |
|
title: '提交成功', |
|
icon: 'none' |
|
}); |
|
this.valiFormData = {}, |
|
this.alreadyForm = {} |
|
this.multiIndex[0, 0, 0]; |
|
this.city = '' |
|
this.province = ''; |
|
this.district = ''; |
|
this.getOrderInfo('save') |
|
} else if (res.data.code == 401) { |
|
this.doLogin() |
|
} else { |
|
uni.showToast({ |
|
title: '提交失败', |
|
icon: 'none' |
|
}); |
|
} |
|
}, |
|
fail: res => { |
|
reject(res) |
|
} |
|
}) |
|
}).catch(err => { |
|
// console.log('err', err); |
|
}) |
|
} |
|
}, |
|
//登录 |
|
doLogin(type) { |
|
uni.showLoading({ |
|
title: '登录中', |
|
mask: true |
|
}); |
|
uni.request({ |
|
url: getApp().globalData.baseUrl + '/blade-auth/getToken', |
|
method: 'POST', |
|
data: { |
|
openId: getApp().globalData.openId, |
|
phone: this.phone |
|
}, |
|
header: { |
|
'Authorization': 'Basic c2FiZXI6c2FiZXJfc2VjcmV0' |
|
}, |
|
success: (res) => { |
|
if (res.data.code == 200) { |
|
uni.setStorageSync('token', res.data.data.access_token); |
|
} else { |
|
uni.showToast({ |
|
title: res.data.msg, |
|
icon: 'none' |
|
}) |
|
} |
|
}, |
|
complete: () => { |
|
uni.hideLoading(); |
|
} |
|
}) |
|
}, |
|
// 省市区确认事件 |
|
pickerChange(e) { |
|
var _this = this |
|
_this.multiIndex = e.detail.value |
|
// 获取省市区总数据 |
|
|
|
let firstCity = this.oldpProvinceDataList[_this.multiIndex[0]].dictName |
|
let selectName = '' |
|
if (_this.locationArr[0][_this.multiIndex[0]] == firstCity) { |
|
selectName = this.oldpProvinceDataList[_this.multiIndex[0]].dictCode |
|
} |
|
let secondCity = this.oldpProvinceDataList[_this.multiIndex[0]].children[_this.multiIndex[1]] |
|
|
|
if (_this.locationArr[1][_this.multiIndex[1]] == secondCity.dictName) { |
|
selectName += '/' + secondCity.dictCode |
|
} |
|
|
|
let thirdCity = this.oldpProvinceDataList[_this.multiIndex[0]].children[_this.multiIndex[1]].children[_this |
|
.multiIndex[2]] |
|
if (_this.locationArr[2][_this.multiIndex[2]] == thirdCity.dictName) { |
|
selectName += '/' + thirdCity.dictCode |
|
} |
|
|
|
_this.select = |
|
_this.locationArr[0][_this.multiIndex[0]] + "," + |
|
_this.locationArr[1][_this.multiIndex[1]] + "," + |
|
_this.locationArr[2][_this.multiIndex[2]] |
|
_this.locationPro = selectName |
|
_this.proDetail.region = _this.locationPro |
|
}, |
|
// 每列滑动的监听 |
|
pickerColumnchange(e) { |
|
// this.moveTypes = 'bottom' |
|
// this.type = 'suuccess' |
|
// this.msg = '成功！' |
|
// this.imgUrl = this.successUrl |
|
var _this = this |
|
// 第几列滑动 |
|
// console.log("第几列滑动 = " + JSON.stringify(e.detail.column)) |
|
// 第几列滑动选中的下标 |
|
// console.log("第几列滑动选中的下标 = " + JSON.stringify(e.detail.value)) |
|
// 第一列滑动 |
|
if (e.detail.column === 0) { |
|
_this.multiIndex[0] = e.detail.value |
|
// 第二列更新相应的数据 |
|
_this.locationArr[1] = _this.oldpProvinceDataList[_this.multiIndex[0]].children.map((item, |
|
index) => { |
|
return item.dictName |
|
}) |
|
if (_this.oldpProvinceDataList[_this.multiIndex[0]].children.length === 1) { |
|
_this.locationArr[2] = _this.oldpProvinceDataList[_this.multiIndex[0]].children[0].children |
|
.map(( |
|
item, |
|
index) => { |
|
return item.dictName |
|
}) |
|
} else { |
|
_this.locationArr[2] = _this.oldpProvinceDataList[_this.multiIndex[0]].children[_this |
|
.multiIndex[ |
|
1]].children.map((item, index) => { |
|
return item.dictName |
|
}) |
|
} |
|
// 第一列滑动 第二列 和第三列 都变为第一个 |
|
_this.multiIndex.splice(1, 1, 0) |
|
_this.multiIndex.splice(2, 1, 0) |
|
} |
|
// // 第二列滑动 |
|
if (e.detail.column === 1) { |
|
_this.multiIndex[1] = e.detail.value |
|
_this.locationArr[2] = _this.oldpProvinceDataList[_this.multiIndex[0]].children[_this |
|
.multiIndex[ |
|
1]].children.map((item, index) => { |
|
return item.dictName |
|
}) |
|
// // 第二列 滑动 第三列 变成第一个 |
|
_this.multiIndex.splice(2, 1, 0) |
|
} |
|
// 第三列滑动 |
|
if (e.detail.column === 2) { |
|
_this.multiIndex[2] = e.detail.value |
|
} |
|
}, |
|
|
|
} |
|
} |
|
</script> |
|
|
|
<style lang="scss"> |
|
.uni-form-item .title { |
|
padding: 20rpx 0; |
|
} |
|
|
|
.container { |
|
position: relative; |
|
/* max-width: 1920px; |
|
max-height: 920px; */ |
|
// background-image: url('http://47.104.224.41:9000/etriphome/appresource/image/bag.png'); |
|
background-position: top center; |
|
background-size: cover; |
|
background-repeat: no-repeat; |
|
overflow-y: hidden; |
|
height: 100%; |
|
width: 100%; |
|
position: absolute; |
|
/* padding-bottom: 30px; */ |
|
|
|
.content_box { |
|
width: 690rpx; |
|
/* max-width: 700px; */ |
|
height: 71%; |
|
overflow: auto; |
|
background-color: #fff; |
|
margin: 0 auto; |
|
margin-top: 2%; |
|
border-radius: 24rpx; |
|
padding: 30rpx 0; |
|
padding-top: 180rpx; |
|
|
|
.top_box { |
|
width: 690rpx; |
|
margin: 0 auto; |
|
position: absolute; |
|
top: 16rpx; |
|
z-index: 100; |
|
background: #fff; |
|
border-radius: 24rpx 24rpx 0 0; |
|
padding-top: 20rpx; |
|
// background: #fff; |
|
// display: flex; |
|
// align-items: center; |
|
// justify-content: space-around; |
|
|
|
.title_box{ |
|
width:100%; |
|
text-align: left; |
|
margin-left: 30rpx; |
|
color: #666; |
|
font-size: 26rpx; |
|
} |
|
|
|
.turn_box{ |
|
padding:0 30rpx; |
|
display: flex; |
|
margin: 28rpx 0 36rpx 0; |
|
justify-content: space-between; |
|
width: 630rpx; |
|
|
|
.turn_item{ |
|
width: 200rpx; |
|
height: 78rpx; |
|
background: #FFFFFF; |
|
border-radius: 20rpx 20rpx 20rpx 20rpx; |
|
border: 1rpx solid #D73232; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
font-size: 26rpx; |
|
color: #D73232; |
|
// margin-right: 106rpx; |
|
// margin-left: 30rpx; |
|
|
|
&.next{ |
|
color: #666666; |
|
border: 1rpx solid #A5A5A5; |
|
} |
|
} |
|
} |
|
|
|
.form_item { |
|
width: 100rpx; |
|
display: flex; |
|
flex-direction: column; |
|
align-items: center; |
|
justify-content: center; |
|
|
|
.img_box { |
|
width: 68rpx; |
|
height: 68rpx; |
|
|
|
image { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
} |
|
|
|
.form_txt { |
|
color: #666; |
|
font-size: 24rpx; |
|
} |
|
} |
|
|
|
.line_box { |
|
width: 153rpx; |
|
height: 1px; |
|
background: #D1D1D1; |
|
} |
|
} |
|
|
|
.rele_content { |
|
width: 100%; |
|
height: 99%; |
|
margin: 0 auto; |
|
position: relative; |
|
// overflow: auto; |
|
} |
|
|
|
|
|
|
|
.footer { |
|
margin: 0 auto; |
|
max-width: 100%; |
|
height: 80rpx; |
|
font-size: 28rpx; |
|
color: #666; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
background: #fff |
|
} |
|
|
|
|
|
.link_box { |
|
position: absolute; |
|
top: 0; |
|
// left: 68.5%; |
|
right: 0; |
|
top: 50%; |
|
transform: translateY(-50%); |
|
background-color: #fff; |
|
border: 2rpx dashed transparent; |
|
border-radius: 12rpx; |
|
box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, .1); |
|
height: 440rpx; |
|
line-height: 40rpx; |
|
padding: 32rpx 20rpx; |
|
text-align: center; |
|
font-size: 28rpx; |
|
width: 80rpx; |
|
display: flex; |
|
flex-direction: column; |
|
align-items: center; |
|
justify-content: center; |
|
cursor: pointer; |
|
} |
|
|
|
.add_item { |
|
width: 600rpx; |
|
height: 600rpx; |
|
position: absolute; |
|
background: #fff; |
|
right: 120rpx; |
|
bottom: 43%; |
|
z-index: 99; |
|
display: flex; |
|
flex-direction: column; |
|
align-items: center; |
|
justify-content: center; |
|
box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, .1); |
|
|
|
.code_img { |
|
width: 200rpx; |
|
height: 200rpx; |
|
} |
|
} |
|
|
|
.form_box { |
|
max-width: 100%; |
|
background: #fff; |
|
margin: 0 auto; |
|
border-radius: 24rpx; |
|
/* margin-top: 64rpx; */ |
|
box-shadow: 0 24rpx 48rpx rgba(0, 0, 0, .05); |
|
|
|
.top_header { |
|
width: 100%; |
|
/* height: 342rpx; */ |
|
border-top-left-radius: 24rpx; |
|
border-top-right-radius: 24rpx; |
|
|
|
.top_img { |
|
width: 100%; |
|
height: 100%; |
|
border-top-left-radius: 24rpx; |
|
border-top-right-radius: 24rpx; |
|
} |
|
} |
|
|
|
.top_content { |
|
padding: 30rpx; |
|
|
|
.num_box { |
|
font-family: inherit; |
|
font-size: 40rpx; |
|
font-weight: normal; |
|
color: rgb(7, 0, 89); |
|
text-align: left; |
|
margin-bottom: 16rpx; |
|
} |
|
|
|
.title { |
|
font-family: inherit; |
|
font-size: 40rpx; |
|
font-weight: normal; |
|
color: rgb(7, 0, 89); |
|
text-align: center; |
|
margin-bottom: 16rpx; |
|
} |
|
|
|
.content { |
|
color: #666; |
|
line-height: 1.5; |
|
max-width: 100%; |
|
overflow: visible; |
|
word-break: break-word; |
|
|
|
p { |
|
text-align: left; |
|
font-size: 28rpx; |
|
} |
|
} |
|
} |
|
|
|
.form_content { |
|
margin: 0rpx 30rpx; |
|
padding: 20rpx 0rpx; |
|
|
|
.btn_box { |
|
width: 484rpx; |
|
font-family: inherit; |
|
font-size: 28rpx; |
|
font-weight: normal; |
|
color: rgb(255, 255, 255); |
|
padding: 20rpx 110rpx; |
|
background-color: rgb(245, 189, 55); |
|
border-color: rgb(255, 255, 255); |
|
border-width: 0rpx; |
|
box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 1px; |
|
margin: 40rpx auto; |
|
} |
|
|
|
.button_box { |
|
width: 484rpx; |
|
height: 60rpx; |
|
display: flex; |
|
align-self: center; |
|
justify-content: space-between; |
|
padding: 0 100rpx; |
|
|
|
.button { |
|
width: 100rpx; |
|
height: 60rpx; |
|
background: #fff; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
line-height: 60rpx; |
|
font-size: 26rpx; |
|
font-family: PingFang SC-Regular, PingFang SC; |
|
font-weight: 400; |
|
color: #666666; |
|
border-radius: 20rpx; |
|
border: 1rpx solid #A5A5A5; |
|
// margin: 0 60rpx; |
|
} |
|
} |
|
|
|
.uni-forms-item { |
|
|
|
/* background-color: red; */ |
|
::v-deep.checklist-box { |
|
width: 686rpx; |
|
height: 92rpx; |
|
border: 2rpx solid #eaeaea; |
|
padding-left: 20rpx; |
|
border-radius: 12rpx; |
|
} |
|
|
|
.address_item { |
|
margin-top: 16rpx; |
|
} |
|
|
|
.uni-forms-item__label { |
|
font-family: inherit; |
|
font-size: 14px; |
|
font-weight: bold; |
|
color: rgb(7, 0, 89); |
|
|
|
.is-required { |
|
margin-right: 10rpx; |
|
} |
|
} |
|
|
|
.wid_pre { |
|
width: 306rpx; |
|
height: 400rpx; |
|
display: flex; |
|
flex-direction: column; |
|
|
|
.wid_img { |
|
width: 100%; |
|
height: 316rpx; |
|
border-top-left-radius: 16rpx; |
|
border-top-right-radius: 16rpx; |
|
} |
|
.img_tit{ |
|
width: 306rpx; |
|
height: 94rpx; |
|
background: #fff; |
|
border-radius: 0 0 16rpx 16rpx; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
color: #333; |
|
font-size: 28rpx; |
|
border: 1px solid #eaeaea; |
|
} |
|
|
|
::v-deep.checklist-box { |
|
width: 306rpx; |
|
height: 94rpx; |
|
margin: 0; |
|
border-radius: 0rpx; |
|
border-bottom-left-radius: 16rpx; |
|
border-bottom-right-radius: 16rpx; |
|
} |
|
} |
|
|
|
.hei_pre { |
|
width: 306rpx; |
|
height: 400rpx; |
|
display: flex; |
|
flex-direction: column; |
|
|
|
.hei_img { |
|
width: 100%; |
|
height: 316rpx; |
|
border-top-left-radius: 16rpx; |
|
border-top-right-radius: 16rpx; |
|
} |
|
.img_tit{ |
|
width: 306rpx; |
|
height: 94rpx; |
|
background: #fff; |
|
border-radius: 0 0 16rpx 16rpx; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
color: #333; |
|
font-size: 28rpx; |
|
border: 1px solid #eaeaea; |
|
} |
|
|
|
::v-deep.checklist-box { |
|
width: 306rpx; |
|
height: 94rpx; |
|
margin: 0; |
|
border-radius: 0rpx; |
|
border-bottom-left-radius: 16rpx; |
|
border-bottom-right-radius: 16rpx; |
|
} |
|
} |
|
|
|
.pos_box { |
|
display: flex; |
|
justify-content: space-around; |
|
|
|
.pos_pre { |
|
width: 306rpx; |
|
height: 400rpx; |
|
display: flex; |
|
flex-direction: column; |
|
|
|
.hei_img { |
|
width: 100%; |
|
border-top-left-radius: 16rpx; |
|
border-top-right-radius: 16rpx; |
|
} |
|
|
|
::v-deep.checklist-box { |
|
width: 306rpx; |
|
height: 94rpx; |
|
margin: 0; |
|
border-radius: 0px; |
|
border-bottom-left-radius: 16rpx; |
|
border-bottom-right-radius: 16rpx; |
|
} |
|
} |
|
} |
|
|
|
.item_txt { |
|
font-size: 28rpx; |
|
margin-bottom: 24rpx; |
|
color: #666; |
|
} |
|
|
|
.city_box { |
|
width: 100%; |
|
height: 70rpx; |
|
padding-left: 20rpx; |
|
border: 1px solid; |
|
display: flex; |
|
align-items: center; |
|
display: flex; |
|
box-sizing: border-box; |
|
flex-direction: row; |
|
align-items: center; |
|
border: 1px solid #dcdfe6; |
|
border-radius: 8rpx; |
|
font-size: 24rpx; |
|
} |
|
|
|
} |
|
} |
|
|
|
} |
|
|
|
.mask_box { |
|
width: 100%; |
|
height: 100%; |
|
background: #000; |
|
position: absolute; |
|
z-index: 98; |
|
top: 0; |
|
opacity: 0.6; |
|
} |
|
|
|
.phone_box { |
|
align-items: center; |
|
background-color: #fff; |
|
border-radius: 50%; |
|
bottom: 220rpx; |
|
box-shadow: 0 24rpx 24rpx rgba(0, 0, 0, .1); |
|
display: flex; |
|
height: 120rpx; |
|
justify-content: center; |
|
margin-top: 12rpx; |
|
position: fixed; |
|
right: 24rpx; |
|
width: 120rpx; |
|
z-index: 98; |
|
} |
|
|
|
.code_box { |
|
width: 350rpx; |
|
height: 320rpx; |
|
background: url('http://47.104.224.41:9000/etriphome/appresource/image/add_bag.png') no-repeat; |
|
background-size: 100% 100%; |
|
position: fixed; |
|
right: 24rpx; |
|
bottom: 360rpx; |
|
z-index: 99; |
|
display: flex; |
|
flex-direction: column; |
|
align-items: center; |
|
justify-content: center; |
|
|
|
.code_img { |
|
width: 200rpx; |
|
height: 200rpx; |
|
} |
|
} |
|
} |
|
|
|
.bottom_con { |
|
width: 100%; |
|
height: 160rpx; |
|
background-color: #fff; |
|
display: flex; |
|
justify-content: center; |
|
// align-items: center; |
|
margin: 0 auto; |
|
// margin-top: 40rpx; |
|
position: fixed; |
|
bottom: 0; |
|
|
|
.btn_box { |
|
width: 320rpx; |
|
height: 78rpx; |
|
margin-top: 30rpx; |
|
background: #FFFFFF; |
|
border-radius: 20rpx 20rpx 20rpx 20rpx; |
|
border: 1rpx solid #D73232; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
font-size: 26rpx; |
|
color: #D73232; |
|
|
|
&:last-child { |
|
background: #D73232; |
|
color: #fff; |
|
margin-left: 50rpx; |
|
} |
|
|
|
&.dis_btn{ |
|
background: rgba(215, 50, 50, 0.3); |
|
border: 1rpx solid rgba(215, 50, 50, 0.3); |
|
} |
|
} |
|
} |
|
} |
|
</style> |