Quellcode durchsuchen

激活图片上传

yxb
不甘寂寞 vor 2 Jahren
Ursprung
Commit
447e605c5b

+ 121
- 53
after-sale/activation/operation-upload.vue Datei anzeigen

@@ -9,7 +9,8 @@
</view>
<view class="item-right" @click="chooseImage(1)">
<view class="empty-node"></view>
<image :src="state.headstockImg ?? defHeadstockImg" :data-url="state.headstockImg ?? defHeadstockImg" ></image>
<image :src="state.headstockImg ?? defHeadstockImg" :data-url="state.headstockImg ?? defHeadstockImg">
</image>
</view>
</view>
<view class="item-row">
@@ -20,7 +21,7 @@
</view>
<view class="item-right" @click="chooseImage(2)">
<view class="empty-node"></view>
<image :src="state.installImg ?? defInstallImg" ></image>
<image :src="state.installImg ?? defInstallImg"></image>
</view>
</view>
<view class="hint">
@@ -28,79 +29,133 @@
<view>请打开手机蓝牙后再进行下一步操作。</view>
</view>
<view class="btn">
<submit-button @submit="gotoNextStep" title="下一步" ></submit-button>
<submit-button @submit="gotoNextStep" title="下一步"></submit-button>
</view>
</view>
</template>

<script lang="ts" setup>
import { reactive } from "vue";
import { msg, navTo } from '@/utils/utils';
import {fileURL} from "@/datas/fileURL.js";
<script setup>
import {
reactive
} from "vue";
import {
msg,
navTo
} from '@/utils/utils';
import {
fileURL
} from "@/datas/fileURL.js";
import {
getItem
} from "../../utils/storage";
const imgURL = `${fileURL}image/`;
import {
request
} from "../../utils/network/request.js";

import {
stringToJson
} from "../../utils/network/encryption.js";
import {
upLoadImg
} from "../../utils/network/api.js";
import {
onLoad
} from '@dcloudio/uni-app'
const height = uni.getSystemInfoSync().windowHeight
const defHeadstockImg = imgURL + "bluetooth/device-active-img1.png";
const defInstallImg = imgURL + "bluetooth/device-active-img2.png";
const state = reactive({
headstockImg:null, //车头照
installImg:null //安装照
headstockImg: null, //车头照
installImg: null, //安装照
id: null,
orderId: null,
openId: null,
});
onLoad(() => {
//读取传入 存储的数据orderInfo
let orderData = getItem("orderInfo");
state.id = orderData.id;
state.orderId = orderData.orderId;
state.openId = getItem("openId");
console.log(state);
})

