[Fix][UI Next][V1.0.0-Alpha] Fix the regularly manage multilingual switching issues. (#8718)

This commit is contained in:
songjianet 2022-03-06 21:36:11 +08:00 committed by GitHub
parent 698c795d4f
commit 9c162c86c3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 166 additions and 158 deletions

View File

@ -18,7 +18,7 @@
import Card from '@/components/card'
import { ArrowLeftOutlined } from '@vicons/antd'
import { NButton, NDataTable, NIcon, NPagination } from 'naive-ui'
import { defineComponent, onMounted, toRefs } from 'vue'
import { defineComponent, onMounted, toRefs, watch } from 'vue'
import { useI18n } from 'vue-i18n'
import { useRouter } from 'vue-router'
import type { Router } from 'vue-router'
@ -29,7 +29,7 @@ import styles from '../index.module.scss'
export default defineComponent({
name: 'WorkflowDefinitionTiming',
setup() {
const { variables, getTableData } = useTable()
const { variables, createColumns, getTableData } = useTable()
const requestData = () => {
getTableData({
@ -54,9 +54,14 @@ export default defineComponent({
}
onMounted(() => {
createColumns(variables)
requestData()
})
watch(useI18n().locale, () => {
createColumns(variables)
})
return {
requestData,
handleSearch,

View File

@ -47,163 +47,8 @@ export function useTable() {
const { t } = useI18n()
const router: Router = useRouter()
const columns: TableColumns<any> = [
{
title: '#',
key: 'id',
width: 50,
render: (_row, index) => index + 1
},
{
title: t('project.workflow.workflow_name'),
key: 'processDefinitionName',
width: 200,
render: (_row) =>
h(
NEllipsis,
{ style: 'max-width: 200px' },
{
default: () => _row.processDefinitionName
}
)
},
{
title: t('project.workflow.start_time'),
key: 'startTime'
},
{
title: t('project.workflow.end_time'),
key: 'endTime'
},
{
title: t('project.workflow.crontab'),
key: 'crontab'
},
{
title: t('project.workflow.failure_strategy'),
key: 'failureStrategy'
},
{
title: t('project.workflow.status'),
key: 'releaseState',
render: (_row) =>
_row.releaseState === 'ONLINE'
? t('project.workflow.up_line')
: t('project.workflow.down_line')
},
{
title: t('project.workflow.create_time'),
key: 'createTime'
},
{
title: t('project.workflow.update_time'),
key: 'updateTime'
},
{
title: t('project.workflow.operation'),
key: 'operation',
fixed: 'right',
className: styles.operation,
render: (row) => {
return h(NSpace, null, {
default: () => [
h(
NTooltip,
{},
{
trigger: () =>
h(
NButton,
{
circle: true,
type: 'info',
size: 'small',
disabled: row.releaseState === 'ONLINE',
onClick: () => {
handleEdit(row)
}
},
{
icon: () => h(EditOutlined)
}
),
default: () => t('project.workflow.edit')
}
),
h(
NTooltip,
{},
{
trigger: () =>
h(
NButton,
{
circle: true,
type: row.releaseState === 'ONLINE' ? 'error' : 'warning',
size: 'small',
onClick: () => {
handleReleaseState(row)
}
},
{
icon: () =>
h(
row.releaseState === 'ONLINE'
? ArrowDownOutlined
: ArrowUpOutlined
)
}
),
default: () =>
row.releaseState === 'ONLINE'
? t('project.workflow.down_line')
: t('project.workflow.up_line')
}
),
h(
NPopconfirm,
{
onPositiveClick: () => {
handleDelete(row.id)
}
},
{
trigger: () =>
h(
NTooltip,
{},
{
trigger: () =>
h(
NButton,
{
circle: true,
type: 'error',
size: 'small'
},
{
icon: () => h(DeleteOutlined)
}
),
default: () => t('project.workflow.delete')
}
),
default: () => t('project.workflow.delete_confirm')
}
)
]
})
}
}
]
const handleEdit = (row: any) => {
variables.showRef = true
variables.row = row
}
const variables = reactive({
columns,
columns: [],
row: {},
tableData: [],
projectCode: ref(Number(router.currentRoute.value.params.projectCode)),
@ -214,6 +59,163 @@ export function useTable() {
showRef: ref(false)
})
const createColumns = (variables: any) => {
variables.columns = [
{
title: '#',
key: 'id',
width: 50,
render: (row: any, index: number) => index + 1
},
{
title: t('project.workflow.workflow_name'),
key: 'processDefinitionName',
width: 200,
render: (row: any) =>
h(
NEllipsis,
{ style: 'max-width: 200px' },
{
default: () => row.processDefinitionName
}
)
},
{
title: t('project.workflow.start_time'),
key: 'startTime'
},
{
title: t('project.workflow.end_time'),
key: 'endTime'
},
{
title: t('project.workflow.crontab'),
key: 'crontab'
},
{
title: t('project.workflow.failure_strategy'),
key: 'failureStrategy'
},
{
title: t('project.workflow.status'),
key: 'releaseState',
render: (row: any) =>
row.releaseState === 'ONLINE'
? t('project.workflow.up_line')
: t('project.workflow.down_line')
},
{
title: t('project.workflow.create_time'),
key: 'createTime'
},
{
title: t('project.workflow.update_time'),
key: 'updateTime'
},
{
title: t('project.workflow.operation'),
key: 'operation',
fixed: 'right',
className: styles.operation,
render: (row: any) => {
return h(NSpace, null, {
default: () => [
h(
NTooltip,
{},
{
trigger: () =>
h(
NButton,
{
circle: true,
type: 'info',
size: 'small',
disabled: row.releaseState === 'ONLINE',
onClick: () => {
handleEdit(row)
}
},
{
icon: () => h(EditOutlined)
}
),
default: () => t('project.workflow.edit')
}
),
h(
NTooltip,
{},
{
trigger: () =>
h(
NButton,
{
circle: true,
type: row.releaseState === 'ONLINE' ? 'error' : 'warning',
size: 'small',
onClick: () => {
handleReleaseState(row)
}
},
{
icon: () =>
h(
row.releaseState === 'ONLINE'
? ArrowDownOutlined
: ArrowUpOutlined
)
}
),
default: () =>
row.releaseState === 'ONLINE'
? t('project.workflow.down_line')
: t('project.workflow.up_line')
}
),
h(
NPopconfirm,
{
onPositiveClick: () => {
handleDelete(row.id)
}
},
{
trigger: () =>
h(
NTooltip,
{},
{
trigger: () =>
h(
NButton,
{
circle: true,
type: 'error',
size: 'small'
},
{
icon: () => h(DeleteOutlined)
}
),
default: () => t('project.workflow.delete')
}
),
default: () => t('project.workflow.delete_confirm')
}
)
]
})
}
}
]
}
const handleEdit = (row: any) => {
variables.showRef = true
variables.row = row
}
const getTableData = (params: ISearchParam) => {
const definitionCode = Number(
router.currentRoute.value.params.definitionCode
@ -266,6 +268,7 @@ export function useTable() {
return {
variables,
createColumns,
getTableData
}
}