dianliang/lanan-system-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

车辆品牌型号优化;样式优化

Browse Source
This commit is contained in:
“hhk” 2024-08-08 10:56:01 +08:00
parent 37d52f37bf
commit 3c156cc146
7 changed files with 196 additions and 162 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/layout/components/CarBrandSelector/index.vue
View File

@ -4,7 +4,9 @@
placeholder="车辆品牌型号" placeholder="车辆品牌型号"
:options="options" :options="options"
v-model="selectedValues" v-model="selectedValues"
filterable/> filterable
:props="{checkStrictly:true}"
/>
</div> </div>
</template> </template>

181
src/views/base/carmain/CarMainForm.vue
View File

@ -3,69 +3,119 @@
<!-- 对话框(添加 / 修改) --> <!-- 对话框(添加 / 修改) -->
<el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="45%" v-dialogDrag append-to-body> <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="45%" v-dialogDrag append-to-body>
<el-form ref="formRef" :model="formData" :rules="formRules" v-loading="formLoading" label-width="100px"> <el-form ref="formRef" :model="formData" :rules="formRules" v-loading="formLoading" label-width="100px">
<el-form-item label="发动机号码" prop="engineNumber"> <el-row :gutter="1">
<el-input v-model="formData.engineNumber" placeholder="请输入发动机号码" /> <el-col :span="22">
</el-form-item> <el-form-item label="发动机号码" prop="engineNumber">
<el-form-item label="车架号" prop="vin"> <el-input v-model="formData.engineNumber" placeholder="请输入发动机号码" />
<el-input v-model="formData.vin" placeholder="请输入车架号" /> </el-form-item>
</el-form-item> </el-col>
<el-form-item label="车牌号" prop="licenseNumber"> </el-row>
<el-input v-model="formData.licenseNumber" placeholder="请输入车牌号" /> <el-row :gutter="1">
</el-form-item> <el-col :span="22">
<el-form-item label="品牌型号" prop="carModel"> <el-form-item label="车架号" prop="vin">
<CarBrandSelector v-model="formData.brandAndModel" ref="brandForm" /> <el-input v-model="formData.vin" placeholder="请输入车架号" />
</el-form-item> </el-form-item>
<el-form-item label="保养日期" prop="maintenanceDate"> </el-col>
<el-date-picker clearable v-model="formData.maintenanceDate" type="date" value-format="timestamp" </el-row>
placeholder="选择保养日期" /> <el-row :gutter="1">
</el-form-item> <el-col :span="22">
<el-form-item label="保养里程" prop="maintenanceMileage"> <el-form-item label="车牌号" prop="licenseNumber">
<el-input v-model="formData.maintenanceMileage" placeholder="请输入保养里程" /> <el-input v-model="formData.licenseNumber" placeholder="请输入车牌号" />
</el-form-item> </el-form-item>
<el-form-item label="年检日期" prop="inspectionDate"> </el-col>
<el-date-picker clearable v-model="formData.inspectionDate" type="date" value-format="timestamp" </el-row>
placeholder="选择年检日期" /> <el-row :gutter="1">
</el-form-item> <el-col :span="22">
<el-form-item label="保险日期" prop="insuranceDate"> <el-form-item label="品牌型号" prop="brandAndModel">
<el-date-picker clearable v-model="formData.insuranceDate" type="date" value-format="timestamp" <CarBrandSelector v-model="formData.brandAndModel" ref="brandForm" />
placeholder="选择保险日期" /> </el-form-item>
</el-form-item> </el-col>
<el-form-item label="二级维护时间" prop="checkDate"> </el-row>
<el-date-picker clearable v-model="formData.checkDate" type="date" value-format="timestamp" <el-row :gutter="2">
placeholder="选择二级维护时间" /> <el-col :span="11">
</el-form-item> <el-form-item label="保养日期" prop="maintenanceDate">
<!-- <el-form-item label="车辆品牌" prop="carBrand"> <el-date-picker clearable v-model="formData.maintenanceDate" type="date" value-format="timestamp"
<el-input v-model="formData.carBrand" placeholder="请输入车辆品牌" /> placeholder="选择保养日期" />
</el-form-item> --> </el-form-item>
<el-form-item label="车辆类别" prop="carCategory"> </el-col>
<el-select v-model="formData.carCategory" placeholder="请选择车辆类别"> <el-col :span="11">
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CAR_CATEGORY)" <el-form-item label="保养里程" prop="maintenanceMileage">
:key="dict.value" :label="dict.label" :value="dict.value"/> <el-input v-model="formData.maintenanceMileage" placeholder="请输入保养里程" />
</el-select> </el-form-item>
</el-form-item> </el-col>
<el-form-item label="车辆性质" prop="carNature"> </el-row>
<el-select v-model="formData.carNature" placeholder="请选择车辆性质"> <el-row :gutter="2">
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CAR_NATURE)" <el-col :span="11">
:key="dict.value" :label="dict.label" :value="dict.value"/> <el-form-item label="年检日期" prop="inspectionDate">
</el-select> <el-date-picker clearable v-model="formData.inspectionDate" type="date" value-format="timestamp"
</el-form-item> placeholder="选择年检日期" />
<el-form-item label="车辆注册日期" prop="carRegisterDate"> </el-form-item>
<el-date-picker clearable v-model="formData.carRegisterDate" type="date" value-format="timestamp" </el-col>
placeholder="选择车辆注册日期" /> <el-col :span="11">
</el-form-item> <el-form-item label="保险日期" prop="insuranceDate">
<el-form-item label="最近办理业务" prop="recentlyHandledBusiness"> <el-date-picker clearable v-model="formData.insuranceDate" type="date" value-format="timestamp"
<el-select v-model="formData.recentlyHandledBusiness" placeholder="请选择业务类别"> placeholder="选择保险日期" />
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CUS_BUSI_TYPE)" </el-form-item>
:key="dict.value" :label="dict.label" :value="dict.value"/> </el-col>
</el-select> </el-row>
</el-form-item>
<el-form-item label="最近办理业务的时间" prop="recentlyHandleBusinessTime"> <el-row :gutter="2">
<el-date-picker clearable v-model="formData.recentlyHandleBusinessTime" type="date" value-format="timestamp" <el-col :span="11">
placeholder="选择最近办理业务的时间" /> <el-form-item label="车辆注册日期" prop="carRegisterDate" label-width="auto">
</el-form-item> <el-date-picker clearable v-model="formData.carRegisterDate" type="date" value-format="timestamp"
<el-form-item label="行驶证图片"> placeholder="选择车辆注册日期" />
<ImageUpload v-model="formData.carLicenseImg" :limit="1"/> </el-form-item>
</el-form-item> </el-col>
<el-col :span="11">
<el-form-item label="二级维护时间" prop="checkDate">
<el-date-picker clearable v-model="formData.checkDate" type="date" value-format="timestamp"
placeholder="选择二级维护时间" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="2">
<el-col :span="11">
<el-form-item label="车辆类别" prop="carCategory">
<el-select v-model="formData.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="11">
<el-form-item label="车辆性质" prop="carNature">
<el-select v-model="formData.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="2">
<el-col :span="11">
<el-form-item label="最近办理业务" prop="recentlyHandledBusiness">
<el-select v-model="formData.recentlyHandledBusiness" placeholder="请选择业务类别">
<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="11">
<el-form-item label="最近业务时间" prop="recentlyHandleBusinessTime" >
<el-date-picker clearable v-model="formData.recentlyHandleBusinessTime" type="date"
value-format="timestamp" placeholder="选择最近办理业务的时间" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="1">
<el-col :span="22">
<el-form-item label="行驶证图片">
<ImageUpload v-model="formData.carLicenseImg" :limit="1" />
</el-form-item>
</el-col>
</el-row>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm" :disabled="formLoading">确 定</el-button> <el-button type="primary" @click="submitForm" :disabled="formLoading">确 定</el-button>
@ -79,7 +129,7 @@
<script> <script>
import * as CarMainApi from '@/api/base/carmain'; import * as CarMainApi from '@/api/base/carmain';
import ImageUpload from '@/components/ImageUpload'; import ImageUpload from '@/components/ImageUpload';
import {getDictDatas, DICT_TYPE} from '@/utils/dict'; import { getDictDatas, DICT_TYPE } from '@/utils/dict';
import CarBrandSelector from '@/layout/components/CarBrandSelector'; import CarBrandSelector from '@/layout/components/CarBrandSelector';
export default { export default {
name: "CarMainForm", name: "CarMainForm",
@ -90,7 +140,7 @@ export default {
}, },
data() { data() {
return { return {
tesst:[ "5d8eb726839bbe64a4f405e0cce29274", "7c8493517c4eaa0f0c56f40f0626e8d2" ], tesst: ["5d8eb726839bbe64a4f405e0cce29274", "7c8493517c4eaa0f0c56f40f0626e8d2"],
// 弹出层标题 // 弹出层标题
dialogTitle: "", dialogTitle: "",
// 是否显示弹出层 // 是否显示弹出层
@ -123,6 +173,7 @@ export default {
carBrand: [{ required: true, message: '车辆品牌不能为空', trigger: 'blur' }], carBrand: [{ required: true, message: '车辆品牌不能为空', trigger: 'blur' }],
carNature: [{ required: true, message: '车辆性质不能为空', trigger: 'blur' }], carNature: [{ required: true, message: '车辆性质不能为空', trigger: 'blur' }],
carRegisterDate: [{ required: true, message: '车辆注册日期不能为空', trigger: 'blur' }], carRegisterDate: [{ required: true, message: '车辆注册日期不能为空', trigger: 'blur' }],
brandAndModel: [{ required: true, message: '品牌型号不能为空', trigger: 'blur' }],
}, },
}; };
}, },

