From cd6abcea3b358d78fb15d11a9368435de401869c Mon Sep 17 00:00:00 2001
From: zhcnyuyang <yyydm@qq.com>
Date: Sat, 30 Aug 2025 21:39:12 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ExampleItem.vue     | 26 ++++++++++---
 src/components/ExamplesContent.vue | 62 ++++++++++++++++++++++++------
 src/components/Tools/Partners.vue  | 16 +++++++-
 3 files changed, 85 insertions(+), 19 deletions(-)

diff --git a/src/components/ExampleItem.vue b/src/components/ExampleItem.vue
index 08ce3c4..21bee58 100644
--- a/src/components/ExampleItem.vue
+++ b/src/components/ExampleItem.vue
@@ -55,6 +55,20 @@ export default {
       }else{
 
       }
+    },
+    getImageUrl(url) {
+      if (!url) return '';
+
+      // 如果是完整的URL（以http或https开头），去掉域名部分，转换成相对路径
+      if (url.startsWith('http://') || url.startsWith('https://')) {
+        // 提���路径部分（去掉协议和域名）
+        const urlObj = new URL(url);
+        const relativePath = urlObj.pathname;
+        return `${this.$axios.defaults.baseCDNURL}${relativePath}`;
+      } else {
+        // 如果是相对路径，直接拼接CDN URL
+        return `${this.$axios.defaults.baseCDNURL}${url}`;
+      }
     }
   },
   created() {
@@ -76,9 +90,9 @@ export default {
 <template>
   <div id="passageroot" class="pageroot" v-if="psginfo">
     <div id="passagebanner" class="pagebanner">
-      <img :src="`${this.$axios.defaults.baseCDNURL}${psginfo.mobileheadimage.url}`"
+      <img :src="getImageUrl(psginfo.mobileheadimage?.url)"
            v-if="breakpoint==='xs'||breakpoint==='sm'"   alt="" id="bannerimg"/>
-      <img :src="`${this.$axios.defaults.baseCDNURL}${psginfo.headimage.url}`"
+      <img :src="getImageUrl(psginfo.headimage?.url)"
            v-else  alt="" id="bannerimg"/>
       <div id="bannercontentfill"
            style="width: 100%;height: 100%;
@@ -120,11 +134,11 @@ export default {
       <div v-for="(item, index) in psginfo.images" :key="index"
            class="imglistitem"
            style="width: 100%; height: auto;">
-        <img :src="`${this.$axios.defaults.baseCDNURL}${item.url}`" v-if="item.mime.startsWith('image',0)" alt="" />
+        <img :src="getImageUrl(item.url)" v-if="item.mime.startsWith('image',0)" alt="" />
         <video v-else-if="item.mime.startsWith('video',0)" controls="controls">
-          <source :src="`${this.$axios.defaults.baseCDNURL}${item.url}`" type="video/mp4">
-          <source :src="`${this.$axios.defaults.baseCDNURL}${item.url}`" type="video/ogg">
-          <source :src="`${this.$axios.defaults.baseCDNURL}${item.url}`" type="video/webm">
+          <source :src="getImageUrl(item.url)" type="video/mp4">
+          <source :src="getImageUrl(item.url)" type="video/ogg">
+          <source :src="getImageUrl(item.url)" type="video/webm">
         </video>
       </div>
     </div>
diff --git a/src/components/ExamplesContent.vue b/src/components/ExamplesContent.vue
index c5eb760..486d841 100644
--- a/src/components/ExamplesContent.vue
+++ b/src/components/ExamplesContent.vue
@@ -25,7 +25,7 @@
         </div>
       </router-link>
       <router-link v-for="(item, index) in this.types"
-         :key="index":to="{ name: 'Examples', query: {type:item} }"
+         :key="index" :to="{ name: 'Examples', query: {type:item} }"
          style="text-decoration: none;">
         <div class="typebar"
              :class="{ active: ($route.query.type === item)}">
@@ -41,14 +41,21 @@
           :href="`/ExampleItem?createdAt=${item.createdAt}`"
       >
         <div class="listblock">
-          <img :src="`${this.$axios.defaults.baseCDNURL}${item.headimage.formats.large.url}`" alt="" />
-          <div class="itemtext">
-            <span class="upspan">
-              {{item.brandname_cn}}
-            </span>
-            <span class="downspan">
-              {{item.projectname_cn}}
-            </span>
+            <img
+              :src="getImageUrl(item.headimage)"
+              alt=""
+              @error="handleImageError"
+            />
+
+          <div id="itemon">
+            <div class="itemtext">
+              <span class="upspan">
+                {{item.brandname_cn}}
+              </span>
+              <span class="downspan">
+                {{item.projectname_cn}}
+              </span>
+            </div>
           </div>
         </div>
       </a>
@@ -80,10 +87,10 @@ export default {
             if (Array.isArray(resp)) {
               this.types = resp;
               if (this.types.length === 0) {
-                this.error = "返回的数组为空";
+                this.error = "返回的数组为���";
               }
             } else {
-              this.error = "返回的数据不是数组";
+              this.error = "返回的���据不是数组";
               this.types = [];
             }
           })
@@ -108,7 +115,7 @@ export default {
         reqarg='/api/examples?fields=id,brandname_cn,projectname_cn,createdAt&populate=headimage&filters[example_type]='+type+'&sort=createdAt:desc';
       }
       if (this.$route.name != 'Examples'){
-        let reqarg='/api/examples?fields=id,brandname_cn,projectname_cn,createdAt&populate=headimage&pagination[page]=1&pagination[pageSize]=5&sort=createdAt:desc';
+        reqarg='/api/examples?fields=id,brandname_cn,projectname_cn,createdAt&populate=headimage&pagination[page]=1&pagination[pageSize]=5&sort=createdAt:desc';
       }
       axios.get(reqarg)
           .then(response =>{
@@ -134,6 +141,24 @@ export default {
           .finally(() => {
             this.isLoading = false;
           });
+    },
+    getImageUrl(image) {
+      const url = image.url;
+
+      // 如果是完整的URL（以http或https开头），去掉域名部分，转换成相对路径
+      if (url.startsWith('http://') || url.startsWith('https://')) {
+        // 提取路径部分（去掉协议和域名）
+        const urlObj = new URL(url);
+        const relativePath = urlObj.pathname;
+        return `${this.$axios.defaults.baseCDNURL}${relativePath}`;
+      } else {
+        // 如果是相对路径，直接拼接CDN URL
+        return `${this.$axios.defaults.baseCDNURL}${url}`;
+      }
+    },
+    handleImageError(event) {
+      // 处理图片加载错误的逻辑
+      event.target.src = 'path/to/default/image.jpg'; // 替换为默认图片的路径
     }
   },
   mounted() {
@@ -155,6 +180,16 @@ export default {
 
 <style scoped lang="scss">
 @import "src/publicstyle.scss";
+#itemon{
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0,0,0,0.3);
+  z-index: 2;
+}
+
 #listmain{
   display: grid;
   @include media-breakpoint-between(xs, md) {
@@ -188,6 +223,9 @@ export default {
   }
 }
 .listblock img {
+  position: absolute;
+  top: 0;
+  left: 0;
   z-index: 0;
   @include media-breakpoint-between(xs, md){
     width: 100%;
diff --git a/src/components/Tools/Partners.vue b/src/components/Tools/Partners.vue
index 7c64de5..603123e 100644
--- a/src/components/Tools/Partners.vue
+++ b/src/components/Tools/Partners.vue
@@ -9,7 +9,7 @@
     <div v-for="item in logos"
         class="partneritempanel" id="ptn01">
       <div class="partnerlogodiv">
-        <img :src="`${this.$axios.defaults.baseCDNURL}${item.url}`" alt="" />
+        <img :src="getImageUrl(item.url)" alt="" />
       </div>
     </div>
   </div>
@@ -44,6 +44,20 @@ export default {
           console.error(err);
           this.logos = [];
         });
+    },
+    getImageUrl(url) {
+      if (!url) return '';
+
+      // 如果是完整的URL（以http或https开头），去掉域名部分，转换成相对路径
+      if (url.startsWith('http://') || url.startsWith('https://')) {
+        // 提取路径部分（去掉协议和域名）
+        const urlObj = new URL(url);
+        const relativePath = urlObj.pathname;
+        return `${this.$axios.defaults.baseCDNURL}${relativePath}`;
+      } else {
+        // 如果是相对路径，直接拼接CDN URL
+        return `${this.$axios.defaults.baseCDNURL}${url}`;
+      }
     }
   },
   mounted() {