Skip to content

B
bigDataSystem
Commit 6e1026bc authored by hubaoshan's avatar hubaoshan
Browse files
Options

商城管理-资源管理

parent 9e792693
Show whitespace changes
Inline Side-by-side
Showing with 635 additions and 29 deletions
src/router/routes/index.ts
View file @ 6e1026bc
...@@ -955,7 +955,7 @@ export const ResourceRoute: AppRouteRecordRaw = { ...@@ -955,7 +955,7 @@ export const ResourceRoute: AppRouteRecordRaw = {
children: [ children: [
{ {
path: 'dataSharingAndExchange/resourceManagement/detail', path: 'dataSharingAndExchange/resourceManagement/detail',
name: 'detail', name: 'detail123',
component: () => import('@/views/dataSharingAndExchange/resourceManagement/detail/index.vue'), component: () => import('@/views/dataSharingAndExchange/resourceManagement/detail/index.vue'),
}, },
], ],
......
src/views/dataSharingAndExchange/resourceManagement/detail/index.vue
View file @ 6e1026bc
<template>
<PageWrapper :title="modelName" contentBackground headerSticky>
<template #extra>
<a-button type="primary" v-if="!editFlag" @click="handleDownload">下载</a-button>
<a-button type="primary" v-if="!editFlag" @click="handleEdit">编辑</a-button>
</template>
<BasicForm @register="registerForm">
<template #table1="{ model, field }">
<div style="margin-top: 15px; font-weight: bold">表信息</div>
</template>
<template #dataBase="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<Select v-else v-model:value="model[field]" allowClear style="width: 300px">
<Select.Option value="测试类型">测试类型</Select.Option>
<Select.Option value="测试类型1">测试类型1</Select.Option>
</Select>
</template>
<template #libraryName="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<a-input v-else v-model:value="model[field]" style="width: 300px" />
</template>
<template #tableName="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<a-input v-else v-model:value="model[field]" style="width: 300px" />
</template>
<template #tableType="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<Select v-else v-model:value="model[field]" allowClear style="width: 300px">
<Select.Option value="1">DB2表</Select.Option>
<Select.Option value="2">MySQL表</Select.Option>
<Select.Option value="2">Inceptor表</Select.Option>
</Select>
</template>
<template #tableExplain="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<a-input v-else v-model:value="model[field]" style="width: 300px" />
</template>
<template #storeType="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<Select v-else v-model:value="model[field]" allowClear style="width: 300px">
<Select.Option value="1">测试类型</Select.Option>
<Select.Option value="2">测试类型1</Select.Option>
</Select>
</template>
<template #isTransaction="{ model, field }">
<span v-if="!editFlag">{{ model[field] ? '否' : '是' }}</span>
<Select v-else v-model:value="model[field]" allowClear style="width: 300px">
<Select.Option value="1">是</Select.Option>
<Select.Option value="0">否</Select.Option>
</Select>
</template>
<template #table2="{ model, field }">
<div style="margin-top: 15px; font-weight: bold">管理元数据</div>
</template>
<template #mainDept="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<a-input v-else v-model:value="model[field]" style="width: 300px" />
</template>
<template #isEncrypt="{ model, field }">
<span v-if="!editFlag">{{ model[field] ? '否' : '是' }}</span>
<Select v-else v-model:value="model[field]" allowClear style="width: 300px">
<Select.Option value="1">是</Select.Option>
<Select.Option value="0">否</Select.Option>
</Select>
</template>
<template #table3="{ model, field }">
<div style="margin-top: 15px; font-weight: bold">业务元数据</div>
</template>
<template #taskName="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<a-input v-else v-model:value="model[field]" style="width: 300px" />
</template>
<template #chineseName="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<a-input v-else v-model:value="model[field]" style="width: 300px" />
</template>
<template #isSensitive="{ model, field }">
<span v-if="!editFlag">{{ model[field] ? '否' : '是' }}</span>
<Select v-else v-model:value="model[field]" allowClear style="width: 300px">
<Select.Option value="1">是</Select.Option>
<Select.Option value="0">否</Select.Option>
</Select>
</template>
</BasicForm>
<template #footer>
<div v-if="versionFlag" style="background-color: #eaedf7; padding: 8px 20px; display: flex">
<div style="flex: 1">
<span>选择版本：</span>
<Select :options="options" style="width: 200px" v-model:value="version" />
</div>
<div>
<a-button type="primary" @click="handleBack"><RollbackOutlined />回退至该版本</a-button>
<a-button type="primary" style="margin-left: 20px" danger @click="handleExitLook"
>退出查看</a-button
>
</div>
</div>
<Tabs v-model:activeKey="tabsKey">
<Tabs.TabPane key="1" tab="基本信息">
<BasicForm @register="registerForm">
<template #table1="{ model, field }">
<div style="margin-top: 15px; font-weight: bold">表信息</div>
</template>
<template #dataBase="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<Select v-else v-model:value="model[field]" allowClear style="width: 300px">
<Select.Option value="测试类型">测试类型</Select.Option>
<Select.Option value="测试类型1">测试类型1</Select.Option>
</Select>
</template>
<template #libraryName="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<a-input v-else v-model:value="model[field]" style="width: 300px" />
</template>
<template #tableName="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<a-input v-else v-model:value="model[field]" style="width: 300px" />
</template>
<template #tableType="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<Select v-else v-model:value="model[field]" allowClear style="width: 300px">
<Select.Option value="1">DB2表</Select.Option>
<Select.Option value="2">MySQL表</Select.Option>
<Select.Option value="2">Inceptor表</Select.Option>
</Select>
</template>
<template #tableExplain="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<a-input v-else v-model:value="model[field]" style="width: 300px" />
</template>
<template #storeType="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<Select v-else v-model:value="model[field]" allowClear style="width: 300px">
<Select.Option value="1">测试类型</Select.Option>
<Select.Option value="2">测试类型1</Select.Option>
</Select>
</template>
<template #isTransaction="{ model, field }">
<span v-if="!editFlag">{{ model[field] ? '否' : '是' }}</span>
<Select v-else v-model:value="model[field]" allowClear style="width: 300px">
<Select.Option value="1">是</Select.Option>
<Select.Option value="0">否</Select.Option>
</Select>
</template>
<template #table2="{ model, field }">
<div style="margin-top: 15px; font-weight: bold">管理元数据</div>
</template>
<template #mainDept="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<a-input v-else v-model:value="model[field]" style="width: 300px" />
</template>
<template #isEncrypt="{ model, field }">
<span v-if="!editFlag">{{ model[field] ? '否' : '是' }}</span>
<Select v-else v-model:value="model[field]" allowClear style="width: 300px">
<Select.Option value="1">是</Select.Option>
<Select.Option value="0">否</Select.Option>
</Select>
</template>
<template #table3="{ model, field }">
<div style="margin-top: 15px; font-weight: bold">业务元数据</div>
</template>
<template #taskName="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<a-input v-else v-model:value="model[field]" style="width: 300px" />
</template>
<template #chineseName="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<a-input v-else v-model:value="model[field]" style="width: 300px" />
</template>
<template #isSensitive="{ model, field }">
<span v-if="!editFlag">{{ model[field] ? '否' : '是' }}</span>
<Select v-else v-model:value="model[field]" allowClear style="width: 300px">
<Select.Option value="1">是</Select.Option>
<Select.Option value="0">否</Select.Option>
</Select>
</template>
</BasicForm>
<div
v-if="!info"
style="width: 100%; height: 200px; text-align: center; padding-top: 80px"
>
<span>该逻辑模型未发布版本暂无内容</span>
</div>
</Tabs.TabPane>
<Tabs.TabPane key="2" tab="详细信息">
<div>
<div style="margin-top: 15px; font-weight: bold">列信息</div>
<DetailInfo @add-field="addField" v-if="editFlag" />
<BasicTable v-else @register="registerTable" :searchInfo="searchInfo" />
<BasicForm @register="registerForm1">
<template #table3="{ model, field }">
<div style="margin-top: 15px; font-weight: bold">分区信息</div>
</template>
<template #areaType="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<Select v-else v-model:value="model[field]" allowClear style="width: 300px">
<Select.Option value="测试类型">测试类型</Select.Option>
<Select.Option value="测试类型1">测试类型1</Select.Option>
</Select>
</template>
<template #areaField="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<Select v-else v-model:value="model[field]" allowClear style="width: 300px">
<Select.Option value="测试类型">测试类型</Select.Option>
<Select.Option value="测试类型1">测试类型1</Select.Option>
</Select>
</template>
<template #table4="{ model, field }">
<div style="margin-top: 15px; font-weight: bold">分区信息</div>
</template>
<template #sonName="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<a-input v-else v-model:value="model[field]" style="width: 300px" />
</template>
<template #sonPK="{ model, field }">
<span v-if="!editFlag">{{ model[field] }}</span>
<Select v-else v-model:value="model[field]" allowClear style="width: 300px">
<Select.Option value="测试类型">测试类型</Select.Option>
<Select.Option value="测试类型1">测试类型1</Select.Option>
</Select>
</template>
</BasicForm>
</div>
</Tabs.TabPane>
<Tabs.TabPane key="3" tab="模型关系">
<ModelRelationship :edit-flag="editFlag" />
</Tabs.TabPane>
<Tabs.TabPane key="4" v-if="!editFlag" tab="模型关联">
<SourceData style="margin-top: 20px" />
<LogicalModel style="margin-top: 20px" />
<SqlDevelop style="margin-top: 40px" />
</Tabs.TabPane>
</Tabs>
</template>
<ModelDebug @register="registerDebugModal" />
<ModelCreateTable :is-publish="isPublish" @register="registerCreateModal" />
<VersionModel @register="registerVersionModal" @set-version-flag="setVersionFlag" />
<FailModal @register="registerFailModal" />
<ModelPublishTable @register="registerPublishModal" />
<ModelPublishTable @register="registerPublishModal" />
</PageWrapper>
</template>
<script lang="ts" setup>
import { reactive, onMounted, ref, nextTick, computed, unref } from 'vue';
import { PageWrapper } from '@/components/Page';
import { useRoute, onBeforeRouteLeave, useRouter } from 'vue-router';
import { useFilterStore } from '@/store/modules/filterData';
import { Descriptions, Select, Tabs, Menu, MenuItem, Dropdown } 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
} from '@/views/dataWarehousePlanning/physicalModel/modelDetail/model.data';
import { cloneDeep } from 'lodash-es';
import ImportModal from '@/views/dataWarehousePlanning/physicalModel/importModal.vue';
import ModelAdd from '@/views/dataWarehousePlanning/physicalModel/modelAdd.vue';
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/resourceManagement/institution.data.ts';
import editFormSchema from '@/views/dataSharingAndExchange/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 ModelRelationship from '@/views/dataWarehousePlanning/physicalModel/modelDetail/modelRelationship/modelRelationship.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { RollbackOutlined } from '@ant-design/icons-vue';
import FailModal from '@/views/dataWarehousePlanning/physicalModel/modelDetail/failModal.vue';
const [registerModal, { openModal }] = useModal();
const [registerDebugModal, { openModal: openDebugModal }] = useModal();
const [registerCreateModal, { openModal: openCreateModal }] = useModal();
const [registerVersionModal, { openModal: openVersionModal }] = useModal();
const [registerPublishModal, { openModal: openPublishModal }] = useModal();
const [registerFailModal, { openModal: openFailModal }] = useModal();
const { createMessage, createConfirm } = useMessage();
defineOptions({ name: 'AccountManagement' });
const tableRefresh = ref(true);
const filterStore = useFilterStore();
const route = useRoute();
const searchInfo = reactive<Recordable>({});
const modelName = route.query.modelName;
const editStatus = route.query.editStatus;
const { push } = useRouter();
// 是否为历史版本查看
let versionFlag = ref(false);
let version = ref('V1.0 2023-06-15 15:34:40');
const options = reactive([
{
label: 'V1.0 2023-06-15 15:34:40',
value: 'V1.0 2023-06-15 15:34:40',
},
]);
/**
* 属性定义
*/
const tabsKey = ref('1');
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 },
schemas: editFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
const [registerForm1, { getFieldsValue }] = useForm({
labelWidth: 108,
baseColProps: { lg: 12, md: 24 },
schemas: ConnectionModelFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
const [
registerTable,
{
reload,
updateTableDataRecord,
setTableData,
getDataSource,
getSearchInfo,
getForm,
getRowSelection,
},
] = useTable({
title: '',
scroll: { y: 200 },
api: async (params) => {
console.log('params:', params);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: 0,
code: '',
message: '',
data: [],
};
return { ...response };
},
rowKey: 'businessId',
columns: columnsDetail,
rowSelection: true,
formConfig: {
labelWidth: 100,
schemas: searchFormSchema,
showActionButtonGroup: false,
autoSubmitOnEnter: true,
},
useSearchForm: true,
showTableSetting: false,
bordered: true,
actionColumn: {
width: 150,
title: '操作',
dataIndex: 'action',
},
});
// 模态框点击查看版本
function setVersionFlag(flag) {
versionFlag.value = flag;
if (tabsKey.value === '3') {
tabsKey.value = '2';
}
}
// 回退
function handleBack() {}
// 退出查看
function handleExitLook() {
setVersionFlag(false);
}
/**
* 导出
*/
function handleNewEdit() {
console.log('导出');
}
/**
* 导出
*/
function handleNewVersion() {
console.log('导出');
}
/** 调试*/
function handleDebug() {
openDebugModal(true, {
isUpdate: false,
});
}
/** 自动建表*/
function handleCreateTable() {
if (modelName === 'dw_prd_oontract_quot_h_s') {
openPublishModal(true, {
isUpdate: false,
});
} else {
openCreateModal(true, {
isUpdate: false,
});
}
}
/** 模型关系*/
function handleRelate() {
push({
path: '/dataWarehousePlanning/physicalModel/relate',
});
}
/** 资产关系图谱*/
function handleAsset() {
push({
path: '/dataWarehousePlanning/physicalModel/assetRelate',
});
}
/** 设为待发布*/
function handleWaitPub() {
iswaitPub.value = !iswaitPub.value;
}
/** 发布*/
function handlePublish() {
console.log('editStatus', editStatus);
if (editStatus === '编辑中') {
openFailModal(true);
} else {
push({
path: '/dataWarehousePlanning/physicalModel/upload',
});
}
}
/** 下载*/
function handleDownload() {
openVersionModal(true, {
isUpdate: false,
});
}
/** 删除*/
function handleDelete() {
createConfirm({
iconType: 'warning',
title: '确认删除',
content: '确认删除这条数据吗？',
onOk() {
createMessage.success('删除成功!');
},
});
}
/**
* 编辑
*/
function handleEdit() {
editFlag.value = true;
tableRefresh.value = false;
nextTick(() => {
tableRefresh.value = true;
});
console.log('被调用', editFlag);
}
/**
* 保存
*/
function handleSave() {
editFlag.value = false;
tabsKey.value = '1';
}
/**
* 取消
*/
function handleCancel() {
editFlag.value = false;
}
onMounted(() => {
setFieldsValue({ ...infoData });
const path = route.path;
if (filterStore.getSearchParams[path]) {
if (JSON.parse(String(filterStore.getSearchParams[path] !== {}))) {
const params = JSON.parse(filterStore.getSearchParams[path]);
searchInfo.institutionId = params.institutionId;
}
}
});
onBeforeRouteLeave((to, from, next) => {
next(); // 允许导航
});
</script>
<style scoped lang="scss"></style>
src/views/dataSharingAndExchange/resourceManagement/index.vue
View file @ 6e1026bc
<template> <template>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex"> <PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<!-- <DeptTree class="w-1/4 xl:w-1/5" @select="handleSelect" class="w-3/4 xl:w-4/5" />-->
<BasicTable @register="registerTable" :searchInfo="searchInfo"> <BasicTable @register="registerTable" :searchInfo="searchInfo">
<template #toolbar> <template #toolbar>
</template> </template>
<template #name="{ text, record }">
<a @click="showDetails(record)"> {{ text }}</a>
</template>
<template #bodyCell="{ column, record }"> <template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'"> <template v-if="column.key === 'action'">
<TableAction <TableAction
:actions="[ :actions="[
// 详情按钮 // 详情按钮
{ {
// icon: 'clarity:note-edit-line', icon: 'clarity:note-edit-line',
label: '详情', label: '详情',
onClick: handleDetails.bind(null, record), onClick: handleDetails.bind(null, record),
}, },
// {
// // icon: 'clarity:note-edit-line',
// label: '新建',
// onClick: handleAdd.bind(null, record),
// },
// {
// // icon: 'clarity:note-edit-line',
// label: '编辑',
// onClick: handleEdit.bind(null, record),
// },
// {
// color: 'error',
// label: '删除',
// popConfirm: {
// title: '是否确认删除',
// placement: 'left',
// confirm: handleDelete.bind(null, record),
// },
// },
// {
// label: '移动',
// onClick: handleMove.bind(null, record),
// },
]" ]"
/> />
</template> </template>
...@@ -177,11 +150,14 @@ ...@@ -177,11 +150,14 @@
}); });
}/** 详情按钮*/ }/** 详情按钮*/
function handleDetails(record: Recordable) { function handleDetails(record: Recordable) {
push({ push({
path: '/dataSharingAndExchange/resourceManagement/detail', path: '/dataSharingAndExchange/resourceManagement/detail',
// path: '/dataSharingAndExchange/resourceManagement/detail/index',
// path: '/dataWarehousePlanning/physicalModel/detail', // path: '/dataWarehousePlanning/physicalModel/detail',
query: record, query: record,
}); });
console.log('path',record)
} }
......
src/views/dataSharingAndExchange/resourceManagement/institution.data.ts
View file @ 6e1026bc
...@@ -232,3 +232,118 @@ export const AddTreeSchema: any[] = [ ...@@ -232,3 +232,118 @@ export const AddTreeSchema: any[] = [
// }, // },
] ]
export const editFormSchema: any[] = [
{
field: 'table1',
slot: 'table1',
colProps: { lg: 24, md: 24 },
},
{
field: 'dataBase',
label: '数据源：',
slot: 'dataBase',
colProps: { lg: 12, md: 12 },
},
{
field: 'libraryName',
label: '库名：',
slot: 'libraryName',
component: 'Input',
colProps: { lg: 12, md: 12 },
required: true,
},
{
field: 'tableName',
label: '表名：',
slot: 'tableName',
component: 'Input',
colProps: { lg: 12, md: 12 },
required: true,
},
{
field: 'tableType',
label: '表类型：',
slot: 'tableType',
component: 'Select',
colProps: { lg: 12, md: 12 },
},
{
field: 'tableExplain',
label: '表注释：',
slot: 'tableExplain',
component: 'Select',
colProps: { lg: 12, md: 12 },
},
{
field: 'storeType',
label: '存储类型：',
slot: 'storeType',
component: 'Select',
colProps: { lg: 12, md: 12 },
required: true,
},
{
field: 'isTransaction',
label: '是否为事务表：',
slot: 'isTransaction',
component: 'Select',
colProps: { lg: 12, md: 12 },
},
{
field: 'table2',
slot: 'table2',
colProps: { lg: 24, md: 24 },
},
{
field: 'mainDept',
label: '主责部门：',
slot: 'mainDept',
component: 'Input',
colProps: { lg: 12, md: 12 },
},
{
field: 'isEncrypt',
label: '是否为事务表：',
slot: 'isEncrypt',
component: 'RadioGroup',
componentProps: {
options: [
{ label: '是', value: '是' },
{ label: '否', value: '否' },
],
},
colProps: { lg: 12, md: 12 },
},
{
field: 'table3',
slot: 'table3',
colProps: { lg: 24, md: 24 },
},
{
field: 'taskName',
label: '业务定义：',
slot: 'taskName',
component: 'Input',
colProps: { lg: 12, md: 12 },
},
{
field: 'chineseName',
label: '表中文名：',
slot: 'chineseName',
component: 'Input',
colProps: { lg: 12, md: 12 },
},
{
field: 'isSensitive',
label: '是否为敏感信息：',
slot: 'isSensitive',
component: 'RadioGroup',
componentProps: {
options: [
{ label: '是', value: '是' },
{ label: '否', value: '否' },
],
},
colProps: { lg: 12, md: 12 },
},
];
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