From 0fb3e65470f23d65ae0c71cc68148c6f514a33a6 Mon Sep 17 00:00:00 2001
From: renhao02 <huxin02@aisino.com>
Date: Fri, 21 Feb 2025 11:33:09 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=87=E4=B9=A6=E9=80=81=E8=BE=BE=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=E5=89=8D=E7=AB=AF=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/views/main/documentList.vue    |  167 ++
 client/src/views/main/index.vue           |  123 ++
 client/src/views/main/svi.vue             | 1671 +++++++++++++++++++++
 client/src/views/main/svi_back.vue        |  582 +++++++
 client/src/views/tztggl/NoticeManager.vue |  332 ++++
 5 files changed, 2875 insertions(+)
 create mode 100644 client/src/views/main/documentList.vue
 create mode 100644 client/src/views/main/index.vue
 create mode 100644 client/src/views/main/svi.vue
 create mode 100644 client/src/views/main/svi_back.vue
 create mode 100644 client/src/views/tztggl/NoticeManager.vue

diff --git a/client/src/views/main/documentList.vue b/client/src/views/main/documentList.vue
new file mode 100644
index 0000000..b6045f2
--- /dev/null
+++ b/client/src/views/main/documentList.vue
@@ -0,0 +1,167 @@
+<template>
+  <browser :component-loading="componentLoading"
+           class="enterpriseInfo"
+           style="height: 600px;"
+           :api-config="apiConfig"
+           :table-config="tableConfig"
+           :permissions="permissions"
+           :dialog-config="dialogConfig"
+           :actions="actions"
+           :customQuery="true"
+           @custom-query="customQuery"
+           @update:query-params="queryParams = $event"
+           @update:actions="actions = $event"
+           @update:dialog-config="dialogConfig = $event">
+    <el-table-column header-align="center" prop="documentCode" label="文书编号" min-width="300"/>
+    <el-table-column header-align="center" prop="documentName" label="文书名称" min-width="250"/>
+    <el-table-column header-align="center" prop="documentDate" label="发件时间" min-width="200"/>
+    <template #dialog="{ dialogConfig: dc }">
+      <el-dialog :open="dc.show" :title="dc.title" :type="dc.type" v-if="dc.show" :show-footer="false" @update:open="dc.show = false" class="enterprise-dialog">
+        <!-- 当存在 downloadUrl 时显示 PDF 文件 -->
+        <iframe 
+          v-if="dc.data.downloadUrl" 
+          :src="`${dc.data.downloadUrl}#toolbar=0&navpanes=0&scrollbar=0`" 
+          style="width: 100%; height: 600px; border: none;"
+          frameborder="0"
+        ></iframe>
+        <!-- 原有的文书内容显示 -->
+        <template v-else>
+          <laspb v-if="dc.data.documentName === '立案审批表'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <ajysspb v-if="dc.data.documentName === '案件移送审批表'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <xcjcjl v-if="dc.data.documentName === '现场检查记录'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <cyqzpz v-if="dc.data.documentName === '抽样取证凭证'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <jdwts v-if="dc.data.documentName === '鉴定委托书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <xcclcsjds v-if="dc.data.documentName === '现场处理措施决定书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <zlxqzgzls v-if="dc.data.documentName === '责令限期整改指令书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <xxdjbczjtzs v-if="dc.data.documentName === '先行登记保存证据通知书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <xxdjbczjcljds v-if="dc.data.documentName === '先行登记保存证据处理决定书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <xwtzs v-if="dc.data.documentName === '询问通知书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <dcxwbl v-if="dc.data.documentName === '调查询问笔录'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <zgfcyjs v-if="dc.data.documentName === '整改复查意见书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <ajdczjbg v-if="dc.data.documentName === '案件调查终结报告'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <fzshyjs v-if="dc.data.documentName === '行政执法决定法制审核意见书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <xzcfgzs v-if="dc.data.documentName === '行政处罚告知书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <tzhtzs v-if="dc.data.documentName === '行政处罚听证会通知书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <tzbl v-if="dc.data.documentName === '听证笔录'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <tzhbgs v-if="dc.data.documentName === '听证会报告书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <jttljl v-if="dc.data.documentName === '行政处罚集体讨论记录'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <ajclcpb v-if="dc.data.documentName === '案件处理呈批表'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <xzcfjds v-if="dc.data.documentName === '行政处罚决定书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <xzcfjdlxcgs v-if="dc.data.documentName === '行政处罚决定履行催告书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <yqjnfkpzs v-if="dc.data.documentName === '延期（分期）缴纳罚款批准书'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <wssdhz v-if="dc.data.documentName === '文书送达回执'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <jaspb v-if="dc.data.documentName === '结案审批表'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+          <jnbkb v-if="dc.data.documentName === '卷内备考表'" :documentCode="dc.data.documentCode" :documentNo="dc.data.documentNo" :documentName="dc.data.documentName" :caseInfo="dc.data.caseInfo" :documenContent="dc.data.documenContent"/>
+        </template>
+      </el-dialog>
+    </template>
+  </browser>
+</template>
+
+<script setup>
+import {reactive, toRefs} from 'vue'
+import Browser from '@/components/Browser.vue'
+import ElDialog from '@/components/ElDialog/index.vue'
+import documents from '@/api/lawenforcement/Document.js'
+import laspb from '@pages/xzzfgl/caseMan/laspb.vue'
+import ajysspb from '@pages/xzzfgl/caseMan/ajysspb.vue'
+import xcjcjl from '@pages/xzzfgl/caseMan/xcjcjl.vue'
+import cyqzpz from '@pages/xzzfgl/caseMan/cyqzpz.vue'
+import jdwts from '@pages/xzzfgl/caseMan/jdwts.vue'
+import xcclcsjds from '@pages/xzzfgl/caseMan/xcclcsjds.vue'
+import zlxqzgzls from '@pages/xzzfgl/caseMan/zlxqzgzls.vue'
+import xxdjbczjtzs from '@pages/xzzfgl/caseMan/xxdjbczjtzs.vue'
+import xxdjbczjcljds from '@pages/xzzfgl/caseMan/xxdjbczjcljds.vue'
+import xwtzs from '@pages/xzzfgl/caseMan/xwtzs.vue'
+import dcxwbl from '@pages/xzzfgl/caseMan/dcxwbl.vue'
+import zgfcyjs from '@pages/xzzfgl/caseMan/zgfcyjs.vue'
+import ajdczjbg from '@pages/xzzfgl/caseMan/ajdczjbg.vue'
+import fzshyjs from '@pages/xzzfgl/caseMan/fzshyjs.vue'
+import xzcfgzs from '@pages/xzzfgl/caseMan/xzcfgzs.vue'
+import tzhtzs from '@pages/xzzfgl/caseMan/tzhtzs.vue'
+import tzbl from '@pages/xzzfgl/caseMan/tzbl.vue'
+import tzhbgs from '@pages/xzzfgl/caseMan/tzhbgs.vue'
+import jttljl from '@pages/xzzfgl/caseMan/jttljl.vue'
+import ajclcpb from '@pages/xzzfgl/caseMan/ajclcpb.vue'
+import xzcfjds from '@pages/xzzfgl/caseMan/xzcfjds.vue'
+import xzcfjdlxcgs from '@pages/xzzfgl/caseMan/xzcfjdlxcgs.vue'
+import yqjnfkpzs from '@pages/xzzfgl/caseMan/yqjnfkpzs.vue'
+import wssdhz from '@pages/xzzfgl/caseMan/wssdhz.vue'
+import jaspb from '@pages/xzzfgl/caseMan/jaspb.vue'
+import jnbkb from '@pages/xzzfgl/caseMan/jnbkb.vue'
+
+
+const props = defineProps({
+  dialogData: {type: Object, default: () => ({})},
+  tag: {type: String, default: '2'}
+})
+
+const state = reactive({
+  componentLoading: false,
+  permissions: {
+    query: false,
+    add: false,
+    modify: false,
+    detail: true,
+    delete: false,
+    importFile: false,
+    exportFile: false,
+    exportSelectFile: false,
+    downloadTemp: false
+  },
+  tableConfig: {
+    hasControlColumn: true,
+    controlWidth: '100',
+    multipleSelect: false
+  },
+  apiConfig: {
+    api: documents,
+    modelId: 'documentId'
+  },
+  dialogConfig: {
+    type: 'max',
+    show: false,
+    mode: 'detail',
+    loading: false,
+    formLabelWidth: '90px',
+    showFooter: false
+  },
+  actions: {
+    detail: handleDetail
+  },
+  queryParams: {},
+})
+
+const {
+  componentLoading,
+  permissions,
+  tableConfig,
+  apiConfig,
+  dialogConfig,
+  actions,
+  queryParams
+} = toRefs(state)
+
+function customQuery(params) {
+  tableConfig.value.tableLoading = true
+  let query = Object.assign({}, params, props.dialogData)
+  apiConfig.value.api.getDocuments(query).then(res => {
+    tableConfig.value.tableLoading = false
+    if (res.success) tableConfig.value.tableData = res
+  }).catch(() => {
+    tableConfig.value.tableLoading = false
+  })
+}
+
+async function handleDetail(row) {
+  dialogConfig.value.show = true
+  dialogConfig.value.mode = 'detail'
+  dialogConfig.value.title = row.documentName
+  dialogConfig.value.data = Object.assign({}, row)
+}
+
+</script>
+
+<style lang="scss">
+
+</style>
diff --git a/client/src/views/main/index.vue b/client/src/views/main/index.vue
new file mode 100644
index 0000000..615fc30
--- /dev/null
+++ b/client/src/views/main/index.vue
@@ -0,0 +1,123 @@
+<template>
+  <div></div>
+</template>
+
+<script setup>
+  import { onMounted } from 'vue'
+  import { useUserStore } from '@/stores/modules/user'
+  import { login, sysLogout } from '@/api/lawenforcement/User'
+  import { useRouter } from 'vue-router'
+
+  const route = useRouter()
+  const userStore = useUserStore()
+  const baseURL = `/lawenforcement/v1/auth`
+
+  const handleGetToken = async (code) => {
+    try {
+      const {data} = await login({code})
+      if (data) {
+        userStore.setToken(data.access_token)
+        userStore.setRefreshToken(data.refresh_token)
+        userStore.setExpireIn(data.expires_in)
+        handleUserInfo()
+      }
+    } catch (error) {
+      console.log(error)
+    }
+  }
+
+  const handleUserInfo = async () => {
+    try {
+      if (!userStore.token) {
+        await handleLogin()
+        // 忘记写return导致后面的业务依然在运行。
+        return
+      }
+      // 获取用户信息并持久化到浏览器
+      await userStore.getUserInfo()
+      // 在url没有hash url的时候路由跳转首页
+      const hashUrl = window.location.hash.slice(1)
+      if (hashUrl && hashUrl === '/') {
+        //route.push('/svi/index')
+        route.push('/big-screen')
+      }
+    } catch (error) {
+      handleLogin()
+    }
+  }
+
+  const handleLogin = async () => {
+    try {
+      await userStore.login()
+    } catch (error) {
+      console.log(error)
+    }
+  }
+
+  // 使用 window 的 beforeunload 事件处理页面卸载
+  const setupUnloadListener = () => {
+    window.addEventListener('beforeunload', async () => {
+      const isRefreshing = sessionStorage.getItem('isRefreshing') === 'true';
+
+      // 保存当前的 hash 值，用于页面刷新后恢复
+      if (window.location.hash && window.location.hash !== '#/') {
+        sessionStorage.setItem('savedHash', window.location.hash);
+        console.log('保存 hash:', window.location.hash);
+      }
+
+      if (isRefreshing) {
+        // 如果是刷新操作，清除标记，不执行退出
+        sessionStorage.removeItem('isRefreshing');
+        console.log('页面刷新，不调用退出接口');
+      } 
+    });
+  }
+
+  onMounted(async () => {
+    // 检测导航类型，判断是否为刷新
+    if (performance.getEntriesByType && performance.getEntriesByType("navigation").length > 0) {
+      const navType = performance.getEntriesByType("navigation")[0].type;
+      if (navType === 'reload') {
+        sessionStorage.setItem('isRefreshing', 'true');
+        console.log('检测到页面刷新 (performance.getEntriesByType)');
+      } else {
+        sessionStorage.removeItem('isRefreshing'); // 确保非刷新时清除标记
+      }
+    } else if (performance.navigation) {
+      // 兼容旧版API
+      if (performance.navigation.type === performance.navigation.TYPE_RELOAD) {
+        sessionStorage.setItem('isRefreshing', 'true');
+        console.log('检测到页面刷新 (performance.navigation)');
+      } else {
+        sessionStorage.removeItem('isRefreshing'); // 确保非刷新时清除标记
+      }
+    } else {
+      // 如果API不支持，默认不认为是刷新，以防意外退出
+      sessionStorage.removeItem('isRefreshing');
+    }
+
+    setupUnloadListener();
+    const code = new URLSearchParams(window.location.search).get('code')
+    if (code) {
+      // 去掉浏览器url上的code参数
+      const url = new URL(window.location.href)
+      const fullHash = window.location.hash  // 保存完整hash路径
+      url.searchParams.delete('code')
+      window.history.replaceState(null, '', url)
+      handleGetToken(code)
+    } else {
+      // 检查是否有保存的hash值
+      const savedHash = sessionStorage.getItem('savedHash')
+      if (savedHash && window.location.hash === '#/') {
+        // 如果当前hash是'#/'且有保存的hash，则恢复保存的hash
+        window.location.hash = savedHash
+        // 恢复后清除保存的hash
+        sessionStorage.removeItem('savedHash')
+      } else {
+        handleUserInfo()
+      }
+    }
+  })
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/client/src/views/main/svi.vue b/client/src/views/main/svi.vue
new file mode 100644
index 0000000..e5a5ec3
--- /dev/null
+++ b/client/src/views/main/svi.vue
@@ -0,0 +1,1671 @@
+<template>
+  <div class="dashboard-container">
+    <div class="top-container">
+      <div class="tztg">
+        <div class="title">
+          <div class="icon"></div>
+          <div class="label">案件统计</div>
+          <!--          <div class="more">-->
+          <!--            <span class="more-text" @click="handleNoticeMore">查看更多</span>-->
+          <!--          </div>-->
+        </div>
+        <div class="case-content" ref="noticeContent">
+          <!-- 使用v-for循环渲染通知公告 -->
+          <div class="content-item">
+            <div class="left">
+              <div class="icon"></div>
+              <div class="label">
+                <div class="text">案件总数</div>
+                <div class="num" @click="showCaseDetail()">{{ caseTjData.zs }}</div>
+              </div>
+            </div>
+            <div class="right">
+              <div ref="chart11" style="height: 100%; width: 100%"></div>
+            </div>
+          </div>
+          <div class="content-item1">
+            <div class="content-item1-item">
+              <div class="icon"></div>
+              <div class="label">
+                <div class="text">已办结数量</div>
+                <div class="num" @click="showCaseDetail('1')">{{ caseTjData.ybjs }}</div>
+              </div>
+            </div>
+            <div class="content-item1-item">
+              <div class="icon icon1"></div>
+              <div class="label">
+                <div class="text">未办结数量</div>
+                <div class="num" @click="showCaseDetail('2')">{{ caseTjData.wbjs }}</div>
+              </div>
+            </div>
+            <div class="content-item1-item">
+              <div class="icon icon2"></div>
+              <div class="label">
+                <div class="text">罚款金额</div>
+                <div class="num" @click="showCaseDetail()">{{ caseTjData.cfje }}</div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <!--        <div class="content" ref="noticeContent" @mouseenter="handleMouseEnter" @mouseleave="handleMouseLeave">-->
+        <!--          &lt;!&ndash; 使用v-for循环渲染通知公告 &ndash;&gt;-->
+        <!--          <div class="content-item" v-for="(item, index) in noticeList" :key="index">-->
+        <!--            <div class="title">{{ item.noticeTitle }}</div>-->
+        <!--            <div class="des">-->
+        <!--              <div v-html="item.publishContent"></div>-->
+        <!--            </div>-->
+        <!--            <div class="other">-->
+        <!--              <div class="time">{{ item.releaseTime }}</div>-->
+        <!--              <div class="button" @click="handleNoticeClick(item)">查看详情</div>-->
+        <!--            </div>-->
+        <!--          </div>-->
+        <!--        </div>-->
+      </div>
+      <div class="jgtj">
+        <div class="title">
+          <div class="icon"></div>
+          <div class="label">企业监管信息统计</div>
+        </div>
+        <div class="content">
+          <div ref="chart1" style="height: 100%; width: 100%"></div>
+        </div>
+      </div>
+      <div class="zftj">
+        <div class="title">
+          <div class="icon"></div>
+          <div class="label">执法趋势统计</div>
+          <div class="select zftj-selected" v-if="false">
+            <el-select v-model="zftjSelected" style="width: 100%; height: 100%" size="small">
+              <el-option
+                  v-for="item in zftjOptions"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                  class="zftj-optioned"
+              />
+            </el-select>
+          </div>
+          <div class="time">
+            <el-date-picker
+                v-model="zftjDate"
+                :popper-options="popperOptions"
+                type="monthrange"
+                range-separator="-"
+                size="small"
+            />
+          </div>
+        </div>
+        <div class="content">
+          <!-- 添加折线图容器 -->
+          <div ref="chart2" style="height: 100%; width: 100%"></div>
+        </div>
+      </div>
+    </div>
+    <div class="bottom-container">
+      <div class="kjgn">
+        <div class="title">
+          <div class="icon"></div>
+          <div class="label">快捷功能</div>
+        </div>
+        <div class="content">
+          <div class="content-item" v-for="(func, idx) in quickFuncs" :key="idx" @click="gotoPath(func.path)">
+            <img class="icon" :src="func.icon"/>
+            <div class="label">{{ func.name }}</div>
+          </div>
+        </div>
+      </div>
+      <div class="zfjd">
+        <div class="title">
+          <div class="icon"></div>
+          <div class="label">案件进度一览表</div>
+          <div class="time">
+            <el-date-picker
+                v-model="xzzfDate"
+                :popper-options="popperOptions"
+                type="monthrange"
+                range-separator="-"
+                size="small"
+            />
+          </div>
+        </div>
+        <div class="content content-tabel">
+          <div class="process-status-table">
+            <el-table :data="caseData" border height="200" @cell-click="caseEventClick" ref="tableRef"
+                      @mouseenter="stopScroll" @mouseleave="startScroll">
+              <el-table-column align="center" prop="caseName" label="案件名称" width="200">
+                <template #default="{ row }">
+                  <div class="name-cell">{{ row.caseName }}</div>
+                </template>
+              </el-table-column>
+              <el-table-column
+                  v-for="(item, index) in caseData[0]?.list || []"
+                  :key="index"
+                  :label="item.column"
+                  :prop="item.column"
+                  width="100"
+                  align="center"
+              >
+                <template #default="{ row }">
+                  <div class="status-cell" :class="getCellClass(row.list[index].statusTxt)">
+                    <div class="status-label">
+                      <div class="line-left"></div>
+                      <i :class="getIconClass(row.list[index].statusTxt)"></i>
+                      {{ row.list[index].statusTxt }}
+                    </div>
+                    <div v-if="row.list[index].documentDate" class="time-text">{{ row.list[index].documentDate }}</div>
+                  </div>
+                </template>
+              </el-table-column>
+            </el-table>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <el-dialog class="business-dialog" v-model="showNotice" :show-close="false" :append-to-body="true"
+             v-loading="noticeLoading">
+    <template #header>
+      <div class="cvi-dialog-header">
+        <div class="cvi-dialog-header-title">
+          <div class="dialog-line"></div>
+          {{ noticeTitle }}
+        </div>
+        <i class="iconfont icon-zyyy_tcgb" @click="handleClose"></i>
+      </div>
+    </template>
+    <NoticeManager :portal="true" v-if="noticeDialog === 1"/>
+    <el-form label-width="110px" v-model="noticeDetail" v-if="noticeDialog === 2">
+      <el-row>
+        <el-col :span="8">
+          <el-form-item label="发布单位" prop="agency">
+            <el-input v-model="noticeDetail.agency.agencyName" :disabled="true"/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="发布人" prop="publisher">
+            <el-input v-model="noticeDetail.publisher" :disabled="true"/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="发布时间" prop="releaseTime">
+            <el-input v-model="noticeDetail.releaseTime" :disabled="true"/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="接收单位" prop="peoplePolices">
+            <el-input v-model="noticeDetail.jsdws" :disabled="true" type="textarea" rows="3"/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="发布标题" prop="noticeTitle">
+            <el-input v-model="noticeDetail.noticeTitle"/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="通知公告内容" prop="publishContent">
+            <div v-html="noticeDetail.publishContent"></div>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <documentList :dialog-data="documentInfo" v-if="noticeDialog === 3"/>
+  </el-dialog>
+  <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-row v-if="dialogConfig.show">
+      <BusinessTable v-loading="tableConfig.tableLoading"
+                     style="height: 600px"
+                     :config="tableConfig"
+                     :query-params="queryParams"
+                     :permissions="permissions"
+                     :data-res="tableConfig.data"
+                     @query-params="handleCaseParams">
+        <el-table-column align="center" header-align="center" prop="caseName" label="案件名称" min-width="180"/>
+        <el-table-column align="center" header-align="center" prop="caseDesc" label="案件描述" min-width="250"/>
+        <el-table-column align="center" header-align="center" prop="caseAdd" label="案发地址" min-width="180"/>
+        <el-table-column align="center" header-align="center" prop="decidePayment" label="处罚金额" min-width="120"/>
+        <el-table-column align="center" header-align="center" prop="fillingDate" label="立案时间" min-width="120"/>
+      </BusinessTable>
+    </el-row>
+  </el-dialog>
+</template>
+
+<script setup>
+import {useRouter} from 'vue-router'
+import {onMounted, reactive, ref, onUnmounted, nextTick, watch} from 'vue'
+import * as echarts from 'echarts'
+import notice from '@/api/lawenforcement/Notice.js'
+import enterprises from '@/api/lawenforcement/Enterprise.js'
+import homePage from '@/api/lawenforcement/HomePage.js'
+import caseApi from '@/api/lawenforcement/Case.js'
+import { useUserStore } from '@/stores/modules/user'
+import NoticeManager from '@pages/tztggl/NoticeManager.vue'
+import documentList from '@pages/main/documentList.vue'
+import BusinessTable from '@/components/BusinessTable.vue'
+
+
+let userInfo
+useUserStore().getUserInfo().then(data => userInfo = data)
+
+let popperOptions = reactive({
+  modifiers: [
+    {
+      name: 'flip',
+      options: {
+        fallbackPlacements: ['top'],
+        allowedAutoPlacements: ['bottom'],
+      },
+    },
+  ],
+})
+
+//1.通知公告
+let noticeDialog = ref(1)
+let showNotice = ref(false)
+let noticeLoading = ref(false)
+let noticeTitle = ref('通知公告')
+let noticeDetail = ref({agency: {}})
+const noticeList = ref([])
+
+function getNoticeList() {
+  notice.querylist({}).then((res) => {
+    if (res.success) {
+      noticeList.value = res.data
+    } else {
+      throw new Error('查询失败')
+    }
+  })
+}
+
+//通知内容容器引用
+const noticeContent = ref(null)
+//自动滚动定时器
+let scrollTimer = null
+//滚动速度
+const scrollSpeed = 1
+//记录当前滚动位置
+let currentScrollPosition = 0
+
+function handleNoticeMore() {
+  showNotice.value = true
+}
+
+function handleClose() {
+  showNotice.value = false
+  noticeDialog.value = 1
+}
+
+function handleNoticeClick(notice) {
+  noticeDialog.value = 2
+  showNotice.value = true
+  noticeTitle.value = '通知公告详情'
+  findOne(notice)
+}
+
+function findOne(row) {
+  noticeLoading.value = true
+  notice
+      .findOne(row.noticeId)
+      .then((res) => {
+        noticeLoading.value = false
+        if (res.success) {
+          noticeDetail.value = Object.assign({}, res.data, {
+            jsdws: res.data.peoplePolices?.map((item) => item.agencyName).join(', '),
+          })
+        }
+      })
+      .catch(() => {
+        noticeLoading.value = false
+      })
+}
+
+//自动滚动功能
+function startAutoScroll() {
+  if (!noticeContent.value) return
+  const scrollContainer = noticeContent.value
+  scrollTimer = setInterval(() => {
+    // 获取当前滚动位置
+    currentScrollPosition = scrollContainer.scrollTop
+    // 如果滚动到底部，重置到顶部
+    if (currentScrollPosition >= scrollContainer.scrollHeight - scrollContainer.clientHeight) {
+      // 瞬间跳回顶部，实现无缝循环
+      scrollContainer.scrollTop = 0
+      currentScrollPosition = 0
+    } else {
+      // 从当前位置继续滚动
+      currentScrollPosition += scrollSpeed
+      scrollContainer.scrollTop = currentScrollPosition
+    }
+  }, 50) // 每50毫秒滚动一次
+}
+
+//停止自动滚动
+function stopAutoScroll() {
+  if (scrollTimer) {
+    clearInterval(scrollTimer)
+    scrollTimer = null
+  }
+}
+
+//鼠标悬停时停止滚动
+function handleMouseEnter() {
+  stopAutoScroll()
+}
+
+//鼠标离开时恢复滚动
+function handleMouseLeave() {
+  startAutoScroll()
+}
+
+// 案件统计
+const caseTjData = reactive({zs: 0, wbjs: 0, ybjs: 0, cfje: 0})
+
+function ajtj() {
+  caseApi.ajtj().then((res) => {
+    if (res.success) {
+      let data = res.data
+      caseTjData.zs = data.zs
+      caseTjData.wbjs = data.wbjs
+      caseTjData.ybjs = data.ybjs
+      caseTjData.cfje = data.cfje
+      showCaseChart(data)
+    }
+  }).catch(e => console.log(e))
+}
+
+const chart11 = ref(null)
+let caseChart = null
+
+function showCaseChart(data) {
+  caseChart = echarts.init(chart11.value, null, {renderer: 'canvas'})
+  const option = {
+    tooltip: {
+      trigger: 'item',
+      axisPointer: {
+        type: 'shadow',
+      },
+    },
+    series: [
+      {
+        type: 'pie',
+        radius: ['55%', '80%'],
+        avoidLabelOverlap: false,
+        data: [
+          {value: data.ybjs, name: '已办结'},
+          {value: data.wbjs, name: '未办结'}
+        ],
+        label: {
+          show: false,
+          formatter: '{b}: {d}%'
+        },
+        itemStyle: {
+          color: function (params) {
+            let colorList = ['rgba(90, 216, 116, 0.85)', 'rgba(60, 134, 255, 0.85)']
+            return colorList[params.dataIndex]
+          },
+          borderColor: 'rgba(255, 255, 255, 0.8)',
+          borderWidth: 2,
+        },
+      }
+    ]
+  }
+  caseChart.setOption(option, true)
+  window.onresize = () => caseChart.resize()
+}
+
+const dialogConfig = reactive({
+  title: '案件信息',
+  show: false,
+  mode: 'detail',
+  loading: false,
+  actions: {
+    handleClose: closeCase,
+  }
+})
+
+const permissions = reactive({detail: false})
+
+const tableConfig = reactive({
+  hasControlColumn: false,
+  controlWidth: '80',
+  multipleSelect: false,
+  tableLoading: false,
+  pageSizes: [10, 20, 50, 100],
+  pagerLayout: '->, slot, prev, pager, next',
+  data: {},
+})
+
+const queryParams = reactive({})
+
+function showCaseDetail(type) {
+  dialogConfig.show = true
+  queryParams.page = 1
+  queryParams.pageSize = 10
+  queryParams.pagesize = 10
+  queryParams.agencyCode = userInfo.gajgjgdm
+  if (type) {
+    queryParams.ajbjlx = type
+  } else {
+    queryParams.ajbjlx = null
+  }
+  // getCaseList()
+}
+
+function handleCaseParams(val) {
+  Object.assign(queryParams, val)
+  getCaseList()
+}
+
+function getCaseList() {
+  caseApi.query(queryParams).then(res => {
+    if (res.code === 0) {
+      tableConfig.data = res
+    }
+  })
+}
+
+function closeCase() {
+  dialogConfig.show = false
+}
+
+//2.企业监管信息统计
+function initVisualize() {
+  enterprises
+      .visualizeStatistics()
+      .then((res) => {
+        if (res.success) {
+          const data = res.data
+          showOnlineChart(data.total, data)
+        }
+      })
+      .catch(() => {
+      })
+}
+
+const chart1 = ref(null)
+let onlineChart = null
+
+function showOnlineChart(sum, data) {
+  const keys = Object.keys(data)
+  let seriesDta = []
+  let colorData = {
+    1: {color: '#5B8FF9', name: '矿山'},
+    2: {color: '#5AD8A6', name: '危化品生产'},
+    3: {color: '#5D7092', name: '危化品经营 （仓储）'},
+    4: {color: '#F6BD16', name: '危化品经营 （无仓储）'},
+    5: {color: '#E8684A', name: '加油站'},
+    6: {color: '#6DC8EC', name: '工业企业'},
+    7: {color: '#9270CA', name: '商贸企业'},
+    8: {color: '#FF9D4D', name: '安全生产中介'},
+    9: {color: '#269A99', name: '安全生产检测'},
+    10: {color: '#FF99C3', name: '安全生产培训'},
+    99: {color: '#5B8FF9', name: '其他'},
+  }
+  keys.forEach((k) => {
+    if (k !== 'structures' && k !== 'hospital' && k !== 'ohter' && k !== 'total') {
+      seriesDta.push({
+        name: colorData[k].name,
+        value: data[k],
+        itemStyle: {
+          color: colorData[k].color,
+          borderColor: 'rgba(255, 255, 255, 0.8)',
+          borderWidth: 4,
+        },
+      })
+    }
+  })
+  if (chart1.value) {
+    onlineChart = echarts.init(chart1.value, null, {
+      renderer: 'canvas',
+    })
+    const option = {
+      tooltip: {
+        trigger: 'item',
+        axisPointer: {
+          type: 'shadow',
+        },
+      },
+      legend: {
+        show: true,
+        orient: 'vertical',
+        icon: 'circle',
+        right: size(12),
+        top: size(20),
+        bottom: size(20),
+        itemHeight: size(12),
+        itemGap: size(6),
+        // 新增：自定义图例显示内容，包含数值
+        formatter: function (name) {
+          // 找到对应的数据项
+          const targetItem = seriesDta.find((item) => item.name === name)
+          if (targetItem) {
+            // 返回格式化的图例文本，包含名称和数值
+            return `${name} ${targetItem.value} 家`
+          }
+          return name
+        },
+        textStyle: {
+          color: '#373E52',
+          fontSize: size(12),
+          fontWeight: 'bold',
+          // 新增：增加行高，确保数值显示完整
+          lineHeight: 16,
+        },
+      },
+      series: [
+        {
+          type: 'pie',
+          center: ['25%', '50%'],
+          radius: ['58%', '40%'],
+          avoidLabelOverlap: false,
+          data: seriesDta,
+          label: {
+            show: false,
+            position: 'outside',
+          },
+        },
+      ],
+      graphic: {
+        type: 'text',
+        left: sum === 0 ? '17%' : '14.5%',
+        top: '38%',
+        style: {
+          text: '{a|共计企业}\n{b|' + sum + '}\n{c|家}',
+          // fill: 'transparent',
+          rich: {
+            a: {
+              fontSize: 18,
+              color: 'rgb(69, 85, 115)',
+              fontWeight: 'bold',
+              fontFamily: 'OPPOSans40_Bold',
+              lineHeight: 50,
+            },
+            b: {
+              fontSize: 32,
+              color: '#3C86FF',
+              fontWeight: 'bold',
+              fontFamily: 'OPPOSans40_Bold',
+              lineHeight: 35,
+            },
+            c: {
+              fontSize: 14,
+              color: '#373E52',
+              fontWeight: 'bold',
+              fontFamily: 'OPPOSans40',
+              lineHeight: 20,
+            },
+          },
+          textAlign: 'center',
+        },
+      },
+    }
+    onlineChart.setOption(option, true)
+    window.onresize = () => onlineChart.resize()
+  }
+}
+
+//3.执法趋势统计
+let zftjDate = ref([])
+const zftjSelected = ref('1')
+const zftjOptions = reactive([{value: '1', label: '执法检查与立案趋势'}])
+
+// 新增折线图引用
+const chart2 = ref(null)
+let lineChart = null
+
+// 新增：获取执法趋势数据的方法
+function findZfqsData() {
+  homePage.findZfqsData({createTime: zftjDate.value}).then((res) => {
+    if (res.success) {
+      let data = res.data
+      showLineChart(data)
+    }
+  })
+}
+
+//显示折线图
+function showLineChart(data) {
+  if (chart2.value) {
+    lineChart = echarts.init(chart2.value, null, {
+      renderer: 'canvas',
+    })
+    const option = {
+      tooltip: {
+        trigger: 'axis',
+        axisPointer: {
+          type: 'cross',
+          crossStyle: {
+            color: '#999',
+          },
+          //设置十字准线的样式
+          lineStyle: {
+            color: '#3C86FF',
+            width: 1,
+            type: 'dashed',
+          },
+          //设置十字准线的标签样式
+          label: {
+            backgroundColor: '#3C86FF',
+            borderColor: '#3C86FF',
+            borderWidth: 1,
+            textStyle: {
+              color: '#FFFFFF',
+            },
+            //添加阴影效果
+            extraCssText: 'box-shadow: inset 0px 0px 8px 0px rgba(255,255,255,0.5);',
+          },
+          // 修改选中区域的背景色为红色并设置透明度
+          shadowStyle: {
+            color: 'rgba(255, 255, 255, 0.5)',
+            opacity: 0.1,
+          },
+        },
+      },
+      legend: {
+        data: data.legend,
+        top: 20,
+        right: 20,
+        textStyle: {
+          color: '#373E52',
+          fontSize: size(12),
+        },
+      },
+      grid: {
+        left: '3%',
+        right: '4%',
+        bottom: '3%',
+        top: '15%',
+        containLabel: true,
+      },
+      xAxis: [
+        {
+          type: 'category',
+          data: data.xAxis,
+          axisPointer: {
+            type: 'shadow',
+          },
+          axisLine: {
+            lineStyle: {
+              color: '#E0E0E0',
+            },
+          },
+          axisLabel: {
+            color: '#8890A6',
+            fontSize: size(12),
+          },
+        },
+      ],
+      yAxis: [
+        {
+          type: 'value',
+          name: '',
+          min: 0,
+          max: 300,
+          interval: 50,
+          axisLine: {
+            lineStyle: {
+              color: '#E0E0E0',
+            },
+          },
+          axisLabel: {
+            color: '#8890A6',
+            fontSize: size(12),
+          },
+          nameTextStyle: {
+            color: '#8890A6',
+            fontSize: size(12),
+          },
+          // 添加Y轴网格线，设置为虚线
+          splitLine: {
+            show: true,
+            lineStyle: {
+              color: '#E0E0E0',
+              type: 'dashed', // 设置为虚线
+              opacity: 0.5,
+            },
+          },
+        },
+      ],
+      series: [
+        {
+          name: '执法检查',
+          type: 'line',
+          smooth: true,
+          data: data.执法检查,
+          itemStyle: {
+            color: '#5B8FF9',
+          },
+          lineStyle: {
+            color: '#5B8FF9',
+            width: 3,
+          },
+          // 添加透明的面积背景色
+          areaStyle: {
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: 'rgba(91, 143, 249, 0.3)', // 顶部颜色，透明度0.3
+              },
+              {
+                offset: 1,
+                color: 'rgba(91, 143, 249, 0.05)', // 底部颜色，透明度0.05
+              },
+            ]),
+          },
+        },
+        {
+          name: '执法立案',
+          type: 'line',
+          smooth: true,
+          data: data.执法立案,
+          itemStyle: {
+            color: '#66F69C',
+          },
+          lineStyle: {
+            color: '#66F69C',
+            width: 3,
+          },
+          // 添加透明的面积背景色
+          areaStyle: {
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: 'rgba(102, 246, 156, 0.3)', //顶部颜色，透明度0.3
+              },
+              {
+                offset: 1,
+                color: 'rgba(102, 246, 156, 0.05)', //底部颜色，透明度0.05
+              },
+            ]),
+          },
+        },
+      ],
+    }
+    lineChart.setOption(option, true)
+    window.addEventListener('resize', () => {
+      lineChart.resize()
+    })
+  }
+}
+
+watch(
+    () => zftjDate.value,
+    (nv) => {
+      if (nv) findZfqsData()
+    }
+)
+
+//4.快捷方式
+const route = useRouter()
+// 动态图片加载示例
+const getImageUrl = (name) => {
+  return new URL(`../../assets/image/${name}`, import.meta.url).href
+}
+const quickFuncs = ref([
+  {icon: getImageUrl('qycx.png'), name: '企业查询', path: '/dtsjygl/qyxxcx'},
+  {icon: getImageUrl('qyfjfl.png'), name: '企业分级分类', path: '/dtsjygl/qyfjfl'},
+  {icon: getImageUrl('zfxx.png'), name: '执法信息', path: '/xzzfgl/zfxxgl'},
+  {icon: getImageUrl('ddjc.png'), name: '督导检查', path: '/xzzfgl/ddjcjh/ddjc'},
+  {icon: getImageUrl('ddjc.png'), name: '年度计划', path: '/xzzfgl/zdzfjh/zdjcqyqd'},
+  {icon: getImageUrl('jbjc.png'), name: '举报投诉', path: '/jbts/login'},
+  {icon: getImageUrl('smrq.png'), name: '扫码入企', path: '/xzzfgl/zfjc/dzjcfa'},
+  {icon: getImageUrl('zfws.png'), name: '执法文书', path: '/xzzfgl/zfwsgl'},
+  {icon: getImageUrl('ajzl.png'), name: '案卷资料', path: '/xzzfgl/ljgdl/caseList'},
+  {icon: getImageUrl('fxczf.png'), name: '非现场执法', path: '/fxczfgl/index'},
+  {icon: getImageUrl('wssd.png'), name: '文书送达', path: '/xzzfgl/wssd/zfwsxx'},
+  {icon: getImageUrl('daxx.png'), name: '档案信息', path: '/xzzfgl/ljgd/xzjcdagl'},
+])
+const gotoPath = (path) => {
+  route.push(path)
+}
+
+//5.行政执法案件进度一览表
+// 案件数据变量
+let xzzfDate = ref([])
+const documentInfo = ref({})
+const caseData = ref([])
+
+function findAjjdData() {
+  homePage.findAjjdlbData({createTime: xzzfDate.value}).then((res) => {
+    if (res.success) {
+      caseData.value = res.data
+    }
+  })
+}
+
+/**
+ * 根据状态返回对应的单元格样式类
+ * @param {string} status - 状态文本
+ * @returns {string} - CSS 类名
+ */
+function getCellClass(status) {
+  const classMap = {
+    已完成: 'status-completed',
+    进行中: 'status-processing',
+    未开始: 'status-pending',
+    已禁止: 'status-forbidden',
+  }
+  return classMap[status] || 'status-pending'
+}
+
+/**
+ * 根据状态返回对应的图标类
+ * @param {string} status - 状态文本
+ * @returns {string} - 图标类名
+ */
+function getIconClass(status) {
+  const iconMap = {
+    已完成: 'iconfont icon-zngzt_ywcljq',
+    进行中: 'iconfont icon-zngzt_ywcljq',
+    未开始: 'iconfont icon-zngzt_wcljq',
+    已禁止: 'el-icon-circle-close',
+  }
+  return iconMap[status] || 'el-icon-remove-outline'
+}
+
+function caseEventClick(row, column, cell, event) {
+  const colProp = column.property
+  const keys = ['检查', '立案', '调查终结', '审理', '告知', '申辩与听证', '执行', '决定', '结案']
+  if (keys.includes(colProp)) {
+    let data = row.list.find((item) => item.column === colProp)
+    if (data.statusTxt === '已完成') {
+      showNotice.value = true
+      noticeDialog.value = 3
+      noticeTitle.value = row.caseName
+      documentInfo.value = {caseId: row.caseId, status: 'done'}
+    }
+  }
+}
+
+let timer = null
+const scrollTableSpeed = 1
+// 控制滚动间隔时间（毫秒）
+const scrollInterval = 70 // 可以调整这个值来改变滚动速度
+
+//开始滚动
+const startScroll = () => {
+  const tableWrapper = document.querySelector('.process-status-table .el-scrollbar__wrap')
+  timer = setInterval(() => {
+    if (tableWrapper.clientHeight + tableWrapper.scrollTop < tableWrapper.scrollHeight) {
+      tableWrapper.scrollTop += scrollTableSpeed
+    } else {
+      tableWrapper.scrollTop = 0
+    }
+  }, scrollInterval) // 通过调整 scrollInterval 来控制滚动间隔
+}
+
+// 停止滚动
+const stopScroll = () => {
+  if (timer) {
+    clearInterval(timer)
+    timer = null
+  }
+}
+
+watch(
+    () => xzzfDate.value,
+    (nv) => {
+      if (nv) findAjjdData()
+    }
+)
+
+//重置字体大小
+function size(value) {
+  let clientWidth = document.documentElement.clientWidth
+  return (clientWidth * value) / 1920
+}
+
+onMounted(() => {
+  // 设置默认时间范围：当前月往前推12个月
+  const endDate = new Date()
+  const startDate = new Date()
+  startDate.setMonth(startDate.getMonth() - 11) // 往前推11个月，加上当前月共12个月
+  // 确保日期为月份的第一天
+  startDate.setDate(1)
+  endDate.setDate(1)
+  zftjDate.value = [startDate, endDate]
+  xzzfDate.value = [startDate, endDate]
+
+  showOnlineChart(0, {1: 0, 2: 0, 3: 0, 4: 0, 5: 0, 6: 0, 7: 0, 8: 0, 9: 0, 10: 0, 99: 0})
+  getNoticeList()
+  ajtj()
+  initVisualize()
+  findZfqsData() //调用执法趋势数据获取方法
+  findAjjdData() //调用执法趋势数据获取方法
+
+  //启动自动滚动
+  nextTick(() => {
+    setTimeout(() => {
+      startAutoScroll()
+    }, 100)
+    setTimeout(() => {
+      startScroll()
+    }, 1000)
+  })
+})
+
+// 新增：组件卸载时清理定时器
+onUnmounted(() => {
+  stopAutoScroll()
+  stopScroll()
+})
+</script>
+
+<style scoped lang="scss">
+.auto-scroll-table .el-table__body-wrapper {
+  transition: scroll-top 0.5s ease-in-out;
+}
+
+.line-left {
+  background: linear-gradient(to bottom, #d2d7df 0%, #ffffff 100%);
+  width: 2px;
+  height: 85px;
+  position: absolute;
+  left: 0;
+  top: 0;
+}
+
+.dashboard-container {
+  width: 100%;
+  height: calc(100% - 64px);
+  margin: 0px;
+  padding: 40px;
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+
+  .top-container,
+  .bottom-container {
+    flex: 1;
+    display: flex;
+    flex-direction: row;
+    gap: 1%;
+    min-height: 0;
+  }
+
+  .top-container {
+    margin-bottom: 24px;
+  }
+
+  .tztg,
+  .kjgn {
+    width: 25%;
+    height: 100%;
+    background: rgba(255, 255, 255, 0.25);
+    border: 1px solid #ffffff;
+    backdrop-filter: blur(16px);
+    border-radius: 8px;
+    display: flex;
+    flex-direction: column;
+
+    .title {
+      .label {
+        color: #ffffff;
+      }
+    }
+  }
+
+  .jgtj {
+    width: 25.5%;
+    height: 100%;
+    background: rgba(255, 255, 255, 0.75);
+    box-shadow: inset 0px 0px 8px 0px rgba(255, 255, 255, 0.5);
+    border: 1px solid #ffffff;
+    border-radius: 8px;
+  }
+
+  .zftj {
+    width: 47.5%;
+    height: 100%;
+    background: rgba(255, 255, 255, 0.75);
+    box-shadow: inset 0px 0px 8px 0px rgba(255, 255, 255, 0.5);
+    border: 1px solid #ffffff;
+    border-radius: 8px;
+
+    // 新增：为折线图容器添加样式
+    .content {
+      height: calc(100% - 48px);
+      max-height: calc(100% - 48px);
+      width: 100%;
+      padding: 16px;
+      box-sizing: border-box;
+    }
+  }
+
+  .title {
+    height: 48px;
+    width: 100%;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+
+    .icon {
+      width: 6px;
+      height: 24px;
+      margin: 0px 16px;
+      background: #3c86ff;
+      border-radius: 3px;
+    }
+
+    .label {
+      width: auto;
+      margin: 0px 16px 0px 0px;
+      font-size: 18px;
+      font-family: OPPOSans40_Bold;
+      font-style: normal;
+      font-weight: bolder;
+      color: #373e52;
+      text-align: left;
+    }
+
+    .more {
+      margin-left: auto;
+      margin-right: 16px;
+      width: 72px;
+      height: 24px;
+      border-radius: 4px;
+      border: 1px solid rgba(255, 255, 255, 0.5);
+      background: rgba(255, 255, 255, 0.01);
+      //opacity: 0.5;
+      backdrop-filter: blur(4px);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      cursor: pointer;
+
+      .more-text {
+        color: rgba(255, 255, 255);
+        font-size: 12px;
+        font-family: OPPOSans40_Bold;
+        font-style: normal;
+      }
+    }
+
+    .select {
+      width: 184px;
+      height: 24px;
+      margin-left: 16px;
+    }
+
+    .time {
+      margin-left: auto;
+      margin-right: 16px;
+      width: 184px;
+      height: 24px;
+
+      :deep(.el-date-editor) {
+        width: 87%;
+        height: 100%;
+        background: #ffffff;
+        box-shadow: inset 0px 0px 8px 0px rgba(255, 255, 255, 0.5);
+        border-radius: 4px;
+        border: 1px solid rgba(55, 62, 82, 0.1);
+        backdrop-filter: blur(38px);
+      }
+    }
+  }
+
+  .content {
+    height: calc(100% - 48px);
+    max-height: calc(100% - 48px);
+    width: 100%;
+  }
+
+  .tztg {
+    .case-content {
+      height: calc(100% - 64px);
+      max-height: calc(100% - 64px);
+      box-sizing: border-box;
+      padding: 6px 16px 0px 16px;
+      display: flex;
+      flex-direction: column;
+
+      .content-item {
+        flex: 1;
+        box-sizing: border-box;
+        width: 100%;
+        height: auto;
+        background: rgba(255, 255, 255, 0.75);
+        box-shadow: inset 0px 0px 8px 0px rgba(255, 255, 255, 0.5), inset 0px 0px 8px 0px rgba(255, 255, 255, 0.5);
+        border-radius: 12px;
+        border: 1px solid #FFFFFF;
+        margin-bottom: 16px;
+        display: flex;
+        flex-direction: row;
+
+        .left {
+          width: 60%;
+          height: 100%;
+          display: flex;
+          flex-direction: row;
+          align-items: center;
+
+          .icon {
+            margin-left: 12px;
+            width: 82px;
+            height: 82px;
+            background-image: url("../../assets/image/ajtb.png");
+            background-size: cover;
+            background-repeat: no-repeat;
+          }
+
+          .label {
+
+            .text {
+              font-family: OPPOSans40_Bold;
+              font-size: 18px;
+              font-weight: bold;
+              color: #373E52;
+              line-height: 21px;
+              text-shadow: inset 0px 0px 8px rgba(255, 255, 255, 0.5);
+              text-align: right;
+              font-style: normal;
+            }
+
+            .num {
+              font-family: MiSans, MiSans;
+              font-weight: bold;
+              font-size: 32px;
+              color: #3C86FF;
+              line-height: 42px;
+              text-shadow: inset 0px 0px 8px rgba(255, 255, 255, 0.5);
+              text-align: left;
+              font-style: normal;
+              cursor: pointer;
+            }
+          }
+
+        }
+
+        .right {
+          width: 40%;
+          height: 100%;
+        }
+
+      }
+
+      .content-item1 {
+        flex: 1;
+        box-sizing: border-box;
+        width: 100%;
+        height: auto;
+        display: flex;
+        flex-wrap: wrap;
+        gap: 16px;
+
+        .content-item1-item {
+          flex: 1;
+          background: rgba(255, 255, 255, 0.75);
+          box-shadow: inset 0px 0px 8px 0px rgba(255, 255, 255, 0.5);
+          border: 1px solid #FFFFFF;
+          border-radius: 12px;
+          display: flex;
+          flex-direction: column;
+          justify-content: center;
+          align-items: center;
+
+          .icon {
+            width: 41px;
+            height: 44px;
+            background-image: url("../../assets/image/ajtb1.png");
+            background-size: cover;
+            background-repeat: no-repeat;
+          }
+
+          .label {
+            text-align: center;
+
+            .text {
+              font-family: OPPOSans40_Bold;
+              font-weight: bold;
+              font-size: 14px;
+              color: #373E52;
+              line-height: 16px;
+              text-shadow: inset 0px 0px 8px rgba(255, 255, 255, 0.5);
+              font-style: normal;
+            }
+
+            .num {
+              font-family: MiSans, MiSans;
+              font-weight: bold;
+              font-size: 18px;
+              color: #3C86FF;
+              line-height: 36px;
+              text-shadow: inset 0px 0px 8px rgba(255, 255, 255, 0.5);
+              font-style: normal;
+              cursor: pointer;
+            }
+          }
+
+          .icon1 {
+            background-image: url("../../assets/image/ajtb2.png");
+          }
+
+          .icon2 {
+            background-image: url("../../assets/image/ajtb3.png");
+          }
+        }
+      }
+
+      .content-item:last-child {
+        margin-bottom: 0px;
+      }
+    }
+  }
+
+  .tztg {
+    .content {
+      height: calc(100% - 64px);
+      max-height: calc(100% - 64px);
+      box-sizing: border-box;
+      padding: 16px 23px 0px 23px;
+      display: flex;
+      flex-direction: column;
+      overflow-y: auto;
+      //平滑滚动
+      scroll-behavior: initial;
+
+      //隐藏滚动条但保持滚动功能
+      scrollbar-width: none; /* Firefox */
+      -ms-overflow-style: none; /* IE and Edge */
+
+      &::-webkit-scrollbar {
+        display: none; /* Chrome, Safari, Opera */
+      }
+
+      .content-item {
+        box-sizing: border-box;
+        width: 432px;
+        height: 153px;
+        padding: 14px 16px;
+        background: rgba(255, 255, 255, 0.75);
+        border: 1px solid #ffffff;
+        border-radius: 8px;
+        margin-bottom: 8px;
+        display: flex;
+        flex-direction: column;
+        // 新增：添加过渡效果
+        transition: all 0.3s ease;
+        // 新增：鼠标悬停效果
+        &:hover {
+          transform: translateY(-2px);
+          box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+          background: rgba(255, 255, 255, 0.85);
+        }
+
+        .title {
+          display: block;
+          width: 100%;
+          height: 30px;
+          font-size: 18px;
+          color: #373e52;
+          font-family: OPPOSans40_Medium;
+          font-weight: bold;
+          line-height: 24px;
+          text-align: left;
+          font-style: normal;
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+
+        .des {
+          display: -webkit-box;
+          width: 100%;
+          height: 72px;
+          max-height: 72px;
+          font-size: 14px;
+          color: #8890a6;
+          font-family: OPPOSans40_Medium;
+          line-height: 24px;
+          text-align: left;
+          -webkit-line-clamp: 3;
+          -webkit-box-orient: vertical;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+
+        .other {
+          display: flex;
+          flex-direction: row;
+
+          .time {
+            font-size: 12px;
+            color: #8890a6;
+            font-family: OPPOSans40_Medium;
+            line-height: 24px;
+            text-align: left;
+            font-style: normal;
+          }
+
+          .button {
+            margin-left: auto;
+            font-size: 12px;
+            color: #3c86ff;
+            font-family: OPPOSans40_Medium;
+            line-height: 24px;
+            text-align: right;
+            font-style: normal;
+            cursor: pointer;
+            // 新增：按钮悬停效果
+            &:hover {
+              color: #2a6fd8;
+              text-decoration: underline;
+            }
+          }
+        }
+      }
+
+      .content-item:last-child {
+        margin-bottom: 0px;
+      }
+    }
+  }
+
+  .kjgn {
+    .content {
+      height: 100%;
+      box-sizing: border-box;
+      padding: 13px 13px;
+      display: flex;
+      flex-direction: row;
+      justify-content: space-between;
+      flex-wrap: wrap;
+      gap: 13px;
+
+      .content-item {
+        cursor: pointer;
+        flex: 0 0 calc(25% - 13px);
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+
+        img {
+          width: 50%;
+        }
+
+        .label {
+          font-size: 14px;
+          color: #ffffff;
+          font-family: OPPOSans40_Medium;
+          line-height: 26px;
+          text-align: center;
+          font-style: normal;
+        }
+      }
+    }
+  }
+
+  // 新增行政执法案件进度一览表样式
+  .zfjd {
+    width: 74%;
+    height: 100%;
+    background: rgba(255, 255, 255, 0.75);
+    box-shadow: inset 0px 0px 8px 0px rgba(255, 255, 255, 0.5);
+    border: 1px solid #ffffff;
+    border-radius: 8px;
+
+    .content {
+      display: flex;
+
+      .process-status-table {
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        width: 100%;
+        padding: 15px;
+        box-sizing: border-box;
+        // 隐藏滚动条但保持滚动功能
+        ::v-deep .el-table__body-wrapper {
+          scrollbar-width: none; /* Firefox */
+          -ms-overflow-style: none; /* IE and Edge */
+        }
+
+        ::v-deep .el-table__body-wrapper::-webkit-scrollbar {
+          display: none; /* Chrome, Safari, Opera */
+        }
+
+        .status-cell {
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          justify-content: center;
+          gap: 6px;
+          padding: 16px 8px;
+          height: 85px;
+          width: calc(100% + 2px);
+          margin: -1px;
+          position: relative;
+          transition: all 0.2s ease;
+          cursor: pointer;
+
+          .status-label {
+            display: flex;
+            align-items: center;
+            gap: 4px;
+            font-size: 14px;
+            font-weight: 500;
+
+            i {
+              font-size: 14px;
+            }
+          }
+
+          .time-text {
+            font-size: 12px;
+            white-space: pre-line;
+            text-align: center;
+            line-height: 1.3;
+            opacity: 0.85;
+          }
+
+          // 已完成 - 绿色渐变背景
+          &.status-completed {
+            background: linear-gradient(to bottom, #c8e6c9 0%, #ffffff 100%);
+            border-top: 3px solid #67c23a;
+            color: #34bc55;
+
+            .status-label {
+              color: #34bc55;
+            }
+
+            .time-text {
+              color: #8890a6;
+            }
+
+            &:hover {
+              background: linear-gradient(to bottom, #81c784 0%, #e8f5e9 100%);
+              color: #ffffff;
+
+              .status-label {
+                color: #ffffff;
+              }
+
+              .time-text {
+                color: #8890a6;
+              }
+            }
+          }
+
+          // 进行中 - 蓝色渐变背景
+          &.status-processing {
+            background: linear-gradient(to bottom, #bbdefb 0%, #ffffff 100%);
+            border-top: 3px solid #409eff;
+
+            .status-label {
+              color: #3c86ff;
+            }
+
+            .time-text {
+              color: #8890a6;
+            }
+
+            i {
+              animation: rotating 1.5s linear infinite;
+            }
+
+            &:hover {
+              background: linear-gradient(to bottom, #64b5f6 0%, #e3f2fd 100%);
+              color: #ffffff;
+
+              .status-label {
+                color: #ffffff;
+              }
+
+              .time-text {
+                color: #ffffff;
+              }
+            }
+          }
+
+          // 未开始 - 灰色渐变背景
+          &.status-pending {
+            background: linear-gradient(to bottom, #e0e0e0 0%, #ffffff 100%);
+            border-top: 3px solid #909399;
+            color: #b6c3da;
+
+            .status-label {
+              color: #b6c3da;
+            }
+
+            .time-text {
+              color: #616161;
+            }
+
+            &:hover {
+              background: linear-gradient(to bottom, #bdbdbd 0%, #f5f5f5 100%);
+              color: #424242;
+
+              .status-label {
+                color: #424242;
+              }
+
+              .time-text {
+                color: #424242;
+              }
+            }
+          }
+
+          // 已禁止 - 红色渐变背景
+          &.status-forbidden {
+            background: linear-gradient(to bottom, #ffcdd2 0%, #ffffff 100%);
+            border-top: 3px solid #f56c6c;
+            color: #c62828;
+
+            .status-label {
+              color: #c62828;
+            }
+
+            .time-text {
+              color: #c62828;
+            }
+
+            &:hover {
+              background: linear-gradient(to bottom, #e57373 0%, #ffebee 100%);
+              color: #ffffff;
+
+              .status-label {
+                color: #ffffff;
+              }
+
+              .time-text {
+                color: #ffffff;
+              }
+            }
+          }
+        }
+
+        .name-cell {
+          padding: 16px 12px;
+          height: 85px;
+          display: flex;
+          align-items: center;
+          width: calc(100% + 2px);
+          margin: -1px;
+          border-top: 3px solid #34bc55;
+          background-color: #ffffff;
+          font-size: 13px;
+          line-height: 1.4;
+        }
+
+        ::v-deep .el-table {
+          flex: 1;
+          width: 99.8%;
+          overflow-y: auto;
+          overflow-x: hidden;
+
+          .el-table__header th {
+            background-color: #f5f7fa;
+            color: #8890a6;
+            font-size: 14px;
+            padding: 12px 0;
+          }
+
+          .el-table__body td {
+            padding: 0 !important;
+            border-right: 1px solid #ebeef5;
+            vertical-align: middle;
+            color: #373e52;
+            font-size: 14px;
+          }
+
+          .cell {
+            padding: 0 !important;
+            overflow: visible;
+            line-height: 1;
+          }
+
+          // 确保表格右边框对齐
+          colgroup col[name='gutter'] {
+            width: 0 !important;
+            display: none;
+          }
+
+          .gutter {
+            display: none !important;
+          }
+        }
+      }
+
+      @keyframes rotating {
+        from {
+          transform: rotate(0deg);
+        }
+        to {
+          transform: rotate(360deg);
+        }
+      }
+    }
+  }
+}
+</style>
+<style lang="scss">
+.content-tabel {
+  .el-table__header,
+  .el-table__body {
+    width: 100% !important;
+  }
+}
+
+.zftj-selected {
+  .el-select--small .el-select__wrapper {
+    border-radius: 0.25rem !important;
+  }
+}
+
+.zftj-optioned {
+  span {
+    font-size: 12px !important;
+  }
+}
+</style>
diff --git a/client/src/views/main/svi_back.vue b/client/src/views/main/svi_back.vue
new file mode 100644
index 0000000..dc2b149
--- /dev/null
+++ b/client/src/views/main/svi_back.vue
@@ -0,0 +1,582 @@
+<template>
+  <div class="dashboard-container">
+    <!-- 统计卡片 -->
+    <div class="statistic-row">
+      <div class="statistic-card" v-for="(card, idx) in stats" :key="idx">
+        <div class="card-icon"><img width="72px" height="72px" :src="card.image" :alt="card.title" /> </div>
+        <div class="card-content">
+          <div class="card-title">{{ card.title }}</div>
+          <div class="card-text">
+            <div class="card-number">{{ card.value }}</div>
+<!--            <div style="margin-right: 10px;margin-top: 5px">-->
+<!--              <div> <span class="card-compare">较昨日</span></div>-->
+<!--              <div style="display: flex"><div class="arrow"></div><span class="num">{{ card.change }}</span></div>-->
+<!--            </div>-->
+            <div class="goto" @click="gotoPath(card.path)"></div>
+          </div>
+        </div>
+
+      </div>
+    </div>
+
+    <div style="display: flex;">
+     <div style="width: 1380px">
+       <!-- 待办事项 -->
+       <div class="todo-section">
+         <div class="section-title">
+           <div class="section-title-icon"></div>
+           <div class="section-title-font ">待办事项</div>
+         </div>
+         <div class="todo-steps">
+           <div class="step-item" v-for="(step, idx) in todoSteps" :key="idx"  @mouseenter="mouseenter(idx)"  @mouseleave="mouseleave()"  @click="gotoPath(step.path)">
+             <div class="step-item-img">
+               <img width="56px" height="56px" class="step-item-img-normal-state" :src="step.image1" alt=""/>
+               <img width="56px" height="56px" class="step-item-img-hover-state"  :src="step.image2"  alt=""/>
+             </div>
+             <div class="step-item-name">{{ step.name }}</div>
+             <div v-if="idx===0" class="step-item-count-specail">{{ step.count }}</div>
+             <div v-else class="step-item-count">{{ step.count }}</div>
+             <div class="step-item-arrow">
+               <img width="32px" height="32px" class="step-item-arrow-normal-state" src="../../assets/home_page/stepgoto.png" alt=""/>
+               <img width="32px" height="32px" class="step-item-arrow-hover-state" src="../../assets/home_page/stepgoto2.png" alt=""/>
+             </div>
+           </div>
+         </div>
+         <!-- 悬浮连线 -->
+         <div style="position: absolute; z-index: 8;top: 473px;display: flex;">
+           <img :src="lineImg0" alt="" style="width:100px;margin-left: 115px"/>
+           <img :src="lineImg1" alt="" style="width:100px;margin-left: 32px"/>
+           <img :src="lineImg2" alt="" style="width:100px;margin-left: 32px"/>
+           <img :src="lineImg3" alt="" style="width:100px;margin-left: 32px"/>
+           <img :src="lineImg4" alt="" style="width:100px;margin-left: 32px"/>
+           <img :src="lineImg5" alt="" style="width:100px;margin-left: 32px"/>
+           <img :src="lineImg6" alt="" style="width:100px;margin-left: 32px"/>
+           <img :src="lineImg7" alt="" style="width:100px;margin-left: 32px"/>
+           <img :src="lineImg8" alt="" style="width:100px;margin-left: 32px"/>
+         </div>
+       </div>
+
+       <!-- 快捷功能 -->
+       <div class="quick-functions-section">
+         <div class="section-title">
+           <div class="section-title-icon"></div>
+           <div class="section-title-font ">快捷功能</div>
+         </div>
+         <div class="function-item">
+           <div class="function-icons" v-for="(func, idx) in quickFuncs" :key="idx" @click="gotoPath(func.path)">
+             <img class="icon" :src="func.icon " alt=""/><br>
+             <span class="function-icons-name">{{ func.name }}</span>
+           </div>
+         </div>
+       </div>
+     </div>
+     <div style="margin-left: 35px;width: 430px">
+       <!-- 消息提醒 -->
+       <div class="message-section">
+         <div class="section-title">
+           <div class="section-title-icon"></div>
+           <div class="section-title-font ">消息提醒</div>
+         </div>
+         <div class="message-list">
+           <div class="message-item" v-for="(msg, idx) in messages" :key="idx">
+             <p class="message-content" @click="messageGotoPath(msg)">{{ msg.content }}</p>
+             <p class="message-time">{{ msg.senderAgencyName }} &nbsp; &nbsp; &nbsp;{{ msg.createTime }}</p>
+           </div>
+         </div>
+       </div>
+     </div>
+    </div>
+
+  </div>
+</template>
+
+<script setup>
+import { useRouter } from 'vue-router'
+const route = useRouter()
+import {onMounted, onUnmounted, ref} from 'vue';
+import homePage from "@/api/lawenforcement/HomePage.js";
+import messagesApi from "@/api/lawenforcement/Message.js";
+// 动态图片加载示例
+const getImageUrl = (name) => {
+  return new URL(`../../assets/home_page/${name}`, import.meta.url).href
+}
+const lineImg0 = ref(getImageUrl('line.png'))
+const lineImg1 = ref(getImageUrl('line.png'))
+const lineImg2 = ref(getImageUrl('line.png'))
+const lineImg3 = ref(getImageUrl('line.png'))
+const lineImg4 = ref(getImageUrl('line.png'))
+const lineImg5 = ref(getImageUrl('line.png'))
+const lineImg6 = ref(getImageUrl('line.png'))
+const lineImg7 = ref(getImageUrl('line.png'))
+const lineImg8 = ref(getImageUrl('line.png'))
+// 统计数据
+const stats = ref([
+  { image: getImageUrl('执法信息量.png'), title: '执法信息量', value: 0, arrow: '↓', change: 16 ,path:'/xzzfgl/zfxxgl'},
+  { image: getImageUrl('文书数量.png'), title: '文书数量', value: 0, arrow: '↓', change: 16 ,path:'/xzzfgl/zfwsgl'},
+  {  image: getImageUrl('检查数量.png'), title: '检查数量', value: 0, arrow: '↓', change: 16 ,path:{path:'/xzzfgl/zfjc/zfjc',query:'1'}},
+  {  image: getImageUrl('案卷数量.png'), title: '案卷数量', value: 0, arrow: '↓', change: 16 ,path:'/xzzfgl/caseList' },
+  {  image: getImageUrl('企业数量.png'), title: '企业数量', value: 0, arrow: '↓', change: 16 ,path:'/dtsjygl/qyxxcx'},
+]);
+
+// 待办步骤
+const todoSteps = ref([
+  { image1: getImageUrl('定制方案1.png'),image2: getImageUrl('定制方案2.png'), name: '定制方案', count: 0 ,path:'/xzzfgl/zfjc/dzjcfa'},
+  { image1: getImageUrl('方案审批1.png'),image2: getImageUrl('方案审批2.png'), name: '方案审批', count: 0 ,path:'/xzzfgl/zfjc/fasp'},
+  { image1: getImageUrl('现场检查1.png'),image2: getImageUrl('现场检查2.png'), name: '现场检查', count: 0 ,path:'/xzzfgl/zfjc/zfjc'},
+  { image1: getImageUrl('总结1.png'),image2: getImageUrl('总结2.png'), name: '总结', count: 0 ,path:'/xzzfgl/zfjc/zj'},
+  { image1: getImageUrl('立案1.png'),image2: getImageUrl('立案2.png'), name: '立案', count: 0 ,path:'/xzzfgl/xzcf/zfla'},
+  { image1: getImageUrl('调查取证1.png'),image2: getImageUrl('调查取证2.png'), name: '调查取证', count: 0 ,path:'/xzzfgl/xzcf/dcqz'},
+  { image1: getImageUrl('分析研判1.png'),image2: getImageUrl('分析研判2.png'), name: '分析研判', count: 0 ,path:'/xzzfgl/xzcf/fxyp'},
+  { image1: getImageUrl('法制审核1.png'),image2: getImageUrl('法制审核2.png'), name: '法制审核', count: 0 ,path:'/xzzfgl/xzcf/fzsh'},
+  { image1: getImageUrl('集体讨论1.png'),image2: getImageUrl('集体讨论2.png'), name: '集体讨论', count: 0,path:'/xzzfgl/xzcf/jttl' },
+  { image1: getImageUrl('结案1.png'),image2: getImageUrl('结案2.png'), name: '结案', count: 0 ,path:'/xzzfgl/xzcf/zfja' },
+]);
+
+// 快捷功能
+const quickFuncs = ref([
+  { icon: getImageUrl('企业查询.png'), name: '企业查询' ,path:'/dtsjygl/qyxxcx'},
+  { icon: getImageUrl('企业分级分类.png'), name: '企业分级分类' ,path:'/dtsjygl/qyfjfl'},
+  { icon: getImageUrl('执法信息.png'), name: '执法信息' ,path:'/xzzfgl/zfxxgl'},
+  { icon: getImageUrl('督导检查.png'), name: '督导检查' ,path:'/xzzfgl/ddjcjh/ddjc'},
+  { icon: getImageUrl('举报核查.png'), name: '举报核查' ,path:'/xzzfgl/jbhcxx'},
+  // { icon: getImageUrl('扫码入企.png'), name: '扫码入企' ,path:'/xzzfgl/smrq'},
+  { icon: getImageUrl('定制方案1.png'), name: '定制方案' ,path:'/xzzfgl/zfjc/dzjcfa'},
+  { icon: getImageUrl('执法文书.png'), name: '执法文书' ,path:'/xzzfgl/zfwsgl'},
+  { icon: getImageUrl('案卷资料.png'), name: '案卷资料',path:'/xzzfgl/caseList' },
+  { icon: getImageUrl('非现场执法.png'), name: '非现场执法' ,path:'/fxczfgl/index'},
+  { icon: getImageUrl('文书送达.png'), name: '文书送达' ,path:'/zfwssd/zfwsxx'},
+  { icon: getImageUrl('档案信息.png'), name: '档案信息',path:'/dagl/xzjcdagl' },
+]);
+
+// 消息提醒
+const messages = ref([]);
+let timer = null // 时器ID
+onMounted(() => {
+  homePage.getstatCount().then(rs => {
+    if (rs.success&&rs.data) {
+      stats.value[0].value = rs.data.zfxxs
+      stats.value[1].value = rs.data.wss
+      stats.value[2].value = rs.data.jcs
+      stats.value[3].value = rs.data.ajs
+      stats.value[4].value = rs.data.qys
+    }
+  })
+
+  // 待立案数
+  homePage.getdlaCount().then(rs => {
+    if (rs.success&&rs.data) {
+      if(rs.data.dla)
+        todoSteps.value[4].count = rs.data.dla
+      }
+  })
+
+  homePage.countCurrentNodeCode().then(rs => {
+    if (rs.success&&rs.data) {
+      const target = rs.data
+      //方案待审批
+      const dspfa = target.find(node => node.status === 'plan_approval')
+      if(dspfa){
+        todoSteps.value[1].count = dspfa.stat_num
+      }
+      //方案审批通过待检查
+      const djc = target.find(node => node.status === 'plan_approved')
+      if(djc){
+        todoSteps.value[2].count = djc.stat_num
+      }
+      //检查完毕待总结
+      const dzj = target.find(node => node.status === 'inspect_done')
+      if(dzj){
+        todoSteps.value[3].count = dzj.stat_num
+      }
+      //立案完毕待调查取证
+      const dqz = target.find(node => node.status === 'filed')
+      if(dqz){
+        todoSteps.value[5].count = dqz.stat_num
+      }
+      //调查取证完毕待分析研判
+      const dfxyp = target.find(node => node.status === 'investigation_done')
+      if(dfxyp){
+        todoSteps.value[6].count = dfxyp.stat_num
+      }
+      //分析研判通过待法制审核
+      const dfzsh = target.find(node => node.status === 'analyze_judge')
+      if(dfzsh){
+        todoSteps.value[7].count = dfzsh.stat_num
+      }
+      //法制审核通过待集体讨论
+      const djttl = target.find(node => node.status === 'reviewing_done')
+      if(djttl){
+        todoSteps.value[8].count = djttl.stat_num
+      }
+      //集体讨论完待结案
+      const dja = target.find(node => node.status === 'closed')
+      if(dja){
+        todoSteps.value[9].count = dja.stat_num
+      }
+    }
+  })
+  getMsg();
+  timer = setInterval(getMsg, 60*1000)
+})
+onUnmounted(() => {
+  clearInterval(timer)
+})
+const getMsg = () =>{
+  messagesApi.getUserMessages({status:'UNREAD',page:0, size:100}).then(rs => {
+    messages.value = rs.data
+  })
+}
+
+const gotoPath= (path) =>{
+  route.push(path)
+}
+
+const messageGotoPath= (msg) =>{
+  messagesApi.updateMessageStatus(msg.id,{status:'READ'}).then(rs=>{
+    if(rs.success){
+      const idx = messages.value.findIndex((item) => item.id === msg.id)
+      if (idx > -1) messages.value.splice(idx, 1)
+    }
+  })
+
+  route.push(msg.routeUrl)
+
+
+}
+
+const mouseenter = (idx)=> {
+  if(idx===0){
+    lineImg0.value = getImageUrl('gotoright.png')
+  }else if(idx===1){
+    lineImg0.value = getImageUrl('gotoleft.png')
+    lineImg1.value = getImageUrl('gotoright.png')
+  }else if(idx===2){
+    lineImg1.value = getImageUrl('gotoleft.png')
+    lineImg2.value = getImageUrl('gotoright.png')
+  }else if(idx===3){
+    lineImg2.value = getImageUrl('gotoleft.png')
+    lineImg3.value = getImageUrl('gotoright.png')
+  }else if(idx===4){
+    lineImg3.value = getImageUrl('gotoleft.png')
+    lineImg4.value = getImageUrl('gotoright.png')
+  }else if(idx===5){
+    lineImg4.value = getImageUrl('gotoleft.png')
+    lineImg5.value = getImageUrl('gotoright.png')
+  }else if(idx===6){
+    lineImg5.value = getImageUrl('gotoleft.png')
+    lineImg6.value = getImageUrl('gotoright.png')
+  }else if(idx===7){
+    lineImg6.value = getImageUrl('gotoleft.png')
+    lineImg7.value = getImageUrl('gotoright.png')
+  }else if(idx===8){
+    lineImg7.value = getImageUrl('gotoleft.png')
+    lineImg8.value = getImageUrl('gotoright.png')
+  }else if(idx===9){
+    lineImg8.value = getImageUrl('gotoleft.png')
+  }
+
+}
+const mouseleave = ()=> {
+  lineImg0.value = getImageUrl('line.png')
+  lineImg1.value = getImageUrl('line.png')
+  lineImg2.value = getImageUrl('line.png')
+  lineImg3.value = getImageUrl('line.png')
+  lineImg4.value = getImageUrl('line.png')
+  lineImg5.value = getImageUrl('line.png')
+  lineImg6.value = getImageUrl('line.png')
+  lineImg7.value = getImageUrl('line.png')
+  lineImg8.value = getImageUrl('line.png')
+}
+</script>
+
+<style scoped lang="scss">
+.dashboard-container{
+  width: 100%;
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  position: relative;
+}
+
+.statistic-row {
+  width: 1820px;
+  background: rgb(199, 211, 229, 0.4);
+  border-radius: 18px;
+  border: 0.0625rem solid #a9c7da;
+  padding: 15px;
+  margin-bottom: 35px;
+  display: flex;
+
+  .statistic-card {
+    display: flex;
+    background: rgb(255, 255, 255,0.75);
+    border: solid 1pt rgb(255, 255, 255);
+    border-radius: 8px;
+    padding: 15px;
+    margin-right: 15px;
+    width: 350px;
+    .card-icon{
+
+    }
+    .card-content{
+      margin-left: 20px;
+      width: 220px;
+      .card-title {
+        font-family: OPlusSans3-Bold;
+        font-size: 18px;
+        color: #373E52;
+        text-align: right;
+        font-weight: 700;
+      }
+      .card-text{
+         display: flex;
+        float: right;
+        .card-number {
+          font-family: OPlusSans3-Bold;
+          font-size: 40px;
+          color: #373E52;
+          line-height: 52px;
+          font-weight: 700;
+          margin-right: 10px;
+        }
+        .card-compare {
+          font-family: OPPOSans40;
+          font-size: 11px;
+          color: #8890A6;
+          font-weight: 400;
+        }
+        .arrow {
+          width: 16px;
+          height: 16px;
+          background-image: url("../../assets/home_page/上升.png");
+        }
+        .num {
+          font-family: OPlusSans3-Bold;
+          font-size: 12px;
+          color: #E93920;
+          font-weight: 700;
+        }
+        .goto {
+          margin-top: 21px;
+          width: 24px;
+          height: 24px;
+          background-image: url("../../assets/home_page/statisticNumgoto.png");
+          cursor: pointer;
+        }
+      }
+    }
+  }
+}
+
+.todo-section{
+  background: rgb(199, 211, 229, 0.4);
+  border: 0.0625rem solid #a9c7da;
+  border-radius: 16px;
+  padding: 15px;
+  margin-bottom: 35px;
+
+  .todo-steps {
+    display: flex;
+    margin-top: 13px;
+    padding: 15px 0 15px 15px;
+    background: rgb(255, 255, 255,0.75);
+    border: solid 1pt rgb(255, 255, 255);
+    border-radius: 12px;
+    z-index: 0;
+    .step-item {
+      width: 117px;
+      height: 266px;
+      margin-right: 15px;
+      border-radius: 8px;
+      background-image: url("../../assets/home_page/todobg.png");
+      background-size: cover;
+      background-position: center;
+      transition: all 0.4s ease; /* 平滑过渡效果 */
+      position: relative;
+      cursor: pointer;
+
+      .step-item-img{
+        margin-top: 15px;
+        margin-left: 15px;
+        position: relative;
+        z-index: 5;
+
+        .step-item-img-normal-state {
+          display: block;
+        }
+
+        /* 默认隐藏悬停图片 */
+        .step-item-img-hover-state {
+          display: none;
+        }
+
+      }
+      .step-item-name{
+        margin-top: 13px;
+        margin-left: 15px;
+        font-family: OPlusSans3-Bold;
+        font-size: 16px;
+        color: #373E52;
+        font-weight: 700;
+      }
+      .step-item-count {
+        margin-top: 15px;
+        margin-left: 15px;
+        font-family: OPlusSans3-Bold;
+        font-size: 40px;
+        color: #3C86FF;
+        font-weight: 700;
+      }
+      .step-item-count-specail {
+        margin-top: 15px;
+        margin-left: 15px;
+        font-family: OPlusSans3-Bold;
+        font-size: 40px;
+        color: #8e8e8e;
+        font-weight: 700;
+      }
+      .step-item-arrow{
+        position: relative;
+        z-index: 8;
+        margin-left: 68px;
+        margin-top: 33px;
+        width: 32px;
+        height: 32px;
+        .step-item-arrow-normal-state{
+          display: block;
+        }
+        .step-item-arrow-hover-state{
+          display: none;
+        }
+      }
+
+    }
+
+    .step-item:hover::after {
+      content: '';
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 117px;
+      height: 266px;
+      background: rgba(60, 134, 255, 0.3); /* 蓝色阴影，可自定义颜色和透明度 */
+      background-size: cover;
+      border-radius: 8px;
+      transition: all 0.4s ease;
+      z-index: 2;
+    }
+    .step-item:hover .step-item-img-normal-state {
+      display: none;
+    }
+
+    .step-item:hover .step-item-img-hover-state {
+      display: block;
+    }
+    .step-item:hover .step-item-arrow-normal-state{
+      display: none;
+    }
+    .step-item:hover .step-item-arrow-hover-state{
+      display: block;
+    }
+
+  }
+}
+.message-section {
+  background: rgb(199, 211, 229, 0.4);
+  border: 0.0625rem solid #a9c7da;
+  border-radius: 16px;
+  padding: 15px;
+
+
+  .message-list {
+    height: 533px;
+    overflow: scroll;
+    .message-item {
+      background: rgb(255, 255, 255, 0.75);
+      border:solid 1pt white;
+      padding: 10px;
+      border-radius: 8px;
+      margin-top: 10px;
+      .message-content{
+        font-family: OPPOSans40_Medium;
+        font-size: 14px;
+        color: #455273;
+        font-weight: 500;
+        cursor: pointer;
+      }
+      .message-time {
+        font-size: 12px;
+        color: #999;
+        margin-top: 5px;
+      }
+    }
+    .message-item:hover {
+      background: white;
+      .message-content{
+        font-family: OPPOSans40_Medium;
+        font-size: 14px;
+        color:rgb(60, 134, 255);
+        font-weight: 500;
+        cursor: pointer;
+      }
+      .message-time {
+        font-size: 12px;
+        color:rgb(55, 62, 82);
+        margin-top: 5px;
+      }
+    }
+  }
+}
+
+.quick-functions-section{
+  background: rgb(199, 211, 229, 0.4);
+  border: 0.0625rem solid #a9c7da;
+  border-radius: 16px;
+  padding: 15px;
+  .function-item {
+    display: flex;
+    padding: 13px 10px 10px 10px;
+    .function-icons {
+      margin-top: 15px;
+      margin-left: 15px;
+      margin-right: 28px;
+      text-align: center;
+      cursor: pointer;
+      .icon {
+        width: 64px;
+        height: 64px;
+      }
+
+      .function-icons-name {
+        font-family: OPlusSans3-Bold;
+        font-size: 14px;
+        color: white;
+        text-align: center;
+        font-weight: 700;
+      }
+    }
+  }
+}
+
+
+.section-title {
+  display: flex;
+  .section-title-icon {
+    border: 3px solid #3C86FF;
+    border-radius: 3px;
+  }
+  .section-title-font{
+    margin-left: 10px;
+    font-family: OPlusSans3-Bold;
+    font-size: 18px;
+    color: white;
+    line-height: 20px;
+    font-weight: 700;
+  }
+}
+
+
+
+
+
+</style>
\ No newline at end of file
diff --git a/client/src/views/tztggl/NoticeManager.vue b/client/src/views/tztggl/NoticeManager.vue
new file mode 100644
index 0000000..6397ec4
--- /dev/null
+++ b/client/src/views/tztggl/NoticeManager.vue
@@ -0,0 +1,332 @@
+<template>
+  <browser :component-loading="componentLoading"
+           :api-config="apiConfig"
+           :permissions="permissions"
+           :dialog-config="dialogConfig"
+           :table-config="tableConfig"
+           :actions="actions"
+           @update:actions="actions = $event"
+           @update:dialog-config="dialogConfig = $event">
+    <template #queryPanel="{ queryParams: qp }" v-if="!portal">
+      <el-form ref="queryForm" :model="qp" label-width="80px">
+        <el-row class="query-condition">
+          <el-col :span="6">
+            <el-form-item label="发布单位">
+              <AgencySelector v-model="qp.agency" :lazy-load="true" :multiple="false" placeholder="请选择"/>
+            </el-form-item>
+          </el-col>
+          <el-col :span="6"><el-form-item label="标题"><el-input v-model="qp.notificationTitle" clearable/></el-form-item></el-col>
+          <el-col :span="6"><el-form-item label="发布人"><el-input v-model="qp.publisher" clearable/></el-form-item></el-col>
+        </el-row>
+      </el-form>
+    </template>
+    <el-table-column header-align="center" align="center" prop="releaseTime" label="发布时间" min-width="200"/>
+    <el-table-column header-align="center" align="center" prop="publishingUnit" label="发布单位" min-width="200" show-overflow-tooltip/>
+    <el-table-column header-align="center" align="center" prop="noticeTitle" label="标题" min-width="200"/>
+    <el-table-column header-align="center" align="center" prop="publisher" label="发布人" min-width="200"/>
+    <template #tableControlColumn="{ data: r }" v-if="!portal">
+        <el-link v-if="r.data.row.publishingUnitCode === userStore.userInfo.gajgjgdm" type="primary" @click="handleModify(r.data.row)" title="修改">修改</el-link>
+    </template>
+    <template #dialogContent="{ dialogConfig: dc }">
+      <el-row>
+        <el-col :span="6">
+          <el-form-item label="发布单位" prop="agency">
+            <AgencySelector v-model="dc.data.agency" :lazy-load="true" :multiple="false" disabled="true" placeholder="请选择"/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="发布单位" prop="agency">
+            <AgencySelector v-model="dc.data.agency" :lazy-load="true" :multiple="false" :disabled="true" placeholder="请选择"/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="发布人" prop="publisher">
+            <el-input v-model="dc.data.publisher" :disabled="true"/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="发布时间" prop="releaseTime">
+            <el-date-picker v-model="dc.data.releaseTime"
+                            type="datetime"
+                            placeholder="选择发布时间"
+                            format="YYYY-MM-DD HH:mm:ss"
+                            value-format="YYYY-MM-DD  HH:mm:ss"
+                            :disabled="true"
+                            style="width: 100%;"/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="接收单位" prop="peoplePolices">
+<!--            <OfficerSelector v-model="dc.data.peoplePolices"/>-->
+<!--            <tree-selector v-model="dc.data.peoplePolices"></tree-selector>-->
+            <AgencySelector v-model="dc.data.peoplePolices" :multiple="true" :lazy-load="true" v-if="dc.mode !== 'detail'"/>
+            <el-input v-model="dc.data.jsdws" :disabled="true" type="textarea" rows="3" v-else/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="发布标题" prop="noticeTitle">
+            <el-input v-model="dc.data.noticeTitle" :disabled="dc.mode === 'detail'"/>
+          </el-form-item>
+        </el-col>
+<!--        <el-col :span="24">-->
+<!--          <el-form-item label="通知公告内容" prop="publishContent">-->
+<!--            <el-input type="textarea" :rows="6" v-model="dc.data.publishContent"/>-->
+<!--          </el-form-item>-->
+<!--        </el-col>-->
+        <el-col :span="24">
+          <el-form-item label="通知公告内容" prop="publishContent">
+            <div style="width: 100%; height: 300px" v-if="dc.mode !== 'detail'">
+              <QuillEditor
+                  v-model:content="dc.data.publishContent"
+                  contentType="html"
+                  :init="editorConfig"
+                  :toolbar="toolbarOptions"
+                  @ready="handleEditorReady"
+              />
+            </div>
+            <div v-html="dc.data.publishContent" v-else></div>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24" style="height: 70px"></el-col>
+       </el-row>
+    </template>
+  </browser>
+</template>
+<script setup>
+import {reactive, toRefs, ref, watch, defineProps, onMounted} from 'vue'
+import Browser from '@/components/Browser.vue'
+import {useUserStore} from '@/stores/modules/user'
+import {ElButton, ElMessage} from "element-plus"
+import AgencySelector from "@/components/AgencySelector.vue"
+import {DEFAULT_ENTERPRISE_DETAIL, DICTDISPLAYS, DICTITEMS} from "@/utils/Constants.js"
+import notice from '@/api/lawenforcement/Notice.js';
+import dayjs from 'dayjs'
+import OfficerSelector from "@/components/OfficerSelector.vue";
+import { QuillEditor } from '@vueup/vue-quill';
+import '@vueup/vue-quill/dist/vue-quill.snow.css';
+
+const props = defineProps({portal: {type: Boolean, default: () => false}})
+
+const userStore = useUserStore()
+
+const option = [{ label: '发布', value: '1' }, { label: '接收', value: '0' }]
+const state = reactive({
+  componentLoading: false,
+  permissions: {
+    query: !props.portal,
+    add: !props.portal,
+    modify: false,
+    detail: true,
+    delete: !props.portal,
+    deleteAll: false,
+    importFile: false,
+    exportFile: false,
+    exportSelectFile: false,
+    downloadTemp: false,
+  },
+  apiConfig: {
+    api: notice,
+    modelId: 'noticeId',
+  },
+  tableConfig: {
+    hasControlColumn: true,
+    controlWidth: '180',
+    multipleSelect: !props.portal
+  },
+  dialogConfig: {
+    show: false,
+    mode: 'detail',
+    formLabelWidth: '110px',
+    height: '500px',
+    loading: false,
+    baseTitle: '通知公告管理',
+    rules: {
+      agency: [{ required: true, message: '发布单位不能为空', trigger: 'blur' }],
+      publisher: [{ required: true, message: '发布人不能为空', trigger: 'blur' }],
+      releaseTime: [{ required: true, message: '发布时间不能为空', trigger: 'blur' }],
+      peoplePolices: [{ required: true, message: '接收单位不能为空', trigger: 'change' }],
+      noticeTitle: [{ required: true, message: '发布标题不能为空', trigger: 'blur' }],
+      publishContent: [{ required: true, message: '通知公告内容不能为空', trigger: 'blur' }]
+    },
+    data: {},
+    actions: {
+      handleDialogOk: handleDialogOk
+    }
+  },
+  actions: {
+    add: handleAdd,
+    modify: handleModify,
+    detail: handleDetail,
+    handleSelectionChange
+  },
+  simpleConfigCase: {confName: 'case'},
+  simpleConfigZfws: {confName: 'document'},
+  simpleConfigSdfs: {confName: 'recipient'},
+  simpleConfigSsr: {confName: 'method'},
+  deliverys: [],
+  officers: []
+})
+
+const {
+  componentLoading,
+  permissions,
+  tableConfig,
+  apiConfig,
+  dialogConfig,
+  actions,
+  simpleConfigCase,
+  simpleConfigZfws,
+  simpleConfigSdfs,
+  simpleConfigSsr,
+  deliverys,
+  officers,
+  queryParams
+} = toRefs(state)
+
+const methodName = ref('')
+// 富文本编辑器
+const content = ref('<p>初始内容</p>');
+const toolbarOptions = [
+  ['bold', 'italic', 'underline', 'strike'],        // 加粗、斜体、下划线、删除线
+  ['blockquote', 'code-block'],                     // 引用、代码块
+
+  [{ 'header': 1 }, { 'header': 2 }],               // 标题1、标题2
+  [{ 'list': 'ordered'}, { 'list': 'bullet' }],     // 有序列表、无序列表
+  [{ 'script': 'sub'}, { 'script': 'super' }],      // 下标、上标
+  [{ 'indent': '-1'}, { 'indent': '+1' }],          // 缩进减少、缩进增加
+  [{ 'direction': 'rtl' }],                         // 文本方向（从右到左）
+
+  [{ 'size': ['small', false, 'large', 'huge'] }],  // 字体大小
+  [{ 'header': [1, 2, 3, 4, 5, 6, false] }],        // 标题级别
+
+  [{ 'color': [] }, { 'background': [] }],          // 字体颜色、背景颜色
+  [{ 'font': [] }],                                 // 字体
+  [{ 'align': [] }],                                // 对齐方式
+
+  ['clean']                                        // 清除格式
+  // ['link', 'image', 'video']                        // 链接、图片、视频
+];
+const editorConfig = {
+  height: '500px',
+};
+
+const handleEditorReady = (editor) => {
+};
+function handleAdd() {
+  dialogConfig.value.show = true
+  methodName.value = null
+  dialogConfig.value.mode = 'add'
+  dialogConfig.value.title = '通知公告管理新增'
+  dialogConfig.value.data = Object.assign({}, {})
+  const now = dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss')
+  dialogConfig.value.data = {
+    releaseTime: now,
+    publisherUserId: userStore.userInfo.yhwybs,
+    publisher: userStore.userInfo.xm,
+    peoplePolices: [],
+    agency: {
+      agencyCode: userStore.userInfo.gajgjgdm,
+      agencyName: userStore.userInfo.gajgmc,
+      agencyLevel: userStore.userInfo.gajgmclbdm
+    }
+  }
+}
+
+function handleModify(row) {
+  dialogConfig.value.show = true
+  methodName.value = null
+  dialogConfig.value.mode = 'modify'
+  dialogConfig.value.title = '通知公告管理修改'
+  dialogConfig.value.data.documentIds = []
+  findOne(row)
+}
+
+function handleDetail(row) {
+  dialogConfig.value.show = true
+  methodName.value = null
+  dialogConfig.value.mode = 'detail'
+  dialogConfig.value.title = '通知公告管理详情'
+  dialogConfig.value.showFooter = false
+  findOne(row)
+}
+
+function findOne(row) {
+  dialogConfig.value.loading = true
+  console.log(dialogConfig.value, '----')
+  apiConfig.value.api.findOne(row[apiConfig.value.modelId]).then(res => {
+    if (res.success) {
+      dialogConfig.value.loading = false
+      let data = res.data
+      methodName.value = data.deliveryMethod?.methodName
+      data.logistics = data.logistics? data.logistics:{}
+      data.documentIds = data.documentIds?.split(',') || []
+      if (data.materials) data.materials.forEach(item => item.uid = item.materialsId)
+      data.jsdws = data.peoplePolices?.map(item => item.agencyName).join(', ')
+      dialogConfig.value.data = Object.assign({}, data, {picList: data.materials})
+    } else {
+      dialogConfig.value.loading = false
+      throw new Error('查询失败')
+    }
+  }).catch(() => {
+    dialogConfig.value.loading = false
+  })
+}
+
+function handleDialogOk(formRef) {
+  let _event = actions.value
+  formRef.validate(valid => {
+    if (valid) {
+      dialogConfig.value.loading = true
+      let data = Object.assign({}, dialogConfig.value.data)
+      if (data.agency === null || data.agency === '') {
+        ElMessage.error('属地不能为空！')
+      }
+      if (dialogConfig.value.mode === 'add') {
+        data.selectAll = false
+        console.log('参数=', data)
+        apiConfig.value.api.add(data).then(res => {
+          dialogConfig.value.show = false
+          if (res.success) {
+            ElMessage.success('操作成功')
+            _event.query()
+          } else {
+            throw new Error('操作失败')
+          }
+          dialogConfig.value.loading = false
+        }).catch(() => {
+          dialogConfig.value.loading = false
+        })
+      } else if (dialogConfig.value.mode === 'modify') {
+        apiConfig.value.api.modify(dialogConfig.value.data[apiConfig.value.modelId], data).then(res => {
+          dialogConfig.value.show = false
+          if (res.success) {
+            ElMessage.success('操作成功')
+            _event.query()
+          } else {
+            throw new Error('操作失败')
+          }
+          dialogConfig.value.loading = false
+        }).catch(() => {
+          dialogConfig.value.loading = false
+        })
+      }
+    }
+  })
+}
+
+function handleSelectionChange(selectedData) {
+  deliverys.value = [...selectedData]
+}
+
+
+// 阅读
+function read (row) {
+  this.readDialogMode = 'read'
+  this.readDialogShow = true
+  this.readFormData = row
+}
+
+</script>
+<style lang="scss" scoped>
+
+</style>