sunliwei/rescue-driver
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
6b138c581f
rescue-driver/pages/orderDetails/details.vue
Lx 6b138c581f 0930
2025-09-30 10:08:21 +08:00

4826 lines
135 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="content">
<view class="mubu">
<view class="c-top">
<view class="top-heder"></view>
<view class="topjianjian">
<view style="width: 10px; height: 100%;" @click="goback()">
<uni-icons type="left" color="#ffffff" size="22"></uni-icons>
</view>
<view class="bai-title">订单详情</view>
<view style="width: 10px; height: 100%;"></view>
</view>
<view class="dis-b" style="margin-top: 16px; box-sizing: border-box; padding: 0px 15px; ">
<view class="t-left">
<view class="left-t">
<view class="sj">
<image src="../../static/detection/sja.png" mode=""></image>
</view>
<view class="t-zi1">
<text>{{detailsData.rescueStatusStr}}</text>
</view>
</view>
<view class="t-zi2">请尽快与救援车辆联系</view>
</view>
<view class="t-right">
<view class="" @click="gotel(detailsData.connectionPhone)">
<view class="ximg">
<image src="../../static/detection/shouji.png" mode=""></image>
</view>
<view class="ai">拨打电话</view>
</view>
<view style="margin-left: 10px;" @click="gogogo()">
<view class="ximg">
<image src="../../static/detection/xiaofeij.png" mode=""></image>
</view>
<view class="ai">到这去</view>
</view>
<view style="margin-left: 10px;"
v-if="detailsData.setMoney&&(!detailsData||detailsData.orderStatus<2)" @click="showCode()">
<view class="ximg">
<uni-icons type="scan" color="#ffffff" size="24"></uni-icons>
</view>
<view class="ai">收款</view>
</view>
<view style="margin-left: 10px;" v-if="detailsData&&detailsData.orderStatus>=2">
<view class="ximg">
<uni-icons type="checkbox" color="#ffffff" size="24"></uni-icons>
</view>
<view class="ai">已收款</view>
</view>
</view>
</view>
<view class="ding-top">
<view class="dis-bb">
<view style="display: flex;justify-content: space-between;width: 100%; align-items: center;">
<view class="xhui">
救援地点
</view>
</view>
<view class="ja-you">{{detailsData.rescuePosition || ''}}</view>
<view class="xhui" v-if="detailsData.rescueStatusStr == '救援中'" @click="getmap1">
终点位置
</view>
<view class="ja-you " @click="getmap1" v-if="detailsData.rescueStatusStr == '救援中'">
{{detailsData.destinationInfo || '暂未设置'}} <uni-icons type="paperplane-filled"
color="#0D2E8D" size="18"></uni-icons>
</view>
<view class="xhui-kc" v-if="detailsData.rescueType == '5' ">
扣车地点：{{ detailsData.kcPosition }}
</view>
<view style="margin-top: 40rpx;">
<view style="font-size: 28rpx; color:#999999; margin-bottom: 20rpx;">
救援地址备注:<view style="color:black; font-weight: bold;; font-size: 30rpx;">
{{ detailsData.remarkRescuePosition || '暂无备注' }}
</view>
</view>
<view style="font-size: 28rpx; color:#999999; margin-bottom: 20rpx;">
目的地备注:<view style="color:black; font-weight: bold; font-size: 30rpx;">
{{ detailsData.remarkDestinationInfo || '暂无备注' }}
</view>
</view>
</view>
</view>
<view class="dix">
<text class="huiy">客户车牌:</text>
<u--input placeholder="客户车牌" style="height: 15px;" v-model="detailsData.licenseNum"
v-if="detailsData.rescueStatusStr == '救援中'" :disabled="false"></u--input>
<text v-if="detailsData.rescueStatusStr != '救援中'"
:class="{ 'no-data': !detailsData.licenseNum }">{{detailsData.licenseNum || '暂无数据'}}</text>
</view>
<view class="dix">
<text class="huiy">客户姓名:</text>
<u--input placeholder="客户姓名" style="height: 15px;" v-model="detailsData.connectionName"
v-if="detailsData.rescueStatusStr == '救援中'" :disabled="false"></u--input>
<text v-if="detailsData.rescueStatusStr != '救援中'"
:class="{ 'no-data': !detailsData.connectionName }">{{detailsData.connectionName || '暂无数据'}}</text>
</view>
<view class="dix">
<text class="huiy">客户手机号:</text>
<u--input placeholder="客户手机号" style="height: 15px;" v-model="detailsData.connectionPhone"
v-if="detailsData.rescueStatusStr == '救援中'" :disabled="false"></u--input>
<text v-if="detailsData.rescueStatusStr != '救援中'"
:class="{ 'no-data': !detailsData.connectionPhone }">{{detailsData.connectionPhone || '暂无数据'}}</text>
</view>
<view class="dix">
<text class="huiy">车主姓名:</text>
<u--input placeholder="车主姓名" style="height: 15px;" v-model="detailsData.carOwner"
v-if="detailsData.rescueStatusStr == '救援中'" :disabled="false"></u--input>
<text v-if="detailsData.rescueStatusStr != '救援中'"
:class="{ 'no-data': !detailsData.carOwner }">{{detailsData.carOwner || '暂无数据'}}</text>
</view>
<view class="dix">
<text class="huiy">车主手机号:</text>
<u--input placeholder="车主手机号" style="height: 15px;" v-model="detailsData.carOwnerPhone"
v-if="detailsData.rescueStatusStr == '救援中'" :disabled="false"></u--input>
<text v-if="detailsData.rescueStatusStr != '救援中'"
:class="{ 'no-data': !detailsData.carOwnerPhone }">{{detailsData.carOwnerPhone || '暂无数据'}}</text>
</view>
<view class="dix">
<text class="huiy">车型（品牌）:</text>
<u--input placeholder="车型（品牌）" style="height: 15px;" v-model="detailsData.carBrand"
v-if="detailsData.rescueStatusStr == '救援中'" :disabled="false"></u--input>
<text v-if="detailsData.rescueStatusStr != '救援中'"
:class="{ 'no-data': !detailsData.carBrand }">{{detailsData.carBrand || '暂无数据'}}</text>
</view>
<view class="dix">
<text class="huiy">车辆类型:</text>
<text v-if="detailsData.rescueStatusStr != '救援中'"
:class="{ 'no-data': !detailsData.carTypeStr }">{{detailsData.carTypeStr || '暂无数据'}}</text>
<view class="ribox" v-if="detailsData.rescueStatusStr == '救援中'"
:class="{'actbox' : carindex == item.value}" v-for="(item,index) in carList" :key="index"
@click="getcarindex(item.value)">{{item.label}}</view>
</view>
<view class="dix">
<text class="huiy">是否为新能源:</text>
<text v-if="detailsData.rescueStatusStr != '救援中'"
:class="{ 'no-data': !detailsData.ifNewEnergy }">{{detailsData.ifNewEnergy || '暂无数据'}}</text>
<view class="ribox" v-if="detailsData.rescueStatusStr == '救援中'"
:class="{'actbox' : ifNewEnergyIndex == item.value}" v-for="(item,index) in ifNewEnergyList"
:key="index" @click="getIfNewEnergy(item.value)">{{item.label}}</view>
</view>
<view class="dix">
<text class="huiy">收款类型:</text>
<text
:class="{ 'no-data': !detailsData.feeTypeStr }">{{detailsData.feeTypeStr || '暂无数据'}}</text>
</view>
<view class="dix">
<text class="huiy">救援类型:</text>
<text
:class="{ 'no-data': !detailsData.rescueTypeStr }">{{detailsData.rescueTypeStr || '暂无数据'}}</text>
</view>
<view class="dix">
<text class="huiy">是否扣车:</text>
<text>{{detailsData.isKouChe=='1'?'是' : '否'}}</text>
</view>
<view class="dix" v-if="detailsData.kcPosition" @click="getmap1">
<text class="huiy">扣车地点:</text>
<text
:class="{ 'no-data': !detailsData.kcPosition }">{{detailsData.kcPosition || '暂无数据'}}</text>
</view>
<view class="dix">
<text class="huiy">是否维修:</text>
<text>{{detailsData.isWeiXiu=='1'?'是' : '否'}}</text>
</view>
<view class="dix">
<text class="huiy">故障类型:</text>
<text v-if="detailsData.rescueStatusStr != '救援中'"
:class="{ 'no-data': !detailsData.faultType }">{{detailsData.faultType || '暂无数据'}}</text>
<view v-if="detailsData.rescueStatusStr == '救援中'" style="display: flex; align-items: center;">
<text>{{detailsData.faultType || '请选择'}}</text>
<text @click="getFaultTypeList(true)" style="margin-left: 20px;color:blue;font-size: 12px;">
点击选择
</text>
</view>
</view>
<view class="dix">
<text class="huiy">故障现象:</text>
<text v-if="detailsData.rescueStatusStr != '救援中'"
:class="{ 'no-data': !detailsData.phenomenon }">{{detailsData.phenomenon || '暂无数据'}}</text>
<view v-if="detailsData.rescueStatusStr == '救援中'" style="display: flex; align-items: center;">
<text>{{detailsData.phenomenon || '请选择'}}</text>
<text @click="getFaultPhenomenonList(true)"
style="margin-left: 20px;color:blue;font-size: 12px;">
点击选择
</text>
</view>
</view>
<view class="dix">
<text class="huiy">故障现象备注:</text>
<text
:class="{ 'no-data': !detailsData.faultPhenomenon }">{{detailsData.faultPhenomenon ? detailsData.faultPhenomenon : '暂无数据' }}</text>
</view>
<view class="dix">
<text class="huiy">救援需求:</text>
<text
:class="{ 'no-data': !detailsData.rescueNeeds }">{{detailsData.rescueNeeds ? detailsData.rescueNeeds : '暂无数据' }}</text>
</view>
<view class="dix">
<text class="huiy">预估下车地:</text>
<text
:class="{ 'no-data': !detailsData.estimateDownCar }">{{detailsData.estimateDownCar ? detailsData.estimateDownCar : '暂无数据' }}</text>
</view>
<view class="dix">
<text class="huiy">预估费用:</text>
<text
:class="{ 'no-data': !detailsData.estimateMoney }">{{detailsData.estimateMoney ? detailsData.estimateMoney : '暂无数据' }}</text>
</view>
<view style="border-top: 1px solid #d0d0d0; margin-top: 30px; width: 100%;"></view>
<view class="dix">
<text class="huiy">驾驶车辆:</text>
<text v-if="detailsData.rescueStatusStr != '救援中'">{{detailsData.driverCarNum || ''}}</text>
<view v-if="detailsData.rescueStatusStr == '救援中'" style="display: flex; align-items: center;">
<text>{{detailsData.driverCarNum || ''}}</text> <text @click="getCarList()"
style="margin-left: 20px;color:blue;font-size: 12px;">
点击选择</text>
</view>
</view>
<view class="dix">
<text class="huiy">渠道:</text>
<text
:class="{ 'no-data': !detailsData.channel }">{{detailsData.channel ? detailsData.channel: '暂无数据'}}</text>
</view>
<view class="dix">
<text class="huiy">来源:</text>
<text
:class="{ 'no-data': !detailsData.source }">{{detailsData.source ? detailsData.source : '暂无数据'}}</text>
</view>
<view class="dix" v-if="detailsData.rescueStatusStr == '救援中'">
<text class="huiy">起止公里数:</text>
<u--input placeholder="救援开始公里数" style="height: 15px;" type="number"
v-model="detailsData.startScale"></u--input> -
<u--input placeholder="救援结束公里数" style="height: 15px;" type="number"
v-model="detailsData.endScale"></u--input>
</view>
<view class="dix" v-else>
<text class="huiy">起止公里数:</text>
<view>{{detailsData.startScale ? detailsData.startScale + ' KM' : '暂未设置'}} ——
{{detailsData.endScale ? detailsData.endScale + ' KM' : '暂未设置'}}
</view>
</view>
<view class="dix">
<text class="huiy">放空公里数:</text>
<view style="width: 158px;display: flex;align-items: center;"
v-if="detailsData.rescueStatusStr == '救援中'"><u--input type="number" style="height: 15px; "
placeholder="请输入公里数" border="surround" v-model="detailsData.emptyNum"
clearable></u--input> <text>KM</text></view>
<view style="width: 158px;display: flex;align-items: center;" v-else
:class="{ 'no-data': !detailsData.emptyNum }">
{{ detailsData.emptyNum ? detailsData.emptyNum + 'KM' : '暂未设置' }}
</view>
</view>
<view class="dix">
<text class="huiy">过关费:</text>
<view style="width: 150px;display: flex;align-items: center;margin-left: 28px;"
v-if="detailsData.rescueStatusStr == '救援中'"><u--input type="number" style="height: 15px; "
placeholder="请输入金额" border="surround" v-model="detailsData.checkpointMoney"
clearable></u--input><text>元</text> </view>
<view style="width: 150px;display: flex;align-items: center;margin-left: 28px;" v-else
:class="{ 'no-data': !detailsData.checkpointMoney }">
{{ detailsData.checkpointMoney ? detailsData.checkpointMoney + 'KM' : '暂未设置' }}
</view>
</view>
<view class="floating-edit-btn"
v-if="(detailsData.rescueStatusStr == '救援中' || detailsData.currentRecordStep <= 7) && detailsData.driverId"
@click="show = true">
<uni-icons type="compose" color="#0D2E8D" size="25"></uni-icons>
<view class="edit-text">确认编辑</view>
</view>
<view class="floating-refresh-btn" @click="getrescueDetail(id)">
<uni-icons type="refresh-filled" color="#0D2E8D" size="25"></uni-icons>
<view class="refresh-text">刷新订单</view>
</view>
</view>
<view class="hui-content">
<view class="content-box">
<view class="dis-bb">
<view class="ja-you" style="margin: 0px;">事情描述:</view>
</view>
<u--textarea v-model="detailsData.rescueDetail" v-if="detailsData.rescueStatusStr == '救援中'"
placeholder="请输入救援描述" border="bottom" autoHeight></u--textarea>
<view class="xx-hui" v-if="detailsData.rescueStatusStr != '救援中'">
{{detailsData.rescueDetail || '暂无描述'}}
</view>
</view>
<view class="content-box" v-if="detailsData.rescueSceneImageList != null ">
<view class="dis-bb">
<view class="ja-you" style="margin: 0px;">现场图片</view>
</view>
<view class="img-boxs">
<view class="g-img" v-for="(item,index) in detailsData.rescueSceneImageList" :key="index">
<image :src="baseImageUrl + item " mode=""></image>
</view>
</view>
</view>
<view class="content-box">
<view class="dis-bb">
<view class="ja-you" style="margin: 0px;">救援进程</view>
</view>
<view v-if="detailList && detailList.length > 0" class="c-box">
<view class="lan-ga" v-for="(item,index) in detailList" :key="index">
<view class="ga-top-box">
<view class="gain">
<image class="gainIcon" src="@/static/icons/currentDetails.png"
mode="aspectFit"></image>
</view>
<view class="ga-content">
<view class="ga-content-top">
<view class="ga-content-title">{{item.title}}</view>
<view class="xhui">
{{item.createTime}}
</view>
</view>
<view class="beizh"
v-if="(item.type == 1 && detailsData) || (item.title && item.title.includes('现场查勘') && detailsData )">
调度:{{detailsData.secondDispatchName}}
</view>
<view class="beizh"
v-if="(item.type == 1 && detailsData) || (item.title && item.title.includes('现场查勘') && detailsData)">
调度电话:{{detailsData.secondDispatchPhone}}
</view>
<view class="beizh">
{{item.autoRemark && item.autoRemark.replace(/, /g, '\n')}}
</view>
<view class="beizh" style="margin-top: 10rpx;"
v-if="item.remark && item.remark !== '' && (item.type == 1 || item.title.includes('现场查勘'))">
调度备注: {{item.remark}}
</view>
<view class="beizh" style="margin-top: 10rpx;"
v-if="item.remark && item.remark !== '' && item.type != 1 && !item.title.includes('现场查勘')">
救援司机备注: {{item.remark}}
</view>
<view class="beizh" style="margin-top: 10rpx; margin-bottom: 10rpx;"
v-if="item.timeCost != '' && item.timeCost != null">
<view style="display: flex; flex-direction: row;">
<view v-if="item.type == 3 ">响应耗时: </view>
<view v-if="item.type == 4 ">救援耗时: </view>
<view v-if="item.type == 7 ">救援订单耗时: </view>
<view style="margin-left: 10rpx;">{{item.timeCost}} 分钟</view>
</view>
</view>
<view class="wrap-box_bc" v-if="item.images" style="margin-top: 10rpx;">
<view class="edit_images">
<text
style="font-size: 28rpx; font-weight: bold; margin-right: 20rpx;">现场照片:</text>
<view class="edit-photo-btn" @click="showEditPhotoPopup(item, 'images')"
v-if="detailsData.rescueStatusStr == '救援中'">
<uni-icons type="compose" size="16" color="#0D2E8D"></uni-icons>
<text>编辑</text>
</view>
</view>
<view style="display: flex; flex-direction: row;">
<view class="img-box" v-for="(items,index) in item.images.split(',') "
:key="index" @click="lookimg(index,item.images.split(','))">
<image :src="baseImageUrl + items " mode=""></image>
</view>
</view>
</view>
<view class="wrap-box_bc" v-if="item.supplementImages"
style="margin-top: 20rpx;">
<text style="font-size: 28rpx; font-weight: bold;">补充照片:</text>
<view style="display: flex; flex-direction: row;">
<view class="img-box"
v-for="(items,index) in item.supplementImages.split(',') "
:key="index"
@click="lookimg(index,item.supplementImages.split(','))">
<image :src="baseImageUrl + items " mode=""></image>
</view>
</view>
</view>
<!-- 补充照片按钮 -->
<view class="supplement-photo-btn" @click="showSupplementPopup(item)">
<uni-icons type="plus" size="16" color="#0D2E8D"></uni-icons>
<text>补充照片</text>
</view>
</view>
</view>
<view v-if="index < detailList.length - 1" class="lan-ga-line"></view>
</view>
</view>
</view>
</view>
</view>
</view>
<u-picker :show="carNumShow" @cancel="carNumShow = false" @close="carNumShow = false" @confirm="chooseCar"
:columns="[carNumList]" keyName="rescueCarNum"></u-picker>
<u-modal :show="show" title="修改" content='您确认修改吗' :showCancelButton="true" @confirm="confirmadd()"
@cancel="cancelopen()"></u-modal>
<u-popup :show="codeShow" :round="10" mode="bottom" @close="closeCodePop" :closeable='true'>
<view class="codePop flex-col align-center">
<canvas style="width:100px; height: 100px; z-index: 9999999; margin: 40px auto;"
canvas-id="myQrcode"></canvas>
<view class="popup-title-money" v-if="confirmedSetMoney">收款金额: {{ confirmedSetMoney }}
</view>
<view class="popup-title">收款码</view>
</view>
</u-popup>
<u-picker :show="roadShow" @cancel="roadShow = false" @close="roadShow = false" @confirm="chooseRoad"
:columns="[roadList]" keyName="label"></u-picker>
<u-picker :show="sourceShow" @cancel="sourceShow = false" @close="sourceShow = false" @confirm="chooseSource"
:columns="[sourceList]" keyName="label"></u-picker>
<!-- 故障类型和故障现象选择 -->
<u-picker :show="faultPhenomenonShow" @cancel="faultPhenomenonShow = false" @close="faultPhenomenonShow = false"
@confirm="chooseFaultPhenomenon" :columns="[faultPhenomenonList]" keyName="name"></u-picker>
<u-picker :show="faultTypeShow" @cancel="faultTypeShow = false" @close="faultTypeShow = false"
@confirm="chooseFaultType" :columns="[faultTypeList]" keyName="name"></u-picker>
<!-- <u-popup :show="recordShow" mode="center" :round="10" @close="close2" @open="open"> -->
<u-popup :show="recordShow" mode="center" :round="10">
<view class="popup-box">
<view class="p-title">描述</view>
<!-- <view class="huinput" @click="gettype"> -->
<view class="huinput">
<text>节点：</text>
<text class="tshe">{{ dictLabel }}</text>
</view>
<view class="huinput" v-if="currentStepIndex !== 6">
<text>备注信息：</text>
<u--textarea v-model="remark" placeholder="请输入备注" border="bottom" autoHeight></u--textarea>
</view>
<!-- 上传状态提示 -->
<view class="upload-tips" v-if="uploadingRecord">
<u-loading-icon size="20" color="#0D2E8D"></u-loading-icon>
<text>图片上传中，请稍候...</text>
</view>
<!-- 当 currentStepIndex 为 4 时额外显示三个选项按钮 -->
<view v-if="currentStepIndex === 6" class="option-buttons">
<view class="huinput">
<text>请选择人移交类型：</text>
</view>
<view class="option-button" :class="{'active': selectedOption === 'repair'}"
@click="selectedOption = 'repair'">
转维修
</view>
<view class="option-button" :class="{'active': selectedOption === 'detain'}"
@click="selectedOption = 'detain'">
扣车
</view>
<view class="option-button" :class="{'active': selectedOption === 'handover'}"
@click="selectedOption = 'handover'">
移交客户
</view>
<view class="option-button" :class="{'active': selectedOption === 'specifyRepairShop'}"
@click="selectedOption = 'specifyRepairShop'">
移交客户指定修理厂
</view>
<view class="option-button" :class="{'active': selectedOption === 'specifyPickUpPeople'}"
@click="selectedOption = 'specifyPickUpPeople'">
移交客户指定接车人
</view>
</view>
<view class="p-title" v-if="currentStepIndex !== 6">现场图片</view>
<view class="huinput" v-if="currentStepIndex !== 6">
<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple
:maxCount="5" :disabled="uploadingRecord"></u-upload>
</view>
<view class="button-group">
<view class="cancel-button" @click="cancelRecord" :disabled="uploadingRecord">
<text>取消</text>
</view>
<view class="confirm-button" @click="getdaoda()" :disabled="isSubmitting || uploadingRecord">
<!-- <text>确认</text> -->
<text>{{ isSubmitting ? '处理中...' : '确认' }}</text>
</view>
</view>
</view>
</u-popup>
<u-popup :show="acceptOrderShow" mode="center" :round="10" @close="closeAcceptOrderPopup"
:closeOnClickOverlay="false">
<view class="popup-box">
<view class="p-title">开始救援</view>
<view class="huinput">
<text>车辆里程数: </text>
<u--textarea v-model="startScale" placeholder="请输入车辆里程数" border="bottom" autoHeight></u--textarea>
</view>
<view class="huinput">
<text>备注信息: </text>
<u--textarea v-model="remark" placeholder="请输入备注信息" border="bottom" autoHeight></u--textarea>
</view>
<view class="p-title">车辆里程表图片</view>
<view class="huinput">
<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple
:maxCount="5"></u-upload>
</view>
<view class="button-group">
<view class="cancel-button" @click="closeAcceptOrderPopup">
<text>取消</text>
</view>
<view class="confirm-button" @click="confirmAcceptOrder" :disabled="isSubmitting">
<text>{{ isSubmitting ? '处理中...' : '确认' }}</text>
</view>
</view>
</view>
</u-popup>
<u-popup :show="orderCompleteShow" mode="center" :round="10">
<view class="popup-box">
<view class="p-title">描述</view>
<!-- <view class="huinput" @click="gettype"> -->
<view class="huinput">
<text>节点：</text>
<text class="tshe">{{ dictLabel }}</text>
</view>
<view class="huinput">
<text>救援结束车辆里程数: </text>
<u--textarea v-model="detailsData.endScale" placeholder="请输入车辆里程数" border="bottom"
autoHeight></u--textarea>
</view>
<view class="huinput">
<text>故障车车牌号: </text>
<u--textarea v-model="detailsData.licenseNum" placeholder="请输入故障车车牌号" border="bottom"
autoHeight></u--textarea>
</view>
<view class="huinput">
<text>备注信息：</text>
<u--textarea v-model="remark" placeholder="请输入备注" border="bottom" autoHeight></u--textarea>
</view>
<!-- 上传状态提示 -->
<view class="upload-tips" v-if="uploadingRecord">
<u-loading-icon size="20" color="#0D2E8D"></u-loading-icon>
<text>图片上传中，请稍候...</text>
</view>
<view class="p-title">现场图片</view>
<view class="huinput">
<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple
:maxCount="5" :disabled="uploadingRecord"></u-upload>
</view>
<view class="button-group">
<view class="cancel-button" @click="cancelOrderComplete" :disabled="uploadingRecord">
<text>取消</text>
</view>
<view class="confirm-button" @click="getdaoda()" :disabled="isSubmitting || uploadingRecord">
<!-- <text>确认</text> -->
<text>{{ isSubmitting ? '处理中...' : '确认' }}</text>
</view>
</view>
</view>
</u-popup>
<u-popup :show="toRepairShow" mode="center" :round="10" @close="closeRepairPopup">
<view class="popup-box repair-popup">
<view class="p-title title-content-s">转维修信息</view>
<scroll-view class="popup-scroll" scroll-y="true">
<u-form labelPosition="top" :model="repairFormData" class="repair-form">
<u-form-item label="客户姓名" borderBottom label-width="100%" style="font-weight: bold;">
<u--input placeholder="请输入客户姓名" v-model="repairFormData.name" border="none"
style="font-weight: normal;"></u--input>
</u-form-item>
<u-form-item label="客户联系电话" borderBottom label-width="100%" style="font-weight: bold;">
<u--input placeholder="请输入客户联系电话" v-model="repairFormData.phone" border="none"
style="font-weight: normal;"></u--input>
</u-form-item>
<u-form-item label="车牌号" borderBottom label-width="100%" style="font-weight: bold;">
<u--input placeholder="请输入车牌号" v-model="repairFormData.carNo" border="none"
style="font-weight: normal;"></u--input>
</u-form-item>
<u-form-item label="车辆品牌" borderBottom label-width="100%" style="font-weight: bold;">
<u--input placeholder="请输入车辆品牌" v-model="repairFormData.brandName" border="none"
style="font-weight: normal;"></u--input>
</u-form-item>
<u-form-item label="车辆型号" borderBottom label-width="100%" style="font-weight: bold;">
<u--input placeholder="请输入车辆型号" v-model="repairFormData.brandModel" border="none"
style="font-weight: normal;"></u--input>
</u-form-item>
<u-form-item label="移交接车人" borderBottom label-width="100%" style="font-weight: bold;">
<view class="select-box" @click="showLzcPicker">
<text v-if="repairFormData.adviserName">{{ repairFormData.adviserName }}</text>
<text v-else class="placeholder">请选择移交接车人</text>
<view class="select-actions">
<u-icon name="arrow-right"></u-icon>
</view>
</view>
</u-form-item>
<u-form-item label="移交接车人(如果列表中没有,请手动输入)" borderBottom label-width="100%"
style="font-weight: bold;">
<u--input placeholder="请输入移交接车人" v-model="repairFormData.adviserNameManual" border="none"
style="font-weight: normal;" :disabled="!!repairFormData.adviserName"></u--input>
</u-form-item>
<u-form-item label="移交接车人电话" borderBottom label-width="100%" style="font-weight: bold;">
<u--input placeholder="请输入移交接车人电话" v-model="repairFormData.adviserPhone" border="none"
style="font-weight: normal;"></u--input>
</u-form-item>
<u-form-item label="备注信息" borderBottom label-width="100%" style="font-weight: bold;">
<u--textarea v-model="repairFormData.remark" placeholder="请输入备注信息" border="none" autoHeight
style="font-weight: normal;"></u--textarea>
</u-form-item>
<!-- 修理厂选择 -->
<u-form-item label="修理厂" borderBottom label-width="100%" style="font-weight: bold;">
<view class="select-box-with-add">
<view class="select-box" @click="repairFactoryShow = true">
<text
v-if="repairFormData.repairFactoryName">{{ repairFormData.repairFactoryName }}</text>
<text v-else class="placeholder">请选择修理厂</text>
<u-icon name="arrow-right"></u-icon>
</view>
<view class="add-button" @click="showAddRepairFactoryModal">
<uni-icons type="plus" size="20" color="#0D2E8D"></uni-icons>
</view>
</view>
</u-form-item>
</u-form>
<!-- 上传状态提示 -->
<view class="upload-tips" v-if="uploadingRecord">
<u-loading-icon size="20" color="#0D2E8D"></u-loading-icon>
<text>图片上传中，请稍候...</text>
</view>
<view class="p-title">现场图片</view>
<view class="huinput">
<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple
:maxCount="5" :disabled="uploadingRecord"></u-upload>
</view>
</scroll-view>
<view class="button-group">
<view class="cancel-button" @click="closeRepairPopup">
<text>取消</text>
</view>
<view class="confirm-button" @click="confirmRepair">
<text>确认</text>
</view>
</view>
</view>
</u-popup>
<!-- 扣车弹框 -->
<u-popup :show="toDetainShow" mode="center" :round="10" @close="closeDetainPopup">
<view class="popup-box">
<view class="p-title title-content-s">扣车信息</view>
<view @click="showKcPositionPicker" style="margin-top: 20px;">
<text style="margin-bottom: 30px; font-size: 16px; font-weight: bold;">扣车地点：</text>
<text class="tshe">{{ selectedKcPosition || '请选择扣车地点' }}</text>
</view>
<u-form labelPosition="top" :model="kcFormData" class="detain-form">
<u-form-item label="移交接车人" borderBottom label-width="100%" style="font-weight: bold;">
<view class="select-box" @click="showLzcPickerKc">
<text v-if="kcFormData.adviserName">{{ kcFormData.adviserName }}</text>
<text v-else class="placeholder">请选择移交接车人</text>
<view class="select-actions">
<u-icon name="arrow-right"></u-icon>
</view>
</view>
</u-form-item>
<u-form-item label="移交接车人(如果列表中没有,请手动输入)" borderBottom label-width="100%"
style="font-weight: bold;">
<u--input placeholder="请输入移交接车人姓名" v-model="kcFormData.name" border="none"
style="font-weight: normal;" :disabled="!!kcFormData.adviserName"></u--input>
</u-form-item>
<u-form-item label="移交接车人电话" borderBottom label-width="100%" style="font-weight: bold;">
<u--input placeholder="请输入移交接车人电话" v-model="kcFormData.phone" border="none"
style="font-weight: normal;"></u--input>
</u-form-item>
<u-form-item label="备注信息" borderBottom label-width="100%" style="font-weight: bold;">
<u--textarea v-model="kcFormData.remark" placeholder="请输入备注信息" border="none" autoHeight
style="font-weight: normal;"></u--textarea>
</u-form-item>
</u-form>
<!-- 上传状态提示 -->
<view class="upload-tips" v-if="uploadingRecord">
<u-loading-icon size="20" color="#0D2E8D"></u-loading-icon>
<text>图片上传中，请稍候...</text>
</view>
<view class="p-title">现场图片</view>
<view class="huinput">
<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple
:maxCount="5" :disabled="uploadingRecord"></u-upload>
</view>
<view class="button-group">
<view class="cancel-button" @click="closeDetainPopup">
<text>取消</text>
</view>
<view class="confirm-button" @click="confirmDetain">
<text>确认扣车</text>
</view>
</view>
</view>
</u-popup>
<!-- 移交客户弹框 -->
<u-popup :show="toHandoverShow" mode="center" :round="10" @close="closeHandoverPopup">
<view class="popup-box">
<view class="p-title title-content-s">{{ handoverTitle }}</view>
<u-form labelPosition="top" :model="handoverFormData" class="repair-form">
<u-form-item label="移交接车人姓名" borderBottom label-width="100%" style="font-weight: bold;">
<u--input placeholder="请输入移交接车人姓名" v-model="handoverFormData.name" border="none"
style="font-weight: normal;"></u--input>
</u-form-item>
<u-form-item label="移交接车人电话" borderBottom label-width="100%" style="font-weight: bold;">
<u--input placeholder="请输入移交接车人电话" v-model="handoverFormData.phone" border="none"
style="font-weight: normal;"></u--input>
</u-form-item>
<u-form-item label="备注信息" borderBottom label-width="100%" style="font-weight: bold;">
<u--textarea v-model="handoverFormData.remark" placeholder="请输入备注信息" border="none" autoHeight
style="font-weight: normal;"></u--textarea>
</u-form-item>
</u-form>
<!-- 上传状态提示 -->
<view class="upload-tips" v-if="uploadingRecord">
<u-loading-icon size="20" color="#0D2E8D"></u-loading-icon>
<text>图片上传中，请稍候...</text>
</view>
<view class="p-title">现场图片</view>
<view class="huinput">
<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple
:maxCount="5" :disabled="uploadingRecord"></u-upload>
</view>
<view class="button-group">
<view class="cancel-button" @click="closeHandoverPopup" :disabled="uploadingRecord">
<text>取消</text>
</view>
<view class="confirm-button" @click="confirmHandover" :disabled="uploadingRecord">
<text>确认移交</text>
</view>
</view>
</view>
</u-popup>
<!-- 补充照片弹窗 -->
<u-popup :show="supplementShow" mode="center" :round="10" @close="closeSupplementPopup"
:closeOnClickOverlay="false">
<view class="popup-box_bc">
<view class="p-title">补充照片</view>
<view class="upload-tips" v-if="uploading">
<u-loading-icon size="20" color="#0D2E8D"></u-loading-icon>
<text>照片上传中，请稍候...</text>
</view>
<view class="huinput">
<u-upload :fileList="supplementFileList" @afterRead="supplementAfterRead"
@delete="deleteSupplementPic" name="supplement" multiple :maxCount="10"
:disabled="uploading"></u-upload>
</view>
<view class="button-group">
<view class="cancel-button" @click="closeSupplementPopup" :disabled="uploading">
<text>取消</text>
</view>
<view class="confirm-button" @click="confirmSupplement" :disabled="uploading">
<text>确认</text>
</view>
</view>
</view>
</u-popup>
<!-- 主收费弹框 -->
<u-popup :show="showFeePopup" mode="center" :round="10" @close="closeFeePopup" :closeOnClickOverlay="false">
<view class="popup-box_sf">
<view class="p-title">收费</view>
<view class="payment-options">
<view class="payment-option" :class="{'active': selectedPayment === 'wechat'}"
@click="selectPayment('wechat')">
<text>微信</text>
</view>
<view class="payment-option" :class="{'active': selectedPayment === 'cash'}"
@click="selectPayment('cash')">
<text>现金</text>
</view>
<view class="payment-option" :class="{
'active': selectedPayment === 'credit',
'disabled': detailsData.payType !== 'qd'
}" @click="detailsData.payType === 'qd' && selectPayment('credit')">
<text>挂账</text>
</view>
</view>
<view class="button-group">
<view class="cancel-button" @click="closeFeePopup">
<text>取消</text>
</view>
<view class="confirm-button" @click="confirmPayment">
<text>确认</text>
</view>
</view>
</view>
</u-popup>
<!-- 微信支付子弹框 -->
<u-popup :show="showWechatPopup" mode="center" :round="10" @close="closeWechatPopup"
:closeOnClickOverlay="false">
<view class="popup-box-zf">
<view class="p-title">微信支付</view>
<scroll-view class="popup-scroll" scroll-y="true">
<view class="huinput_sf">
<text class="pay_font" style="margin-bottom: 2rpx;">拖车费用:</text>
<u--input type="number" v-model="towingFee" placeholder="请输入拖车费用" border="surround" clearable
@input="calculateTotalAmount"></u--input>
</view>
<view class="huinput_sf">
<text class="pay_font" style="margin-bottom: 2rpx;">吊车费用:</text>
<u--input type="number" v-model="craneFee" placeholder="请输入吊车费用" border="surround" clearable
@input="calculateTotalAmount"></u--input>
</view>
<view class="huinput_sf">
<text class="pay_font" style="margin-bottom: 2rpx;">其他费用:</text>
<u--input type="number" v-model="otherFee" placeholder="请输入其他费用" border="surround" clearable
@input="calculateTotalAmount"></u--input>
</view>
<view class="huinput_sf">
<text class="pay_font" style="margin-bottom: 2rpx;">其他费用备注:</text>
<textarea v-model="otherFeeRemark" placeholder="请输入其他费用备注" auto-height adjust-position
style="border: 2rpx solid rgba(151, 151, 152, 0.20); padding: 14rpx; width: 95%;"></textarea>
</view>
<view class="huinput_sf">
<text class="pay_font" style="color: red;">总计金额:</text>
<u--input type="number" v-model="setMoneyWx" placeholder="请输入金额之后点击确认金额" border="surround"
clearable style="font-weight: bold;" color='red'></u--input>
</view>
<text style="font-size: 13px; color: red; margin-bottom: 10px;">* 如需修改金额，请在修改后重新点击确认金额</text>
<view class="button-group" style="margin-top: 0; justify-content: space-around;">
<view class="confirm-button-wxtwo" @click="confirmWchatSetMoney">
<text>确认金额</text>
</view>
<view class="confirm-button-wxtwo" @click="showCodePopup" v-if="confirmedSetMoney">
<text>收款二维码</text>
</view>
</view>
<view class=" huinput_sf">
<text class="pay_font">备注信息:</text>
<u--textarea v-model="creditRemark" placeholder="请输入备注信息" border="bottom"
autoHeight></u--textarea>
</view>
<!-- 上传状态提示 -->
<view class="upload-tips" v-if="uploadingPayment">
<u-loading-icon size="20" color="#0D2E8D"></u-loading-icon>
<text>图片上传中，请稍候...</text>
</view>
<view class="pay_font">客户支付照片</view>
<view class="huinput_sf">
<u-upload :fileList="paymentFileList" @afterRead="paymentAfterRead" @delete="deletePaymentPic"
name="payment" multiple :maxCount="3" :disabled="uploadingPayment"></u-upload>
</view>
</scroll-view>
<view class="button-group">
<view class="cancel-button" @click="closeWechatPopup">
<text>取消</text>
</view>
<view class="confirm-button" @click="confirmWechatPayment">
<text>收款完成</text>
</view>
</view>
</view>
</u-popup>
<!-- 现金支付子弹框 -->
<u-popup :show="showCashPopup" mode="center" :round="10" @close="closeCashPopup" :closeOnClickOverlay="false">
<view class="popup-box-zf">
<view class="p-title">现金支付</view>
<scroll-view class="popup-scroll" scroll-y="true">
<view class="huinput_sf">
<text class="pay_font" style="margin-bottom: 2rpx;">拖车费用:</text>
<u--input type="number" v-model="towingFee" placeholder="请输入拖车费用" border="surround" clearable
@input="calculateTotalAmount"></u--input>
</view>
<view class="huinput_sf">
<text class="pay_font" style="margin-bottom: 2rpx;">吊车费用:</text>
<u--input type="number" v-model="craneFee" placeholder="请输入吊车费用" border="surround" clearable
@input="calculateTotalAmount"></u--input>
</view>
<view class="huinput_sf">
<text class="pay_font" style="margin-bottom: 2rpx;">其他费用:</text>
<u--input type="number" v-model="otherFee" placeholder="请输入其他费用" border="surround" clearable
@input="calculateTotalAmount"></u--input>
</view>
<view class="huinput_sf">
<text class="pay_font" style="margin-bottom: 2rpx;">其他费用备注:</text>
<textarea v-model="otherFeeRemark" placeholder="请输入其他费用备注" auto-height adjust-position
style="border: 2rpx solid rgba(151, 151, 152, 0.20); padding: 14rpx; width: 95%;"></textarea>
</view>
<view class="huinput_sf">
<text class="pay_font" style="color: red;">总计金额:</text>
<u--input type="number" v-model="setMoney" placeholder="请输入金额" border="surround" clearable
style="font-weight: bold;" color='red'></u--input>
</view>
<view class="huinput_sf">
<text class="pay_font">备注信息:</text>
<u--textarea v-model="creditRemark" placeholder="请输入备注信息" border="bottom"
autoHeight></u--textarea>
</view>
<!-- 上传状态提示 -->
<view class="upload-tips" v-if="uploadingPayment">
<u-loading-icon size="20" color="#0D2E8D"></u-loading-icon>
<text>图片上传中，请稍候...</text>
</view>
<view class="pay_font">收款凭证</view>
<view class="huinput_sf">
<u-upload :fileList="paymentFileList" @afterRead="paymentAfterRead" @delete="deletePaymentPic"
name="payment" multiple :maxCount="3" :disabled="uploadingPayment"></u-upload>
</view>
</scroll-view>
<view class="button-group">
<view class="cancel-button" @click="closeCashPopup">
<text>取消</text>
</view>
<view class="confirm-button" @click="confirmCashPayment">
<text>确认收款</text>
</view>
</view>
</view>
</u-popup>
<!-- 挂账子弹框 -->
<u-popup :show="showCreditPopup" mode="center" :round="10" @close="closeCreditPopup"
:closeOnClickOverlay="false">
<view class="popup-box-zf">
<view class="p-title">挂账</view>
<scroll-view class="popup-scroll" scroll-y="true">
<view class="huinput_sf">
<text class="pay_font" style="margin-bottom: 2rpx;">拖车费用:</text>
<u--input type="number" v-model="towingFee" placeholder="请输入拖车费用" border="surround" clearable
@input="calculateTotalAmount"></u--input>
</view>
<view class="huinput_sf">
<text class="pay_font" style="margin-bottom: 2rpx;">吊车费用:</text>
<u--input type="number" v-model="craneFee" placeholder="请输入吊车费用" border="surround" clearable
@input="calculateTotalAmount"></u--input>
</view>
<view class="huinput_sf">
<text class="pay_font" style="margin-bottom: 2rpx;">其他费用:</text>
<u--input type="number" v-model="otherFee" placeholder="请输入其他费用" border="surround" clearable
@input="calculateTotalAmount"></u--input>
</view>
<view class="huinput_sf">
<text class="pay_font" style="margin-bottom: 2rpx;">其他费用备注:</text>
<textarea v-model="otherFeeRemark" placeholder="请输入其他费用备注" auto-height adjust-position
style="border: 2rpx solid rgba(151, 151, 152, 0.20); padding: 14rpx; width: 95%;"></textarea>
</view>
<view class="huinput_sf">
<text class="pay_font" style="color: red;">总计挂账金额:</text>
<u--input type="number" v-model="setMoney" placeholder="请输入总计挂账金额" border="surround" clearable
style="font-weight: bold;" color='red'></u--input>
</view>
<view class="huinput_sf">
<text>收款负责人:</text>
<view class="select-box-gz" @click="dispatcherPickerShow = true">
<text v-if="selectedDispatcherName">{{ selectedDispatcherName }}</text>
<text v-else class="placeholder">请选择收款负责人</text>
<u-icon name="arrow-right"></u-icon>
</view>
</view>
<view class="huinput_sf">
<text>备注信息:</text>
<u--textarea v-model="creditRemark" placeholder="请输入备注信息" border="bottom"
autoHeight></u--textarea>
</view>
</scroll-view>
<view class="button-group">
<view class="cancel-button" @click="closeCreditPopup">
<text>取消</text>
</view>
<view class="confirm-button" @click="confirmCreditPayment">
<text>确认挂账</text>
</view>
</view>
</view>
</u-popup>
<!-- 支付二维码弹框 -->
<u-popup :show="showCodePopupVisible" mode="center" :round="10" :closeOnClickOverlay="false">
<view class="code-popup-container">
<view class="code-popup-header">
<text class="code-popup-title">收款二维码</text>
<view class="code-popup-close" @click="closeCodePopup">
<uni-icons type="close" color="#333" size="24"></uni-icons>
</view>
</view>
<view class="code-popup-header-money">
<view class="code-popup-title" v-if="confirmedSetMoney">收款金额:
{{ confirmedSetMoney }}
</view>
</view>
<view class="code-popup-content">
<canvas style="width: 200px; height: 200px; margin: 20px auto;" canvas-id="myQrcode"></canvas>
</view>
</view>
</u-popup>
<u-popup :show="showAddRepairFactoryModalView" mode="center" :round="10" @close="closeAddRepairFactoryModal">
<view class="popup-box">
<view class="p-title">新增修理厂</view>
<view class="huinput">
<u--input v-model="newRepairFactoryName" placeholder="请输入修理厂名称" border="bottom"></u--input>
</view>
<view class="button-group">
<view class="cancel-button" @click="closeAddRepairFactoryModal">
<text>取消</text>
</view>
<view class="confirm-button" @click="addNewRepairFactory">
<text>确认</text>
</view>
</view>
</view>
</u-popup>
<!-- 现场照片编辑弹窗 -->
<u-popup :show="editPhotoShow" mode="center" :round="10" @close="closeEditPhotoPopup"
:closeOnClickOverlay="false">
<view class="popup-box_bc">
<view class="p-title">编辑现场照片</view>
<view class="upload-tips" v-if="uploading">
<u-loading-icon size="20" color="#0D2E8D"></u-loading-icon>
<text>照片上传中，请稍候...</text>
</view>
<view class="huinput">
<u-upload :fileList="editFileList" @afterRead="editAfterRead" @delete="deleteEditPic" name="edit"
multiple :maxCount="10" :disabled="uploading"></u-upload>
</view>
<view class="button-group">
<view class="cancel-button" @click="closeEditPhotoPopup" :disabled="uploading">
<text>取消</text>
</view>
<view class="confirm-button" @click="confirmEditPhoto" :disabled="uploading">
<text>确认</text>
</view>
</view>
</view>
</u-popup>
<!-- 服务顾问选择器 -->
<lzc-picker ref="lzcPicker" :pickerList="staffList" pickerTittle="选择移交接车人"
@change="onLzcPickerConfirm"></lzc-picker>
<!-- 扣车人员选择 -->
<lzc-picker ref="lzcPickerKc" :pickerList="staffList" pickerTittle="选择移交接车人"
@change="onKcLzcPickerConfirm"></lzc-picker>
<!-- 扣车地点选择 -->
<u-picker :show="kcPositionShow" :columns="[kcPositionList]" keyName="label" @confirm="onKcPositionConfirm"
@cancel="kcPositionShow = false"></u-picker>
<!-- 调度人员选择器 -->
<u-picker :show="dispatcherPickerShow" :columns="dispatcherColumns" keyName="nickname"
@confirm="onDispatcherConfirm" @cancel="dispatcherPickerShow = false">
</u-picker>
<!-- 修理厂选择器 -->
<u-picker :show="repairFactoryShow" :columns="[repairFactoryList]" keyName="label"
@confirm="onRepairFactoryConfirm" @cancel="repairFactoryShow = false"></u-picker>
<!-- // 底部按钮 -->
<view class="fixed-bottom-button_1" v-if="detailsData.rescueStatusStr != '待救援' && currentStepIndex < 7">
<button @click="diyshow(detailsData.id)" :style="{backgroundColor: isProcessFinished ? '#999' : '#0D2E8D'}"
:disabled="isProcessFinished">
{{ nextStepName }}
</button>
</view>
<view class="fixed-bottom-button" v-if="detailsData.rescueStatusStr != '待救援' && currentStepIndex >= 7">
<button class="fee-button" @click="showFeePopupFunction" v-if="!shouldShowFeeButton"
style="background-color: #e43d33;">
收费
</button>
<button class="fee-button" @click="showFeePopupFunction" v-else
:style="{backgroundColor: isProcessFinished ? '#999' : '#999'}" disabled>
已收费
</button>
<button class="next-button" @click="diyshow(detailsData.id)"
:style="{backgroundColor: isProcessFinished ? '#999' : '#0D2E8D'}" :disabled="isProcessFinished">
{{ nextStepName }}
</button>
</view>
</view>
</template>
<script>
import request from '../../utils/request';
import tabBar from '../../components/tabBar/tabBar.vue';
import drawQrcode from 'weapp-qrcode';
import dayjs from '../../uni_modules/uview-ui/libs/util/dayjs';
import upload from '@/utils/upload.js';
import lzcPicker from '@/components/lzc-picker/lzc-picker.vue';
import {
getTenantId,
hasRole
} from "@/utils/auth";
export default {
components: {
lzcPicker
},
data() {
return {
rescueId: null,
show: false,
qdList: [],
skindex: 0,
carNumList: [],
carindex: 0,
ifNewEnergyIndex: 0,
codeShow: false,
carNumShow: false,
roadShow: false,
roadList: [],
sourceShow: false,
sourceList: [],
carList: [],
rescueDetail: '',
id: 0,
baseUrl: this.$baseUrl,
baseImageUrl: this.$baseImageUrl,
type: 'center',
msgType: 'success',
imageList: [],
isLoop: true,
messageText: '这是一条成功提示',
msg: '1',
detailsData: {},
singleList: [],
detailList: [],
tabindex: 0,
title: 'user',
checkedindex: false,
destinationLongitude: '',
destinationLatitude: '',
destinationInfo: '请选择',
province1: '',
city1: '',
area1: '',
four1: '',
recordShow: false,
recordSteps: [], // 记录流程步骤
currentStepIndex: null, // 当前步骤索引
nextStepName: '记录', // 下一步按钮文字
fileList1: [],
ulImages: [],
dictLabel: '',
dictValue: '',
remark: '',
isProcessFinished: false,
selectedOption: '', // 用于存储选中的选项
show1: false,
setMoney: '',
setMoneyWx: '',
confirmedSetMoney: '',
// 新增转维修相关数据
toRepairShow: false, // 转维修弹框显示
adviserShow: false, // 服务顾问选择器显示
kcAdviserShow: false, // 服务顾问选择器显示
repairFormData: { // 转维修表单数据
name: '',
phone: '',
brandName: '',
brandModel: '',
adviserName: '',
adviserId: '',
adviserPhone: '',
remark: '',
adviserNameManual: '',
repairFactoryName: '',
carNo: '',
},
staffList: [], // 服务顾问列表
toDetainShow: false, // 扣车弹框显示
kcPositionShow: false, // 扣车地点选择器显示
selectedKcPosition: '', // 选中的扣车地点
kcPositionList: [], // 扣车地点列表
kcFormData: {
isKouChe: 0,
kcPosition: '',
name: '',
phone: '',
remark: '',
adviserName: '',
adviserId: '',
adviserPhone: '',
},
// 移交客户相关
toHandoverShow: false,
handoverTitle: '移交客户',
handoverType: '', // 记录移交类型
handoverFormData: { // 转维修表单数据
name: '',
phone: '',
remark: '',
},
// 补充相片相关
// 控制弹窗显示
supplementShow: false,
// 上传文件列表
supplementFileList: [],
// 已上传的图片URL数组
supplementImages: [],
// 上传状态
uploading: false,
// 当前操作的流程项
currentSupplementItem: null,
// 救援开始弹框显示状态
acceptOrderShow: false,
startScale: '',
uploadingRecord: false,
// 收费弹框相关数据
showFeePopup: false,
selectedPayment: '',
paymentAmount: '',
changeAmount: '',
creditTarget: '',
// 收款相关备注
creditRemark: '',
// 挂账收款负责人
amountDirector: '',
// 子支付弹框显示状态
showWechatPopup: false,
showCashPopup: false,
showCreditPopup: false,
// 支付相关数据
paymentFileList: [], // 支付凭证文件列表
paymentImages: [], // 已上传的支付凭证图片URL
uploadingPayment: false, // 支付凭证上传状态
// 控制二维码弹框显示
showCodePopupVisible: false,
isSubmitting: false,
// 调度人员信息
dispatcherColumns: [],
// 调度人员选择器显示状态
dispatcherPickerShow: false,
// 选中的调度人员姓名
selectedDispatcherName: '',
// 选中的调度人员ID
selectedDispatcherId: '',
repairFactoryShow: false, // 修理厂选择器显示状态
repairFactoryList: [], // 修理厂列表
showAddRepairFactoryModalView: false, // 新增修理厂弹框显示状态
newRepairFactoryName: '', // 新修理厂名称
faultPhenomenonShow: false,
faultPhenomenonList: [],
faultTypeShow: false,
faultTypeList: [],
// 现有变量保持不变...
editPhotoShow: false, // 编辑照片弹窗显示状态
editFileList: [], // 编辑文件列表
editImages: [], // 已编辑的图片URL数组
currentEditItem: null, // 当前编辑的流程项
editField: '', // 编辑的字段名（images或supplementImages）
// 拖车费用
towingFee: 0,
// 吊车费用
craneFee: 0,
//其他费用
otherFee: 0,
//其他费用备注
otherFeeRemark: '',
ifNewEnergyList: [{
label: '是',
value: 1
},
{
label: '否',
value: 0
},
],
orderCompleteShow: false,
}
},
onLoad(option) {
this.id = option.id
this.getrescueDetail(option.id)
this.newtwo()
this.getRoadList(false);
this.getSourceList(false)
this.getSecondDispatcher()
},
mounted() {
this.getStaffList()
this.getKcPositionList()
},
onShow() {
},
computed: {
shouldShowFeeButton() {
return this.detailsData && this.currentStepIndex >= 7 &&
(!this.detailsData.orderStatus ||
this.detailsData.orderStatus == 2 ||
this.detailsData.orderStatus == 4);
}
},
methods: {
// 自动计算总计金额
calculateTotalAmount() {
const towing = parseFloat(this.towingFee) || 0;
const crane = parseFloat(this.craneFee) || 0;
const other = parseFloat(this.otherFee) || 0;
const total = towing + crane + other;
// 更新对应的金额字段
if (this.showWechatPopup) {
this.setMoneyWx = total;
} else {
this.setMoney = total;
}
},
// 查询路段的方法
getSectionRoadLabel(id) {
if (typeof id === 'string') {
id = parseInt(id)
}
return this.roadList.find(item => item.id === id)?.label
},
chooseRoad(data) {
console.log(data);
this.detailsData.channel = data.value[0].label
this.roadShow = false
},
chooseFaultType(data) {
console.log(data);
this.detailsData.faultType = data.value[0].name;
this.faultTypeShow = false;
},
chooseFaultPhenomenon(data) {
console.log(data);
this.detailsData.phenomenon = data.value[0].name;
this.faultPhenomenonShow = false;
},
chooseCar(data) {
this.carNumShow = false
this.detailsData.driverCarNum = data.value[0].rescueCarNum
},
getRoadList(flag = true) {
request({
url: '/system/rescueInfo/getRescueChannel',
method: 'get'
}).then((res) => {
this.roadShow = flag
this.roadList = res.data
})
},
getFaultTypeList(flag = true) {
request({
url: '/rescue-type-phenomenon/typeList',
method: 'get'
}).then((res) => {
this.faultTypeShow = flag
this.faultTypeList = res.data
})
},
getFaultPhenomenonList(flag = true) {
request({
url: '/rescue-type-phenomenon/phenomenonList',
method: 'get'
}).then((res) => {
this.faultPhenomenonShow = flag
this.faultPhenomenonList = res.data
})
},
chooseSource(data) {
console.log(data);
this.detailsData.source = data.value[0].label
this.sourceShow = false
},
getSourceLabel(id) {
if (typeof id === 'string') {
id = parseInt(id)
}
return this.sourceList.find(item => item.id === id)?.label
},
getSourceList(flag = true) {
request({
url: '/system/rescueInfo/getRescueSource',
method: 'get'
}).then((res) => {
this.sourceShow = flag
this.sourceList = res.data
})
},
getCarList() {
let data = {
driverId: uni.getStorageSync('driverInfo')
}
console.log('driverId', data)
request({
// url: '/system/rescueCar/list',
url: '/rescue/rescue-driver-car-relation/getCarList',
method: 'get',
params: data
}).then((res) => {
this.carNumShow = true
console.log('获取车辆信息', res);
this.carNumList = res.data
})
},
getmap1() {
let that = this
if (this.detailsData.kcPosition) {
uni.chooseLocation({
success: function(res) {
console.log('位置名称：' + res.name);
console.log('详细地址：' + res.address);
console.log('纬度：' + res.latitude);
console.log('经度：' + res.longitude);
that.destinationLongitude = res.longitude
that.destinationLatitude = res.latitude
that.kcPosition = res.address
var address = res.address;
var reg = /.+?(省|市|自治区|自治州|县|区)/g;
let addressList = address.match(reg).toString().split(",");
if (addressList[0] == '重庆市' || addressList[0] == '北京市' || addressList[0] ==
'天津市' || addressList[0] == '上海市') {
that.province1 = addressList[0];
that.city1 = '市辖区';
that.area1 = addressList[1];
that.detailsData.kcPosition = address.replace(that.province, '').replace(that
.city, '').replace(that.area, '');
} else {
that.province1 = addressList[0];
that.city1 = addressList[1];
that.area1 = addressList[2];
that.detailsData.kcPosition = address.replace(that.province, '').replace(that
.city, '').replace(that.area, '');
};
console.log(that.detailsData.kcPosition);
}
});
} else {
uni.chooseLocation({
success: function(res) {
console.log('位置名称：' + res.name);
console.log('详细地址：' + res.address);
console.log('纬度：' + res.latitude);
console.log('经度：' + res.longitude);
that.destinationLongitude = res.longitude
that.destinationLatitude = res.latitude
that.destinationInfo = res.address
var address = res.address;
var reg = /.+?(省|市|自治区|自治州|县|区)/g;
let addressList = address.match(reg).toString().split(",");
if (addressList[0] == '重庆市' || addressList[0] == '北京市' || addressList[0] ==
'天津市' || addressList[0] == '上海市') {
that.province1 = addressList[0];
that.city1 = '市辖区';
that.area1 = addressList[1];
that.detailsData.destinationInfo = address.replace(that.province, '').replace(
that.city, '').replace(that.area, '');
} else {
that.province1 = addressList[0];
that.city1 = addressList[1];
that.area1 = addressList[2];
that.detailsData.destinationInfo = address.replace(that.province, '').replace(
that.city, '').replace(that.area, '');
};
console.log(that.detailsData.destinationInfo);
}
});
}
},
lookimg(idx, tmpList) {
let resList = [];
tmpList.forEach(it => {
resList.push(this.baseImageUrl + it)
})
uni.previewImage({
urls: resList,
current: idx,
indicator: 'none',
loop: this.isLoop
})
},
confirmadd() {
// this.show = false
let data = this.detailsData
console.log('支付之后提交的修改订单的数据', data)
request({
/* url: '/app/rescueInfo/edit',
method: 'post', */
url: '/app/driver/updateRescueInfo',
method: 'put',
data: data
}).then((res) => {
console.log(res);
if (res.code == 200) {
uni.showToast({
title: '修改成功',
icon: 'none'
})
this.show = false
this.getrescueDetail(this.detailsData.id)
}
})
},
cancelopen() {
this.show = false
},
newtwo() {
request({
url: '/rescue/dict/data/type/fee_type',
method: 'get',
}).then((res) => {
console.log('fee_type', res);
this.qdList = res.data
})
request({
url: '/rescue/dict/data/type/rescue_car_type',
method: 'get',
}).then((res) => {
this.carList = res.data
console.log('rescue_car_type', res);
})
},
getcarindex(index) {
this.carindex = index
this.detailsData.carType = index
},
getIfNewEnergy(index) {
this.ifNewEnergyIndex = index
this.detailsData.ifNewEnergy = index
},
getskindex(index) {
this.skindex = index
this.detailsData.feeType = index
},
closeCodePop() {
this.codeShow = false
},
showCode() {
this.codeShow = true
let data = {
id: this.id
}
request({
url: '/rescuePayApi/createOrder',
method: 'post',
params: data
}).then((res) => {
console.log(res.data.code_url);
drawQrcode({
width: 100,
height: 100,
canvasId: 'myQrcode',
text: res.data.code_url
})
})
},
// 显示二维码弹框
showCodePopup() {
this.showCodePopupVisible = true;
// 生成二维码
this.$nextTick(() => {
this.generateQrCode();
});
},
// 关闭二维码弹框
closeCodePopup() {
this.showCodePopupVisible = false;
},
// 生成二维码
generateQrCode() {
let data = {
id: this.id
}
request({
url: '/rescuePayApi/createOrder',
method: 'post',
params: data
}).then((res) => {
console.log('res.data', res.data);
console.log(res.data.code_url);
drawQrcode({
width: 200,
height: 200,
canvasId: 'myQrcode',
text: res.data.code_url
})
})
},
gogogo() {
console.log('执行');
uni.openLocation({
latitude: parseFloat(this.detailsData.rescueLatitude),
longitude: parseFloat(this.detailsData.rescueLongitude),
success: function() {
console.log('success');
},
complete: function(res) {
console.log(res);
}
});
},
goback() {
uni.navigateBack()
},
gotel(num) {
uni.makePhoneCall({
phoneNumber: num //仅为示例
});
},
getrescueDetail(id) {
uni.showLoading({
title: '刷新中'
});
request({
url: '/app/driver/rescueDetail?rescueId=' + id,
method: 'get',
}).then((res) => {
console.log('详情', res);
this.detailsData = res.data.rescueInfo
this.carindex = res.data.rescueInfo.carType // 回显车型
this.ifNewEnergyIndex = res.data.rescueInfo.ifNewEnergy
this.skindex = res.data.rescueInfo.feeType
this.detailList = res.data.detailList
if (res.data.rescueInfo.currentRecordStep != null) {
console.log('res.rescueInfo.currentRecordStep', res.data.rescueInfo)
this.currentStepIndex = res.data.rescueInfo.currentRecordStep
console.log('this.currentStepIndex', this.currentStepIndex)
}
/* console.log('this.currentStepIndex', this.currentStepIndex)
console.log('res.rescueInfo.currentRecordStep', res.rescueInfo.currentRecordStep) */
if (this.detailList && this.detailList.length > 0) {
this.detailList.forEach(item => {
if (item.createTime) {
item.createTime = dayjs(item.createTime).format('YYYY-MM-DD HH:mm:ss')
}
})
}
if (res.data.rescueInfo.setMoney != null) {
this.setMoneyWx = res.data.rescueInfo.setMoney / 100
this.confirmedSetMoney = res.data.rescueInfo.setMoney / 100
}
this.getRecordSteps();
uni.hideLoading();
})
},
dialogToggle() {
this.$refs.alertDialog.open()
},
inputDialogToggle() {
this.$refs.inputDialog.open()
},
dialogClose() {
console.log('点击关闭')
},
dialogInputConfirm(val) {
this.$refs.inputDialog.close()
},
getnaiv() {
uni.navigateTo({
url: '/pages/rescue/rescue'
})
},
getcheckedindex() {
let data = {
driverId: uni.getStorageSync('driverInfo')
}
request({
url: '/app/driver/updateWork',
method: 'post',
params: data
}).then((res) => {
console.log(res);
this.getStatus
})
// this.checkedindex =! this.checkedindex
console.log(this.checkedindex);
},
gettab(index) {
this.tabindex = index
},
diyshow(id) {
if (this.isProcessFinished) {
uni.showToast({
title: '流程已结束',
icon: 'none'
});
return;
}
this.rescueId = id;
if (this.recordSteps.length > 0) {
this.dictValue = this.recordSteps[this.currentStepIndex - 1].value;
this.dictLabel = this.recordSteps[this.currentStepIndex - 1].label;
}
if (this.currentStepIndex === 2) {
this.acceptOrderShow = true;
} else if (this.currentStepIndex === 7) {
this.orderCompleteShow = true
} else {
this.recordShow = true;
}
},
cancelRecord() {
this.recordShow = false;
this.remark = ''; // 清空备注
this.fileList1 = []; // 清空图片列表
this.selectedOption = '';
this.ulImages = [];
},
cancelOrderComplete() {
this.orderCompleteShow = false;
this.remark = ''; // 清空备注
this.fileList1 = []; // 清空图片列表
this.selectedOption = '';
this.ulImages = [];
},
deletePic(event) {
// 从 fileList 中删除
this[`fileList${event.name}`].splice(event.index, 1);
// 重新构建 ulImages
this.ulImages = this.fileList1
.filter(item => item.status === 'success')
.map(item => item.url);
console.log('this.fileList1', this.fileList1)
},
// 新增图片
async afterRead(event) {
// 设置上传状态
this.uploadingRecord = true;
// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
let lists = [].concat(event.file)
let fileListLen = this[`fileList${event.name}`].length
lists.map((item) => {
this[`fileList${event.name}`].push({
...item,
status: 'uploading' // 设置初始状态为上传中
})
})
for (let i = 0; i < lists.length; i++) {
try {
const result = await this.uploadFilePromise(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++
} catch (error) {
console.error('上传失败:', error);
let item = this[`fileList${event.name}`][fileListLen]
this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
status: 'failed',
message: '上传失败'
}))
fileListLen++
}
}
// 上传完成，取消上传状态
this.uploadingRecord = false;
},
uploadFilePromise(url) {
return new Promise((resolve, reject) => {
upload({
url: '/infra/file/upload',
filePath: url,
}).then((res) => {
console.log('ulImages', res.data);
this.ulImages.push(res.data)
resolve(res.data);
}).catch(reject);
});
},
uploadFilePromiseSupplement(url) {
return new Promise((resolve, reject) => {
upload({
url: '/infra/file/upload',
filePath: url,
}).then((res) => {
console.log('supplementImages', res.data);
// this.supplementImages.push(res.data);
resolve(res.data);
}).catch(reject);
});
},
getRecordSteps() {
request({
url: '/rescue/dict/data/type/rescue_process_node_fixed',
method: 'get'
}).then(res => {
this.recordSteps = res.data.sort((a, b) => a.value - b.value);
console.log('this.recordSteps', this.recordSteps)
// 修正：使用 value 来查找对应的步骤
const currentStep = this.recordSteps.find(step => step.value == this.currentStepIndex);
if (!currentStep) {
this.isProcessFinished = true;
this.nextStepName = '流程结束';
} else {
this.isProcessFinished = false;
this.nextStepName = `下一步：${currentStep.label}`;
}
});
},
// 获取位置
getLocation() {
return new Promise((resolve, reject) => {
uni.getLocation({
isHighAccuracy: true,
success: (res) => resolve(res),
fail: (error) => reject(error)
});
});
},
completeRescue() {
let data = {
rescueId: this.id,
}
request({
url: '/app/driver/endRescue',
method: 'post',
params: data
}).then((res) => {
if (res.code == 200) {
uni.showToast({
title: '提交成功',
})
this.getrescueDetail(this.id)
}
})
},
getjine(oneData) {
console.log('oneData', oneData)
if (!this.setMoney) {
uni.showToast({
title: '请输入金额',
icon: 'none'
})
return
}
let data = {
...oneData,
rescueId: this.id,
setMoney: this.setMoney,
towingFee: this.towingFee,
craneFee: this.craneFee,
otherFee: this.otherFee,
otherFeeRemark: this.otherFeeRemark,
}
request({
url: '/app/driver/setOrderMoneyNew',
method: 'post',
data: data
}).then((res) => {
if (res.code == 200) {
uni.showToast({
title: '提交成功',
})
this.show1 = false
this.setMoney = ''
this.getrescueDetail(this.id)
}
})
},
/**
* 获取服务顾问列表
*/
getStaffList() {
if (this.staffList.length > 0) return;
request({
url: '/system/role/selectListByRoleIdJYNew',
method: 'get',
params: {
pageSize: 1000,
pageNum: 1
}
}).then((res) => {
if (res.code == 200) {
this.staffList = res.data.records;
}
console.log('服务顾问res', res)
}).catch(error => {
console.error('获取服务顾问列表失败:', error);
});
},
getKcPositionList() {
request({
url: '/rescue/dict/data/type/kcPosition-' + getTenantId(),
method: 'get'
}).then(res => {
this.kcPositionList = res.data
})
},
/**
* 显示服务顾问选择器
*/
showAdviserPicker() {
if (this.staffList.length === 0) {
this.getStaffList();
}
this.$refs.adviserPicker.show({
mode: 'search',
data: this.staffList,
keyName: 'nickname',
onConfirm: this.onAdviserConfirm
});
},
/**
* 转维修服务顾问选择确认
*/
onAdviserConfirm(e) {
const selectedAdviser = e.value[0];
this.repairFormData.adviserName = selectedAdviser.nickname;
this.repairFormData.adviserId = selectedAdviser.id;
this.repairFormData.userId = selectedAdviser.id;
this.repairFormData.adviserPhone = selectedAdviser.mobile || ''; // 自动填充手机号
this.adviserShow = false;
},
// 显示自定义选择器
showLzcPicker() {
if (this.staffList.length === 0) {
this.getStaffList().then(() => {
this.$refs.lzcPicker.handleShow();
});
} else {
this.$refs.lzcPicker.handleShow();
}
},
showLzcPickerKc() {
if (this.staffList.length === 0) {
this.getStaffList().then(() => {
this.$refs.lzcPickerKc.handleShow();
});
} else {
this.$refs.lzcPickerKc.handleShow();
}
},
// 自定义选择器确认
onLzcPickerConfirm(selectedItem) {
this.repairFormData.adviserName = selectedItem.nickname;
this.repairFormData.adviserId = selectedItem.id;
this.repairFormData.userId = selectedItem.id;
this.repairFormData.adviserPhone = selectedItem.mobile || '';
},
onKcLzcPickerConfirm(selectedItem) {
this.kcFormData.adviserName = selectedItem.nickname;
this.kcFormData.adviserId = selectedItem.id;
this.kcFormData.userId = selectedItem.id;
this.kcFormData.phone = selectedItem.mobile || '';
},
onKcAdviserConfirm(e) {
this.kcFormData.adviserName = e.value[0].nickname;
this.kcFormData.adviserId = e.value[0].id;
this.kcFormData.userId = e.value[0].id;
this.kcAdviserShow = false;
},
onKcPositionConfirm(e) {
this.selectedKcPosition = e.value[0].label
this.kcFormData.isKouChe = 1
this.kcFormData.kcPosition = e.value[0].label
this.kcPositionShow = false;
},
/**
* 准备转维修表单数据
*/
prepareRepairForm() {
this.getRepairFactoryList();
this.repairFormData = {
name: this.detailsData.connectionName || '',
phone: this.detailsData.connectionPhone || '',
brandName: this.detailsData.carBrand || '',
brandModel: '',
adviserName: '',
adviserId: '',
adviserPhone: '',
remark: '',
adviserNameManual: '',
carNo: this.detailsData.licenseNum || '',
};
},
/**
* 确认转维修
*/
confirmRepair() {
// 检查是否正在上传
if (this.uploadingRecord) {
uni.showToast({
title: '图片上传中，请稍候',
icon: 'none'
});
return;
}
// 检查是否有图片正在上传（fileList1中有status为uploading的项）
const isUploading = this.fileList1.some(item => item.status === 'uploading');
if (isUploading) {
uni.showToast({
title: '有图片正在上传，请等待完成',
icon: 'none'
});
return;
}
// 验证必填字段
if (!this.repairFormData.name || !this.repairFormData.phone) {
uni.showToast({
title: '请填写姓名和联系电话',
icon: 'none'
});
return;
}
if (this.ulImages.length === 0) {
uni.showToast({
title: '请上传图片',
icon: 'none'
})
return
}
// 关闭转维修弹框
this.toRepairShow = false;
this.recordShow = false;
// 继续执行主流程提交，携带转维修数据
this.submitProcessData({
toRepair: true,
...this.repairFormData
});
},
/**
* 关闭转维修弹框
*/
closeRepairPopup() {
this.toRepairShow = false;
// 用户取消转维修，清空选择
this.selectedOption = '';
},
/**
* 提交流程数据
*/
async submitProcessData(additionalData = null) {
try {
if (this.ulImages.length === 0 && this.currentStepIndex != 6) {
uni.showToast({
title: '请上传图片',
icon: 'none'
});
return;
}
if (this.currentStepIndex === 6 && !this.selectedOption && !additionalData?.toRepair) {
uni.showToast({
title: '请选择一个操作选项',
icon: 'none'
});
return;
}
// 基础数据
let tempImage = JSON.parse(JSON.stringify(this.ulImages))
let data = {
rescueInfoId: this.rescueId,
title: this.dictLabel,
images: tempImage.join(","),
remark: this.remark,
type: this.dictValue,
};
// 合并附加数据
if (additionalData) {
Object.assign(data, additionalData);
}
// 获取位置信息
try {
const location = this.getLocation();
data.lng = location.longitude;
data.lat = location.latitude;
} catch (error) {
console.warn('获取位置失败，继续提交数据');
}
// 处理步骤6
if (this.currentStepIndex === 6) {
this.processStep6Data(data);
}
// 处理交接类型
if (additionalData?.handoverType) {
this.processHandoverData(data, additionalData);
}
if (data.type == 3 && this.detailsData) {
if (this.detailsData.rescueType == 5 && this.detailsData.kcPosition) {
data.autoRemark = '目的地：' + this.detailsData.kcPosition;
} else if (this.detailsData.rescueType == 1 && this.detailsData.destinationInfo) {
data.autoRemark = '目的地：' + this.detailsData.destinationInfo;
} else {
data.autoRemark = '';
}
}
// 计算耗时
this.calculateTimeCost(data);
const res = await request({
url: '/app/driver/uploadDetailByDriver',
method: 'post',
data: data
});
if (res.code == 200) {
// 重置表单数据
this.ulImages = [];
this.remark = '';
this.fileList1 = [];
this.selectedOption = '';
uni.showToast({
title: '提交成功',
icon: 'success',
duration: 2000
});
// 如果是转维修，额外调用转维修接口
if (additionalData?.toRepair && this.repairFormData.adviserId && this.repairFormData
.adviserName) {
await this.submitToRepair(additionalData);
}
// 更新流程状态
let updateData = {
id: this.detailsData.id,
currentRecordStep: this.currentStepIndex + 1
};
if (this.currentStepIndex == 2) {
updateData.rescueStartTime = new Date();
}
if (this.currentStepIndex == 7) {
updateData.rescueEndTime = new Date();
updateData.rescueStatus = '4';
updateData.endScale = this.detailsData.endScale;
updateData.licenseNum = this.detailsData.licenseNum;
}
// 更新下一步显示
this.currentStepIndex++;
if (this.currentStepIndex < this.recordSteps.length) {
this.nextStepName = `下一步：${this.recordSteps[this.currentStepIndex].label}`;
this.isProcessFinished = false;
} else {
this.nextStepName = '流程结束';
this.isProcessFinished = true;
}
await request({
url: '/app/driver/updateRescueInfo',
method: 'put',
data: updateData
});
// 刷新订单详情
this.recordShow = false;
if (this.currentStepIndex == 7) {
this.orderCompleteShow = false;
}
this.getrescueDetail(this.rescueId);
} else {
throw new Error(`API返回错误代码: ${res.code}`);
}
} catch (error) {
console.error('提交失败:', error);
}
},
/**
* 处理步骤6的数据逻辑
*/
processStep6Data(data) {
if (!this.selectedOption) return;
switch (this.selectedOption) {
case 'repair':
let autoRemarkTemp = '转维修';
if (!this.repairFormData.adviserId || !this.repairFormData.adviserName) {
if (this.repairFormData.adviserNameManual) {
autoRemarkTemp = '转维修, ' + '移交接车人: ' + this.repairFormData.adviserNameManual + ', ' +
'移交接车人电话: ' + this.repairFormData.adviserPhone;
}
} else {
autoRemarkTemp = '转维修, ' + '移交接车人: ' + this.repairFormData.adviserName + ', ' +
'移交接车人电话: ' + this.repairFormData.adviserPhone;
}
if (this.repairFormData.repairFactoryName) {
autoRemarkTemp = autoRemarkTemp + ', ' + '修理厂: ' + this.repairFormData.repairFactoryName
}
data.remark = this.repairFormData.remark;
data.autoRemark = autoRemarkTemp;
break;
case 'detain':
let autoRemarkTempKc = '扣车' + ', ' + '扣车地点: ' + this.kcFormData.kcPosition;
if (!this.kcFormData.adviserId || !this.kcFormData.adviserName) {
autoRemarkTempKc = '扣车, ' + '扣车地点: ' + this.kcFormData.kcPosition + ', ' + '移交接车人: ' +
this.kcFormData.name + ', ' + '移交接车人电话: ' + this.kcFormData.phone;
} else {
autoRemarkTempKc = '扣车, ' + '扣车地点: ' + this.kcFormData.kcPosition + ', ' + '移交接车人: ' +
this.kcFormData.adviserName + ', ' + '移交接车人电话: ' + this.kcFormData.phone;
}
data.remark = this.kcFormData.remark;
data.autoRemark = autoRemarkTempKc;
break;
}
},
/**
* 处理交接类型数据逻辑
*/
processHandoverData(data, additionalData) {
let remarkText = '';
let handoverTitle = '';
switch (additionalData.handoverType) {
case 'handover':
remarkText = '移交接车人: ' + additionalData.name + ', ' + '移交接车人电话: ' + additionalData.phone;
handoverTitle = '移交客户';
break;
case 'specifyRepairShop':
remarkText = '移交接车人: ' + additionalData.name + ', ' + '移交接车人电话: ' + additionalData.phone;
handoverTitle = '客户指定修理厂';
break;
case 'specifyPickUpPeople':
remarkText = '移交接车人: ' + additionalData.name + ', ' + ' 移交接车人电话: ' + additionalData.phone;
handoverTitle = '客户指定接车人';
break;
}
data.autoRemark = remarkText;
data.handoverTitle = handoverTitle;
},
/**
* 计算时间成本逻辑
*/
calculateTimeCost(data) {
let targetType = null;
if (data.type == 3) targetType = 2;
else if (data.type == 4) targetType = 3;
else if (data.type == 7) targetType = 2;
if (targetType && Array.isArray(this.detailList)) {
const targetRecord = this.detailList.find(item => item.type == targetType);
if (targetRecord && targetRecord.createTime) {
try {
const startTime = new Date(targetRecord.createTime.replace(/-/g, '/'));
const endTime = new Date();
const timeDiff = endTime.getTime() - startTime.getTime();
data.timeCost = (timeDiff / (1000 * 60)).toFixed(2);
} catch (error) {
console.warn('计算时间成本时出错');
data.timeCost = '0.00';
}
}
}
},
/* =============================================================================================== */
/**
* 提交转维修请求
*/
async submitToRepair(repairData) {
console.log('1-1-1')
console.log('repairData', repairData)
try {
const toRepairData = {
rescueId: this.detailsData.id,
userName: this.repairFormData.name,
userMobile: this.repairFormData.phone,
brandName: this.repairFormData.brandName,
brandModel: this.repairFormData.brandModel,
adviserName: this.repairFormData.adviserName,
adviserId: this.repairFormData.adviserId,
adviserPhone: this.repairFormData.adviserPhone,
remark: this.repairFormData.remark,
carNo: this.repairFormData.carNo,
};
const res = await request({
url: '/app/rescueInfo/toRepair',
method: 'post',
data: toRepairData
});
if (res.code == 200) {
uni.showToast({
title: '转维修成功'
});
}
} catch (error) {
console.error('转维修提交失败:', error);
}
},
// 显示移交客户弹框
showHandoverPopup(type) {
this.handoverType = type;
// 根据类型设置不同的标题
switch (type) {
case 'handover':
this.handoverTitle = '移交客户';
break;
case 'specifyRepairShop':
this.handoverTitle = '移交客户指定修理厂';
break;
case 'specifyPickUpPeople':
this.handoverTitle = '移交客户指定接车人';
break;
default:
this.handoverTitle = '移交客户';
}
// 重置表单数据
this.handoverFormData = {
name: '',
phone: '',
remark: ''
};
this.toHandoverShow = true;
},
// 关闭移交客户弹框
closeHandoverPopup() {
this.toHandoverShow = false;
this.handoverType = '';
},
// 确认移交
async confirmHandover() {
// 检查是否正在上传
if (this.uploadingRecord) {
uni.showToast({
title: '图片上传中，请稍候',
icon: 'none'
});
return;
}
// 检查是否有图片正在上传（fileList1中有status为uploading的项）
const isUploading = this.fileList1.some(item => item.status === 'uploading');
if (isUploading) {
uni.showToast({
title: '有图片正在上传，请等待完成',
icon: 'none'
});
return;
}
// 验证必填字段
if (!this.handoverFormData.name) {
uni.showToast({
title: '请填写移交接车人姓名',
icon: 'none'
});
return;
}
if (!this.handoverFormData.phone) {
uni.showToast({
title: '请填写移交接车人电话',
icon: 'none'
});
return;
}
if (this.ulImages.length === 0) {
uni.showToast({
title: '请上传图片',
icon: 'none'
})
return
}
// 关闭弹框
this.toHandoverShow = false;
// 关闭父弹框
this.recordShow = false;
// 准备移交数据
let additionalData = {
handoverType: this.handoverType,
name: this.handoverFormData.name,
phone: this.handoverFormData.phone,
remark: this.handoverFormData.remark || ''
};
// 执行主流程提交
await this.submitProcessData(additionalData);
},
// 显示扣车弹框
showDetainPopup() {
this.selectedKcPosition = '';
this.toDetainShow = true;
},
// 关闭扣车弹框
closeDetainPopup() {
this.toDetainShow = false;
this.selectedKcPosition = '';
this.kcFormData = [];
},
// 显示扣车地点选择器
showKcPositionPicker() {
if (this.kcPositionList.length === 0) {
this.getKcPositionList();
}
this.kcPositionShow = true;
},
// 确认扣车
confirmDetain() {
// 检查是否正在上传
if (this.uploadingRecord) {
uni.showToast({
title: '图片上传中，请稍候',
icon: 'none'
});
return;
}
// 检查是否有图片正在上传（fileList1中有status为uploading的项）
const isUploading = this.fileList1.some(item => item.status === 'uploading');
if (isUploading) {
uni.showToast({
title: '有图片正在上传，请等待完成',
icon: 'none'
});
return;
}
if (!this.selectedKcPosition) {
uni.showToast({
title: '请选择扣车地点',
icon: 'none'
});
return;
}
if (this.ulImages.length === 0) {
uni.showToast({
title: '请上传图片',
icon: 'none'
})
return
}
// 关闭扣车弹框
this.toDetainShow = false;
this.recordShow = false;
// 执行扣车操作
this.submitDetainData();
// 主流程
this.submitProcessData()
},
// 提交扣车数据
async submitDetainData() {
this.detailsData.isKouChe = this.kcFormData.isKouChe
this.detailsData.kcPosition = this.kcFormData.kcPosition
this.detailsData.kcUserId = this.kcFormData.adviserId
// this.detailsData.rescueType = 5
this.confirmadd()
},
// 保存开始里程
async updateStartScaleData() {
this.detailsData.startScale = this.startScale
this.confirmadd()
},
/**
* 流程记录提交
*/
async getdaoda() {
console.log('3-1')
if (this.isSubmitting) {
uni.showToast({
title: '请求处理中，请稍候',
icon: 'none'
});
return;
}
if (this.uploadingRecord) {
uni.showToast({
title: '图片上传中，请稍候',
icon: 'none'
});
return;
}
// 检查是否有图片正在上传（fileList1中有status为uploading的项）
const isUploading = this.fileList1.some(item => item.status === 'uploading');
if (isUploading) {
uni.showToast({
title: '有图片正在上传，请等待完成',
icon: 'none'
});
return;
}
if (this.currentStepIndex === 7 && (!this.detailsData.licenseNum || this.detailsData.licenseNum
.trim() === '')) {
uni.showToast({
title: '请填写故障车车牌号',
icon: 'none'
})
return
}
if (this.currentStepIndex === 7 && !this.detailsData.endScale) {
uni.showToast({
title: '请填写车辆里程',
icon: 'none'
})
return
}
if (this.ulImages.length === 0 && this.currentStepIndex != 6) {
uni.showToast({
title: '请上传图片',
icon: 'none'
})
return
}
try {
console.log('3-2')
this.isSubmitting = true;
// 如果选择了转维修，先显示转维修弹框
if (this.selectedOption === 'repair') {
this.prepareRepairForm();
this.toRepairShow = true;
return; // 中断执行，等待转维修表单确认
}
// 扣车
if (this.selectedOption === 'detain') {
this.showDetainPopup();
return;
}
// 处理移交客户相关选项
if (this.selectedOption === 'handover' ||
this.selectedOption === 'specifyRepairShop' ||
this.selectedOption === 'specifyPickUpPeople') {
this.showHandoverPopup(this.selectedOption);
return;
}
// 非转维修情况，直接执行提交
console.log('3', 3)
await this.submitProcessData();
} catch (error) {
console.error('提交失败:', error);
} finally {
// 确保在任何情况下都会重置提交状态
this.isSubmitting = false;
}
},
// 关闭救援开始弹框
closeAcceptOrderPopup() {
this.acceptOrderShow = false;
this.startScale = '';
this.fileList1 = [];
this.ulImages = [];
},
// 确认救援开始
async confirmAcceptOrder() {
if (this.isSubmitting) {
uni.showToast({
title: '请求处理中，请稍候',
icon: 'none'
});
return;
}
// 检查是否有图片正在上传（fileList1中有status为uploading的项）
const isUploading = this.fileList1.some(item => item.status === 'uploading');
if (isUploading) {
uni.showToast({
title: '有图片正在上传，请等待完成',
icon: 'none'
});
return;
}
if (!this.startScale) {
uni.showToast({
title: '请输入车辆里程数',
icon: 'none'
});
return;
}
if (this.ulImages.length === 0) {
uni.showToast({
title: '请上传里程表图片',
icon: 'none'
});
return;
}
try {
// 关闭弹框
// this.acceptOrderShow = false;
// 更新里程信息
this.updateStartScaleData()
console.log('1', 1)
// 救援详情
this.getdaoda()
console.log('2', 2)
// 清空数据
this.closeAcceptOrderPopup()
} catch (error) {
console.error('提交失败:', error);
uni.showToast({
title: '提交失败',
icon: 'none'
});
} finally {
// 确保重置提交状态
this.isSubmitting = false;
}
},
// 显示补充照片弹窗
showSupplementPopup(item) {
this.currentSupplementItem = item;
this.supplementShow = true;
// 保留之前上传的照片，不重置数组
// 将已有的补充照片转换为文件列表格式
if (item.supplementImages) {
const existingImages = item.supplementImages.split(',');
this.supplementImages = [...existingImages];
this.supplementFileList = existingImages.map(url => ({
url: this.baseImageUrl + url,
status: 'success',
message: ''
}));
} else {
this.supplementImages = [];
this.supplementFileList = [];
}
},
// 关闭补充照片弹窗
closeSupplementPopup() {
if (!this.uploading) {
this.supplementShow = false;
// 不清空数据
}
},
// 补充照片上传
async supplementAfterRead(event) {
if (this.uploading) return;
let lists = [].concat(event.file);
let fileListLen = this.supplementFileList.length;
lists.map((item) => {
this.supplementFileList.push({
...item,
status: 'uploading'
});
});
// 开始上传
this.uploading = true;
for (let i = 0; i < lists.length; i++) {
try {
const result = await this.uploadFilePromiseSupplement(lists[i].url);
console.log('result', result)
let item = this.supplementFileList[fileListLen];
this.supplementFileList.splice(fileListLen, 1, Object.assign(item, {
status: 'success',
message: '',
url: result
}));
// 保存到补充图片数组
this.supplementImages.push(result);
fileListLen++;
} catch (error) {
console.error('上传失败:', error);
let item = this.supplementFileList[fileListLen];
this.supplementFileList.splice(fileListLen, 1, Object.assign(item, {
status: 'failed',
message: '上传失败'
}));
fileListLen++;
}
}
this.uploading = false;
},
// 删除补充照片
deleteSupplementPic(event) {
if (this.uploading) return;
this.supplementFileList.splice(event.index, 1);
this.supplementImages.splice(event.index, 1);
},
async confirmSupplement() {
if (this.uploading) {
uni.showToast({
title: '照片上传中，请稍候',
icon: 'none'
});
return;
}
if (this.supplementImages.length === 0) {
uni.showToast({
title: '请上传照片',
icon: 'none'
});
return;
}
try {
// 获取原有的补充照片
const originalImages = this.currentSupplementItem.supplementImages ?
this.currentSupplementItem.supplementImages.split(',') : [];
// 合并新旧照片
const allImages = [...new Set([...originalImages, ...this.supplementImages])];
// 调用API保存补充照片
const res = await request({
url: '/app/driver/updateRescueInfoDetail',
method: 'put',
data: {
id: this.currentSupplementItem.id,
supplementImages: allImages.join(',')
}
});
if (res.code === 200) {
uni.showToast({
title: '补充成功',
icon: 'success'
});
// 关闭弹窗并重置数据
this.supplementShow = false;
this.supplementFileList = [];
this.supplementImages = [];
// 刷新页面数据
this.getrescueDetail(this.id);
}
} catch (error) {
console.error('补充照片失败:', error);
uni.showToast({
title: '补充失败',
icon: 'none'
});
}
},
// 显示收费弹框
showFeePopupFunction() {
this.showFeePopup = true;
this.selectedPayment = '';
this.paymentAmount = this.detailsData.setMoney || '';
},
// 关闭收费弹框
closeFeePopup() {
this.showFeePopup = false;
},
// 选择支付方式
selectPayment(type) {
this.selectedPayment = type;
},
cleanFee() {
this.towingFee = 0;
this.craneFee = 0;
this.otherFee = 0;
this.otherFeeRemark = '';
},
// 确认支付方式
confirmPayment() {
if (!this.selectedPayment) {
uni.showToast({
title: '请选择支付方式',
icon: 'none'
});
return;
}
// 关闭主弹框，打开对应的子弹框
this.showFeePopup = false;
switch (this.selectedPayment) {
case 'wechat':
this.showWechatPopup = true;
if (this.confirmedSetMoney) {
this.setMoneyWx = this.confirmedSetMoney;
}
break;
case 'cash':
this.showCashPopup = true;
if (this.confirmedSetMoney) {
this.setMoney = this.confirmedSetMoney;
}
break;
case 'credit':
this.showCreditPopup = true;
break;
}
},
// 微信确认金额按钮
confirmWchatSetMoney() {
if (!this.setMoneyWx) {
uni.showToast({
title: '请输入金额',
icon: 'none'
});
return;
}
let autoRemarkTemp =
'其中: 拖车费用 ' + this.towingFee + '元, 吊车费用 ' + this.craneFee + '元, 其他费用 ' + this.otherFee + '元'
if (this.otherFeeRemark != '') {
autoRemarkTemp = autoRemarkTemp + ', 其他费用备注: ' + this.otherFeeRemark + ', '
} else {
autoRemarkTemp = autoRemarkTemp + ', '
}
const oneData = {
autoRemark: autoRemarkTemp + '付款方式: 微信'
}
this.setMoney = this.setMoneyWx
this.confirmedSetMoney = this.setMoneyWx;
uni.showToast({
title: '金额已确认',
icon: 'success'
});
this.getjine(oneData)
},
// 挂账相关方法
closeCreditPopup() {
this.showCreditPopup = false;
this.showFeePopup = true;
this.setMoney = '';
// this.amountDirector = '';
this.creditRemark = '';
this.selectedDispatcherName = '';
this.selectedDispatcherId = '';
this.cleanFee();
},
// 确认挂账按钮
async confirmCreditPayment() {
if (!this.setMoney) {
uni.showToast({
title: '请输入挂账金额',
icon: 'none'
});
return;
}
let autoRemarkTemp = '其中: 拖车费用 ' + this.towingFee + '元, 吊车费用 ' + this.craneFee + '元, 其他费用 ' + this
.otherFee + '元'
if (this.otherFeeRemark != '') {
autoRemarkTemp = autoRemarkTemp + ', 其他费用备注: ' + this.otherFeeRemark + ', '
} else {
autoRemarkTemp = autoRemarkTemp + ', '
}
const oneData = {
autoRemark: autoRemarkTemp + '付款方式: 挂账, ' + '收款负责人: ' + this.selectedDispatcherName,
/* remark: this.creditRemark,
payType: 'qd',
orderSigningPersonId: this.selectedDispatcherId,
orderSigningPersonName: this.selectedDispatcherName,
orderStatus: '4', */
}
this.getjine(oneData)
let data = {
rescueInfoId: this.id,
title: '司机确认收款完成',
images: this.paymentImages.join(','),
remark: this.creditRemark,
};
try {
const res = await request({
url: '/app/driver/uploadDetailByDriver',
method: 'post',
data: data
});
if (res.code == 200) {
this.ulImages = [];
this.remark = '';
this.fileList1 = [];
this.selectedOption = '';
uni.showToast({
title: '提交成功',
icon: 'success',
duration: 2000
});
let orderData = {
id: this.detailsData.orderId,
isOnline: '0',
payRemark: this.creditRemark,
payImages: this.paymentImages.join(','),
payType: 'qd',
orderStatus: '4',
orderSigningPersonId: this.selectedDispatcherId,
orderSigningPersonName: this.selectedDispatcherName,
}
this.updateOrderInfo(orderData);
this.detailsData.feeType = '2'
this.confirmadd()
// 确保在成功后再关闭弹框
this.showCreditPopup = false;
this.resetPaymentUpload();
this.cleanFee();
// 刷新数据
this.getrescueDetail(this.id);
} else {
uni.showToast({
title: '提交失败: ' + (res.msg || '未知错误'),
icon: 'none'
});
}
} catch (error) {
console.error('提交失败:', error);
uni.showToast({
title: '提交失败',
icon: 'none'
});
// 即使失败也要关闭弹框
this.showCreditPopup = false;
this.resetPaymentUpload();
}
},
// 支付凭证上传
async paymentAfterRead(event) {
if (this.uploadingPayment) return;
let lists = [].concat(event.file);
let fileListLen = this.paymentFileList.length;
lists.map((item) => {
this.paymentFileList.push({
...item,
status: 'uploading'
});
});
// 开始上传
this.uploadingPayment = true;
for (let i = 0; i < lists.length; i++) {
try {
const result = await this.uploadFilePromisePayment(lists[i].url);
let item = this.paymentFileList[fileListLen];
this.paymentFileList.splice(fileListLen, 1, Object.assign(item, {
status: 'success',
message: '',
url: result
}));
// 保存到支付凭证图片数组
this.paymentImages.push(result);
fileListLen++;
} catch (error) {
console.error('支付凭证上传失败:', error);
let item = this.paymentFileList[fileListLen];
this.paymentFileList.splice(fileListLen, 1, Object.assign(item, {
status: 'failed',
message: '上传失败'
}));
fileListLen++;
}
}
this.uploadingPayment = false;
},
// 支付凭证上传
uploadFilePromisePayment(url) {
return new Promise((resolve, reject) => {
upload({
url: '/infra/file/upload',
filePath: url,
}).then((res) => {
resolve(res.data);
}).catch(reject);
});
},
// 删除支付凭证图片
deletePaymentPic(event) {
if (this.uploadingPayment) return;
this.paymentFileList.splice(event.index, 1);
this.paymentImages.splice(event.index, 1);
},
// 关闭微信支付弹框
closeWechatPopup() {
if (!this.uploadingPayment) {
this.showWechatPopup = false;
this.showFeePopup = true;
this.setMoneyWx = '';
this.creditRemark = '';
this.resetPaymentUpload();
this.cleanFee();
}
},
// 关闭现金支付弹框
closeCashPopup() {
if (!this.uploadingPayment) {
this.setMoney = '';
this.showCashPopup = false;
this.showFeePopup = true;
this.resetPaymentUpload();
this.cleanFee();
}
this.creditRemark = ''
},
// 重置支付凭证上传
resetPaymentUpload() {
this.paymentFileList = [];
this.paymentImages = [];
},
// 确认微信支付
async confirmWechatPayment() {
if (this.confirmedSetMoney) {
this.setMoney = this.confirmedSetMoney;
}
if (!this.setMoney) {
uni.showToast({
title: '请输入支付金额',
icon: 'none'
});
return;
}
if (this.paymentImages.length === 0) {
uni.showToast({
title: '请上传支付凭证',
icon: 'none'
});
return;
}
let data = {
rescueInfoId: this.id,
title: '司机确认收款完成',
images: this.paymentImages.join(','),
remark: this.creditRemark,
};
try {
const res = await request({
url: '/app/driver/uploadDetailByDriver',
method: 'post',
data: data
});
if (res.code == 200) {
this.ulImages = [];
this.remark = '';
this.fileList1 = [];
this.selectedOption = '';
uni.showToast({
title: '提交成功',
icon: 'success',
duration: 2000
});
let orderData = {
id: this.detailsData.orderId,
isOnline: '1',
payRemark: this.creditRemark,
payImages: this.paymentImages.join(','),
payType: 'wx',
orderStatus: '2',
}
this.updateOrderInfo(orderData);
this.detailsData.feeType = '1'
this.confirmadd()
// 确保在成功后再关闭弹框
this.showWechatPopup = false;
// this.closeCashPopup();
this.resetPaymentUpload();
this.cleanFee();
// 刷新数据
this.getrescueDetail(this.id);
} else {
uni.showToast({
title: '提交失败: ' + (res.msg || '未知错误'),
icon: 'none'
});
}
} catch (error) {
console.error('提交失败:', error);
uni.showToast({
title: '提交失败',
icon: 'none'
});
}
},
// 确认现金支付
async confirmCashPayment() {
if (!this.setMoney) {
uni.showToast({
title: '请输入金额',
icon: 'none'
});
return;
}
if (this.paymentImages.length === 0) {
uni.showToast({
title: '请上传收款凭证',
icon: 'none'
});
return;
}
let autoRemarkTemp = '其中: 拖车费用 ' + this.towingFee + '元, 吊车费用 ' + this.craneFee + '元, 其他费用 ' + this
.otherFee + '元'
if (this.otherFeeRemark != '') {
autoRemarkTemp = autoRemarkTemp + ', 其他费用备注: ' + this.otherFeeRemark + ', '
} else {
autoRemarkTemp = autoRemarkTemp + ', '
}
const oneData = {
autoRemark: autoRemarkTemp + '付款方式: 现金'
}
this.getjine(oneData)
let data = {
rescueInfoId: this.id,
title: '司机确认收款完成',
images: this.paymentImages.join(','),
remark: this.creditRemark,
};
try {
const res = await request({
url: '/app/driver/uploadDetailByDriver',
method: 'post',
data: data
});
if (res.code == 200) {
this.ulImages = [];
this.remark = '';
this.fileList1 = [];
this.selectedOption = '';
uni.showToast({
title: '提交成功',
icon: 'success',
duration: 2000
});
let orderData = {
id: this.detailsData.orderId,
isOnline: '0',
payRemark: this.creditRemark,
payImages: this.paymentImages.join(','),
payType: 'xj',
orderStatus: '2',
}
this.updateOrderInfo(orderData);
this.detailsData.feeType = '1'
this.confirmadd()
// 确保在成功后再关闭弹框
this.showCashPopup = false;
this.resetPaymentUpload();
this.cleanFee();
// 刷新数据
this.getrescueDetail(this.id);
} else {
uni.showToast({
title: '提交失败: ' + (res.msg || '未知错误'),
icon: 'none'
});
}
} catch (error) {
console.error('提交失败:', error);
uni.showToast({
title: '提交失败',
icon: 'none'
});
// 即使失败也要关闭弹框
this.showCashPopup = false;
this.resetPaymentUpload();
}
},
// 更新订单信息
updateOrderInfo(orderData) {
request({
url: '/rescue/orderInfo/edit',
method: 'post',
data: orderData
}).then((res) => {
console.log(res);
})
},
// 获取调度人员信息（合并second_dispatcher和ddzx角色）
getSecondDispatcher() {
console.log('12-12')
this.dispatcherColumns = [];
const tenantId = getTenantId();
// 创建两个请求的Promise
const request1 = request({
url: `/company/staff/staffListByRoleCode?tenantId=${tenantId}&code=second_dispatcher`,
method: 'get',
});
const request2 = request({
url: `/company/staff/staffListByRoleCode?tenantId=${tenantId}&code=ddzx`,
method: 'get',
});
// 使用Promise.all并行请求
Promise.all([request1, request2])
.then(([res1, res2]) => {
// 合并两个数据数组
const combinedData = [...(res1.data || []), ...(res2.data || [])];
// 使用Map根据id去重
const uniqueMap = new Map();
combinedData.forEach(item => {
if (item && item.id) {
uniqueMap.set(item.id, item);
}
});
// 将去重后的数据转换为数组
const uniqueData = Array.from(uniqueMap.values());
// 存储到secondColumns
this.dispatcherColumns.push(uniqueData);
console.log('合并后的调度人员数据:', uniqueData);
})
.catch(error => {
console.error('获取调度人员数据失败:', error);
uni.showToast({
title: '获取调度人员失败',
icon: 'none'
});
});
},
// 显示调度人员选择器
showDispatcherPicker() {
console.log('1-2')
if (this.dispatcherColumns.length === 0) {
this.getSecondDispatcher(); // 确保数据已加载
}
this.dispatcherPickerShow = true;
},
// 调度人员选择确认
onDispatcherConfirm(e) {
const selectedDispatcher = e.value[0];
this.selectedDispatcherName = selectedDispatcher.nickname;
this.selectedDispatcherId = selectedDispatcher.id;
this.dispatcherPickerShow = false;
},
// 获取修理厂列表
getRepairFactoryList() {
request({
url: '/rescue/dict/data/type/rescue_to_repair',
method: 'get'
}).then((res) => {
if (res.code === 200) {
this.repairFactoryList = res.data;
console.log('this.repairFactoryList', this.repairFactoryList)
}
}).catch(error => {
console.error('获取修理厂列表失败:', error);
});
},
// 修理厂选择确认
onRepairFactoryConfirm(e) {
const selectedFactory = e.value[0];
this.repairFormData.repairFactoryName = selectedFactory.label;
this.repairFormData.repairFactoryId = selectedFactory.id;
this.repairFactoryShow = false;
},
// 显示新增修理厂弹框
showAddRepairFactoryModal() {
this.newRepairFactoryName = '';
this.showAddRepairFactoryModalView = true;
},
// 关闭新增修理厂弹框
closeAddRepairFactoryModal() {
this.showAddRepairFactoryModalView = false;
},
// 新增修理厂
async addNewRepairFactory() {
if (!this.newRepairFactoryName.trim()) {
uni.showToast({
title: '请输入修理厂名称',
icon: 'none'
});
return;
}
// 检查是否已存在相同名称的修理厂
const exists = this.repairFactoryList.some(item =>
item.label === this.newRepairFactoryName.trim()
);
if (exists) {
uni.showToast({
title: '该修理厂已存在',
icon: 'none'
});
return;
}
try {
// 调用后端接口新增修理厂
const response = await request({
url: '/system/dict-data/create',
method: 'post',
data: {
dictType: 'rescue_to_repair',
label: this.newRepairFactoryName.trim(),
value: this.newRepairFactoryName.trim().toLowerCase().replace(/\s+/g, '_'),
sort: this.repairFactoryList.length + 1,
status: 0
}
});
if (response.code === 200) {
uni.showToast({
title: '添加成功'
});
// 重新加载修理厂列表
this.getRepairFactoryList();
this.showAddRepairFactoryModalView = false;
// 自动选中新添加的修理厂
this.repairFormData.repairFactoryName = this.newRepairFactoryName.trim();
} else {
uni.showToast({
title: response.msg || '添加失败',
icon: 'none'
});
}
} catch (error) {
console.error('添加修理厂失败:', error);
uni.showToast({
title: '添加失败',
icon: 'none'
});
}
},
// 显示编辑照片弹窗
showEditPhotoPopup(item, field) {
this.currentEditItem = item;
this.editField = field;
this.editPhotoShow = true;
// 将已有的照片转换为文件列表格式
if (item[field]) {
const existingImages = item[field].split(',');
this.editImages = [...existingImages];
this.editFileList = existingImages.map(url => ({
url: this.baseImageUrl + url,
status: 'success',
message: ''
}));
} else {
this.editImages = [];
this.editFileList = [];
}
},
// 关闭编辑照片弹窗
closeEditPhotoPopup() {
if (!this.uploading) {
this.editPhotoShow = false;
// 不清空数据，以便用户再次打开时能看到之前上传的照片
}
},
// 编辑照片上传
async editAfterRead(event) {
if (this.uploading) return;
let lists = [].concat(event.file);
let fileListLen = this.editFileList.length;
lists.map((item) => {
this.editFileList.push({
...item,
status: 'uploading'
});
});
// 开始上传
this.uploading = true;
for (let i = 0; i < lists.length; i++) {
try {
const result = await this.uploadFilePromiseEdit(lists[i].url);
let item = this.editFileList[fileListLen];
this.editFileList.splice(fileListLen, 1, Object.assign(item, {
status: 'success',
message: '',
url: result
}));
// 保存到编辑图片数组
this.editImages.push(result);
fileListLen++;
} catch (error) {
console.error('上传失败:', error);
let item = this.editFileList[fileListLen];
this.editFileList.splice(fileListLen, 1, Object.assign(item, {
status: 'failed',
message: '上传失败'
}));
fileListLen++;
}
}
this.uploading = false;
},
// 编辑照片上传Promise
uploadFilePromiseEdit(url) {
return new Promise((resolve, reject) => {
upload({
url: '/infra/file/upload',
filePath: url,
}).then((res) => {
resolve(res.data);
}).catch(reject);
});
},
// 删除编辑照片
deleteEditPic(event) {
if (this.uploading) return;
this.editFileList.splice(event.index, 1);
this.editImages.splice(event.index, 1);
},
// 确认编辑照片
async confirmEditPhoto() {
if (this.uploading) {
uni.showToast({
title: '照片上传中，请稍候',
icon: 'none'
});
return;
}
try {
// 调用API保存编辑后的照片
const res = await request({
url: '/app/driver/updateRescueInfoDetail',
method: 'put',
data: {
id: this.currentEditItem.id,
[this.editField]: this.editImages.join(',')
}
});
if (res.code === 200) {
uni.showToast({
title: '编辑成功',
icon: 'success'
});
// 关闭弹窗
this.editPhotoShow = false;
this.editFileList = [];
this.editImages = [];
// 刷新页面数据
this.getrescueDetail(this.id);
}
} catch (error) {
console.error('编辑照片失败:', error);
uni.showToast({
title: '编辑失败',
icon: 'none'
});
}
},
}
}
</script>
<style scoped lang="scss">
.content {
box-sizing: border-box;
// padding-top: 40px;
// background: #F4F4F4;
width: 100%;
// height: calc(100vh);
// padding-bottom: 180px;
}
.left-t {
display: flex;
height: 25px;
}
.xx-hui {
font-size: 15px;
font-weight: 400;
color: #666666;
line-height: 25px;
margin-top: 10px;
}
.img-boxs {
width: 100%;
display: flex;
flex-wrap: wrap;
}
.ga-top {
display: flex;
align-items: center;
color: #0D2E8D;
font-weight: bold;
}
.img-box {
width: 70px;
height: 70px;
border-radius: 6px;
overflow: hidden;
margin-top: 10px;
margin-right: 10px;
image {
width: 100%;
height: 100%;
}
}
.wrap-box {
width: 100%;
display: flex;
flex-wrap: wrap;
}
.wrap-box_bc {
width: 100%;
display: flex;
flex-direction: column;
flex-wrap: wrap;
}
.edit_images {
display: flex;
// justify-content: center;
// align-items: center;
width: 100%;
}
.beizh {}
.gain {
font-style: 18px;
font-weight: bold;
margin-right: 10px;
color: #0D2E8D;
}
.g-img {
width: 30%;
height: 111px;
margin-right: 10px;
margin-top: 5px;
image {
width: 100%;
height: 100%;
}
}
.ximg {
width: 20px;
height: 20px;
margin: 0 auto;
margin-bottom: 10px;
image {
width: 100%;
height: 100%;
}
}
.sj {
width: 25px;
height: 25px;
margin-right: 10px;
image {
width: 100%;
height: 100%;
}
}
.bai-title {
font-weight: bold;
color: #ffffff;
}
.ai {
font-size: 14px;
}
.top-heder {
width: 100%;
height: 40px;
background: #0D2E8D;
}
.topjianjian {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
// margin-top: 40px;
box-sizing: border-box;
padding: 15px 15px;
}
.dix {
display: flex;
align-items: center;
margin: 20px auto;
}
.huiy {
font-size: 15px;
font-weight: 400;
color: #999999;
margin-right: 8px;
}
.htzit {
display: flex;
align-items: center;
font-size: 15px;
color: #999999;
}
.xshui {
font-size: 15px;
font-weight: 400;
color: #333333;
}
.changimg {
width: 58px;
height: 20px;
margin-right: 5px;
image {
width: 100%;
height: 100%;
}
}
.shiwuimg {
width: 15px;
height: 15px;
margin-right: 5px;
image {
width: 100%;
height: 100%;
}
}
.inanniu {
width: 30%;
height: 38px;
border-radius: 19px 19px 19px 19px;
border: 1px solid #3CBC6F;
display: flex;
align-items: center;
justify-content: center;
font-size: 15px;
color: #3CBC6F;
}
.caanniu {
width: 30%;
height: 38px;
border-radius: 19px 19px 19px 19px;
border: 1px solid #e43d33;
display: flex;
align-items: center;
justify-content: center;
font-size: 15px;
color: #e43d33;
}
.lanniu {
width: 30%;
height: 38px;
border-radius: 19px 19px 19px 19px;
border: 1px solid #3C9CFF;
display: flex;
align-items: center;
justify-content: center;
font-size: 15px;
color: #3C9CFF;
}
.anniua {
width: 30%;
height: 38px;
border-radius: 19px 19px 19px 19px;
border: 1px solid #0D2E8D;
display: flex;
align-items: center;
justify-content: center;
font-size: 15px;
background: #0D2E8D;
color: #ffffff;
}
.qrxg {
width: 20%;
height: 20px;
background-color: #0D2E8D;
display: flex;
align-items: center;
justify-content: center;
color: white;
border-radius: 6px;
font-size: 14px;
}
.dis-bb {
// display: flex;
// align-items: center;
// justify-content: space-between;
box-sizing: border-box;
padding-bottom: 15px;
border-bottom: 1px solid #EEEEEE;
}
.dis-tt {
display: flex;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
padding-top: 15px;
border-top: 1px solid #EEEEEE;
}
.c-top {
width: 100%;
height: 180px;
background: #0D2E8D;
box-sizing: border-box;
// padding: 15px;
// position: relative;
}
.ding-top {
// position: absolute;
// padding: 15px;
// bottom: -220px;
// left: 0px;
width: 100%;
background-color: white;
box-sizing: border-box;
padding: 15px;
border-radius: 8px 8px 0px 0px;
position: relative;
}
.t-title {
font-size: 18px;
font-weight: bold;
color: #FFFFFF;
}
.dis-b {
display: flex;
justify-content: space-between;
}
.t-left {}
.t-zi1 {
font-size: 15px;
font-weight: bold;
color: white;
}
.t-zi2 {
font-size: 14px;
font-weight: bold;
color: white;
margin-bottom: 10px;
margin-top: 10px;
}
.t-biao {
border-radius: 11px 11px 11px 0px;
background: linear-gradient(90deg, #EE8342 0%, #EA3942 100%);
color: white;
text-align: center;
}
.t-right {
color: white;
display: flex;
}
.t-zi2 {
font-size: 14px;
font-weight: bold;
color: white;
text-align: center;
}
.t-bottom {
// height: 77px;
background: #FFFFFF;
box-shadow: 0px 4px 4px 0px rgba(13, 46, 141, 0.15);
border-radius: 8px;
margin-top: 10px;
box-sizing: border-box;
padding: 16px;
display: flex;
justify-content: space-between;
z-index: 99;
}
.top-box {
width: 33%;
height: 100%;
border-right: 1px solid #EEEEEE;
text-align: center;
}
.t-lan {
font-size: 28px;
font-weight: bold;
color: #0D2E8D;
}
.t-hui {
font-size: 14px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #999999;
}
.t-ybr {
width: 100%;
z-index: -99;
height: 120px;
box-sizing: border-box;
padding-top: 90px;
display: flex;
justify-content: space-around;
// background-color: white;
}
.anniu {
width: 95%;
height: 44%;
border-radius: 6px;
background-color: #0D2E8D;
color: white;
display: flex;
justify-content: center;
align-items: center;
}
.gang {
width: 24px;
height: 4px;
background: #ffffff;
border-radius: 4px 4px 4px 4px;
margin: 2px auto;
}
.hui-content {
width: 100%;
// height: calc(60vh);
background-color: #f4f4f4;
box-sizing: border-box;
padding: 10px 0px 80px 10px;
}
.content-box {
width: 100%;
box-sizing: border-box;
padding: 15px;
// height: 222px;
background: #FFFFFF;
margin-bottom: 10px;
}
.hui-text {
font-size: 16px;
font-weight: 400;
color: #666666;
}
.indexhei {
color: #333333 !important;
font-weight: bold !important;
}
.indexlan {
background: #0D2E8D !important;
}
.mubu {
width: 100%;
// height: calc(60vh);
background-color: #f4f4f4;
}
.jsy {
margin: 10px auto;
}
.ja-you {
width: 100%;
font-weight: bold;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
margin: 10px auto;
}
.xhui {
font-size: 12px;
font-weight: 400;
color: #999999;
}
.xhui-kc {
font-size: 16px;
font-weight: 400;
color: #000000;
}
.codePop {
width: 100%;
background-color: white;
box-sizing: border-box;
height: 300px;
}
.popup-title {
text-align: center;
font-size: 16px;
font-weight: bold;
margin: 0 auto;
}
.popup-title-money {
text-align: center;
font-size: 14px;
font-weight: bold;
margin-bottom: 5px;
}
.ribox {
box-sizing: border-box;
padding: 5px 10px;
// background: #0D2E8D;
border: 1px solid #0D2E8D;
display: flex;
align-items: center;
justify-content: center;
color: #0D2E8D;
border-radius: 5px;
margin-right: 5px;
}
.actbox {
background: #0D2E8D !important;
color: white;
}
.lan-ga {
width: 100%;
margin: 20rpx auto;
box-sizing: border-box;
padding-bottom: 40rpx;
position: relative;
.lan-ga-line {
position: absolute;
width: 2rpx;
height: calc(100% - 56rpx);
background-color: #979797;
left: calc(56rpx / 2 - 2rpx);
transform: translate(-50%, 0);
top: calc(56rpx + 10rpx);
}
}
.ga-top-box {
display: flex;
justify-content: space-between;
}
.ga-content {
flex: 1;
width: 0;
.ga-content-top {
display: flex;
align-items: center;
justify-content: space-between;
column-gap: 8rpx;
padding-bottom: 14rpx;
}
.ga-content-title {
font-weight: bold;
flex: 1;
width: 0;
word-break: break-all
}
.xhui {
font-size: 22rpx;
color: #929292;
flex-shrink: 0;
}
.beizh {
font-size: 28rpx;
color: #000000;
white-space: pre-wrap;
word-break: break-word;
line-height: 1.6;
}
}
.ga-top {
display: flex;
align-items: center;
color: #000;
font-weight: bold;
font-size: 16px;
}
.img-box {
width: 70px;
height: 70px;
border-radius: 6px;
overflow: hidden;
margin-top: 10px;
margin-right: 10px;
image {
width: 100%;
height: 100%;
}
}
.wrap-box {
width: 100%;
display: flex;
flex-wrap: wrap;
}
.gain {
box-sizing: border-box;
width: 52rpx;
height: 52rpx;
font-size: 34rpx;
color: #327DFB;
margin-right: 20rpx;
border: 2rpx solid #327DFB;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
line-height: 1;
font-weight: bold;
.gainIcon {
width: 100%;
height: 100%;
}
}
.fixed-bottom-button_1 {
position: fixed;
bottom: 0;
left: 0;
right: 0;
padding: 15px;
background-color: #fff;
box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
z-index: 999;
button {
width: 100%;
background-color: #0D2E8D;
color: white;
border-radius: 5px;
height: 45px;
line-height: 45px;
}
}
.fixed-bottom-button {
display: flex;
justify-content: space-between;
gap: 10px;
position: fixed;
bottom: 0;
left: 0;
right: 0;
padding: 12px;
background-color: #fff;
box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
z-index: 999;
button {
height: 45px;
line-height: 45px;
border-radius: 5px;
color: white;
font-size: 16px;
border: none;
// margin: 0;
// padding: 0px 10px;
}
.fee-button {
width: 30%;
}
.next-button {
width: 70%;
}
}
.popup-box {
width: 320px;
box-sizing: border-box;
padding: 15px;
background-color: white;
border-radius: 10px;
min-height: 500px;
/* 设置最小高度 */
padding: 25px 15px;
/* 增加上下内边距 */
display: flex;
flex-direction: column;
justify-content: space-between;
/* 内容均匀分布 */
}
// 三个支付弹框
.popup-box-zf {
width: 320px;
box-sizing: border-box;
padding: 15px;
background-color: white;
border-radius: 10px;
min-height: 300px;
max-height: 600px;
/* 设置最小高度 */
padding: 25px 15px;
/* 增加上下内边距 */
display: flex;
flex-direction: column;
justify-content: space-between;
/* 内容均匀分布 */
}
.popup-box_je {
width: 320px;
box-sizing: border-box;
padding: 15px;
background-color: white;
border-radius: 10px;
min-height: 200px;
/* 设置最小高度 */
padding: 25px 15px;
/* 增加上下内边距 */
display: flex;
flex-direction: column;
justify-content: space-between;
/* 内容均匀分布 */
}
// 补充照片
.popup-box_bc {
width: 320px;
box-sizing: border-box;
padding: 15px;
background-color: white;
border-radius: 10px;
min-height: 300px;
/* 设置最小高度 */
padding: 25px 15px;
/* 增加上下内边距 */
display: flex;
flex-direction: column;
justify-content: space-between;
/* 内容均匀分布 */
}
// 收费弹框
.popup-box_sf {
width: 320px;
box-sizing: border-box;
padding: 15px;
background-color: white;
border-radius: 10px;
min-height: 300px;
/* 设置最小高度 */
padding: 25px 15px;
/* 增加上下内边距 */
display: flex;
flex-direction: column;
justify-content: space-between;
/* 内容均匀分布 */
}
.p-title {
font-size: 20px;
color: rgb(26, 26, 26);
font-weight: bold;
}
.huinput {
width: 100%;
box-sizing: border-box;
// padding: 10px;
// background: rgb(246, 246, 246);
display: flex;
align-items: center;
border-radius: 8px;
margin: 15px auto;
}
.huinput_kc {
width: 100%;
height: 50%;
box-sizing: border-box;
display: flex;
align-items: center;
flex-direction: column;
border-radius: 8px;
margin: 15px auto;
}
.huinput_sf {
width: 100%;
box-sizing: border-box;
// padding: 10px;
// background: rgb(246, 246, 246);
display: flex;
// align-items: center;
flex-direction: column;
border-radius: 8px;
// margin: 10px auto;
margin: 12px 0;
}
.tshe {
color: #0D2E8D;
font-size: 16px;
}
.qzanniu {
width: 100%;
height: 40px;
border-radius: 6px;
// background: linear-gradient(270.00deg, rgb(3, 163, 128) 0.028%,rgb(0, 204, 126) 100%);
background: #0D2E8D !important;
display: flex;
align-items: center;
justify-content: center;
color: rgb(255, 255, 255);
font-size: 16px;
font-weight: 700;
}
.button-group {
display: flex;
width: 100%;
margin-top: 15px;
}
.cancel-button {
width: 40%;
height: 40px;
border-radius: 6px;
background: #f4f4f4;
display: flex;
align-items: center;
justify-content: center;
color: #333;
font-size: 16px;
font-weight: 700;
margin-right: 10px;
}
.confirm-button {
width: 60%;
height: 40px;
border-radius: 6px;
background: #0D2E8D;
display: flex;
align-items: center;
justify-content: center;
color: white;
font-size: 16px;
font-weight: 700;
}
.confirm-button-wxtwo {
width: 40%;
height: 30px;
border-radius: 6px;
background: #0D2E8D;
display: flex;
align-items: center;
justify-content: center;
color: white;
font-size: 14px;
font-weight: 500;
}
.option-buttons {
display: flex;
flex-wrap: wrap;
/* 添加这一行实现自动换行 */
justify-content: flex-start;
margin: 15px 0;
gap: 8px;
/* 添加间距，使按钮看起来更清晰 */
}
.option-button {
flex: 0 1 auto;
/* 改为自动宽度 */
min-width: 80rpx;
/* 设置最小宽度 */
margin: 4px;
/* 调整边距 */
padding: 10px;
text-align: center;
border: 1px solid #0D2E8D;
color: #0D2E8D;
border-radius: 5px;
white-space: nowrap;
/* 防止文字换行 */
}
.option-button.active {
background-color: #0D2E8D;
color: white;
}
/* 转维修表单样式 */
.repair-form {
width: 100%;
margin-bottom: 20px;
}
.repair-form-item {
margin-bottom: 15px;
}
.detain-form {
width: 100%;
margin-bottom: 20px;
}
.detain-form-item {
display: flex;
flex-direction: column;
// align-items: center;
margin-bottom: 15px;
}
.floating-refresh-btn {
position: fixed;
right: 20px;
bottom: 120px;
/* 调整位置，避免与底部按钮重叠 */
width: 70px;
height: 70px;
background-color: #fff;
border-radius: 50%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
z-index: 998;
/* 确保在底部按钮之上，但低于弹窗 */
}
.refresh-text {
font-size: 12px;
color: #0D2E8D;
margin-top: 4px;
text-align: center;
}
.supplement-photo-btn {
display: flex;
align-items: center;
justify-content: center;
margin-top: 10px;
padding: 8px 12px;
background-color: #f0f5ff;
border: 1px dashed #0D2E8D;
border-radius: 4px;
color: #0D2E8D;
font-size: 14px;
width: 30%;
text {
margin-left: 4px;
}
}
.upload-tips {
display: flex;
align-items: center;
justify-content: center;
padding: 10px;
color: #0D2E8D;
font-size: 14px;
text {
margin-left: 8px;
}
}
/* 添加悬浮编辑按钮样式 */
.floating-edit-btn {
position: fixed;
right: 20px;
bottom: 200px;
/* 放在刷新按钮上方 */
width: 70px;
height: 70px;
background-color: #fff;
border-radius: 50%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
z-index: 998;
}
.edit-text {
font-size: 12px;
color: #0D2E8D;
margin-top: 4px;
text-align: center;
}
/* 上传提示样式 */
.upload-tips {
display: flex;
align-items: center;
justify-content: center;
padding: 10px;
color: #0D2E8D;
font-size: 14px;
margin: 10px 0;
text {
margin-left: 8px;
}
}
/* 禁用状态样式 */
.cancel-button:disabled,
.confirm-button:disabled {
opacity: 0.6;
pointer-events: none;
}
.payment-options {
display: flex;
justify-content: space-around;
margin: 20px 0;
}
.payment-option {
/* display: flex;
flex-direction: column;
align-items: center;
padding: 10px;
border: 1px solid #ddd;
border-radius: 8px;
min-width: 80px; */
flex: 1;
/* 改为自动宽度 */
min-width: 100rpx;
/* 设置最小宽度 */
margin: 4px;
/* 调整边距 */
padding: 10px;
text-align: center;
border: 1px solid #0D2E8D;
color: #0D2E8D;
border-radius: 5px;
white-space: nowrap;
}
.payment-option.active {
border-color: #0D2E8D;
background-color: #dde8ff;
}
.payment-option text {
margin-top: 8px;
font-size: 14px;
}
.payment-option.disabled {
color: #aaa;
/* 文字浅灰 */
border: 1px dashed #ccc;
/* 边框改为灰色虚线 */
background-color: #f0f0f0;
/* 浅灰背景 */
opacity: 0.8;
/* 稍微透明 */
pointer-events: none;
/* 禁止点击 */
}
.pay_font {
margin-bottom: 16rpx;
font-size: 30rpx;
font-weight: bold;
}
/* 二维码弹框样式 */
.code-popup-container {
width: 300px;
background-color: #fff;
border-radius: 12px;
padding: 20px;
position: relative;
}
.code-popup-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 15px;
}
.code-popup-header-money {
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 15px;
}
.code-popup-title {
font-size: 18px;
font-weight: bold;
color: #333;
}
.code-popup-close {
padding: 5px;
cursor: pointer;
}
.code-popup-content {
display: flex;
justify-content: center;
align-items: center;
}
.select-box {
display: flex;
align-items: center;
justify-content: space-between;
// border-bottom: 1px solid #eee;
padding: 20rpx 0;
width: 100%;
}
.select-box-gz {
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #eee;
padding: 20rpx 0;
width: 100%;
}
.placeholder {
color: #999;
}
.repair-popup {
max-height: 70vh;
/* 限制最大高度 */
display: flex;
flex-direction: column;
}
.popup-scroll {
flex: 1;
max-height: calc(80vh - 60px);
/* 减去按钮区域的高度 */
overflow-y: auto;
padding: 10px 0;
}
.title-content-s {
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 10px;
}
/* 编辑照片按钮样式 */
.edit-photo-btn {
display: flex;
align-items: center;
justify-content: center;
padding: 4rpx 8rpx;
background-color: #f0f5ff;
border: 1px solid #0D2E8D;
border-radius: 4px;
color: #0D2E8D;
font-size: 12px;
text {
margin-left: 4px;
}
}
/* 支付弹框滚动区域样式 */
.wechat-popup,
.cash-popup,
.credit-popup {
max-height: 70vh;
display: flex;
flex-direction: column;
}
.no-data {
color: #999;
}
</style>
Reference in New Issue View Git Blame Copy Permalink