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