549 lines
20 KiB
Vue
549 lines
20 KiB
Vue
<template>
|
|
<browser class="browser-businesss-table"
|
|
:component-loading="componentLoading"
|
|
:api-config="apiConfig"
|
|
:table-config="tableConfig"
|
|
:permissions="permissions"
|
|
:dialog-config="dialogConfig"
|
|
:actions="actions"
|
|
:customQuery="true"
|
|
@custom-query="handleQuery"
|
|
@update:dialog-config="dialogConfig = $event"
|
|
@update:actions="actions = $event">
|
|
|
|
<template #queryPanel="{ queryParams: queryParams }">
|
|
<el-form ref="queryForm" :model="queryParams" label-width="80px">
|
|
<el-row class="query-condition">
|
|
<el-col :span="6">
|
|
<el-form-item label="执法机构" prop="agency">
|
|
<agency-selector :lazyLoad="true" v-model="queryParams.agency"></agency-selector>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="6">
|
|
<el-form-item label="企业名称" prop="unitName">
|
|
<el-input v-model="queryParams.unitName" clearable/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="6">
|
|
<el-form-item label="录入时间" prop="createTime">
|
|
<el-date-picker v-model="queryParams.createTime"
|
|
type="datetimerange"
|
|
start-placeholder="开始时间"
|
|
end-placeholder="结束时间"
|
|
format="YYYY-MM-DD HH:mm:ss"
|
|
value-format="YYYY-MM-DD HH:mm:ss"
|
|
:default-time="[new Date(2000, 2, 1, 0, 0, 0),
|
|
new Date(2000, 2, 1, 23, 59, 59)]"/>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
</template>
|
|
|
|
<el-table-column prop="enterprise.unitName" label="企业" min-width="300"/>
|
|
<el-table-column prop="enterprise.unifiedSocialCode" label="统一信用代码" min-width="200"/>
|
|
<el-table-column prop="agency.agencyName" label="执法机构" min-width="200"/>
|
|
<el-table-column prop="currentNode" label="当前节点" min-width="200"/>
|
|
<el-table-column prop="createTime" label="录入时间" min-width="200"/>
|
|
|
|
<template #tableControlColumn="{data: r}">
|
|
<el-link
|
|
v-if="r.data.row.currentNodeCode === 'plan_approval' || r.data.row.currentNodeCode === 'plan_approval_failed'"
|
|
type="primary" title="方案审批"
|
|
@click="handlePlanApproval(r.data.row)">方案审批
|
|
</el-link>
|
|
</template>
|
|
|
|
<template #dialog>
|
|
<el-dialog class="business-dialog" v-model="dialogConfig.show" :show-close="false" :append-to-body="true"
|
|
:top="'20px'">
|
|
<template #header>
|
|
<div class="cvi-dialog-header">
|
|
<div class="cvi-dialog-header-title">
|
|
<div class="dialog-line"></div>
|
|
{{ dialogConfig.title }}
|
|
</div>
|
|
<i class="iconfont icon-zyyy_tcgb" @click="dialogConfig.actions.handleClose"></i>
|
|
</div>
|
|
</template>
|
|
|
|
<el-form label-width="120px" class="browser-businesss-table-dialog-form" :model="dialogConfig.data"
|
|
:rules="dialogConfig.rules" ref="formRef">
|
|
<el-row>
|
|
<el-divider content-position="left">基础信息</el-divider>
|
|
<el-row class="width-100">
|
|
<el-col :span="12">
|
|
<el-form-item label="方案名称" prop="enforcementName">
|
|
<el-input v-model="dialogConfig.data.enforcementName" readonly/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="方案内容" prop="enforcementContent">
|
|
<el-input v-model="dialogConfig.data.enforcementContent" readonly/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="方案依据" prop="enforcementBasis">
|
|
<el-input v-model="dialogConfig.data.enforcementBasis" readonly/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="起止时间" prop="enforcementTime">
|
|
<el-input v-model="dialogConfig.data.enforcementTime" readonly/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="检查类型" prop="checkType">
|
|
<el-select v-model="dialogConfig.data.checkType" placeholder="请选择检查类型" disabled>
|
|
<el-option v-for="item in checkOptions" :key="item.value" :label="item.label" :value="item.value"/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="执法机构" prop="agencyName">
|
|
<el-input v-model="dialogConfig.data.agency.agencyName" readonly/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="企业名称" prop="unitName">
|
|
<el-input v-model="dialogConfig.data.enterprise.unitName" readonly/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-form-item label="统一信用代码" prop="unifiedSocialCode">
|
|
<el-input v-model="dialogConfig.data.enterprise.unifiedSocialCode" readonly/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item label="企业地址" prop="detailedAddress">
|
|
<el-input v-model="dialogConfig.data.enterprise.detailedAddress" readonly/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item label="附件" prop="annex">
|
|
<MultipleFile :parameters="fileParameters"
|
|
:files-data="dialogConfig.data.annexs"/>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-divider content-position="left">检查事项</el-divider>
|
|
<!-- <el-row class="width-100">-->
|
|
<!-- <el-col :span="24" class="padding-bottom-10">-->
|
|
<!-- <el-table :data="dialogConfig.data.enforceChecks" height="200" border>-->
|
|
<!-- <el-table-column header-align="center" align="center" prop="agencyName" label="执法机构" min-width="200"-->
|
|
<!-- show-overflow-tooltip/>-->
|
|
<!-- <el-table-column header-align="center" align="center" prop="officerNames" label="执法人员"-->
|
|
<!-- min-width="150"/>-->
|
|
<!-- <el-table-column header-align="center" align="center" prop="checkStatusMsg" label="检查状态"-->
|
|
<!-- min-width="120"/>-->
|
|
<!-- <el-table-column header-align="center" align="center" prop="checkDate" label="检查日期" min-width="120"/>-->
|
|
<!-- <el-table-column header-align="center" align="center" prop="checkResultMsg" label="检查结果"-->
|
|
<!-- min-width="200" show-overflow-tooltip/>-->
|
|
<!-- <el-table-column fixed="right" label="操作" width="100" align="center">-->
|
|
<!-- <template #default="{row}">-->
|
|
<!-- <el-link type="primary" title="检查明细" @click="handCheckDetail(row)">检查明细</el-link>-->
|
|
<!-- </template>-->
|
|
<!-- </el-table-column>-->
|
|
<!-- </el-table>-->
|
|
<!-- </el-col>-->
|
|
<!-- </el-row>-->
|
|
<el-row class="width-100">
|
|
<el-col :span="24" class="padding-bottom-10">
|
|
<el-table :data="dialogConfig.data.checkItems" height="300" border>
|
|
<el-table-column header-align="center" align="center" label="检查事项" prop="itemName" min-width="250"/>
|
|
<el-table-column header-align="center" align="center" label="执法依据" prop="enforcementBasis"
|
|
min-width="250"/>
|
|
<el-table-column header-align="center" align="center" label="处罚依据" prop="punishmentBasis"
|
|
min-width="250"/>
|
|
</el-table>
|
|
</el-col>
|
|
</el-row>
|
|
<el-divider content-position="left" v-if="dialogConfig.mode !== 'detail'">方案审批</el-divider>
|
|
<el-row class="width-100" v-if="dialogConfig.mode !== 'detail'">
|
|
<el-col :span="24">
|
|
<el-form-item label="审批人" prop="planApprovalUserName">
|
|
<el-input v-model="dialogConfig.data.planApprovalUserName" readonly/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item label="审批时间" prop="planApprovalTime">
|
|
<el-input v-model="dialogConfig.data.planApprovalTime" readonly/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item label="是否审批通过" prop="planIsPass">
|
|
<el-select v-model="dialogConfig.data.planIsPass" placeholder="请选择是否审批通过">
|
|
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item label="方案审批描述" prop="planApprovalDesc">
|
|
<el-input type="textarea" v-model="dialogConfig.data.planApprovalDesc"/>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-row>
|
|
</el-form>
|
|
|
|
<template #footer v-if="dialogConfig.mode !== 'detail'">
|
|
<div class="cvi-dialog-footer">
|
|
<el-button @click="dialogConfig.actions.handleClose">取消</el-button>
|
|
<el-button type="primary" @click="dialogConfig.actions.handleDialogOk">确定</el-button>
|
|
</div>
|
|
</template>
|
|
</el-dialog>
|
|
|
|
<el-dialog class="business-dialog" v-model="dialogConfig1.show" :show-close="false" :append-to-body="true"
|
|
:top="'20px'">
|
|
<template #header>
|
|
<div class="cvi-dialog-header">
|
|
<div class="cvi-dialog-header-title">
|
|
<div class="dialog-line"></div>
|
|
{{ dialogConfig1.title }}
|
|
</div>
|
|
<i class="iconfont icon-zyyy_tcgb" @click="dialogConfig1.actions.handleClose"></i>
|
|
</div>
|
|
</template>
|
|
|
|
<el-form label-width="100px" class="browser-businesss-table-dialog-form" :model="dialogConfig1.data">
|
|
<el-divider content-position="left">检查明细</el-divider>
|
|
<el-row class="width-100">
|
|
<el-col :span="24" class="padding-bottom-10">
|
|
<el-table :data="dialogConfig1.data.checkItems" height="200" border>
|
|
<el-table-column header-align="center" align="left" label="检查事项" prop="itemName" min-width="350"/>
|
|
<el-table-column header-align="center" align="center" label="检查结果" prop="eligibility" min-width="200">
|
|
<template #default="{row}">
|
|
<el-radio-group v-model="row.eligibility" :disabled="true">
|
|
<el-radio :value="1">合格</el-radio>
|
|
<el-radio :value="0">不合格</el-radio>
|
|
<el-radio :value="9">其他</el-radio>
|
|
</el-radio-group>
|
|
<el-input type="textarea" :rows="2" v-if="row.eligibility === 9" v-model="row.checkNote"/>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column header-align="center" align="center" label="现场图" prop="xct" min-width="200">
|
|
<template #default="{row}">
|
|
<div class="pic-content">
|
|
<MultiplePicture :parameters="parameters" :formData="row" @on-pic-view="onPicView"/>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<MultipleFile :parameters="fileParameters" :files-data="dialogConfig1.data.filesData"/>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
<PictureView ref="pictureViewRef"/>
|
|
</el-dialog>
|
|
</template>
|
|
</browser>
|
|
</template>
|
|
<script setup>
|
|
import browser from '@/components/Browser.vue'
|
|
import AgencySelector from '@/components/AgencySelector.vue'
|
|
import MultiplePicture from '@pages/common/MultiplePicture.vue'
|
|
import MultipleFile from '@pages/common/MultipleFile.vue'
|
|
import PictureView from '@pages/common/PictureView.vue'
|
|
import messagesApi from '@/api/lawenforcement/Message.js'
|
|
import {reactive, ref, toRefs} from 'vue'
|
|
import {useUserStore} from '@/stores/modules/user'
|
|
import enforcementInfo from '@/api/lawenforcement/EnforcementInfo'
|
|
import enforceChecks from '@/api/lawenforcement/EnforceChecks'
|
|
import {ElMessage} from 'element-plus'
|
|
import moment from 'moment'
|
|
|
|
let userInfo
|
|
useUserStore().getUserInfo().then(data => userInfo = data)
|
|
|
|
const state = reactive({
|
|
componentLoading: false,
|
|
permissions: {
|
|
query: true,
|
|
add: false,
|
|
modify: false,
|
|
detail: true,
|
|
delete: false,
|
|
deleteAll: false,
|
|
importFile: false,
|
|
exportFile: false,
|
|
exportSelectFile: false,
|
|
downloadTemp: false
|
|
},
|
|
tableConfig: {
|
|
multipleSelect: false,
|
|
hasControlColumn: true,
|
|
controlWidth: '160'
|
|
},
|
|
apiConfig: {
|
|
api: enforcementInfo,
|
|
api2: enforceChecks,
|
|
modelId: 'enforcementId',
|
|
},
|
|
dialogConfig: {
|
|
show: false,
|
|
mode: 'detail',
|
|
title: '综合执法管理',
|
|
loading: false,
|
|
formLabelWidth: '120',
|
|
data: {
|
|
enterprise: {},
|
|
agency: {},
|
|
},
|
|
actions: {
|
|
handleClose: handleClose,
|
|
handleDialogOk: handleDialogOk
|
|
},
|
|
rules: {
|
|
planIsPass: [{required: true, message: '是否审批通过不能为空', trigger: 'change'}],
|
|
planApprovalDesc: [{required: true, message: '方案审批描述不能为空', trigger: 'blur'}],
|
|
},
|
|
},
|
|
dialogConfig1: {
|
|
show: false,
|
|
mode: 'detail',
|
|
title: '检查明细详情',
|
|
loading: false,
|
|
data: {
|
|
checkItems: [],
|
|
filesData: [],
|
|
},
|
|
actions: {
|
|
handleClose: handleClose1
|
|
},
|
|
},
|
|
actions: {
|
|
detail: handleDetail,
|
|
},
|
|
parameters: {
|
|
mode: 'detail',
|
|
backPic: true
|
|
},
|
|
fileParameters: {
|
|
title: '相关材料',
|
|
mode: 'detail'
|
|
},
|
|
queryParams: {},
|
|
})
|
|
|
|
const {
|
|
componentLoading,
|
|
permissions,
|
|
tableConfig,
|
|
apiConfig,
|
|
dialogConfig,
|
|
dialogConfig1,
|
|
actions,
|
|
parameters,
|
|
fileParameters,
|
|
queryParams,
|
|
} = toRefs(state)
|
|
|
|
const checkOptions = [
|
|
{value: '1', label: '日常检查'},
|
|
{value: '2', label: '专项检查'},
|
|
{value: '3', label: '举报核查'},
|
|
{value: '4', label: '随机抽查'},
|
|
]
|
|
|
|
// 分页查询
|
|
|
|
function handleQuery(queryParams) {
|
|
queryParams.currentNodeCode = 'plan_approval,plan_approval_failed'
|
|
queryParams.agencyCode = queryParams.agency?.agencyCode
|
|
if (queryParams.createTime && queryParams.createTime.length === 2) {
|
|
queryParams.startTime = queryParams.createTime[0]
|
|
queryParams.endTime = queryParams.createTime[1]
|
|
} else {
|
|
queryParams.startTime = null
|
|
queryParams.endTime = null
|
|
}
|
|
tableConfig.value.tableLoading = true
|
|
apiConfig.value.api.query(queryParams).then(res => {
|
|
tableConfig.value.tableLoading = false
|
|
if (res.success) {
|
|
tableConfig.value.tableData = res
|
|
} else {
|
|
ElMessage.error('执法信息查询失败')
|
|
}
|
|
})
|
|
}
|
|
|
|
|
|
// 详情信息
|
|
function handleDetail(row) {
|
|
dialogConfig.value.show = true
|
|
dialogConfig.value.mode = 'detail'
|
|
dialogConfig.value.title = '执法信息详情'
|
|
dialogConfig.value.loading = true
|
|
findOne(row)
|
|
}
|
|
|
|
function findOne(row) {
|
|
apiConfig.value.api.findOne(row.enforcementId).then(res => {
|
|
dialogConfig.value.loading = false
|
|
if (res.success) {
|
|
const data = res.data
|
|
// 处理机构信息
|
|
if (!data.agency) data.agency = {}
|
|
// 处理企业ID
|
|
data.enterpriseIds = [data.enterpriseId].filter(Boolean)
|
|
// 方案时间
|
|
data.enforcementTime = [data.enforcementStartTime, data.enforcementEndTime]
|
|
// 更新检查记录
|
|
// data.enforceChecks.forEach(item => {
|
|
// // 机构信息
|
|
// item.agencyName = data.agency.agencyName
|
|
// // 人员信息
|
|
// item.officerNames = item.officerList.map(item => item.officerName).join(', ')
|
|
// })
|
|
// 检查类型
|
|
data.checkType = data.enforceChecks[0].checkType
|
|
// 处理检查项ID
|
|
data.checkItemIds = data.checkItems.map(item => item.itemId)
|
|
// 附件
|
|
data.annexs.forEach(item => item.url = item.downloadUrl)
|
|
// 审批人
|
|
data.planApprovalUserId = userInfo.yhwybs
|
|
data.planApprovalUserName = userInfo.xm
|
|
// 审批时间
|
|
data.planApprovalTime = moment().format('YYYY-MM-DD HH:mm:ss')
|
|
// 响应式更新
|
|
dialogConfig.value.data = Object.assign({}, data)
|
|
console.log(dialogConfig.value.data)
|
|
} else {
|
|
ElMessage.error('执法信息详情查询失败')
|
|
}
|
|
})
|
|
}
|
|
|
|
function handleClose() {
|
|
dialogConfig.value.show = false
|
|
}
|
|
|
|
// 检查明细信息
|
|
function handCheckDetail(row) {
|
|
dialogConfig1.value.show = true
|
|
dialogConfig.value.loading = true
|
|
findCheckInfoById(row)
|
|
}
|
|
|
|
function findCheckInfoById(row) {
|
|
apiConfig.value.api2.findOne(row.enforceCheckId).then(res => {
|
|
dialogConfig.value.loading = false
|
|
if (res.success) {
|
|
let data = res.data
|
|
dialogConfig1.value.data.checkItems = data.items
|
|
dialogConfig1.value.data.filesData = []
|
|
if (data.dzcls) {
|
|
data.dzcls.forEach(item => dialogConfig1.value.data.filesData.push({
|
|
id: item.materialsId,
|
|
url: item.url,
|
|
name: item.name,
|
|
type: item.fileType,
|
|
downloadUrl: item.url
|
|
}))
|
|
}
|
|
} else {
|
|
ElMessage.error('检查明细详情查询失败')
|
|
}
|
|
})
|
|
}
|
|
|
|
function handleClose1() {
|
|
dialogConfig1.value.show = false
|
|
}
|
|
|
|
const pictureViewRef = ref()
|
|
|
|
function onPicView(url) {
|
|
pictureViewRef.value.viewPicture(url)
|
|
}
|
|
|
|
// 方案审批
|
|
const options = [
|
|
{
|
|
value: '1',
|
|
label: '是',
|
|
},
|
|
{
|
|
value: '0',
|
|
label: '否',
|
|
}
|
|
]
|
|
|
|
const formRef = ref()
|
|
|
|
function handlePlanApproval(row) {
|
|
dialogConfig.value.show = true
|
|
dialogConfig.value.mode = 'add'
|
|
dialogConfig.value.title = '方案审批'
|
|
findOne(row)
|
|
}
|
|
|
|
function handleDialogOk() {
|
|
let _event = actions.value
|
|
formRef.value.validate(valid => {
|
|
if (valid) {
|
|
dialogConfig.value.loading = true
|
|
// 清空附件
|
|
dialogConfig.value.data.annexs = []
|
|
apiConfig.value.api.addPlanApproval(dialogConfig.value.data).then(res => {
|
|
dialogConfig.value.loading = false
|
|
if (res.success) {
|
|
dialogConfig.value.show = false
|
|
ElMessage.success('操作成功')
|
|
messagesApi
|
|
.sendMessage({
|
|
title: '方案审批',
|
|
content: '您有一条待现场执法检查记录!',
|
|
routeUrl: '/xzzfgl/zfjc/zfjc',
|
|
receiverIds: ['111111']
|
|
})
|
|
.then(res => console.log(res))
|
|
_event.query()
|
|
} else {
|
|
ElMessage.error('操作失败')
|
|
}
|
|
})
|
|
}
|
|
})
|
|
}
|
|
</script>
|
|
<style lang="scss">
|
|
.pic-content {
|
|
.el-upload-list__item-thumbnail,
|
|
.el-upload-list__item-actions,
|
|
.el-upload-list__item,
|
|
.el-upload--picture-card {
|
|
width: 64px !important;
|
|
height: 64px !important;
|
|
}
|
|
}
|
|
</style>
|
|
<style lang="scss" scoped>
|
|
.browser-businesss-table {
|
|
.browser-businesss-table-dialog-form {
|
|
padding: 10px 20px 10px 20px;
|
|
}
|
|
}
|
|
|
|
.width-100 {
|
|
width: 100%;
|
|
}
|
|
|
|
.padding-bottom-10 {
|
|
padding-bottom: 10px;
|
|
}
|
|
|
|
:deep(.el-select__wrapper.is-disabled) {
|
|
background: unset !important;
|
|
}
|
|
|
|
:deep(.el-select__wrapper.is-disabled .el-select__selected-item) {
|
|
color: #606266 !important;
|
|
}
|
|
</style>
|