fix

bigScreen3/src/utils/request.js

@@ -58,7 +58,7 @@ const service = axios.create({
     }
     if (
       !isRepeatSubmit &&
-      (config.method === 'post' || config.method === 'put')
+      ( config.method === 'put')
     ) {
       const requestObj = {
         url: config.url,
@@ -86,7 +86,6 @@ const service = axios.create({
           s_url === requestObj.url
         ) {
           const message = '数据正在处理，请勿重复提交'
-          console.warn(`[${s_url}]: ` + message)
           return Promise.reject(new Error(message))
         } else {
           cache.session.setJSON('sessionObj', requestObj)
@@ -96,7 +95,6 @@ const service = axios.create({
     return config
   },
   (error) => {
-    console.log(error)
     Promise.reject(error)
   }
 )
@@ -105,7 +103,6 @@ const service = axios.create({
 service.interceptors.response.use(
   (res) => {
     // 未设置状态码则默认成功状态
-    console.log('res', res)
     const code = res.data.status || 200
     // 获取错误信息
     const msg = errorCode[code] || res.data.message || errorCode['default']
@@ -144,7 +141,6 @@ service.interceptors.response.use(
         res.data.state.toLowerCase() === 50012 ||
         res.data.state.toLowerCase() === "notoken"
       ) {
-        console.log(router.currentRoute)
         if (router.currentRoute.value.path === "/chat/index") {
           router.push({ path: '/chat/login' })
           return
@@ -173,7 +169,6 @@ service.interceptors.response.use(
     }
   },
   (error) => {
-    console.log('err')
     let { message } = error
     if (message == 'Network Error') {
       message = '服务异常，请稍后重试'
@@ -193,7 +188,6 @@ export function download(url, params, filename, config) {
     text: '正在下载数据，请稍候',
     background: 'rgba(0, 0, 0, 0.7)'
   })
-  console.log(params)
   return service
     .post(url, params, {
       transformRequest: [

bigScreen3/src/views/dashboard/cpns/DataInsights.vue

@@ -1,14 +1,20 @@
 <template>
-  <div class="data-insights">
+  <div class="data-insights" @click="handleClick">
     <div ref="chartRef" class="echart" style="margin-top: 2vh;"></div>
   </div>
-  
+  <DataInsightsDetail
+      :visible="dataInsightsDetailVisible"
+      :options="{fWorkordertypeid: 4}"
+      :dataInsightsDetail="dataInsightsDetail"
+      @close="dataInsightsDetailVisible = false"  
+    />
 </template>
 
 <script setup>
 import { ref, onMounted, onBeforeUnmount ,watch} from 'vue'
 import * as echarts from 'echarts'
 import { getPageListData } from '@/api/index.js'
+import DataInsightsDetail from '@/views/dashboard/cpns/DataInsightsDetail.vue'
 
 // 定义 props
 const props = defineProps({
@@ -21,15 +27,23 @@ watch(() => props.selectedProjectId, () => {
   fetchDataInsights()
 })
 // 响应式数据
+const dataInsightsDetailVisible = ref(false)
+const handleClick = () => {
+  console.log('点击了数据洞察')
+  dataInsightsDetailVisible.value = true  
+}
 const categories = ref(['区域A', '区域B', '区域C', '区域D', '区域E', '区域F'])
 const smartValues = ref([520, 740, 520, 802, 520, 540])
 const traditionalValues = ref([300, 400, 260, 192, 300, 300])
 const maxYAxisValue = ref(0)
+const dataInsightsDetail = ref([])
+
 // 获取数据
 const fetchDataInsights = async () => {
   try {
     const response = await getPageListData(`/zhjc-irrigation-base/dataInsights/${props.selectedProjectId}`)
     if (response.status === 200 && response.data) {
+      dataInsightsDetail.value = response.data
       const data = response.data.Consumption || []
       console.log('数据洞察', data)
       // 根据接口返回的数据结构进行赋值

bigScreen3/src/views/dashboard/cpns/DataInsightsDetail.vue

@@ -0,0 +1,363 @@
+<template>
+  <div v-if="visible" class="early-warning-modal" @click.self="handleClose">
+    <div class="early-warning-content">
+      <div class="early-warning-header">
+        <h2>数据洞察</h2>
+        <button class="early-warning-close" @click="handleClose">×</button>
+      </div>
+      <div class="early-warning-body">
+        <!-- 详情统计表格 -->
+        <div class="warning-detail-section">
+          <div class="section-title">• 养护效率</div>
+          <div class="warning-detail-table">
+            <table class="data-table">
+              <thead>
+                <tr>
+                  <th>区域</th>
+                  <th>智能养护面积</th>
+                  <th>人工养护面积</th>
+                  <th>存活率</th>
+                  <th>设施完好率</th>
+                  <th>投诉率</th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr v-for="(item, index) in dataInsightsDetail.effect || []" :key="index">
+                  <td>{{ item.sectionName || '-' }}</td>
+                  <td>{{ item.smartScope || '0' }}</td>
+                  <td>{{ item.manualScope || '0' }}</td>
+                  <td>{{ item.surviv || '0.00%' }}</td>
+                  <td>{{ item.intact || '0.00%' }}</td>
+                  <td>{{ item.complaint || '0.00%' }}</td>
+                </tr>
+                <tr v-if="!dataInsightsDetail.effect || dataInsightsDetail.effect.length === 0">
+                  <td colspan="6" class="no-data">暂无数据</td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </div>
+        
+        <!-- 预警来源数据表格 -->
+        <div class="warning-source-section">
+          <div class="section-title">• 资源消耗</div>
+          <div class="warning-source-table">
+            <table class="data-table">
+              <thead>
+                <tr>
+                  <th>养护区域</th>
+                  <th>智慧调控</th>
+                  <th>传统模式</th>
+                  <th>节水百分比</th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr v-for="(item, index) in dataInsightsDetail.Consumption || []" :key="index">
+                  <td>{{ item.regionName || '-' }}</td>
+                  <td>{{ item.smartWater || '0' }}</td>
+                  <td>{{ item.manualWater || '0' }}</td>
+                  <td>{{ item.conservationRate || '0.00%' }}</td>
+                </tr>
+                <tr v-if="!dataInsightsDetail.Consumption || dataInsightsDetail.Consumption.length === 0">
+                  <td colspan="4" class="no-data">暂无数据</td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+
+// 定义 props
+const props = defineProps({
+  visible: {
+    type: Boolean,
+    default: false
+  },
+  options: {
+    type: Object,
+    default: {}
+  },
+  dataInsightsDetail: {
+    type: Object,
+    default: () => ({
+      effect: [],
+      Consumption: []
+    })
+  }
+})
+
+// 定义事件
+const emit = defineEmits(['update:visible', 'close'])
+
+// 关闭弹框
+function handleClose() {
+  emit('update:visible', false)
+  emit('close')
+}
+</script>
+
+<style scoped>
+/* 数据洞察详情弹窗样式 */
+.early-warning-modal {
+  position: fixed;
+  z-index: 9999;
+  inset: 0;
+  background: rgba(0, 10, 30, 0.8);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  animation: fadeIn 0.3s ease;
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+.early-warning-content {
+  position: relative;
+  width: min(90vw, 1400px);
+  max-height: 90vh;
+  background: linear-gradient(135deg, #001a33 0%, #003366 100%);
+  border: 2px solid #0099ff;
+  border-radius: 8px;
+  overflow: hidden;
+  box-shadow: 0 0 30px rgba(0, 153, 255, 0.3);
+  backdrop-filter: blur(10px);
+  animation: slideIn 0.3s ease;
+}
+
+@keyframes slideIn {
+  from {
+    transform: translateY(-20px);
+    opacity: 0;
+  }
+  to {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+
+.early-warning-header {
+  position: relative;
+  padding: 12px 20px;
+  background: transparent;
+  border: none;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.early-warning-header h2 {
+  color: #ffffff;
+  font-size: 18px;
+  font-weight: 600;
+  margin: 0;
+  padding: 4px 45px;
+  background: linear-gradient(90deg, rgba(0, 153, 255, 0.05) 0%, rgba(0, 153, 255, 0.9) 50%, rgba(0, 153, 255, 0.05) 100%);
+  text-shadow: 0 0 8px rgba(0, 153, 255, 0.6);
+  border-radius: 4px;
+  display: inline-block;
+}
+
+.early-warning-close {
+  position: absolute;
+  right: 20px;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 30px;
+  height: 30px;
+  border: none;
+  background: transparent;
+  color: #ffffff;
+  font-size: 20px;
+  line-height: 30px;
+  text-align: center;
+  border-radius: 4px;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  padding: 0;
+}
+
+.early-warning-close:hover {
+  background: rgba(0, 40, 80, 0.8);
+  box-shadow: 0 0 10px rgba(0, 153, 255, 0.6);
+}
+
+.early-warning-body {
+  padding: 20px;
+  overflow-y: auto;
+  max-height: calc(90vh - 120px);
+}
+
+/* 区域标题样式 */
+.section-title {
+  color: #66CCFF;
+  font-size: 16px;
+  font-weight: 600;
+  margin-bottom: 15px;
+  text-shadow: 0 0 4px rgba(102, 204, 255, 0.6);
+  text-align: left;
+}
+
+/* 预警详情区域 */
+.warning-detail-section {
+  margin-bottom: 30px;
+}
+
+/* 预警来源区域 */
+.warning-source-section {
+  margin-bottom: 20px;
+}
+
+/* 表格容器样式 */
+.warning-detail-table {
+  width: 100%;
+  overflow-x: auto;
+  overflow-y: auto;
+  max-height: 300px; /* 增加高度以显示更多数据 */
+  background: rgba(0, 10, 30, 0.5);
+  border: 1px solid rgba(0, 153, 255, 0.3);
+  border-radius: 6px;
+  box-shadow: 0 0 20px rgba(0, 153, 255, 0.1);
+  transition: all 0.3s ease;
+}
+
+.warning-source-table {
+  width: 100%;
+  overflow-x: auto;
+  overflow-y: auto;
+  max-height: 300px; /* 增加高度以显示更多数据 */
+  background: rgba(0, 10, 30, 0.5);
+  border: 1px solid rgba(0, 153, 255, 0.3);
+  border-radius: 6px;
+  box-shadow: 0 0 20px rgba(0, 153, 255, 0.1);
+  transition: all 0.3s ease;
+}
+
+/* 美化滚动条 */
+.warning-detail-table::-webkit-scrollbar,
+.warning-source-table::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+
+.warning-detail-table::-webkit-scrollbar-track,
+.warning-source-table::-webkit-scrollbar-track {
+  background: rgba(0, 10, 30, 0.3);
+  border-radius: 4px;
+}
+
+.warning-detail-table::-webkit-scrollbar-thumb,
+.warning-source-table::-webkit-scrollbar-thumb {
+  background: rgba(0, 153, 255, 0.5);
+  border-radius: 4px;
+  transition: background 0.3s ease;
+}
+
+.warning-detail-table::-webkit-scrollbar-thumb:hover,
+.warning-source-table::-webkit-scrollbar-thumb:hover {
+  background: rgba(0, 153, 255, 0.8);
+}
+
+/* 数据表格样式 */
+.data-table {
+  width: 100%;
+  border-collapse: collapse;
+  color: #ffffff;
+}
+
+.data-table thead {
+  background-color: #00164B;
+  position: sticky;
+  top: 0;
+  z-index: 10;
+}
+
+.data-table th {
+  padding: 10px 15px;
+  text-align: center;
+  font-weight: 600;
+  font-size: 14px;
+  color: #66CCFF;
+  border-bottom: 1px solid rgba(0, 153, 255, 0.3);
+  text-shadow: 0 0 4px rgba(102, 204, 255, 0.6);
+  height: 40px;
+}
+
+.data-table td {
+  padding: 10px 15px;
+  font-size: 13px;
+  color: #ffffff;
+  text-align: center;
+  border-bottom: 1px solid rgba(0, 68, 136, 0.3);
+  transition: all 0.2s ease;
+  height: 40px;
+}
+
+.data-table tbody tr:nth-child(odd) {
+  background-color: #0D2958;
+}
+
+.data-table tbody tr:nth-child(even) {
+  background-color: #0B3466;
+}
+
+.data-table tbody tr {
+  transition: all 0.3s ease;
+  height: 40px; /* 固定数据行高度 */
+}
+
+.data-table tbody tr:hover {
+  background-color: rgba(0, 153, 255, 0.2);
+  box-shadow: 0 0 10px rgba(0, 153, 255, 0.2);
+}
+
+.data-table tbody tr:last-child td {
+  border-bottom: none;
+}
+
+/* 无数据显示样式 */
+.no-data {
+  color: #666;
+  text-align: center;
+  padding: 30px;
+  font-style: italic;
+  background-color: rgba(0, 10, 30, 0.3);
+}
+
+/* 响应式调整 */
+@media (max-width: 768px) {
+  .early-warning-content {
+    width: 95vw;
+    max-height: 95vh;
+  }
+  
+  .data-table th,
+  .data-table td {
+    padding: 8px 10px;
+    font-size: 12px;
+    height: 36px;
+  }
+  
+  .warning-detail-table,
+  .warning-source-table {
+    border-radius: 4px;
+  }
+  
+  .section-title {
+    font-size: 14px;
+    margin-bottom: 10px;
+  }
+}
+</style>

bigScreen3/src/views/dashboard/cpns/EarlyWarning.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="early-warning">
+  <div class="early-warning" @click="handleClick">
     <div class="warning-summary"  style="margin-top: 1.5vh;">
       <div class="summary-item" v-for="(item, idx) in summaryList" :key="idx">
         <span class="summary-label">{{ item.name }}</span>
@@ -15,7 +15,7 @@
       <table>
         <thead>
           <tr>
-            <th>预警类型</th>
+            <th style="width: 110px;">预警类型</th>
             <th>位置</th>
             <th>等级</th>
             <th>触发时间</th>
@@ -24,7 +24,7 @@
         <tbody>
           <tr v-for="(item, index) in warningList" :key="index">
             <td>{{ item.type }}</td>
-            <td class="ellipsis"><span class="cell-text" :title="item.location">{{ item.location }}</span></td>
+            <td class="ellipsis" style="text-align: left;"><span class="cell-text" :title="item.location">{{ item.location }}</span></td>
             <td>
               <span :class="['level-badge', `level-${item.level}`]">
                 {{ item.levelText }}
@@ -36,11 +36,18 @@
       </table>
     </div>
   </div>
+  <EarlyWarningDetail
+      :visible="earlyWarningDetailVisible"
+      :options="{fWorkordertypeid: 4}"
+      :warningDetail="warningDetail"
+      @close="earlyWarningDetailVisible = false"  
+    />
 </template>
 
 <script setup>
 import { ref, onMounted, watch } from 'vue'
 import { getPageListData } from '@/api/index'
+import EarlyWarningDetail from '@/views/dashboard/cpns/EarlyWarningDetail.vue'
 
 // 定义 props
 const props = defineProps({
@@ -52,6 +59,15 @@ const props = defineProps({
 watch(() => props.selectedProjectId, () => {
   fetchWarningData()
 })
+
+// 定义响应式数据
+const earlyWarningDetailVisible = ref(false)
+const warningDetail = ref({})
+
+const handleClick = () => {
+  console.log('点击了预警')
+  earlyWarningDetailVisible.value = true  
+}
 // 顶部汇总数据（响应式）
 const summaryList = ref([])
 
@@ -63,6 +79,7 @@ const fetchWarningData = async () => {
   try {
     const response = await getPageListData(`/woworkorderbase/warning/${props.selectedProjectId}`, {})
     if (response && response.status === 200) {
+      warningDetail.value = response.data
       // 处理汇总数据
       if (response.data.type && Array.isArray(response.data.type)) {
         // 确保数据长度足够（重复显示如果不够）
@@ -80,20 +97,23 @@ const fetchWarningData = async () => {
       if (response.data.workOrderList && Array.isArray(response.data.workOrderList) && response.data.workOrderList.length > 0) {
         warningList.value = response.data.workOrderList.map(item => {
           // 处理预警等级映射
-          let level = 'medium'
-          let levelText = '中'
+          let level = item.fRiskLevel // 3:高, 2:中, 1:低 
+          let levelText = ''
           
-          if (item.level === 'high' || item.levelText === '高' || item.level === '1') {
+          if (level === 3) {
             level = 'high'
             levelText = '高'
-          } else if (item.level === 'low' || item.levelText === '低' || item.level === '3') {
+          } else if (level === 2) {
+            level = 'medium'
+            levelText = '中'
+          } else if (level === 1) {
             level = 'low'
             levelText = '低'
           }
           
           return {
-            type: item.type || item.warningType || '未知预警',
-            location: item.location || item.address || '未知位置',
+            type: item.fCategoryname1 || '未知预警',
+            location: item.fAddress || '未知位置',
             level: level,
             levelText: levelText,
             time: item.time || item.createTime || formatDate(new Date())

bigScreen3/src/views/dashboard/cpns/EarlyWarningDetail.vue

@@ -20,11 +20,11 @@
                 </tr>
               </thead>
               <tbody>
-                <tr v-for="(item, index) in warningDetailData" :key="index">
-                  <td>{{ item.type }}</td>
-                  <td>{{ item.total }}</td>
-                  <td>{{ item.completed }}</td>
-                  <td>{{ item.completionRate }}</td>
+                <tr v-for="(item, index) in warningDetail.type" :key="index">
+                  <td>{{ item.name }}</td>
+                  <td>{{ item.number }}</td>
+                  <td>{{ item.endNumber }}</td>
+                  <td>{{ item.endNumber / item.number * 100 + '%' }}</td>
                 </tr>
               </tbody>
             </table>
@@ -48,14 +48,14 @@
                 </tr>
               </thead>
               <tbody>
-                <tr v-for="(item, index) in warningSourceData" :key="index">
-                  <td>{{ item.discoveryMethod }}</td>
-                  <td>{{ item.eventType }}</td>
+                <tr v-for="(item, index) in warningDetail.workOrderList" :key="index">
+                  <td>{{ item.fWorkordertype }}</td>
+                  <td>{{ item.riskclassifyname }}</td>
                   <td>{{ item.pushTime }}</td>
-                  <td>{{ item.pushDepartment }}</td>
-                  <td>{{ item.receiveTime }}</td>
-                  <td>{{ item.receiveDepartment }}</td>
-                  <td class="status-completed">{{ item.status }}</td>
+                  <td>{{ item.checkdept }}</td>
+                  <td>{{ item.checkdept }}</td>
+                  <td>{{ item.distributedept }}</td>
+                  <td :class="getStatusClass(item.status)">{{ item.fState }}</td>
                 </tr>
               </tbody>
             </table>
@@ -67,7 +67,7 @@
 </template>
 
 <script setup>
-import { ref, onMounted } from 'vue'
+import { ref, computed } from 'vue'
 
 // 定义 props
 const props = defineProps({
@@ -78,211 +78,41 @@ const props = defineProps({
   options: {
     type: Object,
     default: {}
+  },
+  warningDetail: {
+    type: Object,
+    default: () => ({
+      type: [],
+      workOrderList: []
+    })
   }
 })
 
 // 定义事件
 const emit = defineEmits(['update:visible', 'close'])
 
-// 预警详情数据
-const warningDetailData = ref([
-  {
-    type: '大数据分析',
-    total: '19892',
-    completed: '988',
-    completionRate: '18.08%'
-  },
-  {
-    type: '抓取感知',
-    total: '19827',
-    completed: '728',
-    completionRate: '18.08%'
-  },
-  {
-    type: '类型A',
-    total: '19892',
-    completed: '988',
-    completionRate: '18.08%'
-  },
-  {
-    type: '类型B',
-    total: '19827',
-    completed: '728',
-    completionRate: '18.08%'
-  },
-  {
-    type: '类型C',
-    total: '15678',
-    completed: '654',
-    completionRate: '22.35%'
-  },
-  {
-    type: '类型D',
-    total: '18923',
-    completed: '876',
-    completionRate: '19.76%'
-  },
-  {
-    type: '类型E',
-    total: '14567',
-    completed: '543',
-    completionRate: '21.45%'
-  },
-  {
-    type: '类型F',
-    total: '16789',
-    completed: '765',
-    completionRate: '17.89%'
-  },
-  {
-    type: '类型G',
-    total: '13456',
-    completed: '432',
-    completionRate: '23.12%'
-  },
-  {
-    type: '类型H',
-    total: '17890',
-    completed: '890',
-    completionRate: '16.54%'
-  },
-  {
-    type: '类型I',
-    total: '12345',
-    completed: '321',
-    completionRate: '24.56%'
-  },
-  {
-    type: '类型J',
-    total: '18901',
-    completed: '901',
-    completionRate: '15.23%'
-  }
-])
-
-// 预警来源数据
-const warningSourceData = ref([
-  {
-    discoveryMethod: '抓取感知',
-    eventType: '毁坏绿萍',
-    pushTime: '2025-09-22 04:24:40',
-    pushDepartment: '园林中心',
-    receiveTime: '2025-09-22 04:24:40',
-    receiveDepartment: '龙源湖公园',
-    status: '完结'
-  },
-  {
-    discoveryMethod: '大数据发现',
-    eventType: '公园密度过大',
-    pushTime: '2025-09-22 04:24:40',
-    pushDepartment: '园林中心',
-    receiveTime: '2025-09-22 04:24:40',
-    receiveDepartment: '龙源湖公园',
-    status: '完结'
-  },
-  {
-    discoveryMethod: '视频监控',
-    eventType: '游客越界',
-    pushTime: '2025-09-22 05:30:15',
-    pushDepartment: '安全监控中心',
-    receiveTime: '2025-09-22 05:31:00',
-    receiveDepartment: '东区管理处',
-    status: '处理中'
-  },
-  {
-    discoveryMethod: '市民举报',
-    eventType: '垃圾堆积',
-    pushTime: '2025-09-22 06:15:22',
-    pushDepartment: '投诉处理中心',
-    receiveTime: '2025-09-22 06:16:30',
-    receiveDepartment: '环卫部门',
-    status: '待处理'
-  },
-  {
-    discoveryMethod: '传感器检测',
-    eventType: '水质异常',
-    pushTime: '2025-09-22 07:45:10',
-    pushDepartment: '环境监测站',
-    receiveTime: '2025-09-22 07:46:25',
-    receiveDepartment: '湖务管理处',
-    status: '紧急处理'
-  },
-  {
-    discoveryMethod: 'AI识别',
-    eventType: '可疑行为',
-    pushTime: '2025-09-22 08:30:45',
-    pushDepartment: '智能管理中心',
-    receiveTime: '2025-09-22 08:31:10',
-    receiveDepartment: '安保部门',
-    status: '处理中'
-  },
-  {
-    discoveryMethod: '巡检发现',
-    eventType: '设施损坏',
-    pushTime: '2025-09-22 09:15:30',
-    pushDepartment: '设施维护科',
-    receiveTime: '2025-09-22 09:16:45',
-    receiveDepartment: '维修班组',
-    status: '待修复'
-  },
-  {
-    discoveryMethod: '大数据分析',
-    eventType: '人流异常',
-    pushTime: '2025-09-22 10:45:20',
-    pushDepartment: '数据分析中心',
-    receiveTime: '2025-09-22 10:46:15',
-    receiveDepartment: '游客服务中心',
-    status: '已疏导'
-  },
-  {
-    discoveryMethod: '气象预警',
-    eventType: '暴雨预警',
-    pushTime: '2025-09-22 11:30:10',
-    pushDepartment: '气象服务中心',
-    receiveTime: '2025-09-22 11:31:05',
-    receiveDepartment: '应急管理处',
-    status: '预警中'
-  },
-  {
-    discoveryMethod: '设备告警',
-    eventType: '电力故障',
-    pushTime: '2025-09-22 12:45:35',
-    pushDepartment: '设备管理科',
-    receiveTime: '2025-09-22 12:46:20',
-    receiveDepartment: '电力维修组',
-    status: '紧急处理'
-  },
-  {
-    discoveryMethod: '无人机巡查',
-    eventType: '植被异常',
-    pushTime: '2025-09-22 13:30:25',
-    pushDepartment: '园林技术科',
-    receiveTime: '2025-09-22 13:31:10',
-    receiveDepartment: '绿化班组',
-    status: '待处理'
-  },
-  {
-    discoveryMethod: '舆情监控',
-    eventType: '负面评价',
-    pushTime: '2025-09-22 14:45:15',
-    pushDepartment: '舆情管理中心',
-    receiveTime: '2025-09-22 14:46:30',
-    receiveDepartment: '客服中心',
-    status: '处理中'
+// 获取状态样式类
+const getStatusClass = (status) => {
+  if (!status) return 'status-unknown'
+  
+  status = status.toString()
+  if (status.includes('已') || status.includes('完结') || status.includes('完成') || status.includes('疏导')) {
+    return 'status-completed'
+  } else if (status.includes('处理中') || status.includes('进行中')) {
+    return 'status-processing'
+  } else if (status.includes('待') || status.includes('预警')) {
+    return 'status-pending'
+  } else if (status.includes('紧急') || status.includes('异常')) {
+    return 'status-emergency'
   }
-])
+  return 'status-unknown'
+}
 
 // 关闭弹框
 function handleClose() {
   emit('update:visible', false)
   emit('close')
 }
-
-// 组件挂载时可以获取数据
-onMounted(() => {
-  // 这里可以添加数据获取逻辑
-  // fetchData()
-})
 </script>
 
 <style scoped>
@@ -347,6 +177,7 @@ onMounted(() => {
   border-radius: 4px;
   cursor: pointer;
   transition: all 0.3s ease;
+  padding: 0;
 }
 
 .early-warning-close:hover {
@@ -477,7 +308,25 @@ onMounted(() => {
   color: #00ff99;
   font-weight: 500;
 }
+.status-processing {
+  color: #0099ff;
+  font-weight: 500;
+}
+
+.status-pending {
+  color: #ffcc00;
+  font-weight: 500;
+}
 
+.status-overtime {
+  color: #ff0000;
+  font-weight: 500;
+}
+
+.status-unknown {
+  color: #999999;
+  font-weight: 500;
+}
 /* 响应式调整 */
 @media (max-width: 768px) {
   .early-warning-content {

bigScreen3/src/views/dashboard/cpns/InfoPopup.vue

@@ -314,8 +314,9 @@
 </template>
 
 <script setup>
-import { ref, reactive } from 'vue'
+import { ref, reactive, watch, onMounted } from 'vue'
 import caseImage from '@/assets/6.1.png'
+import { createPageData } from '@/api/index.js'
 
 // 定义props
 const props = defineProps({
@@ -326,6 +327,35 @@ const props = defineProps({
   }
 })
 
+// 监听fParkid变化，更新数据
+watch(() => props.data.fParkid, (newParkId) => {
+  if (newParkId) {
+    updateAllData(newParkId)
+  }
+}, { immediate: true })
+
+// 组件挂载时更新数据
+onMounted(() => {
+  if (props.data.fParkid) {
+    updateAllData(props.data.fParkid)
+  }
+})
+
+// 更新所有数据
+const updateAllData = async (parkId) => {
+  try {
+    // 并行获取所有数据
+    await Promise.all([
+      fetchBasicFacilityData(parkId),
+      fetchVideoData(parkId),
+      fetchDiscoveryData(parkId),
+      fetchAttendanceAndMaintenanceData(parkId)
+    ])
+  } catch (error) {
+    console.error('更新数据失败:', error)
+  }
+}
+
 // Tab切换数据
 const activeTab = ref('basic')
 const activeMaintenanceTab = ref('statistics') // 设备运维子tab
@@ -344,36 +374,68 @@ const maintenanceTabs = [
   { key: 'warning', label: '设备预警' }
 ]
 
-// 公园基础信息（虚拟数据）
+// 公园基础信息
 const parkBasicInfo = reactive({
-  parkName: props.data.name || '郑州绿博园项目',
-  address: '河南省郑州市航空港经济综合实验区苑陵路140号',
-  director: '张三',
+  parkName: props.data.name || props.data.fParkname || '郑州绿博园项目',
+  address: props.data.fAddress || '地址信息获取中...',
+  director: props.data.fHeader || '负责人信息获取中...',
   phone: '13828239092',
-  creditScore: 100,
-  creditLevel: 'A',
-  riskScore: 80,
-  riskLevel: 'B'
+  creditScore: props.data.credit_score || 0,
+  creditLevel: props.data.credit_level || '-',
+  riskScore: props.data.risk_score || 0,
+  riskLevel: props.data.risk_level || '-'
 })
 
-// 公园设施数据（虚拟数据）
-const facilityData = reactive([
-  { serial: 1, project: '绿地养护面积', unit: 'm²', quantity: 220068 },
-  { serial: 2, project: '水体维护面积', unit: 'm²', quantity: 2630 },
-  { serial: 3, project: '建筑维护面积', unit: 'm²', quantity: 3247.8 },
-  { serial: 4, project: '园林路面积', unit: 'm²', quantity: 220068 },
-  { serial: 5, project: '围墙面积', unit: 'm²', quantity: 2630 },
-  { serial: 6, project: '花架面积', unit: 'm²', quantity: 3247.8 },
-  { serial: 7, project: '健身场地面积', unit: 'm²', quantity: 220068 },
-  { serial: 8, project: '园区长度', unit: 'm', quantity: 2630 },
-  { serial: 9, project: '断面积', unit: 'm²', quantity: 3247.8 },
-  { serial: 4, project: '园林路面积', unit: 'm²', quantity: 220068 },
-  { serial: 5, project: '围墙面积', unit: 'm²', quantity: 2630 },
-  { serial: 6, project: '花架面积', unit: 'm²', quantity: 3247.8 },
-  { serial: 7, project: '健身场地面积', unit: 'm²', quantity: 220068 },
-  { serial: 8, project: '园区长度', unit: 'm', quantity: 2630 },
-  { serial: 9, project: '断面积', unit: 'm²', quantity: 3247.8 }
-])
+// 公园设施数据
+const facilityData = reactive([])
+
+// 获取基础设施数据
+const fetchBasicFacilityData = async (parkId) => {
+  try {
+    const response = await createPageData('/t-base-facilityinfo/selectByPageListNew', {
+      current: 1,
+      fCategoryid: 0,
+      fCategoryname: "",
+      fFacilityid: parkId,
+      fName: "",
+      fParkid: 0,
+      fParkname: props.data.name || "南水北调公园",
+      fStateid: 1,
+      size: 999
+    })
+    
+    const data = response.data || []
+    if (data.length === 0) {
+      // 如果没有数据，使用默认数据
+      facilityData.splice(0, facilityData.length)
+      [
+        { serial: 1, project: '绿地养护面积', unit: 'm²', quantity: 0 },
+        { serial: 2, project: '水体维护面积', unit: 'm²', quantity: 0 },
+        { serial: 3, project: '建筑维护面积', unit: 'm²', quantity: 0 }
+      ].forEach(item => facilityData.push(item))
+    } else {
+      // 更新数据
+      facilityData.splice(0, facilityData.length)
+      data.forEach((item, index) => {
+        facilityData.push({
+          serial: index + 1,
+          project: item.fcategoryname || '未命名项目',
+          unit: item.unit || '个',
+          quantity: item.amount || 0
+        })
+      })
+    }
+  } catch (error) {
+    console.error('获取设施数据失败:', error)
+    // 错误时使用默认数据
+    facilityData.splice(0, facilityData.length)
+    [
+      { serial: 1, project: '绿地养护面积', unit: 'm²', quantity: 0 },
+      { serial: 2, project: '水体维护面积', unit: 'm²', quantity: 0 },
+      { serial: 3, project: '建筑维护面积', unit: 'm²', quantity: 0 }
+    ].forEach(item => facilityData.push(item))
+  }
+}
 
 // 公园实景图片（虚拟数据）
 const parkImages = reactive([
@@ -383,16 +445,43 @@ const parkImages = reactive([
 ])
 
 // 视频监控相关数据
-const videoList = reactive([
-  { name: '绿博园-街道3', time: '2025-10-21 14:28' },
-  { name: '绿博园-街道4', time: '2025-10-21 14:28' },
-  { name: '绿博园-AI门', time: '2025-10-21 14:28' },
-  { name: '绿博园-街道1', time: '2025-10-21 14:28' },
-  { name: '绿博园-街道3', time: '2025-10-21 14:28' },
-  { name: '绿博园-街道4', time: '2025-10-21 14:28' },
-  { name: '绿博园-AI门', time: '2025-10-21 14:28' },
-  { name: '绿博园-街道1', time: '2025-10-21 14:28' }
-])
+const videoList = reactive([])
+
+// 获取视频监控数据
+const fetchVideoData = async (parkId) => {
+  try {
+    const response = await axios.get(`/tbasedriveinfo/selectDriveinfoList/${parkId}`)
+    const data = response.data || []
+    
+    videoList.splice(0, videoList.length)
+    if (data.length > 0) {
+      data.forEach(item => {
+        videoList.push({
+          name: item.name || `摄像头${item.id || Math.random().toString(36).substr(2, 9)}`,
+          time: new Date().toISOString().slice(0, 16).replace('T', ' ')
+        })
+      })
+    } else {
+      // 如果没有数据，使用模拟数据
+      for (let i = 0; i < 8; i++) {
+        videoList.push({
+          name: `${props.data.name || '公园'}-摄像头${i + 1}`,
+          time: new Date().toISOString().slice(0, 16).replace('T', ' ')
+        })
+      }
+    }
+  } catch (error) {
+    console.error('获取视频监控数据失败:', error)
+    // 错误时使用模拟数据
+    videoList.splice(0, videoList.length)
+    for (let i = 0; i < 8; i++) {
+      videoList.push({
+        name: `${props.data.name || '公园'}-摄像头${i + 1}`,
+        time: new Date().toISOString().slice(0, 16).replace('T', ' ')
+      })
+    }
+  }
+}
 
 // 视频模态框相关
 const isVideoModalOpen = ref(false)
@@ -407,17 +496,63 @@ const closeVideoModal = () => {
 }
 
 // 智能发现相关数据
-const discoveryData = reactive([
-  { discoveryMethod: '视频感知', eventType: '毁坏草坪', pushTime: '2025-09-22 04:24:40', pushDepartment: '园林中心', receiveDepartment: '龙湖源公园', disposalStatus: '完结' },
-  { discoveryMethod: '大数据发现', eventType: '公园密度过大', pushTime: '2025-09-22 04:24:40', pushDepartment: '园林中心', receiveDepartment: '龙湖源公园', disposalStatus: '完结' },
-  { discoveryMethod: '视频感知', eventType: '毁坏草坪', pushTime: '2025-09-22 04:24:40', pushDepartment: '园林中心', receiveDepartment: '龙湖源公园', disposalStatus: '完结' },
-  { discoveryMethod: '大数据发现', eventType: '公园密度过大', pushTime: '2025-09-22 04:24:40', pushDepartment: '园林中心', receiveDepartment: '龙湖源公园', disposalStatus: '完结' },
-  { discoveryMethod: '视频感知', eventType: '毁坏草坪', pushTime: '2025-09-22 04:24:40', pushDepartment: '园林中心', receiveDepartment: '龙湖源公园', disposalStatus: '完结' },
-  { discoveryMethod: '大数据发现', eventType: '公园密度过大', pushTime: '2025-09-22 04:24:40', pushDepartment: '园林中心', receiveDepartment: '龙湖源公园', disposalStatus: '完结' },
-  { discoveryMethod: '视频感知', eventType: '毁坏草坪', pushTime: '2025-09-22 04:24:40', pushDepartment: '园林中心', receiveDepartment: '龙湖源公园', disposalStatus: '完结' },
-  { discoveryMethod: '大数据发现', eventType: '公园密度过大', pushTime: '2025-09-22 04:24:40', pushDepartment: '园林中心', receiveDepartment: '龙湖源公园', disposalStatus: '完结' },
-  { discoveryMethod: '视频感知', eventType: '毁坏草坪', pushTime: '2025-09-22 04:24:40', pushDepartment: '园林中心', receiveDepartment: '龙湖源公园', disposalStatus: '完结' }
-])
+const discoveryData = reactive([])
+
+// 获取智能发现数据
+const fetchDiscoveryData = async (parkId) => {
+  try {
+    const response = await axios.get(`/woworkorderbase/smartDiscovery/${parkId}`)
+    const data = response.data || []
+    
+    discoveryData.splice(0, discoveryData.length)
+    if (data.length > 0) {
+      data.forEach(item => {
+        discoveryData.push({
+          discoveryMethod: item.discoveryMethod || '未知',
+          eventType: item.eventType || '未分类事件',
+          pushTime: item.pushTime || new Date().toISOString().slice(0, 19).replace('T', ' '),
+          pushDepartment: item.pushDepartment || '系统',
+          receiveDepartment: item.receiveDepartment || props.data.name || '当前公园',
+          disposalStatus: item.disposalStatus || '待处理'
+        })
+      })
+    } else {
+      // 如果没有数据，使用模拟数据
+      const statuses = ['完结', '处理中', '待处理', '逾期']
+      const methods = ['视频感知', '大数据发现', '人工上报']
+      const events = ['毁坏草坪', '公园密度过大', '设施损坏', '垃圾堆积']
+      
+      for (let i = 0; i < 9; i++) {
+        discoveryData.push({
+          discoveryMethod: methods[Math.floor(Math.random() * methods.length)],
+          eventType: events[Math.floor(Math.random() * events.length)],
+          pushTime: new Date(Date.now() - Math.random() * 7 * 24 * 60 * 60 * 1000).toISOString().slice(0, 19).replace('T', ' '),
+          pushDepartment: '园林中心',
+          receiveDepartment: props.data.name || '当前公园',
+          disposalStatus: statuses[Math.floor(Math.random() * statuses.length)]
+        })
+      }
+    }
+  } catch (error) {
+    console.error('获取智能发现数据失败:', error)
+    // 错误时使用模拟数据
+    discoveryData.splice(0, discoveryData.length)
+    const statuses = ['完结', '处理中', '待处理', '逾期']
+    const methods = ['视频感知', '大数据发现', '人工上报']
+    const events = ['毁坏草坪', '公园密度过大', '设施损坏', '垃圾堆积']
+    
+    for (let i = 0; i < 9; i++) {
+      discoveryData.push({
+        discoveryMethod: methods[Math.floor(Math.random() * methods.length)],
+        eventType: events[Math.floor(Math.random() * events.length)],
+        pushTime: new Date(Date.now() - Math.random() * 7 * 24 * 60 * 60 * 1000).toISOString().slice(0, 19).replace('T', ' '),
+        pushDepartment: '园林中心',
+        receiveDepartment: props.data.name || '当前公园',
+        disposalStatus: statuses[Math.floor(Math.random() * statuses.length)]
+      })
+    }
+  }
+}
 
 // 获取处置状态样式类
 const getDisposalStatusClass = (status) => {
@@ -437,70 +572,191 @@ const getDisposalStatusClass = (status) => {
 
 // 人员出勤相关数据
 const personnelStats = reactive({
-  total: 128,
-  leave: 29,
-  onDuty: 98,
-  actual: 97
+  total: 0,
+  leave: 0,
+  onDuty: 0,
+  actual: 0,
+  dueToArrive: 0
 })
 
-const attendanceData = reactive([
-  { name: '张三', goToWork: '2025-11-05 08:00', offWork: '2025-11-05 16:00', status: '在岗' },
-  { name: '李四', goToWork: '-', offWork: '-', status: '请假' },
-  { name: '张三', goToWork: '2025-11-05 08:00', offWork: '2025-11-05 16:00', status: '在岗' },
-  { name: '张三', goToWork: '2025-11-05 08:00', offWork: '2025-11-05 16:00', status: '在岗' },
-  { name: '李四', goToWork: '-', offWork: '-', status: '请假' },
-  { name: '张三', goToWork: '2025-11-05 08:00', offWork: '2025-11-05 16:00', status: '在岗' },
-  { name: '李四', goToWork: '-', offWork: '-', status: '请假' },
-  { name: '张三', goToWork: '2025-11-05 08:00', offWork: '2025-11-05 16:00', status: '在岗' },
-  { name: '张三', goToWork: '2025-11-05 08:00', offWork: '2025-11-05 16:00', status: '在岗' }
-])
+const attendanceData = reactive([])
 
 // 设备运维相关数据
 const equipmentStats = reactive({
-  total: 120,
-  normal: 95,
-  maintaining: 15,
-  error: 10
+  total: 0,
+  normal: 0,
+  maintaining: 0,
+  error: 0
 })
 
 // 设备统计数据
-const equipmentStatistics = reactive([
-  { name: '智能照明控制器001', type: '照明设备', location: '东区主路', installTime: '2024-01-15', status: '正常运行' },
-  { name: '智能灌溉系统002', type: '灌溉设备', location: '南区草坪', installTime: '2024-02-20', status: '正常运行' },
-  { name: '安防摄像头003', type: '安防设备', location: '西区入口', installTime: '2024-03-10', status: '维护中' },
-  { name: '智能照明控制器004', type: '照明设备', location: '北区小径', installTime: '2024-01-15', status: '故障' },
-  { name: '智能灌溉系统005', type: '灌溉设备', location: '中区花坛', installTime: '2024-02-20', status: '正常运行' },
-  { name: '安防摄像头006', type: '安防设备', location: '东区广场', installTime: '2024-03-10', status: '正常运行' },
-  { name: '智能照明控制器007', type: '照明设备', location: '西区步道', installTime: '2024-01-15', status: '维护中' },
-  { name: '智能灌溉系统008', type: '灌溉设备', location: '北区草坪', installTime: '2024-02-20', status: '正常运行' },
-  { name: '安防摄像头009', type: '安防设备', location: '南区出口', installTime: '2024-03-10', status: '故障' }
-])
+const equipmentStatistics = reactive([])
 
 // 设备检查数据
-const equipmentInspections = reactive([
-  { deviceName: '智能照明控制器001', inspectionTime: '2025-10-20 09:30', inspector: '王工', result: '合格', remark: '设备运行正常' },
-  { deviceName: '智能灌溉系统002', inspectionTime: '2025-10-20 10:15', inspector: '李工', result: '合格', remark: '水压正常' },
-  { deviceName: '安防摄像头003', inspectionTime: '2025-10-20 11:00', inspector: '张工', result: '不合格', remark: '镜头需要清洁' },
-  { deviceName: '智能照明控制器004', inspectionTime: '2025-10-20 14:00', inspector: '王工', result: '不合格', remark: '线路老化' },
-  { deviceName: '智能灌溉系统005', inspectionTime: '2025-10-20 15:30', inspector: '李工', result: '合格', remark: '设备运行正常' },
-  { deviceName: '安防摄像头006', inspectionTime: '2025-10-21 09:00', inspector: '张工', result: '合格', remark: '画面清晰' },
-  { deviceName: '智能照明控制器007', inspectionTime: '2025-10-21 10:30', inspector: '王工', result: '合格', remark: '亮度调节正常' },
-  { deviceName: '智能灌溉系统008', inspectionTime: '2025-10-21 11:15', inspector: '李工', result: '合格', remark: '定时功能正常' },
-  { deviceName: '安防摄像头009', inspectionTime: '2025-10-21 14:30', inspector: '张工', result: '不合格', remark: '角度需要调整' }
-])
+const equipmentInspections = reactive([])
 
 // 设备预警数据
-const equipmentWarnings = reactive([
-  { deviceName: '智能照明控制器004', warningTime: '2025-10-22 08:45', warningType: '故障预警', level: '警告', processingStatus: '处理中' },
-  { deviceName: '安防摄像头003', warningTime: '2025-10-22 09:30', warningType: '信号异常', level: '提示', processingStatus: '已处理' },
-  { deviceName: '安防摄像头009', warningTime: '2025-10-22 10:15', warningType: '画面异常', level: '警告', processingStatus: '待处理' },
-  { deviceName: '智能灌溉系统002', warningTime: '2025-10-22 11:00', warningType: '水压不足', level: '提示', processingStatus: '已处理' },
-  { deviceName: '智能照明控制器007', warningTime: '2025-10-22 14:20', warningType: '电源不稳', level: '提示', processingStatus: '处理中' },
-  { deviceName: '智能灌溉系统005', warningTime: '2025-10-22 15:45', warningType: '流量异常', level: '警告', processingStatus: '待处理' },
-  { deviceName: '安防摄像头006', warningTime: '2025-10-23 09:00', warningType: '存储不足', level: '提示', processingStatus: '已处理' },
-  { deviceName: '智能照明控制器001', warningTime: '2025-10-23 10:30', warningType: '温度过高', level: '警告', processingStatus: '处理中' },
-  { deviceName: '智能灌溉系统008', warningTime: '2025-10-23 11:15', warningType: '阀门异常', level: '紧急', processingStatus: '待处理' }
-])
+const equipmentWarnings = reactive([])
+
+// 获取人员出勤和设备运维数据
+const fetchAttendanceAndMaintenanceData = async (parkId) => {
+  try {
+    const response = await axios.get(`/map/polygon-properties/selectMaintenance/2`)
+    const data = response.data || {}
+    
+    // 更新人员出勤数据
+    if (data.attendance) {
+      // 更新人员统计数据
+      personnelStats.total = data.attendance?.dueToArrive || 0
+      personnelStats.leave = data.attendance?.leave || 0
+      personnelStats.onDuty = data.attendance?.present || 0
+      personnelStats.actual = data.attendance?.present || 0
+      personnelStats.dueToArrive = data.attendance?.dueToArrive || 0
+      
+      // 更新出勤详细数据
+      attendanceData.splice(0, attendanceData.length)
+      const attendanceList = data.attendance.attendance || []
+      if (attendanceList.length > 0) {
+        attendanceList.forEach(item => {
+          attendanceData.push({
+            name: item.name || '未知人员',
+            goToWork: item.goToWork || '-',
+            offWork: item.offWork || '-',
+            status: item.status || '未知'
+          })
+        })
+      } else {
+        // 模拟数据
+        for (let i = 0; i < 9; i++) {
+          const isOnDuty = Math.random() > 0.2
+          attendanceData.push({
+            name: `工作人员${i + 1}`,
+            goToWork: isOnDuty ? '2025-11-05 08:00' : '-',
+            offWork: isOnDuty ? '2025-11-05 16:00' : '-',
+            status: isOnDuty ? '在岗' : '请假'
+          })
+        }
+      }
+    }
+    
+    // 更新设备运维数据
+    if (data.statistics && data.statistics.length > 0) {
+      // 更新设备统计数据
+      const deviceData = data.statistics[0]
+      equipmentStats.total = deviceData.total || 0
+      equipmentStats.normal = deviceData.normal?.length || 0
+      equipmentStats.maintaining = deviceData.maintaining?.length || 0
+      equipmentStats.error = deviceData.abnormal?.length || 0
+      
+      // 更新设备统计详细数据
+      equipmentStatistics.splice(0, equipmentStatistics.length)
+      const deviceList = deviceData.data || []
+      if (deviceList.length > 0) {
+        deviceList.forEach(item => {
+          equipmentStatistics.push({
+            name: item.name || '未知设备',
+            type: item.type || '未知类型',
+            location: item.location || '未知位置',
+            installTime: item.installTime || '-',
+            status: item.status || '未知状态'
+          })
+        })
+      }
+    }
+    
+    // 更新设备检查数据
+    if (data.maintenance) {
+      equipmentInspections.splice(0, equipmentInspections.length)
+      data.maintenance.forEach(item => {
+        equipmentInspections.push({
+          deviceName: item.deviceName || '未知设备',
+          inspectionTime: item.inspectionTime || '-',
+          inspector: item.inspector || '未知',
+          result: item.result || '未知',
+          remark: item.remark || ''
+        })
+      })
+    }
+    
+    // 更新设备预警数据
+    if (data.warningOrder) {
+      equipmentWarnings.splice(0, equipmentWarnings.length)
+      data.warningOrder.forEach(item => {
+        equipmentWarnings.push({
+          deviceName: item.deviceName || item.fDevicename || '未知设备',
+          warningTime: item.warningTime || item.fWarningtime || '-',
+          warningType: item.warningType || item.fWarningtype || '未知类型',
+          level: item.level || (item.fLevel === 1 ? '紧急' : item.fLevel === 2 ? '警告' : '提示'),
+          processingStatus: item.processingStatus || (item.fProcessstatus === 1 ? '已处理' : item.fProcessstatus === 2 ? '处理中' : '待处理')
+        })
+      })
+    }
+    
+    // 如果没有获取到数据，使用模拟数据
+    if (equipmentWarnings.length === 0) {
+      const warningTypes = ['故障预警', '信号异常', '画面异常', '水压不足', '电源不稳', '流量异常', '存储不足', '温度过高', '阀门异常']
+      const levels = ['紧急', '警告', '提示']
+      const statuses = ['已处理', '处理中', '待处理']
+      
+      for (let i = 0; i < 9; i++) {
+        equipmentWarnings.push({
+          deviceName: `智能设备${i + 1}`,
+          warningTime: new Date(Date.now() - Math.random() * 24 * 60 * 60 * 1000).toISOString().slice(0, 16).replace('T', ' '),
+          warningType: warningTypes[Math.floor(Math.random() * warningTypes.length)],
+          level: levels[Math.floor(Math.random() * levels.length)],
+          processingStatus: statuses[Math.floor(Math.random() * statuses.length)]
+        })
+      }
+    }
+    
+  } catch (error) {
+    console.error('获取人员出勤和设备运维数据失败:', error)
+    // 错误时使用模拟数据
+    generateMockData()
+  }
+}
+
+// 生成模拟数据
+const generateMockData = () => {
+  // 模拟人员出勤数据
+  personnelStats.total = 128
+  personnelStats.leave = 29
+  personnelStats.onDuty = 98
+  personnelStats.actual = 97
+  
+  attendanceData.splice(0, attendanceData.length)
+  for (let i = 0; i < 9; i++) {
+    const isOnDuty = Math.random() > 0.2
+    attendanceData.push({
+      name: `工作人员${i + 1}`,
+      goToWork: isOnDuty ? '2025-11-05 08:00' : '-',
+      offWork: isOnDuty ? '2025-11-05 16:00' : '-',
+      status: isOnDuty ? '在岗' : '请假'
+    })
+  }
+  
+  // 模拟设备数据
+  equipmentStats.total = 120
+  equipmentStats.normal = 95
+  equipmentStats.maintaining = 15
+  equipmentStats.error = 10
+  
+  // 模拟设备预警数据
+  equipmentWarnings.splice(0, equipmentWarnings.length)
+  const warningTypes = ['故障预警', '信号异常', '画面异常', '水压不足', '电源不稳', '流量异常', '存储不足', '温度过高', '阀门异常']
+  const levels = ['紧急', '警告', '提示']
+  const statuses = ['已处理', '处理中', '待处理']
+  
+  for (let i = 0; i < 9; i++) {
+    equipmentWarnings.push({
+      deviceName: `智能设备${i + 1}`,
+      warningTime: new Date(Date.now() - Math.random() * 24 * 60 * 60 * 1000).toISOString().slice(0, 16).replace('T', ' '),
+      warningType: warningTypes[Math.floor(Math.random() * warningTypes.length)],
+      level: levels[Math.floor(Math.random() * levels.length)],
+      processingStatus: statuses[Math.floor(Math.random() * statuses.length)]
+    })
+  }
+}
 
 // 获取设备状态样式类
 const getDeviceStatusClass = (status) => {

bigScreen3/src/views/dashboard/cpns/ProjectOverview.vue

@@ -16,7 +16,7 @@
       :modal="false"
       style="background: rgba(0, 20, 40, 0.98);"
     >
-      <InfoPopup :data="dialogData" />
+      <InfoPopup :data="dialogData"  />
     </el-dialog>
   </div>
 </template>
@@ -54,7 +54,8 @@ const fetchParkList = async () => {
           district: park.fStreet || '未知区域',
           area: park.fArea || 0,
           level: park.fLayer || '未知',
-          description: park.description || '暂无描述'
+          description: park.description || '暂无描述',
+          ...park
         }
       })
     } else {
@@ -383,6 +384,7 @@ const addParkMarkers = () => {
     // })
 
     marker.on('click', (e) => {
+      console.log('点击公园:', e.target.getExtData())
       showParkDialog(e.target.getExtData())
     })
 
@@ -394,6 +396,7 @@ const addParkMarkers = () => {
 // 显示公园信息对话框
 const showParkDialog = (parkData) => {
   dialogData.value = parkData
+  
   dialogVisible.value = true
 }
 

bigScreen3/src/views/dashboard/cpns/TypicalCase.vue

@@ -6,6 +6,7 @@
       v-for="(item, index) in caseList" 
       :key="index"
       class="case-item"
+      @click="handleClick(item)"
       >
       <div class="case-image">
         <img :src="item.image" :alt="item.title" />
@@ -18,12 +19,18 @@
     </div>
     </div>
   </div>
+  <!-- 工单详情组件 -->
+  <WorkOrderDetail 
+    :visible="showDetail" 
+    :work-order-id="selectedWorkOrderId"
+    @close="() => { showDetail = false }"/>
 </template>
 
 <script setup>
 import { ref, onMounted, watch } from 'vue'
 import caseImage from '@/assets/6.1.png'
 import { getPageListData } from '@/api/index.js'
+import WorkOrderDetail from '@/views/dashboard/cpns/WorkOrderDetail.vue'
 
 // 定义 props
 const props = defineProps({
@@ -35,6 +42,15 @@ const props = defineProps({
 watch(() => props.selectedProjectId, () => {
   fetchTypicalCaseData()
 })  
+
+// 定义状态变量
+const showDetail = ref(false)
+const selectedWorkOrderId = ref('')
+const handleClick = (item) => {
+  selectedWorkOrderId.value = item.fWorkorderid
+  console.log('selectedWorkOrderId.value', selectedWorkOrderId.value)
+  showDetail.value = true
+}
 // 响应式数据
 const caseList = ref([
   {
@@ -67,8 +83,10 @@ const fetchTypicalCaseData = async () => {
         title: item.checkusername || '典型案例',
         description: item.fContent || '暂无描述',
         time: item.fAskfinishtime || new Date().toLocaleString(),
-        image: item.imageUrl ? item.imageUrl : caseImage // 如果没有图片则使用默认图片
+        image: item.imageUrl ? item.imageUrl : caseImage, // 如果没有图片则使用默认图片  selectsworkTypicalList
+        fWorkorderid: item.fWorkorderid || ''
       }))
+
     }
   } catch (error) {
     console.error('获取典型案例数据失败:', error)

bigScreen3/src/views/dashboard/cpns/WisdomDiscovery.vue

@@ -1,31 +1,31 @@
 <template>
   <div class="wisdom-discovery">
     <!-- 工单列表弹框 -->
-    <el-dialog
-      v-model="workOrderDialogVisible"
-      title="工单列表"
+    <!-- <el-dialog
+      v-model="workOrderListVisible"
+      title=""
       :modal="false"
       width="80%"
       class="work-order-dialog"
       :border="false"
-      
-    >
-    <EquipmentDetail
-      :visible="workOrderDialogVisible"
-      :options="{fWorkordertypeid: 4}"
-      @close="workOrderDialogVisible = false"
-    />
-    <!-- <work-order-list
-      :visible="workOrderDialogVisible"
+    > -->
+    <!-- <EarlyWarningDetail
+      :visible="workOrderListVisible"
       :options="{fWorkordertypeid: 4}"
-      @close="workOrderDialogVisible = false"
+      @close="workOrderListVisible = false"
     /> -->
-    <!-- <work-order-detail
-      :visible="workOrderDialogVisible"
+    <!-- <EquipmentDetail
+      :visible="workOrderListVisible"
       :options="{fWorkordertypeid: 4}"
-      @close="workOrderDialogVisible = false"
+      @close="workOrderListVisible = false"
     /> -->
-    </el-dialog>
+    <work-order-list
+      :visible="workOrderListVisible"
+      :options="{fWorkordertypeid: 4, fSguserid: selectedProjectId}"
+      @close="workOrderListVisible = false"
+    />
+    
+    <!-- </el-dialog> -->
     <!-- 2x2 网格布局 -->
     <div class="discovery-grid">
       <!-- 左上：累计发现 -->
@@ -138,12 +138,7 @@ const discoveryStats = ref({
   bigDataAnalysis: 1236
 })
 
-// 工单列表弹框相关数据
-const workOrderDialogVisible = ref(false)
-const workOrderList = ref([])
-const currentPage = ref(1)
-const pageSize = ref(10)
-const totalWorkOrders = ref(0)
+
 
 // 进度条分段数量（总共显示的分段数）
 const totalSegments = 20
@@ -189,70 +184,17 @@ const unresolvedSegments = computed(() => {
   return Array(totalSegments).fill(false).map((_, i) => i < filledCount)
 })
 
+const workOrderListVisible = ref(false)
 // 处理累计发现点击事件
 const handleTotalDiscoveryClick = async () => {
+  console.log('props.selectedProjectId', props.selectedProjectId)
   // 重置为第一页
-  currentPage.value = 1
-  workOrderDialogVisible.value = true
-  await fetchWorkOrderList()
+  // currentPage.value = 1
+  workOrderListVisible.value = true  
+  // await fetchWorkOrderList()
 }
 
-// 分页大小变化处理
-const handleSizeChange = (newSize) => {
-  pageSize.value = newSize
-  fetchWorkOrderList()
-}
 
-// 页码变化处理
-const handleCurrentChange = (newPage) => {
-  currentPage.value = newPage
-  fetchWorkOrderList()
-}
-
-// 获取工单列表数据
-const fetchWorkOrderList = async () => {
-  try {
-      const response = await createPageData('/woworkorderbase/searchWorkGState?stateid=0',{
-        current: currentPage.value,
-        size: pageSize.value,
-        deptType: 1,
-        fCode: "",
-        fOvertimes: 0,
-        fSguserid: props.selectedProjectId || '',
-        fSgusername: "",
-        fStateid: 0,
-        fWorkorderid: 0,
-        fWorkordertypeid: 0,
-      })
-      console.log('response', response)
-      if (response && response.status === 200 && response.data.data) {
-        // 转换数据格式，确保与表格列名匹配
-        workOrderList.value = (response.data.data || []).map(item => ({
-          discoverMethod: item.discoverMethod || '视频捕捉',
-          typeName: item.typeName || '客流预警',
-          pushtime: item.pushtime || '',
-          pushDept: item.pushDept || '园林中心',
-          receiveDept: item.receiveDept || '龙源湖公园',
-          fState: item.fState,
-          statusText: item.status === 1 ? '完结' : '待处理'
-        }))
-        // 设置总数
-        totalWorkOrders.value = response.data.total || 0
-      }
-    } catch (error) {
-      console.error('获取工单列表失败:', error)
-      // 提供模拟数据
-      workOrderList.value = []
-      totalWorkOrders.value = 0
-    }
-}
-
-// 格式化状态显示
-const formatStatus = (row) => {
-  return row.statusText === '完结' 
-    ? '<span style="color: #00FF88;">完结</span>' 
-    : '<span style="color: #FF6B6B;">待处理</span>'
-}
 </script>
 
 <style lang="scss" scoped>

bigScreen3/src/views/dashboard/cpns/WorkOrderDetail.vue

@@ -1,5 +1,5 @@
 <template>
-   <div v-if="visible" class="work-order-detail-modal" @click.self="handleClose">
+   <div v-if="visible && workOrderData.tWoWorkorderbase" class="work-order-detail-modal" @click.self="handleClose">
     <div class="work-order-detail-content" style="border-color: #056CC3">
       <div class="work-order-detail-header">
         <h2>工单详情</h2>
@@ -23,35 +23,35 @@
             <div class="info-card" style="border-color: #056CC3">
               <div class="info-item">
                 <span class="info-label">预警类型:</span>
-                <span class="info-value" style="text-align: left; color: #056CC3">{{ workOrderData.basicInfo.warningType }}</span>
+                <span class="info-value" style="text-align: left; color: #056CC3">{{ workOrderData.tWoWorkorderbase.riskclassifyname }}</span>
               </div>
               <div class="info-item">
                 <span class="info-label">处理单位:</span>
-                <span class="info-value" style="text-align: left; color: #056CC3">{{ workOrderData.basicInfo.handleUnit }}</span>
+                <span class="info-value" style="text-align: left; color: #056CC3">{{ workOrderData.tWoWorkorderbase.distributedept }}</span>
               </div>
               <div class="info-item">
                 <span class="info-label">发送单位:</span>
-                <span class="info-value" style="text-align: left; color: #056CC3">{{ workOrderData.basicInfo.sendUnit }}</span>
+                <span class="info-value" style="text-align: left; color: #056CC3">{{ workOrderData.tWoWorkorderbase.checkdept }}</span>
               </div>
               <div class="info-item">
                 <span class="info-label">紧急程度:</span>
-                <span class="info-value emergency-level" :style="{ color: workOrderData.basicInfo.emergencyLevel === '紧急' ? 'red' : '#056CC3', textAlign: 'left' }">{{ workOrderData.basicInfo.emergencyLevel }}</span>
+                <span class="info-value emergency-level" :style="{ color: workOrderData.tWoWorkorderbase.fLevelname === '紧急' ? 'red' : '#056CC3', textAlign: 'left' }">{{ workOrderData.tWoWorkorderbase.fLevelname }}</span>
               </div>
               <div class="info-item">
                 <span class="info-label">要求时间:</span>
-                <span class="info-value" style="text-align: left; color: #056CC3">{{ workOrderData.basicInfo.requireCompleteTime }}</span>
+                <span class="info-value" style="text-align: left; color: #056CC3">{{ workOrderData.tWoWorkorderbase.fAskfinishtime }}</span>
               </div>
               <div class="info-item">
                 <span class="info-label">发起人:</span>
-                <span class="info-value" style="text-align: left; color: #056CC3">{{ workOrderData.basicInfo.initiator }}</span>
+                <span class="info-value" style="text-align: left; color: #056CC3">{{ workOrderData.tWoWorkorderbase.fCreatename }}</span>
               </div>
               <div class="info-item">
                 <span class="info-label">时间:</span>
-                <span class="info-value" style="text-align: left; color: #056CC3">{{ workOrderData.basicInfo.time }}</span>
+                <span class="info-value" style="text-align: left; color: #056CC3">{{ workOrderData.tWoWorkorderbase.fCreatedate }}</span>
               </div>
               <div class="info-item">
                 <span class="info-label">问题描述:</span>
-                <span class="info-value problem-desc" style="text-align: left; color: #056CC3">{{ workOrderData.basicInfo.problemDesc }}</span>
+                <span class="info-value problem-desc" style="text-align: left; color: #056CC3">{{ workOrderData.tWoWorkorderbase.fContent }}</span>
               </div>
             </div>
           </div>
@@ -63,10 +63,10 @@
               <!-- 步骤指示器 -->
               <div class="process-steps">
                 <div 
-                  v-for="(step, index) in workOrderData.processInfo.steps" 
+                  v-for="(step, index) in workOrderDataSteps" 
                   :key="index" 
                   class="step-item" 
-                  :class="{ active: index < workOrderData.processInfo.currentStep }"
+                  :class="{ active: index < currentStep }"
                 >
                   <span class="step-name">{{ step }}</span>
                 </div>
@@ -76,14 +76,14 @@
               <div class="progress-bar">
                 <div 
                   class="progress-fill" 
-                  :style="{ width: (workOrderData.processInfo.currentStep / workOrderData.processInfo.steps.length) * 100 + '%' }"
+                  :style="{ width: (currentStep/ workOrderDataSteps.length) * 100 + '%' }"
                 ></div>
               </div>
               
               <!-- 处理记录时间线 -->
               <div class="process-records">
                 <div 
-                  v-for="record in workOrderData.processInfo.records" 
+                  v-for="record in workOrderData.tWoWorkordertaskdealinfos" 
                   :key="record.id" 
                   class="timeline-item"
                 >
@@ -92,19 +92,20 @@
                   <div class="timeline-content">
                     <div class="timeline-header">
                       <div class="timeline-info">
-                        <span class="timeline-person">处理人: {{ record.person }}</span>
-                        <span class="timeline-time">时间: {{ record.time }}</span>
+                        <span class="timeline-person">处理人: {{ record.fString1 }}</span>
+                        <!-- <span class="timeline-status" :class="{'danger': record.fWorkorderstateid==1, 'success': record.fWorkorderstateid==2}">{{record.fString2}}</span> -->
+                        <span class="timeline-time">时间: {{ record.fOptdate }}</span>
                       </div>
-                      <button 
+                      <e-button 
                         class="timeline-btn" 
-                        :class="{ 'process-btn': record.isProcess }"
+                        :class="{'danger': record.fWorkorderstateid==1, 'success': record.fWorkorderstateid==2}"
                         @click="handleRecordAction(record)"
                       >
-                        {{ record.action }}
-                      </button>
+                        {{ record.fString2 }}
+                      </e-button>
                     </div>
                     <div class="timeline-body">
-                      {{ record.content }}
+                      {{ record.fRemark }}
                     </div>
                   </div>
                 </div>
@@ -141,62 +142,9 @@ const props = defineProps({
 const emit = defineEmits(['update:visible', 'close'])
 
 // 工单详情数据
-const workOrderData = ref({
-  // 左侧基本信息
-  basicInfo: {
-    warningType: '物联网知',
-    handleUnit: '龙渊湖公园',
-    sendUnit: '绿化中心',
-    emergencyLevel: '一般',
-    requireCompleteTime: '2025-09-23 02:30:01',
-    initiator: '自动预警',
-    time: '2025-09-23 02:30:01',
-    problemDesc: '龙渊湖公园在2025-09-23 00:00:00监测到噪音预警，音量大于正常分贝！'
-  },
-  // 右侧处理流程
-  processInfo: {
-    steps: ['预警', '派单', '处置', '完结'],
-    currentStep: 4,
-    records: [
-      {
-        id: 1,
-        check: true,
-        person: '自动预警',
-        time: '2025-09-23 02:30:01',
-        action: '预置',
-        content: '龙渊湖公园在2025-09-23 00:00:00监测到噪音设备提前打开，音量远远大于正常分贝！',
-        isProcess: false
-      },
-      {
-        id: 2,
-        check: true,
-        person: '自动派单',
-        time: '2025-09-23 03:30:01',
-        action: '派单',
-        content: '龙渊湖公园在2025-09-23 00:00:00监测到噪音设备提前打开，音量远远大于正常分贝！',
-        isProcess: false
-      },
-      {
-        id: 3,
-        check: true,
-        person: '龙渊湖公园',
-        time: '2025-09-23 03:30:01',
-        action: '派单',
-        content: '接收: 园长分派园内人员上前查看现场！',
-        isProcess: false
-      },
-      {
-        id: 4,
-        check: true,
-        person: '龙渊湖公园',
-        time: '2025-09-23 03:30:01',
-        action: '处置',
-        content: '处置: 现场与音箱负责人交涉，降低音量，以免扰民！',
-        isProcess: true
-      }
-    ]
-  }
-})
+const workOrderDataSteps = ref(['预警', '派单', '处置', '完结'])
+const currentStep = ref(4)
+const workOrderData = ref({})
 
 // 加载状态
 const loading = ref(false)
@@ -212,16 +160,16 @@ const fetchWorkOrderDetail = async () => {
   
   try {
     const data = {
-      ...props.options,
-      id: props.workOrderId
+      fWorkorderid: props.workOrderId
     }
     
     // 这里使用模拟接口，实际项目中需要替换为真实的工单详情接口
-    const response = await createPageData(`/woworkorderbase/getWorkOrderDetail`, data)
+    const response = await createPageData(`/workorderbaseApp/selectAppWorkorderbaseById`, data)
     
     if (response && response.status === 200 && response.data) {
+      console.log('response.data', response.data)
       // 处理返回的数据，映射到workOrderData结构
-      // workOrderData.value = mapResponseToWorkOrderData(response.data)
+      workOrderData.value = response.data
     } else {
       throw new Error('获取工单详情失败')
     }
@@ -229,6 +177,14 @@ const fetchWorkOrderDetail = async () => {
     console.error('获取工单详情出错:', err)
     error.value = err.message || '获取数据失败，请稍后重试'
     // 保留默认数据以便展示
+    workOrderData.value = {
+      basicInfo: {},
+      steps: [],
+      processInfo: {
+        currentStep: 0,
+        records: []
+      }
+    }
   } finally {
     loading.value = false
   }
@@ -250,6 +206,7 @@ function handleRecordAction(record) {
 // 监听visible变化，当显示时获取数据
 watch(() => props.visible, (newVal) => {
   if (newVal) {
+    console.log('props.workOrderId', props.workOrderId)
     fetchWorkOrderDetail()
   }
 })
@@ -257,6 +214,7 @@ watch(() => props.visible, (newVal) => {
 // 监听工单ID变化，重新获取数据
 watch(() => props.workOrderId, (newId) => {
   if (newId && props.visible) {
+    console.log('newId', newId)
     fetchWorkOrderDetail()
   }
 })
@@ -264,7 +222,7 @@ watch(() => props.workOrderId, (newId) => {
 // 组件挂载时的逻辑
 onMounted(() => {
   if (props.visible) {
-    fetchWorkOrderDetail()
+    // fetchWorkOrderDetail()
   }
 })
 
@@ -281,7 +239,7 @@ defineExpose({
   position: fixed;
   z-index: 9999;
   inset: 0;
-  background: rgba(0, 10, 30, 0.8);
+  /* background: rgba(0, 10, 30, 0.8); */
   display: flex;
   align-items: center;
   justify-content: center;
@@ -335,6 +293,7 @@ defineExpose({
   border-radius: 4px;
   cursor: pointer;
   transition: all 0.3s ease;
+  padding: 0;
 }
 
 .work-order-detail-close:hover {

bigScreen3/src/views/dashboard/cpns/WorkOrderList.vue

@@ -10,12 +10,12 @@
         <div class="stats-container">
           <div class="stat-item">
             <span class="stat-label">累计推送:</span>
-            <span class="stat-value">1,092</span>
+            <span class="stat-value">{{ totalCountFormatted }}</span>
             <span class="stat-unit">(起)</span>
           </div>
           <div class="stat-item">
-            <span class="stat-label">超前预警:</span>
-            <span class="stat-value">2</span>
+            <span class="stat-label">超期数量:</span>
+            <span class="stat-value overtime">{{ overtimeCount }}</span>
             <span class="stat-unit">(起)</span>
           </div>
         </div>
@@ -35,14 +35,17 @@
               </tr>
             </thead>
             <tbody>
-              <tr v-for="(item, index) in discoveryData" :key="index" :class="{ 'odd-row': index % 2 === 0, 'even-row': index % 2 === 1 }">
-                <td>{{ item.discoveryMethod }}</td>
-                <td>{{ item.eventType }}</td>
+              <tr v-for="(item, index) in warningList" :key="index" :class="{ 'odd-row': index % 2 === 0, 'even-row': index % 2 === 1 }" @dblclick="handleRowDoubleClick(item)">
+                <td>{{ item.fWorkordertype }}</td>
+                <td>{{ item.riskclassifyname }}</td>
                 <td>{{ item.pushTime }}</td>
-                <td>{{ item.pushDepartment }}</td>
-                <td>{{ item.receiveTime }}</td>
-                <td>{{ item.receiveDepartment }}</td>
-                <td class="status-completed">{{ item.status }}</td>
+                <td>{{ item.checkdept }}</td>
+                <td>{{ item.fEndtime }}</td>
+                <td>{{ item.distributedept }}</td>
+                <td :class="getStatusClass(item.status)">{{ item.status }}</td>
+              </tr>
+              <tr v-if="warningList.length === 0">
+                <td colspan="7" class="no-data">暂无数据</td>
               </tr>
             </tbody>
           </table>
@@ -53,24 +56,50 @@
           <div class="pagination-info">
             <span>共 {{ total }} 条数据</span>
           </div>
-          <div class="pagination-controls">
-            <button class="page-btn">上一页</button>
-            <button class="page-btn active">1</button>
-            <button class="page-btn">2</button>
-            <button class="page-btn">3</button>
-            <span>...</span>
-            <button class="page-btn">10</button>
-            <button class="page-btn">下一页</button>
+          <div class="pagination-controls" v-if="total > 0">
+            <button 
+              class="page-btn" 
+              :disabled="page.current === 1"
+              @click="handlePrevPage"
+            >
+              上一页
+            </button>
+            <template v-for="pageNum in displayedPages" :key="pageNum">
+              <span v-if="pageNum === '...'" class="pagination-ellipsis">...</span>
+              <button 
+                v-else 
+                class="page-btn"
+                :class="{ active: page.current === pageNum }"
+                @click="handlePageChange(pageNum)"
+              >
+                {{ pageNum }}
+              </button>
+            </template>
+            <button 
+              class="page-btn"
+              :disabled="page.current >= totalPages"
+              @click="handleNextPage"
+            >
+              下一页
+            </button>
           </div>
         </div>
       </div>
     </div>
   </div>
+  
+  <!-- 工单详情组件 -->
+  <WorkOrderDetail 
+    :visible="showDetail" 
+    :work-order-id="selectedWorkOrderId"
+    @close="() => { showDetail = false; emit('update:visible', true) }"
+  />
 </template>
 
 <script setup>
-import { ref, onMounted } from 'vue'
-import { getPageListData,createPageData } from '@/api/index'
+import { ref, computed, watch, onMounted } from 'vue'
+import { getPageListData, createPageData } from '@/api/index'
+import WorkOrderDetail from './WorkOrderDetail.vue'
 
 // 定义 props
 const props = defineProps({
@@ -80,94 +109,224 @@ const props = defineProps({
   },
   options: {
     type: Object,
-    default: {},
+    default: () => ({}),
   }
 })
 
+// 定义响应式数据
 const page = ref({
   current: 1,
   size: 10,
 });
 
 const total = ref(0);
+const warningList = ref([])
+const totalCount = ref(0);
+const overtimeCount = ref(0); // 超期数量
+const showDetail = ref(false);
+const selectedWorkOrderId = ref('');
 
 // 定义事件
 const emit = defineEmits(['update:visible', 'close'])
 
-// 智能发现数据
-const discoveryData = ref([])
+// 计算属性：总页数
+const totalPages = computed(() => {
+  return Math.ceil(total.value / page.value.size) || 1
+})
+
+// 计算属性：显示的页码
+const displayedPages = computed(() => {
+  const pages = []
+  const current = page.value.current
+  const total = totalPages.value
+  
+  // 如果总页数小于等于5，直接显示所有页码
+  if (total <= 5) {
+    for (let i = 1; i <= total; i++) {
+      pages.push(i)
+    }
+  } else {
+    // 显示当前页附近的页码，最多显示5个
+    if (current <= 3) {
+      // 当前页在前3页，显示1-5
+      for (let i = 1; i <= 5; i++) {
+        pages.push(i)
+      }
+      pages.push('...')
+      pages.push(total)
+    } else if (current >= total - 2) {
+      // 当前页在后3页，显示最后5个
+      pages.push(1)
+      pages.push('...')
+      for (let i = total - 4; i <= total; i++) {
+        pages.push(i)
+      }
+    } else {
+      // 当前页在中间，显示当前页前后各2个
+      pages.push(1)
+      pages.push('...')
+      for (let i = current - 2; i <= current + 2; i++) {
+        pages.push(i)
+      }
+      pages.push('...')
+      pages.push(total)
+    }
+  }
+  
+  return pages
+})
+
+// 计算属性：格式化后的总数
+const totalCountFormatted = computed(() => {
+  return totalCount.value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',')
+})
+
+// 获取状态样式类
+const getStatusClass = (status) => {
+  if (status.includes('已处置')) return 'status-completed'
+  if (status.includes('处理中')) return 'status-processing'
+  if (status.includes('未处置')) return 'status-pending'
+  if (status.includes('超期')) return 'status-overtime'
+  return 'status-unknown'
+}
 
 // 获取预警数据
 const fetchWarningData = async () => {
   try {
-    const data ={
+    const data = {
       ...props.options,
+      deptType: 1,
+      fCode: "",
+      fOvertimes: 0, // 普通列表查询
+      fSgusername: "",
+      fStateid: 0,
+      fWorkorderid: 0,
       current: page.value.current,
       size: page.value.size,
     };
-    const response = await createPageData(`/woworkorderbase/searchWorkzngz`, data)
+    
+    const response = await createPageData(`/woworkorderbase/searchWorkGState`, data)
     if (response && response.status === 200) {
-      // 处理汇总数据
-      if (response.data.type && Array.isArray(response.data.type)) {
-        // 确保数据长度足够（重复显示如果不够）
-        let processedSummary = [...response.data.type]
-        while (processedSummary.length < 6) {
-          processedSummary = [...processedSummary, ...response.data.type]
-        }
-        summaryList.value = processedSummary.slice(0, 6)
-      } else {
-        // 如果没有汇总数据，使用默认汇总数据
-        useDefaultSummaryData()
-      }
+      // 更新总数量
+      total.value = response.data.total || 0;
+      totalCount.value = response.data.total || 0;
       
       // 处理预警列表数据
-      if (response.data.workOrderList && Array.isArray(response.data.workOrderList) && response.data.workOrderList.length > 0) {
-        warningList.value = response.data.workOrderList.map(item => {
-          // 处理预警等级映射
-          let level = 'medium'
-          let levelText = '中'
-          
-          if (item.level === 'high' || item.levelText === '高' || item.level === '1') {
-            level = 'high'
-            levelText = '高'
-          } else if (item.level === 'low' || item.levelText === '低' || item.level === '3') {
-            level = 'low'
-            levelText = '低'
-          }
-          
-          return {
-            type: item.type || item.warningType || '未知预警',
-            location: item.location || item.address || '未知位置',
-            level: level,
-            levelText: levelText,
-            time: item.time || item.createTime || formatDate(new Date())
-          }
-        })
+      if (response.data.data && Array.isArray(response.data.data)) {
+        warningList.value = response.data.data.map(item => ({
+          ...item,
+          fWorkordertype: item.fWorkordertype || '未知类型',
+          riskclassifyname: item.riskclassifyname || '未知事件',
+          pushTime: formatDateTime(item.pushtime) || '-',
+          checkdept: item.checkdept || '-',
+          fEndtime: formatDateTime(item.fEndtime) || '-',
+          distributedept: item.distributedept || '-',
+          status: item.fState || '未知状态',
+        }))
       } else {
-        // 如果没有预警列表数据，使用默认预警数据
-        useDefaultWarningData()
+        warningList.value = []
       }
-      
-    } else {
-      console.warn('接口返回数据格式不正确，使用默认数据')
-      useDefaultData()
     }
   } catch (error) {
     console.error('获取预警数据失败:', error)
-    useDefaultData()
+    warningList.value = []
+  }
+}
+
+// 获取超期数量
+const fetchOvertimeCount = async () => {
+  try {
+    const data = {
+      ...props.options,
+      deptType: 1,
+      fCode: "",
+      fOvertimes: 1, // 设置为1获取超期数量
+      current: 1,
+      size: 1,
+    };
+    
+    const response = await createPageData(`/woworkorderbase/searchWorkGState`, data)
+    if (response && response.status === 200) {
+      overtimeCount.value = response.data.total || 0
+    }
+  } catch (error) {
+    console.error('获取超期数量失败:', error)
+  }
+}
+
+// 格式化日期时间
+const formatDateTime = (dateTime) => {
+  if (!dateTime) return ''
+  // 假设dateTime已经是格式化好的字符串，如果需要其他格式可以在这里处理
+  return dateTime
+}
+
+// 分页处理函数
+const handlePageChange = (pageNum) => {
+  if (pageNum !== page.value.current) {
+    page.value.current = pageNum
+    fetchWarningData()
+  }
+}
+
+const handlePrevPage = () => {
+  if (page.value.current > 1) {
+    page.value.current--
+    fetchWarningData()
+  }
+}
+
+const handleNextPage = () => {
+  if (page.value.current < totalPages.value) {
+    page.value.current++
+    fetchWarningData()
   }
 }
 
 // 关闭弹框
-function handleClose() {
+const handleClose = () => {
   emit('update:visible', false)
   emit('close')
 }
 
-// 组件挂载时获取数据
-onMounted(() => {
-  fetchWarningData()
-})
+// 处理行双击事件
+const handleRowDoubleClick = (item) => {
+  // 隐藏当前组件
+  emit('update:visible', false)
+  // 设置选中的工单ID并显示详情组件
+  selectedWorkOrderId.value = item.fWorkorderid || ''
+  showDetail.value = true
+}
+
+// 监听visible变化，当显示时重新获取数据
+watch(
+  () => props.visible,
+  (newVal) => {
+    if (newVal) {
+      // 重置页码
+      console.log('visible变化:', props.visible)
+      page.value.current = 1
+      // 获取数据
+      fetchWarningData()
+      fetchOvertimeCount()
+    }
+  },
+  { immediate: true }
+)
+
+// 监听options变化，重新获取数据
+watch(
+  () => props.options,
+  () => {
+    if (props.visible) {
+      console.log('options变化:', props.options)
+      page.value.current = 1
+      fetchWarningData()
+      fetchOvertimeCount()
+    }
+  },
+  { deep: true }
+)
 </script>
 
 <style scoped>
@@ -176,7 +335,7 @@ onMounted(() => {
   position: fixed;
   z-index: 9999;
   inset: 0;
-  background: rgba(0, 10, 30, 0.8);
+  /* background: rgba(0, 10, 30, 0.8); */
   display: flex;
   align-items: center;
   justify-content: center;
@@ -232,10 +391,12 @@ onMounted(() => {
   border-radius: 4px;
   cursor: pointer;
   transition: all 0.3s ease;
+  padding: 0px;
 }
 
 .project-info-close:hover {
   background: rgba(0, 40, 80, 0.8);
+  color: #ffffff;
   box-shadow: 0 0 10px rgba(0, 153, 255, 0.6);
 }
 
@@ -351,6 +512,47 @@ onMounted(() => {
   font-weight: 500;
 }
 
+.status-processing {
+  color: #0099ff;
+  font-weight: 500;
+}
+
+.status-pending {
+  color: #ffcc00;
+  font-weight: 500;
+}
+
+.status-overtime {
+  color: #ff0000;
+  font-weight: 500;
+}
+
+.status-unknown {
+  color: #999999;
+  font-weight: 500;
+}
+
+/* 超期数量样式 */
+.stat-value.overtime {
+  color: #ff0000;
+}
+
+/* 无数据提示 */
+.no-data {
+  text-align: center;
+  padding: 40px 20px;
+  color: #666666;
+  font-size: 14px;
+}
+
+/* 页码省略号 */
+.pagination-ellipsis {
+  color: #66CCFF;
+  font-size: 14px;
+  margin: 0 4px;
+  cursor: default;
+}
+
 /* 分页样式 */
 .pagination-container {
   display: flex;