xiangzihao
5 months ago
committed by
GitHub
30 changed files with 3 additions and 3234 deletions
@ -1,25 +0,0 @@
|
||||
# Task Definition |
||||
|
||||
## Batch Task Definition |
||||
|
||||
Task definition allows to modify or operate tasks at the task level rather than modifying them in the workflow definition. |
||||
We already have workflow level task editor in [workflow definition](workflow-definition.md) which you can click the specific |
||||
workflow and then edit its task definition. It is depressing when you want to edit the task definition but do not remember |
||||
which workflow it belongs to. So we decide to add `Task Definition` view under `Task` menu. |
||||
|
||||
![task-definition](../../../../img/new_ui/dev/project/batch-task-definition.png) |
||||
|
||||
In this view, you can create, query, update, delete task definition by click the related button in `operation` column. The |
||||
most exciting thing is you could query task by task name in the wildcard, and it is useful when you only remember the task |
||||
name but forget which workflow it belongs to. It is also supported query by the task name alone with `Task Type` or |
||||
`Workflow Name` |
||||
|
||||
## Stream Task Definition |
||||
|
||||
Stream task definitions are created in the workflow definition, and can be modified and executed. |
||||
|
||||
![task-definition](../../../../img/new_ui/dev/project/stream-task-definition.png) |
||||
|
||||
Click the execute button, check the execution parameters and click Confirm to submit the stream task. |
||||
|
||||
![task-definition](../../../../img/new_ui/dev/project/stream-task-execute.png) |
@ -1,22 +0,0 @@
|
||||
# 任务定义 |
||||
|
||||
## 批量任务定义 |
||||
|
||||
批量任务定义允许您在基于任务级别而不是在工作流中操作修改任务。再此之前,我们已经有了工作流级别的任务编辑器,你可以在[工作流定义](workflow-definition.md) |
||||
单击特定的工作流,然后编辑任务的定义。当您想编辑特定的任务定义但不记得它属于哪个工作流时,这是令人沮丧的。所以我们决定在 `任务` 菜单下添加 `任务定义` 视图。 |
||||
|
||||
![task-definition](../../../../img/new_ui/dev/project/batch-task-definition.png) |
||||
|
||||
在该视图中,您可以通过单击 `操作` 列中的相关按钮来进行创建、查询、更新、删除任务定义。最令人兴奋的是您可以通过通配符进行全部任务查询,当您只 |
||||
记得任务名称但忘记它属于哪个工作流时是非常有用的。也支持通过任务名称结合使用 `任务类型` 或 `工作流程名称` 进行查询。 |
||||
|
||||
## 实时任务定义 |
||||
|
||||
实时任务定义在工作流定义中创建,在任务定义页面可以进行修改和执行。 |
||||
|
||||
![task-definition](../../../../img/new_ui/dev/project/stream-task-definition.png) |
||||
|
||||
点击实时任务执行,检查执行参数后点击确认,即可提交实时任务。 |
||||
|
||||
![task-definition](../../../../img/new_ui/dev/project/stream-task-execute.png) |
||||
|
Before Width: | Height: | Size: 71 KiB |
Before Width: | Height: | Size: 43 KiB |
Before Width: | Height: | Size: 65 KiB |
@ -1,229 +0,0 @@
|
||||
/* |
||||
* Licensed to the Apache Software Foundation (ASF) under one or more |
||||
* contributor license agreements. See the NOTICE file distributed with |
||||
* this work for additional information regarding copyright ownership. |
||||
* The ASF licenses this file to You under the Apache License, Version 2.0 |
||||
* (the "License"); you may not use this file except in compliance with |
||||
* the License. You may obtain a copy of the License at |
||||
* |
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* |
||||
* Unless required by applicable law or agreed to in writing, software |
||||
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
* See the License for the specific language governing permissions and |
||||
* limitations under the License. |
||||
*/ |
||||
|
||||
import { |
||||
defineComponent, |
||||
getCurrentInstance, |
||||
onMounted, |
||||
toRefs, |
||||
watch |
||||
} from 'vue' |
||||
import { useRoute } from 'vue-router' |
||||
import { |
||||
NButton, |
||||
NDataTable, |
||||
NIcon, |
||||
NInput, |
||||
NPagination, |
||||
NSelect, |
||||
NSpace |
||||
} from 'naive-ui' |
||||
import { SearchOutlined } from '@vicons/antd' |
||||
import { useI18n } from 'vue-i18n' |
||||
import { useTable } from './use-table' |
||||
import { useTask } from './use-task' |
||||
import { TASK_TYPES_MAP } from '@/store/project/task-type' |
||||
import Card from '@/components/card' |
||||
import VersionModal from './components/version-modal' |
||||
import TaskModal from '@/views/projects/task/components/node/detail-modal' |
||||
import type { INodeData } from './types' |
||||
import DependenciesModal from '@/views/projects/components/dependencies/dependencies-modal' |
||||
|
||||
const BatchTaskDefinition = defineComponent({ |
||||
name: 'batch-task-definition', |
||||
setup() { |
||||
const route = useRoute() |
||||
const projectCode = Number(route.params.projectCode) |
||||
const { t } = useI18n() |
||||
|
||||
const { task, onToggleShow, onTaskSave, onEditTask, onInitTask } = |
||||
useTask(projectCode) |
||||
|
||||
const { variables, getTableData, createColumns } = useTable(onEditTask) |
||||
|
||||
const requestData = () => { |
||||
getTableData({ |
||||
pageSize: variables.pageSize, |
||||
pageNo: variables.page, |
||||
searchTaskName: variables.searchTaskName, |
||||
taskType: variables.taskType |
||||
}) |
||||
} |
||||
|
||||
const onUpdatePageSize = () => { |
||||
variables.page = 1 |
||||
requestData() |
||||
} |
||||
|
||||
const onSearch = () => { |
||||
variables.page = 1 |
||||
requestData() |
||||
} |
||||
|
||||
const onClearSearchTaskName = () => { |
||||
variables.searchTaskName = null |
||||
onSearch() |
||||
} |
||||
|
||||
const onClearSearchTaskType = () => { |
||||
variables.taskType = null |
||||
onSearch() |
||||
} |
||||
|
||||
const onRefresh = () => { |
||||
variables.showVersionModalRef = false |
||||
requestData() |
||||
} |
||||
const onCreate = () => { |
||||
onToggleShow(true) |
||||
} |
||||
const onTaskCancel = () => { |
||||
onToggleShow(false) |
||||
onInitTask() |
||||
} |
||||
const onTaskSubmit = async (params: { data: INodeData }) => { |
||||
const result = await onTaskSave(params.data) |
||||
if (result) { |
||||
onTaskCancel() |
||||
onRefresh() |
||||
} |
||||
} |
||||
|
||||
const trim = getCurrentInstance()?.appContext.config.globalProperties.trim |
||||
onMounted(() => { |
||||
createColumns(variables) |
||||
requestData() |
||||
}) |
||||
|
||||
watch(useI18n().locale, () => { |
||||
createColumns(variables) |
||||
}) |
||||
|
||||
return { |
||||
t, |
||||
...toRefs(variables), |
||||
...toRefs(task), |
||||
onSearch, |
||||
onClearSearchTaskName, |
||||
onClearSearchTaskType, |
||||
requestData, |
||||
onUpdatePageSize, |
||||
onRefresh, |
||||
onCreate, |
||||
onTaskSubmit, |
||||
onTaskCancel, |
||||
projectCode, |
||||
trim |
||||
} |
||||
}, |
||||
render() { |
||||
const { |
||||
t, |
||||
onSearch, |
||||
requestData, |
||||
onUpdatePageSize, |
||||
onRefresh, |
||||
onCreate, |
||||
loadingRef |
||||
} = this |
||||
|
||||
return ( |
||||
<NSpace vertical> |
||||
<Card> |
||||
<NSpace justify='space-between'> |
||||
<NButton size='small' type='primary' onClick={onCreate}> |
||||
{t('project.task.create_task')} |
||||
</NButton> |
||||
<NSpace> |
||||
<NInput |
||||
allowInput={this.trim} |
||||
size='small' |
||||
clearable |
||||
v-model={[this.searchTaskName, 'value']} |
||||
placeholder={t('project.task.task_name')} |
||||
onClear={this.onClearSearchTaskName} |
||||
/> |
||||
<NSelect |
||||
v-model={[this.taskType, 'value']} |
||||
size='small' |
||||
options={Object.keys(TASK_TYPES_MAP).map((item) => { |
||||
return { value: item, label: item } |
||||
})} |
||||
placeholder={t('project.task.task_type')} |
||||
style={{ width: '180px' }} |
||||
clearable |
||||
onClear={this.onClearSearchTaskType} |
||||
/> |
||||
<NButton size='small' type='primary' onClick={onSearch}> |
||||
<NIcon> |
||||
<SearchOutlined /> |
||||
</NIcon> |
||||
</NButton> |
||||
</NSpace> |
||||
</NSpace> |
||||
</Card> |
||||
<Card title={t('project.task.batch_task')}> |
||||
<NSpace vertical> |
||||
<NDataTable |
||||
loading={loadingRef} |
||||
columns={this.columns} |
||||
data={this.tableData} |
||||
scrollX={this.tableWidth} |
||||
/> |
||||
<NSpace justify='center'> |
||||
<NPagination |
||||
v-model:page={this.page} |
||||
v-model:page-size={this.pageSize} |
||||
page-count={this.totalPage} |
||||
show-size-picker |
||||
page-sizes={[10, 30, 50]} |
||||
show-quick-jumper |
||||
onUpdatePage={requestData} |
||||
onUpdatePageSize={onUpdatePageSize} |
||||
/> |
||||
</NSpace> |
||||
</NSpace> |
||||
</Card> |
||||
<VersionModal |
||||
show={this.showVersionModalRef} |
||||
row={this.row} |
||||
onConfirm={() => (this.showVersionModalRef = false)} |
||||
onRefresh={onRefresh} |
||||
/> |
||||
<TaskModal |
||||
show={this.taskShow} |
||||
data={this.taskData} |
||||
onSubmit={this.onTaskSubmit} |
||||
onCancel={this.onTaskCancel} |
||||
projectCode={this.projectCode} |
||||
from={1} |
||||
readonly={this.taskReadonly} |
||||
saving={this.taskSaving} |
||||
/> |
||||
<DependenciesModal |
||||
v-model:show={this.dependenciesData.showRef} |
||||
v-model:taskLinks={this.dependenciesData.taskLinks} |
||||
required={this.dependenciesData.required} |
||||
content={this.dependenciesData.tip} |
||||
onConfirm={this.dependenciesData.action} |
||||
/> |
||||
</NSpace> |
||||
) |
||||
} |
||||
}) |
||||
|
||||
export default BatchTaskDefinition |
@ -1,272 +0,0 @@
|
||||
/* |
||||
* Licensed to the Apache Software Foundation (ASF) under one or more |
||||
* contributor license agreements. See the NOTICE file distributed with |
||||
* this work for additional information regarding copyright ownership. |
||||
* The ASF licenses this file to You under the Apache License, Version 2.0 |
||||
* (the "License"); you may not use this file except in compliance with |
||||
* the License. You may obtain a copy of the License at |
||||
* |
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* |
||||
* Unless required by applicable law or agreed to in writing, software |
||||
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
* See the License for the specific language governing permissions and |
||||
* limitations under the License. |
||||
*/ |
||||
|
||||
import { |
||||
defineComponent, |
||||
PropType, |
||||
toRefs, |
||||
onMounted, |
||||
watch, |
||||
getCurrentInstance |
||||
} from 'vue' |
||||
import { useI18n } from 'vue-i18n' |
||||
import Modal from '@/components/modal' |
||||
import { useStart } from './use-start' |
||||
import { |
||||
NForm, |
||||
NFormItem, |
||||
NButton, |
||||
NIcon, |
||||
NInput, |
||||
NSpace, |
||||
NSelect, |
||||
NSwitch |
||||
} from 'naive-ui' |
||||
import { DeleteOutlined, PlusCircleOutlined } from '@vicons/antd' |
||||
|
||||
const props = { |
||||
row: { |
||||
type: Object, |
||||
default: {} |
||||
}, |
||||
show: { |
||||
type: Boolean as PropType<boolean>, |
||||
default: false |
||||
}, |
||||
taskCode: { |
||||
type: String |
||||
} |
||||
} |
||||
|
||||
export default defineComponent({ |
||||
name: 'task-definition-start', |
||||
props, |
||||
emits: ['update:show', 'update:row', 'updateList'], |
||||
setup(props, ctx) { |
||||
const { t } = useI18n() |
||||
const { |
||||
variables, |
||||
handleStartDefinition, |
||||
getWorkerGroups, |
||||
getTenantList, |
||||
getAlertGroups, |
||||
getEnvironmentList, |
||||
getStartParamsList |
||||
} = useStart(ctx) |
||||
|
||||
const generalWarningTypeListOptions = () => [ |
||||
{ |
||||
value: 'NONE', |
||||
label: t('project.task.none_send') |
||||
}, |
||||
{ |
||||
value: 'SUCCESS', |
||||
label: t('project.task.success_send') |
||||
}, |
||||
{ |
||||
value: 'FAILURE', |
||||
label: t('project.task.failure_send') |
||||
}, |
||||
{ |
||||
value: 'ALL', |
||||
label: t('project.task.all_send') |
||||
} |
||||
] |
||||
|
||||
const hideModal = () => { |
||||
ctx.emit('update:show') |
||||
} |
||||
|
||||
const handleStart = () => { |
||||
handleStartDefinition(props.row.taskCode) |
||||
} |
||||
|
||||
const updateWorkerGroup = () => { |
||||
variables.startForm.environmentCode = null |
||||
} |
||||
|
||||
const addStartParams = () => { |
||||
variables.startState.startParamsList.push({ |
||||
prop: '', |
||||
value: '' |
||||
}) |
||||
} |
||||
|
||||
const updateParamsList = (index: number, param: Array<string>) => { |
||||
variables.startState.startParamsList[index].prop = param[0] |
||||
variables.startState.startParamsList[index].value = param[1] |
||||
} |
||||
|
||||
const removeStartParams = (index: number) => { |
||||
variables.startState.startParamsList.splice(index, 1) |
||||
} |
||||
|
||||
const trim = getCurrentInstance()?.appContext.config.globalProperties.trim |
||||
|
||||
onMounted(() => { |
||||
getWorkerGroups() |
||||
getTenantList() |
||||
getAlertGroups() |
||||
getEnvironmentList() |
||||
}) |
||||
|
||||
watch( |
||||
() => props.show, |
||||
() => { |
||||
if (props.show) { |
||||
getStartParamsList(props.row.processDefinitionCode) |
||||
} |
||||
} |
||||
) |
||||
|
||||
return { |
||||
t, |
||||
hideModal, |
||||
handleStart, |
||||
updateWorkerGroup, |
||||
removeStartParams, |
||||
addStartParams, |
||||
updateParamsList, |
||||
generalWarningTypeListOptions, |
||||
...toRefs(variables), |
||||
...toRefs(variables.startState), |
||||
...toRefs(props), |
||||
trim |
||||
} |
||||
}, |
||||
|
||||
render() { |
||||
const { t } = this |
||||
|
||||
return ( |
||||
<Modal |
||||
show={this.show} |
||||
title={t('project.task.set_parameters_before_starting')} |
||||
onCancel={this.hideModal} |
||||
onConfirm={this.handleStart} |
||||
confirmLoading={this.saving} |
||||
> |
||||
<NForm ref='startFormRef' model={this.startForm}> |
||||
<NFormItem label={t('project.task.task_name')} path='task_name'> |
||||
<div title={this.row.taskName}>{this.row.taskName}</div> |
||||
</NFormItem> |
||||
<NFormItem |
||||
label={t('project.task.notification_strategy')} |
||||
path='warningType' |
||||
> |
||||
<NSelect |
||||
options={this.generalWarningTypeListOptions()} |
||||
v-model:value={this.startForm.warningType} |
||||
/> |
||||
</NFormItem> |
||||
<NFormItem label={t('project.task.worker_group')} path='workerGroup'> |
||||
<NSelect |
||||
options={this.workerGroups} |
||||
onUpdateValue={this.updateWorkerGroup} |
||||
v-model:value={this.startForm.workerGroup} |
||||
/> |
||||
</NFormItem> |
||||
<NFormItem label={t('project.task.tenant_code')} path='tenantCode'> |
||||
<NSelect |
||||
options={this.tenantList} |
||||
v-model:value={this.startForm.tenantCode} |
||||
/> |
||||
</NFormItem> |
||||
<NFormItem |
||||
label={t('project.task.environment_name')} |
||||
path='environmentCode' |
||||
> |
||||
<NSelect |
||||
options={this.environmentList.filter((item: any) => |
||||
item.workerGroups?.includes(this.startForm.workerGroup) |
||||
)} |
||||
v-model:value={this.startForm.environmentCode} |
||||
clearable |
||||
/> |
||||
</NFormItem> |
||||
<NFormItem |
||||
label={t('project.task.alarm_group')} |
||||
path='warningGroupId' |
||||
> |
||||
<NSelect |
||||
options={this.alertGroups} |
||||
placeholder={t('project.task.please_choose')} |
||||
v-model:value={this.startForm.warningGroupId} |
||||
clearable |
||||
/> |
||||
</NFormItem> |
||||
<NFormItem |
||||
label={t('project.task.startup_parameter')} |
||||
path='startup_parameter' |
||||
> |
||||
{this.startParamsList.length === 0 ? ( |
||||
<NButton text type='primary' onClick={this.addStartParams}> |
||||
<NIcon> |
||||
<PlusCircleOutlined /> |
||||
</NIcon> |
||||
</NButton> |
||||
) : ( |
||||
<NSpace vertical> |
||||
{this.startParamsList.map((item, index) => ( |
||||
<NSpace key={Date.now() + index}> |
||||
<NInput |
||||
allowInput={this.trim} |
||||
pair |
||||
separator=':' |
||||
placeholder={['prop', 'value']} |
||||
defaultValue={[item.prop, item.value]} |
||||
onUpdateValue={(param) => |
||||
this.updateParamsList(index, param) |
||||
} |
||||
/> |
||||
<NButton |
||||
text |
||||
type='error' |
||||
onClick={() => this.removeStartParams(index)} |
||||
class='btn-delete-custom-parameter' |
||||
> |
||||
<NIcon> |
||||
<DeleteOutlined /> |
||||
</NIcon> |
||||
</NButton> |
||||
<NButton |
||||
text |
||||
type='primary' |
||||
onClick={this.addStartParams} |
||||
class='btn-create-custom-parameter' |
||||
> |
||||
<NIcon> |
||||
<PlusCircleOutlined /> |
||||
</NIcon> |
||||
</NButton> |
||||
</NSpace> |
||||
))} |
||||
</NSpace> |
||||
)} |
||||
</NFormItem> |
||||
<NFormItem label={t('project.task.whether_dry_run')} path='dryRun'> |
||||
<NSwitch |
||||
checkedValue={1} |
||||
uncheckedValue={0} |
||||
v-model:value={this.startForm.dryRun} |
||||
/> |
||||
</NFormItem> |
||||
</NForm> |
||||
</Modal> |
||||
) |
||||
} |
||||
}) |
@ -1,156 +0,0 @@
|
||||
/* |
||||
* Licensed to the Apache Software Foundation (ASF) under one or more |
||||
* contributor license agreements. See the NOTICE file distributed with |
||||
* this work for additional information regarding copyright ownership. |
||||
* The ASF licenses this file to You under the Apache License, Version 2.0 |
||||
* (the "License"); you may not use this file except in compliance with |
||||
* the License. You may obtain a copy of the License at |
||||
* |
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* |
||||
* Unless required by applicable law or agreed to in writing, software |
||||
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
* See the License for the specific language governing permissions and |
||||
* limitations under the License. |
||||
*/ |
||||
|
||||
import { startTaskDefinition } from '@/service/modules/task-definition' |
||||
import _ from 'lodash' |
||||
import { reactive, ref, SetupContext } from 'vue' |
||||
import { useI18n } from 'vue-i18n' |
||||
import { useRoute } from 'vue-router' |
||||
import { queryProcessDefinitionByCode } from '@/service/modules/process-definition' |
||||
import { queryAllWorkerGroups } from '@/service/modules/worker-groups' |
||||
import { queryTenantList } from '@/service/modules/tenants' |
||||
import { queryAllEnvironmentList } from '@/service/modules/environment' |
||||
import { listAlertGroupById } from '@/service/modules/alert-group' |
||||
import type { EnvironmentItem } from '@/service/modules/environment/types' |
||||
import type { IStartState } from '../types' |
||||
|
||||
export const useStart = ( |
||||
ctx: SetupContext<('update:show' | 'update:row' | 'updateList')[]> |
||||
) => { |
||||
const { t } = useI18n() |
||||
const route = useRoute() |
||||
|
||||
const variables = reactive({ |
||||
startFormRef: ref(), |
||||
startForm: { |
||||
version: 1, |
||||
warningType: 'NONE', |
||||
warningGroupId: null, |
||||
workerGroup: 'default', |
||||
tenantCode: 'default', |
||||
environmentCode: null, |
||||
startParams: null as null | string, |
||||
dryRun: 0 |
||||
}, |
||||
startState: { |
||||
projectCode: Number(route.params.projectCode), |
||||
workerGroups: [], |
||||
tenantList: [], |
||||
alertGroups: [], |
||||
environmentList: [], |
||||
startParamsList: [] |
||||
} as IStartState, |
||||
saving: false |
||||
}) |
||||
|
||||
const cachedStartParams = {} as { |
||||
[key: string]: { prop: string; value: string }[] |
||||
} |
||||
|
||||
const getWorkerGroups = () => { |
||||
queryAllWorkerGroups().then((res: any) => { |
||||
variables.startState.workerGroups = res.map((item: string) => ({ |
||||
label: item, |
||||
value: item |
||||
})) |
||||
}) |
||||
} |
||||
|
||||
const getTenantList = () => { |
||||
queryTenantList().then((res: any) => { |
||||
variables.startState.tenantList = res.map((item: any) => ({ |
||||
label: item.tenantCode, |
||||
value: item.tenantCode |
||||
})) |
||||
}) |
||||
} |
||||
|
||||
const getEnvironmentList = () => { |
||||
queryAllEnvironmentList().then((res: Array<EnvironmentItem>) => { |
||||
variables.startState.environmentList = res.map((item) => ({ |
||||
label: item.name, |
||||
value: item.code, |
||||
workerGroups: item.workerGroups |
||||
})) |
||||
}) |
||||
} |
||||
|
||||
const getAlertGroups = () => { |
||||
listAlertGroupById().then((res: any) => { |
||||
variables.startState.alertGroups = res.map((item: any) => ({ |
||||
label: item.groupName, |
||||
value: item.id |
||||
})) |
||||
}) |
||||
} |
||||
|
||||
const getStartParamsList = (code: number) => { |
||||
if (cachedStartParams[code]) { |
||||
variables.startState.startParamsList = _.cloneDeep( |
||||
cachedStartParams[code] |
||||
) |
||||
return |
||||
} |
||||
queryProcessDefinitionByCode(code, variables.startState.projectCode).then( |
||||
(res: any) => { |
||||
variables.startState.startParamsList = |
||||
res.processDefinition.globalParamList |
||||
cachedStartParams[code] = _.cloneDeep( |
||||
variables.startState.startParamsList |
||||
) |
||||
} |
||||
) |
||||
} |
||||
|
||||
const handleStartDefinition = async (code: number) => { |
||||
await variables.startFormRef.validate() |
||||
|
||||
if (variables.saving) return |
||||
variables.saving = true |
||||
try { |
||||
const startParams = {} as any |
||||
for (const item of variables.startState.startParamsList) { |
||||
if (item.value !== '') { |
||||
startParams[item.prop] = item.value |
||||
} |
||||
} |
||||
variables.startForm.startParams = !_.isEmpty(startParams) |
||||
? JSON.stringify(startParams) |
||||
: '' |
||||
|
||||
await startTaskDefinition(variables.startState.projectCode, code, { |
||||
...variables.startForm |
||||
} as any) |
||||
window.$message.success(t('project.task.success')) |
||||
variables.saving = false |
||||
ctx.emit('updateList') |
||||
ctx.emit('update:show') |
||||
} catch (err) { |
||||
variables.saving = false |
||||
} |
||||
} |
||||
|
||||
return { |
||||
variables, |
||||
getWorkerGroups, |
||||
getTenantList, |
||||
getEnvironmentList, |
||||
getAlertGroups, |
||||
getStartParamsList, |
||||
handleStartDefinition |
||||
} |
||||
} |
@ -1,213 +0,0 @@
|
||||
/* |
||||
* Licensed to the Apache Software Foundation (ASF) under one or more |
||||
* contributor license agreements. See the NOTICE file distributed with |
||||
* this work for additional information regarding copyright ownership. |
||||
* The ASF licenses this file to You under the Apache License, Version 2.0 |
||||
* (the "License"); you may not use this file except in compliance with |
||||
* the License. You may obtain a copy of the License at |
||||
* |
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* |
||||
* Unless required by applicable law or agreed to in writing, software |
||||
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
* See the License for the specific language governing permissions and |
||||
* limitations under the License. |
||||
*/ |
||||
|
||||
import { useI18n } from 'vue-i18n' |
||||
import { h, reactive, ref } from 'vue' |
||||
import { NButton, NPopconfirm, NSpace, NTag, NTooltip } from 'naive-ui' |
||||
import { DeleteOutlined, CheckOutlined } from '@vicons/antd' |
||||
import { useAsyncState } from '@vueuse/core' |
||||
import { |
||||
queryTaskVersions, |
||||
switchVersion, |
||||
deleteVersion |
||||
} from '@/service/modules/task-definition' |
||||
import { useRoute } from 'vue-router' |
||||
import type { |
||||
TaskDefinitionVersionRes, |
||||
TaskDefinitionVersionItem |
||||
} from '@/service/modules/task-definition/types' |
||||
|
||||
export function useVersion() { |
||||
const { t } = useI18n() |
||||
const route = useRoute() |
||||
const projectCode = Number(route.params.projectCode) |
||||
|
||||
const createColumns = (variables: any) => { |
||||
variables.columns = [ |
||||
{ |
||||
title: '#', |
||||
key: 'index', |
||||
render: (row: any, index: number) => index + 1 |
||||
}, |
||||
{ |
||||
title: t('project.task.version'), |
||||
key: 'version', |
||||
render: (row: TaskDefinitionVersionItem) => |
||||
h( |
||||
'span', |
||||
null, |
||||
row.version !== variables.taskVersion |
||||
? 'v' + row.version |
||||
: h( |
||||
NTag, |
||||
{ type: 'success', size: 'small' }, |
||||
{ |
||||
default: () => |
||||
`v${row.version} ${t('project.task.current_version')}` |
||||
} |
||||
) |
||||
) |
||||
}, |
||||
{ |
||||
title: t('project.task.description'), |
||||
key: 'description', |
||||
render: (row: TaskDefinitionVersionItem) => |
||||
h('span', null, row.description ? row.description : '-') |
||||
}, |
||||
{ |
||||
title: t('project.task.create_time'), |
||||
key: 'createTime' |
||||
}, |
||||
{ |
||||
title: t('project.task.operation'), |
||||
key: 'operation', |
||||
render(row: TaskDefinitionVersionItem) { |
||||
return h(NSpace, null, { |
||||
default: () => [ |
||||
h( |
||||
NPopconfirm, |
||||
{ |
||||
onPositiveClick: () => { |
||||
handleSwitchVersion(row) |
||||
} |
||||
}, |
||||
{ |
||||
trigger: () => |
||||
h( |
||||
NTooltip, |
||||
{}, |
||||
{ |
||||
trigger: () => |
||||
h( |
||||
NButton, |
||||
{ |
||||
circle: true, |
||||
type: 'info', |
||||
size: 'small', |
||||
disabled: row.version === variables.taskVersion |
||||
}, |
||||
{ |
||||
icon: () => h(CheckOutlined) |
||||
} |
||||
), |
||||
default: () => t('project.task.switch_version') |
||||
} |
||||
), |
||||
default: () => t('project.task.confirm_switch_version') |
||||
} |
||||
), |
||||
h( |
||||
NPopconfirm, |
||||
{ |
||||
onPositiveClick: () => { |
||||
handleDelete(row) |
||||
} |
||||
}, |
||||
{ |
||||
trigger: () => |
||||
h( |
||||
NTooltip, |
||||
{}, |
||||
{ |
||||
trigger: () => |
||||
h( |
||||
NButton, |
||||
{ |
||||
circle: true, |
||||
type: 'error', |
||||
size: 'small', |
||||
disabled: row.version === variables.taskVersion |
||||
}, |
||||
{ |
||||
icon: () => h(DeleteOutlined) |
||||
} |
||||
), |
||||
default: () => t('project.task.delete') |
||||
} |
||||
), |
||||
default: () => t('project.task.delete_confirm') |
||||
} |
||||
) |
||||
] |
||||
}) |
||||
} |
||||
} |
||||
] |
||||
} |
||||
|
||||
const variables = reactive({ |
||||
columns: [], |
||||
tableData: [], |
||||
page: ref(1), |
||||
pageSize: ref(10), |
||||
totalPage: ref(1), |
||||
taskVersion: ref(null), |
||||
taskCode: ref(null), |
||||
refreshTaskDefinition: ref(false), |
||||
row: {}, |
||||
loadingRef: ref(false) |
||||
}) |
||||
|
||||
const handleSwitchVersion = (row: TaskDefinitionVersionItem) => { |
||||
switchVersion( |
||||
{ version: row.version }, |
||||
{ code: variables.taskCode }, |
||||
{ projectCode } |
||||
).then(() => { |
||||
variables.refreshTaskDefinition = true |
||||
}) |
||||
} |
||||
|
||||
const handleDelete = (row: TaskDefinitionVersionItem) => { |
||||
deleteVersion( |
||||
{ version: row.version }, |
||||
{ code: variables.taskCode }, |
||||
{ projectCode } |
||||
).then(() => { |
||||
variables.refreshTaskDefinition = true |
||||
}) |
||||
} |
||||
|
||||
const getTableData = (params: any) => { |
||||
if (variables.loadingRef) return |
||||
variables.loadingRef = true |
||||
const { state } = useAsyncState( |
||||
queryTaskVersions( |
||||
{ ...params }, |
||||
{ code: variables.taskCode }, |
||||
{ projectCode } |
||||
).then((res: TaskDefinitionVersionRes) => { |
||||
variables.tableData = res.totalList.map((item, unused) => { |
||||
return { |
||||
...item |
||||
} |
||||
}) as any |
||||
variables.totalPage = res.totalPage |
||||
variables.loadingRef = false |
||||
}), |
||||
{} |
||||
) |
||||
|
||||
return state |
||||
} |
||||
|
||||
return { |
||||
variables, |
||||
getTableData, |
||||
createColumns |
||||
} |
||||
} |
@ -1,109 +0,0 @@
|
||||
/* |
||||
* Licensed to the Apache Software Foundation (ASF) under one or more |
||||
* contributor license agreements. See the NOTICE file distributed with |
||||
* this work for additional information regarding copyright ownership. |
||||
* The ASF licenses this file to You under the Apache License, Version 2.0 |
||||
* (the "License"); you may not use this file except in compliance with |
||||
* the License. You may obtain a copy of the License at |
||||
* |
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* |
||||
* Unless required by applicable law or agreed to in writing, software |
||||
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
* See the License for the specific language governing permissions and |
||||
* limitations under the License. |
||||
*/ |
||||
|
||||
import { defineComponent, toRefs, watch } from 'vue' |
||||
import { NDataTable, NPagination, NSpace } from 'naive-ui' |
||||
import { useI18n } from 'vue-i18n' |
||||
import { useVersion } from './use-version' |
||||
import Modal from '@/components/modal' |
||||
import type { PropType } from 'vue' |
||||
|
||||
const props = { |
||||
show: { |
||||
type: Boolean as PropType<boolean>, |
||||
default: false |
||||
}, |
||||
row: { |
||||
type: Object as PropType<any>, |
||||
default: {} |
||||
} |
||||
} |
||||
|
||||
const VersionModal = defineComponent({ |
||||
name: 'VersionModal', |
||||
props, |
||||
emits: ['confirm', 'refresh'], |
||||
setup(props, ctx) { |
||||
const { t } = useI18n() |
||||
const { variables, getTableData, createColumns } = useVersion() |
||||
|
||||
const requestData = () => { |
||||
getTableData({ |
||||
pageSize: variables.pageSize, |
||||
pageNo: variables.page |
||||
}) |
||||
} |
||||
|
||||
watch( |
||||
() => props.show, |
||||
() => { |
||||
if (props.show) { |
||||
variables.taskVersion = props.row?.taskVersion |
||||
variables.taskCode = props.row?.taskCode |
||||
createColumns(variables) |
||||
requestData() |
||||
} |
||||
} |
||||
) |
||||
|
||||
watch( |
||||
() => variables.refreshTaskDefinition, |
||||
() => { |
||||
if (variables.refreshTaskDefinition) { |
||||
ctx.emit('refresh') |
||||
variables.refreshTaskDefinition = false |
||||
} |
||||
} |
||||
) |
||||
|
||||
const onConfirm = () => { |
||||
ctx.emit('confirm') |
||||
} |
||||
|
||||
return { t, ...toRefs(variables), requestData, onConfirm } |
||||
}, |
||||
render() { |
||||
const { t, requestData, onConfirm, show, loadingRef } = this |
||||
|
||||
return ( |
||||
<Modal |
||||
show={show} |
||||
title={t('project.task.version')} |
||||
cancelShow={false} |
||||
onConfirm={onConfirm} |
||||
> |
||||
<NSpace vertical> |
||||
<NDataTable |
||||
loading={loadingRef} |
||||
columns={this.columns} |
||||
data={this.tableData} |
||||
/> |
||||
<NSpace justify='center'> |
||||
<NPagination |
||||
v-model:page={this.page} |
||||
v-model:page-size={this.pageSize} |
||||
page-count={this.totalPage} |
||||
onUpdatePage={requestData} |
||||
/> |
||||
</NSpace> |
||||
</NSpace> |
||||
</Modal> |
||||
) |
||||
} |
||||
}) |
||||
|
||||
export default VersionModal |
@ -1,41 +0,0 @@
|
||||
/* |
||||
* Licensed to the Apache Software Foundation (ASF) under one or more |
||||
* contributor license agreements. See the NOTICE file distributed with |
||||
* this work for additional information regarding copyright ownership. |
||||
* The ASF licenses this file to You under the Apache License, Version 2.0 |
||||
* (the "License"); you may not use this file except in compliance with |
||||
* the License. You may obtain a copy of the License at |
||||
* |
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* |
||||
* Unless required by applicable law or agreed to in writing, software |
||||
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
* See the License for the specific language governing permissions and |
||||
* limitations under the License. |
||||
*/ |
||||
|
||||
import { defineComponent } from 'vue' |
||||
import { useI18n } from 'vue-i18n' |
||||
import { NTabPane, NTabs } from 'naive-ui' |
||||
import BatchTaskDefinition from './batch-task' |
||||
import StreamTaskDefinition from './stream-task' |
||||
|
||||
const TaskDefinition = defineComponent({ |
||||
name: 'task-definition', |
||||
setup() { |
||||
const { t } = useI18n() |
||||
return () => ( |
||||
<NTabs type='line' animated> |
||||
<NTabPane name='Batch' tab={t('project.task.batch_task')}> |
||||
<BatchTaskDefinition /> |
||||
</NTabPane> |
||||
<NTabPane name='Stream' tab={t('project.task.stream_task')}> |
||||
<StreamTaskDefinition /> |
||||
</NTabPane> |
||||
</NTabs> |
||||
) |
||||
} |
||||
}) |
||||
|
||||
export default TaskDefinition |
@ -1,152 +0,0 @@
|
||||
/* |
||||
* Licensed to the Apache Software Foundation (ASF) under one or more |
||||
* contributor license agreements. See the NOTICE file distributed with |
||||
* this work for additional information regarding copyright ownership. |
||||
* The ASF licenses this file to You under the Apache License, Version 2.0 |
||||
* (the "License"); you may not use this file except in compliance with |
||||
* the License. You may obtain a copy of the License at |
||||
* |
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* |
||||
* Unless required by applicable law or agreed to in writing, software |
||||
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
* See the License for the specific language governing permissions and |
||||
* limitations under the License. |
||||
*/ |
||||
|
||||
import { useI18n } from 'vue-i18n' |
||||
import { SearchOutlined } from '@vicons/antd' |
||||
import { defineComponent, getCurrentInstance, watch, onMounted } from 'vue' |
||||
import { |
||||
NInput, |
||||
NButton, |
||||
NIcon, |
||||
NSpace, |
||||
NDataTable, |
||||
NPagination |
||||
} from 'naive-ui' |
||||
import { useRoute } from 'vue-router' |
||||
import { useTable } from './use-stream-table' |
||||
import { useTask } from './use-task' |
||||
import StartModal from './components/start-modal' |
||||
import Card from '@/components/card' |
||||
import TaskModal from '@/views/projects/task/components/node/detail-modal' |
||||
import type { INodeData } from './types' |
||||
|
||||
const StreamTaskDefinition = defineComponent({ |
||||
name: 'stream-task-definition', |
||||
setup() { |
||||
const { t } = useI18n() |
||||
const route = useRoute() |
||||
const projectCode = Number(route.params.projectCode) |
||||
|
||||
const trim = getCurrentInstance()?.appContext.config.globalProperties.trim |
||||
const { task, onToggleShow, onEditTask, onInitTask, onUpdateTask } = |
||||
useTask(projectCode) |
||||
const { variables, getTableData, createColumns } = useTable(onEditTask) |
||||
|
||||
const onSearch = () => { |
||||
variables.page = 1 |
||||
getTableData() |
||||
} |
||||
|
||||
const onRefresh = () => { |
||||
getTableData() |
||||
} |
||||
|
||||
const onUpdatePageSize = () => { |
||||
variables.page = 1 |
||||
getTableData() |
||||
} |
||||
|
||||
const onTaskCancel = () => { |
||||
onToggleShow(false) |
||||
onInitTask() |
||||
} |
||||
|
||||
const onTaskSubmit = async (params: { data: INodeData }) => { |
||||
const result = await onUpdateTask(params.data) |
||||
if (result) { |
||||
onTaskCancel() |
||||
onRefresh() |
||||
} |
||||
} |
||||
|
||||
onMounted(() => { |
||||
createColumns(variables) |
||||
getTableData() |
||||
}) |
||||
|
||||
watch(useI18n().locale, () => { |
||||
createColumns(variables) |
||||
}) |
||||
|
||||
return () => ( |
||||
<NSpace vertical> |
||||
<Card> |
||||
<NSpace justify='end'> |
||||
<NInput |
||||
allowInput={trim} |
||||
size='small' |
||||
clearable |
||||
v-model={[variables.searchTaskName, 'value']} |
||||
placeholder={t('project.task.task_name')} |
||||
/> |
||||
<NInput |
||||
allowInput={trim} |
||||
size='small' |
||||
clearable |
||||
v-model={[variables.searchWorkflowName, 'value']} |
||||
placeholder={t('project.task.workflow_name')} |
||||
/> |
||||
<NButton size='small' type='primary' onClick={onSearch}> |
||||
<NIcon> |
||||
<SearchOutlined /> |
||||
</NIcon> |
||||
</NButton> |
||||
</NSpace> |
||||
</Card> |
||||
<Card> |
||||
<NSpace vertical> |
||||
<NDataTable |
||||
loading={variables.loading} |
||||
columns={variables.columns} |
||||
data={variables.tableData} |
||||
scrollX={variables.tableWidth} |
||||
/> |
||||
<NSpace justify='center'> |
||||
<NPagination |
||||
v-model:page={variables.page} |
||||
v-model:page-size={variables.pageSize} |
||||
page-count={variables.totalPage} |
||||
show-size-picker |
||||
page-sizes={[10, 30, 50]} |
||||
show-quick-jumper |
||||
onUpdatePage={getTableData} |
||||
onUpdatePageSize={onUpdatePageSize} |
||||
/> |
||||
</NSpace> |
||||
</NSpace> |
||||
</Card> |
||||
<TaskModal |
||||
show={task.taskShow} |
||||
data={task.taskData} |
||||
onSubmit={onTaskSubmit} |
||||
onCancel={onTaskCancel} |
||||
projectCode={projectCode} |
||||
from={1} |
||||
readonly={task.taskReadonly} |
||||
saving={task.taskSaving} |
||||
/> |
||||
<StartModal |
||||
v-model:row={variables.row} |
||||
v-model:show={variables.startShow} |
||||
onUpdateList={getTableData} |
||||
/> |
||||
</NSpace> |
||||
) |
||||
} |
||||
}) |
||||
|
||||
export default StreamTaskDefinition |
@ -1,40 +0,0 @@
|
||||
/* |
||||
* Licensed to the Apache Software Foundation (ASF) under one or more |
||||
* contributor license agreements. See the NOTICE file distributed with |
||||
* this work for additional information regarding copyright ownership. |
||||
* The ASF licenses this file to You under the Apache License, Version 2.0 |
||||
* (the "License"); you may not use this file except in compliance with |
||||
* the License. You may obtain a copy of the License at |
||||
* |
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* |
||||
* Unless required by applicable law or agreed to in writing, software |
||||
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
* See the License for the specific language governing permissions and |
||||
* limitations under the License. |
||||
*/ |
||||
|
||||
import { IOption } from '@/components/form/types' |
||||
import { IParam } from '../../workflow/definition/components/types' |
||||
import { IEnvironmentNameOption } from '../components/node/types' |
||||
|
||||
export type { ITaskData, INodeData } from '../components/node/types' |
||||
export type { ISingleSaveReq } from '@/service/modules/task-definition/types' |
||||
|
||||
interface IRecord { |
||||
processDefinitionCode: number |
||||
taskCode: number |
||||
taskName: string |
||||
} |
||||
|
||||
interface IStartState { |
||||
projectCode: number |
||||
workerGroups: Array<IOption> |
||||
tenantList: Array<IOption> |
||||
alertGroups: Array<IOption> |
||||
environmentList: Array<IEnvironmentNameOption> |
||||
startParamsList: Array<IParam> |
||||
} |
||||
|
||||
export { IRecord, IStartState } |
@ -1,202 +0,0 @@
|
||||
/* |
||||
* Licensed to the Apache Software Foundation (ASF) under one or more |
||||
* contributor license agreements. See the NOTICE file distributed with |
||||
* this work for additional information regarding copyright ownership. |
||||
* The ASF licenses this file to You under the Apache License, Version 2.0 |
||||
* (the "License"); you may not use this file except in compliance with |
||||
* the License. You may obtain a copy of the License at |
||||
* |
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* |
||||
* Unless required by applicable law or agreed to in writing, software |
||||
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
* See the License for the specific language governing permissions and |
||||
* limitations under the License. |
||||
*/ |
||||
|
||||
import { reactive, h } from 'vue' |
||||
import { NButton, NIcon, NSpace, NTooltip, NEllipsis } from 'naive-ui' |
||||
import ButtonLink from '@/components/button-link' |
||||
import { useI18n } from 'vue-i18n' |
||||
import { EditOutlined, PlayCircleOutlined } from '@vicons/antd' |
||||
import { queryTaskDefinitionListPaging } from '@/service/modules/task-definition' |
||||
import { useRoute } from 'vue-router' |
||||
import { |
||||
COLUMN_WIDTH_CONFIG, |
||||
calculateTableWidth, |
||||
DefaultTableWidth |
||||
} from '@/common/column-width-config' |
||||
import type { |
||||
TaskDefinitionItem, |
||||
TaskDefinitionRes |
||||
} from '@/service/modules/task-definition/types' |
||||
import type { IRecord } from './types' |
||||
|
||||
export function useTable(onEdit: Function) { |
||||
const { t } = useI18n() |
||||
const route = useRoute() |
||||
const projectCode = Number(route.params.projectCode) |
||||
|
||||
const createColumns = (variables: any) => { |
||||
variables.columns = [ |
||||
{ |
||||
title: '#', |
||||
key: 'index', |
||||
render: (row: any, index: number) => index + 1, |
||||
...COLUMN_WIDTH_CONFIG['index'] |
||||
}, |
||||
{ |
||||
title: t('project.task.task_name'), |
||||
key: 'taskName', |
||||
...COLUMN_WIDTH_CONFIG['linkName'], |
||||
render: (row: IRecord) => |
||||
h( |
||||
ButtonLink, |
||||
{ |
||||
onClick: () => void onEdit(row, true) |
||||
}, |
||||
{ |
||||
default: () => |
||||
h( |
||||
NEllipsis, |
||||
COLUMN_WIDTH_CONFIG['linkEllipsis'], |
||||
() => row.taskName |
||||
) |
||||
} |
||||
) |
||||
}, |
||||
{ |
||||
title: t('project.task.version'), |
||||
key: 'taskVersion', |
||||
render: (row: TaskDefinitionItem) => |
||||
h('span', null, 'v' + row.taskVersion), |
||||
...COLUMN_WIDTH_CONFIG['version'] |
||||
}, |
||||
{ |
||||
title: t('project.task.workflow_name'), |
||||
key: 'processDefinitionName', |
||||
...COLUMN_WIDTH_CONFIG['name'] |
||||
}, |
||||
{ |
||||
title: t('project.task.task_type'), |
||||
key: 'taskType', |
||||
...COLUMN_WIDTH_CONFIG['type'] |
||||
}, |
||||
{ |
||||
title: t('project.task.create_time'), |
||||
key: 'taskCreateTime', |
||||
...COLUMN_WIDTH_CONFIG['time'] |
||||
}, |
||||
{ |
||||
title: t('project.task.update_time'), |
||||
key: 'taskUpdateTime', |
||||
...COLUMN_WIDTH_CONFIG['time'] |
||||
}, |
||||
{ |
||||
title: t('project.task.operation'), |
||||
key: 'operation', |
||||
...COLUMN_WIDTH_CONFIG['operation'](2), |
||||
render(row: any) { |
||||
return h(NSpace, null, { |
||||
default: () => [ |
||||
h( |
||||
NTooltip, |
||||
{}, |
||||
{ |
||||
trigger: () => |
||||
h( |
||||
NButton, |
||||
{ |
||||
circle: true, |
||||
type: 'info', |
||||
size: 'small', |
||||
onClick: () => onStart(row) |
||||
}, |
||||
{ |
||||
icon: () => |
||||
h(NIcon, null, { |
||||
default: () => h(PlayCircleOutlined) |
||||
}) |
||||
} |
||||
), |
||||
default: () => t('project.task.execute') |
||||
} |
||||
), |
||||
h( |
||||
NTooltip, |
||||
{}, |
||||
{ |
||||
trigger: () => |
||||
h( |
||||
NButton, |
||||
{ |
||||
circle: true, |
||||
type: 'info', |
||||
size: 'small', |
||||
onClick: () => onEdit(row, false) |
||||
}, |
||||
{ |
||||
icon: () => |
||||
h(NIcon, null, { default: () => h(EditOutlined) }) |
||||
} |
||||
), |
||||
default: () => t('project.task.edit') |
||||
} |
||||
) |
||||
] |
||||
}) |
||||
} |
||||
} |
||||
] |
||||
if (variables.tableWidth) { |
||||
variables.tableWidth = calculateTableWidth(variables.columns) |
||||
} |
||||
} |
||||
|
||||
const variables = reactive({ |
||||
columns: [], |
||||
tableWidth: DefaultTableWidth, |
||||
tableData: [], |
||||
page: 1, |
||||
pageSize: 10, |
||||
searchTaskName: null, |
||||
searchWorkflowName: null, |
||||
totalPage: 1, |
||||
row: {}, |
||||
loading: false, |
||||
startShow: false |
||||
}) |
||||
|
||||
const getTableData = () => { |
||||
if (variables.loading) return |
||||
variables.loading = true |
||||
const params = { |
||||
pageSize: variables.pageSize, |
||||
pageNo: variables.page, |
||||
searchTaskName: variables.searchTaskName, |
||||
searchWorkflowName: variables.searchWorkflowName, |
||||
taskExecuteType: 'STREAM' as 'BATCH' | 'STREAM' |
||||
} as any |
||||
|
||||
queryTaskDefinitionListPaging(params, { projectCode }) |
||||
.then((res: TaskDefinitionRes) => { |
||||
variables.tableData = [...res.totalList] as any |
||||
variables.totalPage = res.totalPage |
||||
}) |
||||
.finally(() => { |
||||
variables.loading = false |
||||
}) |
||||
} |
||||
|
||||
const onStart = (row: any) => { |
||||
variables.row = row |
||||
variables.startShow = true |
||||
} |
||||
|
||||
return { |
||||
variables, |
||||
getTableData, |
||||
createColumns |
||||
} |
||||
} |
@ -1,348 +0,0 @@
|
||||
/* |
||||
* Licensed to the Apache Software Foundation (ASF) under one or more |
||||
* contributor license agreements. See the NOTICE file distributed with |
||||
* this work for additional information regarding copyright ownership. |
||||
* The ASF licenses this file to You under the Apache License, Version 2.0 |
||||
* (the "License"); you may not use this file except in compliance with |
||||
* the License. You may obtain a copy of the License at |
||||
* |
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* |
||||
* Unless required by applicable law or agreed to in writing, software |
||||
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
* See the License for the specific language governing permissions and |
||||
* limitations under the License. |
||||
*/ |
||||
|
||||
import { useAsyncState } from '@vueuse/core' |
||||
import { reactive, h, ref } from 'vue' |
||||
import { |
||||
NButton, |
||||
NIcon, |
||||
NPopconfirm, |
||||
NSpace, |
||||
NTag, |
||||
NTooltip, |
||||
NEllipsis |
||||
} from 'naive-ui' |
||||
import ButtonLink from '@/components/button-link' |
||||
import { useI18n } from 'vue-i18n' |
||||
import { |
||||
DeleteOutlined, |
||||
EditOutlined, |
||||
ExclamationCircleOutlined |
||||
} from '@vicons/antd' |
||||
import { |
||||
queryTaskDefinitionListPaging, |
||||
deleteTaskDefinition |
||||
} from '@/service/modules/task-definition' |
||||
import { useRoute } from 'vue-router' |
||||
import { |
||||
COLUMN_WIDTH_CONFIG, |
||||
calculateTableWidth, |
||||
DefaultTableWidth |
||||
} from '@/common/column-width-config' |
||||
import type { |
||||
TaskDefinitionItem, |
||||
TaskDefinitionRes |
||||
} from '@/service/modules/task-definition/types' |
||||
import type { IRecord } from './types' |
||||
|
||||
import { useDependencies } from '../../components/dependencies/use-dependencies' |
||||
|
||||
export function useTable(onEdit: Function) { |
||||
const { t } = useI18n() |
||||
const route = useRoute() |
||||
const projectCode = Number(route.params.projectCode) |
||||
|
||||
const { getDependentTaskLinksByTask } = useDependencies() |
||||
|
||||
const createColumns = (variables: any) => { |
||||
variables.columns = [ |
||||
{ |
||||
title: '#', |
||||
key: 'index', |
||||
render: (row: any, index: number) => index + 1, |
||||
...COLUMN_WIDTH_CONFIG['index'] |
||||
}, |
||||
{ |
||||
title: t('project.task.task_name'), |
||||
key: 'taskName', |
||||
...COLUMN_WIDTH_CONFIG['linkName'], |
||||
resizable: true, |
||||
minWidth: 200, |
||||
maxWidth: 600, |
||||
render: (row: IRecord) => |
||||
h( |
||||
ButtonLink, |
||||
{ |
||||
onClick: () => void onEdit(row, true) |
||||
}, |
||||
{ |
||||
default: () => |
||||
h( |
||||
NEllipsis, |
||||
{ |
||||
style: 'max-width: 580px;line-height: 1.5' |
||||
}, |
||||
() => row.taskName |
||||
) |
||||
} |
||||
) |
||||
}, |
||||
{ |
||||
title: t('project.task.workflow_name'), |
||||
key: 'processDefinitionName', |
||||
...COLUMN_WIDTH_CONFIG['name'], |
||||
resizable: true, |
||||
minWidth: 200, |
||||
maxWidth: 600 |
||||
}, |
||||
{ |
||||
title: t('project.task.workflow_state'), |
||||
key: 'processReleaseState', |
||||
render: (row: any) => { |
||||
if (row.processReleaseState === 'OFFLINE') { |
||||
return h(NTag, { type: 'error', size: 'small' }, () => |
||||
t('project.task.offline') |
||||
) |
||||
} else if (row.processReleaseState === 'ONLINE') { |
||||
return h(NTag, { type: 'info', size: 'small' }, () => |
||||
t('project.task.online') |
||||
) |
||||
} |
||||
}, |
||||
width: 130 |
||||
}, |
||||
{ |
||||
title: t('project.task.task_type'), |
||||
key: 'taskType', |
||||
...COLUMN_WIDTH_CONFIG['type'] |
||||
}, |
||||
{ |
||||
title: t('project.task.version'), |
||||
key: 'taskVersion', |
||||
render: (row: TaskDefinitionItem) => |
||||
h('span', null, 'v' + row.taskVersion), |
||||
...COLUMN_WIDTH_CONFIG['version'] |
||||
}, |
||||
{ |
||||
title: t('project.task.upstream_tasks'), |
||||
key: 'upstreamTaskMap', |
||||
render: (row: TaskDefinitionItem) => |
||||
row.upstreamTaskMap.map((item: string, index: number) => { |
||||
return h('p', null, { default: () => `[${index + 1}] ${item}` }) |
||||
}), |
||||
...COLUMN_WIDTH_CONFIG['name'] |
||||
}, |
||||
{ |
||||
title: t('project.task.create_time'), |
||||
key: 'taskCreateTime', |
||||
...COLUMN_WIDTH_CONFIG['time'] |
||||
}, |
||||
{ |
||||
title: t('project.task.update_time'), |
||||
key: 'taskUpdateTime', |
||||
...COLUMN_WIDTH_CONFIG['time'] |
||||
}, |
||||
{ |
||||
title: t('project.task.operation'), |
||||
key: 'operation', |
||||
...COLUMN_WIDTH_CONFIG['operation'](3), |
||||
render(row: any) { |
||||
return h(NSpace, null, { |
||||
default: () => [ |
||||
h( |
||||
NTooltip, |
||||
{}, |
||||
{ |
||||
trigger: () => |
||||
h( |
||||
NButton, |
||||
{ |
||||
circle: true, |
||||
type: 'info', |
||||
size: 'small', |
||||
disabled: |
||||
['CONDITIONS', 'SWITCH'].includes(row.taskType) || |
||||
(!!row.processDefinitionCode && |
||||
row.processReleaseState === 'ONLINE'), |
||||
onClick: () => { |
||||
onEdit(row, false) |
||||
} |
||||
}, |
||||
{ |
||||
icon: () => |
||||
h(NIcon, null, { default: () => h(EditOutlined) }) |
||||
} |
||||
), |
||||
default: () => t('project.task.edit') |
||||
} |
||||
), |
||||
h( |
||||
NTooltip, |
||||
{}, |
||||
{ |
||||
trigger: () => |
||||
h( |
||||
NButton, |
||||
{ |
||||
circle: true, |
||||
type: 'info', |
||||
size: 'small', |
||||
onClick: () => { |
||||
variables.showVersionModalRef = true |
||||
variables.row = row |
||||
} |
||||
}, |
||||
{ |
||||
icon: () => |
||||
h(NIcon, null, { |
||||
default: () => h(ExclamationCircleOutlined) |
||||
}) |
||||
} |
||||
), |
||||
default: () => t('project.task.version') |
||||
} |
||||
), |
||||
h( |
||||
NPopconfirm, |
||||
{ |
||||
onPositiveClick: () => { |
||||
handleDelete(row) |
||||
} |
||||
}, |
||||
{ |
||||
trigger: () => |
||||
h( |
||||
NTooltip, |
||||
{}, |
||||
{ |
||||
trigger: () => |
||||
h( |
||||
NButton, |
||||
{ |
||||
circle: true, |
||||
type: 'error', |
||||
size: 'small', |
||||
disabled: |
||||
!!row.processDefinitionCode && |
||||
row.processReleaseState === 'ONLINE' |
||||
}, |
||||
{ |
||||
icon: () => |
||||
h(NIcon, null, { |
||||
default: () => h(DeleteOutlined) |
||||
}) |
||||
} |
||||
), |
||||
default: () => t('project.task.delete') |
||||
} |
||||
), |
||||
default: () => t('project.task.delete_confirm') |
||||
} |
||||
) |
||||
] |
||||
}) |
||||
} |
||||
} |
||||
] |
||||
if (variables.tableWidth) { |
||||
variables.tableWidth = calculateTableWidth(variables.columns) |
||||
} |
||||
} |
||||
|
||||
const variables = reactive({ |
||||
columns: [], |
||||
tableWidth: DefaultTableWidth, |
||||
tableData: [], |
||||
page: ref(1), |
||||
pageSize: ref(10), |
||||
searchTaskName: ref(null), |
||||
searchWorkflowName: ref(null), |
||||
totalPage: ref(1), |
||||
taskType: ref(null), |
||||
showVersionModalRef: ref(false), |
||||
dependentTasksShowRef: ref(false), |
||||
dependentTaskLinksRef: ref([]), |
||||
row: {}, |
||||
loadingRef: ref(false), |
||||
dependenciesData: ref({ |
||||
showRef: ref(false), |
||||
taskLinks: ref([]), |
||||
required: ref(false), |
||||
tip: ref(''), |
||||
action: () => {} |
||||
}) |
||||
}) |
||||
|
||||
const handleDelete = (row: any) => { |
||||
variables.row = row |
||||
getDependentTaskLinksByTask( |
||||
projectCode, |
||||
row.processDefinitionCode, |
||||
row.taskCode |
||||
).then((res: any) => { |
||||
if (res && res.length > 0) { |
||||
variables.dependenciesData = { |
||||
showRef: true, |
||||
taskLinks: res, |
||||
tip: t('project.workflow.delete_validate_dependent_tasks_desc'), |
||||
required: true, |
||||
action: () => {} |
||||
} |
||||
} else { |
||||
deleteTaskDefinition({ code: row.taskCode }, { projectCode }).then( |
||||
() => { |
||||
getTableData({ |
||||
pageSize: variables.pageSize, |
||||
pageNo: |
||||
variables.tableData.length === 1 && variables.page > 1 |
||||
? variables.page - 1 |
||||
: variables.page, |
||||
searchTaskName: variables.searchTaskName, |
||||
searchWorkflowName: variables.searchWorkflowName, |
||||
taskType: variables.taskType |
||||
}) |
||||
} |
||||
) |
||||
} |
||||
}) |
||||
} |
||||
|
||||
const getTableData = (params: any) => { |
||||
if (variables.loadingRef) return |
||||
variables.loadingRef = true |
||||
const { state } = useAsyncState( |
||||
queryTaskDefinitionListPaging({ ...params }, { projectCode }).then( |
||||
(res: TaskDefinitionRes) => { |
||||
variables.tableData = res.totalList.map((item, unused) => { |
||||
if (Object.keys(item.upstreamTaskMap).length > 0) { |
||||
item.upstreamTaskMap = Object.keys(item.upstreamTaskMap).map( |
||||
(code) => item.upstreamTaskMap[code] |
||||
) |
||||
} else { |
||||
item.upstreamTaskMap = [] |
||||
} |
||||
|
||||
return { |
||||
...item |
||||
} |
||||
}) as any |
||||
variables.totalPage = res.totalPage |
||||
variables.loadingRef = false |
||||
} |
||||
), |
||||
{} |
||||
) |
||||
|
||||
return state |
||||
} |
||||
|
||||
return { |
||||
variables, |
||||
getTableData, |
||||
createColumns |
||||
} |
||||
} |
@ -1,140 +0,0 @@
|
||||
/* |
||||
* Licensed to the Apache Software Foundation (ASF) under one or more |
||||
* contributor license agreements. See the NOTICE file distributed with |
||||
* this work for additional information regarding copyright ownership. |
||||
* The ASF licenses this file to You under the Apache License, Version 2.0 |
||||
* (the "License"); you may not use this file except in compliance with |
||||
* the License. You may obtain a copy of the License at |
||||
* |
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* |
||||
* Unless required by applicable law or agreed to in writing, software |
||||
* distributed under the License is distributed on an "AS IS" BASIS, |
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
||||
* See the License for the specific language governing permissions and |
||||
* limitations under the License. |
||||
*/ |
||||
|
||||
import { reactive } from 'vue' |
||||
import { |
||||
updateTask, |
||||
genTaskCodeList, |
||||
saveSingle, |
||||
queryTaskDefinitionByCode, |
||||
updateWithUpstream |
||||
} from '@/service/modules/task-definition' |
||||
import { formatParams as formatData } from '../components/node/format-data' |
||||
import type { ITaskData, INodeData, ISingleSaveReq, IRecord } from './types' |
||||
import { Connect } from '../../workflow/components/dag/types' |
||||
|
||||
export function useTask(projectCode: number) { |
||||
const initalTask = { |
||||
taskType: 'SHELL' |
||||
} as ITaskData |
||||
const task = reactive({ |
||||
taskShow: false, |
||||
taskData: { ...initalTask }, |
||||
taskSaving: false, |
||||
taskReadonly: false |
||||
} as { taskShow: boolean; taskData: ITaskData; taskSaving: boolean; taskReadonly: boolean }) |
||||
|
||||
const formatParams = (data: INodeData, isCreate: boolean): ISingleSaveReq => { |
||||
const params = formatData(data) |
||||
if (isCreate) { |
||||
return { |
||||
processDefinitionCode: params.processDefinitionCode, |
||||
upstreamCodes: params.upstreamCodes, |
||||
taskDefinitionJsonObj: JSON.stringify(params.taskDefinitionJsonObj) |
||||
} |
||||
} |
||||
return { |
||||
upstreamCodes: params.upstreamCodes, |
||||
taskDefinitionJsonObj: JSON.stringify(params.taskDefinitionJsonObj) |
||||
} |
||||
} |
||||
|
||||
const getTaskCode = async () => { |
||||
const result = await genTaskCodeList(1, projectCode) |
||||
return result[0] |
||||
} |
||||
|
||||
const onToggleShow = (show: boolean) => { |
||||
task.taskShow = show |
||||
} |
||||
const onTaskSave = async (data: INodeData) => { |
||||
if (task.taskSaving) return |
||||
task.taskSaving = true |
||||
try { |
||||
if (data.id) { |
||||
data.code && |
||||
(await updateWithUpstream( |
||||
projectCode, |
||||
data.code, |
||||
formatParams({ ...data, code: data.code }, false) |
||||
)) |
||||
} else { |
||||
const taskCode = await getTaskCode() |
||||
await saveSingle( |
||||
projectCode, |
||||
formatParams({ ...data, code: taskCode }, true) |
||||
) |
||||
} |
||||
|
||||
task.taskSaving = false |
||||
return true |
||||
} catch (err) { |
||||
task.taskSaving = false |
||||
return false |
||||
} |
||||
} |
||||
|
||||
const onEditTask = async (row: IRecord, readonly: boolean) => { |
||||
const result = await queryTaskDefinitionByCode(row.taskCode, projectCode) |
||||
task.taskData = { |
||||
...result, |
||||
processName: row.processDefinitionCode, |
||||
preTasks: |
||||
result?.processTaskRelationList?.map( |
||||
(item: Connect) => item.preTaskCode |
||||
) || [] |
||||
} |
||||
task.taskShow = true |
||||
task.taskReadonly = readonly |
||||
} |
||||
|
||||
const onInitTask = () => { |
||||
task.taskData = { ...initalTask } |
||||
task.taskReadonly = false |
||||
} |
||||
|
||||
const onUpdateTask = async (data: INodeData) => { |
||||
if (task.taskSaving || !data.code) return |
||||
task.taskSaving = true |
||||
|
||||
const params = { |
||||
taskExecuteType: 'STREAM', |
||||
taskDefinitionJsonObj: JSON.stringify( |
||||
formatData(data).taskDefinitionJsonObj |
||||
) |
||||
} |
||||
|
||||
try { |
||||
await updateTask(projectCode, data.code, params) |
||||
|
||||
task.taskSaving = false |
||||
return true |
||||
} catch (err) { |
||||
task.taskSaving = false |
||||
return false |
||||
} |
||||
} |
||||
|
||||
return { |
||||
task, |
||||
onToggleShow, |
||||
onTaskSave, |
||||
onEditTask, |
||||
onInitTask, |
||||
onUpdateTask |
||||
} |
||||
} |
Loading…
Reference in new issue