qa-regulatory-gwj-vue/src/views/freightVehicles/publicAuidt/components/list.vue

292 lines
9.7 KiB
Vue

<template>
<div class="app-container">
<div class="filter-container">
<el-form ref="form" v-model="form">
<el-row>
<el-col :span="5">
<el-form-item label="车牌号:">
<el-input v-model="form.LICENCE_NO" placeholder="搜索" class="filter-item" style="width: 200px;"/>
</el-form-item>
</el-col>
<el-col :span="4">
<el-button v-waves class="filter-item" type="primary" icon="el-icon-search" @click="getQuery"></el-button>
<el-button v-waves class="filter-item" type="success" icon="el-icon-refresh" @click="reset"></el-button>
</el-col>
</el-row>
</el-form>
</div>
<el-table
v-loading="listLoading"
ref="multipleTable"
:data="varList"
:row-key="getRowKey"
:header-cell-style="{
'font-weight': 'bold',
'color': '#000'
}"
tooltip-effect="dark"
border
fit
highlight-current-row
>
<el-table-column
:reserve-selection="true"
type="selection"
width="55"
align="center"/>
<el-table-column type="index" label="序号" width="50" align="center" />
<el-table-column prop="LICENCE_NO" label="车牌号"/>
<el-table-column label="车牌类型" align="center">
<template slot-scope="{row}">
{{ translateLicenceType(row.LICENCE_TYPE) }}
</template>
</el-table-column>
<el-table-column label="车辆类型" align="center">
<template slot-scope="{row}">
{{ translateVehicleType(row.VEHICLE_TYPE) }}
</template>
</el-table-column>
<el-table-column prop="CONTACT" label="联系人"/>
<el-table-column prop="PHONE" label="联系人电话"/>
<el-table-column prop="APPLY_TIME" label="申请访问时间"/>
<el-table-column label="审核状态" align="center" width="120">
<template slot-scope="{row}">
{{ getType(row.IS_AUDIT) }}
</template>
</el-table-column>
<el-table-column label="操作" align="left" width="300">
<template slot-scope="{row}">
<el-button type="primary" icon="el-icon-view" size="mini" @click="detail(row)">详情</el-button>
<el-button v-if="checkButton(row)" type="success" icon="el-icon-check" size="mini" @click="approve(row)">审核</el-button>
</template>
</el-table-column>
</el-table>
<div class="page-btn-group">
<div/><div/>
<pagination :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getList" />
</div>
<send-util ref="sendUtil" append-to-body @refresh="getList"/>
<el-dialog :title="detailTitle" :visible.sync="dialogVisible" width="50%">
<el-form :model="detailForm" label-width="120px">
<el-form-item label="排放标准">
<el-input v-model="detailForm.EMISSION_STANDARDS" readonly />
</el-form-item>
<el-form-item label="驾驶证图片">
<el-image
:src="config.fileUrl + detailForm.DRIVING_LICENSE"
style="width: 100px; height: 100px"
:preview-src-list="[config.fileUrl + detailForm.DRIVING_LICENSE]"
/>
</el-form-item>
<el-form-item label="绿本图片">
<el-image
:src="config.fileUrl + detailForm.GREEN_BOOK"
style="width: 100px; height: 100px"
:preview-src-list="[config.fileUrl + detailForm.GREEN_BOOK]"
/>
</el-form-item>
<el-form-item label="环保随车清单图片">
<el-image
:src="config.fileUrl + detailForm.ECO_FRIENDLY_CHECKLIST"
style="width: 100px; height: 100px"
:preview-src-list="[config.fileUrl + detailForm.ECO_FRIENDLY_CHECKLIST]"
/>
</el-form-item>
<el-form-item label="出厂合格证图片">
<el-image
:src="config.fileUrl + detailForm.FACTORY_CERTIFICATE"
style="width: 100px; height: 100px"
:preview-src-list="[config.fileUrl + detailForm.FACTORY_CERTIFICATE]"
/>
</el-form-item>
<el-form-item label="环保信息截图图片">
<el-image
:src="config.fileUrl + detailForm.ENVIRONMENTAL_SCREENSHOTS"
style="width: 100px; height: 100px"
:preview-src-list="[config.fileUrl + detailForm.ENVIRONMENTAL_SCREENSHOTS]"
/>
</el-form-item>
<el-form-item label="访问起始时间">
<el-input v-model="detailForm.VISIT_START_TIME" readonly />
</el-form-item>
<el-form-item label="访问结束时间">
<el-input v-model="detailForm.VISIT_END_TIME" readonly />
</el-form-item>
<el-form-item label="访问口门名称">
<el-input v-model="detailForm.DOOR_NAME" readonly />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false"></el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import Pagination from '@/components/Pagination' // 通过 el-pagination二次打包
import { requestFN } from '@/utils/request'
import SendUtil from './sendUtil.vue'
import formatDate from '../../../../utils/dateformat'
export default{
components: { SendUtil, Pagination },
data() {
return {
listQuery: {
page: 1,
limit: 10
},
config: config,
dialogVisible: false,
detailTitle: '详情',
detailForm: {
EMISSION_STANDARDS: '',
DRIVING_LICENSE: '',
GREEN_BOOK: '',
ECO_FRIENDLY_CHECKLIST: '',
CERTIFICATE_IMAGE: '',
FACTORY_CERTIFICATE: '',
ENVIRONMENTAL_SCREENSHOTS: '',
VISIT_START_TIME: '',
VISIT_END_TIME: '',
DOOR_NAME: ''
},
// 车牌类型列表
licenceTypeList: [
{ ID: '0', NAME: '白牌' },
{ ID: '1', NAME: '蓝牌' },
{ ID: '2', NAME: '黄牌' },
{ ID: '3', NAME: '绿牌' },
{ ID: '4', NAME: '黑牌' }
],
// 车辆类型列表
vehicleTypeList: [
// { ID: '', NAME: '请选择' },
{ ID: '0', NAME: '货车' },
{ ID: '1', NAME: '轿车' },
{ ID: '2', NAME: '大巴客车' }
],
IS_POLICE: '',
areaList: [], // 省市县列表
placeList: [],
listLoading: true,
varList: [],
total: 0,
title: '',
isShow: false,
form: {
LICENCE_NO: '',
PHONE: '',
ID_CARD: '',
CORPINFO_NAME: '',
DEPARTMENT_NAME: '',
VISIT_START_TIME: '',
VISIT_END_TIME: '',
DOOR_NAME: '',
IS_DANGEROUS_CAR: '1',
CORPINFO_ID: JSON.parse(sessionStorage.getItem('user')).CORPINFO_ID
}
}
},
created() {
this.getList()
this.getPermissions()
},
methods: {
checkButton(row){
console.log('---------------------')
console.log('row.IS_AUDIT:', row.IS_AUDIT);
console.log('this.IS_POLICE:', this.IS_POLICE);
if (row.IS_AUDIT === '0' && this.IS_POLICE === '1'){
return true
}else {
return false
}
},
translateLicenceType(id) {
for (var i = 0; i < this.licenceTypeList.length; i++) {
if (this.licenceTypeList[i].ID == id) return this.licenceTypeList[i].NAME
}
},
translateVehicleType(id) {
for (var i = 0; i < this.vehicleTypeList.length; i++) {
if (this.vehicleTypeList[i].ID == id) return this.vehicleTypeList[i].NAME
}
},
approve(row) {
this.$refs.sendUtil.init(row)
},
getType(AUDIT_TYPE) {
if (AUDIT_TYPE === '0') {
return '待交警支队审核'
} else if (AUDIT_TYPE === '1') {
return '待分公司审核'
} else if (AUDIT_TYPE === '2') {
return '审核通过'
} else if (AUDIT_TYPE === '3') {
return '审核驳回'
}
},
// 搜索
getQuery() {
this.$refs.multipleTable.clearSelection()
this.getList()
},
// 重置
reset() {
this.form.LICENCE_NO = ''
this.getList()
},
// 获取列表
getList() {
this.listLoading = true
requestFN(
'/mkmjManagement/freightVehiclesAudit?showCount=' + this.listQuery.limit + '&currentPage=' + this.listQuery.page, this.form
).then((data) => {
console.log(data)
this.listLoading = false
this.varList = data.varList
this.total = data.page.totalResult
this.hasButton()
this.pd = data.pd
}).catch((e) => {
this.listLoading = false
})
},
getPermissions(){
requestFN(
'/mkmjManagement/getPermissions'
).then((data) => {
this.IS_POLICE = data.pageData.IS_POLICE
console.log('IS_POLICE:', this.IS_POLICE)
})
},
detail(row) {
this.dialogVisible = true
requestFN(
'/mkmjManagement/getCarInfo',
{
VEHICLE_ID: row.VEHICLE_ID
}
).then((data) => {
this.detailForm.EMISSION_STANDARDS = data.pageData.EMISSION_STANDARDS
this.detailForm.DRIVING_LICENSE = data.pageData.DRIVING_LICENSE
this.detailForm.GREEN_BOOK = data.pageData.GREEN_BOOK
this.detailForm.ECO_FRIENDLY_CHECKLIST = data.pageData.ECO_FRIENDLY_CHECKLIST
this.detailForm.FACTORY_CERTIFICATE = data.pageData.FACTORY_CERTIFICATE
this.detailForm.ENVIRONMENTAL_SCREENSHOTS = data.pageData.ENVIRONMENTAL_SCREENSHOTS
this.detailForm.VISIT_START_TIME = formatDate(data.pageData.VISIT_START_TIME, 'YYYY-MM-DD HH:mm:ss')
this.detailForm.VISIT_END_TIME = formatDate(data.pageData.VISIT_END_TIME, 'YYYY-MM-DD HH:mm:ss')
this.detailForm.DOOR_NAME = data.pageData.DOOR_NAME
}).catch((e) => {
this.listLoading = false
})
}
}
}
</script>