From 6a72da7900390c3048d7eb07a8e93ed776f5676b Mon Sep 17 00:00:00 2001
From: Jay <csj123456>
Date: 星期四, 16 一月 2025 13:28:22 +0800
Subject: [PATCH] 修改指标分类为选择tree，增加选择框可编辑
---
src/views/data/ind/item/CalIndDefineForm.vue | 30 +++++++++-----
src/views/data/ind/item/DerIndDefineForm.vue | 34 +++++++++++------
src/views/data/ind/item/AtomIndDefineForm.vue | 40 +++++++++++++-------
3 files changed, 67 insertions(+), 37 deletions(-)
diff --git a/src/views/data/ind/item/AtomIndDefineForm.vue b/src/views/data/ind/item/AtomIndDefineForm.vue
index daea1b6..e76346d 100644
--- a/src/views/data/ind/item/AtomIndDefineForm.vue
+++ b/src/views/data/ind/item/AtomIndDefineForm.vue
@@ -20,14 +20,14 @@
<el-row>
<el-col :span="12">
<el-form-item label="指标分类" prop="itemCategory">
- <el-select v-model="formData.itemCategory" clearable placeholder="请选择指标分类">
- <el-option
- v-for="item in dataCategoryList"
- :key="item.id"
- :label="item.label"
- :value="item.id + ''"
- />
- </el-select>
+ <el-tree-select
+ v-model="formData.itemCategory"
+ :data="dataCategoryList"
+ :default-expanded-keys="[0]"
+ :props="defaultProps"
+ check-strictly
+ node-key="id"
+ />
</el-form-item>
</el-col>
<el-col :span="12">
@@ -63,7 +63,8 @@
<el-row>
<el-col :span="12">
<el-form-item label="数据集" prop="atomItem.dataSet">
- <el-select v-model="formData.atomItem.dataSet" clearable placeholder="请选择数据集" @change="handleDataSetChange($event)">
+ <el-select v-model="formData.atomItem.dataSet" filterable
+ allow-create clearable placeholder="请选择数据集" @change="handleDataSetChange($event)">
<el-option
v-for="item in dataSetList"
:key="item.id"
@@ -75,7 +76,8 @@
</el-col>
<el-col :span="6">
<el-form-item label="使用字段" prop="atomItem.usingField">
- <el-select v-model="formData.atomItem.usingField" clearable placeholder="请选择字段">
+ <el-select v-model="formData.atomItem.usingField" filterable
+ allow-create clearable placeholder="请选择字段">
<el-option
v-for="item in dataSetFieldList"
:key="item.id"
@@ -87,7 +89,8 @@
</el-col>
<el-col :span="6">
<el-form-item label="统计方式" prop="statFunc">
- <el-select v-model="formData.atomItem.statFunc" clearable placeholder="请选择">
+ <el-select v-model="formData.atomItem.statFunc" filterable
+ allow-create clearable placeholder="请选择">
<el-option
v-for="dict in getStrDictOptions(DICT_TYPE.DATA_STAT_FUNC)"
:key="dict.value"
@@ -118,7 +121,7 @@
import * as DataSetApi from '@/api/data/ind/data/data.set'
import * as DataSetFieldApi from '@/api/data/ind/data/data.field'
import * as CategoryApi from '@/api/data/ind/category/index'
-
+ import {handleTree} from "@/utils/tree";
defineOptions({name: 'IndDataSetForm'})
@@ -167,7 +170,16 @@
const formRef = ref() // 表单 Ref
const dataSetList = ref([] as DataSetApi.DataSetVO[])
const dataSetFieldList = ref([] as DataSetFieldApi.DataSetFieldVO[])
- const dataCategoryList = ref([])
+
+ const dataCategoryList = ref<Tree[]>([])
+
+ const getCategoryTree = async () => {
+ dataCategoryList.value = []
+ const res = await CategoryApi.getCategoryListAllSimple()
+ let category: Tree = {id: 0, label: '主类目', children: []}
+ category.children = handleTree(res, 'id', 'pid')
+ dataCategoryList.value.push(category)
+ }
/** 打开弹窗 */
const open = async (type: string, id?: string) => {
dialogVisible.value = true
@@ -176,7 +188,7 @@
resetForm()
// 加载数据源列表
dataSetList.value = await DataSetApi.getDataSetList()
- dataCategoryList.value = await CategoryApi.getCategoryListAllSimple()
+ await getCategoryTree()
// 修改时，设置数据
if (id) {
formLoading.value = true
diff --git a/src/views/data/ind/item/CalIndDefineForm.vue b/src/views/data/ind/item/CalIndDefineForm.vue
index 119ef91..52d78cc 100644
--- a/src/views/data/ind/item/CalIndDefineForm.vue
+++ b/src/views/data/ind/item/CalIndDefineForm.vue
@@ -20,15 +20,14 @@
<el-row>
<el-col :span="12">
<el-form-item label="指标分类" prop="itemCategory">
- <el-select v-model="formData.itemCategory" clearable filterable
- allow-create placeholder="请选择指标分类">
- <el-option
- v-for="item in dataCategoryList"
- :key="item.id"
- :label="item.label"
- :value="item.id + ''"
- />
- </el-select>
+ <el-tree-select
+ v-model="formData.itemCategory"
+ :data="dataCategoryList"
+ :default-expanded-keys="[0]"
+ :props="defaultProps"
+ check-strictly
+ node-key="id"
+ />
</el-form-item>
</el-col>
<el-col :span="12">
@@ -140,6 +139,7 @@
import * as ItemApi from '@/api/data/ind/item/item'
import { ElMessage } from 'element-plus'
import * as CategoryApi from '@/api/data/ind/category/index'
+ import {handleTree} from "@/utils/tree";
defineOptions({name: 'IndDataSetForm'})
@@ -191,7 +191,15 @@
const formRef = ref() // 表单 Ref
const dataSourceList = ref([] as DataSourceConfigApi.DataSourceConfigVO[])
const queryParams = reactive({})
- const dataCategoryList = ref([] as CategoryApi.IndItemCategoryVO[])
+
+ const dataCategoryList = ref<Tree[]>([])
+ const getCategoryTree = async () => {
+ dataCategoryList.value = []
+ const res = await CategoryApi.getCategoryListAllSimple()
+ let category: Tree = {id: 0, label: '主类目', children: []}
+ category.children = handleTree(res, 'id', 'pid')
+ dataCategoryList.value.push(category)
+ }
/** 打开弹窗 */
const open = async (type: string, id?: number) => {
dialogVisible.value = true
@@ -200,7 +208,7 @@
resetForm()
// 加载数据源列表
- dataCategoryList.value = await CategoryApi.getCategoryListAllSimple()
+ await getCategoryTree()
itemList.value = await ItemApi.getItemList(queryParams)
// 修改时，设置数据
if (id) {
diff --git a/src/views/data/ind/item/DerIndDefineForm.vue b/src/views/data/ind/item/DerIndDefineForm.vue
index cba741f..8579fc6 100644
--- a/src/views/data/ind/item/DerIndDefineForm.vue
+++ b/src/views/data/ind/item/DerIndDefineForm.vue
@@ -20,7 +20,8 @@
<el-row>
<el-col :span="12">
<el-form-item label="原子指标" prop="atomItem.itemId">
- <el-select v-model="formData.atomItem.itemId" clearable placeholder="请选择原子指标"
+ <el-select v-model="formData.atomItem.itemId" filterable
+ allow-create clearable placeholder="请选择原子指标"
@change="handleChange($event)">
<el-option
v-for="item in atomItemList"
@@ -40,14 +41,14 @@
<el-row>
<el-col :span="12">
<el-form-item label="指标分类" prop="itemCategory">
- <el-select v-model="formData.itemCategory" clearable placeholder="请选择指标分类">
- <el-option
- v-for="item in dataCategoryList"
- :key="item.id"
- :label="item.label"
- :value="item.id + ''"
- />
- </el-select>
+ <el-tree-select
+ v-model="formData.itemCategory"
+ :data="dataCategoryList"
+ :default-expanded-keys="[0]"
+ :props="defaultProps"
+ check-strictly
+ node-key="id"
+ />
</el-form-item>
</el-col>
<el-col :span="12">
@@ -130,7 +131,8 @@
<el-row>
<el-col :span="24">
<el-form-item label="分析维度" prop="dimension">
- <el-select v-model="formData.derItem.dimension" clearable placeholder="请选择分析维度" multiple>
+ <el-select v-model="formData.derItem.dimension" filterable
+ allow-create clearable placeholder="请选择分析维度" multiple>
<el-option
v-for="item in dataSetFieldList"
:key="item.id"
@@ -164,6 +166,7 @@
import {PageParam} from "@/api/data/ind/item/item";
import * as CategoryApi from "@/api/data/ind/category";
import * as DataSetFieldApi from "@/api/data/ind/data/data.field";
+ import {handleTree} from "@/utils/tree";
defineOptions({name: 'IndDataSetForm'})
@@ -218,9 +221,16 @@
const formRef = ref() // 表单 Ref
const atomItemList = ref([] as ItemApi.ItemVO[])
const showTimeChange = ref(false)
- const dataCategoryList = ref([] as CategoryApi.IndItemCategoryVO[])
const dataSetFieldList = ref([] as DataSetFieldApi.DataSetFieldVO[])
+ const dataCategoryList = ref<Tree[]>([])
+ const getCategoryTree = async () => {
+ dataCategoryList.value = []
+ const res = await CategoryApi.getCategoryListAllSimple()
+ let category: Tree = {id: 0, label: '主类目', children: []}
+ category.children = handleTree(res, 'id', 'pid')
+ dataCategoryList.value.push(category)
+ }
/** 打开弹窗 */
const open = async (type: string, id?: string) => {
dialogVisible.value = true
@@ -228,7 +238,7 @@
formType.value = type
resetForm()
// 加载数据源列表
- dataCategoryList.value = await CategoryApi.getCategoryListAllSimple()
+ await getCategoryTree()
const queryParams = reactive({
itemType: 'ATOM'
})
--
Gitblit v1.9.3