fix: 修正面包屑导航的显示逻辑

- 竖屏下不显示面包屑导航

app/components/pages/search/SearchTabs.vue

@@ -47,3 +47,9 @@
     currentPage.value = 1; // 重置页码
   });
 </script>
+
+<style scoped>
+  .el-tabs {
+    width: 100%;
+  }
+</style>

app/components/shared/JinshenFooter.vue

@@ -48,7 +48,7 @@
         <ul class="footer-links">
           <li>
             <a
-              href="http://cal.3w.jinshen.cn"
+              href="http://cal.jinshen.cn"
               target="_blank"
               rel="noopener noreferer"
             >

app/components/shared/JinshenHeader.vue

@@ -53,7 +53,7 @@
         class="hide-on-mobile"
         type="info"
         :underline="false"
-        href="http://cal.3w.jinshen.cn"
+        href="http://cal.jinshen.cn"
         target="_blank"
       >
         <el-icon class="mdi mdi-calculator action-icon" />
@@ -131,9 +131,7 @@
               mode="vertical"
               @select="mobileMenuVisible = false"
             >
-              <el-menu-item
+              <el-menu-item @click="openExternalLink('http://cal.jinshen.cn')">
-                @click="openExternalLink('http://cal.3w.jinshen.cn')"
-              >
                 {{ $t('navigation.calculator') }}
               </el-menu-item>
             </el-menu>

app/pages/about/index.vue

@@ -109,5 +109,9 @@
       margin-left: 0;
       gap: 0.5rem;
     }
+
+    .breadcrumb {
+      display: none;
+    }
   }
 </style>

app/pages/download/[id].vue

@@ -4,11 +4,17 @@
       <h1 class="page-title">{{ $t('navigation.downloads') }}</h1>
       <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
     </div>
-    <div v-if="!pending" class="page-content">
+    <div class="page-content">
+      <el-skeleton
+        :loading="pending"
+        :rows="6"
+        animated
+        :throttle="{ leading: 500, trailing: 500 }"
+      >
+        <template #default>
           <file-card :file-id="id" :file="file" />
-    </div>
+        </template>
-    <div v-else>
+      </el-skeleton>
-      <el-skeleton :rows="6" animated />
     </div>
   </div>
 </template>
@@ -66,4 +72,10 @@
   .breadcrumb {
     margin-left: auto;
   }
+
+  @media (max-width: 768px) {
+    .breadcrumb {
+      display: none;
+    }
+  }
 </style>

app/pages/locate.vue

@@ -1,5 +1,7 @@
 <template>
-  <div>redirecting...</div>
+  <div class="page-container">
+    <h1>{{ $t('redirecting') }}</h1>
+  </div>
 </template>
 
 <script setup lang="ts">
@@ -10,3 +12,17 @@
     window.location.href = platform;
   });
 </script>
+
+<style scoped>
+  .page-container {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    min-height: 80vh;
+  }
+
+  h1 {
+    font-size: 1.5rem;
+    font-weight: bold;
+  }
+</style>

app/pages/products/[slug].vue

@@ -1,6 +1,5 @@
 <template>
   <div class="page-container">
-    <div v-if="!pending">
     <div v-if="product">
       <!-- 面包屑导航 -->
       <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
@@ -19,15 +18,6 @@
       />
     </div>
   </div>
-    <div v-else class="loading">
-      <el-skeleton style="--el-skeleton-circle-size: 400px">
-        <template #template>
-          <el-skeleton-item variant="circle" />
-        </template>
-      </el-skeleton>
-      <el-skeleton :rows="5" animated />
-    </div>
-  </div>
 </template>
 
 <script setup lang="ts">
@@ -37,7 +27,7 @@
   // 获取路由参数
   const id = route.params.slug as string;
 
-  const { data: product, pending, error } = await useProduct(id);
+  const { data: product, error } = await useProduct(id);
 
   const breadcrumbItems = computed(() => [
     { label: $t('navigation.home'), to: localePath('/') },

app/pages/products/index.vue

@@ -207,6 +207,10 @@
     .skeleton-card {
       width: 90%;
     }
+
+    .breadcrumb {
+      display: none;
+    }
   }
 
   :deep(.el-collapse-item__header) {

app/pages/search.vue

@@ -1,11 +1,23 @@
 <template>
   <div class="search-page">
     <search-header v-model="keyword" />
-    <div v-if="loading" class="search-state">
+    <div class="search-state">
-      <el-skeleton :rows="4" animated />
+      <el-skeleton
-    </div>
+        :loading="loading"
-    <search-tabs v-else-if="hasResults" :search-items="searchItems" />
+        animated
-    <div v-else class="search-state">
+        :throttle="{ leading: 500, trailing: 500 }"
+      >
+        <template #template>
+          <el-skeleton-item
+            v-for="i in 10"
+            :key="i"
+            variant="rect"
+            class="skeleton-item"
+          />
+        </template>
+        <template #default>
+          <search-tabs v-if="hasResults" :search-items="searchItems" />
+          <div v-else>
             <el-empty
               :description="
                 route.query.query
@@ -14,6 +26,9 @@
               "
             />
           </div>
+        </template>
+      </el-skeleton>
+    </div>
   </div>
 </template>
 
@@ -96,7 +111,11 @@
   .search-state {
     display: flex;
     justify-content: center;
-    padding: 3rem 0;
+  }
+
+  .skeleton-item {
+    height: 80px;
+    margin-bottom: 1rem;
   }
 
   @media (max-width: 640px) {

app/pages/solutions/[slug].vue

@@ -1,6 +1,5 @@
 <template>
   <div class="page-container">
-    <div v-if="!pending">
     <div v-if="solution">
       <div class="page-header">
         <app-breadcrumb class="breadcrumb" :items="breadcrumbItems" />
@@ -16,10 +15,6 @@
       />
     </div>
   </div>
-    <div v-else class="loading">
-      <el-skeleton :rows="5" animated />
-    </div>
-  </div>
 </template>
 
 <script setup lang="ts">
@@ -29,7 +24,7 @@
   // 获取路由参数
   const id = route.params.slug as string;
 
-  const { data: solution, pending, error } = await useSolution(id);
+  const { data: solution, error } = await useSolution(id);
 
   const breadcrumbItems = computed(() => [
     { label: $t('navigation.home'), to: localePath('/') },

app/pages/solutions/index.vue

@@ -172,5 +172,9 @@
     .skeleton-card {
       width: 90%;
     }
+
+    .breadcrumb {
+      display: none;
+    }
   }
 </style>

app/pages/support/contact-us.vue

@@ -87,4 +87,10 @@
   :deep(.markdown-body ul) {
     list-style-type: none;
   }
+
+  @media (max-width: 768px) {
+    .breadcrumb {
+      display: none;
+    }
+  }
 </style>

app/pages/support/documents.vue

@@ -226,6 +226,12 @@
     margin-top: 2rem;
   }
 
+  @media (max-width: 768px) {
+    .breadcrumb {
+      display: none;
+    }
+  }
+
   :deep(.el-pagination) {
     .btn-prev,
     .btn-next {

app/pages/support/faq.vue

@@ -223,6 +223,12 @@
     margin-top: 2rem;
   }
 
+  @media (max-width: 768px) {
+    .breadcrumb {
+      display: none;
+    }
+  }
+
   :deep(.el-pagination) {
     .btn-prev,
     .btn-next {

app/pages/support/index.vue

@@ -137,5 +137,9 @@
       grid-template-columns: 1fr;
       gap: 20px;
     }
+
+    .breadcrumb {
+      display: none;
+    }
   }
 </style>

i18n/locales/en.json

@@ -127,5 +127,6 @@
     "specs": "Specifications",
     "faq": "FAQ",
     "documents": "Documents"
-  }
+  },
+  "redirecting": "Redirecting..."
 }

i18n/locales/es.json

@@ -126,5 +126,6 @@
     "specs": "Especificaciones",
     "faq": "FAQ",
     "documents": "Documentos"
-  }
+  },
+  "redirecting": "Redirigiendo..."
 }

i18n/locales/ru.json

@@ -126,5 +126,6 @@
     "specs": "Технические спецификации",
     "faq": "Часто задаваемые вопросы",
     "documents": "Связанные документы"
-  }
+  },
+  "redirecting": "Перенаправление..."
 }

i18n/locales/zh.json

@@ -126,5 +126,6 @@
     "specs": "技术规格",
     "faq": "常见问题",
     "documents": "相关文档"
-  }
+  },
+  "redirecting": "正在跳转..."
 }

nuxt.config.ts

@@ -20,7 +20,17 @@ export default defineNuxtConfig({
       htmlAttrs: {
         lang: 'zh',
       },
-      link: [{ rel: 'icon', type: 'image/x-icon', href: '/jinshen-logo.ico' }],
+      link: [
+        { rel: 'icon', type: 'image/x-icon', href: '/jinshen-logo.ico' },
+        {
+          rel: 'apple-touch-icon',
+          href: '/jinshen-logo.png',
+        },
+        {
+          rel: 'manifest',
+          href: '/manifest.json',
+        },
+      ],
     },
   },
 

public/manifest.json

@@ -0,0 +1,20 @@
+{
+  "name": "金申机械制造有限公司",
+  "short_name": "金申机械",
+  "icons": [
+    {
+      "src": "/logo196x196.png",
+      "sizes": "196x196",
+      "type": "image/png"
+    },
+    {
+      "src": "/logo512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "background_color": "#ffffff",
+  "theme_color": "#0f172a"
+}