build(projects): update deps and perfect the details [升级依赖，完善细节]

package.json

@@ -60,20 +60,20 @@
     "@better-scroll/core": "^2.5.0",
     "@soybeanjs/vue-admin-layout": "^1.1.1",
     "@soybeanjs/vue-admin-tab": "^1.0.5",
-    "@vueuse/core": "^9.5.0",
+    "@vueuse/core": "^9.6.0",
     "axios": "0.27.2",
     "clipboard": "^2.0.11",
     "colord": "^2.9.3",
     "crypto-js": "^4.1.1",
-    "dayjs": "^1.11.6",
+    "dayjs": "^1.11.7",
     "echarts": "^5.4.0",
     "form-data": "^4.0.0",
     "lodash-es": "^4.17.21",
-    "naive-ui": "2.33.5",
+    "naive-ui": "2.34.2",
-    "pinia": "^2.0.23",
+    "pinia": "^2.0.27",
     "print-js": "^1.6.0",
     "qs": "^6.11.0",
-    "swiper": "^8.4.4",
+    "swiper": "^8.4.5",
     "ua-parser-js": "^1.0.32",
     "vditor": "^3.8.18",
     "vue": "3.2.45",
@@ -85,46 +85,46 @@
   },
   "devDependencies": {
     "@amap/amap-jsapi-types": "^0.0.10",
-    "@iconify/json": "^2.1.139",
+    "@iconify/json": "^2.1.148",
-    "@iconify/vue": "^4.0.0",
+    "@iconify/vue": "^4.0.1",
     "@soybeanjs/router-page": "1.0.3",
     "@types/bmapgl": "^0.0.5",
     "@types/crypto-js": "^4.1.1",
-    "@types/node": "18.11.9",
+    "@types/node": "18.11.11",
     "@types/qs": "^6.9.7",
     "@types/ua-parser-js": "^0.7.36",
-    "@unocss/preset-uno": "^0.46.5",
+    "@unocss/preset-uno": "^0.47.5",
-    "@unocss/vite": "^0.46.5",
+    "@unocss/vite": "^0.47.5",
     "@vitejs/plugin-vue": "^3.2.0",
     "@vitejs/plugin-vue-jsx": "^2.1.1",
-    "commitlint": "^17.2.0",
+    "commitlint": "^17.3.0",
     "conventional-changelog": "^3.1.25",
     "cross-env": "^7.0.3",
-    "cz-git": "^1.3.12",
+    "cz-git": "^1.4.0",
-    "czg": "^1.3.12",
+    "czg": "^1.4.0",
-    "eslint": "^8.27.0",
+    "eslint": "^8.29.0",
-    "eslint-config-soybeanjs-vue": "^0.1.2",
+    "eslint-config-soybeanjs-vue": "^0.2.1",
     "esno": "^0.16.3",
     "husky": "^8.0.2",
     "mockjs": "^1.1.0",
-    "npm-check-updates": "^16.4.1",
+    "npm-check-updates": "^16.4.3",
     "rimraf": "^3.0.2",
     "rollup-plugin-visualizer": "^5.8.3",
     "sass": "^1.56.1",
     "standard-version": "^9.5.0",
-    "typescript": "4.8.4",
+    "typescript": "4.9.3",
-    "unplugin-icons": "^0.14.13",
+    "unplugin-icons": "^0.14.14",
-    "unplugin-vue-components": "0.22.9",
+    "unplugin-vue-components": "0.22.11",
-    "unplugin-vue-macros": "^0.16.3",
+    "unplugin-vue-macros": "^1.0.3",
     "utility-types": "^3.10.0",
-    "vite": "^3.2.4",
+    "vite": "^3.2.5",
     "vite-plugin-compression": "^0.5.1",
     "vite-plugin-html": "^3.2.0",
     "vite-plugin-mock": "^2.9.6",
     "vite-plugin-progress": "^0.0.6",
     "vite-plugin-pwa": "^0.13.3",
     "vite-plugin-svg-icons": "^2.0.1",
-    "vue-tsc": "^1.0.9",
+    "vue-tsc": "^1.0.11",
     "zx": "^7.1.1"
   },
   "pnpm": {

src/components/custom/SvgIcon.vue

@@ -5,7 +5,7 @@
     </svg>
   </template>
   <template v-else>
-    <Icon :icon="icon" v-bind="bindAttrs" />
+    <Icon v-if="icon" :icon="icon" v-bind="bindAttrs" />
   </template>
 </template>
 

src/composables/echarts.ts

@@ -98,7 +98,7 @@ export function useEcharts(
 
   function update(updateOptions: ECOption) {
     if (isRendered()) {
-			chart?.clear();
+      chart?.clear();
       chart!.setOption({ ...updateOptions, backgroundColor: 'transparent' });
     }
   }
@@ -144,9 +144,13 @@ export function useEcharts(
     }
   });
 
-  const stopOptionWatch = watch(options, newValue => {
+  const stopOptionWatch = watch(
-    update(newValue);
+    options,
-  }, { deep: true });
+    newValue => {
+      update(newValue);
+    },
+    { deep: true }
+  );
 
   const stopDarkModeWatch = watch(
     () => theme.darkMode,

src/layouts/common/GlobalTab/components/TabDetail/index.vue

@@ -65,33 +65,36 @@ async function getActiveTabClientX() {
   }
 }
 
-const dropdown = reactive({
+interface DropdownConfig {
+  visible: boolean;
+  affix: boolean;
+  x: number;
+  y: number;
+  currentPath: string;
+}
+
+const dropdown: DropdownConfig = reactive({
   visible: false,
   affix: false,
   x: 0,
   y: 0,
   currentPath: ''
 });
-function showDropdown() {
+
-  dropdown.visible = true;
+function setDropdown(config: Partial<DropdownConfig>) {
-}
+  Object.assign(dropdown, config);
-function hideDropdown() {
-  dropdown.visible = false;
-}
-function setDropdown(x: number, y: number, currentPath: string, affix?: boolean) {
-  Object.assign(dropdown, { x, y, currentPath, affix });
 }
 
 let isClickContextMenu = false;
 
 function handleDropdownVisible(visible: boolean) {
   if (!isClickContextMenu) {
-    dropdown.visible = visible;
+    setDropdown({ visible });
   }
 }
 
 /** 点击右键菜单 */
-async function handleContextMenu(e: MouseEvent, fullPath: string, affix?: boolean) {
+async function handleContextMenu(e: MouseEvent, currentPath: string, affix?: boolean) {
   e.preventDefault();
 
   const { clientX, clientY } = e;
@@ -100,11 +103,16 @@ async function handleContextMenu(e: MouseEvent, fullPath: string, affix?: boolea
 
   const DURATION = dropdown.visible ? 150 : 0;
 
-  hideDropdown();
+  setDropdown({ visible: false });
 
   setTimeout(() => {
-    setDropdown(clientX, clientY, fullPath, affix);
+    setDropdown({
-    showDropdown();
+      visible: true,
+      x: clientX,
+      y: clientY,
+      currentPath,
+      affix
+    });
     isClickContextMenu = false;
   }, DURATION);
 }

vite.config.ts

@@ -31,6 +31,7 @@ export default defineConfig(configEnv => {
     },
     server: {
       host: '0.0.0.0',
+      port: 3200,
       open: true,
       proxy: createViteProxy(isOpenProxy, envConfig)
     },