From fa828fd972efeea87f364be76a1139ae53ec20d8 Mon Sep 17 00:00:00 2001
From: Vben <anncwb@126.com>
Date: Fri, 11 Jun 2021 23:09:03 +0800
Subject: [PATCH] fix(flow-chart): fix drag and drop menu loss

---
 CHANGELOG.zh_CN.md                            |  1 +
 package.json                                  |  8 ++--
 src/components/Drawer/src/BasicDrawer.vue     |  2 +-
 src/components/FlowChart/src/FlowChart.vue    | 20 +++++----
 src/components/FlowChart/src/config.ts        | 41 +++++++++++++++++++
 src/components/Loading/src/Loading.vue        |  2 -
 src/components/Loading/src/createLoading.ts   |  4 +-
 .../Loading/src/{types.ts => typing.ts}       |  0
 src/components/Loading/src/useLoading.ts      |  2 +-
 src/components/Modal/src/BasicModal.vue       |  2 +-
 src/components/Page/index.ts                  |  9 +++-
 src/components/Page/src/PageFooter.vue        |  1 -
 src/views/demo/comp/desc/index.vue            |  2 +-
 yarn.lock                                     | 32 +++++++--------
 14 files changed, 86 insertions(+), 40 deletions(-)
 rename src/components/Loading/src/{types.ts => typing.ts} (100%)

diff --git a/CHANGELOG.zh_CN.md b/CHANGELOG.zh_CN.md
index 48e42d89..425220c9 100644
--- a/CHANGELOG.zh_CN.md
+++ b/CHANGELOG.zh_CN.md
@@ -14,6 +14,7 @@
 
 - **Modal** 修复全屏高度计算错误
 - **PageWrapper** 修复高度计算问题
+- **FlowChart** 修复拖放菜单丢失
 - 修复后台模式下，Iframe 路由错误
 
 ## 2.4.2(2021-06-10)
