<template>
  <BasicTable @register="registerTable">
    <template #currentProgress="{ record }">
      <a-progress
        v-if="typeof record.currentProgress === 'number' && isFinite(record.currentProgress)"
        :percent="record.currentProgress"
        size="small"
      />
    </template>
    <template #action="{ record }">
      <TableAction
        :actions="[
          {
            auth: 'processtasks:view',
            label: '查看',
            onClick: handleView.bind(null, record),
          },
          {
            auth: 'processtasks:relaunch',
            label: '重新发起',
            onClick: handleRestart.bind(null, record),
          },
          {
            label: '删除',
            auth: 'processtasks:delete',
            color: 'error',
            popConfirm: {
              title: t('是否确认删除'),
              confirm: handleDelete.bind(null, record),
            },
          },
        ]"
      />
    </template>
  </BasicTable>
  <LookProcess
    v-if="visibleLookProcess"
    :visible="visibleLookProcess"
    :taskId="taskIdProcess"
    :processId="processIdProcess"
    @close="visibleLookProcess = false"
  />
  <RestartProcess
    v-if="visibleRestartProcess"
    :visible="visibleRestartProcess"
    :schemaId="schemaIdProcess"
    :taskId="taskIdProcess"
    :processId="processIdProcess"
    @close="handleRestartClose"
  />
</template>

<script setup lang="ts">
  import { ref } from 'vue';
  import userTaskTable from './../../hooks/userTaskTable';
  import LookProcess from './../LookProcess.vue';
  import RestartProcess from './../RestartProcess.vue';
  import { BasicTable, useTable, TableAction, BasicColumn } from '/@/components/Table';
  import { deleteRecycle, getSchemaTask } from '/@/api/workflow/process';
  import { notification } from 'ant-design-vue';
  import { TaskTypeUrl } from '/@/enums/workflowEnum';
  import { useI18n } from '/@/hooks/web/useI18n';
  const { t } = useI18n();

  const configColumns: BasicColumn[] = [
    {
      title: t('流水号'),
      dataIndex: 'serialNumber',
      width: 80,
    },
    {
      title: t('流程名称'),
      dataIndex: 'processName',
    },
    {
      title: t('任务名称'),
      dataIndex: 'currentTaskName',
    },
    {
      title: t('当前进度'),
      dataIndex: 'currentProgress',
      slots: { customRender: 'currentProgress' },
    },
    {
      title: t('发起人'),
      dataIndex: 'originator',
    },
    {
      title: t('发起时间'),
      dataIndex: 'createTime',
    },
  ];

  const visibleLookProcess = ref(false);
  const visibleRestartProcess = ref(false);

  const taskIdProcess = ref('');
  const processIdProcess = ref('');
  const schemaIdProcess = ref('');

  const { formConfig } = userTaskTable();

  const [registerTable, { reload }] = useTable({
    title: t('回收站列表'),
    api: getSchemaTask,
    rowKey: 'taskId',
    columns: configColumns,
    formConfig: formConfig(),
    beforeFetch: (params) => {
      return { data: params, taskUrl: TaskTypeUrl.RECYCLE };
    },
    useSearchForm: true,
    showTableSetting: true,
    striped: false,
    showIndexColumn: false,
    pagination: {
      pageSize: 18,
    },
    tableSetting: {
      size: false,
      setting: false,
    },
    actionColumn: {
      width: 170,
      title: t('操作'),
      dataIndex: 'action',
      slots: { customRender: 'action' },
      fixed: 'right',
    },
  });

  async function handleDelete(record: Recordable) {
    if (record.processId) {
      try {
        let res = await deleteRecycle([record.processId]);
        if (res) {
          notification.open({
            type: 'success',
            message: t('移入回收站'),
            description: t('移入回收站成功'),
          });
          reload();
        } else {
          notification.open({
            type: 'error',
            message: t('移入回收站'),
            description: t('移入回收站失败'),
          });
        }
      } catch (error) {}
    }
  }

  const handleView = (record) => {
    visibleLookProcess.value = true;
    taskIdProcess.value = record.taskId;
    processIdProcess.value = record.processId;
  };

  const handleRestart = (record) => {
    visibleRestartProcess.value = true;
    taskIdProcess.value = record.taskId;
    processIdProcess.value = record.processId;
    schemaIdProcess.value = record.schemaId;
  };

  const handleRestartClose = () => {
    visibleRestartProcess.value = false;
    reload();
  };
</script>

<style scoped></style>
