refactor: 优化代码规范和可读性

src/components/Breadcrumb/index.vue

@@ -15,56 +15,72 @@
 </template>
 
 <script setup lang="ts">
-import { RouteLocationMatched } from "vue-router";
+import type { RouteLocationMatched } from "vue-router";
 import { compile } from "path-to-regexp";
 import router from "@/router";
 import { translateRouteTitle } from "@/lang/utils";
 
+type BreadcrumbRoute = {
+  path: string;
+  name?: RouteLocationMatched["name"];
+  redirect?: string;
+  meta: RouteLocationMatched["meta"];
+};
+
 const currentRoute = useRoute();
+// 默认补一个首页面包屑
+const dashboardRoute: BreadcrumbRoute = { path: "/dashboard", meta: { title: "dashboard" } };
+
+// 根据当前路由参数生成跳转路径
 const pathCompile = (path: string) => {
   const { params } = currentRoute;
   const toPath = compile(path);
   return toPath(params);
 };
 
-const breadcrumbs = ref<Array<RouteLocationMatched>>([]);
+const breadcrumbs = ref<BreadcrumbRoute[]>([]);
 
+// 生成面包屑列表
 function getBreadcrumb() {
-  let matched = currentRoute.matched.filter((item) => item.meta && item.meta.title);
+  let matched: BreadcrumbRoute[] = currentRoute.matched
+    .filter((item) => item.meta && item.meta.title)
+    .map(({ path, name, redirect, meta }) => ({
+      path,
+      name,
+      redirect: typeof redirect === "string" ? redirect : undefined,
+      meta,
+    }));
+
   const first = matched[0];
   if (!isDashboard(first)) {
-    matched = [{ path: "/dashboard", meta: { title: "dashboard" } } as any].concat(matched);
+    matched = [dashboardRoute].concat(matched);
   }
   breadcrumbs.value = matched.filter((item) => {
     return item.meta && item.meta.title && item.meta.breadcrumb !== false;
   });
 }
 
