朱兆平 / vue_cli · 提交

转到一个项目

作者 王勇
提交 b54d9967ac81cc593743a941e2b02a238b86672d 1 个父辈 3311d5d3 vehicle_dispatch

基础界面，基本完成

内嵌 并排对比
正在显示 6 个修改的文件 包含 1668 行增加 和 19 行删除
... ... @@ -12,6 +12,8 @@ export const updateVehicle = params =>{return http.put(`${baseUrl}/vehicle/updat
export const deleteVehicle = params =>{return http.del(`${baseUrl}/vehicle/delete`, params);};
// 车辆信息，批量删除
export const batchRemoveVehicle = params =>{return http.del(`${baseUrl}/vehicle/batchRemove`, params);};
// 车辆信息，审批
export const approvalVehicle = params =>{return http.put(`${baseUrl}/vehicle/approval`, params);};
// 挂车信息，分页查询
export const selectTrailerList = params =>{return http.get(`${baseUrl}/trailer/page`, params);};
... ...
... ... @@ -42,8 +42,8 @@
fixStyle: '',
logining: false,
ruleForm2: {
account: 'admin',
checkPass: 'vmvnv1v2VV'
account: 'zicheng',
checkPass: '123456'
},
rules2: {
account: [
... ...
<template>
<el-container>
<el-card style="background-color: #F5F7FA">
<!-- 搜素区域 -->
<div>
<el-row :gutter="10">
<el-col :span="4">
<el-input v-model="corporation_queryInfo.coCode" prefix-icon="el-icon-search" size="small"
placeholder="企业代码" clearable></el-input>
</el-col>
<el-col :span="8">
<el-button type="success" style="width:120px" size="small" @click="corporation_getList">
查询
</el-button>
<el-button type="primary" style="width:120px" size="small" @click="corporation_toAddDialog">
备案添加
</el-button>
</el-col>
</el-row>
</div>
<!-- 列表区域 -->
<div style="margin-top: 20px;">
<el-table :data="corporation_page.corporationList" border size="mini" @selection-change="corporation_selectChange"
v-loading="corporation_loading.listLoading" element-loading-text="获取企业列表，拼命加载中">
<el-table-column type="selection" width="55" align="center"></el-table-column>
<el-table-column type="index" align="center"></el-table-column>
<el-table-column label="企业代码" prop="coCode" align="center" width="100"></el-table-column>
<el-table-column label="主管海关代码" prop="mainPort" align="center" width="100"></el-table-column>
<el-table-column label="企业注册地" prop="coRegAddr" align="center" width="100"></el-table-column>
<el-table-column label="企业类别" prop="coDealType" align="center" width="80"></el-table-column>
<el-table-column label="批准行驶口岸" prop="apprPorts" align="center" width="80"></el-table-column>
<el-table-column label="企业负责人" prop="coRep" align="center" width="100"></el-table-column>
<el-table-column label="负责人电话" prop="coRepPhon" align="center" width="90"></el-table-column>
<el-table-column label="运输工具服务企业" prop="coServiceName" align="center" width="90"></el-table-column>
<el-table-column label="担保企业名称" prop="assureCoName" align="center" width="90"></el-table-column>
<!-- 内承企业名称:没找到对应字段 -->
<el-table-column label="内承企业名称" prop="" align="center" width="90"></el-table-column>
<el-table-column label="所属分支机构" prop="belongOrgName" align="center" width="90"></el-table-column>
<el-table-column label="更新时间" prop="updateDate" align="center" width="150"></el-table-column>
<el-table-column label="操作" width="180px" align="center" fixed="right">
<template slot-scope="scope">
<el-tooltip effect="dark" content="编辑" placement="top-start" :enterable="false">
<el-button type="text" icon="el-icon-edit" size="mini"
@click="corporation_toEditDialog(scope.$index,scope.row)">编辑
</el-button>
</el-tooltip>
<el-tooltip effect="dark" content="删除" placement="top-start" :enterable="false">
<el-button type="text" icon="el-icon-delete" size="mini"
:loading="corporation_loading.delLoading"
@click="corporation_delete(scope.$index,scope.row)">删除
</el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
</div>
<!-- 分页区域 -->
<div style="margin-top: 10px">
<el-row :gutter="24">
<el-col :span="5">
<el-button type="danger" icon="el-icon-delete"
:loading="corporation_loading.listLoading"
:disabled="this.corporation_page.selectList.length===0"
size="small"
@click="corporation_batchRemove">批量删除
</el-button>
</el-col>
<el-col :span="10" style="margin-top: 5px">
<el-pagination
@size-change="corporation_handleSizeChange"
@current-change="corporation_handleCurrentChange"
:current-page="corporation_queryInfo.pageNum"
:page-sizes="[10,30,50,100]"
:page-size="corporation_queryInfo.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="corporation_page.total">
</el-pagination>
</el-col>
</el-row>
</div>
</el-card>
<!-- 备案添加 -->
<div>
<el-dialog title="企业信息：备案添加"
:visible.sync="corporation_dialog.addDialog"
style="margin-top: -80px" text-align="center" width="70%"
@close="corporation_addDialogClosed">
<el-form :inline="true" label-width="180px" status-icon style="margin-top: -10px;margin-left: 60px"
:model="corporation_addForm" :rules="corporation_addFormRules" ref="corporation_addFormRef">
<el-form-item label="企业代码：" prop="coCode">
<el-input v-model="corporation_addForm.coCode" style="width:240px" size="mini" clearable
placeholder="请输入企业代码">
</el-input>
</el-form-item>
<el-form-item label="主管海关代码：" prop="mainPort">
<el-input v-model="corporation_addForm.mainPort" style="width:240px" size="mini" clearable
placeholder="请输入主管海关代码">
</el-input>
</el-form-item>
<el-form-item label="企业注册地：" prop="coRegAddr">
<el-input v-model="corporation_addForm.coRegAddr" style="width:240px" size="mini" clearable
placeholder="请输入企业注册地">
</el-input>
</el-form-item>
<el-form-item label="批准海关：" prop="apprDep">
<el-input v-model="corporation_addForm.apprDep" style="width:240px" size="mini" clearable
placeholder="请输入批准海关">
</el-input>
</el-form-item>
<el-form-item label="批准/许可批文号：" prop="apprNo">
<el-input v-model="corporation_addForm.apprNo" style="width:240px" size="mini" clearable
placeholder="请输入批准/许可批文号">
</el-input>
</el-form-item>
<el-form-item label="批准/许可批文有效期：" prop="apprValidTime">
<el-date-picker v-model="corporation_addForm.apprValidTime" placeholder="批准/许可批文有效期"
type="date" value-format="yyyy-MM-dd"
size="mini" style="width:240px"></el-date-picker>
</el-form-item>
<el-form-item label="批准行驶口岸：" prop="apprPorts">
<el-input v-model="corporation_addForm.apprPorts" style="width:240px" size="mini" clearable
placeholder="请输入批准行驶口岸">
</el-input>
</el-form-item>
<el-form-item label="企业中文名称：" prop="coNameCn">
<el-input v-model="corporation_addForm.coNameCn" style="width:240px" size="mini" clearable
placeholder="请输入企业中文名称">
</el-input>
</el-form-item>
<el-form-item label="企业外文名称：" prop="coNameEn">
<el-input v-model="corporation_addForm.coNameEn" style="width:240px" size="mini" clearable
placeholder="请输入企业外文名称">
</el-input>
</el-form-item>
<el-form-item label="企业地址：" prop="coAddr">
<el-input v-model="corporation_addForm.coAddr" style="width:240px" size="mini" clearable
placeholder="请输入企业地址">
</el-input>
</el-form-item>
<el-form-item label="境内联系电话：" prop="insidePhone">
<el-input v-model="corporation_addForm.insidePhone" style="width:240px" size="mini" clearable
placeholder="请输入境内联系电话">
</el-input>
</el-form-item>
<el-form-item label="企业经营类型：" prop="coDealType">
<el-select v-model="corporation_addForm.coDealType" style="width: 240px" clearable size="small"
placeholder="请选择企业经营类型">
<el-option
v-for="item in coDealTypeList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="企业负责人：" prop="coRep">
<el-input v-model="corporation_addForm.coRep" style="width:240px" size="mini" clearable
placeholder="请输入企业负责人">
</el-input>
</el-form-item>
<el-form-item label="企业负责人联系电话：" prop="coRepPhon">
<el-input v-model="corporation_addForm.coRepPhon" style="width:240px" size="mini" clearable
placeholder="请输入企业负责人联系电话">
</el-input>
</el-form-item>
<el-form-item label="境内联系地址：" prop="insideAddr">
<el-input v-model="corporation_addForm.insideAddr" style="width:240px" size="mini" clearable
placeholder="请输入境内联系地址">
</el-input>
</el-form-item>
<el-form-item label="企业经营资格：" prop="coDealQua">
<el-input v-model="corporation_addForm.coDealQua" style="width:240px" size="mini" clearable
placeholder="请输入企业经营资格">
</el-input>
</el-form-item>
<el-form-item label="企业备案类别：" prop="coRecType">
<el-select v-model="corporation_addForm.coRecType" style="width: 240px" clearable size="small"
placeholder="请选择企业备案类别">
<el-option
v-for="item in coRecTypeList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="最新更新申请业务类型：" prop="currApplyBussine">
<el-input v-model="corporation_addForm.currApplyBussine" style="width:240px" size="mini" clearable
placeholder="请输入最新更新申请业务类型">
</el-input>
</el-form-item>
<el-form-item label="备注：" prop="memo">
<el-input v-model="corporation_addForm.memo" style="width:645px" clearable size="mini"
type="textarea" :rows="3">
</el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center;margin-top: -30px">
<el-button type="info" @click="corporation_dialog.addDialog = false" size="medium"
style="width: 100px">取消
</el-button>
<el-button type="primary" @click="corporation_add" :loading="corporation_loading.addLoading"
size="medium" style="width: 100px">保存
</el-button>
</div>
</el-dialog>
</div>
<!-- 备案修改 -->
<div>
<el-dialog title="企业信息：备案修改"
:visible.sync="corporation_dialog.editDialog"
style="margin-top: -80px" text-align="center" width="70%"
@close="corporation_editDialogClosed">
<el-form :inline="true" label-width="180px" status-icon style="margin-top: -10px;margin-left: 60px"
:model="corporation_editForm" :rules="corporation_editFormRules" ref="corporation_editFormRef">
<el-form-item label="企业代码：" prop="coCode">
<el-input v-model="corporation_editForm.coCode" style="width:240px" size="mini" clearable
placeholder="请输入企业代码">
</el-input>
</el-form-item>
<el-form-item label="主管海关代码：" prop="mainPort">
<el-input v-model="corporation_editForm.mainPort" style="width:240px" size="mini" clearable
placeholder="请输入主管海关代码">
</el-input>
</el-form-item>
<el-form-item label="企业注册地：" prop="coRegAddr">
<el-input v-model="corporation_editForm.coRegAddr" style="width:240px" size="mini" clearable
placeholder="请输入企业注册地">
</el-input>
</el-form-item>
<el-form-item label="批准海关：" prop="apprDep">
<el-input v-model="corporation_editForm.apprDep" style="width:240px" size="mini" clearable
placeholder="请输入批准海关">
</el-input>
</el-form-item>
<el-form-item label="批准/许可批文号：" prop="apprNo">
<el-input v-model="corporation_editForm.apprNo" style="width:240px" size="mini" clearable
placeholder="请输入批准/许可批文号">
</el-input>
</el-form-item>
<el-form-item label="批准/许可批文有效期：" prop="apprValidTime">
<el-date-picker v-model="corporation_editForm.apprValidTime" placeholder="批准/许可批文有效期"
type="date" value-format="yyyy-MM-dd"
size="mini" style="width:240px"></el-date-picker>
</el-form-item>
<el-form-item label="批准行驶口岸：" prop="apprPorts">
<el-input v-model="corporation_editForm.apprPorts" style="width:240px" size="mini" clearable
placeholder="请输入批准行驶口岸">
</el-input>
</el-form-item>
<el-form-item label="企业中文名称：" prop="coNameCn">
<el-input v-model="corporation_editForm.coNameCn" style="width:240px" size="mini" clearable
placeholder="请输入企业中文名称">
</el-input>
</el-form-item>
<el-form-item label="企业外文名称：" prop="coNameEn">
<el-input v-model="corporation_editForm.coNameEn" style="width:240px" size="mini" clearable
placeholder="请输入企业外文名称">
</el-input>
</el-form-item>
<el-form-item label="企业地址：" prop="coAddr">
<el-input v-model="corporation_editForm.coAddr" style="width:240px" size="mini" clearable
placeholder="请输入企业地址">
</el-input>
</el-form-item>
<el-form-item label="境内联系电话：" prop="insidePhone">
<el-input v-model="corporation_editForm.insidePhone" style="width:240px" size="mini" clearable
placeholder="请输入境内联系电话">
</el-input>
</el-form-item>
<el-form-item label="企业经营类型：" prop="coDealType">
<el-select v-model="corporation_editForm.coDealType" style="width: 240px" clearable size="small"
placeholder="请选择企业经营类型">
<el-option
v-for="item in coDealTypeList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="企业负责人：" prop="coRep">
<el-input v-model="corporation_editForm.coRep" style="width:240px" size="mini" clearable
placeholder="请输入企业负责人">
</el-input>
</el-form-item>
<el-form-item label="企业负责人联系电话：" prop="coRepPhon">
<el-input v-model="corporation_editForm.coRepPhon" style="width:240px" size="mini" clearable
placeholder="请输入企业负责人联系电话">
</el-input>
</el-form-item>
<el-form-item label="境内联系地址：" prop="insideAddr">
<el-input v-model="corporation_editForm.insideAddr" style="width:240px" size="mini" clearable
placeholder="请输入境内联系地址">
</el-input>
</el-form-item>
<el-form-item label="企业经营资格：" prop="coDealQua">
<el-input v-model="corporation_editForm.coDealQua" style="width:240px" size="mini" clearable
placeholder="请输入企业经营资格">
</el-input>
</el-form-item>
<el-form-item label="企业备案类别：" prop="coRecType">
<el-select v-model="corporation_editForm.coRecType" style="width: 240px" clearable size="small"
placeholder="请选择企业备案类别">
<el-option
v-for="item in coRecTypeList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="最新更新申请业务类型：" prop="currApplyBussine">
<el-input v-model="corporation_editForm.currApplyBussine" style="width:240px" size="mini" clearable
placeholder="请输入最新更新申请业务类型">
</el-input>
</el-form-item>
<el-form-item label="备注：" prop="memo">
<el-input v-model="corporation_editForm.memo" style="width:645px" clearable size="mini"
type="textarea" :rows="3">
</el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center;margin-top: -30px">
<el-button type="info" @click="corporation_dialog.editDialog = false" size="medium"
style="width: 100px">取消
</el-button>
<el-button type="primary" @click="corporation_edit" :loading="corporation_loading.editLoading"
size="medium" style="width: 100px">保存
</el-button>
</div>
</el-dialog>
</div>
</el-container>
</template>
<script>
import {selectCorporationList, insertCorporation, updateCorporation, deleteCorporation, batchRemoveCorporation} from "../../api/vehicle_dispatch";
export default {
name: "Corporation"
name: "Corporation",
data() {
return {
/**
* 搜索参数
*/
corporation_queryInfo: {
// 企业代码
coCode: '',
// 当前页数
pageNum: 1,
// 每页大小
pageSize: 10,
},
/**
* 分页
*/
corporation_page: {
corporationList: [],
total: 0,
selectList: [],
},
/**
* 加载
*/
corporation_loading: {
listLoading: false,
addLoading: false,
editLoading: false,
delLoading: false,
batchDelLoading: false,
},
/**
* 对话框
*/
corporation_dialog: {
addDialog: false,
editDialog: false,
},
/**
* 备案添加，表单
*/
corporation_addForm: {
// 企业代码
coCode: '',
// 主管海关代码
mainPort: '',
// 企业注册地
coRegAddr: '',
// 批准海关
apprDep: '',
// 批准/许可批文号
apprNo: '',
// 批准/许可批文有效期
apprValidTime: undefined,
// 批准行驶口岸
apprPorts: '',
// 企业中文名称
coNameCn: '',
// 企业外文名称
coNameEn: '',
// 企业地址
coAddr: '',
// 境内联系电话，
insidePhone: '',
// 企业经营类型
coDealType: '',
// 企业负责人
coRep: '',
// 企业负责人联系电话
coRepPhon: '',
// 境内联系地址
insideAddr: '',
// 企业经营资格
coDealQua: '',
// 企业备案类别
coRecType: '',
// 最新更新申请业务类型
currApplyBussine: '',
// 备注
memo: '',
},
/**
* 备案添加，表单验证规则
*/
corporation_addFormRules: {
},
corporation_addFormRules2: {
// 企业代码
coCode: [
{required: true, message: '请输入企业代码', trigger: ['blur', 'change']},
],
// 主管海关代码
mainPort: [
{required: true, message: '请输入主管海关代码', trigger: ['blur', 'change']},
],
// 企业注册地
coRegAddr: [
{required: true, message: '请输入企业注册地', trigger: ['blur', 'change']},
],
// 批准海关
apprDep: [
{required: true, message: '请输入批准海关', trigger: ['blur', 'change']},
],
// 批准/许可批文号
apprNo: [
{required: true, message: '请输入批准/许可批文号', trigger: ['blur', 'change']},
],
// 批准/许可批文有效期
apprValidTime: [
{required: true, message: '请选择批准/许可批文有效期', trigger: ['blur', 'change']},
],
// 批准行驶口岸
apprPorts: [
{required: true, message: '请输入批准行驶口岸', trigger: ['blur', 'change']},
],
// 企业中文名称
coNameCn: [
{required: true, message: '请输入企业中文名称', trigger: ['blur', 'change']},
],
// 企业外文名称
coNameEn: [
{required: true, message: '请输入企业外文名称', trigger: ['blur', 'change']},
],
// 企业地址
coAddr: [
{required: true, message: '请输入企业地址', trigger: ['blur', 'change']},
],
// 境内联系电话，
insidePhone: [
{required: true, message: '请输入境内联系电话', trigger: ['blur', 'change']},
],
// 企业经营类型
coDealType: [
{required: true, message: '请选择企业经营类型', trigger: ['blur', 'change']},
],
// 企业负责人
coRep: [
{required: true, message: '请输入企业负责人', trigger: ['blur', 'change']},
],
// 企业负责人联系电话
coRepPhon: [
{required: true, message: '请输入企业负责人联系电话', trigger: ['blur', 'change']},
],
// 境内联系地址
insideAddr: [
{required: true, message: '请输入境内联系地址', trigger: ['blur', 'change']},
],
// 企业经营资格
coDealQua: [
{required: true, message: '请输入企业经营资格', trigger: ['blur', 'change']},
],
// 企业备案类别
coRecType: [
{required: true, message: '请选择企业备案类别', trigger: ['blur', 'change']},
],
// 最新更新申请业务类型
currApplyBussine: [
{required: true, message: '请输入最新更新申请业务类型', trigger: ['blur', 'change']},
],
// 备注
memo: [
{required: true, message: '请输入备注', trigger: ['blur', 'change']},
],
},
/**
* 企业经营类型
*/
coDealTypeList: [
{
value: '1',
label: '货运企业'
},
{
value: '2',
label: '客运企业'
},
{
value: '3',
label: '转关运输企业'
},
{
value: '4',
label: '其他'
},
],
/**
* 企业备案类别
*/
coRecTypeList: [
{
value: '1',
label: '经营性进出境公路运输企业'
},
{
value: '2',
label: '非经营性进出境公路交通工具负责人'
},
{
value: '3',
label: '进出境公路运输工具代理企业'
},
{
value: '4',
label: '经营性来往港澳公路运输企业'
},
{
value: '5',
label: '非经营性来往港澳公路交通工具负责人'
},
{
value: '6',
label: '来往港澳公路运输工具代理企业'
},
],
/**
* 备案修改，表单
*/
corporation_editForm: {},
/**
* 备案修改，表单验证规则
*/
corporation_editFormRules: {
// 企业代码
coCode: [
{required: true, message: '请输入企业代码', trigger: ['blur', 'change']},
],
// 主管海关代码
mainPort: [
{required: true, message: '请输入主管海关代码', trigger: ['blur', 'change']},
],
// 企业注册地
coRegAddr: [
{required: true, message: '请输入企业注册地', trigger: ['blur', 'change']},
],
// 批准海关
apprDep: [
{required: true, message: '请输入批准海关', trigger: ['blur', 'change']},
],
// 批准/许可批文号
apprNo: [
{required: true, message: '请输入批准/许可批文号', trigger: ['blur', 'change']},
],
// 批准/许可批文有效期
apprValidTime: [
{required: true, message: '请选择批准/许可批文有效期', trigger: ['blur', 'change']},
],
// 批准行驶口岸
apprPorts: [
{required: true, message: '请输入批准行驶口岸', trigger: ['blur', 'change']},
],
// 企业中文名称
coNameCn: [
{required: true, message: '请输入企业中文名称', trigger: ['blur', 'change']},
],
// 企业外文名称
coNameEn: [
{required: true, message: '请输入企业外文名称', trigger: ['blur', 'change']},
],
// 企业地址
coAddr: [
{required: true, message: '请输入企业地址', trigger: ['blur', 'change']},
],
// 境内联系电话，
insidePhone: [
{required: true, message: '请输入境内联系电话', trigger: ['blur', 'change']},
],
// 企业经营类型
coDealType: [
{required: true, message: '请选择企业经营类型', trigger: ['blur', 'change']},
],
// 企业负责人
coRep: [
{required: true, message: '请输入企业负责人', trigger: ['blur', 'change']},
],
// 企业负责人联系电话
coRepPhon: [
{required: true, message: '请输入企业负责人联系电话', trigger: ['blur', 'change']},
],
// 境内联系地址
insideAddr: [
{required: true, message: '请输入境内联系地址', trigger: ['blur', 'change']},
],
// 企业经营资格
coDealQua: [
{required: true, message: '请输入企业经营资格', trigger: ['blur', 'change']},
],
// 企业备案类别
coRecType: [
{required: true, message: '请选择企业备案类别', trigger: ['blur', 'change']},
],
// 最新更新申请业务类型
currApplyBussine: [
{required: true, message: '请输入最新更新申请业务类型', trigger: ['blur', 'change']},
],
// 备注
memo: [
{required: true, message: '请输入备注', trigger: ['blur', 'change']},
],
},
}
},
methods: {
/**
* 分页查询，监听 pageSize 改变的事件
* 刷新列表
*/
corporation_handleSizeChange(newSize) {
this.corporation_queryInfo.pageSize = newSize;
this.corporation_getList();
},
/**
* 分页查询，监听 pageNum 改变的事件
* 刷新列表
*/
corporation_handleCurrentChange(newPage) {
this.corporation_queryInfo.pageNum = newPage;
this.corporation_getList();
},
/**
* 列表查询
*/
corporation_getList() {
this.corporation_loading.listLoading = true;
selectCorporationList(this.corporation_queryInfo).then((response) => {
let res = response.data;
if (res.code !== '200') {
this.corporation_loading.listLoading = false;
return this.$message.error(res.msg);
}
this.corporation_page.corporationList = res.data.list;
console.table(this.corporation_page.corporationList)
this.corporation_page.total = res.data.total;
this.corporation_loading.listLoading = false;
}).catch(error => {
this.corporation_loading.listLoading = false;
this.$message.error(error.toString());
});
},
/**
* 对话框，备案添加，打开事件
*/
corporation_toAddDialog() {
this.corporation_dialog.addDialog = true;
},
/**
* 对话框，备案添加，关闭事件
*/
corporation_addDialogClosed() {
this.$refs.corporation_addFormRef.resetFields();
},
/**
* 备案添加
*/
corporation_add() {
this.$refs.corporation_addFormRef.validate(valid => {
// 未通过，表单预校验
if (!valid) return;
this.corporation_loading.addLoading = true;
insertCorporation(this.corporation_addForm).then((response) => {
let res = response.data;
if (res.code !== '200') {
this.corporation_loading.addLoading = false;
return this.$message.error(res.msg);
}
this.$message.success(res.msg);
this.corporation_loading.addLoading = false;
this.corporation_dialog.addDialog = false;
this.corporation_getList();
}).catch(error => {
this.corporation_loading.addLoading = false;
this.$message.error(error.toString());
});
})
},
/**
* 备案修改，对话框，打开事件
*/
corporation_toEditDialog(index, row) {
this.corporation_editForm = Object.assign({}, row);
this.corporation_dialog.editDialog = true;
},
/**
* 备案修改，对话框，关闭事件
*/
corporation_editDialogClosed() {
this.$refs.corporation_editFormRef.resetFields();
},
/**
* 备案修改
*/
corporation_edit() {
this.$refs.corporation_editFormRef.validate(valid => {
// 未通过，表单预校验
if (!valid) return;
this.corporation_loading.editLoading = true;
updateCorporation(this.corporation_editForm).then((response) => {
let res = response.data;
if (res.code !== '200') {
this.corporation_loading.editLoading = false;
return this.$message.error(res.msg);
}
this.$message.success(res.msg);
this.corporation_loading.editLoading = false;
this.corporation_dialog.editDialog = false;
this.corporation_getList();
}).catch(error => {
this.corporation_loading.editLoading = false;
this.$message.error(error.toString());
});
})
},
/**
* corporation，批量删除---选中
*/
corporation_selectChange: function (selectList) {
this.corporation_page.selectList = selectList;
},
/**
* corporation，批量删除功能
*/
corporation_batchRemove() {
const ids = this.corporation_page.selectList.map(item => item.id).toString();
this.$confirm('此操作将永久删除选中的企业信息, 是否继续?', '警告', {
confirmButtonText: '确定删除',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
this.corporation_loading.listLoading = true;
let params = {id: ids};
batchRemoveCorporation(params).then(response => {
let res = response.data;
if (res.code !== '200') {
this.corporation_loading.listLoading = false;
return this.$message.error(res.msg);
}
this.$message.success(res.msg);
this.corporation_loading.listLoading = false;
this.corporation_getList();
}).catch(error => {
this.corporation_loading.listLoading = false;
this.$message.error(error.toString());
});
}).catch(() => {
});
},
/**
* corporation，删除功能
*/
corporation_delete(index, row) {
this.$confirm('此操作永久删除该企业信息, 是否继续?', '警告', {
confirmButtonText: '确定删除',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
this.corporation_loading.delLoading = true;
deleteCorporation(row).then((response) => {
let res = response.data;
if (res.code !== '200') {
this.corporation_loading.delLoading = false;
return this.$message.error(res.msg);
}
this.corporation_loading.delLoading = false;
this.$message.success(res.msg);
this.corporation_getList();
}).catch(error => {
this.corporation_loading.delLoading = false;
this.$message.error(error.toString());
});
}).catch(() => {
});
},
}
}
</script>
... ...
<template>
<div>
<el-card style="background-color: #F5F7FA">
<!-- 搜素区域 -->
<div>
<el-row :gutter="10">
<el-col :span="4">
<el-input v-model="driver_queryInfo.drName" prefix-icon="el-icon-search" size="small"
placeholder="驾驶员姓名" clearable></el-input>
</el-col>
<el-col :span="8">
<el-button type="success" style="width:120px" size="small" @click="driver_getList">
查询
</el-button>
<el-button type="primary" style="width:120px" size="small" @click="driver_toAddDialog">
备案添加
</el-button>
</el-col>
</el-row>
</div>
<!-- 列表区域 -->
<div style="margin-top: 20px;">
<el-table :data="driver_page.driverList" border size="mini" @selection-change="driver_selectChange"
v-loading="driver_loading.listLoading" element-loading-text="获取驾驶员列表，拼命加载中">
<el-table-column type="selection" width="55" align="center"></el-table-column>
<el-table-column type="index" align="center"></el-table-column>
<el-table-column label="主管海关代码" prop="mainPort" align="center" width="150"></el-table-column>
<el-table-column label="驾驶员姓名" prop="drName" align="center" width="150"></el-table-column>
<!-- 驾驶员id，用的是身份证号/护照 -->
<el-table-column label="驾驶员ID" prop="idCard" align="center" width="150"></el-table-column>
<el-table-column label="性别" prop="gender" align="center" width="150"></el-table-column>
<el-table-column label="籍贯" prop="drNative" align="center" width="150"></el-table-column>
<el-table-column label="出生日期" prop="birthday" align="center" width="150"></el-table-column>
<el-table-column label="驾驶员分类" prop="drClassFlag" align="center" width="150"></el-table-column>
<el-table-column label="驾车资格编号" prop="quaId" align="center" width="150"></el-table-column>
<el-table-column label="驾车资格分类" prop="drQua" align="center" width="150"></el-table-column>
<el-table-column label="所在企业代码" prop="coCode" align="center" width="150"></el-table-column>
<el-table-column label="更新时间" prop="updateDate" align="center" width="150"></el-table-column>
<el-table-column label="操作" width="180px" align="center" fixed="right">
<template slot-scope="scope">
<el-tooltip effect="dark" content="编辑" placement="top-start" :enterable="false">
<el-button type="text" icon="el-icon-edit" size="mini"
@click="driver_toEditDialog(scope.$index,scope.row)">编辑
</el-button>
</el-tooltip>
<el-tooltip effect="dark" content="删除" placement="top-start" :enterable="false">
<el-button type="text" icon="el-icon-delete" size="mini"
:loading="driver_loading.delLoading"
@click="driver_delete(scope.$index,scope.row)">删除
</el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
</div>
<!-- 分页区域 -->
<div style="margin-top: 10px">
<el-row :gutter="24">
<el-col :span="5">
<el-button type="danger" icon="el-icon-delete"
:loading="driver_loading.listLoading"
:disabled="this.driver_page.selectList.length===0"
size="small"
@click="driver_batchRemove">批量删除
</el-button>
</el-col>
<el-col :span="10" style="margin-top: 5px">
<el-pagination
@size-change="driver_handleSizeChange"
@current-change="driver_handleCurrentChange"
:current-page="driver_queryInfo.pageNum"
:page-sizes="[10,30,50,100]"
:page-size="driver_queryInfo.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="driver_page.total">
</el-pagination>
</el-col>
</el-row>
</div>
</el-card>
<!-- 备案添加 -->
<div>
<el-dialog title="驾驶员信息：备案添加"
:visible.sync="driver_dialog.addDialog"
style="margin-top: -80px" text-align="center" width="65%"
@close="driver_addDialogClosed">
<el-form :inline="true" label-width="150px" status-icon style="margin-top: -10px;margin-left: 60px"
:model="driver_addForm" :rules="driver_addFormRules" ref="driver_addFormRef">
<el-form-item label="主管海关代码：" prop="mainPort">
<el-input v-model="driver_addForm.mainPort" style="width:240px" size="mini" clearable
placeholder="请输入海关代码">
</el-input>
</el-form-item>
<el-form-item label="所在企业代码：" prop="coCode">
<el-input v-model="driver_addForm.coCode" style="width:240px" size="mini" clearable
placeholder="请输入所在企业代码">
</el-input>
</el-form-item>
<el-form-item label="身份证号/护照：" prop="idCard">
<el-input v-model="driver_addForm.idCard" style="width:240px" size="mini" clearable
placeholder="请输入身份证号/护照">
</el-input>
</el-form-item>
<el-form-item label="驾驶员姓名：" prop="drName">
<el-input v-model="driver_addForm.drName" style="width:240px" size="mini" clearable
placeholder="请输入驾驶员姓名">
</el-input>
</el-form-item>
<el-form-item label="籍贯：" prop="drNative">
<el-input v-model="driver_addForm.drNative" style="width:240px" size="mini" clearable
placeholder="请输入籍贯">
</el-input>
</el-form-item>
<el-form-item label="性别：" prop="gender">
<el-select v-model="driver_addForm.gender" style="width: 240px" clearable size="small"
placeholder="请选择性别">
<el-option
v-for="item in genderList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="出生日期：" prop="birthday">
<el-date-picker v-model="driver_addForm.birthday" placeholder="出生日期"
type="date" value-format="yyyy-MM-dd"
size="mini" style="width:240px"></el-date-picker>
</el-form-item>
<el-form-item label="居住地址：" prop="liveAddr">
<el-input v-model="driver_addForm.liveAddr" style="width:240px" size="mini" clearable
placeholder="请输入居住地址">
</el-input>
</el-form-item>
<el-form-item label="申请人：" prop="proposer">
<el-input v-model="driver_addForm.proposer" style="width:240px" size="mini" clearable
placeholder="请输入申请人">
</el-input>
</el-form-item>
<el-form-item label="申请时间：" prop="proposeTime">
<el-date-picker v-model="driver_addForm.proposeTime" placeholder="申请时间"
type="datetime" value-format="yyyy-MM-dd HH:mm:ss"
size="mini" style="width:240px"></el-date-picker>
</el-form-item>
<el-form-item label="驾驶员分类：" prop="drClassFlag">
<el-select v-model="driver_addForm.drClassFlag" style="width: 240px" clearable size="small"
placeholder="请选择驾驶员分类">
<el-option
v-for="item in drClassFlagList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="驾车资格编号：" prop="quaId">
<el-input v-model="driver_addForm.quaId" style="width:240px" size="mini" clearable
placeholder="请输入驾车资格编号">
</el-input>
</el-form-item>
<el-form-item label="驾车资格：" prop="drQua">
<el-select v-model="driver_addForm.drQua" style="width: 240px" clearable size="small"
placeholder="请选择驾车资格">
<el-option
v-for="item in drQuaList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="备注：" prop="memo">
<el-input v-model="driver_addForm.memo" style="width:240px" size="mini" clearable
placeholder="请输入备注">
</el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center;margin-top: -30px">
<el-button type="info" @click="driver_dialog.addDialog = false" size="medium"
style="width: 100px">取消
</el-button>
<el-button type="primary" @click="driver_add" :loading="driver_loading.addLoading"
size="medium" style="width: 100px">保存
</el-button>
</div>
</el-dialog>
</div>
<!-- 备案修改 -->
<div>
<el-dialog title="驾驶员信息：备案修改"
:visible.sync="driver_dialog.editDialog"
style="margin-top: -80px" text-align="center" width="65%"
@close="driver_editDialogClosed">
<el-form :inline="true" label-width="150px" status-icon style="margin-top: -10px;margin-left: 60px"
:model="driver_editForm" :rules="driver_editFormRules" ref="driver_editFormRef">
<el-form-item label="主管海关代码：" prop="mainPort">
<el-input v-model="driver_editForm.mainPort" style="width:240px" size="mini" clearable
placeholder="请输入海关代码">
</el-input>
</el-form-item>
<el-form-item label="所在企业代码：" prop="coCode">
<el-input v-model="driver_editForm.coCode" style="width:240px" size="mini" clearable
placeholder="请输入所在企业代码">
</el-input>
</el-form-item>
<el-form-item label="身份证号/护照：" prop="idCard">
<el-input v-model="driver_editForm.idCard" style="width:240px" size="mini" clearable
placeholder="请输入身份证号/护照">
</el-input>
</el-form-item>
<el-form-item label="驾驶员姓名：" prop="drName">
<el-input v-model="driver_editForm.drName" style="width:240px" size="mini" clearable
placeholder="请输入驾驶员姓名">
</el-input>
</el-form-item>
<el-form-item label="籍贯：" prop="drNative">
<el-input v-model="driver_editForm.drNative" style="width:240px" size="mini" clearable
placeholder="请输入籍贯">
</el-input>
</el-form-item>
<el-form-item label="性别：" prop="gender">
<el-select v-model="driver_editForm.gender" style="width: 240px" clearable size="small"
placeholder="请选择性别">
<el-option
v-for="item in genderList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="出生日期：" prop="birthday">
<el-date-picker v-model="driver_editForm.birthday" placeholder="出生日期"
type="date" value-format="yyyy-MM-dd"
size="mini" style="width:240px"></el-date-picker>
</el-form-item>
<el-form-item label="居住地址：" prop="liveAddr">
<el-input v-model="driver_editForm.liveAddr" style="width:240px" size="mini" clearable
placeholder="请输入居住地址">
</el-input>
</el-form-item>
<el-form-item label="申请人：" prop="proposer">
<el-input v-model="driver_editForm.proposer" style="width:240px" size="mini" clearable
placeholder="请输入申请人">
</el-input>
</el-form-item>
<el-form-item label="申请时间：" prop="proposeTime">
<el-date-picker v-model="driver_editForm.proposeTime" placeholder="申请时间"
type="datetime" value-format="yyyy-MM-dd HH:mm:ss"
size="mini" style="width:240px"></el-date-picker>
</el-form-item>
<el-form-item label="驾驶员分类：" prop="drClassFlag">
<el-select v-model="driver_editForm.drClassFlag" style="width: 240px" clearable size="small"
placeholder="请选择驾驶员分类">
<el-option
v-for="item in drClassFlagList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="驾车资格编号：" prop="quaId">
<el-input v-model="driver_editForm.quaId" style="width:240px" size="mini" clearable
placeholder="请输入驾车资格编号">
</el-input>
</el-form-item>
<el-form-item label="驾车资格：" prop="drQua">
<el-select v-model="driver_editForm.drQua" style="width: 240px" clearable size="small"
placeholder="请选择驾车资格">
<el-option
v-for="item in drQuaList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="备注：" prop="memo">
<el-input v-model="driver_editForm.memo" style="width:240px" size="mini" clearable
placeholder="请输入备注">
</el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center;margin-top: -30px">
<el-button type="info" @click="driver_dialog.editDialog = false" size="medium"
style="width: 100px">取消
</el-button>
<el-button type="primary" @click="driver_edit" :loading="driver_loading.editLoading"
size="medium" style="width: 100px">保存
</el-button>
</div>
</el-dialog>
</div>
</div>
</template>
<script>
import {
selectDriverList,
insertDriver,
updateDriver,
deleteDriver,
batchRemoveDriver,
} from "../../api/vehicle_dispatch";
export default {
name: "Driver"
name: "Driver",
data() {
return {
/**
* 搜索参数
*/
driver_queryInfo: {
// 驾驶员姓名
drName: '',
// 当前页数
pageNum: 1,
// 每页大小
pageSize: 10,
},
/**
* driver，分页
*/
driver_page: {
driverList: [],
total: 0,
selectList: [],
},
/**
* 加载
*/
driver_loading: {
listLoading: false,
addLoading: false,
editLoading: false,
delLoading: false,
batchDelLoading: false,
approvalLoading: false,
},
/**
* 对话框
*/
driver_dialog: {
addDialog: false,
editDialog: false,
},
/**
* 备案添加，表单
*/
driver_addForm: {
// 主管海关代码
mainPort: '',
// 所在企业代码
coCode: '',
// 身份证号/护照
idCard: '',
// 驾驶员姓名
drName: '',
// 籍贯
drNative: '',
// 性别
gender: '',
// 出生日期
birthday: undefined,
// 居住地址
liveAddr: '',
// 申请人
proposer: '',
// 申请时间
proposeTime: undefined,
// 驾驶员分类
drClassFlag: '',
// 驾车资格编号
quaId: '',
// 驾车资格
drQua: '',
// 备注
memo: '',
},
/**
* 备案添加，表单验证规则
*/
driver_addFormRules: {
// 驾驶员姓名
drName: [
{required: true, message: '请输入驾驶员姓名', trigger: ['blur', 'change']},
],
// 驾车资格编号
quaId: [
{required: true, message: '请输入驾车资格编号', trigger: ['blur', 'change']},
],
},
/**
* 驾驶员分类
*/
drClassFlagList: [
{
value: '1',
label: '经营性进出境公路运输工具驾驶员'
},
{
value: '2',
label: '经营性来往港澳公路运输工具驾驶员'
},
{
value: '3',
label: '非经营性进出境交通工具驾驶员'
},
{
value: '4',
label: '非经营性来往港澳公路交通工具驾驶员'
},
],
/**
* 性别
*/
genderList: [
{
value: '男',
label: '男'
},
{
value: '女',
label: '女'
},
],
/**
* 驾车资格
*/
drQuaList: [
{
value: '1',
label: '经营性来往港澳公路运输工具驾驶资格'
},
{
value: '2',
label: '经营性进出境公路运输工具驾驶资格'
},
{
value: '3',
label: '境内公路承运海关监管货物运输工具驾驶资格'
},
{
value: '4',
label: '非经营性来往港澳公路交通工具驾驶资格'
},
{
value: '5',
label: '非经营性进出境公路交通工具驾驶资格'
},
],
/**
* 备案修改，表单
*/
driver_editForm: {},
/**
* 备案修改，表单验证规则
*/
driver_editFormRules: {
// 驾驶员姓名
drName: [
{required: true, message: '请输入驾驶员姓名', trigger: ['blur', 'change']},
],
// 驾车资格编号
quaId: [
{required: true, message: '请输入驾车资格编号', trigger: ['blur', 'change']},
],
},
}
},
methods: {
/**
* 分页查询，监听 pageSize 改变的事件
* 刷新列表
*/
driver_handleSizeChange(newSize) {
this.driver_queryInfo.pageSize = newSize;
this.driver_getList();
},
/**
* 分页查询，监听 pageNum 改变的事件
* 刷新列表
*/
driver_handleCurrentChange(newPage) {
this.driver_queryInfo.pageNum = newPage;
this.driver_getList();
},
/**
* 列表查询
*/
driver_getList() {
this.driver_loading.listLoading = true;
selectDriverList(this.driver_queryInfo).then((response) => {
let res = response.data;
if (res.code !== '200') {
this.driver_loading.listLoading = false;
return this.$message.error(res.msg);
}
this.driver_page.driverList = res.data.list;
this.driver_page.total = res.data.total;
this.driver_loading.listLoading = false;
}).catch(error => {
this.driver_loading.listLoading = false;
this.$message.error(error.toString());
});
},
/**
* 对话框，备案添加，打开事件
*/
driver_toAddDialog() {
this.driver_dialog.addDialog = true;
},
/**
* 对话框，备案添加，关闭事件
*/
driver_addDialogClosed() {
this.$refs.driver_addFormRef.resetFields();
},
/**
* 备案添加
*/
driver_add() {
this.$refs.driver_addFormRef.validate(valid => {
// 未通过，表单预校验
if (!valid) return;
this.driver_loading.addLoading = true;
insertDriver(this.driver_addForm).then((response) => {
let res = response.data;
if (res.code !== '200') {
this.driver_loading.addLoading = false;
return this.$message.error(res.msg);
}
this.$message.success(res.msg);
this.driver_loading.addLoading = false;
this.driver_dialog.addDialog = false;
this.driver_getList();
}).catch(error => {
this.driver_loading.addLoading = false;
this.$message.error(error.toString());
});
})
},
/**
* 备案修改，对话框，打开事件
*/
driver_toEditDialog(index, row) {
this.driver_editForm = Object.assign({}, row);
this.driver_dialog.editDialog = true;
},
/**
* 备案修改，对话框，关闭事件
*/
driver_editDialogClosed() {
this.$refs.driver_editFormRef.resetFields();
},
/**
* 备案修改
*/
driver_edit() {
this.$refs.driver_editFormRef.validate(valid => {
// 未通过，表单预校验
if (!valid) return;
this.driver_loading.editLoading = true;
updateDriver(this.driver_editForm).then((response) => {
let res = response.data;
if (res.code !== '200') {
this.driver_loading.editLoading = false;
return this.$message.error(res.msg);
}
this.$message.success(res.msg);
this.driver_loading.editLoading = false;
this.driver_dialog.editDialog = false;
this.driver_getList();
}).catch(error => {
this.driver_loading.editLoading = false;
this.$message.error(error.toString());
});
})
},
/**
* 批量删除---选中
*/
driver_selectChange: function (selectList) {
this.driver_page.selectList = selectList;
},
/**
* driver，批量删除功能
*/
driver_batchRemove() {
const ids = this.driver_page.selectList.map(item => item.id).toString();
this.$confirm('此操作将永久删除选中的驾驶员信息, 是否继续?', '警告', {
confirmButtonText: '确定删除',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
this.driver_loading.listLoading = true;
let params = {id: ids};
batchRemoveDriver(params).then(response => {
let res = response.data;
if (res.code !== '200') {
this.driver_loading.listLoading = false;
return this.$message.error(res.msg);
}
this.$message.success(res.msg);
this.driver_loading.listLoading = false;
this.driver_getList();
}).catch(error => {
this.driver_loading.listLoading = false;
this.$message.error(error.toString());
});
}).catch(() => {
});
},
/**
* driver，删除功能
*/
driver_delete(index, row) {
this.$confirm('此操作永久删除该车辆信息, 是否继续?', '警告', {
confirmButtonText: '确定删除',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
this.driver_loading.delLoading = true;
deleteDriver(row).then((response) => {
let res = response.data;
if (res.code !== '200') {
this.driver_loading.delLoading = false;
return this.$message.error(res.msg);
}
this.driver_loading.delLoading = false;
this.$message.success(res.msg);
this.driver_getList();
}).catch(error => {
this.driver_loading.delLoading = false;
this.$message.error(error.toString());
});
}).catch(() => {
});
},
}
}
</script>
<style scoped>
... ...
<template>
<el-container>
<el-main>
<el-card style="background-color: #F5F7FA">
<!-- 搜素区域 -->
<div>
... ... @@ -30,6 +29,11 @@
<el-table-column label="挂车车架号" prop="frameNo" align="center" width="150"></el-table-column>
<el-table-column label="挂车注册地" prop="trailerRegPlace" align="center" width="120"></el-table-column>
<el-table-column label="挂车重量" prop="trailerWt" align="center" width="80"></el-table-column>
<el-table-column label="挂车牌号图片" prop="trailerLicenseNoPic" align="center" width="120">
<template slot-scope="scope">
<img :src="scope.row.trailerLicenseNoPic" alt="" style="width: 60px;height: 60px">
</template>
</el-table-column>
<el-table-column label="挂车类型" prop="trailerClassFlag" align="center" width="100"></el-table-column>
<el-table-column label="挂车颜色" prop="trailerColor" align="center" width="100"></el-table-column>
<el-table-column label="更新时间" prop="updateDate" align="center" width="140"></el-table-column>
... ... @@ -75,7 +79,6 @@
</el-row>
</div>
</el-card>
</el-main>
<!-- 备案添加 -->
<div>
<el-dialog title="挂车信息：备案添加"
... ... @@ -135,13 +138,12 @@
</el-input>
</el-form-item>
<el-form-item label="挂车牌号图片：" prop="trailerLicenseNoPic">
<img v-if="!trailer_config.progressFlag" style="width: 100px;height: 100px" :src="trailer_config.imageUrl"/>
<img v-if="trailer_config.progressFlag" style="width: 100px;height: 100px" :src="trailer_config.imageUrl"/>
<el-upload
style="display: inline; margin-left: 10px;margin-right: 10px;"
action=""
:show-file-list="true"
:http-request="uploadFile"
:http-request="add_uploadFile"
:limit=1
:on-preview="handPreView"
:on-exceed="fileExceed"
... ... @@ -175,8 +177,70 @@
placeholder="请输入海关代码">
</el-input>
</el-form-item>
<el-form-item label="挂车牌号：" prop="trailerLicenseNo">
<el-input v-model="trailer_editForm.trailerLicenseNo" style="width:240px" size="mini" clearable
placeholder="请输入挂车牌号">
</el-input>
</el-form-item>
<el-form-item label="挂车注册地：" prop="trailerRegPlace">
<el-input v-model="trailer_editForm.trailerRegPlace" style="width:240px" size="mini" clearable
placeholder="请输入挂车注册地">
</el-input>
</el-form-item>
<el-form-item label="车架号码：" prop="frameNo">
<el-input v-model="trailer_editForm.frameNo" style="width:240px" size="mini" clearable
placeholder="请输入车架号码">
</el-input>
</el-form-item>
<el-form-item label="挂车重量：" prop="trailerWt">
<el-input v-model="trailer_editForm.trailerWt" style="width:240px" size="mini" clearable
placeholder="请输入挂车重量">
</el-input>
</el-form-item>
<el-form-item label="挂车颜色：" prop="trailerColor">
<el-input v-model="trailer_editForm.trailerColor" style="width:240px" size="mini" clearable
placeholder="请输入挂车颜色">
</el-input>
</el-form-item>
<el-form-item label="申请人：" prop="proposer">
<el-input v-model="trailer_editForm.proposer" style="width:240px" size="mini" clearable
placeholder="请输入申请人">
</el-input>
</el-form-item>
<el-form-item label="申请时间：" prop="proposeTime">
<el-date-picker v-model="trailer_editForm.proposeTime" clearable type="datetime"
value-format="yyyy-MM-dd HH:mm:ss" placeholder="申请时间" size="mini" style="width:240px"></el-date-picker>
</el-form-item>
<el-form-item label="挂车备案类别：" prop="trailerClassFlag">
<el-input v-model="trailer_editForm.trailerClassFlag" style="width:240px" size="mini" clearable
placeholder="请输入挂车备案类别">
</el-input>
</el-form-item>
<el-form-item label="数据操作类型：" prop="operationType">
<el-input v-model="trailer_editForm.operationType" style="width:240px" size="mini" clearable
placeholder="请输入数据操作类型">
</el-input>
</el-form-item>
<el-form-item label="挂车牌号图片：" prop="trailerLicenseNoPic">
<img v-if="trailer_config.edit_progressFlag" style="width: 100px;height: 100px" :src="trailer_config.edit_imageUrl"/>
<el-upload
style="display: inline; margin-left: 10px;margin-right: 10px;"
action=""
:show-file-list="true"
:http-request="edit_uploadFile"
:limit=1
:on-preview="handPreView"
:on-exceed="fileExceed"
accept="image/jpeg,image/jpg,image/png"
ref="fileupload">
<el-button slot="trigger" size="small" type="primary">上传图片</el-button>
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
</el-upload>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center;margin-top: -30px">
<el-button type="info" @click="trailer_dialog.editDialog = false" size="medium"
style="width: 100px">取消
... ... @@ -206,8 +270,11 @@
return {
trailerUpload: '',
trailer_config: {
progressFlag: true,
progressFlag: false,
imageUrl: '',
edit_progressFlag: false,
edit_imageUrl: '',
},
/**
... ... @@ -357,6 +424,10 @@
*/
trailer_addDialogClosed() {
this.$refs.trailer_addFormRef.resetFields();
// 把上传图片清空
this.trailer_config.progressFlag = false;
this.trailer_config.imageUrl = undefined;
this.trailer_addForm.trailerLicenseNoPic = undefined;
},
/**
... ... @@ -397,6 +468,11 @@
*/
trailer_editDialogClosed() {
this.$refs.trailer_editFormRef.resetFields();
// 把上传图片清空
this.trailer_config.edit_progressFlag = false;
this.trailer_config.edit_imageUrl = undefined;
this.trailer_editForm.trailerLicenseNoPic = undefined;
},
/**
... ... @@ -486,8 +562,8 @@
}).catch(() => {
});
},
// 自定义上传
uploadFile(item) {
// 备案添加时，自定义上传（后端暂为临时路径）
add_uploadFile(item) {
const form = new FormData()
form.append('file', item.file)
uploadFileImage(form).then(response => {
... ... @@ -495,10 +571,29 @@
if (res.code !== '200') {
this.$message.error(res.msg)
}
this.$message.success(res.msg);
item.onSuccess()
this.trailer_config.progressFlag = false;
this.trailer_config.imageUrl = res.data;
this.trailer_addForm.trailerLicenseNoPic = this.trailer_config.imageUrl;
this.trailer_config.progressFlag = true;
item.onSuccess();
this.$message.success(res.msg);
})
},
// 备案修改时，自定义上传
edit_uploadFile(item) {
const form = new FormData()
form.append('file', item.file)
uploadFileImage(form).then(response => {
let res = response.data;
if (res.code !== '200') {
this.$message.error(res.msg)
}
this.trailer_config.edit_imageUrl = res.data;
this.trailer_editForm.trailerLicenseNoPic = this.trailer_config.edit_imageUrl;
this.trailer_config.edit_progressFlag = true;
item.onSuccess();
this.$message.success(res.msg);
})
},
fileExceed() {
... ...
... ... @@ -52,7 +52,8 @@
</el-tooltip>
<el-tooltip effect="dark" content="审批" placement="top-start" :enterable="false">
<el-button type="text" icon="el-icon-star-off" size="mini"
@click="vehicle_audit">审批
:loading="vehicle_loading.approvalLoading"
@click="vehicle_audit(scope.$index,scope.row)">审批
</el-button>
</el-tooltip>
</template>
... ... @@ -292,7 +293,7 @@
</template>
<script>
import {selectVehicleList, insertVehicle, updateVehicle, batchRemoveVehicle, deleteVehicle} from "../../api/vehicle_dispatch";
import {selectVehicleList, insertVehicle, updateVehicle, batchRemoveVehicle, deleteVehicle, approvalVehicle} from "../../api/vehicle_dispatch";
export default {
name: "Vehicle",
... ... @@ -333,6 +334,7 @@
editLoading: false,
delLoading: false,
batchDelLoading: false,
approvalLoading: false,
},
/**
... ... @@ -656,13 +658,29 @@
/**
* 审计
*/
vehicle_audit() {
vehicle_audit(index, row) {
this.$confirm('确认要审批吗?', '系统提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}
)
).then(() => {
this.vehicle_loading.approvalLoading = true;
approvalVehicle(row).then((response) => {
let res = response.data;
if (res.code !== '200') {
this.vehicle_loading.approvalLoading = false;
return this.$message.error(res.msg);
}
this.vehicle_loading.approvalLoading = false;
this.$message.success(res.msg);
this.vehicle_getList();
}).catch(error => {
this.vehicle_loading.approvalLoading = false;
this.$message.error(error.toString());
});
}).catch(() => {
});
},
},
created() {
... ...