mirror of
https://gitee.com/dolphinscheduler/DolphinScheduler.git
synced 2024-12-04 21:28:00 +08:00
[Feature][UI Next] Add security yarn queue manage. (#8040)
This commit is contained in:
songjianet
GitHub
parent
5e975dad34
commit
7d5ab53d0d
@ -192,6 +192,7 @@ const resource = {
|
||||
const project = {
|
||||
list: {
|
||||
create_project: 'Create Project',
|
||||
edit_project: 'Edit Project',
|
||||
project_list: 'Project List',
|
||||
project_tips: 'Please enter your project',
|
||||
description_tips: 'Please enter your description',
|
||||
@ -232,6 +233,19 @@ const security = {
|
||||
delete_confirm: 'Delete?',
|
||||
edit: 'Edit',
|
||||
delete: 'Delete'
|
||||
},
|
||||
yarn_queue: {
|
||||
create_queue: 'Create Queue',
|
||||
edit_queue: 'Edit Queue',
|
||||
search_tips: 'Please enter keywords',
|
||||
queue_name: 'Queue Name',
|
||||
queue_value: 'Queue Value',
|
||||
create_time: 'Create Time',
|
||||
update_time: 'Update Time',
|
||||
operation: 'Operation',
|
||||
edit: 'Edit',
|
||||
queue_name_tips: 'Please enter your queue name',
|
||||
queue_value_tips: 'Please enter your queue value'
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -191,6 +191,7 @@ const resource = {
|
||||
const project = {
|
||||
list: {
|
||||
create_project: '创建项目',
|
||||
edit_project: '编辑项目',
|
||||
project_list: '项目列表',
|
||||
project_tips: '请输入项目名称',
|
||||
description_tips: '请输入项目描述',
|
||||
@ -231,6 +232,19 @@ const security = {
|
||||
delete_confirm: '确定删除吗?',
|
||||
edit: '编辑',
|
||||
delete: '删除'
|
||||
},
|
||||
yarn_queue: {
|
||||
create_queue: '创建队列',
|
||||
edit_queue: '编辑队列',
|
||||
search_tips: '请输入关键词',
|
||||
queue_name: '队列名',
|
||||
queue_value: '队列值',
|
||||
create_time: '创建时间',
|
||||
update_time: '更新时间',
|
||||
operation: '操作',
|
||||
edit: '编辑',
|
||||
queue_name_tips: '请输入队列名称',
|
||||
queue_value_tips: '请输入队列值'
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -44,6 +44,14 @@ export default {
|
||||
meta: {
|
||||
title: '用户管理'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/security/yarn-queue-manage',
|
||||
name: 'yarn-queue-manage',
|
||||
component: components['yarn-queue-manage'],
|
||||
meta: {
|
||||
title: 'Yarn队列管理'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@ -49,9 +49,9 @@ export function verifyQueue(data: QueueReq): any {
|
||||
})
|
||||
}
|
||||
|
||||
export function updateQueue(data: QueueReq, id: IdReq): any {
|
||||
export function updateQueue(data: QueueReq, idReq: IdReq): any {
|
||||
return axios({
|
||||
url: `/queues/${id}`,
|
||||
url: `/queues/${idReq.id}`,
|
||||
method: 'put',
|
||||
data
|
||||
})
|
||||
|
||||
@ -30,4 +30,21 @@ interface IdReq {
|
||||
id: number
|
||||
}
|
||||
|
||||
export { ListReq, QueueReq, IdReq }
|
||||
interface QueueList {
|
||||
id: number
|
||||
queueName: string
|
||||
queue: string
|
||||
createTime: string
|
||||
updateTime: string
|
||||
}
|
||||
|
||||
interface QueueRes {
|
||||
totalList: QueueList[]
|
||||
total: number
|
||||
totalPage: number
|
||||
pageSize: number
|
||||
currentPage: number
|
||||
start: number
|
||||
}
|
||||
|
||||
export { ListReq, QueueReq, IdReq, QueueRes }
|
||||
|
||||
@ -68,10 +68,14 @@ const ProjectModal = defineComponent({
|
||||
return { ...toRefs(state), t, onConfirm, onCancel }
|
||||
},
|
||||
render() {
|
||||
const { t, onConfirm, onCancel, show } = this
|
||||
const { t, onConfirm, onCancel, show, status } = this
|
||||
return (
|
||||
<Modal
|
||||
title={t('project.list.create_project')}
|
||||
title={
|
||||
status === 0
|
||||
? t('project.list.create_project')
|
||||
: t('project.list.edit_project')
|
||||
}
|
||||
show={show}
|
||||
onConfirm={onConfirm}
|
||||
onCancel={onCancel}
|
||||
|
||||
@ -79,6 +79,15 @@ const list = defineComponent({
|
||||
})
|
||||
}
|
||||
|
||||
const onSearch = () => {
|
||||
variables.page = 1
|
||||
getTableData({
|
||||
pageSize: variables.pageSize,
|
||||
pageNo: variables.page,
|
||||
searchVal: variables.searchVal
|
||||
})
|
||||
}
|
||||
|
||||
const onUpdatePageSize = () => {
|
||||
variables.page = 1
|
||||
resetTableData()
|
||||
@ -110,6 +119,7 @@ const list = defineComponent({
|
||||
updateProjectItem,
|
||||
resetTableData,
|
||||
onUpdatePageSize,
|
||||
onSearch,
|
||||
updateProjectData,
|
||||
modelStatusRef
|
||||
}
|
||||
@ -124,6 +134,7 @@ const list = defineComponent({
|
||||
updateProjectItem,
|
||||
resetTableData,
|
||||
onUpdatePageSize,
|
||||
onSearch,
|
||||
updateProjectData,
|
||||
modelStatusRef
|
||||
} = this
|
||||
@ -143,8 +154,9 @@ const list = defineComponent({
|
||||
size='small'
|
||||
v-model:value={this.searchVal}
|
||||
placeholder={t('project.list.project_tips')}
|
||||
clearable
|
||||
/>
|
||||
<NButton size='small' type='primary' onClick={resetTableData}>
|
||||
<NButton size='small' type='primary' onClick={onSearch}>
|
||||
{{
|
||||
icon: () => (
|
||||
<NIcon>
|
||||
|
||||
@ -73,7 +73,12 @@ export function useTable(
|
||||
render: (row: any) =>
|
||||
h(TableAction, {
|
||||
row,
|
||||
onResetTableData: () => resetTableData(),
|
||||
onResetTableData: () => {
|
||||
if (variables.page > 1 && variables.tableData.length === 1) {
|
||||
variables.page -= 1
|
||||
}
|
||||
resetTableData()
|
||||
},
|
||||
onUpdateProjectItem: (code, name, description) =>
|
||||
updateProjectItem(code, name, description)
|
||||
})
|
||||
|
||||
@ -149,6 +149,7 @@ export default defineComponent({
|
||||
|
||||
watch(
|
||||
() => router.currentRoute.value.params.id,
|
||||
// @ts-ignore
|
||||
() => reload()
|
||||
)
|
||||
|
||||
|
||||
@ -139,7 +139,7 @@ const tenementManage = defineComponent({
|
||||
row={this.row}
|
||||
onCancelModal={this.onCancelModal}
|
||||
onConfirmModal={this.onConfirmModal}
|
||||
></TenantModal>
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@ -0,0 +1,89 @@
|
||||
/*
|
||||
* 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 { verifyQueue, createQueue, updateQueue } from '@/service/modules/queues'
|
||||
|
||||
export function useModal(
|
||||
props: any,
|
||||
ctx: SetupContext<('cancelModal' | 'confirmModal')[]>
|
||||
) {
|
||||
const { t } = useI18n()
|
||||
|
||||
const variables = reactive({
|
||||
yarnQueueFormRef: ref(),
|
||||
model: {
|
||||
id: ref<number>(-1),
|
||||
queue: ref(''),
|
||||
queueName: ref('')
|
||||
},
|
||||
rules: {
|
||||
queue: {
|
||||
required: true,
|
||||
trigger: ['input', 'blur'],
|
||||
validator() {
|
||||
if (variables.model.queue === '') {
|
||||
return new Error(t('security.yarn_queue.queue_value_tips'))
|
||||
}
|
||||
}
|
||||
},
|
||||
queueName: {
|
||||
required: true,
|
||||
trigger: ['input', 'blur'],
|
||||
validator() {
|
||||
if (variables.model.queueName === '') {
|
||||
return new Error(t('security.yarn_queue.queue_name_tips'))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
const handleValidate = (statusRef: number) => {
|
||||
variables.yarnQueueFormRef.validate((errors: any) => {
|
||||
if (!errors) {
|
||||
statusRef === 0 ? submitYarnQueueModal() : updateYarnQueueModal()
|
||||
} else {
|
||||
return
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const submitYarnQueueModal = () => {
|
||||
verifyQueue({ ...variables.model }).then(() => {
|
||||
createQueue({ ...variables.model }).then(() => {
|
||||
variables.model.queue = ''
|
||||
variables.model.queueName = ''
|
||||
ctx.emit('confirmModal', props.showModalRef)
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
const updateYarnQueueModal = () => {
|
||||
updateQueue({ ...variables.model }, { id: variables.model.id }).then(
|
||||
(res: any) => {
|
||||
ctx.emit('confirmModal', props.showModalRef)
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
return {
|
||||
variables,
|
||||
handleValidate
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,131 @@
|
||||
/*
|
||||
* 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, NInput } from 'naive-ui'
|
||||
import { useModal } from './use-modal'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
|
||||
const YarnQueueModal = defineComponent({
|
||||
name: 'YarnQueueModal',
|
||||
props: {
|
||||
showModalRef: {
|
||||
type: Boolean as PropType<boolean>,
|
||||
default: false
|
||||
},
|
||||
statusRef: {
|
||||
type: Number as PropType<number>,
|
||||
default: 0
|
||||
},
|
||||
row: {
|
||||
type: Object as PropType<any>,
|
||||
default: {}
|
||||
}
|
||||
},
|
||||
emits: ['cancelModal', 'confirmModal'],
|
||||
setup(props, ctx) {
|
||||
const { variables, handleValidate } = useModal(props, ctx)
|
||||
const { t } = useI18n()
|
||||
|
||||
const cancelModal = () => {
|
||||
if (props.statusRef === 0) {
|
||||
variables.model.queue = ''
|
||||
variables.model.queueName = ''
|
||||
}
|
||||
ctx.emit('cancelModal', props.showModalRef)
|
||||
}
|
||||
|
||||
const confirmModal = () => {
|
||||
handleValidate(props.statusRef)
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.statusRef,
|
||||
() => {
|
||||
if (props.statusRef === 0) {
|
||||
variables.model.queue = ''
|
||||
variables.model.queueName = ''
|
||||
} else {
|
||||
variables.model.id = props.row.id
|
||||
variables.model.queue = props.row.queue
|
||||
variables.model.queueName = props.row.queueName
|
||||
}
|
||||
}
|
||||
)
|
||||
|
||||
watch(
|
||||
() => props.row,
|
||||
() => {
|
||||
variables.model.id = props.row.id
|
||||
variables.model.queue = props.row.queue
|
||||
variables.model.queueName = props.row.queueName
|
||||
}
|
||||
)
|
||||
|
||||
return { t, ...toRefs(variables), cancelModal, confirmModal }
|
||||
},
|
||||
render() {
|
||||
const { t } = this
|
||||
return (
|
||||
<div>
|
||||
<Modal
|
||||
title={
|
||||
this.statusRef === 0
|
||||
? t('security.yarn_queue.create_queue')
|
||||
: t('security.yarn_queue.edit_queue')
|
||||
}
|
||||
show={this.showModalRef}
|
||||
onCancel={this.cancelModal}
|
||||
onConfirm={this.confirmModal}
|
||||
confirmDisabled={!this.model.queueName || !this.model.queue}
|
||||
>
|
||||
{{
|
||||
default: () => (
|
||||
<NForm
|
||||
model={this.model}
|
||||
rules={this.rules}
|
||||
ref='yarnQueueFormRef'
|
||||
>
|
||||
<NFormItem
|
||||
label={t('security.yarn_queue.queue_name')}
|
||||
path='queueName'
|
||||
>
|
||||
<NInput
|
||||
placeholder={t('security.yarn_queue.queue_name_tips')}
|
||||
v-model={[this.model.queueName, 'value']}
|
||||
/>
|
||||
</NFormItem>
|
||||
<NFormItem
|
||||
label={t('security.yarn_queue.queue_value')}
|
||||
path='queue'
|
||||
>
|
||||
<NInput
|
||||
placeholder={t('security.yarn_queue.queue_value_tips')}
|
||||
v-model={[this.model.queue, 'value']}
|
||||
/>
|
||||
</NFormItem>
|
||||
</NForm>
|
||||
)
|
||||
}}
|
||||
</Modal>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
})
|
||||
|
||||
export default YarnQueueModal
|
||||
@ -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 {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table-card {
|
||||
margin-top: 8px;
|
||||
|
||||
.pagination {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,158 @@
|
||||
/*
|
||||
* 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, toRefs, watch } from 'vue'
|
||||
import {
|
||||
NButton,
|
||||
NCard,
|
||||
NDataTable,
|
||||
NIcon,
|
||||
NInput,
|
||||
NPagination
|
||||
} from 'naive-ui'
|
||||
import { SearchOutlined } from '@vicons/antd'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { useTable } from './use-table'
|
||||
import Card from '@/components/card'
|
||||
import YarnQueueModal from './components/yarn-queue-modal'
|
||||
import styles from './index.module.scss'
|
||||
|
||||
const yarnQueueManage = defineComponent({
|
||||
name: 'yarn-queue-manage',
|
||||
setup() {
|
||||
const { t } = useI18n()
|
||||
const { variables, getTableData, createColumns } = useTable()
|
||||
|
||||
const requestData = () => {
|
||||
getTableData({
|
||||
pageSize: variables.pageSize,
|
||||
pageNo: variables.page,
|
||||
searchVal: variables.searchVal
|
||||
})
|
||||
}
|
||||
|
||||
const onUpdatePageSize = () => {
|
||||
variables.page = 1
|
||||
requestData()
|
||||
}
|
||||
|
||||
const onSearch = () => {
|
||||
variables.page = 1
|
||||
requestData()
|
||||
}
|
||||
|
||||
const handleModalChange = () => {
|
||||
variables.showModalRef = true
|
||||
variables.statusRef = 0
|
||||
}
|
||||
|
||||
const onCancelModal = () => {
|
||||
variables.showModalRef = false
|
||||
}
|
||||
|
||||
const onConfirmModal = () => {
|
||||
variables.showModalRef = false
|
||||
requestData()
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
createColumns(variables)
|
||||
requestData()
|
||||
})
|
||||
|
||||
watch(useI18n().locale, () => {
|
||||
createColumns(variables)
|
||||
})
|
||||
|
||||
return {
|
||||
t,
|
||||
...toRefs(variables),
|
||||
requestData,
|
||||
onCancelModal,
|
||||
onConfirmModal,
|
||||
onUpdatePageSize,
|
||||
handleModalChange,
|
||||
onSearch
|
||||
}
|
||||
},
|
||||
render() {
|
||||
const {
|
||||
t,
|
||||
requestData,
|
||||
onUpdatePageSize,
|
||||
onCancelModal,
|
||||
onConfirmModal,
|
||||
handleModalChange,
|
||||
onSearch
|
||||
} = this
|
||||
|
||||
return (
|
||||
<div>
|
||||
<NCard>
|
||||
<div class={styles['search-card']}>
|
||||
<div>
|
||||
<NButton size='small' type='primary' onClick={handleModalChange}>
|
||||
{t('security.yarn_queue.create_queue')}
|
||||
</NButton>
|
||||
</div>
|
||||
<div class={styles.box}>
|
||||
<NInput
|
||||
size='small'
|
||||
clearable
|
||||
v-model={[this.searchVal, 'value']}
|
||||
placeholder={t('security.yarn_queue.search_tips')}
|
||||
/>
|
||||
<NButton size='small' type='primary' onClick={onSearch}>
|
||||
{{
|
||||
icon: () => (
|
||||
<NIcon>
|
||||
<SearchOutlined />
|
||||
</NIcon>
|
||||
)
|
||||
}}
|
||||
</NButton>
|
||||
</div>
|
||||
</div>
|
||||
</NCard>
|
||||
<Card class={styles['table-card']}>
|
||||
<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}
|
||||
show-size-picker
|
||||
page-sizes={[10, 30, 50]}
|
||||
show-quick-jumper
|
||||
onUpdatePage={requestData}
|
||||
onUpdatePageSize={onUpdatePageSize}
|
||||
/>
|
||||
</div>
|
||||
</Card>
|
||||
<YarnQueueModal
|
||||
showModalRef={this.showModalRef}
|
||||
statusRef={this.statusRef}
|
||||
row={this.row}
|
||||
onCancelModal={onCancelModal}
|
||||
onConfirmModal={onConfirmModal}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
})
|
||||
|
||||
export default yarnQueueManage
|
||||
@ -0,0 +1,122 @@
|
||||
/*
|
||||
* 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, NTooltip } from 'naive-ui'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { queryQueueListPaging } from '@/service/modules/queues'
|
||||
import { EditOutlined } from '@vicons/antd'
|
||||
import type { QueueRes } from '@/service/modules/queues/types'
|
||||
|
||||
export function useTable() {
|
||||
const { t } = useI18n()
|
||||
|
||||
const handleEdit = (row: any) => {
|
||||
variables.showModalRef = true
|
||||
variables.statusRef = 1
|
||||
variables.row = row
|
||||
}
|
||||
|
||||
const createColumns = (variables: any) => {
|
||||
variables.columns = [
|
||||
{
|
||||
title: '#',
|
||||
key: 'index'
|
||||
},
|
||||
{
|
||||
title: t('security.yarn_queue.queue_name'),
|
||||
key: 'queueName'
|
||||
},
|
||||
{
|
||||
title: t('security.yarn_queue.queue_value'),
|
||||
key: 'queue'
|
||||
},
|
||||
{
|
||||
title: t('security.yarn_queue.create_time'),
|
||||
key: 'createTime'
|
||||
},
|
||||
{
|
||||
title: t('security.yarn_queue.update_time'),
|
||||
key: 'updateTime'
|
||||
},
|
||||
{
|
||||
title: t('security.yarn_queue.operation'),
|
||||
key: 'operation',
|
||||
render(row: any) {
|
||||
return h(
|
||||
NTooltip,
|
||||
{},
|
||||
{
|
||||
trigger: () =>
|
||||
h(
|
||||
NButton,
|
||||
{
|
||||
circle: true,
|
||||
type: 'info',
|
||||
size: 'small',
|
||||
onClick: () => {
|
||||
handleEdit(row)
|
||||
}
|
||||
},
|
||||
{
|
||||
icon: () => h(EditOutlined)
|
||||
}
|
||||
),
|
||||
default: () => t('security.yarn_queue.edit')
|
||||
}
|
||||
)
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
const variables = reactive({
|
||||
columns: [],
|
||||
tableData: [],
|
||||
page: ref(1),
|
||||
pageSize: ref(10),
|
||||
searchVal: ref(null),
|
||||
totalPage: ref(1),
|
||||
showModalRef: ref(false),
|
||||
statusRef: ref(0),
|
||||
row: {}
|
||||
})
|
||||
|
||||
const getTableData = (params: any) => {
|
||||
const { state } = useAsyncState(
|
||||
queryQueueListPaging({ ...params }).then((res: QueueRes) => {
|
||||
variables.tableData = res.totalList.map((item, index) => {
|
||||
return {
|
||||
index: index + 1,
|
||||
...item
|
||||
}
|
||||
}) as any
|
||||
variables.totalPage = res.totalPage
|
||||
}),
|
||||
{}
|
||||
)
|
||||
|
||||
return state
|
||||
}
|
||||
|
||||
return {
|
||||
variables,
|
||||
getTableData,
|
||||
createColumns
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user