Skip to content

B
bigDataSystem
Commit b93a6ca4 authored by chenjiahao's avatar chenjiahao
Browse files
Options

修改部分已知问题； 

新增数据整合-数据离线加载
parent 1b755d1a
Show whitespace changes
Inline Side-by-side
Showing with 2588 additions and 13 deletions
src/settings/projectSetting.ts
View file @ b93a6ca4
......@@ -34,7 +34,6 @@ const setting: ProjectConfig = {
// ROLE：前端模式（菜单路由分开）
permissionMode: PermissionModeEnum.BACK,
// 权限缓存存放位置。默认存放于localStorage
permissionCacheType: CacheTypeEnum.LOCAL,
......
src/views/dataIntegration/dataLoading/dataEntryLake/DeplysModal.vue 0 → 100644
View file @ b93a6ca4
<template>
<BasicModal
v-bind="$attrs"
@register="registerModal"
:title="getTitle"
@ok="handleSubmit"
minHeight="50"
>
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup>
import { ref, computed, unref, reactive } from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { MoveFormSchema } from './dataEntry.data';
import { useMessage } from '@/hooks/web/useMessage';
import { TreeData } from './mock';
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const isUpdate = ref(true);
const rowId = ref('');
const idList = ref([]);
const rowData = ref([]);
let isMove = ref();
//获取接口数据并放在下拉框里（这里是打开了一个弹框）
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { span: 24 },
schemas: MoveFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
console.log('data', data);
// //每次点击弹窗 需要清空存储的数据
rowData.value = [];
isMove.value = data.isMove;
// //重置表单数据
resetFields();
setModalProps({ confirmLoading: false });
// if (data.idList != null && data.idList.length > 0) {
// /* empty */
// } else {
// rowData.value.push(data.record);
// //单个移动
// rowId.value = data.record.businessId;
// data.record.taskId = data.record.businessId;
// setFieldsValue({
// ...data.record,
// });
// }
const treeList = handleTree(TreeData, 'businessId', undefined, undefined, undefined);
updateSchema([
{
field: 'taskId',
componentProps: {
treeData: treeList,
},
},
]);
console.log('treeList:', treeList);
});
const getTitle = computed(() => '移动');
/**确定按钮*/
async function handleSubmit() {
// console.log('isMove.value', isMove.value);
if (isMove.value === 1) {
createMessage.success('移动成功！');
} else {
createMessage.success('复制成功！');
}
closeModal();
}
/**数组对象转成树*/
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;
}
</script>
src/views/dataIntegration/dataLoading/dataEntryLake/GroupTree.vue 0 → 100644
View file @ b93a6ca4
<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"
/>
</div>
</template>
<script lang="ts" setup>
import { nextTick, onMounted, ref, unref } from 'vue';
import { BasicTree, TreeActionType, TreeItem } from '@/components/Tree';
import { Nullable } from '@vben/types';
import { TreeData } from './mock.ts';
import { useMessage } from '@/hooks/web/useMessage';
import { useModal } from '@/components/Modal';
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;
}
const [registerModal, { openModal }] = useModal();
async function fetch() {
treeData.value = handleTree(TreeData, '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]);
// // console.log('node', node);
// emit('select', node);
// }
/**选中的数据*/
function handleSelect(keys) {
emit('select', keys[0]);
}
onMounted(() => {
fetch();
});
</script>
src/views/dataIntegration/dataLoading/dataEntryLake/dataEntry.data.ts 0 → 100644
View file @ b93a6ca4
import { getAllRoleList } from '@/api/system/role/role';
import { BasicColumn, FormSchema } from '@/components/Table';
export const columns: BasicColumn[] = [
{
title: '名称',
dataIndex: 'name',
width: 120,
// slots: { customRender: 'name' },
},
{
title: '场景',
dataIndex: 'scene',
width: 150,
},
{
title: '权属工作组',
dataIndex: 'workgroup',
width: 120,
},
{
title: '创建时间',
dataIndex: 'createTime',
width: 150,
},
{
title: '更新时间',
dataIndex: 'updateTime',
width: 150,
},
{
title: '拥有者',
dataIndex: 'owner',
width: 100,
},
{
title: '发布状态',
dataIndex: 'releaseStatus',
width: 120,
},
];
export const searchFormSchema: FormSchema[] = [
{
field: 'name',
label: ' ',
component: 'Input',
colProps: { span: 5 },
componentProps: {
placeholder: '输入关键字搜索',
},
},
{
field: 'releaseStatus',
label: ' ',
component: 'Select',
colProps: { span: 5 },
componentProps: {
placeholder: '发布状态',
options: [
{ label: '未发布', value: '未发布' },
{ label: '已发布', value: '已发布' },
{ label: '审核中', value: '审核中' },
{ label: '已下线', value: '已下线' },
],
},
},
];
/**移动*/
export const MoveFormSchema: any[] = [
{
field: 'taskId',
label: '路径',
component: 'TreeSelect',
colProps: { lg: 24, md: 24 },
componentProps: {
// border: 'none',
fieldNames: {
label: 'workSpaceName',
value: 'businessId',
},
getPopupContainer: () => document.body,
},
required: true,
},
];
export const formSchemaNewFolder: any = [
{
field: 'path',
label: '路径',
component: 'TreeSelect',
rules: [
{
required: true,
message: '请选择上级菜单',
},
],
componentProps: {
fieldNames: {
label: 'workSpaceName',
value: 'businessId',
},
getPopupContainer: () => document.body,
},
},
{
field: 'name',
label: '文件夹名称',
component: 'Input',
colProps: { span: 8 },
componentProps: {
placeholder: '输入文件夹名称',
},
},
// {
// field: 'fileType',
// label: '权限模式',
// component: 'RadioGroup',
// defaultValue: '本级定义',
// colProps: { span: 8 },
// componentProps: {
// options: [
// { label: '本级定义', value: '本级定义' },
// { label: '资源自定义', value: '资源自定义' },
// ],
// placeholder: '输入描述',
// },
// },
// {
// field: 'group',
// label: '权属工作组',
// component: 'Select',
// defaultValue: '默认工作组',
// colProps: { span: 8 },
// componentProps: {
// placeholder: '输入描述',
// options: [{ label: '默认工作组', value: '默认工作组' }],
// },
// },
];
export const importFormSchema: any[] = [
{
field: 'fileMethods',
label: '导入文件选择',
slot: 'fileMethods',
colProps: { lg: 24, md: 24, offset: 3 },
},
{
field: 'fileRename',
label: '文件重名',
component: 'RadioGroup',
required: true,
colProps: { lg: 24, md: 24, offset: 3 },
componentProps: {
options: [
{ label: '全部放弃', value: '1' },
{ label: '全部替换', value: '2' },
{ label: '自动重命名', value: '3' },
],
},
},
];
src/views/dataIntegration/dataLoading/dataEntryLake/databaseOfflineLoading.vue 0 → 100644
View file @ b93a6ca4
<template>
<PageWrapper class="content-padding" contentBackground @back="goBack">
<template #headerContent>
<div class="modal_top">
<Icon
icon="ep:arrow-left-bold"
:size="20"
style="margin-right: 5px"
:color="'#a3a7b1'"
@click="goBack"
/>
<div>
<Icon icon="iconoir:db" :size="40" :color="'#9064e9'" />
</div>
<div>
<div class="title">离线加载</div>
<div class="path">数据加载/离线加载</div>
</div>
<div class="buttonGroup">
<a-button type="primary" @click="handleOperation">跳转运维</a-button>
<a-button type="primary" @click="handleSave">保存</a-button>
<a-button type="primary" @click="handleDebug">调试</a-button>
<a-button type="primary" @click="handleRun">运行</a-button>
<a-button type="primary" @click="handlePublish">发布</a-button>
<a-button type="primary" @click="handleGobalDeply">全局配置</a-button>
<a-button type="primary" @click="handleParameterConfiguration">参数配置</a-button>
<a-button type="primary" @click="handleVersionManagement">版本管理</a-button>
</div>
</div>
</template>
<div>
<Tabs>
<TabPane key="1" tab="源端配置" style="display: flex">
<BasicForm @register="registerSourceSideConfigurationForm" style="width: 30%">
<template #getMetadata>
<a-button @click="handleGetMetadata" type="primary">获取元数据</a-button>
</template>
</BasicForm>
<div style="width: 20%">
<BasicTree
toolbar
search
:checkable="true"
:actionList="actionList"
:treeData="tableTreeData"
v-model:checkedKeys="checkedKeys"
@select="handleSelect"
>
<template #headerTitle>
表头 <a @click="handleDeplys" style="margin-left: 2px">批量配置</a>
</template>
</BasicTree>
</div>
<BasicForm @register="registerLoadingStrategyForm" style="width: 50%">
<template #quantityBasedAlert>
<Alert
show-icon
style="font-size: 12px"
message="基于数量的加载策略，要求在进行数据加载时，源端的表不要发生数据变更，否则可能会出现数据加载异常。"
type="info"
/>
</template>
<template #conditionBasedAlert>
<Alert
show-icon
message="基于条件的加载策略，要求选中的切分列的数据分布均匀，否则会出现数据倾斜，影响数据加载性能，其中切分的类型推荐使用数值型或时间类型，不支持字符串类型的字段作为切分列，否则也会丢数。"
type="info"
style="font-size: 12px"
/>
</template>
<template #isCustomSQLAlert>
<Alert
show-icon
message="自定义SQL模式下，只支持查询SQL，且无论是新增还是修改SQL都需要点击解析SQL对字段更新。"
type="warning"
style="font-size: 12px"
/>
</template>
<template #parsingSQL>
<a-button type="primary" @click="handleParsingSQL">解析SQL</a-button>
</template>
<template #isCustomSQLTable>
<BasicTable @register="registerIsCustomSQLTable" />
</template>
<template #notCustomSQLTable>
<BasicTable @register="registerNotCustomSQLTable">
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
label: '删除',
onClick: handleDelete.bind(null, record),
},
]"
/>
</template>
</template>
<template #dataConversion="{ record }">
<Icon icon="tdesign:edit-2" @click="handleConversion(record)" />
</template>
</BasicTable>
</template>
</BasicForm>
</TabPane>
<TabPane key="2" tab="映射规则配置">
<!-- <BasicTable>-->
<!-- </BasicTable>-->
</TabPane>
<TabPane key="3" tab="目标端配置">
<!-- <BasicForm>-->
<!-- </BasicForm>-->
</TabPane>
<TabPane key="4" tab="列表展示">
<!-- <BasicTable>-->
<!-- </BasicTable>-->
<!-- <BasicTable>-->
<!-- </BasicTable>-->
</TabPane>
</Tabs>
</div>
<GetMetadataModal @register="registerGetMetadataModal" />
<DeplysModal @register="registerDeplysModal" />
</PageWrapper>
</template>
<script lang="ts" setup>
import { Tabs, TabPane, Select, Alert, Modal, notification } from 'ant-design-vue';
import { h, ref, onMounted, reactive } from 'vue';
import { BasicTree } from '@/components/Tree';
import { BasicForm, useForm } from '@/components/Form';
import {
sourceSideConfigurationFormSchema,
LoadingStrategyFormSchema,
isCustomSQLColumns,
notCustomSQLColumns,
} from './offlineLoading.data';
import Icon from '@/components/Icon/Icon.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { PageWrapper } from '@/components/Page';
import { useRoute } from 'vue-router';
import { isCustomSQLTableList, notCustomSQLTableList, tableTreeData } from './mock';
import { router } from '@/router';
import { DeleteOutlined } from '@ant-design/icons-vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { useModal } from '@/components/Modal';
import GetMetadataModal from '@/views/dataIntegration/dataLoading/dataEntryLake/getMetadataModal.vue';
import DeplysModal from '@/views/dataIntegration/dataLoading/dataEntryLake/getMetadataModal.vue';
const route = useRoute();
const emit = defineEmits(['success', 'register']);
const { createMessage, createConfirm } = useMessage();
const checkedKeys = ref<string[]>();
let isCustomSQLTable = ref(isCustomSQLTableList);
let notCustomSQLTable = ref(notCustomSQLTableList);
const selectKey = ref('0');
const [registerGetMetadataModal, { openModal: openGetMetadataModal }] = useModal();
const [registerDeplysModal, { openModal: openDeplysModal }] = useModal();
const [
registerSourceSideConfigurationForm,
{ validate: validateSourceSideConfigurationForm, submit: submitSourceSideConfiguration },
] = useForm({
labelWidth: 180,
labelAlign: 'left',
baseColProps: { lg: 24, md: 24 },
schemas: sourceSideConfigurationFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
const [registerLoadingStrategyForm, { setFieldsValue }] = useForm({
labelWidth: 180,
labelAlign: 'left',
baseColProps: { lg: 24, md: 24 },
schemas: LoadingStrategyFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
const [registerIsCustomSQLTable, { reload: isCustomSQLTableReload }] = useTable({
api: async () => {
isCustomSQLTable.value = isCustomSQLTableList.filter((item) => {
return item.ownershipTableId[0] === selectKey.value;
});
const response = {
pageNu: '1',
pageSize: '5',
pages: '1',
total: isCustomSQLTable.value.length,
code: '',
message: '',
data: isCustomSQLTable.value,
};
return { ...response };
},
scroll: { y: 300 },
rowKey: 'businessId',
columns: isCustomSQLColumns,
showTableSetting: false,
showIndexColumn: false,
bordered: false,
});
const [registerNotCustomSQLTable, { reload: notCustomSQLTableReload }] = useTable({
api: async () => {
notCustomSQLTable.value = notCustomSQLTableList.filter(
(item) => item.ownershipTableId[0] === selectKey.value,
);
const response = {
pageNu: '1',
pageSize: '5',
pages: '1',
total: notCustomSQLTable.value.length,
code: '',
message: '',
data: notCustomSQLTable.value,
};
return { ...response };
},
scroll: { y: 300 },
rowKey: 'businessId',
columns: notCustomSQLColumns,
showTableSetting: false,
showIndexColumn: false,
bordered: false,
handleSearchInfoFn(info) {
// console.log('handleSearchInfoFn', info);
return info;
},
actionColumn: {
width: 60,
title: '操作',
dataIndex: 'action',
// slots: { customRender: 'action' },
},
});
const actionList = [
{
//删除
render: (node) => {
return h(DeleteOutlined, {
class: 'ml-2',
onClick: () => {
handleDeleteTable(node);
},
});
},
},
];
onMounted(() => {});
// 删除节点
const handleDeleteTable = (node) => {
Modal.confirm({
title: '确认删除',
content: '确定要删除此表吗？',
okText: '确认',
cancelText: '取消',
onOk() {
createMessage.success('删除成功!');
},
onCancel() {
console.log('取消删除');
createMessage.info('取消删除');
},
});
};
function handleDelete() {
createConfirm({
iconType: 'warning',
title: '确认删除',
content: '确认删除选中数据吗？',
onOk() {
createMessage.success('删除成功!');
},
});
}
function handleSelect(keys) {
// console.log('keys', keys);
selectKey.value = keys.toString();
const sql = tableTreeData.filter((item) => item.key === keys.toString())[0].sql;
setFieldsValue({ querySQL: sql });
isCustomSQLTableReload();
notCustomSQLTableReload();
// emit('select', keys[0]);
}
function goBack() {
router.back();
}
async function handleSave() {
try {
const isValid = await validateSourceSideConfigurationForm();
if (!isValid) {
createMessage.error('表单校验未通过，请检查输入');
return;
}
await submitSourceSideConfiguration();
createMessage.success('保存成功');
router.back();
} catch (error) {
console.error('保存失败:', error);
createMessage.error('表单校验未通过，请检查输入');
}
}
function handleDeplys() {
console.log('checkedKeys', checkedKeys.value);
openDeplysModal(true)
}
function handleGetMetadata() {
openGetMetadataModal(true);
}
function handleConversion(record) {
createMessage.success('数据转换成功' + record.fieldType);
}
</script>
<style lang="scss" scoped>
.content-padding {
background-color: white;
}
.modal_top {
padding: 0 0 20px 0;
display: flex;
align-items: center;
.title {
font-size: 16px;
font-weight: 500;
}
.path {
font-size: 14px;
color: gray;
}
.buttonGroup {
margin-left: auto;
display: flex;
gap: 5px;
align-items: center;
}
}
</style>
src/views/dataIntegration/dataLoading/dataEntryLake/fileOfflineLoading.vue 0 → 100644
View file @ b93a6ca4
<template>
</template>
<script>
export default {
name: "databaseOfflineLoading"
}
</script>
<style scoped>
</style>
src/views/dataIntegration/dataLoading/dataEntryLake/getMetadataModal.vue 0 → 100644
View file @ b93a6ca4
<template>
<BasicModal
v-bind="$attrs"
@register="registerModal"
title="获取元数据"
@ok="handleSubmit"
minHeight="50"
>
<div style="display: flex; justify-content: space-between">
<a-input-search style="width: 220px" />
<a-button @click="handleClick">
通过序号批量选择
<Icon v-if="unfold" icon="fe:arrow-up" />
<Icon v-else icon="fe:arrow-down" />
</a-button>
</div>
<div v-if="unfold">
从<a-input class="getMetadataInput" style="margin-right: 5px" />到<a-input
class="getMetadataInput"
style="margin-right: 5px; margin-left: 5px"
/>
<a-button style="margin-right: 5px">选择</a-button>
<a-button style="margin-right: 5px">清空</a-button>
</div>
<BasicTable @register="registerTable" />
</BasicModal>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import { BasicTable, useTable } from '@/components/Table';
import { BasicModal, useModalInner } from '@/components/Modal';
import { useMessage } from '@/hooks/web/useMessage';
import { getMetadataTableList } from '@/views/dataIntegration/dataLoading/dataEntryLake/mock';
import { getMetadataColumns } from '@/views/dataIntegration/dataLoading/dataEntryLake/offlineLoading.data';
import Icon from '@/components/Icon/Icon.vue';
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const unfold = ref(false);
let getMetadataTable = ref(getMetadataTableList);
const [registerTable] = useTable({
api: async () => {
const response = {
pageNu: '1',
pageSize: '5',
pages: '1',
total: getMetadataTable.value.length,
code: '',
message: '',
data: getMetadataTable.value,
};
return { ...response };
},
scroll: { y: 300 },
rowKey: 'businessId',
rowSelection: true,
columns: getMetadataColumns,
showTableSetting: false,
showIndexColumn: true,
bordered: false,
});
//初始化弹框
const [registerModal, { closeModal }] = useModalInner(async () => {});
function handleClick() {
unfold.value = !unfold.value;
}
/**确定按钮*/
async function handleSubmit() {
closeModal();
}
</script>
<style scoped lang="scss">
.getMetadataInput {
width: 120px;
}
</style>
src/views/dataIntegration/dataLoading/dataEntryLake/importModal.vue 0 → 100644
View file @ b93a6ca4
<template>
<BasicModal
width="35%"
v-bind="$attrs"
@register="registerModal"
:title="getTitle"
@ok="handleSubmit"
>
<BasicForm @register="registerForm">
<template #fileMethods="{ model, field }">
<div style="display: flex">
<div>
<a-button>下载模板</a-button>
<a-button type="primary" style="margin-left: 5px">选择文件</a-button>
</div>
<div style="width: 200px; margin-top: 6px; margin-left: 5px"
>数据质量只能导入单个zip文件</div
>
</div>
</template>
</BasicForm>
</BasicModal>
</template>
<script lang="ts" setup>
import { ref, unref } from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { importFormSchema } from './dataEntry.data';
const emit = defineEmits(['success', 'register']);
const isUpdate = ref(true);
const isMove = ref(false);
const rowId = ref('');
//获取接口数据并放在下拉框里（这里是打开了一个弹框）
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
schemas: importFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false });
isUpdate.value = !!data?.isUpdate;
isMove.value = !!data?.isMove;
if (unref(isUpdate)) {
// 获取行数据的id
rowId.value = data.record.businessId;
// 塞值
setFieldsValue({
...data.record,
});
}
});
// onMounted(){}
// const getTitle = computed(() => '新建文件');
const getTitle = '导入文件选择';
/**确定按钮*/
async function handleSubmit() {
closeModal();
}
</script>
src/views/dataIntegration/dataLoading/dataEntryLake/index.vue 0 → 100644
View file @ b93a6ca4
<template>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<GroupTree class="w-1/4 xl:w-1/5" @select="handleSelect" />
<BasicTable @register="registerTable" class="w-3/4 xl:w-4/5">
<template #toolbar>
<a-button
:disabled="getRowSelection().selectedRowKeys <= 0"
type="primary"
@click="handleRun"
>运行</a-button
>
<a-button
:disabled="getRowSelection().selectedRowKeys <= 0"
type="primary"
@click="handlePublish"
>发布</a-button
>
<a-button
:disabled="getRowSelection().selectedRowKeys <= 0"
type="primary"
@click="handleDownline"
>下线</a-button
>
<a-button
:disabled="getRowSelection().selectedRowKeys <= 0"
type="primary"
@click="handleMove(0)"
>复制到</a-button
>
<a-button
:disabled="getRowSelection().selectedRowKeys <= 0"
type="primary"
@click="deleteButton"
>删除</a-button
>
<a-button
:disabled="getRowSelection().selectedRowKeys <= 0"
type="primary"
@click="handleMove(1)"
>移动</a-button
>
<a-button :disabled="getRowSelection().selectedRowKeys <= 0" type="primary">导出</a-button>
<a-button type="primary" @click="handleImport">导入</a-button>
<a-button type="primary" @click="handleNewFolder">新建文件夹</a-button>
<a-button type="primary" @click="handleDataEntry">新建文件</a-button>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
// {
// label: '详情',
// onClick: handleEdit.bind(null, record, 1),
// },
// {
// label: '发布',
// onClick: handlePublish.bind(null, record),
// },
{
label: '复制',
onClick: handleMove.bind(null, 0, record),
},
{
label: '移动',
onClick: handleMove.bind(null, 1, record),
},
{
label: '删除',
onClick: deleteButton.bind(null, record, 1),
},
]"
/>
</template>
</template>
</BasicTable>
<MoveFile @register="registerMoveFile" @success="handleMoveSuccess" />
<ImportModal @register="registerImport" @success="handleImportSuccess" />
<SceneSelectionModal @register="registerSceneSelectionModal" />
<NewFolder @register="registerNewFolder" />
</PageWrapper>
</template>
<script lang="ts" setup>
import { onMounted } from 'vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { PageWrapper } from '@/components/Page';
import { useMessage } from '@/hooks/web/useMessage';
import { useModal } from '@/components/Modal';
import { tableList } from './mock';
import { columns, searchFormSchema } from './dataEntry.data';
import { useRouter, onBeforeRouteLeave } from 'vue-router';
import { useFilterStore } from '@/store/modules/filterData';
import { router } from '@/router';
import MoveFile from './moveFile.vue';
import NewFolder from './newFolder.vue';
import GroupTree from './GroupTree.vue';
import SceneSelectionModal from './sceneSelectionModal.vue';
import ImportModal from './importModal.vue';
const { createMessage, createConfirm } = useMessage();
const filterStore = useFilterStore();
const route = useRouter();
const [registerImport, { openModal: openImportModal }] = useModal();
const [registerMoveFile, { openModal: openMoveFileModal }] = useModal();
const [registerSceneSelectionModal, { openModal: openSceneSelectionModal }] = useModal();
const [registerNewFolder, { openModal: openNewFolderModal }] = useModal();
const [
registerTable,
{ reload, updateTableDataRecord, getSearchInfo, getForm, getRowSelection },
] = useTable({
api: async () => {
// console.log('tableList', tableList);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: tableList.length,
code: '',
message: '',
data: tableList,
};
return { ...response };
},
rowKey: 'businessId',
rowSelection: true,
columns,
formConfig: {
labelWidth: 10,
schemas: searchFormSchema,
autoSubmitOnEnter: true,
},
useSearchForm: true,
showTableSetting: false,
showIndexColumn: false,
bordered: true,
handleSearchInfoFn(info) {
// console.log('handleSearchInfoFn', info);
return info;
},
actionColumn: {
width: 260,
title: '操作',
dataIndex: 'action',
// slots: { customRender: 'action' },
},
});
function handleDataEntry() {
openSceneSelectionModal(true);
}
function handleNewFolder() {
openNewFolderModal(true, {
isUpdate: false,
});
}
/** 导入按钮*/
function handleImport() {
openImportModal(true, {});
}
/** 重置密码弹窗确定按钮*/
/** 删除按钮*/
function handleDelete(record: Recordable) {
createMessage.success('删除成功!');
reload();
}
/** 移动按钮*/
function handleMove(isMove, record: Recordable) {
// console.log('record',record)
openMoveFileModal(true, {
record,
isMove: isMove,
});
}
/**删除按钮*/
function deleteButton() {
createConfirm({
iconType: 'warning',
title: '确认删除',
content: '确认批量删除选中数据吗？',
onOk() {
createMessage.success('删除成功!');
reload();
},
});
}
/** 导出按钮*/
async function handleExport() {}
/** 导入成功*/
function handleImportSuccess() {
reload();
}
/** 部门树的select*/
function handleSelect() {
reload();
}
function handleEdit(record: Recordable, disabled: number) {
// console.log('record', record.businessId);
router.push({
path: '/dataQuality/dataSheet/template/edit',
query: {
id: record.businessId,
disabled: String(disabled),
},
});
}
/** 移动*/
function handleMoveSuccess({ isMove, values }) {
const rowSelection = getRowSelection().selectedRowKeys;
if (rowSelection.length > 0) {
//批量移动
for (let i = 0; i < rowSelection.length; i++) {
const result = updateTableDataRecord(values[i].institutionId, values[i]);
}
} else {
//单个移动
const result = updateTableDataRecord(values.businessId, values);
}
reload();
}
onMounted(() => {
// const path = route.path;
// if (filterStore.getSearchParams[path]) {
// if (JSON.parse(filterStore.getSearchParams[path] !== {})) {
// const params = JSON.parse(filterStore.getSearchParams[path]);
// // console.log('11111111111111111111111111111', params);
// getForm().setFieldsValue({
// page: params.page,
// pageSize: params.pageSize,
// username: params.username,
// flag: params.flag,
// });
// searchInfo.deptId = params.deptId;
// }
// }
});
onBeforeRouteLeave((to, from, next) => {
// const params = Object.assign({}, getSearchInfo(), getForm().getFieldsValue());
// // console.log('path', from.path);
// // console.log('params', params);
// filterStore.setSearchParams({
// path: from.path,
// param: {
// ...params,
// },
// });
next(); // 允许导航
});
</script>
src/views/dataIntegration/dataLoading/dataEntryLake/mock.ts 0 → 100644
View file @ b93a6ca4
export const tableList: any[] = [
{
businessId: 1,
name: '图标加载',
scene: '离线加载',
releaseStatus: '未发布',
createTime: '2023/05/23 14:36:04',
updateTime: '2023/05/23 14:36:04',
owner: 'admin',
workgroup: '个人工作组',
},
{
businessId: 2,
name: '图标专利文件加载',
scene: '离线加载',
releaseStatus: '未发布',
createTime: '2023/05/23 14:36:04',
updateTime: '2023/05/23 14:36:05',
owner: 'admin',
workgroup: '个人工作组',
},
{
businessId: 3,
name: '版权证书加载',
scene: '离线加载',
releaseStatus: '已下线',
createTime: '2023/05/23 14:36:04',
updateTime: '2023/05/23 14:36:04',
owner: 'admin',
workgroup: '个人工作组',
},
{
businessId: 4,
name: '学生成绩表格',
scene: '文件加载',
releaseStatus: '已发布',
createTime: '2023/05/23 14:36:04',
updateTime: '2023/05/23 14:36:05',
owner: 'admin',
workgroup: '共享工作组',
},
{
businessId: 5,
name: '各科试卷加载',
scene: '文件加载',
releaseStatus: '已发布',
createTime: '2023/05/23 14:36:04',
updateTime: '2023/05/23 14:36:05',
owner: 'admin',
workgroup: '共享工作组',
},
{
businessId: 6,
name: '学生个人信息加载',
scene: '准实时加载',
releaseStatus: '已发布',
createTime: '2023/05/23 14:36:04',
updateTime: '2023/05/23 14:36:04',
owner: 'admin',
workgroup: '共享工作组',
},
];
export const treeDataList = [
{
title: '主体管理',
key: 1,
icon: 'home|svg',
children: [
{ title: 'admin_个人工作区', key: 2 },
{ title: '共享工作区', key: 3 },
{ title: '商城工作区', key: 4 },
{ title: '指标工作区', key: 5 },
],
},
];
export const treeDataListTwo = [
{
label: '默认工作组',
businessId: 1,
children: [
{ label: '默认工作组01', businessId: 2 },
{ label: '默认工作组02', businessId: 3 },
{ label: '默认工作组03', businessId: 4 },
{ label: '默认工作组04', businessId: 5 },
],
},
];
export const TreeData: any[] = [
{
delFlag: '0',
flag: '1',
businessId: 100,
parentWorkSpaceName: '整合',
workSpaceName: '整合',
parentId: 0,
'code:': '001',
ancestors: '0',
orderNum: 0,
children: [],
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
delFlag: '0',
flag: '1',
businessId: 101,
parentWorkSpaceName: '数据加载',
workSpaceName: '数据加载',
parentId: 100,
'code:': '002',
ancestors: '0,100',
orderNum: 1,
children: [],
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
delFlag: '0',
flag: '1',
businessId: 201,
parentWorkSpaceName: '数据加载',
workSpaceName: '个人工作区',
parentId: 101,
'code:': '003',
ancestors: '0,100',
orderNum: 1,
children: [],
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
delFlag: '0',
flag: '1',
businessId: 202,
parentWorkSpaceName: '数据加载',
workSpaceName: '共享工作区',
parentId: 101,
'code:': '004',
ancestors: '0,100',
orderNum: 2,
children: [],
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
delFlag: '0',
flag: '1',
businessId: 301,
parentWorkSpaceName: '个人工作区',
workSpaceName: '图标验收',
parentId: 201,
'code:': '004',
ancestors: '0,100',
orderNum: 2,
children: [],
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
{
delFlag: '0',
flag: '1',
businessId: 302,
parentWorkSpaceName: '共享工作区',
workSpaceName: '学生成绩',
parentId: 202,
'code:': '004',
ancestors: '0,100',
orderNum: 2,
children: [],
selectType: null,
createTime: '2024-10-24 10:04:04',
createBy: 'admin',
},
];
export const cardList = [
{
title: '数据库离线加载',
scene: 'databaseOfflineLoading',
icon: 'iconoir:db',
color: '#9064e9',
description: '支持数据加载导数据仓库（数据加载功能），也支持数仓将数据写入业务库（卸载功能）',
},
{
title: '文件离线加载',
scene: 'fileOfflineLoading',
icon: 'tabler:file-isr',
color: '#9064e9',
description: '支持将文件定期加载入数据仓库中',
},
// {
// title: 'Vben Admin',
// icon: 'logos:vue',
// color: '#1890ff',
// },
];
export const tableTreeData = [
{
title: 'bm_datasource',
key: '0',
sql: 'SELECT uuid, catalog_id FROM bm_datasource',
},
{
title: 'user_info',
key: '1',
sql: 'SELECT uuid, catalog_id, name, description FROM user_info',
},
{
title: 'customer_details',
key: '2',
sql: 'SELECT uuid, user_id, username, email FROM customer_details',
},
{
title: 'order_history',
key: '3',
sql: 'SELECT uuid, order_id, total_amount FROM order_history',
},
{
title: 'product_inventory',
key: '4',
sql: 'SELECT uuid, product_id, product_name, price FROM product_inventory',
},
{
title: 'transaction_logs',
key: '5',
sql: 'SELECT uuid, category_id, category_name FROM transaction_logs',
},
{
title: 'employee_records',
key: '6',
sql: 'SELECT uuid, customer_id, customer_name FROM employee_records',
},
{
title: 'payment_details',
key: '7',
sql: 'SELECT uuid, customer_id, order_date FROM payment_details',
},
{
title: 'shipping_addresses',
key: '8',
sql: 'SELECT uuid, product_id, stock_quantity, last_updated FROM shipping_addresses',
},
{
title: 'invoice_data',
key: '9',
sql: 'SELECT uuid, user_id, address, phone_number FROM invoice_data',
},
{
title: 'customer_feedback',
key: '10',
sql: 'SELECT uuid, category_id, category_description, parent_category_id FROM customer_feedback',
},
{
title: 'supplier_info',
key: '11',
sql: 'SELECT * FROM supplier_info', // 假设 supplier_info 表没有在 isCustomSQLTableList 中定义字段
},
];
export const isCustomSQLTableList = [
{
businessId: '14',
ownershipTableId: '0',
fieldName: 'uuid',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '15',
ownershipTableId: '0',
fieldName: 'catalog_id',
fieldType: 'BIGINT(19,0)',
},
{
businessId: '1',
ownershipTableId: '1',
fieldName: 'uuid',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '2',
ownershipTableId: '1',
fieldName: 'catalog_id',
fieldType: 'BIGINT(19,0)',
},
{
businessId: '3',
ownershipTableId: '1',
fieldName: 'name',
fieldType: 'VARCHAR(255,0)',
},
{
businessId: '4',
ownershipTableId: '1',
fieldName: 'description',
fieldType: 'TEXT',
},
{
businessId: '5',
ownershipTableId: '2',
fieldName: 'uuid',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '6',
ownershipTableId: '2',
fieldName: 'user_id',
fieldType: 'BIGINT(19,0)',
},
{
businessId: '7',
ownershipTableId: '2',
fieldName: 'username',
fieldType: 'VARCHAR(255,0)',
},
{
businessId: '8',
ownershipTableId: '2',
fieldName: 'email',
fieldType: 'VARCHAR(255,0)',
},
{
businessId: '9',
ownershipTableId: '3',
fieldName: 'uuid',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '10',
ownershipTableId: '3',
fieldName: 'order_id',
fieldType: 'BIGINT(19,0)',
},
{
businessId: '11',
ownershipTableId: '3',
fieldName: 'total_amount',
fieldType: 'DECIMAL(10,2)',
},
{
businessId: '12',
ownershipTableId: '4',
fieldName: 'uuid',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '13',
ownershipTableId: '4',
fieldName: 'product_id',
fieldType: 'BIGINT(19,0)',
},
{
businessId: '14',
ownershipTableId: '4',
fieldName: 'product_name',
fieldType: 'VARCHAR(255,0)',
},
{
businessId: '15',
ownershipTableId: '4',
fieldName: 'price',
fieldType: 'DECIMAL(10,2)',
},
{
businessId: '16',
ownershipTableId: '5',
fieldName: 'uuid',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '17',
ownershipTableId: '5',
fieldName: 'category_id',
fieldType: 'BIGINT(19,0)',
},
{
businessId: '18',
ownershipTableId: '5',
fieldName: 'category_name',
fieldType: 'VARCHAR(255,0)',
},
{
businessId: '19',
ownershipTableId: '6',
fieldName: 'uuid',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '20',
ownershipTableId: '6',
fieldName: 'customer_id',
fieldType: 'BIGINT(19,0)',
},
{
businessId: '21',
ownershipTableId: '6',
fieldName: 'customer_name',
fieldType: 'VARCHAR(255,0)',
},
{
businessId: '22',
ownershipTableId: '7',
fieldName: 'uuid',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '23',
ownershipTableId: '7',
fieldName: 'customer_id',
fieldType: 'BIGINT(19,0)',
},
{
businessId: '24',
ownershipTableId: '7',
fieldName: 'order_date',
fieldType: 'DATE',
},
{
businessId: '25',
ownershipTableId: '8',
fieldName: 'uuid',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '26',
ownershipTableId: '8',
fieldName: 'product_id',
fieldType: 'BIGINT(19,0)',
},
{
businessId: '27',
ownershipTableId: '8',
fieldName: 'stock_quantity',
fieldType: 'INT(11,0)',
},
{
businessId: '28',
ownershipTableId: '8',
fieldName: 'last_updated',
fieldType: 'TIMESTAMP',
},
{
businessId: '29',
ownershipTableId: '9',
fieldName: 'uuid',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '30',
ownershipTableId: '9',
fieldName: 'user_id',
fieldType: 'BIGINT(19,0)',
},
{
businessId: '31',
ownershipTableId: '9',
fieldName: 'address',
fieldType: 'VARCHAR(255,0)',
},
{
businessId: '32',
ownershipTableId: '9',
fieldName: 'phone_number',
fieldType: 'VARCHAR(20,0)',
},
{
businessId: '33',
ownershipTableId: '10',
fieldName: 'uuid',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '34',
ownershipTableId: '10',
fieldName: 'category_id',
fieldType: 'BIGINT(19,0)',
},
{
businessId: '35',
ownershipTableId: '10',
fieldName: 'category_description',
fieldType: 'TEXT',
},
{
businessId: '36',
ownershipTableId: '10',
fieldName: 'parent_category_id',
fieldType: 'BIGINT(19,0)',
},
];
export const notCustomSQLTableList = [
// bm_datasource
{
businessId: '1',
ownershipTableId: '0',
fieldName: 'uuid',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '2',
ownershipTableId: '0',
fieldName: 'catalog_id',
fieldType: 'BIGINT(19,0)',
},
// user_info
{
businessId: '3',
ownershipTableId: '1',
fieldName: 'user_id',
fieldType: 'INT(11,0)',
},
{
businessId: '4',
ownershipTableId: '1',
fieldName: 'username',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '5',
ownershipTableId: '1',
fieldName: 'email',
fieldType: 'VARCHAR(100,0)',
},
// customer_details
{
businessId: '6',
ownershipTableId: '2',
fieldName: 'customer_id',
fieldType: 'INT(11,0)',
},
{
businessId: '7',
ownershipTableId: '2',
fieldName: 'first_name',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '8',
ownershipTableId: '2',
fieldName: 'last_name',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '9',
ownershipTableId: '2',
fieldName: 'address',
fieldType: 'VARCHAR(255,0)',
},
// order_history
{
businessId: '10',
ownershipTableId: '3',
fieldName: 'order_id',
fieldType: 'INT(11,0)',
},
{
businessId: '11',
ownershipTableId: '3',
fieldName: 'customer_id',
fieldType: 'INT(11,0)',
},
{
businessId: '12',
ownershipTableId: '3',
fieldName: 'order_date',
fieldType: 'DATETIME',
},
// product_inventory
{
businessId: '13',
ownershipTableId: '4',
fieldName: 'product_id',
fieldType: 'INT(11,0)',
},
{
businessId: '14',
ownershipTableId: '4',
fieldName: 'quantity',
fieldType: 'INT(11,0)',
},
{
businessId: '15',
ownershipTableId: '4',
fieldName: 'price',
fieldType: 'DECIMAL(10,2)',
},
// transaction_logs
{
businessId: '16',
ownershipTableId: '5',
fieldName: 'log_id',
fieldType: 'INT(11,0)',
},
{
businessId: '17',
ownershipTableId: '5',
fieldName: 'transaction_type',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '18',
ownershipTableId: '5',
fieldName: 'amount',
fieldType: 'DECIMAL(10,2)',
},
// employee_records
{
businessId: '19',
ownershipTableId: '6',
fieldName: 'employee_id',
fieldType: 'INT(11,0)',
},
{
businessId: '20',
ownershipTableId: '6',
fieldName: 'name',
fieldType: 'VARCHAR(100,0)',
},
{
businessId: '21',
ownershipTableId: '6',
fieldName: 'position',
fieldType: 'VARCHAR(100,0)',
},
// payment_details
{
businessId: '22',
ownershipTableId: '7',
fieldName: 'payment_id',
fieldType: 'INT(11,0)',
},
{
businessId: '23',
ownershipTableId: '7',
fieldName: 'payment_method',
fieldType: 'VARCHAR(50,0)',
},
{
businessId: '24',
ownershipTableId: '7',
fieldName: 'amount',
fieldType: 'DECIMAL(10,2)',
},
// shipping_addresses
{
businessId: '25',
ownershipTableId: '8',
fieldName: 'address_id',
fieldType: 'INT(11,0)',
},
{
businessId: '26',
ownershipTableId: '8',
fieldName: 'customer_id',
fieldType: 'INT(11,0)',
},
{
businessId: '27',
ownershipTableId: '8',
fieldName: 'address',
fieldType: 'VARCHAR(255,0)',
},
// invoice_data
{
businessId: '28',
ownershipTableId: '9',
fieldName: 'invoice_id',
fieldType: 'INT(11,0)',
},
{
businessId: '29',
ownershipTableId: '9',
fieldName: 'invoice_date',
fieldType: 'DATETIME',
},
{
businessId: '30',
ownershipTableId: '9',
fieldName: 'total_amount',
fieldType: 'DECIMAL(10,2)',
},
// customer_feedback
{
businessId: '31',
ownershipTableId: '10',
fieldName: 'feedback_id',
fieldType: 'INT(11,0)',
},
{
businessId: '32',
ownershipTableId: '10',
fieldName: 'customer_id',
fieldType: 'INT(11,0)',
},
{
businessId: '33',
ownershipTableId: '10',
fieldName: 'feedback_text',
fieldType: 'TEXT',
},
// supplier_info
{
businessId: '34',
ownershipTableId: '11',
fieldName: 'supplier_id',
fieldType: 'INT(11,0)',
},
{
businessId: '35',
ownershipTableId: '11',
fieldName: 'company_name',
fieldType: 'VARCHAR(100,0)',
},
{
businessId: '36',
ownershipTableId: '11',
fieldName: 'contact_person',
fieldType: 'VARCHAR(100,0)',
},
];
export const getMetadataTableList = [
{
tableName: 'bm_datasource',
businessId: '0',
},
{
tableName: 'user_info',
businessId: '1',
},
{
tableName: 'customer_details',
businessId: '2',
},
{
tableName: 'order_history',
businessId: '3',
},
{
tableName: 'product_inventory',
businessId: '4',
},
{
tableName: 'transaction_logs',
businessId: '5',
},
{
tableName: 'employee_records',
businessId: '6',
},
{
tableName: 'payment_details',
businessId: '7',
},
{
tableName: 'shipping_addresses',
businessId: '8',
},
{
tableName: 'invoice_data',
businessId: '9',
},
{
tableName: 'customer_feedback',
businessId: '10',
},
{
tableName: 'supplier_info',
businessId: '11',
},
];
src/views/dataIntegration/dataLoading/dataEntryLake/moveFile.vue 0 → 100644
View file @ b93a6ca4
<template>
<BasicModal
v-bind="$attrs"
@register="registerModal"
:title="getTitle"
@ok="handleSubmit"
minHeight="50"
>
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup>
import { ref, computed, unref, reactive } from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { MoveFormSchema } from './dataEntry.data';
import { useMessage } from '@/hooks/web/useMessage';
import { TreeData } from './mock';
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const isUpdate = ref(true);
const rowId = ref('');
const idList = ref([]);
const rowData = ref([]);
let isMove = ref();
//获取接口数据并放在下拉框里（这里是打开了一个弹框）
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { span: 24 },
schemas: MoveFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
console.log('data', data);
// //每次点击弹窗 需要清空存储的数据
rowData.value = [];
isMove.value = data.isMove;
// //重置表单数据
resetFields();
setModalProps({ confirmLoading: false });
// if (data.idList != null && data.idList.length > 0) {
// /* empty */
// } else {
// rowData.value.push(data.record);
// //单个移动
// rowId.value = data.record.businessId;
// data.record.taskId = data.record.businessId;
// setFieldsValue({
// ...data.record,
// });
// }
const treeList = handleTree(TreeData, 'businessId', undefined, undefined, undefined);
updateSchema([
{
field: 'taskId',
componentProps: {
treeData: treeList,
},
},
]);
console.log('treeList:', treeList);
});
const getTitle = computed(() => '移动');
/**确定按钮*/
async function handleSubmit() {
// console.log('isMove.value', isMove.value);
if (isMove.value === 1) {
createMessage.success('移动成功！');
} else {
createMessage.success('复制成功！');
}
closeModal();
}
/**数组对象转成树*/
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;
}
</script>
src/views/dataIntegration/dataLoading/dataEntryLake/newFolder.vue 0 → 100644
View file @ b93a6ca4
<template>
<BasicModal
width="40%"
v-bind="$attrs"
@register="registerModal"
:title="getTitle"
@ok="handleSubmit"
>
<BasicForm @register="registerForm" />
<!-- <div class="modalRow">-->
<!-- <div>可见范围</div>-->
<!-- <div class="right">-->
<!-- <div class="clearAll"> 清空 </div>-->
<!-- <div>-->
<!-- <a-button type="primary">添加工作组</a-button>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="addDialogBG">-->
<!-- <div style="float: right">-->
<!-- <Icon icon="ant-design:delete-outlined" :size="25" :color="'#ED6F6F'" />-->
<!-- </div>-->
<!-- <TreeTwo class="w-1/4 xl:w-1/5" @select="handleSelect" />-->
<!-- </div>-->
</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 { formSchemaNewFolder } from './dataEntry.data';
import TreeTwo from './treeTwo.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { TreeData } from './mock';
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const isUpdate = ref(true);
const rowId = ref('');
//获取接口数据并放在下拉框里（这里是打开了一个弹框）
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 24, md: 24 },
schemas: formSchemaNewFolder,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields();
setModalProps({ confirmLoading: false });
isUpdate.value = !!data?.isUpdate;
if (unref(isUpdate)) {
// 通过id获取行详情信息
// 塞值
setFieldsValue({
...data.record,
});
}
const treeList = handleTree(TreeData, 'businessId', undefined, undefined, undefined);
updateSchema([
{
field: 'path',
componentProps: {
treeData: treeList,
},
},
]);
});
/**数组对象转成树*/
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;
}
const getTitle = computed(() => (!unref(isUpdate) ? '新建主体' : '编辑主体'));
async function handleSubmit() {
try {
const values = await validate();
setModalProps({ confirmLoading: true });
// TODO custom api
closeModal();
emit('success', { isUpdate: unref(isUpdate), values: { ...values, id: rowId.value } });
} finally {
setModalProps({ confirmLoading: false });
}
}
</script>
<style lang="scss" scoped>
.modalRow {
padding: 0 20px;
display: flex;
align-items: center;
justify-content: space-between;
.clearAll {
padding-right: 10px;
font-size: 16px;
}
.right {
display: flex;
align-items: center;
justify-content: space-between;
}
}
.addDialogBG {
margin: 10px;
border-radius: 10px;
padding: 20px;
background-color: #e8ecf7;
width: 98%;
height: 400px;
}
</style>
src/views/dataIntegration/dataLoading/dataEntryLake/offlineLoading.data.ts 0 → 100644
View file @ b93a6ca4
import { FormSchema } from '@/components/Form';
import { BasicColumn } from '@/components/Table';
export const sourceSideConfigurationFormSchema: FormSchema[] = [
{
field: 'loadType',
label: '加载方式',
component: 'RadioGroup',
defaultValue: '全量数据加载',
componentProps: {
options: [
{ label: '全量数据加载', value: '全量数据加载' },
{ label: '增量数据加载', value: '增量数据加载' },
],
},
},
{
field: 'metadataAcquisitionMode',
label: '元数据获取方式',
component: 'RadioGroup',
defaultValue: '从JDBC获取元数据',
componentProps: ({ formModel, formActionType }) => ({
onChange: () => {
const flag = formModel.metadataAcquisitionMode === '从JDBC获取元数据';
formActionType.updateSchema([{ field: 'dataBase', ifShow: flag, required: flag }]);
formActionType.updateSchema([{ field: 'metadataType', ifShow: flag, required: flag }]);
formActionType.updateSchema([{ field: 'getMetadata', ifShow: flag }]);
},
options: [
{ label: '从JDBC获取元数据', value: '从JDBC获取元数据' },
{ label: '自定义SQL', value: '自定义SQL' },
{ label: '导入元数据文件', value: '导入元数据文件' },
],
}),
},
{
field: 'dataSource',
label: '数据源',
component: 'Select',
required: true,
defaultValue: 'KunOB数据源',
componentProps: {
placeholder: '请选择数据源',
options: [
{ label: 'KunOB数据源', value: 'KunOB数据源' },
{ label: 'MongoDB数据源', value: 'MongoDB数据源' },
{ label: 'AmazonS3', value: 'AmazonS3' },
],
},
},
{
field: 'dataBase',
label: '数据库',
component: 'Cascader',
required: true,
componentProps: {
placeholder: '请选择数据源',
displayRender: ({ labels }) => {
return labels[labels.length - 1];
},
options: [
{
value: '数据库对象资源',
label: '数据库对象资源',
children: [
{
value: '数据中台工作区01',
label: '数据中台工作区01',
children: [
{
value: 'ArgoDB_Dev01',
label: 'ArgoDB_Dev01',
},
{
value: 'ArgoDB_Dev02',
label: 'ArgoDB_Dev02',
},
{
value: 'GbaseDB_Dev01',
label: 'GbaseDB_Dev01',
},
],
},
],
},
],
},
},
{
field: 'metadataType',
label: '元数据类型',
component: 'Input',
required: true,
componentProps: {
placeholder: '以,分隔输入元数据类型',
},
},
{
field: 'getMetadata',
label: ' ',
component: 'Slot',
slot: 'getMetadata',
},
{
field: 'maximumNumberOfDatabaseConnections',
label: '源库最大连接数',
component: 'Input',
componentProps: {
placeholder: '请输入源库最大连接数',
},
},
];
export const LoadingStrategyFormSchema: FormSchema[] = [
{
field: 'loadingStrategy',
label: '加载策略',
component: 'RadioGroup',
defaultValue: '基于数量',
componentProps: ({ formModel, formActionType }) => ({
onChange: () => {
const flag = formModel.loadingStrategy === '基于数量';
formActionType.updateSchema([{ field: 'quantityBasedAlert', ifShow: flag }]);
formActionType.updateSchema([{ field: 'conditionBasedAlert', ifShow: !flag }]);
},
options: [
{ label: '基于数量', value: '基于数量' },
{ label: '基于条件', value: '基于条件' },
],
}),
},
{
field: 'quantityBasedAlert',
component: 'Slot',
slot: 'quantityBasedAlert',
},
{
field: 'conditionBasedAlert',
component: 'Slot',
slot: 'conditionBasedAlert',
ifShow: false,
},
{
component: 'Divider',
},
{
field: 'customSQL',
label: '自定义SQL',
component: 'RadioGroup',
defaultValue: '否',
required: true,
componentProps: ({ formModel, formActionType }) => ({
onChange: () => {
const flag = formModel.customSQL === '否';
formActionType.updateSchema([{ field: 'filterCondition', ifShow: flag }]);
formActionType.updateSchema([{ field: 'notCustomSQLTable', ifShow: flag }]);
formActionType.updateSchema([{ field: 'querySQL', ifShow: !flag }]);
formActionType.updateSchema([{ field: 'parsingSQL', ifShow: !flag }]);
formActionType.updateSchema([{ field: 'isCustomSQLAlert', ifShow: !flag }]);
formActionType.updateSchema([{ field: 'isCustomSQLTable', ifShow: !flag }]);
},
options: [
{ label: '是', value: '是' },
{ label: '否', value: '否' },
],
}),
},
{
field: 'filterCondition',
label: '过滤条件',
component: 'InputTextArea',
componentProps: {
placeholder: '请输入',
},
},
{
field: 'notCustomSQLTable',
component: 'Slot',
slot: 'notCustomSQLTable',
},
{
field: 'querySQL',
label: '查询SQL',
component: 'InputTextArea',
componentProps: {
placeholder: '请输入',
},
ifShow: false,
},
{
field: 'parsingSQL',
label: ' ',
component: 'Slot',
slot: 'parsingSQL',
ifShow: false,
},
{
field: 'isCustomSQLAlert',
component: 'Slot',
slot: 'isCustomSQLAlert',
ifShow: false,
},
{
field: 'isCustomSQLTable',
component: 'Slot',
slot: 'isCustomSQLTable',
ifShow: false,
},
];
export const isCustomSQLColumns: BasicColumn[] = [
{
title: '列名',
dataIndex: 'fieldName',
},
{
title: '类型',
dataIndex: 'fieldType',
},
];
export const getMetadataColumns: BasicColumn[] = [
{
title: '表名',
dataIndex: 'tableName',
},
];
export const notCustomSQLColumns: BasicColumn[] = [
{
title: '列名',
dataIndex: 'fieldName',
},
{
title: '类型',
dataIndex: 'fieldType',
},
{
title: '数据转换',
dataIndex: 'dataConversion',
slots: { customRender: 'dataConversion' },
},
];
export const tableListSearchFormSchema: FormSchema[] = [
{
field: 'name',
label: ' ',
component: 'Input',
colProps: { span: 24 },
componentProps: {
placeholder: '输入关键字搜索',
},
},
];
src/views/dataIntegration/dataLoading/dataEntryLake/sceneSelectionModal.vue 0 → 100644
View file @ b93a6ca4
<template>
<BasicModal width="40%" v-bind="$attrs" @register="registerModal" title="场景选择">
<List>
<Row :gutter="16">
<template v-for="item in cardList" :key="item.title">
<Col :span="12">
<ListItem>
<Card
:hoverable="true"
class="sceneSelectionCard"
@click="handleNewModal(item.scene)"
>
<div>
<Icon
class="sceneSelectionIcon"
v-if="item.icon"
:icon="item.icon"
:color="item.color"
/>
</div>
<div class="sceneSelectionTitle">
{{ item.title }}
</div>
<div class="sceneSelectionDescription">
{{ item.description }}
</div>
</Card>
</ListItem>
</Col>
</template>
</Row>
</List>
</BasicModal>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import Icon from '@/components/Icon/Icon.vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { cardList } from './mock';
import { Card, Row, Col, List, ListItem } from 'ant-design-vue';
import { router } from '@/router';
const emit = defineEmits(['register']);
const rowId = ref('');
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async () => {});
function handleNewModal(scene) {
router.push({
path: '/dataIntegration/dataLoading/dataEntryLake/' + scene,
});
}
</script>
<style lang="scss" scoped>
.sceneSelectionCard {
height: 190px;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
}
.sceneSelectionIcon {
font-size: 40px !important;
margin-bottom: 16px;
}
.sceneSelectionTitle {
font-size: 18px;
font-weight: bold;
margin-bottom: 8px;
}
.sceneSelectionDescription {
font-size: 14px;
color: gray;
text-align: left;
}
</style>
src/views/dataIntegration/dataLoading/dataEntryLake/treeTwo.vue 0 → 100644
View file @ b93a6ca4
<template>
<div class="m-4 mr-0 overflow-hidden bg-white">
<BasicTree
title="工作组"
ref="treeRef"
toolbar
search
treeWrapperClassName="h-[calc(100%-35px)] overflow-auto"
:clickRowToExpand="true"
:checkable="true"
:defaultExpandAll="true"
:treeData="treeData"
:fieldNames="{ key: 'businessId', title: 'label' }"
@select="handleSelect"
/>
</div>
</template>
<script lang="ts" setup>
import { nextTick, onMounted, ref, unref } from 'vue';
import { BasicTree, TreeActionType, TreeItem } from '@/components/Tree';
import { getDeptList } from '@/api/system/dept/dept';
import { Nullable } from '@vben/types';
import { treeDataListTwo } from './mock';
defineOptions({ name: 'DeptTree' });
const emit = defineEmits(['select']);
const treeData = ref<TreeItem[]>([]);
const treeRef = ref<Nullable<TreeActionType>>(null);
async function fetch() {
treeData.value = treeDataListTwo;
await nextTick(() => {
getTree().expandAll(true);
});
}
function getTree() {
const tree = unref(treeRef);
if (!tree) {
throw new Error('tree is null!');
}
return tree;
}
function handleSelect(keys) {
emit('select', keys[0]);
}
onMounted(() => {
fetch();
});
</script>
<style lang="scss" scoped>
.bg-white {
width: 97%;
}
::v-deep(.vben-tree) {
background-color: #e8ecf7 !important;
}
</style>
src/views/dataQuality/dataSheet/template/index.vue
View file @ b93a6ca4
......@@ -106,7 +106,6 @@
registerTable,
{ reload, updateTableDataRecord, getSearchInfo, getForm, getRowSelection },
] = useTable({
title: '主体管理列表',
api: async (params) => {
// console.log('tableList', tableList);
const response = {
......
src/views/dataService/APIDataSecurity/sensitiveRecognition/index.vue
View file @ b93a6ca4
......@@ -142,7 +142,7 @@
// 选中节点
async function onNodeSelect(id) {
const node = TreeData.filter((item) => id === undefined || item.businessId === id);
tableTitle.value = node[0].parentWoekSpaceName;
tableTitle.value = node[0].parentWorkSpaceName;
await getForm().setFieldsValue({
path: tableTitle.value,
});
......
src/views/dataService/APIDataSecurity/sensitiveRecognition/mock.ts
View file @ b93a6ca4
......@@ -3,7 +3,7 @@ export const TreeData: any[] = [
delFlag: '0',
flag: '1',
businessId: 100,
parentWoekSpaceName: '敏感识别',
parentWorkSpaceName: '敏感识别',
workSpaceName: '敏感识别',
parentId: 0,
'code:': '001',
......@@ -18,7 +18,7 @@ export const TreeData: any[] = [
delFlag: '0',
flag: '1',
businessId: 101,
parentWoekSpaceName: 'admin-个人工作区',
parentWorkSpaceName: 'admin-个人工作区',
workSpaceName: 'admin-个人工作区',
parentId: 100,
'code:': '002',
......@@ -33,7 +33,7 @@ export const TreeData: any[] = [
delFlag: '0',
flag: '1',
businessId: 102,
parentWoekSpaceName: '共享工作区',
parentWorkSpaceName: '共享工作区',
workSpaceName: '共享工作区',
parentId: 100,
'code:': '003',
......@@ -48,7 +48,7 @@ export const TreeData: any[] = [
delFlag: '0',
flag: '0',
businessId: 103,
parentWoekSpaceName: '高级工作区',
parentWorkSpaceName: '高级工作区',
workSpaceName: '高级工作区',
parentId: 100,
'code:': '010',
......@@ -63,7 +63,7 @@ export const TreeData: any[] = [
delFlag: '0',
flag: '1',
businessId: 201,
parentWoekSpaceName: 'admin-个人工作区',
parentWorkSpaceName: 'admin-个人工作区',
workSpaceName: '独导',
parentId: 101,
'code:': '002',
......@@ -78,7 +78,7 @@ export const TreeData: any[] = [
delFlag: '0',
flag: '1',
businessId: 202,
parentWoekSpaceName: '共享工作区',
parentWorkSpaceName: '共享工作区',
workSpaceName: 'test',
parentId: 102,
'code:': '003',
......@@ -93,7 +93,7 @@ export const TreeData: any[] = [
delFlag: '0',
flag: '1',
businessId: 203,
parentWoekSpaceName: '高级工作区',
parentWorkSpaceName: '高级工作区',
workSpaceName: 'sql_api',
parentId: 103,
'code:': '003',
......@@ -108,7 +108,7 @@ export const TreeData: any[] = [
delFlag: '0',
flag: '1',
businessId: 301,
parentWoekSpaceName: 'admin-个人工作区',
parentWorkSpaceName: 'admin-个人工作区',
workSpaceName: '向导API',
parentId: 201,
'code:': '002',
......@@ -123,7 +123,7 @@ export const TreeData: any[] = [
delFlag: '0',
flag: '1',
businessId: 302,
parentWoekSpaceName: '共享工作区',
parentWorkSpaceName: '共享工作区',
workSpaceName: '托管系统',
parentId: 202,
'code:': '003',
......
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