feat(desc-page): add desc page demo

Author: anncwb

CHANGELOG.zh_CN.md

@@ -7,6 +7,7 @@
 - 新增可编辑行示例
 - 新增个人页
 - 新增表单页
+- 新增详情页
 
 ### 🎫 Chores
 

build/config/lessModifyVars.ts

@@ -11,8 +11,10 @@ const modifyVars = {
   'warning-color': '#EFBD47', //   Warning color
   'link-color': primaryColor, //   Link color
   'disabled-color': '#C2C2CC', //  Failure color
-  'heading-color': '#2C3A61', //  Title color
-  'text-color': '#2C3A61', //  Main text color
+  'heading-color': 'rgba(0, 0, 0, 0.85)', //  Title color
+  'text-color': 'rgba(0, 0, 0, 0.85)', //  Main text color
+  // 'heading-color': '#2C3A61', //  Title color
+  // 'text-color': '#2C3A61', //  Main text color
   'text-color-secondary ': '#606266', // Subtext color
   'background-color-base': '#F0F2F5', // background color
   'font-size-base': '14px', //  Main font size

index.html

@@ -62,7 +62,7 @@
         display: block;
         margin: 20px auto 0 0;
         font-size: 30px;
-        color: #2c3a61;
+        color: rgba(0, 0, 0, 0.85);
       }
     </style>
   </head>

public/resource/img/loading.svg

@@ -13,5 +13,8 @@ export function demoListApi(params: DemoParams) {
     url: Api.DEMO_LIST,
     method: 'GET',
     params,
+    headers: {
+      ignoreCancelToken: true,
+    },
   });
 }

src/api/demo/table.ts

@@ -31,6 +31,7 @@ import {
   Steps,
   PageHeader,
   Result,
+  Empty,
 } from 'ant-design-vue';
 import { getApp } from '/@/useApp';
 
@@ -75,5 +76,6 @@ export function registerGlobComp() {
     .use(Steps)
     .use(PageHeader)
     .use(Result)
+    .use(Empty)
     .use(Tabs);
 }

src/components/registerGlobComp.ts

@@ -7,6 +7,12 @@
   width: 100%;
 }
 
+.collapse-container__body {
+  > .ant-descriptions {
+    margin-left: 6px;
+  }
+}
+
 // .ant-form-item-label {
 //   text-align: unset;
 // }

src/design/ant/index.less

@@ -111,7 +111,7 @@
 // =================================
 
 // Main text color
-@text-color-base: #2c3a61;
+@text-color-base: @text-color;
 
 // Label color
 @text-color-call-out: #606266;

src/design/color.less

@@ -1,10 +1,3 @@
-/*
- * @description: Do not edit
- * @author: cxiaoting
- * @Date: 2020-11-13 14:00:37
- * @LastEditors: cxiaoting
- * @LastEditTime: 2020-11-13 18:07:11
- */
 import type { MenuModule } from '/@/router/types.d';
 const menu: MenuModule = {
   orderNo: 20,
@@ -36,6 +29,23 @@ const menu: MenuModule = {
           },
         ],
       },
+      {
+        path: 'desc',
+        name: '详情页',
+        tag: {
+          content: 'new',
+        },
+        children: [
+          {
+            path: 'basic',
+            name: '基础详情页',
+          },
+          {
+            path: 'high',
+            name: '高级详情页',
+          },
+        ],
+      },
       {
         path: 'result',
         name: '结果页',

src/router/menus/modules/demo/page.ts

@@ -51,6 +51,34 @@ const page: AppRouteModule = {
       ],
     },
     // =============================form end=============================
+    // =============================desc start=============================
+    {
+      path: '/desc',
+      name: 'DescPage',
+      redirect: '/page-demo/desc/basic',
+      meta: {
+        title: '详情页',
+      },
+      children: [
+        {
+          path: 'basic',
+          name: 'DescBasicPage',
+          component: () => import('/@/views/demo/page/desc/basic/index.vue'),
+          meta: {
+            title: '基础详情页',
+          },
+        },
+        {
+          path: 'high',
+          name: 'DescHighPage',
+          component: () => import('/@/views/demo/page/desc/high/index.vue'),
+          meta: {
+            title: '高级详情页',
+          },
+        },
+      ],
+    },
+    // =============================desc end=============================
 
     // =============================result start=============================
     {
@@ -81,6 +109,34 @@ const page: AppRouteModule = {
     },
     // =============================result end=============================
 
+    // =============================account start=============================
+    {
+      path: '/account',
+      name: 'AccountPage',
+      redirect: '/page-demo/account/setting',
+      meta: {
+        title: '个人页',
+      },
+      children: [
+        {
+          path: 'center',
+          name: 'AccountCenterPage',
+          component: () => import('/@/views/demo/page/account/center/index.vue'),
+          meta: {
+            title: '个人中心',
+          },
+        },
+        {
+          path: 'setting',
+          name: 'AccountSettingPage',
+          component: () => import('/@/views/demo/page/account/setting/index.vue'),
+          meta: {
+            title: '个人设置',
+          },
+        },
+      ],
+    },
+    // =============================account end=============================
     // =============================exception start=============================
     {
       path: '/exception',
@@ -153,35 +209,6 @@ const page: AppRouteModule = {
       ],
     },
     // =============================exception end=============================
-
-    // =============================account start=============================
-    {
-      path: '/account',
-      name: 'AccountPage',
-      redirect: '/page-demo/account/setting',
-      meta: {
-        title: '个人页',
-      },
-      children: [
-        {
-          path: 'center',
-          name: 'AccountCenterPage',
-          component: () => import('/@/views/demo/page/account/center/index.vue'),
-          meta: {
-            title: '个人中心',
-          },
-        },
-        {
-          path: 'setting',
-          name: 'AccountSettingPage',
-          component: () => import('/@/views/demo/page/account/setting/index.vue'),
-          meta: {
-            title: '个人设置',
-          },
-        },
-      ],
-    },
-    // =============================account end=============================
   ],
 };