geg-gas-web/src/views/workflow/task/components/processTasks/DraftsV2.vue

<template>
    <BasicTable @register="registerTable">
        <template #action="{ record }">
            <TableAction :actions="tableActions(record)" />
        </template>
    </BasicTable>
    <LaunchProcess v-if="processData.visible" :draftsId="processData.draftsId" :draftsJsonStr="processData.draftsJsonStr" :schemaId="processData.schemaId" @close="processData.visible = false" />
</template>

<script setup>
    import userTaskTable from './../../hooks/userTaskTable';

    import LaunchProcess from './../LaunchProcess.vue';
    import { BasicTable, useTable, TableAction } from '/@/components/Table';
    import { deleteDraft, getDraftInfo, getSchemaTask } from '/@/api/workflow/process';
    import { reactive } from 'vue';
    import { notification } from 'ant-design-vue';
    import { TaskTypeUrl } from '/@/enums/workflowEnum';
    import { useI18n } from '/@/hooks/web/useI18n';
    import { useRouter } from 'vue-router';

    const { t } = useI18n();
    const router = useRouter();
    const configColumns = [
        {
            title: t('流程名称'),
            dataIndex: 'schemaName',
            align: 'left'
        },
        {
            title: t('发起者'),
            dataIndex: 'originator',
            sorter: true,
            align: 'left'
        },
        {
            title: t('发起时间'),
            dataIndex: 'createDate',
            align: 'left'
        }
    ];
    const processData = reactive({
        visible: false,
        schemaId: '',
        draftsJsonStr: '',
        draftsId: ''
    });
    const { formConfig } = userTaskTable();
    const [registerTable, { reload }] = useTable({
        title: t('草稿箱列表'),
        api: getSchemaTask,
        rowKey: 'id',
        columns: configColumns,
        formConfig: formConfig('Drafts'),
        beforeFetch: (params) => {
            return { data: params, taskUrl: TaskTypeUrl.DRAFT };
        },
        useSearchForm: true,
        showTableSetting: true,
        striped: false,
        pagination: {
            pageSize: 18
        },
        actionColumn: {
            width: 80,
            title: t('操作'),
            dataIndex: 'action',
            slots: { customRender: 'action' },
            fixed: undefined
        }
    });

    function tableActions(record) {
        return [
            {
                icon: 'clarity:note-edit-line',
                onClick: handleEdit.bind(null, record)
            },
            {
                icon: 'ant-design:delete-outlined',
                color: 'error',
                popConfirm: {
                    title: t('是否确认删除'),
                    confirm: handleDelete.bind(null, record)
                }
            }
        ];
    }

    async function handleEdit(record) {
        try {
            let res = await getDraftInfo(record.id);
            /*processData.draftsId = record.id;
            processData.schemaId = res.schemaId;
            processData.draftsJsonStr = res.formData;
            processData.visible = true;*/
            localStorage.setItem('draftsJsonStr', res.formData);
            router.push({
                path: '/flow/createFlow',
                query: {
                    schemaId: res.schemaId,
                    draftsId: record.id,
                    tabKey: 'draft_' + record.id
                }
            });
        } catch (error) {}
    }

    async function handleDelete(record) {
        try {
            let res = await deleteDraft([record.id]);
            if (res) {
                notification.open({
                    type: 'success',
                    message: t('删除'),
                    description: t('删除成功')
                });
                reload();
            } else {
                notification.open({
                    type: 'error',
                    message: t('删除'),
                    description: t('删除失败')
                });
            }
        } catch (error) {}
    }
</script>

<style scoped></style>