-function isDashboard(route: RouteLocationMatched) {
-  const name = route && route.name;
+// 判断是否为首页路由
+function isDashboard(route?: BreadcrumbRoute) {
+  const name = route?.name;
   if (!name) {
     return false;
   }
   return name.toString().trim().toLocaleLowerCase() === "Dashboard".toLocaleLowerCase();
 }
 
-function handleLink(item: any) {
+// 处理面包屑跳转
+function handleLink(item: BreadcrumbRoute) {
   const { redirect, path } = item;
   if (redirect) {
-    router.push(redirect).then(
-      () => {},
-      (err) => {
-        console.warn(err);
-      }
-    );
+    router.push(redirect).catch((err) => {
+      console.warn(err);
+    });
     return;
   }
-  router.push(pathCompile(path)).then(
-    () => {},
-    (err) => {
-      console.warn(err);
-    }
-  );
+  router.push(pathCompile(path)).catch((err) => {
+    console.warn(err);
+  });
 }
 
 watch(

src/components/CURD/PageContent.vue

@@ -6,7 +6,7 @@
     <div class="flex flex-col md:flex-row justify-between gap-y-2.5 mb-2.5">
       <!-- 左侧工具 -->
       <div class="toolbar-left flex gap-y-2.5 gap-x-2 md:gap-x-3 flex-wrap">
-        <template v-for="(btn, index) in toolbarLeftBtn" :key="index">
+        <template v-for="(btn, index) in leftToolbarButtons" :key="index">
           <el-button
             v-hasPerm="btn.perm ?? '*:*:*'"
             v-bind="btn.attrs"
@@ -19,7 +19,7 @@
       </div>
       <!-- 右侧工具 -->
       <div class="toolbar-right flex gap-y-2.5 gap-x-2 md:gap-x-3 flex-wrap">
-        <template v-for="(btn, index) in toolbarRightBtn" :key="index">
+        <template v-for="(btn, index) in rightToolbarButtons" :key="index">
           <el-popover v-if="btn.name === 'filter'" placement="bottom" trigger="click">
             <template #reference>
               <el-button v-bind="btn.attrs"></el-button>
@@ -412,13 +412,13 @@ function createToolbar(toolbar: Array<string | IToolsButton>, attr = {}) {
 }
 
 // 左侧工具栏按钮
-const toolbarLeftBtn = computed(() => {
+const leftToolbarButtons = computed(() => {
   if (!config.value.toolbar || config.value.toolbar.length === 0) return [];
   return createToolbar(config.value.toolbar, {});
 });
 
 // 右侧工具栏按钮
-const toolbarRightBtn = computed(() => {
+const rightToolbarButtons = computed(() => {
   if (!config.value.defaultToolbar || config.value.defaultToolbar.length === 0) return [];
   return createToolbar(config.value.defaultToolbar, { circle: true });
 });
@@ -602,7 +602,7 @@ function handleExports() {
           (buffer) => {
             saveXlsx(buffer, filename as string);
           },
-          (error) => console.log(error)
+          (error) => console.error(error)
         );
       });
     } else {
@@ -616,7 +616,7 @@ function handleExports() {
       (buffer) => {
         saveXlsx(buffer, filename as string);
       },
-      (error) => console.log(error)
+      (error) => console.error(error)
     );
   }
 }
@@ -750,7 +750,7 @@ function handleImports() {
             handleRefresh(true);
           });
         },
-        (error) => console.log(error)
+        (error) => console.error(error)
       );
     } else {
       ElMessage.error("读取文件失败");

src/components/CommandPalette/index.vue

@@ -106,7 +106,7 @@ const {
 
 const displayList = computed(() => (results.value.length ? results.value : history.value));
 
-const handleInputKeydown: (evt: KeyboardEvent | Event) => any = (evt) => {
+const handleInputKeydown: (evt: KeyboardEvent | Event) => void = (evt) => {
   if (!(evt instanceof KeyboardEvent)) return;
   const e = evt;
   const key = e.key.toLowerCase();

src/components/DictTag/index.vue

@@ -31,13 +31,13 @@ const dictStore = useDictStore();
  * @param value 字典项的值
  * @returns 包含 label 和 tagType 的对象
  */
-const getLabelAndTagByValue = async (dictCode: string, value: any) => {
+const getLabelAndTagByValue = async (dictCode: string, value: string | number) => {
   // 按需加载字典数据
   await dictStore.loadDictItems(dictCode);
   // 从缓存中获取字典数据
   const dictItems = dictStore.getDictItems(dictCode);
   // 查找对应的字典项
-  const dictItem = dictItems.find((item) => item.value == value);
+  const dictItem = dictItems.find((item) => String(item.value) === String(value));
   return {
     label: dictItem?.label || "",
     tagType: dictItem?.tagType,

src/components/SizeSelect/index.vue

@@ -10,7 +10,7 @@
           <el-dropdown-item
             v-for="item of sizeOptions"
             :key="item.value"
-            :disabled="appStore.size == item.value"
+            :disabled="appStore.size === item.value"
             :command="item.value"
           >
             {{ item.label }}

src/components/Upload/MultiImageUpload.vue

@@ -190,9 +190,11 @@ const handleSuccess = (fileInfo: FileInfo, uploadFile: UploadUserFile) => {
 /**
  * 上传失败回调
  */
-const handleError = (error: any) => {
-  console.log("handleError");
-  ElMessage.error("上传失败: " + error.message);
+const getErrorMessage = (error: unknown) =>
+  error instanceof Error ? error.message : String(error);
+
+const handleError = (error: unknown) => {
+  ElMessage.error("上传失败: " + getErrorMessage(error));
 };
 
 /**

src/components/Upload/SingleImageUpload.vue

@@ -16,7 +16,7 @@
           class="single-upload__image"
           :src="modelValue"
           :preview-src-list="[modelValue]"
-          @click.stop="handlePreview"
+          @click.stop
         />
         <el-icon class="single-upload__delete-btn" @click.stop="handleDelete">
           <CircleCloseFilled />
@@ -148,13 +148,6 @@ function handleUpload(options: UploadRequestOptions) {
   });
 }
 
-/**
- * 预览图片
- */
-function handlePreview() {
-  console.log("预览图片,停止冒泡");
-}
-
 /**
  * 删除图片
  */
@@ -175,9 +168,11 @@ const onSuccess = (fileInfo: FileInfo) => {
 /**
  * 上传失败回调
  */
-const onError = (error: any) => {
-  console.log("onError");
-  ElMessage.error("上传失败: " + error.message);
+const getErrorMessage = (error: unknown) =>
+  error instanceof Error ? error.message : String(error);
+
+const onError = (error: unknown) => {
+  ElMessage.error("上传失败: " + getErrorMessage(error));
 };
 </script>