tab列表

zhoubichuan · Dec 16, 2023 · 5fe644b · 5fe644b
1 parent 85eed7c
commit 5fe644b
Show file tree

Hide file tree

Showing 13 changed files with 4,266 additions and 38 deletions.
diff --git a/config/routes.ts b/config/routes.ts
@@ -144,6 +144,19 @@
         path: '/list/table-list4',
         component: './list/table-list4',
       },
+      {
+        name: 'list10',
+        icon: 'smile',
+        path: '/list/tab',
+        redirect: '/list/tab/1',
+      },
+      {
+        name: '',
+        icon: 'smile',
+        path: '/list/tab/:id',
+        menuRender: false, // 不渲染菜单
+        component: './list/list',
+      },
       {
         name: 'list9',
         icon: 'smile',

diff --git a/src/locales/zh-CN/menu.ts b/src/locales/zh-CN/menu.ts
@@ -32,6 +32,7 @@ export default {
   'menu.list.list7': '字段列表',
   'menu.list.list8': '类型列表',
   'menu.list.list9': '后端列表',
+  'menu.list.list10': '项目列表',
   'menu.list.basic-list': '标准列表',
   'menu.list.card-list': '卡片列表',
   'menu.list.search-list': '搜索列表',

diff --git a/src/pages/list/list/index.tsx b/src/pages/list/list/index.tsx
@@ -15,6 +15,7 @@ import {
 import type { ProDescriptionsItemProps } from '@ant-design/pro-descriptions';
 import ProDescriptions from '@ant-design/pro-descriptions';
 import {
+  requestTabs,
   requestList,
   addList,
   updateList,
@@ -137,11 +138,12 @@ const TableList: React.FC = () => {
   );
   const [selectedRowsState, setSelectedRows] = useState<TableListItem[]>([]);
   const params: any = useParams();
+  const [tabs, setTabs] = useState<any>([]);
   const [templateData, setTemplateData] = useState<any>([]);
   const [options, setOptions] = useState<any[]>([]);
   const getTemplateData = async (key: string) => {
     let template: any = [];
-    if (path.includes('template') || path.includes('backend')) {
+    if (path.includes('template') || path.includes('backend') || path.includes('tab')) {
       template = await require(`../${path.split('/')[2]}/${key}.json`);
     } else {
       const result = await getTemplate(key, path.split('/')[2]);
@@ -160,6 +162,8 @@ const TableList: React.FC = () => {
       }
     }
     setTemplateData(template);
+    const tabsData = await requestTabs({});
+    setTabs(tabsData.data);
     if (location.href.includes('id')) {
       const arr = location.href.split('?id=');
       const id: string = arr[arr.length - 1];
@@ -349,40 +353,11 @@ const TableList: React.FC = () => {
         title: false,
         ghost: true,
       }}
-      tabList={[
-        {
-          tab: 'echarts',
-          key: '1',
-        },
-        {
-          tab: 'openlayers',
-          key: '2',
-        },
-        {
-          tab: 'cesium',
-          key: '3',
-        },
-        {
-          tab: 'web-vue',
-          key: '4',
-        },
-        {
-          tab: 'web-elementui',
-          key: '5',
-        },
-        {
-          tab: 'web-react',
-          key: '6',
-        },
-        {
-          tab: 'web-antd',
-          key: '7',
-        },
-        {
-          tab: '列表8',
-          key: '8',
-        },
-      ]}
+      tabList={
+        location.pathname.includes('tab')
+          ? []
+          : tabs.reverse().map((item: any) => ({ tab: item.name, key: item.type }))
+      }
       tabActiveKey={tabActiveKey}
     >
       <ProTable<TableListItem, TableListPagination>

diff --git a/src/pages/list/list/service.ts b/src/pages/list/list/service.ts
@@ -8,8 +8,6 @@ export async function getTemplate(key: string, type: string) {
   }>('/api/list/template/' + key, {
     method: 'GET',
     params: {
-      current: '1',
-      pageSize: '20',
       type: type,
     },
   });
@@ -33,7 +31,25 @@ export async function requestList(
     ...(options || {}),
   });
 }
-
+export async function requestTabs(
+  params: {
+    current?: number;
+    pageSize?: number;
+  },
+  options?: {},
+) {
+  return request<{
+    data: TableListItem[];
+    total?: number;
+    success?: boolean;
+  }>('/api/list/tab/' + location.pathname.split('/')[location.pathname.split('/').length - 1], {
+    method: 'GET',
+    params: {
+      ...params,
+    },
+    ...(options || {}),
+  });
+}
 export async function updateList(options?: { [key: string]: any }) {
   return request<TableListItem>('/api' + location.pathname.replace('/antdpro-demo', ''), {
     method: 'PUT',

diff --git a/src/pages/list/tab/1.json b/src/pages/list/tab/1.json
@@ -0,0 +1,173 @@
+[
+  {
+    "type": "data",
+    "title": "编号",
+    "dataIndex": "id",
+    "search": {},
+    "table": {},
+    "create": {},
+    "edit": {
+      "disabled": true,
+      "colProps": {
+        "span": 24
+      }
+    },
+    "view": {
+      "type": "text"
+    }
+  },
+  {
+    "title": "名称",
+    "dataIndex": "name",
+    "search": {
+      "type": "text",
+      "width": 260
+    },
+    "table": {
+      "type": "text",
+      "width": 100
+    },
+    "create": {
+      "rules": [
+        {
+          "required": true,
+          "message": "内容必填"
+        }
+      ],
+      "colProps": { "span": 24 }
+    },
+    "edit": {
+      "rules": [
+        {
+          "required": true,
+          "message": "内容必填"
+        }
+      ],
+      "colProps": { "span": 24 }
+    },
+    "view": {
+      "type": "text"
+    }
+  },
+  {
+    "title": "类型编号",
+    "dataIndex": "type",
+    "search": {
+      "type": "text",
+      "width": 260
+    },
+    "table": {
+      "type": "text",
+      "width": 100
+    },
+    "create": {
+      "rules": [
+        {
+          "required": true,
+          "message": "内容必填"
+        }
+      ],
+      "colProps": { "span": 24 }
+    },
+    "edit": {
+      "rules": [
+        {
+          "required": true,
+          "message": "内容必填"
+        }
+      ],
+      "colProps": { "span": 24 }
+    },
+    "view": {
+      "type": "text"
+    }
+  },
+  {
+    "title": "默认值",
+    "dataIndex": "addDefault",
+    "table": {
+      "type": "text",
+      "width": 260
+    },
+    "create": {
+      "rules": [
+        {
+          "required": false,
+          "message": "设置字段的默认值"
+        }
+      ],
+      "colProps": { "span": 24 }
+    },
+    "edit": {
+      "rules": [
+        {
+          "required": false,
+          "message": "修改字段的默认值"
+        }
+      ],
+      "colProps": { "span": 24 }
+    },
+    "view": {
+      "type": "text"
+    }
+  },
+  {
+    "title": "备注",
+    "dataIndex": "remark",
+    "table": {
+      "type": "text",
+      "width": 260
+    },
+    "create": {
+      "type": "textArea",
+      "rules": [
+        {
+          "required": false,
+          "message": "设置字段的备注信息"
+        }
+      ],
+      "colProps": { "span": 24 }
+    },
+    "edit": {
+      "type": "textArea",
+      "rules": [
+        {
+          "required": false,
+          "message": "修改字段的备注信息"
+        }
+      ],
+      "colProps": { "span": 24 }
+    },
+    "view": {
+      "type": "textArea"
+    }
+  },
+  {
+    "title": "创建时间",
+    "dataIndex": "createdAt",
+    "table": {
+      "type": "time",
+      "width": 100
+    },
+    "create": false,
+    "edit": false,
+    "view": {
+      "type": "time",
+      "width": 100
+    }
+  },
+  {
+    "title": "更新时间",
+    "dataIndex": "updatedAt",
+    "table": {
+      "type": "time",
+      "width": 100
+    },
+    "create": false,
+    "edit": false,
+    "view": {
+      "type": "time",
+      "width": 100
+    }
+  }
+]