From cbe7ee22eef19c9b913605070f76cd421ec44e13 Mon Sep 17 00:00:00 2001
From: JackySoft <sunnyboysoft@163.com>
Date: Wed, 28 Aug 2024 17:18:19 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8DLoading=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/editor/src/pages/home/LibList.tsx     |  4 ++--
 packages/editor/src/pages/home/PageList.tsx    |  2 +-
 packages/editor/src/pages/home/ProjectList.tsx |  3 +--
 packages/editor/src/router/LazyLoad.tsx        |  7 +++++--
 packages/editor/src/router/index.tsx           | 10 ++++++++--
 5 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/packages/editor/src/pages/home/LibList.tsx b/packages/editor/src/pages/home/LibList.tsx
index 925aaa1..e712a08 100644
--- a/packages/editor/src/pages/home/LibList.tsx
+++ b/packages/editor/src/pages/home/LibList.tsx
@@ -15,7 +15,7 @@ import style from './index.module.less';
 export default () => {
   const [form] = Form.useForm();
   const [list, setList] = useState<any[]>([]);
-  const [loading, setLoading] = useState(false);
+  const [loading, setLoading] = useState(true);
   const [total, setTotal] = useState<number>(0);
   const [current, setCurrent] = useState<number>(1);
   const [pageSize, setPageSize] = useState<number>(10);
@@ -101,7 +101,7 @@ export default () => {
 
   return (
     <div className={style.libWrap}>
-      {total > 0 ? (
+      {total > 0 || loading ? (
         <>
           <SearchBar form={form} from="组件" submit={handleSearch} refresh={getList} onCreate={handleCreate} />
           <div className={style.libList}>
diff --git a/packages/editor/src/pages/home/PageList.tsx b/packages/editor/src/pages/home/PageList.tsx
index afc3e23..a8e784f 100644
--- a/packages/editor/src/pages/home/PageList.tsx
+++ b/packages/editor/src/pages/home/PageList.tsx
@@ -167,7 +167,7 @@ export default function Index() {
   return (
     <>
       <Layout.Content className={styles.pageList}>
-        {total > 0 ? (
+        {total > 0 || loading ? (
           <>
             <SearchBar form={form} from="页面" submit={handleSearch} refresh={getList} onCreate={handleCreate} />
             <div className={styles.pagesContent}>
diff --git a/packages/editor/src/pages/home/ProjectList.tsx b/packages/editor/src/pages/home/ProjectList.tsx
index e104579..800dd7d 100644
--- a/packages/editor/src/pages/home/ProjectList.tsx
+++ b/packages/editor/src/pages/home/ProjectList.tsx
@@ -19,7 +19,6 @@ export default function Index() {
   const [form] = Form.useForm();
   const [loading, setLoading] = useState(true);
   const [projectList, setProjectList] = useState<Project.ProjectItem[]>([]);
-  const [projectId, setProjectId] = useState(-1);
   const [total, setTotal] = useState<number>(0);
   const [current, setCurrent] = useState<number>(1);
   const [pageSize, setPageSize] = useState<number>(12);
@@ -166,7 +165,7 @@ export default function Index() {
   return (
     <>
       <Layout.Content className={styles.project}>
-        {total > 0 ? (
+        {total > 0 || loading ? (
           <>
             <SearchBar form={form} from="项目" submit={handleSearch} refresh={getList} onCreate={() => navigate('/project/0/config')} />
             <div className={styles.projectList}>
diff --git a/packages/editor/src/router/LazyLoad.tsx b/packages/editor/src/router/LazyLoad.tsx
index 15c7916..7e10d65 100644
--- a/packages/editor/src/router/LazyLoad.tsx
+++ b/packages/editor/src/router/LazyLoad.tsx
@@ -5,9 +5,12 @@ import { Spin } from 'antd';
  * @param Component 组件对象
  * @returns 返回新组件
  */
-export const lazyLoad = (Component: React.FC): React.ReactNode => {
+export const lazyLoad = (Component: React.FC, isEditor?: boolean): React.ReactNode => {
+  // 编辑器组件由于比较慢，增加一个Loading效果
   return (
-    <Suspense fallback={<Spin size="large" style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', height: '100%' }} />}>
+    <Suspense
+      fallback={isEditor ? <Spin size="large" style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', marginTop: 30 }} /> : null}
+    >
       <Component />
     </Suspense>
   );
diff --git a/packages/editor/src/router/index.tsx b/packages/editor/src/router/index.tsx
index 9f47cc5..71aade2 100644
--- a/packages/editor/src/router/index.tsx
+++ b/packages/editor/src/router/index.tsx
@@ -64,11 +64,17 @@ export const router = [
       },
       {
         path: '/editor/:id',
-        element: lazyLoad(React.lazy(() => import('@/layout/EditLayout'))),
+        element: lazyLoad(
+          React.lazy(() => import('@/layout/EditLayout')),
+          true,
+        ),
         children: [
           {
             path: '/editor/:id/edit',
-            element: lazyLoad(React.lazy(() => import('@/pages/editor/editor'))),
+            element: lazyLoad(
+              React.lazy(() => import('@/pages/editor/editor')),
+              true,
+            ),
           },
         ],
       },