qiubinghui
/
zhywpt-sp
Tarkkaile 1
Äänestä 0
Fork 0
Koodi Ongelmat 0 Pull-pyynnöt 0 Julkaisut 0 Wiki Activity
Selaa lähdekoodia

[Feature]完成设备OBU增补

yxb
杨毅 2 vuotta sitten
vanhempi
e5b3289a8e
commit
23ddd32f44
9 muutettua tiedostoa jossa 1117 lisäystä ja 539 poistoa
Jaettu näkymä Näytä diff tilastot
  1. 309
    289
      after-sale/additional-equipment/additional-equipment-confirm.vue
  2. 522
    106
      after-sale/additional-equipment/additional-equipment-verification.vue
  3. 82
    100
      after-sale/additional-equipment/result.vue
  4. 159
    0
      after-sale/additional-equipment/select-car.vue
  5. 26
    29
      after-sale/replace-equipment/verification.vue
  6. 0
    2
      applyCard/release-products.vue
  7. 9
    2
      pages.json
  8. 1
    1
      pages/service/service.vue
  9. 9
    10
      utils/network/api.js

+ 309
- 289
after-sale/additional-equipment/additional-equipment-confirm.vue Näytä tiedosto

@@ -1,290 +1,310 @@
<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">
<!-- 有效期：xxxx-xx-xx -->
</view>
</view>
<!-- <view class="title">
OBU设备信息
</view>
<view class="card">
<view class="card-left">
<image src="../../static/image/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">
有效期：xxxx-xx-xx
</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 toPage = () => {
console.log(11);
navTo('/after-sale/additional-equipment/additional-equipment-verification')
// wx.showModal({
// title: '提示',
// content: '检测到当前只有ETC卡，需要办理obu设备才可以通行，是否前往办理，无需办理点击继续注销',
// confirmText: '继续注销',
// cancelText: '前往办理',
// success: function(res) {
// if (res.confirm) {
// console.log('用户点击确定');
// navTo('/after-sale/ETC-log-off/etc-log-off')
// } else if (res.cancel) {
// console.log('用户点击取消');
// // navTo('/after-sale/card-loss-reporting/cardloss')
// }
// }
// });


}

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);
}
}
</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;
font-size: 25rpx;
align-self: end;

.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="">
<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>
</view>
<view class="">
<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>
</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,
cckChangejzCard
} 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,
},
type: undefined
});
/*视图进入后操作*/
onLoad((option) => {
queryOrderDetail(option.id).then((val: any) => {
state.data = val
})
});
onUnload(() => {
});
/*下一步*/
const nextACtion = () => {
navTo(
`/after-sale/additional-equipment/additional-equipment-verification?orderId=${state.data.orderId}&&cardId=${state.data.cardId}&&mobile=${state.data.customerTel}`
)
}
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);
});
}
</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>

+ 522
- 106
after-sale/additional-equipment/additional-equipment-verification.vue Näytä tiedosto

@@ -1,107 +1,523 @@
<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
} from "vue";
import {
navTo
} from "@/utils/utils"
let model1 = reactive({
uname: '输入验证码',
phone: '135****9090',
code: ''
})

