fix(style): layout content padding

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={{

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}>

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={[]}
       >

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>

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={[]}

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) {

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={[]}

src/pages/llmodels/index.tsx

@@ -280,6 +280,7 @@ const Models: React.FC = () => {
         setCatalogList(resultList || []);
       } catch (error) {
         // ignore
+        setCatalogList([]);
       }
     };
     getCataLogList();

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()}

src/pages/playground/images.tsx

@@ -168,6 +168,9 @@ const TextToImages: React.FC = () => {
             }
           </div>
         ),
+        style: {
+          paddingInline: 'var(--layout-content-inlinepadding)'
+        },
         breadcrumb: {}
       }}
       extra={renderExtra()}

src/pages/playground/index.tsx

@@ -165,6 +165,9 @@ const Playground: React.FC = () => {
             }
           </div>
         ),
+        style: {
+          paddingInline: 'var(--layout-content-inlinepadding)'
+        },
         breadcrumb: {}
       }}
       extra={renderExtra()}

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()}

src/pages/playground/speech.tsx

@@ -211,6 +211,9 @@ const Playground: React.FC = () => {
             }
           </div>
         ),
+        style: {
+          paddingInline: 'var(--layout-content-inlinepadding)'
+        },
         breadcrumb: {}
       }}
       extra={renderExtra()}

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={[]}
     >

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>
     </>
   );
 };

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>

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={[]}
       >