jinna
3 years ago
parent
935d7125b8
commit
460089cf03
21 changed files with 17030 additions and 75 deletions
@ -0,0 +1,4 @@ |
|||||||
|
const DOMAIN_PREFIX = "http://47.104.224.41:80"; |
||||||
|
module.exports = { |
||||||
|
save: DOMAIN_PREFIX + "/blade-desk/custom-made-info/save", |
||||||
|
} |
||||||
@ -0,0 +1,915 @@ |
|||||||
|
<template> |
||||||
|
<view class="container"> |
||||||
|
<page-meta :root-font-size="fontsize+'px'"></page-meta> <!--动态设置html字体大小--> |
||||||
|
<view class="content_box"> |
||||||
|
<view class="rele_content"> |
||||||
|
<view class="form_box"> |
||||||
|
<view class="top_header"> |
||||||
|
<img class="top_img" src="../../../static/image/top.png" alt=""> |
||||||
|
</view> |
||||||
|
<view class="top_content"> |
||||||
|
<view class="title"> |
||||||
|
枕头定制信息表 |
||||||
|
</view> |
||||||
|
<view class="content"> |
||||||
|
<p style="font-size: 0.28rem;">不满意一直换，直到满意为止。</p> |
||||||
|
<p style="font-size: 0.28rem;"> |
||||||
|
<span style="color: hsl(354,74%,57%);margin-right: 0.1rem;">统一定制价格：699元</span> |
||||||
|
包邮到家 |
||||||
|
</p> |
||||||
|
<p style="font-size: 0.28rem;">如需定制请点击表格右下方小电话，长按二维码添加微信沟通付款。</p> |
||||||
|
<p style="font-size: 0.28rem;">最终解释权归青岛易旅家居科技有限公司所有。</p> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="form_content"> |
||||||
|
<uni-forms ref="valiForm" :rules="rules" :model="valiFormData" labelWidth="180px" |
||||||
|
label-position="top"> |
||||||
|
<uni-forms-item label="姓名" required name="username" :label-style="{'font-size':'40rpx'}"> |
||||||
|
<uni-easyinput v-model="valiFormData.username" placeholder="请输入姓名" /> |
||||||
|
</uni-forms-item> |
||||||
|
<uni-forms-item label="手机" required name="phone"> |
||||||
|
<uni-easyinput 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-show="province !== '' && city !== ''"> |
||||||
|
{{province}} / {{city}} {{district ? '/' : ''}} {{district}} |
||||||
|
</view> |
||||||
|
<view class="city_box" v-show="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 v-model="valiFormData.height" placeholder="请输入身高" /> |
||||||
|
</uni-forms-item> |
||||||
|
<uni-forms-item label="体重" required name="weight"> |
||||||
|
<p class="item_txt">单位：公斤kg</p> |
||||||
|
<uni-easyinput v-model="valiFormData.weight" placeholder="请输入体重" /> |
||||||
|
</uni-forms-item> |
||||||
|
<uni-forms-item label="肩颈宽度"> |
||||||
|
<p class="item_txt">单位：厘米cm</p> |
||||||
|
<uni-easyinput v-model="valiFormData.neckShoulderWidth" placeholder="请输入肩颈宽度" /> |
||||||
|
</uni-forms-item> |
||||||
|
<uni-forms-item label="颈肩宽度示意图"> |
||||||
|
<view class="wid_pre"> |
||||||
|
<img class="wid_img" src="../../../static/image/jian.png" alt=""> |
||||||
|
<uni-data-checkbox v-model="valiFormData.width" :localdata="widthData" /> |
||||||
|
</view> |
||||||
|
</uni-forms-item> |
||||||
|
<uni-forms-item label="颈长"> |
||||||
|
<p class="item_txt">单位：厘米cm</p> |
||||||
|
<uni-easyinput v-model="valiFormData.neckLength" placeholder="请输入颈长" /> |
||||||
|
</uni-forms-item> |
||||||
|
<uni-forms-item label="颈长示意图"> |
||||||
|
<view class="hei_pre"> |
||||||
|
<img class="hei_img" src="../../../static/image/length.jpg" alt=""> |
||||||
|
<uni-data-checkbox v-model="valiFormData.length" :localdata="lengthData" /> |
||||||
|
</view> |
||||||
|
</uni-forms-item> |
||||||
|
<uni-forms-item label="年龄"> |
||||||
|
<uni-data-checkbox v-model="valiFormData.ageRange" :localdata="ageData" /> |
||||||
|
</uni-forms-item> |
||||||
|
<uni-forms-item label="您每晚的睡眠时间"> |
||||||
|
<uni-data-checkbox 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="../../../static/image/yang.jpg" alt=""> |
||||||
|
<uni-data-checkbox v-model="valiFormData.sleepingPosture" |
||||||
|
:localdata="sleepPosData" /> |
||||||
|
</view> |
||||||
|
<view class="pos_pre"> |
||||||
|
<img class="hei_img" src="../../../static/image/ce.jpg" alt=""> |
||||||
|
<uni-data-checkbox v-model="valiFormData.sleepingPosture" |
||||||
|
:localdata="sleepPosData1" /> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
</uni-forms-item> |
||||||
|
<uni-forms-item label="您习惯的枕头软硬度" required name="pillowHardness"> |
||||||
|
<uni-data-checkbox v-model="valiFormData.pillowHardness" :localdata="posData" /> |
||||||
|
</uni-forms-item> |
||||||
|
<uni-forms-item label="您喜欢的枕头类型" required name="pillowMaterial"> |
||||||
|
<uni-data-checkbox v-model="valiFormData.pillowMaterial" :localdata="matData" /> |
||||||
|
</uni-forms-item> |
||||||
|
<uni-forms-item label="您现在的颈椎出现问题了吗"> |
||||||
|
<uni-data-checkbox v-model="valiFormData.cervicalVertebra" :localdata="cerData" /> |
||||||
|
</uni-forms-item> |
||||||
|
<uni-forms-item label="您的其他需求"> |
||||||
|
<uni-easyinput type="textarea" v-model="valiFormData.otherNeed" /> |
||||||
|
</uni-forms-item> |
||||||
|
</uni-forms> |
||||||
|
<button class="btn_box" @click="submit('valiForm')">提交</button> |
||||||
|
<!-- <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-show="province !== '' && city !== ''"> |
||||||
|
{{province}} / {{city}} {{district ? '/' : ''}} {{district}} |
||||||
|
</view> |
||||||
|
<view class="city_box" v-show="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-show="isShowCode"></view> |
||||||
|
<view class="phone_box" @click="clickPhone" v-show="widthScreen <= 500"> |
||||||
|
<uni-icons type="phone" size="30" color="#2eaadd"></uni-icons> |
||||||
|
</view> |
||||||
|
<view class="code_box" v-show="isShowCode"> |
||||||
|
<span style="color: #333;font-size: 0.28rem;margin-bottom: 0.12rem;">扫码添加</span> |
||||||
|
<img class="code_img" src="../../../static/image/add.png" alt=""> |
||||||
|
</view> |
||||||
|
<view class="link_box" v-show="widthScreen > 750" @click="isShowLink = !isShowLink"> |
||||||
|
<uni-icons type="phone" size="20" color="#2eaadd"></uni-icons> |
||||||
|
联系我们 |
||||||
|
</view> |
||||||
|
<view class="add_item" v-show="isShowLink"> |
||||||
|
<span style="color: #333;font-size: 0.28rem;margin-bottom: 0.12rem;">扫码添加</span> |
||||||
|
<img class="code_img" src="../../../static/image/add.jpg" alt=""> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
</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 { |
||||||
|
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: '身高不能为空' |
||||||
|
}] |
||||||
|
}, |
||||||
|
weight: { |
||||||
|
rules: [{ |
||||||
|
required: true, |
||||||
|
errorMessage: '体重不能为空' |
||||||
|
}] |
||||||
|
}, |
||||||
|
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 |
||||||
|
}, ] |
||||||
|
} |
||||||
|
}, |
||||||
|
onShow(){ |
||||||
|
console.log(getApp().globalData) |
||||||
|
}, |
||||||
|
onLoad() { |
||||||
|
// 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(); |
||||||
|
console.log(res.screenWidth) |
||||||
|
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() |
||||||
|
|
||||||
|
}, |
||||||
|
methods: { |
||||||
|
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) { |
||||||
|
this.$refs[ref].validate().then(res => { |
||||||
|
// console.log(this.baseFormData); |
||||||
|
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, |
||||||
|
} |
||||||
|
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.multiIndex[0, 0, 0]; |
||||||
|
this.city = '' |
||||||
|
this.province = ''; |
||||||
|
this.district = '' |
||||||
|
} else { |
||||||
|
uni.showToast({ |
||||||
|
title: '提交失败', |
||||||
|
icon: 'none' |
||||||
|
}); |
||||||
|
} |
||||||
|
}, |
||||||
|
fail: res => { |
||||||
|
reject(res) |
||||||
|
} |
||||||
|
}) |
||||||
|
// NET.request1(API.save, params, 'post').then(res => { |
||||||
|
|
||||||
|
// console.log(res) |
||||||
|
// if (res.code == 200) { |
||||||
|
// uni.showToast({ |
||||||
|
// title: '提交成功', |
||||||
|
// icon: 'none' |
||||||
|
// }); |
||||||
|
// this.valiFormData = {}, |
||||||
|
// this.multiIndex[0, 0, 0]; |
||||||
|
// this.city = '' |
||||||
|
// this.province = ''; |
||||||
|
// this.district = '' |
||||||
|
// } |
||||||
|
// }) |
||||||
|
}).catch(err => { |
||||||
|
console.log('err', err); |
||||||
|
}) |
||||||
|
}, |
||||||
|
// 省市区确认事件 |
||||||
|
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('../../../static/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 { |
||||||
|
/* max-width: 700px; */ |
||||||
|
height: 96%; |
||||||
|
margin: 0 auto; |
||||||
|
margin-top: 2%; |
||||||
|
overflow: auto; |
||||||
|
border-radius: 24rpx; |
||||||
|
|
||||||
|
.rele_content{ |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
margin: 0 auto; |
||||||
|
position: relative; |
||||||
|
} |
||||||
|
|
||||||
|
.footer { |
||||||
|
margin: 0 auto; |
||||||
|
max-width: 700px; |
||||||
|
height: 0.8rem; |
||||||
|
font-size: 0.28rem; |
||||||
|
color: #e9e9e9; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
.link_box { |
||||||
|
position: absolute; |
||||||
|
top: 0; |
||||||
|
// left: 68.5%; |
||||||
|
right: 0; |
||||||
|
top: 50%; |
||||||
|
transform: translateY(-50%); |
||||||
|
background-color: #fff; |
||||||
|
border: 1px dashed transparent; |
||||||
|
border-radius: 6px; |
||||||
|
box-shadow: 0 4px 12px rgba(0, 0, 0, .1); |
||||||
|
height: 2.2rem; |
||||||
|
line-height: 20px; |
||||||
|
padding: 16px 10px; |
||||||
|
text-align: center; |
||||||
|
font-size: 0.28rem; |
||||||
|
width: 0.4rem; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
cursor: pointer; |
||||||
|
} |
||||||
|
|
||||||
|
.add_item{ |
||||||
|
width: 3rem; |
||||||
|
height: 3rem; |
||||||
|
position: absolute; |
||||||
|
background: #fff; |
||||||
|
right: 1.2rem; |
||||||
|
bottom: 43%; |
||||||
|
z-index: 99; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
box-shadow: 0 4px 12px rgba(0, 0, 0, .1); |
||||||
|
|
||||||
|
.code_img { |
||||||
|
width: 2rem; |
||||||
|
} |
||||||
|
} |
||||||
|
.form_box { |
||||||
|
max-width: 700px; |
||||||
|
background: #fff; |
||||||
|
margin: 0 auto; |
||||||
|
border-radius: 0.24rem; |
||||||
|
/* margin-top: 0.64rem; */ |
||||||
|
box-shadow: 0 12px 24px rgba(0, 0, 0, .05); |
||||||
|
|
||||||
|
.top_header { |
||||||
|
width: 100%; |
||||||
|
/* height: 342rpx; */ |
||||||
|
border-top-left-radius: 0.24rem; |
||||||
|
border-top-right-radius: 0.24rem; |
||||||
|
|
||||||
|
.top_img { |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
border-top-left-radius: 0.24rem; |
||||||
|
border-top-right-radius: 0.24rem; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.top_content { |
||||||
|
padding: 0.3rem; |
||||||
|
|
||||||
|
.title { |
||||||
|
font-family: inherit; |
||||||
|
font-size: 0.4rem; |
||||||
|
font-weight: normal; |
||||||
|
color: rgb(7, 0, 89); |
||||||
|
text-align: center; |
||||||
|
margin-bottom: 0.16rem; |
||||||
|
} |
||||||
|
|
||||||
|
.content { |
||||||
|
color: #666; |
||||||
|
line-height: 1.5; |
||||||
|
max-width: 100%; |
||||||
|
overflow: visible; |
||||||
|
word-break: break-word; |
||||||
|
|
||||||
|
p { |
||||||
|
text-align: left; |
||||||
|
font-size: 0.28rem; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.form_content { |
||||||
|
margin: 0rem 0.3rem; |
||||||
|
padding: 0.2rem 0rem; |
||||||
|
|
||||||
|
.btn_box { |
||||||
|
width: 4.84rem; |
||||||
|
font-family: inherit; |
||||||
|
font-size: 14px; |
||||||
|
font-weight: normal; |
||||||
|
color: rgb(255, 255, 255); |
||||||
|
padding: 10px 55px; |
||||||
|
background-color: rgb(245, 189, 55); |
||||||
|
border-color: rgb(255, 255, 255); |
||||||
|
border-width: 0px; |
||||||
|
box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 1px; |
||||||
|
margin-top: 0.64rem; |
||||||
|
margin-bottom: 0.64rem; |
||||||
|
} |
||||||
|
|
||||||
|
.uni-forms-item { |
||||||
|
|
||||||
|
/* background-color: red; */ |
||||||
|
::v-deep.checklist-box { |
||||||
|
width: 6.86rem; |
||||||
|
height: 0.92rem; |
||||||
|
border: 1px solid #eaeaea; |
||||||
|
padding-left: 0.2rem; |
||||||
|
border-radius: 0.12rem; |
||||||
|
} |
||||||
|
|
||||||
|
.address_item { |
||||||
|
margin-top: 0.16rem; |
||||||
|
} |
||||||
|
|
||||||
|
.uni-forms-item__label { |
||||||
|
font-family: inherit; |
||||||
|
font-size: 14px; |
||||||
|
font-weight: bold; |
||||||
|
color: rgb(7, 0, 89); |
||||||
|
|
||||||
|
.is-required { |
||||||
|
margin-right: 0.1rem; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.wid_pre { |
||||||
|
width: 3.06rem; |
||||||
|
height: 4rem; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
|
||||||
|
.wid_img { |
||||||
|
border-top-left-radius: 0.16rem; |
||||||
|
border-top-right-radius: 0.16rem; |
||||||
|
} |
||||||
|
|
||||||
|
::v-deep.checklist-box { |
||||||
|
width: 3.06rem; |
||||||
|
height: 0.94rem; |
||||||
|
margin: 0; |
||||||
|
border-radius: 0px; |
||||||
|
border-bottom-left-radius: 0.16rem; |
||||||
|
border-bottom-right-radius: 0.16rem; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.hei_pre { |
||||||
|
width: 3.06rem; |
||||||
|
height: 4rem; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
|
||||||
|
.hei_img { |
||||||
|
border-top-left-radius: 0.16rem; |
||||||
|
border-top-right-radius: 0.16rem; |
||||||
|
} |
||||||
|
|
||||||
|
::v-deep.checklist-box { |
||||||
|
width: 3.06rem; |
||||||
|
height: 0.94rem; |
||||||
|
margin: 0; |
||||||
|
border-radius: 0px; |
||||||
|
border-bottom-left-radius: 0.16rem; |
||||||
|
border-bottom-right-radius: 0.16rem; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.pos_box { |
||||||
|
display: flex; |
||||||
|
justify-content: space-around; |
||||||
|
|
||||||
|
.pos_pre { |
||||||
|
width: 3.06rem; |
||||||
|
height: 4rem; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
|
||||||
|
.hei_img { |
||||||
|
border-top-left-radius: 0.16rem; |
||||||
|
border-top-right-radius: 0.16rem; |
||||||
|
} |
||||||
|
|
||||||
|
::v-deep.checklist-box { |
||||||
|
width: 3.06rem; |
||||||
|
height: 0.94rem; |
||||||
|
margin: 0; |
||||||
|
border-radius: 0px; |
||||||
|
border-bottom-left-radius: 0.16rem; |
||||||
|
border-bottom-right-radius: 0.16rem; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.item_txt { |
||||||
|
font-size: .28rem; |
||||||
|
margin-bottom: 0.24rem; |
||||||
|
color: #666; |
||||||
|
} |
||||||
|
|
||||||
|
.city_box { |
||||||
|
width: 100%; |
||||||
|
height: 0.7rem; |
||||||
|
padding-left: 0.2rem; |
||||||
|
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: 0.08rem; |
||||||
|
font-size: 0.24rem; |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
.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: 2.2rem; |
||||||
|
box-shadow: 0 0.24rem 0.24rem rgba(0, 0, 0, .1); |
||||||
|
display: flex; |
||||||
|
height: 1.2rem; |
||||||
|
justify-content: center; |
||||||
|
margin-top: 0.12rem; |
||||||
|
position: fixed; |
||||||
|
right: 0.24rem; |
||||||
|
width: 1.2rem; |
||||||
|
z-index: 98; |
||||||
|
} |
||||||
|
|
||||||
|
.code_box { |
||||||
|
width: 3.5rem; |
||||||
|
height: 3.2rem; |
||||||
|
background: url('../../../static/image/add_bag.png') no-repeat; |
||||||
|
background-size: 100% 100%; |
||||||
|
position: fixed; |
||||||
|
right: 0.24rem; |
||||||
|
bottom: 3.6rem; |
||||||
|
z-index: 99; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
|
||||||
|
.code_img { |
||||||
|
width: 2rem; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,68 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
<view class="img_box"> |
||||||
|
<!-- <image class="img" src="../../../static/image/bag.jpg" mode=""></image> --> |
||||||
|
<img class="img" src="../../../static/image/bag.jpg" mode=""></img> |
||||||
|
</view> |
||||||
|
<view class="bottom_box"> |
||||||
|
<button class="btn" @click="addForm">填写报名单（其他渠道已购买）</button> |
||||||
|
<button class="btn" @click="clickCustom">定制</button> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
|
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
// 点击定制 |
||||||
|
clickCustom(){ |
||||||
|
console.log('点击定制') |
||||||
|
}, |
||||||
|
// 填写表单 |
||||||
|
addForm(){ |
||||||
|
this.$route.push('../') |
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.img_box{ |
||||||
|
.img{ |
||||||
|
width: 100%; |
||||||
|
} |
||||||
|
} |
||||||
|
.bottom_box{ |
||||||
|
width: 100%; |
||||||
|
height: 280rpx; |
||||||
|
background: #fff; |
||||||
|
position: fixed; |
||||||
|
bottom: 99rpx; |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
|
||||||
|
|
||||||
|
.btn{ |
||||||
|
width: 85%; |
||||||
|
height: 80rpx; |
||||||
|
background-color: rgb(245, 19, 19); |
||||||
|
color: #fff; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
|
||||||
|
&:first-child{ |
||||||
|
background-color: rgb(164, 173, 179); |
||||||
|
margin-bottom: 40rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
</style> |
||||||
@ -0,0 +1,22 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
我的 |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
|
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style> |
||||||
|
|
||||||
|
</style> |
||||||
@ -0,0 +1,22 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
订单页面 |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
|
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style> |
||||||
|
|
||||||
|
</style> |
||||||
|
After Width: | Height: | Size: 87 KiB |
|
After Width: | Height: | Size: 91 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 1.6 MiB |
|
After Width: | Height: | Size: 1.0 MiB |
|
After Width: | Height: | Size: 84 KiB |
|
After Width: | Height: | Size: 94 KiB |
|
After Width: | Height: | Size: 18 KiB |
|
After Width: | Height: | Size: 741 KiB |
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,74 @@ |
|||||||
|
const request = (url, data, method = 'GET') => { |
||||||
|
return new Promise((resolve, reject) => { |
||||||
|
let header = { |
||||||
|
"Content-Type": "application/json" |
||||||
|
} |
||||||
|
const res = uni.getStorageSync('storage_key'); |
||||||
|
const token = res.token |
||||||
|
if (token) { |
||||||
|
header['Authorization'] = token |
||||||
|
} |
||||||
|
console.log(url) |
||||||
|
uni.request({ |
||||||
|
url: url, |
||||||
|
data: data, |
||||||
|
method: method, |
||||||
|
header: header, |
||||||
|
success: res => { |
||||||
|
if (res.statusCode == 200) { |
||||||
|
if (res.data.code === "200" || res.data.code === "" || res.data.status == "200") { |
||||||
|
resolve(res.data) |
||||||
|
} else if (res.data.code === "20004" || res.data.code === "20005") { |
||||||
|
uni.removeStorageSync("storage_key") |
||||||
|
uni.navigateTo({ |
||||||
|
url: '/pages_category_page2/userModule/login' |
||||||
|
}) |
||||||
|
} else { |
||||||
|
resolve(res.data) |
||||||
|
uni.showToast({ |
||||||
|
title: res.data.message, |
||||||
|
icon: "none" |
||||||
|
}) |
||||||
|
} |
||||||
|
} else { |
||||||
|
reject(res) |
||||||
|
} |
||||||
|
}, |
||||||
|
fail: res => { |
||||||
|
reject(res) |
||||||
|
} |
||||||
|
}) |
||||||
|
}); |
||||||
|
} |
||||||
|
//不带token接口请求，首页
|
||||||
|
const request1 = (url, data, method = 'GET') => { |
||||||
|
return new Promise((resolve, reject) => { |
||||||
|
let header = { |
||||||
|
'Content-Type': 'application/json', |
||||||
|
} |
||||||
|
uni.request({ |
||||||
|
url: url, |
||||||
|
data: data, |
||||||
|
method: method, |
||||||
|
header: header, |
||||||
|
success: res => { |
||||||
|
console.log(res) |
||||||
|
if (res.data.code == "200" || data.code === "") { |
||||||
|
console.log('进入1') |
||||||
|
resolve(res.data) |
||||||
|
} else { |
||||||
|
console.log('进入2') |
||||||
|
reject(res) |
||||||
|
} |
||||||
|
}, |
||||||
|
fail: res => { |
||||||
|
reject(res) |
||||||
|
} |
||||||
|
}) |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
module.exports = { |
||||||
|
request: request, |
||||||
|
request1: request1 |
||||||
|
} |
||||||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in new issue