提交修改

src/utils/fnUtils.ts

@@ -1,3 +1,4 @@
+import moment from 'moment';
 // 将后端返回的字段转换成树组件的ApiSelectTree的对应字段
 import { ImpExcel, ExcelData, jsonToSheetXlsx } from '/@/components/Excel';
 export const copyTransFun = (arr: any[]) => {
@@ -154,19 +155,38 @@ export const getYearNo = (type) => {
   }
 };
 // 导出数据
-export const exportData = (exportColumns,exportdataSource,nameTitle) => {
+export const exportData = (exportColumns, exportdataSource, nameTitle) => {
   let header = {};
   let data = [];
   exportColumns.forEach((element) => {
-    
-    if(element.title != '操作'){
-      header[element.key] = element.title ? element.title : 'time';
+    if (element.title != '操作') {
+      header['s' + element.key] = element.title ? element.title : 'time';
     }
   });
-  data = exportdataSource;
+  console.log(exportdataSource)
+  exportdataSource.forEach(element => {
+    let obj = {}
+    for (const key in element) {
+      obj['s' + key] = element[key]
+    }
+    data.push(obj)
+  });
+  // data = exportdataSource;
   jsonToSheetXlsx({
     data,
     header: header,
     filename: nameTitle,
   });
 }
+// 获取年月日
+export const currentDay = () => {
+  const now = moment();
+  // 获取年份
+  const year = now.year();
+  // 获取月份（注意：月份是从0开始的，所以需要加1）
+  const month = (now.month() + 1) < 10 ? '0'+(now.month() + 1) : (now.month() + 1) ;
+  // 获取日期
+  const day = now.date()<10?'0'+ now.date() : now.date();
+  let currentDays = '_'+year+month+day
+  return currentDays
+}

src/views/dataProcessing/manualCalculation.vue

@@ -3,7 +3,7 @@
     <div class="left-box">
       <div class="left-title"> 测站列表 </div>
       <div class="left-tree">
-        <a-tree checkable :tree-data="dataCenter.treeData" v-model:expandedKeys="expandedKeys"
+        <a-tree @check="checkTree" checkable :tree-data="dataCenter.treeData" v-model:expandedKeys="expandedKeys"
           v-model:selectedKeys="selectedKeys" v-model:checkedKeys="checkedKeys">
         </a-tree>
       </div>
@@ -70,6 +70,7 @@ import {
   getRiverTree,
   getHistCompute
 } from '/@/api/swHome/index';
+import { fontWeight } from 'html2canvas/dist/types/css/property-descriptors/font-weight';
 let showModal = ref(false)
 let dataCenter = reactive({
   treeOriginalData: {},
@@ -172,6 +173,7 @@ const handleTree = () => {
           obj2.children.push({
             title: element3.sensor_name,
             key: element3.senid,
+            dchar:element3.dchar,
             children: []
           })
         });
@@ -222,6 +224,9 @@ const setChartsFn = (timeArr, valueArr, yl) => {
   var option
   // if (yl) {
   option = {
+    title: {
+      text: drawTitle.value
+    },
     grid: {
       left: '5%',
       right: '3%',
@@ -239,16 +244,6 @@ const setChartsFn = (timeArr, valueArr, yl) => {
       axisPointer: {
         type: 'shadow',
       },
-      // formatter(params) {
-      //   var relVal = params[0].name;
-      //   for (var i = 0, l = params.length; i < l; i++) {
-      //     console.log('tooltip数据值', params[i].value);
-      //     //遍历出来的值一般是字符串，需要转换成数字，再进项tiFixed四舍五入
-      //     relVal +=
-      //       '<br/>' + params[i].marker + dataCenter.oneTitle + ' : ' + Number(params[i].value);
-      //   }
-      //   return relVal;
-      // },
     },
     xAxis: {
       type: 'category',
@@ -276,7 +271,7 @@ const setChartsFn = (timeArr, valueArr, yl) => {
     },
     yAxis: {
       type: 'value',
-      // name: '单位：mm',
+      name: '单位：'+dcharName.value,
       scale: true,
       axisLabel: {
         //y轴文字的配置
@@ -309,10 +304,12 @@ const setChartsFn = (timeArr, valueArr, yl) => {
             {
               type: "max",
               name: "我是最大值",
+              itemStyle: {color: '#B2D6FA'}, label: {color: 'red',fontWeight: 'bold'}
             },
             {
               type: "min",
               name: "我是最小值",
+              itemStyle: {color: '#B2D6FA'}, label: {color: 'red',fontWeight: 'bold'}
             },
           ],
         },
@@ -521,7 +518,15 @@ const queryForm = () => {
     handleTable()
   })
 }
-
+/**
+ * 点击树选择框的事件
+ */
+let dcharName = ref('')
+const checkTree = (checkedKeys,e) => {
+  if(e.checkedNodes.length == 1){
+    dcharName.value = e.checkedNodes[0].props.dchar
+  }
+}
 onMounted(() => {
   getCorrespondingOptimazeData()
 })

src/views/dataSupport/groundDisasterId/muSourceData/index.vue

@@ -3,24 +3,16 @@
     <div class="business-box">
       <div>
         <div class="tree-box">
+          <a-input-search v-model:value="searchValue" style="margin-bottom: 8px" placeholder="遥测站搜索" />
           <div class="tree-top-box">
             <a-collapse v-model:activeKey="activeKey3" :bordered="false">
               <template #expandIcon="{ isActive }">
                 <caret-right-outlined :rotate="isActive ? 90 : 0" />
               </template>
-              <a-collapse-panel
-                @click="rootNode(treeData.allComData)"
-                key="2"
-                header="信道"
-                :style="{ ...customStyle }"
-              >
+              <a-collapse-panel @click="rootNode(treeData.allComData)" key="2" header="信道" :style="{ ...customStyle }">
                 <ul class="tree-ul">
-                  <li
-                    :style="activeTree == item.com_name ? activeStyleObj : {}"
-                    @click="communication(item)"
-                    v-for="(item, index) in treeData.allComData.table_value"
-                    :key="index"
-                  >
+                  <li :style="activeTree == item.com_name ? activeStyleObj : {}" @click="communication(item)"
+                    v-for="(item, index) in treeData.allComData.table_value" :key="index">
                     {{ item.com_name }}({{ item.port }})
                   </li>
                 </ul>
@@ -33,39 +25,27 @@
                 <caret-right-outlined :rotate="isActive ? 90 : 0" />
               </template>
               <!-- treeData.treeNum -->
-              <a-collapse-panel key="2" :header="'遥测站数据'" :style="{ ...customStyle }">
+              <a-collapse-panel key="2" :header="'遥测站'" :style="{ ...customStyle }">
                 <a-collapse v-model:activeKey="activeKey" :bordered="false">
                   <template #expandIcon="{ isActive }">
                     <caret-right-outlined :rotate="isActive ? 90 : 0" />
                   </template>
-                  <a-collapse-panel
-                    v-for="(item, index, i) in treeData.riverTreeData.data_value.station"
-                    :key="index"
-                    :header="setSiteName(index)"
-                    :style="{ ...customStyle }"
-                  >
+                  <a-collapse-panel v-for="(item, index, i) in treeData.riverTreeData.data_value.station" :key="index"
+                    :header="setSiteName(index)" :style="{ ...customStyle }">
                     <a-collapse v-model:activeKey="activeKey1" :bordered="false">
                       <template #expandIcon="{ isActive }">
                         <caret-right-outlined :rotate="isActive ? 90 : 0" />
                       </template>
-                      <a-collapse-panel
-                        @click="tabCjData(items, index)"
-                        v-for="(items, indexs) in item"
-                        :key="items.st_name"
-                        :header="`${items.st_name}`"
-                        :style="{ ...customStyle }"
-                        :class="{
-                          'active-style': activeTree == items.stcd,
-                        }"
-                      >
+                      <a-collapse-panel @click="tabCjData(items, index)" v-show="items.isValue == 1"
+                        v-for="(items, indexs) in item" :key="items.st_name" :header="`${items.st_name}(${items.stcd})`"
+                        :style="{ ...customStyle }" :class="{
+            'active-style': activeTree == items.stcd,
+          }">
                         <ul class="tree-ul">
-                          <li
-                            :style="activeTree == element.senid ? activeStyleObj : {}"
-                            @click.stop="tabCjData(element)"
-                            v-for="(element, indexss) in items.sensor"
-                            :key="indexss"
-                          >
-                            {{ element.sensor_name }}
+                          <li :style="activeTree == element.senid ? activeStyleObj : {}"
+                            @click.stop="tabCjData(element)" v-show="element.isValue == 1"
+                            v-for="(element, indexss) in items.sensor" :key="indexss">
+                            {{ element.sensor_name }}（{{ element.senid }}）
                           </li>
                         </ul>
                       </a-collapse-panel>
@@ -83,16 +63,9 @@
             {{ messageTitle }}
             <span v-show="activeType == 1" @click="showModalFn" class="more-box">更多》</span>
           </div>
-          <a-table
-            class="ant-table-striped"
-            :dataSource="tableData.table_value"
-            :rowClassName="(record, index) => (index % 2 === 1 ? 'table-striped' : null)"
-            bordered
-            size="middle"
-            :columns="tableData.table_head"
-            :pagination="false"
-            :scroll="{ y: 'calc(50vh - 140px)' }"
-          />
+          <a-table class="ant-table-striped" :dataSource="tableData.table_value"
+            :rowClassName="(record, index) => (index % 2 === 1 ? 'table-striped' : null)" bordered size="middle"
+            :columns="tableData.table_head" :pagination="false" :scroll="{ y: 'calc(50vh - 140px)' }" />
         </div>
 
         <div class="message-box">
@@ -115,366 +88,422 @@
         </div>
       </div>
     </div>
-    <BasicModal
-      :maskClosable="false"
-      :footer="null"
-      @cancel="cancel"
-      :visible="showModal"
-      :width="1200"
-      :title="basicModalTitle"
-    >
+    <BasicModal :maskClosable="false" :footer="null" @cancel="cancel" :visible="showModal" :width="1200"
+      :title="basicModalTitle">
       <div>
         <div class="top-search">
           时间范围：
-          <a-range-picker
-            :value="timeData.time"
-            :show-time="{ format: 'HH:mm:ss' }"
-            format="YYYY-MM-DD HH:mm:ss"
-            :placeholder="['开始时间', '结束时间']"
-            @change="onChange"
-            :allowClear="true"
-          />
+          <a-range-picker :value="timeData.time" :show-time="{ format: 'HH:mm:ss' }" format="YYYY-MM-DD HH:mm:ss"
+            :placeholder="['开始时间', '结束时间']" @change="onChange" :allowClear="true" />
           <a-button @click="communicationHistory" class="marg-left" type="primary">查询</a-button>
         </div>
         <div class="modal-table">
-          <a-table
-            class="ant-table-striped ant-table-striped-modal"
-            :dataSource="tableDataModal.table_value"
-            :rowClassName="(record, index) => (index % 2 === 1 ? 'table-striped' : null)"
-            bordered
-            size="middle"
-            :pagination="true"
-            :columns="tableDataModal.table_head"
-            :scroll="{ y: '60vh' }"
-          />
+          <a-table class="ant-table-striped ant-table-striped-modal" :dataSource="tableDataModal.table_value"
+            :rowClassName="(record, index) => (index % 2 === 1 ? 'table-striped' : null)" bordered size="middle"
+            :pagination="true" :columns="tableDataModal.table_head" :scroll="{ y: '60vh' }" />
         </div>
       </div>
     </BasicModal>
   </div>
 </template>
 <script lang="ts" setup>
-  import { defineComponent, ref, watch, onMounted, reactive, onUnmounted } from 'vue';
-  import {
-    getAllCom,
-    getRiverTree,
-    getAllComData,
-    getParseLog,
-    getCjData,
-  } from '/@/api/swHome/index';
-  import { CaretRightOutlined } from '@ant-design/icons-vue';
-  import { BasicModal } from '/@/components/Modal/index';
-  const activeKey = ref(['1']);
-  const activeKey1 = ref(['1-1']);
-  const activeKey2 = ref(['1-1-1']);
-  const activeKey3 = ref('2');
-  const customStyle = {
-    background: '#fff',
-    'border-radius': '4px',
-    padding: '0px',
-    border: '0',
-    overflow: 'hidden',
-  };
-  const activeStyleObj = {
-    background: 'rgba(6, 113, 221, 0.1)',
-  };
-  let messageTitle = ref('信道列表');
-  let treeData = reactive({
-    allComData: [],
-    riverTreeData: [],
-    treeNum: 0,
-    logData: [],
-  });
-  let tableData = reactive({
-    table_head: [],
-    table_value: [],
+import { defineComponent, ref, watch, onMounted, reactive, onUnmounted } from 'vue';
+import {
+  getAllCom,
+  getRiverTree,
+  getAllComData,
+  getParseLog,
+  getCjData,
+} from '/@/api/swHome/index';
+import { debounce } from 'lodash';
+import { CaretRightOutlined } from '@ant-design/icons-vue';
+import { BasicModal } from '/@/components/Modal/index';
+const searchValue = ref<string>('');
+const activeKey = ref([]);
+const activeKey1 = ref([]);
+const activeKey2 = ref([]);
+const activeKey3 = ref('2');
+const customStyle = {
+  background: '#fff',
+  'border-radius': '4px',
+  padding: '0px',
+  border: '0',
+  overflow: 'hidden',
+};
+const activeStyleObj = {
+  background: 'rgba(6, 113, 221, 0.1)',
+};
+let messageTitle = ref('信道列表');
+let treeData = reactive({
+  allComData: [],
+  riverTreeData: [],
+  treeNum: 0,
+  logData: [],
+});
+let tableData = reactive({
+  table_head: [],
+  table_value: [],
+});
+let tableDataModal = reactive({
+  table_head: [],
+  table_value: [],
+});
+let activeTree = ref('');
+let activeType = ref('1');
+let showModal = ref(false);
+let basicModalTitle = ref();
+let timeData = reactive({
+  time: [],
+});
+function rootNode(table) {
+  messageTitle.value = '信道列表';
+  let table_head = [];
+  table.table_head.forEach((item, index) => {
+    for (const key in item) {
+      if (Object.prototype.hasOwnProperty.call(item, key)) {
+        const element = item[key];
+        table_head.push({
+          title: element,
+          key: key,
+          dataIndex: key,
+        });
+      }
+    }
   });
-  let tableDataModal = reactive({
-    table_head: [],
-    table_value: [],
+  tableData.table_head = table_head;
+  tableData.table_value = table.table_value;
+}
+function onChange(value, dateString) {
+  timeData.time = dateString;
+}
+// 弹窗
+function showModalFn() {
+  timeData.time = [];
+  showModal.value = true;
+  // 查询默认数据
+  communicationHistory();
+}
+let historyFormData = reactive({
+  com_name: '',
+  start_time: '',
+  end_time: '',
+});
+// 查询历史数据
+function communicationHistory() {
+  historyFormData.start_time = timeData.time[0] ? timeData.time[0] : '';
+  historyFormData.end_time = timeData.time[1] ? timeData.time[1] : '';
+  getAllComData(historyFormData).then((res) => {
+    let { table_head, table_value } = res.data;
+    tableDataModal.table_head = table_head;
+    tableDataModal.table_value = table_value;
+    // 处理数据
+    processingData(tableDataModal.table_head);
   });
-  let activeTree = ref('');
-  let activeType = ref('1');
-  let showModal = ref(false);
-  let basicModalTitle = ref();
-  let timeData = reactive({
-    time: [],
+}
+function cancel(e) {
+  showModal.value = false;
+}
+//数据拍平
+function dataFlattening() {
+  treeData.treeNum = 0;
+  treeData.riverTreeData.data_value.forEach((element) => {
+    element.stationArr = [];
+    for (let key in element.station) {
+      let elements = element.station[key];
+      element.stationArr = [...element.stationArr, ...elements];
+    }
+    element.stationArr.forEach((elements) => {
+      treeData.treeNum += elements.sensor.length;
+    });
   });
-  function rootNode(table) {
-    messageTitle.value = '信道列表';
-    let table_head = [];
-    table.table_head.forEach((item, index) => {
-      for (const key in item) {
-        if (Object.prototype.hasOwnProperty.call(item, key)) {
-          const element = item[key];
-          table_head.push({
-            title: element,
-            key: key,
-            dataIndex: key,
-          });
-        }
+}
+function setSiteName(value) {
+  let name = '';
+  switch (value) {
+    case 'st_hydro':
+      name = '水文站';
+      break;
+    case 'st_waterz':
+      name = '水位站';
+      break;
+    case 'st_rain':
+      name = '雨量站';
+      break;
+    case 'st_wea_general':
+      name = '一般气象站';
+      break;
+    case 'st_ts':
+      name = '碳水通量站';
+      break;
+    case 'st_wea_standard':
+      name = '标准气象站';
+      break;
+    default:
+      name = value;
+      break;
+  }
+  return name;
+}
+function processingData(table_head) {
+  table_head.forEach((element) => {
+    for (let key in element) {
+      let item = element[key];
+      element.title = item;
+      element.key = key;
+      element.dataIndex = key;
+      if (element.title == '时间') {
+        element.width = 200;
       }
-    });
+    }
+  });
+}
+// 点击信道获取通信子节点
+function communication(item) {
+  historyFormData.com_name = item.com_name;
+  messageTitle.value = `信道列表(${item.com_name})`;
+  basicModalTitle.value = `信道报文历史查询(${item.com_name})`;
+  activeType.value = '1';
+  activeTree.value = item.com_name;
+  getAllComData({ com_name: item.com_name }).then((res) => {
+    let { table_head, table_value } = res.data;
     tableData.table_head = table_head;
-    tableData.table_value = table.table_value;
-  }
-  function onChange(value, dateString) {
-    timeData.time = dateString;
-  }
-  // 弹窗
-  function showModalFn() {
-    timeData.time = [];
-    showModal.value = true;
-    // 查询默认数据
-    communicationHistory();
-  }
-  let historyFormData = reactive({
-    com_name: '',
-    start_time: '',
-    end_time: '',
+    tableData.table_value = table_value;
+    // 处理数据
+    processingData(tableData.table_head);
   });
-  // 查询历史数据
-  function communicationHistory() {
-    historyFormData.start_time = timeData.time[0] ? timeData.time[0] : '';
-    historyFormData.end_time = timeData.time[1] ? timeData.time[1] : '';
-    getAllComData(historyFormData).then((res) => {
-      let { table_head, table_value } = res.data;
-      tableDataModal.table_head = table_head;
-      tableDataModal.table_value = table_value;
-      // 处理数据
-      processingData(tableDataModal.table_head);
-    });
-  }
-  function cancel(e) {
-    showModal.value = false;
+}
+// 点击获取测站节点/传感器节点
+function tabCjData(item, indexType) {
+  activeTree.value = item.senid ? item.senid : item.stcd;
+  activeType.value = '2';
+  let formData = {
+    stcd: '',
+    type: '',
+  };
+  if (item.senid) {
+    // 获取sensor传感器
+    formData.stcd = item.senid;
+    formData.type = 'sensor';
+    messageTitle.value = `传感器列表(${item.sensor_name}`;
+  } else {
+    // 获取测站
+    formData.stcd = item.stcd;
+    formData.type = 'station';
+    messageTitle.value = `测站列表(${item.st_name}`;
   }
-  //数据拍平
-  function dataFlattening() {
-    treeData.treeNum = 0;
-    treeData.riverTreeData.data_value.forEach((element) => {
-      element.stationArr = [];
-      for (let key in element.station) {
-        let elements = element.station[key];
-        element.stationArr = [...element.stationArr, ...elements];
+  getCjData(formData).then((res) => {
+    let { table_head, table_value } = res.data;
+    tableData.table_head = table_head;
+    tableData.table_value = table_value;
+    processingData(tableData.table_head);
+  });
+}
+let treeDataList = null
+//获取左侧树桩数据
+async function getInitData() {
+  // 信道数据
+  getAllCom().then((res) => {
+    treeData.allComData = res.data;
+    treeData.allComData.table_value;
+    communication(treeData.allComData.table_value[0]);
+  });
+  // 遥测站数据
+  getRiverTree().then((res) => {
+    treeDataList = res.data
+    for (const key in treeDataList.data_value.station) {
+      if (Object.prototype.hasOwnProperty.call(treeDataList.data_value.station, key)) {
+        const element = treeDataList.data_value.station[key];
+        element.forEach(elements => {
+          elements.isValue = 1
+          elements.sensor.forEach(elementss => {
+            elementss.isValue = 1
+          });
+        });
       }
-      element.stationArr.forEach((elements) => {
-        treeData.treeNum += elements.sensor.length;
-      });
-    });
-  }
-  function setSiteName(value) {
-    let name = '';
-    switch (value) {
-      case 'st_hydro':
-        name = '水文站';
-        break;
-      case 'st_waterz':
-        name = '水位站';
-        break;
-      case 'st_rain':
-        name = '雨量站';
-        break;
-      case 'st_wea_general':
-        name = '一般气象站';
-        break;
-      case 'st_ts':
-        name = '碳水通量站';
-        break;
-      case 'st_wea_standard':
-        name = '标准气象站';
-        break;
-      default:
-        name = value;
-        break;
     }
-    return name;
-  }
-  function processingData(table_head) {
-    table_head.forEach((element) => {
-      for (let key in element) {
-        let item = element[key];
-        element.title = item;
-        element.key = key;
-        element.dataIndex = key;
-        if (element.title == '时间') {
-          element.width = 200;
+    treeData.riverTreeData = treeDataList;
+    dataFlattening();
+  });
+  // 获取报文解析
+
+}
+const getParseLogData = () => {
+  getParseLog().then((res) => {
+    treeData.logData = res.data;
+  });
+}
+let myInterval = null
+onUnmounted(() => {
+  clearInterval(myInterval)
+})
+/**
+ * 处理搜索页面
+ */
+watch(searchValue, debounce((value) => {
+  console.log(9900)
+  // 将搜索能够搜索到的先打上标签
+  let activeKeyArr = []
+  let st_nameArr = []
+  for (const key in treeDataList.data_value.station) {
+    if (Object.prototype.hasOwnProperty.call(treeDataList.data_value.station, key)) {
+      const element = treeDataList.data_value.station[key];
+      activeKeyArr.push(key)
+      element.forEach(elements => {
+        elements.isValue = 0
+        if (elements.st_name.indexOf(value) > -1 || (elements.stcd + '').indexOf(value) > -1) {
+          elements.isValue = 1
+          st_nameArr.push(elements.st_name)
         }
-      }
-    });
-  }
-  // 点击信道获取通信子节点
-  function communication(item) {
-    historyFormData.com_name = item.com_name;
-    messageTitle.value = `信道列表(${item.com_name})`;
-    basicModalTitle.value = `信道报文历史查询(${item.com_name})`;
-    activeType.value = '1';
-    activeTree.value = item.com_name;
-    getAllComData({ com_name: item.com_name }).then((res) => {
-      let { table_head, table_value } = res.data;
-      tableData.table_head = table_head;
-      tableData.table_value = table_value;
-      // 处理数据
-      processingData(tableData.table_head);
-    });
-  }
-  // 点击获取测站节点/传感器节点
-  function tabCjData(item, indexType) {
-    activeTree.value = item.senid ? item.senid : item.stcd;
-    activeType.value = '2';
-    let formData = {
-      stcd: '',
-      type: '',
-    };
-    if (item.senid) {
-      // 获取sensor传感器
-      formData.stcd = item.senid;
-      formData.type = 'sensor';
-      messageTitle.value = `传感器列表(${item.sensor_name}`;
-    } else {
-      // 获取测站
-      formData.stcd = item.stcd;
-      formData.type = 'station';
-      messageTitle.value = `测站列表(${item.st_name}`;
+        elements.sensor.forEach(elementss => {
+          elementss.isValue = 0
+          if (elementss.sensor_name.indexOf(value) > -1 || (elementss.senid + '').indexOf(value) > -1) {
+            elementss.isValue = 1
+          }
+        });
+        // 判断下级是否有选中，如果有选中将上级默认设置为1
+        elements.sensor.forEach(elementss => {
+          if (elementss.isValue == 1) {
+            elements.isValue = 1
+            st_nameArr.push(elements.st_name)
+          }
+        });
+      });
     }
-    getCjData(formData).then((res) => {
-      let { table_head, table_value } = res.data;
-      tableData.table_head = table_head;
-      tableData.table_value = table_value;
-      processingData(tableData.table_head);
-    });
-  }
-  //获取左侧树桩数据
-  async function getInitData() {
-    // 信道数据
-    getAllCom().then((res) => {
-      treeData.allComData = res.data;
-      treeData.allComData.table_value;
-      communication(treeData.allComData.table_value[0]);
-    });
-    // 遥测站数据
-    getRiverTree().then((res) => {
-      treeData.riverTreeData = res.data;
-      dataFlattening();
-    });
-    // 获取报文解析
-    
   }
-  const getParseLogData = () => {
-    getParseLog().then((res) => {
-      treeData.logData = res.data;
-    });
-  }
-  let myInterval = null
-  onUnmounted(() => {
-    clearInterval(myInterval)
-  })
-  onMounted(() => {
-    getInitData();
+  treeData.riverTreeData = treeDataList;
+  activeKey2.value = ['2']
+  activeKey.value = activeKeyArr
+  activeKey1.value = st_nameArr
+}, 1000));
+onMounted(() => {
+  getInitData();
+  getParseLogData()
+  myInterval = setInterval(() => {
     getParseLogData()
-    myInterval = setInterval(() => {
-      getParseLogData()
-    },15000)
-  });
+  }, 15000)
+});
 </script>
 
 <style lang="scss" scoped>
-  .business-box {
-    display: flex;
-    & > div:nth-child(1) {
-      min-width: 300px;
-      width: 300px;
+.business-box {
+  display: flex;
+
+  &>div:nth-child(1) {
+    min-width: 300px;
+    width: 300px;
+    background-color: #fff;
+    height: calc(100vh - 80px);
+    border-radius: 5px;
+    padding: 10px;
+    overflow: auto;
+  }
+
+  &>div:nth-child(2) {
+    margin-left: 10px;
+    flex: 1;
+
+    &>div:nth-child(1) {
       background-color: #fff;
-      height: calc(100vh - 80px);
-      border-radius: 5px;
+      height: calc(50vh - 45px);
       padding: 10px;
-      overflow: auto;
+      border-radius: 5px;
     }
-    & > div:nth-child(2) {
-      margin-left: 10px;
-      flex: 1;
-      & > div:nth-child(1) {
-        background-color: #fff;
-        height: calc(50vh - 45px);
-        padding: 10px;
-        border-radius: 5px;
-      }
-      & > div:nth-child(2) {
-        margin-top: 10px;
-        background-color: #fff;
-        height: calc(50vh - 45px);
-        padding: 10px;
-        border-radius: 5px;
-      }
+
+    &>div:nth-child(2) {
+      margin-top: 10px;
+      background-color: #fff;
+      height: calc(50vh - 45px);
+      padding: 10px;
+      border-radius: 5px;
     }
   }
-  .message-title {
-    font-size: 16px;
-    position: relative;
-  }
-  .message-box {
-    ul {
-      width: 100%;
-      height: calc(100% - 30px);
-      overflow: auto;
-      li {
-        padding: 5px;
-        border-radius: 4px;
-        background-color: #f8f8f8;
-        line-height: 30px;
-        margin-bottom: 10px;
-        & > div:nth-child(1) {
-          color: #0671dd;
-          font-size: 14px;
+}
+
+.message-title {
+  font-size: 16px;
+  position: relative;
+}
+
+.message-box {
+  ul {
+    width: 100%;
+    height: calc(100% - 30px);
+    overflow: auto;
+
+    li {
+      padding: 5px;
+      border-radius: 4px;
+      background-color: #f8f8f8;
+      line-height: 30px;
+      margin-bottom: 10px;
+
+      &>div:nth-child(1) {
+        color: #0671dd;
+        font-size: 14px;
+      }
+
+      &>div:nth-child(2) {
+        display: flex;
+        flex-wrap: wrap;
+
+        &>div {
+          margin-right: 40px;
         }
-        & > div:nth-child(2) {
-          display: flex;
-          flex-wrap: wrap;
-          & > div {
-            margin-right: 40px;
-          }
-          & > div:last-child {
-            // margin-left: auto;
-            margin-right: 0;
-          }
-          span {
-            color: #0671dd;
-          }
+
+        &>div:last-child {
+          // margin-left: auto;
+          margin-right: 0;
+        }
+
+        span {
+          color: #0671dd;
         }
       }
     }
   }
-  ::v-deep .ant-collapse-header {
-    padding: 0px !important;
-    padding-left: 40px !important;
-  }
-  ::v-deep .ant-collapse-content > .ant-collapse-content-box {
-    padding-bottom: 0 !important;
-    padding-right: 0px !important;
-  }
-  .tree-ul {
-    padding-left: 26px;
-    margin-bottom: 0px;
-    li {
-      line-height: 28px;
-      cursor: pointer;
-    }
-  }
-  .active-style {
-    background: rgba(6, 113, 221, 0.1) !important;
-  }
-  .ant-table-striped :deep(.table-striped) td {
-    background-color: #fafafa;
-  }
-  .more-box {
-    position: absolute;
-    right: 0px;
-    font-size: 14px;
-    color: #0671dd;
+}
+
+::v-deep .ant-collapse-header {
+  padding: 0px !important;
+  padding-left: 40px !important;
+}
+
+::v-deep .ant-collapse-content>.ant-collapse-content-box {
+  padding-bottom: 0 !important;
+  padding-right: 0px !important;
+}
+
+.tree-ul {
+  padding-left: 26px;
+  margin-bottom: 0px;
+
+  li {
+    line-height: 28px;
     cursor: pointer;
   }
-  .marg-left {
-    margin-left: 10px;
-  }
-  .ant-table-striped-modal {
-    margin-top: 20px;
-  }
+}
+
+.active-style {
+  background: rgba(6, 113, 221, 0.1) !important;
+}
+
+.ant-table-striped :deep(.table-striped) td {
+  background-color: #fafafa;
+}
+
+.more-box {
+  position: absolute;
+  right: 0px;
+  font-size: 14px;
+  color: #0671dd;
+  cursor: pointer;
+}
+
+.marg-left {
+  margin-left: 10px;
+}
+
+.ant-table-striped-modal {
+  margin-top: 20px;
+}
 </style>

src/views/historyData/rain/index2.vue

@@ -1,12 +1,12 @@
 <template>
   <div>
     <BasicTable :clickToRowSelect="false" @register="registerTable">
-      <!-- <template #toolbar>
+      <template #toolbar>
         <Authority>
           <a-button type="primary"
-            @click="exportData(dataCenter.columns, dataCenter.exportdataSource, '标准气象站.xlsx')">导出</a-button>
+            @click="exportData(dataCenter.exportColumns, dataCenter.dataSourceArr, '雨情历史查询.xlsx')">导出</a-button>
         </Authority>
-      </template> -->
+      </template>
     </BasicTable>
   </div>
 </template>
@@ -14,6 +14,7 @@
 import { defineComponent, ref, watch, onMounted, reactive } from 'vue';
 import { BasicTable, useTable, TableAction } from '/@/components/Table';
 import { ImpExcel, ExcelData, jsonToSheetXlsx } from '/@/components/Excel';
+import { exportData } from '/@/utils/fnUtils.ts';
 import moment from 'moment';
 import {
   getDataHistRainStatios,
@@ -33,7 +34,9 @@ let dataCenter = reactive({
   timeData: {
     time: [],
   },
+  dataSourceArr: [],
   columns: [],
+  exportColumns: [],
   cahrtsData: [],
   searchFormSchema: [
     {
@@ -61,7 +64,14 @@ let dataCenter = reactive({
           { label: '月', value: 'M' },
           { label: '年', value: 'Y' },
         ],
-        // onChange: handleCustomerChange,
+        onChange: (value) => {
+          console.log(value.target.value)
+          if (value.target.value == 'R') {
+            dataCenter.showSchemasType = 'D'
+          } else {
+            dataCenter.showSchemasType = 'H'
+          }
+        },
       },
     },
     {
@@ -71,21 +81,24 @@ let dataCenter = reactive({
       component: 'RangePicker',
       componentProps: {
         showTime: {
-          format: 'YYYY-MM-DD HH:mm:ss',
+          format: 'HH',
         },
+        format: "YYYY-MM-DD HH",
+        valueFormat: 'YYYY-MM-DD HH'
       },
       ifShow: () => {
         return dataCenter.showSchemasType == 'H';
       },
     },
     {
-      field: 'dayQueryTime',
+      field: 'queryTime',
       label: '查询时间:',
       colProps: { span: 6 },
       component: 'RangePicker',
       componentProps: {
-        format: 'YYYY-MM-DD',
-        valueFormat: 'YYYY-MM-DD',
+        showTime: {
+          format: 'YYYY-MM-DD HH:mm:ss',
+        },
       },
       ifShow: () => {
         return dataCenter.showSchemasType == 'D';
@@ -149,21 +162,28 @@ const [registerTable, { reload, getRawDataSource, getForm, setLoading, setColumn
       } else {
         senid = [];
       }
-      let start_time = params.start_time;
-      let end_time = params.end_time;
-      //判断查询模式
-      if (dataCenter.showSchemasType == 'D') {
-        start_time = params.dayQueryTime[0];
-        end_time = params.dayQueryTime[1];
-      }
-      if (dataCenter.showSchemasType == 'M') {
-        start_time = moment(params.monthQueryTime[0]).format('YYYY-MM');
-        end_time = moment(params.monthQueryTime[1]).format('YYYY-MM');
-      }
-      if (dataCenter.showSchemasType == 'Y') {
-        start_time = moment(params.yearQueryTime[0]).format('YYYY');
-        end_time = moment(params.yearQueryTime[1]).format('YYYY');
+      let start_time = ''
+      let end_time = ''
+      if (dataCenter.showSchemasType == 'H') {
+        start_time = params.start_time.split(':')[0] + '00:00';
+        end_time = params.end_time.split(':')[0] + '00:00';
+      } else {
+        start_time = params.start_time;
+        end_time = params.end_time;
       }
+      //判断查询模式
+      // if (dataCenter.showSchemasType == 'D') {
+      //   start_time = params.dayQueryTime[0];
+      //   end_time = params.dayQueryTime[1];
+      // }
+      // if (dataCenter.showSchemasType == 'M') {
+      //   start_time = moment(params.monthQueryTime[0]).format('YYYY-MM');
+      //   end_time = moment(params.monthQueryTime[1]).format('YYYY-MM');
+      // }
+      // if (dataCenter.showSchemasType == 'Y') {
+      //   start_time = moment(params.yearQueryTime[0]).format('YYYY');
+      //   end_time = moment(params.yearQueryTime[1]).format('YYYY');
+      // }
       return {
         senid: senid,
         step_size: params.step_size,
@@ -172,6 +192,7 @@ const [registerTable, { reload, getRawDataSource, getForm, setLoading, setColumn
       };
     },
     handleSearchInfoFn: (params) => {
+
       getList(params)
     },
     afterFetch: (data) => {
@@ -180,17 +201,17 @@ const [registerTable, { reload, getRawDataSource, getForm, setLoading, setColumn
     sortFn: (info) => {
       if (info.order == 'descend') {
         dataArr.sort((a, b) => {
-        let aNum = a[info.field] == '--'?-1:a[info.field]*1
-        let bNum = b[info.field] == '--'?-1:b[info.field]*1
-          if ( aNum < bNum) return 1;
-          if ( aNum > bNum) return -1;
+          let aNum = a[info.field] == '--' ? -1 : a[info.field] * 1
+          let bNum = b[info.field] == '--' ? -1 : b[info.field] * 1
+          if (aNum < bNum) return 1;
+          if (aNum > bNum) return -1;
           return 0;
         });
       }
       if (info.order == 'ascend') {
         dataArr.sort((a, b) => {
-        let aNum = a[info.field] == '--'?-1:a[info.field]*1
-        let bNum = b[info.field] == '--'?-1:b[info.field]*1
+          let aNum = a[info.field] == '--' ? -1 : a[info.field] * 1
+          let bNum = b[info.field] == '--' ? -1 : b[info.field] * 1
           if (aNum < bNum) return -1;
           if (aNum > bNum) return 1;
           return 0;
@@ -228,55 +249,119 @@ const processingData = (pageData) => {
       key: 'name',
       width: 100,
       align: 'center',
+      fixed: 'left',
     },
   ];
   let dataSource = [];
+  let titleArr = []
   pageData.time.forEach((element) => {
+    if (element != '最小值' && element != '最大值' && element != '站名' && element != '累积降雨量') {
+      let dayArr = element.split(' ')
+      let daySt = dayArr[0]
+      let timeSt = dayArr[1]
+      titleArr.push(daySt)
+    }
+  });
+  // 最上层title去重
+  let arrWithoutDuplicates = Array.from(new Set(titleArr));
+  arrWithoutDuplicates.forEach(element => {
     let obj1 = {
       title: element,
       dataIndex: element,
       key: element,
-      width: 160,
-      align: 'center',
-      sorter: true
-    }
-    if (element == '最小值') {
-      obj1.customCell = (record) => {
-        if (record) {
-          return {
-            style: {
-              background: 'rgba(15, 177, 94, 0.06)',
-            },
-          };
-        }
-      };
-      obj1.width = 100
+      children: []
     }
-    if (element == '最大值') {
-      obj1.customCell = (record) => {
-        if (record) {
-          return {
-            style: {
-              background: 'rgba(255, 52, 52, 0.06)',
-            },
-          };
+    columns.push(obj1);
+  });
+  pageData.time.forEach((element) => {
+    if (element != '最小值' && element != '最大值' && element != '站名' && element != '累积降雨量') {
+      console.log(element)
+      let dayArr = element.split(' ')
+      let daySt = dayArr[0]
+      let timeSt = dayArr[1]
+      columns.forEach(elements => {
+        if (elements.title != '最小值' && elements.title != '最大值' && elements.title != '站名' && elements.title != '累积降雨量') {
+          if (elements.title == daySt) {
+            elements.children.push({
+              title: timeSt,
+              dataIndex: element,
+              key: element,
+              width: 100,
+              align: 'center',
+              sorter: true
+            })
+          }
         }
-      };
-      obj1.width = 100
+      });
+    } else {
+      let obj1 = {
+        title: element,
+        dataIndex: element,
+        key: element,
+        width: 160,
+        align: 'center',
+        sorter: true
+      }
+      if (element == '最小值') {
+        obj1.customCell = (record) => {
+          if (record) {
+            return {
+              style: {
+                background: 'rgba(15, 177, 94, 0.06)',
+              },
+            };
+          }
+        };
+        obj1.width = 100
+      }
+      if (element == '最大值') {
+        obj1.customCell = (record) => {
+          if (record) {
+            return {
+              style: {
+                background: 'rgba(255, 52, 52, 0.06)',
+              },
+            };
+          }
+        };
+        obj1.width = 100
+      }
+      if (element == '累积降雨量') {
+        obj1.customCell = (record) => {
+          if (record) {
+            return {
+              style: {
+                background: 'rgba(45, 116, 231, 0.06)',
+              },
+            };
+          }
+        };
+        obj1.width = 120
+      }
+      columns.push(obj1);
     }
-    if (element == '累积降雨量') {
-      obj1.customCell = (record) => {
-        if (record) {
-          return {
-            style: {
-              background: 'rgba(45, 116, 231, 0.06)',
-            },
-          };
-        }
-      };
-      obj1.width = 120
+  })
+  dataCenter.exportColumns = [
+    {
+      title: '站名',
+      dataIndex: 'name',
+      key: 'name',
+      width: 100,
+      align: 'center',
+      fixed: 'left',
+    },
+  ]
+  // 处理时间列
+  pageData.time.forEach((element) => {
+    let obj1 = {
+      title: element,
+      dataIndex: element,
+      key: element,
+      width: 160,
+      align: 'center',
+      sorter: true
     }
-    columns.push(obj1);
+    dataCenter.exportColumns.push(obj1);
   });
   pageData.name.forEach((element) => {
     dataSource.push({
@@ -295,6 +380,7 @@ const processingData = (pageData) => {
     setColumns(columns);
     dataArr = dataSource
     setTableData(dataSource);
+    dataCenter.dataSourceArr = dataSource
   }, 100);
 }
 // 获取查询树状数据
@@ -307,7 +393,19 @@ const getRiveTreeData = async () => {
     dataCenter.searchFormSchema[0].componentProps.options = res.data;
   });
 }
-const getList = (form) => {
+const getList = (formData) => {
+  let form = JSON.parse(JSON.stringify(formData))
+  let start_time = ''
+  let end_time = ''
+  if (dataCenter.showSchemasType == 'H') {
+    start_time = form.start_time.split(':')[0] + ':00:00';
+    end_time = form.end_time.split(':')[0] + ':00:00';
+  } else {
+    start_time = form.start_time;
+    end_time = form.end_time;
+  }
+  form.start_time = start_time
+  form.end_time = end_time
   setLoading(true)
   gethistoryRain2(form).then(res => {
     processingData(res.data);

src/views/historyData/regimen/index.vue

@@ -2,7 +2,7 @@
   <div class="main">
     <div class="top-form">
       <a-row>
-        <a-col class="form-box" :span="6">
+        <a-col class="form-box" :span="4">
           <div> 监测站点： </div>
           <div>
             <a-select
@@ -17,7 +17,7 @@
           </div>
         </a-col>
         <a-col class="form-box" :span="6">
-          <div> 时段类型： </div>
+          <div style="margin-left: 10px;"> 时段类型： </div>
           <div>
             <a-radio-group @change="changeGroup" v-model:value="dataCenter.formData.step_size">
               <a-radio value="R">实时</a-radio>
@@ -28,7 +28,7 @@
             </a-radio-group>
           </div>
         </a-col>
-        <a-col class="form-box" :span="8">
+        <a-col class="form-box" :span="10">
           <div> 查询时间： </div>
           <div>
             <a-range-picker
@@ -207,9 +207,9 @@
         formatter(params) {
           var relVal = params[0].name;
           for (var i = 0, l = params.length; i < l; i++) {
-              console.log('tooltip数据值',params[i].value)
               //遍历出来的值一般是字符串，需要转换成数字，再进项tiFixed四舍五入
-              relVal += '<br/>' + params[i].marker + params[i].seriesName + ' : ' + Number(params[i].value)
+              relVal += `<br/>${params[i].marker}${params[i].seriesName}:${params[i].value == '--'? '--' : Number(params[i].value)}`
+              // relVal += '<br/>' + params[i].marker + params[i].seriesName + ' : ' + Number(params[i].value)
           }
           return relVal;
         },

src/views/historyData/weather/components/showType.vue

@@ -1,6 +1,9 @@
 <template>
   <div>
     <BasicTable :clickToRowSelect="false" @register="registerTable">
+      <template #tableTitle>
+        多站点气象{{dataCenter.exportNama}}历史查询
+      </template>
       <template #toolbar>
         <Authority>
           <a-button type="primary" @click="exportData()">导出</a-button>
@@ -88,6 +91,7 @@ let dataCenter = reactive({
   listArr: [],
   showModal1: false,
   showModal: false,
+  exportNama:'',
   searchFormSchema: [
     {
       field: 'queryMode',
@@ -243,6 +247,12 @@ const [registerTable, { reload, getForm, setColumns, setTableData }] = useTable(
       start_time = moment(params.yearQueryTime[0]).format('YYYY');
       end_time = moment(params.yearQueryTime[1]).format('YYYY');
     }
+    dataCenter.searchFormSchema[1].componentProps.options.forEach(element => {
+      if(params.dchar == element.value){
+        dataCenter.exportNama = element.label
+      }
+    });
+    
     return {
       sta_list: sta_list,
       dchar: params.dchar,
@@ -626,7 +636,7 @@ const exportData = () => {
   jsonToSheetXlsx({
     data:dataCenter.exportdataSource,
     header: header,
-    filename: '气象历史查询单要素-多站点.xlsx',
+    filename: `多站点${dataCenter.exportNama}要素历史数据查询.xlsx`,
   });
 }
 onMounted(async () => {

src/views/historyData/weather/components/showType1.vue

@@ -1,16 +1,19 @@
 <template>
   <div>
     <BasicTable :clickToRowSelect="false" @register="registerTable">
+      <template #tableTitle>
+        {{dataCenter.exportName}}站气象要素历史查询
+      </template>
       <template #toolbar>
         <Authority>
           <a-button type="primary"
-            @click="exportData(dataCenter.exportColumns, dataCenter.exportdataSource, '气象历史查询多要素-单站点.xlsx')">导出</a-button>
+            @click="exportData(dataCenter.exportColumns, dataCenter.exportdataSource, dataCenter.exportName+'站多要素历史数据查询.xlsx')">导出</a-button>
         </Authority>
       </template>
     </BasicTable>
     <!-- 弹窗2 -->
     <BasicModal :maskClosable="false" :footer="null" @cancel="cancel1" :visible="dataCenter.showModal1" :width="1200"
-      :minHeight="600" :title="'气象监测过程线（' + dataCenter.customTitle + '）'">
+      :minHeight="600" :title="`${dataCenter.exportName}站${dataCenter.customTitle}监测过程线`">
       <div class="box-basic">
         <div class="top-search">
           时间范围：
@@ -19,8 +22,8 @@
           <a-button @click="getHistoryRain" class="marg-left" type="primary">查询</a-button>
           <a-button class="right-position" type="primary" @click="exportExcel({
           time:'时间',
-          factv:dataCenter.customTitle
-        },dataCenter.cahrtsData,'气象监测过程线（' + dataCenter.customTitle + '）'+'.xlsx')">导出</a-button>
+          factv:dataCenter.exportName+'站'+dataCenter.customTitle
+        },dataCenter.cahrtsData, `${dataCenter.exportName}站${dataCenter.customTitle}监测过程线${currentDay()}.xlsx`)">导出</a-button>
         </div>
         <div class="box-inner-modal">
           <div class="moddal-box" id="myElement6"> </div>
@@ -53,7 +56,7 @@ import { defineComponent, ref, onMounted, reactive } from 'vue';
 import { BasicTable, useTable, TableAction } from '/@/components/Table';
 import { BasicModal } from '/@/components/Modal/index';
 import { ImpExcel, ExcelData, jsonToSheetXlsx } from '/@/components/Excel';
-
+import { currentDay } from '/@/utils/fnUtils.ts';
 import {
   getDataHistWeaElement,
   getDataHistWeaStations,
@@ -88,6 +91,7 @@ let dataCenter = reactive({
   showModal1: false,
   nameArr: [],
   senidArr: [],
+  exportName:'',
   searchFormSchema: [
     {
       field: 'queryMode',
@@ -212,7 +216,7 @@ function cancel1() {
 }
 const [registerModal] = useModal();
 const [registerTable, { reload, getForm, setColumns, setTableData }] = useTable({
-  title: '气象历史查询',
+  title: dataCenter.exportName+'站气象要素历史查询',
   api: getDataHistQueryOneStation,
   columns: dataCenter.columns,
   showIndexColumn: false,
@@ -228,6 +232,7 @@ const [registerTable, { reload, getForm, setColumns, setTableData }] = useTable(
   beforeFetch: (params: any) => {
     console.log('params',params)
     let st_name = setListData(params.stcd);
+    dataCenter.exportName = st_name
     let start_time = params.start_time;
     let end_time = params.end_time;
     //判断查询模式
@@ -364,9 +369,6 @@ function setTitle(data) {
   }, 100);
 }
 function handleTitle(record, text, column) {
-  console.log(record)
-  console.log(text)
-  console.log(column)
   dataCenter.customTitle = record.customTitle
   // if (record.customTitle == '时间' && text != '最小值' && text != '最大值') {
   //   dataCenter.showModal1 = true;
@@ -467,7 +469,7 @@ function echarts1() {
     toolbox: {
       feature: {
         saveAsImage: {
-          name:'气象监测过程线（' + dataCenter.customTitle + '）'
+          name:`${dataCenter.exportName}站${dataCenter.customTitle}监测过程线`
         }
       }
     },

src/views/realTime/rain/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <BasicTable :clickToRowSelect="false" @row-click="rowCLick" @register="registerTable">
+    <BasicTable class="basic-table-cl" :clickToRowSelect="false" @row-click="rowCLick" @register="registerTable">
       <template #form-formHeader="{ model, field }">
         <div class="form-box">
           <a-row>
@@ -264,11 +264,20 @@ function processingData(table_head) {
       element.ellipsis = true;
 
       if (element.title == '时间') {
-        element.width = 200;
+        element.width = 160;
       }
       // if (element.title == '传感器ID') {
       //   element.width = 147;
       // }
+      if (element.title == '流域分区') {
+        element.width = 140;
+      }
+      if (element.title == '测站') {
+        element.width = 150;
+      }
+      if (element.title == '传感器ID') {
+        element.width = 100;
+      }
       if (element.title != '时间'
         && element.title != '流域分区'
         && element.title != '测站'
@@ -353,4 +362,13 @@ onMounted(async () => {
     top: 0px;
   }
 }
+.basic-table-cl{
+  ::v-deep(.ant-table-fixed-header .ant-table-scroll .ant-table-header){
+    opacity: 1;
+  }
+  ::v-deep(.ant-table-hide-scrollbar){
+    min-width: initial !important;
+    scrollbar-color:initial;
+  }
+}
 </style>