lanan-repair-app/pages-order/addOrder/addOrder.vue

1363 lines
40 KiB
Vue
Raw Normal View History

2024-10-13 23:24:23 +08:00
<template>
2025-08-13 17:30:12 +08:00
<view class="container">
<view class="containerBody">
<VNavigationBar background-color="rgba(0,0,0,0)" title="新建工单" title-color="#333"></VNavigationBar>
<view class="body">
<view class="card phone">
<view class="phoneHeader">
<view class="title">查找手机号|车牌号|车架号</view>
<view class="desc">根据手机号查找|车牌号|车架号/建立客户信息</view>
</view>
<view class="phoneBody">
<view class="searchBox">
<input v-model="phone" placeholder="请输入手机号码|车牌号|车架号" type="tel">
</view>
<view class="btn" @click="listUserInfo">
<image class="btnIcon" mode="aspectFit" src="/pages-order/static/search.png"></image>
确认查找
</view>
</view>
</view>
<!-- <view class="card" style="padding-bottom: 20rpx">-->
<!-- <view class="carTitle">单据类型</view>-->
<!-- <radio-group @change="handleChange" style="padding: 0 20rpx">-->
<!-- <label v-for="(option, index) in options" :key="index" class="radio-label">-->
<!-- <radio :value="option.value" :checked="option.value === ticketType"/>-->
<!-- <text>{{ option.label }}</text>-->
<!-- </label>-->
<!-- </radio-group>-->
<!-- </view>-->
<view :class="{ 'none': !carList || carList.length === 0 }" class="card cardInfo carCard">
<template v-if="!carList || carList.length === 0">
<image @click="addCarUserInfo()" class="cardNoneIcon" mode="widthFix"
src="/pages-order/static/carNoneIcon.png"></image>
<view class="btn" @click="addCarUserInfo()">
<image mode="aspectFit" src="/pages-order/static/addIcon.png"
style="width: 28rpx;height: 28rpx"></image>
<text>添加车辆信息</text>
</view>
</template>
<template v-else>
<view class="carTitle">车辆信息</view>
<scroll-view scroll-x="true">
<view class="carListTab">
<view v-for="(item, index) in carList" :key="index"
:class="{'active': activeCarIndex === index}" class="carTabItem"
@click="() => activeCarIndex = index">
<image :src="imgUrlPrex + item.logoImg" class="carImage" mode="aspectFit"></image>
<text>{{ item.licenseNumber }}</text>
</view>
<view class="carTabItemNew" @click="editCarInfo()">
<text>+</text>
</view>
</view>
</scroll-view>
<view class="carDetail">
<view class="carHeader">
<image :src="imgUrlPrex + carList[activeCarIndex].logoImg" class="carImage"
mode="aspectFill"></image>
<view class="carHeaderRight">
<text class="carNumber">{{ carList[activeCarIndex].licenseNumber }}</text>
<text class="carType">{{
2024-10-18 17:15:20 +08:00
(carList[activeCarIndex].brandStr == null ? '' : carList[activeCarIndex].brandStr) + ' ' + (carList[activeCarIndex].modelStr == null ? '' : carList[activeCarIndex].modelStr)
}}
2025-08-13 17:30:12 +08:00
</text>
</view>
</view>
<view class="carBody">
<view style="display: flex;align-items: center">
<view class="infoItem" style="flex: 1">
<view class="label">车架号</view>
<view class="value">{{ carList[activeCarIndex].vin }}</view>
</view>
<view class="infoItem" style="flex: 1">
<view class="label">发动机号</view>
<view class="value">{{ carList[activeCarIndex].engineNumber }}</view>
</view>
</view>
<view style="display: flex;align-items: center">
<view class="infoItem" style="flex: 1">
<view class="label">年检到期时间</view>
<view class="value">{{ carList[activeCarIndex].nextInspectionDate || '未知' }}
</view>
</view>
<view class="infoItem" style="flex: 1">
<view class="label">保险到期时间</view>
<view class="value">{{ carList[activeCarIndex].insuranceExpiryDate || '未知' }}
</view>
</view>
</view>
<view class="infoItem">
<view class="label">注册日期</view>
<view class="value">{{ carList[activeCarIndex].carRegisterDate || '未知' }}</view>
</view>
</view>
<view class="carFoot">
<image mode="aspectFit" src="/static/icons/edit.png" style="width: 28rpx;height: 28rpx">
</image>
<text @click="editCarInfo(activeCarIndex)">修改信息</text>
</view>
</view>
</template>
</view>
<view :class="{ 'none': !userInfo }" class="card cardInfo userCard">
<template v-if="!userInfo">
<image class="cardNoneIcon" mode="widthFix" src="/pages-order/static/userNone.png"></image>
<view class="btn">
<!-- <image mode="aspectFit" src="/pages-order/static/addIcon.png" style="width: 28rpx;height: 28rpx"></image>-->
<text>客户信息</text>
</view>
</template>
<template v-else>
<view class="userTitle">客户信息</view>
<view class="userContainer">
<view style="display: flex;align-items: center">
<view class="infoItem" style="flex: 1">
<text class="label">姓名</text>
<text class="value">{{ userInfo.cusName }}</text>
</view>
<view class="infoItem" style="flex: 1">
<text class="label">性别</text>
<text class="value">{{ userInfo.sex === '1' ? '女' : '男' }}</text>
</view>
</view>
<view style="display: flex;align-items: center">
<view class="infoItem" style="flex: 1">
<text class="label">联系方式</text>
<text class="value">{{ userInfo.phoneNumber }}</text>
</view>
<view class="infoItem" style="flex: 1">
<text class="label">出生年月</text>
<text class="value">{{ userInfo.birthday }}</text>
</view>
</view>
<view class="infoItem">
<text class="label">联系地址</text>
<text class="value">
{{ userInfo.provinceName }} {{ userInfo.cityName }} {{ userInfo.areaName }}
{{ userInfo.address }}
</text>
</view>
</view>
<view class="userFoot">
<image mode="aspectFit" src="/static/icons/edit.png" style="width: 28rpx;height: 28rpx">
</image>
<text @click="editUserInfo(userInfo)">修改信息</text>
</view>
</template>
</view>
<view class="card cardInfo userCard">
<template>
<view class="userTitle">工单信息</view>
<view class="userContainer" style="padding-bottom: 20rpx">
<view style="display: flex;align-items: center">
<view class="infoItem" style="flex: 1">
<text class="label">经办人姓名</text>
<input type="text" style="text-align: left" v-model="formData.handleName"
placeholder="请填写经办人姓名" />
</view>
<view class="infoItem" style="flex: 1">
<text class="label">经办人电话</text>
<input type="text" style="text-align: left" v-model="formData.handleMobile"
placeholder="请填写经办人电话" />
</view>
</view>
<view style="display: flex;align-items: center">
<view class="infoItem" style="flex: 1">
<text class="label">进厂时间</text>
<picker mode="date" :value="formData.inTime" start="2020-01-01" end="2030-12-31"
@change="bindDateChange1">
<view style="margin-left: 10rpx">
{{ formData.inTime}}
</view>
</picker>
</view>
<view class="infoItem" style="flex: 1">
<text class="label">预计完工</text>
<picker mode="date" :value="formData.outTime" start="2020-01-01" end="2030-12-31"
@change="bindDateChange2">
<view style="margin-left: 10rpx">
{{ formData.outTime}}
</view>
</picker>
</view>
</view>
<view style="display: flex;align-items: center">
<view class="infoItem" style="flex: 1">
<text class="label">表显里程</text>
<input type="text" style="text-align: left" v-model="formData.mileageTraveled"
placeholder="请填写表显里程" />
</view>
<view class="infoItem" style="flex: 1">
<text class="label">三包单位</text>
<input type="text" style="text-align: left" v-model="formData.threePackUnits"
placeholder="请填写三包单位" />
</view>
</view>
<view style="display: flex;align-items: center">
<view class="infoItem" style="flex: 1">
<text class="label">最近保养日期</text>
<picker mode="date" :value="formData.maintenanceDate" start="2020-01-01"
@change="bindDateChange3">
<view style="margin-left: 10rpx">
{{ formData.maintenanceDate}}
</view>
</picker>
</view>
<view class="infoItem" style="flex: 1">
<text class="label">最近保养公里数</text>
<input type="text" style="text-align: left" v-model="formData.maintenanceMileage"
placeholder="请填写最近保养公里数" />
</view>
</view>
<view style="display: flex;align-items: center">
<view class="infoItem" style="flex: 1">
<text class="label">年检到期时间</text>
<picker mode="date" :value="formData.nextInspectionDate" start="2020-01-01"
@change="bindDateChange4">
<view style="margin-left: 10rpx">
{{ formData.nextInspectionDate}}
</view>
</picker>
</view>
<view class="infoItem" style="flex: 1">
<text class="label">保险到期时间</text>
<picker mode="date" :value="formData.insuranceExpiryDate" start="2020-01-01"
@change="bindDateChange5">
<view style="margin-left: 10rpx">
{{ formData.insuranceExpiryDate}}
</view>
</picker>
</view>
</view>
2025-09-30 09:37:26 +08:00
<!-- <view style="display: flex;align-items: center">
2025-08-13 17:30:12 +08:00
<view class="infoItem" style="flex: 1" v-if="cusFromList && cusFromList.length>0">
<text class="label">客户来源</text>
<picker @change="cusFromChange" :value="cusFromIndex" :range="cusFromList"
range-key="label">
<view class="uni-input">{{ cusFromList[cusFromIndex].label}}</view>
</picker>
</view>
<view class="infoItem" style="flex: 1" v-if="busiFromList && busiFromList.length>0">
<text class="label">业务来源</text>
<picker @change="busiFromChange" :value="busiFromIndex" :range="busiFromList"
range-key="label">
<view class="uni-input">{{ busiFromList[busiFromIndex].label}}</view>
</picker>
</view>
2025-09-30 09:37:26 +08:00
</view> -->
<view style="display: flex;align-items: center">
<text class="label">渠道/来源</text>
<uni-data-picker :localdata="busiAndCusList" v-model='busIAndCusValue'
popup-title="请选择渠道和来源" :map="{text:'name',value:'name'}"
@change="onBusiAndCuschange"></uni-data-picker>
2025-08-13 17:30:12 +08:00
</view>
<view style="display: flex;align-items: center">
<view class="infoItem" style="flex: 1">
<text class="label">保险名称</text>
<input type="text" style="text-align: left" v-model="formData.insuranceName"
placeholder="请填写保险名称" />
</view>
</view>
<view style="display: flex;align-items: center">
<view class="infoItem" style="flex: 1">
<text class="label">承保险种</text>
<uni-data-checkbox multiple v-model="insuranceTypeArray"
:localdata="insuranceTypeList"></uni-data-checkbox>
</view>
</view>
2025-08-25 10:04:53 +08:00
<!-- <view style="display: flex;align-items: center">
2025-08-13 17:30:12 +08:00
<view class="infoItem" style="flex: 1">
<text class="label">上年保费</text>
<view style="display: flex">
<input type="decimal" style="text-align: left" v-model="formData.jiaoqiang"
placeholder="请输入交强险保费" />
<input type="decimal" style="text-align: left" v-model="formData.shangye"
placeholder="请输入商业险保费" />
</view>
</view>
2025-08-25 10:04:53 +08:00
</view> -->
2025-08-13 17:30:12 +08:00
<view style="display: flex;align-items: center">
<view class="infoItem" style="flex: 1">
<text class="label">救援费</text>
<input type="text" style="text-align: left" v-model="formData.rescueMoney"
placeholder="请填写救援费" />
</view>
<view class="infoItem" style="flex: 1">
<text class="label">三包费</text>
<input type="text" style="text-align: left" v-model="formData.threePackMoney"
placeholder="请填写救援费" />
</view>
</view>
<view style="display: flex;align-items: center">
<view class="infoItem" style="flex: 1">
<text class="label">定损费</text>
<input type="text" style="text-align: left" v-model="formData.confirmFaultMoney"
placeholder="请填写定损费" />
</view>
<view class="infoItem" style="flex: 1">
<text class="label">管理费</text>
<input type="text" style="text-align: left" v-model="formData.managerMoney"
placeholder="请填写管理费" />
</view>
</view>
<view style="display: flex;align-items: center">
<view class="infoItem" style="flex: 1" v-if="partDisposals && partDisposals.length>0">
<text class="label">旧件处置方式</text>
<picker @change="partDisposalChange" :value="partDisposalIndex"
:range="partDisposals" range-key="label">
<view class="uni-input">{{ partDisposals[partDisposalIndex].label}}</view>
</picker>
</view>
<view class="infoItem" style="flex: 1" v-if="repairTypes && repairTypes.length>0">
<text class="label">维修类型</text>
<picker @change="repairTypeChange" :value="repairTypeIndex" :range="repairTypes"
range-key="label">
<view class="uni-input">{{ repairTypes[repairTypeIndex].label}}</view>
</picker>
</view>
</view>
<!-- <view style="display: flex;align-items: center">-->
<!-- <view class="infoItem" style="flex: 1">-->
<!-- <text class="label">维修建议</text>-->
<!-- <textarea style="height: 50px" auto-height v-model="formData.repairAdvice" placeholder="请填写维修建议"/>-->
<!-- </view>-->
<!-- </view>-->
<!-- <view style="display: flex;align-items: center">-->
<!-- <view class="infoItem" style="flex: 1">-->
<!-- <text class="label">备注</text>-->
<!-- <textarea style="height: 50px" auto-height v-model="formData.remark" placeholder="请填写备注"/>-->
<!-- </view>-->
<!-- </view>-->
</view>
</template>
</view>
<view :class="{ 'none': !selectedProj || selectedProj.length === 0 }" class="card cardInfo projCard">
<template v-if="!selectedProj || selectedProj.length === 0">
<image class="cardNoneIcon" mode="widthFix" src="/pages-order/static/projectNone.png"></image>
<view class="btn">
<image mode="aspectFit" src="/pages-order/static/addIcon.png"
style="width: 28rpx;height: 28rpx"></image>
<text @click="addProj()">添加维修项目</text>
</view>
</template>
<template v-else>
<view class="projTitle">维修项目</view>
<view class="projList">
<view v-for="item in selectedProj" :key="item.id" class="projItem">
{{ item.name }}
</view>
</view>
<view class="projFoot">
<image mode="aspectFit" src="/static/icons/edit.png" style="width: 28rpx;height: 28rpx">
</image>
<text @click="addProj(selectedProj)">修改信息</text>
</view>
</template>
</view>
<project-picker ref="proj" @confirm="projConfirm"></project-picker>
</view>
<!-- 普通弹窗---拍照上传 -->
<uni-popup ref="popup" background-color="#fff">
<view class="popup-content">
<view class="dl-avatar-box">
<uni-file-picker :value="fileList" :sizeType="sizeType" @select="afterRead" @delete="deleteFile"
limit="9" title="请上传车辆照片最多选择9张图片"></uni-file-picker>
</view>
<button type="primary" @click="submit">保存</button>
</view>
</uni-popup>
<view class="footer">
<view class="btn" @click="submitUpload">创建工单</view>
</view>
</view>
</view>
2024-10-13 23:24:23 +08:00
</template>
<script>
2025-08-13 17:30:12 +08:00
import VNavigationBar from '@/components/VNavigationBar.vue'
import ProjectPicker from "@/components/projectPicker.vue";
import {
bus
} from "@/utils/eventBus";
import request from "@/utils/request";
import {
getToken,
setUserInfo,
getUserInfo,
getStorageWithExpiry,
setStorageWithExpiry
} from '@/utils/auth.js'
import config from "@/config";
import {
formatTimestamp,
2025-09-30 09:37:26 +08:00
formatTimestampCustom,
handleTree
2025-08-13 17:30:12 +08:00
} from "@/utils/utils";
import upload from "@/utils/upload";
import {
getDictByCode,
formatDate
} from "@/utils/utils";
export default {
components: {
ProjectPicker,
VNavigationBar,
},
data() {
return {
//上传的图片数组
fileList: [],
sizeType: ['compressed'],
repairTypeShow: true,
phone: '',
carList: [],
activeCarIndex: 0,
userInfo: null,
selectedProj: [],
typeList: [],
ticketType: '01',
repairTypes: [],
repairTypeIndex: 0,
cusFromList: [],
cusFromIndex: 0,
busiFromList: [],
busiFromIndex: 0,
2025-09-30 09:37:26 +08:00
busiAndCusList: [],
2025-08-13 17:30:12 +08:00
partDisposals: [],
partDisposalIndex: 0,
formData: {
inTime: null,
outTime: null,
handleName: null,
handleMobile: null,
mileageTraveled: null,
threePackUnits: null,
insuranceName: null,
managerMoney: 0.00,
rescueMoney: 0.00,
threePackMoney: 0.00,
confirmFaultMoney: 0.00,
partDisposal: null,
repairType: null,
nextInspectionDate: null,
insuranceExpiryDate: null,
jiaoqiang: null,
shangye: null,
cusFrom: null,
busiFrom: null,
},
options: [{
label: 'A单',
value: '01'
},
{
label: 'B单',
value: '02'
}
],
//承保险种-、三者、车损、驾乘、不计
insuranceTypeList: [{
text: '交强',
value: '交强'
}, {
text: '三者',
value: '三者'
}, {
text: '车损',
value: '车损'
}, {
text: '驾乘',
value: '驾乘'
}, {
text: '不计',
value: '不计'
}],
//选中的险种
insuranceTypeArray: [],
imgUrlPrex: config.baseImageUrl,
ticketNo: '',
//前一个页面传过来的参数
pageData: {},
2025-09-30 09:37:26 +08:00
busIAndCusValue: undefined
2025-08-13 17:30:12 +08:00
}
},
watch: {
'userInfo': {
handler: function(newVal, oldVal) {
if (!this.formData.handleName) {
this.formData.handleName = newVal.cusName
}
if (!this.formData.handleMobile) {
this.formData.handleMobile = newVal.phoneNumber
}
//带过来车辆的年检到期时间和保险到期时间
console.log(newVal, "newValnewVal")
if (!this.formData.handleMobile) {
this.formData.handleMobile = newVal.phoneNumber
}
if (!this.formData.cusFrom) {
for (let i = 0; i < this.cusFromList.length; i++) {
if (newVal.dataFrom == this.cusFromList[i].value) {
this.cusFromIndex = i
this.formData.cusFrom = newVal.dataFrom
return
}
}
}
console.log('obj changed:', newVal, oldVal)
},
deep: true
},
'activeCarIndex': {
handler: function(newVal, oldVal) {
if (this.carList[newVal].nextInspectionDate) {
this.formData.nextInspectionDate = formatTimestampCustom(this.carList[newVal]
.nextInspectionDate)
} else {
this.formData.nextInspectionDate = formatDate(Date.now())
}
if (this.carList[newVal].insuranceExpiryDate) {
this.formData.insuranceExpiryDate = formatTimestampCustom(this.carList[newVal]
.insuranceExpiryDate)
} else {
this.formData.insuranceExpiryDate = formatDate(Date.now())
}
},
deep: true
}
},
onLoad(data) {
this.pageData = data
this.formData.inTime = formatDate(Date.now())
this.formData.outTime = formatDate(Date.now())
this.formData.maintenanceDate = formatDate(Date.now())
this.formData.nextInspectionDate = formatDate(Date.now())
this.formData.insuranceExpiryDate = formatDate(Date.now())
this.ticketNo = this.createUniqueCodeByHead('GD')
if (data.phone) {
this.phone = data.phone
this.listUserInfo()
}
this.initDict("repair_busi_from")
this.initDict("insurance_type")
this.initDict("repair_type")
this.initDict("cus_data_from")
this.initDict("repair_part_disposal")
2025-09-30 09:37:26 +08:00
this.queryBusiAndCus()
2025-08-13 17:30:12 +08:00
},
onShow() {},
methods: {
// 日期选择 事件
bindDateChange1(e) {
this.formData.inTime = e.target.value; // 更新选择的日期到data中的date变量
},
// 日期选择 事件
bindDateChange3(e) {
this.formData.maintenanceDate = e.target.value; // 更新选择的日期到data中的date变量
},
// 日期选择 事件
bindDateChange4(e) {
this.formData.nextInspectionDate = e.target.value; // 更新选择的日期到data中的date变量
},
// 日期选择 事件
bindDateChange5(e) {
this.formData.insuranceExpiryDate = e.target.value; // 更新选择的日期到data中的date变量
},
// 日期选择 事件
bindDateChange2(e) {
this.formData.outTime = e.target.value; // 更新选择的日期到data中的date变量
},
repairTypeChange(event) {
const newIndex = event.detail.value;
this.repairTypeIndex = newIndex;
this.formData.repairType = this.repairTypes[newIndex].value;
},
cusFromChange(event) {
const newIndex = event.detail.value;
this.cusFromIndex = newIndex;
this.formData.cusFrom = this.cusFromList[newIndex].value;
},
busiFromChange(event) {
const newIndex = event.detail.value;
this.busiFromIndex = newIndex;
this.formData.busiFrom = this.busiFromList[newIndex].value;
},
partDisposalChange(event) {
const newIndex = event.detail.value;
this.partDisposalIndex = newIndex;
this.formData.partDisposal = this.partDisposals[newIndex].value;
},
async initDict(dictCode) {
let dictArray = getStorageWithExpiry(dictCode);
console.log(dictArray, "partDisposals")
if (null == dictArray || undefined == dictArray) {
request({
url: '/admin-api/system/dict-data/type',
method: 'get',
params: {
type: dictCode
}
}).then((res) => {
console.log(res)
if (res.code == 200) {
setStorageWithExpiry(dictCode, res.data, 3600)
this.$nextTick(() => {
if ("repair_type" == dictCode) {
this.repairTypes = res.data
this.buildRepairType()
} else if ("repair_part_disposal" == dictCode) {
this.partDisposals = res.data
} else if ("insurance_type" == dictCode) {
this.buildInsuranceTypeList()
} else if ("cus_data_from" == dictCode) {
this.cusFromList = res.data
} else if ("repair_busi_from" == dictCode) {
this.busiFromList = res.data
}
})
}
})
} else {
this.$nextTick(() => {
if ("repair_type" == dictCode) {
this.repairTypes = dictArray
this.buildRepairType()
} else if ("repair_part_disposal" == dictCode) {
this.partDisposals = dictArray
} else if ("insurance_type" == dictCode) {
this.buildInsuranceTypeList()
} else if ("cus_data_from" == dictCode) {
this.cusFromList = dictArray
} else if ("repair_busi_from" == dictCode) {
this.busiFromList = dictArray
}
})
}
},
/**
* 组装承保险种待选值
*/
buildInsuranceTypeList(data) {
if (data && data.length > 0) {
this.insuranceTypeList = []
data.map((item) => {
let thisObj = {
text: item.label,
value: item.value
}
this.insuranceTypeList.push(thisObj)
})
}
},
2025-09-30 09:37:26 +08:00
/**
* 获取业务来源和渠道
*/
queryBusiAndCus() {
request({
url: `/admin-api/business/list`,
method: 'GET',
params: {
systemCode: 'repair'
}
}).then(res => {
this.busiAndCusList = handleTree(res.data, 'id', 'pid')
})
},
onBusiAndCuschange(e) {
this.formData.busiFrom = e.detail.value[0].value
this.formData.cusFrom = e.detail.value[1].value
},
2025-08-13 17:30:12 +08:00
buildRepairType() {
if (this.pageData.repairType) {
this.repairTypes.map((item, index) => {
if (item.value == this.pageData.repairType) {
this.repairTypeIndex = index
this.formData.repairType = this.repairTypes[index].value;
return
}
})
} else {
//默认选中第一个
this.repairTypeIndex = 0
this.formData.repairType = this.repairTypes[0].value;
}
},
afterRead(file) {
uni.showLoading({
title: '正在上传中...',
mask: true
});
for (let i = 0; i < file.tempFilePaths.length; i++) {
upload({
url: '/admin-api/infra/file/upload',
filePath: file.tempFilePaths[i]
}).then((res) => {
this.fileList.push({
url: config.baseImageUrl + res.data
})
if (i == file.tempFilePaths.length - 1) {
uni.hideLoading()
}
console.log(this.fileList)
})
}
},
deleteFile(file, index) {
this.fileList.splice(index, 1);
},
saveWorkingItem() {
console.log(this.fileList, 145)
},
createUniqueCodeByHead(head = '') {
const min = 100; // 最小值
const max = 999; // 最大值
return head.toString() + Date.now().toString() + Math.floor(Math.random() * (max - min + 1)) + min;
},
/**
* 创建工单前上传图片
*/
submitUpload() {
2025-09-30 09:37:26 +08:00
if (this.userInfo === null || this.carList.length === 0 || this.selectedProj.length === 0 || !this.formData
.busiFrom || !this.formData.cusFrom) {
2025-08-13 17:30:12 +08:00
uni.showToast({
title: '请完善信息',
icon: 'none'
})
return
}
this.$refs.popup.open("bottom");
},
//新增工单
submit() {
let fileStr = this.fileList.map(item => item.url.replace(config.baseImageUrl, "")).join(",")
2025-09-30 09:37:26 +08:00
// if (!this.formData.busiFrom) {
// this.formData.busiFrom = this.busiFromList[this.busiFromIndex].value
// }
// if (!this.formData.cusFrom) {
// this.formData.cusFrom = this.cusFromList[this.cusFromIndex].value
// }
2025-08-13 17:30:12 +08:00
const data = {
userId: this.userInfo.id,
ticketNo: this.ticketNo,
userName: this.userInfo.cusName,
userMobile: this.userInfo.phoneNumber,
carId: this.carList[this.activeCarIndex].id,
carNo: this.carList[this.activeCarIndex].licenseNumber,
carVin: this.carList[this.activeCarIndex].vin,
carBrandId: this.carList[this.activeCarIndex].carBrand,
carBrandName: this.carList[this.activeCarIndex].brandStr,
carBrandType: this.carList[this.activeCarIndex].brandType,
adviserId: getUserInfo().id,
adviserName: getUserInfo().nickname,
ticketType: this.ticketType,
itemList: this.formatItem(this.selectedProj),
fileStr: fileStr,
...this.formData,
}
if (this.insuranceTypeArray.length > 0) {
data.insuranceType = this.insuranceTypeArray.join(",")
}
if (this.pageData && this.pageData.hasOwnProperty("bookingId")) {
data.bookingId = this.pageData.bookingId
}
uni.navigateTo({
// url: '/pages-repair/signature/signature?data=' + JSON.stringify(data)
url: '/pages-repair/sign/sign?data=' + JSON.stringify(data)
})
// request({
// url: '/admin-api/repair/tickets/create',
// method: 'POST',
// data: {
// userId: this.userInfo.id,
// ticketNo: this.ticketNo,
// userName: this.userInfo.cusName,
// userMobile: this.userInfo.phoneNumber,
// carId: this.carList[this.activeCarIndex].id,
// carNo: this.carList[this.activeCarIndex].licenseNumber,
// carVin: this.carList[this.activeCarIndex].vin,
// carBrandId: this.carList[this.activeCarIndex].carBrand,
// carBrandName: this.carList[this.activeCarIndex].brandStr,
// carBrandType: this.carList[this.activeCarIndex].brandType,
// adviserId: getUserInfo().id,
// adviserName: getUserInfo().nickname,
// ticketType: this.ticketType,
// itemList: this.formatItem(this.selectedProj)
// }
// }).then(res => {
// uni.showToast({
// title: '创建成功',
// icon: 'success'
// })
// uni.navigateTo({
// url: `/pages-order/orderDetail/orderDetail?id=${res.data.id}&isDetail=0`
// });
// })
},
listUserInfo() {
this.carList = []
this.userInfo = null
this.activeCarIndex = 0
if (this.phone != '') {
const params = {
phoneOrCar: this.phone
}
request({
url: '/admin-api/base/custom/page',
method: 'GET',
params: params
}).then(res => {
2025-09-30 09:37:26 +08:00
if (res.data.records.length == 1) {
2025-08-13 17:30:12 +08:00
this.userInfo = res.data.records[0]
this.getCarList()
2025-09-30 09:37:26 +08:00
} else if (res.data.records.length != 0) {
uni.showActionSheet({
title: '选择客户',
itemList: res.data.records.map(m => m.cusName + m.phoneNumber),
success: ({
tapIndex
}) => {
this.userInfo = res.data.records[tapIndex]
this.getCarList()
}
})
2025-08-13 17:30:12 +08:00
}
})
} else {
uni.showToast({
title: '请输入手机号|车牌号|车架号',
icon: 'none'
})
}
},
// 子表信息预处理
formatItem(list) {
if (!(list && list.length > 0)) {
return []
}
return list.map(item => {
const temp = {
...item,
itemName: item.name,
itemCount: 1,
itemUnit: item.unit,
itemPrice: item.price,
itemMoney: item.price,
itemTypeId: item.type,
remark: item.remark,
itemStatus: item.itemStatus,
itemType: "01",
projectId: item.id,
id: null
}
return temp;
})
},
handleChange(event) {
this.ticketType = event.detail.value;
},
getCarList(carId) {
const params = {
userId: this.userInfo.userId,
pageNo: 1,
pageSize: 100000
}
request({
url: '/admin-api/base/carMain/page',
method: 'GET',
params: params
}).then(res => {
this.carList = res.data.records
for (let i = 0; i < this.carList.length; i++) {
if (this.carList[i].licenseNumber.toLowerCase() == this.phone.toLowerCase()) {
this.activeCarIndex = i
break
} else if (this.carList[i].vin.toLowerCase() == this.phone.toLowerCase()) {
this.activeCarIndex = i
break
}
}
//将时间戳转换
this.carList.forEach(item => {
if (item.nextInspectionDate) {
item.nextInspectionDate = formatTimestampCustom(item.nextInspectionDate)
} else {
item.nextInspectionDate = ''
}
if (item.insuranceExpiryDate) {
item.insuranceExpiryDate = formatTimestampCustom(item.insuranceExpiryDate)
} else {
item.insuranceExpiryDate = ''
}
if (item.carRegisterDate) {
item.carRegisterDate = formatTimestampCustom(item.carRegisterDate)
} else {
item.carRegisterDate = ''
}
})
if (this.pageData.carId) {
for (let i = 0; i < this.carList.length; i++) {
if (this.pageData.carId == this.carList[i].id) {
this.activeCarIndex = i
if (this.carList[i].nextInspectionDate) {
this.formData.nextInspectionDate = formatTimestampCustom(this.carList[i]
.nextInspectionDate)
} else {
this.formData.nextInspectionDate = formatDate(Date.now())
}
if (this.carList[i].insuranceExpiryDate) {
this.formData.insuranceExpiryDate = formatTimestampCustom(this.carList[i]
.insuranceExpiryDate)
} else {
this.formData.insuranceExpiryDate = formatDate(Date.now())
}
break
}
}
} else if (carId) {
for (let i = 0; i < this.carList.length; i++) {
if (carId == this.carList[i].id) {
this.activeCarIndex = i
if (this.carList[i].nextInspectionDate) {
this.formData.nextInspectionDate = formatTimestampCustom(this.carList[i]
.nextInspectionDate)
} else {
this.formData.nextInspectionDate = formatDate(Date.now())
}
if (this.carList[i].insuranceExpiryDate) {
this.formData.insuranceExpiryDate = formatTimestampCustom(this.carList[i]
.insuranceExpiryDate)
} else {
this.formData.insuranceExpiryDate = formatDate(Date.now())
}
break
}
}
}
})
},
editCarInfo(index) {
bus.$off('updateCarInfo')
bus.$on('updateCarInfo', (carId) => {
this.$nextTick(() => {
//重新查车辆信息
this.getCarList(carId)
})
})
if (this.userInfo == null) {
//弹窗提示请选择客户
uni.showToast({
title: '请先选择客户',
icon: 'none'
})
} else {
uni.navigateTo({
url: `/pages/myCar/carDetail?car=${index >= 0 ? encodeURIComponent(JSON.stringify(this.carList[index])) : ''}&userInfo=${encodeURIComponent(JSON.stringify(this.userInfo))}`
});
}
},
/**
* 添加车辆和客户信息
*/
addCarUserInfo() {
if (this.userInfo) {
//已查出客户信息
uni.navigateTo({
url: '/pages/myCar/addCarUser?userInfo=' + JSON.stringify(this.userInfo)
})
} else if (this.phone != '') {
//输入了内容
const params = {
phoneOrCar: this.phone
}
request({
url: '/admin-api/base/custom/page',
method: 'GET',
params: params
}).then(res => {
if (res.data.records.length > 0) {
this.userInfo = res.data.records[0]
//跳转添加客户车辆信息页
uni.navigateTo({
url: '/pages/myCar/addCarUser?userInfo=' + JSON.stringify(this.userInfo)
})
} else {
//没查出来
uni.navigateTo({
url: '/pages/myCar/addCarUser?phoneNum=' + this.phone
})
}
})
} else {
//没输入,直接加
uni.navigateTo({
url: `/pages/myCar/addCarUser`
})
}
},
editUserInfo(userInfo) {
if (this.phone == '') return uni.showToast({
title: '请先输入手机号,再添加客户',
icon: 'none'
})
bus.$off('updateUserInfo')
bus.$on('updateUserInfo', (userInfo) => {
this.userInfo = userInfo
})
uni.navigateTo({
url: `/pages/userInfo/editUserInfo?userInfo=${userInfo ? encodeURIComponent(JSON.stringify(userInfo)) : ''}`
})
},
addProj(projList = []) {
this.$refs.proj.open(projList)
},
projConfirm(proj) {
this.selectedProj = proj
}
}
}
2024-10-13 23:24:23 +08:00
</script>
<style lang="less" scoped>
2025-08-13 17:30:12 +08:00
.popup-content {
@include flex;
align-items: center;
justify-content: center;
padding: 15px;
height: auto;
background-color: #fff;
}
.container {
height: 100%;
background-color: #F3F5F7;
.containerBody {
height: 100%;
display: flex;
flex-direction: column;
background: linear-gradient(180deg, #C1DEFF 0%, rgba(193, 222, 255, 0) 100%);
background-size: 100% 500rpx;
background-repeat: no-repeat;
}
.body {
flex: 1;
height: 0;
overflow: auto;
.card {
background: #FFFFFF;
border-radius: 8rpx 8rpx 8rpx 8rpx;
margin: 20rpx 32rpx;
}
.phone {
background: #0174F6;
.phoneHeader {
padding: 20rpx 30rpx;
.title {
font-weight: bold;
font-size: 32rpx;
color: #FFFFFF;
margin-bottom: 10rpx;
}
.desc {
font-weight: 500;
font-size: 24rpx;
color: rgba(255, 255, 255, 0.7);
}
}
.phoneBody {
background: #FFFFFF;
border-radius: 8rpx 8rpx 8rpx 8rpx;
padding: 0 30rpx;
.searchBox {
padding: 40rpx 0;
border-bottom: 1rpx solid #EEEEEE;
}
.btn {
padding: 40rpx 0;
display: flex;
align-items: center;
justify-content: center;
column-gap: 10rpx;
font-weight: 500;
font-size: 32rpx;
color: #0174F6;
.btnIcon {
width: 32rpx;
height: 32rpx;
}
}
}
}
.cardInfo {
&.none {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
.cardNoneIcon {
width: 336rpx;
}
.btn {
position: absolute;
bottom: 40rpx;
left: 50%;
transform: translateX(-50%);
display: flex;
align-items: center;
column-gap: 10rpx;
font-weight: 500;
font-size: 28rpx;
color: #0174F6;
}
}
}
.projTitle,
.userTitle,
.carTitle {
padding: 30rpx;
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.carCard {
.carListTab {
display: flex;
align-items: center;
column-gap: 32rpx;
padding: 0 26rpx 22rpx;
.carTabItem {
display: flex;
flex-direction: column;
align-items: center;
row-gap: 10rpx;
font-weight: 500;
font-size: 24rpx;
color: #333333;
&.active {
.carImage {
border: 2rpx solid #0174F6;
}
color: #0174F6;
}
.carImage {
width: 128rpx;
height: 80rpx;
background: #F2F2F7;
border-radius: 8rpx 8rpx 8rpx 8rpx;
}
}
.carTabItemNew {
display: flex;
flex-direction: column;
align-items: center;
row-gap: 10rpx;
font-weight: 500;
font-size: 24rpx;
color: #333333;
border: 2rpx solid #0174F6;
/* 默认边框颜色为透明 */
justify-content: center;
/* 垂直居中 */
font-weight: bold;
font-size: 32rpx;
padding: 10rpx;
/* 可以根据需要调整内边距 */
width: 128rpx;
/* 与 .carImage 宽度一致 */
height: 80rpx;
/* 与 .carImage 高度一致 */
border-radius: 8rpx 8rpx 8rpx 8rpx;
margin-top: -37rpx;
}
}
.carDetail {
background: linear-gradient(180deg, rgba(1, 116, 246, 0.15) 0%, rgba(255, 255, 255, 0) 100%) no-repeat;
background-size: 100% 184rpx;
padding: 30rpx 30rpx 0;
.carHeader {
border-radius: 8rpx 8rpx 8rpx 8rpx;
display: flex;
align-items: center;
column-gap: 20rpx;
padding-bottom: 30rpx;
.carImage {
width: 192rpx;
height: 120rpx;
background: #F2F2F7;
border-radius: 8rpx 8rpx 8rpx 8rpx;
}
.carHeaderRight {
display: flex;
flex-direction: column;
row-gap: 20rpx;
font-weight: bold;
font-size: 32rpx;
color: #333333;
.carType {
font-weight: 500;
font-size: 28rpx;
color: #858BA0;
}
}
}
.carBody {
display: flex;
flex-direction: column;
row-gap: 30rpx;
padding-top: 30rpx;
border-top: 1rpx solid #DDDDDD;
}
.carFoot {}
}
}
.projCard {
.projList {
padding: 0 30rpx;
display: flex;
gap: 20rpx;
flex-wrap: wrap;
.projItem {
padding: 10rpx 16rpx;
border-radius: 4rpx 4rpx 4rpx 4rpx;
border: 2rpx solid #0174F6;
font-weight: 500;
font-size: 24rpx;
color: #0174F6;
}
}
}
.userCard {
.userContainer {
display: flex;
flex-direction: column;
row-gap: 30rpx;
margin: 0 30rpx;
}
}
.infoItem {
display: flex;
flex-direction: column;
.label {
font-weight: 500;
font-size: 28rpx;
color: #858BA0;
}
.value {
font-weight: 500;
font-size: 28rpx;
color: #333333;
}
}
.projFoot,
.userFoot,
.carFoot {
padding: 30rpx;
font-weight: 500;
font-size: 28rpx;
color: #0174F6;
display: flex;
align-items: center;
justify-content: center;
column-gap: 6rpx;
}
}
.footer {
height: 136rpx;
background: #FFFFFF;
border-radius: 0rpx 0rpx 0rpx 0rpx;
display: flex;
align-items: center;
justify-content: center;
.btn {
width: 510rpx;
height: 76rpx;
background: #0174F6;
border-radius: 38rpx 38rpx 38rpx 38rpx;
font-weight: bold;
font-size: 32rpx;
color: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
}
}
.radio-label {
//display: flex;
align-items: center;
margin-bottom: 10rpx;
}
.radio-label text {
margin-left: 10rpx;
}
}
</style>