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/${res.schemaId}/${record.id}/createFlow`
        });
    } 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>