Commit 0a007e12 authored by LiXuyang's avatar LiXuyang

文件离线加载

parent cc6afbd8
...@@ -621,6 +621,15 @@ export const DataStandardRoute: AppRouteRecordRaw = { ...@@ -621,6 +621,15 @@ export const DataStandardRoute: AppRouteRecordRaw = {
icon: '', icon: '',
}, },
}, },
{
path: 'labelDropInspection/labelOperation',
name: 'labelOperation',
component: () => import('@/views/dataStandards/labelDropInspection/labelOperation/index.vue'),
meta: {
title: '任务运维',
icon: '',
},
},
{ {
path: 'labelDropInspection/labelReport', path: 'labelDropInspection/labelReport',
name: 'labelReport', name: 'labelReport',
......
...@@ -294,19 +294,7 @@ export const dataSourceFieldFormSchema: FormSchema[] = [ ...@@ -294,19 +294,7 @@ export const dataSourceFieldFormSchema: FormSchema[] = [
show: ({ model }) => { show: ({ model }) => {
return model.createTable === '是'; return model.createTable === '是';
}, },
component: 'Select', component: 'Input',
componentProps: {
options: [
{
label: 'Table1',
value: 'Table1',
},
{
label: 'Table2',
value: 'Table2',
},
],
},
}, },
]; ];
export const dataSourceTableColumn: BasicColumn[] = [ export const dataSourceTableColumn: BasicColumn[] = [
...@@ -400,6 +388,30 @@ export const dataSourceSqlFormSchema: FormSchema[] = [ ...@@ -400,6 +388,30 @@ export const dataSourceSqlFormSchema: FormSchema[] = [
], ],
}, },
}, },
{
label: '分区键',
field: 'areaKey',
show: ({ model }) => {
return model.area !== '无';
},
slot: 'areaKey',
},
{
label: '分区范围',
field: 'areaRange',
show: ({ model }) => {
return model.area === '范围分区';
},
slot: 'areaRange',
},
{
label: '分区间隔',
field: 'areaSpace',
show: ({ model }) => {
return model.area === '范围分区';
},
component: 'Input',
},
{ {
field: '', field: '',
slot: 'title2', slot: 'title2',
...@@ -422,6 +434,22 @@ export const dataSourceSqlFormSchema: FormSchema[] = [ ...@@ -422,6 +434,22 @@ export const dataSourceSqlFormSchema: FormSchema[] = [
], ],
}, },
}, },
{
label: '分桶键',
field: 'bucketKey',
component: 'Input',
show: ({ model }) => {
return model.bucket === '是';
},
},
{
label: '分桶个数',
field: 'bucketNum',
show: ({ model }) => {
return model.bucket === '是';
},
slot: 'bucketNum',
},
{ {
field: '', field: '',
slot: 'title3', slot: 'title3',
...@@ -851,3 +879,22 @@ export const headGlobalConfigSchema: FormSchema[] = [ ...@@ -851,3 +879,22 @@ export const headGlobalConfigSchema: FormSchema[] = [
colProps: { lg: 24, md: 24 }, colProps: { lg: 24, md: 24 },
}, },
]; ];
export const runOptionsColumns: BasicColumn[] = [
{
title: '参数名称',
dataIndex: 'name',
width: 120,
},
{
title: '参数类型',
dataIndex: 'type',
width: 120,
},
{
title: '参数值',
dataIndex: 'data',
width: 120,
edit: true,
editable: true,
},
];
...@@ -96,3 +96,25 @@ export const mappingRuleConfigurationTableList = [ ...@@ -96,3 +96,25 @@ export const mappingRuleConfigurationTableList = [
ruleContent: "自定义规则:field1 != 'axxc'", ruleContent: "自定义规则:field1 != 'axxc'",
}, },
]; ];
export const runOptionsData: any[] = [
{
name: 'tdt.job.cleaning',
type: '服务参数',
data: 'true',
},
{
name: 'tdt.jdbc.mapper.size',
type: '服务参数',
data: '1024',
},
{
name: 'tdt.job.mapper.count',
type: '服务参数',
data: 'true',
},
{
name: 'tdt.strict.mode',
type: '服务参数',
data: 'false',
},
];
...@@ -15,17 +15,19 @@ ...@@ -15,17 +15,19 @@
<a-button :disabled="isDebug" type="primary" @click="handleSave">保存</a-button> <a-button :disabled="isDebug" type="primary" @click="handleSave">保存</a-button>
<a-button v-if="!isDebug" type="primary" @click="handleDebug">调试</a-button> <a-button v-if="!isDebug" type="primary" @click="handleDebug">调试</a-button>
<a-button v-else type="primary" @click="handleExitDebug">退出调试</a-button> <a-button v-else type="primary" @click="handleExitDebug">退出调试</a-button>
<a-button :disabled="isDebug || !isUpload" type="primary" @click="handleRun">运行</a-button> <a-button :disabled="isDebug || !isUpload" type="primary" @click="handleRun"
>运行
</a-button>
<a-button :disabled="!isSave || isDebug" type="primary" @click="handlePublish" <a-button :disabled="!isSave || isDebug" type="primary" @click="handlePublish"
>发布</a-button >发布
> </a-button>
<a-button type="primary" @click="handleGobalDeply">全局配置</a-button> <a-button type="primary" @click="handleGobalDeply">全局配置</a-button>
<a-button type="primary" @click="handleParameterConfiguration">参数配置</a-button> <a-button type="primary" @click="handleParameterConfiguration">参数配置</a-button>
<a-button type="primary" @click="handleVersionManagement">版本管理</a-button> <a-button type="primary" @click="handleVersionManagement">版本管理</a-button>
</div> </div>
</div> </div>
</template> </template>
<template #extra> </template> <template #extra></template>
<template #footer> <template #footer>
<Tabs v-model:activeKey="activeKey"> <Tabs v-model:activeKey="activeKey">
<TabPane key="1" tab="源端配置"> <TabPane key="1" tab="源端配置">
...@@ -137,8 +139,8 @@ ...@@ -137,8 +139,8 @@
:disabled="getMappingRuleConfigurationRowSelection().selectedRowKeys <= 0" :disabled="getMappingRuleConfigurationRowSelection().selectedRowKeys <= 0"
type="primary" type="primary"
@click="handleDeleteRules" @click="handleDeleteRules"
>删除规则</a-button >删除规则
> </a-button>
<a-button type="primary" @click="handleAddRule">新增规则</a-button> <a-button type="primary" @click="handleAddRule">新增规则</a-button>
</template> </template>
<template #executionSequence="{ index }"> <template #executionSequence="{ index }">
...@@ -181,7 +183,7 @@ ...@@ -181,7 +183,7 @@
</TabPane> </TabPane>
<TabPane key="3" tab="目标端配置"> <TabPane key="3" tab="目标端配置">
<!-- 上半部分--> <!-- 上半部分-->
<BasicForm @register="dataSourceForm"> <BasicForm @register="dataSourceForm" style="margin-top: 15px">
<template #clear="{ field, model }"> <template #clear="{ field, model }">
<div class="flex"> <div class="flex">
<RadioGroup v-model:value="model[field]" :options="clearOptions" /> <RadioGroup v-model:value="model[field]" :options="clearOptions" />
...@@ -239,7 +241,9 @@ ...@@ -239,7 +241,9 @@
v-if="indexSelect" v-if="indexSelect"
style="display: flex; align-items: center; gap: 5px; margin-top: 5px" style="display: flex; align-items: center; gap: 5px; margin-top: 5px"
> >
<a-input v-model:value="startIndex" style="width: 60px" />
<a-input v-model:value="startIndex" style="width: 60px" />
<a-input v-model:value="endIndex" style="width: 60px" /> <a-input v-model:value="endIndex" style="width: 60px" />
<a-button @click="handleSelectIndex">选择</a-button> <a-button @click="handleSelectIndex">选择</a-button>
<a-button @click="handleResetIndex">清空</a-button> <a-button @click="handleResetIndex">清空</a-button>
...@@ -250,14 +254,15 @@ ...@@ -250,14 +254,15 @@
type="primary" type="primary"
:disabled="getDataSourceRowSelection().selectedRowKeys <= 0" :disabled="getDataSourceRowSelection().selectedRowKeys <= 0"
@click="handlePartitionedDataProcessing" @click="handlePartitionedDataProcessing"
>分区数据处理</a-button >分区数据处理
> </a-button>
<a-button @click="handleBatchScaleNameMapping">批量表名映射</a-button> <a-button @click="handleBatchScaleNameMapping">批量表名映射</a-button>
</div> </div>
</div> </div>
</template> </template>
<template #source="{ text, record }"> <template #source="{ text, record }">
<TableOutlined /><span>{{ text }}</span> <TableOutlined style="margin-right: 10px" />
<span>{{ text }}</span>
</template> </template>
<template #target="{ text, record }"> <template #target="{ text, record }">
<Input v-model:value="record.target" /> <Input v-model:value="record.target" />
...@@ -273,8 +278,8 @@ ...@@ -273,8 +278,8 @@
<BasicTable v-else @register="dataSourceFieldTable"> <BasicTable v-else @register="dataSourceFieldTable">
<template #toolbar> <template #toolbar>
<a-button type="primary" @click="handlePartitionedDataProcessing" <a-button type="primary" @click="handlePartitionedDataProcessing"
>分区数据处理</a-button >分区数据处理
> </a-button>
<a-button type="primary">导入映射文件</a-button> <a-button type="primary">导入映射文件</a-button>
<a-button type="primary">导出文件</a-button> <a-button type="primary">导出文件</a-button>
</template> </template>
...@@ -314,9 +319,43 @@ ...@@ -314,9 +319,43 @@
<template #title1> <template #title1>
<span style="font-weight: bolder">分区配置</span> <span style="font-weight: bolder">分区配置</span>
</template> </template>
<!-- 分区键 -->
<template #areaKey="{ field, model }">
<div class="areaKey" v-for="(item, index) in areaKeyList" :key="item">
<Input class="sqlForm-field" v-model:value="item.field" />
<Select
class="sqlForm-type"
v-model:value="item.type"
:options="sqlFormTypeOptions"
/>
<DeleteOutlined class="sqlForm-icon" @click="handleSqlAreaKeyRemove(index)" />
</div>
<a-button type="primary" @click="handleSqlAreaKeyAdd"
><PlusOutlined />添加分区键</a-button
>
</template>
<!-- 分区范围 -->
<template #areaRange="{ field, model }">
<div class="areaKey" v-for="(item, index) in areaRangeList" :key="item">
<Input class="sqlForm-field" v-model:value="item.field" />
<Input
class="sqlForm-condition"
v-model:value="item.type"
:options="sqlFormTypeOptions"
/>
<DeleteOutlined class="sqlForm-icon" @click="handleSqlAreaRangeRemove(index)" />
</div>
<a-button type="primary" @click="handleSqlAreaRangeAdd"
><PlusOutlined />添加分区键</a-button
>
</template>
<template #title2> <template #title2>
<span style="font-weight: bolder">分桶配置</span> <span style="font-weight: bolder">分桶配置</span>
</template> </template>
<template #bucketNum="{ field, model }">
<Input v-model:value="model[field]" />
<div class="bucketNum-txt"> 分桶数量推荐为除31以外的质数 </div>
</template>
<template #title3> <template #title3>
<span style="font-weight: bolder">其他配置</span> <span style="font-weight: bolder">其他配置</span>
</template> </template>
...@@ -338,8 +377,8 @@ ...@@ -338,8 +377,8 @@
<div style="display: flex; justify-content: space-between"> <div style="display: flex; justify-content: space-between">
<strong>自定义查询SQL</strong> <strong>自定义查询SQL</strong>
<a-button type="primary" style="margin-right: 5px" @click="handleSqlPreview" <a-button type="primary" style="margin-right: 5px" @click="handleSqlPreview"
>切换至配置项</a-button >切换至配置项
> </a-button>
</div> </div>
<CodeEditor <CodeEditor
v-model:value="sqlTxt" v-model:value="sqlTxt"
...@@ -393,7 +432,7 @@ ...@@ -393,7 +432,7 @@
<GlobalOptionsModal @register="registerGlobalOptionsModal" /> <GlobalOptionsModal @register="registerGlobalOptionsModal" />
<DataOptionsModal @register="registerDataOptionsModal" /> <DataOptionsModal @register="registerDataOptionsModal" />
<VersionManageModal @register="registerVersionManageModal" /> <VersionManageModal @register="registerVersionManageModal" />
<RunOptionsModal @register="registerRunOptionsModal" /> <RunOptionsModal @register="registerRunOptionsModal" @success="RunOptionsSuccess" />
</PageWrapper> </PageWrapper>
</template> </template>
...@@ -418,6 +457,7 @@ ...@@ -418,6 +457,7 @@
SearchOutlined, SearchOutlined,
TableOutlined, TableOutlined,
LeftOutlined, LeftOutlined,
PlusOutlined,
} from '@ant-design/icons-vue'; } from '@ant-design/icons-vue';
import Icon from '@/components/Icon/Icon.vue'; import Icon from '@/components/Icon/Icon.vue';
import { useModal } from '@/components/Modal'; import { useModal } from '@/components/Modal';
...@@ -474,7 +514,7 @@ ...@@ -474,7 +514,7 @@
import DataOptionsModal from '@/views/dataIntegration/dataLoading/dataEntryLake/dataOptionsModal.vue'; import DataOptionsModal from '@/views/dataIntegration/dataLoading/dataEntryLake/dataOptionsModal.vue';
import VersionManageModal from '@/views/dataIntegration/dataLoading/dataEntryLake/versionManageModal.vue'; import VersionManageModal from '@/views/dataIntegration/dataLoading/dataEntryLake/versionManageModal.vue';
import PartitionDataHandleModal from '@/views/dataIntegration/dataLoading/fileLoading/partitionDataHandleModal.vue'; import PartitionDataHandleModal from '@/views/dataIntegration/dataLoading/fileLoading/partitionDataHandleModal.vue';
import RunOptionsModal from '@/views/dataIntegration/dataLoading/dataEntryLake/runOptionsModal.vue'; import RunOptionsModal from '@/views/dataIntegration/dataLoading/fileLoading/runOptionsModal.vue';
const [registerSaveModal, { openModal: openSaveModal }] = useModal(); const [registerSaveModal, { openModal: openSaveModal }] = useModal();
const [registerGlobalOptionsModal, { openModal: openGlobalOptionsModal }] = useModal(); const [registerGlobalOptionsModal, { openModal: openGlobalOptionsModal }] = useModal();
...@@ -483,15 +523,25 @@ ...@@ -483,15 +523,25 @@
const [partitionDataHandleModal, { openModal: openPartitionDataHandleModal }] = useModal(); const [partitionDataHandleModal, { openModal: openPartitionDataHandleModal }] = useModal();
const [registerRunOptionsModal, { openModal: openRunOptionsModal }] = useModal(); const [registerRunOptionsModal, { openModal: openRunOptionsModal }] = useModal();
const isSave = ref(false); const isSave = ref(false);
async function handleSave() { async function handleSave() {
createMessage.success('保存成功'); createMessage.success('保存成功');
isSave.value = true; isSave.value = true;
} }
function goBack() { function goBack() {
router.back(); router.back();
} }
const isDebug = ref(false); const isDebug = ref(false);
function handleDebug() { function RunOptionsSuccess(data) {
if (data.isDebug) {
successDebug();
} else {
createMessage.success('运行成功')!
}
}
function successDebug() {
isDebug.value = true; isDebug.value = true;
activeKey.value = '4'; activeKey.value = '4';
tabularPresentationTable.value = [ tabularPresentationTable.value = [
...@@ -538,38 +588,54 @@ ...@@ -538,38 +588,54 @@
]; ];
reloadTabularPresentationTable(); reloadTabularPresentationTable();
} }
function handleDebug() {
openRunOptionsModal(true, {
title: '参数列表',
isDebug: true,
});
}
function handleExitDebug() { function handleExitDebug() {
isDebug.value = false; isDebug.value = false;
} }
function handlePublish() { function handlePublish() {
openSaveModal(true, { openSaveModal(true, {
title: '发布新版本', title: '发布新版本',
}); });
} }
const isUpload = ref(false); const isUpload = ref(false);
function handleSaveSuccess() { function handleSaveSuccess() {
isUpload.value = true; isUpload.value = true;
} }
function handleGobalDeply() { function handleGobalDeply() {
openGlobalOptionsModal(true, { openGlobalOptionsModal(true, {
title: '数据加载全局配置', title: '数据加载全局配置',
}); });
} }
function handleRun() { function handleRun() {
openRunOptionsModal(true, { openRunOptionsModal(true, {
title: '参数列表', title: '参数列表',
}); });
} }
function handleParameterConfiguration() { function handleParameterConfiguration() {
openDataOptionsModal(true, { openDataOptionsModal(true, {
title: '数据加载参数配置', title: '数据加载参数配置',
}); });
} }
function handleVersionManagement() { function handleVersionManagement() {
openVersionManageModal(true, { openVersionManageModal(true, {
title: '版本管理', title: '版本管理',
}); });
} }
const key = ref(''); const key = ref('');
const activeKey = ref('1'); const activeKey = ref('1');
const modelName = ref('文件离线加载'); const modelName = ref('文件离线加载');
...@@ -663,9 +729,11 @@ ...@@ -663,9 +729,11 @@
}, },
]); ]);
const seniorConfig = ref(false); const seniorConfig = ref(false);
function handleSeniorConfig() { function handleSeniorConfig() {
seniorConfig.value = !seniorConfig.value; seniorConfig.value = !seniorConfig.value;
} }
// 高级配置-切换 点击tabs3 获取tab1的状态 // 高级配置-切换 点击tabs3 获取tab1的状态
// function getFileLoadingType() { // function getFileLoadingType() {
// const form = getFileFormValue(); // const form = getFileFormValue();
...@@ -719,9 +787,11 @@ ...@@ -719,9 +787,11 @@
}, },
]; ];
const createTable = ref('否'); const createTable = ref('否');
function changeCreateTable(value) { function changeCreateTable(value) {
createTable.value = value; createTable.value = value;
} }
const [dataSourceFieldForm, { getFieldsValue: getDataSourceFieldValue }] = useForm({ const [dataSourceFieldForm, { getFieldsValue: getDataSourceFieldValue }] = useForm({
labelWidth: 120, labelWidth: 120,
baseColProps: { lg: 24, md: 24 }, baseColProps: { lg: 24, md: 24 },
...@@ -740,12 +810,48 @@ ...@@ -740,12 +810,48 @@
const sqlPreview = ref(false); const sqlPreview = ref(false);
const sqlTxt = ref(''); const sqlTxt = ref('');
const sqlDisabled = ref(true); const sqlDisabled = ref(true);
const sqlFormTypeOptions = [
{
label: 'STRING',
value: 'STRING',
},
{
label: 'INT',
value: 'INT',
},
{
label: 'DATETIME',
value: 'DATETIME',
},
{
label: 'CHAR',
value: 'CHAR',
},
{
label: 'BOOLEAN',
value: 'BOOLEAN',
},
];
function handleSqlPreview() { function handleSqlPreview() {
const value = getDataSourceFieldValue(); const value = getDataSourceFieldValue();
sqlTxt.value = 'CREATE TABLE ' + value.tableName; sqlTxt.value = 'CREATE TABLE ' + value.tableName;
sqlPreview.value = !sqlPreview.value; sqlPreview.value = !sqlPreview.value;
sqlDisabled.value = false; sqlDisabled.value = false;
} }
const areaKeyList = ref([{}]);
const areaRangeList = ref([{}]);
function handleSqlAreaKeyRemove(index) {
areaKeyList.value.splice(index, 1);
}
function handleSqlAreaKeyAdd() {
areaKeyList.value.push({});
}
function handleSqlAreaRangeRemove(index) {
areaRangeList.value.splice(index, 1);
}
function handleSqlAreaRangeAdd() {
areaRangeList.value.push({});
}
const [dataSourceSqlForm] = useForm({ const [dataSourceSqlForm] = useForm({
labelWidth: 60, labelWidth: 60,
baseColProps: { lg: 24, md: 24 }, baseColProps: { lg: 24, md: 24 },
...@@ -824,6 +930,7 @@ ...@@ -824,6 +930,7 @@
}, },
]; ];
const showFileTable = ref(false); const showFileTable = ref(false);
function handleTableDelete() { function handleTableDelete() {
createConfirm({ createConfirm({
iconType: 'warning', iconType: 'warning',
...@@ -834,6 +941,7 @@ ...@@ -834,6 +941,7 @@
}, },
}); });
} }
const [fileTable, { reload: fileReload }] = useTable({ const [fileTable, { reload: fileReload }] = useTable({
api: async () => { api: async () => {
const response = { const response = {
...@@ -854,22 +962,27 @@ ...@@ -854,22 +962,27 @@
showIndexColumn: false, showIndexColumn: false,
bordered: false, bordered: false,
}); });
// tabs2 // tabs2
function handleDeleteRules() { function handleDeleteRules() {
createMessage.success( createMessage.success(
'批量删除数据转换规则成功' + getMappingRuleConfigurationRowSelection().selectedRowKeys, '批量删除数据转换规则成功' + getMappingRuleConfigurationRowSelection().selectedRowKeys,
); );
} }
const [registerAddRuleModal, { openModal: openAddRuleModal }] = useModal(); const [registerAddRuleModal, { openModal: openAddRuleModal }] = useModal();
function handleAddRule() { function handleAddRule() {
openAddRuleModal(); openAddRuleModal();
} }
function handleMoveTop(source) { function handleMoveTop(source) {
[mappingRuleConfigurationTable.value[source], mappingRuleConfigurationTable.value[0]] = [ [mappingRuleConfigurationTable.value[source], mappingRuleConfigurationTable.value[0]] = [
mappingRuleConfigurationTable.value[0], mappingRuleConfigurationTable.value[0],
mappingRuleConfigurationTable.value[source], mappingRuleConfigurationTable.value[source],
]; ];
} }
function handleMoveDown(source) { function handleMoveDown(source) {
if (mappingRuleConfigurationTable.value[source + 1]) { if (mappingRuleConfigurationTable.value[source + 1]) {
[ [
...@@ -881,6 +994,7 @@ ...@@ -881,6 +994,7 @@
]; ];
} }
} }
function handleMoveUp(source) { function handleMoveUp(source) {
if (mappingRuleConfigurationTable.value[source - 1]) { if (mappingRuleConfigurationTable.value[source - 1]) {
[ [
...@@ -892,12 +1006,15 @@ ...@@ -892,12 +1006,15 @@
]; ];
} }
} }
function handleEdit(record) { function handleEdit(record) {
createMessage.success('编辑:' + record); createMessage.success('编辑:' + record);
} }
function handleDeleteRule(record) { function handleDeleteRule(record) {
createMessage.success('删除规则成功' + record); createMessage.success('删除规则成功' + record);
} }
let mappingRuleConfigurationTable = ref(mappingRuleConfigurationTableList); let mappingRuleConfigurationTable = ref(mappingRuleConfigurationTableList);
const [ const [
registerMappingRuleConfigurationTable, registerMappingRuleConfigurationTable,
...@@ -932,25 +1049,33 @@ ...@@ -932,25 +1049,33 @@
// tabs3 // tabs3
const dataSourceKey = ref(''); const dataSourceKey = ref('');
const indexSelect = ref(false); const indexSelect = ref(false);
function handlePartitionedDataProcessing() { function handlePartitionedDataProcessing() {
openPartitionDataHandleModal(); openPartitionDataHandleModal();
} }
const [registerClearConfigurationModal, { openModal: openClearConfigurationModal }] = useModal(); const [registerClearConfigurationModal, { openModal: openClearConfigurationModal }] = useModal();
function handleClearConfiguration(record) { function handleClearConfiguration(record) {
openClearConfigurationModal(true, { openClearConfigurationModal(true, {
sourceTableName: record.source, sourceTableName: record.source,
}); });
} }
const [registerBatchScaleNameMappingModal, { openModal: openBatchScaleNameMappingModal }] = const [registerBatchScaleNameMappingModal, { openModal: openBatchScaleNameMappingModal }] =
useModal(); useModal();
function handleBatchScaleNameMapping() { function handleBatchScaleNameMapping() {
openBatchScaleNameMappingModal(); openBatchScaleNameMappingModal();
} }
const startIndex = ref(); const startIndex = ref();
const endIndex = ref(); const endIndex = ref();
function handleIndexSelect() { function handleIndexSelect() {
indexSelect.value = !indexSelect.value; indexSelect.value = !indexSelect.value;
} }
function handleSelectIndex() { function handleSelectIndex() {
const start = const start =
startIndex.value > dataSourceData.length ? dataSourceFieldData.length : startIndex.value; startIndex.value > dataSourceData.length ? dataSourceFieldData.length : startIndex.value;
...@@ -959,11 +1084,13 @@ ...@@ -959,11 +1084,13 @@
const sublist = dataSourceData.slice(start - 1, end); const sublist = dataSourceData.slice(start - 1, end);
setDataSourceRows([...sublist]); setDataSourceRows([...sublist]);
} }
function handleResetIndex() { function handleResetIndex() {
startIndex.value = null; startIndex.value = null;
endIndex.value = null; endIndex.value = null;
setDataSourceRows([]); setDataSourceRows([]);
} }
const [ const [
dataSourceTable, dataSourceTable,
{ getRowSelection: getDataSourceRowSelection, setSelectedRows: setDataSourceRows }, { getRowSelection: getDataSourceRowSelection, setSelectedRows: setDataSourceRows },
...@@ -1011,9 +1138,11 @@ ...@@ -1011,9 +1138,11 @@
} as BasicTableProps); } as BasicTableProps);
// tabs 4 // tabs 4
const [registerViewLogsModal, { openModal: openViewLogsModal }] = useModal(); const [registerViewLogsModal, { openModal: openViewLogsModal }] = useModal();
function handleViewLogs() { function handleViewLogs() {
openViewLogsModal(true); openViewLogsModal(true);
} }
let tabularPresentationTable = ref(tabularPresentationTableList); let tabularPresentationTable = ref(tabularPresentationTableList);
const [ const [
registerTabularPresentationTable, registerTabularPresentationTable,
...@@ -1114,32 +1243,59 @@ ...@@ -1114,32 +1243,59 @@
gap: 10px; gap: 10px;
} }
} }
.header { .header {
display: flex; display: flex;
.title { .title {
display: flex; display: flex;
flex: 1; flex: 1;
gap: 10px; gap: 10px;
.icon-back { .icon-back {
font-size: 20px; font-size: 20px;
} }
.icon-base { .icon-base {
font-size: 30px !important; font-size: 30px !important;
color: #9064e9; color: #9064e9;
} }
.txt { .txt {
.txt-title { .txt-title {
font-size: 18px; font-size: 18px;
} }
.txt-des { .txt-des {
font-size: 14px; font-size: 14px;
color: #808080; color: #808080;
} }
} }
} }
.button-group { .button-group {
display: flex; display: flex;
gap: 10px; gap: 10px;
} }
} }
.areaKey {
display: flex;
gap: 10px;
margin-bottom: 15px;
.sqlForm-field {
flex: 2;
}
.sqlForm-type {
flex: 1;
}
.sqlForm-condition {
flex: 2;
}
.sqlForm-icon {
font-size: 18px;
}
}
.bucketNum-txt {
color: #8c8c8c;
}
</style> </style>
<template>
<BasicModal
width="55%"
v-bind="$attrs"
@register="registerModal"
:title="title"
@ok="handleSubmit"
>
<BasicTable @register="registerTable" />
</BasicModal>
</template>
<script lang="ts" setup>
import { onMounted, ref } from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { useMessage } from '@/hooks/web/useMessage';
import { BasicTable, useTable } from '@/components/Table';
import { runOptionsColumns } from '@/views/dataIntegration/dataLoading/fileLoading/file.data';
import { runOptionsData } from '@/views/dataIntegration/dataLoading/fileLoading/fileData';
defineOptions({ name: 'KnowledgeModal' });
let isDebug = false;
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const title = ref();
const tableData = ref([]);
//获取接口数据并放在下拉框里(这里是打开了一个弹框)
//初始化表单
const [registerTable, { reload }] = useTable({
api: async () => {
const response = {
pageNum: '1',
pageSize: '10',
pages: '1',
total: tableData.value.length,
code: '',
message: '',
data: [],
};
//过滤data中的数据,取出等于params.deptId的数据
var data = [];
data = tableData.value;
return { ...response, data: data };
},
pagination: false,
columns: runOptionsColumns,
useSearchForm: false,
showTableSetting: false,
bordered: true,
showIndexColumn: false,
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
await reload();
setModalProps({ confirmLoading: false });
isDebug = data.isDebug;
title.value = data.title;
});
async function handleSubmit() {
closeModal();
emit('success', {
isDebug: isDebug,
});
}
onMounted(() => {
tableData.value = runOptionsData;
});
</script>
<template>
<PageWrapper dense contentFullHeight fixedHeight>
<template #headerContent>
<div class="header">
<div class="title"> 所有数据质量任务 </div>
<Select
mode="multiple"
:max-tag-count="1"
class="select"
v-model:value="queryParams.searchArea"
:options="searchOptions"
/>
</div>
</template>
<template #footer>
<div class="search">
<div class="query">
<RadioGroup class="group" v-model:value="queryParams.timeType">
<RadioButton class="button" value="调度时间">调度时间</RadioButton>
<RadioButton class="button" value="执行时间">执行时间</RadioButton>
</RadioGroup>
<Select class="select" v-model:value="queryParams.days" :options="daysOptions" />
<div class="label">发布状态</div>
<Select
class="select"
v-model:value="queryParams.uploadStatus"
:options="uploadStatusOptions"
/>
<div class="label">检查结果</div>
<Select class="select" v-model:value="queryParams.result" :options="resultOptions" />
<div class="label">执行模式</div>
<Select class="select" v-model:value="queryParams.runType" :options="runTypeOptions" />
</div>
<div class="extra">
<a-button class="refresh"><SyncOutlined />刷新</a-button>
</div>
</div>
<div class="h-tabs">
<div class="tab-chart"></div>
<div
class="tab-txt"
:class="{ active: checked === index }"
@click="handleTabs(index)"
v-for="(item, index) in headList"
:key="item"
>
<div class="txt-num">
{{ item.num }}
</div>
<div class="txt-des">
<Icon v-if="item.icon" :icon="item.icon" class="des-icon" />
<span class="des-span">
{{ item.des }}
</span>
</div>
</div>
</div>
<div class="detail">
<div class="table">
<div class="column">
<Checkbox class="checkBox" />
<Icon class="icon" />
<div class="txt">
<div class="title">
</div>
<div class="des">
</div>
</div>
<div class="type">
</div>
<div class="num">
</div>
</div>
</div>
</div>
</template>
</PageWrapper>
</template>
<script lang="ts" setup>
import { Select, RadioGroup, RadioButton, Checkbox } from 'ant-design-vue';
import { SyncOutlined } from '@ant-design/icons-vue';
import {
searchOptions,
daysOptions,
uploadStatusOptions,
resultOptions,
runTypeOptions,
headList,
} from './operationData';
import PageWrapper from '@/components/Page/src/PageWrapper.vue';
import { ref } from 'vue';
import Icon from '@/components/Icon/Icon.vue';
import BasicTable from '@/components/Table/src/BasicTable.vue';
import { useTable } from '@/components/Table';
import { tableListtab1 } from '@/views/auditLog/mock';
import { columns, searchFormSchema } from '@/views/auditLog/audi.data';
// 初始化
const queryParams = ref({
searchArea: [],
timeType: '调度时间',
days: '最近30d',
uploadStatus: '全部',
result: '不限',
runType: '全部',
});
const checked = ref(0);
// 数据
/**
* 方法
*/
// 选中tab标签类型
function handleTabs(index) {
checked.value = index;
// 更新数据
}
/**
* 列表
*/
</script>
<style scoped>
.header {
display: flex;
gap: 10px;
.title {
font-size: 18px;
}
.select {
width: 250px;
}
}
.search {
display: flex;
.query {
display: flex;
gap: 10px;
flex: 1;
.group {
.button {
}
}
.select {
width: 120px;
}
.label {
width: 60px;
display: flex;
align-items: center;
}
}
.extra {
.refresh {
}
}
}
.h-tabs {
display: flex;
justify-content: center;
gap: 20px;
margin: 20px 0;
.tab-chart {
width: 200px;
height: 100px;
}
.tab-txt {
width: 160px;
padding: 10px 0 10px 15px;
cursor: pointer;
.txt-num {
font-size: 20px;
font-weight: bolder;
}
.txt-des {
margin-top: 10px;
}
}
.active {
background-color: #f4f7fb;
border-bottom: 2px solid #319ffd;
}
}
</style>
export const searchOptions = [
{
label: '个人工作区',
value: '个人工作区',
},
{
label: '共享工作区',
value: '共享工作区',
},
];
export const daysOptions = [
{
label: '最近30d',
value: '最近30d',
},
{
label: '最近7d',
value: '最近7d',
},
];
export const uploadStatusOptions = [
{
label: '全部',
value: '全部',
},
{
label: '成功',
value: '成功',
},
{
label: '运行中',
value: '运行中',
},
{
label: '失败',
value: '失败',
},
{
label: '等待',
value: '等待',
},
];
export const resultOptions = [
{
label: '不限',
value: '不限',
},
{
label: '合格',
value: '合格',
},
{
label: '不合格',
value: '不合格',
},
];
export const runTypeOptions = [
{
label: '全部',
value: '全部',
},
{
label: '重跑',
value: '重跑',
},
{
label: '手动执行',
value: '手动执行',
},
];
export const headList = [
{
num: 29,
des: '执行成功',
},
{
num: 10,
des: '成功',
icon: 'ant-design:check-circle-outlined',
},
{
num: 0,
des: '运行中',
icon: 'ant-design:check-circle-outlined',
},
{
num: 19,
des: '失败',
icon: 'ant-design:check-circle-outlined',
},
{
num: 0,
des: '等待',
icon: 'ant-design:check-circle-outlined',
},
];
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