304 lines
12 KiB
Vue
304 lines
12 KiB
Vue
|
|
<template>
|
||
|
|
<browser :component-loading="componentLoading"
|
||
|
|
ref="broTable"
|
||
|
|
:api-config="apiConfig"
|
||
|
|
:table-config="tableConfig"
|
||
|
|
:permissions="permissions"
|
||
|
|
:dialog-config="dialogConfig"
|
||
|
|
:custom-query="true"
|
||
|
|
@custom-query="handleQuery"
|
||
|
|
:actions="actions"
|
||
|
|
@update:dialog-config="dialogConfig = $event">
|
||
|
|
<template #queryPanel>
|
||
|
|
<el-form label-width="120px" :model="queryParams">
|
||
|
|
<el-row class="query-condition">
|
||
|
|
<el-col :span="6">
|
||
|
|
<el-form-item label="统计周" prop="fillUnit">
|
||
|
|
<el-date-picker
|
||
|
|
v-model="queryParams.firstOfWeek"
|
||
|
|
type="week"
|
||
|
|
value-format="YYYY-MM-DD"
|
||
|
|
placeholder="选择周">
|
||
|
|
</el-date-picker>
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
</el-form>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<!-- 主表列 -->
|
||
|
|
<el-table-column header-align="center" align="center" prop="district" label="执法单位" min-width="90"/>
|
||
|
|
<el-table-column header-align="center" align="center" prop="statisticDate" label="统计数据" min-width="100"/>
|
||
|
|
<el-table-column header-align="center" align="center" prop="hylb" label="行业领域" min-width="200"/>
|
||
|
|
<el-table-column header-align="center" align="center" prop="qys" label="监管企业数" min-width="120"
|
||
|
|
class-name="can-click"/>
|
||
|
|
<el-table-column header-align="center" align="center" prop="jcqysl" label="执法检查企业数" min-width="120"
|
||
|
|
class-name="can-click"/>
|
||
|
|
<el-table-column header-align="center" align="center" prop="jccsl" label="执法检查次数" min-width="120"
|
||
|
|
class-name="can-click"/>
|
||
|
|
<el-table-column header-align="center" align="center" prop="wfxwsl" label="发现违法行为数量" min-width="140"
|
||
|
|
class-name="can-click"/>
|
||
|
|
<el-table-column header-align="center" align="center" prop="lasl" label="行政立案数量" min-width="120"
|
||
|
|
class-name="can-click"/>
|
||
|
|
<el-table-column header-align="center" align="center" prop="lajss" label="立案家数" min-width="120"
|
||
|
|
class-name="can-click"/>
|
||
|
|
<el-table-column header-align="center" align="center" prop="yasfs" label="一案双罚数量" min-width="120"
|
||
|
|
class-name="can-click"/>
|
||
|
|
<el-table-column header-align="center" align="center" label="行政处罚金额(万元)" min-width="120">
|
||
|
|
<el-table-column header-align="center" align="center" prop="fkze" label="罚款总额" min-width="120"
|
||
|
|
class-name="can-click"/>
|
||
|
|
<el-table-column header-align="center" align="center" prop="cfqy" label="处罚企业" min-width="120"
|
||
|
|
class-name="can-click"/>
|
||
|
|
<el-table-column header-align="center" align="center" prop="cfgr" label="处罚个人" min-width="120"
|
||
|
|
class-name="can-click"/>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column header-align="center" align="center" label="行刑衔接情况" min-width="120">
|
||
|
|
<el-table-column header-align="center" align="center" prop="yjajs" label="移交案件数" min-width="120"
|
||
|
|
class-name="can-click"/>
|
||
|
|
<el-table-column header-align="center" align="center" prop="sjrys" label="涉及人员数" min-width="120"
|
||
|
|
class-name="can-click"/>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column header-align="center" align="center" label="约谈情况" min-width="120">
|
||
|
|
<el-table-column header-align="center" align="center" prop="yts" label="约谈企业数" min-width="120"
|
||
|
|
class-name="can-click"/>
|
||
|
|
<el-table-column header-align="center" align="center" prop="ytrs" label="约谈人员数" min-width="120"
|
||
|
|
class-name="can-click"/>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column header-align="center" align="center" prop="" label="通报情况" min-width="120">
|
||
|
|
<el-table-column header-align="center" align="center" prop="tbs" label="通报企业数" min-width="120"
|
||
|
|
class-name="can-click"/>
|
||
|
|
<el-table-column header-align="center" align="center" prop="tbrs" label="通报人员数" min-width="120"
|
||
|
|
class-name="can-click"/>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column header-align="center" align="center" prop="tczds" label="责令停产整顿数量" min-width="140"
|
||
|
|
class-name="can-click"/>
|
||
|
|
<template #dialogContent="{ dialogConfig: dc }">
|
||
|
|
<el-dialog :open="dc.show" :title="dc.title" :type="dc.type" v-if="dc.show" :show-footer="false"
|
||
|
|
@update:open="dc.show = false">
|
||
|
|
<Zfjcqysldetail :dialog-data="dc.data" :tag="tag"/>
|
||
|
|
</el-dialog>
|
||
|
|
</template>
|
||
|
|
<template #dialog>
|
||
|
|
<el-dialog :open="dialogConfig1.show" :title="dialogConfig1.title" type="max" v-if="dialogConfig1.show"
|
||
|
|
:show-footer="false" @update:open="dialogConfig1.show = false">
|
||
|
|
<zfjccssldetail :tag="tag" :dialog-data="dialogConfig1.data"/>
|
||
|
|
</el-dialog>
|
||
|
|
</template>
|
||
|
|
<template>
|
||
|
|
<el-dialog :open="dialogConfig2.show" type="max" :title="dialogConfig2.title" v-if="dialogConfig2.show"
|
||
|
|
:show-footer="false" @update:open="dialogConfig2.show = false">
|
||
|
|
<zflacssldetail :dialog-data="dialogConfig2.data"/>
|
||
|
|
</el-dialog>
|
||
|
|
</template>
|
||
|
|
<template>
|
||
|
|
<el-dialog :open="dialogConfig3.show" type="max" :title="dialogConfig3.title" v-if="dialogConfig3.show"
|
||
|
|
:show-footer="false" @update:open="dialogConfig3.show = false">
|
||
|
|
<zflaqkdetail :dialog-data="dialogConfig3.data"/>
|
||
|
|
</el-dialog>
|
||
|
|
</template>
|
||
|
|
</browser>
|
||
|
|
</template>
|
||
|
|
<script setup>
|
||
|
|
import {reactive, toRefs, getCurrentInstance, watch, computed, ref} from 'vue'
|
||
|
|
import Browser from '@/components/Browser.vue'
|
||
|
|
import {useUserStore} from '@/stores/modules/user'
|
||
|
|
import statisticsApi from '@/api/lawenforcement/Statistics.js'
|
||
|
|
import moment from 'moment'
|
||
|
|
import ElDialog from "@/components/ElDialog/index.vue";
|
||
|
|
import Zfjcqysldetail from "@pages/dtsjygl/zfjcqysldetail.vue";
|
||
|
|
import zfjccssldetail from "@pages/dtsjygl/zfjccssldetail.vue";
|
||
|
|
import zflacssldetail from "@pages/dtsjygl/zflacssldetail.vue";
|
||
|
|
import zflaqkdetail from "@pages/dtsjygl/zflaqkdetail.vue";
|
||
|
|
|
||
|
|
const userStore = useUserStore()
|
||
|
|
|
||
|
|
const state = reactive({
|
||
|
|
componentLoading: false,
|
||
|
|
permissions: {
|
||
|
|
query: true,
|
||
|
|
add: false,
|
||
|
|
modify: false,
|
||
|
|
detail: false,
|
||
|
|
delete: false,
|
||
|
|
importFile: false,
|
||
|
|
exportFile: true,
|
||
|
|
exportSelectFile: false,
|
||
|
|
downloadTemp: false,
|
||
|
|
},
|
||
|
|
tableConfig: {
|
||
|
|
tableId: 'zfsjzbbTableId',
|
||
|
|
tableLoading: false,
|
||
|
|
usePage: false,
|
||
|
|
multipleSelect: false,
|
||
|
|
hasControlColumn: false,
|
||
|
|
controlWidth: '150',
|
||
|
|
cellClick: caseEventClick,
|
||
|
|
spanMethod: objectSpanMethod
|
||
|
|
},
|
||
|
|
apiConfig: {
|
||
|
|
tableLoading: false,
|
||
|
|
api: statisticsApi,
|
||
|
|
modelId: 'enterpriseId',
|
||
|
|
},
|
||
|
|
dialogConfig: {
|
||
|
|
show: false,
|
||
|
|
mode: 'detail',
|
||
|
|
loading: false,
|
||
|
|
data: {},
|
||
|
|
actions: {},
|
||
|
|
},
|
||
|
|
dialogConfig1: {
|
||
|
|
show: false,
|
||
|
|
mode: 'detail',
|
||
|
|
loading: false,
|
||
|
|
data: {},
|
||
|
|
actions: {},
|
||
|
|
},
|
||
|
|
dialogConfig2: {
|
||
|
|
show: false,
|
||
|
|
mode: 'detail',
|
||
|
|
loading: false,
|
||
|
|
data: {},
|
||
|
|
actions: {},
|
||
|
|
},
|
||
|
|
dialogConfig3: {
|
||
|
|
show: false,
|
||
|
|
mode: 'detail',
|
||
|
|
loading: false,
|
||
|
|
data: {},
|
||
|
|
actions: {},
|
||
|
|
},
|
||
|
|
actions: {
|
||
|
|
query: handleQuery,
|
||
|
|
exportData: handleExport
|
||
|
|
},
|
||
|
|
queryParams: {
|
||
|
|
period: 'week',
|
||
|
|
firstOfWeek: moment().weekday(1).format('YYYY-MM-DD'),
|
||
|
|
statisticDate: []
|
||
|
|
},
|
||
|
|
tag: ''
|
||
|
|
})
|
||
|
|
|
||
|
|
|
||
|
|
function handleQuery() {
|
||
|
|
queryParams.value.statisticDate[0] = queryParams.value.firstOfWeek
|
||
|
|
queryParams.value.statisticDate[1] = moment(queryParams.value.firstOfWeek).add(6, 'days').format('YYYY-MM-DD')
|
||
|
|
tableConfig.value.tableLoading = true
|
||
|
|
|
||
|
|
apiConfig.value.api.statisticByWeekForm(queryParams.value).then(res => {
|
||
|
|
if (res.success) {
|
||
|
|
tableConfig.value.tableData = res
|
||
|
|
tableConfig.value.tableLoading = false
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}
|
||
|
|
|
||
|
|
function caseEventClick(row, column, cell, event) {
|
||
|
|
const colProp = column.property
|
||
|
|
if (colProp === "qys" && row[colProp] > 0) {
|
||
|
|
tag.value = 'jgqy'
|
||
|
|
let query = Object.assign(queryParams.value, {industryType: row.industry_type})
|
||
|
|
dialogConfig.value.data = query
|
||
|
|
dialogConfig.value.show = true
|
||
|
|
dialogConfig.value.mode = 'detail'
|
||
|
|
dialogConfig.value.title = '监管企业'
|
||
|
|
}
|
||
|
|
if (colProp === "jcqysl" && row[colProp] > 0) {
|
||
|
|
tag.value = 'jcqyszbb'
|
||
|
|
let query = Object.assign(queryParams.value, {industryType: row.industry_type, statisticDate: row.tjsjd})
|
||
|
|
dialogConfig.value.data = query
|
||
|
|
dialogConfig.value.show = true
|
||
|
|
dialogConfig.value.mode = 'detail'
|
||
|
|
dialogConfig.value.title = '检查企业'
|
||
|
|
}
|
||
|
|
if (colProp === "jccsl" && row[colProp] > 0) {
|
||
|
|
tag.value = 'jccsszbb'
|
||
|
|
let query = Object.assign(queryParams.value, {industryType: row.industry_type, statisticDate: row.tjsjd})
|
||
|
|
dialogConfig1.value.data = query
|
||
|
|
dialogConfig1.value.show = true
|
||
|
|
dialogConfig1.value.mode = 'detail'
|
||
|
|
dialogConfig1.value.title = '检查次数详情'
|
||
|
|
}
|
||
|
|
if (colProp === "lajss" && row[colProp] > 0) {
|
||
|
|
tag.value = 'lajsszbb'
|
||
|
|
let query = Object.assign(queryParams.value, {industryType: row.industry_type, statisticDate: row.tjsjd})
|
||
|
|
dialogConfig.value.data = query
|
||
|
|
dialogConfig.value.show = true
|
||
|
|
dialogConfig.value.mode = 'detail'
|
||
|
|
dialogConfig.value.title = '立案企业'
|
||
|
|
}
|
||
|
|
if (colProp === "lasl" && row[colProp] > 0) {
|
||
|
|
tag.value = 'laslzbb'
|
||
|
|
let query = Object.assign(queryParams.value, {industryType: row.industry_type, statisticDate: row.tjsjd})
|
||
|
|
dialogConfig2.value.data = query
|
||
|
|
dialogConfig2.value.show = true
|
||
|
|
dialogConfig2.value.mode = 'detail'
|
||
|
|
dialogConfig2.value.title = '立案数量详情'
|
||
|
|
}
|
||
|
|
if ((colProp === "wfxwsl" && row[colProp] > 0) || (colProp === "yasfs" && row[colProp] > 0) || (colProp === "fkze" && row[colProp] > 0) || (colProp === "cfqy" && row[colProp] > 0)
|
||
|
|
|| (colProp === "wszs" && row[colProp] > 0) || (colProp === "xcclcss" && row[colProp] > 0) || (colProp === "zlxqzgs" && row[colProp] > 0)
|
||
|
|
|| (colProp === "cfgr" && row[colProp] > 0) || (colProp === "yjajs" && row[colProp] > 0) || (colProp === "sjrys" && row[colProp] > 0)
|
||
|
|
|| (colProp === "yts" && row[colProp] > 0) || (colProp === "ytrs" && row[colProp] > 0) || (colProp === "tbs" && row[colProp] > 0)
|
||
|
|
|| (colProp === "tbrs" && row[colProp] > 0) || (colProp === "tczds" && row[colProp] > 0)) {
|
||
|
|
let query = Object.assign(queryParams.value, {industryType: row.industry_type, statisticDate: row.tjsjd})
|
||
|
|
dialogConfig3.value.data = query
|
||
|
|
dialogConfig3.value.show = true
|
||
|
|
dialogConfig3.value.mode = 'detail'
|
||
|
|
dialogConfig3.value.title = '填报详情'
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
function objectSpanMethod({row, column, rowIndex, columnIndex}) {
|
||
|
|
let rowCountWeek = row.rowCountWeek === undefined ? 0 : row.rowCountWeek
|
||
|
|
let rowCountAll = row.rowCountAll === undefined ? 0 : row.rowCountAll
|
||
|
|
if (columnIndex === 0) {
|
||
|
|
if (rowIndex === 0) {
|
||
|
|
return {rowspan: rowCountWeek + rowCountAll, colspan: 1}
|
||
|
|
} else {
|
||
|
|
return {rowspan: 0, colspan: 0}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
if (columnIndex === 1) {
|
||
|
|
if (rowIndex === 0) {
|
||
|
|
return {rowspan: rowCountWeek, colspan: 1}
|
||
|
|
} else if (rowIndex === rowCountWeek) {
|
||
|
|
return {rowspan: rowCountAll, colspan: 1}
|
||
|
|
} else {
|
||
|
|
return {rowspan: 0, colspan: 0}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
const {
|
||
|
|
componentLoading,
|
||
|
|
queryParams,
|
||
|
|
permissions,
|
||
|
|
tableConfig,
|
||
|
|
apiConfig,
|
||
|
|
dialogConfig,
|
||
|
|
dialogConfig1,
|
||
|
|
dialogConfig2,
|
||
|
|
dialogConfig3,
|
||
|
|
actions,
|
||
|
|
tag
|
||
|
|
} = toRefs(state)
|
||
|
|
|
||
|
|
const broTable = ref(null)
|
||
|
|
|
||
|
|
function handleExport() {
|
||
|
|
broTable.value.busiTable.exportExcelFileForCurrentPage(tableConfig.value.tableId, '执法数据周报表')
|
||
|
|
}
|
||
|
|
|
||
|
|
</script>
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
:deep(.el-table) {
|
||
|
|
.can-click {
|
||
|
|
cursor: pointer;
|
||
|
|
color: #126eee;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|