From bae56a147be85be57ad1c64e9766c9aca750d187 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期二, 04 三月 2025 16:04:12 +0800
Subject: [PATCH] 2025-03-04
---
src/views/successCase/caseDetail.vue | 132 ++++++++++++++++++++++++++++++-------------
1 files changed, 92 insertions(+), 40 deletions(-)
diff --git a/src/views/successCase/caseDetail.vue b/src/views/successCase/caseDetail.vue
index 69996fd..561133a 100644
--- a/src/views/successCase/caseDetail.vue
+++ b/src/views/successCase/caseDetail.vue
@@ -2,21 +2,20 @@
<div class="main">
<div class="banner">
<img :src="url" alt="">
- <!-- <img :src="url" alt="" class="m_hide">
- <img src="../../img/gongchang.png" alt="" class="p_hide"> -->
</div>
- <div class="wrapper caseDetail" v-for="(item, index) in details" :key="index">
+ <div class="wrapper caseDetail" :class="item.TypeCharOne === 'Wico' && !item.Title1 && 'nomargin'" v-for="(item, index) in details" :key="index">
<div v-if="item.TypeCharOne === 'WLongText'">
- <div class="content_title"><span v-text="item.Title1"></span></div>
- <div class="content_title_p" style="margin: .4rem auto .1rem;" v-for="(text, i) in item.texts" :key="i" v-text="text">
+ <div class="content_title"><span v-if="item.Title1" v-text="item.Title1"></span></div>
+ <div v-for="(cell, i) in item.subs" :key="i">
+ <div class="content_title_p" v-if="cell.type === 'text'" style="margin: .1rem auto .1rem;" :style="!i && 'margin-top: 0.4rem;'" v-text="cell.value"></div>
+ <div class="content-img" v-else-if="cell.type === 'img'"><img :src="cell.value" alt=""></div>
</div>
- <div class="content-img"><img :src="item.url" alt=""></div>
</div>
<div class="p_backg" v-if="item.TypeCharOne === 'Wico'">
<div class="wrapper">
- <div class="project" style="padding: 0.2rem 0 0.3rem;">
- <h3><span v-text="item.Title1"></span></h3>
+ <div class="project">
+ <h3 :class="!item.Title1 && 'noborder'"><span v-if="item.Title1" v-text="item.Title1"></span></h3>
<div class="program">
<dl v-for="(cell, i) in item.DOne" :key="i">
<dt><img :src="cell.Images" alt=""></dt>
@@ -31,7 +30,7 @@
</div>
<div class="wrapper" v-if="item.TypeCharOne === 'Wcontent'">
<div class="content-box">
- <h3><span v-text="item.Title1"></span></h3>
+ <h3><span v-if="item.Title1" v-text="item.Title1"></span></h3>
<ul class="scene">
<li style="margin-bottom: 0.2rem;" v-for="(cell, i) in item.DOne" :key="i">
<img :src="cell.Images" alt="">
@@ -42,7 +41,7 @@
</div>
<div class="wrapper" style="margin-bottom: 0.3rem;" v-if="item.TypeCharOne === 'Wimages'">
<div class="content-bottom">
- <h3 class="h3"><span v-text="item.Title1"></span></h3>
+ <h3 class="h3"><span v-if="item.Title1" v-text="item.Title1"></span></h3>
</div>
<div class="partner">
<div v-for="(cell, i) in item.DOne" :key="i">
@@ -50,11 +49,6 @@
</div>
</div>
</div>
- <!-- <div class="three_box p_hide" v-if="item.TypeCharOne === 'Wimages'">
- <div><img src="../../img/he1.png" alt=""></div>
- <div><img src="../../img/he2.png" alt=""></div>
- <div><img src="../../img/he3.png" alt=""></div>
- </div> -->
<!-- <div class="title">
<a class="m_hide" style="visibility: hidden;">浜嗚В鏇村</a>
<a class="title-m">鏌ョ湅鏇村</a>
@@ -90,23 +84,32 @@
},
methods: {
jumpmenu (menu) {
- this.$router.push({name: menu.PageType.toLowerCase(), params: {menuId: menu.ID}})
+ let _menuId = menu.ID
+ _menuId = _menuId + '.html'
+
+ this.$router.push({name: menu.PageType.toLowerCase(), params: {menuId: _menuId}})
},
load () {
let param = {
func: 'Web_productCenter_GetData',
- ID: this.menuId
+ ID: this.menuId.replace('.html', '')
}
this.Service.getParamData(param).then(res => {
this.url = res.Image1
this.details = res.Detail.map(item => {
if (item.TypeCharOne === 'WLongText') {
- item.texts = []
+ item.subs = []
item.DOne.forEach(cell => {
if (cell.LongText) {
- item.texts.push(cell.LongText)
+ item.subs.push({
+ type: 'text',
+ value: cell.LongText
+ })
} else if (cell.Images) {
- item.url = cell.Images
+ item.subs.push({
+ type: 'img',
+ value: cell.Images
+ })
}
})
}
@@ -160,6 +163,9 @@
margin: 0;
width: 100%;
}
+.project {
+ padding: 0.2rem 0 0.3rem;
+}
h3 {
font-size: 0.16rem;
color: #3A3A3C;
@@ -181,10 +187,13 @@
margin: .4rem auto 0;
}
@media (max-width: 750px) and (min-width: 0){
- .banner img {
- max-width: none;
- width: 140%;
- margin-left: -20%;
+ .banner {
+ margin-top: 1.13rem;
+ img {
+ max-width: none;
+ width: 140%;
+ margin-left: -20%;
+ }
}
.three_box{
margin: 0.4rem 0.3rem 0.8rem;
@@ -219,25 +228,28 @@
top: 0.05rem;
left: calc(50% - 0.85rem);
}
-
+ h3.noborder::after {
+ content: none;
+ }
+ h3.noborder {
+ margin: 0;
+ }
.content_title_p {
color: #3e3e3e;
- font-size: .16rem;
margin: 0 auto !important;
- font-size:0.24rem;
- font-family:PingFang-SC-Regular;
- font-weight:400;
- color:rgba(62,62,62,1);
- line-height:0.44rem;
+ font-size: 0.26rem;
+ font-family: PingFang-SC-Regular;
+ font-weight: 400;
+ color: rgba(62,62,62,1);
+ line-height: 0.44rem;
}
.content_title,.content_title_p{
width: 100%;
box-sizing: border-box;
- padding: 0.6rem .43rem 0;
+ padding: 0.2rem .43rem 0;
}
- .content-img{
+ .content-img {
width: 100%;
- height: 3.5rem;
}
.project{
background: #f9f9f9;
@@ -250,16 +262,33 @@
display: flex;
padding: .34rem 0;
dl {
- width: 25%;
+ flex: 1;
dt {
- width: .94rem;
- height: .94rem;
+ width: .8rem;
+ height: .8rem;
margin: 0 auto;
+ img {
+ width: 100%;
+ height: 100%;
+ }
}
dd {
text-align: center;
padding-top: .07rem;
+ p {
+ font-size: 0.26rem;
+ }
}
+ }
+ }
+ }
+ .caseDetail.nomargin {
+ margin-top: 0;
+ .project {
+ padding-top: 0;
+ margin-top: -0.1rem;
+ .program {
+ margin-top: 0;
}
}
}
@@ -345,12 +374,23 @@
.partner div:last-child {
padding-right: 0;
}
+ .scene {
+ li p {
+ font-size: 0.26rem;
+ }
+ }
}
@media (min-width: 751px){
h3 {
span {
padding-left: 0.2rem;
}
+ }
+ h3.noborder::after {
+ content: none;
+ }
+ h3.noborder {
+ margin: 0;
}
.partner {
display: flex;
@@ -397,6 +437,15 @@
line-height: .22rem;
width: 11.92rem;
margin: 0 auto;
+ }
+ }
+ .caseDetail.nomargin {
+ margin-top: 0rem;
+ .project {
+ padding-top: 0px;
+ .program {
+ margin-top: 0;
+ }
}
}
.project {
@@ -465,7 +514,7 @@
.content-img {
width: 12.32rem;
height: auto;
- margin-top: 0.8rem;
+ margin-top: 0.4rem;
}
.program {
width: 100%;
@@ -473,14 +522,17 @@
display: flex;
margin: .2rem 0;
dl {
- margin-right: .8rem;
+ flex: 1;
dt {
width: .94rem;
height: .94rem;
margin: 0 auto;
+ img {
+ width: 100%;
+ height: 100%;
+ }
}
dd {
- width: 1.8rem;
text-align: center;
padding-top: .07rem;
}
--
Gitblit v1.8.0