738 lines
16 KiB
Vue
738 lines
16 KiB
Vue
|
|
<!-- 新增线下订单-->
|
|||
|
|
<template>
|
|||
|
|
<view class="content">
|
|||
|
|
<view style="width: 100%; height: 44px;"></view>
|
|||
|
|
<view class="top-heder">
|
|||
|
|
<view class="t-left" @click="getback()">
|
|||
|
|
<uni-icons type="left" size="18"></uni-icons>
|
|||
|
|
</view>
|
|||
|
|
<view class="t-title">
|
|||
|
|
<text>新增线下订单</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="t-you"></view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="mub">
|
|||
|
|
<view class="top-ail">
|
|||
|
|
<u-upload
|
|||
|
|
:fileList="fileList"
|
|||
|
|
@afterRead="afterRead1"
|
|||
|
|
@delete="deletePic1"
|
|||
|
|
multiple
|
|||
|
|
:maxCount="1"
|
|||
|
|
>
|
|||
|
|
<view class="dlanniu" style="width: 345px;">
|
|||
|
|
<uni-icons type="scan" size="20" color="#ffffff"></uni-icons>
|
|||
|
|
<text style="margin-left: 10px;">行驶证扫描</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</u-upload>
|
|||
|
|
|
|||
|
|
<!-- 名称 -->
|
|||
|
|
|
|||
|
|
<view class="box-list">
|
|||
|
|
<view class="list-box">
|
|||
|
|
<view class="l-left">客户姓名</view>
|
|||
|
|
<view class="l-right">
|
|||
|
|
<input type="text" v-model="buyName" placeholder="请输入客户姓名">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="list-box">
|
|||
|
|
<view class="l-left">住址</view>
|
|||
|
|
<view class="l-right">
|
|||
|
|
<input type="text" v-model="userAddress" placeholder="请输入住址">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="list-box">
|
|||
|
|
<view class="l-left"><text style="color: red;font-weight: bold;text-align: center;">* </text>车牌号</view>
|
|||
|
|
<view class="l-right">
|
|||
|
|
<input type="text" v-model="carNum" placeholder="请输入车牌号">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="list-box">
|
|||
|
|
<view class="l-left" @click="showzhi = true">使用性质 <text class="xixi">点击选择</text></view>
|
|||
|
|
<view class="l-right">
|
|||
|
|
<input type="text" v-model="carNature" placeholder="请输入使用性质">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="list-box">
|
|||
|
|
<view class="l-left">品牌型号</view>
|
|||
|
|
<view class="l-right">
|
|||
|
|
<input type="text" v-model="carModel" placeholder="请输入品牌型号">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="list-box">
|
|||
|
|
<view class="l-left">车辆识别代号</view>
|
|||
|
|
<view class="l-right">
|
|||
|
|
<input type="text" v-model="carIdNo" placeholder="请输入车辆识别代号">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="list-box">
|
|||
|
|
<view class="l-left" @click="show = true"><text style="color: red;font-weight: bold;text-align: center;">* </text>客户来源<text class="xixi">点击选择</text></view>
|
|||
|
|
<view class="l-right">
|
|||
|
|
<input type="text" v-model="customerSource" placeholder="请输入客户来源">
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
<view class="list-box" >
|
|||
|
|
<view class="l-left" @click="showgoods = true"><text style="color: red;font-weight: bold;text-align: center;">* </text>商品选择<text class="xixi">点击选择</text></view>
|
|||
|
|
<view class="l-right">
|
|||
|
|
<text>{{goodstext}}</text>
|
|||
|
|
<!-- <input type="text" v-model="goodstext" placeholder="请选择商品"> -->
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="list-box" >
|
|||
|
|
<view class="l-left" @click="showxin = true">新旧车 <text class="xixi">点击选择</text> </view>
|
|||
|
|
<view class="l-right">
|
|||
|
|
<input type="text" v-model="carStatus" placeholder="请输入新旧车">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="list-box">
|
|||
|
|
<view class="l-left">联系方式</view>
|
|||
|
|
<view class="l-right">
|
|||
|
|
<input type="text" v-model="buyPhone" placeholder="请输入联系方式">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="list-box">
|
|||
|
|
<view class="l-left">单位</view>
|
|||
|
|
<view class="l-right">
|
|||
|
|
<input type="text" v-model="unitName" placeholder="请输入单位">
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<view class="dlanniu" @click="getgoodes()" >
|
|||
|
|
<text>开始检测</text>
|
|||
|
|
</view>
|
|||
|
|
<u-picker :show="show" :columns="columns" @confirm="confirms" @cancel="cancels" keyName="label"></u-picker>
|
|||
|
|
|
|||
|
|
<u-picker :show="showgoods" ref="uPicker" :columns="goodsone" @confirm="confirmgoods" @cancel="cancelgoods" @change="changeHandler" keyName="label"></u-picker>
|
|||
|
|
|
|||
|
|
<u-picker :show="shownature" :columns="nature" @confirm="confirmsnature" @cancel="cancelsnature" keyName="label"></u-picker>
|
|||
|
|
|
|||
|
|
<u-picker :show="showxin" :columns="xinlist" @confirm="confirmxin" @cancel="cancelxin" keyName="label"></u-picker>
|
|||
|
|
<u-picker :show="showzhi" :columns="zhilist" @confirm="confirmzhi" @cancel="cancelzhi" keyName="label"></u-picker>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 底部 -->
|
|||
|
|
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import config from '@/config';
|
|||
|
|
import request from '../../utils/request';
|
|||
|
|
import upload from '@/utils/upload.js'
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
imagePath:'',
|
|||
|
|
fileList: [],
|
|||
|
|
customerSource:'',
|
|||
|
|
buyName:'',
|
|||
|
|
buyPhone:'',
|
|||
|
|
userAddress:'',
|
|||
|
|
carNum:'',
|
|||
|
|
carStatus:'',
|
|||
|
|
carIdNo:'',
|
|||
|
|
carModel:'',
|
|||
|
|
carNature:'',
|
|||
|
|
show:false,
|
|||
|
|
shownature:false,
|
|||
|
|
showgoods:false,
|
|||
|
|
showxin:false,
|
|||
|
|
showzhi:false,
|
|||
|
|
skuId:0,
|
|||
|
|
columns: [],
|
|||
|
|
options:[],
|
|||
|
|
nature:[],
|
|||
|
|
goodsone:[],
|
|||
|
|
goodstwo:[],
|
|||
|
|
columnData:[],
|
|||
|
|
xinlist:[],
|
|||
|
|
zhilist:[],
|
|||
|
|
baseUrl:this.$baseUrl,
|
|||
|
|
goodsId:'',
|
|||
|
|
msg:'3',
|
|||
|
|
tapnum:0,
|
|||
|
|
fenlist:[],
|
|||
|
|
goodstext:'',
|
|||
|
|
ftitle:null,
|
|||
|
|
shopImages:[],
|
|||
|
|
shoplist:{},
|
|||
|
|
province:'',
|
|||
|
|
unitName:'',
|
|||
|
|
kehui:'',
|
|||
|
|
naturetext:'',
|
|||
|
|
customerData:[]
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onLoad() {
|
|||
|
|
this.getinitialize()
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
methods: {
|
|||
|
|
changeHandler(e) {
|
|||
|
|
console.log(e)
|
|||
|
|
const {
|
|||
|
|
columnIndex,
|
|||
|
|
value,
|
|||
|
|
values, // values为当前变化列的数组内容
|
|||
|
|
index,
|
|||
|
|
// 微信小程序无法将picker实例传出来,只能通过ref操作
|
|||
|
|
picker = this.$refs.uPicker
|
|||
|
|
} = e
|
|||
|
|
// 当第一列值发生变化时,变化第二列(后一列)对应的选项
|
|||
|
|
if (columnIndex === 0) {
|
|||
|
|
// picker为选择器this实例,变化第二列对应的选项
|
|||
|
|
console.log(this.columnData[index])
|
|||
|
|
picker.setColumnValues(1, this.columnData[index])
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
confirms(e){
|
|||
|
|
console.log(e);
|
|||
|
|
this.customerSource = e.value[0].label
|
|||
|
|
this.show= false
|
|||
|
|
},
|
|||
|
|
cancels(){
|
|||
|
|
this.show= false
|
|||
|
|
},
|
|||
|
|
// xin
|
|||
|
|
confirmxin(e){
|
|||
|
|
console.log(e);
|
|||
|
|
this.carStatus = e.value[0].label
|
|||
|
|
this.showxin= false
|
|||
|
|
},
|
|||
|
|
cancelxin(){
|
|||
|
|
this.showxin= false
|
|||
|
|
},
|
|||
|
|
//zhi
|
|||
|
|
confirmzhi(e){
|
|||
|
|
console.log(e);
|
|||
|
|
this.carNature = e.value[0].label
|
|||
|
|
this.showzhi= false
|
|||
|
|
},
|
|||
|
|
cancelzhi(){
|
|||
|
|
this.showzhi= false
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
confirmsnature(e){
|
|||
|
|
this.naturetext = e.value[0].label
|
|||
|
|
this.shownature = false
|
|||
|
|
},
|
|||
|
|
cancelsnature(){
|
|||
|
|
this.shownature = false
|
|||
|
|
},
|
|||
|
|
confirmgoods(e){
|
|||
|
|
this.goodstext = e.value[1].label
|
|||
|
|
this.skuId = e.value[1].value
|
|||
|
|
console.log(e);
|
|||
|
|
this.showgoods= false
|
|||
|
|
},
|
|||
|
|
cancelgoods(){
|
|||
|
|
this.showgoods= false
|
|||
|
|
},
|
|||
|
|
async getinitialize(){
|
|||
|
|
let res = await request({
|
|||
|
|
url:'/partnerOwn/partner/getCustomerSource',
|
|||
|
|
method: 'get',
|
|||
|
|
|
|||
|
|
})
|
|||
|
|
this.columns.push(res.data)
|
|||
|
|
let rescar = await request({
|
|||
|
|
url:'/rescue/dict/data/type/car_nature',
|
|||
|
|
method: 'get',
|
|||
|
|
})
|
|||
|
|
this.nature.push(rescar.data)
|
|||
|
|
let resx = await request({
|
|||
|
|
url:'/system/inspectionGoods/partnerGoodsListCol',
|
|||
|
|
method: 'get',
|
|||
|
|
})
|
|||
|
|
this.goodsone.push(resx.data.goodsList)
|
|||
|
|
this.goodsone.push(resx.data.skuList[0])
|
|||
|
|
this.columnData = resx.data.skuList
|
|||
|
|
console.log('赋值',this.goodsone,this.columnData);
|
|||
|
|
let resxin = await request({
|
|||
|
|
url:'/rescue/dict/data/type/car_status',
|
|||
|
|
method: 'get',
|
|||
|
|
})
|
|||
|
|
this.xinlist.push(resxin.data)
|
|||
|
|
let reszhi = await request({
|
|||
|
|
url:'/rescue/dict/data/type/car_use_nature',
|
|||
|
|
method: 'get',
|
|||
|
|
})
|
|||
|
|
this.zhilist.push(reszhi.data)
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
async getgoodes(){
|
|||
|
|
if(this.carNum == ''|| this.customerSource == "" || this.skuId == ''){
|
|||
|
|
uni.showToast({
|
|||
|
|
title:'车牌号 客户来源 商品 必填!',
|
|||
|
|
icon:'none'
|
|||
|
|
})
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
let data = {
|
|||
|
|
partnerId:uni.getStorageSync('partnerId'),
|
|||
|
|
buyName:this.buyName,
|
|||
|
|
buyPhone:this.buyPhone,
|
|||
|
|
userAddress:this.userAddress,
|
|||
|
|
unitName:this.unitName,
|
|||
|
|
carNum:this.carNum,
|
|||
|
|
carModel:this.carModel,
|
|||
|
|
carStatus:this.carStatus,
|
|||
|
|
carIdNo:this.carIdNo,
|
|||
|
|
customerSource:this.customerSource,
|
|||
|
|
skuId :this.skuId,
|
|||
|
|
carNature:this.carNature,
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
let res = await request({
|
|||
|
|
url:'/system/info/add',
|
|||
|
|
method: 'post',
|
|||
|
|
data:data
|
|||
|
|
})
|
|||
|
|
console.log(res);
|
|||
|
|
if(res.code == 200){
|
|||
|
|
uni.showToast({
|
|||
|
|
title:"检测已开始"
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
setTimeout(() => {
|
|||
|
|
uni.navigateBack()
|
|||
|
|
}, 2000);
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 提交
|
|||
|
|
async getgoods(){
|
|||
|
|
|
|||
|
|
let res = await request({
|
|||
|
|
url:'/partnerOwn/partner/editPartnerInfo',
|
|||
|
|
method: 'post',
|
|||
|
|
data : this.shoplist
|
|||
|
|
})
|
|||
|
|
console.log(res);
|
|||
|
|
if(res.code == 200){
|
|||
|
|
uni.showToast({
|
|||
|
|
title:"修改成功"
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
setTimeout(() => {
|
|||
|
|
uni.navigateBack()
|
|||
|
|
}, 2000);
|
|||
|
|
},
|
|||
|
|
getxz(e){
|
|||
|
|
this.releasebox.goodsCategoryId = e.value[0].id
|
|||
|
|
console.log( e.value[0].categoryName)
|
|||
|
|
this.ftitle = e.value[0].categoryName
|
|||
|
|
},
|
|||
|
|
gettapindex(index){
|
|||
|
|
this.tapnum = index
|
|||
|
|
},
|
|||
|
|
getback(){
|
|||
|
|
uni.navigateBack()
|
|||
|
|
},
|
|||
|
|
getyes(){
|
|||
|
|
this.show = false
|
|||
|
|
},
|
|||
|
|
open() {
|
|||
|
|
console.log('open');
|
|||
|
|
},
|
|||
|
|
close() {
|
|||
|
|
this.guige = false
|
|||
|
|
},
|
|||
|
|
deletePic1(event) {
|
|||
|
|
this[`fileList${event.name}`].splice(event.index, 1)
|
|||
|
|
},
|
|||
|
|
async afterRead1(event) {
|
|||
|
|
console.log(event,this[`fileList${event.name}`]);
|
|||
|
|
// 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
|
|||
|
|
let lists = [].concat(event.file)
|
|||
|
|
let fileListLen = this[`fileList${event.name}`].length
|
|||
|
|
lists.map((item) => {
|
|||
|
|
this[`fileList${event.name}`].push({
|
|||
|
|
...item,
|
|||
|
|
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
for (let i = 0; i < lists.length; i++) {
|
|||
|
|
const result = await this.uploadFilePromise1(lists[i].url)
|
|||
|
|
let item = this[`fileList${event.name}`][fileListLen]
|
|||
|
|
this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
|
|||
|
|
status: 'success',
|
|||
|
|
message: '',
|
|||
|
|
url: result
|
|||
|
|
}))
|
|||
|
|
fileListLen++
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
uploadFilePromise1(url) {
|
|||
|
|
uni.showLoading({
|
|||
|
|
|
|||
|
|
title: '扫描中',
|
|||
|
|
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
return new Promise((resolve, reject) => {
|
|||
|
|
let a = uni.uploadFile({
|
|||
|
|
url: this.$baseUrl+'/common/uploadImg', // 仅为示例,非真实的接口地址
|
|||
|
|
filePath: url,
|
|||
|
|
name: 'file',
|
|||
|
|
formData: {
|
|||
|
|
user: 'test'
|
|||
|
|
},
|
|||
|
|
success: (res) => {
|
|||
|
|
try {
|
|||
|
|
console.log(res,"1212")
|
|||
|
|
let img = JSON.parse(res.data);
|
|||
|
|
this.imagePath = this.imgs + img.fileName
|
|||
|
|
setTimeout(() => {
|
|||
|
|
this.vehicleLicenseOCR()
|
|||
|
|
}, 1000)
|
|||
|
|
|
|||
|
|
} catch (e) {
|
|||
|
|
//TODO handle the exception
|
|||
|
|
}
|
|||
|
|
setTimeout(() => {
|
|||
|
|
resolve(res.data.data)
|
|||
|
|
}, 1000)
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
async vehicleLicenseOCR(){
|
|||
|
|
let data = {
|
|||
|
|
imagePath :this.$baseUrl + this.imagePath
|
|||
|
|
//imagePath :'http://www.nuoyunr.com/lananRsc/detection/jsz.jpg'
|
|||
|
|
}
|
|||
|
|
let res = await request({
|
|||
|
|
url:'/partnerOwn/partner/vehicleLicenseOCR',
|
|||
|
|
method: 'post',
|
|||
|
|
params : data
|
|||
|
|
})
|
|||
|
|
this.buyName = res.data.FrontInfo.Owner
|
|||
|
|
this.userAddress = res.data.FrontInfo.Address
|
|||
|
|
this.carNum = res.data.FrontInfo.PlateNo
|
|||
|
|
this.carModel = res.data.FrontInfo.Model
|
|||
|
|
this.carIdNo=res.data.FrontInfo.Vin
|
|||
|
|
this.carNature=res.data.FrontInfo.UseCharacter
|
|||
|
|
uni.hideLoading();
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '识别成功',
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
console.log(res);
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style scoped lang="scss">
|
|||
|
|
.content {
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
width: 100%;
|
|||
|
|
height: calc(100vh);
|
|||
|
|
background: white;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.top-heder{
|
|||
|
|
width: 100%;
|
|||
|
|
height: 46px;
|
|||
|
|
background: white;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 5px 15px;
|
|||
|
|
}
|
|||
|
|
.t-title{
|
|||
|
|
font-size: 17px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #333333;
|
|||
|
|
}
|
|||
|
|
.t-left{
|
|||
|
|
width: 10%;
|
|||
|
|
}
|
|||
|
|
.t-you{
|
|||
|
|
height: 100%;
|
|||
|
|
width: 20%;
|
|||
|
|
}
|
|||
|
|
.t-input{
|
|||
|
|
width: 80%;
|
|||
|
|
height: 36px;
|
|||
|
|
background: #F0F0F0;
|
|||
|
|
border-radius: 50px;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 0 15px;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
.top-ail{
|
|||
|
|
width: 100%;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 15px;
|
|||
|
|
background-color: #F4F4F4;
|
|||
|
|
// height: calc(100vh);
|
|||
|
|
}
|
|||
|
|
.mub{
|
|||
|
|
background-color: #F4F4F4;
|
|||
|
|
height: calc(100vh);
|
|||
|
|
}
|
|||
|
|
.dix{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
.upimg{
|
|||
|
|
width: 100%;
|
|||
|
|
height: 126px;
|
|||
|
|
border-radius: 8px;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
|
|||
|
|
background-color: white;
|
|||
|
|
image{
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.box-list{
|
|||
|
|
width: 100%;
|
|||
|
|
border-radius: 8px;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 10px;
|
|||
|
|
background-color: white;
|
|||
|
|
margin: 10px auto;
|
|||
|
|
}
|
|||
|
|
.list-box{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 15px 5px;
|
|||
|
|
border-bottom: 1px solid #EEEEEE;
|
|||
|
|
}
|
|||
|
|
.l-left{
|
|||
|
|
font-size: 16px;
|
|||
|
|
font-weight: 400;
|
|||
|
|
color: #333333;
|
|||
|
|
}
|
|||
|
|
.l-right{
|
|||
|
|
font-size: 16px;
|
|||
|
|
font-weight: 400;
|
|||
|
|
color: #999999;
|
|||
|
|
text-align: right;
|
|||
|
|
}
|
|||
|
|
.xiaolan{
|
|||
|
|
// width: 109px;
|
|||
|
|
// height: 30px;
|
|||
|
|
background: #E2EAFF;
|
|||
|
|
border-radius: 50px;
|
|||
|
|
display: flex;
|
|||
|
|
align-content: center;
|
|||
|
|
justify-self: center;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 5px;
|
|||
|
|
font-size: 14px;
|
|||
|
|
font-weight: 400;
|
|||
|
|
color: #0D2E8D;
|
|||
|
|
}
|
|||
|
|
.xiaohui{
|
|||
|
|
// width: 141px;
|
|||
|
|
// height: 30px;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 0px 10px;
|
|||
|
|
background: #F7F7F7;
|
|||
|
|
border-radius: 50px ;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
margin: 10px ;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
.hui-right{
|
|||
|
|
border-left:1px solid #DDDDDD;
|
|||
|
|
padding: 5px;
|
|||
|
|
margin-left: 5px;
|
|||
|
|
}
|
|||
|
|
.wrap-box{
|
|||
|
|
width: 100%;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
display: flex;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
}
|
|||
|
|
.bottom-di{
|
|||
|
|
width: 100%;
|
|||
|
|
height: 56px;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
border-radius: 8px;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 0px 20px;
|
|||
|
|
margin-bottom: 10px;
|
|||
|
|
}
|
|||
|
|
.thui{
|
|||
|
|
font-size: 16px;
|
|||
|
|
font-weight: 400;
|
|||
|
|
color: #666666;
|
|||
|
|
margin-top: 10px;
|
|||
|
|
margin-left: 8px;
|
|||
|
|
}
|
|||
|
|
.imgs{
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
margin-top: 20px;
|
|||
|
|
}
|
|||
|
|
.p-box{
|
|||
|
|
border-radius: 10px;
|
|||
|
|
overflow: hidden;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 20px;
|
|||
|
|
width: 100%;
|
|||
|
|
background-color: white;
|
|||
|
|
}
|
|||
|
|
.p-top{
|
|||
|
|
width: 100%;
|
|||
|
|
text-align: center;
|
|||
|
|
font-size: 17px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #000000;
|
|||
|
|
margin-bottom: 20px;
|
|||
|
|
}
|
|||
|
|
.on-input{
|
|||
|
|
width: 100%;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
.ipt-kuang{
|
|||
|
|
width: 70%;
|
|||
|
|
height: 30px;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
border-radius: 8px 8px 8px 8px;
|
|||
|
|
opacity: 1;
|
|||
|
|
border: 1px solid #DDDDDD;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
margin: 10px auto;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 0px 10px;
|
|||
|
|
}
|
|||
|
|
.t-left{
|
|||
|
|
width: 20%;
|
|||
|
|
font-size: 14px;
|
|||
|
|
font-weight: 400;
|
|||
|
|
color: #000000;
|
|||
|
|
}
|
|||
|
|
.dlanniu{
|
|||
|
|
width: 80%;
|
|||
|
|
height: 45px;
|
|||
|
|
background: linear-gradient(180deg, #3F61C0 0%, #0D2E8D 100%);
|
|||
|
|
border-radius: 50px;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
margin: 20px auto;
|
|||
|
|
color: white;
|
|||
|
|
}
|
|||
|
|
.da{
|
|||
|
|
font-size: 16px;
|
|||
|
|
}
|
|||
|
|
//
|
|||
|
|
.top{
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 0px 15px;
|
|||
|
|
width: 100%;
|
|||
|
|
border-radius: 10px;
|
|||
|
|
margin: 10px auto;
|
|||
|
|
background-color: white;
|
|||
|
|
}
|
|||
|
|
.top-box{
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 20px 0px;
|
|||
|
|
}
|
|||
|
|
.tb-left{
|
|||
|
|
height: 100%;
|
|||
|
|
width: 80%;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
.uicon{
|
|||
|
|
width: 18px;
|
|||
|
|
height: 18px;
|
|||
|
|
border-radius: 4px;
|
|||
|
|
color: white;
|
|||
|
|
background: orangered;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
font-size: 12px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
margin-right: 6px;
|
|||
|
|
}
|
|||
|
|
.tb-right{
|
|||
|
|
width: 20px;
|
|||
|
|
height: 26px;
|
|||
|
|
image{
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.text1{
|
|||
|
|
font-size: 16px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #363636;
|
|||
|
|
}
|
|||
|
|
.hong1{
|
|||
|
|
margin-top: 5px;
|
|||
|
|
font-size: 12px;
|
|||
|
|
font-weight: 400;
|
|||
|
|
color: #FF5453;
|
|||
|
|
}
|
|||
|
|
.hong2{
|
|||
|
|
margin-top: 5px;
|
|||
|
|
font-size: 12px;
|
|||
|
|
font-weight: 400;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
.tinput{
|
|||
|
|
width: 100%;
|
|||
|
|
display: flex;
|
|||
|
|
background: white;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 16px;
|
|||
|
|
margin-top: 14px;
|
|||
|
|
}
|
|||
|
|
.xixi{
|
|||
|
|
font-size: 12px;
|
|||
|
|
color: #0D2E8D;
|
|||
|
|
margin-left: 10px;
|
|||
|
|
}
|
|||
|
|
</style>
|