Explorar o código

Merge branch 'master' of http://39.97.59.228:8013/hrx/mky-vent-base

lxh hai 5 meses
pai
achega
d6b99d20c0
Modificáronse 23 ficheiros con 1220 adicións e 91 borrados
  1. 1 1
      .env
  2. BIN=BIN
      src/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb-1.png
  3. BIN=BIN
      src/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb-2.png
  4. BIN=BIN
      src/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb-3.png
  5. BIN=BIN
      src/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb-4.png
  6. BIN=BIN
      src/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb-5.png
  7. BIN=BIN
      src/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb1.png
  8. BIN=BIN
      src/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb2.png
  9. BIN=BIN
      src/assets/images/sealedGoaf/configurable/table/table1-label.png
  10. BIN=BIN
      src/assets/images/sealedGoaf/views/home/module-title.png
  11. 3 5
      src/components/AIChat/MiniChat.vue
  12. 0 9
      src/views/monitor/quartz/index1.vue
  13. 0 48
      src/views/monitor/quartz/quartz.api.ts
  14. 747 0
      src/views/sealedGoafSys/home/configurable.data.sealedGoaf.ts
  15. 138 0
      src/views/sealedGoafSys/home/sealedGoaf.vue
  16. 71 18
      src/views/vent/dataCenter/deviceCenter/index.vue
  17. 20 2
      src/views/vent/dataCenter/infoCenter/index.vue
  18. 35 5
      src/views/vent/dataCenter/infoCenter/infoCenter.data.ts
  19. 4 1
      src/views/vent/dataCenter/stationCenter/index.vue
  20. 11 2
      src/views/vent/deviceManager/configurationTable/types.ts
  21. 4 0
      src/views/vent/home/configurable/components/detail/CustomChart.vue
  22. 37 0
      src/views/vent/home/configurable/components/detail/CustomTable.vue
  23. 149 0
      src/views/vent/home/configurable/components/detail/MiniBoard.vue

+ 1 - 1
.env

@@ -1,5 +1,5 @@
 # port
-VITE_PORT = 3100
+VITE_PORT = 8062
 
 #  网站标题
 VITE_GLOB_APP_TITLE = 智能通风管控系统

BIN=BIN
src/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb-1.png


BIN=BIN
src/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb-2.png


BIN=BIN
src/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb-3.png


BIN=BIN
src/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb-4.png


BIN=BIN
src/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb-5.png


BIN=BIN
src/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb1.png


BIN=BIN
src/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb2.png


BIN=BIN
src/assets/images/sealedGoaf/configurable/table/table1-label.png


BIN=BIN
src/assets/images/sealedGoaf/views/home/module-title.png


+ 3 - 5
src/components/AIChat/MiniChat.vue

@@ -199,9 +199,9 @@
 </template>
 
 <script lang="ts" setup>
-import VueOfficePdf from '@vue-office/pdf';
-import VueOfficeDocx from '@vue-office/docx';
-import VueOfficeExcel from '@vue-office/excel';
+import VueOfficePdf from '@vue-office/pdf/lib/v3/vue-office-pdf.mjs';
+import VueOfficeDocx from '@vue-office/docx/lib/v3/vue-office-docx.mjs';
+import VueOfficeExcel from '@vue-office/excel/lib/v3/vue-office-excel.mjs';
 import { ref, onMounted, nextTick } from 'vue';
 import { SvgIcon } from '../Icon';
 import { Space, Button, Modal, Input, message } from 'ant-design-vue';
@@ -221,8 +221,6 @@ import { createVNode } from 'vue';
 import { marked } from 'marked';
 import katex from 'katex';
 import 'katex/dist/katex.min.css';
-import '@vue-office/excel/lib/index.css';
-import '@vue-office/docx/lib/index.css';
 const TextArea = Input.TextArea; // 直接导入TextArea组件使用时打包报错
 const inputText = ref(''); // 输入框内容
 const refreshText = ref(''); //重新生成文本

+ 0 - 9
src/views/monitor/quartz/index1.vue

@@ -42,8 +42,6 @@ import { useModal } from '/@/components/Modal';
 import { useListPage } from '/@/hooks/system/useListPage';
 import {
   getDataCenterList,
-  getDataCenterExportUrl,
-  getDataCenterImportUrl,
   deleteDataCenterQuartz,
   batchDataCenterDeleteQuartz,
   resumeDataCenterJob,
@@ -72,13 +70,6 @@ const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
       fieldMapToTime: [['fieldTime', ['beginDate', 'endDate'], 'YYYY-MM-DD HH:mm:ss']],
     },
   },
-  exportConfig: {
-    name: '定时任务列表',
-    url: getDataCenterExportUrl,
-  },
-  importConfig: {
-    url: getDataCenterImportUrl,
-  },
 });
 
 const [registerTable, { reload }, { rowSelection, selectedRowKeys }] = tableContext;

+ 0 - 48
src/views/monitor/quartz/quartz.api.ts

@@ -15,16 +15,8 @@ enum Api {
   deleteBatch = '/ventanaly/quartzJob/deleteBatch',
   //数据中心
   dataCenterList = '/dataCenter/ventanaly/quartzJob/list',
-  //数据采集 collect  数据分析  compute  应用  monitor    ------启动  resume   停止  pause  立即执行 execute
-  collect = '/dataCenter/collect/quartzJob/resume',
-  compute = '/dataCenter/compute/quartzJob/pause',
   dataCentersave = '/dataCenter/ventanaly/quartzJob/add',
   dataCenteredit = '/dataCenter/ventanaly/quartzJob/edit',
-  dataCenterget = '/dataCenter/ventanaly/quartzJob/queryById',
-  dataCenterdelete = '/dataCenter/ventanaly/quartzJob/delete',
-  dataCenterexportXlsUrl = '/dataCenter/ventanaly/quartzJob/exportXls',
-  dataCenterimportExcelUrl = '/dataCenter/ventanaly/quartzJob/importExcel',
-  dataCenterdeleteBatch = '/dataCenter/ventanaly/quartzJob/deleteBatch',
 }
 
 /**
@@ -123,21 +115,9 @@ export const batchDeleteQuartz = (params, handleSuccess) => {
  */
 export const getDataCenterList = (params) =>
   defHttp.get({
-    headers: {
-      'X-Access-Token':
-        'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VybmFtZSI6ImFkbWluIiwiZXhwIjoxNzU5ODQxMTcwfQ.fHaM3l-d88tUSLOs8sstXsDuSCn6Agbj_EMZMgV6waw',
-    },
     url: Api.dataCenterList,
     params,
   });
