Commit 4f02a2a4 authored by 罗林杰's avatar 罗林杰

修改数据库到数据库配置页面

parent db2df508
import {BasicColumn, FormSchema} from "@/components/Table";
import { BasicColumn, FormSchema } from '@/components/Table';
export const columns: BasicColumn[] = [
{
......@@ -268,3 +268,58 @@ export const mappingRuleConfigurationColumns: BasicColumn[] = [
slots: { customRender: 'executionSequence' },
},
];
export const dataDirectionColumns: BasicColumn[] = [
{
title: '源库',
dataIndex: 'dataBaseSource',
width: 120,
},
{
title: '目标库',
dataIndex: 'dataBaseDirection',
width: 120,
},
];
export const getMetadataColumns: BasicColumn[] = [
{
title: '数据库',
dataIndex: 'dataBase',
width: 80,
},
{
title: '表名',
dataIndex: 'tableName',
width: 120,
},
];
export const tableDetailColumns: BasicColumn[] = [
{
title: '列名',
dataIndex: 'name',
width: 80,
},
{
title: '详情',
dataIndex: 'detail',
width: 120,
},
];
export const tableDetailFormSchema: FormSchema[] = [
{
field: 'tableName',
label: '',
component: 'Select',
defaultValue: '1',
componentProps: {
showArrow: true,
mode: 'multiple',
options: [
{ label: 'id', value: '1' },
{ label: 'name', value: '2' },
{ label: 'age', value: '3' },
{ label: 'address', value: '4' },
],
},
colProps: { lg: 12, md: 12 },
},
];
......@@ -838,3 +838,159 @@ export const tableTreeData = [
sql: 'SELECT * FROM supplier_info', // 假设 supplier_info 表没有在 isCustomSQLTableList 中定义字段
},
];
export const dataDirectionData: any[] = [
{
dataBaseSource: '0a5ca1a6fd364a05961918cd97b4241d_01',
children: [
{
dataBaseSource: 'fbs 1 flashsyncA stable3.flashsync stable2',
dataBaseDirection: 'fbs 1 flashsyncA stable3.flashsync stable2',
},
{
dataBaseSource: 'fbs 1 flashsyncA stable3.flashsync stable2',
dataBaseDirection: 'fbs 1 flashsyncA stable3.flashsync stable2',
},
{
dataBaseSource: 'fbs 1 flashsyncA stable3.flashsync stable2',
dataBaseDirection: 'fbs 1 flashsyncA stable3.flashsync stable2',
},
],
dataBaseDirection: '0a5ca1a6fd364a05961918cd97b4241d_01',
},
{
dataBaseSource: '0a5ca1a6fd364a05961918cd97b4241d_02',
children: [
{
dataBaseSource: 'fbs_1_flashsyncA_stable3.flashsync_stable2',
dataBaseDirection: 'fbs_1_flashsyncA_stable3.flashsync_stable2',
},
{
dataBaseSource: 'fbs_1_flashsyncA_stable3.flashsync_stable2',
dataBaseDirection: 'fbs_1_flashsyncA_stable3.flashsync_stable2',
},
{
dataBaseSource: 'fbs_1_flashsyncA_stable3.flashsync_stable2',
dataBaseDirection: 'fbs_1_flashsyncA_stable3.flashsync_stable2',
},
],
dataBaseDirection: '0a5ca1a6fd364a05961918cd97b4241d_02',
},
{
dataBaseSource: '0a5ca1a6fd364a05961918cd97b4241d_03',
children: [
{
dataBaseSource: 'fbs_1_flashsyncA_stable3.flashsync_stable2',
dataBaseDirection: 'fbs_1_flashsyncA_stable3.flashsync_stable2',
},
{
dataBaseSource: 'fbs_1_flashsyncA_stable3.flashsync_stable2',
dataBaseDirection: 'fbs_1_flashsyncA_stable3.flashsync_stable2',
},
{
dataBaseSource: 'fbs_1_flashsyncA_stable3.flashsync_stable2',
dataBaseDirection: 'fbs_1_flashsyncA_stable3.flashsync_stable2',
},
],
dataBaseDirection: '0a5ca1a6fd364a05961918cd97b4241d_03',
},
];
export const getMetadataTableList = [
{
dataBase: 'bm_datasource1',
businessId: '12',
children: [
{
tableName: 'bm_datasource',
businessId: '0',
},
{
tableName: 'user_info',
businessId: '1',
},
{
tableName: 'customer_details',
businessId: '2',
},
],
},
{
dataBase: 'bm_datasource2',
businessId: '13',
children: [
{
tableName: 'order_history',
businessId: '3',
},
{
tableName: 'product_inventory',
businessId: '4',
},
{
tableName: 'transaction_logs',
businessId: '5',
},
{
tableName: 'employee_records',
businessId: '6',
},
],
},
{
dataBase: 'bm_datasourc3',
businessId: '14',
children: [
{
tableName: 'payment_details',
businessId: '7',
},
{
tableName: 'shipping_addresses',
businessId: '8',
},
],
},
{
dataBase: 'bm_datasource4',
businessId: '15',
children: [
{
tableName: 'invoice_data',
businessId: '9',
},
{
tableName: 'customer_feedback',
businessId: '10',
},
{
tableName: 'supplier_info',
businessId: '11',
},
],
},
];
export const tableDetailData = [
{
name: 'id',
detail: 'INT(11,0)',
},
{
name: 'name',
detail: 'VARCHAR(255,0)',
},
{
name: 'age',
detail: 'INT(11,0)',
},
{
name: 'gender',
detail: 'VARCHAR(255,0)',
},
{
name: 'address',
detail: 'VARCHAR(255,0)',
},
{
name: 'phone',
detail: 'VARCHAR(255,0)',
},
];
<template>
<BasicModal
width="35%"
v-bind="$attrs"
@register="registerModal"
title="获取元数据"
@ok="handleSubmit"
>
<div style="display: flex; justify-content: space-between">
<a-input-search style="width: 220px" />
</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 { getMetadataTableList } from './dataBaseData';
import { getMetadataColumns } from './data';
import { useMessage } from '@/hooks/web/useMessage';
const emit = defineEmits(['success', 'register']);
const unfold = ref(false);
let startId = ref();
const { createMessage } = useMessage();
let endId = ref();
let getMetadataTable = ref(getMetadataTableList);
const [registerTable, { reload, getDataSource, getRowSelection, setSelectedRowKeys }] = useTable({
api: async () => {
const response = {
pageNu: '1',
pageSize: '5',
pages: '1',
total: getMetadataTable.value.length,
code: '',
message: '',
data: getMetadataTable.value,
};
return { ...response };
},
scroll: { y: 500 },
rowKey: 'businessId',
rowSelection: true,
columns: getMetadataColumns,
showTableSetting: false,
striped: false,
showIndexColumn: false,
bordered: false,
});
//初始化弹框
const [registerModal, { closeModal }] = useModalInner(async () => {});
function handleClick() {
unfold.value = !unfold.value;
}
/**确定按钮*/
async function handleSubmit() {
createMessage.success('获取元数据成功');
closeModal();
}
function handleSelect() {
const selectedRowKeys = getRowSelection().selectedRowKeys;
const ids = ref([...selectedRowKeys]);
const dataIds = ref(getDataSource());
if (startId.value && endId.value) {
for (let i = startId.value - 1; i <= endId.value - 1 && i < getDataSource().length; i++) {
const businessId = dataIds.value[i].businessId;
if (!ids.value.includes(businessId)) {
ids.value.push(businessId);
}
}
}
setSelectedRowKeys(ids.value);
}
function handleResetInputs() {
const selectedRowKeys = getRowSelection().selectedRowKeys;
const ids = ref([...selectedRowKeys]);
const dataIds = ref(getDataSource());
if (startId.value && endId.value) {
const startIndex = startId.value - 1;
const endIndex = endId.value - 1;
// 过滤掉与 i 相等的值
const filteredIds = ids.value.filter((id) => {
for (let i = startIndex; i <= endIndex && i < getDataSource().length; i++) {
if (dataIds.value[i].businessId === id) {
return false;
}
}
return true;
});
// // 清空 startId 和 endId
// startId.value = null;
// endId.value = null;
setSelectedRowKeys(filteredIds);
}
}
</script>
<style scoped lang="scss">
.getMetadataInput {
width: 120px;
}
</style>
......@@ -19,11 +19,7 @@
<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>
......@@ -83,92 +79,45 @@
<div style="display: flex">
<BasicForm @register="registerSourceSideConfigurationForm" style="width: 30%">
<template #getMetadata>
<a-button @click="handleGetMetadata" type="primary">获取元数据</a-button>
<a-button @click="handleGetMetadata('get')" type="primary">获取元数据</a-button>
</template>
</BasicForm>
<div style="width: 20%; padding: 0 5px 5px">
<BasicTree
toolbar
search
v-if="!metadataAcquisitionModeFlag"
:checkable="true"
:actionList="actionList"
:treeData="tableTreeData"
v-model:checkedKeys="myCheckedKeys"
@select="handleSelect"
>
<template #headerTitle>
表名
<a v-if="myCheckedKeys.length > 0" @click="handleDeplys" style="margin-left: 2px"
>批量配置</a
>
<a v-else style="color: grey; margin-left: 2px">批量配置</a>
</template>
</BasicTree>
<div v-else>
<div style="display: flex; justify-content: space-between">
<strong>自定义查询SQL</strong>
<a-button type="primary" style="margin-right: 5px" @click="handleParsingSQL"
>解析SQL</a-button
>
</div>
<CodeEditor v-model:value="sql" style="height: 100%" />
</div>
</div>
<BasicForm @register="registerLoadingStrategyForm" style="width: 50%">
<template #quantityBasedAlert>
<Alert
show-icon
style="font-size: 12px"
message="基于数量的加载策略,要求在进行数据加载时,源端的表不要发生数据变更,否则可能会出现数据加载异常。"
type="info"
/>
</template>
<template #conditionBasedAlert>
<template #analysisAlter1>
<Alert
show-icon
message="基于条件的加载策略,要求选中的切分列的数据分布均匀,否则会出现数据倾斜,影响数据加载性能,其中切分的类型推荐使用数值型或时间类型,不支持字符串类型的字段作为切分列,否则也会丢数。"
type="info"
message="该模式需要在Oracle服务器上部署agent,并启动额外程序,详细请见操作手册。"
type="warning"
style="font-size: 12px"
/>
</template>
<template #isCustomSQLAlert>
<template #analysisAlter2>
<Alert
show-icon
message="自定义SQL模式下,只支持查询SQL,且无论是新增还是修改SQL都需要点击解析SQL对字段更新。"
message="该模式必须购买OGG License,且需要手动创建Xstream进程,详细请见操作手册。"
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 #isBatchCustomSQLTable>
<BasicTable @register="registerIsBatchCustomSQLTable" />
</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 #previewMetadata>
<a-button @click="handleGetMetadata('preview')" type="primary">预览</a-button>
</template>
</BasicForm>
<div v-if="tableDetail" style="width: 40%; padding: 0 5px 5px">
<div class="title">已获取元数据</div>
<div style="display: flex; justify-content: space-between">
<a-input-search style="width: 220px" />
</div>
<BasicTable @register="registerDataSourceTable" />
</div>
<div v-if="tableDetail" style="width: 40%; padding: 0 5px 5px">
<div class="title">唯一键</div>
<Alert
show-icon
message="优先自动选择主键,用户修改请确保数据唯一性。"
type="info"
style="font-size: 12px"
/>
<BasicTable @register="registerTableDetailTable" />
</div>
</div>
</TabPane>
<TabPane v-if="tabKey === '1'" key="2" tab="过滤规则">
......@@ -262,337 +211,201 @@
<!-- </BasicTable>-->
</TabPane>
<TabPane v-if="tabKey === '5'" key="10" tab="数据流向">
<Img src="src/assets/images/dataDirection.png" style="width: 1800px"/>
<Img src="src/assets/images/dataDirection.png" style="width: 1800px" />
</TabPane>
<TabPane v-if="tabKey === '5'" key="11" tab="表映射关系">
<!-- <BasicTable>-->
<!-- </BasicTable>-->
<!-- <BasicTable>-->
<!-- </BasicTable>-->
<BasicTable @register="registerDataDirectionTable" />
</TabPane>
</Tabs>
</div>
<GetMetadataModal @register="registerGetMetadataModal" />
<DeplysModal @register="registerDeplysModal" />
<AddDataConversionRuleModal @register="registerAddRuleModal" />
<DataOptionsModal @register="registerDataOptionsModal" />
<GlobalOptionsModal @register="registerGlobalOptionsModal" />
<SaveModal @register="registerSaveModal" />
<VersionManageModal @register="registerVersionManageModal" />
<RunOptionsModal @register="registerRunOptionsModal" />
</PageWrapper>
</template>
<script lang="ts" setup>
import { Tabs, TabPane, Alert, Modal } from 'ant-design-vue';
import { h, ref, onMounted } from 'vue';
import { BasicTree } from '@/components/Tree';
import { ref, onMounted } from 'vue';
import { BasicForm, FormSchema, useForm } from '@/components/Form';
import { isCustomSQLColumns, notCustomSQLColumns, mappingRuleConfigurationColumns } from './data';
import {
mappingRuleConfigurationColumns,
dataDirectionColumns,
getMetadataColumns,
tableDetailColumns,
tableDetailFormSchema,
} from './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,
isBatchCustomSQLTableList,
notCustomSQLTableList,
mappingRuleConfigurationTableList,
tableTreeData,
dataDirectionData,
getMetadataTableList,
tableDetailData,
} from './dataBaseData';
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/DeplysModal.vue';
import CodeEditor from '@/components/CodeEditor/src/CodeEditor.vue';
import GetMetadataModal from './getMetadataModal.vue';
import AddDataConversionRuleModal from '@/views/dataIntegration/dataLoading/dataEntryLake/addDataConversionRuleModal.vue';
import DataOptionsModal from '@/views/dataIntegration/dataLoading/dataEntryLake/dataOptionsModal.vue';
import GlobalOptionsModal from '@/views/dataIntegration/dataLoading/dataEntryLake/globalOptionsModal.vue';
import SaveModal from '@/views/dataIntegration/dataLoading/dataEntryLake/saveModal.vue';
import VersionManageModal from '@/views/dataIntegration/dataLoading/dataEntryLake/versionManageModal.vue';
import RunOptionsModal from '@/views/dataIntegration/dataLoading/dataEntryLake/runOptionsModal.vue';
const emit = defineEmits(['success', 'register']);
const { createMessage, createConfirm } = useMessage();
const route = useRoute();
const myCheckedKeys = ref([]);
let isCustomSQLTable = ref(isCustomSQLTableList);
let isBatchCustomSQLTable = ref(isBatchCustomSQLTableList);
let notCustomSQLTable = ref(notCustomSQLTableList);
let mappingRuleConfigurationTable = ref(mappingRuleConfigurationTableList);
let sql = ref('SELECT * FROM user_info,customer_details,order_history,product_inventory');
let metadataAcquisitionModeFlag = ref();
let customSQLFlag = ref();
let isParsingSQL = ref(false);
let loadType = ref('全量数据加载');
const selectKey = ref('0');
const tabKey = ref('1');
let getMetadataTable = ref(getMetadataTableList);
const tableDetail = ref(false);
const sourceSideConfigurationFormSchema: FormSchema[] = [
{
field: 'loadType',
label: '加载方式',
component: 'RadioGroup',
defaultValue: '全量数据加载',
componentProps: ({ formModel }) => ({
onChange: () => {
loadType.value = formModel.loadType;
},
options: [
{ label: '全量数据加载', value: '全量数据加载' },
{ label: '增量数据加载', value: '增量数据加载' },
],
}),
},
{
field: 'metadataAcquisitionMode',
label: '元数据获取方式',
component: 'RadioGroup',
defaultValue: '从JDBC获取元数据',
componentProps: ({ formModel, formActionType }) => ({
onChange: () => {
isParsingSQL.value = false;
metadataAcquisitionModeFlag.value = formModel.metadataAcquisitionMode === '自定义SQL';
const flag = !metadataAcquisitionModeFlag.value;
updateSchema([{ field: 'filterCondition', ifShow: flag && customSQLFlag.value }]);
updateSchema([{ field: 'notCustomSQLTable', ifShow: flag && customSQLFlag.value }]);
updateSchema([{ field: 'customSQL', ifShow: flag }]);
updateSchema([{ field: 'querySQL', ifShow: flag && !customSQLFlag.value }]);
updateSchema([{ field: 'parsingSQL', ifShow: flag && !customSQLFlag.value }]);
updateSchema([{ field: 'isCustomSQLAlert', ifShow: flag && !customSQLFlag.value }]);
updateSchema([
{
field: 'isCustomSQLTable',
ifShow: flag && !customSQLFlag.value && isParsingSQL.value,
},
]);
updateSchema([{ field: 'sourceDataTableName', ifShow: !flag }]);
updateSchema([{ field: 'isBatchCustomSQLTable', ifShow: !flag && isParsingSQL.value }]);
formActionType.updateSchema([{ field: 'dataBase', ifShow: flag }]);
formActionType.updateSchema([{ field: 'metadataType', ifShow: flag }]);
formActionType.updateSchema([{ field: 'getMetadata', ifShow: flag }]);
},
options: [
{ label: '从JDBC获取元数据', value: '从JDBC获取元数据' },
{ label: '自定义SQL', value: '自定义SQL' },
{ label: '导入元数据文件', value: '导入元数据文件' },
],
}),
},
{
field: 'dataSource',
label: '数据源',
field: 'sourceType',
label: '源端类型',
component: 'Select',
required: true,
defaultValue: 'KunOB数据源',
componentProps: {
placeholder: '请选择数据源',
placeholder: '请选择源端类型',
options: [
{ label: 'KunOB数据源', value: 'KunOB数据源' },
{ label: 'MongoDB数据源', value: 'MongoDB数据源' },
{ label: 'AmazonS3', value: 'AmazonS3' },
{ label: 'MYSQL', value: '1' },
{ label: 'ORACLE', value: '2' },
{ label: 'KUNDB', value: '3' },
],
},
},
{
field: 'dataBase',
label: '数据库',
component: 'Cascader',
required: true,
field: 'analysisType',
label: ' ',
component: 'Select',
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',
},
],
},
],
},
{ label: '本地解析', value: '1' },
{ label: 'Xstream', value: '2' },
],
},
ifShow: ({ model }) => model.sourceType === '2',
},
{
field: 'metadataType',
label: '元数据类型',
component: 'Input',
required: true,
componentProps: {
placeholder: '以,分隔输入元数据类型',
},
},
{
field: 'getMetadata',
field: 'version',
label: ' ',
slot: 'getMetadata',
},
{
field: 'maximumNumberOfDatabaseConnections',
label: '源库最大连接数',
component: 'Input',
component: 'Select',
componentProps: {
placeholder: '请输入源库最大连接数',
options: [
{ label: '高可用版本', value: '1' },
{ label: '分布式版本', value: '2' },
],
},
ifShow: ({ model }) => model.sourceType === '3',
},
];
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 }]);
formActionType.updateSchema([{ field: 'cutDivision', ifShow: !flag }]);
},
options: [
{ label: '基于数量', value: '基于数量' },
{ label: '基于条件', value: '基于条件' },
],
}),
field: 'analysisAlter1',
label: '',
slot: 'analysisAlter1',
ifShow: ({ model }) => model.sourceType === '2' && model.analysisType === '1',
},
{
field: 'quantityBasedAlert',
slot: 'quantityBasedAlert',
field: 'analysisAlter1',
label: '',
slot: 'analysisAlter1',
ifShow: ({ model }) => model.sourceType === '2' && model.analysisType === '2',
},
{
field: 'conditionBasedAlert',
slot: 'conditionBasedAlert',
ifShow: false,
field: 'RpcIp1',
label: 'Rpc地址',
component: 'Input',
ifShow: ({ model }) => model.sourceType === '2' && model.analysisType === '1',
},
{
field: 'cutDivision',
label: '切分列',
field: 'RpcIp2',
label: 'Rpc地址',
component: 'Input',
colProps: { lg: 11, md: 11 },
componentProps: {
placeholder: '',
},
ifShow: false,
required: true,
ifShow: ({ model }) => model.sourceType === '3' && model.version === '2',
},
{
field: 'divide',
component: 'Divider',
field: 'mysqlServer',
label: 'MYSQL server',
component: 'Input',
ifShow: ({ model }) => model.sourceType === '3' && model.version === '1',
},
{
field: 'customSQL',
label: '自定义SQL',
component: 'RadioGroup',
defaultValue: '否',
field: 'dataSource',
label: '数据源',
component: 'Select',
required: true,
componentProps: ({ formModel, formActionType }) => ({
onChange: () => {
isParsingSQL.value = false;
customSQLFlag.value = formModel.customSQL === '否';
formActionType.updateSchema([{ field: 'filterCondition', ifShow: customSQLFlag.value }]);
formActionType.updateSchema([
{ field: 'notCustomSQLTable', ifShow: customSQLFlag.value },
]);
formActionType.updateSchema([{ field: 'querySQL', ifShow: !customSQLFlag.value }]);
formActionType.updateSchema([{ field: 'parsingSQL', ifShow: !customSQLFlag.value }]);
formActionType.updateSchema([
{ field: 'isCustomSQLAlert', ifShow: !customSQLFlag.value },
]);
formActionType.updateSchema([
{ field: 'isCustomSQLTable', ifShow: !customSQLFlag.value && isParsingSQL.value },
]);
},
componentProps: {
placeholder: '请选择数据源',
options: [
{ label: '是', value: '是' },
{ label: '否', value: '否' },
{ label: 'KunOB数据源', value: '1' },
{ label: 'MongoDB数据源', value: '2' },
{ label: 'AmazonS3', value: '3' },
],
}),
},
},
{
field: 'filterCondition',
label: '过滤条件',
component: 'InputTextArea',
field: 'dataBase',
label: '数据库',
component: 'Select',
componentProps: {
placeholder: '请输入',
mode: 'multiple',
placeholder: '请选择数据源',
options: [
{ label: 'KunOBDB', value: '1' },
{ label: 'MongoDB', value: '2' },
{ label: 'AmazonS3DB', value: '3' },
],
},
},
{
field: 'notCustomSQLTable',
slot: 'notCustomSQLTable',
field: 'xstreaName',
label: 'xstream服务名称',
component: 'Input',
ifShow: ({ model }) => model.sourceType === '2' && model.analysisType === '2',
},
{
field: 'querySQL',
label: '查询SQL',
component: 'InputTextArea',
field: 'loadType',
label: '数据表获取方式',
component: 'RadioGroup',
defaultValue: '1',
componentProps: {
placeholder: '请输入',
options: [
{ label: '直接选表', value: '1' },
{ label: '规则过滤', value: '2' },
],
},
ifShow: false,
},
{
field: 'parsingSQL',
label: ' ',
slot: 'parsingSQL',
ifShow: false,
},
{
field: 'isCustomSQLAlert',
slot: 'isCustomSQLAlert',
ifShow: false,
field: 'include',
label: '包含',
component: 'InputTextArea',
ifShow: ({ model }) => model.loadType === '2',
},
{
field: 'isCustomSQLTable',
slot: 'isCustomSQLTable',
ifShow: isParsingSQL.value,
field: 'exclude',
label: '排除',
component: 'InputTextArea',
ifShow: ({ model }) => model.loadType === '2',
},
{
field: 'sourceDataTableName',
label: '源端数据表名',
component: 'Input',
colProps: { lg: 11, md: 11 },
componentProps: {
placeholder: '',
},
ifShow: false,
field: 'getMetadata',
label: ' ',
slot: 'getMetadata',
ifShow: ({ model }) => model.loadType === '1',
},
{
field: 'isBatchCustomSQLTable',
slot: 'isBatchCustomSQLTable',
ifShow: isParsingSQL.value,
field: 'previewMetadata',
label: ' ',
slot: 'previewMetadata',
ifShow: ({ model }) => model.loadType === '2',
},
];
const [registerGetMetadataModal, { openModal: openGetMetadataModal }] = useModal();
const [registerDeplysModal, { openModal: openDeplysModal }] = useModal();
const [registerAddRuleModal, { openModal: openAddRuleModal }] = useModal();
const [registerDataOptionsModal, { openModal: openDataOptionsModal }] = useModal();
const [registerGlobalOptionsModal, { openModal: openGlobalOptionsModal }] = useModal();
const [registerSaveModal, { openModal: openSaveModal }] = useModal();
const [registerVersionManageModal, { openModal: openVersionManageModal }] = useModal();
const [registerRunOptionsModal, { openModal: openRunOptionsModal }] = useModal();
const [
registerSourceSideConfigurationForm,
......@@ -612,192 +425,103 @@
},
});
const [registerLoadingStrategyForm, { updateSchema, setFieldsValue }] = useForm({
labelWidth: 180,
labelAlign: 'left',
baseColProps: { lg: 24, md: 24 },
schemas: LoadingStrategyFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
const [registerIsCustomSQLTable, { reload: isCustomSQLTableReload }] = useTable({
const [registerMappingRuleConfigurationTable, { getRowSelection }] = 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,
total: mappingRuleConfigurationTable.value.length,
code: '',
message: '',
data: isCustomSQLTable.value,
data: mappingRuleConfigurationTable.value,
};
return { ...response };
},
scroll: { y: 300 },
rowKey: 'businessId',
columns: isCustomSQLColumns,
columns: mappingRuleConfigurationColumns,
showTableSetting: false,
showIndexColumn: false,
rowSelection: true,
bordered: false,
actionColumn: {
width: 100,
title: '操作',
dataIndex: 'action',
// slots: { customRender: 'action' },
},
});
const [registerIsBatchCustomSQLTable] = useTable({
api: async () => {
const response = {
pageNu: '1',
pageSize: '5',
pages: '1',
total: isBatchCustomSQLTable.value.length,
code: '',
message: '',
data: isBatchCustomSQLTable.value,
};
return { ...response };
},
scroll: { y: 300 },
rowKey: 'businessId',
columns: isCustomSQLColumns,
showTableSetting: false,
const [registerDataDirectionTable] = useTable({
dataSource: dataDirectionData,
columns: dataDirectionColumns,
pagination: true,
showIndexColumn: false,
bordered: false,
scroll: { y: 500 },
});
const [registerNotCustomSQLTable, { reload: notCustomSQLTableReload }] = useTable({
const [registerDataSourceTable] = 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,
total: getMetadataTable.value.length,
code: '',
message: '',
data: notCustomSQLTable.value,
data: getMetadataTable.value,
};
return { ...response };
},
scroll: { y: 300 },
rowKey: 'businessId',
columns: notCustomSQLColumns,
rowSelection: true,
columns: getMetadataColumns,
showTableSetting: false,
striped: false,
showIndexColumn: false,
bordered: false,
handleSearchInfoFn(info) {
// console.log('handleSearchInfoFn', info);
return info;
},
actionColumn: {
width: 60,
title: '操作',
dataIndex: 'action',
// slots: { customRender: 'action' },
},
});
const [registerMappingRuleConfigurationTable, { getRowSelection }] = useTable({
const [registerTableDetailTable] = useTable({
api: async () => {
const response = {
pageNu: '1',
pageSize: '5',
pages: '1',
total: mappingRuleConfigurationTable.value.length,
total: tableDetailData.length,
code: '',
message: '',
data: mappingRuleConfigurationTable.value,
data: tableDetailData,
};
return { ...response };
},
formConfig: {
labelWidth: 120,
showActionButtonGroup: false,
schemas: tableDetailFormSchema,
},
useSearchForm: true,
scroll: { y: 300 },
rowKey: 'businessId',
columns: mappingRuleConfigurationColumns,
columns: tableDetailColumns,
showTableSetting: false,
striped: false,
showIndexColumn: false,
rowSelection: true,
bordered: false,
actionColumn: {
width: 100,
title: '操作',
dataIndex: 'action',
// slots: { customRender: 'action' },
},
});
const actionList = [
{
//删除
render: () => {
return h(DeleteOutlined, {
class: 'ml-2',
onClick: () => {
handleDeleteTable();
},
});
},
},
];
onMounted(() => {
setFieldsValue({
sourceDataTableName: 'user_info,customer_details,order_history,product_inventory',
});
});
// 删除节点
const handleDeleteTable = () => {
Modal.confirm({
title: '确认删除',
content: '确定要删除此表吗?',
okText: '确认',
cancelText: '取消',
onOk() {
createMessage.success('删除成功!');
},
onCancel() {
console.log('取消删除');
createMessage.info('取消删除');
},
});
};
function handleGetMetadata(type) {
tableDetail.value = true;
if (type === 'get') {
openGetMetadataModal(true);
}
}
onMounted(() => {});
function handleChangeTab(key) {
tabKey.value = key;
}
function handleDelete() {
Modal.confirm({
title: '确认删除',
content: '确认删除选中字段吗?',
okText: '确认',
cancelText: '取消',
onOk() {
createMessage.success('删除成功!');
},
onCancel() {
console.log('取消删除');
createMessage.info('取消删除');
},
});
}
function handleSelect(keys) {
isParsingSQL.value = false;
console.log('keys', getFieldsValue());
selectKey.value = keys.toString();
const querySQL = tableTreeData.filter((item) => item.key === keys.toString())[0].sql;
setFieldsValue({ querySQL: querySQL });
isCustomSQLTableReload();
notCustomSQLTableReload();
// emit('select', keys[0]);
}
function goBack() {
router.back();
}
......@@ -824,45 +548,14 @@
});
}
function handleDeplys() {
console.log('myCheckedKeys', myCheckedKeys.value);
openDeplysModal(true, {
loadType,
myCheckedKeys,
});
}
function handleGetMetadata() {
openGetMetadataModal(true);
}
function handleAddRule() {
openAddRuleModal();
}
function handleParameterConfiguration() {
openDataOptionsModal(true, {
title: '数据加载参数配置',
});
}
function handleGobalDeply() {
openGlobalOptionsModal(true, {
title: '数据加载全局配置',
});
}
function handleVersionManagement() {
openVersionManageModal(true, {
title: '数据加载版本管理',
});
}
function handleRun() {
openRunOptionsModal(true, {
title: '参数列表',
});
}
function handleConversion(record) {
createMessage.success('数据转换成功' + record.fieldType);
}
function handleEdit(record) {
createMessage.success('编辑:' + record);
......@@ -906,22 +599,6 @@
];
}
}
function handleParsingSQL() {
isParsingSQL.value = true;
updateSchema([
{
field: 'isCustomSQLTable',
ifShow: !metadataAcquisitionModeFlag.value && !customSQLFlag.value && isParsingSQL.value,
},
]);
updateSchema([
{
field: 'isBatchCustomSQLTable',
ifShow: metadataAcquisitionModeFlag.value && isParsingSQL.value,
},
]);
}
</script>
<style lang="scss" scoped>
.content-padding {
......
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