From 9e9d666bbe57503bb0902bda0d23bf34ae75e832 Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期一, 21 十月 2024 17:17:25 +0800
Subject: [PATCH] 表格和图表展示 ；同步 colFilter
---
src/views/project/yw/systemManage/metricMgr/MetricDetail.vue | 133 ++++++++++++++++----------------------------
1 files changed, 48 insertions(+), 85 deletions(-)
diff --git a/src/views/project/yw/systemManage/metricMgr/MetricDetail.vue b/src/views/project/yw/systemManage/metricMgr/MetricDetail.vue
index 4bedfd8..6352455 100644
--- a/src/views/project/yw/systemManage/metricMgr/MetricDetail.vue
+++ b/src/views/project/yw/systemManage/metricMgr/MetricDetail.vue
@@ -1,7 +1,7 @@
<template>
<div class="flex flex-col h100">
<el-row class="w100 h100">
- <el-col :span="17">
+ <el-col :span="17" class="h-full">
<div class="h100 relative">
<div class="ml-6 h100">
<el-tabs v-model="state.activeMetricName" @tab-change="handleClick" class="h100">
@@ -42,87 +42,28 @@
<el-divider />
</div>
</el-tab-pane>
- <el-tab-pane label="鎸囨爣鎺㈢储" name="indicatorExploration">
- <div class="h100">
- <div class="set_explore">
- <div class="set_explore_pad">
- <el-form ref="exploreFormRef" :model="state.exploreForm" label-width="80px" label-position="left">
- <el-form-item label="鏃ユ湡鍖洪棿:">
- <div style="width: 300px">
- <el-date-picker
- v-model="state.exploreForm.dateRangeExplore"
- type="daterange"
- range-separator="~"
- value-format="YYYY-MM-DD HH:mm:ss"
- :default-time="defaultTime"
- @change="getDateTime"
- :disabled-date="disablesDate"
- />
- </div>
- </el-form-item>
- <el-form-item label="缁村害涓嬮捇:">
- <el-select v-model="state.exploreForm.dimensionDrilling" autocomplete="off" style="width: 226.4px" clearable>
- <el-option
- v-for="item in Object.keys(eDrilling_Ops)"
- :key="item"
- :value="parseInt(item)"
- :label="eDrilling_Ops[item]"
- >
- </el-option>
- </el-select>
- </el-form-item>
- <el-form-item label="缁村害绛涢��:">
- <el-select
- v-model="state.exploreForm.dimensionFiltering.user"
- autocomplete="off"
- style="width: 186.4px"
- clearable
- @change="handleDimensionFilteringChange"
- >
- <el-option
- v-for="item in Object.keys(eDrilling_Ops)"
- :key="item"
- :value="parseInt(item)"
- :label="eDrilling_Ops[item]"
- >
- </el-option>
- </el-select>
- <el-select
- v-model="state.exploreForm.dimensionFiltering.unit"
- autocomplete="off"
- style="width: 126.4px; margin: 0 5px"
- clearable
- >
- <el-option
- v-for="item in Object.keys(eDimensionFilter_Ops)"
- :key="item"
- :value="parseInt(item)"
- :label="eDimensionFilter_Ops[item]"
- >
- </el-option>
- </el-select>
- <el-select
- v-model="state.exploreForm.dimensionFiltering.someone"
- autocomplete="off"
- style="width: 126.4px; margin-right: 5px"
- clearable
- >
- <el-option
- v-for="(item, index) in state.resultList"
- :key="index"
- :value="item.id"
- :label="item.department"
- >
- </el-option>
- </el-select>
- <el-button type="primary" @click="handleExplore" icon="ele-Search">鏌ヨ</el-button>
- </el-form-item>
- </el-form>
- </div>
- <div class="w100 h-[550px]">
- <div ref="chartExplorationRef" class="w100 h100"></div>
- </div>
+ <el-tab-pane label="鎸囨爣鎺㈢储" name="indicatorExploration" class="h-full">
+ <div class="h-full flex-column">
+ <el-form :model="dialogFormValue" class="flex-0" ref="dialogFormRef" :rules="dialogFormRules">
+ <el-form-item label="鏃ユ湡鍖洪棿锛�" prop="rangValue">
+ <TimeRange v-model="dialogFormValue.rangValue" />
+ </el-form-item>
+ <el-form-item label="鍒嗙粍缁村害锛�" prop="rangValue">
+ <el-select v-model="dialogFormValue.groupDimList" multiple>
+ <el-option v-for="item in dimList" :key="item.id" :label="item.title" :value="item.id" />
+ </el-select>
+ </el-form-item>
+
+ </el-form>
+ <div class="flex-auto ">
+ <!-- <RecordSet v-bind="recordSetProps" class="h-full "/> -->
+ <RecordSetTable v-bind="recordSetTableProps" class="h-full"/>
+
+
+
</div>
+
+
</div>
</el-tab-pane>
</el-tabs>
@@ -212,7 +153,7 @@
<div class="subTitle___zya5g">涓嬮捇缁村害</div>
<div class="ml-0 mt-[20px]">
<div class="flex flex-wrap gap-[5px] items-center">
- <div v-for="item in state.metricBasicInfo.applicationInformation" :key="item.id">
+ <div v-for="item in dimList" :key="item.id">
<el-tag :style="{ backgroundColor: 'e6f4ff', color: '#0958d9', borderColor: '#91caff' }">{{
item.title
}}</el-tag>
@@ -237,19 +178,27 @@
import * as metricApi from '/@/api/metrics';
import { formatTime, getDefaultPeriod } from '/@/utils/istation/common.js';
import { eDimensionFilter_Ops, eDrilling_Ops, eMetrics_Ops } from '/@/views/types/metrics';
+import TimeRange from '/@/components/chat/chatComponents/summaryCom/components/recordSet/components/TimeRange.vue';
+
+import List from '/@/components/chat/chatComponents/summaryCom/components/recordSet/components/List.vue';
+import { FormRules } from 'element-plus/es/components/form/src/types';
+import RecordSet from '/@/components/chat/chatComponents/summaryCom/components/recordSet/RecordSet.vue';
+import { recordSetProps,recordSetTableProps } from './testData';
+
+import RecordSetTable from '/@/components/chat/chatComponents/summaryCom/components/recordSetTable/RecordSetTable.vue';
const defaultTime = ref<[Date, Date]>([new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 2, 1, 23, 59, 59)]);
const router = useRouter();
const route = useRoute();
// 瀹氫箟鍙橀噺鍐呭
+
const state = reactive({
metricInfo: {
name: '',
id: '',
} as any,
- activeMetricName: 'basicInformation',
+ activeMetricName: 'indicatorExploration',
metricBasicInfo: {
descriptionQuotaItems: {},
- applicationInformation: [],
} as any,
exploreForm: {
dateRangeExplore: '' as any,
@@ -289,13 +238,15 @@
//#endregion
//#region ====================== 鍩虹淇℃伅 ======================
+
+const dimList = ref([]);
const tableData = ref([]);
const getTableData = async (id) => {
const res = await metricApi.getMetricNameListByPost();
const data = res?.values ?? [];
const filterData = data.filter((item) => item.id == id);
state.metricBasicInfo.descriptionQuotaItems = filterData[0]; //宸︿晶鎻忚堪鍐呭
- state.metricBasicInfo.applicationInformation = filterData[0].dimensions ?? [];
+ dimList.value = filterData[0].dimensions ?? [];
};
//#endregion
//#region ====================== 鎸囨爣鎺㈢储鏌ヨ ======================
@@ -435,6 +386,18 @@
state.activeMetricName = val;
};
//#endregion
+
+//#region ====================== 鎸囨爣鎺㈢储 ======================
+const dialogFormRules = ref<FormRules>({
+ title: [{ required: true, message: '璇疯緭鍏ユ爣棰�', trigger: 'blur' }],
+ prompt: [{ required: true, message: '璇疯緭鍏ユ彁绀鸿瘝', trigger: 'blur' }],
+});
+const dialogFormValue = ref({
+ rangValue: ['2024-10-21 00:00:00', '2024-10-23 23:59:59'],
+ groupDimList: [],
+});
+//#endregion
+
onMounted(() => {
const { id } = route.query;
getTableData(id);
--
Gitblit v1.9.3