From f91311144b4dbd651a40aea1c4c4167bb87ff860 Mon Sep 17 00:00:00 2001
From: jialin <jialinkuang@126.com>
Date: Mon, 24 Feb 2025 14:10:00 +0800
Subject: [PATCH] fix(style): layout content padding

---
 src/layouts/index.tsx                         |  4 +++
 src/pages/access/index.tsx                    |  5 +++-
 src/pages/api-keys/index.tsx                  |  5 +++-
 src/pages/dashboard/index.tsx                 | 10 ++++++-
 src/pages/llmodels/catalog.tsx                |  3 +++
 .../llmodels/components/instance-item.tsx     | 18 +++++++++++++
 src/pages/llmodels/components/table-list.tsx  |  3 +++
 src/pages/llmodels/index.tsx                  |  1 +
 src/pages/playground/embedding.tsx            |  3 +++
 src/pages/playground/images.tsx               |  3 +++
 src/pages/playground/index.tsx                |  3 +++
 src/pages/playground/rerank.tsx               |  3 +++
 src/pages/playground/speech.tsx               |  3 +++
 src/pages/profile/index.tsx                   |  5 +++-
 src/pages/resources/index.tsx                 | 27 ++++++++++---------
 src/pages/usage/index.tsx                     | 10 ++++++-
 src/pages/users/index.tsx                     |  5 +++-
 17 files changed, 92 insertions(+), 19 deletions(-)

