<template>
  <div>
    <BasicTable @register="registerTable">
      <template #action="{ record }">
        <TableAction
          :actions="[
            {
              label: '重试',
              icon: 'ant-design:redo-outlined',
              auth: 'xslmes:mes_xsl_integration_log:retry',
              disabled: record.status === 'success',
              tooltip: record.status === 'success' ? '已成功，无需重试' : '重新执行该动作',
              popConfirm: {
                title: '确认重试该集成动作？',
                confirm: handleRetry.bind(null, record),
                placement: 'topLeft',
              },
            },
          ]"
        />
      </template>
      <!-- 详情展开 -->
      <template #expandedRowRender="{ record }">
        <a-descriptions :column="2" size="small" bordered>
          <a-descriptions-item label="方案ID">{{ record.planId || '—' }}</a-descriptions-item>
          <a-descriptions-item label="动作ID">{{ record.actionId || '—' }}</a-descriptions-item>
          <a-descriptions-item label="台账ID">{{ record.recordId || '—' }}</a-descriptions-item>
          <a-descriptions-item label="幂等键">{{ record.idempotentKey || '—' }}</a-descriptions-item>
          <a-descriptions-item label="错误信息" :span="2">
            <span style="color: #f5222d; white-space: pre-wrap">{{ record.errorMessage || '—' }}</span>
          </a-descriptions-item>
          <a-descriptions-item label="请求快照" :span="2">
            <pre style="margin: 0; font-size: 12px; max-height: 100px; overflow: auto">{{ record.requestSnapshot || '—' }}</pre>
          </a-descriptions-item>
          <a-descriptions-item label="响应快照" :span="2">
            <pre style="margin: 0; font-size: 12px; max-height: 100px; overflow: auto">{{ record.responseSnapshot || '—' }}</pre>
          </a-descriptions-item>
        </a-descriptions>
      </template>
    </BasicTable>
  </div>
</template>

<script lang="ts" name="xslmes-mesXslIntegrationLog" setup>
  import { BasicTable, TableAction } from '/@/components/Table';
  import { useListPage } from '/@/hooks/system/useListPage';
  import { useMessage } from '/@/hooks/web/useMessage';
  import { columns, searchFormSchema } from './MesXslIntegrationLog.data';
  import { list, retry } from './MesXslIntegrationLog.api';

  const { createMessage } = useMessage();

  const { tableContext } = useListPage({
    tableProps: {
      title: '集成执行日志',
      api: list,
      columns,
      canResize: true,
      expandRowByClick: true,
      formConfig: {
        schemas: searchFormSchema,
        autoSubmitOnEnter: true,
        showAdvancedButton: true,
        labelWidth: 80,
      },
      actionColumn: { width: 90, fixed: 'right' },
    },
  });

  const [registerTable, { reload }] = tableContext;

  async function handleRetry(record: Recordable) {
    try {
      await retry(record.id);
      createMessage.success('重试任务已提交');
      reload();
    } catch (e: any) {
      createMessage.error(e?.message || '重试失败');
    }
  }
</script>

<style lang="less" scoped>
  :deep(.ant-picker-range) {
    width: 100%;
  }
</style>