4
src/views/base/carmain/components/CarLabelForm.vue
View File

@ -18,14 +18,14 @@
车辆品牌 车辆品牌
</template> </template>
<!-- <dict-tag :type="DICT_TYPE.DICT_SYS_USER_SEX" :value="formData.sex" /> --> <!-- <dict-tag :type="DICT_TYPE.DICT_SYS_USER_SEX" :value="formData.sex" /> -->
{{ formData.carBrand }} {{formData.brandStr}}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template slot="label"> <template slot="label">
车辆型号 车辆型号
</template> </template>
<!-- <dict-tag :type="DICT_TYPE.DICT_SYS_USER_SEX" :value="formData.sex" /> --> <!-- <dict-tag :type="DICT_TYPE.DICT_SYS_USER_SEX" :value="formData.sex" /> -->
{{ formData.carModel }} {{formData.modelStr}}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template slot="label"> <template slot="label">

4
src/views/base/carmain/components/CustomerCarForm.vue
View File

@ -18,14 +18,14 @@
车辆品牌 车辆品牌
</template> </template>
<!-- <dict-tag :type="DICT_TYPE.DICT_SYS_USER_SEX" :value="formData.sex" /> --> <!-- <dict-tag :type="DICT_TYPE.DICT_SYS_USER_SEX" :value="formData.sex" /> -->
{{formData.carBrand}} {{formData.brandStr}}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template slot="label"> <template slot="label">
车辆型号 车辆型号
</template> </template>
<!-- <dict-tag :type="DICT_TYPE.DICT_SYS_USER_SEX" :value="formData.sex" /> --> <!-- <dict-tag :type="DICT_TYPE.DICT_SYS_USER_SEX" :value="formData.sex" /> -->
{{formData.carModel }} {{formData.modelStr}}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<template slot="label"> <template slot="label">

