Skip to content

B
bigDataSystem
Commit 8e044c3d authored by 罗林杰's avatar 罗林杰
Browse files
Options

修改血缘

parent 6098349c
Hide whitespace changes
Inline Side-by-side
Showing with 376 additions and 34 deletions
src/views/kinship/kinshipAnalysis/GroupTree.vue 0 → 100644
View file @ 8e044c3d
<template>
<div class="m-5 mr-0 overflow-hidden bg-white">
<BasicTree
title=""
ref="treeRef"
treeWrapperClassName="h-[calc(100%-35px)] overflow-auto"
:defaultExpandAll="true"
:treeData="treeData"
:fieldNames="{ key: 'businessId', title: 'workSpaceName' }"
@select="handleSelect"
:actionList="actionList"
/>
</div>
</template>
<script lang="ts" setup>
import { h, nextTick, onMounted, ref, unref } from 'vue';
import { BasicTree, TreeActionType, TreeItem } from '@/components/Tree';
import { Nullable } from '@vben/types';
import { TreeData } from './analysisData';
import { ReloadOutlined } from '@ant-design/icons-vue';
import { useMessage } from '@/hooks/web/useMessage';
defineOptions({ name: 'DataSourceTree' });
const emit = defineEmits(['select']);
const { createMessage } = useMessage();
const treeData = ref<TreeItem[]>([]);
const treeRef = ref<Nullable<TreeActionType>>(null);
function getTree() {
const tree = unref(treeRef);
if (!tree) {
throw new Error('tree is null!');
}
return tree;
}
async function fetch() {
const data = TreeData;
treeData.value = handleTree(data, 'businessId', undefined, undefined, undefined);
await nextTick(() => {
getTree().expandAll(true);
});
}
function handleTree(data, id, parentId, children, rootId) {
id = id || 'id';
parentId = parentId || 'parentId';
children = children || 'children';
rootId =
rootId ||
Math.min.apply(
Math,
data.map((item) => {
return item[parentId];
}),
) ||
0;
// 对源数据深度克隆
const cloneData = JSON.parse(JSON.stringify(data));
// 循环所有项
const treeData = cloneData.filter((father) => {
const branchArr = cloneData.filter((child) => {
// 返回每一项的子级数组
return father[id] === child[parentId];
});
branchArr.length > 0 ? (father.children = branchArr) : '';
// 返回第一层
return father[parentId] === rootId;
});
return treeData !== '' ? treeData : data;
}
function handleSelect() {
const keys = getTree().getSelectedKeys();
const node = getTree().getSelectedNode(keys[0]);
emit('select', node);
}
// 树的操作列表
const actionList = [
{
render: () => {
return h(ReloadOutlined, {
class: 'ml-2',
onClick: () => {
refresh();
},
});
},
},
];
const refresh = () => {
createMessage.success('刷新成功');
};
onMounted(() => {
fetch();
});
</script>
src/views/kinship/kinshipAnalysis/analysisData.ts
View file @ 8e044c3d
export const TreeData: any[] = [
{
delFlag: '0',
flag: '1',
businessId: 100,
workSpaceName: '数据库对象资源',
parentId: 0,
'code:': '001',
ancestors: '0',
orderNum: 0,
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
delFlag: '0',
flag: '1',
businessId: 101,
workSpaceName: 'inc1',
parentId: 100,
'code:': '002',
ancestors: '0,100',
orderNum: 1,
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
delFlag: '0',
flag: '1',
businessId: 102,
workSpaceName: 'inc2',
parentId: 100,
'code:': '003',
ancestors: '0,100',
orderNum: 2,
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
delFlag: '0',
flag: '0',
businessId: 103,
workSpaceName: 'inc3',
parentId: 100,
'code:': '010',
ancestors: '0,100,107',
orderNum: 2,
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
delFlag: '0',
flag: '1',
businessId: 201,
workSpaceName: 'mysql1',
parentId: 101,
'code:': '002',
ancestors: '0,100',
orderNum: 1,
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
delFlag: '0',
flag: '1',
businessId: 202,
workSpaceName: 'mysql2',
parentId: 102,
'code:': '002',
ancestors: '0,100',
orderNum: 1,
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
delFlag: '0',
flag: '1',
businessId: 203,
workSpaceName: 'mysql3',
parentId: 103,
'code:': '002',
ancestors: '0,100',
orderNum: 1,
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
];
export const storageManagementData: any[] = [
{
id: '1',
startTime: '2024-10-01 08:00:00',
endTime: '2024-10-01 10:30:00',
useTime: '2小时30分钟',
status: '1',
type: '手动清理',
pointNum: '5000',
num: '2000',
user: '张三',
},
{
id: '2',
startTime: '2024-10-02 09:00:00',
endTime: '2024-10-02 11:45:00',
useTime: '2小时45分钟',
status: '0',
type: '自动清理',
pointNum: '7000',
num: '3500',
user: '李四',
},
{
id: '3',
startTime: '2024-10-03 10:00:00',
endTime: '2024-10-03 12:15:00',
useTime: '2小时15分钟',
status: '1',
type: '手动清理',
pointNum: '6000',
num: '3000',
user: '王五',
},
{
id: '4',
startTime: '2024-10-04 11:00:00',
endTime: '2024-10-04 13:20:00',
useTime: '2小时20分钟',
status: '1',
type: '自动清理',
pointNum: '4500',
num: '2250',
user: '赵六',
},
{
id: '5',
startTime: '2024-10-05 12:00:00',
endTime: '2024-10-05 14:30:00',
useTime: '2小时30分钟',
status: '1',
type: '手动清理',
pointNum: '5500',
num: '2750',
user: '孙七',
},
];
src/views/kinship/kinshipAnalysis/data.ts
View file @ 8e044c3d
import { BasicColumn, FormSchema } from '@/components/Table';
export const columns: BasicColumn[] = [
{
title: '名称',
dataIndex: 'name',
width: 120,
},
{
title: '类型',
dataIndex: 'category',
width: 120,
},
{
title: '拥有者',
dataIndex: 'owner',
width: 120,
},
{
title: '创建时间',
dataIndex: 'createDate',
width: 140,
},
];
export const SearchFormSchema: FormSchema[] = [
{
field: 'name',
label: '名称',
component: 'Input',
colProps: { span: 8 },
},
{
field: 'isKinship',
component: 'Checkbox',
label: '仅看血缘对象',
colProps: { span: 8 },
labelWidth: 120,
},
];
export const storageManagementColumns: BasicColumn[] = [
{
title: '清理开始时间',
dataIndex: 'startTime',
width: 120,
},
{
title: '清理结束时间',
dataIndex: 'endTime',
width: 120,
},
{
title: '执行耗时',
dataIndex: 'useTime',
width: 80,
},
{
title: '执行状态',
dataIndex: 'status',
width: 120,
},
{
title: '清理策略',
dataIndex: 'type',
width: 120,
},
{
title: '清理表顶点数',
dataIndex: 'pointNum',
width: 120,
},
{
title: '清理血缘关系树',
dataIndex: 'num',
width: 120,
},
{
title: '操作者',
dataIndex: 'user',
width: 80,
},
];
export const storageManagementFormSchema: FormSchema[] = [
{
field: 'startTime',
label: '清理开始时间',
component: 'DatePicker',
colProps: { lg: 4, md: 4 },
},
{
field: 'endTime',
label: '清理结束时间',
component: 'DatePicker',
colProps: { lg: 4, md: 4 },
},
{
field: 'user',
label: '清理者',
component: 'Input',
colProps: { lg: 4, md: 4 },
},
{
field: 'type',
label: '清理策略',
component: 'Select',
componentProps: {
options: [
{ label: '手动清理', value: '1' },
{ label: '自动清理', value: '2' },
],
},
colProps: { lg: 4, md: 4 },
},
];
src/views/kinship/kinshipAnalysis/index.vue
View file @ 8e044c3d
<template>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<GroupTree class="w-1/3 xl:w-2/9" @select="onNodeSelect" />
<div class="w-2/3 xl:w-7/9">
<GroupTree class="w-1/8 xl:w-1/8" @select="onNodeSelect" />
<div class="w-7/8 xl:w-7/8">
<BasicTable @register="registerTable" :searchInfo="searchInfo">
<template #toolbar>
<a-button type="primary" @click="handleManage">存储管理</a-button>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'dataSourceStatus'">
<Tag color="error" v-if="record.dataSourceStatus === '0'">数据待采集</Tag>
</template>
<template v-if="column.key === 'dataSourceStatus'">
<Tag color="warning" v-if="record.dataSourceStatus === '1'">数据采集中</Tag>
</template>
<template v-if="column.key === 'dataSourceStatus'">
<Tag color="success" v-if="record.dataSourceStatus === '2'">采集已完成</Tag>
</template>
</template>
</BasicTable>
</div>
<storageManagementModal @register="registerStorageManagementModal" />
......@@ -24,13 +13,12 @@
</template>
<script lang="ts" setup>
import { reactive, onMounted, ref } from 'vue';
import { Tag } from 'ant-design-vue';
import { BasicTable, useTable } from '@/components/Table';
import { PageWrapper } from '@/components/Page';
import { useMessage } from '@/hooks/web/useMessage';
import { useModal } from '@/components/Modal';
import { sourceColumns, sourceSearchFormSchema } from '@/views/metadata/data';
import GroupTree from '@/views/metadata/GroupTree.vue';
import { columns, SearchFormSchema } from './data';
import GroupTree from './GroupTree.vue';
import { metadataData } from '@/views/metadata/metadataData';
import storageManagementModal from './storageManagementModal.vue';
......@@ -56,15 +44,15 @@
};
//过滤data中的数据，取出等于params.deptId的数据
var data = [];
data = tableData.value.filter((item) => item.parentId !== 0);
data = tableData.value;
return { ...response, data: data };
},
rowKey: 'businessId',
striped: false,
columns: sourceColumns,
columns,
formConfig: {
labelWidth: 120,
schemas: sourceSearchFormSchema,
schemas: SearchFormSchema,
autoSubmitOnEnter: true,
resetFunc: () => {},
},
......@@ -103,18 +91,6 @@
);
await reload();
}
/** 新增/编辑成功*/
function handleSuccess({ isUpdate, values }) {
if (isUpdate) {
// 演示不刷新表格直接更新内部数据。
// 注意：updateTableDataRecord要求表格的rowKey属性为string并且存在于每一行的record的keys中
const result = updateTableDataRecord(values.id, values);
// console.log(result);
reload();
} else {
reload();
}
}
function handleManage() {
openStorageManagementModal(true, {
title: '存储管理',
......
src/views/kinship/kinshipAnalysis/storageManagementModal.vue
View file @ 8e044c3d
......@@ -15,6 +15,12 @@
</template>
<BasicTable @register="registerTable">
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'status'">
<Tag color="error" v-if="record.status === '0'">失败</Tag>
</template>
<template v-if="column.key === 'status'">
<Tag color="success" v-if="record.status === '1'">成功</Tag>
</template>
<template v-if="column.key === 'action'">
<TableAction
:actions="[
......@@ -38,7 +44,7 @@
//失败日志
icon: 'clarity:contract-line',
label: '',
ifShow: record.status === '失败',
ifShow: record.status === '0',
onClick: handleDetail.bind(null),
},
]"
......@@ -53,8 +59,9 @@
import { BasicModal, useModalInner } from '@/components/Modal';
import { useMessage } from '@/hooks/web/useMessage';
import { BasicTable, TableAction, useTable } from '@/components/Table';
import { storageManagementColumns, storageManagementFormSchema } from '@/views/metadata/data';
import { storageManagementData } from '@/views/metadata/metadataData';
import { storageManagementColumns, storageManagementFormSchema } from './data';
import { storageManagementData } from './analysisData';
import { Tag } from 'ant-design-vue';
defineOptions({ name: 'KnowledgeModal' });
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment