2026.3.20

feiyu02

2026-03-20 20cdb83586daabfb15fc056c4c97eb8e7ccaf928

 src/views/monitor/DataHistory.vue

@@ -1,10 +1,12 @@
<!-- 历史数据 -->
<script>
import { defineAsyncComponent } from 'vue'
import { ElMessage } from 'element-plus'
import * as XLSX from 'xlsx/xlsx.mjs'
import dayjs from 'dayjs'
import axiosInstanceInstance from '@/utils/request.js'
import TimeSelect from '@/sfc/TimeSelect.vue'
import ExceptionType from '@/sfc/ExceptionType.vue'

const ShopNameAndID = defineAsyncComponent(() => import('@/sfc/ShopNameAndID.vue'))

@@ -15,6 +17,7 @@
    lineChart,
    ShopNameAndID,
    TimeSelect,
    ExceptionType,
  },
  data() {
    return {
@@ -440,14 +443,13 @@
<template>
  <!-- solid #000000 -->
  <div style="margin: 20px; padding: 10px; border: 1px; height: 620px">
    <h1 style="margin-bottom: 20px; display: flex; white-space: nowrap">油烟历史数据</h1>
    <div style="display: flex">
      <span class="palce-text"><span class="palce-text-area">区域：</span>静安区 </span>
      <!-- <span class="palce-text"><span class="palce-text-area">区域：</span>静安区 </span> -->

      <!-- 店铺名  级联 -->
      <!-- <el-cascader v-model="devId" :options="optionsShop" :props="{ expandTrigger: 'hover' }" placeholder="请选择店铺名"
        clearable /> -->
      <span class="describe-info">店铺名选择：</span>
      <span class="describe-info">店铺选择：</span>
      <ShopNameAndID @submit-id="(n) => (devId[1] = n)" :devId="beginShowShopName"></ShopNameAndID>

      <!-- <span class="describe-time-text">起止时间：</span> -->
@@ -455,6 +457,7 @@
      <!-- <el-date-picker v-model="beginTime" type="datetime" placeholder="开始时间" value-format="YYYY-MM-DD HH:mm:ss" />
      <el-date-picker v-model="endTime" type="datetime" placeholder="结束时间" value-format="YYYY-MM-DD HH:mm:ss" /> -->
      <TimeSelect @submit-time="giveTime"></TimeSelect>
      <ExceptionType></ExceptionType>
      <el-button type="primary" plain :loading="button.queryButton" @click="lineChart"
        >查询</el-button
      >
@@ -550,51 +553,15 @@
        :data="displayData"
        style="width: 100%; margin-top: 25px"
        height="500px"
        table-layout="auto"
        table-layout="fixed"
        :show-overflow-tooltip="true"
      >
        <el-table-column fixed prop="mvStatCode" label="设备编号">
          <template #default="{ row }">
            <el-tooltip effect="dark" :content="row.mvStatCode">
              <div class="cell ellipsis">{{ row.mvStatCode }}</div>
            </el-tooltip>
          </template>
        </el-table-column>
        <el-table-column prop="diName" label="店铺名称">
          <template #default="{ row }">
            <el-tooltip effect="dark" :content="row.diName">
              <div class="cell ellipsis">{{ row.diName }}</div>
            </el-tooltip>
          </template>
        </el-table-column>

        <el-table-column prop="mvDataTime" label="采集时间">
          <template #default="{ row }">
            <el-tooltip effect="dark" :content="row.mvDataTime">
              <div class="cell ellipsis">{{ row.mvDataTime }}</div>
            </el-tooltip>
          </template>
        </el-table-column>
        <el-table-column prop="mvFanElectricity" label="风机电流(A)">
          <template #default="{ row }">
            <el-tooltip effect="dark" :content="row.mvFanElectricity">
              <div class="cell ellipsis">{{ row.mvFanElectricity }}</div>
            </el-tooltip>
          </template>
        </el-table-column>
        <el-table-column prop="mvPurifierElectricity" label="净化器电流(A)">
          <template #default="{ row }">
            <el-tooltip effect="dark" :content="row.mvPurifierElectricity">
              <div class="cell ellipsis">{{ row.mvPurifierElectricity }}</div>
            </el-tooltip>
          </template>
        </el-table-column>
        <el-table-column prop="mvFumeConcentration2" label="油烟浓度(mg/m³)">
          <template #default="{ row }">
            <el-tooltip effect="dark" :content="row.mvFumeConcentration2">
              <div class="cell ellipsis">{{ row.mvFumeConcentration2 }}</div>
            </el-tooltip>
          </template>
        </el-table-column>
        <el-table-column fixed prop="mvStatCode" label="设备编号"> </el-table-column>
        <el-table-column prop="diName" label="店铺名称"> </el-table-column>
        <el-table-column prop="mvDataTime" label="采集时间"> </el-table-column>
        <el-table-column prop="mvFanElectricity" label="风机电流(A)"> </el-table-column>
        <el-table-column prop="mvPurifierElectricity" label="净化器电流(A)"> </el-table-column>
        <el-table-column prop="mvFumeConcentration2" label="油烟浓度(mg/m³)"> </el-table-column>
      </el-table>
      <el-pagination
        background