Skip to content

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

Merge remote-tracking branch 'origin/master'

parents 93890e5e fbd58c4b
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 2593 additions and 455 deletions
src/views/dataIntegration/dataLoading/fileLoading/file.data.ts 0 → 100644
View file @ 7fc04ad0
import {FormSchema} from "@/components/Form";
import {BasicColumn} from "@/components/Table";
export const fileUploadSchema: FormSchema[] = [
{
label: '文件位置',
field: 'type',
defaultValue: '本地',
component: 'RadioGroup',
componentProps: {
options: [
{
label: '本地',
value: '本地',
},
{
label: '文件系统',
value: '文件系统',
},
],
},
},
{
label: '文件存储地址',
field: 'address',
show: ({ model }) => {
return model.type === '本地';
},
component: 'Select',
componentProps: {
options: [
{
label: '65_hdfs',
value: '65_hdfs',
},
],
},
},
{
label: '上传文件',
field: 'file',
show: ({ model }) => {
return model.type === '本地';
},
slot: 'file',
},
{
label: '选择加载方式',
field: 'loadingType',
show: ({ model }) => {
return model.type === '文件系统';
},
defaultValue: '全量文件加载',
component: 'RadioGroup',
componentProps: {
options: [
{
label: '全量文件加载',
value: '全量文件加载',
},
{
label: '增量文件加载',
value: '增量文件加载',
},
],
},
},
{
label: '数据源',
field: 'dataSource',
show: ({ model }) => {
return model.type === '文件系统';
},
component: 'Select',
componentProps: {
options: [
{
label: '088-hdfs',
value: '088-hdfs',
},
],
},
},
{
label: '路径',
field: 'path',
show: ({ model }) => {
return model.type === '文件系统';
},
slot: 'path',
},
{
label: '文件过滤(选填)',
field: 'filter',
show: ({ model }) => {
return model.type === '文件系统';
},
component: 'Input',
componentProps: {
placeholder: '包含完整路径的文件名正则表达式，例如/hadoop/data_*',
},
},
{
label: '列分隔符',
field: 'delimiter',
show: ({ model }) => {
return model.fileType !== 'excel';
},
component: 'Input',
},
{
label: '列起止符',
field: 'startStop',
show: ({ model }) => {
return model.fileType !== 'excel';
},
component: 'Input',
},
{
label: '编码格式',
field: 'encoding',
show: ({ model }) => {
return model.fileType !== 'excel';
},
component: 'Input',
},
{
label: '导入sheet名称',
field: 'sheet',
show: ({ model }) => {
return model.type === '本地' && model.fileType === 'excel';
},
slot: 'sheet',
},
{
label: '是否包含表头',
field: 'head',
defaultValue: '是',
component: 'RadioGroup',
componentProps: {
options: [
{
label: '是',
value: '是',
},
{
label: '否',
value: '否',
},
],
},
},
{
label: '表头起止行数',
field: 'header',
show: ({ model }) => {
return model.type === '本地' && model.fileType === 'excel' && model.head === '是';
},
required: true,
slot: 'header',
},
{
label: '数据起止行数',
field: 'row',
show: ({ model }) => {
return model.type === '本地' && model.fileType === 'excel';
},
required: true,
slot: 'row',
},
{
label: '文件起止列数',
field: 'column',
show: ({ model }) => {
return model.type === '本地' && model.fileType === 'excel';
},
required: true,
slot: 'column',
},
];
export const fileTableColumn: BasicColumn[] = [
{
dataIndex: 'c1',
},
{
dataIndex: 'c2',
},
{
dataIndex: 'c3',
},
{
dataIndex: 'c4',
},
{
dataIndex: 'c5',
},
{
dataIndex: 'c6',
},
{
dataIndex: 'c7',
},
{
dataIndex: 'c8',
},
{
dataIndex: 'c9',
},
{
dataIndex: 'c10',
},
]
src/views/dataIntegration/dataLoading/fileLoading/fileData.ts 0 → 100644
View file @ 7fc04ad0
export const fileData = [
{
c1: '100',
c2: '1132',
c3: '',
c4: '',
c5: '1.1',
c6: '',
c7: '',
c8: '',
c9: '',
c10: '',
},
{
c1: '101',
c2: '1200',
c3: '',
c4: '',
c5: '1.1',
c6: '',
c7: '',
c8: '',
c9: '',
c10: '',
},
{
c1: '102',
c2: '1200',
c3: '',
c4: '',
c5: '1.1',
c6: '',
c7: '',
c8: '',
c9: '',
c10: '',
},
{
c1: '103',
c2: '1200',
c3: '',
c4: '',
c5: '1.1',
c6: '',
c7: '',
c8: '',
c9: '',
c10: '',
},
];
src/views/dataIntegration/dataLoading/fileLoading/index.vue 0 → 100644
View file @ 7fc04ad0
<template>
<PageWrapper :title="modelName" contentBackground headerSticky>
<template #footer>
<Tabs v-model:activeKey="activeKey">
<TabPane key="1" tab="源端配置">
<div style="display: flex">
<BasicForm class="w-1/3" @register="fileForm">
<template #file="{ field, model }">
<Upload
v-model:file-list="fileList"
name="file"
:headers="headers"
@change="handleChange(model)"
:max-count="1"
>
<a-button>
<UploadOutlined />
上传文件
</a-button>
</Upload>
<span style="color: #dbdcdd; font-size: 12px">仅支持上传单个文件或zip包</span>
</template>
<template #path="{ field, model }">
<div style="display: flex">
<Input v-model:value="model[field]" />
<a-button type="primary">浏览</a-button>
</div>
<div>
<span style="color: #a8adba">可选择路径或手动输入带参数路径，例：/root/${*}</span>
</div>
</template>
<template #sheet="{ field, model }">
<div style="display: flex">
<Input class="pointer-events-none" v-model:value="model.fileName" />
<Input class="pointer-events-none" v-model:value="model.sheetName" />
</div>
</template>
<template #header="{ field, model }">
<div style="display: flex">
<Input v-model:value="model.startHeader" />
<span style="font-size: 18px; margin: 0 5px">~</span>
<Input v-model:value="model.endHeader" />
</div>
</template>
<template #row="{ field, model }">
<div style="display: flex">
<Input v-model:value="model.startRow" />
<span style="font-size: 18px; margin: 0 5px">~</span>
<Input v-model:value="model.endRow" />
</div>
</template>
<template #column="{ field, model }">
<div style="display: flex">
<Input v-model:value="model.startColumn" />
<span style="font-size: 18px; margin: 0 5px">~</span>
<Input v-model:value="model.endColumn" />
</div>
</template>
</BasicForm>
<div class="w-2/3">
<Alert show-icon message="由于数据量太大，只展示前10行数据" />
<Alert show-icon message="当前服务将会表头中把除了下划线以外其他特殊字符转为下划线" />
<BasicTable v-if="showFileTable" @register="fileTable">
<template #toolbar>
<div style="flex: 1; display: flex; justify-content: space-between">
<Input style="width: 200px" v-model:value="key" placeholder="关键字搜索" />
<DeleteOutlined />
</div>
</template>
<template #headerCell="{ column }">
<!--10个循环简化了-- 获取表头 -->
<template v-if="column.key.startsWith('c')">
<div style="display: flex">
<div style="display: flex; flex-direction: column">
<Input v-model:value="headList[parseInt(column.key.slice(1)) - 1].name" />
<Select
v-model:value="headList[parseInt(column.key.slice(1)) - 1].type"
:options="typeOptions"
/>
</div>
<Checkbox
v-model:checked="headList[parseInt(column.key.slice(1)) - 1].checked"
/>
</div>
</template>
<template v-else>
<HeaderCell :column="column" />
</template>
</template>
</BasicTable>
</div>
</div>
</TabPane>
<TabPane key="2" tab="映射规则配置" />
<TabPane key="3" tab="目标端配置" />
<TabPane key="4" tab="列表展示" />
</Tabs>
</template>
</PageWrapper>
</template>
<script lang="ts" setup>
import { Input, Select, Checkbox, Tabs, TabPane, Alert, Upload, message } from 'ant-design-vue';
import { ToTopOutlined, DeleteOutlined, UploadOutlined } from '@ant-design/icons-vue';
import PageWrapper from '../../../../components/Page/src/PageWrapper.vue';
import { reactive, ref } from 'vue';
import BasicForm from '@/components/Form/src/BasicForm.vue';
import { useForm } from '@/components/Form';
import {
fileTableColumn,
fileUploadSchema,
} from '@/views/dataIntegration/dataLoading/fileLoading/file.data';
import { getBasicColumns, getFormConfig } from '@/views/demo/table/tableData';
import { getMetadataColumns } from '@/views/dataIntegration/dataLoading/dataEntryLake/offlineLoading.data';
import { BasicTable, useTable } from '@/components/Table';
import { demoListApi } from '@/api/demo/table';
import { BasicHelp } from '@/components/Basic';
import HeaderCell from '@/components/Table/src/components/HeaderCell.vue';
import { fileData } from '@/views/dataIntegration/dataLoading/fileLoading/fileData';
import { useMessage } from '@/hooks/web/useMessage';
import type { UploadChangeParam } from 'ant-design-vue';
const key = ref('');
const activeKey = ref('1');
const modelName = ref('文件离线加载');
const { createMessage, createConfirm } = useMessage();
const fileList = ref([]);
const headers = {
authorization: 'authorization-text',
};
const handleChange = (model) => {
const type = fileList.value[0].name.slice(fileList.value[0].name.lastIndexOf('.') + 1);
console.log('type', type);
if (['xls', 'xlsx'].includes(type)) {
model.fileType = 'excel';
} else {
model.fileType = 'other';
}
model.fileName = fileList.value[0].name;
model.sheetName = 'Sheet1,Sheet2,Sheet3';
};
const [fileForm, { validate: fileValidate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 24, md: 24 },
schemas: fileUploadSchema,
showActionButtonGroup: true,
showResetButton: false,
submitButtonOptions: {
text: '解析',
onClick: () => {
fileValidate().then(() => {
if (showFileTable.value) {
createConfirm({
iconType: 'warning',
title: '确认覆盖',
content: '确认覆盖之前的解析结果吗？',
onOk() {
createMessage.success('覆盖成功!');
},
});
}
showFileTable.value = true;
})
},
},
actionColOptions: {
span: 23,
},
});
// 表头
const headList = reactive([
{
name: 'id',
type: 'int',
},
{
name: 'age',
type: 'int',
},
{
name: 'person',
type: 'string',
},
{
name: 'gender',
type: 'string',
},
{
name: 'height',
type: 'double',
},
{
name: 'create_time',
type: 'string',
},
{
name: 'update_time',
type: 'string',
},
{
name: 'create_by',
type: 'string',
},
{
name: 'update_by',
type: 'string',
},
{
name: 'remark',
type: 'string',
},
]);
// 类型
const typeOptions = [
{
label: 'int',
value: 'int',
},
{
label: 'string',
value: 'string',
},
{
label: 'double',
value: 'double',
},
];
const showFileTable = ref(false);
const [fileTable] = useTable({
api: async () => {
const response = {
pageNu: '1',
pageSize: '5',
pages: '1',
total: fileData.length,
code: '',
message: '',
data: fileData,
};
return { ...response };
},
canResize: false,
rowKey: 'businessId',
columns: fileTableColumn,
showTableSetting: false,
showIndexColumn: false,
bordered: false,
});
</script>
<style scoped></style>
src/views/dataService/serviceManage/onlineManage/index.vue
View file @ 7fc04ad0
......@@ -43,7 +43,7 @@
},
{
icon:'ant-design:fund-projection-screen-outlined',
tooltip:'详情',
tooltip:'',
/*label: '详情',*/
onClick: other.bind(null, record),
ifShow: () => {
......@@ -70,7 +70,7 @@
},
{
icon:'ant-design:container-twotone',
tooltip:'API',
tooltip:'',
/*label: 'API',*/
onClick: apiDetail.bind(null, record),
ifShow: () => {
......
src/views/parameterConfiguration/addParameterModel.vue 0 → 100644
View file @ 7fc04ad0
<template>
<BasicModal
width="40%"
v-bind="$attrs"
@register="registerModal"
:title="getTitle"
@ok="handleSubmit"
>
<BasicForm @register="register" />
</BasicModal>
</template>
<script lang="ts" setup>
import { useTable, TableAction } from '@/components/Table';
import { ref, computed, unref, reactive } from 'vue';
import { CloseOutlined } from '@ant-design/icons-vue';
import Icon from '@/components/Icon/Icon.vue';
import { Select } from 'ant-design-vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import BasicTable from '@/components/Table/src/BasicTable.vue';
import { connectionData } from '@/views/dataWarehousePlanning/logicalModel/modelDetail/modelData';
import {
connectionFormSchema,
connectionTable,
} from '@/views/dataWarehousePlanning/logicalModel/modelDetail/model.data';
import {
infoFormSchema,
uploadModelSchema,
upstreamTaskColumn,
} from '@/views/taskScheduling/taskFlowDesign/design.data';
import { useMessage } from '@/hooks/web/useMessage';
import {addModelFormSchema} from "@/views/parameterConfiguration/config.data";
const getTitle = '添加参数';
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
setModalProps({ confirmLoading: false });
});
const [register, { validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 24, md: 24 },
schemas: addModelFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
/**确定按钮*/
async function handleSubmit() {
validate().then(() => {
closeModal();
});
}
</script>
src/views/parameterConfiguration/config.data.ts 0 → 100644
View file @ 7fc04ad0
import {BasicColumn, FormSchema} from '@/components/Table';
export const workColumn: BasicColumn[] = [
{
title: '参数名称',
dataIndex: 'name',
width: 150,
},
{
title: '参数类型',
dataIndex: 'type',
width: 150,
},
{
title: '参数值',
dataIndex: 'value',
width: 150,
},
];
export const addModelFormSchema: FormSchema[] = [
{
label: '参数名称',
field: 'name',
required: true,
component: 'Input',
},
{
label: '参数类型',
field: 'type',
component: 'Select',
componentProps: {
options: [
{
label: '普通参数',
value: '普通参数',
},
{
label: '加密参数',
value: '加密参数',
},
],
},
},
{
label: '参数值',
field: 'value',
required: true,
component: 'Input',
},
];
src/views/parameterConfiguration/configData.ts 0 → 100644
View file @ 7fc04ad0
export const workAreaList = [
{
id: 1,
name: 'admin-个人工作区',
},
{
id: 2,
name: '共享工作区',
},
{
id: 3,
name: 'auth_check',
},
{
id: 4,
name: 'SLA场景验证',
},
{
id: 5,
name: '商城工作区',
},
{
id: 6,
name: 'sql收集及验证',
},
{
id: 7,
name: 'test',
},
{
id: 8,
name: 'NL2SQL验证',
},
];
export const workData = [
{
name: '1',
type: '1',
value: '1',
},
];
src/views/parameterConfiguration/index.vue 0 → 100644
View file @ 7fc04ad0
<template>
<PageWrapper title="参数配置" contentBackground headerSticky>
<template #footer>
<Tabs v-model:activeKey="activeKey">
<TabPane key="1" tab="性能参数">
<div class="tab-body">
<div style="flex: 1; display: flex">
<Input
style="width: 180px; margin-left: 10px"
v-model:value="key"
placeholder="输入关键字搜索"
>
<template #suffix>
<SearchOutlined />
</template>
</Input>
</div>
<div>
<a-button type="link" @click="handleAdd"><PlusOutlined />添加</a-button>
</div>
</div>
<Alert
class="tab-alert"
type="info"
show-icon
message="性能参数的配置项无需重启当前服务，点击”保存“即可立即生效。"
closable
/>
<BasicTable @register="workTable" />
</TabPane>
<TabPane key="2" tab="全局参数">
<div class="tab-body">
<div style="flex: 1; display: flex">
<Input
style="width: 180px; margin-left: 10px"
v-model:value="key"
placeholder="输入关键字搜索"
>
<template #suffix>
<SearchOutlined />
</template>
</Input>
</div>
<div>
<a-button type="link" @click="handleAdd"><PlusOutlined />添加</a-button>
</div>
</div>
<Alert
class="tab-alert"
type="info"
show-icon
message="全局参数可供所有任务流使用"
closable
/>
<BasicTable @register="workTable" />
</TabPane>
<TabPane key="3" tab="工作区参数">
<Row class="tab-body" :gutter="16">
<Col :span="6">
<List>
<template v-for="item in workAreaList" :key="item.id">
<List.Item
style="cursor: pointer"
@click="handleChange(item)"
:class="selectId === item.id ? 'selectionClass' : null"
>
<List.Item.Meta>
<template #avatar>
<BranchesOutlined />
</template>
<template #title>
<span>{{ item.name }}</span>
</template>
</List.Item.Meta>
</List.Item>
</template>
</List>
</Col>
<Col :span="18">
<div style="display: flex">
<div style="flex: 1; display: flex">
<span style="font-size: 16px">{{ name }}</span>
<Input
style="width: 180px; margin-left: 10px"
v-model:value="key"
placeholder="输入关键字搜索"
>
<template #suffix>
<SearchOutlined />
</template>
</Input>
</div>
<div>
<a-button type="link" @click="handleAdd"><PlusOutlined />添加</a-button>
</div>
</div>
<Alert
class="tab-alert"
type="info"
show-icon
message="工作区参数可供所在工作区内所有任务流使用"
closable
/>
<BasicTable @register="workTable" />
</Col>
</Row>
</TabPane>
</Tabs>
</template>
<AddParameterModel @register="addParameterModel" />
</PageWrapper>
</template>
<script lang="ts" setup>
import { reactive, onMounted, ref, nextTick } from 'vue';
import { PageWrapper } from '@/components/Page';
import { useRoute, onBeforeRouteLeave, useRouter } from 'vue-router';
import { useFilterStore } from '@/store/modules/filterData';
import {
Descriptions,
Tabs,
Select,
TabPane,
List,
Row,
Col,
Input,
Alert,
} from 'ant-design-vue';
import EntityTable from './entityTable.vue';
import ConnectionTable from './connectionTable.vue';
import CrossTable from './crossTable.vue';
import { infoData } from '@/views/dataWarehousePlanning/logicalModel/modelDetail/modelData';
import { FormSchema } from '@/components/Form';
import { useModal } from '@/components/Modal';
import { BranchesOutlined, SearchOutlined, PlusOutlined } from '@ant-design/icons-vue';
import TurnPhysicalModel from './turnPhysicalModel.vue';
import VersionDetailModel from './versionModel.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { workData, workAreaList } from './configData';
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';
import { workColumn } from '@/views/parameterConfiguration/config.data';
import AddParameterModel from './addParameterModel.vue';
const activeKey = ref('1');
const selectId = ref(1);
const name = ref(workAreaList[0].name);
const key = ref('');
function handleChange(item) {
selectId.value = item.id;
name.value = item.name;
}
function handleAdd() {
openTaskModel(true, {
isUpdate: false,
});
}
const [addParameterModel, { openModal: openTaskModel }] = useModal();
const [workTable] = useTable({
title: '',
api: async (params) => {
console.log('params', params);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: workData.length,
code: '',
message: '',
data: workData,
};
return { ...response };
},
columns: workColumn,
showIndexColumn: false,
actionColumn: {
width: 150,
title: '操作',
dataIndex: 'action',
},
});
onMounted(() => {});
</script>
<style scoped>
.tab-body {
display: flex;
margin-top: 20px;
}
.tab-alert {
margin: 1`12 0px 0;
}
</style>
src/views/realTimeSync/dataBaseToDataBase/data.ts
View file @ 7fc04ad0
......@@ -256,14 +256,40 @@ export const mappingRuleConfigurationColumns: BasicColumn[] = [
title: '规则名称',
dataIndex: 'ruleName',
width: 200,
edit: true,
editable: true,
editComponent: 'Input',
},
{
title: '规则内容',
dataIndex: 'ruleContent',
title: '规则类型',
dataIndex: 'ruleType',
width: 100,
},
{
title: '数据表',
dataIndex: 'dataTable',
width: 120,
edit: true,
editable: true,
editComponent: 'Select',
editComponentProps: {
options: [
{ label: '数据表1', value: '数据表1' },
{ label: '数据表2', value: '数据表2' },
],
},
},
{
title: '规则详情',
dataIndex: 'ruleDetail',
width: 200,
edit: true,
editable: true,
editComponent: 'Input',
},
{
title: '执行顺序',
width: 100,
width: 50,
dataIndex: 'executionSequence',
slots: { customRender: 'executionSequence' },
},
......@@ -323,3 +349,359 @@ export const tableDetailFormSchema: FormSchema[] = [
colProps: { lg: 12, md: 12 },
},
];
export const sourceSideConfigurationFormSchema: FormSchema[] = [
{
field: 'sourceType',
label: '源端类型',
component: 'Select',
required: true,
componentProps: {
placeholder: '请选择源端类型',
options: [
{ label: 'MYSQL', value: '1' },
{ label: 'ORACLE', value: '2' },
{ label: 'KUNDB', value: '3' },
],
},
},
{
field: 'analysisType',
label: ' ',
component: 'Select',
componentProps: {
options: [
{ label: '本地解析', value: '1' },
{ label: 'Xstream', value: '2' },
],
},
ifShow: ({ model }) => model.sourceType === '2',
},
{
field: 'version',
label: ' ',
component: 'Select',
componentProps: {
options: [
{ label: '高可用版本', value: '1' },
{ label: '分布式版本', value: '2' },
],
},
ifShow: ({ model }) => model.sourceType === '3',
},
{
field: 'analysisAlter1',
label: '',
slot: 'analysisAlter1',
ifShow: ({ model }) => model.sourceType === '2' && model.analysisType === '1',
},
{
field: 'analysisAlter1',
label: '',
slot: 'analysisAlter1',
ifShow: ({ model }) => model.sourceType === '2' && model.analysisType === '2',
},
{
field: 'RpcIp1',
label: 'Rpc地址',
component: 'Input',
ifShow: ({ model }) => model.sourceType === '2' && model.analysisType === '1',
},
{
field: 'RpcIp2',
label: 'Rpc地址',
component: 'Input',
ifShow: ({ model }) => model.sourceType === '3' && model.version === '2',
},
{
field: 'mysqlServer',
label: 'MYSQL server',
component: 'Input',
ifShow: ({ model }) => model.sourceType === '3' && model.version === '1',
},
{
field: 'dataSource',
label: '数据源',
component: 'Select',
required: true,
componentProps: {
placeholder: '请选择数据源',
options: [
{ label: 'KunOB数据源', value: '1' },
{ label: 'MongoDB数据源', value: '2' },
{ label: 'AmazonS3', value: '3' },
],
},
},
{
field: 'dataBase',
label: '数据库',
component: 'Select',
componentProps: {
mode: 'multiple',
placeholder: '请选择数据源',
options: [
{ label: 'KunOBDB', value: '1' },
{ label: 'MongoDB', value: '2' },
{ label: 'AmazonS3DB', value: '3' },
],
},
},
{
field: 'xstreaName',
label: 'xstream服务名称',
component: 'Input',
ifShow: ({ model }) => model.sourceType === '2' && model.analysisType === '2',
},
{
field: 'loadType',
label: '数据表获取方式',
component: 'RadioGroup',
defaultValue: '1',
componentProps: {
options: [
{ label: '直接选表', value: '1' },
{ label: '规则过滤', value: '2' },
],
},
},
{
field: 'include',
label: '包含',
component: 'InputTextArea',
ifShow: ({ model }) => model.loadType === '2',
},
{
field: 'exclude',
label: '排除',
component: 'InputTextArea',
ifShow: ({ model }) => model.loadType === '2',
},
{
field: 'getMetadata',
label: ' ',
slot: 'getMetadata',
ifShow: ({ model }) => model.loadType === '1',
},
{
field: 'previewMetadata',
label: ' ',
slot: 'previewMetadata',
ifShow: ({ model }) => model.loadType === '2',
},
];
export const kafkaOptionsColumns: BasicColumn[] = [
{
title: '',
editable: true,
edit: true,
dataIndex: 'name',
width: 120,
},
];
export const kafkaOptionsFormSchema: FormSchema[] = [
{
field: 'kafkaOptions1',
label: '',
slot: 'kafkaOptions1',
colProps: { lg: 24, md: 24 },
},
{
field: 'topicType',
label: 'Topic配置方式',
component: 'RadioGroup',
defaultValue: '1',
required: true,
componentProps: {
options: [{ label: '自定义数量', value: '1' }],
},
colProps: { lg: 24, md: 24 },
},
{
field: 'kafkaOptions2',
label: '',
slot: 'kafkaOptions2',
colProps: { lg: 24, md: 24 },
},
{
field: 'num',
label: 'Topic数量',
component: 'InputNumber',
componentProps: {
min: 1,
max: 50,
},
defaultValue: 1,
required: true,
colProps: { lg: 4, md: 4 },
},
{
field: 'kafkaOptionsGenerate',
label: '',
slot: 'kafkaOptionsGenerate',
colProps: { lg: 24, md: 24 },
},
{
field: 'kafkaOptions3',
label: '',
slot: 'kafkaOptions3',
colProps: { lg: 24, md: 24 },
},
];
export const mappingRulesTopicTableColumns: BasicColumn[] = [
{
title: 'Topic',
dataIndex: 'name',
width: 140,
},
{
title: 'Db',
dataIndex: 'dataBase',
width: 120,
edit: true,
editable: true,
editComponent: 'Select',
editComponentProps: {
showArrow: true,
mode: 'multiple',
options: [
{ label: '请选择', value: '' },
{ label: 'fbs_1_flashsyncA_stable3.flashsync_stable1', value: '1' },
{ label: 'fbs_1_flashsyncA_stable3.flashsync_stable2', value: '2' },
],
},
},
{
title: 'Table名称表达式',
dataIndex: 'remark',
width: 100,
edit: true,
editable: true,
},
];
export const mappingRulesTableColumns: BasicColumn[] = [
{
title: '源表名',
dataIndex: 'dataSourceName',
width: 120,
},
{
title: 'Topic名称',
dataIndex: 'topicName',
width: 120,
},
];
export const tableMappingFormSchema: FormSchema[] = [
{
field: 'dataSource',
label: '目标数据源',
component: 'Select',
componentProps: {
placeholder: '请选择数据源',
options: [
{ label: 'KunOBDB', value: '1' },
{ label: 'MongoDB', value: '2' },
{ label: 'AmazonS3DB', value: '3' },
],
},
required: true,
},
];
export const tableMappingColumns: BasicColumn[] = [
{
title: '规则名称',
dataIndex: 'name',
width: 140,
},
{
title: '执行顺序',
width: 50,
dataIndex: 'executionSequence',
slots: { customRender: 'executionSequence' },
},
];
export const writePolicyColumns: BasicColumn[] = [
{
title: 'Topic名称',
dataIndex: 'topicName',
width: 120,
},
{
title: '表数量',
dataIndex: 'tableNum',
width: 120,
},
{
title: '并发数',
dataIndex: 'concurrency',
edit: true,
editable: true,
width: 120,
},
{
title: '条数',
dataIndex: 'num',
edit: true,
editable: true,
width: 120,
},
{
title: '时间间隔/s',
dataIndex: 'timeInterval',
edit: true,
editable: true,
width: 120,
},
];
export const policyOptionFormSchema: FormSchema[] = [
{
field: 'policyOption',
label: '',
slot: 'policyOption',
colProps: { lg: 24, md: 24 },
},
{
field: 'ddl',
label: 'ddl变更策略',
component: 'Select',
defaultValue: '1',
componentProps: {
options: [{ label: 'DB-DB源端DDL处理默认策略', value: '1' }],
},
},
{
field: 'data',
label: '数据积压策略',
component: 'Select',
defaultValue: '1',
componentProps: {
options: [{ label: '数据积压默认策略', value: '1' }],
},
},
{
field: 'exception',
label: '数据异常策略',
component: 'Select',
defaultValue: '1',
componentProps: {
options: [{ label: '目标端数据异常默认策略', value: '1' }],
},
},
{
field: 'system',
label: '系统异常策略',
component: 'Select',
defaultValue: '1',
componentProps: {
options: [{ label: '系统异常默认策略', value: '1' }],
},
},
{
field: 'config',
label: '一致性检查策略',
component: 'Select',
defaultValue: '1',
componentProps: {
options: [{ label: '一致性检查默认策略', value: '1' }],
},
},
];
src/views/realTimeSync/dataBaseToDataBase/dataBaseData.ts
View file @ 7fc04ad0
import { tableMappingColumns } from '@/views/realTimeSync/dataBaseToDataBase/data';
export const tableList: any[] = [
{
businessId: 1,
......@@ -737,33 +739,6 @@ export const notCustomSQLTableList = [
fieldType: 'VARCHAR(100,0)',
},
];
export const mappingRuleConfigurationTableList = [
{
businessId: '1',
ruleName: '[单表] 字段映射规则',
ruleContent: '源表名:table_1',
},
{
businessId: '2',
ruleName: '[全局] 新增字段规则',
ruleContent: '新增字段名称:a, 字段类型:string, 字段表达式:asd',
},
{
businessId: '3',
ruleName: '[全局] 字段名称映射规则',
ruleContent: '原字段名称:未配置, 目标字段名称:未配置',
},
{
businessId: '4',
ruleName: '[全局] 字段类型映射规则',
ruleContent: '源字段类型:timestamp, 目标字段类型:string',
},
{
businessId: '5',
ruleName: '[单表] 字段映射规则',
ruleContent: '源表名:table_2',
},
];
export const tableTreeData = [
{
title: 'bm_datasource',
......@@ -994,3 +969,95 @@ export const tableDetailData = [
detail: 'VARCHAR(255,0)',
},
];
export const filterRuleCardList = [
{
title: '数据操作过滤',
type: '数据操作过滤',
description: '支持在数据同步阶段对当前任务选中表操作过滤',
},
{
title: '数据值过滤',
type: '数据值过滤',
description: '支持在数据同步阶段对当前任务选中表的数据操作过滤',
},
{
title: '字段过滤',
type: '字段过滤',
description: '支持在数据同步阶段对当前任务选中表的字段操作过滤',
},
];
export const mappingRulesTopicTableData: any[] = [
{
name: '0a5c81a6fd364805961918cd9764241d_01',
dataBase: '',
},
{
name: '0a5c81a6fd364805961918cd9764241d_03',
dataBase: '',
},
{
name: '0a5c81a6fd364805961918cd9764241d_02',
dataBase: '',
},
];
export const mappingRulesTableData: any[] = [
{
topicName: '0a5c81a6fd364805961918cd9764241d_01',
dataSourceName: 'fbs_1_flashsyncA_stable3.flashsync_stable1',
},
{
topicName: '0a5c81a6fd364805961918cd9764241d_03',
dataSourceName: 'fbs_1_flashsyncA_stable3.flashsync_stable2',
},
{
topicName: '0a5c81a6fd364805961918cd9764241d_02',
dataSourceName: 'fbs_1_flashsyncA_stable3.flashsync_stable3',
},
{
topicName: '0a5c81a6fd364805961918cd9764241d_02',
dataSourceName: 'fbs_1_flashsyncA_stable3.flashsync_stable1',
},
{
topicName: '0a5c81a6fd364805961918cd9764241d_01',
dataSourceName: 'fbs_1_flashsyncA_stable3.flashsync_stable2',
},
{
topicName: '0a5c81a6fd364805961918cd9764241d_03',
dataSourceName: 'fbs_1_flashsyncA_stable3.flashsync_stable3',
},
];
export const tableMappingData: any[] = [
{
businessId: '1',
name: '0a5c81a6fd364805961918cd9764241d_01',
dataBase: '',
},
{
businessId: '2',
name: '0a5c81a6fd364805961918cd9764241d_03',
dataBase: '',
},
];
export const writePolicyData: any[] = [
{
topicName: '0a5c81a6fd364805961918cd9764241d_01',
tableNum: '3',
concurrency: '1',
num: '5000',
timeInterval: '1',
},
{
topicName: '0a5c81a6fd364805961918cd9764241d_02',
tableNum: '3',
concurrency: '1',
num: '5000',
timeInterval: '1',
},
{
topicName: '0a5c81a6fd364805961918cd9764241d_03',
tableNum: '3',
concurrency: '1',
num: '5000',
timeInterval: '1',
},
];
src/views/taskScheduling/schedulingExecution/calendar/index.vue 0 → 100644
View file @ 7fc04ad0
<template>
<PageWrapper>
</PageWrapper>
</template>
<script lang="ts" setup>
</script>
<style lang="scss" scoped>
</style>
src/views/taskScheduling/schedulingExecution/executorManagement/executorManagement.data.ts 0 → 100644
View file @ 7fc04ad0
import {BasicColumn, FormSchema} from "@/components/Table";
/** 列表展示字段*/
export const columns: BasicColumn[] = [
{
title: '名称',
dataIndex: 'name',
width: 150,
},
{
title: '任务数',
dataIndex: 'taskCount',
width: 60,
},
{
title: '组别',
dataIndex: 'groupName',
width: 220,
},
{
title: '状态',
dataIndex: 'flag',
width: 80,
slots: { customRender: 'flag' },
},
{
title: '运行环境路径',
dataIndex: 'runtimeEnvironmentPath',
width: 200,
},
];
/** 列表筛选项*/
export const searchFormSchema: FormSchema[] = [
{
field: 'name',
label: '',
component: 'InputSearch',
colProps: { span: 20},
componentProps: {
placeholder: '输入关键字搜索',
onChange: (e: any) => {
console.log(e);
},
},
},
];
/** 左上*/
export const groupSchema: BasicColumn[] = [
{
title: '',
width: 150,
dataIndex: 'name',
slots: { customRender: 'name' },
},
{
title: '',
width: 30,
dataIndex: 'number',
},
];
/** 左下*/
export const pathSchema: BasicColumn[] = [
{
title: '',
width: 150,
dataIndex: 'name',
},
];
src/views/taskScheduling/schedulingExecution/executorManagement/index.vue 0 → 100644
View file @ 7fc04ad0
<template>
<PageWrapper contentBackground dense contentClass="flex">
<template #headerContent>
<div style="border-bottom: 2px solid #EBEFF6;">
<p style="margin: -20px 0 10px 0;color: #DCDCDC; ">调度/执行器管理/</p>
<div style="display: flex;align-items: center;margin-bottom:10px;">
<div>
<Icon icon="ant-design:apartment-outlined" :size="25" style="color:#5689E5;"/>
</div>
<span style="font-size: 20px">执行器编辑器</span>
</div>
<div type="primary" class="save-button" @click="resourceReplacement">
<a-button type="text" style="color: #169aff;border-color:#169aff;">执行器资源替换
</a-button>
</div>
<div type="primary" class="save-button1" @click="downloadAndInstallPackage">
<a-button type="text" style="color: #169aff;border-color:#169aff;">下载执行器rpm安装包
</a-button>
</div>
</div>
</template>
<div style="display:flex;">
<div style="width: 20%;border-right: 2px solid #EBEFF6;">
<div>
<BasicTable @register="registerGroupTable" :searchInfo="searchInfo">
<template #tableTitle>
<div style="display: flex;align-items: center">
<div class="container ">
<span class="executor-text">组别</span>
</div>
</div>
</template>
<template #toolbar>
<Icon icon="ant-design:plus-outlined"
:size="20" @click="Delete"/>
<Icon icon="ant-design:clear-outlined"
:size="20" @click="Delete"/>
</template>
</BasicTable>
</div>
<div>
<BasicTable @register="registerPathTable" :searchInfo="searchInfo">
<template #tableTitle>
<div style="display: flex;align-items: center">
<div class="container1">
<span class="executor-text">运行环境路径</span>
</div>
</div>
</template>
<template #toolbar>
<Icon icon="ant-design:plus-outlined"
:size="20" @click="Delete"/>
<Icon icon="ant-design:clear-outlined"
:size="20" @click="Delete"/>
</template>
</BasicTable>
</div>
</div>
<div style="width: 80%">
<BasicTable @register="registerTable" :searchInfo="searchInfo">
<template #tableTitle>
<div style="display: flex;align-items: center">
<div class="container ">
<span class="executor-text">执行器</span>
</div>
<BasicForm @register="registerForm" style="margin-bottom: -20px"/>
</div>
</template>
<template #toolbar>
<a-button :disabled="getRowSelection().selectedRowKeys <=0"
type="primary" @click="addEnvironmentPath">
<Icon icon="ant-design:plus-outlined" :size="15"/>
添加运行环境路径
</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <=0"
type="primary" @click="addGroup">添加到组别
</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <=0"
type="primary" @click="Delete">
<Icon icon="ant-design:clear-outlined"></Icon>
</a-button>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
label: '添加到组别',
onClick: addGroup.bind(null, record),
},
{
icon:'ant-design:clear-outlined',
/*label: '删除',*/
type:'text',
onClick: Delete.bind(null, record),
},
]"
/>
</template>
</template>
<template #flag="{ text }">
<span v-if="text === '正常'">
<Icon icon="ant-design:check-circle-filled" :size="15" style="color:#82BD9D;"/>
正常
</span>
<span v-else-if="text === '不正常'">
<Icon icon="ant-design:close-circle-filled" :size="15" style="color:#C02C20;"/>
不正常
</span>
</template>
</BasicTable>
</div>
</div>
</PageWrapper>
</template>
<script lang="ts" setup>
import {PageWrapper} from "@/components/Page";
import Icon from "@/components/Icon/Icon.vue";
import {groupTable, pathTable, tableList} from './mock';
import {columns, groupSchema, pathSchema, searchFormSchema} from './executorManagement.data';
import {BasicTable, useTable, TableAction} from '@/components/Table';
import {reactive} from "vue";
import {Divider} from "ant-design-vue";
import BasicForm from "@/components/Form/src/BasicForm.vue";
const searchInfo = reactive<Recordable>({});
const [registerTable, {
reload,
updateTableDataRecord,
getSearchInfo,
getForm,
getRowSelection
}] = useTable({
/* title: '执行器',*/
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: tableList.length,
code: '',
message: '',
data: tableList,
};
return {...response};
},
rowKey: 'businessId',
rowSelection: true,
showIndexColumn: false,
columns,
/* formConfig: {
schemas: searchFormSchema,
//在 input 中输入时按回车自动提交
autoSubmitOnEnter: true,
//是否显示操作按钮(重置/提交)
showActionButtonGroup: false,
baseRowStyle: {
/!*position: 'absolute',*!/
margin: '0 0 -20px 0',
}
},
useSearchForm: true,*/
showTableSetting: false,
bordered: true,
handleSearchInfoFn(info) {
console.log('handleSearchInfoFn', info);
return info;
},
actionColumn: {
width: 180,
title: '操作',
dataIndex: 'action',
// slots: { customRender: 'action' },
},
});
/**右上*/
const [registerForm] = useTable({
schemas: searchFormSchema,
//在 input 中输入时按回车自动提交
autoSubmitOnEnter: true,
//是否显示操作按钮(重置/提交)
showActionButtonGroup: false,
rowSelection: true,
pagination: false,
showIndexColumn: false,
scroll: {y: 300},
showSummary: true,
});
/**左上*/
const [registerGroupTable, {}] = useTable({
rowKey: 'pathId',
title: '组别',
dataSource: groupTable,
columns: groupSchema,
rowSelection: true,
pagination: false,
showIndexColumn: false,
scroll: {y: 300},
showSummary: true,
});
/**左下*/
const [registerPathTable] = useTable({
title: '运行环境路径',
rowKey: 'groupId',
dataSource: pathTable,
columns: pathSchema,
rowSelection: true,
pagination: false,
showIndexColumn: false,
scroll: {y: 300},
showSummary: true,
});
/**执行器资源替换*/
function resourceReplacement() {
}
/**搜索*/
function search() {
}
/**下载执行器rpm安装包*/
function downloadAndInstallPackage() {
}
/**添加运行环境路径*/
function addEnvironmentPath() {
}
/**添加到组别*/
function addGroup() {
}
/**删除Delete*/
function Delete() {
console.log('打印加号按钮')
}
</script>
<style lang="scss" scoped>
.save-button {
position: absolute; /* 绝对定位 */
top: 15px;
right: 10px;
margin: 25px 200px 10px 10px;
}
.save-button1 {
position: absolute;
top: 15px;
right: 10px;
margin: 25px 10px 10px 10px;
}
.container {
width: 70px;
display: flex;
justify-content: center;
align-items: center; /* 让内容垂直居中 */
}
.container1 {
width: 120px;
display: flex;
justify-content: center;
align-items: center; /* 让内容垂直居中 */
}
.executor-text {
display: inline-flex; /* 保持内联样式 */
align-items: center; /* 确保文本垂直居中 */
}
.executor-text::before {
content: ''; /* 伪元素的内容为空 */
display: inline-block;
width: 4px; /* 伪元素的宽度 */
height: 20px; /* 伪元素的高度 */
background-color:#5689E5; /* 蓝色 */
margin-right: 5px; /* 与文字的间距 */
}
</style>
src/views/taskScheduling/schedulingExecution/executorManagement/mock.ts 0 → 100644
View file @ 7fc04ad0
/**表格数据*/
export const tableList: any[] = [
{
businessId: 1,
name: 'ceshiceschiceshciec',
taskCount: '0',
groupName: 'default group',
flag: '正常',
runtimeEnvironmentPath: '',
},
{
businessId: 2,
name: 'fafafafafafafafafaf',
taskCount: '1',
groupName: 'default group，agent_executor',
flag: '正常',
runtimeEnvironmentPath: 'java_path.python3',
},
];
/**左上表格数据*/
export const groupTable: any[] = [
{
groupId: 1,
name: 'default group',
number:'2',
},
{
groupId: 2,
name: 'agent_executor',
number:'1',
},
];
/**左下表格数据*/
export const pathTable: any[] = [
{
pathId: 1,
name: 'java_path',
},
{
pathId: 2,
name: 'python3',
},
];
src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/DependencyRelationshipDrawer.vue
View file @ 7fc04ad0
......@@ -25,15 +25,15 @@
import { ref, computed, unref } from 'vue';
import { BasicForm, useForm } from '@/components/Form';
import { Card, Tabs, TabPane, Col, Row,RangePicker,RadioGroup,RadioButton,Select,Collapse } from 'ant-design-vue';
import {tableListColumns} from './taskFlowMaintenance.data';
import {taskListData} from './taskFlowMaintenanceData';
import {tableListColumns} from './periodicScheduling.data';
import {taskListData} from './periodicSchedulingData';
import { BasicDrawer, useDrawerInner } from '@/components/Drawer';
import { BasicTree, TreeItem } from '@/components/Tree';
import {useMessage} from "@/hooks/web/useMessage";
import { Alert } from 'ant-design-vue';
import { useModal } from '@/components/Modal';
import Icon from '@/components/Icon/Icon.vue';
import { detailTreeData } from './taskFlowMaintenanceData'
import { detailTreeData } from './periodicSchedulingData'
const [registerLookLogModal, { openModal: openLookLogModal }] = useModal();
const [registerLookAllDataModal, { openModal: openLookAllDataModal }] = useModal();
......
src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/ExecuteConditionModal.vue 0 → 100644
View file @ 7fc04ad0
<template>
<BasicModal width="40%" v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<BasicTable @register="registerTable"/>
</BasicModal>
</template>
<script lang="ts" setup>
import {ref, computed, unref, reactive, onMounted} from 'vue';
import {BasicModal, useModal, useModalInner} from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { useMessage } from '@/hooks/web/useMessage';
import {columns, columns2} from "./periodicScheduling.data";
import { router } from '@/router';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import {
tableData,
tableData2
} from "@/views/taskScheduling/taskFlowMaintenance/periodicScheduling/periodicSchedulingData";
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage,createConfirm } = useMessage();
const getTitle = computed(() => ('执行条件'));
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
setModalProps({ confirmLoading: false,showOkBtn:false,cancelText:'关闭' });
});
const [registerTable, { reload,getForm,getRowSelection }] = useTable({
title: '',
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: tableData2.length,
code:'',
message:'',
data: [],
};
return { ...response,data: tableData2 };
},
columns:columns2,
useSearchForm: false,
showTableSetting: false,
showIndexColumn:false,
bordered: true,
scroll: { y: 300 },
});
/**确定按钮*/
async function handleSubmit() {
}
onMounted(() => {
});
</script>
<style lang="less" scoped>
</style>
src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/RunAgainModal.vue
View file @ 7fc04ad0
<template>
<BasicModal width="40%" v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<BasicForm @register="registerForm">
<BasicForm @register="registerForm1" v-if="show1">
<template #slot="{ model, field }">
<div class="textClass1" v-if="model.scopeAction === '当前任务流'">
<div style="font-weight: bold;margin-bottom: 10px;">重跑当前注意事项</div>
<div>
1. 按照当前任务流最新的版本重跑；<br>
2. 任务流是否可以重跑成功取决于任务流条件是否达成，例如依赖的上游的状态, 是否存在依赖上次执行结果等条件;；<br>
3. 若包含外部任务，workflow不保证外部任务的数据幂等性，按照要求重跑当前任务，例如任务包含数据加载任务，当最后一步数据插入已经发送到引擎端，则重试会出现重复数据。
<div style="white-space: pre-wrap">
{{text1}}
</div>
</div>
<div class="textClass2" v-else>
<div style="font-weight: bold;margin-bottom: 10px;">重跑当前及下游注意事项</div>
<div style="white-space: pre-wrap">
{{text2}}
</div>
</div>
</template>
</BasicForm>
<BasicForm @register="registerForm2" v-if="show2">
<template #slot="{ model, field }">
<div class="textClass1" v-if="model.scopeAction === '当前任务'">
<div style="font-weight: bold;margin-bottom: 10px;">重跑当前注意事项</div>
<div>
1. 重跑的是当前任务流和依赖关系的最新版本，新增的依赖关系的下游执行相关的最新执行记录可能会被覆盖；<br>
2. 任务流是否可以重跑成功取决于任务流条件是否达成，例如依赖的上游的状态，是否存在依赖上次执行结果等条件；<br>
3. 若包含外部任务，workflow不保证外部任务的数据幂等性，按照要求重跑当前任务，例如任务包含数据加载任务，当最后一步数据插入已经发送到引擎端，则重试会出现重复数据；<br>
4. 重跑当前及下游，若下游的任务流除了当前任务流还有其他的依赖，则下游是否运行还依赖其他分支依赖的上游任务流的状态；<br>
5. 重跑影响的执行记录按照批次重跑，若下游任务流还在运行中，会等待运行结束后进行重跑。
<div style="white-space: pre-wrap">
{{text3}}
</div>
</div>
<div class="textClass2" v-else>
<div style="font-weight: bold;margin-bottom: 10px;">重跑当及下游注意事项</div>
<div style="white-space: pre-wrap">
{{text4}}
</div>
</div>
</template>
......@@ -26,34 +36,78 @@
</template>
<script lang="ts" setup>
import {ref, computed, unref, reactive, onMounted} from 'vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import {BasicModal, useModal, useModalInner} from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { useMessage } from '@/hooks/web/useMessage';
import {mainFormSchema4, runAgainSchema} from "./taskFlowMaintenance.data";
import {TreeData} from "@/views/taskScheduling/taskFlowMaintenance/periodicScheduling/taskFlowMaintenanceData";
import {mainFormSchema4, runAgainSchema1,runAgainSchema2} from "./periodicScheduling.data";
import {TreeData} from "@/views/taskScheduling/taskFlowMaintenance/periodicScheduling/periodicSchedulingData";
import { router } from '@/router';
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const { createMessage,createConfirm } = useMessage();
const getTitle = computed(() => ('重跑'));
const text1 = ref('1. 按照当前任务流最新的版本重跑；\n' +
'2. 任务流是否可以重跑成功取决于任务流条件是否达成，例如依赖的上游的状态, 是否存在依赖上次执行结果等条件;\n' +
'3. 若包含外部任务，workflow不保证外部任务的数据幂等性，按照要求重跑当前任务，例如任务包含数据加载任务，当最后一步数据插入已经发送到引擎端，则重试会出现重复数据。');
const text2 = ref('1. 重跑的是当前任务流和依赖关系的最新版本，新增的依赖关系的下游执行相关的最新执行记录可能会被覆盖；\n' +
'2. 任务流是否可以重跑成功取决于任务流条件是否达成，例如依赖的上游的状态，是否存在依赖上次执行结果等条件;\n' +
'3. 若包含外部任务，workflow不保证外部任务的数据幂等性，按照要求重跑当前任务，例如任务包含数据加载任务，当最后一步数据插入已经发送到引擎端，则重试会出现重复数据；\n' +
'4. 重跑当前及下游，若下游的任务流除了当前任务流还有其他的依赖，则下游是否运行还依赖其他分支依赖的上游任务流的状态；\n' +
'5. 重跑影响的执行记录按照批次重跑，若下游任务流还在运行中，会等待运行结束后进行重跑。')
const text3 = ref('1. 按照当前任务最新的版本重跑；\n' +
'2. 任务是否可以重跑成功取决于任务条件是否达成，例如依赖的上游的状态, 是否存在依赖上次执行结果等条件;\n' +
'3. 若包含外部任务，workflow不保证外部任务的数据幂等性，按照要求重跑当前任务，例如任务包含数据加载任务，当最后一步数据插入已经发送到引擎端，则重试会出现重复数据。');
const text4 = ref('1. 重跑的是当前任务和依赖关系的最新版本，新增的依赖关系的下游执行相关的最新执行记录可能会被覆盖；\n' +
'2. 将会产生新的任务流执行记录;\n' +
'3. 若包含外部任务，workflow不保证外部任务的数据幂等性\n' +
'4. 重跑当前及下游，若下游的任务流除了当前任务流还有其他的依赖，则下游是否运行还依赖其他分支依赖的上游任务流的状态；\n' +
'5. 重跑中涉及的调度时间参数均是本次指定的换行记录的对应的时间，运行时间则为当前实际运行的时间。')
const show1 = ref(false);
const show2 = ref(false);
const [registerForm, { updateSchema:updateSchema1,getFieldsValue }] = useForm({
const [registerForm1] = useForm({
labelAlign: 'left',
labelWidth: 100,
schemas: runAgainSchema,
schemas: runAgainSchema1,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
const [registerForm2] = useForm({
labelAlign: 'left',
labelWidth: 100,
schemas: runAgainSchema2,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
setModalProps({ confirmLoading: false });
show1.value = data.show1
show2.value = data.show2
});
/**确定按钮*/
async function handleSubmit() {
createConfirm({
iconType: 'info',
title: '跳转提醒',
content: '当前操作已成功，会产生新的任务流执行记录，是否跳转到任务流的运维首页？',
onOk() {
router.push({
path: '/taskScheduling/taskFlowMaintenance/periodicScheduling/index',
query: {}
})
},
});
createMessage.success('重跑成功!');
closeModal()
}
......
src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/SuccessfullySettingModal.vue
View file @ 7fc04ad0
......@@ -11,7 +11,7 @@
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { useMessage } from '@/hooks/web/useMessage';
import {mainFormSchema4} from "./taskFlowMaintenance.data";
import {mainFormSchema4} from "./periodicScheduling.data";
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
......
src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/TaskListDrawer.vue
View file @ 7fc04ad0
......@@ -109,7 +109,7 @@
/>
</div>
<div style="margin-left: 130px">
<a-button type="primary" :disabled="getRowSelection().selectedRowKeys <= 0" @click="handleDeleteIds" style="margin-right: 10px;">取消</a-button>
<a-button type="primary" :disabled="getRowSelection().selectedRowKeys <= 0" @click="batchCancelExecuteButton" style="margin-right: 10px;">取消</a-button>
<a-button type="primary" :disabled="getRowSelection().selectedRowKeys <= 0" @click="batchDownloadButton">批量下载日志</a-button>
</div>
</template>
......@@ -125,9 +125,10 @@
icon:'ix:log',
onClick: lookLogButton.bind(null, record),
},
{
icon:'codicon:debug-start',
onClick: lookLogButton.bind(null, record),
{
//重跑
icon:'material-symbols-light:not-started-outline',
onClick: runAgainButton.bind(null, record),
},
]"
/>
......@@ -136,6 +137,8 @@
</BasicTable>
<!-- 查看日志 弹窗-->
<LookLogModal @register="registerLookLogModal" @success="handleSuccess" />
<!-- 重跑 弹窗-->
<RunAgainModal @register="registerRunAgainModal" @success="handleSuccess" />
</BasicDrawer>
</template>
<script lang="ts" setup>
......@@ -143,8 +146,8 @@
import { ref, computed, unref } from 'vue';
import { BasicForm, useForm } from '@/components/Form';
import { Card, Tabs, TabPane, Col, Row,RangePicker,RadioGroup,RadioButton,Select } from 'ant-design-vue';
import {tableListColumns} from './taskFlowMaintenance.data';
import {taskListData} from './taskFlowMaintenanceData';
import {tableListColumns} from './periodicScheduling.data';
import {taskListData} from './periodicSchedulingData';
import { BasicDrawer, useDrawerInner } from '@/components/Drawer';
import { BasicTree, TreeItem } from '@/components/Tree';
import {useMessage} from "@/hooks/web/useMessage";
......@@ -154,12 +157,13 @@
import LookLogModal from './LookLogModal.vue'
import {exportRoleList} from "@/api/system/role/role";
import {downloadByData} from "@/utils/file/download";
import RunAgainModal from './RunAgainModal.vue'
const [registerRunAgainModal, { openModal: openRunAgainModal }] = useModal();
const [registerLookLogModal, { openModal: openLookLogModal }] = useModal();
const [registerLookAllDataModal, { openModal: openLookAllDataModal }] = useModal();
const [registerVersionModal, { openModal: openVersionModal }] = useModal();
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const { createMessage, createConfirm } = useMessage();
const isUpdate = ref(true);
const roleId = ref('');
const getTitle = computed(() => ('任务列表'));
......@@ -214,6 +218,13 @@
});
/**重跑 按钮*/
function runAgainButton(record){
openRunAgainModal(true,{
show1:false,
show2:true
})
}
/**查看版本变更信息*/
......@@ -226,7 +237,6 @@
openLookLogModal(true,{})
}
/**批量下载 按钮*/
async function batchDownloadButton() {
const params = Object.assign({}, {});
......@@ -234,6 +244,17 @@
downloadByData(data, '全部日志' + '.xlsx');
}
/**批量取消执行 按钮*/
function batchCancelExecuteButton(record){
createConfirm({
iconType: 'warning',
title: '取消执行',
content: '确认取消选中数据吗？',
onOk() {
createMessage.success('取消成功!');
},
});
}
function handleSubmit() {
......
src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/executionDetails.vue
View file @ 7fc04ad0
......@@ -17,15 +17,14 @@
</BasicForm>
</div>
</div>
<Divider/>
<div class="contentClass" style="display: flex;margin-top: 20px">
<div>
<img src="../../../../assets/images/taskFlowMaintenance.png" style="width: 1455px;" />
</div>
<div>
<RadioGroup v-model:value="showType1" button-style="solid" size="small">
<RadioButton value="table" @click="taskListButton"><UnorderedListOutlined style="font-size: 20px"/></RadioButton>
<RadioButton value="chart" @click="relationshipButton"><AppstoreOutlined style="font-size: 20px"/></RadioButton>
<RadioButton value="table" @click="taskListButton"><UnorderedListOutlined/></RadioButton>
<RadioButton value="chart" @click="relationshipButton"><AppstoreOutlined/></RadioButton>
</RadioGroup>
</div>
</div>
......@@ -48,8 +47,8 @@
import { useGo } from '@/hooks/web/usePage';
import { useRoute } from 'vue-router';
import { router } from '@/router';
import {columns, topFormSchema2, topFormSchema1, mainFormSchema3, detailFormSchema} from './taskFlowMaintenance.data';
import { tableData,TreeData,treeData2 } from './taskFlowMaintenanceData'
import {columns, topFormSchema2, topFormSchema1, mainFormSchema3, detailFormSchema} from './periodicScheduling.data';
import { tableData,TreeData,treeData2 } from './periodicSchedulingData'
import { BasicForm, useForm } from '@/components/Form';
import { useECharts } from '@/hooks/web/useECharts';
import LookLogModal from './LookLogModal.vue'
......
src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/taskFlowMaintenance.data.ts → src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/periodicScheduling.data.ts
View file @ 7fc04ad0
......@@ -9,7 +9,7 @@ import {DescItem} from "@/components/Description";
import {uploadApi} from "@/api/sys/upload"; // 引入开关组件
type CheckedType = boolean | string | number;
/**首页-table列表*/
/**首页-table列表1*/
export const columns: BasicColumn[] = [
{
title: '调度时间',
......@@ -34,7 +34,8 @@ export const columns: BasicColumn[] = [
{
title: '执行条件',
dataIndex: 'executionCondition',
width: 120
width: 120,
slots: {customRender: 'executionCondition'}
},
{
title: '执行模式',
......@@ -57,6 +58,24 @@ export const columns: BasicColumn[] = [
width: 120
}
];
/**首页-table列表2*/
export const columns2: BasicColumn[] = [
{
title: '条件类型',
dataIndex: 'conditionType',
width: 120
},
{
title: '详情',
dataIndex: 'detail',
width: 120
},
{
title: '是否满足',
dataIndex: 'satisfy',
width: 120
},
];
/**首页-搜索表单*/
export const searchFormSchema: FormSchema[] = [
{
......@@ -215,7 +234,7 @@ export const mainFormSchema4: FormSchema[] = [
},
];
/**重跑 表单*/
export const runAgainSchema: FormSchema[] = [
export const runAgainSchema1: FormSchema[] = [
{
field: 'scopeAction',
label: '作用范围',
......@@ -250,6 +269,28 @@ export const runAgainSchema: FormSchema[] = [
slot:'slot'
}
];
/**重跑 表单*/
export const runAgainSchema2: FormSchema[] = [
{
field: 'scopeAction',
label: '作用范围',
component: 'RadioGroup',
defaultValue: '当前任务',
componentProps: {
options: [
{ label: '当前任务', value: '当前任务' },
{ label: '当前及其下游', value: '当前及其下游' },
],
},
colProps: { lg: 24, md: 24 },
},
{
field:'slot',
label:'',
component:'',
slot:'slot'
}
];
/**详情页-任务列表*/
export const tableListColumns: BasicColumn[] = [
{
......
src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/taskFlowMaintenanceData.ts → src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/periodicSchedulingData.ts
View file @ 7fc04ad0
......@@ -37,7 +37,7 @@ export const TreeData: any[] = [
},
];
/**主页面列表 数据*/
/**主页面列表 数据1*/
export const tableData: any[] =[
{
id:1,
......@@ -148,6 +148,39 @@ export const tableData: any[] =[
executionId:'49027'
},
]
/**主页面列表 数据2*/
export const tableData2: any[] =[
{
id:1,
conditionType:'触发条件',
detail:'周期调度到达',
satisfy:'满足',
},
{
id:2,
conditionType:'执行资源',
detail:'已分配scheduler',
satisfy:'满足',
},
{
id:3,
conditionType:'上游依赖',
detail:'任务流:/共享工作区/依赖关系/有周\n' +
'期/寻找依赖超时测试-上游任务流\n' +
'执行记录ID：51200\n' +
'调度时间:2024-01-30 11:36:00.000',
satisfy:'等待',
},
{
id:4,
conditionType:'上游依赖',
detail:'任务流:/共享工作区/依赖关系/有周\n' +
'期/寻找依赖超时测试-上游任务流\n' +
'执行记录ID：51221\n' +
'调度时间:2024-01-31 12:15:00.000',
satisfy:'等待',
},
]
/**主页面 左侧List*/
export const treeData2:any[] = [
{
......
src/views/taskScheduling/taskFlowMaintenance/supplyNumber/index.vue
View file @ 7fc04ad0
<template>
<div class="center">
<div class="center1">
<div class="center1-1">
<Icon icon="material-symbols:sync" :size="35" :color="'rgb(121, 74, 235)'"/>
<div class="center1-1-1">补数记录</div>
<div class="selectCss">
<BasicForm @register="registerForm"/>
</div>
</div>
<div>
<a-button type="primary" style="margin-right: 10px" @click="reloadButton">手动刷新</a-button>
<a-button type="primary" style="margin-right: 10px" @click="cancelBatchButton">取消</a-button>
<a-button type="primary" style="margin-right: 10px" @click="deleteBatchButton">删除</a-button>
<a-button type="primary" style="margin-right: 10px" @click="addSupplyNumberButton">新增补数</a-button>
</div>
</div>
<div class="center2">
<div class="center2-1">
<div style="margin-left: 10px">
<BasicForm @register="registerForm2"/>
</div>
</div>
<BasicTable @register="registerTable">
<template #headerTop="{ column, record }">
<div class="center2">
<div class="center2-1">
<Icon icon="material-symbols:sync" :size="35" :color="'rgb(121, 74, 235)'"/>
<div class="center2-1-1">补数记录</div>
<div class="selectCss">
<BasicForm @register="registerForm"/>
</div>
</div>
<div>
<a-button type="primary" style="margin-right: 10px" @click="reloadButton">手动刷新</a-button>
<a-button type="primary" :disabled="getRowSelection().selectedRowKeys <= 0" style="margin-right: 10px" @click="cancelBatchButton">取消</a-button>
<a-button type="primary" style="margin-right: 10px" @click="deleteBatchButton">删除</a-button>
<a-button type="primary" style="margin-right: 10px" @click="addSupplyNumberButton">新增补数</a-button>
</div>
</div>
<div class="center1-1">
<div style="margin-left: 10px">
<BasicForm @register="registerForm2"/>
</div>
</div>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
......@@ -91,7 +93,7 @@
const [registerSupplyNumberSettingModal, { openModal: openSupplyNumberSettingModal }] = useModal();
const [registerTable, { reload,getForm,getRowSelection }] = useTable({
title: '',
title: ' ',
api: async (params) => {
const response = {
pageNu: "1",
......@@ -110,6 +112,7 @@
useSearchForm: false,
showTableSetting: false,
showIndexColumn:false,
striped: false,
bordered: true,
actionColumn: {
width: 150,
......@@ -149,7 +152,7 @@
})
}
/***/
/**跳转 */
function showDetails(record){
router.push({
path: '/taskScheduling/taskFlowMaintenance/periodicScheduling/index',
......@@ -159,6 +162,12 @@
})
}
/**手动刷新 按钮*/
function reloadButton(record){
createMessage.success('刷新成功!')
}
/**取消 按钮*/
function cancelButton(record){
createMessage.success('取消成功!')
......@@ -248,32 +257,29 @@
.center{
width: 100%;
height: 100%;
background-color: white;
.center1{
width: 100%;
height: 10%;
.center1-1{
margin-top: 10px;
height: 35px;
}
}
.center2{
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
.center1-1{
.center2-1{
display:flex;
height: 30px;
margin-left: 20px;
.center1-1-1{
.center2-1-1{
display: flex;
align-items: center;
font-weight: bold
}
}
}
.center2{
width: 100%;
height:90%;
.center2-1{
display: flex;
justify-content: space-between
}
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment