维修工单-新增、修改用户信息

This commit is contained in:
xiao-fajia 2024-09-29 18:13:07 +08:00
parent 78ac82f238
commit 54ae167c2b
4 changed files with 385 additions and 16 deletions

View File

@ -1,6 +1,6 @@
<template>
<el-select v-model="staffSelected" clearable filterable @blur="$emit('input-blur', $event)">
<el-option v-for="staff in staffList" :key="staff.id" :label="staff.name" :value="staff.id"/>
<el-option v-for="staff in staffList" :key="staff.id" :label="staff.name + ' ' + staff.tel" :value="staff.id"/>
</el-select>
</template>

View File

@ -1,6 +1,6 @@
<template>
<el-select v-model="userSelected" clearable filterable >
<el-option v-for="user in userList" :key="user.id" :label="user.cusName" :value="user.id" />
<el-option v-for="user in userList" :key="user.id" :label="user.cusName + ' ' + user.phoneNumber" :value="user.id" />
</el-select>
</template>

View File

@ -117,11 +117,12 @@
<el-col :span="17" style="padding-right: 0">
<el-card class="top-left">
<el-descriptions class="margin-top" :column="3" :size="'mini'" border>
<!-- <template slot="extra">-->
<!-- <el-button v-if="createTicketType" type="success" size="small">新增客户信息</el-button>-->
<!-- <el-button v-if="createTicketType" type="primary" size="small" :disabled="!selectUser.id">完善更多客户信息</el-button>-->
<!-- <el-button type="primary" size="small">选择业务</el-button>-->
<!-- </template>-->
<template slot="extra">
<el-button v-if="createTicketType" type="success" size="small" @click="updateUserInfo(false)">新增客户信息</el-button>
<el-button v-if="createTicketType" type="primary" size="small" @click="updateUserInfo(true)" :disabled="!selectUser.id">
完善更多客户信息
</el-button>
</template>
<el-descriptions-item>
<template slot="label">
用户选择
@ -241,7 +242,7 @@
:data="couponList"
border
size="mini"
height="200"
height="270"
style="width: 100%">
<!-- @selection-change="handleSelectionChange"-->
<!-- <el-table-column-->
@ -332,12 +333,12 @@
<el-col :span="createTicketType ? 12 : 16">
<el-descriptions class="margin-top" :column="createTicketType ? 2 : 3" border :size="'medium'"
style="margin-bottom: 1rem">
<!-- <el-descriptions-item>-->
<!-- <template slot="label">-->
<!-- 工单号-->
<!-- </template>-->
<!-- <TicketChoose @selected="getTickets"/>-->
<!-- </el-descriptions-item>-->
<el-descriptions-item>
<template slot="label">
工单号
</template>
<TicketChoose @selected="getTickets"/>
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
时间
@ -393,6 +394,7 @@
<RepairAdvice ref="repairAdvice" v-model="formData.repairAdvice"/>
<QualityExplain ref="qualityExplain" v-model="formData.quality"/>
<UserAndCarForm ref="userAndCarInfo" @success="successCreateUserInfo"/>
</div>
</template>
@ -408,10 +410,13 @@ import QualityExplain from "@/views/repair/tickets/form/QualityExplain.vue";
import TicketChoose from "@/views/repair/tickets/Components/TicketChoose.vue";
import request from "@/utils/request";
import * as CustomerMainApi from "@/api/base/customer";
import UserAndCarForm from "@/views/repair/tickets/form/UserAndCarForm.vue";
export default {
name: "UserInfo",
components: {TicketChoose, QualityExplain, RepairAdvice, CarChoose, TicketItem, StaffChoose, UserChoose},
components: {
UserAndCarForm,
TicketChoose, QualityExplain, RepairAdvice, CarChoose, TicketItem, StaffChoose, UserChoose},
props: {
createTicketType: {
type: Boolean,
@ -739,7 +744,6 @@ export default {
this.bookingList = res.data
if (this.bookingList.length > 0) {
this.bookingList.forEach(item => {
console.log(item.bookingTime)
item.bookingTime = this.parseTime(item.bookingTime, '{y}-{m}-{d} {h}:{m}')
})
}
@ -753,6 +757,23 @@ export default {
this.finaCouponList.forEach(item => console.log(item.isChoose))
this.couponList = this.finaCouponList.filter(item => !item.isChoose)
},
//
updateUserInfo(flag){
const data = {}
if (flag){
if (this.selectUser){
data.userInfo = this.selectUser
}
if (this.selectCar){
data.carInfo = this.selectCar
}
}
this.$refs.userAndCarInfo.open(data)
},
//
successCreateUserInfo(){
}
// //
// handleSelectionChange(val){
//
@ -765,4 +786,8 @@ export default {
.top-left {
margin-bottom: 1rem;
}
.el-card__body {
min-height: 100rem;
}
</style>

View File

@ -0,0 +1,344 @@
<template>
<div class="app-container">
<el-dialog title="客户信息" :visible.sync="dialogVisible" width="80%" v-dialogDrag append-to-body>
<el-form size="small" ref="formRef" :model="formData" :rules="formRules" v-loading="formLoading"
label-width="100px">
<el-collapse v-model="activeNames">
<!--客户基本信息面板-->
<el-collapse-item title="客户基本信息" name="1">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="客户名称" prop="userInfo.cusName">
<el-input v-model="formData.userInfo.cusName" placeholder="请输入客户名称"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="客户类型" prop="userInfo.typeCode">
<el-select v-model="formData.userInfo.typeCode" placeholder="请选择客户类型">
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CUS_TYPE)" :key="dict.value"
:label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item v-if="formData.userInfo.typeCode !== '03'" label="身份证号" prop="userInfo.idCard">
<el-input v-model="formData.userInfo.idCard" placeholder="请输入客户身份证号"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item v-if="formData.userInfo.typeCode !== '03'" label="性别" prop="userInfo.sex">
<el-radio-group v-model="formData.userInfo.sex">
<el-radio v-for="dict in sexDictDatas" :key="dict.value" :label="dict.value">
{{ dict.label }}
</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item v-if="formData.userInfo.typeCode !== '03'" label="生日" prop="userInfo.birthday">
<el-date-picker v-model="formData.userInfo.birthday" type="date" placeholder="选择日期">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="联系方式" prop="userInfo.phoneNumber">
<el-input v-model="formData.userInfo.phoneNumber" placeholder="请输入客户联系方式"/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2">
<el-col :span="12">
<el-form-item label="客户来源" prop="userInfo.dataFrom">
<el-select v-model="formData.userInfo.dataFrom" placeholder="请选择客户来源">
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CUS_DATA_FROM)" :key="dict.value"
:label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="注册方式" prop="userInfo.inviterType">
<el-select v-model="formData.userInfo.inviterType" placeholder="请选择注册方式">
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_SIGN_TYPE)" :key="dict.value"
:label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2">
<el-col :span="12">
<el-form-item label="选择会员" prop="userInfo.memberLevelId">
<el-select v-model="formData.userInfo.memberLevelId" placeholder="请选择会员">
<el-option v-for="(item,index) in levelList" :key="item.id"
:label="item.name" :value="item.id"/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="联系地址" prop="userInfo.address">
<el-input type="textarea" v-model="formData.userInfo.address" placeholder="请输入客户联系地址"/>
</el-form-item>
</el-col>
</el-row>
</el-collapse-item>
<el-collapse-item v-if="formData.userInfo.typeCode !== '03'" title="身份证件信息" name="2">
<el-row>
<el-col>
<el-form-item>
<ImageUpload v-model="formData.userInfo.idCardImage"/>
</el-form-item>
</el-col>
</el-row>
</el-collapse-item>
<el-collapse-item title="车辆基本信息" name="3">
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="车牌号" prop="carInfo.licenseNumber">
<el-input v-model="formData.carInfo.licenseNumber" placeholder="请输入车牌号"/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="发动机号码" prop="carInfo.engineNumber">
<el-input v-model="formData.carInfo.engineNumber" placeholder="请输入发动机号码"/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="车架号" prop="carInfo.vin">
<el-input v-model="formData.carInfo.vin" placeholder="请输入车架号"/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="品牌型号" prop="carInfo.brandAndModel">
<CarBrandSelector v-model="formData.carInfo.brandAndModel" ref="brandForm"/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="车辆类别" prop="carInfo.carCategory">
<el-select v-model="formData.carInfo.carCategory" placeholder="请选择车辆类别">
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CAR_CATEGORY)" :key="dict.value"
:label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="车辆性质" prop="carInfo.carNature">
<el-select v-model="formData.carInfo.carNature" placeholder="请选择车辆性质">
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CAR_NATURE)" :key="dict.value"
:label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="注册日期" prop="carInfo.carRegisterDate" label-width="auto">
<el-date-picker clearable v-model="formData.carInfo.carRegisterDate" type="date" value-format="timestamp"
placeholder="选择车辆注册日期"/>
</el-form-item>
</el-col>
</el-row>
</el-collapse-item>
<el-collapse-item title="车辆业务信息" name="4">
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="最近办理业务" prop="carInfo.recentlyHandledBusiness">
<el-select v-model="formData.carInfo.recentlyHandledBusiness" placeholder="请选择业务类别" clearable>
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CUS_BUSI_TYPE)" :key="dict.value"
:label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="最近业务时间" prop="carInfo.recentlyHandleBusinessTime">
<el-date-picker clearable v-model="formData.carInfo.recentlyHandleBusinessTime" type="date"
value-format="timestamp" placeholder="选择最近办理业务的时间"/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="二级维护时间" prop="carInfo.checkDate">
<el-date-picker clearable v-model="formData.carInfo.checkDate" type="date" value-format="timestamp"
placeholder="选择二级维护时间"/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="保养日期" prop="carInfo.maintenanceDate">
<el-date-picker clearable v-model="formData.carInfo.maintenanceDate" type="date" value-format="timestamp"
placeholder="选择保养日期"/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="年检日期" prop="carInfo.inspectionDate">
<el-date-picker clearable v-model="formData.carInfo.inspectionDate" type="date" value-format="timestamp"
placeholder="选择年检日期"/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="保险日期" prop="carInfo.insuranceDate">
<el-date-picker clearable v-model="formData.carInfo.insuranceDate" type="date" value-format="timestamp"
placeholder="选择保险日期"/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="保养里程" prop="carInfo.maintenanceMileage">
<el-input v-model="formData.carInfo.maintenanceMileage" placeholder="请输入保养里程"/>
</el-form-item>
</el-col>
<el-col :span="16">
<el-button :loading="buttonLoading" icon="el-icon-date" @click="compute" size="small" type="primary">计算</el-button>
</el-col>
</el-row>
</el-collapse-item>
<el-collapse-item title="测算" name="5">
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="保险到期时间" prop="carInfo.insuranceExpiryDate">
<el-date-picker clearable v-model="formData.carInfo.insuranceExpiryDate" type="date" value-format="timestamp"
placeholder="选择下次保险时间"/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="下次年检时间" prop="carInfo.nextInspectionDate">
<el-date-picker clearable v-model="formData.carInfo.nextInspectionDate" type="date" value-format="timestamp"
placeholder="选择下次年检时间"/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="下次保养时间" prop="carInfo.nextMaintenanceDate">
<el-date-picker clearable v-model="formData.carInfo.nextMaintenanceDate" type="date" value-format="timestamp"
placeholder="选择下次保养时间"/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="下次保养里程" prop="carInfo.nextMaintenanceMileage">
<el-input v-model="formData.carInfo.nextMaintenanceMileage" placeholder="请输入下次保养里程"/>
</el-form-item>
</el-col>
</el-row>
</el-collapse-item>
<el-collapse-item title="附件信息" name="6">
<el-form-item>
<ImageUpload v-model="formData.carInfo.carLicenseImg"/>
</el-form-item>
</el-collapse-item>
</el-collapse>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm" :disabled="formLoading"> </el-button>
<el-button @click="dialogVisible = false"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {DICT_TYPE, getDictDatas} from "@/utils/dict";
import CarBrandSelector from "@/layout/components/CarBrandSelector/index.vue";
export default {
name: "UserAndCarForm",
components: {CarBrandSelector},
data() {
return {
dialogVisible: false,
formData: {
userInfo: {
memberLevelId: undefined,
id: undefined,
userId: undefined,
typeCode: '01',
deptCode: undefined,
cusName: undefined,
phoneNumber: undefined,
birthday: undefined,
address: undefined,
sex: '1',
idCard: undefined,
idCardImage: undefined,
dataFrom: '08',
nearDoTime: undefined,
nearDoContent: undefined,
inviter: undefined,
inviterType: '01',
status: undefined,
itemList: [
{
systemCode: '',
serContent: '',
serTimeStart: '',
serTimeEnd: ''
}
],
},
carInfo: {
id: undefined,
engineNumber: undefined,
vin: undefined,
licenseNumber: undefined,
brandAndModel: [],
maintenanceDate: undefined,
maintenanceMileage: undefined,
inspectionDate: undefined,
insuranceDate: undefined,
checkDate: undefined,
carBrand: undefined,
carNature: undefined,
carRegisterDate: undefined,
carLicenseImg: undefined,
carCategory: undefined,
insuranceExpiryDate: undefined,
nextInspectionDate: undefined,
nextMaintenanceDate: undefined,
nextMaintenanceMileage: undefined,
}
},
formRules: {},
formLoading: false,
//
activeNames: ['1', '2', '3', '4', '5', '6'],
levelList: [],
//
sexDictDatas: getDictDatas(DICT_TYPE.DICT_SYS_USER_SEX),
cusBusiTypeDictDatas: getDictDatas(DICT_TYPE.DICT_CUS_BUSI_TYPE),
buttonLoading: false,
}
},
methods: {
async open(data) {
if (data?.userInfo?.id){
this.formData.userInfo = {
...this.formData.userInfo,
...data.userInfo
}
}
if (data?.carInfo?.id){
this.formData.carInfo = {
...this.formData.carInfo,
...data.carInfo
}
}
this.dialogVisible = true
},
compute(){
},
async submitForm(){
}
}
}
</script>
<style scoped lang="scss">
</style>