-/**
- * 导出api
- */
-export const getDataCenterExportUrl = Api.exportXlsUrl;
-/**
- * 导入api
- */
-export const getDataCenterImportUrl = Api.importExcelUrl;
 
 /**
  * 保存或者更新任务
@@ -146,10 +126,6 @@ export const getDataCenterImportUrl = Api.importExcelUrl;
 export const dataCenterSaveOrUpdateQuartz = (params, isUpdate) => {
   let url = isUpdate ? Api.dataCenteredit : Api.dataCentersave;
   return defHttp.post({
-    headers: {
-      'X-Access-Token':
-        'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VybmFtZSI6ImFkbWluIiwiZXhwIjoxNzU5ODQxMTcwfQ.fHaM3l-d88tUSLOs8sstXsDuSCn6Agbj_EMZMgV6waw',
-    },
     url: url,
     params,
   });
@@ -161,10 +137,6 @@ export const dataCenterSaveOrUpdateQuartz = (params, isUpdate) => {
  */
 export const getDataCenterQuartzById = (params) => {
   return defHttp.get({
-    headers: {
-      'X-Access-Token':
-        'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VybmFtZSI6ImFkbWluIiwiZXhwIjoxNzU5ODQxMTcwfQ.fHaM3l-d88tUSLOs8sstXsDuSCn6Agbj_EMZMgV6waw',
-    },
     url: Api.get,
     params,
   });
@@ -178,10 +150,6 @@ export const deleteDataCenterQuartz = (params, handleSuccess) => {
   return defHttp
     .delete(
       {
-        headers: {
-          'X-Access-Token':
-            'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VybmFtZSI6ImFkbWluIiwiZXhwIjoxNzU5ODQxMTcwfQ.fHaM3l-d88tUSLOs8sstXsDuSCn6Agbj_EMZMgV6waw',
-        },
         url: Api.delete,
         data: params,
       },
@@ -205,10 +173,6 @@ export const batchDataCenterDeleteQuartz = (params, handleSuccess) => {
       return defHttp
         .delete(
           {
-            headers: {
-              'X-Access-Token':
-                'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VybmFtZSI6ImFkbWluIiwiZXhwIjoxNzU5ODQxMTcwfQ.fHaM3l-d88tUSLOs8sstXsDuSCn6Agbj_EMZMgV6waw',
-            },
             url: Api.deleteBatch,
             data: params,
           },
@@ -231,10 +195,6 @@ export const resumeDataCenterJob = (params: any, sysType: string, operation: str
   const apiPath = generateApiPath(currentModule, operation);
   return defHttp
     .get({
-      headers: {
-        'X-Access-Token':
-          'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VybmFtZSI6ImFkbWluIiwiZXhwIjoxNzU5ODQxMTcwfQ.fHaM3l-d88tUSLOs8sstXsDuSCn6Agbj_EMZMgV6waw',
-      },
       url: apiPath,
       params,
     })
@@ -249,10 +209,6 @@ export const pauseDataCenterJob = (params: any, sysType: String, operation: Stri
   const apiPath = generateApiPath(currentModule, operation);
   return defHttp
     .get({
-      headers: {
-        'X-Access-Token':
-          'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VybmFtZSI6ImFkbWluIiwiZXhwIjoxNzU5ODQxMTcwfQ.fHaM3l-d88tUSLOs8sstXsDuSCn6Agbj_EMZMgV6waw',
-      },
       url: apiPath,
       params,
     })
@@ -267,10 +223,6 @@ export const excuteDataCenterJob = (params: any, sysType: String, operation: Str
   const apiPath = generateApiPath(currentModule, operation);
   return defHttp
     .get({
-      headers: {
-        'X-Access-Token':
-          'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VybmFtZSI6ImFkbWluIiwiZXhwIjoxNzU5ODQxMTcwfQ.fHaM3l-d88tUSLOs8sstXsDuSCn6Agbj_EMZMgV6waw',
-      },
       url: apiPath,
       params,
     })

+ 747 - 0
src/views/sealedGoafSys/home/configurable.data.sealedGoaf.ts

@@ -0,0 +1,747 @@
+import type { Config } from '@/views/vent/deviceManager/configurationTable/types';
+
+export const testConfigSealedGoaf: Config[] = [
+  // 1. 矿井状况
+  {
+    deviceType: 'goafsInfo',
+    moduleName: '矿井状况',
+    pageType: 'sealed_goaf',
+    moduleData: {
+      header: {
+        show: false,
+        readFrom: '',
+        selector: { show: false, value: '' },
+        slot: { show: false, value: '' },
+      },
+      background: { show: false, type: 'video', link: '' },
+      layout: {
+        direction: 'row',
+        items: [{ name: 'board', basis: '100%' }],
+      },
+      list: [],
+      board: [
+        {
+          type: 'CKQMB',
+          readFrom: '',
+          layout: 'label-top',
+          items: [
+            {
+              label: '生产矿井',
+              value: '219',
+            },
+            {
+              label: '建设矿井',
+              value: '219',
+            },
+            {
+              label: '停产停建',
+              value: '17',
+            },
+            {
+              label: '长期停产停建',
+              value: '17',
+            },
+            {
+              label: '实施关闭',
+              value: '2',
+            },
+            {
+              label: '情况变化',
+              value: '1',
+            },
+          ],
+        },
+      ],
+      chart: [],
+      gallery: [],
+      gallery_list: [],
+      table: [],
+      complex_list: [],
+      preset: [],
+    },
+    showStyle: {
+      size: 'width:440px;height:200px;',
+      version: '原版',
+      position: 'top:30px;left:10px;',
+      headerPosition: 'centerBottom',
+    },
+  },
+  // 2. 当日生产状态
+  {
+    deviceType: 'spray_auto',
+    moduleName: '当日生产状态',
+    pageType: 'sealed_goaf',
+    moduleData: {
+      header: {
+        show: false,
+        readFrom: '',
+        selector: { show: false, value: '' },
+        slot: { show: false, value: '' },
+      },
+      background: { show: false, type: 'video', link: '' },
+      layout: {
+        direction: 'row',
+        items: [{ name: 'board', basis: '100%' }],
+      },
+      list: [],
+      board: [
+        {
+          type: 'CKQMB',
+          readFrom: '',
+          layout: 'label-top',
+          items: [
+            {
+              label: '正在生产',
+              value: '210',
+            },
+            {
+              label: '正在建设',
+              value: '27',
+            },
+            {
+              label: '停产',
+              value: '17',
+            },
+            {
+              label: '停工',
+              value: '1',
+            },
+          ],
+        },
+      ],
+      chart: [],
+      gallery: [],
+      gallery_list: [],
+      table: [],
+      complex_list: [],
+      preset: [],
+    },
+    showStyle: {
+      size: 'width:440px;height:150px;',
+      version: '原版',
+      position: 'top:225px;left:10px;',
+    },
+  },
+  // 3. 煤层自燃倾向性
+  {
+    deviceType: 'deviceInfo',
+    moduleName: '煤层自燃倾向性',
+    pageType: 'sealed_goaf',
+    moduleData: {
+      header: {
+        show: false,
+        readFrom: '',
+        selector: {
+          show: false,
+          value: '',
+        },
+        slot: {
+          show: false,
+          value: '',
+        },
+      },
+      background: {
+        show: false,
+        type: 'video',
+        link: '',
+      },
+      layout: {
+        direction: 'column',
+        items: [
+          {
+            name: 'chart',
+            basis: '100%',
+          },
+        ],
+      },
+      chart: [
+        {
+          type: 'pie_drag',
+          readFrom: '',
+          legend: { show: false, formatter: '{b}:{c}\n{d}%' },
+          xAxis: [{ show: false }],
+          yAxis: [{ show: false, name: '风量', position: 'left' }],
+          series: [{ readFrom: 'piechart', xprop: 'pos', yprop: 'val', label: '' }],
+        },
+      ],
+      gallery: [],
+      gallery_list: [],
+      table: [],
+      list: [],
+      complex_list: [],
+      preset: [],
+      mock: {
+        piechart: [
+          { pos: 'Ⅰ类容易自燃', val: 50 },
+          { pos: 'Ⅱ类自燃', val: 80 },
+          { pos: 'Ⅲ类不易自燃', val: 40 },
+        ],
+      },
+    },
+    showStyle: {
+      size: 'width:440px;height:210px;',
+      version: '原版',
+      position: 'top:370px;left:10px;',
+      headerPosition: 'centerBottom',
+    },
+  },
+  // 4. 联网状态
+  {
+    deviceType: 'coalFireFeature',
+    moduleName: '联网状态',
+    pageType: 'sealed_goaf',
+    moduleData: {
+      header: {
+        show: false,
+        readFrom: '',
+        selector: {
+          show: true,
+          value: '',
+        },
+        slot: {
+          show: false,
+          value: '',
+        },
+      },
+      background: {
+        show: false,
+        type: 'video',
+        link: '',
+      },
+      layout: {
+        direction: 'column',
+        items: [
+          {
+            name: 'board',
+            basis: '40%',
+            overflow: true,
+          },
+          {
+            name: 'table',
+            basis: '60%',
+            overflow: true,
+          },
+        ],
+      },
+      board: [
+        {
+          type: 'CKQMB0',
+          readFrom: '',
+          layout: 'val-top',
+          items: [
+            {
+              label: '应接入',
+              value: '210',
+            },
+            {
+              label: '在线',
+              value: '27',
+            },
+            {
+              label: '中断',
+              value: '17',
+            },
+            {
+              label: '未接入',
+              value: '1',
+            },
+          ],
+        },
+      ],
+      chart: [],
+      gallery: [],
+      gallery_list: [],
+      table: [
+        {
+          type: 'CKQMB',
+          // parser: 'json',
+          readFrom: 'tableArray',
+          columns: [
+            {
+              name: ' ',
+              prop: 'index',
+            },
+            {
+              name: '应接入',
+              prop: 'yjr',
+            },
+            {
+              name: '在线',
+              prop: 'zx',
+            },
+            {
+              name: '中断',
+              prop: 'zd',
+            },
+            {
+              name: '未接入',
+              prop: 'wjr',
+            },
+          ],
+        },
+      ],
+      list: [],
+      complex_list: [],
+      preset: [],
+      mock: {
+        boardArray: [
+          {
+            label: '低风险',
+            value: '210',
+          },
+          {
+            label: '一般风险',
+            value: '27',
+          },
+          {
+            label: '较高风险',
+            value: '17',
+          },
+          {
+            label: '高风险',
+            value: '1',
+          },
+        ],
+        tableArray: [
+          {
+            index: '执法一处',
+            yjr: '73',
+            zx: '73',
+            zd: '0',
+            wjr: '0',
+          },
+          {
+            index: '执法二处',
+            yjr: '73',
+            zx: '73',
+            zd: '0',
+            wjr: '0',
+          },
+          {
+            index: '执法三处',
+            yjr: '73',
+            zx: '73',
+            zd: '0',
+            wjr: '0',
+          },
+          {
+            index: '执法四处',
+            yjr: '73',
+            zx: '73',
+            zd: '0',
+            wjr: '0',
+          },
+        ],
+      },
+    },
+    showStyle: {
+      size: 'width:440px;height:290px;',
+      version: '原版',
+      position: 'top:570px;left:10px;',
+    },
+  },
+  // 5. 密闭情况总览
+  {
+    deviceType: '',
+    moduleName: '密闭情况总览',
+    pageType: 'sealed_goaf',
+    moduleData: {
+      header: {
+        show: false,
+        readFrom: '',
+        selector: {
+          show: true,
+          value: '',
+        },
+        slot: {
+          show: false,
+          value: '',
+        },
+      },
+      background: {
+        show: false,
+        type: 'video',
+        link: '',
+      },
+      layout: {
+        direction: 'column',
+        items: [
+          {
+            name: 'board',
+            basis: '30%',
+            overflow: true,
+          },
+          {
+            name: 'table',
+            basis: '70%',
+            overflow: true,
+          },
+        ],
+      },
+      board: [
+        {
+          type: 'CKQMB1',
+          readFrom: '',
+          layout: 'val-top',
+          items: [
+            {
+              label: '低风险',
+              value: '210',
+            },
+            {
+              label: '一般风险',
+              value: '27',
+            },
+            {
+              label: '较高风险',
+              value: '17',
+            },
+            {
+              label: '高风险',
+              value: '1',
+            },
+          ],
+        },
+      ],
+      chart: [],
+      gallery: [],
+      gallery_list: [],
+      table: [
+        {
+          type: 'CKQMB',
+          // parser: 'json',
+          readFrom: 'tableArray',
+          columns: [
+            {
+              name: ' ',
+              prop: 'index',
+            },
+            {
+              name: '低风险',
+              prop: 'dfx',
+            },
+            {
+              name: '一般风险',
+              prop: 'ybfx',
+            },
+            {
+              name: '较高风险',
+              prop: 'jgfx',
+            },
+            {
+              name: '高风险',
+              prop: 'gfx',
+            },
+          ],
+        },
+      ],
+      list: [],
+      complex_list: [],
+      preset: [],
+      mock: {
+        boardArray: [
+          {
+            label: '低风险',
+            value: '210',
+          },
+          {
+            label: '一般风险',
+            value: '27',
+          },
+          {
+            label: '较高风险',
+            value: '17',
+          },
+          {
+            label: '高风险',
+            value: '1',
+          },
+        ],
+        tableArray: [
+          {
+            index: '执法一处',
+            dfx: '50',
+            ybfx: '20',
+            jgfx: '0',
+            gfx: '0',
+          },
+          {
+            index: '执法二处',
+            dfx: '50',
+            ybfx: '20',
+            jgfx: '0',
+            gfx: '0',
+          },
+          {
+            index: '执法三处',
+            dfx: '50',
+            ybfx: '20',
+            jgfx: '0',
+            gfx: '0',
+          },
+          {
+            index: '执法四处',
+            dfx: '50',
+            ybfx: '20',
+            jgfx: '0',
+            gfx: '0',
+          },
+          {
+            index: '执法五处',
+            dfx: '50',
+            ybfx: '20',
+            jgfx: '0',
+            gfx: '0',
+          },
+          {
+            index: '执法六处',
+            dfx: '50',
+            ybfx: '20',
+            jgfx: '0',
+            gfx: '0',
+          },
+        ],
+      },
+    },
+    showStyle: {
+      size: 'width:440px;height:355px;',
+      version: '原版',
+      position: 'top:10px;right:10px;',
+    },
+  },
+  // 6. 采空区密闭预警分析
+  {
+    deviceType: 'goafMonitoring',
+    moduleName: '采空区密闭预警分析',
+    pageType: 'sealed_goaf',
+    moduleData: {
+      header: {
+        show: false,
+        readFrom: '',
+        selector: {
+          show: true,
+          value: '',
+        },
+        slot: {
+          show: false,
+          value: '',
+        },
+      },
+      background: {
+        show: false,
+        type: 'video',
+        link: '',
+      },
+      layout: {
+        direction: 'column',
+        items: [
+          {
+            name: 'board',
+            basis: '40%',
+            overflow: true,
+          },
+          {
+            name: 'table',
+            basis: '60%',
+            overflow: true,
+          },
+        ],
+      },
+      board: [
+        {
+          type: 'CKQMB1',
+          readFrom: '',
+          layout: 'val-top',
+          items: [
+            {
+              label: '低风险',
+              value: '210',
+            },
+            {
+              label: '一般风险',
+              value: '27',
+            },
+            {
+              label: '较高风险',
+              value: '17',
+            },
+            {
+              label: '高风险',
+              value: '1',
+            },
+          ],
+        },
+      ],
+      chart: [],
+      gallery: [],
+      gallery_list: [],
+      table: [
+        {
+          type: 'CKQMB',
+          // parser: 'json',
+          readFrom: 'tableArray',
+          columns: [
+            {
+              name: ' ',
+              prop: 'index',
+            },
+            {
+              name: '低风险',
+              prop: 'dfx',
+            },
+            {
+              name: '一般风险',
+              prop: 'ybfx',
+            },
+            {
+              name: '较高风险',
+              prop: 'jgfx',
+            },
+            {
+              name: '高风险',
+              prop: 'gfx',
+            },
+          ],
+        },
+      ],
+      list: [],
+      complex_list: [],
+      preset: [],
+      mock: {
+        boardArray: [
+          {
+            label: '低风险',
+            value: '210',
+          },
+          {
+            label: '一般风险',
+            value: '27',
+          },
+          {
+            label: '较高风险',
+            value: '17',
+          },
+          {
+            label: '高风险',
+            value: '1',
+          },
+        ],
+        tableArray: [
+          {
+            index: '执法一处',
+            dfx: '50',
+            ybfx: '20',
+            jgfx: '0',
+            gfx: '0',
+          },
+          {
+            index: '执法二处',
+            dfx: '50',
+            ybfx: '20',
+            jgfx: '0',
+            gfx: '0',
+          },
+          {
+            index: '执法三处',
+            dfx: '50',
+            ybfx: '20',
+            jgfx: '0',
+            gfx: '0',
+          },
+        ],
+      },
+    },
+    showStyle: {
+      size: 'width:440px;height:300px;',
+      version: '原版',
+      position: 'top:365px;right:10px;',
+    },
+  },
+  // 7. 当日报警情况统计
+  {
+    deviceType: 'RealtimeMonitor',
+    moduleName: '当日报警情况统计',
+    pageType: 'sealed_goaf',
+    moduleData: {
+      header: {
+        show: false,
+        readFrom: '',
+        selector: {
+          show: false,
+          value: '',
+        },
+        slot: {
+          show: false,
+          value: '',
+        },
+      },
+      background: {
+        show: false,
+        type: 'video',
+        link: '',
+      },
+      layout: {
+        direction: 'row',
+        items: [
+          {
+            name: 'board',
+            basis: '100%',
+          },
+        ],
+      },
+      board: [
+        {
+          type: 'CKQMB2',
+          readFrom: '',
+          layout: 'val-top',
+          items: [
+            {
+              label: 'CO超限',
+              value: '210',
+            },
+            {
+              label: 'CH4超限',
+              value: '27',
+            },
+            {
+              label: 'C2H4超限',
+              value: '17',
+            },
+            {
+              label: 'C2H2超限',
+              value: '1',
+            },
+            {
+              label: 'O2超限',
+              value: '210',
+            },
+            {
+              label: '温度超限',
+              value: '27',
+            },
+            {
+              label: '压差超限',
+              value: '17',
+            },
+            {
+              label: '设备断连',
+              value: '1',
+            },
+          ],
+        },
+      ],
+      chart: [],
+      gallery: [],
+      gallery_list: [],
+      table: [],
+      list: [],
+      complex_list: [],
+      preset: [],
+    },
+    showStyle: {
+      size: 'width:440px;height:210px;',
+      version: '原版',
+      position: 'top:660px;right:10px;',
+    },
+  },
+];

+ 138 - 0
src/views/sealedGoafSys/home/sealedGoaf.vue

@@ -0,0 +1,138 @@
+<!-- eslint-disable vue/multi-word-component-names -->
+<template>
+  <div class="company-home">
+    <div class="title-select-area">
+      <a-select
+        class="title-select"
+        ref="select"
+        v-model:value="deviceId"
+        @change="handleDeviceChange"
+        popupClassName="drop"
+        :field-names="fieldNames"
+        :options="selectorOptions"
+        :dropdownStyle="{
+          width: '380px',
+          background: 'transparent',
+          borderBottom: '1px solid #ececec66',
+          backdropFilter: 'blur(50px)',
+          color: '#fff',
+        }"
+      />
+    </div>
+    <!-- 渲染所有模块 -->
+    <ModuleCommon
+      v-for="cfg in cfgs"
+      :key="cfg.deviceType + cfg.moduleName"
+      :show-style="cfg.showStyle"
+      :module-data="cfg.moduleData"
+      :module-name="cfg.moduleName"
+      :device-type="cfg.deviceType"
+      :data="data"
+      :visible="true"
+    />
+    <!-- <Three3D :modal-name="modalName" /> -->
+  </div>
+</template>
+<script lang="ts" setup>
+  import { computed, onMounted, onUnmounted, ref } from 'vue';
+  import { useInitConfigs, useInitPage } from '@/views/vent/home/configurable/hooks/useInit';
+  import { testConfigSealedGoaf } from './configurable.data.sealedGoaf';
+  import ModuleCommon from '@/views/vent/home/configurable/components/ModuleCommon.vue';
+  import { useGlobSetting } from '/@/hooks/setting';
+
+  const { title = '省局采空区密闭监测与分析系统' } = useGlobSetting();
+  const { data, updateData, mainTitle } = useInitPage(title);
+
+  const cfgs = computed(() => configs.value);
+  const { configs, fetchConfigs } = useInitConfigs();
+
+  const deviceId = ref('0'); // 当前选中设备ID
+  const fieldNames = { label: 'name', value: 'id' }; // 下拉框字段映射
+  const selectorOptions = ref([
+    { name: '采空区密闭分析', id: '0' },
+    { name: '采空区密闭监测', id: '1' },
+  ]);
+  // 切换设备事件
+  function handleDeviceChange(param) {
+    console.log('切换下拉框选项');
+  }
+  onMounted(() => {
+    fetchConfigs('sealed_goaf').then(() => {
+      configs.value = testConfigSealedGoaf;
+    });
+  });
+
+  // 数据处理函数
+  onUnmounted(() => {});
+</script>
+<style lang="less" scoped>
+  @import '/@/design/theme.less';
+
+  @font-face {
+    font-family: 'douyuFont';
+    src: url('/@/assets/font/douyuFont.otf');
+  }
+  @select-single: ~'@{namespace}-select-single';
+  @select-selector: ~'@{namespace}-select-selector';
+  @selection-item: ~'@{namespace}--select-selection-item';
+  .company-home {
+    --image-module-title: url('/@/assets/images/sealedGoaf/views/home/module-title.png');
+
+    width: 100%;
+    height: 100%;
+    color: @white;
+    position: relative;
+    background: #d7effe;
+    :deep(.vent-box1-bg) {
+      .box1-top {
+        background: unset;
+        height: 45px;
+        padding-top: 10px;
+        .title {
+          height: 25px;
+          background: var(--image-module-title) no-repeat;
+          color: #234e8e;
+          justify-content: left;
+          background-size: cover;
+          font-size: 20px;
+          padding-left: 10px;
+          div {
+            margin-top: -12px;
+          }
+        }
+      }
+      .box-container {
+        background-color: unset;
+        &::before {
+          background-image: none;
+        }
+        &::after {
+          background-image: none;
+        }
+      }
+      .box1-bottom {
+        background: none;
+      }
+    }
+    .title-select {
+      :deep(.@{select-selector}) {
+        width: 300px;
+        background-color: #2b6ff0;
+        box-shadow: none !important;
+        border: 1px solid #b3d8ff;
+        border-radius: 4px; /* 圆角 */
+        padding: 8px 12px; /* 内边距 */
+        font-size: 14px;
+        color: #333; /* 文字颜色 */
+
+        /* 交互样式 */
+        cursor: pointer;
+        width: auto;
+        :deep(.@{selection-item}) {
+          color: #fff !important;
+          font-size: 20px;
+        }
+      }
+    }
+  }
+</style>

+ 71 - 18
src/views/vent/dataCenter/deviceCenter/index.vue

@@ -54,7 +54,6 @@
                   <RightCircleTwoTone v-else />
                 </a-button>
               </template>
-
               <!-- 嵌套表格 -->
               <template #expandedRowRender="{ record }">
                 <a-table
@@ -75,6 +74,21 @@
                   </template>
                 </a-table>
               </template>
+              <template #bodyCell="{ column, record }">
+                <template v-if="column.key === 'netStatus'">
+                  <span
+                    :style="{
+                      color: record.netStatus ? '#52c41a' : '#ddd',
+                      fontWeight: '500',
+                    }"
+                  >
+                    {{ record.netStatus ? '在线' : '断开' }}
+                  </span>
+                </template>
+                <template v-else>
+                  {{ record[column.dataIndex] }}
+                </template>
+              </template>
             </a-table>
           </div>
           <div class="right-box" v-else-if="activeKey == 'history'">
@@ -99,7 +113,8 @@ import { RightCircleTwoTone, DownCircleTwoTone } from '@ant-design/icons-vue';
 import { alignElement } from 'dom-align';
 import { active } from 'sortablejs';
 import { stubTrue } from 'lodash';
-
+import { useRoute } from 'vue-router';
+let route = useRoute();
 const { hasPermission } = usePermission();
 let activeKey = ref('device');
 const treeData = ref<TreeProps['treeData']>([]);
@@ -211,10 +226,13 @@ const onSelect: TreeProps['onSelect'] = (keys, e) => {
   getDeviceList(deviceType.value);
 };
 // 获取所有节点key的函数
-const getAllNodeKeys = (nodes) => {
+const getAllNodeKeys = (nodes, type) => {
   const keys = [];
   const traverse = (nodeList) => {
     nodeList.forEach((node) => {
+      if (node.type === type) {
+        selectedKeys.value.push(node.key);
+      }
       keys.push(node.key);
       if (node.children && node.children.length > 0) {
         traverse(node.children);
@@ -226,8 +244,9 @@ const getAllNodeKeys = (nodes) => {
 };
 
 // 获取树形菜单数据
-async function getDeviceType() {
+async function getDeviceType(type?) {
   const result = await getDeviceTypeList({});
+
   if (result.length > 0) {
     const dataSource = [];
     let key = '0';
@@ -247,21 +266,38 @@ async function getDeviceType() {
 
     treeData.value = getData(result, dataSource, key);
     // 数据就绪后设置展开key数组
-    expandedKeys.value = getAllNodeKeys(treeData.value);
+    expandedKeys.value = getAllNodeKeys(treeData.value, type);
+    console.log(expandedKeys.value, '22222');
   }
 }
+// 获取当前选择节点
 // 根据选择设备获取设备列表
-async function getDeviceList(deviceTypeVal?) {
-  if (!deviceTypeVal) return;
+async function getDeviceList(deviceTypeVal?: any) {
+  // 1. 如果没有设备类型值,停止定时器并返回(不再重复请求)
+  if (!deviceTypeVal) {
+    if (timer) {
+      clearInterval(timer);
+      timer = undefined;
+    }
+    return;
+  }
   if (timer) {
     clearInterval(timer);
     timer = undefined;
   }
-  const params: any = {
-    devKind: deviceTypeVal,
+  const fetchDeviceData = async () => {
+    const params: any = {
+      devKind: deviceTypeVal,
+    };
+    try {
+      const result = await getDeviceListByType(params);
+      deviceList.value = result.records; // 更新设备列表
+    } catch (error) {
+      console.error('定时请求设备列表失败:', error);
+    }
   };
-  const result = await getDeviceListByType(params);
-  deviceList.value = result.records;
+  await fetchDeviceData();
+  timer = setInterval(fetchDeviceData, 2000); // 2000ms = 2秒
 }
 
 // 外层表格列配置
@@ -289,10 +325,6 @@ const outerColumns = [
     dataIndex: 'netStatus',
     key: 'netStatus',
     align: 'center',
-    customRender: ({ text }) => {
-      text = '在线';
-      return `${text}`;
-    },
   },
 ];
 
@@ -370,7 +402,13 @@ async function refreshData(deviceId: string) {
 }
 
 onMounted(() => {
-  getDeviceType();
+  const path = route.query.deviceType;
+  if (path) {
+    getDeviceType(path);
+    getDeviceList(path);
+  } else {
+    getDeviceType();
+  }
 });
 onUnmounted(() => {
   if (timer) {
@@ -458,6 +496,8 @@ watch(
           box-sizing: border-box;
           background: url('/@/assets/images/fire/bj1.png') no-repeat center;
           background-size: 100% 100%;
+          border: 3px, solid, #0b69b6;
+          border-radius: 5px;
         }
 
         .right-box {
@@ -467,6 +507,8 @@ watch(
           box-sizing: border-box;
           background: url('/@/assets/images/fire/bj1.png') no-repeat center;
           background-size: 100% 100%;
+          border: 3px, solid, #0b69b6;
+          border-radius: 5px;
 
           .right-title {
             display: flex;
@@ -557,8 +599,8 @@ watch(
 }
 
 .device-select-box {
-  margin-top: 60px;
-  width: 220px;
+  margin-top: 30px;
+  width: 300px;
   height: calc(100% - 70px);
   overflow-y: auto;
   color: #fff;
@@ -606,6 +648,17 @@ watch(
   pointer-events: auto;
   padding: 20px 10px 30px 10px;
 }
+/* 在线状态 - 绿色 */
+.status-online {
+  color: #36d399; /* 可替换为其他绿色,如 #00C48C */
+  font-weight: 500;
+}
+
+/* 断开状态 - 灰色(可选调整为红色) */
+.status-offline {
+  color: #999;
+  /* 若想断开显示红色:color: #F5222D; */
+}
 </style>
 <style>
 div[aria-hidden='true'] {

+ 20 - 2
src/views/vent/dataCenter/infoCenter/index.vue

@@ -51,7 +51,7 @@
           <template #title> 每日采集数据量 </template>
           <template #container>
             <div class="content-wrapper">
-              <CustomChart :chart-config="dailyNumOption" :chart-data="deviceData" height="245px" />
+              <CustomChart :chart-config="dailyNumOption" :chart-data="deviceData" height="260px" width="100%" />
             </div>
           </template>
         </infoBox>
@@ -91,7 +91,9 @@
   import { sysDataColumn, accessStatusColumn, dailyNumOption } from './infoCenter.data';
   import CustomChart from '@/views/vent/home/configurable/components/detail/CustomChart.vue';
   import { getDeviceAll, getHomepageSummaryIndexes } from './infoCenter.api';
+  import { useRouter } from 'vue-router';
   let mainTitle = ref('智能通风数据中心');
+  let router = useRouter();
   //分页参数配置
   const pagination = reactive({
     current: 1, // 当前页码
@@ -135,7 +137,8 @@
   });
   // 查看数据
   function viewData(record) {
-    console.log(record);
+    console.log(record.devicekind, '设备类型');
+    router.push(`/sjzx/deviceCenter/home?deviceType=${record.devicekind}`);
   }
   //分页切换
   const pageChange = async (val) => {
@@ -217,6 +220,12 @@
         width: 100%;
         overflow: hidden;
         padding-bottom: 20px;
+        .content-wrapper {
+          width: 100% !important; // 强制撑满父容器
+          height: 100% !important;
+          padding: 0 !important; // 抵消默认内边距(如果 infoBox 有内边距,这里需对应调整)
+          box-sizing: border-box; // 避免 padding 挤压宽度
+        }
       }
       .item-1 {
         height: 20%;
@@ -248,6 +257,11 @@
             background-size: 100% 100% !important;
           }
         }
+        .infoBox2 {
+          :deep(.box-container) {
+            padding: 5px 0px 5px 20px !important;
+          }
+        }
       }
       .item-3 {
         height: 40%;
@@ -320,6 +334,10 @@
           font-family: 'douyuFont';
           color: #66ffff;
           margin-top: 20px;
+          max-width: 200px; // 限制最大宽度
+          white-space: normal;
+          word-break: break-all; // 强制长内容换行(包括数字/字母)
+          text-align: center; // 保持文字居中对齐
         }
         .item-icon {
           width: 80px;

+ 35 - 5
src/views/vent/dataCenter/infoCenter/infoCenter.data.ts

@@ -3,6 +3,11 @@ import { ModuleDataChart } from '/@/views/vent/deviceManager/configurationTable/
 
 import { h } from 'vue'; // 引入vue的h函数用于创建VNode
 
+// 导入图片资源(关键步骤)
+import rank1 from '@/assets/images/dataCenter/infoCenter/rank-1.png';
+import rank2 from '@/assets/images/dataCenter/infoCenter/rank-2.png';
+import rank3 from '@/assets/images/dataCenter/infoCenter/rank-3.png';
+import rank4 from '@/assets/images/dataCenter/infoCenter/rank-4.png';
 // 系统数据排名
 export const sysDataColumn: BasicColumn[] = [
   {
@@ -15,13 +20,13 @@ export const sysDataColumn: BasicColumn[] = [
       const numIndex = Number(index);
       let rankImg = '';
       if (numIndex === 0) {
-        rankImg = '/src/assets/images/dataCenter/infoCenter/rank-1.png';
+        rankImg = rank1;
       } else if (numIndex === 1) {
-        rankImg = '/src/assets/images/dataCenter/infoCenter/rank-2.png';
+        rankImg = rank2;
       } else if (numIndex === 2) {
-        rankImg = '/src/assets/images/dataCenter/infoCenter/rank-3.png';
+        rankImg = rank3;
       } else {
-        rankImg = '/src/assets/images/dataCenter/infoCenter/rank-4.png';
+        rankImg = rank4;
       }
       return h(
         'div',
@@ -125,7 +130,32 @@ export const dailyNumOption: ModuleDataChart = {
   type: 'bar',
   readFrom: '',
   legend: { show: false },
-  xAxis: [{ show: true }],
+  xAxis: [
+    {
+      show: true,
+      axisLabel: {
+        rotate: 45, // 在这里配置旋转角度
+        interval: 0,
+      },
+    },
+  ],
   yAxis: [{ show: true, name: '', position: 'left' }],
   series: [{ readFrom: 'collectDataByDayList', xprop: 'day', yprop: 'total_count', label: '' }],
+  dataZoom: [
+    {
+      type: 'slider' as any,
+      show: true,
+      xAxisIndex: 0,
+      height: 12,
+      bottom: 10,
+      start: 0,
+      handleStyle: { color: '#66ffff' },
+      backgroundColor: 'rgba(102, 255, 255, 0.1)', // 滚动条背景色,适配UI
+    },
+    {
+      type: 'inside' as any, // 支持鼠标滚轮缩放柱子
+      xAxisIndex: 0,
+      zoomOnMouseWheel: true,
+    },
+  ] as any[],
 };

+ 4 - 1
src/views/vent/dataCenter/stationCenter/index.vue

@@ -384,6 +384,8 @@ onUnmounted(() => {
           box-sizing: border-box;
           background: url('/@/assets/images/fire/bj1.png') no-repeat center;
           background-size: 100% 100%;
+          border: 3px, solid, #0b69b6;
+          border-radius: 5px;
           .left-content {
             display: flex;
             justify-content: flex-start;
@@ -483,7 +485,8 @@ onUnmounted(() => {
           box-sizing: border-box;
           background: url('/@/assets/images/fire/bj1.png') no-repeat center;
           background-size: 100% 100%;
-
+          border: 3px, solid, #0b69b6;
+          border-radius: 5px;
           .right-title {
             display: flex;
             height: 30px;

+ 11 - 2
src/views/vent/deviceManager/configurationTable/types.ts

@@ -179,7 +179,11 @@ export interface ModuleDataBoard extends ReadFrom {
     | 'R'
     | 'S'
     | 'T'
-    | 'U';
+    | 'U'
+    | 'CKQMB'
+    | 'CKQMB0'
+    | 'CKQMB1'
+    | 'CKQMB2';
   /** 展示牌布局,决定是 label 部分在上方或是 value 在上方 */
   layout: 'val-top' | 'label-top' | 'new-top' | 'new1-top' | 'new2-top' | 'new3-top';
   /** 核心配置,每个展示牌对应一项 */
@@ -291,6 +295,11 @@ export interface ModuleDataChart extends ReadFrom {
   xAxis: {
     show: boolean;
     name?: string;
+    axisLabel?: {
+      rotate?: number;
+      interval?: number;
+      [key: string]: any; // 允许其他 ECharts 支持的属性
+    };
   }[];
   /** 图表y轴配置(若有),支持多个,注意至少一个 */
   yAxis: {
@@ -334,7 +343,7 @@ export interface ModuleDataChart extends ReadFrom {
 
 export interface ModuleDataTable extends ReadFrom {
   /** 表格的预设样式 */
-  type: 'A' | 'B' | 'C' | 'D';
+  type: 'A' | 'B' | 'C' | 'D' | 'CKQMB';
   /** 是否自动滚动 */
   autoScroll?: boolean;
   /** 核心配置,每个表格列对应一项 */

+ 4 - 0
src/views/vent/home/configurable/components/detail/CustomChart.vue

@@ -504,6 +504,8 @@ const genChartOption = () => {
       grid: {
         top: 50,
         bottom: dataZoom.length ? 70 : 30,
+        left: 30, // 缩小左侧边距,增加图表宽度
+        right: 30, // 缩小右侧边距
       },
       legend: {
         textStyle,
@@ -516,11 +518,13 @@ const genChartOption = () => {
       xAxis: xAxis.map((e) => {
         return {
           ...e,
+          dataZoom: baseDataZoom,
           type: 'category',
           axisLabel: {
             interval: 0,
             width: baseDataZoom.length ? 100 : 800 / get(baseSeries, '[0].data.length', 1),
             overflow: 'break',
+            rotate: get(e, 'axisLabel.rotate', 0), // 读取配置表中的rotate值,默认0
           },
         };
       }),

+ 37 - 0
src/views/vent/home/configurable/components/detail/CustomTable.vue

@@ -85,6 +85,7 @@
     --image-list-head: url('/@/assets/images/home-container/configurable/firehome/list-head.png');
     --image-content-label-d: url(/@/assets/images/home-container/configurable/minehome/content-label.png);
     --image-content-body-d: url('/@/assets/images/home-container/configurable/minehome/content-body.png');
+    --image-content-label-ckqmb: url('/@/assets/images/sealedGoaf/configurable/table/table1-label.png');
     height: 100%;
     box-sizing: border-box;
     display: flex;
@@ -196,5 +197,41 @@
         background: #092b3a;
       }
     }
+    .table__content_label_CKQMB {
+      background-image: var(--image-content-label-ckqmb);
+      background-size: 100% 100%;
+      background-repeat: no-repeat;
+      color: #000000;
+    }
+    .table__content_list_CKQMB {
+      font-weight: bold;
+      font-size: 18px;
+    }
+    /* 第一个子元素:黑色 */
+    .table__content_list_row .table__content__list_item_CKQMB:nth-child(1) {
+      font-size: 12px;
+      text-align: left;
+      color: #000000;
+    }
+
+    /* 第二个子元素:蓝色 */
+    .table__content_list_row .table__content__list_item_CKQMB:nth-child(2) {
+      color: #1890ff;
+    }
+
+    /* 第三个子元素:黄色 */
+    .table__content_list_row .table__content__list_item_CKQMB:nth-child(3) {
+      color: #ffc107;
+    }
+
+    /* 第四个子元素:橙色 */
+    .table__content_list_row .table__content__list_item_CKQMB:nth-child(4) {
+      color: #ff7a45;
+    }
+
+    /* 第五个子元素:红色 */
+    .table__content_list_row .table__content__list_item_CKQMB:nth-child(5) {
+      color: #ff4d4f;
+    }
   }
 </style>

+ 149 - 0
src/views/vent/home/configurable/components/detail/MiniBoard.vue

@@ -216,6 +216,13 @@
     --image-board_bg_8: url('/@/assets/images/home-container/configurable/board_bg_8.png');
     --image-board_bg_9: url('/@/assets/images/home-container/configurable/board_bg_9.png');
     --image-board_bg_10: url('/@/assets/images/home-container/configurable/board_bg_10.png');
+    --image-board-bg-ckqmb-1: url('/@/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb-1.png');
+    --image-board-bg-ckqmb-2: url('/@/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb-2.png');
+    --image-board-bg-ckqmb-3: url('/@/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb-3.png');
+    --image-board-bg-ckqmb-4: url('/@/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb-4.png');
+    --image-board-bg-ckqmb-5: url('/@/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb-5.png');
+    --image-board-bg-ckqmb1: url('/@/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb1.png');
+    --image-board-bg-ckqmb2: url('/@/assets/images/sealedGoaf/configurable/miniBoard/board-bg-ckqmb2.png');
 
     --image-hycd: url(/@/assets/images/home-container/configurable/dusthome/hycd.png);
     --image-dyfl: url(/@/assets/images/home-container/configurable/dusthome/dyfl.png);
@@ -477,6 +484,148 @@
     background-image: var(--image-board-bg-o);
     background-size: 100% 100%;
   }
+  .mini-board_CKQMB {
+    width: 220px;
+    height: 50px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 0 20px 0 20px;
+    background-image: var(--image-board-bg-ckqmb-1);
+    background-size: 100% 100%;
+  }
+  .mini-board_CKQMB:nth-child(2) {
+    background-image: var(--image-board-bg-ckqmb-2);
+  }
+  .mini-board_CKQMB:nth-child(3) {
+    background-image: var(--image-board-bg-ckqmb-3);
+  }
+  .mini-board_CKQMB:nth-child(4) {
+    background-image: var(--image-board-bg-ckqmb-4);
+  }
+  .mini-board_CKQMB:nth-child(5) {
+    background-image: var(--image-board-bg-ckqmb-5);
+  }
+  .mini-board_CKQMB:nth-child(6) {
+    background-image: var(--image-board-bg-ckqmb-1);
+  }
+  .mini-board__label_CKQMB {
+    color: #000000;
+    font-size: 13px;
+    font-family: 'Microsoft YaHei';
+    font-weight: bold;
+    padding-bottom: 6px;
+  }
+  .mini-board__value_CKQMB {
+    width: 55px;
+    color: #000000;
+    font-size: 25px;
+    padding-bottom: 13px;
+    font-family: 'Microsoft YaHei';
+  }
+  .mini-board_CKQMB0 {
+    width: 100px;
+    height: 90px;
+    background-image: var(--image-board-bg-ckqmb1);
+    background-size: 100% 100%;
+    padding-top: 28px;
+  }
+
+  .mini-board__label_CKQMB0 {
+    color: #000000;
+    font-size: 14px;
+    font-family: 'Microsoft YaHei';
+  }
+  .mini-board__value_CKQMB0 {
+    color: #000000;
+    font-size: 22px;
+    font-family: 'Microsoft YaHei';
+    padding-bottom: 10px;
+  }
+  /* 1. 第一个容器:label和value为蓝色 */
+  .mini-board_CKQMB0:nth-child(1) .mini-board__label_CKQMB0,
+  .mini-board_CKQMB0:nth-child(1) .mini-board__value_CKQMB0 {
+    color: #1890ff;
+  }
+
+  /* 2. 第二个容器:label和value为黄色 */
+  .mini-board_CKQMB0:nth-child(2) .mini-board__label_CKQMB0,
+  .mini-board_CKQMB0:nth-child(2) .mini-board__value_CKQMB0 {
+    color: #36a64d;
+  }
+
+  /* 3. 第三个容器:label和value为橙色 */
+  .mini-board_CKQMB0:nth-child(3) .mini-board__label_CKQMB0,
+  .mini-board_CKQMB0:nth-child(3) .mini-board__value_CKQMB0 {
+    color: #a97523;
+  }
+
+  /* 4. 第四个容器:label和value为红色 */
+  .mini-board_CKQMB0:nth-child(4) .mini-board__label_CKQMB0,
+  .mini-board_CKQMB0:nth-child(4) .mini-board__value_CKQMB0 {
+    color: #d6666c;
+  }
+  .mini-board_CKQMB1 {
+    width: 100px;
+    height: 90px;
+    background-image: var(--image-board-bg-ckqmb1);
+    background-size: 100% 100%;
+    padding-top: 28px;
+  }
+
+  .mini-board__label_CKQMB1 {
+    color: #000000;
+    font-size: 14px;
+    font-family: 'Microsoft YaHei';
+  }
+  .mini-board__value_CKQMB1 {
+    color: #000000;
+    font-size: 22px;
+    font-family: 'Microsoft YaHei';
+    padding-bottom: 10px;
+  }
+  /* 1. 第一个容器:label和value为蓝色 */
+  .mini-board_CKQMB1:nth-child(1) .mini-board__label_CKQMB1,
+  .mini-board_CKQMB1:nth-child(1) .mini-board__value_CKQMB1 {
+    color: #1890ff;
+  }
+
+  /* 2. 第二个容器:label和value为黄色 */
+  .mini-board_CKQMB1:nth-child(2) .mini-board__label_CKQMB1,
+  .mini-board_CKQMB1:nth-child(2) .mini-board__value_CKQMB1 {
+    color: #ffc107;
+  }
+
+  /* 3. 第三个容器:label和value为橙色 */
+  .mini-board_CKQMB1:nth-child(3) .mini-board__label_CKQMB1,
+  .mini-board_CKQMB1:nth-child(3) .mini-board__value_CKQMB1 {
+    color: #ff7a45;
+  }
+
+  /* 4. 第四个容器:label和value为红色 */
+  .mini-board_CKQMB1:nth-child(4) .mini-board__label_CKQMB1,
+  .mini-board_CKQMB1:nth-child(4) .mini-board__value_CKQMB1 {
+    color: #ff4d4f;
+  }
+  .mini-board_CKQMB2 {
+    width: 96px;
+    height: 71px;
+    background-image: var(--image-board-bg-ckqmb2);
+    background-size: 100% 100%;
+    padding-top: 8px;
+  }
+
+  .mini-board__label_CKQMB2 {
+    color: #000000;
+    font-size: 14px;
+    font-family: 'Microsoft YaHei';
+  }
+  .mini-board__value_CKQMB2 {
+    color: #2b6ff0;
+    font-size: 22px;
+    font-family: 'Microsoft YaHei';
+    padding-bottom: 6px;
+  }
 
   .mini-board_P {
     width: 97px;