refactor:界面重构、渲染逻辑重构

package-lock.json

@@ -16,7 +16,8 @@
         "pinia": "^2.2.4",
         "ts-node": "^10.9.2",
         "vue": "^3.2.25",
-        "vue-draggable-plus": "^0.5.3"
+        "vue-draggable-plus": "^0.5.3",
+        "vue-router": "^4.4.5"
       },
       "devDependencies": {
         "@arco-design/web-vue": "^2.56.0",
@@ -3497,6 +3498,21 @@
         }
       }
     },
+    "node_modules/vue-router": {
+      "version": "4.4.5",
+      "resolved": "https://repo.bingosoft.net/repository/npm/vue-router/-/vue-router-4.4.5.tgz",
+      "integrity": "sha512-4fKZygS8cH1yCyuabAXGUAsyi1b2/o/OKgu/RUb+znIYOxPRxdkytJEx+0wGcpBE1pX6vUgh5jwWOKRGvuA/7Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/devtools-api": "^6.6.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/posva"
+      },
+      "peerDependencies": {
+        "vue": "^3.2.0"
+      }
+    },
     "node_modules/vue-template-compiler": {
       "version": "2.7.16",
       "resolved": "https://registry.npmmirror.com/vue-template-compiler/-/vue-template-compiler-2.7.16.tgz",