Skip to content

B
bigDataSystem
Commit db2df508 authored by 罗林杰's avatar 罗林杰
Browse files
Options

Merge remote-tracking branch 'origin/master'

parents 3e1b5bd2 13719225
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 2944 additions and 507 deletions
src/router/routes/index.ts
View file @ db2df508
......@@ -880,6 +880,30 @@ export const serviceDevelopmentRoute: AppRouteRecordRaw = {
],
};
/**任务调度-任务流运维*/
export const taskSchedulingRoute: AppRouteRecordRaw = {
path: '/taskScheduling/taskFlowMaintenance',
name: 'taskFlowMaintenance',
component: LAYOUT,
meta: {
title: '任务调度',
icon: '',
hidden: true,
currentActiveMenu: '/taskScheduling/taskFlowMaintenance',
},
children: [
{
path: 'periodicScheduling/executionDetails',
name: 'executionDetails',
component: () => import('@/views/taskScheduling/taskFlowMaintenance/periodicScheduling/executionDetails.vue'),
meta: {
title: '执行详情',
icon: '',
},
},
],
};
/**实时同步-任务运维*/
export const SyncMaintenanceRoute: AppRouteRecordRaw = {
path: '/realTimeSync',
......@@ -918,6 +942,7 @@ export const basicRoutes = [
sqlExecuteRoute,
shellExecuteRoute,
SyncMaintenanceRoute,
taskSchedulingRoute,
...mainOutRoutes,
REDIRECT_ROUTE,
DataWarehousePlanningRoute,
......
src/views/dataIntegration/taskOM/index.vue
View file @ db2df508
......@@ -5,58 +5,65 @@
<Row :gutter="16" class="homePage_left">
<Col :span="24">
<Card>
<div class="card_content">
<Col :span="4">
<div class="card_item">
<div class="card_itemInfo">
<div ref="chartRef" :style="{ width, height }"></div>
<div style="flex: 1">
<div class="ml-1 mt-1">
<BasicForm @register="registerForm"/>
</div>
<div class="card_content">
<col :span="3" />
<Col :span="3">
<div class="card_item">
<div class="card_itemInfo">
<div ref="chartRef" :style="{ width, height }"></div>
</div>
</div>
</div>
</Col>
<Col :span="4" @click="clickButton(1)" :class="{ 'listItemClass': selectedItem === 1 }">
<div class="card_item">
<div class="card_itemInfo">
<div class="dataNum">10</div>
<div class="dataTitle">执行记录</div>
</Col>
<Col :span="3" @click="clickButton(1)" :class="{ 'listItemClass': selectedItem === 1 }">
<div class="card_item">
<div class="card_itemInfo">
<div class="dataNum">10</div>
<div class="dataTitle">执行记录</div>
</div>
</div>
</div>
</Col>
<Col :span="4" @click="clickButton(2)" :class="{ 'listItemClass': selectedItem === 2 }">
<div class="card_item">
<Icon icon="ant-design:check-circle-filled" :size="30" :color="'rgb(84,198,159)'" />
<div class="card_itemInfo">
<div class="dataNum">1</div>
<div class="dataTitle">成功</div>
</Col>
<Col :span="3" @click="clickButton(2)" :class="{ 'listItemClass': selectedItem === 2 }">
<div class="card_item">
<Icon icon="ant-design:check-circle-filled" :size="30" :color="'rgb(84,198,159)'" />
<div class="card_itemInfo">
<div class="dataNum">1</div>
<div class="dataTitle">成功</div>
</div>
</div>
</div>
</Col>
<Col :span="4" @click="clickButton(3)" :class="{ 'listItemClass': selectedItem === 3 }">
<div class="card_item">
<Icon icon="line-md:loading-twotone-loop" :size="30" :color="'rgb(81, 160, 248)'" />
<div class="card_itemInfo">
<div class="dataNum">2</div>
<div class="dataTitle">进行中</div>
</Col>
<Col :span="3" @click="clickButton(3)" :class="{ 'listItemClass': selectedItem === 3 }">
<div class="card_item">
<Icon icon="line-md:loading-twotone-loop" :size="30" :color="'rgb(81, 160, 248)'" />
<div class="card_itemInfo">
<div class="dataNum">2</div>
<div class="dataTitle">进行中</div>
</div>
</div>
</div>
</Col>
<Col :span="4" @click="clickButton(4)" :class="{ 'listItemClass': selectedItem === 4 }">
<div class="card_item">
<Icon icon="line-md:close-circle-filled" :size="30" :color="'rgb(212, 115, 113)'" />
<div class="card_itemInfo">
<div class="dataNum">3</div>
<div class="dataTitle">失败</div>
</Col>
<Col :span="3" @click="clickButton(4)" :class="{ 'listItemClass': selectedItem === 4 }">
<div class="card_item">
<Icon icon="line-md:close-circle-filled" :size="30" :color="'rgb(212, 115, 113)'" />
<div class="card_itemInfo">
<div class="dataNum">3</div>
<div class="dataTitle">失败</div>
</div>
</div>
</div>
</Col>
<Col :span="4" @click="clickButton(5)" :class="{ 'listItemClass': selectedItem === 5 }">
<div class="card_item">
<Icon icon="ri:hourglass-fill" :size="30" :color="'rgb(147, 140, 206)'" />
<div class="card_itemInfo">
<div class="dataNum">4</div>
<div class="dataTitle">等待</div>
</Col>
<Col :span="3" @click="clickButton(5)" :class="{ 'listItemClass': selectedItem === 5 }">
<div class="card_item">
<Icon icon="ri:hourglass-fill" :size="30" :color="'rgb(147, 140, 206)'" />
<div class="card_itemInfo">
<div class="dataNum">4</div>
<div class="dataTitle">等待</div>
</div>
</div>
</div>
</Col>
</Col>
<col :span="3" />
</div>
</div>
</Card>
</Col>
......@@ -109,10 +116,11 @@ import {useGo} from "@/hooks/web/usePage";
import DeptTree from "./DeptTable.vue";
import {BasicTable, TableAction, useTable} from "@/components/Table";
import {tableList,mockData} from "./mock";
import { columns,searchFormSchema,schema } from "./taskOM.data"
import { columns,searchFormSchema,schema,resetNameFormSchema } from "./taskOM.data"
import {Description, useDescription} from "@/components/Description";
import {push} from "echarts/types/src/component/dataZoom/history";
import {router} from "@/router";
import {BasicForm,useForm} from "@/components/Form";
defineOptions({ name: 'AccountManagement' });
......@@ -193,6 +201,17 @@ watch(
},
{ immediate: true },
);
//初始化表单
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 100,
baseColProps: { lg: 24, md: 24 },
schemas: resetNameFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
/**列表right*/
const [registerTable, { reload, updateTableDataRecord, getSearchInfo,getForm,getRowSelection }] = useTable({
title: '执行记录',
......@@ -279,7 +298,8 @@ function clickButton(item){
::v-deep(.ant-card-body) {
display: flex;
justify-content: center;
height: 180px;
height: 150px;
padding: 0;
}
.homePage_left {
::v-deep(.ant-tabs-tab) {
......@@ -287,7 +307,7 @@ function clickButton(item){
font-weight: 600;
}
.card_content {
width: 70%;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
......
src/views/dataIntegration/taskOM/taskOM.data.ts
View file @ db2df508
......@@ -65,6 +65,103 @@ export const searchFormSchema: FormSchema[] = [
},
];
/**左上角表单*/
export const resetNameFormSchema: FormSchema[] = [
{
field: 'schedulingTime',
component: 'RadioButtonGroup',
colProps: {
lg: 4, md: 4,
},
defaultValue: '1',
componentProps: {
options: [
{
label: '调度时间',
value: '1',
},
{
label: '执行时间',
value: '2',
},
],
onChange: (e) => {
console.log(e);
},
},
},
{
field: 'days',
component: 'DatePicker',
colProps: {
lg: 3,
md: 3,
},
defaultValue: new Date(),
componentProps: {
format: 'YYYY-MM-DD',
placeholder: '选择日期范围',
},
},
{
field: 'schedulingType',
component: 'Select',
label: '调度类型',
colProps: {
lg: 4, md: 4,
},
defaultValue: '1',
componentProps: {
options: [
{
label: '不限',
value: '1',
key: '1',
},
{
label: '不限2',
value: '2',
key: '2',
},
{
label: '不限3',
value: '3',
key: '3',
},
],
},
},
{
field: 'publishingStatus',
component: 'Select',
label: '发布状态',
colProps: {
lg: 4, md: 4,
},
defaultValue: '1',
componentProps: {
options: [
{
label: '不限',
value: '1',
key: '1',
},
{
label: '不限2',
value: '2',
key: '2',
},
{
label: '不限3',
value: '3',
key: '3',
},
],
},
},
];
export const schema: DescItem[] = [
{
field: 'schedulingCycle',
......
src/views/dataService/serviceManage/onlineManage/index.vue
View file @ db2df508
......@@ -17,11 +17,11 @@
</template>-->
<BasicTable @register="registerTable" :rowSelection="rowSelection" :searchInfo="searchInfo">
<template #toolbar>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary"
@click="handleDeleteIds">创建商城API
<a-button type="primary"
@click="createMallAPI ">创建商城API
</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary"
@click="handleDeleteIds">下载API Doc
@click="DownloadAPI">下载API Doc
</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <=0" type="primary"
@click="handleDeleteIds">删除
......@@ -45,7 +45,7 @@
icon:'ant-design:fund-projection-screen-outlined',
tooltip:'详情',
/*label: '详情',*/
onClick: handleOffline.bind(null, record),
onClick: other.bind(null, record),
ifShow: () => {
return record.flag !== '开发中';
},
......@@ -72,7 +72,7 @@
icon:'ant-design:container-twotone',
tooltip:'API',
/*label: 'API',*/
onClick: handleOffline.bind(null, record),
onClick: apiDetail.bind(null, record),
ifShow: () => {
return record.flag !== '';
},
......@@ -81,7 +81,7 @@
icon:'ant-design:setting-outlined',
tooltip:'设置',
/*label: '设置',*/
onClick: handleOffline.bind(null, record),
onClick: Settings.bind(null, record),
ifShow: () => {
return record.flag !== '开发中'&& record.flag === '已上线';
},
......@@ -136,7 +136,7 @@
</span>
</template>
</BasicTable>
<sensitiveTypeModal @register="registerModal" @success="handleSuccess"/>
<!-- <sensitiveTypeModal @register="registerModal" @success="handleSuccess"/>-->
</PageWrapper>
</template>
<script lang="ts" setup>
......@@ -192,7 +192,7 @@ const [registerTable, {
return info;
},
actionColumn: {
width: 250,
width: 220,
title: '操作',
dataIndex: 'action',
// slots: { customRender: 'action' },
......@@ -201,24 +201,30 @@ const [registerTable, {
/**查看API*/
function seeApi(record) {
const mode = record.mode
const mode = record.mode;
if (mode === '向导模式') {
router.push({
path: '/dataService/serviceManage/guideModeApi',
query: {}
})
path: '/dataService/serviceDevelopment/guideModeApi',
query: {},
});
}
if (mode === 'SQL模式') {
router.push({
path: '/dataService/serviceManage/sqlModeApi',
query: {}
})
path: '/dataService/serviceDevelopment/sqlModeApi',
query: {},
});
}
if (mode === '托管模式') {
router.push({
path: '/dataService/serviceManage/trusteeshipModeApi',
query: {}
})
path: '/dataService/serviceDevelopment/trusteeshipModeApi',
query: {},
});
}
if (mode === '编排模式') {
router.push({
path: '/dataService/serviceDevelopment/trusteeshipModeApi',
query: {},
});
}
}
......@@ -242,17 +248,47 @@ function handleConsanguinity(record: Recordable) {
});
}
/**下线按钮*/
function handleOffline() {
/**设置按钮*/
function Settings() {
}
/**按钮*/
function other() {
}
/**api详情按钮*/
function apiDetail() {
}
/**下线按钮*/
function handleOffline(record) {
// 修改 record 对象的 flag 值为 "未上线"
record.flag = '未上线';
}
/**上线按钮*/
function handleOnline() {
router.push({
path: '/dataService/serviceManage/onlineManage/productionData',
query: {
},
});
}
/**创建商城API按钮*/
function createMallAPI() {
createConfirm({
iconType: 'warning',
title: '功能待完善',
content: '具体后续~~~？',
});
}
/**下载API Doc按钮*/
function DownloadAPI() {
createConfirm({
iconType: 'warning',
title: '确认下载',
content: '确认批量下载选中数据吗？',
onOk() {
createMessage.success('下载成功!');
},
});
}
......@@ -278,7 +314,7 @@ function handleDeleteIds() {
}
/** 新增/编辑成功*/
function handleSuccess({isUpdate, values}) {
/*function handleSuccess({isUpdate, values}) {
if (isUpdate) {
// 演示不刷新表格直接更新内部数据。
// 注意：updateTableDataRecord要求表格的rowKey属性为string并且存在于每一行的record的keys中
......@@ -288,7 +324,7 @@ function handleSuccess({isUpdate, values}) {
} else {
reload();
}
}
}*/
onMounted(() => {
......@@ -310,16 +346,16 @@ onMounted(() => {
.save-button {
position: absolute; /* 绝对定位 */
top: 15px; /* 顶部对齐 */
right: 10px; /* 右侧对齐 */
margin: 10px 60px 10px 10px; /* 可选：增加一些边缘间距 */
position: absolute;
top: 15px;
right: 10px;
margin: 10px 60px 10px 10px;
}
.save-button1 {
position: absolute; /* 绝对定位 */
top: 15px; /* 顶部对齐 */
right: 10px; /* 右侧对齐 */
margin: 10px; /* 可选：增加一些边缘间距 */
position: absolute;
top: 15px;
right: 10px;
margin: 10px;
}
</style>
src/views/dataService/serviceManage/onlineManage/mock.ts
View file @ db2df508
......@@ -60,11 +60,22 @@ export const tableList: any[] = [
path: 'API/共享工作区/tuomin_demo',
},
];
/**上线设置-复合框数据*/
export const routeList:any[] =[
{ label: '路由A', value: 'routeA' },
{ label: '路由B', value: 'routeB' },
{ label: '路由C', value: 'routeC' },];
{ value: '1', label: 'gateway地址'},
{ value: '2', label: '域名' },
];
export const timeList:any[] =[
{ value: '1', label: '秒'},
{ value: '2', label: '分' },
{ value: '3', label: '时' },];
export const timesDataList:any[] =[
{ value: '1', label: '每秒/次'},
{ value: '2', label: '每分/次'},
{ value: '3', label: '每时/次'},
{ value: '4', label: '每天/次'},
];
export const modelData:any[] = [
{
id:1,
......
src/views/dataService/serviceManage/onlineManage/onlineManage.data.ts
View file @ db2df508
......@@ -215,16 +215,368 @@ export const apiDetailSchema: DescItem[] = [
];
/** 上线设置表单(暂无引用)*/
export const productionDataSchemas: FormSchema[] = [
export const schemas: FormSchema[] = [
{
field: 'field1',
field: 'title1',
component: 'BasicTitle',
label: '路由转发配置',
componentProps: {
// line: true,
span: true,
},
colProps: {
span: 24,
},
},
{
field: 'routeName',
component: 'Input',
label: '字段1',
label: '路由名称',
colProps: {
span: 8,
span: 20,
},
required: true,
},
{
field: 'protocolType',
component: 'Select',
label: '协议类型',
colProps: {
span: 20,
},
componentProps: {
/*mode: 'multiple',*/
options: [
{
label: 'Http',
value: '1',
key: '1',
},
{
label: 'Https',
value: '2',
key: '2',
},
],
onChange: (value) => {
console.log(value, '123');
},
},
rules: [
{
required: true,
message: '请选择',
/*type: 'array',// 如果你启用了多选，使用 array*/
type: 'string',
},
],
},
{
field: 'APISpecification',
component: 'Select',
label: '接口规范',
colProps: {
span: 20,
},
componentProps: {
options: [
{
label: 'rest',
value: '1',
key: '1',
},
{
label: 'webservice',
value: '2',
key: '2',
},
],
onChange: (value) => {
console.log(value, '123');
},
},
rules: [
{
required: true,
message: '请选择',
type: 'string',
},
],
},
{
field: 'requestMethod',
component: 'Select',
label: '请求方式',
colProps: {
span: 20,
},
componentProps: {
options: [
{
label: 'Get',
value: '1',
key: '1',
},
{
label: 'Post',
value: '2',
key: '2',
},
],
onChange: (value) => {
console.log(value, '123');
},
},
rules: [
{
required: true,
message: '请选择',
type: 'string',
},
],
},
{
field: 'accessMethod',
component: 'RadioGroup',
label: '访问方式',
colProps: {
span: 20,
},
componentProps: {
options: [
{
label: '通过域名访问',
value: '1',
},
{
label: '通过IP访问',
value: '2',
},
],
},
rules: [{required: true, message: '覆盖默认生成的校验信息'}],
},
{
field: 'dynamicRouting',
fields: ['dynamic'],
component: 'Input',
label: '动态路由',
colProps: {
span: 20,
},
colSlot: 'dynamicRouting'
},
{
field: 'businessGrouping',
component: 'Select',
label: '业务分组',
colProps: {
span: 20,
},
componentProps: {
options: [
{
label: '默认业务分组',
value: '1',
key: '1',
},
{
label: '默认业务分组1',
value: '2',
key: '2',
},
],
onChange: (value) => {
console.log(value, '123');
},
},
rules: [
{
required: true,
message: '请选择',
type: 'string',
},
],
},
{
field: 'title2',
component: 'BasicTitle',
label: '安全配置',
componentProps: {
// line: true,
span: true,
},
colProps: {
span: 24,
},
},
{
field: 'enableAllLogs',
component: 'RadioGroup',
label: '开启所有日志',
colProps: {
span: 20,
},
componentProps: {
options: [
{
label: '是',
value: '1',
},
{
label: '否',
value: '2',
},
],
},
rules: [{required: true, message: '覆盖默认生成的校验信息'}],
},
{
field: 'maxLogRetention',
component: 'Input',
label: '日志最长保存',
colProps: {
span: 20,
},
suffix: '天',
required: true,
},
{
field: '[startDateTime, endDateTime]',
/* field: 'expirationDate',*/
label: '有效期',
component: 'RangePicker',
componentProps: {
format: 'YYYY-MM-DD HH:mm:ss',
placeholder: ['开始日期、时间', '结束日期、时间'],
showTime: {format: 'HH:mm:ss'},
},
},
{
field: 'cronExpression',
component: 'Input',
label: 'Cron表达式',
colProps: {
span: 20,
},
},
{
field: 'expirationDuration',
fields: ['expiration'],
component: 'Input',
label: '有效期持续时间',
colProps: {
span: 20,
},
colSlot: 'expirationDuration'
},
{
field: 'rateLimitPolicy',
fields: ['rateLimit'],
component: 'Input',
label: '流控策略',
colProps: {
span: 20,
},
colSlot: 'rateLimitPolicy'
},
{
field: 'encryptionMethod',
component: 'Select',
label: '加密方式',
colProps: {
span: 20,
},
componentProps: {
options: [
{
label: '加密',
value: '1',
key: '1',
},
{
label: '不加密',
value: '2',
key: '2',
},
],
onChange: (value) => {
console.log(value, '123');
},
},
rules: [
{
required: true,
message: '请选择',
type: 'string',
},
],
},
{
field: 'authenticationMode',
component: 'Select',
label: '鉴权模式',
colProps: {
span: 20,
},
componentProps: {
options: [
{
label: '简单token鉴权',
value: '1',
key: '1',
},
{
label: '复杂token鉴权',
value: '2',
key: '2',
},
],
onChange: (value) => {
console.log(value, '123');
},
},
rules: [
{
required: true,
message: '请选择',
type: 'string',
},
],
},
{
field: 'requestExample',
component: 'Input',
label: '请求示例',
colProps: {
span: 20,
},
componentProps: {
placeholder: ['curl-X POST -H’Content-Type: application/json; charset=utf-8‘ -H -d'],
},
helpMessage: ['您可以参考示例书写'],
},
{
field: 'associatedList',
component: 'RadioGroup',
label: '关联名单',
colProps: {
span: 23,
},
componentProps: {
options: [
{
label: '关联',
value: '1',
},
{
label: '不关联',
value: '2',
},
],
},
rules: [{required: true, message: '覆盖默认生成的校验信息'}],
},
];
/** 上线测试列表*/
export const testTableSchema: BasicColumn[] = [
......
src/views/realTimeSync/strategicIndicators/clearStrategic.vue 0 → 100644
View file @ db2df508
<template>
<PageWrapper
style="height: clamp(200px, 100vw, 800px)"
contentFullHeight
fixedHeight
title="任务清理策略配置"
>
<template #footer>
<div style="color: #d3d5e1; font-size: 12px"
>以下配置项修改后无需重启当前任务，保存后即可生效。</div
>
<Alert
style="margin: 20px 0"
type="warning"
showIcon
message="该策略将会对实时任务的一致性检查统计数据、异常数据、事件记录数据、任务监控采样数据做定期清理。"
/>
<BasicForm @register="registerForm">
<template #retainTime="{ field, model }">
<RadioGroup v-model:value="model[field]">
<Radio :style="radioStyle" :value="1"
><span>保留从</span><DatePicker style="width: 200px" /><span
>开始的所有执行或监控数据</span
></Radio
>
<Radio :style="radioStyle" :value="2"
><span>保留时间为</span><InputNumber style="width: 200px" /><span
>天的执行或监控数据</span
></Radio
>
</RadioGroup>
</template>
<template #formFooter>
<a-button style="margin-left: 30%" type="primary" @click="handleSave"> 保存 </a-button>
</template>
</BasicForm>
</template>
</PageWrapper>
</template>
<script lang="ts" setup>
import PageWrapper from '@/components/Page/src/PageWrapper.vue';
import { Alert, RadioGroup, DatePicker, InputNumber, Radio } from 'ant-design-vue';
import BasicForm from '@/components/Form/src/BasicForm.vue';
import { useMessage } from '@/hooks/web/useMessage';
import { useForm } from '@/components/Form';
import { checkFormSchema, clearFormSchema } from './strategic.data';
import { reactive } from 'vue';
const { createMessage } = useMessage();
const radioStyle = reactive({
display: 'flex',
height: '30px',
margin: '0 0 20px 0',
lineHeight: '30px',
});
const [registerForm, { setFieldsValue, updateSchema, resetFields, validate }] = useForm({
labelWidth: 300,
schemas: clearFormSchema,
showActionButtonGroup: false,
actionColOptions: {
span: 24,
},
});
function handleSave() {
createMessage.success('保存成功!');
}
</script>
<style scoped></style>
src/views/realTimeSync/strategicIndicators/errorStrategic.vue 0 → 100644
View file @ db2df508
<template>
<BasicTable @register="registerTable">
<template #eventHandle="{ text, record }">
<RadioGroup v-model:value="record.eventHandle" :options="eventList" />
</template>
</BasicTable>
</template>
<script lang="ts" setup>
import BasicTable from '@/components/Table/src/BasicTable.vue';
import { BasicTableProps, useTable } from '@/components/Table';
import { errorData } from './strategicData';
import { errorColumns, systemColumns } from './strategic.data';
import { RadioGroup } from 'ant-design-vue';
import { reactive } from 'vue';
const eventList = [
{
label: '目标端停止写入任务',
value: '1',
},
{
label: '忽略并继续写入',
value: '2',
},
];
const [
registerTable,
{
reload,
updateTableDataRecord,
setTableData,
setColumns,
getSearchInfo,
getForm,
getRowSelection,
setSelectedRows,
clearSelectedRowKeys,
},
] = useTable({
scroll: { y: 200 },
api: async (params) => {
console.log('params:', params);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: errorData.length,
code: '',
message: '',
data: errorData,
};
return { ...response };
},
rowKey: 'strategicId',
columns: errorColumns,
showIndexColumn: false,
useSearchForm: false,
striped: true,
showTableSetting: false,
bordered: false,
pagination: false,
handleSearchInfoFn(info) {
return info;
},
} as BasicTableProps);
</script>
<style scoped></style>
src/views/realTimeSync/strategicIndicators/strategic.data.ts 0 → 100644
View file @ db2df508
This diff is collapsed.
src/views/realTimeSync/strategicIndicators/strategicData.ts 0 → 100644
View file @ db2df508
export const TreeSystem: any[] = [
{
strategicId: 101,
strategicName: '数据积压默认策略',
strategicType: '数据积压策略',
},
{
strategicId: 102,
strategicName: '目标端数据异常默认策略',
strategicType: '数据异常策略',
},
{
strategicId: 103,
strategicName: 'DB-DB源端DDL处理默认策略',
strategicType: 'DB-DB源媛DDL处理策略',
},
{
strategicId: 104,
strategicName: '系统异常默认策略',
strategicType: '系统异常策略',
},
{
strategicId: 105,
strategicName: '一致性检查默认策略',
strategicType: '致性检查策略',
},
{
strategicId: 106,
strategicName: 'DB-Kafka源端DDL处理默认策略',
strategicType: 'DB-Kafka源端DDL处理策略',
},
];
export const systemData: any[] = [
{
eventDetail: '源端解析异常',
eventHandle: '任务暂停',
isStop: false,
},
{
eventDetail: 'Kafka异常',
eventHandle: '',
isStop: true,
},
{
eventDetail: '内部异常',
eventHandle: '任务暂停',
isStop: false,
},
{
eventDetail: '数据源连接异常',
eventHandle: '',
isStop: true,
},
]
export const errorData: any[] = [
{
eventDetail: '数据异常',
eventHandle: '',
},
]
src/views/realTimeSync/strategicIndicators/systemStrategic.vue 0 → 100644
View file @ db2df508
<template>
<BasicTable @register="registerTable">
<template #eventHandle="{ text, record }">
<div v-if="record.isStop">
<span>若连接超时，自动重试</span><Input v-model:value="record.eventHandle" /><span
>分钟，其它场景均任务暂停</span
>
</div>
<div v-else>任务暂停</div>
</template>
</BasicTable>
</template>
<script lang="ts" setup>
import BasicTable from '@/components/Table/src/BasicTable.vue';
import { BasicTableProps, useTable } from '@/components/Table';
import { systemData } from './strategicData';
import { systemColumns } from './strategic.data';
const [
registerTable,
{
reload,
updateTableDataRecord,
setTableData,
setColumns,
getSearchInfo,
getForm,
getRowSelection,
setSelectedRows,
clearSelectedRowKeys,
},
] = useTable({
scroll: { y: 200 },
api: async (params) => {
console.log('params:', params);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: systemData.length,
code: '',
message: '',
data: systemData,
};
return { ...response };
},
rowKey: 'strategicId',
columns: systemColumns,
showIndexColumn: false,
useSearchForm: false,
striped: true,
showTableSetting: false,
bordered: false,
pagination: false,
handleSearchInfoFn(info) {
return info;
},
actionColumn: {
width: 20,
title: '',
dataIndex: 'action',
},
} as BasicTableProps);
</script>
<style scoped></style>
src/views/schedulingExecution/taskFlow/index.vue 0 → 100644
View file @ db2df508
<template>
</template>
<script>
export default {
name: "index"
}
</script>
<style scoped>
</style>
src/views/taskScheduling/taskFlowDesign/deleteModel.vue
View file @ db2df508
......@@ -126,7 +126,6 @@
pagination: false,
} as BasicTableProps);
async function handleSubmit() {
createMessage.success('版本发布成功。');
closeModal();
}
</script>
src/views/taskScheduling/taskFlowDesign/index.vue
View file @ db2df508
......@@ -18,7 +18,12 @@
<a-button v-if="!versionFlag" type="primary">运行当前及下游</a-button>
<a-button v-if="!versionFlag" type="primary">调试</a-button>
<a-button v-if="!versionFlag" type="primary" @click="handleSave">保存</a-button>
<a-button v-if="!versionFlag" type="primary" @click="handleUpload">发布</a-button>
<a-button v-if="!versionFlag && !uploadFlag" type="primary" @click="handleUpload"
>发布</a-button
>
<a-button v-if="!versionFlag && uploadFlag" type="primary" @click="handleOffline"
>下线</a-button
>
<div style="display: flex; flex-direction: column; text-align: center">
<RadioGroup v-model:value="showType" button-style="solid" size="small">
<RadioButton value="table"><UnorderedListOutlined /></RadioButton>
......@@ -27,7 +32,7 @@
<div>展示切换</div>
</div>
<a-button type="primary" @click="handleConfig">任务流配置</a-button>
<a-button type="primary">参数设置</a-button>
<a-button type="primary" @click="handleSetConfig">参数设置</a-button>
<a-button type="primary">任务列表</a-button>
<a-button type="primary" @click="handleDepend">任务流依赖</a-button>
<a-button type="primary" @click="handleVersion">版本管理</a-button>
......@@ -39,7 +44,9 @@
><SwapRightOutlined :rotate="rotate" />按执行计划排序</a-button
>
<a-button :disabled="getRowSelection().selectedRowKeys <= 0">复制</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <= 0">删除</a-button>
<a-button :disabled="getRowSelection().selectedRowKeys <= 0" @click="handleDeleteMore"
>删除</a-button
>
<Dropdown :trigger="['click']">
<a-button type="primary" @click.prevent><PlusOutlined />新建任务</a-button>
<template #overlay>
......@@ -116,9 +123,11 @@
<UpstreamModel @register="upstreamTaskModel" />
<DependModel @register="dependModel" />
<TaskConfigModel @register="taskConfigModel" />
<UploadModel @register="uploadModel" />
<UploadModel @register="uploadModel" @set-upload-flag="setUploadFlag" />
<VersionModel @register="versionModel" @set-version="setVersion" @show-dag="showDag" />
<DeleteModel @register="deleteModel" />
<OfflineModel @register="offlineModel" @set-upload-flag="setUploadFlag" />
<TaskFlowConfig @register="taskFlowConfig" />
</PageWrapper>
</template>
......@@ -178,6 +187,8 @@
import UploadModel from './uploadModel.vue';
import VersionModel from './versionModel.vue';
import DeleteModel from './deleteModel.vue';
import OfflineModel from './offlineModel.vue';
import TaskFlowConfig from './taskFlowConfig.vue';
const [taskModel, { openModal: openTaskModel }] = useModal();
const [upstreamTaskModel, { openModal: openUpstreamModel }] = useModal();
......@@ -186,6 +197,8 @@
const [uploadModel, { openModal: openUploadModel }] = useModal();
const [versionModel, { openModal: openVersionModel }] = useModal();
const [deleteModel, { openModal: openDeleteModel }] = useModal();
const [offlineModel, { openModal: openOfflineModel }] = useModal();
const [taskFlowConfig, { openModal: openTaskFlowConfig }] = useModal();
const rotate = ref(90);
const showType = ref('table');
const searchInfo = reactive<Recordable>({});
......@@ -252,6 +265,11 @@
});
}
}
function handleDeleteMore() {
openDeleteModel(true, {
isUpdate: false,
});
}
function handleOrderType() {
rotate.value = rotate.value === 90 ? -90 : 90;
}
......@@ -277,6 +295,11 @@
isUpdate: false,
});
}
function handleSetConfig() {
openTaskFlowConfig(true, {
isUpdate: false,
});
}
function handleVersion() {
openVersionModel(true, {
isUpdate: false,
......@@ -293,6 +316,15 @@
isUpdate: false,
});
}
const uploadFlag = ref(false);
function setUploadFlag(flag) {
uploadFlag.value = flag;
}
function handleOffline() {
openOfflineModel(true, {
isUpdate: false,
});
}
function handleExit() {
versionFlag.value = false;
}
......
src/views/taskScheduling/taskFlowDesign/offlineModel.vue 0 → 100644
View file @ db2df508
<template>
<BasicModal
width="70%"
v-bind="$attrs"
@register="registerModal"
:title="getTitle"
@ok="handleSubmit"
>
<Alert type="warning" show-icon message="任务流存在依赖或引用，请确认是否继续该操作？" />
<Row :gutter="16">
<Col :span="8">
<List>
<template v-for="item in delList1" :key="item.id">
<List.Item
style="cursor: pointer"
@click="handleChange(item)"
:style="{ backgroundColor: selectId === item.id ? '#DCEFFF' : null }"
>
<List.Item.Meta>
<template #avatar>
<BranchesOutlined />
</template>
<template #title>
<span>{{ item.title }}</span>
</template>
</List.Item.Meta>
</List.Item>
</template>
</List>
</Col>
<Col :span="8">
<BasicTable @register="registerTable" :searchInfo="searchInfo">
<template #headerCell="{ column }">
<template v-if="column.key === 'task'">
<span>下游依赖（{{ getDataSource().length }}）</span>
</template>
</template>
</BasicTable>
</Col>
<Col :span="8">
<BasicTable @register="rightTable" :searchInfo="searchInfo">
<template #headerCell="{ column }">
<template v-if="column.key === 'task'">
<span>被引入（{{ getRightList().length }}）</span>
</template>
</template>
</BasicTable>
</Col>
</Row>
</BasicModal>
</template>
<script lang="ts" setup>
import { useTable, TableAction, BasicTableProps } from '@/components/Table';
import {ref, computed, unref, reactive, defineEmits} from 'vue';
import Icon from '@/components/Icon/Icon.vue';
import { Select, Alert, List, Row, Col } from 'ant-design-vue';
import { BranchesOutlined } from '@ant-design/icons-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 {
delTableColumn1,
infoFormSchema,
uploadModelSchema,
upstreamTaskColumn,
} from '@/views/taskScheduling/taskFlowDesign/design.data';
import { useMessage } from '@/hooks/web/useMessage';
import { delList1, delList2, delList3 } from './designData.ts';
const emit = defineEmits(['setUploadFlag']);
const getTitle = '任务流依赖/引用提醒';
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
setModalProps({ confirmLoading: false });
});
const searchInfo = reactive<Recordable>({});
const selectId = ref(1);
function handleChange(data) {
selectId.value = data.id;
let list = [...delList2];
setTableData([...list.filter((item) => item.fid === data.id)]);
}
const { createMessage } = useMessage();
const [registerTable, { getDataSource, setTableData }] = useTable({
title: '',
// 数据
api: async (params) => {
console.log('params:', params);
const response = {
code: '',
message: '',
data: delList2,
};
return { ...response };
},
rowKey: 'businessId',
// 列
columns: delTableColumn1,
striped: false,
showTableSetting: false,
showIndexColumn: false,
pagination: false,
} as BasicTableProps);
const [rightTable, { getDataSource: getRightList, setTableData: setRightList }] = useTable({
title: '',
// 数据
api: async (params) => {
console.log('params:', params);
const response = {
code: '',
message: '',
data: delList3,
};
return { ...response };
},
rowKey: 'businessId',
// 列
columns: delTableColumn1,
striped: false,
showTableSetting: false,
showIndexColumn: false,
pagination: false,
} as BasicTableProps);
async function handleSubmit() {
closeModal();
emit('setUploadFlag', false);
createMessage.success('下线成功');
}
</script>
src/views/taskScheduling/taskFlowDesign/taskFlowConfig.vue 0 → 100644
View file @ db2df508
<template>
<BasicModal
width="40%"
v-bind="$attrs"
@register="registerModal"
:title="getTitle"
@ok="handleSubmit"
>
<BasicTable @register="configTable" :searchInfo="searchInfo">
<template #name="{ text, record }">
<span v-if="record.flag === '1'">{{ text }}</span>
<Input v-else v-model:value="record.name" style="width: 100%" />
</template>
<template #type="{ text, record }">
<span v-if="record.flag === '1'">{{ text }}</span>
<Select v-else v-model:value="record.type" style="width: 100%" :options="typeOptions" />
</template>
<template #formula="{ text, record }">
<div style="display: flex">
<div style="flex: 1">
<span v-if="record.flag === '1'">{{ text }}</span>
<Input v-else v-model:value="record.formula" />
</div>
<CheckOutlined v-if="record.flag === '0'" @click="configRowSuccess(record)" />
<CloseOutlined v-else @click="configRowDelete(record)" />
</div>
</template>
</BasicTable>
</BasicModal>
</template>
<script lang="ts" setup>
import { ref, unref, reactive } from 'vue';
import { Select, Input } from 'ant-design-vue';
import { CheckOutlined, CloseOutlined } from '@ant-design/icons-vue';
import { BasicModal, useModalInner } from '@/components/Modal';
import { taskConfigColumn } from '@/views/taskScheduling/taskFlowDesign/design.data';
import BasicTable from '@/components/Table/src/BasicTable.vue';
import { useTable } from '@/components/Table';
const isUpdate = ref(false);
const isMove = ref(false);
const rowId = ref('');
const getTitle = '任务流参数配置';
const activeKey = ref('1');
let type = ref('1');
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
// resetConfigTable();
activeKey.value = '1';
setModalProps({ confirmLoading: false });
type.value = data?.type;
isUpdate.value = !!data?.isUpdate;
isMove.value = !!data?.isMove;
if (unref(isUpdate)) {
rowId.value = data.record.businessId;
}
});
//初始化列表
// 下拉
const typeOptions = [
{
label: '普通参数',
value: '普通参数',
},
{
label: '加密参数',
value: '加密参数',
},
];
// 默认值
const configData = reactive([
{
name: '',
type: '',
formula: '',
flag: '0',
},
]);
// 添加方法
function configDataAddInfo(data) {
const info = {
name: '',
type: '',
formula: '',
flag: '0',
};
data.push({ ...info });
}
// √方法，确认后添加
function configRowSuccess(record) {
record.flag = '1';
const data = getDataSource();
configDataAddInfo(data);
setTableData([...data]);
}
// 删除方法
function configRowDelete(record) {
const data = getDataSource();
const index = data.findIndex((item) => item === record);
if (index !== -1) {
data.splice(index, 1);
setTableData([...data]);
}
}
const searchInfo = reactive<Recordable>({});
const [configTable, { setTableData, getDataSource }] = useTable({
title: '',
api: async (params) => {
console.log('params', params);
const response = {
pageNu: '1',
pageSize: '10',
pages: '1',
total: configData.length,
code: '',
message: '',
data: configData,
};
return { ...response };
},
columns: taskConfigColumn,
useSearchForm: false,
showTableSetting: false,
bordered: false,
showIndexColumn: false,
striped: false,
pagination: false,
});
/**确定按钮*/
async function handleSubmit() {
closeModal();
}
</script>
src/views/taskScheduling/taskFlowDesign/uploadModel.vue
View file @ db2df508
......@@ -31,10 +31,12 @@
import { useMessage } from '@/hooks/web/useMessage';
const getTitle = '发布新版本';
const emit = defineEmits(['setUploadFlag']);
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
setModalProps({ confirmLoading: false });
});
const [register] = useForm({
labelWidth: 100,
baseColProps: { lg: 12, md: 24 },
......@@ -49,5 +51,6 @@
async function handleSubmit() {
createMessage.success('版本发布成功。');
closeModal();
emit('setUploadFlag', true);
}
</script>
src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/DependencyRelationshipDrawer.vue 0 → 100644
View file @ db2df508
<template>
<BasicDrawer
v-bind="$attrs"
@register="registerDrawer"
showFooter
:title="getTitle"
width="50%"
@ok="handleSubmit"
>
<div>
<div>
<Tabs defaultActiveKey="上游" @change="handleChangeTab">
<TabPane tab="上游" key="上游">
</TabPane>
<TabPane tab="下游" key="下游"></TabPane>
</Tabs>
</div>
</div>
</BasicDrawer>
</template>
<script lang="ts" setup>
import { BasicTable, useTable, TableAction } from '@/components/Table';
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 { 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'
const [registerLookLogModal, { openModal: openLookLogModal }] = useModal();
const [registerLookAllDataModal, { openModal: openLookAllDataModal }] = useModal();
const [registerVersionModal, { openModal: openVersionModal }] = useModal();
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const isUpdate = ref(true);
const roleId = ref('');
const getTitle = computed(() => ('任务流依赖关系'));
const treeData = ref<TreeItem[]>([]);
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
setDrawerProps({ confirmLoading: false,showOkBtn:false,showCancelBtn:false});
});
/**查看版本变更信息*/
function lookVersionButton() {
openVersionModal(true,{})
}
function handleSubmit() {
}
</script>
<style lang="less" scoped>
</style>
src/views/taskScheduling/taskFlowMaintenance/LookLogModal.vue → src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/LookLogModal.vue
View file @ db2df508
<template>
<BasicModal width="40%" v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
<textarea style="width: 100%;margin-top:20px;background-color: rgb(89, 96, 116);color: white" readonly rows="22" v-model="textAreaData"/>
<textarea class="textAreaClass" readonly rows="18" v-model="textAreaData"/>
<a-button class="buttonClass" @click="downLoadButton">下载全部日志</a-button>
</BasicModal>
</template>
<script lang="ts" setup>
......@@ -8,13 +9,26 @@
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicForm, useForm } from '@/components/Form';
import { useMessage } from '@/hooks/web/useMessage';
import {exportRoleList} from "@/api/system/role/role";
import {downloadByData} from "@/utils/file/download";
defineOptions({ name: 'AccountModal' });
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const getTitle = computed(() => ('查看日志'));
const getTitle = computed(() => ('日志'));
const textAreaData = ref('\n' +
' 源端发生DDL事件,DDL处理策略为自动变更,自动启动源端')
' [2024-01-30 00:00:00.220] flow execution [49030] submitted to scheduler [172.20.23.29:9102] at\n' +
' [FES_WAITING] state\n' +
' [2024-01-30 00:01.877] start on scheduler and create log [/home/zzh/workflow/scheduler/file/get?\n' +
' path=/tmp/log/workflow/workflow-schedule-r20240130/49030.log]\n' +
' [2024-01-30 00:01.957] success to enter priority queue\n' +
' [2024-01-30 00:02.390] used global and workspace params is [WORKSPACE=(aaa=ssdas, workspace=修\n' +
' 改工作区参数-gwx), bxwang工作区参数设置***, usd=d, w=ewew, space=space], GLOBAL=[A=0, test=\n' +
' AAA-gx, bxwang全局参数设置***, www, bxwang加密参数数据库加密***, global2=修改global2, global1=\n' +
' 修改global1, global, 全局变量参数, aaa=123123, Fl-runTime.plusDays(1).date(), T=def call]\n' +
' [2024-01-30 00:02.390] flow started running\n' +
' [2024-01-30 00:03.14.748] finished with [FES_SUCCEEDED] state\n' +
' [2024-01-30 00:03.14.786] successfully updated state [FES_SUCCEEDED]')
//初始化弹框
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
......@@ -26,4 +40,24 @@
closeModal()
}
/**下载全部日志 按钮*/
async function downLoadButton() {
const params = Object.assign({}, {});
const data = await exportRoleList(params);
downloadByData(data, '全部日志' + '.xlsx');
}
</script>
<style lang="less" scoped>
.buttonClass{
margin-top: 10px;
border-color: rgb(41, 147, 249);
color: rgb(41, 147, 249)
}
.textAreaClass{
width: 100%;
margin-top:20px;
background-color: rgb(37, 37, 37);
color: white
}
</style>
src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/TaskListDrawer.vue 0 → 100644
View file @ db2df508
<template>
<BasicDrawer
v-bind="$attrs"
@register="registerDrawer"
showFooter
:title="getTitle"
width="50%"
@ok="handleSubmit"
>
<div class="homePage_module">
<Row :gutter="16" class="homePage_left">
<Col :span="24" style="display: flex;justify-content: center">
<div class="card_content1">
<Col :span="4">
<div class="card_item">
<div class="card_itemInfo">
<div ref="chartRef1" style="width:100%;height: 100%"></div>
</div>
</div>
</Col>
<Col :span="4" @click="clickButton(1)" :class="{ 'listItemClass': selectedItem === 1 }">
<div class="card_item">
<div class="card_itemInfo">
<div class="dataTitle">任务数量：4</div>
</div>
</div>
</Col>
<Col :span="4" @click="clickButton(2)" :class="{ 'listItemClass': selectedItem === 2 }">
<div class="card_item">
<Icon icon="ri:hourglass-fill" :size="15" :color="'rgb(108, 99, 178)'" />
<div class="card_itemInfo">
<div class="dataTitle">等待：0</div>
</div>
</div>
</Col>
<Col :span="4" @click="clickButton(3)" :class="{ 'listItemClass': selectedItem === 3 }">
<div class="card_item">
<Icon icon="line-md:loading-twotone-loop" :size="15" :color="'rgb(26, 139, 236)'" />
<div class="card_itemInfo">
<div class="dataTitle">运行中：0</div>
</div>
</div>
</Col>
<Col :span="4" @click="clickButton(4)" :class="{ 'listItemClass': selectedItem === 4 }">
<div class="card_item">
<Icon icon="line-md:close-circle-filled" :size="15" :color="'rgb(54, 189, 143)'" />
<div class="card_itemInfo">
<div class="dataTitle">成功：4</div>
</div>
</div>
</Col>
<Col :span="4" @click="clickButton(5)" :class="{ 'listItemClass': selectedItem === 5 }">
<div class="card_item">
<Icon icon="line-md:minus-circle-filled" :size="15" :color="'rgb(234, 150, 0)'" />
<div class="card_itemInfo">
<div class="dataTitle">失败：0</div>
</div>
</div>
</Col>
<Col :span="4" @click="clickButton(5)" :class="{ 'listItemClass': selectedItem === 5 }">
<div class="card_item">
<Icon icon="line-md:minus-circle-filled" :size="15" :color="'rgb(234, 150, 0)'" />
<div class="card_itemInfo">
<div class="dataTitle">已取消：0</div>
</div>
</div>
</Col>
<Col :span="4" @click="clickButton(5)" :class="{ 'listItemClass': selectedItem === 5 }">
<div class="card_item">
<Icon icon="line-md:minus-circle-filled" :size="15" :color="'rgb(234, 150, 0)'" />
<div class="card_itemInfo">
<div class="dataTitle">跳过：0</div>
</div>
</div>
</Col>
<Col :span="4" @click="clickButton(5)" :class="{ 'listItemClass': selectedItem === 5 }">
<div class="card_item">
<Icon icon="line-md:minus-circle-filled" :size="15" :color="'rgb(234, 150, 0)'" />
<div class="card_itemInfo">
<div class="dataTitle">过滤：0</div>
</div>
</div>
</Col>
<Col :span="4" @click="clickButton(5)" :class="{ 'listItemClass': selectedItem === 5 }">
<div class="card_item">
<Icon icon="line-md:minus-circle-filled" :size="15" :color="'rgb(234, 150, 0)'" />
<div class="card_itemInfo">
<div class="dataTitle">阻塞：0</div>
</div>
</div>
</Col>
</div>
</Col>
</Row>
</div>
<BasicTable @register="registerTable">
<template #toolbar>
<div>
<a-input-search
v-model:value="value"
placeholder="请输入"
style="width: 200px"
@search="onSearch"
/>&nbsp;&nbsp;
任务类型&nbsp;&nbsp;<Select
style="width: 200px"
v-model:value="optionValue"
:options="options"
/>
</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="batchDownloadButton">批量下载日志</a-button>
</div>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{
icon:'teenyicons:location-outline',
onClick: lookLogButton.bind(null, record),
},
{
icon:'ix:log',
onClick: lookLogButton.bind(null, record),
},
{
icon:'codicon:debug-start',
onClick: lookLogButton.bind(null, record),
},
]"
/>
</template>
</template>
</BasicTable>
<!-- 查看日志 弹窗-->
<LookLogModal @register="registerLookLogModal" @success="handleSuccess" />
</BasicDrawer>
</template>
<script lang="ts" setup>
import { BasicTable, useTable, TableAction } from '@/components/Table';
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 { 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 LookLogModal from './LookLogModal.vue'
import {exportRoleList} from "@/api/system/role/role";
import {downloadByData} from "@/utils/file/download";
const [registerLookLogModal, { openModal: openLookLogModal }] = useModal();
const [registerLookAllDataModal, { openModal: openLookAllDataModal }] = useModal();
const [registerVersionModal, { openModal: openVersionModal }] = useModal();
const emit = defineEmits(['success', 'register']);
const { createMessage } = useMessage();
const isUpdate = ref(true);
const roleId = ref('');
const getTitle = computed(() => ('任务列表'));
const treeData = ref<TreeItem[]>([]);
const optionValue = ref('1')
const options = ref([
{
label:'全部',
value:'1',
},
{
label:'version2',
value:'2',
},
{
label:'version3',
value:'3',
}
])
const [registerTable, { reload,getForm,getRowSelection }] = useTable({
title: '',
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: taskListData.length,
code:'',
message:'',
data: [],
};
return { ...response,data: taskListData };
},
columns:tableListColumns,
rowKey: 'id',
rowSelection:true,
useSearchForm: false,
showTableSetting: false,
showIndexColumn:false,
bordered: true,
scroll: { y: 500 },
actionColumn: {
width: 180,
title: '操作',
dataIndex: 'action',
},
});
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
setDrawerProps({ confirmLoading: false,showOkBtn:false,showCancelBtn:false});
});
/**查看版本变更信息*/
function lookVersionButton() {
openVersionModal(true,{})
}
/**查看日志 按钮*/
function lookLogButton() {
openLookLogModal(true,{})
}
/**批量下载 按钮*/
async function batchDownloadButton() {
const params = Object.assign({}, {});
const data = await exportRoleList(params);
downloadByData(data, '全部日志' + '.xlsx');
}
function handleSubmit() {
}
</script>
<style lang="less" scoped>
.homePage_module {
margin-top: 20px;
::v-deep(.ant-card-body) {
display: flex;
justify-content: center;
height: 180px;
}
.homePage_left {
.card_content1 {
width: 70%;
display: flex;
justify-content: center;
align-items: center;
.card_item {
//padding-left: 20px;
display: flex;
align-items: center;
width: 100px;
height: 80px;
border-radius: 10px;
.card_itemInfo {
padding-left: 7px;
.dataTitle {
font-size: 12px;
line-height: 12px;
}
}
}
}
}
}
</style>
src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/executionDetails.vue 0 → 100644
View file @ db2df508
<template>
<div style="width: 100%;height: 100%;background-color: white">
<div style="width: 100%;height:35%">
<div class="TopClass">
<div class="eventCenterTitle">
<Icon icon="material-symbols:sync" :size="25" :color="'rgb(121, 74, 235)'" />
gxx1
</div>
<div class="selectCss">
<BasicForm @register="registerForm1">
<template #switch>
<RadioGroup v-model:value="showType" button-style="solid" size="small">
<RadioButton value="table" @click="" ><UnorderedListOutlined/></RadioButton>
<RadioButton value="chart" @click="" ><AppstoreOutlined/></RadioButton>
</RadioGroup>
</template>
</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>
</RadioGroup>
</div>
</div>
</div>
<!-- 任务列表 抽屉-->
<TaskListDrawer @register="registerDrawer" @success="handleSuccess" />
<!-- 任务列表 抽屉-->
<DependencyRelationshipDrawer @register="registerDependencyRelationshipDrawer" @success="handleSuccess" />
</div>
</template>
<script lang="ts" setup>
import { Card, Tabs, TabPane, Col, Row,RangePicker,RadioGroup,RadioButton,Tag,List} from 'ant-design-vue';
import Icon from '@/components/Icon/Icon.vue';
import {reactive, unref, onDeactivated, onMounted, ref, watch, Ref, h} from 'vue';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { PageWrapper } from '@/components/Page';
import { useMessage } from '@/hooks/web/useMessage';
import { useModal } from '@/components/Modal';
import { useGo } from '@/hooks/web/usePage';
import { useRoute } from 'vue-router';
import { router } from '@/router';
import {columns, topFormSchema2, topFormSchema1, mainFormSchema3} from './taskFlowMaintenance.data';
import { tableData,TreeData,treeData2 } from './taskFlowMaintenanceData'
import { BasicForm, useForm } from '@/components/Form';
import { useECharts } from '@/hooks/web/useECharts';
import LookLogModal from './LookLogModal.vue'
import {EllipsisOutlined} from "@ant-design/icons-vue";
import {EventDataNode} from "ant-design-vue/es/vc-tree/interface";
import {BasicTree, ContextMenuItem, TreeActionType, TreeItem} from '@/components/Tree';
import {
UnorderedListOutlined,
AppstoreOutlined,
} from '@ant-design/icons-vue';
import { Divider } from 'ant-design-vue';
import TaskListDrawer from './TaskListDrawer.vue'
import DependencyRelationshipDrawer from './DependencyRelationshipDrawer.vue'
import {useDrawer} from "@/components/Drawer";
defineOptions({ name: 'AccountManagement' });
const { createMessage, createConfirm } = useMessage();
const route = useRoute();
const go = useGo();
const showType = ref('chart')
const showType1 = ref('')
const [registerDrawer, { openDrawer }] = useDrawer();
const [registerDependencyRelationshipDrawer, { openDrawer: openDependencyRelationshipDrawer}] = useDrawer();
const [registerTable, { reload,getForm,getRowSelection }] = useTable({
title: '执行记录',
api: async (params) => {
const response = {
pageNu: "1",
pageSize: "10",
pages: "1",
total: tableData.length,
code:'',
message:'',
data: [],
};
return { ...response,data: tableData };
},
columns,
rowKey: 'id',
rowSelection:true,
useSearchForm: false,
showTableSetting: false,
showIndexColumn:false,
bordered: true,
actionColumn: {
width: 180,
title: '操作',
dataIndex: 'action',
},
});
const [registerForm1, { updateSchema:updateSchema2 }] = useForm({
labelWidth: 100,
schemas: topFormSchema2,
showActionButtonGroup: false,
actionColOptions: {
span: 23,
},
});
/**跳转任务运维 按钮*/
function toTaskMaintenanceButton(record){
router.push({
path: '/realTimeSync/taskOperationsMaintenance/index',
query: {}
});
}
/**查看日志 按钮*/
function lookLogButton(record){
}
/**任务列表 按钮*/
function taskListButton(record){
openDrawer(true,{})
}
/**任务流依赖关系 按钮*/
function relationshipButton() {
openDependencyRelationshipDrawer(true,{})
}
function handleOpen(node){
}
onMounted(() => {
});
</script>
<style lang="less" scoped>
.selectCss{
margin-right: 40px;
::v-deep(.ant-select){
width:200px!important;
}
}
.icon {
font-size: 20px !important;
}
.listClass{
::v-deep(.ant-list-item){
padding: 5px 24px 5px 10px!important;
}
::v-deep(.ant-list-item-meta-title){
margin-bottom: -5px!important;
}
}
.titleClass{
height: 40px;
background-color: rgb(233, 236, 247);
font-weight: bold;
font-size: 13px;
display: flex;
align-items: center
}
.inputSearchClass{
width: 200px;
height:40px;
margin-left: 10px;
display: flex;
align-items: center
}
.TopClass{
display: flex;
justify-content: space-between;
height: 30px;
margin-left: 30px;
margin-top: 10px;
margin-bottom: 10px;
.eventCenterTitle{
display: flex;
align-items: center;
color: rgb(109, 181, 250);
font-size: 15px
}
}
::v-deep(.ant-divider){
margin:0px 0px!important;
background-color: rgb(221, 225, 240)!important;
}
</style>
src/views/taskScheduling/taskFlowMaintenance/index.vue → src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/index.vue
View file @ db2df508
......@@ -196,7 +196,7 @@
</Tabs>
</div>
<div style="width: 100%;height:65%;display: flex;margin-top: 10px">
<div style="width: 25%;">
<div style="width: 25%;height: 500px">
<BasicTree
toolbar
search
......@@ -221,7 +221,7 @@
</template>
</BasicTree>
</div>
<div style="width: 75%;">
<div style="width: 75%;height: 500px">
<div style="display: flex;justify-content: space-between; align-items: center;margin-bottom: 10px;">
<div style="margin-top: 10px;display: flex;margin-left: 10px;align-items: center">
<div>
......@@ -252,13 +252,25 @@
<TableAction
:actions="[
{
label: '跳转任务运维',
icon:'ant-design:file-search-outlined',
onClick: detailButton.bind(null, record),
},
{
icon:'material-symbols-light:not-started-outline',
onClick: lookLogButton.bind(null, record),
// ifShow: record.eventType === '系统异常',
},
{
icon:'ix:error',
onClick: toTaskMaintenanceButton.bind(null, record),
},
{
label: '查看日志',
icon:'jam:stop-sign',
onClick: toTaskMaintenanceButton.bind(null, record),
},
{
icon:'ix:log',
onClick: lookLogButton.bind(null, record),
ifShow: record.eventType === '系统异常',
},
]"
/>
......@@ -438,7 +450,7 @@
showIndexColumn:false,
bordered: true,
actionColumn: {
width: 150,
width: 180,
title: '操作',
dataIndex: 'action',
},
......@@ -476,6 +488,14 @@
});
}
/**跳转详情 按钮*/
function detailButton(record){
router.push({
path: '/taskScheduling/taskFlowMaintenance/periodicScheduling/executionDetails',
query: {}
});
}
/**查看日志 按钮*/
function lookLogButton(record){
openLookLogModal(true,{})
......
src/views/taskScheduling/taskFlowMaintenance/taskFlowMaintenance.data.ts → src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/taskFlowMaintenance.data.ts
View file @ db2df508
......@@ -125,31 +125,24 @@ export const topFormSchema2: FormSchema[] = [
},
{
field: 'eventType',
label: '调度类型',
label: ' ',
labelWidth:20,
component: 'Select',
componentProps: {
placeholder: '类型',
options: [
{
label: '全部',
label: '调度',
value: '全部',
},
],
},
},
{
field: 'eventType',
label: '发布状态',
component: 'Select',
componentProps: {
placeholder: '类型',
options: [
{
label: '全部',
value: '全部',
},
],
},
field: 'switch',
component: '',
label: '展示切换',
slot: 'switch'
},
];
/**首页-表单3*/
......@@ -212,3 +205,47 @@ export const mainFormSchema3: FormSchema[] = [
colProps: { lg: 8, md: 24 },
},
];
/**详情页-任务列表*/
export const tableListColumns: BasicColumn[] = [
{
title: '任务名称',
dataIndex: 'taskName',
width: 120
},
{
title: '运行状态',
dataIndex: 'runStatus',
width: 120
},
{
title: '执行条件',
dataIndex: 'executionCondition',
width: 120
},
{
title: '运行开始时间',
dataIndex: 'startTime',
width: 120
},
{
title: '运行结束时间',
dataIndex: 'endTime',
width: 120
},
{
title: '运行时长',
dataIndex: 'duration',
width: 120
},
{
title: '执行版本',
dataIndex: 'executionVersion',
width: 120
},
{
title: '执行ID',
dataIndex: 'executionId',
width: 120
}
];
src/views/taskScheduling/taskFlowMaintenance/taskFlowMaintenanceData.ts → src/views/taskScheduling/taskFlowMaintenance/periodicScheduling/taskFlowMaintenanceData.ts
View file @ db2df508
......@@ -207,3 +207,86 @@ export const treeData2:any[] = [
color: 'rgb(138, 101, 235)',
},
]
/**详情页-任务列表数据*/
export const taskListData:any[] = [
{
id:1,
taskName: 'new task',
runStatus: '成功',
executionCondition: '-',
startTime: '2024-01-30 00:00:31',
endTime: '2024-01-30 00:00:33',
duration:'2s 230ms',
executionVersion:'V1',
executionId:'266336'
},
{
id:2,
taskName: 'new task_1',
runStatus: '成功',
executionCondition: '-',
startTime: '2024-01-30 00:00:32',
endTime: '2024-01-30 00:00:32',
duration:'0ms',
executionVersion:'V1',
executionId:'266335'
},
{
id:3,
taskName: 'new task_10',
runStatus: '成功',
executionCondition: '-',
startTime: '2024-01-30 00:00:36',
endTime: '2024-01-30 00:00:36',
duration:'0ms',
executionVersion:'V1',
executionId:'266334'
},
{
id:4,
taskName: 'new task_11',
runStatus: '成功',
executionCondition: '-',
startTime: '2024-01-30 00:00:45',
endTime: '2024-01-30 00:00:45',
duration:'0ms',
executionVersion:'V1',
executionId:'266333'
},
]
/**详情页-任务列表数据*/
export const detailTreeData:any[] = [
{
key: 1,
desc: '',
title: '任务流',
icons: '',
color: '',
children:[
{
key: 2,
desc: 'gxx/jira/test',
title: 'test',
icons: 'pepicons-pop:rewind-time',
color: 'rgb(138, 101, 235)',
},
]
},
{
key: 3,
desc: '',
title: '任务',
icons: '',
color: '',
children:[
{
key: 4,
desc: 'gxx/jira/test',
title: 'test',
icons: 'pepicons-pop:rewind-time',
color: 'rgb(138, 101, 235)',
},
]
},
]
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