fix(ProjectCard): fix formattedPath display and ensure card click opens

Author: MidnightCrowing

src/components/ProjectCard/ProjectCard.vue

@@ -41,7 +41,7 @@ const openButtonRef = ref<OpenButtonExpose | null>(null)
 const projectCardActive = ref<boolean>(false)
 const langGroup = ref(projectLangGroup.value)
 
-const formattedPath = computed(() => window.api.formatPath(projectPath.value))
+const formattedPath = ref<string>('')
 
 function handleClick() {
   openButtonRef.value?.handleClick()
@@ -64,6 +64,14 @@ watch(
   { deep: true },
 ) // 使用 deep 监听 langGroup 的内部变化
 
+watchEffect(async () => {
+  if (!projectPath.value) {
+    formattedPath.value = ''
+    return
+  }
+  formattedPath.value = await window.api.formatPath(projectPath.value)
+})
+
 // ==================== More Button ====================
 function getDeleteLabel() {
   if (!projectExists.value) {
@@ -134,7 +142,7 @@ function showMenu() {
     cursor-pointer
     tabindex="0"
     draggable="true"
-    @click.self="handleClick"
+    @click="handleClick"
     @dragstart="handleDragStart"
   >
     <div
@@ -177,7 +185,12 @@ function showMenu() {
           text="secondary"
         >
           {{ projectKind === ProjectKind.FORK ? 'Forked from' : 'Cloned from' }}
-          <JeLink v-if="projectFromUrl" type="web" :on-click="() => openLink(projectFromUrl)">
+          <JeLink
+            v-if="projectFromUrl"
+            type="web"
+            :on-click="() => openLink(projectFromUrl)"
+            @click.stop
+          >
             {{ projectFromName || projectFromUrl }}
           </JeLink>
           <span v-else>{{ projectFromName }}</span>
@@ -189,11 +202,12 @@ function showMenu() {
 
       <!-- Button -->
       <div flex="~ row" gap="15px">
-        <LanguageButton :project-item="projectItem" />
+        <LanguageButton :project-item="projectItem" @click.stop />
 
         <LicenseButton
           v-if="projectLicense && projectLicense !== LicenseEnum.NONE"
           :license="projectLicense"
+          @click.stop
         />
       </div>
     </div>
@@ -205,21 +219,23 @@ function showMenu() {
         :append-time="projectAppendTime"
         :default-open="projectDefaultOpen"
         :project-path="projectPath"
+        @click.stop
       />
 
       <!-- More Button -->
       <JeTransparentToolButton
         p="3px"
         icon="light:i-jet:more-vertical dark:i-jet:more-vertical-dark"
         icon-size="17px"
-        @click="showMenu"
+        @click.stop="showMenu"
       />
       <JeMenu
         v-model:visible="menuVisible"
         :options="projectActions"
         absolute
         translate-y="45px"
         right="5px"
+        @click.stop
       />
     </div>
   </div>

src/global.d.ts

@@ -12,7 +12,7 @@ declare global {
       getFolderList: (folderPath: string) => Promise<{ folders: string[], error?: string }>
 
       // path
-      formatPath: (filePath: string) => string
+      formatPath: (filePath: string) => Promise<string>
       checkPathExistence: (path: string) => Promise<{ exists: boolean, error?: string }>
 
       // project
@@ -34,7 +34,10 @@ declare global {
       openSettingsJSON: () => Promise<boolean>
 
       // data
-      saveData: (fileType: 'projects' | 'projectScanner' | 'settings', data: string) => Promise<{
+      saveData: (
+        fileType: 'projects' | 'projectScanner' | 'settings',
+        data: string
+      ) => Promise<{
         success: boolean
         error?: string
       }>
@@ -66,29 +69,36 @@ declare global {
       }>
 
       // scanner (batch)
-      scanProjects: (payload: { roots: string[], existingPaths: string[] }) => Promise<Array<{
-        path: string
-        name: string
-        mainLang?: string
-        mainLangColor?: `#${string}`
-        langGroup?: Array<{ text: string, color: `#${string}`, percentage: number }>
-        error?: string
-      }>>
-
-      // scanner (stream)
-      startProjectScan: (payload: { roots: string[], existingPaths: string[] }) => Promise<{ sessionId: number }>
-      stopProjectScan: (sessionId: number) => Promise<{ stopped: boolean }>
-      onScannerItem: (cb: (data: {
-        sessionId: number
-        item: {
+      scanProjects: (payload: { roots: string[], existingPaths: string[] }) => Promise<
+        Array<{
           path: string
           name: string
           mainLang?: string
           mainLangColor?: `#${string}`
           langGroup?: Array<{ text: string, color: `#${string}`, percentage: number }>
           error?: string
-        }
-      }) => void) => () => void
+        }>
+      >
+
+      // scanner (stream)
+      startProjectScan: (payload: {
+        roots: string[]
+        existingPaths: string[]
+      }) => Promise<{ sessionId: number }>
+      stopProjectScan: (sessionId: number) => Promise<{ stopped: boolean }>
+      onScannerItem: (
+        cb: (data: {
+          sessionId: number
+          item: {
+            path: string
+            name: string
+            mainLang?: string
+            mainLangColor?: `#${string}`
+            langGroup?: Array<{ text: string, color: `#${string}`, percentage: number }>
+            error?: string
+          }
+        }) => void
+      ) => () => void
       onScannerDone: (cb: (data: { sessionId: number }) => void) => () => void
       onScannerError: (cb: (data: { sessionId: number, error: string }) => void) => () => void