const getCode = () => {
console.log(123);
}
const submit=()=>{
console.log("111");
navTo('/after-sale/additional-equipment/base-change-people')
}
</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="oderPage">
<view v-if="form.receiveMethodName==='邮寄'" class="addr-box">
<view class="addr-box-left">
<view class="text-image">{{form.customerName.charAt(0)}} </view>
<view class="content">
<view class="">
<text class="item1">{{form.customerName}}</text>
<text class="item2">{{form.customerTel}}</text>
<text class="item3">默认</text>
</view>
<view class=""> {{form.area +form.address}}</view>
</view>
</view>
<view class="edit">
<image :src="`${$imgUrl}applyCard/edit.png`" mode=""></image>
</view>
</view>
<u-form :model="form" ref="myForm" :error-type="errorType">
<view class="from">
<u-form-item prop="cardState">
<view class="from_item">
<text><text style="color: red">*</text>是否邮寄：</text>
<u-radio-group v-model="form.receiveMethodName">
<u-radio :customStyle="{ marginBottom: '8px' }" activeColor="#2CE242"
v-for="(item, index) in radiolist1" :key="index" :label="item.disabled"
:name="item.name">
{{ item.name }}
</u-radio>
</u-radio-group>
</view>
</u-form-item>
<u-form-item prop="phone">
<view class="from_item" style="background-color: #f7f7f7">
<text><text style="color: red"></text>手机号：</text>
<u-input v-model="form.mobile" :disabled="true" class="input" />
</view>
</u-form-item>
<u-form-item prop="code">
<view class="from_item">
<text><text style="color: red"></text>验证码：</text>
<u-input v-model="form.code" placeholder="请输入验证码" class="input" />
<view class="hint2">
<view class="green">{{ codeDuration === 0 ? "" : codeDuration }}</view>
<view class="grey" @click="getCode">{{
codeDuration === 0 ? "发送验证码" : "秒后可重发"
}}</view>
</view>
</view>
</u-form-item>
</view>
</u-form>
<button style="margin-top: 50rpx;" class="submit" @click="toPage()">OBU增补申请</button>
</view>
</template>
<script setup lang="ts">
import navBar from "./components/nav-bar.vue";
import {
checkStr
} from "@/utils/utils";
import {
ref,
reactive
} from "vue";
import {
navTo
} from "../../utils/utils";
import {
onReady,
onLoad
} from "@dcloudio/uni-app";
import {
request
} from "../../utils/network/request.js";
import {
getItem,
StorageKeys
} from "@/utils/storage";
import {
sendCode,
checkCode,
addressQuery,
queryOBUAdd,
wechatPayConfigId
} from "@/utils/network/api.js";
import {
stringToJson
} from "@/utils/network/encryption";
import {
msg
} from "@/utils/utils";
// 表单数据
const form = reactive({
receiveMethod: "0",
receiveMethodName: '不邮寄',
customerName: '',
customerTel: '',
mobile: "",
code: '',
address: '',
area: '',
postCode: ''
});
const apply = reactive({
data: {
status: undefined,
id: ''
}
});
//入参
const params = reactive({
cardId: '',
obuId: '',
orderId: ''
});
// 单选数据列表
const radiolist1 = reactive([{
name: "不邮寄",
disabled: false,
},
{
name: "邮寄",
disabled: false,
},
]);
// 单选数据列表
const radiolist2 = reactive([{
name: "人为损坏",
disabled: false,
},
{
name: "自然损坏",
disabled: false,
}
]);
// 验证规则
const rules = {
code: [{
required: true,
message: "请输入验证码",
trigger: ["change", "blur"],
}],
};
// 验证提示类型(toast要版本为1.3.5才支持)
const errorType = ["toast"];
// 设置验证规则
const myForm = ref(null);
//倒计时时常
const codeDuration = ref(0);
let interval = null;
const address = reactive({
list: []
}); //地址list
/* 验证码倒计时 */
const codeInterval = () => {
codeDuration.value = 60;
interval = setInterval(() => {
codeDuration.value--;
if (codeDuration.value === 0) {
if (interval) {
clearInterval(interval);
interval = null;
}
}
}, 1000);
};
onReady(() => {
myForm.value.setRules(rules);
});
onLoad((option) => {
form.mobile = option.mobile
params.cardId = option.cardId
params.orderId = option.orderId
getAddressList()
});
const getAddressList = () => {
var data = {
openId: getItem(StorageKeys.OpenId),
};
const options = {
type: 2,
data: data,
method: "POST",
showLoading: true,
};
request(addressQuery, options).then((res) => {
const data = stringToJson(res.bizContent);
address.list = data.data;
if (address.list.length > 0) {
var defaultAddress = address.list[0]
form.customerName = defaultAddress.consignee
form.customerTel = defaultAddress.consigneeTel
form.address = defaultAddress.address
form.area = defaultAddress.region
form.postCode = defaultAddress.postalCode
}
});
};
const getCode = () => {
if (codeDuration.value !== 0) {
return;
}
const options = {
type: 2,
data: {
mobile: form.mobile
},
method: "POST",
showLoading: true,
};
request(sendCode, options)
.then((res) => {
codeInterval();
msg("验证码发送成功！");
})
.catch((err) => {
console.log(err);
});
}
//申请
const queryOBUAddAction = () => {
if (form.receiveMethodName === '不邮寄') {
form.receiveMethod = '0'
} else {
form.receiveMethod = '1'
}
var data = {
orderId: params.orderId,
openId: getItem(StorageKeys.OpenId),
configId: wechatPayConfigId,
receiveMethod: form.receiveMethod,
customerName: form.customerName,
customerTel: form.customerTel,
address: form.address,
area: form.area,
postCode: form.postCode
};
const options = {
type: 2,
data: data,
method: "POST",
showLoading: true,
};
return new Promise(async (resolve, reject) => {
const res = await request(queryOBUAdd, options);
const data = stringToJson(res.bizContent);
resolve(data);
}).catch((error) => {
reject(error);
});
}
//下一步
const toPage = () => {
myForm.value.validate((valid) => {
if (valid) {
const options = {
type: 2,
data: {
mobile: form.mobile,
code: form.code
},
method: "POST",
showLoading: true,
};
request(checkCode, options)
.then(() => {
queryOBUAddAction().then(val => {
navTo(
`/after-sale/additional-equipment/result`
)
})
})
.catch((err) => {
console.log(err);
});
} else {
console.log("验证未通过");
}
});
};
</script>
<style>
page {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
background-color: ##eef7f7;
}
</style>
<style lang="scss" scoped>
.hint2 {
display: flex;
.green {
font-size: 28rpx;
color: #00b38b;
}
.grey {
font-size: 24rpx;
color: #000000;
margin-left: 16rpx;
}
}
.addr-box {
margin-top: 20rpx;
display: flex;
background: #fff;
padding: 30rpx;
justify-content: space-between;
align-items: center;
.addr-box-left {
display: flex;
.text-image {
width: 68rpx;
height: 68rpx;
background: #00b38b;
border-radius: 50%;
text-align: center;
font-size: 26rpx;
font-family: Microsoft YaHei;
font-weight: 400;
color: #ffffff;
line-height: 68rpx;
margin-right: 30rpx;
}
.content {
view {
font-size: 26rpx;
font-family: Microsoft YaHei;
font-weight: 400;
color: #333333;
.item1 {
font-size: 30rpx;
font-family: Microsoft YaHei;
font-weight: 400;
color: #333333;
}
.item2 {
font-size: 24rpx;
font-family: Microsoft YaHei;
font-weight: 400;
color: #999999;
margin-left: 10rpx;
}
.item3 {
width: 71rpx;
height: 37rpx;
background: #ffffff;
border: 1px solid #ff8000;
border-radius: 6rpx;
font-size: 22rpx;
font-family: Microsoft YaHei;
font-weight: 400;
color: #ff8000;
padding: 3rpx 6rpx;
margin-left: 10rpx;
}
}
}
}
.edit {
image {
width: 50rpx;
height: 50rpx;
}
}
}
.oderPage {
flex: 1;
width: 100%;
.from1 {
background-color: #fff;
margin-top: 30rpx;
padding: 0 30rpx;
::v-deep .uni-forms-item {
border-bottom: 1rpx solid #ccc;
padding: 15rpx 0;
margin-bottom: 0;
.uni-forms-item__label {
font-size: 28rpx;
height: 50rpx;
}
.uni-forms-item__content {
display: flex;
}
.uni-easyinput__content-input {
font-size: 28rpx;
height: 50rpx;
}
}
.btn {
line-height: 38rpx;
font-size: 24rpx;
font-family: Microsoft YaHei;
font-weight: 400;
color: #ffffff;
background: #00b38b;
border-radius: 10rpx;
padding: 10rpx 15rpx;
}
}
.from {
background-color: #fff;
margin-top: 30rpx;
padding: 0 30rpx;
::v-deep .u-form-item {
padding: 0;
line-height: normal;
.u-form-item__message {
margin-bottom: 12rpx;
}
}
.from_item {
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
height: 80rpx;
border-bottom: 1rpx solid #dcdcdc;
.btn {
font-size: 24rpx;
font-family: Microsoft YaHei;
font-weight: 400;
color: #ffffff;
background: #00b38b;
border-radius: 10rpx;
padding: 10rpx 15rpx;
}
::v-deep .input {
text-align: left;
flex: 1;
input {
text-align: left;
}
}
}
.from_item1 {
display: flex;
flex-wrap: nowrap;
flex-direction: column;
justify-content: space-between;
padding: 30rpx;
border-bottom: #dcdcdc 1px solid;
input {
text-align: right;
}
.textarea {
background-color: #f1f1f1;
width: 100%;
border-radius: 20rpx;
margin-top: 10rpx;
text-indent: 1rem;
height: 180rpx;
padding: 20rpx;
box-sizing: border-box;
}
}
}
}
.submit {
background: linear-gradient(to left, #43a1e0 0%, #13e7c1 100%);
width: 670rpx;
height: 80rpx;
color: #fff;
border-radius: 100rpx;
font-size: 32rpx;
}
</style>

+ 82
- 100
after-sale/additional-equipment/result.vue Näytä tiedosto

@@ -1,101 +1,83 @@
<template>
<view class="oderPage">
<view class="content">
<image :src="`${$imgUrl}ETCcancellation/bg1.png`" mode=""></image>
<view class="title">
办理成功
</view>
<view class="">
您办理的增补设备业务已生成订单
</view>
</view>
</view>
<button class="submit" @click="submit">查看订单</button>
</template>

<script setup lang="ts">
import navBar from "./components/nav-bar.vue"
import {
ref,
reactive
} from "vue";
import {
navTo
} from "@/utils/utils"
let model1 = reactive({
uname: '输入验证码',
phone: '135****9090',
code: ''
})

const getCode = () => {
console.log(123);
}
const submit=()=>{
console.log(11);
uni.reLaunch({
url: '/pages/service/service'
});
}
</script>


<style>
page {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
}
</style>
<style lang="scss" scoped>
.oderPage {
flex: 1;
width: 100%;

.content {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 130rpx;

image {
width: 390rpx;
height: 307rpx;
margin-bottom: 20rpx;
}

.title {
font-size: 38rpx;
font-weight: 600;
font-size: 40rpx;
font-family: Microsoft YaHei UI;
color: #2A2A2A;
}

view {
margin: 15rpx 0;
font-size: 28rpx;
font-family: Microsoft YaHei UI;
font-weight: 400;
color: #717171;
}
}
}

.submit {
background: linear-gradient(to left, #43A1E0 0%, #13E7C1 100%);
width: 670rpx;
height: 80rpx;
line-height: 80rpx;
font-size: 32rpx;
color: #fff;
border-radius: 100rpx;
position: fixed;
bottom: 60rpx;
left: 50%;
transform: translate(-50%);
}
<template>
<view class="oderPage">
<view class="content">
<image :src="`${$imgUrl}ETCcancellation/bg1.png`" mode=""></image>
<view class="title">
办理成功
</view>
<view class="">
您办理的增补OBU设备业务已完成
</view>
</view>
</view>
<button class="submit" @click="submit">返回</button>
</template>
<script setup lang="ts">
const submit = () => {
let routes = getCurrentPages();
uni.navigateBack({
delta: routes.length - 2
});
}
</script>
<style>
page {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
}
</style>
<style lang="scss" scoped>
.oderPage {
flex: 1;
width: 100%;
.content {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 130rpx;
image {
width: 390rpx;
height: 307rpx;
margin-bottom: 20rpx;
}
.title {
font-size: 38rpx;
font-weight: 600;
font-size: 40rpx;
font-family: Microsoft YaHei UI;
color: #2A2A2A;
}
view {
margin: 15rpx 0;
font-size: 28rpx;
font-family: Microsoft YaHei UI;
font-weight: 400;
color: #717171;
}
}
}
.submit {
background: linear-gradient(to left, #43A1E0 0%, #13E7C1 100%);
width: 670rpx;
height: 80rpx;
line-height: 80rpx;
font-size: 32rpx;
color: #fff;
border-radius: 100rpx;
position: fixed;
bottom: 60rpx;
left: 50%;
transform: translate(-50%);
}
</style>

+ 159
- 0
after-sale/additional-equipment/select-car.vue Näytä tiedosto

@@ -0,0 +1,159 @@
<template>
<view class="selectCar-box">
<view v-if="state.list&&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>
<empty title='暂无找到相关车辆信息' />
</view>
</view>
</template>
<script lang="ts" setup>
import empty from "@/components/empty/empty.vue";
import {
reactive,
ref
} from "vue"
import {
navTo
} from "@/utils/utils"
import {
onLoad,
} from "@dcloudio/uni-app";
import {
orderList
} from "@/utils/network/api.js";
import {
request
} from "@/utils/network/request.js";
import {
getItem,
StorageKeys,
} from "@/utils/storage";
import {
stringToJson
} from "@/utils/network/encryption";
const state = reactive({
list: [] //车辆list
});
const flag = ref('0') //默认选择0
onLoad(() => {
quanCheckActionTrue().then((item: any) => {
state.list = item.data
})
});
const quanCheckActionTrue = () => {
var data = {
opId: getItem(StorageKeys.OpenId),
source: 'WECHAT', //渠道为小程序
tabIndex: '0', //0全部
orderStep: '11', //11 为已完成”
};
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 choose = (i, item) => {
flag.value = i
navTo(`/after-sale/additional-equipment/additional-equipment-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>

+ 26
- 29
after-sale/replace-equipment/verification.vue Näytä tiedosto

@@ -49,7 +49,8 @@
</u-form>
<button style="margin-top: 50rpx;" class="submit" v-if="apply.data.status === 'APPLY'||!apply.data.status"
@click="toPage()">下一步填写资料</button>
<button style="margin-top: 30rpx;" class="submit" v-if="apply.data.status" @click="changeCardQueryCancleAction()">撤回申请</button>
<button style="margin-top: 30rpx;" class="submit" v-if="apply.data.status"
@click="changeCardQueryCancleAction()">撤回申请</button>
</view>
</template>
@@ -181,11 +182,7 @@
changeCardQueryAction().then(val => {
apply.data = val
apply.data.status = val.status;
})
});
const getCode = () => {
@@ -290,30 +287,30 @@
};
request(checkCode, options)
.then(() => {
if (apply.data.status === 'APPLY') {
navTo(
`/after-sale/replace-equipment/form?orderId=${params.orderId}&&id=${apply.data.id}`
)
} else {
if (form.applyTypeName === '卡') {
form.applyType = 'EXCHANGE_CARD'
} else if (form.applyTypeName === 'OBU') {
form.applyType = 'EXCHANGE_OBU'
} else if (form.applyTypeName === '卡和OBU') {
form.applyType = 'EXCHANGE_ALL'
}
if (form.damageModeName === '人为损坏') {
form.damageMode = '0'
} else if (form.damageModeName === '自然损坏') {
form.damageMode = '1'
}
queryCckChangejzCardAction().then(val => {
navTo(
`/after-sale/replace-equipment/form?orderId=${params.orderId}&&id=${val.id}`
)
})
}
if (apply.data.status === 'APPLY') {
navTo(
`/after-sale/replace-equipment/form?orderId=${params.orderId}&&id=${apply.data.id}`
)
} else {
if (form.applyTypeName === '卡') {
form.applyType = 'EXCHANGE_CARD'
} else if (form.applyTypeName === 'OBU') {
form.applyType = 'EXCHANGE_OBU'
} else if (form.applyTypeName === '卡和OBU') {
form.applyType = 'EXCHANGE_ALL'
}
if (form.damageModeName === '人为损坏') {
form.damageMode = '0'
} else if (form.damageModeName === '自然损坏') {
form.damageMode = '1'
}
queryCckChangejzCardAction().then(val => {
navTo(
`/after-sale/replace-equipment/form?orderId=${params.orderId}&&id=${val.id}`
)
})
}
})
.catch((err) => {

+ 0
- 2
applyCard/release-products.vue Näytä tiedosto

@@ -75,8 +75,6 @@
state.orderId = option.orderId;
state.clientFee = option.clientFee;
state.id = option.id;
state.data
var data = {};
const options = {
type: 2,

+ 9
- 2
pages.json Näytä tiedosto

@@ -305,18 +305,25 @@
"navigationBarTitleText": "ETC注销-支付",
"enablePullDownRefresh": false
}
},
{
"path": "additional-equipment/select-car",
"style": {
"navigationBarTitleText": "增补OBU-选车",
"enablePullDownRefresh": false
}
},
{
"path": "additional-equipment/additional-equipment-confirm",
"style": {
"navigationBarTitleText": "设备补增",
"navigationBarTitleText": "增补OBU-确认",
"enablePullDownRefresh": false
}
},
{
"path": "additional-equipment/additional-equipment-verification",
"style": {
"navigationBarTitleText": "设备补增-验证",
"navigationBarTitleText": "增补OBU-验证",
"enablePullDownRefresh": false
}
},

+ 1
- 1
pages/service/service.vue Näytä tiedosto

@@ -104,7 +104,7 @@
class="item-box"
@click="
toNext(
'/after-sale/additional-equipment/additional-equipment-confirm'
'/after-sale/additional-equipment/select-car'
)
"
>

+ 9
- 10
utils/network/api.js Näytä tiedosto

@@ -115,28 +115,27 @@ export const cckChangejzCardInfo = '95' //8.107.ASS-储值卡转记账卡填写
export const changeCardApply = '888' //换货/换卡签申请接口
export const changeCardQuery = '885' //换货/换卡签查询接口
export const changeCardQueryCancle = '884' //换货/换卡签取消查询接口

export const changeCardInfo = '887' //换货/换卡/填写信息接口
export const queryRefund= '924' //储值卡注销退费查询接口
export const queryRefundApply= '918' //储值卡注销余额补领申请接口
export const queryGuoHu= '47631d58945642afa053e07c306e99e6' //8.311.MTS-ASS-过户接口
export const queryGuoHuJianCe = '54dafed574f5475ea88b50eed9c58486'//8.312.ASS-过户检测接口
export const queryGuoHuCaoZuo = 'b1e66d22fb6f400f915458f5c50c7118'//8.312.ASS-过户检测接口
export const upLoadImg = "4a95e1d90e824ee8a50aa9826617e736"//CSMSN-激活照片上传
export const upLoadImg = "4a95e1d90e824ee8a50aa9826617e736"//CSMSN-激活照片上传
export const queryOBUAdd = "837c22e80fa34506a0855306d9cbb6f7"//增补OBU

// 资金服务
export const CardBillQuery= '917' //通行流水欠费补缴信息查询接口
export const CardBillPlaceOrder= '916' //通行流水欠费补缴支付下单接口
export const CardBillPayStatus= '915' //通行流水欠费补缴支付查询接口
export const passBills= "925"//BDS-车辆通行流水分页查询接口
export const passBillCount= "db62a6c55461498ab2f412868eea6d24"//BDS-账单合计接口
export const downloadBills= "558c8a96265445c78b59b4473ad01d42"//BDS-明细下载接口
// 资金服务
export const CardBillQuery= '917' //通行流水欠费补缴信息查询接口
export const CardBillPlaceOrder= '916' //通行流水欠费补缴支付下单接口
export const CardBillPayStatus= '915' //通行流水欠费补缴支付查询接口
export const passBills= "925"//BDS-车辆通行流水分页查询接口
export const passBillCount= "db62a6c55461498ab2f412868eea6d24"//BDS-账单合计接口
export const downloadBills= "558c8a96265445c78b59b4473ad01d42"//BDS-明细下载接口
export const cardList= "152"//BDS-卡信息查询接口
//圈层
export const quanCheck = "69"; //圈层检测
export const quanApply = "70"; //圈层申请

Write Preview
Loading…
Peruuta
Tallenna