<template>
|
<div class="main">
|
<div>
|
<searchBar v-if="searchType" :search-type="searchType" @handleSearch="handleSearch" @handleAdd="handleOpenDialog(null,'add')" />
|
<div class="tab">
|
<el-table
|
:data="tableData"
|
border
|
size="mini"
|
max-height="680"
|
style="width: 100%"
|
:header-cell-style="{
|
color: '#101111', fontSize: '16px'
|
}"
|
>
|
<el-table-column
|
type="index"
|
label="序号"
|
width="60px"
|
align="center"
|
/>
|
<el-table-column
|
align="center"
|
prop="allocationNum"
|
label="单号"
|
/>
|
<el-table-column
|
align="center"
|
prop="createTime"
|
label="时间"
|
/>
|
<el-table-column
|
align="center"
|
prop="unitId"
|
label="责任单位"
|
:formatter="unitIdFormatter"
|
/>
|
<el-table-column
|
align="center"
|
prop="polluteType"
|
label="污染分类"
|
:formatter="polluteTypeFormatter"
|
/>
|
<el-table-column
|
align="center"
|
prop="changeType"
|
label="整改类型"
|
>
|
<template slot-scope="scope">
|
<div> {{ dictObj.changeEnum[scope.row.changeType] }}</div>
|
</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="extensionNum"
|
width="60px"
|
label="延期天数"
|
>
|
<template slot-scope="scope">
|
<div> {{ scope.row.extensionNum }}天</div>
|
</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="address"
|
width="80px"
|
label="状态"
|
>
|
<template slot-scope="scope">
|
<el-tag v-if="scope.row.state===40" type="success" size="medium ">
|
{{ stateFormatter(scope.row) }}
|
</el-tag>
|
<el-tag v-if="scope.row.state===50" type="danger" size="medium ">
|
{{ stateFormatter(scope.row) }}
|
</el-tag>
|
<el-tag v-if="scope.row.state===9" type="info" size="medium ">
|
{{ stateFormatter(scope.row) }}
|
</el-tag>
|
<el-tag v-if="scope.row.state===20" type="warning" size="medium ">
|
{{ stateFormatter(scope.row) }}
|
</el-tag>
|
<el-tag v-if="scope.row.state===10" type="warning" size="medium ">
|
{{ stateFormatter(scope.row) }}
|
</el-tag>
|
<el-tag v-if="scope.row.state===30" type="warning" size="medium ">
|
{{ stateFormatter(scope.row) }}
|
</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
>
|
<template slot="header">
|
<div>上报单位</div>
|
<div>上报人</div>
|
</template>
|
<template slot-scope="scope">
|
<div> {{ scope.row.escalationName }}</div>
|
<div> {{ updatUnitIdFormatter(scope.row) }}</div>
|
|
</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
>
|
<template slot="header">
|
<div>操作人</div>
|
<div>操作时间</div>
|
</template>
|
<template slot-scope="scope">
|
<div>{{ scope.row.updateName }}</div>
|
<div>{{ scope.row.updateTime }}</div>
|
</template>
|
</el-table-column>
|
<el-table-column
|
align="center"
|
prop="address"
|
width="100px"
|
label="操作"
|
>
|
<template slot-scope="scope">
|
<el-button type="text" size="medium" @click="openWorkOrdinDialog(scope.row,'detail')">详情</el-button>
|
<el-button v-if="scope.row.state===30" type="text" size="medium" @click="openWorkOrdinDialog(scope.row,'approve')">审批</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
<div class="pagina">
|
<el-pagination
|
background
|
:current-page="pagination.currentPage"
|
:page-sizes="pagination.pageSizes"
|
:page-size="pagination.PageSize"
|
:total="pagination.totalCount"
|
layout="sizes,prev, pager, next, jumper"
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"
|
/>
|
</div>
|
</div>
|
<workOrderInformation v-if="workOrdinDialogVisible" :dialog-data="dialogData" :visible.sync="workOrdinDialogVisible" @handeleSumit="handeleWorkSumbit" />
|
</div>
|
</template>
|
|
<script>
|
import workOrderInformation from '@/views/toCarryOutLegislativeReforms/components/workOrderInformation'
|
import searchBar from '@/views/toCarryOutLegislativeReforms/delay/componets/queryForm'
|
export default {
|
components: {
|
searchBar,
|
workOrderInformation
|
},
|
data() {
|
return {
|
Dic: JSON.parse(localStorage.getItem('dict')),
|
dictObj: JSON.parse(localStorage.getItem('dictObj')),
|
workOrdinDialogVisible: false,
|
formData: {},
|
tableData: [],
|
polluteList: [],
|
unitList: [],
|
searchType: 'delay',
|
pagination: {
|
currentPage: 1,
|
// 总条数,根据接口获取数据长度(注意:这里不能为空)
|
totalCount: 0,
|
// 个数选择器(可修改)
|
pageSizes: [10, 20, 30, 40],
|
// 默认每页显示的条数(可修改)
|
pageSize: 10
|
},
|
searchData: {}
|
}
|
},
|
created() {
|
this.getUnitList()
|
this.getContaminateList()
|
this.handleSearch()
|
},
|
methods: {
|
handeleWorkSumbit() {
|
this.handleSearch()
|
},
|
handleSearch(obj) {
|
this.searchData.isInvalid = 0
|
if (obj) {
|
this.searchData = obj
|
}
|
this.$request({
|
url: '/allocationExtension/page',
|
method: 'post',
|
data: {
|
...obj,
|
'page': this.pagination
|
}
|
}).then((res) => {
|
this.tableData = res.data.list
|
this.pagination.totalCount = res.data.page.totalNum
|
})
|
},
|
// 分页
|
// 每页显示的条数
|
handleSizeChange(val) {
|
// 改变每页显示的条数
|
this.pagination.PageSize = val
|
// 注意:在改变每页显示的条数时,要将页码显示到第一页
|
this.pagination.currentPage = 1
|
this.handleSearch()
|
},
|
// 显示第几页
|
handleCurrentChange(val) {
|
// 改变默认的页数
|
this.pagination.currentPage = val
|
this.handleSearch()
|
// console.log(val)
|
},
|
openWorkOrdinDialog(row, type) {
|
this.$request({
|
url: '/allocationExtension/detail',
|
method: 'get',
|
params: {
|
id: row.id
|
}
|
}).then((res) => {
|
this.parentFormData = res.data
|
this.workOrdinDialogVisible = true
|
if (type === 'detail') {
|
this.dialogData = {
|
title: '审批交办单',
|
parentFormData: res.data,
|
pageState: 'view',
|
pageType: 'delay',
|
sysCode: '1010202'
|
}
|
} else if (type === 'approve') {
|
this.dialogData = {
|
title: '延期申请审批',
|
parentFormData: res.data,
|
pageState: 'edit',
|
pageType: 'delay',
|
sysCode: '1010202'
|
}
|
}
|
})
|
},
|
updatUnitIdFormatter(val) {
|
const data = this.unitList.find(item => item && item.unitId === val.escalationUnitId)
|
return data ? data.unitName : ''
|
},
|
unitIdFormatter(val) {
|
const data = this.unitList.find(item => item && item.unitId === val.unitId)
|
return data ? data.unitName : ''
|
},
|
polluteTypeFormatter(val) {
|
const data = this.polluteList.find(item => item && parseInt(item.dataKey) === val.polluteType)
|
return data ? data.dataValue : ''
|
},
|
investigationTypeFormatter(val) {
|
return this.dictObj.investigationEnum[val.investigationType]
|
},
|
stateFormatter(val) {
|
return this.dictObj.allocationApproveEnum[val.state]
|
},
|
isInvalidFormatter(val) {
|
return this.dictObj.yesOrNo[val.isInvalid]
|
},
|
// 获取责任单位list
|
getUnitList() {
|
this.$request({
|
url: '/allocation/unit',
|
method: 'get'
|
}).then((res) => {
|
this.unitList = res.data
|
console.log(' JSON.stringify(this.unitList)', this.unitList)
|
})
|
},
|
getContaminateList() {
|
this.$request({
|
url: '/allocation/contaminate',
|
method: 'get'
|
}).then((res) => {
|
this.polluteList = res.data
|
})
|
}
|
}
|
}
|
</script>
|
|
<style scoped lang="scss">
|
.main{
|
padding: 20px;
|
padding-top: 0px;
|
height: 100%;
|
overflow: overlay;
|
}
|
.tab {
|
margin-top: 0px;
|
/deep/ .el-tag{
|
font-size: 16px;
|
}
|
}
|
// /deep/ .el-table__body-wrapper {
|
// overflow: scroll;
|
// position: relative;
|
// overflow-x: hidden;
|
// max-height: 400px;
|
// }
|
.pagina{
|
margin-top: 10px;
|
}
|
/deep/ .el-table__row{
|
font-size: 18px;
|
}
|
.el-pagination {
|
padding: 0;
|
.el-select{
|
/deep/.el-input{
|
margin:0;
|
}
|
}
|
|
}
|
</style>
|