From 20c972a9f0a3abfc260b37c080c40a15d6ebeba6 Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期四, 10 四月 2025 16:28:19 +0800
Subject: [PATCH] Merge branch 'master' of ssh://114.215.109.124:29418/underway-vue

---
 src/components/grid/GridSearch.vue |  170 +++++++++++++++++++++++++++++++++++++++++++++-----------
 1 files changed, 135 insertions(+), 35 deletions(-)

diff --git a/src/components/grid/GridSearch.vue b/src/components/grid/GridSearch.vue
index c9d90a6..cbb977a 100644
--- a/src/components/grid/GridSearch.vue
+++ b/src/components/grid/GridSearch.vue
@@ -7,31 +7,117 @@
     width="300px"
   >
     <template #default>
-      <el-form
-        :inline="false"
-        ref="formRef"
-        label-position="right"
-        label-width="100px"
-      >
-        <el-form-item label="缃戞牸缂栧彿锛�">
-          <div>
-            {{ data.cellIndex }}
-          </div>
-        </el-form-item>
-        <el-form-item label="缁忕含搴︼細">
-          <div>
-            {{ data.longitude + ', ' + data.latitude }}
-          </div>
-        </el-form-item>
-        <el-form-item label="PM2.5锛�">
-          <div>
-            {{ data.pm25 + ' 渭g/m鲁' }}
-          </div>
-        </el-form-item>
-        <el-form-item label="鍥涜嚦鑼冨洿锛�">
-          <div>/</div>
-        </el-form-item>
-      </el-form>
+      <div v-if="data">
+        <DescriptionsList>
+          <DescriptionsListItem
+            label="缃戞牸缂栧彿"
+            :content="data.gridCell.cellIndex"
+          />
+          <DescriptionsListItem
+            label="缁忕含搴�"
+            :content="data.gridCell.longitude + ', ' + data.gridCell.latitude"
+          />
+          <DescriptionsListItem label="鍥涜嚦鑼冨洿" content="/" />
+        </DescriptionsList>
+
+        <el-tabs v-model="activeName" >
+          <el-tab-pane label="缃戞牸鏁版嵁" name="first">
+            <DescriptionsList>
+              <DescriptionsListItem
+                label="VOC"
+                :content="data.gridDataDetail.voc + ' 渭g/m鲁'"
+              />
+              <DescriptionsListItem
+                label="H2S"
+                :content="data.gridDataDetail.h2s + ' 渭g/m鲁'"
+              />
+              <!-- <DescriptionsListItem label="NO" :content="data.gridDataDetail.no + ' 渭g/m鲁'" /> -->
+              <DescriptionsListItem
+                label="NO2"
+                :content="data.gridDataDetail.no2 + ' 渭g/m鲁'"
+              />
+              <DescriptionsListItem
+                label="CO"
+                :content="data.gridDataDetail.co + ' 渭g/m鲁'"
+              />
+              <DescriptionsListItem
+                label="SO2"
+                :content="data.gridDataDetail.so2 + ' 渭g/m鲁'"
+              />
+              <DescriptionsListItem
+                label="O3"
+                :content="data.gridDataDetail.o3 + ' 渭g/m鲁'"
+              />
+              <DescriptionsListItem
+                label="PM25"
+                :content="data.gridDataDetail.pm25 + ' 渭g/m鲁'"
+              />
+              <DescriptionsListItem
+                label="PM10"
+                :content="data.gridDataDetail.pm10 + ' 渭g/m鲁'"
+              />
+              <DescriptionsListItem
+                label="娓╁害"
+                :content="data.gridDataDetail.temperature + ' 鈩�'"
+              />
+              <DescriptionsListItem
+                label="婀垮害"
+                :content="data.gridDataDetail.humidity + ' %'"
+              />
+              <DescriptionsListItem
+                label="椋庨��"
+                :content="data.gridDataDetail.windSpeed + ' m/s'"
+              />
+              <DescriptionsListItem
+                label="椋庡悜"
+                :content="data.gridDataDetail.windDirection + ' 掳'"
+              />
+            </DescriptionsList>
+          </el-tab-pane>
+          <template v-if="data.gridDataDetail.mixData">
+            <el-tab-pane
+              v-for="(d, i) in data.gridDataDetail.originDataList"
+              :key="i"
+              :label="d.dataId"
+              :name="`origin-${i}`"
+            >
+              <DescriptionsList>
+                <DescriptionsListItem label="VOC" :content="d.voc + ' 渭g/m鲁'" />
+                <DescriptionsListItem label="H2S" :content="d.h2s + ' 渭g/m鲁'" />
+                <!-- <DescriptionsListItem label="NO" :content="d.no + ' 渭g/m鲁'" /> -->
+                <DescriptionsListItem label="NO2" :content="d.no2 + ' 渭g/m鲁'" />
+                <DescriptionsListItem label="CO" :content="d.co + ' 渭g/m鲁'" />
+                <DescriptionsListItem label="SO2" :content="d.so2 + ' 渭g/m鲁'" />
+                <DescriptionsListItem label="O3" :content="d.o3 + ' 渭g/m鲁'" />
+                <DescriptionsListItem
+                  label="PM25"
+                  :content="d.pm25 + ' 渭g/m鲁'"
+                />
+                <DescriptionsListItem
+                  label="PM10"
+                  :content="d.pm10 + ' 渭g/m鲁'"
+                />
+                <DescriptionsListItem
+                  label="娓╁害"
+                  :content="d.temperature + ' 鈩�'"
+                />
+                <DescriptionsListItem
+                  label="婀垮害"
+                  :content="d.humidity + ' %'"
+                />
+                <DescriptionsListItem
+                  label="椋庨��"
+                  :content="d.windSpeed + ' m/s'"
+                />
+                <DescriptionsListItem
+                  label="椋庡悜"
+                  :content="d.windDirection + ' 掳'"
+                />
+              </DescriptionsList>
+            </el-tab-pane>
+          </template>
+        </el-tabs>
+      </div>
     </template>
     <template #footer> </template>
   </CardDialog>
