Browse Source
* [Feature][UI Next] Add task definition. * [Feature][UI Next] Add task definition.3.0.0/version-upgrade
songjianet
3 years ago
committed by
GitHub
17 changed files with 1132 additions and 31 deletions
@ -0,0 +1,108 @@ |
|||||||
|
/* |
||||||
|
* 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, watch } from 'vue' |
||||||
|
import Modal from '@/components/modal' |
||||||
|
import { NForm, NFormItem, NSelect } from 'naive-ui' |
||||||
|
import { useI18n } from 'vue-i18n' |
||||||
|
import { useMove } from './use-move' |
||||||
|
|
||||||
|
const props = { |
||||||
|
show: { |
||||||
|
type: Boolean as PropType<boolean>, |
||||||
|
default: false |
||||||
|
}, |
||||||
|
row: { |
||||||
|
type: Object as PropType<any>, |
||||||
|
default: {} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
const MoveModal = defineComponent({ |
||||||
|
name: 'MoveModal', |
||||||
|
props, |
||||||
|
emits: ['refresh', 'cancel'], |
||||||
|
setup(props, ctx) { |
||||||
|
const { t } = useI18n() |
||||||
|
const { variables, handleValidate, getListData } = useMove() |
||||||
|
|
||||||
|
const cancelModal = () => { |
||||||
|
variables.model.targetProcessDefinitionCode = '' |
||||||
|
ctx.emit('cancel') |
||||||
|
} |
||||||
|
|
||||||
|
const confirmModal = () => { |
||||||
|
handleValidate() |
||||||
|
} |
||||||
|
|
||||||
|
watch( |
||||||
|
() => props.show, |
||||||
|
() => { |
||||||
|
variables.taskCode = props.row.taskCode |
||||||
|
variables.processDefinitionCode = props.row.processDefinitionCode |
||||||
|
variables.model.targetProcessDefinitionCode = |
||||||
|
props.row.processDefinitionCode |
||||||
|
|
||||||
|
props.show && getListData() |
||||||
|
} |
||||||
|
) |
||||||
|
|
||||||
|
watch( |
||||||
|
() => variables.refreshTaskDefinition, |
||||||
|
() => { |
||||||
|
if (variables.refreshTaskDefinition) { |
||||||
|
ctx.emit('refresh') |
||||||
|
variables.refreshTaskDefinition = false |
||||||
|
} |
||||||
|
} |
||||||
|
) |
||||||
|
|
||||||
|
return { t, ...toRefs(variables), cancelModal, confirmModal } |
||||||
|
}, |
||||||
|
render() { |
||||||
|
const { t, show, cancelModal, confirmModal } = this |
||||||
|
|
||||||
|
return ( |
||||||
|
<Modal |
||||||
|
title={t('project.task.move')} |
||||||
|
show={show} |
||||||
|
onCancel={cancelModal} |
||||||
|
onConfirm={confirmModal} |
||||||
|
confirmDisabled={!this.model.targetProcessDefinitionCode} |
||||||
|
> |
||||||
|
<NForm |
||||||
|
model={this.model} |
||||||
|
rules={this.rules} |
||||||
|
ref='taskDefinitionFormRef' |
||||||
|
> |
||||||
|
<NFormItem |
||||||
|
label={t('project.task.workflow_name')} |
||||||
|
path='alertInstanceIds' |
||||||
|
> |
||||||
|
<NSelect |
||||||
|
placeholder={t('project.task.workflow_name_tips')} |
||||||
|
options={this.model.generalOptions} |
||||||
|
v-model={[this.model.targetProcessDefinitionCode, 'value']} |
||||||
|
/> |
||||||
|
</NFormItem> |
||||||
|
</NForm> |
||||||
|
</Modal> |
||||||
|
) |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
export default MoveModal |
||||||
@ -0,0 +1,98 @@ |
|||||||
|
/* |
||||||
|
* 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, ref, SetupContext } from 'vue' |
||||||
|
import { useI18n } from 'vue-i18n' |
||||||
|
import { useAsyncState } from '@vueuse/core' |
||||||
|
import { querySimpleList } from '@/service/modules/process-definition' |
||||||
|
import { useRoute } from 'vue-router' |
||||||
|
import { moveRelation } from '@/service/modules/process-task-relation' |
||||||
|
import type { SimpleListRes } from '@/service/modules/process-definition/types' |
||||||
|
|
||||||
|
export function useMove() { |
||||||
|
const { t } = useI18n() |
||||||
|
const route = useRoute() |
||||||
|
const projectCode = Number(route.params.projectCode) |
||||||
|
|
||||||
|
const variables = reactive({ |
||||||
|
taskCode: ref(''), |
||||||
|
processDefinitionCode: ref(''), |
||||||
|
refreshTaskDefinition: ref(false), |
||||||
|
taskDefinitionFormRef: ref(), |
||||||
|
model: { |
||||||
|
targetProcessDefinitionCode: ref(''), |
||||||
|
generalOptions: [] |
||||||
|
}, |
||||||
|
rules: { |
||||||
|
targetProcessDefinitionCode: { |
||||||
|
required: true, |
||||||
|
trigger: ['change', 'blur'], |
||||||
|
validator() { |
||||||
|
if (!variables.model.targetProcessDefinitionCode) { |
||||||
|
return new Error(t('project.task.workflow_name_tips')) |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
const getListData = () => { |
||||||
|
const { state } = useAsyncState( |
||||||
|
querySimpleList(projectCode).then((res: Array<SimpleListRes>) => { |
||||||
|
variables.model.generalOptions = res.map( |
||||||
|
(item): { label: string; value: number } => { |
||||||
|
return { |
||||||
|
label: item.name, |
||||||
|
value: item.code |
||||||
|
} |
||||||
|
} |
||||||
|
) as any |
||||||
|
}), |
||||||
|
{} |
||||||
|
) |
||||||
|
|
||||||
|
return state |
||||||
|
} |
||||||
|
|
||||||
|
const handleValidate = () => { |
||||||
|
variables.taskDefinitionFormRef.validate((errors: any) => { |
||||||
|
if (errors) { |
||||||
|
return |
||||||
|
} |
||||||
|
moveTask() |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
const moveTask = () => { |
||||||
|
const data = { |
||||||
|
targetProcessDefinitionCode: variables.model.targetProcessDefinitionCode, |
||||||
|
taskCode: variables.taskCode, |
||||||
|
processDefinitionCode: variables.processDefinitionCode |
||||||
|
} |
||||||
|
|
||||||
|
moveRelation(data, projectCode).then(() => { |
||||||
|
variables.model.targetProcessDefinitionCode = '' |
||||||
|
variables.refreshTaskDefinition = true |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
return { |
||||||
|
variables, |
||||||
|
handleValidate, |
||||||
|
getListData |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,209 @@ |
|||||||
|
/* |
||||||
|
* 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' |
||||||
|
}, |
||||||
|
{ |
||||||
|
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: {} |
||||||
|
}) |
||||||
|
|
||||||
|
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) => { |
||||||
|
const { state } = useAsyncState( |
||||||
|
queryTaskVersions( |
||||||
|
{ ...params }, |
||||||
|
{ code: variables.taskCode }, |
||||||
|
{ projectCode } |
||||||
|
).then((res: TaskDefinitionVersionRes) => { |
||||||
|
variables.tableData = res.totalList.map((item, index) => { |
||||||
|
return { |
||||||
|
index: index + 1, |
||||||
|
...item |
||||||
|
} |
||||||
|
}) as any |
||||||
|
variables.totalPage = res.totalPage |
||||||
|
}), |
||||||
|
{} |
||||||
|
) |
||||||
|
|
||||||
|
return state |
||||||
|
} |
||||||
|
|
||||||
|
return { |
||||||
|
variables, |
||||||
|
getTableData, |
||||||
|
createColumns |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,112 @@ |
|||||||
|
/* |
||||||
|
* 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, onMounted, PropType, toRefs, watch } from 'vue' |
||||||
|
import Modal from '@/components/modal' |
||||||
|
import { NDataTable, NPagination, useThemeVars } from 'naive-ui' |
||||||
|
import { useI18n } from 'vue-i18n' |
||||||
|
import { useVersion } from './use-version' |
||||||
|
import styles from './version.module.scss' |
||||||
|
|
||||||
|
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 |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
onMounted(() => { |
||||||
|
variables.taskVersion = props.row?.taskVersion |
||||||
|
variables.taskCode = props.row?.taskCode |
||||||
|
|
||||||
|
createColumns(variables) |
||||||
|
requestData() |
||||||
|
}) |
||||||
|
|
||||||
|
watch( |
||||||
|
() => props.show, |
||||||
|
() => { |
||||||
|
variables.taskVersion = props.row?.taskVersion |
||||||
|
variables.taskCode = props.row?.taskCode |
||||||
|
|
||||||
|
if (props.show) { |
||||||
|
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 } = this |
||||||
|
|
||||||
|
return ( |
||||||
|
<Modal |
||||||
|
show={show} |
||||||
|
title={t('project.task.version')} |
||||||
|
cancelShow={false} |
||||||
|
onConfirm={onConfirm} |
||||||
|
> |
||||||
|
<NDataTable columns={this.columns} data={this.tableData} /> |
||||||
|
<div class={styles.pagination}> |
||||||
|
<NPagination |
||||||
|
v-model:page={this.page} |
||||||
|
v-model:page-size={this.pageSize} |
||||||
|
page-count={this.totalPage} |
||||||
|
onUpdatePage={requestData} |
||||||
|
/> |
||||||
|
</div> |
||||||
|
</Modal> |
||||||
|
) |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
export default VersionModal |
||||||
@ -0,0 +1,43 @@ |
|||||||
|
/* |
||||||
|
* 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. |
||||||
|
*/ |
||||||
|
|
||||||
|
.search-card { |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
|
||||||
|
.box { |
||||||
|
display: flex; |
||||||
|
justify-content: flex-end; |
||||||
|
align-items: center; |
||||||
|
width: 300px; |
||||||
|
|
||||||
|
button, input { |
||||||
|
margin-left: 10px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.table-card { |
||||||
|
margin-top: 8px; |
||||||
|
|
||||||
|
.pagination { |
||||||
|
margin-top: 20px; |
||||||
|
display: flex; |
||||||
|
justify-content: center; |
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,282 @@ |
|||||||
|
/* |
||||||
|
* 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, NPopconfirm, NSpace, NTag, NTooltip } from 'naive-ui' |
||||||
|
import { useI18n } from 'vue-i18n' |
||||||
|
import { |
||||||
|
DeleteOutlined, |
||||||
|
EditOutlined, |
||||||
|
DragOutlined, |
||||||
|
ExclamationCircleOutlined |
||||||
|
} from '@vicons/antd' |
||||||
|
import { |
||||||
|
queryTaskDefinitionListPaging, |
||||||
|
deleteTaskDefinition |
||||||
|
} from '@/service/modules/task-definition' |
||||||
|
import { useRoute } from 'vue-router' |
||||||
|
import type { |
||||||
|
TaskDefinitionItem, |
||||||
|
TaskDefinitionRes |
||||||
|
} from '@/service/modules/task-definition/types' |
||||||
|
|
||||||
|
export function useTable() { |
||||||
|
const { t } = useI18n() |
||||||
|
const route = useRoute() |
||||||
|
const projectCode = Number(route.params.projectCode) |
||||||
|
|
||||||
|
const createColumns = (variables: any) => { |
||||||
|
variables.columns = [ |
||||||
|
{ |
||||||
|
title: '#', |
||||||
|
key: 'index' |
||||||
|
}, |
||||||
|
{ |
||||||
|
title: t('project.task.task_name'), |
||||||
|
key: 'taskName' |
||||||
|
}, |
||||||
|
{ |
||||||
|
title: t('project.task.workflow_name'), |
||||||
|
key: 'processDefinitionName' |
||||||
|
}, |
||||||
|
{ |
||||||
|
title: t('project.task.workflow_state'), |
||||||
|
key: 'processReleaseState' |
||||||
|
}, |
||||||
|
{ |
||||||
|
title: t('project.task.task_type'), |
||||||
|
key: 'taskType' |
||||||
|
}, |
||||||
|
{ |
||||||
|
title: t('project.task.version'), |
||||||
|
key: 'taskVersion', |
||||||
|
render: (row: TaskDefinitionItem) => |
||||||
|
h('span', null, 'v' + row.taskVersion) |
||||||
|
}, |
||||||
|
{ |
||||||
|
title: t('project.task.upstream_tasks'), |
||||||
|
key: 'upstreamTaskMap', |
||||||
|
render: (row: TaskDefinitionItem) => |
||||||
|
h( |
||||||
|
'span', |
||||||
|
null, |
||||||
|
row.upstreamTaskMap.length < 1 |
||||||
|
? '-' |
||||||
|
: h(NSpace, null, { |
||||||
|
default: () => row.upstreamTaskMap.map((item: string) => { |
||||||
|
return h( |
||||||
|
NTag, |
||||||
|
{ type: 'info', size: 'small' }, |
||||||
|
{ default: () => item } |
||||||
|
) |
||||||
|
}) |
||||||
|
}) |
||||||
|
) |
||||||
|
}, |
||||||
|
{ |
||||||
|
title: t('project.task.create_time'), |
||||||
|
key: 'taskCreateTime' |
||||||
|
}, |
||||||
|
{ |
||||||
|
title: t('project.task.update_time'), |
||||||
|
key: 'taskUpdateTime' |
||||||
|
}, |
||||||
|
{ |
||||||
|
title: t('project.task.operation'), |
||||||
|
key: 'operation', |
||||||
|
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: () => { |
||||||
|
// handleEdit(row)
|
||||||
|
} |
||||||
|
}, |
||||||
|
{ |
||||||
|
icon: () => h(EditOutlined) |
||||||
|
} |
||||||
|
), |
||||||
|
default: () => t('project.task.edit') |
||||||
|
} |
||||||
|
), |
||||||
|
h( |
||||||
|
NTooltip, |
||||||
|
{}, |
||||||
|
{ |
||||||
|
trigger: () => |
||||||
|
h( |
||||||
|
NButton, |
||||||
|
{ |
||||||
|
circle: true, |
||||||
|
type: 'info', |
||||||
|
size: 'small', |
||||||
|
disabled: |
||||||
|
row.processDefinitionCode && |
||||||
|
row.processReleaseState === 'ONLINE', |
||||||
|
onClick: () => { |
||||||
|
variables.showMoveModalRef = true |
||||||
|
variables.row = row |
||||||
|
} |
||||||
|
}, |
||||||
|
{ |
||||||
|
icon: () => h(DragOutlined) |
||||||
|
} |
||||||
|
), |
||||||
|
default: () => t('project.task.move') |
||||||
|
} |
||||||
|
), |
||||||
|
h( |
||||||
|
NTooltip, |
||||||
|
{}, |
||||||
|
{ |
||||||
|
trigger: () => |
||||||
|
h( |
||||||
|
NButton, |
||||||
|
{ |
||||||
|
circle: true, |
||||||
|
type: 'info', |
||||||
|
size: 'small', |
||||||
|
onClick: () => { |
||||||
|
variables.showVersionModalRef = true |
||||||
|
variables.row = row |
||||||
|
} |
||||||
|
}, |
||||||
|
{ |
||||||
|
icon: () => 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(DeleteOutlined) |
||||||
|
} |
||||||
|
), |
||||||
|
default: () => t('project.task.delete') |
||||||
|
} |
||||||
|
), |
||||||
|
default: () => t('project.task.delete_confirm') |
||||||
|
} |
||||||
|
) |
||||||
|
] |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
] |
||||||
|
} |
||||||
|
|
||||||
|
const variables = reactive({ |
||||||
|
columns: [], |
||||||
|
tableData: [], |
||||||
|
page: ref(1), |
||||||
|
pageSize: ref(10), |
||||||
|
searchTaskName: ref(null), |
||||||
|
searchWorkflowName: ref(null), |
||||||
|
totalPage: ref(1), |
||||||
|
taskType: ref(null), |
||||||
|
showVersionModalRef: ref(false), |
||||||
|
showMoveModalRef: ref(false), |
||||||
|
row: {} |
||||||
|
}) |
||||||
|
|
||||||
|
const handleDelete = (row: any) => { |
||||||
|
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) => { |
||||||
|
const { state } = useAsyncState( |
||||||
|
queryTaskDefinitionListPaging({ ...params }, { projectCode }).then( |
||||||
|
(res: TaskDefinitionRes) => { |
||||||
|
variables.tableData = res.totalList.map((item, index) => { |
||||||
|
if (Object.keys(item.upstreamTaskMap).length > 0) { |
||||||
|
item.upstreamTaskMap = Object.keys(item.upstreamTaskMap).map( |
||||||
|
(code) => item.upstreamTaskMap[code] |
||||||
|
) |
||||||
|
} else { |
||||||
|
item.upstreamTaskMap = [] |
||||||
|
} |
||||||
|
|
||||||
|
return { |
||||||
|
index: index + 1, |
||||||
|
...item |
||||||
|
} |
||||||
|
}) as any |
||||||
|
variables.totalPage = res.totalPage |
||||||
|
} |
||||||
|
), |
||||||
|
{} |
||||||
|
) |
||||||
|
|
||||||
|
return state |
||||||
|
} |
||||||
|
|
||||||
|
return { |
||||||
|
variables, |
||||||
|
getTableData, |
||||||
|
createColumns |
||||||
|
} |
||||||
|
} |
||||||
Loading…
Reference in new issue