Merge branch 'master' of http://192.168.1.222:3000/jiayi/zl-zhyl-web

bigScreen3/src/api/index.js

@@ -11,6 +11,15 @@ export function login(data) {
     data: {data}
   })
 }
+export function getOldPageListData(url, data) {
+  console.log(url , data)
+  // 'woworkorderbase/searchWorkGState'
+  return request({
+    url,
+    method: 'get',
+    data: {data}
+  })
+}
 // 列表
 export function getPageListData(url, queryInfo) {
   // console.log(url, 'getPageListData')
@@ -37,6 +46,8 @@ export function createPageData(url, data) {
     data: {data}
   })
 }
+
+
 // 修改
 export function editPageData(url, editData) {
   return request({

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

@@ -1,5 +1,66 @@
 <template>
   <div class="wisdom-discovery">
+    <!-- 工单列表弹框 -->
+    <el-dialog
+      v-model="workOrderDialogVisible"
+      title="工单列表"
+      :modal="false"
+      width="80%"
+      class="work-order-dialog"
+      :border="false"
+      
+    >
+      <el-table
+        :data="workOrderList"
+        style="width: 100%; height:432px;border: none !important;"
+        :header-cell-style="{ background: '#0c1e3e', color: '#62ABEB',border: 'none' }"
+        :cell-style="{ background: '#0a1e40', color: '#D0DEEE',border: 'none' }"
+      >
+        <el-table-column
+          prop="discoverMethod"
+          label="发现方式"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="typeName"
+          label="事项类型"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="pushtime"
+          label="推送时间"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="pushDept"
+          label="推送部门"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="receiveDept"
+          label="接收部门"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="fState"
+          label="处置状态"
+        >
+        </el-table-column>
+      </el-table>
+      <!-- 分页组件 -->
+      <div class="pagination-container" style="margin-top: 20px;">
+        <el-pagination
+          v-model:current-page="currentPage"
+          v-model:page-size="pageSize"
+          :page-sizes="[10, 20, 50, 100]"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="totalWorkOrders"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          style="color: #fff; background-color: #002461;"
+        />
+      </div>
+    </el-dialog>
     <!-- 2x2 网格布局 -->
     <div class="discovery-grid">
       <!-- 左上：累计发现 -->
@@ -10,7 +71,10 @@
             <img src="@/assets/icon1.png" alt="累计发现" class="icon-wrapper" />
           </div>
           <div class="metric-content">
-            <div class="metric-number">{{ discoveryStats.totalDiscovery.toLocaleString() }}</div>
+            <div 
+              class="metric-number cursor-pointer"
+              @click="handleTotalDiscoveryClick"
+            >{{ discoveryStats.totalDiscovery.toLocaleString() }}</div>
             <div class="metric-label">累计发现</div>
           </div>
         </div>
@@ -83,7 +147,8 @@
 
 <script setup>
 import { computed, ref, onMounted, watch } from 'vue'
-import { getPageListData } from '@/api/index'
+import { getPageListData,createPageData } from '@/api/index'
+import { ElDialog, ElTable, ElTableColumn, ElPagination } from 'element-plus'
 
 // 定义 props
 const props = defineProps({
@@ -102,6 +167,13 @@ 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
 
@@ -145,6 +217,71 @@ const unresolvedSegments = computed(() => {
   const filledCount = Math.round((discoveryStats.value.unresolved / discoveryStats.value.totalDiscovery) * totalSegments)
   return Array(totalSegments).fill(false).map((_, i) => i < filledCount)
 })
+
+// 处理累计发现点击事件
+const handleTotalDiscoveryClick = async () => {
+  // 重置为第一页
+  currentPage.value = 1
+  workOrderDialogVisible.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>
@@ -208,6 +345,16 @@ const unresolvedSegments = computed(() => {
             -webkit-text-fill-color: transparent;
           }
           
+          .cursor-pointer {
+            cursor: pointer;
+            transition: all 0.3s ease;
+          }
+          
+          .cursor-pointer:hover {
+            transform: scale(1.05);
+            filter: brightness(1.2);
+          }
+          
           .metric-label {
             font-size: 0.7vw;
             color: #677693;
@@ -379,5 +526,122 @@ const unresolvedSegments = computed(() => {
     }
   }
 }
+
+// 弹框样式
+:deep(.work-order-dialog) {
+  background-color:rgba(0, 45, 117, 0.9) ;
+  
+  .el-dialog {
+    background: linear-gradient(135deg, #081E3E 0%, #0A1633 100%);
+    border: 1px solid rgba(7, 185, 255, 0.3);
+    box-shadow: 0 0 20px rgba(7, 185, 255, 0.2);
+    border-radius: 8px;
+  }
+  
+  .el-dialog__header {
+    border-bottom: 1px solid rgba(7, 185, 255, 0.3);
+  }
+  
+  .el-dialog__title {
+    color: #62ABEB;
+    font-size: 1.2vw;
+  }
+  
+  .el-dialog__headerbtn .el-dialog__close {
+    color: #62ABEB;
+  }
+  
+  .el-table {
+    background: #002461 !important;
+    border-color: none;
+  }
+  .el-table__row:hover {
+    background: rgba(7, 185, 255, 0.2) !important;
+  }
+    
+}
+  // 分页样式
+      .pagination-container {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+      }
+      
+      // 总数文本
+      :deep(.el-pagination__total) {
+        color: #fff !important;
+      }
+      
+      // 页面大小选择
+      :deep(.el-pagination__sizes .el-input__inner) {
+        color: #fff !important;
+        background-color: #002461 !important;
+        border: 1px solid rgba(7, 185, 255, 0.3) !important;
+      }
+      
+      // 跳转输入框
+      :deep(.el-pagination__jump .el-input__inner) {
+        color: #fff !important;
+        background-color: #002461 !important;
+        border: 1px solid rgba(7, 185, 255, 0.3) !important;
+      }
+      
+      // 箭头按钮
+      :deep(.el-pagination button) {
+        color: #fff !important;
+        background-color: #002461 !important;
+        border: 1px solid rgba(7, 185, 255, 0.3) !important;
+      }
+      
+      // 按钮悬停效果
+      :deep(.el-pagination button:hover:not(:disabled)) {
+        color: #fff !important;
+        background-color: #00307a !important;
+        border-color: rgba(7, 185, 255, 0.6) !important;
+      }
+      
+      // 页码样式
+      :deep(.el-pager li) {
+        color: #fff !important;
+        background-color: #002461 !important;
+      }
+      
+      // 激活状态页码
+      :deep(.el-pager li.is-active) {
+        color: #fff !important;
+        background-color: #0056b3 !important;
+      }
+      
+      // 页码悬停效果
+      :deep(.el-pager li:hover:not(.is-active)) {
+        color: #fff !important;
+        background-color: #00307a !important;
+      }
+      
+      // 下拉菜单样式
+      :deep(.el-select-dropdown) {
+        background-color: #002461 !important;
+        border: 1px solid rgba(7, 185, 255, 0.3) !important;
+      }
+      :deep(.el-select__wrapper) {
+        background-color: #002461 !important;
+        border: 1px solid rgba(7, 185, 255, 0.3) !important;
+      }
+      :deep(.el-input__wrapper) {
+        color: #fff !important;
+        background-color: #002461 !important;
+        border:none !important;
+      }
+      :deep(.el-select-dropdown__item) {
+        color: #fff !important;
+      }
+      
+      :deep(.el-select-dropdown__item:hover) {
+        background-color: #00307a !important;
+      }
+      
+      :deep(.el-select-dropdown__item.selected) {
+        background-color: #00307a !important;
+      }
 </style>