//选择图片
const chooseImage = (type:number) => {
const chooseImage = (type) => {
uni.chooseImage({
count: 1,
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
//sourceType: ['album','camera'],
success: function (res) {
success: function(res) {
console.log(res.tempFilePaths);
if (type === 1) {//车头照

if (type === 1) { //车头照
state.headstockImg = res.tempFilePaths[0];
} else {//安装照
} else { //安装照
state.installImg = res.tempFilePaths[0];
}
}
});
}
//下一步
const gotoNextStep = ()=>{
if(!state.headstockImg || !state.installImg){
const gotoNextStep = () => {
if (!state.headstockImg || !state.installImg) {
msg('请按照要求上传图片!');
return;
}
uni.openBluetoothAdapter()
/* 判断是否打开蓝牙 */
uni.getBluetoothAdapterState({
success(res) {
//如果res.avaliable==false 说明没打开蓝牙 反之则打开
if (res.available == false) {
if (res.available == false) {
uni.showToast({
title: '请打开手机蓝牙',
icon:"error",
duration: 2000
title: '请打开手机蓝牙',
icon: "error",
duration: 2000
})
return
} else {
navTo('/pages/bluetooth/bluetooth?routeType=1')

const options = {
type: 2,
data: {
orderId: state.orderId,
vehicleHeadImgUrl: state.headstockImg,
installImgUrl: state.installImg,
orderSource: "WECHAT",
openId: state.openId,
},
method: "POST",
showLoading: true,
};
request(upLoadImg, options).then((res) => {
const data = stringToJson(res.bizContent);
console.log(data);
// state.form.vehBodyUrl = data.data.url;
navTo('/pages/bluetooth/bluetooth?routeType=1')
});

}
}
})
})
}
</script>

<style>
page{
page {
background: #F3F3F3;
}
</style>
<style lang="scss" scoped>
.main{
.main {
overflow: hidden;
.item-row{

.item-row {
width: calc(100% - 60rpx);
margin-left: 30rpx;
display: flex;
@@ -109,19 +164,22 @@
background: white;
padding: 30rpx;
border-radius: 20rpx;
box-shadow: 0rpx 4rpx 13rpx 3rpx rgba(223,223,223,0.8);
.item-left{
.title{
box-shadow: 0rpx 4rpx 13rpx 3rpx rgba(223, 223, 223, 0.8);

.item-left {
.title {
font-size: 34rpx;
color: #333;
font-weight: bold;
}
.desc{

.desc {
font-size: 24rpx;
color: #999;
margin: 10rpx 0;
}
.flag{

.flag {
width: 110rpx;
height: 45rpx;
line-height: 42rpx;
@@ -133,18 +191,21 @@
background: #D9F8F1;
}
}
.item-right{

.item-right {
width: 295rpx;
height: 188rpx;
position: relative;
image{

image {
position: relative;
z-index: 10;
width: 100%;
height: 188rpx;
}
&::before{
content:'';

&::before {
content: '';
position: absolute;
width: 22rpx;
height: 22rpx;
@@ -152,11 +213,12 @@
border-bottom: none;
border-right: none;
z-index: 0;
left:-4rpx;
left: -4rpx;
top: -4rpx;
}
&::after{
content:'';

&::after {
content: '';
position: absolute;
width: 22rpx;
height: 22rpx;
@@ -168,13 +230,15 @@
bottom: -4rpx;
}
}
.empty-node{

.empty-node {
position: absolute;
z-index: 0;
width: 100%;
height: 100%;
&::before{
content:'';

&::before {
content: '';
position: absolute;
width: 22rpx;
height: 22rpx;
@@ -182,11 +246,12 @@
border-left: none;
border-bottom: none;
z-index: 0;
right:-4rpx;
right: -4rpx;
top: -4rpx;
}
&::after{
content:'';

&::after {
content: '';
position: absolute;
width: 22rpx;
height: 22rpx;
@@ -199,7 +264,8 @@
}
}
}
.hint{

.hint {
display: flex;
flex-direction: row;
justify-content: center;
@@ -207,18 +273,20 @@
color: #666666;
padding: 0px 30rpx;
margin-top: 60rpx;
.icon{
.icon {
width: 36rpx;
height: 36rpx;
margin-right: 10rpx;
}
view{

view {
width: calc(100% - 36rpx);
}
}
.btn{
margin:60rpx 40rpx;

.btn {
margin: 60rpx 40rpx;
}
}
</style>

+ 6
- 5
composables/order/useOrderSkip.ts Datei anzeigen

@@ -7,16 +7,16 @@ export default function useOrderSkip(){
//根据订单类型 跳转到不同的订单详情页面
const gotoOrderDetails = (orderInfo) =>{
if(orderInfo.orderType === OrderTypes.新办发行){
if(orderInfo.orderType === 'ISSUE'){
navTo(`/orders/order-details-new?id=${orderInfo.id}&appraise=${orderInfo.appraise}`);
}else if(orderInfo.orderType == OrderTypes.同时换卡换签 || orderInfo.orderType == OrderTypes.更换卡 || orderInfo.orderType == OrderTypes.更换签){
}else if(orderInfo.orderType == OrderTypes.同时换卡换签 || orderInfo.orderType == 'REPLACEMENT_CARD' || orderInfo.orderType == 'REPLACEMENT_SIGNATURE'){
navTo(`/orders/order-details-card-sign?id=${orderInfo.id}&orType=${orderInfo.orderType}`);
}else if(orderInfo.orderType === OrderTypes.增补OBU){
}else if(orderInfo.orderType === 'SUPPLEMENT_OBU'){
navTo(`/orders/order-details-obu?id=${orderInfo.id}`);
}else if(orderInfo.orderType === OrderTypes.公务车增补OBU){
}else if(orderInfo.orderType === 'OFFICAL_SUPPLEMENT_OBU'){
navTo(`/orders/order-details-obu?id=${orderInfo.id}`);
}
else if(orderInfo.orderType === OrderTypes.ETC注销){
@@ -28,7 +28,7 @@ export default function useOrderSkip(){
}else if(orderInfo.orderType === OrderTypes.解除车牌占用){
navTo(`/orders/order-details-cancel-numberplate?id=${orderInfo.id}`);
}else if(orderInfo.orderType === OrderTypes.储值卡转记账卡){
}else if(orderInfo.orderType === 'EXCHANGE_CARD_TYPE'){
navTo(`/orders/order-details-recharge?id=${orderInfo.id}`);
}
}
@@ -60,6 +60,7 @@ export default function useOrderSkip(){
//继续申请、修改资料
const gotoEditUserOrUnitInfo = (orderInfo:any) =>{
console.log("******************",orderInfo.orderStep);
let url = '';
if(orderInfo.orderStep == OrderStatus.完成填写基本信息){
url = orderInfo.userType === 'PERSONAL_USER' ? '/applyCard/opening-account-people' : '/applyCard/opening-account-unit';

+ 2
- 2
pages/service/service.vue Datei anzeigen

@@ -50,13 +50,13 @@
</view>
<view class="text">卡签注销</view>
</view>
<view class="item-box">
<view class="item-box" style="display: none;">
<view class="item bg-blue" :style="{'--background':bgBlue}">
<image :src="`${$imgUrl}service/imgs/xxcx.png`" />
</view>
<view class="text">卡签信息重写</view>
</view>
<view class="item-box" @click="toNext('/after-sale/card-supplement/reissueForm')">
<view class="item-box" @click="toNext('/after-sale/card-supplement/reissueForm')" style="display: none;">
<view class="item bg-blue" :style="{'--background':bgBlue}">
<image :src="`${$imgUrl}service/imgs/hkhq.png`" />
</view>

+ 152
- 59
service/search/etcFlowingWater.vue Datei anzeigen

@@ -5,41 +5,31 @@
<!-- 补卡额订单列表-->
<view class="search-box">
<image :src="`${$imgUrl}service/icon-search.png`" class="icon"></image>
<input class="search" placeholder="请输入充车牌/流水编号/出入站名/ETC卡号" />
<input class="search" placeholder="请输入充车牌/ETC卡号" v-model="state.keywords" @input="keywordsInput" />
</view>
<view class="search-time">
<view class="search-time-box" @click="showCalender">
<u-calendar
v-model="show"
mode="range"
@change="changeHandle"
max-date="2100-01-01"
range-bg-color="#00B38B"
active-bg-color="#00B38B"
range-color="#fff"
></u-calendar>
<view class="search-time-box">

<view class="show-info">
<view class="show-text" v-if="dataTime.startDate">
<text class="date-text text-val">{{dataTime.startDate}}</text>
<text class="line"></text>
<text class="date-text text-val">{{dataTime.endDate}}</text>
</view>
<view class="show-text" v-else>
<text class="date-text">开始时间</text>
<view class="show-text">
<picker class="picker date" mode="date" :value="dataTime.startDate" @change="bindDateStart">
<text class="date-text text-val">{{dataTime.startDate?dataTime.startDate:'开始时间'}}</text>
</picker>
<text class="line"></text>
<text class="date-text">结束时间</text>
<picker class="picker date" mode="date" :value="dataTime.endDate" @change="bindDateEnd">
<text class="date-text text-val">{{dataTime.endDate?dataTime.endDate:'结束时间'}}</text>
</picker>
</view>
<u-icon name="calendar" :custom-style="{color:'#999999', size: '28rpx'}"></u-icon>
</view>
</view>
<view class="time-btn">查询</view>
<view class="time-btn" @click="search">查询</view>
</view>
<view class="total-num"><text>金额合计:XXXXXX</text> <text class="total-space">通行次数:XXXXXX</text></view>
<view class="list-wrap">
<view v-for="item in listData" :key="item.id" :class="item.status === 3 ? ' card-info finished' : 'card-info'">
<view class="info-wrap">
<view v-for="item in listData" :key="item.id"
:class="item.status === 3 ? ' card-info finished' : 'card-info'">
<view class="info-wrap">
<view class="info-left">
<view class="info-left-text">
<text class="label">流水单号:</text>
@@ -78,7 +68,8 @@
</view>
<view class="btn-wrap">
<view>
<text v-if="item.status === 2" class="status-wrap">审核进度:<text class="status-text">审核中</text></text>
<text v-if="item.status === 2" class="status-wrap">审核进度:<text
class="status-text">审核中</text></text>
<text v-if="item.status === 3" class="status-wrap">审核进度:<text>已完成</text></text>
</view>
<view class="btn-1 btn" v-if="item.status === 1" @click="toApply(item)">补卡额申请</view>
@@ -86,7 +77,7 @@
<view class="btn-1 btn" v-if="item.status === 3" @click="toEvaluate(item)">去评价</view>
</view>
</view>
</view>
</view>
</template>
@@ -96,10 +87,21 @@
reactive,
ref
} from "vue";
const show = ref(false);
import {
request
} from "../../utils/network/request.js";

import {
stringToJson
} from "../../utils/network/encryption.js";
import { orderDetail, passBills } from "../../utils/network/api.js";
import {
onLoad
} from '@dcloudio/uni-app'

const dataTime = reactive({
startDate: "",
endDate: ""
startDate: "开始时间",
endDate: "结束时间"
})
const listData = reactive([
{
@@ -115,40 +117,96 @@
status: 3 // 去评价
},
])
// 日期修改
function changeHandle(e) {
dataTime.startDate = e.startDate;
dataTime.endDate = e.endDate;
const state = reactive({
list: [],
keywords: null,

})
onLoad((option) => {
queryOrderDetail(option.id);
})

const keywordsInput = (e) => {
console.log(e)
}
const search = () => {
console.log(state);
const options = {
type: 2,
data: {
cardId:"52011640230202987050",
vehiclePlate:null,
beforeDate: dataTime.startDate,
afterDate:dataTime.endDate,
pageNo:null,
pageSize:null,
},
method: "POST",
showLoading: true,
};
request(passBills, options).then((res) => {
console.log(res);
// let orderInfo = JSON.parse(res.bizContent);
})
}
const queryOrderDetail = (id) => {
const options = {
type: 2,
data: {
id: id,
},
method: "POST",
showLoading: true,
};
request(orderDetail, options).then((res) => {
console.log(res);
// let orderInfo = JSON.parse(res.bizContent);
})
}

// 展示日历
const bindDateStart = (e) => {
console.log(e);
// show.value = true
dataTime.startDate = e.detail.value
}
// 展示日历
function showCalender() {
show.value = true
const bindDateEnd = (e) => {
console.log(e);
dataTime.endDate = e.detail.value
// show.value = true
}

// 补卡申请
function toApply(item) {
const toApply = (item) => {
uni.navigateTo({
url: `/orders/cardAmount?id=${item.id}`
// url: `/orders/cardAmount?id=${item.id}`
url: ""
});
}
// 去评价
function toEvaluate(item) {
const toEvaluate = (item) => {
uni.navigateTo({
url: `/orders/order-evaluate?id=${item.id}`
// url: `/orders/order-evaluate?id=${item.id}`
url: ""
});
}
// 查看进度
function toView(item) {
const toView = (item) => {
uni.navigateTo({
url: `/orders/cardAmountDetail?id=${item.id}`
// url: `/orders/cardAmountDetail?id=${item.id}`
url: ""
});
}
</script>

<style lang="scss" scoped>
.u-btn--primary{
.u-btn--primary {
background: #00B38B;
}

.bg-color {
position: fixed;
top: 0;
@@ -158,6 +216,7 @@
background: #EEF7F7;
z-index: -1;
}

.search-box {
margin: 30rpx 30rpx 20rpx 30rpx;
height: 72rpx;
@@ -171,6 +230,10 @@
box-sizing: border-box;
}

.search-time-box {
flex: 1;
}

.search-box .icon {
width: 48rpx;
height: 48rpx;
@@ -193,9 +256,11 @@
background: #ffffff;
box-shadow: 0rpx 2rpx 6rpx 0rpx rgba(223, 223, 223, 0.8);
}

.search-time {
display: flex;
margin: 20rpx 30rpx 48rpx 30rpx;

.time-btn {
width: 130rpx;
height: 80rpx;
@@ -207,9 +272,9 @@
text-align: center;
margin-left: 19rpx;
}

.show-info {
width: 541rpx;
height: 81rpx;
height: 80rpx;
padding: 0 31rpx;
background: #FFFFFF;
border: 1px solid #DCDCDC;
@@ -217,17 +282,21 @@
display: flex;
justify-content: space-between;
align-items: center;

.show-text {
display: flex;
align-items: center;
}

.date-text {
color: #999999;
font-size: 28rpx;
}

.text-val {
color: #333
}

.line {
width: 25rpx;
height: 1rpx;
@@ -236,45 +305,52 @@
}
}
}

.total-num {
font-size: 28rpx;
color: #999999;
margin-left: 30rpx;

.total-space {
margin-left: 41rpx;
}
}

.list-wrap {
margin: 30rpx;
padding-bottom: 20rpx;
}

.card-info {
background: #FFFFFF;
box-shadow: 0rpx 2rpx 6rpx 0rpx rgba(223, 223, 223, 0.8);
border-radius: 20rpx;
margin-bottom: 30rpx;
padding: 30rpx 30px 13rpx 30rpx;

.info-wrap {
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #dcdcdc;
padding-bottom: 30rpx;

.info-left-text {
margin-bottom: 39rpx;
}

.label {
color: #999999;
font-size: 26rpx;
font-weight: 400;
}
.val {
color: #333333;
font-size: 26rpx;
font-weight: 400;
}
.price-label {
color: #999999;
font-size: 24rpx;
@@ -282,42 +358,45 @@
margin-bottom: 22rpx;
text-align: center;
}
.price-val-text {
font-size: 36rpx;
font-weight: 700;
color: #333333;
margin-left: 9rpx;
}
.price-val {
font-size: 26rpx;
color: #333333;
}
}

.card-text-wrap {
display: flex;
justify-content: space-between;
align-items: center;
margin: 38rpx 0 46rpx 0;

.text-box {
display: flex;
flex-direction: column;
align-items: center;

.name-text {
font-size: 30rpx;
font-weight: 400;
color: #333333;
}
.time-text {
font-size: 30rpx;
color: #333333;
font-weight: 400;
margin-top: 8rpx;
}
.date-text {
font-size: 24rpx;
color: #999999;
@@ -325,38 +404,41 @@
margin-top: 8rpx;
}
}
.arrow-wrap {
display: flex;
flex-direction: column;
align-items: center;
.d-img {
width: 186rpx;
height: 12rpx;
}
.arrow-text {
color: #666666;
font-size: 26rpx;
}
}
}
.btn-wrap {
margin-top: 30rpx;
display: flex;
justify-content: space-between;
align-items: center;

.status-wrap {
color: #999999;
font-size: 26rpx;
margin-right: 23rpx;
}

.status-text {
color: #00B38B;
}
.btn{

.btn {
background: #FFFFFF;
border: 1px solid #00B38B;
border-radius: 30rpx;
@@ -365,23 +447,34 @@
color: #00B38B;
font-size: 26rpx;
}

.btn-1 {
width: 171rpx;
height: 61rpx;
}

.btn-2 {
width: 141rpx;
height: 61rpx;
}

.btn-3 {
width: 121rpx;
height: 61rpx;
}
}
}
.finished .info-wrap, .finished .card-text-wrap{
.price-val, .price-val-text, .val, .text-box .time-text, .text-box .name-text, .arrow-wrap .arrow-text{

.finished .info-wrap,
.finished .card-text-wrap {

.price-val,
.price-val-text,
.val,
.text-box .time-text,
.text-box .name-text,
.arrow-wrap .arrow-text {
color: #999999;
}
}
</style>
</style>

+ 4
- 1
utils/network/api.js Datei anzeigen

@@ -116,13 +116,16 @@ 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 queryGuoHuCaoZuo = 'b1e66d22fb6f400f915458f5c50c7118'//8.312.ASS-过户检测接口
export const upLoadImg = "4a95e1d90e824ee8a50aa9826617e736"//CSMSN-激活照片上传

// 资金服务
export const CardBillQuery= '917' //通行流水欠费补缴信息查询接口
export const CardBillPlaceOrder= '916' //通行流水欠费补缴支付下单接口
export const CardBillPayStatus= '915' //通行流水欠费补缴支付查询接口
export const passBills= "925"//BDS-车辆通行流水分页查询接口

Laden…
Abbrechen
Speichern