Commit e1d83978 authored by 曹泽华's avatar 曹泽华

数仓规划 物理模型

parent 7558ca0c
......@@ -193,7 +193,10 @@ export const DataWarehousePlanningRoute: AppRouteRecordRaw = {
{
path: 'logicalModel/version-comparison',
name: 'logicalVersionComparisonModel',
component: () => import('@/views/dataWarehousePlanning/logicalModel/modelDetail/versionComparison/index.vue'),
component: () =>
import(
'@/views/dataWarehousePlanning/logicalModel/modelDetail/versionComparison/index.vue'
),
meta: {
title: '版本对比',
icon: '',
......@@ -225,7 +228,7 @@ export const DataWarehousephysicalModelRoute: AppRouteRecordRaw = {
children: [
{
path: 'physicalModel/detail',
name: 'physicalModel',
name: 'physicalModelDetail',
component: () => import('@/views/dataWarehousePlanning/physicalModel/modelDetail/index.vue'),
meta: {
title: '物理模型详情',
......
<template>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<ModelTree class="w-1/4 xl:w-1/5" @select="handleSelect" />
<BasicTable @register="registerTable" class="w-3/4 xl:w-4/5" :searchInfo="searchInfo">
<BasicTable
v-if="tableFlush"
@register="registerTable"
class="w-3/4 xl:w-4/5"
:searchInfo="searchInfo"
>
<template #toolbar>
<a-button type="primary">导出</a-button>
<a-button type="primary">建表记录</a-button>
<a-button type="primary" :disabled="getRowSelection().selectedRowKeys <=0">批量建表</a-button>
<a-button type="primary" :disabled="getRowSelection().selectedRowKeys <=0">设为待发布</a-button>
<a-button type="primary" :disabled="getRowSelection().selectedRowKeys <=0">发布</a-button>
<a-button type="primary">从元数据导入</a-button>
<a-button type="primary" :disabled="getRowSelection().selectedRowKeys <=0">导出</a-button>
<a-button type="primary" @click="handleImport">导入</a-button>
<a-button type="primary" @click="handleCreateFolder">新建文件夹</a-button>
<a-button type="primary" @click="handleCreateFile">新建文件</a-button>
<div class="button-group">
<a-button
v-for="(button, index) in buttons"
:key="index"
:class="['btn', { active: selectedButton === button.label }]"
@click="selectButton(button.label)"
>
{{ button.label }}
</a-button>
</div>
<a-button type="primary" :disabled="getRowSelection().selectedRowKeys <=0" @click="handleDelete">删除</a-button>
<RadioButtonGroup
@change="changeTable"
:options="labelName"
@click="changeTable()"
v-model:value="state"
/>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
// icon: 'clarity:note-edit-line',
label: '编辑',
icon: 'clarity:note-edit-line',
onClick: handleEdit.bind(null, record),
},
{
label: '移动',
onClick: handleMove.bind(null, record),
icon: 'ion:ellipsis-horizontal-outline',
popConfirm: {
okText: '上移',
cancelText: '下移',
placement: 'bottom',
confirm: handleUp.bind(null, record),
cancel: handleDown.bind(null, record),
},
},
]"
/>
......@@ -41,12 +53,12 @@
</BasicTable>
<ModelModal @register="registerModal" @success="handleSuccess" />
<ImportModal @register="registerImport" @success="handleImportSuccess" />
<ModelAdd @register="registerModalAdd" @success="handleImportSuccess" />
<ImportModal @register="registerImport" />
<ModelAdd @register="registerModalAdd" />
</PageWrapper>
</template>
<script lang="ts" setup>
import { reactive, unref, onDeactivated, onMounted, ref } from 'vue';
import { reactive, unref, onDeactivated, onMounted, ref, nextTick } from 'vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { getAccountList, deleteUser, exportUserList } from '@/api/system/user/user';
import { PageWrapper } from '@/components/Page';
......@@ -55,24 +67,23 @@
import ModelModal from './modelModal.vue';
import ImportModal from './importModal.vue';
import ModelAdd from './modelAdd.vue';
import { columns, searchFormSchema } from './model.data';
import { columnsData, columnsSystem, searchFormSchema } from './model.data';
import { useGo } from '@/hooks/web/usePage';
import { useRoute, onBeforeRouteLeave, useRouter } from 'vue-router';
import { useFilterStore } from '@/store/modules/filterData';
import { modelData, TreeData } from '@/views/dataWarehousePlanning/physicalModel/modelData';
import { TreeData, TreeSystem } from '@/views/dataWarehousePlanning/physicalModel/modelData';
import ModelTree from '@/views/dataWarehousePlanning/physicalModel/ModelTree.vue';
import RadioButtonGroup from '@/components/Form/src/components/RadioButtonGroup.vue';
const { push } = useRouter();
const state = ref('系统视图');
const labelName = ['数据视图', '系统视图'];
defineOptions({ name: 'AccountManagement' });
const { createMessage } = useMessage();
const filterStore = useFilterStore();
const route = useRoute();
const go = useGo();
const buttons = reactive([{ label: '数据视图' }, { label: '系统视图' }]);
const handleButtonClick = (button) => {
console.log(`${button.label} 按钮被点击`);
};
const tableFlush = ref(true);
const [registerModal, { openModal }] = useModal();
const [registerImport, { openModal: openImportModal }] = useModal();
const [registerModalAdd, { openModal: openModalAdd }] = useModal();
......@@ -81,7 +92,15 @@
const tableData = ref([]);
const [
registerTable,
{ reload, updateTableDataRecord, getSearchInfo, getForm, getRowSelection },
{
reload,
updateTableDataRecord,
setTableData,
setColumns,
getSearchInfo,
getForm,
getRowSelection,
},
] = useTable({
title: '',
api: async (params) => {
......@@ -90,20 +109,20 @@
pageNu: '1',
pageSize: '10',
pages: '1',
total: tableData.value.length,
total: TreeSystem.length,
code: '',
message: '',
data: [],
data: TreeSystem,
};
//过滤data中的数据,取出等于params.deptId的数据
var data = [];
//按照部门筛选 如果有进行过滤相应部门的 没有就赋值全部
var data = [];
data = tableData.value.filter((item) => item.businessId !== 100);
data = TreeSystem.filter((item) => item.businessId !== 100);
return { ...response, data: data };
},
rowKey: 'businessId',
columns,
columns: columnsSystem,
rowSelection: true,
formConfig: {
labelWidth: 100,
......@@ -125,7 +144,15 @@
dataIndex: 'action',
},
});
function changeTable() {
if (state.value === '系统视图') {
setColumns(columnsSystem);
setTableData(TreeSystem.filter((item) => item.businessId !== 100));
} else {
setColumns(columnsData);
setTableData(TreeData.filter((item) => item.businessId !== 100));
}
}
/** 进入编辑逻辑模型 */
function goEdit(record) {
console.log('record:', record);
......@@ -135,13 +162,6 @@
});
}
/** 新增元模型*/
function handleCreateModel() {
openModal(true, {
isUpdate: false,
});
}
/** 新建文件夹*/
function handleCreateFolder() {
openModalAdd(true, {
......@@ -161,6 +181,7 @@
openImportModal(true, {
isUpdate: false,
});
console.log('st', state);
}
/** 部门树的select*/
......@@ -171,12 +192,14 @@
/** 移动按钮*/
function handleMove(record: Recordable) {
openMoveUserModal(true, {
record,
isMove: true,
});
createMessage.success('删除成功!');
}
function handleUp() {
createMessage.success('上移成功!');
}
function handleDown() {
createMessage.success('下移成功!');
}
/** 编辑按钮*/
function handleEdit(record: Recordable) {
openModal(true, {
......@@ -254,22 +277,4 @@
next(); // 允许导航
});
</script>
<style>
.button-group {
margin-top: 10px;
display: flex;
gap: 10px;
}
button {
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
border: 1px solid #ccc;
border-radius: 5px;
}
button:hover {
background-color: #f0f0f0;
}
</style>
<style scoped lang="scss"></style>
import { BasicColumn, FormSchema } from '@/components/Table';
export const columns: BasicColumn[] = [
export const columnsSystem: BasicColumn[] = [
{
title: '名称',
dataIndex: 'modelName',
......@@ -51,6 +51,33 @@ export const columns: BasicColumn[] = [
// onEditRow:true
},
];
export const columnsData: BasicColumn[] = [
{
title: '名称',
dataIndex: 'modelName',
width: 150,
// onEditRow:true
slots: { customRender: 'sourceType' },
},
{
title: '库名',
dataIndex: 'storeName',
width: 150,
// onEditRow:true
},
{
title: '表名',
dataIndex: 'tableName',
width: 150,
// onEditRow:true
},
{
title: '表注释',
dataIndex: 'tableExplain',
width: 150,
// onEditRow:true
},
];
export const columnsDetail: BasicColumn[] = [
{
......@@ -58,7 +85,6 @@ export const columnsDetail: BasicColumn[] = [
dataIndex: 'name',
width: 150,
// onEditRow:true
slots: { customRender: 'sourceType' },
},
{
title: '字段类型',
......
export const TreeData: any[] = [
export const TreeSystem: any[] = [
{
delFlag: '0',
flag: '1',
......@@ -82,103 +82,80 @@ export const TreeData: any[] = [
},
];
export const modelData: any[] = [
export const TreeData: any[] = [
{
delFlag: '0',
flag: '1',
businessId: 309,
username: 'yonghu1',
nickName: '测试用户1',
userType: '1',
name: '测试用户1',
businessId: 100,
modelName: '物理模型',
parentId: 0,
'code:': '001',
ancestors: '0',
orderNum: 0,
holder: 'admin',
createDate: '2024-10-24 10:04:04',
institutionId: 105,
institutionName: '财务部门',
code: '123f',
identity: '1',
roleIds: null,
roleNames: '三级用户',
roleList: null,
menuList: [],
},
{
delFlag: '0',
flag: '1',
businessId: 310,
username: 'yonghu2',
nickName: '测试用户2',
userType: '1',
name: '测试用户2',
createDate: '2024-10-25 10:05:05',
sex: '0',
institutionId: 105,
institutionName: '财务部门',
code: '123a',
identity: '1',
roleIds: null,
roleNames: null,
roleList: null,
menuList: [],
updateDate: '2024-10-24 10:04:04',
// "children" : [ ],
selectType: null,
},
{
delFlag: '0',
flag: '1',
businessId: 317,
username: 'yonghu3',
nickName: '测试用户3',
userType: '1',
name: '测试用户3',
createDate: '2024-10-26 10:06:06',
sex: '1',
institutionId: 102,
institutionName: '研发部门',
code: '123c',
identity: '1',
roleIds: null,
roleNames: '超级管理员',
roleList: null,
menuList: [],
businessId: 101,
modelName: 'dw_prd_contract_f',
storeName: 'dw_data',
tableName: 'dw_prd_contract_f',
tableExplain: 'dw_合约',
parentId: 100,
'code:': '002',
ancestors: '0,100',
orderNum: 1,
// "children" : [ ],
selectType: null,
holder: 'admin',
createDate: '2024-10-24 10:04:04',
updateDate: '2024-10-24 10:04:04',
},
{
delFlag: '0',
flag: '1',
businessId: 318,
username: 'yonghu4',
nickName: '测试用户4',
userType: '1',
name: '测试用户4',
createDate: '2024-10-26 10:06:06',
sex: '1',
institutionId: 102,
institutionName: '研发部门',
code: '123b',
identity: '1',
roleIds: null,
roleNames: '超级管理员',
roleList: null,
menuList: [],
businessId: 102,
modelName: 'dw_prd_oontract_quot_h_s',
storeName: 'dw_data',
tableName: 'dw_prd_oontract_quot_h_s',
tableExplain: 'dw_产品合约行情历史',
parentId: 100,
'code:': '002',
ancestors: '0,100',
orderNum: 1,
// "children" : [ ],
selectType: null,
holder: 'admin',
createDate: '2024-10-24 10:04:04',
updateDate: '2024-10-24 10:04:04',
},
{
delFlag: '0',
flag: '1',
businessId: 319,
username: 'yonghu5',
nickName: '测试用户5',
userType: '1',
name: '测试用户5',
createDate: '2024-10-26 10:06:06',
sex: '1',
institutionId: 102,
institutionName: '研发部门',
code: '123x',
identity: '1',
roleIds: null,
roleNames: '超级管理员',
roleList: null,
menuList: [],
businessId: 103,
modelName: 'tmp_dw_prd_contractf_our',
storeName: 'dw_data',
tableName: 'tmp_dw_prd_contractf_our',
tableExplain: '-',
parentId: 100,
'code:': '002',
ancestors: '0,100',
orderNum: 1,
// "children" : [ ],
selectType: null,
holder: 'admin',
createDate: '2024-10-24 10:04:04',
updateDate: '2024-10-24 10:04:04',
},
];
export const editTableData: any[] = [
{
businessId: 1,
......
......@@ -2,8 +2,8 @@
<div style="display: flex">
<div style="border-color: cyan; width: 30%">
<div style="display: flex; margin-top: 15px">
<span>字段列表</span>
<a-button type="primary" style="margin-left: 330px">添加字段</a-button>
<div>字段列表</div>
<a-button type="primary" style="margin-left: 300px">添加字段</a-button>
</div>
<BasicTable @register="registerTable" :searchInfo="searchInfo">
<template #bodyCell="{ column, record }">
......@@ -30,14 +30,13 @@
import { BasicForm, useForm } from '@/components/Form';
import { ConnectionModelFormSchema, EntityModelFormSchema } from './model.data';
import CardList from '@/components/CardList/src/CardList.vue';
import BasicTable from '@/components/Table/src/BasicTable.vue';
import { TableAction, useTable } from '@/components/Table';
import { BasicTable, TableAction, useTable } from '@/components/Table';
import {
columns,
searchFormSchema,
} from '@/views/dataWarehousePlanning/physicalModel/modelDetail/modelData.ts';
defineOptions({ name: 'ModelModal' });
defineOptions({ name: 'DetailInfo' });
const isUpdate = ref(false);
const isMove = ref(false);
......@@ -129,7 +128,7 @@
}
</script>
<style scoped lang="scss">
.ant-divider-with-text-left::after {
display: none;
}
//.ant-divider-with-text-left::after {
// display: none;
//}
</style>
<template>
<PageWrapper :title="modelName" contentBackground headerSticky>
<template #extra>
<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="handleExport">导出</a-button>
<a-button type="primary" v-if="!editFlag" @click="handleEdit">编辑</a-button>
......@@ -149,10 +150,15 @@
</BasicForm>
</div>
</Tabs.TabPane>
<Tabs.TabPane key="3" tab="模型关联">
<SourceData style="margin-top: 20px" />
<LogicalModel style="margin-top: 20px" />
<SqlDevelop style="margin-top: 40px" />
</Tabs.TabPane>
</Tabs>
</template>
</PageWrapper>
<ModelDebug @register="registerDebugModal" @success="handleImportSuccess" />
<ModelDebug @register="registerDebugModal" />
</template>
<script lang="ts" setup>
import { reactive, onMounted, ref, nextTick, computed, unref } from 'vue';
......@@ -161,13 +167,16 @@
import { useFilterStore } from '@/store/modules/filterData';
import { Descriptions, Select, Tabs } from 'ant-design-vue';
import DetailInfo from './detailInfo.vue';
import SourceData from './sourceData.vue';
import {
entityData,
infoData,
searchFormSchema,
} from '@/views/dataWarehousePlanning/physicalModel/modelDetail/modelData';
import { FormSchema, useForm } from '@/components/Form';
import { useModal } from '@/components/Modal';
import ModelDebug from './modelDebug.vue';
import LogicalModel from './logicalModel.vue';
import BasicForm from '@/components/Form/src/BasicForm.vue';
import {
ConnectionModelFormSchema,
......@@ -176,9 +185,10 @@
import { cloneDeep } from 'lodash-es';
import ImportModal from '@/views/dataWarehousePlanning/physicalModel/importModal.vue';
import ModelAdd from '@/views/dataWarehousePlanning/physicalModel/modelAdd.vue';
import BasicTable from '@/components/Table/src/BasicTable.vue';
import { TableAction, useTable } from '@/components/Table';
import { columns, columnsDetail } from '@/views/dataWarehousePlanning/physicalModel/model.data';
import { BasicTable, TableAction, useTable } from '@/components/Table';
import { columnsDetail } from '@/views/dataWarehousePlanning/physicalModel/model.data';
import CrossTable from '@/views/dataWarehousePlanning/logicalModel/modelDetail/crossTable.vue';
import SqlDevelop from '@/views/dataWarehousePlanning/physicalModel/modelDetail/sqlDevelop.vue';
const [registerModal, { openModal }] = useModal();
const [registerDebugModal, { openModal: openDebugModal }] = useModal();
......@@ -206,10 +216,6 @@
const [
registerForm1,
{
setFieldsValue: setValue,
updateSchema: updateValue,
resetFields: resetValue,
validate: validdate1,
},
] = useForm({
labelWidth: 108,
......@@ -232,36 +238,25 @@
pageNu: '1',
pageSize: '10',
pages: '1',
total: tableData.value.length,
total: 0,
code: '',
message: '',
data: [],
};
//过滤data中的数据,取出等于params.deptId的数据
var data = [];
//按照部门筛选 如果有进行过滤相应部门的 没有就赋值全部
var data = [];
data = tableData.value.filter((item) => item.businessId !== 100);
return { ...response, data: data };
return { ...response };
},
rowKey: 'businessId',
columnsDetail,
columns: columnsDetail,
rowSelection: true,
formConfig: {
labelWidth: 100,
schemas: searchFormSchema,
showActionButtonGroup: false,
autoSubmitOnEnter: true,
resetFunc: () => {
searchInfo.modelId = '';
},
},
useSearchForm: true,
showTableSetting: false,
bordered: true,
handleSearchInfoFn(info) {
return info;
},
actionColumn: {
width: 150,
title: '操作',
......@@ -323,8 +318,4 @@
next(); // 允许导航
});
</script>
<style scoped lang="scss">
.ant-divider-with-text-left::before {
display: none;
}
</style>
<style scoped lang="scss"></style>
<template>
<div>
<BasicTable @register="registerTable" :searchInfo="searchInfo" />
</div>
</template>
<script lang="ts" setup>
import { reactive, onMounted, ref, defineProps } from 'vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { useRoute, onBeforeRouteLeave, useRouter } from 'vue-router';
import { entityColumns, entityFormSchema, locailColumns } from './model.data';
import { useFilterStore } from '@/store/modules/filterData';
import { TreeData } from '@/views/dataWarehousePlanning/logicalModel/modelData';
import {
entityData,
logcialModel,
} from '@/views/dataWarehousePlanning/logicalModel/modelDetail/modelData';
import EntityModel from './entityModel.vue';
import { useModal } from '@/components/Modal';
import { DeleteTwoTone, PlusCircleTwoTone } from '@ant-design/icons-vue';
const { push } = useRouter();
defineOptions({ name: 'AccountManagement' });
const props = defineProps({
editFlag: Boolean,
});
// 模态框
const [entityModal, { openModal }] = useModal();
// 实体新增
function handleEntityModel() {
openModal(true, {
isUpdate: false,
});
}
// 实体编辑
function handleEntityEditModel(record: Recordable) {
// 跳转到详情
push({
path: '/dataWarehousePlanning/logicalModel/entity-detail',
query: record,
});
}
function entitySuccess({ isUpdate, values }) {
if (isUpdate) {
// 注意:updateTableDataRecord要求表格的rowKey属性为string并且存在于每一行的record的keys中
//修改表单的值
const result = updateTableDataRecord(values.businessId, values);
reload();
} else {
tableData.value.push(values);
reload();
}
}
const filterStore = useFilterStore();
const route = useRoute();
const searchInfo = reactive<Recordable>({});
const tableData = ref([]);
const [
registerTable,
{ reload, updateTableDataRecord, getSearchInfo, getForm, getRowSelection },
] = useTable({
title: '逻辑模型',
// 定高
scroll: { y: 150 },
// 数据
api: async (params) => {
console.log('params:', params);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: logcialModel.length,
code: '',
message: '',
data: logcialModel,
};
return { ...response };
},
rowKey: 'businessId',
// 列
columns: locailColumns,
showIndexColumn: false,
rowSelection: false,
pagination: false,
// 搜索
formConfig: {
labelWidth: 120,
schemas: entityFormSchema,
showActionButtonGroup: false,
autoSubmitOnEnter: true,
},
useSearchForm: false,
showTableSetting: false,
bordered: true,
handleSearchInfoFn(info) {
return info;
},
});
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>
......@@ -7,33 +7,106 @@ import { changeFlagApi } from '@/api/system/user/user';
// 引入开关组件
type CheckedType = boolean | string | number;
export const entityColumns: BasicColumn[] = [
{
title: '名称',
dataIndex: 'name',
width: 150,
// onEditRow: true,
},
{
title: '实体名称',
dataIndex: 'dataBase',
width: 150,
// onEditRow: true,
},
{
title: '路径',
dataIndex: 'modelId',
width: 150,
// onEditRow: true,
},
{
title: '关联时间',
dataIndex: 'relateTime',
width: 150,
// onEditRow: true,
},
{
title: '同步时间',
dataIndex: 'syncTime',
width: 150,
},
{
title: '操作用户',
dataIndex: 'operateName',
width: 150,
},
];
export const locailColumns: BasicColumn[] = [
{
title: '名称',
dataIndex: 'name',
width: 150,
// onEditRow: true,
},
{
title: '实体描述',
dataIndex: 'txt',
title: '实体名称',
dataIndex: 'entityName',
width: 150,
// onEditRow: true,
},
{
title: '实体英文名',
dataIndex: 'engName',
title: '路径',
dataIndex: 'modelId',
width: 150,
// onEditRow: true,
},
{
title: '资产责任人',
dataIndex: 'person',
title: '关联描述',
dataIndex: 'relateDescribe',
width: 150,
// onEditRow: true,
},
{
title: '所属部门',
dataIndex: 'deptName',
title: '关联时间',
dataIndex: 'relateTime',
width: 150,
},
{
title: '操作用户',
dataIndex: 'operateName',
width: 150,
},
];
export const SqlDevelopColumns: BasicColumn[] = [
{
title: '名称',
dataIndex: 'name',
width: 150,
// onEditRow: true,
},
{
title: '路径',
dataIndex: 'modelId',
width: 150,
// onEditRow: true,
},
{
title: '关联描述',
dataIndex: 'relateDescribe',
width: 150,
// onEditRow: true,
},
{
title: '关联时间',
dataIndex: 'relateTime',
width: 150,
},
{
title: '操作用户',
dataIndex: 'operateName',
width: 150,
},
];
......
......@@ -23,7 +23,7 @@
import { TreeData } from '@/views/metaModel/knowledgeModel/modelData';
import { router } from '@/router';
defineOptions({ name: 'ModelModal' });
defineOptions({ name: 'ModelEdit' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
......
<template>
<div>
<BasicTable @register="registerTable" :searchInfo="searchInfo">
<template #toolbar>
<a-button type="text" @click="handleCrossModel" style="color: #0960BD "
><Icon icon="ion:link-outline" style="transform: rotate(-45deg)" />关联元数据</a-button
>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="
editFlag
? [
{
icon: 'clarity:contract-line',
onClick: handleEntityEditModel.bind(null, record),
},
]
: [
{
icon: 'clarity:contract-line',
onClick: handleEntityEditModel.bind(null, record),
},
]
"
/>
</template>
</template>
</BasicTable>
</div>
</template>
<script lang="ts" setup>
import { reactive, onMounted, ref, defineProps } from 'vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { useRoute, onBeforeRouteLeave, useRouter } from 'vue-router';
import { entityColumns, entityFormSchema } from './model.data';
import { useFilterStore } from '@/store/modules/filterData';
import Icon from '@/components/Icon/Icon.vue';
import { TreeData } from '@/views/dataWarehousePlanning/logicalModel/modelData';
import { entityData } from '@/views/dataWarehousePlanning/logicalModel/modelDetail/modelData';
import EntityModel from './entityModel.vue';
import { useModal } from '@/components/Modal';
const { push } = useRouter();
defineOptions({ name: 'AccountManagement' });
const props = defineProps({
editFlag: Boolean,
});
// 模态框
const [entityModal, { openModal }] = useModal();
// 实体新增
function handleEntityModel() {
openModal(true, {
isUpdate: false,
});
}
// 实体编辑
function handleEntityEditModel(record: Recordable) {
// 跳转到详情
push({
path: '/dataWarehousePlanning/logicalModel/entity-detail',
query: record,
});
}
function entitySuccess({ isUpdate, values }) {
if (isUpdate) {
// 注意:updateTableDataRecord要求表格的rowKey属性为string并且存在于每一行的record的keys中
//修改表单的值
const result = updateTableDataRecord(values.businessId, values);
reload();
} else {
tableData.value.push(values);
reload();
}
}
const filterStore = useFilterStore();
const route = useRoute();
const searchInfo = reactive<Recordable>({});
const tableData = ref([]);
const [
registerTable,
{ reload, updateTableDataRecord, getSearchInfo, getForm, getRowSelection },
] = useTable({
title: '关联元数据',
// 定高
scroll: { y: 150 },
// 数据
api: async (params) => {
console.log('params:', params);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: entityData.length,
code: '',
message: '',
data: entityData,
};
return { ...response };
},
rowKey: 'businessId',
// 列
columns: entityColumns,
showIndexColumn: false,
rowSelection: false,
// 搜索
formConfig: {
labelWidth: 120,
schemas: entityFormSchema,
showActionButtonGroup: false,
autoSubmitOnEnter: true,
},
useSearchForm: false,
showTableSetting: false,
bordered: true,
handleSearchInfoFn(info) {
return info;
},
actionColumn: {
width: 150,
title: '操作',
dataIndex: 'action',
},
});
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>
<template>
<div>
<BasicTable @register="registerTable" :searchInfo="searchInfo">
<template #toolbar>
<a-button style="color: #0960bd" type="text"><PlusOutlined />新建Sql文件</a-button>
<a-button style="color: #0960bd" type="text">批量解绑</a-button>
<a-button style="color: #0960bd" type="text" @click="handleCrossModel"
><Icon icon="ion:link-outline" style="transform: rotate(-45deg)" />关联Sql文件</a-button
>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="
editFlag
? [
{
icon: 'clarity:contract-line',
onClick: handleEntityEditModel.bind(null, record),
},
]
: [
{
icon: 'clarity:contract-line',
onClick: handleEntityEditModel.bind(null, record),
},
]
"
/>
</template>
</template>
</BasicTable>
</div>
</template>
<script lang="ts" setup>
import { reactive, onMounted, ref, defineProps } from 'vue';
import Icon from '@/components/Icon/Icon.vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { useRoute, onBeforeRouteLeave, useRouter } from 'vue-router';
import { entityColumns, entityFormSchema, SqlDevelopColumns } from './model.data';
import { useFilterStore } from '@/store/modules/filterData';
import { TreeData } from '@/views/dataWarehousePlanning/logicalModel/modelData';
import {
entityData,
sqlDevelop,
} from '@/views/dataWarehousePlanning/logicalModel/modelDetail/modelData';
import EntityModel from './entityModel.vue';
import { useModal } from '@/components/Modal';
import { DeleteTwoTone, PlusOutlined } from '@ant-design/icons-vue';
const { push } = useRouter();
defineOptions({ name: 'AccountManagement' });
const props = defineProps({
editFlag: Boolean,
});
// 模态框
const [entityModal, { openModal }] = useModal();
// 实体新增
function handleEntityModel() {
openModal(true, {
isUpdate: false,
});
}
// 实体编辑
function handleEntityEditModel(record: Recordable) {
// 跳转到详情
push({
path: '/dataWarehousePlanning/logicalModel/entity-detail',
query: record,
});
}
function entitySuccess({ isUpdate, values }) {
if (isUpdate) {
// 注意:updateTableDataRecord要求表格的rowKey属性为string并且存在于每一行的record的keys中
//修改表单的值
const result = updateTableDataRecord(values.businessId, values);
reload();
} else {
tableData.value.push(values);
reload();
}
}
const filterStore = useFilterStore();
const route = useRoute();
const searchInfo = reactive<Recordable>({});
const tableData = ref([]);
const [
registerTable,
{ reload, updateTableDataRecord, getSearchInfo, getForm, getRowSelection },
] = useTable({
title: 'Sql开发',
// 定高
scroll: { y: 150 },
// 数据
api: async (params) => {
console.log('params:', params);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: sqlDevelop.length,
code: '',
message: '',
data: sqlDevelop,
};
return { ...response };
},
rowKey: 'businessId',
// 列
columns: SqlDevelopColumns,
showIndexColumn: false,
rowSelection: true,
// 搜索
formConfig: {
labelWidth: 120,
schemas: entityFormSchema,
showActionButtonGroup: false,
autoSubmitOnEnter: true,
},
useSearchForm: false,
showTableSetting: false,
bordered: true,
handleSearchInfoFn(info) {
return info;
},
actionColumn: {
width: 150,
title: '操作',
dataIndex: 'action',
},
});
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>
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