@@ -1,304 +1,422 @@ | |||
<template> | |||
<view class="selectCar-box"> | |||
<view class="details"> | |||
<view class="title"> | |||
基础信息 | |||
</view> | |||
<view class="details-item"> | |||
<view> | |||
订单编号: | |||
</view> | |||
<text>123234350000001</text> | |||
</view> | |||
<view class="details-item"> | |||
<view> | |||
用户名称: | |||
</view> | |||
<text>xxxxx</text> | |||
</view> | |||
<view class="details-item"> | |||
<view> | |||
用户证件类型: | |||
</view> | |||
<text>居民身份证</text> | |||
</view> | |||
<view class="details-item"> | |||
<view> | |||
用户证件号: | |||
</view> | |||
<text>44504049343434001</text> | |||
</view> | |||
<view class="details-item"> | |||
<view> | |||
订单车牌号: | |||
</view> | |||
<text style="color: #00B38B;;">贵A12345</text> | |||
</view> | |||
<view class="details-item"> | |||
<view> | |||
收费车型: | |||
</view> | |||
<text>客车</text> | |||
</view> | |||
</view> | |||
<view class="title"> | |||
卡信号 | |||
</view> | |||
<view class="card"> | |||
<view class="card-left"> | |||
<image :src="`${$imgUrl}card2.png`" mode=""></image> | |||
<view class="card-center"> | |||
<view class="card-center-head"> | |||
2023022700012 | |||
</view> | |||
<view class="tips"> | |||
<text>储蓄卡</text> | |||
<text class="tips-card">正常</text> | |||
</view> | |||
</view> | |||
</view> | |||
<view class="choose-item" @click="choose(1)"> | |||
<view class="active" v-if="flag.includes(1)"> | |||
</view> | |||
</view> | |||
</view> | |||
<view class="title"> | |||
OBU设备信息 | |||
</view> | |||
<view class="card"> | |||
<view class="card-left"> | |||
<image :src="`${$imgUrl}card1.png`" mode=""></image> | |||
<view class="card-center"> | |||
<view class="card-center-head"> | |||
2023022700012 | |||
</view> | |||
<view class="tips"> | |||
<!-- <text>储蓄卡</text> --> | |||
<text class="tips-card">正常</text> | |||
</view> | |||
</view> | |||
</view> | |||
<view class="choose-item" @click="choose(2)"> | |||
<view class="active" v-if="flag.includes(2)"> | |||
</view> | |||
</view> | |||
</view> | |||
<view class="title"> | |||
注意事项 | |||
</view> | |||
<view class="remark"> | |||
<view> | |||
1.xxxxxxxx | |||
</view> | |||
<view> | |||
2.xxxxxxxx | |||
</view> | |||
<view> | |||
3.xxxxxxxx | |||
</view> | |||
<view> | |||
4.xxxxxxxx | |||
</view> | |||
</view> | |||
<button class="submit" @click="toPage">下一步</button> | |||
</view> | |||
</template> | |||
<script lang="ts" setup> | |||
import { | |||
reactive, | |||
ref | |||
} from "vue" | |||
import { | |||
navTo | |||
} from "@/utils/utils" | |||
const type = ref('') | |||
const toPage = () => { | |||
if (flag.length == 0) { | |||
uni.showToast({ | |||
title: '请至少勾选一项', | |||
}); | |||
} else { | |||
wx.showModal({ | |||
title: '设备挂失', | |||
content: '请确认是否执行挂失操作', | |||
success: function(res) { | |||
if (res.confirm) { | |||
console.log('用户点击确定'); | |||
navTo(`/after-sale/card-loss-reporting/cardloss?type=${type.value}`) | |||
} else if (res.cancel) { | |||
console.log('用户点击取消'); | |||
} | |||
} | |||
}); | |||
} | |||
} | |||
const flag = reactive([]) | |||
const choose = (data) => { | |||
if (!flag.includes(data)) { | |||
flag.push(data) | |||
console.log(flag); | |||
} else { | |||
flag.splice(flag.indexOf(data), 1) | |||
console.log(flag); | |||
} | |||
if (flag.length == 2) { | |||
type.value = '3' | |||
} else if (flag[0] == 1) { | |||
type.value = '1' | |||
} else { | |||
type.value = '2' | |||
} | |||
console.log(type.value); | |||
} | |||
</script> | |||
<style> | |||
page { | |||
width: 100%; | |||
height: 100%; | |||
background-color: #fff; | |||
} | |||
</style> | |||
<style lang="scss" scoped> | |||
.selectCar-box { | |||
// width: 100%; | |||
// height: 100%; | |||
padding: 30rpx; | |||
.title { | |||
font-size: 30rpx; | |||
font-family: Microsoft YaHei UI; | |||
font-weight: 400; | |||
color: #333333; | |||
margin-bottom: 30rpx; | |||
} | |||
.details { | |||
.title { | |||
font-size: 30rpx; | |||
font-family: Microsoft YaHei UI; | |||
font-weight: 400; | |||
color: #333333; | |||
margin-bottom: 30rpx; | |||
} | |||
.details-item { | |||
display: flex; | |||
font-size: 26rpx; | |||
font-family: Noto Sans S Chinese; | |||
font-weight: 400; | |||
color: #999999; | |||
margin-bottom: 30rpx; | |||
text { | |||
font-size: 26rpx; | |||
font-family: Noto Sans S Chinese; | |||
font-weight: 400; | |||
color: #333333; | |||
} | |||
} | |||
} | |||
.card { | |||
height: 150rpx; | |||
background: #FFFFFF; | |||
box-shadow: 0rpx 4rpx 13rpx 3rpx rgba(223, 223, 223, 0.8); | |||
border-radius: 20rpx; | |||
padding: 30rpx; | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
margin-bottom: 60rpx; | |||
.card-left { | |||
display: flex; | |||
align-items: center; | |||
image { | |||
width: 100rpx; | |||
height: 90rpx; | |||
} | |||
.card-center { | |||
margin-left: 30rpx; | |||
.card-center-head { | |||
font-size: 32rpx; | |||
font-family: Noto Sans S Chinese; | |||
font-weight: 400; | |||
color: #333333; | |||
} | |||
.tips { | |||
font-size: 26rpx; | |||
font-family: Noto Sans S Chinese; | |||
font-weight: 400; | |||
color: #666666; | |||
.tips-card { | |||
width: 70rpx; | |||
height: 40rpx; | |||
background: #D3F2EF; | |||
border-radius: 6rpx; | |||
font-size: 20rpx; | |||
font-family: Noto Sans S Chinese; | |||
font-weight: 400; | |||
color: #0A8F8A; | |||
padding: 5rpx 10rpx; | |||
margin-left: 20rpx; | |||
} | |||
} | |||
} | |||
} | |||
.choose-item { | |||
margin-right: 20rpx; | |||
width: 50rpx; | |||
height: 50rpx; | |||
border: 1rpx solid #00B38B; | |||
border-radius: 50%; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
.active { | |||
width: 38rpx; | |||
height: 38rpx; | |||
background: #00B38B; | |||
border-radius: 50%; | |||
} | |||
} | |||
} | |||
.remark { | |||
font-size: 26rpx; | |||
font-family: Microsoft YaHei UI; | |||
font-weight: 400; | |||
color: #666666; | |||
text-indent: 30rpx; | |||
margin-bottom: 30rpx; | |||
} | |||
.submit { | |||
margin-top: 100rpx; | |||
width: 670rpx; | |||
height: 80rpx; | |||
background: linear-gradient(-90deg, #43A1E0 0%, #13E7C1 100%); | |||
border-radius: 40rpx; | |||
font-size: 32rpx; | |||
font-family: Noto Sans S Chinese; | |||
font-weight: 400; | |||
color: #FFFFFF; | |||
line-height: 80rpx; | |||
} | |||
} | |||
<template> | |||
<view class="selectCar-box"> | |||
<view class="details"> | |||
<view class="title"> | |||
基础信息 | |||
</view> | |||
<view class="details-item"> | |||
<view> | |||
订单编号: | |||
</view> | |||
<text>{{state.data.orderId}}</text> | |||
</view> | |||
<view class="details-item"> | |||
<view> | |||
用户名称: | |||
</view> | |||
<text>{{state.data.customerName}}</text> | |||
</view> | |||
<view class="details-item"> | |||
<view> | |||
用户证件类型: | |||
</view> | |||
<text>{{getCredentialType(state.data.customerIdtype)}}</text> | |||
</view> | |||
<view class="details-item"> | |||
<view> | |||
用户证件号: | |||
</view> | |||
<text>{{state.data.customerIdnum}}</text> | |||
</view> | |||
<view class="details-item"> | |||
<view> | |||
订单车牌号: | |||
</view> | |||
<text style="color: #00B38B;;">{{state.data.vehiclePlate}}</text> | |||
</view> | |||
<view class="details-item"> | |||
<view> | |||
收费车型: | |||
</view> | |||
<text>{{state.data.vehicleType}}</text> | |||
</view> | |||
</view> | |||
<view class="title"> | |||
卡信息 | |||
</view> | |||
<view class="card"> | |||
<view class="card-left"> | |||
<image :src="`${$imgUrl}card2.png`" mode=""></image> | |||
<view class="card-center"> | |||
<view class="card-center-head"> | |||
{{state.data.cardId}} | |||
</view> | |||
<view class="tips"> | |||
<text>储蓄卡</text> | |||
<text class="tips-card">{{getEtcCardStatus(state.data.cardStatus)}}</text> | |||
</view> | |||
</view> | |||
</view> | |||
<view class="choose-item" @click="choose(1)"> | |||
<view class="active" v-if="flag.includes(1)"> | |||
</view> | |||
</view> | |||
</view> | |||
<view class="title"> | |||
OBU设备信息 | |||
</view> | |||
<view class="card"> | |||
<view class="card-left"> | |||
<image :src="`${$imgUrl}card1.png`" mode=""></image> | |||
<view class="card-center"> | |||
<view class="card-center-head"> | |||
{{state.data.obuId}} | |||
</view> | |||
<view class="tips"> | |||
<!-- <text>储蓄卡</text> --> | |||
<text class="tips-card">{{getObuStatus(state.data.obuStatus)}}</text> | |||
</view> | |||
</view> | |||
</view> | |||
<view class="choose-item" @click="choose(2)"> | |||
<view class="active" v-if="flag.includes(2)"> | |||
</view> | |||
</view> | |||
</view> | |||
<button class="submit" @click="nextACtion">下一步</button> | |||
</view> | |||
</template> | |||
<script lang="ts" setup> | |||
import { | |||
reactive, | |||
ref | |||
} from "vue" | |||
import { | |||
navTo | |||
} from "@/utils/utils" | |||
import { | |||
onLoad, | |||
onUnload | |||
} from "@dcloudio/uni-app"; | |||
import { | |||
request | |||
} from "@/utils/network/request.js"; | |||
import { | |||
orderDetail, | |||
CardlossStatus | |||
} from "@/utils/network/api.js"; | |||
import { | |||
msg | |||
} from "@/utils/utils"; | |||
import { | |||
getCredentialType | |||
} from "@/datas/credentialType.js"; | |||
import { | |||
getEtcCardStatus | |||
} from "@/datas/etcCardStatus.js"; | |||
import { | |||
getObuStatus | |||
} from "@/datas/obuStatus.js"; | |||
import { | |||
stringToJson | |||
} from "@/utils/network/encryption"; | |||
const state = reactive({ | |||
data: { | |||
cardStatus: undefined, | |||
obuStatus: undefined, | |||
} | |||
}); | |||
const flag = reactive([]) | |||
const type = ref('') | |||
/*视图进入后操作*/ | |||
onLoad((option) => { | |||
queryOrderDetail(option.id).then((val: any) => { | |||
state.data = val | |||
}) | |||
/*监听手机号验证后的回调*/ | |||
uni.$on('queryCardlossStatus', function(type) { | |||
queryCardlossStatus(type).then((val: any)) => { | |||
navTo( | |||
`/after-sale/card-loss-reporting/card-result` | |||
) | |||
}) | |||
}) | |||
}); | |||
onUnload(() => { | |||
/*移除监听*/ | |||
uni.$off('queryCardlossStatus') | |||
}); | |||
/*下一步*/ | |||
const nextACtion = () => { | |||
if (flag.length === 0) { | |||
uni.showToast({ | |||
title: '请至少勾选一项', | |||
}); | |||
} else if (flag.length === 1) { | |||
if (type.value === '1') { | |||
//卡正常 | |||
if (state.data.cardStatus === 1) { | |||
showModelAction('卡挂失', '请确认是否执行卡挂失操作', 1) | |||
} else if (state.data.cardStatus === 6) { | |||
showModelAction('卡解挂', '请确认是否执行卡解挂操作', 4) | |||
} | |||
} else if (type.value === '2') { | |||
//obu正常 | |||
if (state.data.obuStatus === 1) { | |||
wx.showActionSheet('设备挂失', '请确认是否执行设备挂失操作', 2) | |||
} else if (state.data.obuStatus === 6) { | |||
wx.showActionSheet('签解挂', '请确认是否执行签解挂操作', 5) | |||
} | |||
} | |||
} else if (flag.length === 2) { | |||
if ((state.data.cardStatus !== state.data.obuStatus)) { | |||
msg('当前的卡状态和obu状态不支持批量操作') | |||
return; | |||
} | |||
if (type.value === 3) { | |||
if (state.data.cardStatus && state.data.obuStatus === 1) { | |||
wx.showActionSheet('卡签挂失', '请确认是否执行卡签挂失操作', 3) | |||
} else { | |||
wx.showActionSheet('卡签解挂', '请确认是否执行卡签解挂操作', 6) | |||
} | |||
} | |||
} | |||
} | |||
const showModelAction = (title, content, type) => { | |||
wx.showModal({ | |||
title: '卡签解挂', | |||
content: '请确认是否执行卡签解挂操作', | |||
success: function(res) { | |||
if (res.confirm) { | |||
uni.$emit('queryCardlossStatus', { | |||
type: type | |||
}) | |||
navTo( | |||
`/after-sale/card-loss-reporting/cardloss?type=${type}` | |||
) | |||
} | |||
} | |||
}); | |||
} | |||
const choose = (data) => { | |||
if (!flag.includes(data)) { | |||
flag.push(data) | |||
console.log(flag); | |||
} else { | |||
flag.splice(flag.indexOf(data), 1) | |||
console.log(flag); | |||
} | |||
if (flag.length == 2) { | |||
type.value = '3' | |||
} else if (flag[0] == 1) { | |||
type.value = '1' | |||
} else { | |||
type.value = '2' | |||
} | |||
} | |||
const queryOrderDetail = (id) => { | |||
return new Promise(async (resolve, reject) => { | |||
const res = await request(orderDetail, { | |||
type: 2, | |||
data: { | |||
id: id | |||
}, | |||
method: "POST", | |||
showLoading: true, | |||
}); | |||
const data = stringToJson(res.bizContent); | |||
resolve(data); | |||
}).catch((error) => { | |||
reject(error); | |||
}); | |||
} | |||
const queryCardlossStatus = (val: any) => { | |||
var data = { | |||
cardId: state.data.cardId, | |||
obuId: state.data.obuId, | |||
operation: val, | |||
orderId: state.data.orderId | |||
}; | |||
const options = { | |||
type: 2, | |||
data: data, | |||
method: "POST", | |||
showLoading: true, | |||
}; | |||
return new Promise(async (resolve, reject) => { | |||
const res = await request(CardlossStatus, options); | |||
const data = stringToJson(res.bizContent); | |||
resolve(data); | |||
}).catch((error) => { | |||
reject(error); | |||
}); | |||
} | |||
</script> | |||
<style> | |||
page { | |||
width: 100%; | |||
height: 100%; | |||
background-color: #fff; | |||
} | |||
</style> | |||
<style lang="scss" scoped> | |||
.selectCar-box { | |||
// width: 100%; | |||
// height: 100%; | |||
padding: 30rpx; | |||
.title { | |||
font-size: 30rpx; | |||
font-family: Microsoft YaHei UI; | |||
font-weight: 400; | |||
color: #333333; | |||
margin-bottom: 30rpx; | |||
} | |||
.details { | |||
.title { | |||
font-size: 30rpx; | |||
font-family: Microsoft YaHei UI; | |||
font-weight: 400; | |||
color: #333333; | |||
margin-bottom: 30rpx; | |||
} | |||
.details-item { | |||
display: flex; | |||
font-size: 26rpx; | |||
font-family: Noto Sans S Chinese; | |||
font-weight: 400; | |||
color: #999999; | |||
margin-bottom: 30rpx; | |||
text { | |||
font-size: 26rpx; | |||
font-family: Noto Sans S Chinese; | |||
font-weight: 400; | |||
color: #333333; | |||
} | |||
} | |||
} | |||
.card { | |||
height: 150rpx; | |||
background: #FFFFFF; | |||
box-shadow: 0rpx 4rpx 13rpx 3rpx rgba(223, 223, 223, 0.8); | |||
border-radius: 20rpx; | |||
padding: 30rpx; | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
margin-bottom: 60rpx; | |||
.card-left { | |||
display: flex; | |||
align-items: center; | |||
image { | |||
width: 100rpx; | |||
height: 90rpx; | |||
} | |||
.card-center { | |||
margin-left: 30rpx; | |||
.card-center-head { | |||
font-size: 32rpx; | |||
font-family: Noto Sans S Chinese; | |||
font-weight: 400; | |||
color: #333333; | |||
} | |||
.tips { | |||
font-size: 26rpx; | |||
font-family: Noto Sans S Chinese; | |||
font-weight: 400; | |||
color: #666666; | |||
.tips-card { | |||
width: 70rpx; | |||
height: 40rpx; | |||
background: #D3F2EF; | |||
border-radius: 6rpx; | |||
font-size: 20rpx; | |||
font-family: Noto Sans S Chinese; | |||
font-weight: 400; | |||
color: #0A8F8A; | |||
padding: 5rpx 10rpx; | |||
margin-left: 20rpx; | |||
} | |||
} | |||
} | |||
} | |||
.choose-item { | |||
margin-right: 20rpx; | |||
width: 50rpx; | |||
height: 50rpx; | |||
border: 1rpx solid #00B38B; | |||
border-radius: 50%; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
.active { | |||
width: 38rpx; | |||
height: 38rpx; | |||
background: #00B38B; | |||
border-radius: 50%; | |||
} | |||
} | |||
} | |||
.remark { | |||
font-size: 26rpx; | |||
font-family: Microsoft YaHei UI; | |||
font-weight: 400; | |||
color: #666666; | |||
text-indent: 30rpx; | |||
margin-bottom: 30rpx; | |||
} | |||
.submit { | |||
margin-top: 100rpx; | |||
width: 670rpx; | |||
height: 80rpx; | |||
background: linear-gradient(-90deg, #43A1E0 0%, #13E7C1 100%); | |||
border-radius: 40rpx; | |||
font-size: 32rpx; | |||
font-family: Noto Sans S Chinese; | |||
font-weight: 400; | |||
color: #FFFFFF; | |||
line-height: 80rpx; | |||
} | |||
} | |||
</style> |
@@ -1,161 +1,167 @@ | |||
<template> | |||
<view class="formBox"> | |||
<view class="from_item"> | |||
<text class="label">账号验证</text> | |||
<input type="text" placeholder="输入验证码" v-model="model1.uname" placeholder-style="color:#000"> | |||
</view> | |||
<view class="from_item"> | |||
<text class="label">手机号码</text> | |||
<input type="text" placeholder="" v-model="model1.phone" placeholder-style="color:#000" disabled="true"> | |||
</view> | |||
<view class="from_item"> | |||
<text class="label">验证码</text> | |||
<input type="text" placeholder="请输入验证码" placeholder-style="color:#000"> | |||
<text class="btn" @click="getCode">获取验证码</text> | |||
</view> | |||
<button class="submit" @click="submit">验证</button> | |||
</view> | |||
</template> | |||
<script setup lang="ts"> | |||
import { | |||
reactive,ref | |||
} from "vue"; | |||
import { | |||
navTo | |||
} from "@/utils/utils" | |||
import { | |||
CardlossStatus | |||
} from "@/utils/network/api.js" | |||
import { | |||
onLoad, | |||
onShow | |||
} from "@dcloudio/uni-app"; | |||
import { | |||
stringToJson | |||
} from "../../utils/network/encryption.js"; | |||
import { | |||
request | |||
} from "../../utils/network/request.js"; | |||
let model1 = reactive({ | |||
uname: '输入验证码', | |||
phone: '135****9090', | |||
code: '' | |||
}) | |||
const getCode = () => { | |||
console.log(123); | |||
} | |||
const type=ref('') | |||
onLoad((options:any) => { | |||
console.log(options, "传参"); | |||
type.value=options.type | |||
}) | |||
// 卡签挂失/解除挂失 | |||
const changeCardstatus = (type) => { | |||
//参数说明 | |||
let options = { | |||
type: 2, //type: 2,JSON格式提交数据(默认表单形式提交) | |||
data: { | |||
cardId: '', //卡号 | |||
obuId: "", //签号 | |||
operation: "4", //1-卡挂失, 2-牵挂失, 3-卡签挂失, 4-卡解挂 ,5-签解挂 | |||
orderId: '20230225155521777646302', //订单编号 | |||
}, //请求参数 | |||
method: "POST", //提交方式(默认POST) | |||
showLoading: true, //是否显示加载中(默认显示) | |||
}; | |||
//调用方式 | |||
request(CardlossStatus, options) | |||
.then((res) => { | |||
stringToJson(res.bizContent) | |||
if(stringToJson(res.statusCode)==0){ | |||
navTo('/after-sale/card-loss-reporting/card-result') | |||
} | |||
}) | |||
.catch((err) => { | |||
console.log(err); | |||
}); | |||
} | |||
const submit = () => { | |||
console.log("111"); | |||
changeCardstatus(type.value) | |||
// navTo('/after-sale/card-loss-reporting/card-result') | |||
} | |||
</script> | |||
<style> | |||
page { | |||
width: 100%; | |||
height: 100%; | |||
} | |||
</style> | |||
<style lang="scss" scoped> | |||
.formBox { | |||
height: 90%; | |||
width: 100%; | |||
// background-color: red; | |||
.from_item { | |||
padding: 30rpx; | |||
padding-top: 60rpx; | |||
position: relative; | |||
.label { | |||
font-size: 28rpx; | |||
font-family: Microsoft YaHei; | |||
font-weight: 400; | |||
color: #777777; | |||
} | |||
input { | |||
font-size: 32rpx; | |||
font-family: Microsoft YaHei; | |||
font-weight: 400; | |||
color: #333333; | |||
line-height: 58rpx; | |||
border-bottom: 1rpx solid #DCDCDC; | |||
margin-top: 50rpx; | |||
padding-bottom: 10rpx; | |||
} | |||
.btn { | |||
position: absolute; | |||
right: 45rpx; | |||
bottom: 48rpx; | |||
background: transparent; | |||
font-size: 30rpx; | |||
color: #15E5C1; | |||
z-index: 999; | |||
} | |||
} | |||
.submit { | |||
background: linear-gradient(to left, #43A1E0 0%, #13E7C1 100%); | |||
width: 670rpx; | |||
height: 80rpx; | |||
line-height: 80rpx; | |||
color: #fff; | |||
border-radius: 100rpx; | |||
position: fixed; | |||
bottom: 100rpx; | |||
left: 50%; | |||
transform: translate(-50%); | |||
font-size: 32rpx; | |||
font-family: Microsoft YaHei; | |||
font-weight: 400; | |||
color: #FFFFFF; | |||
line-height: 80rpx; | |||
} | |||
} | |||
<template> | |||
<view class="formBox"> | |||
<view class="from_item"> | |||
<text class="label">账号验证</text> | |||
</view> | |||
<view class="from_item"> | |||
<text class="label">手机号码</text> | |||
<input type="text" placeholder="" v-model="model.mobile" placeholder-style="color:#000" disabled="true"> | |||
</view> | |||
<view class="from_item"> | |||
<text class="label">验证码</text> | |||
<input type="text" placeholder="请输入验证码" v-model="model.code" placeholder-style="color:#000"> | |||
<text class="btn" @click="getCode">获取验证码</text> | |||
</view> | |||
<button class="submit" @click="submit">验证</button> | |||
</view> | |||
</template> | |||
<script setup lang="ts"> | |||
import { | |||
reactive, | |||
ref | |||
} from "vue"; | |||
import { | |||
navTo | |||
} from "@/utils/utils" | |||
import { | |||
onLoad, | |||
onShow | |||
} from "@dcloudio/uni-app"; | |||
import { | |||
stringToJson | |||
} from "../../utils/network/encryption.js"; | |||
import { | |||
request | |||
} from "../../utils/network/request.js"; | |||
import { | |||
sendCode, | |||
checkCode | |||
} from "@/utils/network/api.js"; | |||
const type = ref('') | |||
let model = reactive({ | |||
code: '', | |||
mobile: '', | |||
}) | |||
const getCode = () => { | |||
const options = { | |||
type: 2, | |||
data: { | |||
mobile: model.mobile | |||
}, | |||
method: "POST", | |||
showLoading: true, | |||
}; | |||
request(sendCode, options) | |||
.then((res) => { | |||
msg("验证码发送成功!"); | |||
}) | |||
.catch((err) => { | |||
console.log(err); | |||
}); | |||
} | |||
onLoad((options: any) => { | |||
type.value = options.type | |||
}) | |||
const submit = () => { | |||
const options = { | |||
type: 2, | |||
data: { | |||
mobile: model.mobile, | |||
code: model.code | |||
}, | |||
method: "POST", | |||
showLoading: true, | |||
}; | |||
request(checkCode, options) | |||
.then((res) => { | |||
uni.$emit('queryCardlossStatus', { | |||
type: type.value | |||
}) | |||
}) | |||
.catch((err) => { | |||
console.log(err); | |||
}); | |||
} | |||
</script> | |||
<style> | |||
page { | |||
width: 100%; | |||
height: 100%; | |||
} | |||
</style> | |||
<style lang="scss" scoped> | |||
.formBox { | |||
height: 90%; | |||
width: 100%; | |||
// background-color: red; | |||
.from_item { | |||
padding: 30rpx; | |||
padding-top: 60rpx; | |||
position: relative; | |||
.label { | |||
font-size: 28rpx; | |||
font-family: Microsoft YaHei; | |||
font-weight: 400; | |||
color: #777777; | |||
} | |||
input { | |||
font-size: 32rpx; | |||
font-family: Microsoft YaHei; | |||
font-weight: 400; | |||
color: #333333; | |||
line-height: 58rpx; | |||
border-bottom: 1rpx solid #DCDCDC; | |||
margin-top: 50rpx; | |||
padding-bottom: 10rpx; | |||
} | |||
.btn { | |||
position: absolute; | |||
right: 45rpx; | |||
bottom: 48rpx; | |||
background: transparent; | |||
font-size: 30rpx; | |||
color: #15E5C1; | |||
z-index: 999; | |||
} | |||
} | |||
.submit { | |||
background: linear-gradient(to left, #43A1E0 0%, #13E7C1 100%); | |||
width: 670rpx; | |||
height: 80rpx; | |||
line-height: 80rpx; | |||
color: #fff; | |||
border-radius: 100rpx; | |||
position: fixed; | |||
bottom: 100rpx; | |||
left: 50%; | |||
transform: translate(-50%); | |||
font-size: 32rpx; | |||
font-family: Microsoft YaHei; | |||
font-weight: 400; | |||
color: #FFFFFF; | |||
line-height: 80rpx; | |||
} | |||
} | |||
</style> |
@@ -1,98 +1,171 @@ | |||
<template> | |||
<view class="selectCar-box"> | |||
<view class="item" v-for="(item,i) in list" :key="i"> | |||
<view class="iten-left"> | |||
<image :src="`${$imgUrl}che.png`" mode=""></image> | |||
<text>{{item.name}}</text> | |||
</view> | |||
<view class="choose-item" @click="choose(i,item)"> | |||
<view class="active" v-if="flag==i"> | |||
</view> | |||
</view> | |||
</view> | |||
</view> | |||
</template> | |||
<script lang="ts" setup> | |||
import {reactive,ref} from"vue" | |||
import {navTo} from "@/utils/utils" | |||
const list=reactive([ | |||
{name:"A12345"}, | |||
{name:"B12345"}, | |||
{name:"C12345"}, | |||
]) | |||
const flag=ref('0') | |||
const choose=(i,item)=>{ | |||
flag.value=i | |||
console.log("选择得数据",item); | |||
navTo('/after-sale/card-loss-reporting/cardloss-confirm') | |||
} | |||
</script> | |||
<style> | |||
page { | |||
width: 100%; | |||
height: 100%; | |||
background-color: #EEF7F7; | |||
} | |||
</style> | |||
<style lang="scss" scoped> | |||
.selectCar-box { | |||
// width: 100%; | |||
height: 100%; | |||
padding: 30rpx; | |||
.item { | |||
padding: 20rpx; | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
height: 130rpx; | |||
background: #FFFFFF; | |||
box-shadow: 0rpx 2rpx 6rpx 0rpx rgba(223, 223, 223, 0.8); | |||
border-radius: 20rpx; | |||
margin-bottom: 30rpx; | |||
.iten-left { | |||
display: flex; | |||
align-items: center; | |||
image { | |||
width: 150rpx; | |||
height: 90rpx; | |||
} | |||
text { | |||
margin-left: 20rpx; | |||
font-size: 32rpx; | |||
font-family: Noto Sans S Chinese; | |||
font-weight: 400; | |||
color: #333333; | |||
} | |||
} | |||
.choose-item{ | |||
width: 44rpx; | |||
height: 44rpx; | |||
background: #FFFFFF; | |||
border: 2rpx solid #00B38B; | |||
border-radius: 50%; | |||
margin-right: 20rpx; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
box-sizing: content-box; | |||
} | |||
.active{ | |||
width: 34rpx; | |||
height: 34rpx; | |||
background: #00B38B; | |||
border-radius: 50%; | |||
} | |||
} | |||
} | |||
<template> | |||
<view class="selectCar-box"> | |||
<view v-if="state.list.length>0" @click="choose(i,item)" class="item" v-for="(item,i) in state.list" :key="i"> | |||
<view class="iten-left"> | |||
<image :src="`${$imgUrl}che.png`" mode=""></image> | |||
<text>{{item.vehiclePlate}}</text> | |||
</view> | |||
<view class="choose-item"> | |||
<view class="active" v-if="flag==i"> | |||
</view> | |||
</view> | |||
</view> | |||
<view v-else class="flex"> | |||
暂无车辆订单信息 | |||
</view> | |||
</view> | |||
</template> | |||
<script lang="ts" setup> | |||
import { | |||
reactive, | |||
ref | |||
} from "vue" | |||
import { | |||
navTo | |||
} from "@/utils/utils" | |||
import { | |||
onLoad, | |||
onShow | |||
} from "@dcloudio/uni-app"; | |||
import { | |||
orderList | |||
} from "@/utils/network/api.js"; | |||
import { | |||
request | |||
} from "@/utils/network/request.js"; | |||
import { | |||
msg | |||
} from "@/utils/utils"; | |||
import { | |||
getItem, | |||
StorageKeys, | |||
setItem | |||
} from "@/utils/storage"; | |||
import { | |||
stringToJson | |||
} from "@/utils/network/encryption"; | |||
const state = reactive({ | |||
list: [] | |||
}); | |||
onLoad(() => { | |||
quanCheckActionTrue().then((item: any) => { | |||
state.list = item.data | |||
console.log(item) | |||
}) | |||
}); | |||
const quanCheckActionTrue = () => { | |||
var data = { | |||
opId: getItem(StorageKeys.OpenId), | |||
source: 'WECHAT', | |||
tabIndex: '0', | |||
orderStep: '11', | |||
isValueCard: '2' | |||
}; | |||
const options = { | |||
type: 2, | |||
data: data, | |||
method: "POST", | |||
showLoading: true, | |||
}; | |||
return new Promise(async (resolve, reject) => { | |||
const res = await request(orderList, options); | |||
const data = stringToJson(res.bizContent); | |||
resolve(data); | |||
}).catch((error) => { | |||
reject(error); | |||
}); | |||
} | |||
const list = reactive([{ | |||
name: "A12345" | |||
}, | |||
{ | |||
name: "B12345" | |||
}, | |||
{ | |||
name: "C12345" | |||
}, | |||
]) | |||
const flag = ref('0') | |||
const choose = (i, item) => { | |||
console.log(item.cardId) | |||
navTo(`/after-sale/card-loss-reporting/cardloss-confirm?id=${item.id}`) | |||
} | |||
</script> | |||
<style> | |||
page { | |||
width: 100%; | |||
height: 100%; | |||
background-color: #EEF7F7; | |||
} | |||
</style> | |||
<style lang="scss" scoped> | |||
.flex { | |||
display: flex; | |||
justify-content: center; | |||
} | |||
.selectCar-box { | |||
// width: 100%; | |||
height: 100%; | |||
padding: 30rpx; | |||
.item { | |||
padding: 20rpx; | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
height: 130rpx; | |||
background: #FFFFFF; | |||
box-shadow: 0rpx 2rpx 6rpx 0rpx rgba(223, 223, 223, 0.8); | |||
border-radius: 20rpx; | |||
margin-bottom: 30rpx; | |||
.iten-left { | |||
display: flex; | |||
align-items: center; | |||
image { | |||
width: 150rpx; | |||
height: 90rpx; | |||
} | |||
text { | |||
margin-left: 20rpx; | |||
font-size: 32rpx; | |||
font-family: Noto Sans S Chinese; | |||
font-weight: 400; | |||
color: #333333; | |||
} | |||
} | |||
.choose-item { | |||
width: 44rpx; | |||
height: 44rpx; | |||
background: #FFFFFF; | |||
border: 2rpx solid #00B38B; | |||
border-radius: 50%; | |||
margin-right: 20rpx; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
box-sizing: content-box; | |||
} | |||
.active { | |||
width: 34rpx; | |||
height: 34rpx; | |||
background: #00B38B; | |||
border-radius: 50%; | |||
} | |||
} | |||
} | |||
</style> |
@@ -0,0 +1,45 @@ | |||
//车辆类型 | |||
export const etcCardStatus = [ | |||
{ | |||
id: 0, | |||
title: '申请' | |||
}, | |||
{ | |||
id: 1, | |||
title: '正常' | |||
}, | |||
{ | |||
id: 2, | |||
title: '有卡挂起' | |||
}, | |||
{ | |||
id: 3, | |||
title: '无卡挂起' | |||
}, | |||
{ | |||
id: 4, | |||
title: '有卡注销' | |||
}, | |||
{ | |||
id: 5, | |||
title: '无卡注销' | |||
}, | |||
{ | |||
id: 6, | |||
title: '卡挂失' | |||
}, | |||
{ | |||
id: 9, | |||
title: '预注销' | |||
}, | |||
{ | |||
id: 99, | |||
title: '已删除' | |||
} | |||
]; | |||
//获取车辆类型 | |||
export const getEtcCardStatus = (id) => { | |||
let types = etcCardStatus.filter(item => item.id == id); | |||
return types[0].title | |||
} | |||
@@ -0,0 +1,60 @@ | |||
//车辆类型 | |||
export const obuStatus = [{ | |||
id: 0, | |||
title: '未安装' | |||
}, | |||
{ | |||
id: 1, | |||
title: '正常' | |||
}, | |||
{ | |||
id: 2, | |||
title: '有签挂起' | |||
}, | |||
{ | |||
id: 3, | |||
title: '无签挂起' | |||
}, | |||
{ | |||
id: 4, | |||
title: '有签注销' | |||
}, | |||
{ | |||
id: 5, | |||
title: '无签注销' | |||
}, | |||
{ | |||
id: 6, | |||
title: '标签挂失' | |||
}, | |||
{ | |||
id: 7, | |||
title: '已过户' | |||
}, | |||
{ | |||
id: 8, | |||
title: '维修中' | |||
}, | |||
{ | |||
id: 9, | |||
title: '发行申请' | |||
}, | |||
{ | |||
id: 10, | |||
title: '车型不符' | |||
}, | |||
{ | |||
id: 11, | |||
title: '已发行' | |||
}, | |||
{ | |||
id: 99, | |||
title: '已删除' | |||
} | |||
]; | |||
//获取车辆类型 | |||
export const getObuStatus = (id) => { | |||
let types = obuStatus.filter(item => item.id == id); | |||
return types[0].title | |||
} |
@@ -2,8 +2,8 @@ | |||
export const appId = "52030131"; //应用appid 综合业务支撑平台使用 | |||
export const loginTime = 86400; //登录有效时间(单位s) 1天 | |||
export const wechatPayConfigId = "6a9a54bc01f6443faea7ffe132b19f6"; //支付配置编号 微信小程序支付 | |||
export const wechatAppID = "wx008c60533388527a"; //小程序APPid | |||
export const wechatSecret = "95197718b43b497f02732bd9f8011080"; //小程序AppSecret | |||
export const wechatAppID = "wx214b4f8de36a0181"; //小程序APPid | |||
export const wechatSecret = "125a44b60b00d7e8a3820cc4cbdbdae8"; //小程序AppSecret | |||
/*统一 会员平台*/ | |||
export const sendCode = "2"; //统一会员平台发送验证码接口 | |||
@@ -11,7 +11,8 @@ export const regist = "3"; // 统一会员平台个人账号注册 | |||
export const login = "4"; //统一会员平台个人账号手机号密码登录 | |||
export const loginCode = "55"; //统一会员平台个人账号手机号验证码登录 | |||
export const resetPwd = "52"; //会员平台个人账号修改密码手机号验证码接口 | |||
export const getToken = "5"; //统一会员平台登录确认接口(用于换取openId和token) | |||
export const getToken = "5"; //统一会员平台登录确认接口(用于换取openId和token) | |||
export const checkCode = "966"; //校验验证码 | |||
/*地址管理*/ | |||
export const addressQuery = "27"; //地址管理查询 |