diff --git a/package.json b/package.json
index 9b32301e..9df4545b 100644
--- a/package.json
+++ b/package.json
@@ -63,7 +63,7 @@
   "devDependencies": {
     "@commitlint/cli": "^12.1.4",
     "@commitlint/config-conventional": "^12.1.4",
-    "@iconify/json": "^1.1.354",
+    "@iconify/json": "^1.1.355",
     "@purge-icons/generated": "^0.7.0",
     "@types/codemirror": "^5.60.0",
     "@types/crypto-js": "^4.0.1",
@@ -91,7 +91,7 @@
     "eslint-config-prettier": "^8.3.0",
     "eslint-define-config": "^1.0.8",
     "eslint-plugin-prettier": "^3.4.0",
-    "eslint-plugin-vue": "^7.10.0",
+    "eslint-plugin-vue": "^7.11.0",
     "esno": "^0.7.1",
     "fs-extra": "^10.0.0",
     "http-server": "^0.12.3",
@@ -100,7 +100,7 @@
     "is-ci": "^3.0.0",
     "less": "^4.1.1",
     "lint-staged": "^11.0.0",
-    "postcss": "^8.3.1",
+    "postcss": "^8.3.2",
     "prettier": "^2.3.1",
     "pretty-quick": "^3.1.0",
     "rimraf": "^3.0.2",
@@ -128,7 +128,7 @@
   "resolutions": {
     "//": "Used to install imagemin dependencies, because imagemin may not be installed in China. If it is abroad, you can delete it",
     "bin-wrapper": "npm:bin-wrapper-china",
-    "rollup": "^2.51.1"
+    "rollup": "^2.51.2"
   },
   "repository": {
     "type": "git",
diff --git a/src/components/Drawer/src/BasicDrawer.vue b/src/components/Drawer/src/BasicDrawer.vue
index cf68d291..fe658ef4 100644
--- a/src/components/Drawer/src/BasicDrawer.vue
+++ b/src/components/Drawer/src/BasicDrawer.vue
@@ -163,7 +163,7 @@
 
       function setDrawerProps(props: Partial<DrawerProps>): void {
         // Keep the last setDrawerProps
-        propsRef.value = deepMerge(unref(propsRef), props);
+        propsRef.value = deepMerge(unref(propsRef) || ({} as any), props);
 
         if (Reflect.has(props, 'visible')) {
           visibleRef.value = !!props.visible;
diff --git a/src/components/FlowChart/src/FlowChart.vue b/src/components/FlowChart/src/FlowChart.vue
index 5739cf9b..8629b260 100644
--- a/src/components/FlowChart/src/FlowChart.vue
+++ b/src/components/FlowChart/src/FlowChart.vue
@@ -9,23 +9,20 @@
 </template>
 <script lang="ts">
   import type { Definition } from '@logicflow/core';
-
   import { defineComponent, ref, onMounted, unref, nextTick, computed, watch } from 'vue';
-
   import FlowChartToolbar from './FlowChartToolbar.vue';
   import LogicFlow from '@logicflow/core';
-  import { Snapshot, BpmnElement, Menu, DndPanel } from '@logicflow/extension';
-
+  import { Snapshot, BpmnElement, Menu, DndPanel, SelectionSelect } from '@logicflow/extension';
   import { useDesign } from '/@/hooks/web/useDesign';
   import { useAppStore } from '/@/store/modules/app';
   import { createFlowChartContext } from './useFlowContext';
-
   import { toLogicFlowData } from './adpterForTurbo';
   import { useModal, BasicModal } from '/@/components/Modal';
   import { JsonPreview } from '/@/components/CodeEditor';
-
+  import { configDefaultDndPanel } from './config';
   import '@logicflow/core/dist/style/index.css';
   import '@logicflow/extension/lib/style/index.css';
+
   export default defineComponent({
     name: 'FlowChart',
     components: { BasicModal, FlowChartToolbar, JsonPreview },
@@ -44,6 +41,9 @@
         type: Boolean,
         default: true,
       },
+      patternItems: {
+        type: Array,
+      },
     },
     setup(props) {
       const lfElRef = ref<ElRef>(null);
@@ -104,6 +104,7 @@
         if (!lfEl) {
           return;
         }
+        LogicFlow.use(DndPanel);
 
         // Canvas configuration
         LogicFlow.use(Snapshot);
@@ -111,14 +112,16 @@
         LogicFlow.use(BpmnElement);
         // Start the right-click menu
         LogicFlow.use(Menu);
-        LogicFlow.use(DndPanel);
+        LogicFlow.use(SelectionSelect);
 
         lfInstance.value = new LogicFlow({
           ...unref(getFlowOptions),
           container: lfEl,
         });
-        unref(lfInstance)?.setDefaultEdgeType('line');
+        const lf = unref(lfInstance)!;
+        lf?.setDefaultEdgeType('line');
         onRender();
+        lf?.setPatternItems(props.patternItems || configDefaultDndPanel(lf));
       }
 
       async function onRender() {
@@ -137,7 +140,6 @@
           return;
         }
         graphData.value = unref(lf).getGraphData();
-
         openModal();
       }
 
diff --git a/src/components/FlowChart/src/config.ts b/src/components/FlowChart/src/config.ts
index d98bf3f5..4f10d2ca 100644
--- a/src/components/FlowChart/src/config.ts
+++ b/src/components/FlowChart/src/config.ts
@@ -53,3 +53,44 @@ export const BpmnNode = [
     class: 'bpmn-user',
   },
 ];
+
+export function configDefaultDndPanel(lf) {
+  return [
+    {
+      text: '选区',
+      icon: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAAH6ji2bAAAABGdBTUEAALGPC/xhBQAAAOVJREFUOBGtVMENwzAIjKP++2026ETdpv10iy7WFbqFyyW6GBywLCv5gI+Dw2Bluj1znuSjhb99Gkn6QILDY2imo60p8nsnc9bEo3+QJ+AKHfMdZHnl78wyTnyHZD53Zzx73MRSgYvnqgCUHj6gwdck7Zsp1VOrz0Uz8NbKunzAW+Gu4fYW28bUYutYlzSa7B84Fh7d1kjLwhcSdYAYrdkMQVpsBr5XgDGuXwQfQr0y9zwLda+DUYXLaGKdd2ZTtvbolaO87pdo24hP7ov16N0zArH1ur3iwJpXxm+v7oAJNR4JEP8DoAuSFEkYH7cAAAAASUVORK5CYII=',
+      callback: () => {
+        lf.updateEditConfig({
+          stopMoveGraph: true,
+        });
+      },
+    },
+    {
+      type: 'circle',
+      text: '开始',
+      icon: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAAH6ji2bAAAABGdBTUEAALGPC/xhBQAAAnBJREFUOBGdVL1rU1EcPfdGBddmaZLiEhdx1MHZQXApraCzQ7GKLgoRBxMfcRELuihWKcXFRcEWF8HBf0DdDCKYRZpnl7p0svLe9Zzbd29eQhTbC8nv+9zf130AT63jvooOGS8Vf9Nt5zxba7sXQwODfkWpkbjTQfCGUd9gIp3uuPP8bZ946g56dYQvnBg+b1HB8VIQmMFrazKcKSvFW2dQTxJnJdQ77urmXWOMBCmXM2Rke4S7UAW+/8ywwFoewmBps2tu7mbTdp8VMOkIRAkKfrVawalJTtIliclFbaOBqa0M2xImHeVIfd/nKAfVq/LGnPss5Kh00VEdSzfwnBXPUpmykNss4lUI9C1ga+8PNrBD5YeqRY2Zz8PhjooIbfJXjowvQJBqkmEkVnktWhwu2SM7SMx7Cj0N9IC0oQXRo8xwAGzQms+xrB/nNSUWVveI48ayrFGyC2+E2C+aWrZHXvOuz+CiV6iycWe1Rd1Q6+QUG07nb5SbPrL4426d+9E1axKjY3AoRrlEeSQo2Eu0T6BWAAr6COhTcWjRaYfKG5csnvytvUr/WY4rrPMB53Uo7jZRjXaG6/CFfNMaXEu75nG47X+oepU7PKJvvzGDY1YLSKHJrK7vFUwXKkaxwhCW3u+sDFMVrIju54RYYbFKpALZAo7sB6wcKyyrd+aBMryMT2gPyD6GsQoRFkGHr14TthZni9ck0z+Pnmee460mHXbRAypKNy3nuMdrWgVKj8YVV8E7PSzp1BZ9SJnJAsXdryw/h5ctboUVi4AFiCd+lQaYMw5z3LGTBKjLQOeUF35k89f58Vv/tGh+l+PE/wG0rgfIUbZK5AAAAABJRU5ErkJggg==',
+    },
+    {
+      type: 'rect',
+      text: '用户任务',
+      icon: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAEFVwZaAAAABGdBTUEAALGPC/xhBQAAAqlJREFUOBF9VM9rE0EUfrMJNUKLihGbpLGtaCOIR8VjQMGDePCgCCIiCNqzCAp2MyYUCXhUtF5E0D+g1t48qAd7CCLqQUQKEWkStcEfVGlLdp/fm3aW2QQdyLzf33zz5m2IsAZ9XhDpyaaIZkTS4ASzK41TFao88GuJ3hsr2pAbipHxuSYyKRugagICGANkfFnNh3HeE2N0b3nN2cgnpcictw5veJIzxmDamSlxxQZicq/mflxhbaH8BLRbuRwNtZp0JAhoplVRUdzmCe/vO27wFuuA3S5qXruGdboy5/PRGFsbFGKo/haRtQHIrM83bVeTrOgNhZReWaYGnE4aUQgTJNvijJFF4jQ8BxJE5xfKatZWmZcTQ+BVgh7s8SgPlCkcec4mGTmieTP4xd7PcpIEg1TX6gdeLW8rTVMVLVvb7ctXoH0Cydl2QOPJBG21STE5OsnbweVYzAnD3A7PVILuY0yiiyDwSm2g441r6rMSgp6iK42yqroI2QoXeJVeA+YeZSa47gZdXaZWQKTrG93rukk/l2Al6Kzh5AZEl7dDQy+JjgFahQjRopSxPbrbvK7GRe9ePWBo1wcU7sYrFZtavXALwGw/7Dnc50urrHJuTPSoO2IMV3gUQGNg87IbSOIY9BpiT9HV7FCZ94nPXb3MSnwHn/FFFE1vG6DTby+r31KAkUktB3Qf6ikUPWxW1BkXSPQeMHHiW0+HAd2GelJsZz1OJegCxqzl+CLVHa/IibuHeJ1HAKzhuDR+ymNaRFM+4jU6UWKXorRmbyqkq/D76FffevwdCp+jN3UAN/C9JRVTDuOxC/oh+EdMnqIOrlYteKSfadVRGLJFJPSB/ti/6K8f0CNymg/iH2gO/f0DwE0yjAFO6l8JaR5j0VPwPwfaYHqOqrCI319WzwhwzNW/aQAAAABJRU5ErkJggg==',
+      cls: 'important-node',
+    },
+    {
+      type: 'rect',
+      text: '系统任务',
+      icon: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAEFVwZaAAAABGdBTUEAALGPC/xhBQAAAqlJREFUOBF9VM9rE0EUfrMJNUKLihGbpLGtaCOIR8VjQMGDePCgCCIiCNqzCAp2MyYUCXhUtF5E0D+g1t48qAd7CCLqQUQKEWkStcEfVGlLdp/fm3aW2QQdyLzf33zz5m2IsAZ9XhDpyaaIZkTS4ASzK41TFao88GuJ3hsr2pAbipHxuSYyKRugagICGANkfFnNh3HeE2N0b3nN2cgnpcictw5veJIzxmDamSlxxQZicq/mflxhbaH8BLRbuRwNtZp0JAhoplVRUdzmCe/vO27wFuuA3S5qXruGdboy5/PRGFsbFGKo/haRtQHIrM83bVeTrOgNhZReWaYGnE4aUQgTJNvijJFF4jQ8BxJE5xfKatZWmZcTQ+BVgh7s8SgPlCkcec4mGTmieTP4xd7PcpIEg1TX6gdeLW8rTVMVLVvb7ctXoH0Cydl2QOPJBG21STE5OsnbweVYzAnD3A7PVILuY0yiiyDwSm2g441r6rMSgp6iK42yqroI2QoXeJVeA+YeZSa47gZdXaZWQKTrG93rukk/l2Al6Kzh5AZEl7dDQy+JjgFahQjRopSxPbrbvK7GRe9ePWBo1wcU7sYrFZtavXALwGw/7Dnc50urrHJuTPSoO2IMV3gUQGNg87IbSOIY9BpiT9HV7FCZ94nPXb3MSnwHn/FFFE1vG6DTby+r31KAkUktB3Qf6ikUPWxW1BkXSPQeMHHiW0+HAd2GelJsZz1OJegCxqzl+CLVHa/IibuHeJ1HAKzhuDR+ymNaRFM+4jU6UWKXorRmbyqkq/D76FffevwdCp+jN3UAN/C9JRVTDuOxC/oh+EdMnqIOrlYteKSfadVRGLJFJPSB/ti/6K8f0CNymg/iH2gO/f0DwE0yjAFO6l8JaR5j0VPwPwfaYHqOqrCI319WzwhwzNW/aQAAAABJRU5ErkJggg==',
+      cls: 'import_icon',
+    },
+    {
+      type: 'diamond',
+      text: '条件判断',
+      icon: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAVCAYAAAHeEJUAAAAABGdBTUEAALGPC/xhBQAAAvVJREFUOBGNVEFrE0EU/mY3bQoiFlOkaUJrQUQoWMGePLX24EH0IIoHKQiCV0G8iE1covgLiqA/QTzVm1JPogc9tIJYFaQtlhQxqYjSpunu+L7JvmUTU3AgmTfvffPNN++9WSA1DO182f6xwILzD5btfAoQmwL5KJEwiQyVbSVZ0IgRyV6PTpIJ81E5ZvqfHQR0HUOBHW4L5Et2kQ6Zf7iAOhTFAA8s0pEP7AXO1uAA52SbqGk6h/6J45LaLhO64ByfcUzM39V7ZiAdS2yCePPEIQYvTUHqM/n7dgQNfBKWPjpF4ISk8q3J4nB11qw6X8l+FsF3EhlkEMfrjIer3wJTLwS2aCNcj4DbGxXTw00JmAuO+Ni6bBxVUCvS5d9aa04+so4pHW5jLTywuXAL7jJ+D06sl82Sgl2JuVBQn498zkc2bGKxULHjCnSMadBKYDYYHAtsby1EQ5lNGrQd4Y3v4Zo0XdGEmDno46yCM9Tk+RiJmUYHS/aXHPNTcjxcbTFna000PFJHIVZ5lFRqRpJWk9/+QtlOUYJj9HG5pVFEU7zqIYDVsw2s+AJaD8wTd2umgSCCyUxgGsS1Y6TBwXQQTFuZaHcd8gAGioE90hlsY+wMcs30RduYtxanjMGal8H5dMW67dmT1JFtYUEe8LiQLRsPZ6IIc7A4J5tqco3T0pnv/4u0kyzrYUq7gASuEyI8VXKvB9Odytv6jS/PNaZBln0nioJG/AVQRZvApOdhjj3Jt8QC8Im09SafwdBdvIpztpxWxpeKCC+EsFdS8DCyuCn2munFpL7ctHKp+Xc5cMybeIyMAN33SPL3ZR9QV1XVwLyzHm6Iv0/yeUuUb7PPlZC4D4HZkeu6dpF4v9j9MreGtMbxMMRLIcjJic9yHi7WQ3yVKzZVWUr5UrViJvn1FfUlwe/KYVfYyWRLSGNu16hR01U9IacajXPei0wx/5BqgInvJN+MMNtNme7ReU9SBbgntovn0kKHpFg7UogZvaZiOue/q1SBo9ktHzQAAAAASUVORK5CYII=',
+    },
+    {
+      type: 'circle',
+      text: '结束',
+      icon: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAAH6ji2bAAAABGdBTUEAALGPC/xhBQAAA1BJREFUOBFtVE1IVUEYPXOf+tq40Y3vPcmFIdSjIorWoRG0ERWUgnb5FwVhYQSl72oUoZAboxKNFtWiwKRN0M+jpfSzqJAQclHo001tKkjl3emc8V69igP3znzfnO/M9zcDcKT67azmjYWTwl9Vn7Vumeqzj1DVb6cleQY4oAVnIOPb+mKAGxQmKI5CWNJ2aLPatxWa3aB9K7/fB+/Z0jUF6TmMlFLQqrkECWQzOZxYGjTlOl8eeKaIY5yHnFn486xBustDjWT6dG7pmjHOJd+33t0iitTPkK6tEvjxq4h2MozQ6WFSX/LkDUGfFwfhEZj1Auz/U4pyAi5Sznd7uKzznXeVHlI/Aywmk6j7fsUsEuCGADrWARXXwjxWQsUbIupDHJI7kF5dRktg0eN81IbiZXiTESic50iwS+t1oJgL83jAiBupLDCQqwziaWSoAFSeIR3P5Xv5az00wyIn35QRYTwdSYbz8pH8fxUUAtxnFvYmEmgI0wYXUXcCCSpeEVpXlsRhBnCEATxWylL9+EKCAYhe1NGstUa6356kS9NVvt3DU2fd+Wtbm/+lSbylJqsqkSm9CRhvoJVlvKPvF1RKY/FcPn5j4UfIMLn8D4UYb54BNsilTDXKnF4CfTobA0FpoW/LSp306wkXM+XaOJhZaFkcNM82ASNAWMrhrUbRfmyeI1FvRBTpN06WKxa9BK0o2E4Pd3zfBBEwPsv9sQBnmLVbLEIZ/Xe9LYwJu/Er17W6HYVBc7vmuk0xUQ+pqxdom5Fnp55SiytXLPYoMXNM4u4SNSCFWnrVIzKG3EGyMXo6n/BQOe+bX3FClY4PwydVhthOZ9NnS+ntiLh0fxtlUJHAuGaFoVmttpVMeum0p3WEXbcll94l1wM/gZ0Ccczop77VvN2I7TlsZCsuXf1WHvWEhjO8DPtyOVg2/mvK9QqboEth+7pD6NUQC1HN/TwvydGBARi9MZSzLE4b8Ru3XhX2PBxf8E1er2A6516o0w4sIA+lwURhAON82Kwe2iDAC1Watq4XHaGQ7skLcFOtI5lDxuM2gZe6WFIotPAhbaeYlU4to5cuarF1QrcZ/lwrLaCJl66JBocYZnrNlvm2+MBCTmUymPrYZVbjdlr/BxlMjmNmNI3SAAAAAElFTkSuQmCC',
+    },
+  ];
+}
diff --git a/src/components/Loading/src/Loading.vue b/src/components/Loading/src/Loading.vue
index 9ad321ba..3a7407bc 100644
--- a/src/components/Loading/src/Loading.vue
+++ b/src/components/Loading/src/Loading.vue
@@ -5,10 +5,8 @@
 </template>
 <script lang="ts">
   import { PropType } from 'vue';
-
   import { defineComponent } from 'vue';
   import { Spin } from 'ant-design-vue';
-
   import { SizeEnum } from '/@/enums/sizeEnum';
 
   export default defineComponent({
diff --git a/src/components/Loading/src/createLoading.ts b/src/components/Loading/src/createLoading.ts
index 7724ab07..966ca53b 100644
--- a/src/components/Loading/src/createLoading.ts
+++ b/src/components/Loading/src/createLoading.ts
@@ -1,5 +1,5 @@
 import { VNode, defineComponent } from 'vue';
-import type { LoadingProps } from './types';
+import type { LoadingProps } from './typing';
 
 import { createVNode, render, reactive, h } from 'vue';
 import Loading from './Loading.vue';
@@ -20,8 +20,8 @@ export function createLoading(props?: Partial<LoadingProps>, target?: HTMLElemen
 
   vm = createVNode(LoadingWrap);
 
-  // TODO fix https://github.com/anncwb/vue-vben-admin/issues/438
   if (wait) {
+    // TODO fix https://github.com/anncwb/vue-vben-admin/issues/438
     setTimeout(() => {
       render(vm, document.createElement('div'));
     }, 0);
diff --git a/src/components/Loading/src/types.ts b/src/components/Loading/src/typing.ts
similarity index 100%
rename from src/components/Loading/src/types.ts
rename to src/components/Loading/src/typing.ts
diff --git a/src/components/Loading/src/useLoading.ts b/src/components/Loading/src/useLoading.ts
index 923513aa..0e61aecc 100644
--- a/src/components/Loading/src/useLoading.ts
+++ b/src/components/Loading/src/useLoading.ts
@@ -1,6 +1,6 @@
 import { unref } from 'vue';
 import { createLoading } from './createLoading';
-import type { LoadingProps } from './types';
+import type { LoadingProps } from './typing';
 import type { Ref } from 'vue';
 
 export interface UseLoadingOptions {
diff --git a/src/components/Modal/src/BasicModal.vue b/src/components/Modal/src/BasicModal.vue
index 800ceb9c..3b807649 100644
--- a/src/components/Modal/src/BasicModal.vue
+++ b/src/components/Modal/src/BasicModal.vue
@@ -186,7 +186,7 @@
        */
       function setModalProps(props: Partial<ModalProps>): void {
         // Keep the last setModalProps
-        propsRef.value = deepMerge(unref(propsRef), props);
+        propsRef.value = deepMerge(unref(propsRef) || ({} as any), props);
         if (!Reflect.has(props, 'visible')) return;
         visibleRef.value = !!props.visible;
       }
diff --git a/src/components/Page/index.ts b/src/components/Page/index.ts
index 571c434c..22e9b323 100644
--- a/src/components/Page/index.ts
+++ b/src/components/Page/index.ts
@@ -1,2 +1,7 @@
-export { default as PageFooter } from './src/PageFooter.vue';
-export { default as PageWrapper } from './src/PageWrapper.vue';
+import { withInstall } from '/@/utils';
+
+import pageFooter from './src/PageFooter.vue';
+import pageWrapper from './src/pageWrapper.vue';
+
+export const PageFooter = withInstall(pageFooter);
+export const PageWrapper = withInstall(pageWrapper);
diff --git a/src/components/Page/src/PageFooter.vue b/src/components/Page/src/PageFooter.vue
index 3209af93..0db3f743 100644
--- a/src/components/Page/src/PageFooter.vue
+++ b/src/components/Page/src/PageFooter.vue
@@ -11,7 +11,6 @@
 </template>
 <script lang="ts">
   import { defineComponent } from 'vue';
-
   import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
   import { useDesign } from '/@/hooks/web/useDesign';
 
diff --git a/src/views/demo/comp/desc/index.vue b/src/views/demo/comp/desc/index.vue
index 63398d40..28736a6f 100644
--- a/src/views/demo/comp/desc/index.vue
+++ b/src/views/demo/comp/desc/index.vue
@@ -30,7 +30,7 @@
   const mockData: Recordable = {
     username: 'test',
     nickName: 'VB',
-    age: 25,
+    age: '123',
     phone: '15695909xxx',
     email: '190848757@qq.com',
     addr: '厦门市思明区',
diff --git a/yarn.lock b/yarn.lock
index b8b4b3c4..3c391447 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1191,10 +1191,10 @@
   dependencies:
     cross-fetch "^3.0.6"
 
-"@iconify/json@^1.1.354":
-  version "1.1.354"
-  resolved "https://registry.npmjs.org/@iconify/json/-/json-1.1.354.tgz#a2024ba18a48931e46121413ea743cddd3638fa6"
-  integrity sha512-zFW5iV4FQmu/Mhn5fUNDtESLJFuQ8Mr9B0vBM2DmKbWJmTuMoF3sfV1w3tXMCvKFAXSTUcBTdXeEYP2rWnA8jA==
+"@iconify/json@^1.1.355":
+  version "1.1.355"
+  resolved "https://registry.npmjs.org/@iconify/json/-/json-1.1.355.tgz#cb2363653e4df6763e87e8716b3508eff0da3f1d"
+  integrity sha512-xHhdtI/YH8fFF/IG6YYs28Hi1SRr4ZzqRoi09wds7iX4cBvdP6RqnUxaxgiksSFSEAqF+8sZrhLDo3hkAT5v2w==
 
 "@intlify/core-base@9.1.6":
   version "9.1.6"
@@ -4284,10 +4284,10 @@ eslint-plugin-prettier@^3.4.0:
   dependencies:
     prettier-linter-helpers "^1.0.0"
 
-eslint-plugin-vue@^7.10.0:
-  version "7.10.0"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-vue/-/eslint-plugin-vue-7.10.0.tgz#251749aa99e089e085275f011042c6e74189f89a"
-  integrity sha512-xdr6e4t/L2moRAeEQ9HKgge/hFq+w9v5Dj+BA54nTAzSFdUyKLiSOdZaRQjCHMY0Pk2WaQBFH9QiWG60xiC+6A==
+eslint-plugin-vue@^7.11.0:
+  version "7.11.0"
+  resolved "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-7.11.0.tgz#c19b098899b7e3cd692beffbbe73611064ef1ea6"
+  integrity sha512-Qwo8wilqnOXnG9B5auEiTstyaHefyhHd5lEhhxemwXoWsAxIW2yppzuVudowC5n+qn1nMLNV9TANkTthBK7Waw==
   dependencies:
     eslint-utils "^2.1.0"
     natural-compare "^1.4.0"
@@ -8136,10 +8136,10 @@ postcss@^8.3.0:
     nanoid "^3.1.23"
     source-map-js "^0.6.2"
 
-postcss@^8.3.1:
-  version "8.3.1"
-  resolved "https://registry.npmjs.org/postcss/-/postcss-8.3.1.tgz#71f380151c227f83b898294a46481f689f86b70a"
-  integrity sha512-9qH0MGjsSm+fjxOi3GnwViL1otfi7qkj+l/WX5gcRGmZNGsIcqc+A5fBkE6PUobEQK4APqYVaES+B3Uti98TCw==
+postcss@^8.3.2:
+  version "8.3.2"
+  resolved "https://registry.npmjs.org/postcss/-/postcss-8.3.2.tgz#ed3ec489f5428af5740cd6effcc216b4d455ee64"
+  integrity sha512-y1FK/AWdZlBF5lusS5j5l4/vF67+vQZt1SXPVJ32y1kRGDQyrs1zk32hG1cInRTu14P0V+orPz+ifwW/7rR4bg==
   dependencies:
     colorette "^1.2.2"
     nanoid "^3.1.23"
@@ -8871,10 +8871,10 @@ rollup-plugin-visualizer@5.5.0:
     source-map "^0.7.3"
     yargs "^16.2.0"
 
-rollup@^2.38.5, rollup@^2.43.1, rollup@^2.45.2, rollup@^2.51.1:
-  version "2.51.1"
-  resolved "https://registry.npmjs.org/rollup/-/rollup-2.51.1.tgz#87bcd4095fe79b14c9bec0edc7ffa44e4827f793"
-  integrity sha512-8xfDbAtBleXotb6qKEHWuo/jkn94a9dVqGc7Rwl3sqspCVlnCfbRek7ldhCARSi7h32H0xR4QThm1t9zHN+3uw==
+rollup@^2.38.5, rollup@^2.43.1, rollup@^2.45.2, rollup@^2.51.2:
+  version "2.51.2"
+  resolved "https://registry.npmjs.org/rollup/-/rollup-2.51.2.tgz#6de71e28c833089a0bd745a09671a3e2b92af6b7"
+  integrity sha512-ReV2eGEadA7hmXSzjxdDKs10neqH2QURf2RxJ6ayAlq93ugy6qIvXMmbc5cWMGCDh1h5T4thuWO1e2VNbMq8FA==
   optionalDependencies:
     fsevents "~2.3.1"
 
-- 
GitLab