14
src/views/base/carmain/index.vue
View File

@ -11,13 +11,17 @@
<el-input v-model="queryParams.engineNumber" placeholder="请输入发动机号" clearable <el-input v-model="queryParams.engineNumber" placeholder="请输入发动机号" clearable
@keyup.enter.native="handleQuery" /> @keyup.enter.native="handleQuery" />
</el-form-item> </el-form-item>
<el-form-item label="品牌型号" prop="engineNumber" label-width="90">
<CarBrandSelector v-model="queryParams.brandAndModel" ref="brandForm" />
</el-form-item>
<!-- <el-form-item label="车架号" prop="vin"> <!-- <el-form-item label="车架号" prop="vin">
<el-input v-model="queryParams.vin" placeholder="请输入车架号" clearable @keyup.enter.native="handleQuery" /> <el-input v-model="queryParams.vin" placeholder="请输入车架号" clearable @keyup.enter.native="handleQuery" />
</el-form-item> --> </el-form-item> -->
<el-form-item label="车辆型号" prop="carModel" label-width="90"> <!-- <el-form-item label="车辆型号" prop="carModel" label-width="90">
<el-input v-model="queryParams.carModel" placeholder="请输入车辆型号" clearable @keyup.enter.native="handleQuery" /> <el-input v-model="queryParams.carModel" placeholder="请输入车辆型号" clearable @keyup.enter.native="handleQuery" />
</el-form-item> </el-form-item> -->
<!-- <el-form-item label="保养日期" prop="maintenanceDate"> <!-- <el-form-item label="保养日期" prop="maintenanceDate">
<el-date-picker v-model="queryParams.maintenanceDate" style="width: 240px" value-format="yyyy-MM-dd" <el-date-picker v-model="queryParams.maintenanceDate" style="width: 240px" value-format="yyyy-MM-dd"
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
@ -42,9 +46,9 @@
type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
:default-time="['00:00:00', '23:59:59']" /> :default-time="['00:00:00', '23:59:59']" />
</el-form-item> --> </el-form-item> -->
<el-form-item label="车辆品牌" prop="carBrand" label-width="90"> <!-- <el-form-item label="车辆品牌" prop="carBrand" label-width="90">
<el-input v-model="queryParams.carBrand" placeholder="请输入车辆品牌" clearable @keyup.enter.native="handleQuery" /> <el-input v-model="queryParams.carBrand" placeholder="请输入车辆品牌" clearable @keyup.enter.native="handleQuery" />
</el-form-item> </el-form-item> -->
<el-form-item label="车辆性质" prop="carNature" label-width="90"> <el-form-item label="车辆性质" prop="carNature" label-width="90">
<el-input v-model="queryParams.carNature" placeholder="请输入车辆性质" clearable @keyup.enter.native="handleQuery" /> <el-input v-model="queryParams.carNature" placeholder="请输入车辆性质" clearable @keyup.enter.native="handleQuery" />
</el-form-item> </el-form-item>
@ -197,6 +201,7 @@
</template> </template>
<script> <script>
import CarBrandSelector from '@/layout/components/CarBrandSelector';
import CustomerCarForm from '@/views/base/carmain/components/CustomerCarForm.vue'; import CustomerCarForm from '@/views/base/carmain/components/CustomerCarForm.vue';
import CarLabelForm from '@/views/base/carmain/components/CarLabelForm.vue'; import CarLabelForm from '@/views/base/carmain/components/CarLabelForm.vue';
import * as CarMainApi from '@/api/base/carmain'; import * as CarMainApi from '@/api/base/carmain';
@ -208,6 +213,7 @@ export default {
CarMainForm, CarMainForm,
CustomerCarForm, CustomerCarForm,
CarLabelForm, CarLabelForm,
CarBrandSelector,
}, },
data() { data() {
return { return {

137
src/views/base/customer/CustomerMainForm.vue
View File

@ -3,33 +3,33 @@
<!-- 对话框(添加 / 修改) --> <!-- 对话框(添加 / 修改) -->
<el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="60%" v-dialogDrag append-to-body> <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="60%" v-dialogDrag append-to-body>
<el-form size="small" ref="formRef" :model="formData" :rules="formRules" v-loading="formLoading" <el-form size="small" ref="formRef" :model="formData" :rules="formRules" v-loading="formLoading"
label-width="100px"> label-width="100px">
<el-collapse v-model="activeNames" > <el-collapse v-model="activeNames">
<!--客户基本信息面板--> <!--客户基本信息面板-->
<el-collapse-item title="客户基本信息" name="1"> <el-collapse-item title="客户基本信息" name="1">
<el-row :gutter="2"> <el-row :gutter="2">
<el-col :span="11"> <el-col :span="11">
<el-form-item label="客户名称" prop="cusName"> <el-form-item label="客户名称" prop="cusName">
<el-input v-model="formData.cusName" placeholder="请输入客户名称"/> <el-input v-model="formData.cusName" placeholder="请输入客户名称" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="11">
<el-form-item label="客户类型" prop="typeCode"> <el-form-item label="客户类型" prop="typeCode">
<el-select v-model="formData.typeCode" placeholder="请选择客户类型"> <el-select v-model="formData.typeCode" placeholder="请选择客户类型">
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CUS_TYPE)" <el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CUS_TYPE)" :key="dict.value"
:key="dict.value" :label="dict.label" :value="dict.value"/> :label="dict.label" :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="2"> <el-row :gutter="2">
<el-col :span="11"> <el-col :span="11">
<el-form-item v-if="formData.typeCode !=='03'" label="身份证号" prop="idCard"> <el-form-item v-if="formData.typeCode !== '03'" label="身份证号" prop="idCard">
<el-input v-model="formData.idCard" placeholder="请输入客户身份证号"/> <el-input v-model="formData.idCard" placeholder="请输入客户身份证号" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="11">
<el-form-item v-if="formData.typeCode !=='03'" label="性别" prop="sex"> <el-form-item v-if="formData.typeCode !== '03'" label="性别" prop="sex">
<el-radio-group v-model="formData.sex"> <el-radio-group v-model="formData.sex">
<el-radio v-for="dict in sexDictDatas" :key="dict.value" :label="dict.value"> <el-radio v-for="dict in sexDictDatas" :key="dict.value" :label="dict.value">
{{ dict.label }} {{ dict.label }}
@ -40,17 +40,14 @@
</el-row> </el-row>
<el-row :gutter="2"> <el-row :gutter="2">
<el-col :span="11"> <el-col :span="11">
<el-form-item v-if="formData.typeCode !=='03'" label="生日" prop="birthday"> <el-form-item v-if="formData.typeCode !== '03'" label="生日" prop="birthday">
<el-date-picker <el-date-picker v-model="formData.birthday" type="date" placeholder="选择日期">
v-model="formData.birthday"
type="date"
placeholder="选择日期">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="11">
<el-form-item label="联系方式" prop="phoneNumber"> <el-form-item label="联系方式" prop="phoneNumber">
<el-input v-model="formData.phoneNumber" placeholder="请输入客户联系方式"/> <el-input v-model="formData.phoneNumber" placeholder="请输入客户联系方式" />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
@ -58,16 +55,16 @@
<el-col :span="11"> <el-col :span="11">
<el-form-item label="客户来源" prop="dataFrom"> <el-form-item label="客户来源" prop="dataFrom">
<el-select v-model="formData.dataFrom" placeholder="请选择客户来源"> <el-select v-model="formData.dataFrom" placeholder="请选择客户来源">
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CUS_DATA_FROM)" <el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_CUS_DATA_FROM)" :key="dict.value"
:key="dict.value" :label="dict.label" :value="dict.value"/> :label="dict.label" :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="11">
<el-form-item label="注册方式" prop="inviterType"> <el-form-item label="注册方式" prop="inviterType">
<el-select v-model="formData.inviterType" placeholder="请选择注册方式"> <el-select v-model="formData.inviterType" placeholder="请选择注册方式">
<el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_SIGN_TYPE)" <el-option v-for="dict in this.getDictDatas(DICT_TYPE.DICT_SIGN_TYPE)" :key="dict.value"
:key="dict.value" :label="dict.label" :value="dict.value"/> :label="dict.label" :value="dict.value" />
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
@ -75,83 +72,61 @@
<el-row> <el-row>
<el-col :span="22"> <el-col :span="22">
<el-form-item label="联系地址" prop="address"> <el-form-item label="联系地址" prop="address">
<el-input type="textarea" v-model="formData.address" placeholder="请输入客户联系地址"/> <el-input type="textarea" v-model="formData.address" placeholder="请输入客户联系地址" />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
</el-collapse-item> </el-collapse-item>
<!--服务内容折叠面板面板--> <!--服务内容折叠面板面板-->
<el-collapse-item v-if="formData.typeCode=='03'" title="服务内容" name="2"> <el-collapse-item v-if="formData.typeCode == '03'" title="服务内容" name="2">
<el-table <el-table :data="formData.itemList" border size="small" style="width: 100%">
:data="formData.itemList" <el-table-column prop="serContent" align="left" width="180">
border
size="small"
style="width: 100%">
<el-table-column
prop="serContent"
align="left"
width="180">
<template slot="header"> <template slot="header">
<i style="color: #409EFF;cursor:pointer" class="el-icon-circle-plus-outline" @click="addItem"/> <i style="color: #409EFF;cursor:pointer" class="el-icon-circle-plus-outline" @click="addItem" />
服务内容 服务内容
</template> </template>
<template v-slot="scope"> <template v-slot="scope">
<el-select @change="serviceChange(scope.row)" v-model="scope.row.systemCode" placeholder="请选择服务内容"> <el-select @change="serviceChange(scope.row)" v-model="scope.row.systemCode" placeholder="请选择服务内容">
<el-option v-for="dict in serviceList" <el-option v-for="dict in serviceList" :key="dict.id" :label="dict.name" :value="dict.id" />
:key="dict.id" :label="dict.name" :value="dict.id"/>
</el-select> </el-select>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="serTimeStart" align="center" label="开始日期">
prop="serTimeStart"
align="center"
label="开始日期">
<template v-slot="scope"> <template v-slot="scope">
<el-date-picker <el-date-picker v-model="scope.row.serTimeStart" type="date" placeholder="选择服务开始日期">
v-model="scope.row.serTimeStart"
type="date"
placeholder="选择服务开始日期">
</el-date-picker> </el-date-picker>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="serTimeEnd" align="center" label="结束日期">
prop="serTimeEnd"
align="center"
label="结束日期">
<template v-slot="scope"> <template v-slot="scope">
<el-date-picker <el-date-picker v-model="scope.row.serTimeEnd" type="date" placeholder="选择服务结束日期">
v-model="scope.row.serTimeEnd"
type="date"
placeholder="选择服务结束日期">
</el-date-picker> </el-date-picker>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column align="center" width="100" label="操作">
align="center"
width="100"
label="操作">
<template v-slot="scope"> <template v-slot="scope">
<el-button v-if="formData.itemList.length>1" size="mini" type="text" icon="el-icon-delete" @click="deleteItem(scope.$index, formData.itemList)">删除</el-button> <el-button v-if="formData.itemList.length > 1" size="mini" type="text" icon="el-icon-delete"
@click="deleteItem(scope.$index, formData.itemList)">删除</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
</el-collapse-item> </el-collapse-item>
<!--附件--> <!--附件-->
<el-collapse-item v-if="formData.typeCode !=='03'" title="身份证件信息" name="3"> <el-collapse-item v-if="formData.typeCode !== '03'" title="身份证件信息" name="3">
<el-row> <el-row>
<el-col> <el-col>
<el-form-item> <el-form-item>
<ImageUpload v-model="formData.idCardImage"/> <ImageUpload v-model="formData.idCardImage" />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
</el-collapse-item> </el-collapse-item>
<el-collapse-item v-if="formData.typeCode =='03'" title="政企客户资料" name="3"> <el-collapse-item v-if="formData.typeCode == '03'" title="政企客户资料" name="3">
<el-row> <el-row>
<el-col> <el-col>
<el-form-item> <el-form-item>
<FileUpload v-model="formData.idCardImage"/> <FileUpload v-model="formData.idCardImage" />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
@ -170,11 +145,11 @@
<script> <script>
import * as CustomerMainApi from '@/api/base/customer'; import * as CustomerMainApi from '@/api/base/customer';
import { getServicePackageList} from "@/api/system/servicePackage"; import { getServicePackageList } from "@/api/system/servicePackage";
import ImageUpload from '@/components/ImageUpload'; import ImageUpload from '@/components/ImageUpload';
import FileUpload from '@/components/FileUpload'; import FileUpload from '@/components/FileUpload';
import Editor from '@/components/Editor'; import Editor from '@/components/Editor';
import {getDictDatas, DICT_TYPE} from '@/utils/dict' import { getDictDatas, DICT_TYPE } from '@/utils/dict'
export default { export default {
name: "CustomerMainForm", name: "CustomerMainForm",
@ -192,13 +167,13 @@ export default {
// 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用 // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
formLoading: false, formLoading: false,
//折叠面板默认展开 //折叠面板默认展开
activeNames: ['1','2','3'], activeNames: ['1', '2', '3'],
//类型 //类型
typeCode:"", typeCode: "",
//企业 //企业
deptCode:undefined, deptCode: undefined,
//服务套餐列表 //服务套餐列表
serviceList:[], serviceList: [],
// 表单参数 // 表单参数
formData: { formData: {
id: undefined, id: undefined,
@ -218,12 +193,12 @@ export default {
inviter: undefined, inviter: undefined,
inviterType: '01', inviterType: '01',
status: undefined, status: undefined,
itemList:[ itemList: [
{ {
systemCode:'', systemCode: '',
serContent:'', serContent: '',
serTimeStart:'', serTimeStart: '',
serTimeEnd:'' serTimeEnd: ''
} }
], ],
}, },
@ -252,15 +227,15 @@ export default {
}, },
methods: { methods: {
/**获取服务套餐精简信息*/ /**获取服务套餐精简信息*/
getServiceList(){ getServiceList() {
getServicePackageList().then(response => { getServicePackageList().then(response => {
this.serviceList = response.data; this.serviceList = response.data;
}); });
}, },
/**绑定事件*/ /**绑定事件*/
serviceChange(row){ serviceChange(row) {
this.serviceList.map(item => { this.serviceList.map(item => {
if (item.id == row.systemCode){ if (item.id == row.systemCode) {
row.serContent = item.name row.serContent = item.name
return return
} }
@ -269,11 +244,11 @@ export default {
/** /**
* 新增服务内容 * 新增服务内容
*/ */
addItem(){ addItem() {
const item = { const item = {
serContent:'', serContent: '',
serTimeStart:'', serTimeStart: '',
serTimeEnd:'' serTimeEnd: ''
} }
this.formData.itemList.push(item) this.formData.itemList.push(item)
}, },
@ -285,7 +260,7 @@ export default {
}, },
/** 打开弹窗 */ /** 打开弹窗 */
async open(id,typeCode) { async open(id, typeCode) {
this.dialogVisible = true; this.dialogVisible = true;
this.typeCode = typeCode this.typeCode = typeCode
this.reset(); this.reset();
@ -322,7 +297,7 @@ export default {
try { try {
const data = this.formData; const data = this.formData;
//如果客户类型不是政企客户，没有扩展表信息 //如果客户类型不是政企客户，没有扩展表信息
if(data.typeCode !== '03'){ if (data.typeCode !== '03') {
data.itemList = [] data.itemList = []
} }
// 修改的提交 // 修改的提交
@ -362,11 +337,11 @@ export default {
inviter: undefined, inviter: undefined,
inviterType: '01', inviterType: '01',
status: undefined, status: undefined,
itemList:[ itemList: [
{ {
serContent:'', serContent: '',
serTimeStart:'', serTimeStart: '',
serTimeEnd:'' serTimeEnd: ''
} }
], ],
}; };

14
src/views/base/customer/index.vue
View File

@ -1,14 +1,14 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-tabs v-model="activeName" @tab-click="handleClick"> <el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="私人客户" name="01"> <el-tab-pane label="私人客户" name="01">
<PrivateCustomer :typeCode="activeName" ref="privateRef"/> <PrivateCustomer :typeCode="activeName" ref="privateRef" />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="待办客户" name="02"> <el-tab-pane label="待办客户" name="02">
<TodoCustomer :typeCode="activeName" ref="todoRef"/> <TodoCustomer :typeCode="activeName" ref="todoRef" />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="政企客户" name="03"> <el-tab-pane label="政企客户" name="03">
<CorpCustomer :typeCode="activeName" ref="corpRef"/> <CorpCustomer :typeCode="activeName" ref="corpRef" />
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
@ -22,11 +22,11 @@ import CorpCustomer from '@/views/base/customer/components/CorpCustomer.vue'
export default { export default {
name: "CustomerMain", name: "CustomerMain",
components: { components: {
PrivateCustomer,TodoCustomer,CorpCustomer PrivateCustomer, TodoCustomer, CorpCustomer
}, },
data() { data() {
return { return {
activeName:'01', activeName: '01',
}; };
}, },
created() { created() {
@ -35,7 +35,7 @@ export default {
methods: { methods: {
/** tab点击方法 */ /** tab点击方法 */
handleClick(tab, event){ handleClick(tab, event) {
} }