Commit 15a91fbd authored by rencs's avatar rencs

Merge branch 'dev-td' into 'master-td'

Dev td

See merge request !3
parents dc9fcd31 c2b3fd70
<template> <template>
<el-dialog :title="title" :visible.sync="oneDialogVisible" @close="closePop" :modal="false" width="66%" class="flex-aic vehicle-dialog"> <el-dialog
<el-form ref="form" :model="form" :rules="rules" label-width="140px" style="margin-top: -30px;max-height: 486px;overflow: auto;"> :title="title"
<p style="padding: 10px;background: #f5f5f5;">基础信息</p> :visible.sync="oneDialogVisible"
@close="closePop"
:modal="false"
width="66%"
class="flex-aic vehicle-dialog"
>
<el-form
ref="form"
:model="form"
:rules="rules"
label-width="140px"
style="margin-top: -30px; max-height: 486px; overflow: auto"
>
<p style="padding: 10px; background: #f5f5f5">基础信息</p>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="用途" prop="useType"> <el-form-item label="用途" prop="useType">
...@@ -13,12 +26,19 @@ ...@@ -13,12 +26,19 @@
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="车牌号码" prop="numberPlate"> <el-form-item label="车牌号码" prop="numberPlate">
<el-input v-model="form.numberPlate" placeholder="输入车牌"></el-input> <el-input
v-model="form.numberPlate"
placeholder="输入车牌"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="车辆编码" prop="code"> <el-form-item label="车辆编码" prop="code">
<el-input v-model="form.code" placeholder="请输入车辆编码" type="number"></el-input> <el-input
v-model="form.code"
placeholder="请输入车辆编码"
type="number"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
...@@ -29,10 +49,10 @@ ...@@ -29,10 +49,10 @@
class="filter-item" class="filter-item"
v-model="form.status" v-model="form.status"
placeholder="请选择车辆状态" placeholder="请选择车辆状态"
style="width:100%" style="width: 100%"
> >
<el-option <el-option
v-for="(val,index) in getAllVehicleStatus() " v-for="(val, index) in getAllVehicleStatus()"
:key="index" :key="index"
:label="val.val" :label="val.val"
:value="val.code" :value="val.code"
...@@ -42,16 +62,25 @@ ...@@ -42,16 +62,25 @@
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="公里数" prop="mileageLastUpdate"> <el-form-item label="公里数" prop="mileageLastUpdate">
<el-input type="number" v-model="form.mileageLastUpdate" placeholder="请输入公里数"></el-input> <el-input
type="number"
v-model="form.mileageLastUpdate"
placeholder="请输入公里数"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="停靠门店" prop="parkBranchCompanyId"> <el-form-item label="停靠门店" prop="parkBranchCompanyId">
<el-select class="filter-item" v-model="form.parkBranchCompanyId" placeholder="请选择停靠门店" filterable> <el-select
class="filter-item"
v-model="form.parkBranchCompanyId"
placeholder="请选择停靠门店"
filterable
>
<el-option <el-option
v-for="(val,index) in allVehicleBranchCompany" v-for="(val, index) in allVehicleBranchCompany"
:key="index" :key="index"
:label="val.name" :label="val.name"
:value="val.id" :value="val.id"
...@@ -62,7 +91,7 @@ ...@@ -62,7 +91,7 @@
<el-col :span="12"> <el-col :span="12">
<el-form-item label="新旧程度" prop="vehicleStatus"> <el-form-item label="新旧程度" prop="vehicleStatus">
<el-select <el-select
style="width: 100%;" style="width: 100%"
class="filter-item" class="filter-item"
v-model="form.vehicleStatus" v-model="form.vehicleStatus"
placeholder="请选择新旧程度" placeholder="请选择新旧程度"
...@@ -82,7 +111,7 @@ ...@@ -82,7 +111,7 @@
class="filter-item" class="filter-item"
v-model="form.vehicleBodyStatus" v-model="form.vehicleBodyStatus"
placeholder="请选择车身状况" placeholder="请选择车身状况"
style="width:100%" style="width: 100%"
> >
<el-option key="1" label="无剐蹭" :value="1"></el-option> <el-option key="1" label="无剐蹭" :value="1"></el-option>
<el-option key="2" label="微瑕疵" :value="2"></el-option> <el-option key="2" label="微瑕疵" :value="2"></el-option>
...@@ -96,7 +125,7 @@ ...@@ -96,7 +125,7 @@
class="filter-item" class="filter-item"
v-model="form.vehicleInnerStatus" v-model="form.vehicleInnerStatus"
placeholder="请选择内饰" placeholder="请选择内饰"
style="width:100%" style="width: 100%"
> >
<el-option key="1" label="全新" :value="1"></el-option> <el-option key="1" label="全新" :value="1"></el-option>
<el-option key="2" label="9成新" :value="2"></el-option> <el-option key="2" label="9成新" :value="2"></el-option>
...@@ -107,15 +136,25 @@ ...@@ -107,15 +136,25 @@
</el-col> </el-col>
</el-row> </el-row>
<el-form-item label="备注"> <el-form-item label="备注">
<el-input type="textarea" :rows="5" v-model="form.remark" placeholder="请输入备注信息"></el-input> <el-input
type="textarea"
:rows="5"
v-model="form.remark"
placeholder="请输入备注信息"
></el-input>
</el-form-item> </el-form-item>
<p style="padding: 10px;background: #f5f5f5;">车辆归属</p> <p style="padding: 10px; background: #f5f5f5">车辆归属</p>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="所属门店" prop="subordinateBranch"> <el-form-item label="所属门店" prop="subordinateBranch">
<el-select class="filter-item" v-model="form.subordinateBranch" placeholder="请选择所属门店" filterable> <el-select
class="filter-item"
v-model="form.subordinateBranch"
placeholder="请选择所属门店"
filterable
>
<el-option <el-option
v-for="(val,index) in allVehicleBranchCompany" v-for="(val, index) in allVehicleBranchCompany"
:key="index" :key="index"
:label="val.name" :label="val.name"
:value="val.id" :value="val.id"
...@@ -125,18 +164,30 @@ ...@@ -125,18 +164,30 @@
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="托管人"> <el-form-item label="托管人">
<el-input v-model="form.belongToName" placeholder="请输入托管人" ></el-input> <el-input
v-model="form.belongToName"
placeholder="请输入托管人"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<p style="padding: 10px;background: #f5f5f5;">品牌、车型</p> <p style="padding: 10px; background: #f5f5f5">品牌、车型</p>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="车辆品牌" prop="brand"> <el-form-item label="车辆品牌" prop="brand">
<el-select class="filter-item" v-model="form.brand" placeholder="请选择车辆品牌" style="width:100%"> <el-select
<el-option :key="getUnkownBrandCode" label="未知" :value="getUnkownBrandCode"></el-option> class="filter-item"
v-model="form.brand"
placeholder="请选择车辆品牌"
style="width: 100%"
>
<el-option
:key="getUnkownBrandCode"
label="未知"
:value="getUnkownBrandCode"
></el-option>
<el-option <el-option
v-for="item in getAllBranch() " v-for="item in getAllBranch()"
:key="item.code" :key="item.code"
:label="item.val" :label="item.val"
:value="item.code" :value="item.code"
...@@ -146,9 +197,14 @@ ...@@ -146,9 +197,14 @@
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="车型" prop="modelId"> <el-form-item label="车型" prop="modelId">
<el-select class="filter-item" v-model="form.modelId" placeholder="请选择车型" filterable> <el-select
class="filter-item"
v-model="form.modelId"
placeholder="请选择车型"
filterable
>
<el-option <el-option
v-for="(val,index) in allVehicleList" v-for="(val, index) in allVehicleList"
:key="index" :key="index"
:label="val.name" :label="val.name"
:value="val.id" :value="val.id"
...@@ -160,9 +216,14 @@ ...@@ -160,9 +216,14 @@
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="生产商"> <el-form-item label="生产商">
<el-select class="filter-item" v-model="form.manufacturer" placeholder="请选择生产商" filterable> <el-select
class="filter-item"
v-model="form.manufacturer"
placeholder="请选择生产商"
filterable
>
<el-option <el-option
v-for="(val,index) in allManufacturer" v-for="(val, index) in allManufacturer"
:key="index" :key="index"
:label="val" :label="val"
:value="val" :value="val"
...@@ -171,23 +232,32 @@ ...@@ -171,23 +232,32 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<p style="padding: 10px;background: #f5f5f5;">车辆信息</p> <p style="padding: 10px; background: #f5f5f5">车辆信息</p>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="车架号"> <el-form-item label="车架号">
<el-input v-model="form.vin" placeholder="请输入车架号" ></el-input> <el-input v-model="form.vin" placeholder="请输入车架号"></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="发动机号"> <el-form-item label="发动机号">
<el-input v-model="form.engineNum" placeholder="请输入发动机号" ></el-input> <el-input
v-model="form.engineNum"
placeholder="请输入发动机号"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="上牌日期"> <el-form-item label="上牌日期">
<el-date-picker v-model="form.vehicleRegisterDate" type = "datetime" placeholder = "上牌日期" value-format="yyyy-MM-dd hh:mm:ss" format="yyyy-MM-dd hh:mm:ss"></el-date-picker> <el-date-picker
v-model="form.vehicleRegisterDate"
type="datetime"
placeholder="上牌日期"
value-format="yyyy-MM-dd hh:mm:ss"
format="yyyy-MM-dd hh:mm:ss"
></el-date-picker>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
...@@ -195,13 +265,15 @@ ...@@ -195,13 +265,15 @@
<el-date-picker <el-date-picker
v-model="form.annualVerificationDate" v-model="form.annualVerificationDate"
type="date" type="date"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd hh:mm:ss"
placeholder="选择日期" placeholder="选择日期"
style="width:100%" style="width: 100%"
></el-date-picker> ></el-date-picker>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-form-item label="行驶证" :style="{display:'block'}"> <el-form-item label="行驶证" :style="{ display: 'block' }">
<el-upload <el-upload
class="avatar-uploader" class="avatar-uploader"
:action="BASE_API + '/api/universal/file/app/unauth/admin/upload'" :action="BASE_API + '/api/universal/file/app/unauth/admin/upload'"
...@@ -209,19 +281,22 @@ ...@@ -209,19 +281,22 @@
:headers="getHeaderWithToken" :headers="getHeaderWithToken"
:on-success="handleAvatarSuccess" :on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload" :before-upload="beforeAvatarUpload"
:style="{display:'inline-block'}" :style="{ display: 'inline-block' }"
> >
<img <img
v-if="$utils.isString(form.drivingLicensePath) && !$utils.isEmpty(form.drivingLicensePath)" v-if="
$utils.isString(form.drivingLicensePath) &&
!$utils.isEmpty(form.drivingLicensePath)
"
:src="getDrivingLicenseUrl(form.drivingLicensePath)" :src="getDrivingLicenseUrl(form.drivingLicensePath)"
class="avatar" class="avatar"
:style="{display:'block'}" :style="{ display: 'block' }"
/> />
<i <i
v-else v-else
class="el-icon-plus avatar-uploader-icon" class="el-icon-plus avatar-uploader-icon"
:style="{lineHeight:'350px'}" :style="{ lineHeight: '350px' }"
style="position: relative;" style="position: relative"
> >
<br /> <br />
<span class="driving-title">行驶证正面</span> <span class="driving-title">行驶证正面</span>
...@@ -235,26 +310,29 @@ ...@@ -235,26 +310,29 @@
:headers="getHeaderWithToken" :headers="getHeaderWithToken"
:on-success="handleAvatarSuccessF" :on-success="handleAvatarSuccessF"
:before-upload="beforeAvatarUpload" :before-upload="beforeAvatarUpload"
:style="{display:'inline-block'}" :style="{ display: 'inline-block' }"
> >
<img <img
v-if="$utils.isString(form.drivingLicenseDuplicatePath) && !$utils.isEmpty(form.drivingLicenseDuplicatePath)" v-if="
$utils.isString(form.drivingLicenseDuplicatePath) &&
!$utils.isEmpty(form.drivingLicenseDuplicatePath)
"
:src="getDrivingLicenseUrl(form.drivingLicenseDuplicatePath)" :src="getDrivingLicenseUrl(form.drivingLicenseDuplicatePath)"
class="avatar" class="avatar"
:style="{display:'block'}" :style="{ display: 'block' }"
/> />
<i <i
v-else v-else
class="el-icon-plus avatar-uploader-icon" class="el-icon-plus avatar-uploader-icon"
:style="{lineHeight:'350px'}" :style="{ lineHeight: '350px' }"
style="position: relative;" style="position: relative"
> >
<br /> <br />
<span class="driving-title">行驶证副本</span> <span class="driving-title">行驶证副本</span>
</i> </i>
</el-upload> </el-upload>
</el-form-item> </el-form-item>
<p style="padding: 10px;background: #f5f5f5;">保险信息</p> <p style="padding: 10px; background: #f5f5f5">保险信息</p>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="商业险公司"> <el-form-item label="商业险公司">
...@@ -262,11 +340,15 @@ ...@@ -262,11 +340,15 @@
class="filter-item" class="filter-item"
v-model="form.insuranceCompany" v-model="form.insuranceCompany"
placeholder="请选择商业险公司" placeholder="请选择商业险公司"
style="width:100%" style="width: 100%"
> >
<el-option :key="undefined" label="无" :value="undefined"></el-option>
<el-option <el-option
v-for="(val, index) in getAllInsuranceCompany() " :key="undefined"
label="无"
:value="undefined"
></el-option>
<el-option
v-for="(val, index) in getAllInsuranceCompany()"
:key="index" :key="index"
:label="val.val" :label="val.val"
:value="val.code" :value="val.code"
...@@ -277,7 +359,10 @@ ...@@ -277,7 +359,10 @@
<el-col :span="12"> <el-col :span="12">
<el-form-item label="商业险单号"> <el-form-item label="商业险单号">
<el-input v-model="form.insuranceNo" placeholder="请输入商业险单号"></el-input> <el-input
v-model="form.insuranceNo"
placeholder="请输入商业险单号"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
...@@ -290,7 +375,7 @@ ...@@ -290,7 +375,7 @@
:editable="true" :editable="true"
format="yyyy-MM-dd" format="yyyy-MM-dd"
placeholder="请选择商业险到期时间" placeholder="请选择商业险到期时间"
style="width:100%" style="width: 100%"
></el-date-picker> ></el-date-picker>
</el-form-item> </el-form-item>
</el-col> </el-col>
...@@ -301,11 +386,15 @@ ...@@ -301,11 +386,15 @@
class="filter-item" class="filter-item"
v-model="form.strongInsuranceCompany" v-model="form.strongInsuranceCompany"
placeholder="请选择交强险公司" placeholder="请选择交强险公司"
style="width:100%" style="width: 100%"
> >
<el-option :key="undefined" label="无" :value="undefined"></el-option>
<el-option <el-option
v-for="(val, index) in getAllInsuranceCompany() " :key="undefined"
label="无"
:value="undefined"
></el-option>
<el-option
v-for="(val, index) in getAllInsuranceCompany()"
:key="index" :key="index"
:label="val.val" :label="val.val"
:value="val.code" :value="val.code"
...@@ -317,7 +406,10 @@ ...@@ -317,7 +406,10 @@
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="交强险单号"> <el-form-item label="交强险单号">
<el-input v-model.text="form.strongInsuranceNo" placeholder="请输入交强险单号"></el-input> <el-input
v-model.text="form.strongInsuranceNo"
placeholder="请输入交强险单号"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
...@@ -328,532 +420,544 @@ ...@@ -328,532 +420,544 @@
:editable="true" :editable="true"
format="yyyy-MM-dd" format="yyyy-MM-dd"
placeholder="请选择交强险到期时间" placeholder="请选择交强险到期时间"
style="width:100%" style="width: 100%"
></el-date-picker> ></el-date-picker>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col> <el-col>
<el-form-item label="保单pdf" :style="{display:'block'}"> <el-form-item label="保单pdf" :style="{ display: 'block' }">
<el-upload <el-upload
ref="uploadPdf" ref="uploadPdf"
:action="BASE_API + '/api/universal/file/app/unauth/admin/upload'" :action="BASE_API + '/api/universal/file/app/unauth/admin/upload'"
:show-file-list="false" :show-file-list="false"
:headers="getHeaderWithToken" :headers="getHeaderWithToken"
:on-success="handleAvatarSuccessPDF" :on-success="handleAvatarSuccessPDF"
:style="{display:'inline-block'}" :style="{ display: 'inline-block' }"
accept=".pdf" accept=".pdf"
> >
<el-button size="small" plain>选择文件</el-button> <el-button size="small" plain>选择文件</el-button>
</el-upload> </el-upload>
<div v-for="(item, i) in pdfList" :key = i @click="downloadPDF(i)"> <div v-for="(item, i) in pdfList" :key="i" @click="downloadPDF(i)">
<span>{{item.name}}</span> <span>{{ item.name }}</span>
</div> </div>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
</el-form> </el-form>
<div slot="footer" class="flex-aic-jcc" style="margin-top: 10px;"> <div slot="footer" class="flex-aic-jcc" style="margin-top: 10px">
<el-button plain @click="closePop">取消</el-button> <el-button plain @click="closePop">取消</el-button>
<el-button type="primary" v-if="!isClick" class="handle-ok" @click="handleOk('form')">确定</el-button> <el-button
<el-button type="primary" v-if="isClick" class="handle-ok" style="opacity: 0.4;" :disabled="true">确定</el-button> type="primary"
v-if="!isClick"
class="handle-ok"
@click="handleOk('form')"
>确定</el-button
>
<el-button
type="primary"
v-if="isClick"
class="handle-ok"
style="opacity: 0.4"
:disabled="true"
>确定</el-button
>
</div> </div>
</el-dialog> </el-dialog>
</template> </template>
<style lang="scss"> <style lang="scss">
.vehicle-dialog .el-dialog{ .vehicle-dialog .el-dialog {
margin-top: 0 !important; margin-top: 0 !important;
} }
</style> </style>
<script type="javascript"> <script type="javascript">
import {mapGetters} from 'vuex'; import { mapGetters } from "vuex";
import ElFormItem from '../../../../node_modules/element-ui/packages/form/src/form-item.vue' import ElFormItem from "../../../../node_modules/element-ui/packages/form/src/form-item.vue";
import ElRow from 'element-ui/packages/row/src/row' import ElRow from "element-ui/packages/row/src/row";
import ElCol from 'element-ui/packages/col/src/col' import ElCol from "element-ui/packages/col/src/col";
import ElRadio from "../../../../node_modules/element-ui/packages/radio/src/radio.vue"; import ElRadio from "../../../../node_modules/element-ui/packages/radio/src/radio.vue";
import ElButton from "../../../../node_modules/element-ui/packages/button/src/button.vue"; import ElButton from "../../../../node_modules/element-ui/packages/button/src/button.vue";
import {addObj, getObj, putObj, vehicleBranchCompanyAll, allManufacturer} from "../../../api/vehicle/vehicleInfo"; import {
import { getToken } from 'utils/auth' addObj,
import { getObj,
VEHICLE_CONSTANT_VEHICLE_BRAND, putObj,
VEHICLE_CONSTANT_BRAND_CODE_UNKOWN, vehicleBranchCompanyAll,
} from '../../../store/modules/baseInfo' allManufacturer,
import { } from "../../../api/vehicle/vehicleInfo";
getConstantListByType, import { getToken } from "utils/auth";
getAllInsuranceCompany, import {
getInsuranceCompany VEHICLE_CONSTANT_VEHICLE_BRAND,
} from 'api/base_info/constant/' VEHICLE_CONSTANT_BRAND_CODE_UNKOWN,
import {getAllVehicleList} from "../../../api/vehicleType"; } from "../../../store/modules/baseInfo";
import {objDeepCopy} from "../../../utils"; import {
export default { getConstantListByType,
props: ['title', 'oneRow'], getAllInsuranceCompany,
components: { getInsuranceCompany,
ElButton, } from "api/base_info/constant/";
ElRadio, import { getAllVehicleList } from "../../../api/vehicleType";
ElFormItem, import { objDeepCopy } from "../../../utils";
ElCol, export default {
ElRow props: ["title", "oneRow"],
}, components: {
data() { ElButton,
return { ElRadio,
BASE_API: process.env.BASE_API, ElFormItem,
oneDialogVisible: false, ElCol,
allVehicleBranchCompany: [], // 全部所属门店列表 ElRow,
allVehicleList: [], //全部车型 },
allManufacturer: [], // 生产商列表 data() {
isClick: false, // 添加、编辑-确定按钮 是否已点击 return {
form: { BASE_API: process.env.BASE_API,
useType: 1, // 用途 oneDialogVisible: false,
// state: 1, // 1、上架 2、下架 allVehicleBranchCompany: [], // 全部所属门店列表
id: undefined, // 车辆id allVehicleList: [], //全部车型
numberPlate: undefined, // 车牌号码 allManufacturer: [], // 生产商列表
code: undefined, // 车辆编号 isClick: false, // 添加、编辑-确定按钮 是否已点击
status: undefined, // 出行状态 form: {
mileageLastUpdate: undefined, // 公里数 useType: 1, // 用途
parkBranchCompanyId: undefined, // 停靠门店 // state: 1, // 1、上架 2、下架
subordinateBranch: undefined, // 所属门店 id: undefined, // 车辆id
belongToName: undefined, // 托管人 numberPlate: undefined, // 车牌号码
vehicleInnerStatus: undefined, // 内饰:1、全新,2、9成新,3、8成新,4、7成新 code: undefined, // 车辆编号
vehicleStatus: undefined, // 新旧程度:1、全新,2、9成新,3、8成新,4、7成新 status: undefined, // 出行状态
vehicleBodyStatus: undefined, // 车身状况:1、无剐蹭,2、微瑕疵,3、无瑕疵 mileageLastUpdate: undefined, // 公里数
remark: undefined, // 备注 parkBranchCompanyId: undefined, // 停靠门店
brand: undefined, // 车辆品牌 subordinateBranch: undefined, // 所属门店
modelId: undefined, // 车型id belongToName: undefined, // 托管人
manufacturer: undefined, // 生产商 vehicleInnerStatus: undefined, // 内饰:1、全新,2、9成新,3、8成新,4、7成新
vin: undefined, //车架号 vehicleStatus: undefined, // 新旧程度:1、全新,2、9成新,3、8成新,4、7成新
engineNum: undefined, //发动机号 vehicleBodyStatus: undefined, // 车身状况:1、无剐蹭,2、微瑕疵,3、无瑕疵
vehicleRegisterDate: undefined, // 上牌日期 remark: undefined, // 备注
annualVerificationDate: undefined, // 年审日期 brand: undefined, // 车辆品牌
drivingLicensePath: undefined, // 行驶证正面 modelId: undefined, // 车型id
drivingLicenseDuplicatePath: undefined, // 行驶证副本 manufacturer: undefined, // 生产商
insuranceCompany: undefined, // 商业险公司 vin: undefined, //车架号
insuranceNo: undefined, // 商业险单号 engineNum: undefined, //发动机号
insuranceEndDate: undefined, // 商业险日期 vehicleRegisterDate: undefined, // 上牌日期
strongInsuranceCompany: undefined, // 交强险公司 annualVerificationDate: undefined, // 年审日期
strongInsuranceNo: undefined, // 交强险单号 drivingLicensePath: undefined, // 行驶证正面
strongInsuranceEndDate: undefined, // 交强险日期 drivingLicenseDuplicatePath: undefined, // 行驶证副本
insuranceCompany: undefined, // 商业险公司
insuranceNo: undefined, // 商业险单号
insuranceEndDate: undefined, // 商业险日期
strongInsuranceCompany: undefined, // 交强险公司
strongInsuranceNo: undefined, // 交强险单号
strongInsuranceEndDate: undefined, // 交强险日期
},
rules: {
numberPlate: {
required: true,
message: "请输入车牌号",
trigger: "blur",
}, },
rules: { mileageLastUpdate: [this.integerValidator()],
numberPlate: { status: {
required: true, required: true,
message: '请输入车牌号', message: "请选择出行状态",
trigger: 'blur' trigger: "change",
}, },
mileageLastUpdate: [this.integerValidator()], code: {
status: { required: true,
required: true, message: "请输入车辆编码",
message: '请选择出行状态', trigger: "blur",
trigger: 'change' },
}, useType: {
code: { required: true,
required: true, message: "请选择用途",
message: '请输入车辆编码', trigger: "change",
trigger: 'blur' },
}, parkBranchCompanyId: {
useType: { required: true,
required: true, message: "请选择停靠门店",
message: '请选择用途', trigger: "change",
trigger: 'change' },
}, vehicleStatus: {
parkBranchCompanyId: { required: true,
required: true, message: "请选择新旧程度",
message: '请选择停靠门店', trigger: "change",
trigger: 'change' },
}, vehicleBodyStatus: {
vehicleStatus: { required: true,
required: true, message: "请选择车身状况",
message: '请选择新旧程度', trigger: "change",
trigger: 'change' },
}, vehicleInnerStatus: {
vehicleBodyStatus: { required: true,
required: true, message: "请选择内饰",
message: '请选择车身状况', trigger: "change",
trigger: 'change' },
}, subordinateBranch: {
vehicleInnerStatus: { required: true,
required: true, message: "请选择所属门店",
message: '请选择内饰', trigger: "change",
trigger: 'change' },
}, brand: {
subordinateBranch: { required: true,
required: true, message: "请选择车辆品牌",
message: '请选择所属门店', trigger: "change",
trigger: 'change' },
}, modelId: {
brand: { required: true,
required: true, message: "请选择车型",
message: '请选择车辆品牌', trigger: "change",
trigger: 'change'
},
modelId: {
required: true,
message: '请选择车型',
trigger: 'change'
},
}, },
pdfList:[], // 保单列表
}
},
mounted() {
this.oneDialogVisible = true;
this.cleanForm() // 清空表单数据
if(this.title == '编辑车辆'){
// 编辑
this.getVehicleDetail() // 获取车辆详情
}
this.getAllManufacturer()// 获取全部生产商
this.getAllVehicleType() // 获取全部车型
this.getVehicleBranchCompanyAll() // 获取所有门店
},
computed: {
...mapGetters([
'elements'
]),
getHeaderWithToken() {
return { Authorization: getToken() }
}, },
getUnkownBrandCode: () => VEHICLE_CONSTANT_BRAND_CODE_UNKOWN, // 车辆品牌 pdfList: [], // 保单列表
};
},
mounted() {
this.oneDialogVisible = true;
this.cleanForm(); // 清空表单数据
if (this.title == "编辑车辆") {
// 编辑
this.getVehicleDetail(); // 获取车辆详情
}
this.getAllManufacturer(); // 获取全部生产商
this.getAllVehicleType(); // 获取全部车型
this.getVehicleBranchCompanyAll(); // 获取所有门店
},
computed: {
...mapGetters(["elements"]),
getHeaderWithToken() {
return { Authorization: getToken() };
}, },
methods: { getUnkownBrandCode: () => VEHICLE_CONSTANT_BRAND_CODE_UNKOWN, // 车辆品牌
/** },
* 获取全部供应商列表 methods: {
*/ /**
getAllManufacturer(){ * 获取全部供应商列表
allManufacturer().then(response => { */
if(response.status == 200){ getAllManufacturer() {
this.allManufacturer = response.data allManufacturer().then((response) => {
} else { if (response.status == 200) {
this.$notify({ this.allManufacturer = response.data;
title: '失败', } else {
message: response.message, this.$notify({
type: 'error', title: "失败",
duration: 2000 message: response.message,
}) type: "error",
} duration: 2000,
}) });
},
/**
* 获取全部车型
* */
getAllVehicleType() {
getAllVehicleList().then(response => {
if(response.status == 200){
let listRs = undefined
if (!this.$utils.isEmpty(response.data)) {
listRs = response.data
}
this.allVehicleList = listRs
} else {
this.$notify({
title: '失败',
message: response.message,
type: 'error',
duration: 2000
})
}
})
},
getAllInsuranceCompany,
getInsuranceCompany,
/**
* 获取所有门店
*/
getVehicleBranchCompanyAll(){
vehicleBranchCompanyAll({state: 1}).then(response => {
if(response.status == 200){
this.allVehicleBranchCompany = response.data
} else {
this.$notify({
title: '失败',
message: response.message,
type: 'error',
duration: 2000
})
}
})
},
/**
* 获取车辆全部品牌
*/
getAllBranch: () => {
return getConstantListByType(VEHICLE_CONSTANT_VEHICLE_BRAND)
},
/**
* 获取车辆详情
*/
getVehicleDetail(){
getObj(this.oneRow.id).then(response => {
if(response.status == 200){
this.$utils.objectEach(response.data, (item, key) => {
this.form[key] = item
})
// this.form = {
// id: response.data.id, // 车辆id
// numberPlate: response.data.numberPlate, // 车牌号码
// code: response.data.code, // 车辆编号
// status: response.data.status, // 出行状态
// mileageLastUpdate: response.data.maintenanceMileage, // 公里数
// parkBranchCompanyId: response.data.parkBranchCompanyId, // 停靠门店
// subordinateBranch: response.data.subordinateBranch, // 所属门店
// belongToName: response.data.belongToName, // 托管人
// vehicleInnerStatus: response.data.vehicleInnerStatus, // 内饰:1、全新,2、9成新,3、8成新,4、7成新
// vehicleStatus: response.data.vehicleStatus, // 新旧程度:1、全新,2、9成新,3、8成新,4、7成新
// vehicleBodyStatus: response.data.vehicleBodyStatus, // 车身状况:1、无剐蹭,2、微瑕疵,3、无瑕疵
// remark: response.data.remark, // 备注
// }
} else {
this.$notify({
title: '失败',
message: response.message,
type: 'error',
duration: 2000
})
}
})
},
beforeAvatarUpload(file) {
const isJPG =
file.type === 'image/jpeg' || file.type === 'image/gif'
file.type === 'image/jpeg' || file.type === 'image/gif' || file.type === 'image/pdf'
const isLt2M = file.size / 1024 / 1024 < 10
if (!isJPG) {
this.$message.error('上传图片只能是 JPG/GIF 格式!')
}
if (!isLt2M) {
this.$message.error('上传图片大小不能超过 10MB!')
} }
// this.showLoadingBody = true });
return isJPG && isLt2M },
}, /**
/** * 获取全部车型
* 行驶证--正面 * */
*/ getAllVehicleType() {
handleAvatarSuccess(res, file) { getAllVehicleList().then((response) => {
this.form.drivingLicensePath = res.data if (response.status == 200) {
this.showLoadingBody = false let listRs = undefined;
}, if (!this.$utils.isEmpty(response.data)) {
/** listRs = response.data;
* 行驶证--副本
*/
handleAvatarSuccessF(res, file) {
this.form.drivingLicenseDuplicatePath = res.data
this.showLoadingBody = false
},
/**
* PDF保单上传
*/
handleAvatarSuccessPDF(res, file) {
if (res.data) {
if(this.pdfList.length >= 0) {
var data = {
"id": this.pdfList.length + 1,
"name": "车辆保单" + (this.pdfList.length + 1),
"url":res.data
}
this.pdfList.push(data)
} }
} this.allVehicleList = listRs;
this.showLoadingBody = false
},
showImgDialog(drivingLicensePath) {
this.licenceSrcUrl = this.getDrivingLicenseUrl(drivingLicensePath)
this.dialogForm4LicenceVisible = true
},
/**
* 行驶证--src
*/
getDrivingLicenseUrl(drivingLicensePath) {
if (drivingLicensePath.indexOf('https') > -1) {
return drivingLicensePath
}else{
return (
process.env.BASE_API +
'/vehicle/vehicleInfo/download/drivingLicense?realFileRelPath=' +
encodeURI(drivingLicensePath)
)
}
},
/**
* 下载保单
*/
downloadPDF(i) {
var data = this.pdfList[i].url;
if(data) {
window.open(data, '_blank');
} else { } else {
this.$notify({ this.$notify({
title: '失败', title: "失败",
message: '车辆保单不存在', message: response.message,
type: 'error', type: "error",
duration: 2000 duration: 2000,
}) });
}
},
/**
* 公里数验证
*/
integerValidator: function() {
return {
validator: (rule, value, callback) => {
if (
this.$utils.isUndefined(value) ||
this.$utils.isNull()
) {
return callback()
}
if (!this.$utils.isInteger(value)) {
return callback(new Error('必须为整数'))
}
if (value < 1 || value > 9999999999) {
return callback(
new Error('编码合法范围:[1 - 9999999999]')
)
}
callback()
},
trigger: 'blur'
} }
}, });
/** },
* 清空表单数据 getAllInsuranceCompany,
*/ getInsuranceCompany,
cleanForm(){ /**
this.form = { * 获取所有门店
useType: 1, // 用途 */
id: undefined, // 车辆id getVehicleBranchCompanyAll() {
numberPlate: undefined, // 车牌号码 vehicleBranchCompanyAll({ state: 1 }).then((response) => {
code: undefined, // 车辆编号 if (response.status == 200) {
status: undefined, // 出行状态 this.allVehicleBranchCompany = response.data;
mileageLastUpdate: undefined, // 公里数 } else {
parkBranchCompanyId: undefined, // 停靠门店 this.$notify({
subordinateBranch: undefined, // 所属门店 title: "失败",
belongToName: undefined, // 托管人 message: response.message,
vehicleInnerStatus: undefined, // 内饰:1、全新,2、9成新,3、8成新,4、7成新 type: "error",
vehicleStatus: undefined, // 新旧程度:1、全新,2、9成新,3、8成新,4、7成新 duration: 2000,
vehicleBodyStatus: undefined, // 车身状况:1、无剐蹭,2、微瑕疵,3、无瑕疵 });
remark: undefined, // 备注
brand: undefined, // 车辆品牌
modelId: undefined, // 车型id
manufacturer: undefined, // 生产商
vin: undefined, //车架号
engineNum: undefined, //发动机号
vehicleRegisterDate: undefined, // 上牌日期
annualVerificationDate: undefined, // 年审日期
drivingLicensePath: undefined, // 行驶证正面
drivingLicenseDuplicatePath: undefined, // 行驶证副本
insuranceCompany: undefined, // 商业险公司
insuranceNo: undefined, // 商业险单号
insuranceEndDate: undefined, // 商业险日期
strongInsuranceCompany: undefined, // 交强险公司
strongInsuranceNo: undefined, // 交强险单号
strongInsuranceEndDate: undefined, // 交强险日期
} }
}, });
/** },
* 关闭弹窗 /**
*/ * 获取车辆全部品牌
closePop(){ */
this.oneDialogVisible = false getAllBranch: () => {
this.$emit('oneDialogEvent', false); return getConstantListByType(VEHICLE_CONSTANT_VEHICLE_BRAND);
}, },
/** /**
* 确定 * 获取车辆详情
*/ */
handleOk(){ getVehicleDetail() {
const set = this.$refs getObj(this.oneRow.id).then((response) => {
if(this.isClick) { if (response.status == 200) {
return this.$utils.objectEach(response.data, (item, key) => {
this.form[key] = item;
});
// this.form = {
// id: response.data.id, // 车辆id
// numberPlate: response.data.numberPlate, // 车牌号码
// code: response.data.code, // 车辆编号
// status: response.data.status, // 出行状态
// mileageLastUpdate: response.data.maintenanceMileage, // 公里数
// parkBranchCompanyId: response.data.parkBranchCompanyId, // 停靠门店
// subordinateBranch: response.data.subordinateBranch, // 所属门店
// belongToName: response.data.belongToName, // 托管人
// vehicleInnerStatus: response.data.vehicleInnerStatus, // 内饰:1、全新,2、9成新,3、8成新,4、7成新
// vehicleStatus: response.data.vehicleStatus, // 新旧程度:1、全新,2、9成新,3、8成新,4、7成新
// vehicleBodyStatus: response.data.vehicleBodyStatus, // 车身状况:1、无剐蹭,2、微瑕疵,3、无瑕疵
// remark: response.data.remark, // 备注
// }
} else {
this.$notify({
title: "失败",
message: response.message,
type: "error",
duration: 2000,
});
} }
this.isClick = true });
set['form'].validate(valid => { },
if (valid) { beforeAvatarUpload(file) {
let params = objDeepCopy(this.form) const isJPG = file.type === "image/jpeg" || file.type === "image/gif";
params.registerDate = this.form.vehicleRegisterDate // 上班时间 file.type === "image/jpeg" ||
params.vehicleRegisterDate = undefined file.type === "image/gif" ||
if (this.form.id) { file.type === "image/pdf";
// 编辑 const isLt2M = file.size / 1024 / 1024 < 10;
putObj(params).then(response => {
if (response.code == 1) {
this.$notify({
title: '成功',
message: '编辑成功',
type: 'success',
duration: 2000
})
this.$emit('oneDialogEvent', true);
} else {
this.isClick = false
this.$notify({
title: '失败',
message: response.message,
type: 'error',
duration: 2000
})
}
})
} else {
// 添加
addObj(params).then(response => {
if (response.code == 1) {
this.$notify({
title: '成功',
message: '添加成功',
type: 'success',
duration: 2000
})
this.$emit('oneDialogEvent', true); if (!isJPG) {
} else { this.$message.error("上传图片只能是 JPG/GIF 格式!");
this.isClick = false }
this.$notify({ if (!isLt2M) {
title: '失败', this.$message.error("上传图片大小不能超过 10MB!");
message: response.message, }
type: 'error', // this.showLoadingBody = true
duration: 2000 return isJPG && isLt2M;
}) },
} /**
}) * 行驶证--正面
} */
} else { handleAvatarSuccess(res, file) {
this.isClick = false this.form.drivingLicensePath = res.data;
this.showLoadingBody = false;
},
/**
* 行驶证--副本
*/
handleAvatarSuccessF(res, file) {
this.form.drivingLicenseDuplicatePath = res.data;
this.showLoadingBody = false;
},
/**
* PDF保单上传
*/
handleAvatarSuccessPDF(res, file) {
if (res.data) {
if (this.pdfList.length >= 0) {
var data = {
id: this.pdfList.length + 1,
name: "车辆保单" + (this.pdfList.length + 1),
url: res.data,
};
this.pdfList.push(data);
}
}
this.showLoadingBody = false;
},
showImgDialog(drivingLicensePath) {
this.licenceSrcUrl = this.getDrivingLicenseUrl(drivingLicensePath);
this.dialogForm4LicenceVisible = true;
},
/**
* 行驶证--src
*/
getDrivingLicenseUrl(drivingLicensePath) {
if (drivingLicensePath.indexOf("https") > -1) {
return drivingLicensePath;
} else {
return (
process.env.BASE_API +
"/vehicle/vehicleInfo/download/drivingLicense?realFileRelPath=" +
encodeURI(drivingLicensePath)
);
}
},
/**
* 下载保单
*/
downloadPDF(i) {
var data = this.pdfList[i].url;
if (data) {
window.open(data, "_blank");
} else {
this.$notify({
title: "失败",
message: "车辆保单不存在",
type: "error",
duration: 2000,
});
}
},
/**
* 公里数验证
*/
integerValidator: function () {
return {
validator: (rule, value, callback) => {
if (this.$utils.isUndefined(value) || this.$utils.isNull()) {
return callback();
} }
}) if (!this.$utils.isInteger(value)) {
}, return callback(new Error("必须为整数"));
/** }
* 出行状态 if (value < 1 || value > 9999999999) {
*/ return callback(new Error("编码合法范围:[1 - 9999999999]"));
getAllVehicleStatus: function() { }
return { callback();
1: { },
code: 1, trigger: "blur",
val: '正常运行' };
}, },
3: { /**
code: 3, * 清空表单数据
val: '报废' */
}, cleanForm() {
4: { this.form = {
code: 4, useType: 1, // 用途
val: '出车' id: undefined, // 车辆id
}, numberPlate: undefined, // 车牌号码
6: { code: undefined, // 车辆编号
code: 6, status: undefined, // 出行状态
val: '维修中' mileageLastUpdate: undefined, // 公里数
}, parkBranchCompanyId: undefined, // 停靠门店
7: { subordinateBranch: undefined, // 所属门店
code: 7, belongToName: undefined, // 托管人
val: '保养中' vehicleInnerStatus: undefined, // 内饰:1、全新,2、9成新,3、8成新,4、7成新
}, vehicleStatus: undefined, // 新旧程度:1、全新,2、9成新,3、8成新,4、7成新
8: { vehicleBodyStatus: undefined, // 车身状况:1、无剐蹭,2、微瑕疵,3、无瑕疵
code: 8, remark: undefined, // 备注
val: '上牌中' brand: undefined, // 车辆品牌
modelId: undefined, // 车型id
manufacturer: undefined, // 生产商
vin: undefined, //车架号
engineNum: undefined, //发动机号
vehicleRegisterDate: undefined, // 上牌日期
annualVerificationDate: undefined, // 年审日期
drivingLicensePath: undefined, // 行驶证正面
drivingLicenseDuplicatePath: undefined, // 行驶证副本
insuranceCompany: undefined, // 商业险公司
insuranceNo: undefined, // 商业险单号
insuranceEndDate: undefined, // 商业险日期
strongInsuranceCompany: undefined, // 交强险公司
strongInsuranceNo: undefined, // 交强险单号
strongInsuranceEndDate: undefined, // 交强险日期
};
},
/**
* 关闭弹窗
*/
closePop() {
this.oneDialogVisible = false;
this.$emit("oneDialogEvent", false);
},
/**
* 确定
*/
handleOk() {
const set = this.$refs;
if (this.isClick) {
return;
}
this.isClick = true;
set["form"].validate((valid) => {
if (valid) {
let params = objDeepCopy(this.form);
params.registerDate = this.form.vehicleRegisterDate; // 上班时间
params.vehicleRegisterDate = undefined;
if (this.form.id) {
// 编辑
putObj(params).then((response) => {
if (response.code == 1) {
this.$notify({
title: "成功",
message: "编辑成功",
type: "success",
duration: 2000,
});
this.$emit("oneDialogEvent", true);
} else {
this.isClick = false;
this.$notify({
title: "失败",
message: response.message,
type: "error",
duration: 2000,
});
}
});
} else {
// 添加
addObj(params).then((response) => {
if (response.code == 1) {
this.$notify({
title: "成功",
message: "添加成功",
type: "success",
duration: 2000,
});
this.$emit("oneDialogEvent", true);
} else {
this.isClick = false;
this.$notify({
title: "失败",
message: response.message,
type: "error",
duration: 2000,
});
}
});
} }
} else {
this.isClick = false;
} }
}, });
} },
} /**
* 出行状态
*/
getAllVehicleStatus: function () {
return {
1: {
code: 1,
val: "正常运行",
},
3: {
code: 3,
val: "报废",
},
4: {
code: 4,
val: "出车",
},
6: {
code: 6,
val: "维修中",
},
7: {
code: 7,
val: "保养中",
},
8: {
code: 8,
val: "上牌中",
},
};
},
},
};
</script> </script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment