Просмотр исходного кода

Merge branch 'master' of http://39.97.59.228:8013/hrx/goaf-monitoring-system

hongrunxia 3 месяцев назад
Родитель
Сommit
29d1061a6b

+ 50 - 59
src/views/dashboard/basicInfo/accessStatistics/access.data.ts

@@ -1,61 +1,52 @@
 import { BasicColumn } from '/@/components/Table/src/types/table';
 
-
-/**
- * 接入统计 - 多级表头配置
- * 一级表头:基础信息、统计数据
- * 二级表头:基础信息包含序号、区域;统计数据包含所有数值字段
- */
-export function getAccessStatisticsColumns(): BasicColumn[] {
-  return [
-    {
-      title: '区域',
-      dataIndex: 'name',
-      width: 150,
-      fixed: 'left',
-      align: 'center',
-    },
-    {
-      title: '煤矿总数',
-      dataIndex: 'mineNum',
-      width: 120,
-      align: 'center',
-    },
-    {
-      title: '应接入数量',
-      dataIndex: 'yjNum',
-      width: 120,
-      align: 'center',
-    },
-    {
-      title: '无需接入数量',
-      dataIndex: 'wxjrNum',
-      width: 120,
-      align: 'center',
-    },
-    {
-      title: '接入数量',
-      dataIndex: 'jrNum',
-      width: 120,
-      align: 'center',
-    },
-    {
-      title: '未接入数量',
-      dataIndex: 'wjNum',
-      width: 120,
-      align: 'center',
-    },
-    {
-      title: '在线数量',
-      dataIndex: 'zxNum',
-      width: 120,
-      align: 'center',
-    },
-    {
-      title: '离线数量',
-      dataIndex: 'lxNum',
-      width: 120,
-      align: 'center',
-    },
-  ];
-}
+export const accessStatisticsColumns: BasicColumn[] = [
+  {
+    title: '区域',
+    dataIndex: 'name',
+    width: 150,
+    align: 'center',
+  },
+  {
+    title: '煤矿总数',
+    dataIndex: 'mineNum',
+    width: 120,
+    align: 'center',
+  },
+  {
+    title: '应接入数量',
+    dataIndex: 'yjNum',
+    width: 120,
+    align: 'center',
+  },
+  {
+    title: '无需接入数量',
+    dataIndex: 'wxjrNum',
+    width: 120,
+    align: 'center',
+  },
+  {
+    title: '接入数量',
+    dataIndex: 'jrNum',
+    width: 120,
+    align: 'center',
+  },
+  {
+    title: '未接入数量',
+    dataIndex: 'wjNum',
+    width: 120,
+    align: 'center',
+  },
+  {
+    title: '在线数量',
+    dataIndex: 'zxNum',
+    width: 120,
+    align: 'center',
+  },
+  {
+    title: '离线数量',
+    dataIndex: 'lxNum',
+    width: 120,
+    align: 'center',
+  },
+]

+ 80 - 27
src/views/dashboard/basicInfo/accessStatistics/index.vue

@@ -1,36 +1,89 @@
 <template>
   <div class="p-4">
-    <BasicTable @register="registerTable" :scroll="{ x: 'max-content' }"  />
+    <BasicTable 
+      @register="registerTable" 
+      :scroll="{ x: 'max-content' }" 
+    />
   </div>
 </template>
-<script lang="ts">
-  import { defineComponent } from 'vue';
-  import { BasicTable, useTable } from '/@/components/Table';
-  import { getAccessStatisticsColumns } from './access.data';
-  import { getGoafAccessCount } from '../basicInfo.api';
-
-  export default defineComponent({
-    components: { BasicTable },
-    setup() {
-      const [registerTable] = useTable({
-        api: getGoafAccessCount,
-        columns: getAccessStatisticsColumns(),
-        pagination: true,
-        showIndexColumn: true,
-      });
-
-      return {
-        registerTable,
-      };
-    },
+<script setup lang="ts">
+import { BasicTable, useTable } from '/@/components/Table';
+import { accessStatisticsColumns } from './access.data';
+import { getGoafAccessCount } from '../basicInfo.api';
+import type { BasicColumn } from '/@/components/Table/src/types/table';
+
+// 封装接口调用,获取数据后手动添加「总计」行
+const fetchTableData = async (params: any) => {
+  // 1. 调用原始接口,获取数据
+  const originalRecords = await getGoafAccessCount(params);
+  if (originalRecords.length === 0) return originalRecords; // 无数据时直接返回
+
+  // 2. 定义需要求和的数值列字段
+  const numberFields = ['mineNum', 'yjNum', 'wxjrNum', 'jrNum', 'wjNum', 'zxNum', 'lxNum'];
+
+  // 3. 构建「总计」行对象
+  const totalRow = {
+    name: '总计',
+    isTotal: true, // 合计行标识
+  };
+
+  // 4. 遍历数值列,计算每列的总和
+  numberFields.forEach(field => {
+    totalRow[field] = originalRecords.reduce((sum: number, item: any) => {
+      const currentValue = Number(item[field]) || 0;
+      return sum + currentValue;
+    }, 0);
+  });
+
+  // 5. 把「总计」行拼接到原始数据的最前面
+  const newRecords = [totalRow, ...originalRecords];
+
+  // 6. 返回表格
+  return {
+    ...originalRecords,
+    records: newRecords,
+    total: newRecords.length,
+  };
+};
+
+// 手动添加自定义序号列
+const customIndexColumn: BasicColumn = {
+  title: '序号',
+  dataIndex: 'index',
+  width: 40,
+  align: 'center',
+  // 自定义序号渲染:判断是否为合计行,合计行返回空字符串(无序号)
+  customRender: ({ record, index }) => {
+    // 若是合计行(带有isTotal标识),返回空,不显示序号
+    if (record.isTotal) return '';
+    // 普通数据行:序号从1开始(排除合计行,序号连续)
+    return index; // 因合计行在第0位,普通数据从索引1开始,直接返回index即为正确序号
+  },
+};
+
+// 拼接最终列配置(序号列 + 原有业务列)
+const finalTableColumns = [customIndexColumn, ...accessStatisticsColumns];
+
+const [registerTable] = useTable({
+    title: '矿山信息表格',
+    api: fetchTableData, // 数据统计接口
+    columns:finalTableColumns,
+    pagination: false,
+    useSearchForm: false,
+    bordered: true,
+    showIndexColumn: false,
   });
 </script>
 <style scoped>
-  /* 合计行样式优化 */
-  .bg-gray-50 {
-    background-color: #f9fafb;
+  :deep(.ant-table-thead th:nth-child(1)) {
+    vertical-align: bottom;
+    padding-bottom: 0 !important;
+    border-bottom: none;
   }
-  .font-medium {
-    font-weight: 500;
+  :deep(.ant-table-tbody .ant-table-row:nth-child(2)){
+    background-color: #c5daf7 !important;
+    td {
+      background-color: #c5daf7 !important;
+    }
   }
-</style>
+</style>

+ 2 - 2
src/views/dashboard/basicInfo/basicInfo.api.ts

@@ -17,13 +17,13 @@ enum Api {
 
 export const getMineData = (params) => 
   defHttp.post({ 
-    headers: { 'Content-Type': 'x-www-form-urlencoded' },
+    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
     url: Api.getMineData, 
     params
   });
 
 // 接入统计
-export const getGoafAccessCount = () =>
+export const getGoafAccessCount = (params) =>
   defHttp.get({
     url: Api.getGoafAccessCount,
   });

+ 0 - 3
src/views/dashboard/basicInfo/closedStatistics/closed.data.ts

@@ -1,7 +1,4 @@
 import { BasicColumn } from '/@/components/Table/src/types/table';
-import { EyeOutlined } from '@ant-design/icons-vue';
-import { h } from 'vue';
-
 /**
  * 密闭统计表格列配置
  */

+ 9 - 8
src/views/dashboard/basicInfo/closedStatistics/index.vue

@@ -1,12 +1,13 @@
 <template>
-    <!-- 表格:适配多列,设置横向滚动 & 边框 -->
+  <div class="p-4">
     <BasicTable @register="registerTable" :scroll="{ x: 'max-content' }">
       <template #action="{ record }">
-        <button @click="handleGoToPage(record, `/sealed/${record.code}`)" class="action-btn">
-          <SvgIcon name="view" />
-        </button>
-      </template>
-  </BasicTable>
+          <button @click="handleGoToPage(record, `/sealed/${record.code}`)" class="action-btn">
+            <SvgIcon name="view" />
+          </button>
+        </template>
+    </BasicTable>
+  </div>
 </template>
 
 <script setup lang="ts">
@@ -20,8 +21,8 @@
   const router = useRouter();
   // 注册表格并获取相关方法
   const [registerTable] = useTable({
-    title: '密闭统计表格',
-    api: getClosedAccessCount, // 密闭统计接口
+    title: '密闭统计',
+    api: getClosedAccessCount, // 数据统计接口
     columns: dataColumns,
     pagination: true,
     useSearchForm: false,

+ 37 - 36
src/views/dashboard/basicInfo/dataQuality/dataQuality.data.ts

@@ -21,6 +21,12 @@ export const productionStatusMap: Record<string | number, { label: string; value
   // 15: { label: '已关闭矿井', value: 15, color: 'green' },
 };
 
+// 基于productionStatusMap生成下拉选项
+export const productionStatusOptions = Object.entries(productionStatusMap).map(([key, item]) => ({
+  label: item.label, // 状态名称
+  value: key,        // 状态值(转字符串,和原硬编码格式一致)
+}));
+
 // 颜色映射
 const colorHexMap: Record<string, string> = {
   blue: '#1890ff',
@@ -59,7 +65,6 @@ export const columns: BasicColumn[] = [
     dataIndex: 'mineLinkStatus',
     width: 100,
     customRender: ({ record }) => {
-      console.log(record.mineLinkStatus);
       const status = record.mineLinkStatus;
       if (status === undefined || status === null) {
         return h('span', { style: { color: colorHexMap.black } }, '/');
@@ -105,42 +110,38 @@ export const searchFormSchema: FormSchema[] = [
     colProps: { span: 6 },
     groupName: '常规查询',
   },
-  {
-    field: 'mineNameAbbr',
-    label: '煤矿简称',
-    component: 'Input',
-    colProps: { span: 6 },
-    groupName: '常规查询',
-  },
-  {
-    field: 'productionStatus',
-    label: '生产状态',
-    component: 'Select',
-    componentProps: {
-      options: [
-        { label: '拟建矿井', value: '0' },
-        { label: '正常生产矿井', value: '1' },
-        { label: '长期停产矿井', value: '1' },
-      ],
-    },
-    colProps: { span: 6 },
-    groupName: '常规查询',
-  },
+  // {
+  //   field: 'mineNameAbbr',
+  //   label: '煤矿简称',
+  //   component: 'Input',
+  //   colProps: { span: 6 },
+  //   groupName: '常规查询',
+  // },
+  // {
+  //   field: 'productionStatus',
+  //   label: '生产状态',
+  //   component: 'Select',
+  //   componentProps: {
+  //     options: productionStatusOptions
+  //   },
+  //   colProps: { span: 6 },
+  //   groupName: '常规查询',
+  // },
 
-  {
-    field: 'mineLinkStatus',
-    label: '在线状态',
-    component: 'Select',
-    componentProps: {
-      options: [
-        { label: '离线', value: '0' },
-        { label: '在线', value: '1' },
-        { label: '未连接', value: '2' },
-      ],
-    },
-    colProps: { span: 6 },
-    groupName: '常规查询',
-  },
+  // {
+  //   field: 'mineLinkStatus',
+  //   label: '在线状态',
+  //   component: 'Select',
+  //   componentProps: {
+  //     options: [
+  //       { label: '离线', value: '0' },
+  //       { label: '在线', value: '1' },
+  //       { label: '未连接', value: '2' },
+  //     ],
+  //   },
+  //   colProps: { span: 6 },
+  //   groupName: '常规查询',
+  // },
 ];
 
 // 模拟煤矿在线状态选项数据

+ 35 - 12
src/views/dashboard/basicInfo/dataQuality/index.vue

@@ -56,7 +56,7 @@
               <SvgIcon name="resolved" />
             </button>
           </Popconfirm>
-          <button @click="handleGoToPage(record, '/basicInfo/accessStatistics')" class="action-btn">
+          <button @click="handleGoToPage(record)" class="action-btn">
             <SvgIcon name="details" />
           </button>
         </template>
@@ -108,10 +108,14 @@
   import { SvgIcon } from '/@/components/Icon';
   import { columns, searchFormSchema, productionStatusMap } from './dataQuality.data';
   import { getDataQuaQueList, addDataQuaQue, deleteDataQuaQue, editDataQuaQue } from '../basicInfo.api';
+  import { findNode, findPath, listToTree } from '/@/utils/helper/treeHelper';
+  import { useMineStore } from '/@/store/modules/mine';
   import dayjs from 'dayjs'; 
   import * as XLSX from 'xlsx';
   // 路由实例
   const router = useRouter();
+  // 实例化矿井Store
+  const mineStore = useMineStore();
   // 响应式数据
   const activeKey = ref('unresolved'); // 激活的Tab键
   const pageMode = ref('add');
@@ -232,20 +236,39 @@
     }
   }
   /**
-   * 通用页面跳转方法
-   * @param record 当前行数据
-   * @param path 目标路径
-   */
-  function handleGoToPage(record: any, path: string) {
-    // 跳转时携带当前煤矿的编号作为参数(根据实际需求调整携带的参数)
+ * 通用页面跳转方法
+ * @param record 当前行数据
+ * @param path 目标路径(树形结构所在页面的路由地址)
+ */
+async function handleGoToPage(record: any) {
+  try {
+    const mineCode = record.mineCode;
+    const targetNode = findNode(
+      mineStore.getMineTree,
+      (item) => item.id === mineCode,
+      { id: 'id', pid: 'parentId', children: 'childDepart' }
+    );
+
+    let minePath = '';
+    if (targetNode) {
+      minePath = targetNode.parentId; // 取parentId作为minePath
+      console.log('minePath(当前节点的parentId):', minePath);
+    } else {
+      message.warning(`未找到矿码【${mineCode}】对应的矿井节点`);
+      return;
+    }
+
+    // 跳转页面(可携带拼接后的矿名/路径等参数)
     router.push({
-      path,
-      // query: {
-      //   orderNo: record.orderNo, // 煤矿编号
-      //   mineName: record.mineName // 煤矿名称
-      // }
+      path: `/sealed/${minePath}`,
+      query: {},
     });
+
+  } catch (error) {
+    console.error('矿节点定位失败:', error);
+    message.error('矿节点定位失败,请稍后重试');
   }
+}
 
   /**
    * 气泡取消按钮通用回调

+ 23 - 22
src/views/dashboard/basicInfo/minesInfo/minesInfo.data.ts

@@ -3,25 +3,30 @@ import { FormSchema } from '/@/components/Table';
 import { h } from 'vue';
 
 // 生产状态映射表(扩展所有状态)
-const productionStatusMap: Record<string | number, { text: string; color: string }> = {
-  0: { text: '正常生产矿井', color: 'green' },
-  1: { text: '拟建矿井', color: 'blue' },
-  2: { text: '正常建设煤矿', color: 'green' },
-  3: { text: '自行停产矿井', color: 'green' },
-  4: { text: '正在关闭', color: 'green' },
-  5: { text: '责令停产整顿', color: 'green' },
-  6: { text: '责令停止建设', color: 'green' },
-  7: { text: '已关闭矿井', color: 'green' },
-  8: { text: '长期停产矿井', color: 'green' },
-  9: { text: '长期停建矿井', color: 'green' },
-  10: { text: '停产整改矿井', color: 'green' },
-  11: { text: '长期停建无法联系', color: 'green' },
-  12: { text: '停建整改', color: 'green' },
-  13: { text: '自行停建', color: 'green' },
-  14: { text: '正在实施关闭', color: 'green' },
+const productionStatusMap: Record<string | number, { text: string; value: number; color: string }> = {
+  0: { text: '正常生产矿井', value: 0, color: 'green' },
+  1: { text: '拟建矿井', value: 1, color: 'blue' },
+  2: { text: '正常建设煤矿', value: 2, color: 'green' },
+  3: { text: '自行停产矿井', value: 3, color: 'green' },
+  4: { text: '正在关闭', value: 4, color: 'green' },
+  5: { text: '责令停产整顿', value: 5, color: 'green' },
+  6: { text: '责令停止建设', value: 6, color: 'green' },
+  7: { text: '已关闭矿井', value: 7, color: 'green' },
+  8: { text: '长期停产矿井', value: 8, color: 'green' },
+  9: { text: '长期停建矿井', value: 9, color: 'green' },
+  10: { text: '停产整改矿井', value: 10, color: 'green' },
+  11: { text: '长期停建无法联系', value: 11, color: 'green' },
+  12: { text: '停建整改', value: 12, color: 'green' },
+  13: { text: '自行停建', value: 13, color: 'green' },
+  14: { text: '正在实施关闭', value: 14, color: 'green' },
   // 15: { text: '已关闭矿井', color: 'green' },
 };
 
+// 基于productionStatusMap生成下拉选项
+export const productionStatusOptions = Object.entries(productionStatusMap).map(([key, item]) => ({
+  label: item.text, // 状态名称
+  value: key,        // 状态值
+}));
 // 颜色映射
 const colorHexMap: Record<string, string> = {
   blue: '#1890ff',
@@ -107,7 +112,7 @@ export const columns: BasicColumn[] = [
 
 export const searchFormSchema: FormSchema[] = [
   {
-    field: 'mineName',
+    field: 'mineCode',
     label: '煤矿名称',
     component: 'MineCascader',
     colProps: { span: 6 },
@@ -123,11 +128,7 @@ export const searchFormSchema: FormSchema[] = [
     label: '生产状态',
     component: 'Select',
     componentProps: {
-      options: [
-        { label: '拟建矿井', value: '0' },
-        { label: '正常生产矿井', value: '1' },
-        { label: '长期停产矿井', value: '8' },
-      ],
+      options: productionStatusOptions,
     },
     colProps: { span: 6 },
   },