Merge branch 'master' of http://39.97.59.228:8013/lxh/gas-injection

src/utils/http/axios/index.ts

@@ -310,7 +310,7 @@ function createAxios(opt?: Partial<CreateAxiosOptions>) {
         // authentication schemes，e.g: Bearer
         // authenticationScheme: 'Bearer',
         authenticationScheme: '',
-        timeout: 10 * 1000,
+        timeout: 60 * 1000,
         // 基础接口地址
         // baseURL: globSetting.apiUrl,
         headers: { 'Content-Type': ContentTypeEnum.JSON },

src/views/vent/home/configurable/components/content.vue

@@ -128,7 +128,7 @@
           <gasInjectChart class="content__module" :option="config.config.option" :echartData="config.data"/>
         </template>
         <template v-else-if="config.name === 'gas_inject_list'">
-          <gasInjectList class="content__module" :option="config.config.option" :upDownData="config.data" />
+          <gasInjectList class="content__module" :option="config.config.option" :listData="config.data" />
         </template>
         <template v-else-if="config.name === 'gas_zy_chart'">
           <gasZyChart class="content__module" />

src/views/vent/home/configurable/components/gasInject/DetailInfo.vue

@@ -1,11 +1,15 @@
 <template>
   <a-modal v-model:visible="visibleDetail" width="1350px" :footer="null" :title="modalTitle" centered destroyOnClose
     @cancel="handleCancel">
+    <!-- 注气参数 -->
     <template v-if="deviceType == 'cc_gas_nd'">
-      <curveEchartDetail :sysType="'Zq'" :isShowExport="false" :tableColumn="tableColumnCc"></curveEchartDetail>
+      <curveEchartDetail :sysType="'Zq'" :isShowExport="false" :tableColumn="tableColumnZqcs" :deviceID="data.deviceId"
+        :strtype="data.strtype"></curveEchartDetail>
     </template>
+    <!-- 抽采参数 -->
     <template v-if="deviceType == 'cc_gas_ll'">
-      <curveEchartDetail :sysType="'Cc'" :isShowExport="false" :tableColumn="tableColumnCc"></curveEchartDetail>
+      <curveEchartDetail :sysType="'Cc'" :isShowExport="false" :tableColumn="tableColumnCcs"
+        :strtype="data.pumpStrtype"></curveEchartDetail>
     </template>
     <template v-if="deviceType == 'gas_zq-yl'">
       <curveEchartDetail :sysType="'Zq'" :isShowExport="false" :tableColumn="tableColumnSj"></curveEchartDetail>
@@ -13,21 +17,20 @@
     <template v-if="deviceType == 'gas_zq_sj'">
       <!-- <zqMonitorDetail :isShowExport="false" :tableColumn="tableColumnSj" :data="data" :optionDetail="optionDetailZq">
       </zqMonitorDetail> -->
-      <LineAndBarDetail :sysType="'Zq'" :isShowExport="false" :tableColumn="tableColumnSj" :deviceID="data.deviceId"></LineAndBarDetail>
+      <LineAndBarDetail :sysType="'Zq'" :isShowExport="false" :tableColumn="tableColumnSj" :deviceID="data.deviceId">
+      </LineAndBarDetail>
     </template>
-    <!-- <template v-if="deviceType == 'gas_zq_hj'">
-      <zqMonitorDetail :isShowExport="true" :tableColumn="tableColumnHj"></zqMonitorDetail>
-    </template> -->
+    <!-- 环境监测 -->
     <template v-if="deviceType == 'gas_zq_hj'">
-      <environmentDetailTable :isShowExport="true"></environmentDetailTable>
+      <environmentDetailTable :isShowExport="true" :deviceData="data" :strtype="data.strtype"></environmentDetailTable>
     </template>
+    <!-- 装备运行工况监测 -->
     <template v-if="deviceType == 'gas_zq_paramline'">
-      <!-- <curveEchartDetail :sysType="'Gk'" :isShowExport="false" :tableColumn="tableColumnSj"></curveEchartDetail> -->
-      <echartLineDateGk :echartOption="echartOptionGk" :ecahrtData="echartDataGk" />
+      <echartLineDateGk :echartOption="echartOptionGk" :deviceID="data.deviceId" :strtype="data.strtype" />
     </template>
     <template v-if="deviceType == 'gas_zq_video'">
       <!-- <zqMonitorDetail :isShowExport="true" :tableColumn="tableColumnSj"></zqMonitorDetail> -->
-       <cameraDetailModal></cameraDetailModal>
+      <cameraDetailModal></cameraDetailModal>
     </template>
     <template v-if="deviceType == 'gas_cc_detail'">
       <zqMonitorDetail :isShowExport="false" :tableColumn="tableColumnCc" :optionDetail="optionDetailCc">
@@ -46,10 +49,12 @@
     <template v-if="deviceType == 'warn-info'">
       <warnDetailTable :isShowExport="true"></warnDetailTable>
     </template>
+    <!-- 装备运行状态与控制 -->
     <template v-if="deviceType == 'device_status_control'">
-      <zqMonitorDetail :isShowExport="true" :tableColumn="columnCc"></zqMonitorDetail>
+      <zqMonitorDetail :isShowExport="true" :tableColumn="columnControl" :deviceID="data.deviceId"
+        :strtype="data.strtype"></zqMonitorDetail>
     </template>
-   
+
   </a-modal>
 </template>
 
@@ -57,7 +62,7 @@
 import { computed, reactive, ref, watch } from 'vue'
 import curveEchartDetail from './curveEchartDetail.vue'
 import zqMonitorDetail from './zqMonitorDetail.vue'
-import { tableColumnSj, tableColumnHj, tableColumnCc, optionDetailZq, optionDetailCc, columnCc, echartOptionGk } from './gasInject.data'
+import { columnControl, tableColumnZqcs, tableColumnCcs, tableColumnSj, tableColumnHj, tableColumnCc, optionDetailZq, optionDetailCc, columnCc, echartOptionGk } from './gasInject.data'
 import SyqDetails from './SyqDetails.vue';
 import systemDetailTable from './systemDetailTable.vue'
 import warnDetailTable from './warnDetailTable.vue'
@@ -83,15 +88,6 @@ let props = defineProps({
 let visibleDetail = ref(false)
 let $emit = defineEmits(['closeModal'])
 
-let echartDataGk = reactive({
-  xData: ['3.26', '3.27', '3.28', '3.29', '3.30', '3.31'],
-  yData: ["20", "50", "12", "65", "30", "60"],
-  yData1: ["40", "60", "22", "85", "50", "40"],
-  yData2: ["70", "30", "42", "65", "80", "60"],
-  yData3: ['50','30','68','42','58','37'],
-  yData4: []
-})
-
 //弹窗标题
 let modalTitle = computed(() => {
   if (props.deviceType == 'cc_gas_nd' || props.deviceType == 'cc_gas_ll' || props.deviceType == 'gas_cc_line') {

src/views/vent/home/configurable/components/gasInject/LineAndBarDetail.vue

@@ -11,7 +11,7 @@
           </a-radio-group>
           <!-- 时间查询条件 -->
           <a-range-picker style="width:280px" v-model:value="timerSearch" :show-time="formatDate"
-            format="YYYY-MM-DD HH:mm" :placeholder="['开始时间', '结束时间']" />
+            format="YYYY-MM-DD HH:mm:ss" :placeholder="['开始时间', '结束时间']" />
         </div>
         <div class="nav-btn" @click="handleHistory">
           <div class="nav-text">

src/views/vent/home/configurable/components/gasInject/curveEchartDetail.vue

@@ -4,14 +4,17 @@
       <div class="curve-nav">
         <div class="nav-search">
           <!-- 时间查询选项 -->
-          <a-radio-group v-model:value="timerTabs" name="radioGroup">
+          <a-radio-group v-model:value="timerTabs" name="radioGroup" @change="changeRadio">
             <a-radio value="day">按天</a-radio>
             <a-radio value="hours">按小时</a-radio>
             <a-radio value="minutes">按分钟</a-radio>
           </a-radio-group>
           <!-- 时间查询条件 -->
-          <a-range-picker style="width:280px" v-model:value="timerSearch" :show-time="formatDate"
-            format="YYYY-MM-DD HH:mm" :placeholder="['开始时间', '结束时间']" />
+          <a-range-picker style="width:340px" :value="[searchData.startTime, searchData.endTime]"
+            :show-time="{ format: 'HH:mm:ss' }" valueFormat="YYYY-MM-DD HH:mm:ss" :placeholder="['开始时间', '结束时间']"
+            @change="onRangeChange" />
+          <a-button type="primary" preIcon="ant-design:search-outlined" @click="getSearch"
+            style="margin-left: 10px;">查询</a-button>
         </div>
         <div class="nav-btn" @click="handleHistory">
           <div class="nav-text">
@@ -31,7 +34,8 @@
       </div>
     </template>
     <template v-else>
-      <zqHistoryExport :tableColumn="tableColumn" @handleBack="handleBack"></zqHistoryExport>
+      <zqHistoryExport :tableColumn="tableColumn" :detailType="'history'" :deviceId="deviceID" :strtype="strtype"  @handleBack="handleBack">
+      </zqHistoryExport>
     </template>
   </div>
 </template>
@@ -42,6 +46,8 @@ import echartLineDate from './echartLineDate.vue'
 import { SvgIcon } from '/@/components/Icon';
 import zqHistoryExport from './zqHistoryExport.vue'
 import { zqEchartOption, ccEchartOption, gkEchartOption } from './gasInject.data'
+import { listdays } from './gasInject.api'
+import dayjs from 'dayjs';
 
 let props = defineProps({
 
@@ -56,42 +62,95 @@ let props = defineProps({
   //详情图表系统类型
   sysType: {
     type: String
+  },
+  //设备ID
+  deviceID: {
+    type: String
+  },
+  //设备类型
+  strtype:{
+    type:String
   }
 })
 //注气参数详情数据
-let listData = ref<any[]>([
-  { label: '绘流管1', xData: ['3.26', '3.27', '3.28', '3.29', '3.30', '3.31'], yData: ["20", "50", "12", "65", "30", "60"], yData1: ["40", "60", "22", "85", "50", "40"], yData2: ["70", "30", "42", "65", "80", "60"], },
-  { label: '绘流管2', xData: ['3.26', '3.27', '3.28', '3.29', '3.30', '3.31'], yData: ["20", "50", "12", "65", "30", "60"], yData1: ["40", "60", "22", "85", "50", "40"], yData2: ["70", "30", "42", "65", "80", "60"], },
-  { label: '绘流管3', xData: ['3.26', '3.27', '3.28', '3.29', '3.30', '3.31'], yData: ["20", "50", "12", "65", "30", "60"], yData1: ["40", "60", "22", "85", "50", "40"], yData2: ["70", "30", "42", "65", "80", "60"], },
-  { label: '绘流管4', xData: ['3.26', '3.27', '3.28', '3.29', '3.30', '3.31'], yData: ["20", "50", "12", "65", "30", "60"], yData1: ["40", "60", "22", "85", "50", "40"], yData2: ["70", "30", "42", "65", "80", "60"], },
-  { label: '绘流管5', xData: ['3.26', '3.27', '3.28', '3.29', '3.30', '3.31'], yData: ["20", "50", "12", "65", "30", "60"], yData1: ["40", "60", "22", "85", "50", "40"], yData2: ["70", "30", "42", "65", "80", "60"], },
-  { label: '绘流管6', xData: ['3.26', '3.27', '3.28', '3.29', '3.30', '3.31'], yData: ["20", "50", "12", "65", "30", "60"], yData1: ["40", "60", "22", "85", "50", "40"], yData2: ["70", "30", "42", "65", "80", "60"], },
-  { label: '绘流管7', xData: ['3.26', '3.27', '3.28', '3.29', '3.30', '3.31'], yData: ["20", "50", "12", "65", "30", "60"], yData1: ["40", "60", "22", "85", "50", "40"], yData2: ["70", "30", "42", "65", "80", "60"], },
-  { label: '绘流管8', xData: ['3.26', '3.27', '3.28', '3.29', '3.30', '3.31'], yData: ["20", "50", "12", "65", "30", "60"], yData1: ["40", "60", "22", "85", "50", "40"], yData2: ["70", "30", "42", "65", "80", "60"], },
-  { label: '绘流管9', xData: ['3.26', '3.27', '3.28', '3.29', '3.30', '3.31'], yData: ["20", "50", "12", "65", "30", "60"], yData1: ["40", "60", "22", "85", "50", "40"], yData2: ["70", "30", "42", "65", "80", "60"], },
-])
+let listData = ref<any[]>([])
 
+let searchData = reactive({
+  startTime: dayjs().subtract(1, 'day').format('YYYY-MM-DD HH:mm:ss'),
+  endTime: dayjs().format('YYYY-MM-DD HH:mm:ss'),
+})
 let timerTabs = ref('day')
 let showExport = ref(false)
-//查询时间段-天
-let timerSearch = ref('')
-//时间显示格式
-let formatDate = computed(() => {
-  let showTime = {}
-  if (timerTabs.value == 'day') {
-    showTime = {}
-  } else if (timerTabs.value == 'hours') {
-    showTime = Object.assign({}, { format: 'HH' })
-  } else if (timerTabs.value == 'minutes') {
-    showTime = Object.assign({}, { format: 'HH:mm' })
-  }
-  return showTime
-})
+
 //图表配置项
 let echartOption = computed(() => {
   return props.sysType == 'Cc' ? ccEchartOption : props.sysType == 'Zq' ? zqEchartOption : gkEchartOption
 })
 
+//时间间隔切换
+function changeRadio(val) {
+  timerTabs.value = val.target.value
+}
+//日期切换
+function onRangeChange(__, time) {
+  searchData.startTime = time[0];
+  searchData.endTime = time[1];
+}
+async function getHistoryData(skip) {
+  if (props.sysType == 'Zq') {
+    let res = await listdays({ pageNo: 1, pageSize: 1000, gdeviceids: props.deviceID, strtype: props.strtype, ttime_begin: searchData.startTime, ttime_end: searchData.endTime, skip: skip })
+    if (res.datalist.records.length) {
+      let count = 0
+      let data = res.datalist.records.find(el => el.readData.flowStdInstant_1)
+      Object.keys(data.readData).forEach(el => {
+        if (el.indexOf('flowStdAccum_') != -1) {
+          count += 1
+        }
+      })
+      listData.value = Array.from({ length: count }).map((el, index) => {
+        return {
+          label: `钻孔${index + 1}`,
+          xData: res.xlist,
+          yData: res.datalist.records.map(dl => dl.readData[`flowStdInstant_${index + 1}`]),
+          yData1: res.datalist.records.map(dl => dl.readData[`injectionPressure_${index + 1}`]),
+        }
+      })
+    }
+  } else if (props.sysType == 'Cc') {
+    let res = await listdays({ pageNo: 1, pageSize: 1000, strtype: 'pump', ttime_begin: searchData.startTime, ttime_end: searchData.endTime, skip: skip })
+    console.log(res, '抽采数据')
+    if (res.datalist.records.length) {
+      let gdevicetype = res.datalist.records.map(v => v.gdevicetype)
+      let count = [...new Set(gdevicetype)].filter(el => el != 'pump_under_1');
+      console.log(count, 'count')
+      listData.value = count.map((el, index) => {
+        return {
+          label: `汇流管${index + 1}`,
+          xData: res.xlist,
+          yData: res.datalist.records.filter(fl => fl.gdevicetype == el).map(dl => dl.readData['mixStdInstant']),
+          yData1: res.datalist.records.filter(fl => fl.gdevicetype == el).map(dl => dl.readData['negativePressure']),
+        }
+      })
+      console.log(listData.value, 'listData.value')
+    }
+  }
+
+
+}
+//查询
+function getSearch() {
+  switch (timerTabs.value) {
+    case 'day':
+      getHistoryData('9')
+      break;
+    case 'hours':
+      getHistoryData('8')
+      break;
+    case 'minutes':
+      getHistoryData('6')
+      break;
+  }
+}
 //打开历史数据详情及导出
 function handleHistory() {
   showExport.value = true
@@ -103,6 +162,7 @@ function handleBack() {
 
 watch(() => props.isShowExport, (newV, oldV) => {
   showExport.value = newV
+  getHistoryData('9')
 }, { immediate: true })
 </script>
 
@@ -120,7 +180,7 @@ watch(() => props.isShowExport, (newV, oldV) => {
   --image-inject_curve_bg: url('@/assets/images/gasInjection/9-3.png');
   --image-inject_curve_bg1: url('@/assets/images/gasInjection/9-4.png');
   width: 100%;
-  height: 100%;
+  height: 700px;
   padding: 15px 20px;
   box-sizing: border-box;
 

src/views/vent/home/configurable/components/gasInject/echartLineDate.vue

@@ -3,8 +3,8 @@
     <!-- 年月日切换 -->
     <div v-if="echartOption.showTime" class="radio-box">
       <a-radio-group v-model:value="nowData" name="radioGroup" @change="changeRadio">
-        <a-radio value="minutes">按分钟</a-radio>
         <a-radio value="hours">按小时</a-radio>
+        <a-radio value="minutes">按分钟</a-radio>
       </a-radio-group>
     </div>
     <div class="echart-line" ref="echartLines"></div>
@@ -86,25 +86,41 @@ function changeRadio(val) {
 //数据格式化
 function getFormat() {
   if (nowData.value == 'hours') {
-   ecahrtDatas.xData = ['3.26', '3.27', '3.28', '3.29', '3.30', '3.31']
-    // ecahrtDatas.xData = ecahrtDatas.hourData.xlist
-    // ecahrtDatas.injectionPressure = ecahrtDatas.hourData.datalist.records.map(el => el.readData.injectionPressure) || []
-    // ecahrtDatas.flowStdInstant = ecahrtDatas.hourData.datalist.records.map(el => el.readData.flowStdInstant) || []
+    //  ecahrtDatas.xData = ['3.26', '3.27', '3.28', '3.29', '3.30', '3.31']
+    ecahrtDatas.xData = ecahrtDatas.hourData.xlist
+    ecahrtDatas.injectionPressure = ecahrtDatas.hourData.datalist.records.map(el => el.readData.injectionPressure) || []
+    ecahrtDatas.flowStdInstant = ecahrtDatas.hourData.datalist.records.map(el => el.readData.flowStdInstant) || []
+    ecahrtDatas.mixStdInstant = ecahrtDatas.hourData.datalist.records.map(el => el.readData.mixStdInstant) || []
+    ecahrtDatas.negativePressure = ecahrtDatas.hourData.datalist.records.map(el => el.readData.negativePressure) || []
     ecahrtDatas.yData = ["20", "50", "12", "65", "30", "60", "50", "12", "65",]
     ecahrtDatas.yData1 = ["40", "60", "22", "85", "50", "40", "60", "22", "85",]
     ecahrtDatas.yData2 = ["70", "30", "42", "65", "80", "60", "30", "42", "65",]
-  } else {
-      ecahrtDatas.xData = ['3.26', '3.27', '3.28', '3.29', '3.30', '3.31']
-    // ecahrtDatas.xData = ecahrtDatas.minitesData.xlist || []
-    // ecahrtDatas.injectionPressure = ecahrtDatas.minitesData.datalist.records.map(el => el.readData.injectionPressure) || []
-    // ecahrtDatas.flowStdInstant = ecahrtDatas.minitesData.datalist.records.map(el => el.readData.flowStdInstant) || []
+  } else if (nowData.value == 'minutes') {
+    // ecahrtDatas.xData = ['3.26', '3.27', '3.28', '3.29', '3.30', '3.31']
+    ecahrtDatas.xData = ecahrtDatas.minitesData.xlist || []
+    ecahrtDatas.injectionPressure = ecahrtDatas.minitesData.datalist.records.map(el => el.readData.injectionPressure) || []
+    ecahrtDatas.flowStdInstant = ecahrtDatas.minitesData.datalist.records.map(el => el.readData.flowStdInstant) || []
+    ecahrtDatas.mixStdInstant = ecahrtDatas.minitesData.datalist.records.map(el => el.readData.mixStdInstant) || []
+    ecahrtDatas.negativePressure = ecahrtDatas.minitesData.datalist.records.map(el => el.readData.negativePressure) || []
     ecahrtDatas.yData = ["200", "500", "120", "650", "300", "600", "500", "120", "650",]
     ecahrtDatas.yData1 = ["400", "600", "220", "850", "500", "400", "600", "220", "850",]
     ecahrtDatas.yData2 = ["700", "300", "420", "650", "800", "600", "300", "420", "650",]
+  } else {
+    //  ecahrtDatas.xData = ['3.26', '3.27', '3.28', '3.29', '3.30', '3.31']
+    //  ecahrtDatas.yData = ["200", "500", "120", "650", "300", "600", "500", "120", "650",]
+    // ecahrtDatas.yData1 = ["400", "600", "220", "850", "500", "400", "600", "220", "850",]
+    // ecahrtDatas.yData2 = ["700", "300", "420", "650", "800", "600", "300", "420", "650",]
+
   }
   getOption()
 }
 
+watch(() => props.echartOption, (newV, oldV) => {
+  if (!newV.showTime) {
+    nowData.value = ''
+  }
+}, { immediate: true, deep: true })
+
 watch(() => props.ecahrtData, (newV, oldV) => {
   if (newV) {
     ecahrtDatas = Object.assign({}, newV)

src/views/vent/home/configurable/components/gasInject/echartLineDateGk.vue

@@ -3,15 +3,17 @@
     <div class="curve-nav">
       <div class="nav-search">
         <!-- 时间查询选项 -->
-        <a-radio-group v-model:value="timerTabs" name="radioGroup">
+        <a-radio-group v-model:value="timerTabs" name="radioGroup" @change="changeRadio">
           <a-radio value="day">按天</a-radio>
           <a-radio value="hours">按小时</a-radio>
           <a-radio value="minutes">按分钟</a-radio>
         </a-radio-group>
         <!-- 时间查询条件 -->
         <a-range-picker style="width:340px" :value="[searchData.startTime, searchData.endTime]"
-            :show-time="{ format: 'HH:mm' }" valueFormat="YYYY-MM-DD HH:mm" :placeholder="['开始时间', '结束时间']"
-            @change="onRangeChange" />
+          :show-time="{ format: 'HH:mm:ss' }" valueFormat="YYYY-MM-DD HH:mm:ss" :placeholder="['开始时间', '结束时间']"
+          @change="onRangeChange" />
+        <a-button type="primary" preIcon="ant-design:search-outlined" @click="getSearch"
+          style="margin-left: 10px;">查询</a-button>
       </div>
       <div class="nav-btn" @click="handleHistory">
         <div class="nav-text">
@@ -26,7 +28,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, nextTick, ref, watch,onMounted, reactive } from 'vue'
+import { computed, nextTick, ref, watch, onMounted, reactive } from 'vue'
 import * as echarts from 'echarts';
 import { listdays } from './gasInject.api'
 import dayjs from 'dayjs';
@@ -36,33 +38,69 @@ let props = defineProps({
   echartOption: {
     type: Object as any
   },
-  //图表数据
-  ecahrtData: {
-    type: Object as any
+  //设备ID
+  deviceID: {
+    type: String
+  },
+  //设备类型
+  strtype: {
+    type: String
   }
 })
 
 let timerTabs = ref('day')
 //查询时间段-天
 let searchData = reactive({
-  startTime: dayjs().subtract(1, 'day').format('YYYY-MM-DD HH:mm'),
-  endTime: dayjs().format('YYYY-MM-DD HH:mm'),
-
+  startTime: dayjs().subtract(1, 'day').format('YYYY-MM-DD HH:mm:ss'),
+  endTime: dayjs().format('YYYY-MM-DD HH:mm:ss'),
 })
 let echartLines = ref(null)
+let echartData = reactive({}) as any
 
 
-
-//获取图表数据
-async function getInit(){
-  // let res=await listdays({ttime_begin})
-  // console.log(res,'图表曲线')
+//时间间隔切换
+function changeRadio(val) {
+  timerTabs.value = val.target.value
 }
 //日期切换
 function onRangeChange(__, time) {
   searchData.startTime = time[0];
   searchData.endTime = time[1];
 }
+//获取图表数据
+async function getInit(skip) {
+  let res = await listdays({ pageNo: 1, pageSize: 1000, gdeviceids: props.deviceID, strtype: props.strtype, ttime_begin: searchData.startTime, ttime_end: searchData.endTime, skip: skip })
+  console.log(res, '图表曲线')
+  if (res) {
+    echartData.xData = res.xlist || []
+    echartData.xitongVoltage = res.datalist.records.map(el => el.readData.xitongVoltage) || []
+    echartData.zhujiCurrent = res.datalist.records.map(el => el.readData.zhujiCurrent) || []
+    echartData.fenglengCurrent = res.datalist.records.map(el => el.readData.fenglengCurrent) || []
+    echartData.qianzhouTemp = res.datalist.records.map(el => el.readData.qianzhouTemp) || []
+    echartData.houzhouTemp = res.datalist.records.map(el => el.readData.houzhouTemp) || []
+    echartData.raozuTemp = res.datalist.records.map(el => el.readData.raozuTemp) || []
+    echartData.paiqiTemp = res.datalist.records.map(el => el.readData.paiqiTemp) || []
+    echartData.penyouTemp = res.datalist.records.map(el => el.readData.penyouTemp) || []
+    echartData.youqitongTemp = res.datalist.records.map(el => el.readData.youqitongTemp) || []
+    getOption()
+  }
+}
+//查询
+function getSearch() {
+  console.log(timerTabs.value, 'timerTabs.value')
+  switch (timerTabs.value) {
+    case 'day':
+      getInit('9')
+      break;
+    case 'hours':
+      getInit('8')
+      break;
+    case 'minutes':
+      getInit('6')
+      break;
+  }
+ 
+}
 
 function getOption() {
   nextTick(() => {
@@ -96,13 +134,13 @@ function getOption() {
         axisTick: {
           show: false,
         },
-        data: props.ecahrtData.xData
+        data: echartData.xData
       }],
       yAxis: props.echartOption.yAxis,
       series: props.echartOption.series.map((el, index) => {
         return {
           ...el,
-          data: props.ecahrtData[el.data]
+          data: echartData[el.data]
         }
       })
     };
@@ -117,9 +155,8 @@ function handleHistory() {
 
 }
 
-onMounted(()=>{
-  getInit()
-   getOption()
+onMounted( () => {
+  getInit('9')
 })
 
 </script>
@@ -182,6 +219,7 @@ onMounted(()=>{
     height: 420px;
   }
 }
+
 :deep(.zxm-picker) {
   background: #0b223f !important;
   border: 1px solid #1081d7 !important;

src/views/vent/home/configurable/components/gasInject/environHistoryExport.vue

@@ -5,18 +5,19 @@
       <div class="nav-search">
         <div class="search-item">
           <span>时间:</span>
-          <a-range-picker style="width:300px" v-model:value="searchData.timer" :show-time="{ format: 'HH:mm' }"
-            format="YYYY-MM-DD HH:mm" :placeholder="['开始时间', '结束时间']" @change="onRangeChange" />
+          <a-range-picker style="width:340px" :value="[searchData.startTime, searchData.endTime]"
+            :show-time="{ format: 'HH:mm:ss' }" valueFormat="YYYY-MM-DD HH:mm:ss" :placeholder="['开始时间', '结束时间']"
+            @change="onRangeChange" />
         </div>
         <div class="search-item">
-          <span>分站:</span>
-          <a-select ref="select" v-model:value="searchData.station" style="width: 240px">
+          <span> 间隔时间:</span>
+          <a-select ref="select" v-model:value="skip" style="width: 240px">
             <a-select-option v-for="(item, index) in optionList" :key="item.label" :value="item.value">{{ item.label
             }}</a-select-option>
           </a-select>
         </div>
         <div class="search-item">
-          <a-button type="primary" preIcon="ant-design:search-outlined">查询</a-button>
+          <a-button type="primary" preIcon="ant-design:search-outlined" @click="getSearch">查询</a-button>
         </div>
       </div>
       <div class="nav-btn" @click="handleHisExport">
@@ -38,8 +39,10 @@
 </template>
 
 <script setup lang="ts">
-import { reactive, ref } from 'vue'
+import { onMounted, reactive, ref } from 'vue'
 import { SvgIcon } from '/@/components/Icon';
+import { listdays } from './gasInject.api'
+import dayjs from 'dayjs';
 
 let props = defineProps({
   //是否显示返回按钮
@@ -48,33 +51,61 @@ let props = defineProps({
   },
   tableColumn: {
     type: Array
+  },
+  deviceId: {
+    type: String
+  },
+  //设备类型
+  strtype:{
+    type:String
   }
 })
 
 let searchData = reactive({
-  timer: '',
-  station: '',
+  startTime: dayjs().subtract(1, 'day').format('YYYY-MM-DD HH:mm:ss'),
+  endTime: dayjs().format('YYYY-MM-DD HH:mm:ss'),
 })
+let skip = ref('9')
 let optionList = ref<any[]>([
-  { label: '分站', value: '1' },
-  { label: '分站1', value: '2' },
-  { label: '分站2', value: '3' },
-])
-let dataSource = ref<any[]>([
-  { fileName: '测试' },
-  { fileName: '测试' },
-  { fileName: '测试' },
-  { fileName: '测试' },
-  { fileName: '测试' },
-  { fileName: '测试' },
-  { fileName: '测试' },
-  { fileName: '测试' },
-  { fileName: '测试' },
-  { fileName: '测试' },
-  { fileName: '测试' },
-  { fileName: '测试' },
-  { fileName: '测试' },
+  {
+    label: '1秒',
+    value: '1',
+  },
+  {
+    label: '5秒',
+    value: '2',
+  },
+  {
+    label: '10秒',
+    value: '3',
+  },
+  {
+    label: '30秒',
+    value: '4',
+  },
+  {
+    label: '1分钟',
+    value: '5',
+  },
+  {
+    label: '10分钟',
+    value: '6',
+  },
+  {
+    label: '30分钟',
+    value: '7',
+  },
+  {
+    label: '1小时',
+    value: '8',
+  },
+  {
+    label: '1天',
+    value: '9',
+  },
+
 ])
+let dataSource = ref<any[]>([])
 //分页参数配置
 let pagination = reactive({
   current: 1, // 当前页码
@@ -90,10 +121,27 @@ let $emit = defineEmits(['handleBack'])
 function handleBack() {
   $emit('handleBack')
 }
+//查询
+function getSearch() {
+  pagination.current = 1
+  getTbleData()
+}
+//获取table数据
+async function getTbleData() {
+  let res = await listdays({ ttime_begin: searchData.startTime, ttime_end: searchData.endTime, skip: skip.value, gdeviceids: props.deviceId, pageNo: pagination.current, pageSize: pagination.pageSize, strtype: props.strtype })
+  console.log(res, '环境监测')
+}
 //导出历史数据
 function handleHisExport() { }
 //日期切换
-function onRangeChange() { }
+function onRangeChange(__, time) {
+  searchData.startTime = time[0];
+  searchData.endTime = time[1];
+}
+
+onMounted(() => {
+  getTbleData()
+})
 </script>
 
 <style lang="less" scoped>

src/views/vent/home/configurable/components/gasInject/environmentDetailTable.vue

@@ -1,28 +1,65 @@
 <template>
   <div class="environment-detail-table">
-    <a-tabs v-model:activeKey="activeKey">
+    <a-tabs v-model:activeKey="activeKey" @change="changeTab">
       <a-tab-pane key="1" tab="氧气传感器">
-        <environHistoryExport :isShowIcon="true" :tableColumn="columnZy"></environHistoryExport>
+        <environHistoryExport :isShowIcon="true" :tableColumn="columnZy" :deviceId="deviceId" :strtype="strtype"></environHistoryExport>
       </a-tab-pane>
       <a-tab-pane key="2" tab="甲烷传感器">
-        <environHistoryExport :isShowIcon="true" :tableColumn="columnCc"></environHistoryExport>
+        <environHistoryExport :isShowIcon="true" :tableColumn="columnCc" :deviceId="deviceId" :strtype="strtype"></environHistoryExport>
       </a-tab-pane>
       <a-tab-pane key="3" tab="温度传感器">
-        <environHistoryExport :isShowIcon="true" :tableColumn="columnCc"></environHistoryExport>
+        <environHistoryExport :isShowIcon="true" :tableColumn="columnCc" :deviceId="deviceId" :strtype="strtype"></environHistoryExport>
       </a-tab-pane>
-       <a-tab-pane key="4" tab="CO传感器">
-        <environHistoryExport :isShowIcon="true" :tableColumn="columnCc"></environHistoryExport>
+      <a-tab-pane key="4" tab="CO传感器">
+        <environHistoryExport :isShowIcon="true" :tableColumn="columnCc" :deviceId="deviceId" :strtype="strtype"></environHistoryExport>
       </a-tab-pane>
     </a-tabs>
   </div>
 </template>
 
 <script setup lang='ts'>
-import { ref } from 'vue'
+import { ref, onMounted, watchEffect, watch, onBeforeMount } from 'vue'
 import environHistoryExport from './environHistoryExport.vue'
 import { columnZy, columnCc } from './gasInject.data'
 
+
+let props = defineProps({
+  deviceData: {
+    type: Object as any
+  },
+  //设备类型
+  strtype:{
+    type:String
+  }
+})
 let activeKey = ref('1')
+let deviceId = ref('')
+
+//tab切换
+function changeTab(val) {
+  activeKey.value = val
+  switch (val) {
+    case '1':
+      deviceId.value = props.deviceData.o2.deviceID
+      break;
+    case '2':
+      deviceId.value = props.deviceData.ch4.deviceID
+      break;
+    case '3':
+      deviceId.value = props.deviceData.temp.deviceID
+      break;
+    case '4':
+      deviceId.value = props.deviceData.co.deviceID
+      break;
+  }
+}
+
+
+onBeforeMount(() => {
+  if (props.deviceData.o2) {
+    deviceId.value = props.deviceData.o2.deviceID
+  }
+})
 </script>
 
 <style lang="less" scoped>

src/views/vent/home/configurable/components/gasInject/gasInject.api.ts

@@ -6,24 +6,10 @@ import { loginCipher } from '/@/settings/encryptionSetting';
 
 
 enum Api {
-getlist = '/safety/ventanalyDevicesetLog/list',
-devicecontrol='/safety/ventanalyMonitorData/devicecontrol',
-listdays = '/safety/ventanalyMonitorData/listdays',
-historydata = '/safety/ventanalyMonitorData/export/historydata',
-
-getCameraUrl = '/monitor/camera/queryByCameraCode',
-//insertSyncRule = '/ventanaly-device/synccontrol/upcoming/saveOrUpdateRule',
-insertSyncRule = '/ventanaly-device/monitor/timeSync/insertSyncRuleClock',
-upcoming = '/ventanaly-device/synccontrol/upcoming',
-GetSyncRule='/ventanaly-device/synccontrol/upcoming/GetSyncRule',
-GetSyncRuleOperationLog='/ventanaly-device/synccontrol/upcoming/GetSyncRuleOperationLog',
-GetSyncRuleExecLog='/ventanaly-device/synccontrol/upcoming/GetSyncRuleExecLog',
-list='/safety/ventanalyDeviceInfo/list',
-edit='/ventanaly-device/safety/ventanalyDeviceInfo/batchEdit',
-manualTimeSync='/ventanaly-device/monitor/timeSync/manualTimeSync',
-isPasswordCurrect='/ventanaly-device/monitor/timeSync/isPasswordCurrect',
- editDoor='/safety/ventanalyDeviceInfo/edit'
-
+  getlist = '/safety/ventanalyDevicesetLog/list',
+  devicecontrol = '/safety/ventanalyMonitorData/devicecontrol',
+  listdays = '/safety/ventanalyMonitorData/listdays',
+  historydata = '/safety/ventanalyMonitorData/export/historydata',
 }
 
 
@@ -32,7 +18,7 @@ isPasswordCurrect='/ventanaly-device/monitor/timeSync/isPasswordCurrect',
 * 装备运行状态与控制-详情列表
 * @param params
 */
-export const getList = (params) => defHttp.get({ url: Api.getlist, params },{ joinParamsToUrl: true });
+export const getList = (params) => defHttp.get({ url: Api.getlist, params }, { joinParamsToUrl: true });
 
 
 /**
@@ -40,52 +26,20 @@ export const getList = (params) => defHttp.get({ url: Api.getlist, params },{ jo
 * @param params
 */
 export const devicecontrol = (params) => {
-// 加密password
-const encryption = new AesEncryption({ key: loginCipher.key, iv: loginCipher.iv });
-params.password = encryption.encryptByAES(params.password);
-return defHttp.put({ url: Api.devicecontrol, params });
+  // 加密password
+  const encryption = new AesEncryption({ key: loginCipher.key, iv: loginCipher.iv });
+  params.password = encryption.encryptByAES(params.password);
+  return defHttp.put({ url: Api.devicecontrol, params });
 };
 /**
 * 详情历史曲线
 * @param params
 */
-export const listdays = (params) => defHttp.get({ url: Api.listdays, params },{ joinParamsToUrl: true });
+export const listdays = (params) => defHttp.get({ url: Api.listdays, params }, { joinParamsToUrl: true });
 /**
  * 导出详情历史
  * @param params
  */
 export const historydata = (params) => defHttp.get({ url: Api.historydata, params }, { joinParamsToUrl: true });
 
-export const cameraAddr = (params) => defHttp.get({ url: Api.getCameraUrl, params });
-
-/**
-* 定时设置-读取规则
-* @param params
-*/
-export const GetSyncRule = (params) => defHttp.post({ url: Api.GetSyncRule, params });
-/**
-* 定时设置-修改规则
-* @param params
-*/
-export const insertSyncRule = (params) => {
-return defHttp.post({ url: Api.insertSyncRule, params });
-};
-
-//读取未来30秒内的预告
-export const upcoming = (params) => defHttp.get({ url: Api.upcoming, params });
-
-//读取规则日志
-export const GetSyncRuleOperationLog = (params) => defHttp.get({ url: Api.GetSyncRuleOperationLog, params });
 
-//读取集控风门操作日志
-export const GetSyncRuleExecLog = (params) => defHttp.get({ url: Api.GetSyncRuleExecLog, params });
-//集控风门列表
-export const controlList = (params) => defHttp.get({ url: Api.list, params });
-//集控风门-确认选中
-export const confirmChoice = (params) => defHttp.put({ url: Api.edit, params });
-//同步PLC时钟
-export const manualTimeSync = () => defHttp.post({ url: Api.manualTimeSync });
-//设备集控选择密码设置
-export const isPasswordCurrect = (params) => defHttp.get({ url: Api.isPasswordCurrect,params });
-//风门勾选-分组
-export const editDoor = (params) => defHttp.put({ url: Api.editDoor, params });

src/views/vent/home/configurable/components/gasInject/gasInject.data.ts

@@ -1,6 +1,293 @@
 import * as echarts from 'echarts';
 import { BasicColumn } from '/@/components/Table';
 
+//装备控制
+export let columnControl: BasicColumn[] = [
+  {
+    title: '序号',
+    width: 60,
+    align: 'center',
+    customRender: ({ index }: { index: number }) => `${index + 1}`
+  },
+  {
+    title: '设备名称',
+    dataIndex: 'devicename',
+    key: 'devicename',
+    align: 'center',
+    ellipsis: true,
+  },
+  {
+    title: '状态',
+    dataIndex: 'strremark',
+    key: 'strremark',
+    align: 'center',
+    ellipsis: true,
+  },
+  {
+    title: '操作人',
+    dataIndex: 'username',
+    key: 'username',
+    align: 'center',
+    ellipsis: true,
+  },
+  {
+    title: '操作时间',
+    dataIndex: 'createTime',
+    key: 'createTime',
+    align: 'center',
+    ellipsis: true,
+  },
+]
+//注气参数
+export let tableColumnZqcs: BasicColumn[] = [
+  {
+    title: '序号',
+    width: 60,
+    align: 'center',
+    customRender: ({ index }: { index: number }) => `${index + 1}`
+  },
+  {
+    title: '时间',
+    dataIndex: 'gcreatetime',
+    key: 'gcreatetime',
+    align: 'center',
+    ellipsis: true,
+  },
+  {
+    title: '1#钻孔',
+    children: [
+      {
+        title: '注气压力',
+        dataIndex: 'injectionPressure_1',
+        key: 'injectionPressure_1',
+        align: 'center',
+        ellipsis: true,
+      },
+      {
+        title: '标况瞬时流量',
+        dataIndex: 'flowStdInstant_1',
+        key: 'flowStdInstant_1',
+        align: 'center',
+        ellipsis: true,
+      },
+      {
+        title: '标况累计流量',
+        dataIndex: 'flowStdAccum_1',
+        key: 'flowStdAccum_1',
+        align: 'center',
+        ellipsis: true,
+      },
+      {
+        title: '工况瞬时流量',
+        dataIndex: 'flowWorkInstant_1',
+        key: 'flowWorkInstant_1',
+        align: 'center',
+        ellipsis: true,
+      },
+      {
+        title: '工况累计流量',
+        dataIndex: 'flowWorkAccum_1',
+        key: 'flowWorkAccum_1',
+        align: 'center',
+        ellipsis: true,
+      },
+    ]
+  },
+
+  {
+    title: '2#钻孔',
+    children: [
+      {
+        title: '注气压力',
+        dataIndex: 'injectionPressure_2',
+        key: 'injectionPressure_2',
+        align: 'center',
+        ellipsis: true,
+      },
+      {
+        title: '标况瞬时流量',
+        dataIndex: 'flowStdInstant_2',
+        key: 'flowStdInstant_2',
+        align: 'center',
+        ellipsis: true,
+      },
+      {
+        title: '标况累计流量',
+        dataIndex: 'flowStdAccum_2',
+        key: 'flowStdAccum_2',
+        align: 'center',
+        ellipsis: true,
+      },
+      {
+        title: '工况瞬时流量',
+        dataIndex: 'flowWorkInstant_2',
+        key: 'flowWorkInstant_2',
+        align: 'center',
+        ellipsis: true,
+      },
+      {
+        title: '工况累计流量',
+        dataIndex: 'flowWorkAccum_2',
+        key: 'flowWorkAccum_2',
+        align: 'center',
+        ellipsis: true,
+      },
+    ]
+  },
+ 
+ {
+    title: '3#钻孔',
+    children: [
+      {
+        title: '注气压力',
+        dataIndex: 'injectionPressure_3',
+        key: 'injectionPressure_3',
+        align: 'center',
+        ellipsis: true,
+      },
+      {
+        title: '标况瞬时流量',
+        dataIndex: 'flowStdInstant_3',
+        key: 'flowStdInstant_3',
+        align: 'center',
+        ellipsis: true,
+      },
+      {
+        title: '标况累计流量',
+        dataIndex: 'flowStdAccum_3',
+        key: 'flowStdAccum_3',
+        align: 'center',
+        ellipsis: true,
+      },
+      {
+        title: '工况瞬时流量',
+        dataIndex: 'flowWorkInstant_3',
+        key: 'flowWorkInstant_3',
+        align: 'center',
+        ellipsis: true,
+      },
+      {
+        title: '工况累计流量',
+        dataIndex: 'flowWorkAccum_3',
+        key: 'flowWorkAccum_3',
+        align: 'center',
+        ellipsis: true,
+      },
+    ]
+  },
+  {
+    title: '4#钻孔',
+    children: [
+      {
+        title: '注气压力',
+        dataIndex: 'injectionPressure_4',
+        key: 'injectionPressure_4',
+        align: 'center',
+        ellipsis: true,
+      },
+      {
+        title: '标况瞬时流量',
+        dataIndex: 'flowStdInstant_4',
+        key: 'flowStdInstant_4',
+        align: 'center',
+        ellipsis: true,
+      },
+      {
+        title: '标况累计流量',
+        dataIndex: 'flowStdAccum_4',
+        key: 'flowStdAccum_4',
+        align: 'center',
+        ellipsis: true,
+      },
+      {
+        title: '工况瞬时流量',
+        dataIndex: 'flowWorkInstant_4',
+        key: 'flowWorkInstant_4',
+        align: 'center',
+        ellipsis: true,
+      },
+      {
+        title: '工况累计流量',
+        dataIndex: 'flowWorkAccum_4',
+        key: 'flowWorkAccum_4',
+        align: 'center',
+        ellipsis: true,
+      },
+    ]
+  },
+]
+//抽采参数
+export let tableColumnCcs: BasicColumn[] = [
+  {
+    title: '序号',
+    width: 60,
+    align: 'center',
+    customRender: ({ index }: { index: number }) => `${index + 1}`
+  },
+  {
+    title: '设备名称',
+    dataIndex: 'gdevicename',
+    key: 'gdevicename',
+    align: 'center',
+    ellipsis: true,
+  },
+  {
+    title: '瓦斯浓度',
+    dataIndex: 'gasConcentration',
+    key: 'gasConcentration',
+    align: 'center',
+    ellipsis: true,
+  },
+  {
+    title: '抽采负压',
+    dataIndex: 'negativePressure',
+    key: 'negativePressure',
+    align: 'center',
+    ellipsis: true,
+  },
+  {
+    title: '混合气体标况总量',
+    dataIndex: 'mixStdTotal',
+    key: 'mixStdTotal',
+    align: 'center',
+    ellipsis: true,
+  },
+   {
+    title: '混合气体标况瞬量',
+    dataIndex: 'mixStdInstant',
+    key: 'mixStdInstant',
+    align: 'center',
+    ellipsis: true,
+  },
+   {
+    title: '甲烷气体标况总量',
+    dataIndex: 'methaneStdTotal',
+    key: 'methaneStdTotal',
+    align: 'center',
+    ellipsis: true,
+  },
+   {
+    title: '甲烷气体标况瞬量',
+    dataIndex: 'methaneStdInstant',
+    key: 'methaneStdInstant',
+    align: 'center',
+    ellipsis: true,
+  },
+   {
+    title: '累计流量',
+    dataIndex: 'qn',
+    key: 'qn',
+    align: 'center',
+    ellipsis: true,
+  },
+   {
+    title: '时间',
+    dataIndex: 'gcreatetime',
+    key: 'gcreatetime',
+    align: 'center',
+    ellipsis: true,
+  },
+]
 export let columnZy: BasicColumn[] = [
   {
     title: '序号',
@@ -1232,7 +1519,7 @@ export let echartOptionGk = {
   },
   legend: {
     top: '2%',
-    right: 'center',
+    left:'center',
     icon: 'circle',
     itemWidth: 8,
     itemHeight: 8,
@@ -1244,10 +1531,13 @@ export let echartOptionGk = {
     data: [
       { name: '系统电压' },
       { name: '主机电流' },
-      { name: '风机电流' },
+      { name: '风冷电流' },
       { name: '前轴温度' },
       { name: '后轴温度' },
       { name: '绕组温度' },
+      { name: '排气温度' },
+      { name: '喷油温度' },
+      { name: '油气桶温度' },
     ]
   },
   yAxis: [
@@ -1322,7 +1612,7 @@ export let echartOptionGk = {
     {
       type: 'value',
       position: 'right', // Y轴2在右边
-      offset:80,
+      offset: 80,
       name: '( ℃)',
       nameTextStyle: {
         color: "#a3a7ae",
@@ -1392,7 +1682,7 @@ export let echartOptionGk = {
           shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
         }
       },
-      data: 'yData'
+      data: 'xitongVoltage'
     },
     {
       name: '主机电流',
@@ -1431,10 +1721,10 @@ export let echartOptionGk = {
           shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
         }
       },
-      data: 'yData1'
+      data: 'zhujiCurrent'
     },
-     {
-      name: '风机电流',
+    {
+      name: '风冷电流',
       type: 'line',
       symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
       showAllSymbol: true,
@@ -1470,9 +1760,9 @@ export let echartOptionGk = {
           shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
         }
       },
-      data: 'yData2'
+      data: 'fenglengCurrent'
     },
-     {
+    {
       name: '前轴温度',
       type: 'line',
       symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
@@ -1509,7 +1799,202 @@ export let echartOptionGk = {
           shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
         }
       },
-      data: 'yData3'
+      data: 'qianzhouTemp'
+    },
+    {
+      name: '后轴温度',
+      type: 'line',
+      symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+      showAllSymbol: true,
+      symbolSize: 0,
+      smooth: true,
+      yAxisIndex: 2,
+      lineStyle: {
+        normal: {
+          width: 2,
+          color: 'rgba(228, 90, 186,1)', // 线条颜色
+        },
+        borderColor: 'rgba(0,0,0,.4)',
+      },
+      itemStyle: {
+        color: 'rgba(228, 90, 186,1)',
+        borderColor: "#646ace",
+        borderWidth: 2
+
+      },
+      areaStyle: { //区域填充样式
+        normal: {
+          //线性渐变，前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’，则该四个值是绝对像素位置。
+          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+            offset: 0,
+            color: "rgba(228, 90, 186,.4)"
+          },
+          {
+            offset: 1,
+            color: "rgba(228, 90, 186, .1)"
+          }
+          ], false),
+          shadowColor: 'rgba(228, 90, 186, 0.5)', //阴影颜色
+          shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
+        }
+      },
+      data: 'houzhouTemp'
+    },
+    {
+      name: '绕组温度',
+      type: 'line',
+      symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+      showAllSymbol: true,
+      symbolSize: 0,
+      smooth: true,
+      yAxisIndex: 2,
+      lineStyle: {
+        normal: {
+          width: 2,
+          color: 'rgba(6, 199, 99,1)', // 线条颜色
+        },
+        borderColor: 'rgba(0,0,0,.4)',
+      },
+      itemStyle: {
+        color: 'rgba(6, 199, 99,1)',
+        borderColor: "#646ace",
+        borderWidth: 2
+
+      },
+      areaStyle: { //区域填充样式
+        normal: {
+          //线性渐变，前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’，则该四个值是绝对像素位置。
+          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+            offset: 0,
+            color: "rgba(6, 199, 99,.4)"
+          },
+          {
+            offset: 1,
+            color: "rgba(6, 199, 99, .1)"
+          }
+          ], false),
+          shadowColor: 'rgba(6, 199, 99, 0.5)', //阴影颜色
+          shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
+        }
+      },
+      data: 'raozuTemp'
+    },
+    {
+      name: '排气温度',
+      type: 'line',
+      symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+      showAllSymbol: true,
+      symbolSize: 0,
+      smooth: true,
+      yAxisIndex: 2,
+      lineStyle: {
+        normal: {
+          width: 2,
+          color: 'rgba(252, 195, 31,1)', // 线条颜色
+        },
+        borderColor: 'rgba(0,0,0,.4)',
+      },
+      itemStyle: {
+        color: 'rgba(252, 195, 31,1)',
+        borderColor: "#646ace",
+        borderWidth: 2
+
+      },
+      areaStyle: { //区域填充样式
+        normal: {
+          //线性渐变，前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’，则该四个值是绝对像素位置。
+          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+            offset: 0,
+            color: "rgba(252, 195, 31,.4)"
+          },
+          {
+            offset: 1,
+            color: "rgba(252, 195, 31, .1)"
+          }
+          ], false),
+          shadowColor: 'rgba(252, 195, 31, 0.5)', //阴影颜色
+          shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
+        }
+      },
+      data: 'paiqiTemp'
+    },
+    {
+      name: '喷油温度',
+      type: 'line',
+      symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+      showAllSymbol: true,
+      symbolSize: 0,
+      smooth: true,
+      yAxisIndex: 2,
+      lineStyle: {
+        normal: {
+          width: 2,
+          color: 'rgba(218, 170, 183,1)', // 线条颜色
+        },
+        borderColor: 'rgba(0,0,0,.4)',
+      },
+      itemStyle: {
+        color: 'rgba(218, 170, 183,1)',
+        borderColor: "#646ace",
+        borderWidth: 2
+
+      },
+      areaStyle: { //区域填充样式
+        normal: {
+          //线性渐变，前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’，则该四个值是绝对像素位置。
+          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+            offset: 0,
+            color: "rgba(218, 170, 183,.4)"
+          },
+          {
+            offset: 1,
+            color: "rgba(218, 170, 183, .1)"
+          }
+          ], false),
+          shadowColor: 'rgba(218, 170, 183, 0.5)', //阴影颜色
+          shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
+        }
+      },
+      data: 'penyouTemp'
+    },
+    {
+      name: '油气桶温度',
+      type: 'line',
+      symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+      showAllSymbol: true,
+      symbolSize: 0,
+      smooth: true,
+      yAxisIndex: 2,
+      lineStyle: {
+        normal: {
+          width: 2,
+          color: 'rgba(242, 117, 148,1)', // 线条颜色
+        },
+        borderColor: 'rgba(0,0,0,.4)',
+      },
+      itemStyle: {
+        color: 'rgba(242, 117, 148,1)',
+        borderColor: "#646ace",
+        borderWidth: 2
+
+      },
+      areaStyle: { //区域填充样式
+        normal: {
+          //线性渐变，前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’，则该四个值是绝对像素位置。
+          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+            offset: 0,
+            color: "rgba(242, 117, 148,.4)"
+          },
+          {
+            offset: 1,
+            color: "rgba(242, 117, 148, .1)"
+          }
+          ], false),
+          shadowColor: 'rgba(242, 117, 148, 0.5)', //阴影颜色
+          shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
+        }
+      },
+      data: 'youqitongTemp'
     },
   ]
 }

src/views/vent/home/configurable/components/gasInject/zqHistoryExport.vue

@@ -5,30 +5,11 @@
       <div class="nav-search">
         <div class="search-item">
           <span>时间:</span>
-          <a-range-picker
-            style="width: 340px"
-            :value="[searchData.startTime, searchData.endTime]"
-            :show-time="{ format: 'HH:mm' }"
-            valueFormat="YYYY-MM-DD HH:mm"
-            :placeholder="['开始时间', '结束时间']"
-            @change="onRangeChange"
-          />
-        </div>
-        <div class="search-item">
-          <span>时间间隔:</span>
-          <a-select v-model:value="searchData.skip" placeholder="请选择" style="width: 120px; margin-left: 10px" @change="onskipChange">
-            <a-select-option v-for="item in skipOptions" :key="item.value" :value="item.value">
-              {{ item.label }}
-            </a-select-option>
-          </a-select>
-        </div>
-
-        <!-- 新增：查询按钮 -->
-        <div class="search-btn-item" @click="handleSearch">
-          <div class="btn-text">
-            <!-- <SvgIcon class="icon-style" size="16" name="search" /> -->
-            <span>查询</span>
-          </div>
+          <a-range-picker style="width:340px" :value="[searchData.startTime, searchData.endTime]"
+            :show-time="{ format: 'HH:mm:ss' }" valueFormat="YYYY-MM-DD HH:mm:ss" :placeholder="['开始时间', '结束时间']"
+            @change="onRangeChange" />
+          <a-button type="primary" preIcon="ant-design:search-outlined" @click="getSearch"
+            style="margin-left: 10px;">查询</a-button>
         </div>
       </div>
       <div class="nav-btn" @click="handleHisExport">
@@ -39,7 +20,8 @@
       </div>
     </div>
     <div class="main-content">
-      <a-table size="small" :dataSource="dataSource" :columns="tableColumns" :scroll="{ y: 455 }" :pagination="pagination">
+      <a-table size="small" :dataSource="dataSource" :columns="tableColumn" :scroll="{ y: 455 }"
+        :pagination="pagination" @change="changePage">
         <template #action="{ record }">
           <!-- <a class="table-action-link" @click="handleSpDetail(record)">审批详情</a> -->
         </template>
@@ -49,438 +31,245 @@
 </template>
 
 <script setup lang="ts">
-  import { reactive, ref, onMounted } from 'vue';
-  import { SvgIcon } from '/@/components/Icon';
-  import { getList, listdays, historydata } from './gasInject.api';
-  import dayjs from 'dayjs';
-  import { BasicColumn } from '/@/components/Table';
-
-  let props = defineProps({
-    //是否显示返回按钮
-    isShowIcon: {
-      type: Boolean,
-    },
-    tableColumn: {
-      type: Array,
-    },
-    deviceID: {
-      type: String,
-    },
-  });
-  // 设备列表显示字段
-  const DEFAULT_TOTAL_DEVICE_FIELDS = [
-    { key: 'injectionPressure', title: '注入压力' },
-    { key: 'flowWorkInstant', title: '工作瞬时流量' },
-    { key: 'flowStdAccum', title: '标准累计流量' },
-    { key: 'flowStdInstant', title: '标准瞬时流量' },
-    { key: 'flowWorkAccum', title: '工作累计流量' },
-  ];
-  // 字段名 -> 中文标题 映射表
-  const fieldTitleMap = Object.fromEntries(DEFAULT_TOTAL_DEVICE_FIELDS.map((item) => [item.key, item.title]));
-  // 定义时间间隔选项
-  const skipOptions = [
-    { label: '1秒', value: 1 },
-    { label: '5秒', value: 2 },
-    { label: '10秒', value: 3 },
-    { label: '30秒', value: 4 },
-    { label: '1分钟', value: 5 },
-    { label: '10分钟', value: 6 },
-    { label: '30分钟', value: 7 },
-  ];
-
-  let searchData = reactive({
-    startTime: dayjs().subtract(1, 'day').format('YYYY-MM-DD HH:mm:ss'),
-    endTime: dayjs().format('YYYY-MM-DD HH:mm:ss'),
-    skip: 5, // 存储选中的间隔值
-  });
-  let dataSource = ref<any[]>([
-    // { fileName: '测试' },
-  ]);
-  let tableColumns = ref<BasicColumn[]>([]);
-  //分页参数配置
-  let pagination = reactive({
-    current: 1, // 当前页码
-    pageSize: 15, // 每页显示条数
-    total: 0, // 总条目数，后端返回
-    // showTotal: (total, range) => `${range[0]}-${range[1]} 条，总共 ${total} 条`, // 分页右下角显示信息
-    showSizeChanger: true, // 是否可改变每页显示条数
-    pageSizeOptions: ['15', '20', '25', '30', '50'], // 可选的每页显示条数
-  });
-  let $emit = defineEmits(['handleBack']);
-
-  //返回上一级
-  function handleBack() {
-    $emit('handleBack');
-  }
-
-  //注气详情table数据
-  async function getHistoryTableData() {
-    let res = await listdays({
-      ttime_begin: searchData.startTime,
-      ttime_end: searchData.endTime,
-      pageNo: pagination.current,
-      pageSize: pagination.pageSize,
-      skip: searchData.skip,
-      gdeviceids: props.deviceID,
-      strtype: 'injection_standard',
-    });
-    dataSource.value = transformTableData(res.datalist.records);
-    tableColumns.value = generateTableColumns(dataSource.value);
-  }
-  //导出历史数据
-  async function handleHisExport() {
-    let res = await historydata({
-      ttime_begin: searchData.startTime,
-      ttime_end: searchData.endTime,
-      pageNo: pagination.current,
-      pageSize: pagination.pageSize,
-      skip: searchData.skip,
-      gdeviceids: props.deviceID,
-      strtype: 'injection_standard',
-    });
-  }
-  //日期切换
-  function onRangeChange(__, time) {
-    searchData.startTime = time[0];
-    searchData.endTime = time[1];
+import { reactive, ref, onMounted } from 'vue'
+import { SvgIcon } from '/@/components/Icon';
+import { listdays, getList, } from './gasInject.api'
+import dayjs from 'dayjs';
+
+let props = defineProps({
+  //是否显示返回按钮
+  isShowIcon: {
+    type: Boolean
+  },
+  tableColumn: {
+    type: Array
+  },
+  //设备ID
+  deviceId: {
+    type: String
+  },
+  //详情页数据类型
+  detailType: {
+    type: String
+  },
+  //设备类型
+  strtype: {
+    type: String
   }
-  // 时间间隔切换
-  function onskipChange(value: number) {
-    // 可以在此调用 handleSearch()
-  }
-  // 查询操作
-  function handleSearch() {
-    getHistoryTableData();
-  }
-
-  /**
-   * 将原始 records 转换为表格所需的扁平化数据，按设备分组
-   * @param records 原始数据列表
-   */
-  function transformTableData(records: any[]) {
-    if (!records || records.length === 0) return [];
-
-    // 1. 收集所有子设备号（从readData字段末尾的数字提取）和对应的基础字段
-    const allDevices = new Set<number>(); // 所有子设备号（字段末尾的数字）
-    const deviceFieldMap = new Map<number, Set<string>>(); // 设备号 -> 该设备对应的字段名集合
-    const baseFields = new Set<string>(); // 无数字后缀的基础字段
-
-    // 遍历所有记录，提取设备号和字段映射
-    records.forEach((record) => {
-      const readData = record.readData;
-      if (!readData) return;
-
-      Object.keys(readData).forEach((fieldKey) => {
-        // 匹配字段末尾的数字（支持下划线/直接数字结尾，如 flowStdAccum_1 或 flowStdAccum1）
-        const numMatch = fieldKey.match(/(\d+)$/); // 匹配末尾的数字
-        // const separatorMatch = fieldKey.match(/(.+?)[_-](\d+)$/); // 匹配 "字段_数字" 格式（兼容下划线/短横线分隔）
-
-        if (numMatch) {
-          // 字段末尾有数字 → 归为子设备字段
-          const deviceNo = parseInt(numMatch[1], 10);
-          allDevices.add(deviceNo);
-
-          // 提取「纯字段名」（去掉末尾的数字/分隔符）
-          // const pureField = separatorMatch ? separatorMatch[1] : fieldKey.replace(numMatch[0], '');
-
-          // 记录该设备对应的字段
-          if (!deviceFieldMap.has(deviceNo)) {
-            deviceFieldMap.set(deviceNo, new Set<string>());
-          }
-          deviceFieldMap.get(deviceNo)!.add(fieldKey); // 直接存原始字段名（如 flowStdAccum_1）
-        } else {
-          // 字段末尾无数字 → 归为基础字段
-          baseFields.add(fieldKey);
-        }
-      });
-    });
-
-    // 格式转换：Set → 排序后的数组
-    const deviceList = Array.from(allDevices).sort((a, b) => a - b);
-
-    // 2. 构建最终的表格数据
-    const result: any[] = [];
-
-    records.forEach((record) => {
-      const { gcreatetime, gdevicename, ginstallpos, gdeviceid } = record;
-      const readData = record.readData || {};
-
-      // 基础行数据（固定字段）
-      const rowItem: any = {
-        key: record.id,
-        time: gcreatetime,
-        deviceName: gdevicename,
-        installPos: ginstallpos,
-        deviceId: gdeviceid,
-      };
-
-      // 3. 处理子设备数据（仅字段末尾带数字的字段）
-      deviceList.forEach((deviceNo) => {
-        const deviceKey = `subDevice${deviceNo}`;
-        rowItem[deviceKey] = {};
-
-        // 获取该设备对应的所有字段，赋值
-        const deviceFields = deviceFieldMap.get(deviceNo) || new Set<string>();
-        deviceFields.forEach((fieldKey) => {
-          const value = readData[fieldKey];
-          rowItem[deviceKey][fieldKey] = value !== null && value !== undefined ? value : '-';
-        });
-      });
-      // 合并：基础字段 + 核心字段（确保核心字段必存在）
-      const allBaseFields = new Set([...baseFields, ...DEFAULT_TOTAL_DEVICE_FIELDS.map((item) => item.key)]);
-      allBaseFields.forEach((fieldKey) => {
-        const value = readData[fieldKey];
-        rowItem[fieldKey] = value !== null && value !== undefined ? value : '-';
-      });
-
-      result.push(rowItem);
-    });
-
-    return result;
-  }
-  function generateTableColumns(data): BasicColumn[] {
-    // 1. 固定列
-    const fixedColumns: BasicColumn[] = [
-      {
-        title: '序号',
-        width: 60,
-        align: 'center',
-        fixed: 'left',
-        customRender: ({ index }: { index: number }) => `${index + 1}`,
-      },
-      {
-        title: '时间',
-        dataIndex: 'time',
-        key: 'time',
-        align: 'center',
-        fixed: 'left',
-        width: 120,
-      },
-    ];
-
-    if (!data || data.length === 0) return fixedColumns;
-
-    // 2. 动态生成子设备分组列
-    // 取第一行数据作为样本分析结构
-    const sampleRow = data[0];
-
-    // 提取所有以 subDevice 开头的 key (如 ['subDevice1', 'subDevice2'])
-    const subDeviceKeys = Object.keys(sampleRow).filter((key) => key.startsWith('subDevice'));
-    // 如果没有以 subDevice 开头的 key，则生成总设备列
-    if (subDeviceKeys.length === 0) {
-      const totalDeviceColumns = DEFAULT_TOTAL_DEVICE_FIELDS.map((item) => ({
-        title: item.title,
-        dataIndex: item.key,
-        key: item.key,
-        align: 'center',
-        width: 140,
-        ellipsis: true,
-      }));
-
-      return [...fixedColumns, ...totalDeviceColumns];
-    }
-
-    // 遍历每个 subDevice 生成分组
-    const dynamicColumns = subDeviceKeys
-      .map((deviceKey) => {
-        // 获取该子设备下的所有数据字段 (如 { flowStdInstant_1: "118.40" ... })
-        const deviceDataSample = sampleRow[deviceKey];
-        if (!deviceDataSample) return null;
-
-        // 获取该子设备下的所有字段名 (如 ['flowStdInstant_1', 'injectionPressure_1' ...])
-        const fieldKeys = Object.keys(deviceDataSample);
-
-        // 生成 children 子列
-        const childrenColumns = fieldKeys.map((fieldKey) => {
-          // 处理显示标题：去掉末尾的 "_1", "_2" 后缀，让表头好看点
-          // 比如 "flowStdInstant_1" -> "flowStdInstant"
-          const title = fieldKey.replace(/_\d+$/, '');
-          // 优化：提取纯字段名（兼容 flowStdInstant_1 / flowStdInstant1 两种格式）
-          let pureFieldKey = '';
-          // 匹配 "字段_数字" 格式（如 flowStdInstant_1）
-          const separatorMatch = fieldKey.match(/(.+?)[_-](\d+)$/);
-          // 匹配 "字段数字" 格式（如 flowStdInstant1）
-          const directNumMatch = fieldKey.match(/(.+?)(\d+)$/);
-
-          if (separatorMatch) {
-            pureFieldKey = separatorMatch[1]; // 提取 flowStdInstant
-          } else if (directNumMatch) {
-            pureFieldKey = directNumMatch[1]; // 提取 flowStdInstant
-          } else {
-            pureFieldKey = fieldKey; // 兜底（无数字后缀）
-          }
-
-          // 核心：通过映射表获取中文标题，兜底用原字段名
-          const columnTitle = fieldTitleMap[pureFieldKey] || pureFieldKey;
-
-          return {
-            title: columnTitle,
-            dataIndex: [deviceKey, fieldKey], //对应嵌套结构：row[deviceKey][fieldKey]
-            key: `${deviceKey}-${fieldKey}`,
-            align: 'center',
-            width: 140,
-            ellipsis: true,
-          };
-        });
-
-        return {
-          title: `注气子设备${deviceKey.replace('subDevice', '')}`, // 分组标题
-          key: deviceKey,
-          align: 'center',
-          children: childrenColumns,
-        };
-      })
-      .filter(Boolean); // 过滤掉空值
-
-    return [...fixedColumns, ...dynamicColumns];
+})
+
+let searchData = reactive({
+  startTime: dayjs().subtract(1, 'day').format('YYYY-MM-DD HH:mm:ss'),
+  endTime: dayjs().format('YYYY-MM-DD HH:mm:ss'),
+})
+let dataSource = ref<any[]>([])
+//分页参数配置
+let pagination = reactive({
+  current: 1, // 当前页码
+  pageSize: 15, // 每页显示条数
+  total: 0, // 总条目数，后端返回
+  // showTotal: (total, range) => `${range[0]}-${range[1]} 条，总共 ${total} 条`, // 分页右下角显示信息
+  showSizeChanger: true, // 是否可改变每页显示条数
+  pageSizeOptions: ['15', '30', '50'], // 可选的每页显示条数
+});
+
+let $emit = defineEmits(['handleBack'])
+//返回上一级
+function handleBack() {
+  $emit('handleBack')
+}
+//日期切换
+function onRangeChange(__, time) {
+  searchData.startTime = time[0];
+  searchData.endTime = time[1];
+}
+
+//注气详情table数据
+async function getHistoryTableData() {
+  if (props.detailType == 'history') {
+    let res = await listdays({ pageNo: pagination.current, pageSize: pagination.pageSize, gdeviceids: props.deviceId, strtype: props.strtype, ttime_begin: searchData.startTime, ttime_end: searchData.endTime, skip: '8' })
+    console.log(res, 'tableData---')
+    let data = res.datalist.records.map(el => {
+      return {
+        ...el,
+        ...el.readData
+      }
+    })
+    dataSource.value = data
+    pagination.total = res.datalist.total
+  } else {
+    let res = await getList({ pageNo: pagination.current, pageSize: pagination.pageSize, createTime_begin: searchData.startTime, createTime_end: searchData.endTime, devicetype: props.strtype })
+    console.log(res, '装备运行状态与控制')
+    dataSource.value = res.records || []
+    pagination.total = res.total
   }
-
-  onMounted(() => {
-    getHistoryTableData();
-  });
+}
+//查询
+function getSearch() {
+  pagination.current = 1
+  getHistoryTableData()
+}
+//切换分页
+function changePage(val) {
+  pagination.current = val.current;
+  pagination.pageSize = val.pageSize;
+  getHistoryTableData()
+}
+//导出历史数据
+async function handleHisExport() {
+  // let res = await historydataExport({ ttime_begin: searchData.startTime, ttime_end: searchData.endTime, skip: '8', gdeviceids: props.deviceId, pageNo: pagination.current, pageSize: pagination.pageSize, strtype: props.strtype })
+  // console.log(res, '导出')
+}
+
+
+onMounted(() => {
+  getHistoryTableData()
+})
 </script>
 
 <style lang="less" scoped>
-  @import '/@/design/theme.less';
-
-  @{theme-deepblue} {
-    .history-export {
-      --image-inject_zq_monitor: url('@/assets/images/themify/deepblue/home-container/configurable/gasInjection/9-3.png');
-    }
-  }
+@import '/@/design/theme.less';
 
+@{theme-deepblue} {
   .history-export {
-    --image-inject_zq_monitor: url('@/assets/images/gasInjection/9-3.png');
-    position: relative;
-    width: 100%;
-    height: 100%;
-
-    .icon-style-back {
-      position: absolute;
-      left: 6px;
-      top: -44px;
-      cursor: pointer;
-    }
-
-    .nav-box {
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      width: 100%;
-      height: 39px;
-      padding: 0px 20px;
-      margin-bottom: 15px;
-      background: var(--image-inject_zq_monitor) no-repeat;
-      background-size: 100% 100%;
-    }
-
-    .nav-search {
-      display: flex;
-      align-items: center;
-      height: 100%;
-      color: #fff;
-    }
-
-    .search-item {
-      margin-right: 40px;
-    }
-    .search-btn-item {
-      display: flex;
-      width: 100px;
-      height: 78%;
-      padding: 2px;
-      cursor: pointer;
-      justify-content: center;
-      align-items: center;
-      background-color: #1081d7;
-      border-radius: 4px;
-    }
-
-    .nav-btn {
-      width: 100px;
-      height: 78%;
-      padding: 2px;
-      border: 1px solid #1081d7;
-      cursor: pointer;
-      color: #fff;
-    }
-
-    .nav-text {
-      width: 100%;
-      height: 100%;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      background-color: #1081d7;
-    }
-
-    .icon-style {
-      margin-right: 5px;
-    }
-
-    .main-content {
-      display: flex;
-      justify-content: space-between;
-      width: 100%;
-      height: calc(100% - 54px);
-      min-height: 500px;
-    }
+    --image-inject_zq_monitor: url('@/assets/images/themify/deepblue/home-container/configurable/gasInjection/9-3.png');
   }
-
-  :deep(.zxm-picker) {
-    background: #0b223f !important;
-    border: 1px solid #1081d7 !important;
-    border-radius: 4px;
-    margin-left: 10px;
+}
+
+.history-export {
+  --image-inject_zq_monitor: url('@/assets/images/gasInjection/9-3.png');
+  position: relative;
+  width: 100%;
+  height: 100%;
+
+  .icon-style-back {
+    position: absolute;
+    left: 6px;
+    top: -44px;
+    cursor: pointer;
   }
 
-  :deep(.zxm-picker-input > input) {
-    color: #fff;
+  .nav-box {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    width: 100%;
+    height: 39px;
+    padding: 0px 20px;
+    margin-bottom: 15px;
+    background: var(--image-inject_zq_monitor) no-repeat;
+    background-size: 100% 100%;
   }
 
-  :deep(.zxm-picker-separator) {
+  .nav-search {
+    display: flex;
+    align-items: center;
+    height: 100%;
     color: #fff;
   }
 
-  :deep(.zxm-select) {
-    color: #fff !important;
+  .search-item {
+    margin-right: 40px;
   }
 
-  :deep(.zxm-select-selector) {
-    background: #0b223f !important;
-    border: 1px solid #1081d7 !important;
+  .search-btn-item {
+    display: flex;
+    width: 100px;
+    height: 78%;
+    padding: 2px;
+    cursor: pointer;
+    justify-content: center;
+    align-items: center;
+    background-color: #1081d7;
     border-radius: 4px;
-    margin-left: 10px;
   }
 
-  :deep(.zxm-table-header) {
-    border-left: 1px solid #2896ca !important;
-    border-right: 1px solid #2896ca !important;
+  .nav-btn {
+    width: 100px;
+    height: 78%;
+    padding: 2px;
+    border: 1px solid #1081d7;
+    cursor: pointer;
+    color: #fff;
   }
 
-  :deep(.zxm-table-thead > tr > th:last-child) {
-    border-right: 1px solid #2896ca !important;
+  .nav-text {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background-color: #1081d7;
   }
-  :deep(.zxm-table-cell-fix-left) {
-    background-color: var(--vent-table-thead) !important;
+
+  .icon-style {
+    margin-right: 5px;
   }
 
-  :deep(.zxm-table-tbody > tr) {
-    &:nth-child(odd) {
-      td {
-        background-color: #0d2c50 !important;
-      }
+  .main-content {
+    display: flex;
+    justify-content: space-between;
+    width: 100%;
+    height: calc(100% - 54px);
+    min-height: 500px;
+  }
+}
+
+:deep(.zxm-picker) {
+  background: #0b223f !important;
+  border: 1px solid #1081d7 !important;
+  border-radius: 4px;
+  margin-left: 10px;
+}
+
+:deep(.zxm-picker-input > input) {
+  color: #fff;
+}
+
+:deep(.zxm-picker-separator) {
+  color: #fff;
+}
+
+:deep(.zxm-select) {
+  color: #fff !important;
+}
+
+:deep(.zxm-select-selector) {
+  background: #0b223f !important;
+  border: 1px solid #1081d7 !important;
+  border-radius: 4px;
+  margin-left: 10px;
+}
+
+:deep(.zxm-table-header) {
+  border-left: 1px solid #2896ca !important;
+  border-right: 1px solid #2896ca !important;
+}
+
+:deep(.zxm-table-thead > tr > th:last-child) {
+  border-right: 1px solid #2896ca !important;
+}
+
+:deep(.zxm-table-cell-fix-left) {
+  background-color: var(--vent-table-thead) !important;
+}
+
+:deep(.zxm-table-tbody > tr) {
+  &:nth-child(odd) {
+    td {
+      background-color: #0d2c50 !important;
     }
+  }
 
-    &:nth-child(even) {
-      td {
-        background-color: #0d233f !important;
-      }
+  &:nth-child(even) {
+    td {
+      background-color: #0d233f !important;
     }
   }
+}
 
-  :deep(.zxm-table-tbody > tr > td) {
-    border-color: transparent !important;
-    background: #0a2140 !important;
-  }
+:deep(.zxm-table-tbody > tr > td) {
+  border-color: transparent !important;
+  background: #0a2140 !important;
+}
 </style>

src/views/vent/home/configurable/components/gasInject/zqMonitorDetail.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="zq-monitor">
-    <template v-if="!showExport">
+    <!-- <template v-if="!showExport">
       <div class="nav-box">
         <div class="nav-btn" @click="handleExport">
           <div class="nav-text">
@@ -46,10 +46,10 @@
           </div>
         </div>
       </div>
-    </template>
-    <template v-else>
-      <zqHistoryExport :tableColumn="tableColumn" :isShowIcon="isShowExport" @handleBack="handleBack"></zqHistoryExport>
-    </template>
+    </template> -->
+    <zqHistoryExport :tableColumn="tableColumn" :detailType="'operation'" :isShowIcon="isShowExport" :deviceId="deviceID"  :strtype="strtype"
+      @handleBack="handleBack">
+    </zqHistoryExport>
   </div>
 </template>
 
@@ -59,75 +59,40 @@
   import zqDetailCard from './zqDetailCard.vue';
   import zqHistoryExport from './zqHistoryExport.vue';
 
-  let props = defineProps({
-    //是否打开历史数据页面
-    isShowExport: {
-      type: Boolean,
-    },
-    //table列
-    tableColumn: {
-      type: Array,
-    },
-    //详情界面配置项
-    optionDetail: {
-      type: Array,
-    },
-    data: {
-      type: Object as any,
-    },
-  });
+let props = defineProps({
+  //是否打开历史数据页面
+  isShowExport: {
+    type: Boolean
+  },
+  //table列
+  tableColumn: {
+    type: Array
+  },
+  //详情界面配置项
+  optionDetail: {
+    type: Array
+  },
+  //设备ID
+  deviceID: {
+    type: String
+  },
+  //设备类型
+  strtype:{
+    type:String
+  }
+})
 
-  let showExport = ref(false);
-  //注气详情数据
-  let zqDetailData1 = reactive({
-    value1: '10',
-    value2: '10',
-    value3: '10',
-    value4: '10',
-    value5: '10',
-    value6: '10',
-  });
-  let zqDetailData2 = reactive({
-    value1: '20',
-    value2: '20',
-    value3: '20',
-    value4: '20',
-    value5: '20',
-    value6: '20',
-  });
-  let zqDetailData3 = reactive({
-    value1: '30',
-    value2: '30',
-    value3: '30',
-    value4: '30',
-    value5: '30',
-    value6: '30',
-  });
-  let zqDetailData4 = reactive({
-    value1: '40',
-    value2: '40',
-    value3: '40',
-    value4: '40',
-    value5: '40',
-    value6: '40',
-  });
+let showExport = ref(false)
 
-  //历史数据跳转
-  function handleExport() {
-    showExport.value = true;
-  }
-  //历史数据返回至详情
-  function handleBack() {
-    showExport.value = false;
-  }
 
-  watch(
-    () => props.isShowExport,
-    (newV, oldV) => {
-      showExport.value = newV;
-    },
-    { immediate: true }
-  );
+//历史数据返回至详情
+function handleBack() {
+  showExport.value = false
+}
+
+watch(() => props.isShowExport, (newV, oldV) => {
+  showExport.value = newV
+}, { immediate: true })
 </script>
 
 <style lang="less" scoped>

src/views/vent/home/configurable/components/preset/gasDeviceStatusControl.vue

@@ -38,11 +38,11 @@
       <div class="pass-box" style="margin:25px 15px;">
         <p style="display: flex;align-items: center;justify-content: center;">
           <ExclamationCircleFilled style="color: #ffb700; font-size: 20px;margin-right: 10px;" />
-          您是否要进行{{modalOpration }} ？
+          您是否要进行{{ modalLabel }} ？
         </p>
         <div style="display: flex;align-items: center;">
           <span style="width:100px">操作密码：</span>
-          <a-input-password  v-model:value="passWords" :disabled="false" />
+          <a-input-password v-model:value="passWords" :disabled="false" />
         </div>
       </div>
     </a-modal>
@@ -54,6 +54,7 @@ import { reactive, ref, watch } from 'vue'
 import { SvgIcon } from '/@/components/Icon';
 import { ExclamationCircleFilled } from '@ant-design/icons-vue';
 import { devicecontrol } from '../gasInject/gasInject.api'
+import { useMessage } from '/@/hooks/web/useMessage';
 
 let props = defineProps({
   option: {
@@ -64,10 +65,13 @@ let props = defineProps({
   }
 })
 
+const { createMessage } = useMessage();
 let statusDatas = reactive({}) as any
 let presure = ref('')
 let visibleTip = ref(false)//密码提示弹窗是否开启
-let modalOpration = ref('')
+let modalLabel = ref('')
+let modalCode = ref('')
+let modalStatusVal = ref('')
 let passWords = ref('')//操作密码
 
 //设置
@@ -78,25 +82,58 @@ function handleSetting() {
 function handlerClick(param, item) {
   passWords.value = ''
   visibleTip.value = true
-  modalOpration.value=item.label
+  modalLabel.value = item.label
   switch (param) {
     case 'open':
       statusDatas[item.value] = '1'
+      if (item.isPqfm) {
+        //排气端阀门
+        modalCode.value = 'runStatus'
+      } else {
+        //装备启停
+        modalCode.value = 'runStatus'
+      }
+      modalStatusVal.value = '1'
       break;
     case 'close':
       statusDatas[item.value] = '0'
+      if (item.isPqfm) {
+        //排气端阀门
+        modalCode.value = 'runStatus'
+      } else {
+        //装备启停
+        modalCode.value = 'runStatus'
+      }
+      modalStatusVal.value = '0'
       break;
     case 'jd':
+      modalCode.value = 'remoteStatus'
+      modalStatusVal.value = '1'
       break;
     case 'yc':
+      modalCode.value = 'remoteStatus'
+      modalStatusVal.value = '0'
+      break;
+    case 'set':
+      modalCode.value = 'remoteStatus'
+      modalStatusVal.value = '1'
       break;
   }
 }
 //密码提示弹窗-确定
 async function handleOk() {
-  let res= await devicecontrol({deviceid:statusDatas.deviceId,devicetype:statusDatas.devicetype,masterComputer: 0,paramcode:'',password:passWords.value})
-  console.log(res,'控制---')
-  visibleTip.value = false
+  if (!passWords.value) {
+    createMessage.warning('请输入密码!');
+  } else {
+    let res = await devicecontrol({ deviceid: statusDatas.deviceId, devicetype: statusDatas.devicetype, masterComputer: 0, paramcode: modalCode.value, password: passWords.value, value:modalStatusVal.value })
+    console.log(res, '控制---')
+    if(res.success){
+       createMessage.success(res.message);
+       visibleTip.value = false
+    }
+    
+  }
+
 }
 //密码提示弹窗-关闭
 function handleCancel() {

src/views/vent/home/configurable/components/preset/gasInjectChart.vue

@@ -3,25 +3,21 @@
 </template>
 
 <script setup lang="ts">
-import { nextTick, ref, onMounted, reactive } from 'vue'
+import { nextTick, ref, onMounted, reactive, watch } from 'vue'
 import * as echarts from 'echarts';
 
 let props = defineProps({
   option: {
     type: Object as any
   },
-  echartData:{
-    type:Object as any
+  echartData: {
+    type: Object as any
   }
 })
 
 let gasInjectChart = ref(null)
-
-var xData = ["01:00", "02:00", "03:00", "04:00", "05:00", "06:00"]
-let echartData = reactive({
-  line: ["1030", "205", "84", "568", "689", "4587"],
-  line1: ["103", "20", "8", "56", "68", "458"]
-})
+//图表数据
+let echartDatas = reactive({}) as any
 
 let xLabel = ['3.26', '3.27', '3.28', '3.29', '3.30', '3.31']
 let goToSchool = ["40", "60", "22", "85", "50", "40"]
@@ -37,7 +33,7 @@ function getOption() {
         grid: props.option.grid,
         legend: props.option.legend,
         xAxis: [{
-          data: xData,
+          data: echartDatas.xData,
           axisLabel: {
             textStyle: {
               color: 'rgba(181, 185, 191)',
@@ -63,7 +59,7 @@ function getOption() {
         series: props.option.series.map(el => {
           return {
             ...el,
-            data:echartData[el.data]
+            data: echartDatas[el.data]
           }
         })
       };
@@ -176,9 +172,15 @@ function getOption() {
   });
 }
 
-onMounted(() => {
-  getOption()
-})
+watch(() => props.echartData, (newV, oldV) => {
+  console.log(newV, '单元抽采数据')
+  if (newV) {
+    echartDatas.xData = newV.map(el => el.typeName)
+    echartDatas.yData = newV.map(el => el.datalist[0].readData.mixStdInstant)
+    echartDatas.yData1 = newV.map(el => el.datalist[0].readData.gasConcentration)
+    getOption()
+  }
+}, { immediate: true })
 
 </script>
 

src/views/vent/home/configurable/components/preset/gasInjectList.vue

@@ -3,7 +3,7 @@
     <div class="list-box-item" v-for="(item, index) in option" :key="index">
       <div class="box-item-label">{{ item.label }}</div>
       <div class="box-item-value">
-        <span> {{ item.value }}</span>
+        <span> {{ listDatas[item.value] }}</span>
         <span style="margin-left: 5px; color: aliceblue">{{ item.unit }}</span>
       </div>
     </div>
@@ -11,14 +11,24 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue';
+import { reactive, ref, watch } from 'vue';
 
 let props = defineProps({
   option: {
     type: Array as any,
   },
+  listData: {
+    type: Object as any
+  }
 });
 
+let listDatas = reactive({})
+
+watch(() => props.listData, (newV, oldV) => {
+  if (newV) {
+    listDatas = Object.assign({}, newV)
+  }
+}, { immediate: true })
 </script>
 
 <style lang="less" scoped>

src/views/vent/home/configurable/configurable.api.ts

@@ -2,7 +2,7 @@ import { floor, isArray, random, slice } from 'lodash-es';
 import { defHttp } from '/@/utils/http/axios';
 import { get } from '../billboard/utils';
 import { useGlobSetting } from '/@/hooks/setting';
-import { reactive } from 'vue';
+import { ref, reactive } from 'vue';
 import _ from 'lodash';
 
 enum Api {
@@ -21,10 +21,11 @@ enum Api {
   listdays = '/safety/ventanalyMonitorData/listdays',
 }
 
+
 // 搞这个缓存是由于：目前代码上的设计是多个模块发出多次请求，每个模块自己负责消费前者的响应。
 // 这会导致相同的请求被同时发送多次。
 const cache = new Map<string, Promise<any>>();
-
+let count = ref(0)
 /**
  * 列表接口，5.5专用，和6.0的getHomeData基本一致
  * @param params
@@ -679,29 +680,26 @@ export const getSystemApi = (params) => {
     );
   }
   return (cache.get(key) as Promise<any>).then(async (res) => {
-    //抽采数据
-    let pumpData = await getCcSystem();
-    res.pumpData = pumpData.msgTxt[0].datalist[0];
-    let historyDataCc = reactive<any>({});
-    historyDataCc.hourData = await getZqSystem({ gdeviceids: res.pumpData.deviceID, strtype: 'pump_standard', skip: '8' });
-    historyDataCc.minitesData = await getZqSystem({ gdeviceids: res.pumpData.deviceID, strtype: 'pump_standard', skip: '6' });
-    res.historyDataCc = historyDataCc;
+
     //注气数据
-    let zqData = res.msgTxt.find((v) => v.type == 'injection_standard').datalist[0];
-    let co = res.msgTxt.find((v) => v.type == 'modelsensor_co').datalist[0];
-    let ch4 = res.msgTxt.find((v) => v.type == 'modelsensor_ch4').datalist[0];
-    let o2 = res.msgTxt.find((v) => v.type == 'modelsensor_o2').datalist[0];
-    let temp = res.msgTxt.find((v) => v.type == 'modelsensor_temperature').datalist[0];
+    let zqData = res.msgTxt.find(v => v.type == 'injection_standard').datalist[0]
+    res.co = res.msgTxt.find(v => v.type == 'modelsensor_co').datalist[0]
+    res.ch4 = res.msgTxt.find(v => v.type == 'modelsensor_ch4').datalist[0]
+    res.o2 = res.msgTxt.find(v => v.type == 'modelsensor_o2').datalist[0]
+    res.temp = res.msgTxt.find(v => v.type == 'modelsensor_temperature').datalist[0]
+    //视频监控
+    res.deviceId = zqData.deviceID
+    res.strtype = zqData.deviceType
     //注气驱替促抽系统状态
     res.zyStatusData = {
       Pressure: zqData.readData.Pressure,
       paiqiPressure: zqData.readData.paiqiPressure,
     };
     //注气/抽采历史图表数据
-    let historyDataZq = reactive<any>({});
-    historyDataZq.hourData = await getZqSystem({ gdeviceids: zqData.deviceID, strtype: 'injection_standard', skip: '8' });
-    historyDataZq.minitesData = await getZqSystem({ gdeviceids: zqData.deviceID, strtype: 'injection_standard', skip: '6' });
-    res.historyDataZq = historyDataZq;
+    let historyDataZq = reactive<any>({})
+    historyDataZq.hourData = await getZqSystem({ pageNo: 1, pageSize: 100, gdeviceids: zqData.deviceID, strtype: zqData.deviceType, skip: '8' })
+    historyDataZq.minitesData = await getZqSystem({ pageNo: 1, pageSize: 100, gdeviceids: zqData.deviceID, strtype: zqData.deviceType, skip: '6' })
+    res.historyDataZq = historyDataZq
     //装备运行状态与控制
     res.deviceStatusControl = {
       deviceId: zqData.deviceID,
@@ -720,11 +718,11 @@ export const getSystemApi = (params) => {
     };
     //环境监测
     res.environmentData = {
-      coVal: co.readData.coval || '-',
-      ch4Val: ch4.readData.ch4val || '-',
-      o2Val: o2.readData.o2val || '-',
-      temperature: temp.readData.temperature || '-',
-    };
+      coVal: res.co.readData.coval || '-',
+      ch4Val: res.ch4.readData.ch4val || '-',
+      o2Val: res.o2.readData.o2val || '-',
+      temperature: res.temp.readData.temperature || '-',
+    }
     //装备运行工况监测
     res.deviceGkData = {
       xitongVoltage: zqData.readData.xitongVoltage || '-',
@@ -736,10 +734,121 @@ export const getSystemApi = (params) => {
       paiqiTemp: zqData.readData.paiqiTemp || '-',
       penyouTemp: zqData.readData.penyouTemp || '-',
       youqitongTemp: zqData.readData.youqitongTemp || '-',
-    };
-    //视频监控
-    res.deviceId = zqData.deviceID;
+    }
 
+
+
+    //抽采数据
+    //let pumpData = await getCcSystem();
+    res.pumpData = res.msgTxt[res.msgTxt.length - 1].empty_device[0].datalist[0]
+    res.pumpDeviceId = res.pumpData.deviceID
+    res.pumpStrtype = 'pump'
+    let historyDataCc = reactive<any>({})
+    historyDataCc.hourData = await getZqSystem({ pageNo: 1, pageSize: 100, gdeviceids: res.pumpData.deviceID, strtype: res.pumpData.deviceType, skip: '8' })
+    historyDataCc.minitesData = await getZqSystem({ pageNo: 1, pageSize: 100, gdeviceids: res.pumpData.deviceID, strtype: res.pumpData.deviceType, skip: '6' })
+    res.historyDataCc = historyDataCc
+    //应用场景信息
+    res.workInfo = {
+      strinstallpos: res.pumpData.strinstallpos || '-',
+      quduanLength: res.pumpData.quduanLength || '-',
+      quduanWidth: res.pumpData.quduanWidth || '-',
+      avgMeihou: res.pumpData.avgMeihou || '-',
+      wasiHanliang: res.pumpData.wasiHanliang || '-',
+    }
+    //单元抽采数据
+    res.dyCcData = res.msgTxt[res.msgTxt.length - 1].empty_device.filter(v => v.type != 'pump_under_1' && v.type != 'sys')
+
+    //抽采数据
+    res.ccBoard = {
+      mixStdInstant: res.pumpData.readData.mixStdInstant || '-',
+      gasConcentration: res.pumpData.readData.gasConcentration || '-',
+      negativePressure: res.pumpData.readData.negativePressure || '-',
+    }
+
+    count.value += 1
+    res.ccEchart = {
+      xData: [],
+      yData: [],
+      yData1: []
+    }
+    //绘流管抽采数据
+    res.hlgEchart = {
+      xData: [],
+      yDataHl: [],
+      yDataHl1: [],
+      yDataHl2: [],
+      yDataHl3: [],
+      yDataHl4: [],
+      yDataNd: [],
+      yDataNd1: [],
+      yDataNd2: [],
+      yDataNd3: [],
+      yDataNd4: [],
+      yDataFy: [],
+      yDataFy1: [],
+      yDataFy2: [],
+      yDataFy3: [],
+      yDataFy4: [],
+    }
+    let hlg1 = res.dyCcData[0].datalist[0].readData
+    let hlg2 = res.dyCcData[1].datalist[0].readData
+    let hlg3 = res.dyCcData[2].datalist[0].readData
+    let hlg4 = res.dyCcData[3].datalist[0].readData
+    let hlg5 = res.dyCcData[4].datalist[0].readData
+    if (count.value <= 10) {
+      Array.from({ length: count.value }).forEach(el => {
+        res.ccEchart.xData.push(res.pumpData.readTime)
+        res.ccEchart.yData.push(res.pumpData.readData.mixStdInstant)
+        res.ccEchart.yData1.push(res.pumpData.readData.gasConcentration)
+
+        res.hlgEchart.xData.push(res.pumpData.readTime)
+        res.hlgEchart.yDataHl.push(hlg1.mixStdInstant)
+        res.hlgEchart.yDataHl1.push(hlg2.mixStdInstant)
+        res.hlgEchart.yDataHl2.push(hlg3.mixStdInstant)
+        res.hlgEchart.yDataHl3.push(hlg4.mixStdInstant)
+        res.hlgEchart.yDataHl4.push(hlg5.mixStdInstant)
+        res.hlgEchart.yDataNd.push(hlg1.gasConcentration)
+        res.hlgEchart.yDataNd1.push(hlg2.gasConcentration)
+        res.hlgEchart.yDataNd2.push(hlg3.gasConcentration)
+        res.hlgEchart.yDataNd3.push(hlg4.gasConcentration)
+        res.hlgEchart.yDataNd4.push(hlg5.gasConcentration)
+        res.hlgEchart.yDataFy.push(hlg1.negativePressure)
+        res.hlgEchart.yDataFy1.push(hlg2.negativePressure)
+        res.hlgEchart.yDataFy2.push(hlg3.negativePressure)
+        res.hlgEchart.yDataFy3.push(hlg4.negativePressure)
+        res.hlgEchart.yDataFy4.push(hlg5.negativePressure)
+      })
+    } else {
+      res.ccEchart.xData.unshift()
+      res.ccEchart.yData.unshift()
+      res.ccEchart.yData1.unshift()
+
+      res.hlgEchart.xData.unshift()
+      res.hlgEchart.yDataHl.unshift()
+      res.hlgEchart.yDataHl1.unshift()
+      res.hlgEchart.yDataHl2.unshift()
+      res.hlgEchart.yDataHl3.unshift()
+      res.hlgEchart.yDataHl4.unshift()
+      res.hlgEchart.yDataNd.unshift()
+      res.hlgEchart.yDataNd1.unshift()
+      res.hlgEchart.yDataNd2.unshift()
+      res.hlgEchart.yDataNd3.unshift()
+      res.hlgEchart.yDataNd4.unshift()
+      res.hlgEchart.yDataFy.unshift()
+      res.hlgEchart.yDataFy1.unshift()
+      res.hlgEchart.yDataFy2.unshift()
+      res.hlgEchart.yDataFy3.unshift()
+      res.hlgEchart.yDataFy4.unshift()
+      count.value--
+    }
+
+    //注气驱替促抽效果评价
+    res.ccPjData = {
+      ext_rate_percent: res.pumpData.readData.ext_rate_percent || '-',
+      residual_gas_content_m3_t: res.pumpData.readData.residual_gas_content_m3_t || '-',
+      gas_drop_rate_m3_t_mon: res.pumpData.readData.gas_drop_rate_m3_t_mon || '-',
+      inject_extract_ratio: res.pumpData.readData.inject_extract_ratio || '-',
+    }
     return res;
   });
 };

src/views/vent/home/configurable/configurable.data.ts

@@ -482,7 +482,7 @@ export const testConfigGasInject: Config[] = [
                     shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
                   }
                 },
-                data: 'yData'
+                data: 'mixStdInstant'
               },
               {
                 name: '实时压力',
@@ -521,7 +521,7 @@ export const testConfigGasInject: Config[] = [
                     shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
                   }
                 },
-                data: 'yData1'
+                data: 'negativePressure'
               },
             ]
           },
@@ -575,14 +575,14 @@ export const testConfigGasInject: Config[] = [
       complex_list: [],
       preset: [
         {
-          readFrom: '',
+          readFrom: 'workInfo',
           option: [
-            { label: '工作面名称', value: '12304工作面', unit: '' },
-            { label: '区段长度', value: 100, unit: 'm' },
-            { label: '区段宽度', value: '2924.6', unit: 'm' },
-            { label: '平均煤厚', value: '300.4', unit: 'm' },
-            { label: '煤层瓦斯含量', value: '900', unit: 'm³/t' },
-            { label: '区段瓦斯储量', value: '3.40', unit: 'm³' },
+            { label: '工作面名称', value: 'strinstallpos', unit: '' },
+            { label: '区段长度', value: 'quduanLength', unit: 'm' },
+            { label: '区段宽度', value: 'quduanWidth', unit: 'm' },
+            { label: '平均煤厚', value: 'avgMeihou', unit: 'm' },
+            { label: '煤层瓦斯含量', value: 'wasiHanliang', unit: 'm³/t' },
+            { label: '区段瓦斯储量', value: 'wasiHanliang', unit: 'm³' },
           ],
         },
       ],
@@ -757,7 +757,7 @@ export const testConfigGasInject: Config[] = [
       complex_list: [],
       preset: [
         {
-          readFrom: '',
+          readFrom: 'dyCcData',
           option: {
             type: 'bar_lt',
             tooltip: {
@@ -871,7 +871,7 @@ export const testConfigGasInject: Config[] = [
                     ])
                   }
                 },
-                data: 'line'
+                data: 'yData'
               },
               //柱体
               {
@@ -899,7 +899,7 @@ export const testConfigGasInject: Config[] = [
                     }
                   }
                 },
-                data: 'line'
+                data: 'yData'
               },
               //柱顶圆片
               {
@@ -926,7 +926,7 @@ export const testConfigGasInject: Config[] = [
                     ),
                   }
                 },
-                data: 'line'
+                data: 'yData'
               },
 
               {//柱底圆片
@@ -949,7 +949,7 @@ export const testConfigGasInject: Config[] = [
                     ])
                   }
                 },
-                data: 'line1'
+                data: 'yData1'
               },
               //柱体
               {
@@ -978,7 +978,7 @@ export const testConfigGasInject: Config[] = [
                   }
                 },
 
-                data: 'line1'
+                data: 'yData1'
               },
               //柱顶圆片
               {
@@ -1005,7 +1005,7 @@ export const testConfigGasInject: Config[] = [
                     ),
                   }
                 },
-                data: 'line1'
+                data: 'yData1'
               },
             ],
 
@@ -1070,7 +1070,7 @@ export const testConfigGasInjectZq: Config[] = [
             { label: '就地/远程模式切换', toggleModel: true, value: 'runStatus', iconName: 'kaiguan' },
             { label: '装备启停控制', isShowSwitch: true, value: '1', iconName: 'fameng' },
             { label: '排气压力设置', isShowSwitch: false, value: 'paramSetting', iconName: 'yalishezhi' },
-            { label: '排气端阀门', isShowSwitch: true, value: '1', iconName: 'fameng' },
+            { label: '排气端阀门', isPqfm: true, isShowSwitch: true, value: '1', iconName: 'fameng' },
           ],
         },
       ],
@@ -1423,27 +1423,27 @@ export const testConfigGasInjectCc: Config[] = [
       board: [
         {
           type: 'gas-cc',
-          readFrom: '',
+          readFrom: 'ccBoard',
           layout: 'val-top',
           items: [
             {
               label: '瞬时抽采混量',
-              value: '100',
+              value: '${mixStdInstant}',
               unit: 'm³/min',
             },
             {
               label: '浓度',
-              value: '100',
+              value: '${gasConcentration}',
               unit: '%',
             },
             {
               label: '负压',
-              value: '100',
+              value: '${negativePressure}',
               unit: 'Pa',
             },
             {
               label: '温度',
-              value: '100',
+              value: '',
               unit: '℃',
             },
           ],
@@ -1457,7 +1457,7 @@ export const testConfigGasInjectCc: Config[] = [
       complex_list: [],
       preset: [
         {
-          readFrom: 'HistoryDataZq',
+          readFrom: 'ccEchart',
           echartOption: {
             showTime: false,
             tooltip: {
@@ -1692,13 +1692,13 @@ export const testConfigGasInjectCc: Config[] = [
       complex_list: [],
       preset: [
         {
-          readFrom: '',
+          readFrom: 'ccPjData',
           type: 'C',
           option: [
-            { label: '抽采率', value: 'xitongVoltage', iconName: 'ccl', unit: '%' },
-            { label: '残余瓦斯含量', value: 'xitongVoltage', iconName: 'wshl', unit: 'm³/t' },
-            { label: '瓦斯含量降低速率', value: 'xitongVoltage', iconName: 'jdsl', unit: 'm³/t/mon' },
-            { label: '注抽比', value: 'xitongVoltage', iconName: 'czb', unit: '%' },
+            { label: '抽采率', value: 'ext_rate_percent', iconName: 'ccl', unit: '%' },
+            { label: '残余瓦斯含量', value: 'residual_gas_content_m3_t', iconName: 'wshl', unit: 'm³/t' },
+            { label: '瓦斯含量降低速率', value: 'gas_drop_rate_m3_t_mon', iconName: 'jdsl', unit: 'm³/t/mon' },
+            { label: '注抽比', value: 'inject_extract_ratio', iconName: 'czb', unit: '%' },
           ],
         },
       ],
@@ -1751,7 +1751,7 @@ export const testConfigGasInjectCc: Config[] = [
       gallery_list: [],
       preset: [
         {
-          readFrom: 'HistoryDataZq',
+          readFrom: 'hlgEchart',
           echartOption: [
             {
               title: '抽采混量',
@@ -1767,15 +1767,16 @@ export const testConfigGasInjectCc: Config[] = [
                   },
                 },
                 grid: {
-                  top: '26%',
+                  top: '30%',
                   left: '8%',
                   right: '8%',
-                  bottom: '8%',
+                  bottom: '1%',
                   containLabel: true
                 },
                 legend: {
                   top: '1%',
-                  right: '34%',
+                  right: 'center',
+                  left: 'center',
                   icon: 'circle',
                   itemWidth: 8,
                   itemHeight: 8,
@@ -1785,7 +1786,11 @@ export const testConfigGasInjectCc: Config[] = [
                     fontSize: 12,
                   },
                   data: [
-                    { name: '抽采混量' },
+                    { name: '汇流管1' },
+                    { name: '汇流管2' },
+                    { name: '汇流管3' },
+                    { name: '汇流管4' },
+                    { name: '汇流管5' },
                   ]
                 },
                 yAxis: [
@@ -1825,7 +1830,7 @@ export const testConfigGasInjectCc: Config[] = [
                 ],
                 series: [
                   {
-                    name: '抽采混量',
+                    name: '汇流管1',
                     type: 'line',
                     symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
                     showAllSymbol: true,
@@ -1835,32 +1840,109 @@ export const testConfigGasInjectCc: Config[] = [
                     lineStyle: {
                       normal: {
                         width: 2,
-                        color: 'rgba(254, 157, 29,1)', // 线条颜色
+                        color: '#e74032', // 线条颜色
                       },
                       borderColor: 'rgba(0,0,0,.4)',
                     },
                     itemStyle: {
-                      color: 'rgba(254, 157, 29,1)',
+                      color: '#e74032',
                       borderColor: "#646ace",
                       borderWidth: 2
                     },
-                    areaStyle: { //区域填充样式
+
+                    data: 'yDataHl'
+                  },
+                  {
+                    name: '汇流管2',
+                    type: 'line',
+                    symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+                    showAllSymbol: true,
+                    symbolSize: 0,
+                    smooth: true,
+                    yAxisIndex: 0,
+                    lineStyle: {
                       normal: {
-                        //线性渐变，前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’，则该四个值是绝对像素位置。
-                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-                          offset: 0,
-                          color: "rgba(254, 157, 29,.4)"
-                        },
-                        {
-                          offset: 1,
-                          color: "rgba(254, 157, 29, .1)"
-                        }
-                        ], false),
-                        shadowColor: 'rgba(254, 157, 29, 0.5)', //阴影颜色
-                        shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
-                      }
+                        width: 2,
+                        color: '#2f7cee', // 线条颜色
+                      },
+                      borderColor: 'rgba(0,0,0,.4)',
+                    },
+                    itemStyle: {
+                      color: '#2f7cee',
+                      borderColor: "#646ace",
+                      borderWidth: 2
+                    },
+
+                    data: 'yDataHl1'
+                  },
+                  {
+                    name: '汇流管3',
+                    type: 'line',
+                    symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+                    showAllSymbol: true,
+                    symbolSize: 0,
+                    smooth: true,
+                    yAxisIndex: 0,
+                    lineStyle: {
+                      normal: {
+                        width: 2,
+                        color: '#289a48', // 线条颜色
+                      },
+                      borderColor: 'rgba(0,0,0,.4)',
+                    },
+                    itemStyle: {
+                      color: '#289a48',
+                      borderColor: "#646ace",
+                      borderWidth: 2
+                    },
+
+                    data: 'yDataHl2'
+                  },
+                  {
+                    name: '汇流管4',
+                    type: 'line',
+                    symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+                    showAllSymbol: true,
+                    symbolSize: 0,
+                    smooth: true,
+                    yAxisIndex: 0,
+                    lineStyle: {
+                      normal: {
+                        width: 2,
+                        color: '#fcc31f', // 线条颜色
+                      },
+                      borderColor: 'rgba(0,0,0,.4)',
+                    },
+                    itemStyle: {
+                      color: '#fcc31f',
+                      borderColor: "#646ace",
+                      borderWidth: 2
+                    },
+
+                    data: 'yDataHl3'
+                  },
+                  {
+                    name: '汇流管5',
+                    type: 'line',
+                    symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+                    showAllSymbol: true,
+                    symbolSize: 0,
+                    smooth: true,
+                    yAxisIndex: 0,
+                    lineStyle: {
+                      normal: {
+                        width: 2,
+                        color: '#b241ff', // 线条颜色
+                      },
+                      borderColor: 'rgba(0,0,0,.4)',
                     },
-                    data: 'yData'
+                    itemStyle: {
+                      color: '#b241ff',
+                      borderColor: "#646ace",
+                      borderWidth: 2
+                    },
+
+                    data: 'yDataHl4'
                   },
                 ]
               },
@@ -1879,15 +1961,16 @@ export const testConfigGasInjectCc: Config[] = [
                   },
                 },
                 grid: {
-                  top: '26%',
+                  top: '30%',
                   left: '8%',
                   right: '8%',
-                  bottom: '8%',
+                  bottom: '1%',
                   containLabel: true
                 },
                 legend: {
                   top: '1%',
-                  right: '34%',
+                  right: 'center',
+                  left: 'center',
                   icon: 'circle',
                   itemWidth: 8,
                   itemHeight: 8,
@@ -1897,7 +1980,11 @@ export const testConfigGasInjectCc: Config[] = [
                     fontSize: 12,
                   },
                   data: [
-                    { name: '抽采浓度' },
+                    { name: '汇流管1' },
+                    { name: '汇流管2' },
+                    { name: '汇流管3' },
+                    { name: '汇流管4' },
+                    { name: '汇流管5' },
                   ]
                 },
                 yAxis: [
@@ -1937,7 +2024,7 @@ export const testConfigGasInjectCc: Config[] = [
                 ],
                 series: [
                   {
-                    name: '抽采浓度',
+                    name: '汇流管1',
                     type: 'line',
                     symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
                     showAllSymbol: true,
@@ -1947,32 +2034,109 @@ export const testConfigGasInjectCc: Config[] = [
                     lineStyle: {
                       normal: {
                         width: 2,
-                        color: 'rgba(254, 157, 29,1)', // 线条颜色
+                        color: '#e74032', // 线条颜色
                       },
                       borderColor: 'rgba(0,0,0,.4)',
                     },
                     itemStyle: {
-                      color: 'rgba(254, 157, 29,1)',
+                      color: '#e74032', // 线条颜色
                       borderColor: "#646ace",
                       borderWidth: 2
                     },
-                    areaStyle: { //区域填充样式
+
+                    data: 'yDataNd'
+                  },
+                  {
+                    name: '汇流管2',
+                    type: 'line',
+                    symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+                    showAllSymbol: true,
+                    symbolSize: 0,
+                    smooth: true,
+                    yAxisIndex: 0,
+                    lineStyle: {
                       normal: {
-                        //线性渐变，前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’，则该四个值是绝对像素位置。
-                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-                          offset: 0,
-                          color: "rgba(254, 157, 29,.4)"
-                        },
-                        {
-                          offset: 1,
-                          color: "rgba(254, 157, 29, .1)"
-                        }
-                        ], false),
-                        shadowColor: 'rgba(254, 157, 29, 0.5)', //阴影颜色
-                        shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
-                      }
+                        width: 2,
+                        color: '#2f7cee', // 线条颜色
+                      },
+                      borderColor: 'rgba(0,0,0,.4)',
+                    },
+                    itemStyle: {
+                      color: '#2f7cee', // 线条颜色
+                      borderColor: "#646ace",
+                      borderWidth: 2
+                    },
+
+                    data: 'yDataNd1'
+                  },
+                  {
+                    name: '汇流管3',
+                    type: 'line',
+                    symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+                    showAllSymbol: true,
+                    symbolSize: 0,
+                    smooth: true,
+                    yAxisIndex: 0,
+                    lineStyle: {
+                      normal: {
+                        width: 2,
+                        color: '#289a48', // 线条颜色
+                      },
+                      borderColor: 'rgba(0,0,0,.4)',
+                    },
+                    itemStyle: {
+                      color: '#289a48', // 线条颜色
+                      borderColor: "#646ace",
+                      borderWidth: 2
+                    },
+
+                    data: 'yDataNd2'
+                  },
+                  {
+                    name: '汇流管4',
+                    type: 'line',
+                    symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+                    showAllSymbol: true,
+                    symbolSize: 0,
+                    smooth: true,
+                    yAxisIndex: 0,
+                    lineStyle: {
+                      normal: {
+                        width: 2,
+                        color: '#fcc31f', // 线条颜色
+                      },
+                      borderColor: 'rgba(0,0,0,.4)',
                     },
-                    data: 'yData1'
+                    itemStyle: {
+                      color: '#fcc31f', // 线条颜色
+                      borderColor: "#646ace",
+                      borderWidth: 2
+                    },
+
+                    data: 'yDataNd3'
+                  },
+                  {
+                    name: '汇流管5',
+                    type: 'line',
+                    symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+                    showAllSymbol: true,
+                    symbolSize: 0,
+                    smooth: true,
+                    yAxisIndex: 0,
+                    lineStyle: {
+                      normal: {
+                        width: 2,
+                        color: '#b241ff', // 线条颜色
+                      },
+                      borderColor: 'rgba(0,0,0,.4)',
+                    },
+                    itemStyle: {
+                      color: '#b241ff', // 线条颜色
+                      borderColor: "#646ace",
+                      borderWidth: 2
+                    },
+
+                    data: 'yDataNd4'
                   },
                 ]
               },
@@ -1991,15 +2155,16 @@ export const testConfigGasInjectCc: Config[] = [
                   },
                 },
                 grid: {
-                  top: '26%',
+                  top: '30%',
                   left: '8%',
                   right: '8%',
-                  bottom: '8%',
+                  bottom: '1%',
                   containLabel: true
                 },
                 legend: {
                   top: '1%',
-                  right: '34%',
+                  right: 'center',
+                  left: 'center',
                   icon: 'circle',
                   itemWidth: 8,
                   itemHeight: 8,
@@ -2009,7 +2174,11 @@ export const testConfigGasInjectCc: Config[] = [
                     fontSize: 12,
                   },
                   data: [
-                    { name: '抽采负压' },
+                    { name: '汇流管1' },
+                    { name: '汇流管2' },
+                    { name: '汇流管3' },
+                    { name: '汇流管4' },
+                    { name: '汇流管5' },
                   ]
                 },
                 yAxis: [
@@ -2049,7 +2218,7 @@ export const testConfigGasInjectCc: Config[] = [
                 ],
                 series: [
                   {
-                    name: '抽采负压',
+                    name: '汇流管1',
                     type: 'line',
                     symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
                     showAllSymbol: true,
@@ -2059,32 +2228,104 @@ export const testConfigGasInjectCc: Config[] = [
                     lineStyle: {
                       normal: {
                         width: 2,
-                        color: 'rgba(254, 157, 29,1)', // 线条颜色
+                        color: '#e74032', // 线条颜色
                       },
                       borderColor: 'rgba(0,0,0,.4)',
                     },
                     itemStyle: {
-                      color: 'rgba(254, 157, 29,1)',
+                      color: '#e74032', // 线条颜色
                       borderColor: "#646ace",
                       borderWidth: 2
                     },
-                    areaStyle: { //区域填充样式
+                    data: 'yDataFy'
+                  },
+                  {
+                    name: '汇流管2',
+                    type: 'line',
+                    symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+                    showAllSymbol: true,
+                    symbolSize: 0,
+                    smooth: true,
+                    yAxisIndex: 0,
+                    lineStyle: {
                       normal: {
-                        //线性渐变，前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’，则该四个值是绝对像素位置。
-                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-                          offset: 0,
-                          color: "rgba(254, 157, 29,.4)"
-                        },
-                        {
-                          offset: 1,
-                          color: "rgba(254, 157, 29, .1)"
-                        }
-                        ], false),
-                        shadowColor: 'rgba(254, 157, 29, 0.5)', //阴影颜色
-                        shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
-                      }
+                        width: 2,
+                        color: '#2f7cee', // 线条颜色
+                      },
+                      borderColor: 'rgba(0,0,0,.4)',
+                    },
+                    itemStyle: {
+                      color: '#2f7cee', // 线条颜色
+                      borderColor: "#646ace",
+                      borderWidth: 2
+                    },
+                    data: 'yDataFy1'
+                  },
+                  {
+                    name: '汇流管3',
+                    type: 'line',
+                    symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+                    showAllSymbol: true,
+                    symbolSize: 0,
+                    smooth: true,
+                    yAxisIndex: 0,
+                    lineStyle: {
+                      normal: {
+                        width: 2,
+                        color: '#289a48', // 线条颜色
+                      },
+                      borderColor: 'rgba(0,0,0,.4)',
+                    },
+                    itemStyle: {
+                      color: '#289a48', // 线条颜色
+                      borderColor: "#646ace",
+                      borderWidth: 2
+                    },
+                    data: 'yDataFy2'
+                  },
+                  {
+                    name: '汇流管4',
+                    type: 'line',
+                    symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+                    showAllSymbol: true,
+                    symbolSize: 0,
+                    smooth: true,
+                    yAxisIndex: 0,
+                    lineStyle: {
+                      normal: {
+                        width: 2,
+                        color: '#fcc31f', // 线条颜色
+                      },
+                      borderColor: 'rgba(0,0,0,.4)',
+                    },
+                    itemStyle: {
+                      color: '#fcc31f', // 线条颜色
+                      borderColor: "#646ace",
+                      borderWidth: 2
+                    },
+                    data: 'yDataFy3'
+                  },
+                  {
+                    name: '汇流管5',
+                    type: 'line',
+                    symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+                    showAllSymbol: true,
+                    symbolSize: 0,
+                    smooth: true,
+                    yAxisIndex: 0,
+                    lineStyle: {
+                      normal: {
+                        width: 2,
+                        color: '#b241ff', // 线条颜色
+                      },
+                      borderColor: 'rgba(0,0,0,.4)',
+                    },
+                    itemStyle: {
+                      color: '#b241ff', // 线条颜色
+                      borderColor: "#646ace",
+                      borderWidth: 2
                     },
-                    data: 'yData2'
+                    data: 'yDataFy4'
                   },
                 ]
               },