From 3c10d50f5c751797715b318c855768e57abb4f58 Mon Sep 17 00:00:00 2001
From: huxin02 <huxin02@aisino.com>
Date: Fri, 21 Feb 2025 11:29:47 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E9=9D=9E=E7=8E=B0=E5=9C=BA?=
 =?UTF-8?q?=E6=89=A7=E6=B3=95=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/views/fxczfgl/dzzxxc.vue  |  436 ++++++
 client/src/views/fxczfgl/fxczftj.vue |  216 +++
 client/src/views/fxczfgl/fxczfws.vue |  204 +++
 client/src/views/fxczfgl/index.vue   | 1897 ++++++++++++++++++++++++++
 client/src/views/fxczfgl/sjzxxc.vue  |  447 ++++++
 client/src/views/fxczfgl/zxxcsp.vue  |  337 +++++
 client/src/views/fxczfgl/zxxcxx.vue  | 1192 ++++++++++++++++
 7 files changed, 4729 insertions(+)
 create mode 100644 client/src/views/fxczfgl/dzzxxc.vue
 create mode 100644 client/src/views/fxczfgl/fxczftj.vue
 create mode 100644 client/src/views/fxczfgl/fxczfws.vue
 create mode 100644 client/src/views/fxczfgl/index.vue
 create mode 100644 client/src/views/fxczfgl/sjzxxc.vue
 create mode 100644 client/src/views/fxczfgl/zxxcsp.vue
 create mode 100644 client/src/views/fxczfgl/zxxcxx.vue

