<template>
|
<div class="main">
|
<div>
|
<searchBar v-if="searchType" :search-type="'reform'" @handleSearch="handleSearchBut" @handleAdd="handleOpenDialog(null, 'add')" />
|
<newWorkOrder v-if="centerDialogVisible" ref="newWorkOrder" :parent-form-data="parentFormData" :title="title" :page-state="pageState" :visible.sync="centerDialogVisible" @handleSubmit="newHandleSubmit" />
|
<div class="tab">
|
<el-table size="mini" :data="tableData" border 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">
|
<template slot="header">
|
<div>单号</div>
|
<div>上报时间</div>
|
</template>
|
<template slot-scope="scope">
|
<div>{{ scope.row.allocationNum }}</div>
|
<div>{{ scope.row.escalationTime }}</div>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" prop="unitId" label="责任主体" :formatter="unitIdFormatter" />
|
<el-table-column align="center" prop="polluteType" label="污染分类" width="120px" :formatter="polluteTypeFormatter" />
|
<el-table-column align="center">
|
<template slot="header">
|
<div>整改方式</div>
|
<div>剩余天数</div>
|
</template>
|
<template slot-scope="scope">
|
<div>{{ dictObj.changeEnum[scope.row.changeType] }}</div>
|
<div v-show="scope.row.changeType && scope.row.changeType === 2" :class="[Number(scope.row.residueDay) < 0 ? errorClass : '']">
|
<span v-if="Number(scope.row.residueDay) < 0">
|
延期 {{ Math.abs(scope.row.residueDay) }}天
|
</span>
|
<span v-else> {{ scope.row.residueDay }}天 </span>
|
</div>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" prop="investigationType" label="排查方式" width="100px" :formatter="investigationTypeFormatter" />
|
<el-table-column align="center" prop="state" width="100px" label="流程状态">
|
<template slot-scope="scope">
|
<el-tag v-if="scope.row.state === 40" type="success">
|
{{ stateFormatter(scope.row) }}
|
</el-tag>
|
<el-tag v-if="scope.row.state === 50" type="danger">
|
{{ stateFormatter(scope.row) }}
|
</el-tag>
|
<el-tag v-if="scope.row.state === 9" type="info">
|
{{ stateFormatter(scope.row) }}
|
</el-tag>
|
<el-tag v-if="scope.row.state === 20" type="warning">
|
{{ stateFormatter(scope.row) }}
|
</el-tag>
|
<el-tag v-if="scope.row.state === 10" type="warning">
|
{{ stateFormatter(scope.row) }}
|
</el-tag>
|
<el-tag v-if="scope.row.state === 30" type="warning">
|
{{ stateFormatter(scope.row) }}
|
</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" prop="isInvalid" label="是否作废" width="60px" :formatter="isInvalidFormatter" />
|
<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="createTime" width="100px" label="操作">
|
<template slot-scope="scope">
|
|
<el-button type="text" size="medium" @click="openWorkOrdinDialog(scope.row, 'detail')">
|
详情
|
</el-button>
|
<el-button type="text" v-if="scope.row.isCode==='1'" size="medium" @click="openEditDialog(scope.row)">
|
修改单位
|
</el-button>
|
<el-button v-if="scope.row.state === 9" type="text" size="medium" @click="handleOpenDialog(scope.row, 'edit')">
|
编辑
|
</el-button>
|
<el-button v-if="scope.row.state > 30 && scope.row.isInvalid === 0" type="text" size="medium" @click="handleCancel(scope.row)">
|
作废
|
</el-button>
|
<el-button v-if="scope.row.state === 20" type="text" size="medium" @click="openWorkOrdinDialog(scope.row, 'work')">
|
整改
|
</el-button>
|
<el-button v-if="scope.row.state === 30 && scope.row.isApprove === 1" type="text" size="medium" @click="openWorkOrdinDialog(scope.row, 'approve')">
|
审批
|
</el-button>
|
<el-button v-if="
|
scope.row.state === 20 &&
|
scope.row.changeType === 2 &&
|
scope.row.applyState === 0
|
" type="text" size="medium" @click="openWorkOrdinDialog(scope.row, 'delay')">
|
延期申请
|
</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="total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
|
</div>
|
</div>
|
<workOrderInformation v-if="workOrdinDialogVisible" :dialog-data="dialogData" :visible.sync="workOrdinDialogVisible" @handeleSumit="handeleSumit" />
|
<el-dialog title="作废" :visible.sync="dialogVisible" width="600px" :before-close="handleClose" center>
|
<div>
|
<el-form label-width="100px">
|
<el-form-item label="作废理由：" style="margin-right: 30px">
|
<el-input v-model="invalidReason" type="textarea" :autosize="{ minRows: 2, maxRows: 10 }" placeholder="请输入内容" />
|
</el-form-item>
|
</el-form>
|
</div>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="handleClose">取 消</el-button>
|
<el-button type="primary" @click="handleInvalid">确 定</el-button>
|
</span>
|
</el-dialog>
|
<el-dialog title="修改" v-if="dialogEditVisible" :visible.sync="dialogEditVisible" width="800px" top='5vh' :before-close="handleClose" center>
|
<el-descriptions title="基本信息">
|
<template slot="extra">
|
<div>
|
{{ editEscalationUnitData.allocationNum}}
|
</div>
|
</template>
|
<el-descriptions-item label="上报时间" label-class-name="itemSpan">{{ editEscalationUnitData.escalationTime }}</el-descriptions-item>
|
<el-descriptions-item label="责任单位" label-class-name="itemSpan">{{ updataUnitIdFormatter }}</el-descriptions-item>
|
<el-descriptions-item label="污染分类" label-class-name="itemSpan">{{ polluteTypeeDITFormatter }}</el-descriptions-item>
|
<el-descriptions-item label="整改类型" label-class-name="itemSpan">{{ dictObj.changeEnum[editEscalationUnitData.changeType] }}</el-descriptions-item>
|
<el-descriptions-item label="期限天数" label-class-name="itemSpan">{{ editEscalationUnitData.changeDay || 0}} 天</el-descriptions-item>
|
<el-descriptions-item label="上报单位" label-class-name="itemSpan">{{ updataEscalationUnitIdFormatter }}</el-descriptions-item>
|
<el-descriptions-item label="上报人" label-class-name="itemSpan">{{ editEscalationUnitData.escalationName }}</el-descriptions-item>
|
<el-descriptions-item label="污染位置" label-class-name="itemSpan">{{ editEscalationUnitData.pollutePosition }}</el-descriptions-item>
|
</el-descriptions>
|
<el-divider></el-divider>
|
<div>
|
<p class="editTile">修改操作</p>
|
<el-form :inline="true" class="demo-form-inline">
|
<el-form-item label="责任单位:">
|
<el-select v-model="formInEdit.unitId" size="small" clearable placeholder="请选择">
|
<el-option v-for="item in unitList" :key="item.unitId" :label="item.unitName" :value="item.unitId" />
|
</el-select>
|
</el-form-item>
|
<el-form-item label="污染分类:">
|
<el-select v-model="formInEdit.polluteType" size="small" clearable placeholder="请选择">
|
<el-option v-for="item in polluteList" :key="item.dataKey" :label="item.dataValue" :value="item.dataKey" />
|
</el-select>
|
</el-form-item>
|
</el-form>
|
</div>
|
<el-collapse>
|
<el-collapse-item title="修改记录" name="1">
|
<div class="block">
|
<el-timeline>
|
<el-timeline-item v-for="(activity, index) in operatingLog" :key="index" :color="'#0bbd87'" :timestamp="activity.createTime">
|
<div v-if="activity.content"> 操作人: {{activity.userName}}</div>
|
<div v-if="activity.content"> 责任单位: {{activity.content}}</div>
|
<div v-if="activity.polluteType"> 污染分类: {{activity.polluteType}}</div>
|
</el-timeline-item>
|
</el-timeline>
|
</div>
|
</el-collapse-item>
|
</el-collapse>
|
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="handleClose">取 消</el-button>
|
<el-button type="primary" @click="handleEditChange">确 定</el-button>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import searchBar from '@/views/toCarryOutLegislativeReforms/components/queryForm'
|
import newWorkOrder from '@/views/toCarryOutLegislativeReforms/components/newWorkOrder'
|
import workOrderInformation from '@/views/toCarryOutLegislativeReforms/components/workOrderInformation'
|
export default {
|
components: {
|
searchBar,
|
newWorkOrder,
|
workOrderInformation
|
},
|
data() {
|
return {
|
errorClass: 'errorClass',
|
searchType: 'reform',
|
pagination: {
|
currentPage: 1,
|
// 总条数，根据接口获取数据长度(注意：这里不能为空)
|
totalCount: 0,
|
// 个数选择器（可修改）
|
pageSizes: [10, 30, 60, 100],
|
// 默认每页显示的条数（可修改）
|
pageSize: 10
|
},
|
formData: {},
|
tableData: [],
|
dialogData: {
|
title: '整改',
|
parentFormData: {},
|
pageState: 'work'
|
},
|
pageStats: 'add',
|
workOrdinDialogVisible: false,
|
centerDialogVisible: false,
|
dialogVisible: false,
|
dialogEditVisible: false,
|
unitList: [],
|
polluteList: [],
|
Dic: JSON.parse(localStorage.getItem('dict')),
|
dictObj: JSON.parse(localStorage.getItem('dictObj')),
|
parentFormData: {},
|
pageState: 'add',
|
invalidReason: '',
|
slectRow: {},
|
title: '',
|
searchData: {
|
isInvalid: 0
|
},
|
editEscalationUnitData: {},
|
formInEdit: {
|
polluteType: '',
|
unitId: ''
|
},
|
operatingLog: []
|
}
|
},
|
computed: {
|
updataEscalationUnitIdFormatter: function () {
|
const data = this.unitList.find(
|
item =>
|
item && item.unitId === this.editEscalationUnitData.escalationUnitId
|
)
|
return data ? data.unitName : ''
|
},
|
updataUnitIdFormatter: function () {
|
const data = this.unitList.find(
|
item => item && item.unitId === this.editEscalationUnitData.unitId
|
)
|
return data ? data.unitName : ''
|
},
|
polluteTypeeDITFormatter: function () {
|
const data = this.polluteList.find(
|
item =>
|
item &&
|
parseInt(item.dataKey) === this.editEscalationUnitData.polluteType
|
)
|
return data ? data.dataValue : ''
|
}
|
},
|
created() {
|
this.handleSearch()
|
this.getUnitList()
|
this.getContaminateList()
|
},
|
methods: {
|
openEditDialog(row) {
|
this.editEscalationUnitData = row
|
this.dialogEditVisible = true
|
this.$request({
|
url: '/allocation/getLog',
|
method: 'get',
|
params: {
|
allocationNum: this.editEscalationUnitData.allocationNum
|
}
|
})
|
.then(res => {
|
this.operatingLog = res.data
|
})
|
.catch(err => {
|
this.$message.error(res.message)
|
console.log('请求Region失败')
|
console.log(err)
|
})
|
},
|
handleCancel(row) {
|
this.dialogVisible = true
|
this.slectRow = row
|
},
|
handleClose() {
|
this.dialogVisible = false
|
this.dialogEditVisible = false
|
},
|
handleEditChange() {
|
if (this.formInEdit.polluteType === '' && this.formInEdit.unitId === '') {
|
this.$message({
|
message: '请选择后再提交',
|
type: 'error'
|
})
|
return
|
}
|
this.$request({
|
url: '/allocation/updataUnit',
|
method: 'get',
|
params: {
|
id: this.editEscalationUnitData.allocationId,
|
...this.formInEdit
|
}
|
})
|
.then(res => {
|
if (res.code === 0) {
|
this.$message({
|
message: '修改成功',
|
type: 'success'
|
})
|
this.dialogEditVisible = false
|
this.formInEdit = {
|
polluteType: '',
|
unitId: ''
|
}
|
this.handleSearch()
|
}
|
})
|
.catch(err => {
|
this.$message.error(res.message)
|
console.log('请求Region失败')
|
console.log(err)
|
})
|
},
|
handleInvalid() {
|
this.$request({
|
url: '/allocation/invalid',
|
method: 'get',
|
params: {
|
id: this.slectRow.allocationId,
|
invalidReason: this.invalidReason
|
}
|
}).then(res => {
|
if (res.code === 0) {
|
this.$message({
|
message: '处理成功',
|
type: 'success'
|
})
|
this.dialogVisible = false
|
} else {
|
this.$message.error(res.message)
|
}
|
})
|
},
|
// 详情
|
handleOpenDialog(row, type) {
|
this.pageState = type
|
this.parentFormData = {}
|
if (type === 'add') {
|
this.title = '新建交办单'
|
this.centerDialogVisible = true
|
} else {
|
this.title = '编辑交办单'
|
this.$request({
|
url: '/allocation/detail',
|
method: 'get',
|
params: {
|
id: row.allocationId
|
}
|
}).then(res => {
|
this.parentFormData = res.data
|
console.log(this.parentFormData)
|
this.centerDialogVisible = true
|
})
|
}
|
},
|
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 => {
|
if (res.code === 0) {
|
this.unitList = res.data
|
} else {
|
this.$message.error(res.message)
|
}
|
})
|
},
|
getContaminateList() {
|
this.$request({
|
url: '/allocation/contaminate',
|
method: 'get'
|
}).then(res => {
|
if (res.code === 0) {
|
this.polluteList = res.data
|
} else {
|
this.$message.error(res.message)
|
}
|
})
|
},
|
handeleSumit() {
|
this.handleSearch()
|
},
|
// 提交
|
newHandleSubmit(obj) {
|
console.log(obj)
|
console.log(this.parentFormData)
|
let api = '/allocation/insert'
|
if (this.pageState !== 'add') {
|
api = '/allocation/update'
|
// obj.fileBaseList = [...this.parentFormData.fileBaseList, ... obj.fileBaseList]
|
}
|
this.$request({
|
url: api,
|
method: 'post',
|
data: {
|
...obj
|
}
|
}).then(res => {
|
if (res.code === 0) {
|
this.centerDialogVisible = false
|
|
this.handleSearch()
|
} else {
|
this.$message.error(res.message)
|
}
|
})
|
},
|
handleSearchBut(obj) {
|
this.pagination = {
|
currentPage: 1,
|
// 总条数，根据接口获取数据长度(注意：这里不能为空)
|
totalCount: 0,
|
// 个数选择器（可修改）
|
pageSizes: [10, 30, 60, 100],
|
// 默认每页显示的条数（可修改）
|
pageSize: 10
|
}
|
this.handleSearch(obj)
|
},
|
handleSearch(obj) {
|
this.searchData.isInvalid = 0
|
if (obj) {
|
this.searchData = obj
|
}
|
this.$request({
|
url: '/allocation/page',
|
method: 'post',
|
data: {
|
...this.searchData,
|
page: this.pagination
|
}
|
}).then(res => {
|
if (res.code === 0) {
|
this.tableData = res.data.list
|
this.pagination.totalCount = res.data.page.totalNum
|
} else {
|
this.$message.error(res.message)
|
}
|
})
|
},
|
// 分页
|
// 每页显示的条数
|
handleSizeChange(val) {
|
// 改变每页显示的条数
|
console.log('345')
|
this.pagination.pageSize = val
|
// 注意：在改变每页显示的条数时，要将页码显示到第一页
|
this.pagination.currentPage = 1
|
this.handleSearch()
|
},
|
// 显示第几页
|
handleCurrentChange(val) {
|
// 改变默认的页数
|
console.log('123')
|
this.pagination.currentPage = val
|
this.handleSearch()
|
// console.log(val)
|
},
|
openWorkOrdinDialog(row, type) {
|
this.$request({
|
url: '/allocation/detail',
|
method: 'get',
|
params: {
|
id: row.allocationId
|
}
|
}).then(res => {
|
this.parentFormData = res.data
|
this.workOrdinDialogVisible = true
|
if (type === 'work') {
|
this.dialogData = {
|
title: '整改交办单',
|
parentFormData: res.data,
|
pageType: 'work',
|
pageState: 'approve',
|
sysCode: '1010202'
|
}
|
} else if (type === 'approve') {
|
this.dialogData = {
|
title: '审批交办单',
|
parentFormData: res.data,
|
pageType: 'approve',
|
pageState: 'approve',
|
sysCode: '1010203'
|
}
|
} else if (type === 'detail') {
|
this.dialogData = {
|
title: '交办单',
|
parentFormData: res.data,
|
pageType: 'detail'
|
}
|
} else if (type === 'delay') {
|
this.dialogData = {
|
title: '延期交办单',
|
parentFormData: res.data,
|
pageType: 'delay',
|
pageState: 'approve',
|
sysCode: '1251701'
|
}
|
}
|
})
|
}
|
}
|
}
|
</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;
|
}
|
}
|
}
|
.errorClass {
|
color: red;
|
}
|
.editTile {
|
color: #303133;
|
font-size: 16px;
|
font-weight: 700;
|
}
|
/deep/.el-collapse-item__header {
|
color: #303133;
|
font-size: 16px;
|
font-weight: 700;
|
}
|
</style>
|
