import { useEffect, useState } from "react"; import { useNavigate, useSearchParams } from "react-router-dom"; import { useTranslation } from "react-i18next"; import { Button, Modal, notification, Space, Switch, Table, Tooltip, Typography, type TableProps } from "antd"; import { PageHeader } from "@ant-design/pro-components"; import { Pencil as PencilIcon, Plus as PlusIcon, Trash2 as Trash2Icon } from "lucide-react"; import moment from "moment"; import { Workflow as WorkflowType } from "@/domain/workflow"; import { list as listWorkflow, remove as removeWorkflow, save as saveWorkflow, type WorkflowListReq } from "@/repository/workflow"; const WorkflowList = () => { const navigate = useNavigate(); const [searchParams] = useSearchParams(); const { t } = useTranslation(); const [modalApi, ModelContextHolder] = Modal.useModal(); const [notificationApi, NotificationContextHolder] = notification.useNotification(); const [loading, setLoading] = useState(false); const tableColumns: TableProps["columns"] = [ { key: "$index", align: "center", title: "", width: 50, render: (_, __, index) => (page - 1) * pageSize + index + 1, }, { key: "name", title: t("common.text.name"), render: (_, record) => ( {record.name} {record.description} ), }, { key: "type", title: t("workflow.props.executionMethod"), render: (_, record) => { const method = record.type; if (!method) { return "-"; } else if (method === "manual") { return {t("workflow.node.start.form.executionMethod.options.manual")}; } else if (method === "auto") { return ( {t("workflow.node.start.form.executionMethod.options.auto")} {record.crontab ?? ""} ); } }, }, { key: "enabled", title: t("workflow.props.enabled"), render: (_, record) => { const enabled = record.enabled; return ( <> { handleEnabledChange(record); }} /> ); }, }, { key: "lastExecutedAt", title: "最近执行状态", render: () => { // TODO: 最近执行状态 return <>TODO; }, }, { key: "createdAt", title: t("common.text.created_at"), ellipsis: true, render: (_, record) => { return moment(record.created!).format("YYYY-MM-DD HH:mm:ss"); }, }, { key: "updatedAt", title: t("common.text.updated_at"), ellipsis: true, render: (_, record) => { return moment(record.updated!).format("YYYY-MM-DD HH:mm:ss"); }, }, { key: "$action", align: "end", fixed: "right", width: 120, render: (_, record) => ( , ]} /> columns={tableColumns} dataSource={tableData} loading={loading} pagination={{ current: page, pageSize: pageSize, total: tableTotal, onChange: (page, pageSize) => { setPage(page); setPageSize(pageSize); }, onShowSizeChange: (page, pageSize) => { setPage(page); setPageSize(pageSize); }, }} rowKey={(record) => record.id} /> ); }; export default WorkflowList;