Skip to content

B
bigDataSystem
Commit ba9564b2 authored by 曹泽华's avatar 曹泽华
Browse files
Options

数仓规划 物理模型-模型关系

parent ad8bb037
Hide whitespace changes
Inline Side-by-side
Showing with 479 additions and 24 deletions
src/router/routes/index.ts
View file @ ba9564b2
......@@ -206,7 +206,8 @@ export const DataWarehousePlanningRoute: AppRouteRecordRaw = {
{
path: 'logicalModel/ERchart',
name: 'logicalChartModel',
component: () => import('@/views/dataWarehousePlanning/logicalModel/modelDetail/ERchart/index.vue'),
component: () =>
import('@/views/dataWarehousePlanning/logicalModel/modelDetail/ERchart/index.vue'),
meta: {
title: '实体关系图',
icon: '',
......@@ -245,6 +246,18 @@ export const DataWarehousephysicalModelRoute: AppRouteRecordRaw = {
icon: '',
},
},
{
path: 'physicalModel/relate',
name: 'relateImage',
component: () =>
import(
'@/views/dataWarehousePlanning/physicalModel/modelDetail/modelRelationship/relateImage.vue'
),
meta: {
title: '模型关系',
icon: '',
},
},
],
};
......@@ -377,7 +390,8 @@ export const DataStandardRoute: AppRouteRecordRaw = {
{
path: 'IndicatorStandards/basicStandardsContrast',
name: 'basicStandardsContrast1',
component: () => import('@/views/dataStandards/IndicatorStandards/indicatorStandardsContrast.vue'),
component: () =>
import('@/views/dataStandards/IndicatorStandards/indicatorStandardsContrast.vue'),
meta: {
title: '指标标准对比',
icon: '',
......@@ -431,7 +445,6 @@ export const DataStandardRoute: AppRouteRecordRaw = {
],
};
export const WorkSpaceRoute: AppRouteRecordRaw = {
path: '/workspace',
name: 'Workspace',
......
src/views/dataWarehousePlanning/physicalModel/index.vue
View file @ ba9564b2
......@@ -15,13 +15,6 @@
@click="handleMoreCreate"
>批量建表</a-button
>
<a-button
type="primary"
:disabled="getRowSelection().selectedRowKeys <= 0"
@click="handleWaitUpload"
>设为待发布</a-button
>
<a-button type="primary" :disabled="getRowSelection().selectedRowKeys <= 0">发布</a-button>
<a-button type="primary" @click="handleBaseImport">从元数据导入</a-button>
<a-button type="primary" :disabled="getRowSelection().selectedRowKeys <= 0">导出</a-button>
<a-button type="primary" @click="handleImport">导入</a-button>
......
src/views/dataWarehousePlanning/physicalModel/modelDetail/index.vue
View file @ ba9564b2
......@@ -3,15 +3,22 @@
<template #extra>
<a-button type="primary" v-if="!editFlag" @click="handleCreateTable">自动建表</a-button>
<a-button type="primary" v-if="!editFlag" @click="handleVersion">版本管理</a-button>
<a-button type="primary" @click="handleRelate">模型关系</a-button>
<a-button type="primary" v-if="!editFlag" @click="handleExport">导出</a-button>
<a-button type="primary" v-if="!editFlag" @click="handleEdit">编辑</a-button>
<a-button type="primary" v-if="!editFlag">删除</a-button>
<a-button type="primary" v-if="editFlag">编辑记录</a-button>
<a-button type="primary" v-if="editFlag">设为待发布</a-button>
<a-button type="primary" v-if="editFlag" @click="handlePublish">发布</a-button>
<a-button type="primary" v-if="editFlag" @click="handleDebug">建表调试</a-button>
<a-button type="primary" v-if="editFlag" @click="handleSave">保存</a-button>
<a-button type="primary" v-if="editFlag" @click="handleCancel">取消</a-button>
<a-button type="primary" v-if="editFlag" @click="handleWaitPub">{{
iswaitPub ? '设为待发布' : '取消待发布'
}}</a-button>
<a-button type="primary" v-if="editFlag" @click="handlePublish" :disabled="iswaitPub">发布</a-button>
<a-button type="primary" v-if="editFlag" @click="handleDebug" :disabled="!iswaitPub"
>建表调试</a-button
>
<a-button type="primary" v-if="editFlag" @click="handleSave" :disabled="!iswaitPub"
>保存</a-button
>
<a-button type="primary" v-if="editFlag" @click="handleCancel">退出编辑</a-button>
</template>
<template #footer>
......@@ -150,7 +157,9 @@
</BasicForm>
</div>
</Tabs.TabPane>
<Tabs.TabPane key="3" v-if="!editFlag" tab="模型关系" />
<Tabs.TabPane key="3" tab="模型关系">
<ModelRelationship />
</Tabs.TabPane>
<Tabs.TabPane key="4" v-if="!editFlag" tab="模型关联">
<SourceData style="margin-top: 20px" />
<LogicalModel style="margin-top: 20px" />
......@@ -167,7 +176,7 @@
<script lang="ts" setup>
import { reactive, onMounted, ref, nextTick, computed, unref } from 'vue';
import { PageWrapper } from '@/components/Page';
import { useRoute, onBeforeRouteLeave } from 'vue-router';
import {useRoute, onBeforeRouteLeave, useRouter} from 'vue-router';
import { useFilterStore } from '@/store/modules/filterData';
import { Descriptions, Select, Tabs } from 'ant-design-vue';
import DetailInfo from './detailInfo.vue';
......@@ -195,8 +204,8 @@
import SqlDevelop from '@/views/dataWarehousePlanning/physicalModel/modelDetail/sqlDevelop.vue';
import ModelCreateTable from '@/views/dataWarehousePlanning/physicalModel/modelDetail/modelCreateTable.vue';
import VersionModel from '@/views/dataWarehousePlanning/physicalModel/modelDetail/versionModel.vue';
import ModelPublishTable
from "@/views/dataWarehousePlanning/physicalModel/modelDetail/modelPublishTable.vue";
import ModelPublishTable from '@/views/dataWarehousePlanning/physicalModel/modelDetail/modelPublishTable.vue';
import ModelRelationship from '@/views/dataWarehousePlanning/physicalModel/modelDetail/modelRelationship/modelRelationship.vue';
const [registerModal, { openModal }] = useModal();
const [registerDebugModal, { openModal: openDebugModal }] = useModal();
......@@ -209,6 +218,7 @@
const route = useRoute();
const searchInfo = reactive<Recordable>({});
const modelName = route.query.modelName;
const { push } = useRouter();
/**
* 属性定义
*/
......@@ -216,6 +226,7 @@
const info = reactive({ ...infoData });
let editFlag = ref(false);
let isPublish = ref(false);
let iswaitPub = ref(true);
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 108,
baseColProps: { lg: 12, md: 24 },
......@@ -239,7 +250,7 @@
{ reload, updateTableDataRecord, getSearchInfo, getForm, getRowSelection },
] = useTable({
title: '',
scroll: {y: 200},
scroll: { y: 200 },
api: async (params) => {
console.log('params:', params);
const response = {
......@@ -251,7 +262,7 @@
message: '',
data: [],
};
return {...response};
return { ...response };
},
rowKey: 'businessId',
columns: columnsDetail,
......@@ -272,8 +283,6 @@
},
});
/**
* 导出
*/
......@@ -295,6 +304,18 @@
});
}
/** 模型管理*/
function handleRelate() {
push({
path: '/dataWarehousePlanning/physicalModel/relate',
});
}
/** 设为待发布*/
function handleWaitPub() {
iswaitPub.value = !iswaitPub.value;
}
/** 发布*/
function handlePublish() {
openPublishModal(true, {
......@@ -334,7 +355,6 @@
*/
function handleCancel() {
editFlag.value = false;
tabsKey.value = '1';
}
onMounted(() => {
setFieldsValue({ ...infoData });
......
src/views/dataWarehousePlanning/physicalModel/modelDetail/modelRelationship/crossModel.vue 0 → 100644
View file @ ba9564b2
<template>
<BasicModal
width="40%"
v-bind="$attrs"
@register="registerModal"
:title="getTitle"
@ok="handleSubmit"
>
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup>
import { ref, computed, unref } from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { ConnectionModelFormSchema } from './relate.data';
defineOptions({ name: 'ModelModal' });
const isUpdate = ref(false);
const isMove = ref(false);
const rowId = ref('');
//获取接口数据并放在下拉框里（这里是打开了一个弹框）
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
schemas: ConnectionModelFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
await resetFields();
setModalProps({ confirmLoading: false });
isUpdate.value = !!data?.isUpdate;
isMove.value = !!data?.isMove;
if (unref(isUpdate)) {
// 获取行数据的id
rowId.value = data.record.businessId;
// 塞值
await setFieldsValue({
...data.record,
});
}
});
const getTitle = computed(() =>
isUpdate.value ? '编辑模型关系' : '新建模型关系',
);
/**确定按钮*/
async function handleSubmit() {
await validate();
closeModal();
}
</script>
src/views/dataWarehousePlanning/physicalModel/modelDetail/modelRelationship/modelRelationship.vue 0 → 100644
View file @ ba9564b2
<template>
<div>
<BasicTable @register="registerTable" :searchInfo="searchInfo">
<template #toolbar>
<a-button
:disabled="getRowSelection().selectedRowKeys <= 0"
type="primary"
@click="handleDelete"
><DeleteTwoTone />删除</a-button
>
<a-button type="primary" @click="handleCrossModel"
><PlusCircleTwoTone />新增模型关系</a-button
>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
icon: 'clarity:note-edit-line',
onClick: handleCrossEditModel.bind(null, record),
},
{
icon: 'ant-design:delete-outlined',
onClick: handleDelete.bind(null, record),
color: 'error',
},
]"
/>
</template>
</template>
</BasicTable>
<CrossModel @register="crossModal" @success="crossSuccess" />
</div>
</template>
<script lang="ts" setup>
import { reactive, onMounted, ref } from 'vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { useRoute, onBeforeRouteLeave } from 'vue-router';
import { crossFormSchema, crossTable } from './relate.data';
import { useFilterStore } from '@/store/modules/filterData';
import { TreeData } from '@/views/dataWarehousePlanning/logicalModel/modelData';
import { crossData } from './relateData';
import { DeleteTwoTone, PlusCircleTwoTone } from '@ant-design/icons-vue';
import CrossModel from './crossModel.vue';
import { useModal } from '@/components/Modal';
import { useMessage } from '@/hooks/web/useMessage';
defineOptions({ name: 'AccountManagement' });
const { createMessage, createConfirm } = useMessage();
const filterStore = useFilterStore();
const route = useRoute();
const searchInfo = reactive<Recordable>({});
const tableData = ref([]);
// 模态框
const [crossModal, { openModal }] = useModal();
// 实体新增
function handleCrossModel() {
openModal(true, {
isUpdate: false,
});
}
// 实体编辑
function handleCrossEditModel(record: Recordable) {
openModal(true, {
record,
isUpdate: true,
});
}
// 模态框保存
function crossSuccess({ isUpdate, values }) {
if (isUpdate) {
// 注意：updateTableDataRecord要求表格的rowKey属性为string并且存在于每一行的record的keys中
//修改表单的值
const result = updateTableDataRecord(values.businessId, values);
reload();
} else {
tableData.value.push(values);
reload();
}
}
const [
registerTable,
{ reload, updateTableDataRecord, getSearchInfo, getForm, getRowSelection },
] = useTable({
// 数据
api: async (params) => {
console.log('params:', params);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: crossData.length,
code: '',
message: '',
data: crossData,
};
return { ...response };
},
rowKey: 'businessId',
// 列
columns: crossTable,
rowSelection: true,
showIndexColumn: false,
striped: false,
// 搜索
formConfig: {
labelWidth: 120,
schemas: crossFormSchema,
autoSubmitOnEnter: true,
showActionButtonGroup: false,
},
useSearchForm: true,
showTableSetting: false,
bordered: true,
handleSearchInfoFn(info) {
return info;
},
actionColumn: {
width: 150,
title: '操作',
dataIndex: 'action',
},
});
/** 删除按钮*/
function handleDelete() {
createConfirm({
iconType: 'warning',
title: '确认删除',
content: '确认批量删除选中数据吗？',
onOk() {
createMessage.success('批量删除成功!');
},
});
}
/** 列表删除 */
function handleRemove(record) {
createMessage.success('删除成功!');
}
onMounted(() => {
tableData.value = TreeData;
const path = route.path;
if (filterStore.getSearchParams[path]) {
if (JSON.parse(filterStore.getSearchParams[path] !== {})) {
const params = JSON.parse(filterStore.getSearchParams[path]);
getForm().setFieldsValue({
page: params.page,
pageSize: params.pageSize,
username: params.username,
flag: params.flag,
});
searchInfo.institutionId = params.institutionId;
}
}
});
onBeforeRouteLeave((to, from, next) => {
next(); // 允许导航
});
</script>
<style scoped lang="scss">
.vben-basic-table-form-container {
padding: 0;
}
</style>
src/views/dataWarehousePlanning/physicalModel/modelDetail/modelRelationship/relate.data.ts 0 → 100644
View file @ ba9564b2
import {FormSchema} from "@/components/Form";
import {BasicColumn} from "@/components/Table";
import {TreeItem} from "@/components/Tree";
export const ConnectionModelFormSchema: any[] = [
{
field: 'name',
label: '关系名称',
component: 'Input',
required: true,
colProps: { lg: 24, md: 24 },
},
{
field: 'fatherName',
label: '子属性',
component: 'Select',
required: true,
colProps: { lg: 24, md: 24 },
},
{
field: 'fatherPK',
label: '父模型',
component: 'Select',
required: true,
colProps: { lg: 24, md: 24 },
},
{
field: 'fatherNum',
label: '父属性',
component: 'Select',
required: true,
colProps: { lg: 24, md: 24 },
},
{
field: 'comments',
label: '注释',
component: 'InputTextArea',
colProps: { lg: 24, md: 24 },
},
];
export const crossFormSchema: FormSchema[] = [
{
field: 'name',
component: 'Input',
componentProps: {
placeholder: '输入关联关系名称搜索',
},
colProps: { span: 4 },
},
];
export const crossTable: BasicColumn[] = [
{
title: '关系名称',
dataIndex: 'name',
width: 150,
// onEditRow: true,
},
{
title: '子属性',
dataIndex: 'sonAttribute',
width: 150,
// onEditRow: true,
},
{
title: '父模型',
dataIndex: 'fatherModel',
width: 150,
// onEditRow: true,
},
{
title: '父属性',
dataIndex: 'fatherAttribute',
width: 150,
// onEditRow: true,
},
{
title: '注释',
dataIndex: 'comments',
width: 150,
// onEditRow: true,
},
];
export const chartTreeData: TreeItem[] = [
{
title: '物理模型',
key: '1',
children: [
{ title: 'yL_table_orc01', icon: 'ion:cube-outline', key: '3' },
{ title: 'yl_table_torc01', icon: 'ion:cube-outline', key: '4' },
],
},
{
title: '模型关联',
key: '2',
children: [
{ title: 'NEW orc_id_torc_id', icon: 'ion:git-merge-outline', key: '5' },
{ title: 'orc_id_torc_id', icon: 'ion:git-merge-outline', key: '6' },
],
},
];
src/views/dataWarehousePlanning/physicalModel/modelDetail/modelRelationship/relateData.ts 0 → 100644
View file @ ba9564b2
export const crossData: any[] = [
{
businessId: '1',
name: 'orc_torc_id',
sonAttribute: 'id',
fatherModel: '/物理模型/test_catalog/argodb/Argodb/yl_test',
fatherAttribute: 'id',
comments: '备注',
},
];
src/views/dataWarehousePlanning/physicalModel/modelDetail/modelRelationship/relateImage.vue 0 → 100644
View file @ ba9564b2
<template>
<PageWrapper title="模型关系" contentBackground headerSticky>
<template #extra>
<a-button type="primary">刷新</a-button>
<a-button type="primary">全屏</a-button>
<a-button type="primary">退出</a-button>
</template>
<template #footer>
<div style="display: flex">
<div style="flex: 1; display: flex">
<div style="flex: 1">
<BasicTree
:search="123"
:rightMenuList="{ type: [{ label: '123' }] }"
:treeData="chartTreeData"
:fieldNames="{ key: 'key', title: 'title' }"
defaultExpandLevel="1"
@select="handleSelect"
/>
</div>
<a-button
@click="handleAdd"
style="margin-left: -10px; margin-top: 6px; border-color: #d9d9d9"
size="small"
><PlusOutlined style="color: #9396a4"
/></a-button>
</div>
<div style="flex: 4">
<img
v-if="modelLevel === '1' || modelLevel === '2'"
src="../../../../../assets/images/ERchart.jpg"
class="erchart-img"
/>
<img
v-if="modelLevel === '3' || modelLevel === '4'"
src="../../../../../assets/images/modelrelate.png"
class="erchart-img"
/>
<img
v-if="modelLevel === '5' || modelLevel === '6'"
src="../../../../../assets/images/modelrelate1.png"
class="erchart-img"
/>
</div>
</div>
</template>
<CrossModel @register="crossModal" />
</PageWrapper>
</template>
<script lang="ts" setup>
import { PlusOutlined } from '@ant-design/icons-vue';
import { PageWrapper } from '@/components/Page';
import { BasicTree } from '@/components/Tree';
import { chartTreeData } from './relate.data';
import CrossModel from '@/views/dataWarehousePlanning/physicalModel/modelDetail/modelRelationship/crossModel.vue';
import { useModal } from '@/components/Modal';
import { ref } from 'vue';
// 模态框
const [crossModal, { openModal }] = useModal();
let modelLevel = ref('1');
function handleSelect(key) {
if (key[0] !== null && key[0] !== undefined) {
modelLevel.value = key[0];
} else {
modelLevel.value = '0';
}
}
function handleAdd() {
openModal(true);
}
// const options = [
// {
// label: '全部实体',
// value: '1',
// },
// {
// label: '当前模型实体',
// value: '当前模型实体',
// },
// ];
</script>
<style scoped>
.erchart-img {
height: calc(100vh - 200px);
}
</style>
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