perf: 加载默认值

src/store/modules/home/home.js

@@ -13,23 +13,23 @@ const state = () => ({
         summary: [
             {
                 label: '今日访客数',
-                value: 1526,
+                value: '-',
                 icon: customer,
             },
             {
                 label: '今日订单数',
-                value: 200,
+                value: '-',
                 icon: order,
             },
             {
                 label: '今日销售额',
-                value: 5000,
+                value: '-',
                 icon: sales,
                 type: 'money',
             },
             {
                 label: '近7天销售总额',
-                value: 50000,
+                value: '-',
                 icon: sales2,
                 type: 'money',
             },
@@ -37,7 +37,7 @@ const state = () => ({
         order: [
             {
                 label: '待付款订单',
-                value: '10',
+                value: '-',
                 route: {
                     name: 'OrderManagement',
                     query: {
@@ -47,7 +47,7 @@ const state = () => ({
             },
             {
                 label: '待发货订单',
-                value: '10',
+                value: '-',
                 route: {
                     name: 'OrderManagement',
                     query: {
@@ -57,7 +57,7 @@ const state = () => ({
             },
             {
                 label: '已发货订单',
-                value: '10',
+                value: '-',
                 route: {
                     name: 'OrderManagement',
                     query: {
@@ -67,7 +67,7 @@ const state = () => ({
             },
             {
                 label: '待处理退款申请',
-                value: '10',
+                value: '-',
                 route: {
                     name: 'ServiceApplication',
                     query: {
@@ -77,7 +77,7 @@ const state = () => ({
             },
             {
                 label: '待确认退货订单',
-                value: '10',
+                value: '-',
                 route: {
                     name: 'ServiceApplication',
                     query: {
@@ -129,84 +129,66 @@ const state = () => ({
         product: [
             {
                 label: '已上架',
-                value: 100,
+                value: '-',
             },
             {
                 label: '未上架',
-                value: 400,
+                value: '-',
             },
             {
                 label: '库存紧张',
-                value: 50,
+                value: '-',
             },
             {
                 label: '全部商品',
-                value: 500,
+                value: '-',
             },
         ],
         customer: [
             {
                 label: '今日新增',
-                value: 100,
+                value: '-',
             },
             {
                 label: '昨日新添',
-                value: 200,
+                value: '-',
             },
             {
                 label: '本月新增',
-                value: 1000,
+                value: '-',
             },
             {
                 label: '用户总数',
-                value: 5000,
+                value: '-',
             },
         ],
         chart: [
             {
                 info: {
-                    monthUpsOrDownsScale: 0,
+                    monthUpsOrDownsScale: '-',
-                    monthVisitor: 0,
+                    monthVisitor: '-',
-                    weekUpsOrDownsScale: 0,
+                    weekUpsOrDownsScale: '-',
-                    weekVisitor: 0,
+                    weekVisitor: '-',
                 },
-                data: [
+                data: [],
-                    { label: '1月', value: 152 },
-                    { label: '2月', value: 215 },
-                    { label: '3月', value: 198 },
-                    { label: '4月', value: 348 },
-                    { label: '5月', value: 111 },
-                ],
             },
             {
                 info: {
-                    monthUpsOrDownsScale: 0,
+                    monthUpsOrDownsScale: '-',
-                    monthOrder: 0,
+                    monthOrder: '-',
-                    weekUpsOrDownsScale: 0,
+                    weekUpsOrDownsScale: '-',
-                    weekOrder: 0,
+                    weekOrder: '-',
                 },
-                data: [
+                data: [],
-                    { label: '1月', value: 152 },
-                    { label: '2月', value: 215 },
-                    { label: '3月', value: 198 },
-                    { label: '4月', value: 348 },
-                    { label: '5月', value: 111 },
-                ],
             },
             {
                 info: {
-                    monthUpsOrDownsScale: 0,
+                    monthUpsOrDownsScale: '-',
-                    monthSales: 0,
+                    monthSales: '-',
-                    weekUpsOrDownsScale: 0,
+                    weekUpsOrDownsScale: '-',
-                    weekSales: 0,
+                    weekSales: '-',
                 },
-                data: [
+                data: [],
-                    { label: '1月', value: 152 },
-                    { label: '2月', value: 215 },
-                    { label: '3月', value: 198 },
-                    { label: '4月', value: 348 },
-                    { label: '5月', value: 111 },
-                ],
             },
         ],
     },

src/views/home/index.vue

@@ -229,13 +229,16 @@
         }
     });
     const handleValue = (item) => {
-        let res = new Number(item.value).toLocaleString();
+        let res = item.value;
-        if (item.type === 'money') {
+        if (res !== '-') {
-            res = '￥' + res;
+            res = new Number(item.value).toLocaleString();
+            if (item.type === 'money') {
+                res = '￥' + res;
+            }
         }
         return res;
     };
-    const handleRate = (num) => new Number(Math.abs(num || 0)).toFixed(2) + '%';
+    const handleRate = (num) => (num === '--' ? num : new Number(Math.abs(num || 0)).toFixed(2) + '%');
 
     const handleRoute = (route) => router.push(route);
     const charts = ref({});