diff --git a/client/src/views/fxczfgl/dzzxxc.vue b/client/src/views/fxczfgl/dzzxxc.vue
new file mode 100644
index 0000000..e8d6097
--- /dev/null
+++ b/client/src/views/fxczfgl/dzzxxc.vue
@@ -0,0 +1,436 @@
+<template>
+  <browser :component-loading="componentLoading"
+           class="enterpriseInfo"
+           ref="broTable"
+           :api-config="apiConfig"
+           :table-config="tableConfig"
+           :permissions="permissions"
+           :dialog-config="dialogConfig"
+           :actions="actions"
+           :customQuery="true"
+           @custom-query="handleQuery"
+           @update:actions="actions = $event"
+           @update:selection="selection = $event"
+           @update:query-params="queryParams = $event"
+           @update:dialog-config="dialogConfig = $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">
+              <AgencySelector :filterable="true" v-model="queryParams.agency" :lazy-load="true" :multiple="false"
+                              placeholder="请选择"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="行业类型" prop="industryType">
+              <el-select v-model="queryParams.industryType" placeholder="请选择" clearable>
+                <el-option v-for="item in DICTITEMS.HYLB_OPTIONS" :key="item.value" :label="item.label"
+                           :value="item.value"/>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="巡查类型" prop="xclx">
+              <el-select v-model="queryParams.xclx" placeholder="请选择" clearable>
+                <el-option v-for="item in DICTITEMS.XCLX_OPTIONS" :key="item.value" :label="item.label"
+                           :value="item.value"/>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </template>
+
+    <template #extraButton>
+      <el-button class="ins-button" type="warning" @click="handleSelectData">定制巡查</el-button>
+      <div class="extra-button" v-for="(item, index) in shopCarts" :key="index" @click="handleShopCart(item)">
+        <span class="qys">{{ item.enterprise.length }}</span>
+        <img src="../../assets/bigscreen/01.svg" style="width: 100%;height: 100%">
+<!--        <font-awesome-icon icon="fa-shopping-cart" style="color: #2063fc; width: 100%;height: 100%"/>-->
+      </div>
+    </template>
+
+    <el-table-column prop="agency.agencyName" label="属地" min-width="250"/>
+    <el-table-column prop="unitName" label="企业" min-width="350"/>
+    <el-table-column prop="industryType" label="行业类型" min-width="200">
+      <template #default="{row}">
+        <el-span>{{ DICTDISPLAYS.HYLB_MAP[row.industryType] || row.industryType }}</el-span>
+      </template>
+    </el-table-column>
+    <el-table-column prop="videoAccessMsg" label="视频" min-width="100"/>
+    <el-table-column prop="perceptionAccessMsg" label="感知" min-width="100"/>
+    <el-table-column prop="infoAccessMsg" label="资料" min-width="100"/>
+    <el-table-column prop="permitAccessMsg" label="许可" min-width="100"/>
+
+    <template #dialog>
+      <el-dialog class="business-dialog" v-model="dialogConfig.show" :show-close="false" :append-to-body="true"
+                 fullscreen>
+        <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="dialogConfig.formLabelWidth" :model="dialogConfig.data" :rules="dialogConfig.rules">
+          <enterpriseInfo :dc="dialogConfig"/>
+        </el-form>
+      </el-dialog>
+
+      <el-dialog class="business-dialog" v-model="dialogConfig1.show" :show-close="false" :append-to-body="true"
+                 :top="'100px'">
+        <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" :model="dialogConfig1.data" :rules="dialogConfig1.rules" ref="formRef">
+          <el-row>
+            <el-col :span="24" class="padding-bottom-10">
+              <el-table :data="dialogConfig1.data.enterprise" height="300" border>
+                <el-table-column header-align="center" align="center" label="属地" prop="agency.agencyName"
+                                 min-width="250"/>
+                <el-table-column header-align="center" align="center" label="企业名称" prop="unitName" min-width="250"/>
+              </el-table>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item label="录入人" prop="createUserName">
+                <el-input v-model="dialogConfig1.data.createUserName" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item label="录入时间" prop="createTime">
+                <el-input v-model="dialogConfig1.data.createTime" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item label="有效期" prop="validTime">
+                <el-date-picker v-model="dialogConfig1.data.validTime"
+                                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 #footer>
+          <div class="cvi-dialog-footer">
+            <el-button @click="dialogConfig1.actions.handleClose">取消</el-button>
+            <el-button type="primary" @click="dialogConfig1.actions.handleDialogOk">确定</el-button>
+          </div>
+        </template>
+      </el-dialog>
+    </template>
+  </browser>
+</template>
+
+<script setup>
+import {reactive, toRefs, computed, ref, nextTick, watch} from 'vue'
+import {useUserStore} from '@/stores/modules/user'
+import enterprises from '@/api/lawenforcement/Enterprise.js'
+import {DEFAULT_ENTERPRISE_DETAIL, DICTDISPLAYS, DICTITEMS} from '@/utils/Constants.js'
+import {ElMessage} from 'element-plus'
+import moment from 'moment'
+import { v4 as uuid } from 'uuid'
+import {AREA_DICT} from '@/utils/bigdict.js'
+import Browser from '@/components/Browser.vue'
+import enterpriseInfo from '@pages/dtsjygl/enterpriseInfo.vue'
+import AgencySelector from '@/components/AgencySelector.vue'
+
+
+let userInfo
+useUserStore().getUserInfo().then(data => userInfo = data)
+
+const state = reactive({
+  queryParams: {},
+  componentLoading: false,
+  permissions: {
+    query: true,
+    add: false,
+    modify: false,
+    detail: true,
+    delete: false,
+    importFile: false,
+    exportFile: false,
+    exportSelectFile: false,
+    downloadTemp: false,
+  },
+  tableConfig: {
+    controlWidth: '80',
+    hasControlColumn: true,
+    multipleSelect: true,
+    defaultSort: {
+      prop: 'dynamicRiskLevel',
+      order: 'descending'
+    },
+  },
+  apiConfig: {
+    api: enterprises,
+    modelId: 'enterpriseId'
+  },
+  dialogConfig: {
+    title: '企业详情',
+    show: false,
+    mode: 'detail',
+    loading: false,
+    formLabelWidth: '90px',
+    rules: {
+      industryType: [{required: true, message: '监管行业不能为空', trigger: 'blur'}],
+      unitName: [{required: true, message: '生产经营单位名称不能为空', trigger: 'blur'}],
+      shortName: [{required: true, message: '单位简称不能为空', trigger: 'blur'}],
+      unifiedSocialCode: [{required: true, message: '社会统一信用代码不能为空', trigger: 'blur'}],
+      businessStatus: [{required: true, message: '营业状态不能为空', trigger: 'blur'}],
+      orgCode: [{required: false, message: '所属机构不能为空', trigger: 'blur'}],
+      legalRepresentative: [{required: true, message: '法定代表人（经营者）姓名不能为空', trigger: 'blur'}],
+      contactPhone: [{required: true, message: '联系电话不能为空', trigger: 'blur'}],
+      agency: [{required: true, message: '属地不能为空', trigger: 'blur'}],
+      legalPhone: [{required: true, message: '联系电话不能为空', trigger: 'blur'}],
+      legalDuty: [{required: true, message: '法定代表人（经营者）职位不能为空', trigger: 'blur'}],
+      regulatedIndustry: [{required: true, message: '国民经济行业分类不能为空', trigger: 'blur'}],
+      affiliation: [{required: true, message: '行政隶属关系不能为空', trigger: 'blur'}],
+      oilExtract: [{required: true, message: '是否石油开采不能为空', trigger: 'blur'}],
+      safetyFocus: [{required: true, message: '列入安全生产监管重点企业不能为空', trigger: 'blur'}],
+      largeScale: [{required: true, message: '规模以上生产经营单位不能为空', trigger: 'blur'}],
+      safetyLic: [{required: true, message: '企业是否有安全生产许可证不能为空', trigger: 'blur'}],
+      opScope: [{required: true, message: '主营业务不能为空', trigger: 'blur'}],
+      areaComb: [{required: true, message: '注册地址不能为空', trigger: 'blur'}],
+      detailedAddress: [{required: true, message: '注册详细地址不能为空', trigger: 'blur'}],
+      opLocAreaComb: [{required: true, message: '经营地址不能为空', trigger: 'blur'}],
+      opLocAddress: [{required: true, message: '经营详细地址不能为空', trigger: 'blur'}],
+      dynamicRiskLevel: [{required: true, message: '动态风险等级不能为空', trigger: 'blur'}],
+      isScaleEnterprise: [{required: true, message: '规模以上生产经营单位不能为空', trigger: 'blur'}]
+    },
+    data: {},
+    actions: {
+      handleClose: handleClose,
+    }
+  },
+  dialogConfig1: {
+    show: false,
+    mode: 'detail',
+    title: '待巡查企业',
+    loading: false,
+    data: {},
+    actions: {
+      handleClose: handleClose1,
+      handleDialogOk: handleDialogOk
+    },
+    rules: {
+      validTime: [{required: true, message: '有效期不能为空', trigger: 'change'}],
+    },
+  },
+  actions: {
+    detail: handleDetail
+  },
+  selection: [],
+})
+
+const {
+  queryParams,
+  componentLoading,
+  permissions,
+  tableConfig,
+  apiConfig,
+  dialogConfig,
+  dialogConfig1,
+  actions,
+  selection,
+} = toRefs(state)
+
+// 分页查询
+function handleQuery(queryParam) {
+  tableConfig.value.tableLoading = true
+  apiConfig.value.api.queryIns(queryParam).then(res => {
+    tableConfig.value.tableLoading = false
+    if (res.success) {
+      tableConfig.value.tableData = res
+    } else {
+      ElMessage.error('执法信息查询失败')
+    }
+  })
+}
+
+// 详情查询
+const defaultValues = reactive(DEFAULT_ENTERPRISE_DETAIL)
+
+async function handleDetail(row) {
+  dialogConfig.value.show = true
+  dialogConfig.value.mode = 'detail'
+  dialogConfig.value.title = '详情企业信息'
+  findOne(row)
+}
+
+function findOne(row) {
+  dialogConfig.value.loading = true
+  let defaultVals = {
+    //安全基础管理信息
+    productionManageInfoExp: {productionManageSystems: [{systemName: '', systemCompileDate: ''}], productionManagePlans: [{planName: '', planCompileDate: '', planType: ''}]},
+    //生产设备设施及公用辅助用房
+    productionEquipmentExp: {productionFacilities: [{equipName: '', equipType: '', commissioningDate: ''}], auxiliaryBuildings: [{auxiliaryName: '', floorArea: '', commissioningDate: ''}]},
+    //煤行业扩展信息
+    coalIndustryExpansion: {},
+    //非煤行业扩展信息
+    nocoalIndustryExpansion: {},
+    //危化行业扩展信息
+    dangerFeatureInfo: {majorDangerInfos: {}, majorDangerCraftInfos: {}, dangerInfos: {}},
+    //烟花爆竹行业扩展信息
+    fireworksAddInfo: {},
+    //工贸行业扩展信息
+    industryExpandInfos: {}
+  }
+  dialogConfig.value.data = Object.assign({}, defaultVals)
+  apiConfig.value.api.findOne(row[apiConfig.value.modelId]).then(res => {
+    if (res.success) {
+      const data = res.data || {}
+      // 调用字段解析函数
+      const fieldsToDeserialize = Object.keys(defaultVals)
+      deserializeFields(data, fieldsToDeserialize)
+      // 调用默认值设置函数
+      Object.keys(defaultVals).forEach(key => {
+        if (!data[key]) {
+          data[key] = defaultVals[key]
+        }
+      })
+      data.regulatedIndustry = data.regulatedIndustry ? data.regulatedIndustry.split("/") : []
+      data.areaComb = data.areaComb ? data.areaComb.split("/") : []
+      data.opLocAreaComb = data.opLocAreaComb ? data.opLocAreaComb.split("/") : []
+      dialogConfig.value.data = Object.assign({}, data)
+    }
+    dialogConfig.value.loading = false
+  })
+}
+
+function deserializeFields(data, fields) {
+  fields.forEach(field => {
+    if (data[field]) {
+      try {
+        data[field] = JSON.parse(data[field])
+      } catch (e) {
+        console.error(`Failed to parse ${field}:`, e)
+      }
+    }
+  })
+}
+
+function handleClose() {
+  dialogConfig.value.show = false
+}
+
+// 定制巡查
+let shopCarts = ref([])
+
+function handleSelectData() {
+  let arr = selection.value
+  let data = Array.from(new Map(arr.map(item => [item.enterpriseId, item])).values())
+  if (data.length < 1) {
+    ElMessage.error('请选择待巡查企业')
+    return
+  }
+
+  shopCarts.value.push({
+    'id': uuid(),
+    'enterprise': data,
+    'createUserId': userInfo.yhwybs,
+    'createUserName': userInfo.xm,
+    'createTime': moment().format('YYYY-MM-DD HH:mm:ss')
+  })
+}
+
+function handleShopCart(data) {
+  dialogConfig1.value.data = Object.assign({}, data)
+  dialogConfig1.value.show = true
+}
+
+function handleClose1() {
+  dialogConfig1.value.show = false
+}
+
+const formRef = ref()
+
+function handleDialogOk() {
+  let _event = actions.value
+  formRef.value.validate(valid => {
+    if (valid) {
+      dialogConfig1.value.data.validStartTime = dialogConfig1.value.data.validTime[0]
+      dialogConfig1.value.data.validEndTime = dialogConfig1.value.data.validTime[1]
+      dialogConfig1.value.data.enterpriseIds = dialogConfig1.value.data.enterprise.map(item => item.enterpriseId)
+      dialogConfig.value.loading = true
+      apiConfig.value.api.addIns(dialogConfig1.value.data).then(res => {
+        dialogConfig.value.loading = false
+        if (res.success) {
+          // 移除购物车
+          shopCarts.value = shopCarts.value.filter(item => item.id !== dialogConfig1.value.data.id)
+          dialogConfig1.value.show = false
+          ElMessage.success('操作成功')
+          _event.query()
+        } else {
+          ElMessage.error('操作失败')
+        }
+      })
+    }
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+:deep(.el-col-21) {
+  display: flex;
+  flex-direction: row-reverse;
+  align-items: center;
+}
+
+.ins-button {
+  margin-left: unset !important;
+  margin-right: 12px;
+}
+
+.extra-button {
+  width: 24px !important;
+  height: 24px !important;
+  margin: 0px 12px 0px 0px !important;
+  cursor: pointer;
+  position: relative;
+
+  .qys {
+    width: 16px;
+    height: 16px;
+    background: red;
+    border-radius: 50%;
+    position: absolute;
+    top: -6px;
+    right: -6px;
+    font-size: 12px;
+    text-align: center;
+    vertical-align: center;
+  }
+
+}
+
+.el-dialog {
+  margin-bottom: 0;
+  border: 0.0625rem solid rgba(255, 255, 255, 1);
+  border-radius: 1rem !important;
+}
+
+.el-dialog__body {
+  height: unset !important;
+}
+
+.padding-bottom-10 {
+  padding-bottom: 10px;
+}
+</style>
diff --git a/client/src/views/fxczfgl/fxczftj.vue b/client/src/views/fxczfgl/fxczftj.vue
new file mode 100644
index 0000000..8f897aa
--- /dev/null
+++ b/client/src/views/fxczfgl/fxczftj.vue
@@ -0,0 +1,216 @@
+<template>
+  <browser class="browser-businesss-table"
+           ref="broTable"
+           :component-loading="componentLoading"
+           :api-config="apiConfig"
+           :table-config="tableConfig"
+           :permissions="permissions"
+           :actions="actions"
+           :custom-reset="true"
+           @custom-reset="reset"
+           :customQuery="true"
+           @custom-query="handleQuery"
+           @update:actions="actions = $event">
+    <template #queryPanel>
+      <el-form ref="queryForm" :model="queryParams" label-width="100px">
+        <el-row class="query-condition">
+          <el-col :span="12">
+            <el-form-item label="统计时间" prop="statisticsTime">
+              <el-date-picker v-model="queryParams.statisticsTime"
+                              type="datetimerange"
+                              start-placeholder="开始时间"
+                              end-placeholder="结束时间"
+                              format="YYYY-MM-DD HH:mm:ss"/>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </template>
+    <el-table-column header-align="center" align="center" prop="agency_name" label="属地" min-width="150"/>
+    <el-table-column header-align="center" align="center" prop="xccs" label="巡查次数" min-width="150"
+                     class-name="can-click"/>
+    <el-table-column header-align="center" align="center" prop="fxwts" label="发现问题" min-width="150"
+                     class-name="can-click"/>
+    <el-table-column header-align="center" align="center" prop="jjwts" label="解决问题" min-width="150"
+                     class-name="can-click"/>
+    <el-table-column header-align="center" align="center" prop="las" label="立案数" min-width="150"
+                     class-name="can-click"/>
+    <el-table-column header-align="center" align="center" prop="cfs" label="处罚数" min-width="150"
+                     class-name="can-click"/>
+    <template>
+      <el-dialog :open="dialogConfig.show" :title="dialogConfig.title" v-if="dialogConfig.show" :show-footer="false"
+                 @update:open="dialogConfig.show = false">
+        <fxczftjxcdetail :dialog-data="dialogConfig.data" :tag="tag"/>
+      </el-dialog>
+    </template>
+    <template>
+      <el-dialog :open="dialogConfig2.show" :title="dialogConfig2.title" v-if="dialogConfig2.show" :show-footer="false"
+                 @update:open="dialogConfig2.show = false">
+        <fxczftjlacftail :dialog-data="dialogConfig2.data" :tag="tag"/>
+      </el-dialog>
+    </template>
+  </browser>
+</template>
+<script setup>
+import {reactive, ref, toRefs} from 'vue'
+import browser from '@/components/Browser.vue'
+import lawEnfPenaltyStat from '@/api/lawenforcement/LawEnfPenaltyStat'
+import Browser from "@/components/Browser.vue";
+import ElDialog from "@/components/ElDialog/index.vue";
+import fxczftjxcdetail from "@pages/dtsjygl/fxczftjxcdetail.vue";
+import fxczftjlacftail from "@pages/dtsjygl/fxczftjlacftail.vue";
+import moment from "moment/moment.js";
+import {ElMessage, ElMessageBox} from "element-plus";
+
+const state = reactive({
+  componentLoading: false,
+  queryParams: {
+    statisticsTime: [moment().subtract(1, 'months').format('YYYY-MM-DD') + ' 00:00:00', moment().format('YYYY-MM-DD') + ' 23:59:59']
+  },
+  permissions: {
+    query: true,
+    add: false,
+    modify: false,
+    detail: false,
+    delete: false,
+    importFile: false,
+    exportFile: true,
+    exportSelectFile: false,
+    downloadTemp: false,
+  },
+  tableConfig: {
+    tableId: 'fxczftjTableId',
+    hasControlColumn: false,
+    tableData: [],
+    tableLoading: false,
+    usePage: false,
+    multipleSelect: false,
+    cellClick: caseEventClick,
+    // lazy: true,
+    // rowKey: 'agencyCode',
+    // treeProps: { children: 'children', hasChildren: 'hasChildren' },
+    // load: loadTree
+  },
+  dialogConfig: {
+    show: false,
+    mode: 'detail',
+    loading: false,
+    data: {},
+    actions: {},
+  },
+  dialogConfig2: {
+    show: false,
+    mode: 'detail',
+    loading: false,
+    data: {},
+    actions: {},
+  },
+  apiConfig: {
+    api: lawEnfPenaltyStat,
+    modelId: 'enforcementId',
+  },
+  actions: {
+    exportData: handleExport
+  },
+  tag: ''
+})
+
+const {
+  componentLoading,
+  queryParams,
+  permissions,
+  tableConfig,
+  apiConfig,
+  actions,
+  dialogConfig,
+  dialogConfig2,
+  tag
+} = toRefs(state)
+
+function handleQuery() {
+  if (queryParams.value.statisticsTime === null) {
+    ElMessage.error('请选择统计时间')
+    return
+  }
+  tableConfig.value.tableLoading = true
+  apiConfig.value.api.statistics(queryParams.value).then(res => {
+    tableConfig.value.tableLoading = false
+    if (res.success) {
+      tableConfig.value.tableData = res
+    }
+  }).finally(() => {
+    tableConfig.value.tableLoading = false
+  })
+}
+
+function reset(query) {
+  queryParams.value.statisticsTime = [moment().subtract(1, 'months').format('YYYY-MM-DD') + ' 00:00:00', moment().format('YYYY-MM-DD') + ' 23:59:59']
+  handleQuery()
+}
+
+function caseEventClick(row, column, cell, event) {
+  const colProp = column.property
+  if (colProp === "xccs" && row[colProp] > 0) {
+    tag.value = 'xccs'
+    let query = Object.assign(queryParams.value, {agencyCode: row.agency_code})
+    dialogConfig.value.data = query
+    dialogConfig.value.show = true
+    dialogConfig.value.mode = 'detail'
+    dialogConfig.value.title = '巡查次数详情'
+
+  }
+  if (colProp === "fxwts" && row[colProp] > 0) {
+    tag.value = 'fxwts'
+    let query = Object.assign(queryParams.value, {agencyCode: row.agency_code})
+    dialogConfig.value.data = query
+    dialogConfig.value.show = true
+    dialogConfig.value.mode = 'detail'
+    dialogConfig.value.title = '发现问题数详情'
+  }
+  if (colProp === "jjwts" && row[colProp] > 0) {
+    tag.value = 'jjwts'
+    let query = Object.assign(queryParams.value, {agencyCode: row.agency_code})
+    dialogConfig.value.data = query
+    dialogConfig.value.show = true
+    dialogConfig.value.mode = 'detail'
+    dialogConfig.value.title = '解决问题数详情'
+  }
+  if (colProp === "las" && row[colProp] > 0) {
+    tag.value = 'las'
+    let query = Object.assign(queryParams.value, {agencyCode: row.agency_code})
+    dialogConfig2.value.data = query
+    dialogConfig2.value.show = true
+    dialogConfig2.value.mode = 'detail'
+    dialogConfig2.value.title = '立案数详情'
+  }
+  if (colProp === "cfs" && row[colProp] > 0) {
+    tag.value = 'cfs'
+    let query = Object.assign(queryParams.value, {agencyCode: row.agency_code})
+    dialogConfig2.value.data = query
+    dialogConfig2.value.show = true
+    dialogConfig2.value.mode = 'detail'
+    dialogConfig2.value.title = '处罚数详情'
+  }
+
+}
+
+const broTable = ref(null)
+
+function handleExport() {
+  broTable.value.busiTable.exportExcelFileForCurrentPage(tableConfig.value.tableId, '非现场执法统计')
+}
+</script>
+<style lang="scss" scoped>
+.browser-businesss-table {
+  .browser-businesss-table-dialog-form {
+    padding: 10px 20px 10px 20px;
+  }
+}
+
+:deep(.el-table) {
+  .can-click {
+    cursor: pointer;
+    color: #126eee;
+  }
+}
+</style>
diff --git a/client/src/views/fxczfgl/fxczfws.vue b/client/src/views/fxczfgl/fxczfws.vue
new file mode 100644
index 0000000..7ffbbed
--- /dev/null
+++ b/client/src/views/fxczfgl/fxczfws.vue
@@ -0,0 +1,204 @@
+<template>
+  <div v-loading="exporting" id="ajysspb" ref="pdfTemplate" class="ws-container">
+    <div class="ws-title"><span class="ws-title-text">安全生产行政执法文书</span></div>
+    <div class="ws-document-name"><span class="ws-document-name-text">{{documentName}}</span></div>
+    <div class="ws-document-code"><span class="ws-document-code-text">{{documentCode}}</span></div>
+    <p class="MsoNormal" style="margin-top: 15px"><span class="MsoNormal-span">案件名称：<span class="font-underline">&nbsp;{{documenContent.ajmc}}&nbsp;</span></span></p>
+    <table class="case-table">
+      <tbody>
+      <tr>
+        <td rowspan="5" class="title-cell">当事人基本情况</td>
+        <td class="title-cell">被处罚单位</td>
+        <td colspan="2" class="content-cell">{{documenContent.qymc}}</td>
+        <td colspan="2" class="title-cell">地址</td>
+        <td colspan="3" class="content-cell">{{documenContent.dz}}</td>
+      </tr>
+      <tr>
+        <td class="title-cell">法定代表人/负责人</td>
+        <td colspan="2" class="content-cell">{{documenContent.fddbr}}</td>
+        <td colspan="2" class="title-cell">职务</td>
+        <td class="content-cell">{{documenContent.zw}}</td>
+        <td class="title-cell">邮编 </td>
+        <td class="content-cell">{{documenContent.yzbm}}</td>
+      </tr>
+      <tr>
+        <td class="title-cell">被处罚人</td>
+        <td colspan="2" class="content-cell">{{documenContent.xm}}</td>
+        <td colspan="2" class="title-cell">年龄</td>
+        <td class="content-cell">{{documenContent.nl}}</td>
+        <td class="title-cell">性别</td>
+        <td class="content-cell">{{documenContent.xb}}</td>
+      </tr>
+      <tr>
+        <td class="title-cell">所在单位</td>
+        <td colspan="2" class="content-cell">{{documenContent.szdw}}</td>
+        <td colspan="2" class="title-cell">单位地址</td>
+        <td colspan="3" class="content-cell">{{documenContent.dwdz}}</td>
+      </tr>
+      <tr>
+        <td class="title-cell">家庭住址</td>
+        <td colspan="2" class="content-cell">{{documenContent.jtzz}}</td>
+        <td colspan="2" class="title-cell">联系电话</td>
+        <td class="content-cell">{{documenContent.phone}}</td>
+        <td class="title-cell">邮编</td>
+        <td class="content-cell">{{documenContent.yb}}</td>
+      </tr>
+      <tr>
+        <td class="title-cell">违法事实及处罚依据</td>
+        <td colspan="8" class="content-cell">{{documenContent.wfsscfyj}}</td>
+      </tr>
+      <tr>
+        <td class="title-cell">当事人申辩意见</td>
+        <td colspan="8" class="content-cell">{{documenContent.dsrsbyj}}</td>
+      </tr>
+      <tr>
+        <td class="title-cell">承办人意见</td>
+        <td colspan="8" class="content-cell">{{documenContent.cbryj}}<br>
+          <div style="float: right">承办人（签名）：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br>&nbsp;&nbsp;{{formattedDate}}</div></td>
+      </tr>
+      <tr>
+        <td class="title-cell">审核意见</td>
+        <td colspan="2" class="content-cell">{{documenContent.shyj}}<br>
+          <div style="float: right">审核人（签名）：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br>&nbsp;&nbsp;{{formattedDate}}</div></td>
+        <td colspan="2" class="title-cell">审批意见</td>
+        <td colspan="4" class="content-cell">{{documenContent.spyj}}<br>
+          <div style="float: right">审批人（签名）：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br>&nbsp;&nbsp;{{formattedDate}}</div></td>
+      </tr>
+      </tbody>
+    </table>
+  </div>
+  <div style="margin-bottom: 10px;text-align: center">
+    <el-button :disabled="exporting" type="primary" @click="printInfo">打印</el-button>
+    <el-button :disabled="exporting" type="danger" @click="generatePDF">导出pdf</el-button>
+  </div>
+</template>
+<script setup>
+import {defineProps, ref,} from 'vue'
+import {ElButton, ElMessage} from "element-plus";
+import Print from 'print-js'
+import { exportPDF } from "@/utils/ExportPdf.js";
+import moment from 'moment/moment.js';
+defineProps({
+  documentCode: String,
+  documentNo: Number,
+  documentName: String,
+  caseInfo: {
+    type: Object,
+    default: () => ({}),
+  },
+  documenContent: {
+    type: Object,
+    default: () => ({}),
+  },
+})
+const printInfo = (e) =>{
+  Print({
+    printable:  document.getElementById('ajysspb'),
+    type: 'html',
+    honorMarginPadding: false,
+    targetStyles: ['*']
+  })
+}
+const formattedDate = moment().format('YYYY年MM月DD日');
+const pdfTemplate = ref(null)
+const exporting = ref(false)
+const generatePDF = async () => {
+  exporting.value = true
+  try {
+    const result = await exportPDF(pdfTemplate,"案件处理呈批表.pdf");
+    if(result.success)
+      exporting.value = false
+  } catch (error) {
+    exporting.value = false
+    ElMessage.error(error.message)
+  }
+}
+</script>
+<style lang="scss" scoped>
+.ws-container {
+  width: 21cm; /* A4纸宽度 */
+  min-height: 29.7cm; /* A4纸高度 */
+  padding: 2cm;
+  font-family: "仿宋", SimSun;
+  line-height: 1.5;
+}
+
+.ws-title {
+  text-align: center;
+  border-bottom-style: double;
+  border-bottom-color: #111111;
+  border-bottom-width: 2px;
+  color: #111111;
+
+  .ws-title-text {
+    font-size: 40px;
+    font-family: 华文中宋;
+    font-weight: bold
+  }
+}
+
+.ws-document-name {
+  text-align: center;
+  border-top-style: double;
+  border-top-color: #111111;
+  border-top-width: 2px;
+  margin-top: 2px;
+  color: #111111;
+
+  .ws-document-name-text {
+    font-size: 40px;
+    font-family: 华文中宋;
+    font-weight: bold
+  }
+}
+.ws-document-code {
+  text-align: center;
+  margin-top: 10px;
+  .ws-document-code-text {
+    font-size: 18px;
+    font-family: 仿宋
+  }
+}
+.case-table {
+  margin-top: 10px;
+  width: 100%;
+  border-collapse: collapse;
+  border: 1px solid black;
+}
+.title-cell {
+  width: 110px;
+  font-size: 18px;
+  font-family: 仿宋;
+  border: 1px solid black;
+  vertical-align: center;
+  text-align: center;
+  line-height: 2;
+}
+
+.content-cell {
+  font-size: 18px;
+  font-family: 仿宋;
+  padding-top: 5px;
+  padding-left: 5px;
+  border: 1px solid black;
+  text-align: left;
+  line-height: 2;
+}
+.MsoNormal {
+  margin-bottom:10px;
+  mso-para-margin-bottom:2.0gd;
+  text-align:left;
+  text-indent:24.0pt;
+  line-height:22.0pt;
+  mso-line-height-rule:exactly;
+  text-autospace:ideograph-numeric;
+
+  .MsoNormal-span {
+    font-size: 18px;
+    font-family:仿宋;
+  }
+  .font-underline {
+    text-decoration:underline;text-underline-position: under;text-underline-offset: 1px;
+  }
+}
+</style>
diff --git a/client/src/views/fxczfgl/index.vue b/client/src/views/fxczfgl/index.vue
new file mode 100644
index 0000000..deba431
--- /dev/null
+++ b/client/src/views/fxczfgl/index.vue
@@ -0,0 +1,1897 @@
+<template>
+  <div class="container">
+    <div class="left-container">
+      <div class="qys">
+        <div class="section-title">
+          <div class="section-title-icon"></div>
+          <div class="section-title-font ">企业总数</div>
+        </div>
+        <div class="section-content qys-content">
+          <div class="left" @click="showDangerEnterprise(1)">
+            <div class="icon"></div>
+            <div class="label">接入企业总数</div>
+            <div class="num">{{ qysj.jrzs }}</div>
+          </div>
+          <div class="right">
+            <div class="ssjcqy" @click="showDangerEnterprise(2)">
+              <div class="icon"></div>
+              <div class="text">
+                <div class="label">实时监测企业</div>
+                <div class="num">{{ qysj.ssjkqys }}</div>
+              </div>
+            </div>
+            <div class="spjcqy" @click="showDangerEnterprise(3)">
+              <div class="icon"></div>
+              <div class="text">
+                <div class="label">视频监控企业</div>
+                <div class="num">{{ qysj.spjkqys }}</div>
+                <!--                <div class="rate">-->
+                <!--                  <span>在线率</span>&nbsp;&nbsp;{{qysj.jkdzxl}}%-->
+                <!--                </div>-->
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="qylx">
+        <div class="section-title">
+          <div class="section-title-icon"></div>
+          <div class="section-title-font ">接入企业类型</div>
+        </div>
+        <div class="section-content qylx-content">
+          <div class="item" @click="showEnterprise('ks')">
+            <div class="icon"></div>
+            <div class="label">矿山</div>
+            <div class="num">{{ qyrjsj.ks }}</div>
+          </div>
+          <div class="item bgs" @click="showEnterprise('wh')">
+            <div class="icon icon2"></div>
+            <div class="label">危化</div>
+            <div class="num">{{ qyrjsj.wh }}</div>
+          </div>
+          <div class="item" @click="showEnterprise('jyz')">
+            <div class="icon icon3"></div>
+            <div class="label">加油站</div>
+            <div class="num">{{ qyrjsj.jyz }}</div>
+          </div>
+          <div class="item bgs" @click="showEnterprise('gm')">
+            <div class="icon icon4"></div>
+            <div class="label">工贸</div>
+            <div class="num">{{ qyrjsj.gm }}</div>
+          </div>
+          <div class="item">
+            <div class="icon icon5" @click="showEnterprise('aqsc')"></div>
+            <div class="label">安全生产</div>
+            <div class="num">{{ qyrjsj.aqsc }}</div>
+          </div>
+          <div class="item bgs" @click="showEnterprise('jzsg')">
+            <div class="icon icon6"></div>
+            <div class="label">建筑施工</div>
+            <div class="num">{{ qyrjsj.jzsg }}</div>
+          </div>
+          <div class="item">
+            <div class="icon icon7"></div>
+            <div class="label">学校</div>
+            <div class="num">{{ qyrjsj.xx }}</div>
+          </div>
+          <div class="item bgs" @click="showEnterprise('yy')">
+            <div class="icon icon8"></div>
+            <div class="label">医院</div>
+            <div class="num">{{ qyrjsj.yy }}</div>
+          </div>
+          <div class="item">
+            <div class="icon icon9"></div>
+            <div class="label">文化旅游</div>
+            <div class="num">{{ qyrjsj.whly }}</div>
+          </div>
+        </div>
+      </div>
+      <div class="ymtz">
+        <div class="item" @click="goSjzxxc">
+          <div class="icon"></div>
+          <div class="label">随机巡查</div>
+        </div>
+        <div class="item" @click="goDzzxxc">
+          <div class="icon"></div>
+          <div class="label">定制巡查</div>
+        </div>
+      </div>
+    </div>
+    <div class="right-container">
+      <div class="right-top-container">
+        <div class="fxczfzs">
+          <div class="section-title">
+            <div class="section-title-icon"></div>
+            <div class="section-title-font font-color">非现场执法总数</div>
+          </div>
+          <div class="section-content fxczfzs-content">
+            <div class="left">
+              <div class="label">监测预警总数</div>
+              <div class="num">{{ sumNum }}<span>次</span></div>
+            </div>
+            <div class="right">
+              <div ref="chart1" style="height: 100%; width: 100%;"></div>
+            </div>
+          </div>
+        </div>
+        <div class="yjfx">
+          <div class="section-title">
+            <div class="section-title-icon"></div>
+            <div class="section-title-font font-color">预警分析</div>
+          </div>
+          <div class="section-content yjfx-content">
+            <div ref="chart2" style="height: 100%; width: 100%;"></div>
+          </div>
+        </div>
+      </div>
+      <div class="fxczftj">
+        <div class="section-title">
+          <div class="section-title-icon"></div>
+          <div class="section-title-font font-color">非现场执法统计</div>
+          <div class="section-title-select" @click="showSelect">
+            <div class="label">{{ label }}</div>
+            <div class="icon"></div>
+          </div>
+          <div class="section-title-selection" v-if="isShow">
+            <div class="section-title-selection-item" @click="findFxczftj('1')">按区县统计</div>
+            <div class="section-title-selection-item" @click="findFxczftj('2')">按月统计</div>
+          </div>
+        </div>
+        <div class="section-content fxczftj-content">
+          <div ref="chart3" style="height: 100%; width: 100%;"></div>
+        </div>
+      </div>
+      <div class="jkyj">
+        <div class="section-title">
+          <div class="section-title-icon"></div>
+          <div class="section-title-font font-color">监控预警信息</div>
+          <div class="section-title-more" @click="showDialog"><span>查看更多</span></div>
+        </div>
+        <div class="section-content jkyj-content">
+          <div class="item" v-for="(item, index) in yjxxList" :key="index" @click="handleDetail(item)">
+            <img :src="item.imageUrl"/>
+            <div class="label">{{ item.eventDesc }}</div>
+            <div class="qymc">陕西元科技有限公司</div>
+            <div class="address">
+              <div class="icon"></div>
+              {{ item.address }}
+            </div>
+            <div class="time">{{ item.time }}</div>
+            <div class="seek">已查阅</div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <el-dialog class="business-dialog" v-model="dialogConfig.show" :show-close="false" :append-to-body="true"
+               width="1000px" :top="'100px'">
+      <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 :model="dialogConfig.data" ref="formRef">
+        <el-row v-if="dialogConfig.show">
+          <BusinessTable ref="busiTable"
+                         v-loading="tableConfig.tableLoading"
+                         :config="tableConfig"
+                         :query-params="queryParams"
+                         :data-res="dialogConfig.data"
+                         :permissions="permissions"
+                         @query-params="handleQueryParams">
+            <el-table-column align="left" header-align="left" prop="cameraName" label="摄像头名称" min-width="180"/>
+            <el-table-column align="left" header-align="left" prop="address" label="摄像头地址" min-width="180"/>
+            <el-table-column align="left" header-align="left" prop="time" label="抓拍时间" min-width="180"/>
+            <el-table-column align="left" header-align="left" prop="eventDesc" label="事件描述" min-width="300"/>
+
+            <template #otherControlButtons="{ data: scope }">
+              <el-link type="primary" @click="handleDetail(scope.row)" title="查看">查看</el-link>
+            </template>
+          </BusinessTable>
+        </el-row>
+      </el-form>
+    </el-dialog>
+
+    <el-dialog class="business-dialog" v-model="dialogConfig2.show" :show-close="false" :append-to-body="true"
+               width="1000px" :top="'100px'">
+      <template #header>
+        <div class="cvi-dialog-header">
+          <div class="cvi-dialog-header-title">
+            <div class="dialog-line"></div>
+            {{ dialogConfig2.title }}
+          </div>
+          <i class="iconfont icon-zyyy_tcgb" @click="dialogConfig2.actions.handleClose"></i>
+        </div>
+      </template>
+
+      <el-form :model="dialogConfig2.data" label-width="100px" ref="formRef">
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="事件描述" prop="eventDesc">
+              <el-input v-model="dialogConfig2.data.eventDesc" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="摄像头名称" prop="cameraName">
+              <el-input v-model="dialogConfig2.data.cameraName" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="摄像头地址" prop="address">
+              <el-input v-model="dialogConfig2.data.address" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="摄像头国标码" prop="internationalCode">
+              <el-input v-model="dialogConfig2.data.internationalCode" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="经度" prop="lat">
+              <el-input v-model="dialogConfig2.data.lat" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="纬度" prop="lng">
+              <el-input v-model="dialogConfig2.data.lng" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="街道" prop="street">
+              <el-input v-model="dialogConfig2.data.street" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="置信度" prop="confidence">
+              <el-input v-model="dialogConfig2.data.confidence" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="抓拍时间" prop="time">
+              <el-input v-model="dialogConfig2.data.time" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12"></el-col>
+          <el-col :span="12">
+            <el-form-item label="抓拍图片" prop="imageUrl">
+              <el-image
+                  style="width: 300px; height: 200px"
+                  :src="dialogConfig2.data.imageUrl"
+                  :zoom-rate="1.2"
+                  :max-scale="7"
+                  :min-scale="0.2"
+                  :preview-src-list="[dialogConfig2.data.imageUrl]"
+                  show-progress
+                  :initial-index="4"
+                  fit="cover"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12" v-if="dialogConfig2.data.videoUrl !== null">
+            <el-form-item label="前后10s视频" prop="videoUrl">
+              <video width="300" height="200" controls>
+                <source :src="dialogConfig2.data.videoUrl" type="video/mp4">
+              </video>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </el-dialog>
+
+    <el-dialog class="business-dialog" v-model="dialogConfig3.show" :show-close="false" :append-to-body="true"
+               width="1000px" :top="'100px'">
+      <template #header>
+        <div class="cvi-dialog-header">
+          <div class="cvi-dialog-header-title">
+            <div class="dialog-line"></div>
+            {{ dialogConfig3.title }}
+          </div>
+          <i class="iconfont icon-zyyy_tcgb" @click="dialogConfig3.actions.handleClose"></i>
+        </div>
+      </template>
+      <el-row v-if="dialogConfig3.show">
+        <BusinessTable v-loading="tableConfig2.tableLoading"
+                       :config="tableConfig2"
+                       :query-params="queryParams2"
+                       :permissions="permissions2"
+                       @query-params="handleDangerEnterpriseParams"
+                       :data-res="tableConfig2.data">
+
+          <el-table-column align="center" header-align="center" prop="pssCoreUnitDto.name" label="企业" min-width="200"/>
+          <el-table-column align="center" header-align="center" prop="unitTypeName" label="企业类型" min-width="200"/>
+          <el-table-column align="center" header-align="center" prop="responsible" label="安全负责人" min-width="200"/>
+          <el-table-column align="center" header-align="center" prop="responsiblePhone" label="联系电话" min-width="200"/>
+
+          <template #otherControlButtons="{ data: scope }">
+            <el-link type="primary" @click="handleDangerEnterpriseDetail(scope.row)" title="查看">查看</el-link>
+          </template>
+        </BusinessTable>
+      </el-row>
+    </el-dialog>
+
+    <el-dialog class="business-dialog" v-model="dialogConfig4.show" :show-close="false" :append-to-body="true"
+               width="1000px" :top="'100px'">
+      <template #header>
+        <div class="cvi-dialog-header">
+          <div class="cvi-dialog-header-title">
+            <div class="dialog-line"></div>
+            {{ dialogConfig4.title }}
+          </div>
+          <i class="iconfont icon-zyyy_tcgb" @click="dialogConfig4.actions.handleClose"></i>
+        </div>
+      </template>
+
+      <el-form :model="dialogConfig4.data" label-width="100px" ref="formRef">
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="企业" prop="pssCoreUnitDto.name">
+              <el-input v-model="dialogConfig4.data.pssCoreUnitDto.name" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="行业类别" prop="pssCoreUnitDto.industryTypeAName">
+              <el-input v-model="dialogConfig4.data.pssCoreUnitDto.industryTypeAName" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="统一信用代码" prop="pssCoreUnitDto.socialCode">
+              <el-input v-model="dialogConfig4.data.pssCoreUnitDto.socialCode" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="地址" prop="pssCoreUnitDto.address">
+              <el-input v-model="dialogConfig4.data.pssCoreUnitDto.address" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="经度" prop="pssCoreUnitDto.latitude">
+              <el-input v-model="dialogConfig4.data.pssCoreUnitDto.latitude" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="纬度" prop="pssCoreUnitDto.longitude">
+              <el-input v-model="dialogConfig4.data.pssCoreUnitDto.longitude" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="企业类型" prop="unitTypeName">
+              <el-input v-model="dialogConfig4.data.unitTypeName" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="检测介质" prop="importantDielectric">
+              <el-input v-model="dialogConfig2.data.importantDielectric" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="安全负责人" prop="responsible">
+              <el-input v-model="dialogConfig4.data.responsible" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="联系电话" prop="responsiblePhone">
+              <el-input v-model="dialogConfig4.data.responsiblePhone" readonly/>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </el-dialog>
+
+    <el-dialog class="business-dialog" v-model="dialogConfig5.show" :show-close="false" :append-to-body="true"
+               width="1000px" :top="'100px'">
+      <template #header>
+        <div class="cvi-dialog-header">
+          <div class="cvi-dialog-header-title">
+            <div class="dialog-line"></div>
+            {{ dialogConfig5.title }}
+          </div>
+          <i class="iconfont icon-zyyy_tcgb" @click="dialogConfig5.actions.handleClose"></i>
+        </div>
+      </template>
+
+      <el-row v-if="dialogConfig5.show">
+        <BusinessTable v-loading="tableConfig3.tableLoading"
+                       :config="tableConfig3"
+                       :query-params="queryParams3"
+                       :permissions="permissions3"
+                       :data-res="tableConfig3.data"
+                       @query-params="handleEnterpriseParams">
+
+          <el-table-column align="center" header-align="center" prop="agency.agencyName" label="执法机构" min-width="180"/>
+          <el-table-column align="center" header-align="center" prop="unitName" label="企业" min-width="200"/>
+          <el-table-column align="center" header-align="center" prop="unifiedSocialCode" label="统一信用代码"
+                           min-width="200"/>
+          <el-table-column align="center" header-align="center" prop="detailedAddress" label="地址" min-width="220"/>
+
+          <template #otherControlButtons="{ data: scope }">
+            <el-link type="primary" @click="handleEnterpriseDetail(scope.row)" title="查看">查看</el-link>
+          </template>
+        </BusinessTable>
+      </el-row>
+    </el-dialog>
+
+    <el-dialog class="business-dialog" v-model="dialogConfig6.show" :show-close="false" :append-to-body="true"
+               fullscreen style="border-radius: 16px;">
+      <template #header>
+        <div class="cvi-dialog-header">
+          <div class="cvi-dialog-header-title">
+            <div class="dialog-line"></div>
+            企业详情信息
+          </div>
+          <i class="iconfont icon-zyyy_tcgb" @click="dialogConfig6.actions.handleClose"></i>
+        </div>
+      </template>
+
+      <el-form>
+        <enterpriseInfo :dc="dialogConfig6"/>
+      </el-form>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import {onMounted, reactive, ref, toRefs} from 'vue'
+import api from '@/api/lawenforcement/OffSiteLawEnforce'
+import api2 from '@/api/lawenforcement/Enterprise'
+import * as echarts from 'echarts'
+import {useRouter} from 'vue-router'
+import axios from 'axios'
+import qs from 'qs'
+import {ElLoading} from 'element-plus'
+import {DEFAULT_ENTERPRISE_DETAIL} from '@/utils/Constants'
+import BusinessTable from '@/components/BusinessTable.vue'
+import enterpriseInfo from '@pages/dtsjygl/enterpriseInfo.vue'
+
+// 路由实例
+const router = useRouter()
+
+/**
+ * 随机巡查
+ */
+const goSjzxxc = (event) => {
+  router.push('/fxczfgl/zxxcqd/sjzxxc')
+}
+
+/**
+ * 定制巡查
+ */
+const goDzzxxc = (event) => {
+  router.push('/fxczfgl/zxxcqd/dzzxxc')
+}
+
+// 企业接入统计
+const qysj = reactive({jrzs: 0, ssjkqys: 0, spjkqys: 0, jkdzxl: 0})
+
+function findQyjrtj() {
+  api.findQyjrtj().then(res => {
+    if (res.success) {
+      qysj.jrzs = res.data
+    }
+  })
+}
+
+// 接入企业类型
+const qyrjsj = reactive({ks: 0, wh: 0, jyz: 0, gm: 0, aqsc: 0, jzsg: 0, xx: 0, yy: 0, whly: 0})
+
+function findQyjrlxtj() {
+  api.findQyjrlxtj().then(res => {
+    if (res.success) {
+      qyrjsj.ks = res.data.ks
+      qyrjsj.wh = res.data.wh
+      qyrjsj.jyz = res.data.jyz
+      qyrjsj.gm = res.data.gm
+      qyrjsj.aqsc = res.data.aqsc
+      qyrjsj.jzsg = res.data.jzsg
+      // qyrjsj.xx = res.data.xx
+      qyrjsj.yy = res.data.yy
+      // qyrjsj.whly = res.data.whly
+    }
+  })
+}
+
+// 非现场执法总数
+const sumNum = ref(0)
+
+function findFxczfzs() {
+  api.findFxczfzs().then(res => {
+    if (res.success) {
+      let data = res.data
+      sumNum.value = data.sumNum
+      showOnlineChart(data)
+    }
+  })
+}
+
+const chart1 = ref(null)
+let onlineChart = null
+
+function showOnlineChart(data) {
+  if (chart1.value) {
+    onlineChart = echarts.init(chart1.value)
+    const option = {
+      legend: {
+        show: true,
+        orient: 'vertical',
+        icon: 'roundRect',
+        right: size(16),
+        top: size(50),
+        itemHeight: size(12),
+        itemGap: size(15),
+        textStyle: {
+          color: '#373E52',
+          fontSize: size(14),
+          fontWeight: 'bold',
+        }
+      },
+      tooltip: {
+        trigger: 'item',
+        axisPointer: {
+          type: 'shadow'
+        }
+      },
+      series: [
+        {
+          type: 'pie',
+          center: ['26%', '46%'],
+          radius: ['76%', '40%'],
+          avoidLabelOverlap: false,
+          data: [
+            {
+              value: data.weekNum,
+              name: '周\u00A0\u00A0\u00A0' + data.weekNum + '\u00A0\u00A0\u00A0次',
+              itemStyle: {
+                color: '#F6372F',
+                borderColor: 'rgba(255, 255, 255, 0.8)',
+                borderWidth: 4
+              },
+            },
+            {
+              value: data.monthNum,
+              name: '月\u00A0\u00A0\u00A0' + data.monthNum + '\u00A0\u00A0\u00A0次',
+              itemStyle: {
+                color: '#F6A92F',
+                borderColor: 'rgba(255, 255, 255, 0.8)',
+                borderWidth: 4
+              },
+            },
+            {
+              value: data.yearNum,
+              name: '年\u00A0\u00A0\u00A0' + data.yearNum + '\u00A0\u00A0\u00A0次',
+              itemStyle: {
+                color: '#898FC0',
+                borderColor: 'rgba(255, 255, 255, 0.8)',
+                borderWidth: 4
+              },
+            }
+          ],
+          label: {
+            show: false,
+            position: 'outside'
+          }
+        }
+      ]
+    }
+    onlineChart.setOption(option, true)
+    window.onresize = () => onlineChart.resize()
+  }
+}
+
+// 预警分析
+function findQyyjtj() {
+  api.findQyyjtj().then(res => {
+    if (res.success) {
+      let data = res.data
+      showWarnChart(data)
+    }
+  })
+}
+
+const chart2 = ref(null)
+let warnChart = null
+
+function showWarnChart(data) {
+  if (chart2.value) {
+    let color = [
+      '#3C86FF', '#3C57FF', '#7C62D1',
+      '#A86ADC', '#D879E7', '#DF5C86',
+      '#DC8073', '#EA8936', '#E3DA6E',
+      '#BFE35D', '#A7E463', '#86BF55',
+      '#4DD188', '#16B6C9', '#0D5ED1',
+      '#8575BF',
+    ]
+    let seriesData = []
+    data.forEach((item, index) => {
+      const currentColor = color[index % color.length]
+      seriesData.push({
+        value: item.num,
+        name: item.eventDesc + '\u00A0\u00A0\u00A0' + item.num + '\u00A0\u00A0\u00A0次',
+        itemStyle: {
+          color: currentColor,
+          borderColor: 'rgba(255, 255, 255, 0.8)',
+          borderWidth: 4
+        }
+      })
+    })
+    warnChart = echarts.init(chart2.value)
+    const option = {
+      legend: {
+        show: true,
+        type: 'scroll',
+        orient: 'vertical',
+        icon: 'roundRect',
+        right: size(26),
+        top: size(18),
+        itemHeight: size(12),
+        itemGap: size(15),
+        textStyle: {
+          color: '#373E52',
+          fontSize: size(14),
+          fontWeight: 'bold',
+        },
+        pageIconSize: 12,
+        pageIconColor: '#3C86FF',
+      },
+      tooltip: {
+        trigger: 'item',
+        axisPointer: {
+          type: 'shadow'
+        }
+      },
+      series: [
+        {
+          type: 'pie',
+          center: ['24%', '46%'],
+          radius: ['76%', '40%'],
+          avoidLabelOverlap: false,
+          data: seriesData,
+          label: {
+            show: false,
+            position: 'outside'
+          }
+        }
+      ]
+    }
+    warnChart.setOption(option, true)
+    window.onresize = () => onlineChart.resize()
+  }
+}
+
+// 非现场执法统计
+let isShow = ref(false)
+
+function showSelect() {
+  isShow.value = true
+}
+
+let type = '1'
+let label = ref('按区县统计')
+
+function findFxczftj(val) {
+  type = val
+  isShow.value = false
+  if ('1' === val) {
+    label.value = '按区县统计'
+  } else {
+    label.value = '按月统计'
+  }
+  api.findFxczftj({'type': type}).then(res => {
+    if (res.success) {
+      let data = res.data
+      showOnlineStatisticsChart(data)
+    }
+  })
+}
+
+const chart3 = ref(null)
+let onlineStatisticsChart = null
+
+function showOnlineStatisticsChart(data) {
+  if (chart3.value) {
+    let xData = []
+    let seriesData1 = []
+    data.forEach(item => {
+      type === '1' ? xData.push(item.agency_name) : xData.push(item.date)
+      seriesData1.push(item.zs)
+    })
+    onlineStatisticsChart = echarts.init(chart3.value)
+    const option = {
+      grid: {
+        top: '8%',
+        bottom: '18%',
+        left: '5%',
+        right: '0%'
+      },
+      tooltip: {
+        trigger: 'axis',
+        axisPointer: {
+          type: 'shadow'
+        }
+      },
+      xAxis: {
+        type: 'category',
+        axisLine: {
+          show: true,
+          lineStyle: {
+            color: 'rgba(0,0,0,0.1)'
+          }
+        },
+        axisTick: {
+          show: false
+        },
+        axisLabel: {
+          show: true,
+          interval: 0,
+          overflow: 'truncate',
+          textStyle: {
+            color: ' rgba(0, 0, 0, 0.45)',
+            fontSize: size(14)
+          }
+        },
+        data: xData
+      },
+      yAxis: {
+        type: 'value',
+        axisLine: {
+          show: true,
+          lineStyle: {
+            color: 'rgba(0,0,0,0.1)'
+          }
+        },
+        axisLabel: {
+          show: true,
+          interval: 0,
+          overflow: 'truncate',
+          textStyle: {
+            color: ' rgba(0, 0, 0, 0.45)',
+            fontSize: size(14)
+          }
+        },
+        axisTick: {
+          show: false
+        },
+        splitLine: {
+          show: false
+        },
+      },
+      series: [
+        {
+          type: 'bar',
+          barWidth: size(40),
+          itemStyle: {
+            color: {
+              type: 'linear',
+              x: 1, // 渐变起始点的 x 坐标（左）
+              y: 1, // 渐变起始点的 y 坐标（上）
+              x2: 1, // 渐变结束点的 x 坐标（右）
+              y2: 0, // 渐变结束点的 y 坐标（上）
+              colorStops: [
+                {
+                  offset: 0, // 起始点
+                  color: '#B3D0FF' // 起始颜色
+                },
+                {
+                  offset: 1, // 结束点
+                  color: '#3C86FF' // 结束颜色
+                }
+              ]
+            },
+            barBorderRadius: [5, 5, 0, 0]
+          },
+          data: seriesData1
+        }
+      ],
+    }
+    onlineStatisticsChart.setOption(option, true)
+    window.onresize = () => onlineStatisticsChart.resize()
+  }
+}
+
+// 监控预警信息
+let yjxxList = ref([])
+
+function findJkyjxx() {
+  api.findJkyjxx({'page': 1, 'pagesize': 4, 'sort': 'time', 'dir': 'desc'}).then(res => {
+    if (res.success) {
+      let data = res.data
+      yjxxList.value = data
+    }
+  })
+}
+
+// 详情
+const state = reactive({
+  dialogConfig: {
+    title: '监控预警',
+    show: false,
+    mode: 'detail',
+    loading: false,
+    data: {},
+    actions: {
+      handleClose: handleClose,
+    }
+  },
+  permissions: {
+    detail: false
+  },
+  tableConfig: {
+    hasControlColumn: true,
+    controlWidth: '80',
+    multipleSelect: false,
+    tableLoading: false,
+    pageSizes: [10, 20, 50, 100],
+    pagerLayout: '->, slot, prev, pager, next',
+  },
+  queryParams: {},
+  dialogConfig2: {
+    title: '监控预警详情',
+    show: false,
+    mode: 'detail',
+    loading: false,
+    data: {},
+    actions: {
+      handleClose: handleClose2,
+    }
+  },
+  dialogConfig3: {
+    title: '企业信息',
+    show: false,
+    mode: 'detail',
+    loading: false,
+    data: {},
+    actions: {
+      handleClose: closeDangerEnterprise,
+    }
+  },
+  tableConfig2: {
+    hasControlColumn: true,
+    controlWidth: '80',
+    multipleSelect: false,
+    tableLoading: false,
+    pageSizes: [10, 20, 50, 100],
+    pagerLayout: '->, slot, prev, pager, next',
+    data: {},
+  },
+  queryParams2: {},
+  permissions2: {
+    detail: false
+  },
+  dialogConfig4: {
+    title: '企业详情',
+    show: false,
+    mode: 'detail',
+    loading: false,
+    data: {
+      pssCoreUnitDto: {},
+    },
+    actions: {
+      handleClose: closeDangerEnterpriseDetail,
+    }
+  },
+  dialogConfig5: {
+    title: '企业信息',
+    show: false,
+    mode: 'detail',
+    loading: false,
+    actions: {
+      handleClose: closeEnterprise,
+    }
+  },
+  tableConfig3: {
+    hasControlColumn: true,
+    controlWidth: '80',
+    multipleSelect: false,
+    tableLoading: false,
+    pageSizes: [10, 20, 50, 100],
+    pagerLayout: '->, slot, prev, pager, next',
+    data: {
+      agency: {}
+    },
+  },
+  queryParams3: {},
+  permissions3: {
+    detail: false
+  },
+  dialogConfig6: {
+    title: '企业详情',
+    show: false,
+    mode: 'detail',
+    loading: false,
+    data: {},
+    actions: {
+      handleClose: closeEnterpriseDetail,
+    }
+  }
+})
+
+const {
+  dialogConfig,
+  tableConfig,
+  permissions,
+  queryParams,
+  dialogConfig2,
+  dialogConfig3,
+  tableConfig2,
+  queryParams2,
+  permissions2,
+  dialogConfig4,
+  dialogConfig5,
+  tableConfig3,
+  queryParams3,
+  permissions3,
+  dialogConfig6,
+} = toRefs(state)
+
+function showDialog() {
+  queryParams.value.sort = 'time'
+  queryParams.value.dir = 'desc'
+  queryParams.value.pagesize = 10
+  queryParams.value.pageSize = 10
+  dialogConfig.value.show = true
+  //getYjxxPage()
+}
+
+function handleQueryParams(val) {
+  Object.assign(queryParams.value, val)
+  getYjxxPage()
+}
+
+function getYjxxPage() {
+  dialogConfig.value.loading = true
+  api.findJkyjxx(queryParams.value).then(res => {
+    dialogConfig.value.loading = false
+    if (res.success) {
+      dialogConfig.value.data = res
+    }
+  })
+}
+
+function handleDetail(val) {
+  dialogConfig2.value.show = true
+  dialogConfig2.value.data = Object.assign({}, val)
+}
+
+function handleClose() {
+  dialogConfig.value.show = false
+}
+
+function handleClose2() {
+  dialogConfig2.value.show = false
+}
+
+//重置字体大小
+function size(value) {
+  let clientWidth = document.documentElement.clientWidth
+  return clientWidth * value / 1920
+}
+
+// 企业总数
+let access_token
+
+function getToken() {
+  axios.post(
+      '/dah-login/oauth/token',
+      qs.stringify({  // 将数据转换为 form-urlencoded 格式
+        grant_type: 'free_token',
+        free_token: 'cU0UMcg4NXZaXdZo8Br06g=='
+      }),
+      {
+        headers: {
+          'Authorization': 'Basic d2ViLWNsaWVudDpzOVBmWmRIVnJmZGRJb2paS3U='
+        }
+      }
+  ).then(res => {
+    let data = res.data
+    if (data.code === 200) {
+      access_token = data.data.access_token
+      getAuth()
+    }
+  })
+}
+
+function getAuth() {
+  axios.get(
+      '/dah-api/authenticated/web-context-info?applicationCode=government',
+      {
+        headers: {
+          'Authorization': 'Bearer ' + access_token
+        }
+      }
+  ).then(res => {
+    let data = res.data
+    if (data.code === 200) {
+      getEnterpriseStatistic()
+    }
+  })
+}
+
+function getEnterpriseStatistic() {
+  axios.get(
+      '/dah-api/monitor/home/statistic/unit-mhi',
+      {
+        headers: {
+          'Authorization': 'Bearer ' + access_token
+        }
+      }
+  ).then(res => {
+    let data = res.data
+    if (data.code === 200) {
+      qysj.jrzs = data.data.unitCount
+      qysj.ssjkqys = data.data.proberUnitCount
+      qysj.spjkqys = data.data.cameraUnitCount
+    }
+  })
+}
+
+function showDangerEnterprise(type) {
+  dialogConfig3.value.show = true
+  queryParams2.value = {}
+  if (type === 1) {
+    queryParams2.value.type = 'all'
+  } else if (type === 2) {
+    queryParams2.value.isProberJoined = true
+  } else if (type === 3) {
+    queryParams2.value.isCameraJoined = true
+  }
+  queryParams2.value.pageSize = 10
+  queryParams2.value.pageNum = 1
+  // getDangerEnterpriseList()
+}
+
+function handleDangerEnterpriseParams(val) {
+  Object.assign(queryParams2.value, val)
+  queryParams2.value.pageNum = queryParams2.value.page
+  getDangerEnterpriseList()
+}
+
+function getDangerEnterpriseList() {
+  axios.get('/dah-api/monitor/units/page',
+      {
+        params: queryParams2.value,
+        headers: {
+          'Authorization': 'Bearer ' + access_token
+        }
+      }
+  ).then(res => {
+    let data = res.data
+    if (data.code === 200) {
+      let res = {
+        "code": 0,
+        "success": true,
+        "data": data.data.rows,
+        "total": data.data.total,
+        "page": data.data.pageNum,
+        "limit": data.data.pageSize,
+        "totalPages": data.data.pages,
+        "relation": "eq"
+      }
+      tableConfig2.value.data = res
+    }
+  })
+}
+
+function closeDangerEnterprise() {
+  dialogConfig3.value.show = false
+}
+
+function handleDangerEnterpriseDetail(val) {
+  dialogConfig4.value.show = true
+  dialogConfig4.value.data = Object.assign({}, val)
+}
+
+function closeDangerEnterpriseDetail() {
+  dialogConfig4.value.show = false
+}
+
+// 企业信息列表
+function showEnterprise(type) {
+  dialogConfig5.value.show = true
+  queryParams3.value.pageSize = 10
+  queryParams3.value.pagesize = 10
+  queryParams3.value.page = 1
+  queryParams3.value.qylx = type
+  //getEnterpriseList()
+}
+
+function handleEnterpriseParams(val) {
+  Object.assign(queryParams3.value, val)
+  getEnterpriseList()
+}
+
+function getEnterpriseList() {
+  api2.queryJoin(queryParams3.value).then(res => {
+    if (res.code === 0) {
+      tableConfig3.value.data = res
+    }
+  })
+}
+
+function closeEnterprise() {
+  dialogConfig5.value.show = false
+}
+
+let loadingInstance
+
+function handleEnterpriseDetail(row) {
+  loadingInstance = ElLoading.service({fullscreen: true})
+  findOne(row)
+}
+
+const defaultValues = reactive(DEFAULT_ENTERPRISE_DETAIL)
+
+function findOne(row) {
+  let defaultVals = {
+    //安全基础管理信息
+    productionManageInfoExp: {productionManageSystems: [{systemName: '', systemCompileDate: ''}], productionManagePlans: [{planName: '', planCompileDate: '', planType: ''}]},
+    //生产设备设施及公用辅助用房
+    productionEquipmentExp: {productionFacilities: [{equipName: '', equipType: '', commissioningDate: ''}], auxiliaryBuildings: [{auxiliaryName: '', floorArea: '', commissioningDate: ''}]},
+    //煤行业扩展信息
+    coalIndustryExpansion: {},
+    //非煤行业扩展信息
+    nocoalIndustryExpansion: {},
+    //危化行业扩展信息
+    dangerFeatureInfo: {majorDangerInfos: {}, majorDangerCraftInfos: {}, dangerInfos: {}},
+    //烟花爆竹行业扩展信息
+    fireworksAddInfo: {},
+    //工贸行业扩展信息
+    industryExpandInfos: {}
+  }
+  dialogConfig.value.data = Object.assign({}, defaultVals)
+  api2.findOne(row.enterpriseId).then(res => {
+    loadingInstance.close()
+    dialogConfig6.value.show = true
+    if (res.success) {
+      const data = res.data || {}
+      // 调用字段解析函数
+      const fieldsToDeserialize = Object.keys(defaultValues)
+      deserializeFields(data, fieldsToDeserialize)
+      Object.keys(defaultValues).forEach(key => {
+        if (!data[key]) {
+          data[key] = defaultValues[key]
+        }
+      })
+      data.regulatedIndustry = data.regulatedIndustry ? data.regulatedIndustry.split("/") : []
+      data.areaComb = data.areaComb ? data.areaComb.split("/") : []
+      data.opLocAreaComb = data.opLocAreaComb ? data.opLocAreaComb.split("/") : []
+      dialogConfig6.value.data = Object.assign({}, data)
+    }
+  })
+}
+
+function deserializeFields(data, fields) {
+  fields.forEach(field => {
+    if (data[field]) {
+      try {
+        data[field] = JSON.parse(data[field])
+      } catch (e) {
+        console.error(`Failed to parse ${field}:`, e)
+      }
+    }
+  })
+}
+
+function closeEnterpriseDetail() {
+  dialogConfig6.value.show = false
+}
+
+onMounted(() => {
+  //findQyjrtj()
+  getToken()
+  findQyjrlxtj()
+  findFxczfzs()
+  findQyyjtj()
+  findFxczftj('1')
+  findJkyjxx()
+})
+</script>
+
+<style lang="scss" scoped>
+.container {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  position: relative;
+  overflow-y: auto;
+}
+
+.section-title {
+  display: flex;
+  position: relative;
+
+  .section-title-icon {
+    border: 3px solid rgb(60, 134, 255);
+    border-radius: 3px;
+  }
+
+  .section-title-font {
+    margin-left: calc(100vw * 10 / 1920);
+    font-family: OPlusSans3-Bold;
+    font-size: calc(100vh * 18 / 953);
+    color: rgba(255, 255, 255, 1);
+    line-height: calc(100vh * 20 / 953);
+    font-weight: 700;
+  }
+
+  .font-color {
+    color: rgba(55, 62, 82, 1);
+  }
+
+  .section-title-select {
+    width: calc(100vw * 140 / 1920);
+    height: calc(100vh * 24 / 953);
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    background: #FFFFFF;
+    border: 1px solid rgba(55, 62, 82, 0.1);
+    border-radius: 4px;
+    cursor: pointer;
+    position: absolute;
+    top: calc(100vw * -3 / 1920);
+    right: 0;
+    z-index: 9999999;
+
+    .label {
+      margin-left: calc(100vw * 10 / 1920);
+      opacity: 0.6;
+      font-family: OPPOSans40_Medium;
+      font-size: calc(100vh * 12 / 953);
+      color: #373E52;
+      font-weight: 500;
+    }
+
+    .icon {
+      width: calc(100vh * 12 / 953);
+      height: calc(100vh * 12 / 953);
+      background-image: url("../../assets/bigscreen/41.png");
+      background-size: cover;
+      background-repeat: no-repeat;
+      position: absolute;
+      right: calc(100vw * 10 / 1920);
+    }
+  }
+
+  .section-title-selection {
+    width: calc(100vw * 140 / 1920);
+    height: calc(100vh * 60 / 953);
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    background: #FFFFFF;
+    border: 1px solid rgba(55, 62, 82, 0.1);
+    border-radius: 4px;
+    position: absolute;
+    top: calc(100vh * 30 / 953);
+    right: 0;
+    z-index: 9999999;
+
+    .section-title-selection-item {
+      flex: 1;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      cursor: pointer;
+      opacity: 0.6;
+      font-family: OPPOSans40_Medium;
+      font-size: calc(100vh * 12 / 953);
+      color: #373E52;
+      font-weight: 500;
+    }
+
+  }
+
+  .section-title-more {
+    width: calc(100vw * 72 / 1920);
+    height: calc(100vh * 24 / 953);
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    align-items: center;
+    border: 1px solid rgba(55, 62, 82, 0.1);
+    border-radius: 4px;
+    cursor: pointer;
+    position: absolute;
+    top: calc(100vh * -3 / 953);
+    right: 0;
+
+    span {
+      font-family: OPPOSans40_Medium;
+      font-size: calc(100vh * 12 / 953);
+      color: #000;
+      text-align: center;
+      line-height: calc(100vh * 20 / 953);
+      font-weight: 500;
+    }
+  ;
+  }
+
+}
+
+.section-content {
+  flex: 1;
+  margin-top: calc(100vh * 10 / 953);
+}
+
+.left-container {
+  position: absolute;
+  top: calc(100vh * 10 / 953);
+  left: calc(100vw * 8 / 1920);
+  //width: calc(100vw * 375 / 1920);
+  width: 24.6%;
+  margin-right: calc(100vw * 32 / 1920);
+
+  .qys,
+  .qylx,
+  .ymtz {
+    box-sizing: border-box;
+    display: flex;
+    background: rgba(255, 255, 255, 0.25);
+    border: 1px solid rgba(255, 255, 255, 1);
+    border-radius: 16px;
+  }
+
+  .qys {
+    width: 100%;
+    height: calc(100vh * 255 / 953);
+    padding: calc(100vh * 12 / 953);
+    flex-direction: column;
+
+    .qys-content {
+      display: flex;
+      flex-direction: row;
+
+      .left {
+        flex: 1;
+        padding: calc(100vh * 14 / 953);
+        margin-right: calc(100vw * 10 / 1920);
+        background: #FFFFFF;
+        border: 1px solid rgba(255, 255, 255, 1);
+        background: linear-gradient(rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.75)), rgba(60, 134, 255, 0.1);
+        box-shadow: 0px 0px 8px rgba(255, 255, 255, 0.5) inset;
+        border-radius: 12px;
+        cursor: pointer;
+
+        .icon {
+          width: calc(100vh * 50 / 953);
+          height: calc(100vh * 50 / 953);
+          background-image: url("../../assets/bigscreen/50.png");
+          background-size: cover;
+          background-repeat: no-repeat;
+        }
+
+        .label {
+          font-family: OPPOSans40_Bold;
+          font-size: calc(100vh * 18 / 953);
+          color: #373E52;
+          font-weight: 700;
+        }
+
+        .num {
+          font-family: OPPOSans40_Bold;
+          font-size: calc(100vh * 32 / 953);
+          color: #3C86FF;
+          font-weight: 700;
+        }
+
+      }
+
+      .right {
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+
+
+        .ssjcqy {
+          flex: 3;
+          display: flex;
+          flex-direction: row;
+          margin-bottom: calc(100vh * 10 / 953);
+          border: 1px solid rgba(255, 255, 255, 1);
+          background: linear-gradient(rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.75)), rgba(60, 134, 255, 0.1);
+          box-shadow: 0px 0px 8px rgba(255, 255, 255, 0.5) inset;
+          border-radius: 12px;
+          cursor: pointer;
+
+          .icon {
+            flex: 1;
+            margin-top: calc(100vh * 5 / 953);
+            width: calc(100vh * 32 / 953);
+            height: calc(100vh * 40 / 953);
+            background-image: url("../../assets/bigscreen/51.png");
+            background-size: cover;
+            background-repeat: no-repeat;
+          }
+
+          .text {
+            flex: 2;
+            margin-top: calc(100vh * 5 / 953);
+
+            .label {
+              font-family: OPPOSans40_Bold;
+              font-size: calc(100vh * 14 / 953);
+              color: #373E52;
+              font-weight: 700;
+            }
+
+            .num {
+              font-family: OPPOSans40_Bold;
+              font-size: calc(100vh * 14 / 953);
+              color: #3C86FF;
+              font-weight: 700;
+            }
+          }
+
+        }
+
+        .spjcqy {
+          flex: 4;
+          display: flex;
+          flex-direction: row;
+          border: 1px solid rgba(255, 255, 255, 1);
+          background: linear-gradient(rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.75)), rgba(60, 134, 255, 0.1);
+          box-shadow: 0px 0px 8px rgba(255, 255, 255, 0.5) inset;
+          border-radius: 12px;
+          cursor: pointer;
+
+          .icon {
+            flex: 1;
+            margin-top: calc(100vh * 5 / 953);
+            width: calc(100vh * 32 / 953);
+            height: calc(100vh * 40 / 953);
+            background-image: url("../../assets/bigscreen/31.png");
+            background-size: cover;
+            background-repeat: no-repeat;
+          }
+
+          .text {
+            flex: 2;
+            margin-top: calc(100vh * 5 / 953);
+
+            .label {
+              font-family: OPPOSans40_Bold;
+              font-size: calc(100vh * 14 / 953);
+              color: #373E52;
+              font-weight: 700;
+            }
+
+            .num {
+              font-family: OPPOSans40_Bold;
+              font-size: calc(100vh * 14 / 953);
+              color: #3C86FF;
+              font-weight: 700;
+            }
+
+            .rate {
+              margin-top: 1px;
+              font-family: OPPOSans40_Bold;
+              font-size: calc(100vh * 12 / 953);
+              color: #3C86FF;
+              font-weight: 700;
+
+              span {
+                color: #373E52;
+              }
+            }
+          }
+
+        }
+      }
+
+    }
+
+  }
+
+  .qylx {
+    width: 100%;
+    height: calc(100vh * 364 / 953);
+    padding: calc(100vh * 12 / 953);
+    margin: calc(100vh * 28 / 953) 0;
+    flex-direction: column;
+
+    .qylx-content {
+      display: flex;
+      flex-wrap: wrap;
+      background: rgba(255, 255, 255, 0.35);
+      border: 1px solid rgba(255, 255, 255, 0.2);
+      border-radius: 12px;
+
+      .item {
+        flex: 1;
+        flex: 0 0 33.33%;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+        box-sizing: border-box;
+        border: 1px solid #ECEDED;
+        border-top: none;
+        border-left: none;
+        cursor: pointer;
+
+        .icon {
+          width: calc(100vh * 32 / 953);
+          height: calc(100vh * 32 / 953);
+          background-image: url("../../assets/bigscreen/52.png");
+          background-size: cover;
+          background-repeat: no-repeat;
+        }
+
+        .icon2 {
+          background-image: url("../../assets/bigscreen/32.png");
+        }
+
+        .icon3 {
+          background-image: url("../../assets/bigscreen/33.png");
+        }
+
+        .icon4 {
+          background-image: url("../../assets/bigscreen/34.png");
+        }
+
+        .icon5 {
+          background-image: url("../../assets/bigscreen/35.png");
+        }
+
+        .icon6 {
+          background-image: url("../../assets/bigscreen/36.png");
+        }
+
+        .icon7 {
+          background-image: url("../../assets/bigscreen/53.png");
+        }
+
+        .icon8 {
+          background-image: url("../../assets/bigscreen/37.png");
+        }
+
+        .icon9 {
+          background-image: url("../../assets/bigscreen/38.png");
+        }
+
+        .label {
+          font-family: OPPOSans40_Bold;
+          font-size: calc(100vh * 14 / 953);
+          color: #373E52;
+          font-weight: 700;
+        }
+
+        .num {
+          font-family: OPPOSans40_Bold;
+          font-size: calc(100vh * 14 / 953);
+          color: #3C86FF;
+          font-weight: 700;
+        }
+      }
+
+      .bgs {
+        background: rgba(255, 255, 255, 0.35);
+      }
+
+      .item:nth-child(3n) {
+        border-right: none;
+      }
+
+      .item:nth-last-child(-n+3) {
+        border-bottom: none;
+      }
+
+    }
+
+  }
+
+  .ymtz {
+    width: 100%;
+    height: calc(100vh * 105 / 953);
+    padding: calc(100vh * 12 / 953);
+    flex-direction: row;
+
+    .item {
+      flex: 1;
+      display: flex;
+      align-items: center;
+      border: 1px solid rgba(255, 255, 255, 1);
+      background: linear-gradient(rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.75)), rgba(60, 134, 255, 0.1);
+      box-shadow: 0px 0px 8px rgba(255, 255, 255, 0.5) inset;
+      border-radius: 12px;
+      cursor: pointer;
+
+      .icon {
+        margin: calc(100vh * 8 / 953) calc(100vw * 10 / 1920) 0 calc(100vw * 10 / 1920);
+        width: calc(100vh * 48 / 953);
+        height: calc(100vh * 48 / 953);
+        background-image: url("../../assets/bigscreen/40.png");
+        background-size: cover;
+        background-repeat: no-repeat;
+      }
+
+      .label {
+        font-family: OPPOSans40_Bold;
+        font-size: calc(100vh * 14 / 953);
+        color: #373E52;
+        text-align: center;
+        font-weight: 700;
+      }
+    }
+
+    .item:first-child {
+      margin-right: calc(100vh * 10 / 953);
+
+      .icon {
+        background-image: url("../../assets/bigscreen/39.png");
+      }
+    }
+
+  }
+
+}
+
+.right-container {
+  position: absolute;
+  top: calc(100vh * 10 / 953);
+  right: calc(100vw * 8 / 1920);
+  //width: calc(100vw * 1176 / 1920);
+  width: 72.5%;
+  display: flex;
+  flex-direction: column;
+
+  .fxczfzs,
+  .yjfx,
+  .fxczftj,
+  .jkyj {
+    box-sizing: border-box;
+    padding: calc(100vh * 12 / 953);
+    display: flex;
+    flex-direction: column;
+    border: 1px solid rgba(255, 255, 255, 1);
+    background: linear-gradient(rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.75)), rgba(60, 134, 255, 0.1);
+    box-shadow: 0px 0px 8px rgba(255, 255, 255, 0.5) inset;
+    border-radius: 16px;
+  }
+
+  .right-top-container {
+    width: 100%;
+    height: calc(100vh * 255 / 953);
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: row;
+
+    .fxczfzs {
+      width: calc((100% - calc(100vw * 32 / 1920)) / 2);
+      height: 100%;
+      margin-right: calc(100vw * 32 / 1920);
+
+      .fxczfzs-content {
+        flex: 1;
+        display: flex;
+        flex-direction: row;
+
+        .left {
+          flex: 2;
+          display: flex;
+          flex-direction: column;
+          justify-content: center;
+          align-items: center;
+
+          .label {
+            ont-family: OPPOSans40_Bold;
+            font-size: calc(100vh * 14 / 953);
+            color: #373E52;
+            font-weight: 700;
+          }
+
+          .num {
+            font-family: OPPOSans40_Bold;
+            font-size: calc(100vh * 32 / 953);
+            color: #3C86FF;
+            font-weight: 700;
+
+            span {
+              font-family: OPPOSans40_Bold;
+              font-size: calc(100vh * 12 / 953);
+              color: #373E52;
+              font-weight: 700;
+            }
+          }
+        }
+
+        .right {
+          flex: 3;
+        }
+      }
+
+    }
+
+    .yjfx {
+      width: calc((100% - calc(100vw * 32 / 1920)) / 2);
+      height: 100%;
+
+      .yjfx-content {
+        flex: 1;
+        display: flex;
+        flex-direction: row;
+      }
+
+    }
+  }
+
+  .fxczftj {
+    width: 100%;
+    height: calc(100vh * 243 / 953);
+    margin: calc(100vh * 28 / 953) 0;
+
+    .fxczftj-content {
+      display: flex;
+      flex-direction: row;
+
+    }
+  }
+
+  .jkyj {
+    width: 100%;
+    height: calc(100vh * 226 / 953);
+
+    .jkyj-content {
+      flex: 1;
+      display: flex;
+      flex-direction: row;
+      gap: calc(100vw * 14 / 1920);
+
+      .item {
+        flex: 1;
+        border-radius: 12px;
+        position: relative;
+        cursor: pointer;
+
+        img {
+          width: 100%;
+          height: 100%;
+          border-radius: 12px;
+          position: absolute;
+          top: 0;
+          left: 0;
+          z-index: 1;
+          object-fit: cover;
+        }
+
+        .label {
+          width: auto;
+          height: calc(100vh * 32 / 953);
+          padding: 0 calc(100vw * 8 / 1920);
+          background: #F6372F;
+          box-shadow: inset 0px 0px 8px 0px rgba(255, 255, 255, 0.5);
+          box-shadow: 0px 4px 8px 0px rgba(255, 69, 73, 0.2);
+          border-radius: 12px 0px 12px 0px;
+          font-family: OPPOSans40_Bold;
+          font-size: calc(100vh * 14 / 953);
+          line-height: calc(100vh * 32 / 953);
+          color: #FFFFFF;
+          font-weight: 700;
+          position: absolute;
+          top: 0;
+          left: 0;
+          z-index: 2;
+        }
+
+        .qymc {
+          font-family: OPPOSans40_Bold;
+          font-size: calc(100vh * 14 / 953);
+          color: #fff;
+          font-weight: 700;
+          position: absolute;
+          bottom: calc(100vh * 50 / 953);
+          left: calc(100vw * 20 / 1920);
+          z-index: 2;
+        }
+
+        .address {
+          display: flex;
+          flex-direction: row;
+          align-items: center;
+          font-family: OPPOSans40_Bold;
+          font-size: calc(100vh * 12 / 953);
+          color: #fff;
+          font-weight: 700;
+          position: absolute;
+          bottom: calc(100vh * 30 / 953);
+          left: calc(100vw * 20 / 1920);
+          z-index: 2;
+
+          .icon {
+            width: calc(100vh * 12 / 953);
+            height: calc(100vh * 12 / 953);
+            margin-right: calc(100vw * 6 / 1920);
+            background-image: url("../../assets/bigscreen/55.png");
+            background-size: cover;
+            background-repeat: no-repeat;
+          }
+        }
+
+        .time {
+          font-family: OPPOSans40;
+          font-size: calc(100vh * 12 / 953);
+          color: #fff;
+          font-weight: 400;
+          position: absolute;
+          bottom: calc(100vh * 10 / 953);
+          left: calc(100vw * 20 / 1920);
+          z-index: 2;
+        }
+
+        .seek {
+          width: calc(100vh * 56 / 953);
+          height: calc(100vh * 26 / 953);
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          background: #F1FFEF;
+          border: 1px solid rgba(65, 214, 108, 0.38);
+          border-radius: 16px;
+          font-family: OPPOSans40;
+          font-size: calc(100vh * 12 / 953);
+          color: #31D043;
+          text-align: center;
+          line-height: calc(100vh * 18 / 953);
+          font-weight: 500;
+          position: absolute;
+          bottom: calc(100vh * 10 / 953);
+          right: calc(100vw * 20 / 1920);
+          z-index: 2;
+        }
+      }
+    }
+  }
+
+}
+
+.cvi-dialog-header {
+  display: -webkit-box !important;
+  display: -webkit-flex !important;
+  display: flex !important;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  justify-content: space-between;
+  padding-right: 1.625rem;
+  height: 3.5rem;
+  line-height: 3.5rem;
+  font-weight: 700;
+  font-size: 1rem;
+  font-style: normal;
+  border-bottom: 0.0625rem solid #ececec;
+}
+
+.cvi-dialog-header-title {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: flex;
+  color: var(--el-color-primary);
+  position: relative;
+}
+
+.cvi-dialog-header .icon-zyyy_tcgb {
+  width: 1.875rem;
+  height: 1.875rem;
+  align-items: center;
+  background-color: var(--el-color-primary-light-9);
+  border-radius: 50%;
+  position: absolute;
+  right: 28px;
+  top: 14px;
+}
+
+.cvi-dialog-header .icon-zyyy_tcgb::before {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.cvi-dialog-header .iconfont {
+  font-size: .75rem !important;
+  cursor: pointer;
+  color: var(--el-color-primary);
+}
+</style>
diff --git a/client/src/views/fxczfgl/sjzxxc.vue b/client/src/views/fxczfgl/sjzxxc.vue
new file mode 100644
index 0000000..856c05e
--- /dev/null
+++ b/client/src/views/fxczfgl/sjzxxc.vue
@@ -0,0 +1,447 @@
+<template>
+  <browser :component-loading="componentLoading"
+           class="enterpriseInfo"
+           ref="broTable"
+           :api-config="apiConfig"
+           :table-config="tableConfig"
+           :permissions="permissions"
+           :dialog-config="dialogConfig"
+           :default-query-params="queryParams"
+           :actions="actions"
+           :customQuery="true"
+           @custom-query="handleQuery"
+           @update:actions="actions = $event"
+           @update:selection="selection = $event"
+           @update:query-params="queryParams = $event"
+           @update:dialog-config="dialogConfig = $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">
+              <AgencySelector :filterable="true" v-model="queryParams.agency" :lazy-load="true" :multiple="false"
+                              placeholder="请选择"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="行业类型" prop="industryType">
+              <el-select v-model="queryParams.industryType" placeholder="请选择" clearable>
+                <el-option v-for="item in DICTITEMS.HYLB_OPTIONS" :key="item.value" :label="item.label"
+                           :value="item.value"/>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="巡查类型" prop="xclx">
+              <el-select v-model="queryParams.xclx" placeholder="请选择" clearable>
+                <el-option v-for="item in DICTITEMS.XCLX_OPTIONS" :key="item.value" :label="item.label"
+                           :value="item.value"/>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6">
+            <el-form-item label="巡查数量" prop="insNum">
+              <el-input v-model="queryParams.insNum" clearable/>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </template>
+
+    <template #extraButton>
+      <el-button class="extra-button" type="warning" @click="handleSelectData">随机巡查</el-button>
+    </template>
+
+    <el-table-column prop="agency.agencyName" label="属地" min-width="250"/>
+    <el-table-column prop="unitName" label="企业" min-width="350"/>
+    <el-table-column prop="industryType" label="行业类型" min-width="200">
+      <template #default="{row}">
+        <el-span>{{ DICTDISPLAYS.HYLB_MAP[row.industryType] || row.industryType }}</el-span>
+      </template>
+    </el-table-column>
+    <el-table-column prop="videoAccessMsg" label="视频" min-width="100"/>
+    <el-table-column prop="perceptionAccessMsg" label="感知" min-width="100"/>
+    <el-table-column prop="infoAccessMsg" label="资料" min-width="100"/>
+    <el-table-column prop="permitAccessMsg" label="许可" min-width="100"/>
+
+    <template #dialog>
+      <el-dialog class="business-dialog" v-model="dialogConfig.show" :show-close="false" :append-to-body="true"
+                 fullscreen>
+        <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="dialogConfig.formLabelWidth" :model="dialogConfig.data" :rules="dialogConfig.rules">
+          <enterpriseInfo :dc="dialogConfig"/>
+        </el-form>
+      </el-dialog>
+
+      <el-dialog class="business-dialog" v-model="dialogConfig1.show" :show-close="false" :append-to-body="true"
+                 :top="'100px'">
+        <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" :model="dialogConfig1.data" :rules="dialogConfig1.rules" ref="formRef">
+          <el-row>
+            <el-col :span="24" class="padding-bottom-10">
+              <el-table :data="dialogConfig1.data.enterprise" height="300" border>
+                <el-table-column header-align="center" align="center" label="属地" prop="agency.agencyName"
+                                 min-width="250"/>
+                <el-table-column header-align="center" align="center" label="企业名称" prop="unitName" min-width="250"/>
+              </el-table>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item label="录入人" prop="createUserName">
+                <el-input v-model="dialogConfig1.data.createUserName" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item label="录入时间" prop="createTime">
+                <el-input v-model="dialogConfig1.data.createTime" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item label="有效期" prop="validTime">
+                <el-date-picker v-model="dialogConfig1.data.validTime"
+                                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 #footer>
+          <div class="cvi-dialog-footer">
+            <el-button @click="dialogConfig1.actions.handleClose">取消</el-button>
+            <el-button type="primary" @click="dialogConfig1.actions.handleDialogOk">确定</el-button>
+          </div>
+        </template>
+      </el-dialog>
+    </template>
+  </browser>
+</template>
+
+<script setup>
+import {reactive, toRefs, computed, ref, nextTick, watch} from 'vue'
+import {useUserStore} from '@/stores/modules/user'
+import enterprises from '@/api/lawenforcement/Enterprise.js'
+import {DEFAULT_ENTERPRISE_DETAIL, DICTDISPLAYS, DICTITEMS} from '@/utils/Constants.js'
+import {ElMessage} from 'element-plus'
+import moment from 'moment'
+import {AREA_DICT} from '@/utils/bigdict.js'
+import Browser from '@/components/Browser.vue'
+import enterpriseInfo from '@pages/dtsjygl/enterpriseInfo.vue'
+import AgencySelector from '@/components/AgencySelector.vue'
+
+
+let userInfo
+useUserStore().getUserInfo().then(data => userInfo = data)
+
+const state = reactive({
+  queryParams: {
+    insNum: 20
+  },
+  componentLoading: false,
+  permissions: {
+    query: true,
+    add: false,
+    modify: false,
+    detail: true,
+    delete: false,
+    importFile: false,
+    exportFile: false,
+    exportSelectFile: false,
+    downloadTemp: false,
+  },
+  tableConfig: {
+    controlWidth: '80',
+    hasControlColumn: true,
+    multipleSelect: true,
+    defaultSort: {
+      prop: 'dynamicRiskLevel',
+      order: 'descending'
+    },
+    usePage: false,
+  },
+  apiConfig: {
+    api: enterprises,
+    modelId: 'enterpriseId'
+  },
+  dialogConfig: {
+    title: '企业详情',
+    show: false,
+    mode: 'detail',
+    loading: false,
+    formLabelWidth: '90px',
+    rules: {
+      industryType: [{required: true, message: '监管行业不能为空', trigger: 'blur'}],
+      unitName: [{required: true, message: '生产经营单位名称不能为空', trigger: 'blur'}],
+      shortName: [{required: true, message: '单位简称不能为空', trigger: 'blur'}],
+      unifiedSocialCode: [{required: true, message: '社会统一信用代码不能为空', trigger: 'blur'}],
+      businessStatus: [{required: true, message: '营业状态不能为空', trigger: 'blur'}],
+      orgCode: [{required: false, message: '所属机构不能为空', trigger: 'blur'}],
+      legalRepresentative: [{required: true, message: '法定代表人（经营者）姓名不能为空', trigger: 'blur'}],
+      contactPhone: [{required: true, message: '联系电话不能为空', trigger: 'blur'}],
+      agency: [{required: true, message: '属地不能为空', trigger: 'blur'}],
+      legalPhone: [{required: true, message: '联系电话不能为空', trigger: 'blur'}],
+      legalDuty: [{required: true, message: '法定代表人（经营者）职位不能为空', trigger: 'blur'}],
+      regulatedIndustry: [{required: true, message: '国民经济行业分类不能为空', trigger: 'blur'}],
+      affiliation: [{required: true, message: '行政隶属关系不能为空', trigger: 'blur'}],
+      oilExtract: [{required: true, message: '是否石油开采不能为空', trigger: 'blur'}],
+      safetyFocus: [{required: true, message: '列入安全生产监管重点企业不能为空', trigger: 'blur'}],
+      largeScale: [{required: true, message: '规模以上生产经营单位不能为空', trigger: 'blur'}],
+      safetyLic: [{required: true, message: '企业是否有安全生产许可证不能为空', trigger: 'blur'}],
+      opScope: [{required: true, message: '主营业务不能为空', trigger: 'blur'}],
+      areaComb: [{required: true, message: '注册地址不能为空', trigger: 'blur'}],
+      detailedAddress: [{required: true, message: '注册详细地址不能为空', trigger: 'blur'}],
+      opLocAreaComb: [{required: true, message: '经营地址不能为空', trigger: 'blur'}],
+      opLocAddress: [{required: true, message: '经营详细地址不能为空', trigger: 'blur'}],
+      dynamicRiskLevel: [{required: true, message: '动态风险等级不能为空', trigger: 'blur'}],
+      isScaleEnterprise: [{required: true, message: '规模以上生产经营单位不能为空', trigger: 'blur'}]
+    },
+    data: {},
+    actions: {
+      handleClose: handleClose,
+    }
+  },
+  dialogConfig1: {
+    show: false,
+    mode: 'detail',
+    title: '待巡查企业',
+    loading: false,
+    data: {},
+    actions: {
+      handleClose: handleClose1,
+      handleDialogOk: handleDialogOk
+    },
+    rules: {
+      validTime: [{required: true, message: '有效期不能为空', trigger: 'change'}],
+    },
+  },
+  actions: {
+    detail: handleDetail
+  },
+  selection: [],
+})
+
+const {
+  queryParams,
+  componentLoading,
+  permissions,
+  tableConfig,
+  apiConfig,
+  dialogConfig,
+  dialogConfig1,
+  actions,
+  selection,
+} = toRefs(state)
+
+let page = 0
+let totalPages = 0
+
+// 分页查询
+function handleQuery(queryParams) {
+  page += 1
+  if (totalPages != 0 && page > totalPages) {
+    page = 1
+  }
+  queryParams.page = page
+  queryParams.pageSize = queryParams.insNum
+  queryParams.pagesize = queryParams.insNum
+  tableConfig.value.tableLoading = true
+  apiConfig.value.api.queryIns(queryParams).then(res => {
+    tableConfig.value.tableLoading = false
+    if (res.success) {
+      totalPages = res.totalPages
+      tableConfig.value.tableData = res
+    } else {
+      ElMessage.error('执法信息查询失败')
+    }
+  })
+}
+
+// 重置参数
+watch(
+    () => queryParams.value.agency,
+    () => {
+      page = 0
+      totalPages = 0
+    }
+)
+watch(
+    () => queryParams.value.industryType,
+    () => {
+      page = 0
+      totalPages = 0
+    }
+)
+watch(
+    () => queryParams.value.dynamicRiskLevel,
+    () => {
+      page = 0
+      totalPages = 0
+    }
+)
+watch(
+    () => queryParams.value.insNum,
+    () => {
+      page = 0
+      totalPages = 0
+    }
+)
+
+// 详情查询
+const defaultValues = reactive(DEFAULT_ENTERPRISE_DETAIL)
+
+async function handleDetail(row) {
+  dialogConfig.value.show = true
+  dialogConfig.value.mode = 'detail'
+  dialogConfig.value.title = '详情企业信息'
+  findOne(row)
+}
+
+function findOne(row) {
+  dialogConfig.value.loading = true
+  let defaultVals = {
+    //安全基础管理信息
+    productionManageInfoExp: {productionManageSystems: [{systemName: '', systemCompileDate: ''}], productionManagePlans: [{planName: '', planCompileDate: '', planType: ''}]},
+    //生产设备设施及公用辅助用房
+    productionEquipmentExp: {productionFacilities: [{equipName: '', equipType: '', commissioningDate: ''}], auxiliaryBuildings: [{auxiliaryName: '', floorArea: '', commissioningDate: ''}]},
+    //煤行业扩展信息
+    coalIndustryExpansion: {},
+    //非煤行业扩展信息
+    nocoalIndustryExpansion: {},
+    //危化行业扩展信息
+    dangerFeatureInfo: {majorDangerInfos: {}, majorDangerCraftInfos: {}, dangerInfos: {}},
+    //烟花爆竹行业扩展信息
+    fireworksAddInfo: {},
+    //工贸行业扩展信息
+    industryExpandInfos: {}
+  }
+  dialogConfig.value.data = Object.assign({}, defaultVals)
+  apiConfig.value.api.findOne(row[apiConfig.value.modelId]).then(res => {
+    if (res.success) {
+      const data = res.data || {}
+      // 调用字段解析函数
+      const fieldsToDeserialize = Object.keys(defaultVals)
+      deserializeFields(data, fieldsToDeserialize)
+      // 调用默认值设置函数
+      Object.keys(defaultVals).forEach(key => {
+        if (!data[key]) {
+          data[key] = defaultVals[key]
+        }
+      })
+      data.regulatedIndustry = data.regulatedIndustry ? data.regulatedIndustry.split("/") : []
+      data.areaComb = data.areaComb ? data.areaComb.split("/") : []
+      data.opLocAreaComb = data.opLocAreaComb ? data.opLocAreaComb.split("/") : []
+      dialogConfig.value.data = Object.assign({}, data)
+    }
+    dialogConfig.value.loading = false
+  })
+}
+
+function deserializeFields(data, fields) {
+  fields.forEach(field => {
+    if (data[field]) {
+      try {
+        data[field] = JSON.parse(data[field])
+      } catch (e) {
+        console.error(`Failed to parse ${field}:`, e)
+      }
+    }
+  })
+}
+
+function handleClose() {
+  dialogConfig.value.show = false
+}
+
+// 随机巡查
+function handleSelectData() {
+  let arr = selection.value
+  let data = Array.from(new Map(arr.map(item => [item.enterpriseId, item])).values())
+  if (data.length < 1) {
+    ElMessage.error('请选择待巡查企业')
+    return
+  }
+  dialogConfig1.value.data = Object.assign({}, {
+    'enterprise': data,
+    'createUserId': userInfo.yhwybs,
+    'createUserName': userInfo.xm,
+    'createTime': moment().format('YYYY-MM-DD HH:mm:ss'),
+  })
+  dialogConfig1.value.show = true
+}
+
+function handleClose1() {
+  dialogConfig1.value.show = false
+}
+
+const formRef = ref()
+
+function handleDialogOk() {
+  let _event = actions.value
+  formRef.value.validate(valid => {
+    if (valid) {
+      dialogConfig1.value.data.validStartTime = dialogConfig1.value.data.validTime[0]
+      dialogConfig1.value.data.validEndTime = dialogConfig1.value.data.validTime[1]
+      dialogConfig1.value.data.enterpriseIds = dialogConfig1.value.data.enterprise.map(item => item.enterpriseId)
+      dialogConfig.value.loading = true
+      apiConfig.value.api.addIns(dialogConfig1.value.data).then(res => {
+        dialogConfig.value.loading = false
+        if (res.success) {
+          dialogConfig1.value.show = false
+          ElMessage.success('操作成功')
+          _event.query()
+        } else {
+          ElMessage.error('操作失败')
+        }
+      })
+    }
+  })
+}
+</script>
+
+<style lang="scss" scoped>
+:deep(.el-col-21) {
+  display: flex;
+  flex-direction: row-reverse;
+}
+
+.extra-button {
+  margin-left: unset !important;
+  margin-right: 12px;
+}
+
+.el-dialog {
+  margin-bottom: 0;
+  border: 0.0625rem solid rgba(255, 255, 255, 1);
+  border-radius: 1rem !important;
+}
+
+.el-dialog__body {
+  height: unset !important;
+}
+
+.padding-bottom-10 {
+  padding-bottom: 10px;
+}
+</style>
diff --git a/client/src/views/fxczfgl/zxxcsp.vue b/client/src/views/fxczfgl/zxxcsp.vue
new file mode 100644
index 0000000..a1c5d93
--- /dev/null
+++ b/client/src/views/fxczfgl/zxxcsp.vue
@@ -0,0 +1,337 @@
+<template>
+  <browser class="browser-businesss-table"
+           :component-loading="componentLoading"
+           :api-config="apiConfig"
+           :table-config="tableConfig"
+           :permissions="permissions"
+           :dialog-config="dialogConfig"
+           :actions="actions"
+           @update:query-params="queryParams = $event"
+           @update:dialog-config="dialogConfig = $event"
+           @update:actions="actions = $event">
+    <template #queryPanel="{ queryParams: queryParams }">
+      <el-form ref="queryForm" :model="queryParams" label-width="100px">
+        <el-row class="query-condition">
+          <el-col :span="6">
+            <el-form-item label="行业类型" prop="industryType">
+              <el-select v-model="queryParams.industryType" placeholder="请选择" clearable>
+                <el-option v-for="item in DICTITEMS.HYLB_OPTIONS" :key="item.value" :label="item.label"
+                           :value="item.value"/>
+              </el-select>
+            </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="unifiedSocialCode">
+              <el-input v-model="queryParams.unifiedSocialCode" clearable/>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+    </template>
+
+    <el-table-column prop="enterprise.unitName" label="企业" min-width="250"/>
+    <el-table-column prop="enterprise.industryType" label="行业类型" min-width="200">
+      <template #default="{row}">
+        <el-span>{{ DICTDISPLAYS.HYLB_MAP[row.enterprise.industryType] }}</el-span>
+      </template>
+    </el-table-column>
+    <el-table-column prop="enterprise.unifiedSocialCode" label="统一信用代码" min-width="200"/>
+    <el-table-column prop="createUserName" label="巡查人" min-width="200"/>
+    <el-table-column prop="createTime" label="巡查时间" min-width="200"/>
+
+    <template #tableControlColumn="{ data: r }">
+      <el-link
+          v-if="r.data.row.isNormal === '1' && ( r.data.row.approvalStatus === '0' || r.data.row.approvalStatus === '2')"
+          type="primary" @click="handOnlinePatrol(r.data.row)" title="在线审批">在线审批
+      </el-link>
+    </template>
+
+    <template #dialog>
+      <el-dialog class="business-dialog" width="1200px" v-model="dialogConfig.show" :show-close="false"
+                 :append-to-body="true" :top="'0px'">
+        <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="150px" class="browser-businesss-table-dialog-form" :model="dialogConfig.data"
+                 :rules="dialogConfig.rules" ref="formRef">
+          <el-divider content-position="left">基本信息</el-divider>
+          <el-row>
+            <el-col :span="24">
+              <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="12">
+              <el-form-item label="行业类型" prop="industryTypeMsg">
+                <el-input v-model="dialogConfig.data.enterprise.industryTypeMsg" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="巡查人" prop="createUserName">
+                <el-input v-model="dialogConfig.data.createUserName" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="巡查时间" prop="createTime">
+                <el-input v-model="dialogConfig.data.createTime" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item :label="label" prop="description">
+                <el-input type="textarea" v-model="dialogConfig.data.description" readonly/>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row v-if="dialogConfig.mode !== 'detail'">
+            <el-col :span="24">
+              <el-form-item label="附件" prop="annex">
+                <MultipleFile :parameters="fileParameters"
+                              :files-data="dialogConfig.data.annexs"/>
+              </el-form-item>
+            </el-col>
+            <el-divider content-position="left">审批信息</el-divider>
+            <el-col :span="24">
+              <el-form-item label="审批人" prop="approvalUserName">
+                <el-input v-model="dialogConfig.data.approvalUserName"/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item label="是否审批通过" prop="approvalStatus">
+                <el-select v-model="dialogConfig.data.approvalStatus" placeholder="请选择是否审批通过">
+                  <el-option v-for="item in DICTITEMS.SPZT_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="approvalReceipt">
+                <el-input type="textarea" v-model="dialogConfig.data.approvalReceipt"/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24" v-if="dialogConfig.data.approvalStatus === '1'">
+              <el-form-item label="检查类型" prop="checkType">
+                <el-select v-model="dialogConfig.data.checkType" placeholder="请选择检查类型" clearable>
+                  <el-option v-for="item in DICTITEMS.JCLX_OPTIONS" :key="item.value" :label="item.label" :value="item.value"/>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24" v-if="dialogConfig.data.approvalStatus === '1'">
+              <el-form-item label="检查事项" prop="checkItemIds">
+                <simple-check-item-selector v-model="dialogConfig.data.checkItemIds"
+                                            :lazyLoad="true"
+                                            multiple/>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+
+        <template #footer>
+          <div class="cvi-dialog-footer">
+            <el-button @click="dialogConfig.actions.handleClose">取消</el-button>
+            <el-button type="primary" @click="dialogConfig.actions.handleDialogOk">确定</el-button>
+            <!--            <el-button type="success" @click="dialogConfig.actions.handleDocument">在线巡查文书</el-button>-->
+          </div>
+        </template>
+      </el-dialog>
+
+      <el-dialog class="business-dialog" width="984px" v-model="dialogConfig1.show" :show-close="false"
+                 :append-to-body="true" :top="'0px'">
+        <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>
+
+        <fxczfws></fxczfws>
+
+      </el-dialog>
+    </template>
+  </browser>
+</template>
+<script setup>
+import {reactive, toRefs, computed, ref} from 'vue'
+import {useUserStore} from '@/stores/modules/user'
+import onlinePatrol from '@/api/lawenforcement/OnlinePatrol'
+import {ElMessage} from 'element-plus'
+import {DICTDISPLAYS, DICTITEMS} from '@/utils/Constants.js'
+import SimpleCheckItemSelector from '@/components/SimpleCheckItemSelector.vue'
+import fxczfws from '@pages/fxczfgl/fxczfws.vue'
+import browser from '@/components/Browser.vue'
+import DictSelector from '@/components/DictSelector.vue'
+import MultipleFile from '@pages/common/MultipleFile.vue'
+import moment from 'moment'
+
+let userInfo
+useUserStore().getUserInfo().then(data => userInfo = data)
+
+const state = reactive({
+  componentLoading: false,
+  queryParams: {},
+  permissions: {
+    query: true,
+    add: false,
+    modify: false,
+    detail: true,
+    delete: false,
+    deleteAll: false,
+    importFile: false,
+    exportFile: false,
+    exportSelectFile: false,
+    downloadTemp: false,
+    canDetailCustom: (row) => row.isNormal === '0' || (row.isNormal === '1' && row.approvalStatus === '1'),
+  },
+  tableConfig: {
+    controlWidth: '150',
+    hasControlColumn: true,
+    multipleSelect: false
+  },
+  apiConfig: {
+    api: onlinePatrol,
+    modelId: 'onlinePatrolId',
+  },
+  dialogConfig: {
+    show: false,
+    mode: 'detail',
+    title: '在线审批',
+    loading: false,
+    data: {
+      enterprise: {}
+    },
+    actions: {
+      handleClose: handleClose,
+      handleDialogOk: handOnlinePatrolApproval,
+      handleDocument: handleDocument,
+    },
+    rules: {
+      approvalUserName: [{required: true, message: '审批人不能为空', trigger: 'blur'}],
+      approvalStatus: [{required: true, message: '审批状态不能为空', trigger: 'blur'}],
+      approvalReceipt: [{required: true, message: '审批回执不能为空', trigger: 'blur'}],
+      checkType: [{required: true, message: '审批回执不能为空', trigger: 'blur'}],
+      checkItemIds: [{required: true, message: '审批回执不能为空', trigger: 'blur'}],
+    },
+  },
+  dialogConfig1: {
+    show: false,
+    mode: 'detail',
+    title: '文书信息',
+    loading: false,
+    data: {},
+    actions: {
+      handleClose: handleClose1,
+    },
+  },
+  actions: {
+    detail: handleDetail
+  },
+  fileParameters: {
+    title: '相关材料',
+    mode: 'detail',
+    required: false,
+    tableTitle: '证据材料'
+  },
+})
+
+const {
+  componentLoading,
+  queryParams,
+  permissions,
+  tableConfig,
+  apiConfig,
+  dialogConfig,
+  dialogConfig1,
+  actions,
+  fileParameters
+} = toRefs(state)
+
+let label = ref('简述')
+
+function handleDetail(row) {
+  label.value = '巡查结果'
+  dialogConfig.value.show = true
+  dialogConfig.value.mode = 'detail'
+  dialogConfig.value.title = '在线审批详情'
+  row.annexs.forEach(item => item.url = item.downloadUrl)
+  // 审批人
+  row.approvalUserId = userInfo.yhwybs
+  row.approvalUserName = userInfo.xm
+  // 行业类别
+  row.enterprise.industryTypeMsg = DICTDISPLAYS.HYLB_MAP[row.enterprise.industryType]
+  dialogConfig.value.data = row
+}
+
+function handOnlinePatrol(row) {
+  label.value = '简述'
+  dialogConfig.value.show = true
+  dialogConfig.value.mode = 'approve'
+  dialogConfig.value.title = '在线审批'
+  row.annexs.forEach(item => item.url = item.downloadUrl)
+  // 审批人
+  row.approvalUserId = userInfo.yhwybs
+  row.approvalUserName = userInfo.xm
+  // 行业类别
+  row.enterprise.industryTypeMsg = DICTDISPLAYS.HYLB_MAP[row.enterprise.industryType]
+  dialogConfig.value.data = row
+}
+
+const formRef = ref()
+
+function handOnlinePatrolApproval() {
+  let _event = actions.value
+  formRef.value.validate(valid => {
+    if (valid) {
+      dialogConfig.value.loading = true
+      apiConfig.value.api.addOnlinePatrolApproval(dialogConfig.value.data).then(res => {
+        if (res.success) {
+          dialogConfig.value.loading = false
+          dialogConfig.value.show = false
+          ElMessage.success('操作成功')
+          _event.query()
+        } else {
+          dialogConfig.value.loading = false
+          throw new Error('操作失败')
+        }
+      })
+    }
+  })
+}
+
+function handleClose() {
+  dialogConfig.value.show = false
+}
+
+// 文书信息
+function handleDocument() {
+  dialogConfig1.value.show = true
+}
+
+function handleClose1() {
+  dialogConfig1.value.show = false
+}
+</script>
+<style lang="scss" scoped>
+.browser-businesss-table {
+  .browser-businesss-table-dialog-form {
+    padding: 10px 20px 10px 20px;
+  }
+}
+</style>
diff --git a/client/src/views/fxczfgl/zxxcxx.vue b/client/src/views/fxczfgl/zxxcxx.vue
new file mode 100644
index 0000000..4104678
--- /dev/null
+++ b/client/src/views/fxczfgl/zxxcxx.vue
@@ -0,0 +1,1192 @@
+<template>
+  <browser :component-loading="componentLoading"
+           class="enterpriseInfo"
+           ref="broTable"
+           :api-config="apiConfig"
+           :table-config="tableConfig"
+           :permissions="permissions"
+           :dialog-config="dialogConfig"
+           :actions="actions"
+           :customQuery="true"
+           @custom-query="handleQuery"
+           @update:actions="actions = $event"
+           @update:query-params="queryParams = $event"
+           @update:dialog-config="dialogConfig = $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="视频接入">
+              <el-select v-model="queryParams.videoAccess" placeholder="请选择视频接入" clearable>
+                <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="6">
+            <el-form-item label="感知设备">
+              <el-select v-model="queryParams.perceptionAccess" placeholder="请选择感知设备" clearable>
+                <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="6">
+            <el-form-item label="资料上报">
+              <el-select v-model="queryParams.infoAccess" placeholder="请选择资料上报" clearable>
+                <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="6">-->
+<!--            <el-form-item label="许可信息">-->
+<!--              <el-select v-model="queryParams.permitAccess" placeholder="请选择许可信息" clearable>-->
+<!--                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"/>-->
+<!--              </el-select>-->
+<!--            </el-form-item>-->
+<!--          </el-col>-->
+        </el-row>
+      </el-form>
+    </template>
+
+    <el-table-column prop="agency.agencyName" label="属地" min-width="250"/>
+    <el-table-column prop="unitName" label="企业" min-width="350"/>
+    <el-table-column prop="industryType" label="行业类型" min-width="200">
+      <template #default="{row}">
+        <el-span>{{ DICTDISPLAYS.HYLB_MAP[row.industryType] || row.industryType }}</el-span>
+      </template>
+    </el-table-column>
+    <el-table-column prop="videoAccessMsg" label="视频接入" min-width="100"/>
+    <el-table-column prop="perceptionAccessMsg" label="感知设备" min-width="100"/>
+    <el-table-column prop="infoAccessMsg" label="资料上报" min-width="100"/>
+    <el-table-column prop="permitAccessMsg" label="许可信息" min-width="100"/>
+
+    <template #tableControlColumn="{ data: r }">
+      <el-link type="primary" @click="handDistribution(r.data.row)" title="在线巡查">在线巡查</el-link>
+    </template>
+
+    <template #dialog>
+      <el-dialog class="business-dialog" v-model="dialogConfig.show" :show-close="false" :append-to-body="true"
+                 fullscreen>
+        <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="dialogConfig.formLabelWidth" :model="dialogConfig.data" :rules="dialogConfig.rules">
+          <enterpriseInfo :dc="dialogConfig"/>
+        </el-form>
+      </el-dialog>
+
+      <el-dialog class="business-dialog" v-model="dialogConfig1.show" :show-close="false" :append-to-body="true"
+                 :top="'0px'" width="1200px">
+        <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"
+                 :rules="dialogConfig1.rules">
+          <el-divider content-position="left">企业基本信息</el-divider>
+          <el-row>
+            <el-col :span="8">
+              <el-form-item label="属地" prop="orgCode">
+                <el-input v-model="dialogConfig1.data.agency.agencyName" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="企业" prop="unitName">
+                <el-input v-model="dialogConfig1.data.unitName" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="统一信用代码" prop="unifiedSocialCode">
+                <el-input v-model="dialogConfig1.data.unifiedSocialCode" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="营业状态" prop="businessStatus">
+                <el-input v-model="DICTDISPLAYS.YYZT_MAP[dialogConfig1.data.businessStatus]" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="行业类型" prop="industryType">
+                <el-input v-model="DICTDISPLAYS.HYLB_MAP[dialogConfig1.data.industryType]" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="详细地址" prop="detailedAddress">
+                <el-input v-model="dialogConfig1.data.detailedAddress" readonly/>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-divider content-position="left">视频设备</el-divider>
+          <el-row>
+            <BusinessTable ref="busiTable"
+                           :config="spsbTableConfig"
+                           :data-res="dialogConfig1.data.spsblist"
+                           :permissions="spsbPermissions">
+              <el-table-column align="center" header-align="center" prop="cameraName" label="设备名称"/>
+              <el-table-column align="center" header-align="center" prop="parentCode" label="父组织编码"/>
+              <el-table-column align="center" header-align="center" prop="cameraIndexCode" label="监控点唯一标识"/>
+
+              <template #otherControlButtons="{ data: scope }">
+                <el-link type="primary" @click="handleVideo(scope.row)" title="查看">查看</el-link>
+              </template>
+            </BusinessTable>
+          </el-row>
+          <el-divider content-position="left">预警信息</el-divider>
+          <el-row v-if="dialogConfig1.show">
+            <BusinessTable ref="busiTable"
+                           v-loading="yjxxTableConfig.tableLoading"
+                           :config="yjxxTableConfig"
+                           :query-params="yjxxQueryParams"
+                           :data-res="dialogConfig1.data.yjxxlist"
+                           :permissions="yjxxPermissions"
+                           @query-params="handleYjxxQueryParams">
+              <el-table-column align="center" header-align="center" prop="cameraName" label="摄像头名称" min-width="150"/>
+              <el-table-column align="center" header-align="center" prop="address" label="摄像头地址" min-width="150"/>
+              <el-table-column align="center" header-align="center" prop="time" label="抓拍时间" min-width="150"/>
+              <el-table-column align="center" header-align="center" prop="eventDesc" label="事件描述" min-width="350"/>
+
+              <template #otherControlButtons="{ data: scope }">
+                <el-link type="primary" @click="handleYjxxDetail(scope.row)" title="查看">查看</el-link>
+              </template>
+            </BusinessTable>
+          </el-row>
+          <el-divider content-position="left">感知设备</el-divider>
+          <el-row>
+            <BusinessTable ref="busiTable"
+                           :config="gzsbTableConfig"
+                           :data-res="dialogConfig1.data.gzsblist">
+              <el-table-column align="center" header-align="center" prop="code" label="探测器编码" min-width="150"/>
+              <el-table-column align="center" header-align="center" prop="recordHandleStatus" label="有无未处置的探测器报警记录"
+                               min-width="150"/>
+              <el-table-column align="center" header-align="center" prop="status" label="探测器状态" min-width="150"/>
+              <el-table-column align="center" header-align="center" prop="subStatusName" label="探测器子状态名称"
+                               min-width="150"/>
+              <el-table-column align="center" header-align="center" prop="arrivalTime" label="数据到达时间" min-width="150"/>
+              <el-table-column align="center" header-align="center" prop="value" label="实时值" min-width="150"/>
+            </BusinessTable>
+          </el-row>
+          <el-divider content-position="left">自报自查</el-divider>
+          <el-row v-if="dialogConfig1.show">
+            <BusinessTable ref="busiTable"
+                           v-loading="zczbTableConfig.tableLoading"
+                           :config="zczbTableConfig"
+                           :query-params="zczbQueryParams"
+                           :data-res="dialogConfig1.data.zczblist"
+                           @query-params="handleZczbQueryParams">
+              <el-table-column align="center" header-align="center" prop="unitname" label="单位名称" min-width="150"/>
+              <el-table-column align="center" header-align="center" prop="checkusername" label="检查人" min-width="150"/>
+              <el-table-column align="center" header-align="center" prop="checktime" label="检查时间" min-width="150"/>
+              <el-table-column align="center" header-align="center" prop="checkcontent" label="检查内容" min-width="350"/>
+            </BusinessTable>
+            <!--            @show-modify="mergeActions.modify"-->
+            <!--            @show-detail="mergeActions.detail"-->
+          </el-row>
+<!--          <el-divider content-position="left">行政许可</el-divider>-->
+<!--          <el-row>-->
+<!--            <BusinessTable ref="busiTable"-->
+<!--                           v-loading="zczbTableConfig.tableLoading"-->
+<!--                           :config="zczbTableConfig"-->
+<!--                           :query-params="zczbQueryParams"-->
+<!--                           :data-res="dialogConfig1.data.zczblist"-->
+<!--                           @query-params="handleZczbQueryParams">-->
+<!--              <el-table-column align="center" header-align="center" prop="unitname" label="单位名称" min-width="150"/>-->
+<!--              <el-table-column align="center" header-align="center" prop="checkusername" label="检查人" min-width="150"/>-->
+<!--              <el-table-column align="center" header-align="center" prop="checktime" label="检查时间" min-width="150"/>-->
+<!--              <el-table-column align="center" header-align="center" prop="checkcontent" label="检查内容" min-width="350"/>-->
+<!--            </BusinessTable>-->
+<!--                        @show-modify="mergeActions.modify"-->
+<!--                        @show-detail="mergeActions.detail"-->
+<!--          </el-row>-->
+        </el-form>
+
+        <template #footer>
+          <div class="cvi-dialog-footer">
+            <el-button @click="dialogConfig1.actions.handleClose">取消</el-button>
+            <el-button type="primary" @click="dialogConfig1.actions.handleDialogOk(dialogConfig1.data)">完成</el-button>
+            <el-button type="success" @click="dialogConfig1.actions.handleSubmitForApproval(dialogConfig1.data)"
+                       title="报送审批">报送审批
+            </el-button>
+          </div>
+        </template>
+      </el-dialog>
+
+      <el-dialog class="business-dialog" v-model="dialogConfig2.show" :show-close="false" :append-to-body="true"
+                 :top="'60px'" width="1200px">
+        <template #header>
+          <div class="cvi-dialog-header">
+            <div class="cvi-dialog-header-title">
+              <div class="dialog-line"></div>
+              {{ dialogConfig2.title }}
+            </div>
+            <i class="iconfont icon-zyyy_tcgb" @click="dialogConfig2.actions.handleClose"></i>
+          </div>
+        </template>
+
+        <el-row style="padding: 20px">
+          <el-col :span="14">
+            <div id="camerasPlayer" style="width:100%;height: 100%"></div>
+          </el-col>
+          <el-col :span="10">
+            <el-form ref="form" :model="videoData" label-width="140px">
+              <el-form-item label="实时视频监控：">
+                <el-button size='default' @click="realPlay(videoData.camera)">开始监控</el-button>
+                <el-button size='default' @click="stopPlay(videoData.camera)">停止监控</el-button>
+              </el-form-item>
+              <el-form-item label="历史监控时间：">
+                <el-date-picker size='default'
+                                v-model="videoConfig.fallBackTime"
+                                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-form-item label="历史监控回放：">
+                <div>
+                  <el-button size='default' @click="playbackStart(videoData.camera)">开始回放</el-button>
+                  <el-button size='default' @click="stopPlay">停止回放</el-button>
+                  <el-button size='default' @click="frameForward">单 帧</el-button>
+                </div>
+                <div>
+                  <el-button size='default' @click="playbackFast" :disabled="videoConfig.single">快 放</el-button>
+                  <el-button size='default' @click="playbackSlow" v-show="flowType === 'decoder'">慢 放</el-button>
+                </div>
+              </el-form-item>
+              <el-form-item label="当前倍速：">
+                <el-input size='default' readonly v-model="videoConfig.rate"></el-input>
+              </el-form-item>
+              <el-form-item label="声音：">
+                <el-button size='default' @click="openSound">开 启</el-button>
+                <el-button size='default' @click="closeSound">关 闭</el-button>
+              </el-form-item>
+              <el-form-item label="音量条：">
+                <el-slider size='small' v-model="videoConfig.volume" @change="setVolume"
+                           :disabled="videoConfig.muted"></el-slider>
+              </el-form-item>
+              <el-form-item label="抓图&录像：">
+                <el-button size='default' @click="capture('JPEG')">抓取JPEG</el-button>
+                <el-button size='default' @click="recordStart('MP4')">录制MP4</el-button>
+                <el-button size='default' @click="recordStop">停止录制</el-button>
+              </el-form-item>
+            </el-form>
+          </el-col>
+        </el-row>
+      </el-dialog>
+
+      <el-dialog class="business-dialog" v-model="dialogConfig3.show" :show-close="false" :append-to-body="true"
+                 :top="'60px'" width="1200px">
+        <template #header>
+          <div class="cvi-dialog-header">
+            <div class="cvi-dialog-header-title">
+              <div class="dialog-line"></div>
+              {{ dialogConfig3.title }}
+            </div>
+            <i class="iconfont icon-zyyy_tcgb" @click="dialogConfig3.actions.handleClose"></i>
+          </div>
+        </template>
+
+        <el-form label-width="100px" class="browser-businesss-table-dialog-form" :model="dialogConfig3.data"
+                 :rules="dialogConfig3.rules" ref="formRef">
+          <el-col :span="24">
+            <el-form-item label="巡查人" prop="createUserName">
+              <el-input v-model="dialogConfig3.data.createUserName" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="巡查时间" prop="createTime">
+              <el-input v-model="dialogConfig3.data.createTime" readonly/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="管辖机构" prop="agency">
+              <agency-selector :lazyLoad="true" v-model="dialogConfig3.data.agency"></agency-selector>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="简述" prop="description">
+              <el-input type="textarea" v-model="dialogConfig3.data.description"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="附件" prop="annex">
+              <MultipleFile :parameters="fileParameters"
+                            :files-data="dialogConfig3.data.annexs"
+                            @on-change="onChange"
+                            @on-remove="onRemove"/>
+            </el-form-item>
+          </el-col>
+        </el-form>
+
+        <template #footer>
+          <div class="cvi-dialog-footer">
+            <el-button @click="dialogConfig3.actions.handleClose">取消</el-button>
+            <el-button type="primary" @click="dialogConfig3.actions.handleDialogOk">确定</el-button>
+          </div>
+        </template>
+      </el-dialog>
+
+      <el-dialog class="business-dialog" v-model="dialogConfig4.show" :show-close="false" :append-to-body="true"
+                 :top="'60px'" width="1200px">
+        <template #header>
+          <div class="cvi-dialog-header">
+            <div class="cvi-dialog-header-title">
+              <div class="dialog-line"></div>
+              {{ dialogConfig4.title }}
+            </div>
+            <i class="iconfont icon-zyyy_tcgb" @click="dialogConfig4.actions.handleClose"></i>
+          </div>
+        </template>
+
+        <el-form :model="dialogConfig4.data" label-width="100px" ref="formRef">
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="事件描述" prop="eventDesc">
+                <el-input v-model="dialogConfig4.data.eventDesc" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="摄像头名称" prop="cameraName">
+                <el-input v-model="dialogConfig4.data.cameraName" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="摄像头地址" prop="address">
+                <el-input v-model="dialogConfig4.data.address" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="摄像头国标码" prop="internationalCode">
+                <el-input v-model="dialogConfig4.data.internationalCode" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="经度" prop="lat">
+                <el-input v-model="dialogConfig4.data.lat" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="纬度" prop="lng">
+                <el-input v-model="dialogConfig4.data.lng" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="街道" prop="street">
+                <el-input v-model="dialogConfig4.data.street" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="置信度" prop="confidence">
+                <el-input v-model="dialogConfig4.data.confidence" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="抓拍时间" prop="time">
+                <el-input v-model="dialogConfig4.data.time" readonly/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12"></el-col>
+            <el-col :span="12">
+              <el-form-item label="抓拍图片" prop="imageUrl">
+                <el-image
+                    style="width: 300px; height: 200px"
+                    :src="dialogConfig4.data.imageUrl"
+                    :zoom-rate="1.2"
+                    :max-scale="7"
+                    :min-scale="0.2"
+                    :preview-src-list="[dialogConfig4.data.imageUrl]"
+                    show-progress
+                    :initial-index="4"
+                    fit="cover"/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12" v-if="dialogConfig4.data.videoUrl !== null">
+              <el-form-item label="前后10s视频" prop="videoUrl">
+                <video width="300" height="200" controls>
+                  <source :src="dialogConfig4.data.videoUrl" type="video/mp4">
+                </video>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+      </el-dialog>
+    </template>
+  </browser>
+</template>
+
+<script setup>
+import {reactive, toRefs, computed, ref, nextTick} from 'vue'
+import {useUserStore} from '@/stores/modules/user'
+import enterprises from '@/api/lawenforcement/Enterprise'
+import hikVision from '@/api/lawenforcement/HikVision'
+import onlinePatrol from '@/api/lawenforcement/OnlinePatrol'
+import {DEFAULT_ENTERPRISE_DETAIL, DICTDISPLAYS, DICTITEMS} from '@/utils/Constants.js'
+import {AREA_DICT} from '@/utils/bigdict.js'
+import {ElMessage} from 'element-plus'
+import moment from 'moment'
+import BusinessTable from '@/components/BusinessTable.vue'
+import DictSelector from '@/components/DictSelector.vue'
+import enterpriseInfo from '@pages/dtsjygl/enterpriseInfo.vue'
+import Browser from '@/components/Browser.vue'
+import AgencySelector from '@/components/AgencySelector.vue'
+import MultipleFile from '@pages/common/MultipleFile.vue'
+import axios from 'axios'
+
+let userInfo
+useUserStore().getUserInfo().then(data => userInfo = data)
+
+const state = reactive({
+  queryParams: {},
+  componentLoading: false,
+  permissions: {
+    query: true,
+    add: false,
+    modify: false,
+    detail: true,
+    delete: false,
+    importFile: false,
+    exportFile: false,
+    exportSelectFile: false,
+    downloadTemp: false,
+  },
+  tableConfig: {
+    hasControlColumn: true,
+    controlWidth: '150',
+    multipleSelect: false,
+    defaultSort: {
+      prop: 'dynamicRiskLevel',
+      order: 'descending'
+    }
+  },
+  apiConfig: {
+    api: enterprises,
+    api2: hikVision,
+    api3: onlinePatrol,
+    modelId: 'enterpriseId'
+  },
+  dialogConfig: {
+    title: '企业详情',
+    show: false,
+    mode: 'detail',
+    loading: false,
+    formLabelWidth: '90px',
+    rules: {
+      industryType: [{required: true, message: '监管行业不能为空', trigger: 'blur'}],
+      unitName: [{required: true, message: '生产经营单位名称不能为空', trigger: 'blur'}],
+      shortName: [{required: true, message: '单位简称不能为空', trigger: 'blur'}],
+      unifiedSocialCode: [{required: true, message: '社会统一信用代码不能为空', trigger: 'blur'}],
+      businessStatus: [{required: true, message: '营业状态不能为空', trigger: 'blur'}],
+      orgCode: [{required: false, message: '所属机构不能为空', trigger: 'blur'}],
+      legalRepresentative: [{required: true, message: '法定代表人（经营者）姓名不能为空', trigger: 'blur'}],
+      contactPhone: [{required: true, message: '联系电话不能为空', trigger: 'blur'}],
+      agency: [{required: true, message: '属地不能为空', trigger: 'blur'}],
+      legalPhone: [{required: true, message: '联系电话不能为空', trigger: 'blur'}],
+      legalDuty: [{required: true, message: '法定代表人（经营者）职位不能为空', trigger: 'blur'}],
+      regulatedIndustry: [{required: true, message: '国民经济行业分类不能为空', trigger: 'blur'}],
+      affiliation: [{required: true, message: '行政隶属关系不能为空', trigger: 'blur'}],
+      oilExtract: [{required: true, message: '是否石油开采不能为空', trigger: 'blur'}],
+      safetyFocus: [{required: true, message: '列入安全生产监管重点企业不能为空', trigger: 'blur'}],
+      largeScale: [{required: true, message: '规模以上生产经营单位不能为空', trigger: 'blur'}],
+      safetyLic: [{required: true, message: '企业是否有安全生产许可证不能为空', trigger: 'blur'}],
+      opScope: [{required: true, message: '主营业务不能为空', trigger: 'blur'}],
+      areaComb: [{required: true, message: '注册地址不能为空', trigger: 'blur'}],
+      detailedAddress: [{required: true, message: '注册详细地址不能为空', trigger: 'blur'}],
+      opLocAreaComb: [{required: true, message: '经营地址不能为空', trigger: 'blur'}],
+      opLocAddress: [{required: true, message: '经营详细地址不能为空', trigger: 'blur'}],
+      dynamicRiskLevel: [{required: true, message: '动态风险等级不能为空', trigger: 'blur'}],
+      isScaleEnterprise: [{required: true, message: '规模以上生产经营单位不能为空', trigger: 'blur'}]
+    },
+    data: {},
+    actions: {
+      handleClose: handleClose,
+    }
+  },
+  dialogConfig1: {
+    show: false,
+    mode: 'add',
+    title: '在线巡查',
+    loading: false,
+    data: {},
+    actions: {
+      handleClose: handleClose1,
+      handleDialogOk: handleDialog1Ok,
+      handleSubmitForApproval: handleSubmitForApproval,
+    },
+  },
+  dialogConfig2: {
+    show: false,
+    mode: 'detail',
+    title: '视频监控',
+    loading: false,
+    data: {},
+    actions: {
+      handleClose: handleClose2,
+    },
+  },
+  dialogConfig3: {
+    show: false,
+    mode: 'add',
+    title: '报送审批',
+    loading: false,
+    data: {
+      annexs: []
+    },
+    actions: {
+      handleClose: handleClose3,
+      handleDialogOk: handleDialog3Ok,
+    },
+    rules: {
+      createUserName: [{required: true, message: '录入人不能为空', trigger: 'blur'}],
+      createTime: [{required: true, message: '录入时间不能为空', trigger: 'blur'}],
+      agency: [{required: true, message: '管辖机构不能为空', trigger: 'blur'}],
+      description: [{required: true, message: '简述不能为空', trigger: 'blur'}],
+      // annex: [{required: true, message: '附件不能为空', trigger: 'change'}],
+    },
+  },
+  dialogConfig4: {
+    title: '监控预警详情',
+    show: false,
+    mode: 'detail',
+    loading: false,
+    data: {},
+    actions: {
+      handleClose: handleClose4,
+    }
+  },
+  actions: {
+    detail: handleDetail
+  },
+  videoData: {
+    camera: {}
+  },
+  spsbTableConfig: {
+    hasControlColumn: true,
+    controlWidth: '80',
+    multipleSelect: false,
+    usePage: false,
+  },
+  spsbPermissions: {
+    detail: false
+  },
+  gzsbTableConfig: {
+    hasControlColumn: false,
+    controlWidth: '80',
+    multipleSelect: false,
+    usePage: false,
+  },
+  yjxxQueryParams: {},
+  yjxxTableConfig: {
+    hasControlColumn: true,
+    controlWidth: '80',
+    multipleSelect: false,
+    tableLoading: false,
+    pageSizes: [10, 20, 50, 100],
+    pagerLayout: '->, slot, prev, pager, next',
+  },
+  yjxxPermissions: {
+    detail: false
+  },
+  zczbQueryParams: {},
+  zczbTableConfig: {
+    hasControlColumn: false,
+    controlWidth: '80',
+    multipleSelect: false,
+    tableLoading: false,
+    pageSizes: [10, 20, 50, 100],
+    pagerLayout: '->, slot, prev, pager, next',
+  },
+})
+
+const {
+  queryParams,
+  componentLoading,
+  permissions,
+  tableConfig,
+  apiConfig,
+  dialogConfig,
+  dialogConfig1,
+  dialogConfig2,
+  dialogConfig3,
+  dialogConfig4,
+  actions,
+  videoData,
+  spsbPermissions,
+  spsbTableConfig,
+  yjxxQueryParams,
+  yjxxTableConfig,
+  yjxxPermissions,
+  gzsbTableConfig,
+  zczbQueryParams,
+  zczbTableConfig,
+} = toRefs(state)
+
+const options = [{value: '1', label: '是'}, {value: '0', label: '否'}]
+
+// 分页查询
+function handleQuery(queryParams) {
+  tableConfig.value.tableLoading = true
+  apiConfig.value.api.queryInsStart(queryParams).then(res => {
+    tableConfig.value.tableLoading = false
+    if (res.success) {
+      tableConfig.value.tableData = res
+    } else {
+      ElMessage.error('执法信息查询失败')
+    }
+  })
+}
+
+// 详情查询
+const defaultValues = reactive(DEFAULT_ENTERPRISE_DETAIL)
+
+const districts = computed(() => {
+  if (!queryParams.value.opLocCity) return []
+  const city = cities.value.find(c => c.value === queryParams.value.opLocCity)
+  return city?.children || []
+})
+
+const cities = computed(() => {
+  if (!queryParams.value.opLocProvince) return []
+  const province = AREA_DICT.find(p => p.value === queryParams.value.opLocProvince)
+  return province?.children || []
+})
+
+async function handleDetail(row) {
+  dialogConfig.value.show = true
+  dialogConfig.value.mode = 'detail'
+  dialogConfig.value.title = '详情企业信息'
+  findOne(row)
+}
+
+function findOne(row) {
+  dialogConfig.value.loading = true
+  let defaultVals = {
+    //安全基础管理信息
+    productionManageInfoExp: {productionManageSystems: [{systemName: '', systemCompileDate: ''}], productionManagePlans: [{planName: '', planCompileDate: '', planType: ''}]},
+    //生产设备设施及公用辅助用房
+    productionEquipmentExp: {productionFacilities: [{equipName: '', equipType: '', commissioningDate: ''}], auxiliaryBuildings: [{auxiliaryName: '', floorArea: '', commissioningDate: ''}]},
+    //煤行业扩展信息
+    coalIndustryExpansion: {},
+    //非煤行业扩展信息
+    nocoalIndustryExpansion: {},
+    //危化行业扩展信息
+    dangerFeatureInfo: {majorDangerInfos: {}, majorDangerCraftInfos: {}, dangerInfos: {}},
+    //烟花爆竹行业扩展信息
+    fireworksAddInfo: {},
+    //工贸行业扩展信息
+    industryExpandInfos: {}
+  }
+  dialogConfig.value.data = Object.assign({}, defaultVals)
+  apiConfig.value.api.findOne(row[apiConfig.value.modelId]).then(res => {
+    if (res.success) {
+      const data = res.data || {}
+      // 调用字段解析函数
+      const fieldsToDeserialize = Object.keys(defaultVals)
+      deserializeFields(data, fieldsToDeserialize)
+      // 调用默认值设置函数
+      Object.keys(defaultVals).forEach(key => {
+        if (!data[key]) {
+          data[key] = defaultVals[key]
+        }
+      })
+      data.regulatedIndustry = data.regulatedIndustry ? data.regulatedIndustry.split("/") : []
+      data.areaComb = data.areaComb ? data.areaComb.split("/") : []
+      data.opLocAreaComb = data.opLocAreaComb ? data.opLocAreaComb.split("/") : []
+      dialogConfig.value.data = Object.assign({}, data)
+    }
+    dialogConfig.value.loading = false
+  })
+}
+
+function deserializeFields(data, fields) {
+  fields.forEach(field => {
+    if (data[field]) {
+      try {
+        data[field] = JSON.parse(data[field])
+      } catch (e) {
+        console.error(`Failed to parse ${field}:`, e)
+      }
+    }
+  })
+}
+
+function handleClose() {
+  dialogConfig.value.show = false
+}
+
+//-----------------------在线巡查-----------------------
+
+function handDistribution(row) {
+  dialogConfig1.value.show = true
+  dialogConfig1.value.mode = 'add'
+  dialogConfig1.value.title = '在线巡查'
+  dialogConfig1.value.loading = false
+  dialogConfig1.value.formLabelWidth = '200px'
+  row.spsblist = {}
+  row.gzsblist = {}
+  row.yjxxlist = {}
+  row.zczblist = {}
+  dialogConfig1.value.data = row
+  findRegionsCameras(row)
+  handleYjxx(row)
+  handleGzsb(row)
+  handleSelfInsAndSelfReportInfo(row)
+}
+
+function handleClose1() {
+  dialogConfig1.value.show = false
+}
+
+function handleDialog1Ok(row) {
+  let params = new FormData()
+  params.append('enterpriseId', row.enterpriseId)
+  params.append('agencyId', row.agency.agencyId)
+  params.append('isNormal', '0')
+  params.append('description', '在线巡查无异常')
+  params.append('createUserId', userInfo.yhwybs)
+  params.append('createUserName', userInfo.xm)
+  params.append('createTime', moment().format('YYYY-MM-DD HH:mm:ss'))
+  dialogConfig.value.loading = true
+  let _event = actions.value
+  apiConfig.value.api3.addOnlinePatrolAndFileData(params).then(res => {
+    if (res.success) {
+      dialogConfig.value.loading = false
+      dialogConfig1.value.show = false
+      ElMessage.success('操作成功')
+      _event.query()
+    } else {
+      dialogConfig.value.loading = false
+      throw new Error('操作失败')
+    }
+  })
+}
+
+//-----------------------视频相关信息--------------------
+function findRegionsCameras(row) {
+  let qyxx = JSON.parse(JSON.stringify(row))
+  let params = {
+    uscc: qyxx.unifiedSocialCode,
+  }
+  apiConfig.value.api.camera(params).then(res => {
+    if (res.code === 0) {
+      dialogConfig1.value.data.spsblist = {
+        "code": 0,
+        "success": true,
+        "data": res.data
+      }
+    }
+  })
+}
+
+//-----------------------预警信息-----------------------
+function handleYjxx(row) {
+  yjxxQueryParams.value.unifiedSocialCode = row.unifiedSocialCode
+  yjxxQueryParams.value.pageSize = 10
+  yjxxQueryParams.value.pagesize = 10
+  yjxxQueryParams.value.page = 1
+  // findYjxx()
+}
+
+function handleYjxxQueryParams(val) {
+  Object.assign(yjxxQueryParams.value, val)
+  findYjxx()
+}
+
+function findYjxx() {
+  apiConfig.value.api.warn(yjxxQueryParams.value).then(res => {
+    if (res.code === 0) {
+      dialogConfig1.value.data.yjxxlist = res
+      console.log(dialogConfig1.value.data.yjxxlist)
+    }
+  })
+}
+
+function handleYjxxDetail(val) {
+  dialogConfig4.value.show = true
+  dialogConfig4.value.data = Object.assign({}, val)
+}
+
+function handleClose4() {
+  dialogConfig4.value.show = false
+}
+
+//-----------------------感知设备-----------------------
+function handleGzsb(row) {
+  findGzsb(row)
+}
+
+function findGzsb(row) {
+  axios.get('/public/authenticated/monitor/unit/pulling/prober-status', {
+    params: {
+      socialCode: row.unifiedSocialCode
+    }
+  }).then(res => {
+    if (res.data.code === 200) {
+      dialogConfig1.value.data.gzsblist = {
+        "code": 0,
+        "success": true,
+        "data": res.data.data
+      }
+    }
+  })
+}
+
+//-----------------------自报自查------------------------
+function handleSelfInsAndSelfReportInfo(row) {
+  zczbQueryParams.value.unifiedSocialCode = row.unifiedSocialCode
+  zczbQueryParams.value.pageSize = 10
+  zczbQueryParams.value.pagesize = 10
+  zczbQueryParams.value.page = 1
+  //findSelfInsAndSelfReportInfo()
+}
+
+function handleZczbQueryParams(val) {
+  Object.assign(zczbQueryParams.value, val)
+  findSelfInsAndSelfReportInfo()
+}
+
+function findSelfInsAndSelfReportInfo() {
+  apiConfig.value.api.selfInsAndSelfReport(zczbQueryParams.value).then(res => {
+    if (res.code === 0) {
+      let data = JSON.parse(res.data)
+      if (data.code === '200') {
+        let currentPage = 1
+        if (data.data.totalCount > data.data.limit) {
+          let result = data.data.offset / data.data.limit;
+          if (result % 1 !== 0) { // 检查是否有小数部分
+            currentPage = Math.ceil(result)
+          }
+        }
+        let res = {
+          "code": 0,
+          "success": true,
+          "data": data.data.list,
+          "total": Number(data.data.totalCount),
+          "page": currentPage,
+          "limit": data.data.limit,
+          "totalPages": data.data.totalPage,
+          "relation": "eq"
+        }
+        dialogConfig1.value.data.zczblist = res
+      }
+    }
+  })
+}
+
+//-----------------------视频相关信息---------------------
+function handleVideo(row) {
+  dialogConfig2.value.show = true
+  dialogConfig2.value.mode = 'detail'
+  dialogConfig2.value.title = '视频监控'
+  dialogConfig2.value.loading = false
+  dialogConfig2.value.data = {}
+  videoData.value.camera = row
+  nextTick(() => createPlayer())
+}
+
+function handleClose2() {
+  dialogConfig2.value.show = false
+}
+
+//-----------------------海康视频监控-----------------------
+// 创建播放器实例
+let videoConfig = reactive({fallBackTime: [], single: false, rate: 1, volume: 50, muted: true})
+let player
+
+function createPlayer() {
+  player = new window.JSPlugin({szId: 'camerasPlayer', szBasePath: '/js'})
+  window.addEventListener('resize', () => player.JS_Resize())
+}
+
+let videoFlowType = !!window.MediaSource ? 'mse' : 'decoder'
+let flowType = ref(videoFlowType)
+let token = ''
+function realPlay(data) {
+  let params = {
+    cameraIndexCode: data.cameraIndexCode,
+    streamType: 0,
+    protocol: 'wss',
+    transMode: 1,
+  }
+  apiConfig.value.api2.getCamerasPreview(params).then(res => {
+    if (res.code === 0) {
+      let data = JSON.parse(res.data)
+      console.log("播放流信息")
+      console.log(data)
+      if (data === null) return
+      if (data.code === '0') {
+        videoData.value.realplay = data.data.url
+        let playURL = videoData.value.realplay
+        let index = player.currentWindowIndex
+        let playMode = videoFlowType === 'mse' ? 0 : 1
+        player.JS_Play(playURL, {playURL, playMode, keepDecoder:0, token}, index).then(
+            () => {
+              videoConfig.single = true
+              console.log('realPlay success')
+            },
+            e => {
+              console.error(e)
+            }
+        )
+      }
+    }
+  })
+}
+
+function stopPlay() {
+  player.JS_Stop().then(
+      () => {
+        videoConfig.rate = 0
+      },
+      e => {
+        console.error(e)
+      }
+  )
+}
+
+function playbackStart(data) {
+  if (videoConfig.fallBackTime === null || videoConfig.fallBackTime.length !== 2) {
+    ElMessage.error('请选择回放时间')
+    return
+  }
+  let params = {
+    cameraIndexCode: data.cameraIndexCode,
+    protocol: 'wss',
+    transMode: 1,
+    fallBackTime: videoConfig.fallBackTime
+  }
+  apiConfig.value.api2.getCamerasPlayback(params).then(res => {
+    if (res.code === 0) {
+      let data = JSON.parse(res.data)
+      console.log("回放流信息")
+      console.log(data)
+      if (data === null) return
+      if (data.code === '0') {
+        videoData.value.playback = data.data.url
+        let playURL = videoData.value.playback
+        let index = player.currentWindowIndex
+        let playMode = videoFlowType === 'mse' ? 0 : 1
+        // let startTime = data.data.list[0].beginTime
+        // let endTime = data.data.list[0].endTime
+        let s = videoConfig.fallBackTime[0].split(' ')
+        let e = videoConfig.fallBackTime[1].split(' ')
+        let startTime = s[0] + 'T' + s[1] + 'Z'
+        let endTime = e[0] + 'T' + e[1] + 'Z'
+        player.JS_Play(playURL, {playURL, playMode, keepDecoder:0, token}, index, startTime, endTime).then(
+            () => {
+              videoConfig.single = false
+              videoConfig.rate = 1
+              console.log('playback success')
+            },
+            e => {
+              console.error(e)
+            }
+        )
+      }
+    }
+  })
+}
+
+function playbackFast() {
+  player.JS_Fast().then(
+      rate => {
+        videoConfig.rate = rate
+      },
+      e => {
+        console.error(e)
+      }
+  )
+}
+
+function playbackSlow() {
+  player.JS_Slow().then(
+      rate => {
+        videoConfig.rate = rate
+      },
+      e => {
+        console.error(e)
+      }
+  )
+}
+
+function frameForward() {
+  player.JS_FrameForward(player.currentWindowIndex).then(
+      () => {
+        videoConfig.rate = 1
+      },
+      e => {
+        ElMessage.warning(videoFlowType + '模式暂不支持单帧播放！')
+        console.error(e)
+      }
+  )
+}
+
+function openSound() {
+  player.JS_OpenSound().then(
+      () => {
+        videoConfig.muted = false
+      },
+      e => {
+        console.error(e)
+      }
+  )
+}
+
+function closeSound() {
+  player.JS_CloseSound().then(
+      () => {
+        videoConfig.muted = false
+      },
+      e => {
+        console.error(e)
+      }
+  )
+}
+
+function setVolume(value) {
+  let index = player.currentWindowIndex
+  player.JS_SetVolume(index, value).then(
+      () => {
+        console.log('setVolume success', value)
+      },
+      e => {
+        console.error(e)
+      }
+  )
+}
+
+function capture(imageType) {
+  let index = player.currentWindowIndex
+  player.JS_CapturePicture(index, 'img', imageType).then(
+      () => {
+        console.log('capture success', imageType)
+      },
+      e => {
+        console.error(e)
+      }
+  )
+}
+
+function recordStart() {
+  let index = player.currentWindowIndex
+  let fileName = `${moment().format('YYYYMMDDHHmm')}.mp4`
+  let typeCode = 5
+  player.JS_StartSaveEx(index, fileName, typeCode).then(
+      () => {
+        console.log('record start ...')
+      },
+      e => {
+        console.error(e)
+      }
+  )
+}
+
+function recordStop() {
+  let index = player.currentWindowIndex
+  player.JS_StopSave(index).then(
+      () => {
+        console.log('record stoped, saving ...')
+      },
+      e => {
+        console.error(e)
+      }
+  )
+}
+
+//-----------------------报送审批-----------------------
+function handleSubmitForApproval(row) {
+  dialogConfig3.value.show = true
+  dialogConfig3.value.mode = 'add'
+  dialogConfig3.value.title = '报送审批'
+  dialogConfig3.value.loading = false
+  dialogConfig3.value.formLabelWidth = '200px'
+  // 材料信息
+  row.annexs = []
+  // 录入人
+  row.createUserId = userInfo.yhwybs
+  row.createUserName = userInfo.xm
+  // 录入时间
+  row.createTime = moment().format('YYYY-MM-DD HH:mm:ss')
+  dialogConfig3.value.data = row
+}
+
+// 文件组件上传成功回调
+function onChange(data) {
+  let tablezjcl = {
+    uid: data.uid,
+    name: data.name,
+    type: data.name.split('.')[1],
+    file: data.raw
+  }
+  dialogConfig3.value.data.annexs.push(tablezjcl)
+}
+
+// 文件组件删除文件回调
+function onRemove(fileList, id) {
+  dialogConfig3.value.data.annexs = fileList
+}
+
+const formRef = ref()
+
+function handleDialog3Ok() {
+  if (dialogConfig3.value.data.annexs.length <= 0) {
+    ElMessage.error('附件不能为空')
+    return
+  }
+  let _event = actions.value
+  let params = new FormData()
+  params.append('enterpriseId', dialogConfig3.value.data.enterpriseId)
+  params.append('agencyId', dialogConfig3.value.data.agency.agencyId)
+  params.append('isNormal', '1')
+  params.append('description', dialogConfig3.value.data.description)
+  params.append('createUserId', dialogConfig3.value.data.createUserId)
+  params.append('createUserName', dialogConfig3.value.data.createUserName)
+  params.append('createTime', dialogConfig3.value.data.createTime)
+  dialogConfig3.value.data.annexs.forEach(item => params.append('files', item.file))
+  formRef.value.validate(valid => {
+    if (valid) {
+      dialogConfig.value.loading = true
+      apiConfig.value.api3.addOnlinePatrolAndFileData(params).then(res => {
+        if (res.success) {
+          dialogConfig.value.loading = false
+          dialogConfig3.value.show = false
+          dialogConfig1.value.show = false
+          ElMessage.success('操作成功')
+          _event.query()
+        } else {
+          dialogConfig.value.loading = false
+          throw new Error('操作失败')
+        }
+      })
+    }
+  })
+}
+
+function handleClose3() {
+  dialogConfig3.value.show = false
+}
+
+</script>
+
+<style lang="scss">
+.el-dialog {
+  margin-bottom: 0;
+  border: 0.0625rem solid rgba(255, 255, 255, 1);
+  border-radius: 1rem !important;
+}
+
+.el-dialog__body {
+  height: unset !important;
+}
+</style>