@@ -44,21 +130,27 @@
 
 const dialogVisible = ref(false);
 
+const activeName = ref('first');
+
 const data = computed(() => {
   if (gridStore.selectedGridCellAndDataDetail) {
+    // const { gridCell, gridDataDetail } =
+    //   gridStore.selectedGridCellAndDataDetail;
+    // const res = [];
+    // // 濡傛灉缃戞牸鏁版嵁涓鸿瀺鍚堟暟鎹紝鍒欓渶瑕佸悓姝ュ睍绀哄嚭鍘熷鏁版嵁
+    // if (gridDataDetail.mixData) {
+    // }
     return {
-      cellIndex: gridStore.selectedGridCellAndDataDetail.gridCell.cellIndex,
-      longitude: gridStore.selectedGridCellAndDataDetail.gridCell.longitude,
-      latitude: gridStore.selectedGridCellAndDataDetail.gridCell.latitude,
-      pm25: gridStore.selectedGridCellAndDataDetail.gridDataDetail.pm25
+      gridCell: gridStore.selectedGridCellAndDataDetail.gridCell,
+      gridDataDetail: gridStore.selectedGridCellAndDataDetail.gridDataDetail,
+      extData: gridStore.selectedGridCellAndDataDetail.extData
     };
+    // console.log(gridStore.selectedGridCellAndDataDetail);
+    
+    // return undefined;
+    // return gridStore.selectedGridCellAndDataDetail;
   } else {
-    return {
-      cellIndex: '/',
-      longitude: '/',
-      latitude: '/',
-      pm25: '/'
-    };
+    return undefined;
   }
 });
 
@@ -72,3 +164,11 @@
   { deep: true }
 );
 </script>
+<style scoped>
+:deep(.el-tabs__item){
+  color: rgba(221, 221, 221, 0.806);
+}
+:deep(.is-active){
+  color: #f0ff1d;
+}
+</style>

--
Gitblit v1.9.3