diff --git a/src/layouts/index.tsx b/src/layouts/index.tsx
index 9cf79998..7bb11c9e 100644
--- a/src/layouts/index.tsx
+++ b/src/layouts/index.tsx
@@ -291,6 +291,10 @@ export default (props: any) => {
         title={userConfig.title}
         navTheme="light"
         layout="side"
+        contentStyle={{
+          paddingBlock: 0,
+          paddingInline: 0
+        }}
         openKeys={false}
         disableMobile={true}
         header={{
diff --git a/src/pages/access/index.tsx b/src/pages/access/index.tsx
index 16faee1a..db253a75 100644
--- a/src/pages/access/index.tsx
+++ b/src/pages/access/index.tsx
@@ -8,7 +8,10 @@ const AccessPage: React.FC = () => {
     <PageContainer
       ghost
       header={{
-        title: 'permission example'
+        title: 'permission example',
+        style: {
+          paddingInline: 'var(--layout-content-inlinepadding)'
+        }
       }}
     >
       <Access accessible={access.canSeeAdmin}>
diff --git a/src/pages/api-keys/index.tsx b/src/pages/api-keys/index.tsx
index 820e49c4..1adf95b6 100644
--- a/src/pages/api-keys/index.tsx
+++ b/src/pages/api-keys/index.tsx
@@ -182,7 +182,10 @@ const APIKeys: React.FC = () => {
       <PageContainer
         ghost
         header={{
-          title: intl.formatMessage({ id: 'apikeys.title' })
+          title: intl.formatMessage({ id: 'apikeys.title' }),
+          style: {
+            paddingInline: 'var(--layout-content-inlinepadding)'
+          }
         }}
         extra={[]}
       >
diff --git a/src/pages/dashboard/index.tsx b/src/pages/dashboard/index.tsx
index 99d9719c..2e4ab311 100644
--- a/src/pages/dashboard/index.tsx
+++ b/src/pages/dashboard/index.tsx
@@ -8,7 +8,15 @@ const Dashboard: React.FC = () => {
 
   return (
     <>
-      <PageContainer ghost extra={[]}>
+      <PageContainer
+        ghost
+        extra={[]}
+        header={{
+          style: {
+            paddingInline: 'var(--layout-content-inlinepadding)'
+          }
+        }}
+      >
         <Spin spinning={loading}>
           <DashboardInner setLoading={setLoading} />
         </Spin>
diff --git a/src/pages/llmodels/catalog.tsx b/src/pages/llmodels/catalog.tsx
index d6f2e158..d486a4c3 100644
--- a/src/pages/llmodels/catalog.tsx
+++ b/src/pages/llmodels/catalog.tsx
@@ -208,6 +208,9 @@ const Catalog: React.FC = () => {
       ghost
       header={{
         title: intl.formatMessage({ id: 'menu.modelCatalog' }),
+        style: {
+          paddingInline: 'var(--layout-content-inlinepadding)'
+        },
         breadcrumb: {}
       }}
       extra={[]}
diff --git a/src/pages/llmodels/components/instance-item.tsx b/src/pages/llmodels/components/instance-item.tsx
index 05fb1a4f..88f7a142 100644
--- a/src/pages/llmodels/components/instance-item.tsx
+++ b/src/pages/llmodels/components/instance-item.tsx
@@ -75,6 +75,24 @@ const InstanceItem: React.FC<InstanceItemProps> = ({
 }) => {
   const intl = useIntl();
 
+  const distributeCols = [
+    {
+      title: 'Worker',
+      key: 'worker_name'
+    },
+    {
+      title: 'IP',
+      key: 'worker_ip',
+      render: ({ row }: { row: ModelInstanceListItem }) => {
+        return row.port ? `${row.worker_ip}:${row.port}` : row.worker_ip;
+      }
+    },
+    {
+      title: intl.formatMessage({ id: 'models.table.gpuindex' }),
+      key: 'gpu_index'
+    }
+  ];
+
   const renderWorkerInfo = (item: ModelInstanceListItem) => {
     let workerIp = '-';
     if (item.worker_ip) {
diff --git a/src/pages/llmodels/components/table-list.tsx b/src/pages/llmodels/components/table-list.tsx
index 68e08d15..454fb988 100644
--- a/src/pages/llmodels/components/table-list.tsx
+++ b/src/pages/llmodels/components/table-list.tsx
@@ -835,6 +835,9 @@ const Models: React.FC<ModelsProps> = ({
         ghost
         header={{
           title: intl.formatMessage({ id: 'models.title' }),
+          style: {
+            paddingInline: 'var(--layout-content-inlinepadding)'
+          },
           breadcrumb: {}
         }}
         extra={[]}
diff --git a/src/pages/llmodels/index.tsx b/src/pages/llmodels/index.tsx
index 701f4682..9c4b4a22 100644
--- a/src/pages/llmodels/index.tsx
+++ b/src/pages/llmodels/index.tsx
@@ -280,6 +280,7 @@ const Models: React.FC = () => {
         setCatalogList(resultList || []);
       } catch (error) {
         // ignore
+        setCatalogList([]);
       }
     };
     getCataLogList();
diff --git a/src/pages/playground/embedding.tsx b/src/pages/playground/embedding.tsx
index f2dbda64..1cd67647 100644
--- a/src/pages/playground/embedding.tsx
+++ b/src/pages/playground/embedding.tsx
@@ -98,6 +98,9 @@ const PlaygroundEmbedding: React.FC = () => {
       ghost
       header={{
         title: intl.formatMessage({ id: 'menu.playground.embedding' }),
+        style: {
+          paddingInline: 'var(--layout-content-inlinepadding)'
+        },
         breadcrumb: {}
       }}
       extra={renderExtra()}
diff --git a/src/pages/playground/images.tsx b/src/pages/playground/images.tsx
index 314bb5c6..3eaa5285 100644
--- a/src/pages/playground/images.tsx
+++ b/src/pages/playground/images.tsx
@@ -168,6 +168,9 @@ const TextToImages: React.FC = () => {
             }
           </div>
         ),
+        style: {
+          paddingInline: 'var(--layout-content-inlinepadding)'
+        },
         breadcrumb: {}
       }}
       extra={renderExtra()}
diff --git a/src/pages/playground/index.tsx b/src/pages/playground/index.tsx
index b7b3dee6..c1e7dc57 100644
--- a/src/pages/playground/index.tsx
+++ b/src/pages/playground/index.tsx
@@ -165,6 +165,9 @@ const Playground: React.FC = () => {
             }
           </div>
         ),
+        style: {
+          paddingInline: 'var(--layout-content-inlinepadding)'
+        },
         breadcrumb: {}
       }}
       extra={renderExtra()}
diff --git a/src/pages/playground/rerank.tsx b/src/pages/playground/rerank.tsx
index c09a59c8..f705b075 100644
--- a/src/pages/playground/rerank.tsx
+++ b/src/pages/playground/rerank.tsx
@@ -102,6 +102,9 @@ const PlaygroundRerank: React.FC = () => {
       ghost
       header={{
         title: intl.formatMessage({ id: 'menu.playground.rerank' }),
+        style: {
+          paddingInline: 'var(--layout-content-inlinepadding)'
+        },
         breadcrumb: {}
       }}
       extra={renderExtra()}
diff --git a/src/pages/playground/speech.tsx b/src/pages/playground/speech.tsx
index 501578ac..b7cf5d16 100644
--- a/src/pages/playground/speech.tsx
+++ b/src/pages/playground/speech.tsx
@@ -211,6 +211,9 @@ const Playground: React.FC = () => {
             }
           </div>
         ),
+        style: {
+          paddingInline: 'var(--layout-content-inlinepadding)'
+        },
         breadcrumb: {}
       }}
       extra={renderExtra()}
diff --git a/src/pages/profile/index.tsx b/src/pages/profile/index.tsx
index e04833b2..4ea156b3 100644
--- a/src/pages/profile/index.tsx
+++ b/src/pages/profile/index.tsx
@@ -37,7 +37,10 @@ const Profile: React.FC = () => {
     <PageContainer
       ghost
       header={{
-        title: intl.formatMessage({ id: 'users.form.updatepassword' })
+        title: intl.formatMessage({ id: 'users.form.updatepassword' }),
+        style: {
+          paddingInline: 'var(--layout-content-inlinepadding)'
+        }
       }}
       extra={[]}
     >
diff --git a/src/pages/resources/index.tsx b/src/pages/resources/index.tsx
index 6b2b2680..2c334243 100644
--- a/src/pages/resources/index.tsx
+++ b/src/pages/resources/index.tsx
@@ -1,7 +1,6 @@
 import { PageContainer } from '@ant-design/pro-components';
 import { useIntl } from '@umijs/max';
 import type { TabsProps } from 'antd';
-import { Tabs } from 'antd';
 import { useCallback, useState } from 'react';
 import GPUs from './components/gpus';
 import Workers from './components/workers';
@@ -32,20 +31,22 @@ const Resources = () => {
       <PageContainer
         ghost
         header={{
-          title: intl.formatMessage({ id: 'resources.title' })
+          title: intl.formatMessage({ id: 'resources.title' }),
+          style: {
+            paddingInline: 'var(--layout-content-inlinepadding)'
+          }
+        }}
+        tabList={items}
+        onTabChange={handleChangeTab}
+        tabActiveKey={activeKey}
+        tabProps={{
+          type: 'card',
+          style: {
+            marginTop: 78
+          }
         }}
         extra={[]}
-      >
-        <div style={{ marginTop: 30 }}>
-          <Tabs
-            type="card"
-            defaultActiveKey="workers"
-            items={items}
-            accessKey={activeKey}
-            onChange={handleChangeTab}
-          ></Tabs>
-        </div>
-      </PageContainer>
+      ></PageContainer>
     </>
   );
 };
diff --git a/src/pages/usage/index.tsx b/src/pages/usage/index.tsx
index 99d9719c..2e4ab311 100644
--- a/src/pages/usage/index.tsx
+++ b/src/pages/usage/index.tsx
@@ -8,7 +8,15 @@ const Dashboard: React.FC = () => {
 
   return (
     <>
-      <PageContainer ghost extra={[]}>
+      <PageContainer
+        ghost
+        extra={[]}
+        header={{
+          style: {
+            paddingInline: 'var(--layout-content-inlinepadding)'
+          }
+        }}
+      >
         <Spin spinning={loading}>
           <DashboardInner setLoading={setLoading} />
         </Spin>
diff --git a/src/pages/users/index.tsx b/src/pages/users/index.tsx
index d9723306..a9a83bd4 100644
--- a/src/pages/users/index.tsx
+++ b/src/pages/users/index.tsx
@@ -242,7 +242,10 @@ const Users: React.FC = () => {
       <PageContainer
         ghost
         header={{
-          title: intl.formatMessage({ id: 'users.title' })
+          title: intl.formatMessage({ id: 'users.title' }),
+          style: {
+            paddingInline: 'var(--layout-content-inlinepadding)'
+          }
         }}
         extra={[]}
       >