yangprivate-web/kdofficial
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 32 Wiki Activity

更正

Browse Source
This commit is contained in:
zhcnyuyang 2025-08-30 21:39:12 +08:00
parent 18bfe171c0
commit cd6abcea3b
3 changed files with 85 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/ExampleItem.vue
View File

@ -55,6 +55,20 @@ export default {
}else{ }else{
} }
},
getImageUrl(url) {
if (!url) return '';
// 如果是完整的URL（以http或https开头），去掉域名部分，转换成相对路径
if (url.startsWith('http://') || url.startsWith('https://')) {
// 提<EFBFBD><EFBFBD><EFBFBD>路径部分（去掉协议和域名）
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() { created() {
@ -76,9 +90,9 @@ export default {
<template> <template>
<div id="passageroot" class="pageroot" v-if="psginfo"> <div id="passageroot" class="pageroot" v-if="psginfo">
<div id="passagebanner" class="pagebanner"> <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"/> 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"/> v-else alt="" id="bannerimg"/>
<div id="bannercontentfill" <div id="bannercontentfill"
style="width: 100%;height: 100%; style="width: 100%;height: 100%;
@ -120,11 +134,11 @@ export default {
<div v-for="(item, index) in psginfo.images" :key="index" <div v-for="(item, index) in psginfo.images" :key="index"
class="imglistitem" class="imglistitem"
style="width: 100%; height: auto;"> 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"> <video v-else-if="item.mime.startsWith('video',0)" controls="controls">
<source :src="`${this.$axios.defaults.baseCDNURL}${item.url}`" type="video/mp4"> <source :src="getImageUrl(item.url)" type="video/mp4">
<source :src="`${this.$axios.defaults.baseCDNURL}${item.url}`" type="video/ogg"> <source :src="getImageUrl(item.url)" type="video/ogg">
<source :src="`${this.$axios.defaults.baseCDNURL}${item.url}`" type="video/webm"> <source :src="getImageUrl(item.url)" type="video/webm">
</video> </video>
</div> </div>
</div> </div>

62
src/components/ExamplesContent.vue
View File

@ -25,7 +25,7 @@
</div> </div>
</router-link> </router-link>
<router-link v-for="(item, index) in this.types" <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;"> style="text-decoration: none;">
<div class="typebar" <div class="typebar"
:class="{ active: ($route.query.type === item)}"> :class="{ active: ($route.query.type === item)}">
@ -41,14 +41,21 @@
:href="`/ExampleItem?createdAt=${item.createdAt}`" :href="`/ExampleItem?createdAt=${item.createdAt}`"
> >
<div class="listblock"> <div class="listblock">
<img :src="`${this.$axios.defaults.baseCDNURL}${item.headimage.formats.large.url}`" alt="" /> <img
<div class="itemtext"> :src="getImageUrl(item.headimage)"
<span class="upspan"> alt=""
{{item.brandname_cn}} @error="handleImageError"
</span> />
<span class="downspan">
{{item.projectname_cn}} <div id="itemon">
</span> <div class="itemtext">
<span class="upspan">
{{item.brandname_cn}}
</span>
<span class="downspan">
{{item.projectname_cn}}
</span>
</div>
</div> </div>
</div> </div>
</a> </a>
@ -80,10 +87,10 @@ export default {
if (Array.isArray(resp)) { if (Array.isArray(resp)) {
this.types = resp; this.types = resp;
if (this.types.length === 0) { if (this.types.length === 0) {
this.error = "返回的数组为空"; this.error = "返回的数组为<EFBFBD><EFBFBD><EFBFBD>";
} }
} else { } else {
this.error = "返回的数据不是数组"; this.error = "返回的<EFBFBD><EFBFBD><EFBFBD>据不是数组";
this.types = []; 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'; reqarg='/api/examples?fields=id,brandname_cn,projectname_cn,createdAt&populate=headimage&filters[example_type]='+type+'&sort=createdAt:desc';
} }
if (this.$route.name != 'Examples'){ 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) axios.get(reqarg)
.then(response =>{ .then(response =>{
@ -134,6 +141,24 @@ export default {
.finally(() => { .finally(() => {
this.isLoading = false; 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() { mounted() {
@ -155,6 +180,16 @@ export default {
<style scoped lang="scss"> <style scoped lang="scss">
@import "src/publicstyle.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{ #listmain{
display: grid; display: grid;
@include media-breakpoint-between(xs, md) { @include media-breakpoint-between(xs, md) {
@ -188,6 +223,9 @@ export default {
} }
} }
.listblock img { .listblock img {
position: absolute;
top: 0;
left: 0;
z-index: 0; z-index: 0;
@include media-breakpoint-between(xs, md){ @include media-breakpoint-between(xs, md){
width: 100%; width: 100%;

16
src/components/Tools/Partners.vue
View File

@ -9,7 +9,7 @@
<div v-for="item in logos" <div v-for="item in logos"
class="partneritempanel" id="ptn01"> class="partneritempanel" id="ptn01">
<div class="partnerlogodiv"> <div class="partnerlogodiv">
<img :src="`${this.$axios.defaults.baseCDNURL}${item.url}`" alt="" /> <img :src="getImageUrl(item.url)" alt="" />
</div> </div>
</div> </div>
</div> </div>
@ -44,6 +44,20 @@ export default {
console.error(err); console.error(err);
this.logos = []; 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() { mounted() {