Front_Team/SPDM
8
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update:参数库优化

Browse Source
This commit is contained in:
lijing1
2025-11-26 16:26:28 +08:00
parent 7304ea5c0f
commit fa8861043a
5 changed files with 143 additions and 295 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/common/table/treeTable.vue
View File

@@ -607,8 +607,9 @@ defineExpose({
padding-right: 20px;
.head-icon {
position: absolute;
top: 0;
top: 50%;
right: 0;
margin-top: -8px;
cursor: pointer;
&.active {
color: var(--el-color-primary);

18
src/views/simulation/parameter/components/addParamLib.vue
View File

@@ -3,19 +3,19 @@
v-model="visible"
show-footer
diaTitle="新增参数库"
:width="400"
@close="closeFun"
>
<template #default>
<el-form :model="formData" labelWidth="auto">
<el-form-item label="参数库名称" prop="parameterLibraryName">
<el-input v-model="formData.parameterLibraryName"></el-input>
</el-form-item>
</el-form>
</template>
<template #footer>
<div class="dialog-footer">
<el-button @click="closeFn">取消</el-button>
<el-button @click="closeFun">取消</el-button>
<el-button type="primary" @click="onConfirmFun">确定</el-button>
</div>
</template>
@@ -23,7 +23,7 @@
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue';
import { ref } from 'vue';
import Dialog from '@/components/common/dialog/index.vue';
import { ElMessage } from 'element-plus';
@@ -35,29 +35,21 @@ const formData = ref({
parameterLibraryName: '',
});
const closeFn = () => {
const closeFun = () => {
emits('close');
};
const onConfirmFun = () => {
if (!formData.value.parameterLibraryName) {
ElMessage.warning('请输入参数库名称！');
return;
} else {
emits('createFn', formData.value);
}
};
onMounted(async () => {
});
</script>
<style lang="scss" scoped>
.upload {
width: 100%;
}
</style>

56
src/views/simulation/parameter/components/addParamObject.vue
View File

@@ -3,6 +3,8 @@
v-model="visible"
show-footer
diaTitle="新增参数对象"
:width="400"
@close="closeFun"
>
<template #default>
<el-form :model="formData" labelWidth="auto">
@@ -16,7 +18,12 @@
<el-input v-model="formData.parameterLibraryCategoryObjectName" ></el-input>
</el-form-item>
<el-form-item label="参数文件">
<el-tooltip
placement="top"
content="例：[{'parameterName': 'parameterName','parameterValue': 'parameterValue', 'unit': 'unit', 'description': 'description'}]"
>
<div class="tip">参数对象上传的JSON文件格式必须遵守格式要求，否则无法解析！</div>
</el-tooltip>
<el-tag v-if="formData.fileName" closable @close="deleteParamFile"> {{ formData.fileName }}</el-tag>
<el-upload
v-else
@@ -31,7 +38,7 @@
</template>
<template #footer>
<div class="dialog-footer">
<el-button @click="closeFn">取消</el-button>
<el-button @click="closeFun">取消</el-button>
<el-button type="primary" @click="onConfirmFun">确定</el-button>
</div>
</template>
@@ -45,9 +52,7 @@ import { ElMessage } from 'element-plus';
const emits = defineEmits(['close', 'createFn']);
const props = defineProps(['libTypeInfo']);
const visible = ref(true);
const formData = reactive<any>({
parameterLibraryName: '',
parameterLibraryCategoryName: '',
@@ -56,39 +61,33 @@ const formData = reactive<any>({
fileName: '',
});
const closeFn = () => {
const closeFun = () => {
emits('close');
};
const onConfirmFun = () => {
if (!formData.parameterLibraryCategoryObjectName) {
ElMessage.warning('请输入参数类型名称！');
return;
} else if (!formData.fileName) {
ElMessage.warning('请请上传对应参数文件');
return;
} else {
emits('createFn', formData);
}
};
const beforeUploadFun = (file:any) => {
console.log(file, 'file');
const beforeUploadFun = (file: any) => {
formData.file = file;
formData.fileName = file.name;
};
const deleteParamFile = () => {
formData.fileName = '';
formData.file = {};
};
onMounted(async () => {
onMounted(() => {
if (props.libTypeInfo) {
formData.parameterLibraryName = props.libTypeInfo.libName;
formData.parameterLibraryCategoryName = props.libTypeInfo.name;
@@ -97,17 +96,22 @@ onMounted(async () => {
}
});
</script>
<style lang="scss" scoped>
.upload {
width: 100%;
}
.dialog-footer{
width: 100%;
height: 40px;
display: flex;
align-items: center;
justify-content: flex-end;
}
</style>
<style lang="scss" scoped>
.upload {
width: 100%;
}
.dialog-footer {
width: 100%;
height: 40px;
display: flex;
align-items: center;
justify-content: flex-end;
}
.tip {
padding-bottom: 10px;
font-size: 12px;
line-height: 14px;
color: var(--el-text-color-secondary);
}
</style>

23
src/views/simulation/parameter/components/addParamType.vue
View File

@@ -3,22 +3,22 @@
v-model="visible"
show-footer
diaTitle="新增参数类型"
:width="400"
@close="closeFun"
>
<template #default>
<el-form :model="formData" labelWidth="auto">
<el-form-item label="参数库名称" prop="parameterLibraryName">
<el-input v-model="formData.parameterLibraryName" disabled></el-input>
</el-form-item>
<el-form-item label="分类名称" prop="parameterLibraryCategoryName">
<el-input v-model="formData.parameterLibraryCategoryName"></el-input>
</el-form-item>
</el-form>
</template>
<template #footer>
<div class="dialog-footer">
<el-button @click="closeFn">取消</el-button>
<el-button @click="closeFun">取消</el-button>
<el-button type="primary" @click="onConfirmFun">确定</el-button>
</div>
</template>
@@ -32,21 +32,17 @@ import { ElMessage } from 'element-plus';
const emits = defineEmits(['close', 'createFn']);
const props = defineProps(['libInfo']);
const visible = ref(true);
const formData = ref({
parameterLibraryCategoryName: '',
parameterLibraryName: '',
});
const closeFn = () => {
const closeFun = () => {
emits('close');
};
const onConfirmFun = () => {
if (!formData.value.parameterLibraryCategoryName) {
ElMessage.warning('请输入参数类型名称！');
return;
@@ -55,28 +51,25 @@ const onConfirmFun = () => {
parameterLibraryCategoryName: formData.value.parameterLibraryCategoryName,
parameterLibraryId: props.libInfo.id,
});
}
};
onMounted(async () => {
onMounted(() => {
if (props.libInfo) {
formData.value.parameterLibraryName = props.libInfo.name;
}
});
</script>
<style lang="scss" scoped>
<style lang="scss" scoped>
.upload {
width: 100%;
}
.dialog-footer{
.dialog-footer {
width: 100%;
height: 40px;
display: flex;
align-items: center;
justify-content: flex-end;
}
</style>

338
src/views/simulation/parameter/index.vue
View File

@@ -1,7 +1,6 @@
<template>
<div class="gl-page-content-grey">
<div class="gl-page-content-grey-full">
<div class="content">
<div class="page-content-left">
<el-tree
v-if="showTree"
@@ -13,7 +12,6 @@
:props="props"
:current-node-key="currentNodeKey"
:load="loadMoreFun"
@node-click="nodeClickFun"
@current-change="currentChangeFun"
>
<template #default="{ data }">
@@ -21,88 +19,64 @@
<el-icon class="icon-style" v-if="data.type !=3"><Folder /></el-icon>
<el-icon class="icon-style" v-else><Document /></el-icon>
<span>{{ data.name }}</span>
</div>
</template>
</el-tree>
</div>
<div class="page-content-right">
<div class="operate-content">
<el-button
type="primary"
v-if="currentNode?.type === 1 || !currentNode?.type"
@click="openCreateFn('lib')"
>新增参数库</el-button>
<el-button type="primary" v-if="currentNode?.type === 1" @click="openCreateFn('type')">新增分类</el-button>
<el-button type="primary" v-if="currentNode?.type === 2" @click="openCreateFn('param')">新增参数对象</el-button>
<el-button type="" v-if="currentNode?.type === 1" :disabled="currentNode?.type != 1" @click="deleteParamFn('lib')">删除参数库</el-button>
<el-button type="" v-if="currentNode?.type === 2" @click="deleteParamFn('type')">删除分类</el-button>
<el-button type="" v-if="currentNode?.type === 3" @click="deleteParamFn('param')">删除参数对象</el-button>
</div>
<div class="parameter-content">
<div class="parameter-content-left">
<div class="parameter-title">
基础信息
</div>
<el-descriptions class="parameter-descriptions" :column="1" label-width="100px" border>
<el-descriptions-item v-if="paramObjInfo?.parameterLibraryCategoryObjectName" label="对象名称">{{ paramObjInfo?.parameterLibraryCategoryObjectName }}</el-descriptions-item>
<el-descriptions-item label="所属库">{{ paramObjInfo?.parameterLibraryName }}</el-descriptions-item>
<el-descriptions-item v-if="paramObjInfo?.parameterLibraryCategoryName" label="所属分类">{{ paramObjInfo?.parameterLibraryCategoryName }}</el-descriptions-item>
<el-descriptions-item v-if="paramObjInfo?.createTime" label="创建时间">{{ paramObjInfo?.createTime }}</el-descriptions-item>
</el-descriptions>
<div class="parameter-title margin-style">
描述
</div>
<el-descriptions class="parameter-descriptions" :column="1" label-width="100px" border>
<el-descriptions-item label="描述信息">描述信息</el-descriptions-item>
</el-descriptions>
</div>
<div class="parameter-content-right">
<div class="parameter-title">
文件
</div>
<div class="file-content">
<div class="file-content-left">
<el-icon>
<Document />
</el-icon>
<span v-if="paramObjInfo.fileName">{{ paramObjInfo.fileName }} </span>
<BaseTable ref="paramTableRef" tableName="PARAMETER_LIST" hidePagination>
<template #leftOptions>
<div class="options">
<div v-if="paramObjInfo.fileName" class="file-content">
<div class="file-icon"><el-icon :size="16"><Document /></el-icon></div>
<div class="file-name"><span>{{ paramObjInfo.fileName }} </span></div>
<div class="download-btn"><UploadFile v-if="paramObjInfo.fileId" v-model="paramObjInfo.fileId" name="下载" /></div>
</div>
<UploadFile v-if="paramObjInfo.fileId" v-model="paramObjInfo.fileId" :name="'下载'" />
<el-button type="primary" v-if="currentNode?.type === 1 || !currentNode?.type" @click="openCreateFn('lib')">新增参数库</el-button>
<el-button type="primary" v-if="currentNode?.type === 1" @click="openCreateFn('type')">新增分类</el-button>
<el-button type="primary" v-if="currentNode?.type === 2" @click="openCreateFn('param')">新增参数对象</el-button>
<el-button type="danger" v-if="currentNode?.type === 1" :disabled="currentNode?.type != 1" @click="deleteParamFn('lib')">删除参数库</el-button>
<el-button type="danger" v-if="currentNode?.type === 2" @click="deleteParamFn('type')">删除分类</el-button>
<el-button type="danger" v-if="currentNode?.type === 3" @click="deleteParamFn('param')">删除参数对象</el-button>
<el-button @click="infoShow = true">参数详情</el-button>
</div>
<div class="param-content">
<BaseTable ref="paramTableRef" class="margin-style" tableName="PARAMETER_LIST" hidePagination>
<template #leftOptions>
<span class="tips">
参数对象上传的JSON文件格式必须遵守格式要求，否则无法解析！
</span>
</template>
</BaseTable>
</div>
</div>
</div>
</template>
</BaseTable>
</div>
</div>
<addParamLib v-if="showParamLibVisible" @close="showParamLibVisible = false" @create-fn="createLibFn"></addParamLib>
<el-drawer
v-model="infoShow"
:size="400"
title="参数详情"
:close-on-click-modal="false"
@close="infoShow = false"
>
<div class="info-content">
<el-descriptions class="info-content-descriptions" :column="1" label-width="100px" border>
<el-descriptions-item v-if="paramObjInfo?.parameterLibraryCategoryObjectName" label="对象名称">{{ paramObjInfo?.parameterLibraryCategoryObjectName }}</el-descriptions-item>
<el-descriptions-item label="所属库">{{ paramObjInfo?.parameterLibraryName }}</el-descriptions-item>
<el-descriptions-item v-if="paramObjInfo?.parameterLibraryCategoryName" label="所属分类">{{ paramObjInfo?.parameterLibraryCategoryName }}</el-descriptions-item>
<el-descriptions-item v-if="paramObjInfo?.createTime" label="创建时间">{{ paramObjInfo?.createTime }}</el-descriptions-item>
</el-descriptions>
</div>
</el-drawer>
<addParamLib
v-if="showParamLibVisible"
@close="showParamLibVisible = false"
@create-fn="createLibFn"
/>
<addParamType
v-if="showParamTypeVisible"
@close="showParamTypeVisible = false"
:lib-info="currentNode"
@create-fn="createLibTypeFn"
></addParamType>
/>
<addParamObject
v-if="showParamObjVisible"
@close="showParamObjVisible = false"
:lib-type-info="currentNode"
@create-fn="creatLibParamObjFn"
></addParamObject>
/>
</div>
</template>
@@ -125,51 +99,40 @@ const showParamObjVisible = ref(false);
const showTree = ref(true);
const libTreeRef = ref();
const paramTableRef = ref();
const infoShow = ref(false);
const props = {
label: 'label',
children: 'children',
isLeaf: 'leaf',
};
const loadMoreFun = async (node: any, resolve: any) => {
const loadMoreFun = async(node: any, resolve: any) => {
const listData: any = await getSimulationParameterTreeDAtaFn(node.data);
if (node.level >= 1) {
choseNodeFun(node.data);
}
return resolve(listData);
};
const getSimulationParameterTreeDAtaFn = async (data?: any) => {
const getSimulationParameterTreeDAtaFn = async(data?: any) => {
const param: any = {
type: 1,
};
if (data?.type) {
param.type = data.type;
}
if (data?.id) {
param.id = data.id;
}
const res: any = await getSimulationParameterTreeApi(param);
if (res && res.code === 200) {
const result = res.data.map((item: any) => {
const node: any = {
...item,
nodeKey: item.id + '_' + item.type,
};
if (param.type === 1 && param.id) {
node.libName = data.name;
node.libId = data.id;
}
if (param.type === 2 && param.id) {
node.typeName = data.name;
node.typeId = data.id;
@@ -178,50 +141,28 @@ const getSimulationParameterTreeDAtaFn = async (data?: any) => {
node.leaf = true;
node.isLeaf = true;
}
return node;
});
return result;
}
};
// 选中节点
const choseNodeFun = (data: any) => {
console.log(data, 'data111111111111');
};
const nodeClickFun = () => {
};
const paramObjInfo = ref<any>({});
// 当前节点更改
const currentChangeFun = async (data: any) => {
console.log(data, 'data');
const currentChangeFun = async(data: any) => {
currentNodeKey.value = data.nodeKey;
currentNode.value = data;
paramTableRef.value.setDataFun([]);
if (data.type === 3) {
const res:any = await getSimulationParameterLibraryCategoryObjectApi({
ObjectId: data.id,
});
if (res && res.code === 200) {
paramObjInfo.value = res.data;
paramTableRef.value.setDataFun( paramObjInfo.value.parameterJsonValue || []);
}
}
else if (data.type === 2) {
} else if (data.type === 2) {
paramObjInfo.value = {
parameterLibraryName: data.libName,
parameterLibraryCategoryName: data.name,
@@ -231,7 +172,6 @@ const currentChangeFun = async (data: any) => {
paramObjInfo.value = {
parameterLibraryName: data.name,
};
} else {
paramObjInfo.value = {};
}
@@ -249,48 +189,36 @@ const openCreateFn = (flag: any) => {
}
};
const createLibFn = async (data: any) => {
console.log(libTreeRef.value, 'libTreeRef.value');
const createLibFn = async(data: any) => {
const res: any = await addLibraryApi(data);
if (res && res.code === 200) {
ElMessage.success('新增参数库成功');
const libList = await getSimulationParameterTreeDAtaFn();
if (libList.length === 1) {
showTree.value = false;
} else {
libTreeRef.value.insertAfter(libList.at(-1), libList[libList.length - 2].nodeKey);
}
}
showTree.value = true;
showParamLibVisible.value = false;
return;
};
const createLibTypeFn = async (data: any) => {
const createLibTypeFn = async(data: any) => {
const res: any = await addLibraryCategoryApi(data);
if (res && res.code === 200) {
ElMessage.success('新增参数分类成功');
const list = await getSimulationParameterTreeDAtaFn(currentNode.value);
const node = list.find((item: any) => {
return item.name === data.parameterLibraryCategoryName;
});
libTreeRef.value.append(node, currentNode.value.nodeKey);
}
showParamTypeVisible.value = false;
};
const creatLibParamObjFn = async (data: any) => {
const creatLibParamObjFn = async(data: any) => {
const res:any = await addLibraryCategoryObjectApi({
parameterLibraryId: data.parameterLibraryId,
parameterLibraryCategoryId: data.parameterLibraryCategoryId,
@@ -307,9 +235,6 @@ const creatLibParamObjFn = async (data: any) => {
});
libTreeRef.value.append(node, currentNode.value.nodeKey);
}
console.log(data, 'data');
showParamObjVisible.value = false;
};
@@ -322,149 +247,82 @@ const deleteParamFn = (flag:any) => {
cancelButtonText: '取消',
type: 'warning',
}
)
.then(async () => {
const res:any = await deleteSimulationParameterApi({
type: currentNode.value.type,
id: currentNode.value.id,
});
if (res && res.code === 200) {
ElMessage.success('删除成功！');
libTreeRef.value.remove(currentNode.value.nodeKey);
currentNode.value = {};
paramObjInfo.value = '';
}
})
.catch(() => {
).then(async() => {
const res:any = await deleteSimulationParameterApi({
type: currentNode.value.type,
id: currentNode.value.id,
});
if (res && res.code === 200) {
ElMessage.success('删除成功！');
libTreeRef.value.remove(currentNode.value.nodeKey);
currentNode.value = {};
paramObjInfo.value = '';
}
});
};
</script>
<style lang="scss" scoped>
.gl-page-content-grey {
height: 100%;
width: 100%;
.custom-tree-node{
display: flex;
align-items: center;
.icon-style{
margin-right: 5px;
}
}
.gl-page-content-grey-full {
.content {
height: 100%;
width: 100%;
display: flex;
.page-content-left {
padding: 10px;
width: 350px;
height: 100%;
overflow: auto;
margin-right: 10px;
background-color: #fff;
}
.page-content-right {
width: calc(100% - 360px);
height: 100%;
background-color: #fff;
padding: 0 10px;
.operate-content {
width: 100%;
height: 50px;
overflow: auto;
.custom-tree-node {
display: flex;
align-items: center;
.icon-style{
margin-right: 5px;
}
}
.parameter-content {
height: calc(100% - 50px);
width: 100%;
}
.page-content-right {
flex: 1;
padding: 16px;
background-color: #fff;
height: 100%;
overflow: auto;
.options {
display: flex;
.parameter-title {
align-items: center;
justify-content: center;
.file-content {
display: flex;
align-items: center;
&::before {
content: '';
display: inline-block;
width: 4px;
height: 16px;
background-color: var(--el-color-primary);
margin-right: 8px;
}
}
.margin-style {
margin-top: var(--margin-small);
}
.parameter-content-left {
width: 40%;
height: 100%;
.parameter-descriptions {
margin-top: var(--margin-small);
}
}
.parameter-content-right {
width: 60%;
height: 100%;
padding-left: var(--margin-small);
.file-content {
width: 100%;
justify-content: center;
margin-right: 20px;
height: 24px;
padding: 0 5px;
border-radius: 4px;
background-color: var(--el-border-color-light);
.file-icon {
display: flex;
align-items: center;
justify-content: space-between;
padding: var(--margin-small);
background-color: #e6ebf5;
margin-top: var(--margin-small);
.file-content-left {
display: flex;
align-items: center;
span {
margin-left: var(--margin-small);
}
}
.file-content-right {
cursor: pointer;
}
}
.param-content{
width: 100%;
height: calc(100% - 80px);
overflow: auto;
.tips{
font-size: 12px;
padding-left: 10px;
color: #949494;
justify-content: center;
color: var(--el-color-primary);
}
.file-name {
padding: 0 4px;
font-size: 14px;
color: var(--el-text-color-primary);
}
}
}
}
}
}
.pinfo-content {
width: 100%;
height: 100%;
.info-content-descriptions {
margin-top: var(--margin-small);
}
}
</style>