运维管理平台前端
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

90 lines
2.3 KiB

3 months ago
<template>
<PageWrapper dense>
<BasicTable @register="registerTable">
<template #toolbar>
<a-button type="primary" @click="handleAdd">新增</a-button>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column && record && column.key === 'action'">
<!-- 完成/撤销不显示 -->
<TableAction
stopButtonPropagation
:actions="[
{
label: '修改',
icon: IconEnum.EDIT,
onClick: handleEdit.bind(null, record),
},
{
label: '删除',
icon: IconEnum.DELETE,
danger: true,
popConfirm: {
placement: 'left',
title: `是否删除请假[${record.id}]?`,
confirm: handleDelete.bind(null, record),
},
},
]"
/>
</template>
</template>
</BasicTable>
</PageWrapper>
</template>
<script setup lang="ts">
import { PageWrapper } from '@/components/Page';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { list, removeByIds } from './api.ts';
import { formSchemas, columns } from './manage.data';
import { IconEnum } from '@/enums/appEnum';
import { useGo } from '@/hooks/web/usePage';
import { PageEnum } from '@/enums/pageEnum';
defineOptions({ name: 'Manage' });
const [registerTable, { reload }] = useTable({
title: '项目管理',
api: list,
showIndexColumn: false,
rowKey: 'id',
useSearchForm: true,
formConfig: {
schemas: formSchemas,
name: 'manage',
baseColProps: {
xs: 24,
sm: 24,
md: 24,
lg: 6,
},
},
columns: columns,
actionColumn: {
width: 200,
title: '操作',
key: 'action',
fixed: 'right',
},
});
function handleEdit(record: Recordable) {
go({ path: '/pollution/manage' as PageEnum, query: { id: record.id, type: 'update' } });
}
function handleAdd() {
go({ path: '/pollution/manage' as PageEnum, query: { type: 'add' } });
}
async function handleDelete(record: Recordable) {
await removeByIds([record.id]);
await reload();
}
// 前往审批记录页面
const go = useGo();
</script>
<style scoped></style>