前端打包

2026-08-09 11:15:38 +08:00
parent f67567bdc9
commit 9153c4eead
32 changed files with 1235 additions and 27 deletions
@@ -0,0 +1,121 @@
+import XinTable from '@/components/XinTable';
+import { Badge, Button, Tooltip, Typography } from 'antd';
+import { UnorderedListOutlined } from '@ant-design/icons';
+import type { ICategory } from '@/domain/iCategory';
+import type { XinTableColumn } from '@/components/XinTable/typings';
+import { useTranslation } from 'react-i18next';
+import { useNavigate } from 'react-router';
+import dayjs from 'dayjs';
+
+const { Title, Text } = Typography;
+
+/** 首页分类管理 */
+export default function CategoryPage() {
+  const { t } = useTranslation();
+  const navigate = useNavigate();
+
+  const columns: XinTableColumn<ICategory>[] = [
+    {
+      title: t('system.category.id'),
+      dataIndex: 'id',
+      hideInForm: true,
+      width: 80,
+      sorter: true,
+      align: 'center',
+    },
+    {
+      title: t('system.category.name'),
+      dataIndex: 'name',
+      valueType: 'text',
+      colProps: { span: 12 },
+      rules: [{ required: true, message: t('system.category.name.required') }],
+    },
+    {
+      title: t('system.category.status'),
+      dataIndex: 'status',
+      valueType: 'select',
+      filters: [
+        { text: t('system.category.status.normal'), value: 0 },
+        { text: t('system.category.status.disabled'), value: 1 },
+      ],
+      colProps: { span: 12 },
+      rules: [{ required: true, message: t('system.category.status.required') }],
+      fieldProps: {
+        options: [
+          { label: t('system.category.status.normal'), value: 0 },
+          { label: t('system.category.status.disabled'), value: 1 },
+        ],
+      },
+      render: (value: number) => {
+        return value === 0
+          ? <Badge status="success" text={t('system.category.status.normal')} />
+          : <Badge status="error" text={t('system.category.status.disabled')} />;
+      },
+    },
+    {
+      title: t('system.category.sort'),
+      dataIndex: 'sort',
+      valueType: 'digit',
+      colProps: { span: 12 },
+      hideInSearch: true,
+      initialValue: 0,
+      fieldProps: {
+        min: 0,
+        style: { width: '100%' },
+      },
+    },
+    {
+      title: t('system.category.createdAt'),
+      dataIndex: 'created_at',
+      render: (value: string) => (value ? dayjs(value).format('YYYY-MM-DD HH:mm') : '-'),
+      hideInForm: true,
+      hideInSearch: true,
+      width: 160,
+    },
+  ];
+
+  // 跳转到分类项管理页面
+  const handleGoToItems = (record: ICategory) => {
+    navigate(`/system/category/item?categoryId=${record.id}&categoryName=${encodeURIComponent(record.name || '')}`);
+  };
+
+  return (
+    <>
+      <div className="mb-5">
+        <Title level={3}>{t('system.category.page.title')}</Title>
+        <Text type="secondary">{t('system.category.page.description')}</Text>
+      </div>
+      <XinTable<ICategory>
+        api="/system/category"
+        columns={columns}
+        rowKey="id"
+        accessName="system.category"
+        formProps={{
+          grid: true,
+          colProps: { span: 12 },
+          rowProps: { gutter: [30, 0] },
+          layout: 'vertical',
+        }}
+        modalProps={{ width: 600 }}
+        searchProps={false}
+        operateProps={{
+          fixed: 'right',
+          width: 180,
+        }}
+        scroll={{ x: 1000 }}
+        operateRender={(record, dom) => [
+          <Tooltip title={t('system.category.manageItems')} key="items">
+            <Button
+              type="default"
+              icon={<UnorderedListOutlined />}
+              size="small"
+              onClick={() => handleGoToItems(record)}
+            />
+          </Tooltip>,
+          dom.edit,
+          dom.del,
+        ]}
+      />
+    </>
+  );
+}