前端打包

web/pages/system/grid-nav/index.tsx

@@ -1,8 +1,11 @@
 import XinTable from '@/components/XinTable';
-import { Badge, Image, Typography } from 'antd';
+import { Badge, Image, Tag, Typography } from 'antd';
+import { useEffect, useState } from 'react';
 import type { IGridNav } from '@/domain/iGridNav';
+import type { ICategory } from '@/domain/iCategory';
 import type { XinTableColumn } from '@/components/XinTable/typings';
 import type { ISysFileInfo } from '@/domain/iSysFile';
+import { List } from '@/api/common/table';
 import { useTranslation } from 'react-i18next';
 import dayjs from 'dayjs';
 
@@ -22,6 +25,20 @@ function getImageUrl(image: ISysFileInfo | string | null | undefined): string {
 export default function GridNavPage() {
   const { t } = useTranslation();
 
+  // 分类下拉选项
+  const [categoryOptions, setCategoryOptions] = useState<{ label: string; value: number }[]>([]);
+  useEffect(() => {
+    List<ICategory>('/system/category', { pageSize: 1000 }).then((res) => {
+      const list = res.data?.data?.data ?? [];
+      setCategoryOptions(list.map((item) => ({
+        label: item.name,
+        value: item.id as number,
+      })));
+    }).catch(() => {
+      // 分类加载失败不影响页面使用
+    });
+  }, []);
+
   const columns: XinTableColumn<IGridNav>[] = [
     {
       title: t('system.gridNav.id'),
@@ -64,6 +81,25 @@ export default function GridNavPage() {
         );
       },
     },
+    {
+      title: t('system.gridNav.linkType'),
+      dataIndex: 'link_type',
+      valueType: 'select',
+      colProps: { span: 12 },
+      initialValue: 0,
+      rules: [{ required: true, message: t('system.gridNav.linkType.required') }],
+      fieldProps: {
+        options: [
+          { label: t('system.gridNav.linkType.link'), value: 0 },
+          { label: t('system.gridNav.linkType.category'), value: 1 },
+        ],
+      },
+      render: (value: number) => {
+        return value === 1
+          ? <Tag color="blue">{t('system.gridNav.linkType.category')}</Tag>
+          : <Tag>{t('system.gridNav.linkType.link')}</Tag>;
+      },
+    },
     {
       title: t('system.gridNav.link'),
       dataIndex: 'link',
@@ -73,6 +109,35 @@ export default function GridNavPage() {
       fieldProps: {
         placeholder: t('system.gridNav.link.placeholder'),
       },
+      render: (_, record) => {
+        if(record.link_type === 1) {
+          const name = record.category?.name;
+          return name ? <Tag>{name}</Tag> : '-';
+        }
+        return record.link || '-'
+      },
+      dependency: {
+        dependencies: ['link_type'],
+        visible: (values) => values.link_type !== 1,
+      },
+    },
+    {
+      title: t('system.carousel.category'),
+      dataIndex: 'category_id',
+      valueType: 'select',
+      colProps: { span: 12 },
+      hideInSearch: true,
+      hideInTable: true,
+      fieldProps: {
+        options: categoryOptions,
+        showSearch: true,
+        optionFilterProp: 'label',
+        placeholder: t('system.carousel.category.placeholder'),
+      },
+      dependency: {
+        dependencies: ['link_type'],
+        visible: (values) => values.link_type === 1,
+      },
     },
     {
       title: t('system.gridNav.status'),