餐饮油烟智能监测与监管一体化平台
feiyu02
2026-03-20 20cdb83586daabfb15fc056c4c97eb8e7ccaf928
2026.3.20
已修改7个文件
119 ■■■■ 文件已修改
src/components/map/SceneMap.vue 2 ●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/inspection/check/components/CompSubTaskStatistic.vue 11 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/inspection/task/TaskManage.vue 4 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/inspection/task/components/CompTaskMap.vue 2 ●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/monitor/DataDashboard.vue 91 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/monitor/DataException.vue 4 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/monitor/DataHistory.vue 5 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/map/SceneMap.vue
@@ -758,7 +758,7 @@
}
.card-left {
  background-color: rgba(255, 255, 255, 0.8);
  background-color: rgba(255, 255, 255, 0.9);
  border-radius: 4px;
  /* width: 350px; */
  /* height: 50vh; */
src/views/inspection/check/components/CompSubTaskStatistic.vue
@@ -84,7 +84,7 @@
      </el-descriptions-item>
    </el-descriptions>
    <el-descriptions
    <!-- <el-descriptions
      class="m-l-4"
      :column="8"
      size="small"
@@ -135,13 +135,6 @@
        </template>
        {{ summary.proAllCheck }}
      </el-descriptions-item>
      <!-- </el-descriptions>
    <el-descriptions
      :column="4"
      size="small"
      border
      direction="vertical"
    > -->
      <el-descriptions-item
        label="未整改"
        label-class-name="change-check-label"
@@ -188,7 +181,7 @@
        </template>
        {{ summary.changeAllCheck }}
      </el-descriptions-item>
    </el-descriptions>
    </el-descriptions> -->
  </el-row>
</template>
<script>
src/views/inspection/task/TaskManage.vue
@@ -2,7 +2,7 @@
  <BaseContentLayout asideWidth="0">
    <template #header>
      <div class="task-switcher">
        <el-button @click="switchTask(-1)" icon="ArrowLeft">前一个</el-button>
        <el-button @click="switchTask(-1)" icon="ArrowLeft">上一期</el-button>
        <el-select
          v-model="curTaskTitle"
          @change="(t) => chooseTask(tasks.find((e) => e.title == t))"
@@ -10,7 +10,7 @@
        >
          <el-option v-for="s in tasks" :key="s.title" :label="s.title" :value="s.title" />
        </el-select>
        <el-button @click="switchTask(1)" icon="ArrowRight">后一个</el-button>
        <el-button @click="switchTask(1)" icon="ArrowRight">下一期</el-button>
      </div>
    </template>
    <template #aside>
src/views/inspection/task/components/CompTaskMap.vue
@@ -155,7 +155,7 @@
}
.right-wrapper {
  background-color: rgba(255, 255, 255, 0.8);
  background-color: rgba(255, 255, 255, 0.9);
  box-shadow: var(--el-box-shadow);
  border-radius: 4px;
  height: 80vh;
src/views/monitor/DataDashboard.vue
@@ -1,5 +1,20 @@
<template>
  <div class="data-dashboard">
    <!-- 地图模式切换 -->
      <div class="map-mode-card">
        <div class="mode-tab-container">
          <div
            v-for="mode in mapModes"
            :key="mode.value"
            class="mode-tab"
            :class="{ active: activeMode === mode.value }"
            @click="handleModeChange(mode)"
          >
            {{ mode.label }}
          </div>
        </div>
      </div>
    <!-- 顶部指标卡片区 -->
    <div class="top-cards">
      <!-- 时间周期选项卡片 -->
@@ -56,6 +71,7 @@
          </div>
        </div>
      </div>
      <div class="cards-container">
        <!-- 设备在线率 -->
        <el-popover placement="right-start" title="设备监控" width="400" trigger="click">
@@ -545,19 +561,21 @@
        <h4>图例</h4>
      </div>
      <div class="legend-items">
        <div class="legend-item">
        <!-- 污染态势模式下显示的图例 -->
        <div v-if="activeMode === 'pollution'" class="legend-item">
          <img src="@/assets/exceed.png" alt="油烟浓度超标" class="legend-icon" />
          <span class="legend-text">油烟浓度超标</span>
        </div>
        <div class="legend-item">
        <div v-if="activeMode === 'pollution'" class="legend-item">
          <img src="@/assets/exception.png" alt="供电异常" class="legend-icon" />
          <span class="legend-text">供电异常</span>
        </div>
        <div class="legend-item">
        <div v-if="activeMode === 'pollution'" class="legend-item">
          <img src="@/assets/offline.png" alt="设备或网络异常" class="legend-icon" />
          <span class="legend-text">设备或网络异常</span>
        </div>
        <div class="legend-item">
        <!-- 设备状态模式下也显示在线状态 -->
        <div v-if="activeMode === 'device'" class="legend-item">
          <img
            src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCB4PSI1IiB5PSI4IiB3aWR0aD0iMjIiIGhlaWdodD0iMTYiIHJ4PSIzIiBmaWxsPSIjNTJjNDFhIiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjIiLz48cGF0aCBkPSJNNSA4IFEgMTYgMyAyNyA4IiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9IiMzODllMGQiLz48cGF0aCBkPSJNNSAyNCBRIDE2IDI5IDI3IDI0IiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9IiM2NjY2NjYiLz48cmVjdCB4PSI4IiB5PSIxMSIgd2lkdGg9IjE2IiBoZWlnaHQ9IjEwIiByeD0iMiIgZmlsbD0id2hpdGUiLz48cGF0aCBkPSJNMTIgMTQgTCAyMSAxNCIgc3Ryb2tlPSIjNTJjNDFhIiBzdHJva2Utd2lkdGg9IjEuNSIvPjxwYXRoIGQ9Ik0xMiAxNyBMIDE4IDE3IiBzdHJva2U9IiM1MmM0MWEiIHN0cm9rZS13aWR0aD0iMS41Ii8+PHBhdGggZD0iTTEyIDIwIEwgMTUgMjAiIHN0cm9rZT0iIzUyYzQxYSIgc3Ryb2tlLXdpZHRoPSIxLjUiLz48bGluZSB4MT0iMTYiIHkxPSI4IiB4Mj0iMTYiIHkyPSIzIiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjEuNSIvPjxjaXJjbGUgY3g9IjE2IiBjeT0iMyIgcj0iMS41IiBmaWxsPSJ3aGl0ZSIvPjxjaXJjbGUgY3g9IjI3IiBjeT0iMTYiIHI9IjMiIGZpbGw9IiNmZmZmZmYiLz48Y2lyY2xlIGN4PSIyNyIgY3k9IjE2IiByPSIxLjUiIGZpbGw9IiM1MmM0MWEiLz48bGluZSB4MT0iNSIgeTE9IjEzIiB4Mj0iNiIgeTI9IjEzIiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjEuNSIvPjxsaW5lIHgxPSI1IiB5MT0iMTkiIHgyPSI2IiB5Mj0iMTkiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS13aWR0aD0iMS41Ii8+PC9zdmc+"
            alt="在线状态"
@@ -565,7 +583,7 @@
          />
          <span class="legend-text">在线状态</span>
        </div>
        <div class="legend-item">
        <div v-if="activeMode === 'device'" class="legend-item">
          <img
            src="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCB4PSI1IiB5PSI4IiB3aWR0aD0iMjIiIGhlaWdodD0iMTYiIHJ4PSIzIiBmaWxsPSIjOGM4YzhjIiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjIiLz48cGF0aCBkPSJNNSA4IFEgMTYgMyAyNyA4IiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9IiM2NjY2NjYiLz48cGF0aCBkPSJNNSAyNCBRIDE2IDI5IDI3IDI0IiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjIiIGZpbGw9IiM2NjY2NjYiLz48cmVjdCB4PSI4IiB5PSIxMSIgd2lkdGg9IjE2IiBoZWlnaHQ9IjEwIiByeD0iMiIgZmlsbD0id2hpdGUiLz48bGluZSB4MT0iMTEiIHkxPSIxMiIgeDI9IjIxIiB5Mj0iMjIiIHN0cm9rZT0iIzhjOGM4YyIgc3Ryb2tlLXdpZHRoPSIyIi8+PGxpbmUgeDE9IjExIiB5MT0iMjIiIHgyPSIyMSIgeTI9IjEyIiBzdHJva2U9IiM4YzhjOGMiIHN0cm9rZS13aWR0aD0iMiIvPjxsaW5lIHgxPSIxNiIgeTE9IjgiIHgyPSIxNiIgeTI9IjMiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS13aWR0aD0iMS41Ii8+PGNpcmNsZSBjeD0iMTYiIGN5PSIzIiByPSIxLjUiIGZpbGw9IndoaXRlIi8+PGNpcmNsZSBjeD0iMjciIGN5PSIxNiIgcj0iMyIgZmlsbD0iI2ZmZmZmZiIvPjxjaXJjbGUgY3g9IjI3IiBjeT0iMTYiIHI9IjEuNSIgZmlsbD0iIzhjOGM4YyIvPjxsaW5lIHgxPSI1IiB5MT0iMTMiIHgyPSI2IiB5Mj0iMTMiIHN0cm9rZT0id2hpdGUiIHN0cm9rZS13aWR0aD0iMS41Ii8+PGxpbmUgeDE9IjUiIHkxPSIxOSIgeDI9IjYiIHkyPSIxOSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIxLjUiLz48L3N2Zz4="
            alt="离线状态"
@@ -594,11 +612,16 @@
  data() {
    return {
      activeTime: 'day',
      activeMode: 'pollution', // 默认污染态势模式
      currentDate: new Date('2023-08-01'),
      timeTabs: [
        { label: '日', value: 'day' },
        { label: '周', value: 'week' },
        { label: '月', value: 'month' },
      ],
      mapModes: [
        { label: '污染态势', value: 'pollution' },
        { label: '设备状态', value: 'device' },
      ],
      selectedPoint: {
        enterpriseName: '',
@@ -688,6 +711,9 @@
      this.activeTime = tab.value
      // 模拟切换时间周期后的数据更新
      this.updateMetrics()
    },
    handleModeChange(mode) {
      this.activeMode = mode.value
    },
    navigateTime(direction) {
      const newDate = new Date(this.currentDate)
@@ -1041,6 +1067,59 @@
  justify-content: center;
  margin-bottom: 8px;
  min-width: 300px;
}
/* 地图模式卡片 */
.map-mode-card {
  position: absolute;
  top: 4px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  background-color: #ffffff;
  border-radius: 8px;
  padding: 4px 16px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-bottom: 8px;
  min-width: 300px;
}
.mode-tab-container {
  display: flex;
  flex-direction: row;
  gap: 8px;
  width: 100%;
  justify-content: center;
}
.mode-tab {
  padding: 4px 8px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  transition: all 0.3s ease;
  color: #4e5969;
  text-align: center;
  border: 1px solid #e8e8e8;
  background-color: #fafafa;
  flex: 1;
}
.mode-tab.active {
  background-color: #1890ff;
  color: #ffffff;
  border-color: #1890ff;
  box-shadow: 0 2px 8px rgba(24, 144, 255, 0.2);
}
.mode-tab:hover:not(.active) {
  color: #1890ff;
  border-color: #e6f7ff;
  background-color: #e6f7ff;
}
.time-period-card .card-title {
@@ -1646,4 +1725,4 @@
    text-align: left;
  }
} */
</style>
</style>
src/views/monitor/DataException.vue
@@ -6,7 +6,7 @@
        <el-collapse-item name="1">
          <template #title>
            <div class="search-header">
              <h3>查询条件</h3>
              <h3>预警范围</h3>
              <span v-if="!isSearchExpanded" class="search-summary">
                {{ getSearchSummary() }}
              </span>
@@ -188,7 +188,7 @@
        <el-collapse-item name="1">
          <template #title>
            <div class="collapse-title">
              <h4 class="table-title">异常数据</h4>
              <h4 class="table-title">预警记录</h4>
            </div>
          </template>
          <el-card v-show="!isNoData">
src/views/monitor/DataHistory.vue
@@ -6,6 +6,7 @@
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'))
@@ -16,6 +17,7 @@
    lineChart,
    ShopNameAndID,
    TimeSelect,
    ExceptionType,
  },
  data() {
    return {
@@ -447,7 +449,7 @@
      <!-- 店铺名  级联 -->
      <!-- <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
      >