|
|
|
|
@ -65,9 +65,9 @@
|
|
|
|
|
</div> |
|
|
|
|
<div class="our-serve"> |
|
|
|
|
<div class="serve-left"> |
|
|
|
|
<div class="servr-text">{{firstServe}}</div> |
|
|
|
|
<div class="servr-text">{{firstServe[0]}}</div> |
|
|
|
|
<div class="servr-text-grey"> |
|
|
|
|
{{secServe}} |
|
|
|
|
{{firstServe[1]}} |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="serve-right"> |
|
|
|
|
@ -82,8 +82,8 @@
|
|
|
|
|
</div> |
|
|
|
|
<!-- fuwu--> |
|
|
|
|
<div class="khfw" id='3'> |
|
|
|
|
<div class="khfw-list" v-for="(item,index) in solve" :style="{ backgroundImage:`url(${getImgUrl(item.image)})`}" |
|
|
|
|
:key="index"> |
|
|
|
|
<div class="khfw-list" v-for="(item,index) in solve" |
|
|
|
|
:style="{ backgroundImage:`url(${getImgUrl(item.image)})`}" :key="index"> |
|
|
|
|
<img class="khfw-icon" :src="getImgUrl(item.background)" /> |
|
|
|
|
<div class="line-khfw"></div> |
|
|
|
|
<div class="khfw-title">{{item.title}}</div> |
|
|
|
|
@ -95,8 +95,8 @@
|
|
|
|
|
<div class="line-fwal"></div> |
|
|
|
|
<p class="fwmw-text">{{contentInfo.ServiceCase?contentInfo.ServiceCase.introduce:''}}</p> |
|
|
|
|
<div class="ywfw-ul"> |
|
|
|
|
<div class="ywfw-tag" :class="fwfwIndex==index?'ywfw-tag-act':'ywfw-tag'" @click="checkTag(index,item.id)" |
|
|
|
|
v-for="(item,index) in ywfwList" :key="index">{{item.title}}</div> |
|
|
|
|
<div class="ywfw-tag" :class="fwfwIndex==index?'ywfw-tag-act':'ywfw-tag'" |
|
|
|
|
@click="checkTag(index,item.id)" v-for="(item,index) in ywfwList" :key="index">{{item.title}}</div> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<!-- <div class="case-ul"> |
|
|
|
|
@ -106,13 +106,24 @@
|
|
|
|
|
<p class="case-indrouce">{{item.introduce}}</p> |
|
|
|
|
</div> |
|
|
|
|
</div> --> |
|
|
|
|
<transition-group name="list-complete" tag="ul" v-bind:class="'case-ul'"> |
|
|
|
|
<li class="case-list" v-for="item in caseList" :key="item.name"> |
|
|
|
|
<transition-group name="flip-list" tag="ul" v-bind:class="'case-ul'"> |
|
|
|
|
<li class="case-list" @mousemove="caseMove(item.id)" @mouseleave="caseOut" v-for="item in caseList" |
|
|
|
|
:key="item.name"> |
|
|
|
|
<img class="case-img" :src="getImgUrl(item.image)" /> |
|
|
|
|
<div class="case-list-act"> |
|
|
|
|
<!-- <viewer :images="item.imgShow"> |
|
|
|
|
<img v-for="(src,index) in item.imgShow" |
|
|
|
|
:src="item" |
|
|
|
|
:key="index"> |
|
|
|
|
</viewer> --> |
|
|
|
|
<transition name="fade" mode="out-in"> |
|
|
|
|
<div v-if="caseIds==item.id" class="case-list-act"> |
|
|
|
|
<div class="center-text"> |
|
|
|
|
<img v-if="item.imgShow" class="see-img" src="../assets/jia.png" /> |
|
|
|
|
<div class="case-name">{{item.name}}</div> |
|
|
|
|
<p class="case-indrouce">{{item.introduce}}</p> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</transition> |
|
|
|
|
</li> |
|
|
|
|
</transition-group> |
|
|
|
|
</div> |
|
|
|
|
@ -164,12 +175,12 @@
|
|
|
|
|
<p class="fwmw-text">{{team.introduce}}</p> |
|
|
|
|
<div v-if="team.content"> |
|
|
|
|
<div class="s-content2"> |
|
|
|
|
<div class="member-list" @mouseover="teamMove(index)" @mouseout="teamOut" style="position: relative;" |
|
|
|
|
v-for="(item,index) in team.content" :key="index"> |
|
|
|
|
<div class="member-list" @mouseover="teamMove(index)" @mouseout="teamOut" |
|
|
|
|
style="position: relative;" v-for="(item,index) in team.content" :key="index"> |
|
|
|
|
<img class="member-img" :src="getImgUrl(item.avatar)" /> |
|
|
|
|
<div class="member-name">{{item.name}}</div> |
|
|
|
|
<div class="member-zhiwei">{{item.position}}</div> |
|
|
|
|
<transition name="fade" mode="out-in"> |
|
|
|
|
<transition name="fade"> |
|
|
|
|
<div class="hovers" v-if="memberIds==index"> |
|
|
|
|
<div class="menmber-indroce">{{item.introduce}}</div> |
|
|
|
|
</div> |
|
|
|
|
@ -243,8 +254,8 @@
|
|
|
|
|
<div class="foot-line"></div> |
|
|
|
|
<div class="foot-dow"> |
|
|
|
|
<div class="foot-dow-ul"> |
|
|
|
|
<div class="foot-dow-list" v-for="(item,index) in menuList" :key="index"><a style="color: white;" |
|
|
|
|
:href="'#'+item.id"> |
|
|
|
|
<div class="foot-dow-list" v-for="(item,index) in menuList" :key="index"><a |
|
|
|
|
style="color: white;" :href="'#'+item.id"> |
|
|
|
|
{{item.title}} |
|
|
|
|
</a></div> |
|
|
|
|
<!-- <div class="foot-dow-list">联系我们</div> --> |
|
|
|
|
@ -286,12 +297,15 @@
|
|
|
|
|
import "swiper/dist/css/swiper.css"; |
|
|
|
|
import Vue from 'vue'; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
export default { |
|
|
|
|
name: "home", |
|
|
|
|
|
|
|
|
|
components: { |
|
|
|
|
swiper, |
|
|
|
|
swiperSlide |
|
|
|
|
swiperSlide, |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
data() { |
|
|
|
|
@ -322,7 +336,9 @@
|
|
|
|
|
description: "", |
|
|
|
|
keyword: "", |
|
|
|
|
phone: '', |
|
|
|
|
memberIds: -1 |
|
|
|
|
memberIds: -1, |
|
|
|
|
caseIds: -1, |
|
|
|
|
preImg:[] |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
@ -448,7 +464,8 @@
|
|
|
|
|
this.contentInfo = res.data.data |
|
|
|
|
this.bannerList = this.contentInfo.banner.content |
|
|
|
|
this.service = this.contentInfo.service |
|
|
|
|
this.firstServe = this.service.introduce.substr(0, 70) |
|
|
|
|
this.firstServe = this.service.introduce.split('\n') |
|
|
|
|
console.log("ssssddffg",this.firstServe); |
|
|
|
|
this.secServe = this.service.introduce.substr(71, this.service.introduce.length - 1) |
|
|
|
|
this.solve = this.contentInfo.solve.content |
|
|
|
|
//this.caseList=this.contentInfo.ServiceCase.content |
|
|
|
|
@ -457,19 +474,31 @@
|
|
|
|
|
this.team = this.contentInfo.team |
|
|
|
|
this.partner = this.contentInfo.Partner |
|
|
|
|
this.honor = this.contentInfo.Honor |
|
|
|
|
|
|
|
|
|
this.caseList = this.contentInfo.ServiceCase.content.filter(item => { |
|
|
|
|
return item.type.includes(this.checkCaseId) |
|
|
|
|
}) |
|
|
|
|
this.caseList.filter(item => { |
|
|
|
|
this.imgsArr.push(this.host + item.image) |
|
|
|
|
|
|
|
|
|
this.caseList.map((item, i) => { |
|
|
|
|
item.id = i |
|
|
|
|
|
|
|
|
|
if(item.item_show!=''&&item.item_show.length!=0){ |
|
|
|
|
console.log("you"); |
|
|
|
|
let newStr='' |
|
|
|
|
newStr=item.item_show |
|
|
|
|
item.imgShow=newStr.split(",") |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
else{ |
|
|
|
|
console.log("没有"); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
}) |
|
|
|
|
// for(let i in caseTag){ |
|
|
|
|
// this.ywfwList.push({[i]:caseTag[i]}) |
|
|
|
|
// } |
|
|
|
|
//this.ywfwList=Array.from(caseTag) |
|
|
|
|
//this.ywfwList=this.contentInfo.ServiceCase.type_map |
|
|
|
|
console.log("选项卡1", this.imgsArr); |
|
|
|
|
console.log("选项卡1", this.caseList); |
|
|
|
|
console.log("选项卡id", this.checkCaseId); |
|
|
|
|
}, err => { |
|
|
|
|
console.log(err); |
|
|
|
|
@ -497,9 +526,29 @@
|
|
|
|
|
setTimeout(() => { |
|
|
|
|
this.flag = true; |
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
this.caseList = this.contentInfo.ServiceCase.content.filter(item => { |
|
|
|
|
return item.type.includes(this.checkCaseId) |
|
|
|
|
}) |
|
|
|
|
this.caseList.map((item, i) => { |
|
|
|
|
item.id = i |
|
|
|
|
|
|
|
|
|
if(item.item_show!=''&&item.item_show.length!=0){ |
|
|
|
|
|
|
|
|
|
let newStr='' |
|
|
|
|
newStr=item.item_show |
|
|
|
|
item.imgShow=newStr.split(",") |
|
|
|
|
} |
|
|
|
|
else{ |
|
|
|
|
console.log("没有"); |
|
|
|
|
} |
|
|
|
|
console.log("you11",this.caseList); |
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
show() { |
|
|
|
|
const viewer = this.$el.querySelector('.images').$viewer |
|
|
|
|
viewer.show() |
|
|
|
|
}, |
|
|
|
|
teamMove(index) { |
|
|
|
|
this.memberIds = index |
|
|
|
|
@ -507,6 +556,12 @@
|
|
|
|
|
teamOut() { |
|
|
|
|
this.$set(this, 'memberIds', -1) |
|
|
|
|
}, |
|
|
|
|
caseMove(id) { |
|
|
|
|
this.caseIds = id |
|
|
|
|
}, |
|
|
|
|
caseOut() { |
|
|
|
|
this.$set(this, 'caseIds', -1) |
|
|
|
|
}, |
|
|
|
|
checkMenu(selector, index) { |
|
|
|
|
this.activeBtn = index; |
|
|
|
|
// document.querySelector("#app-root").scrollTop = this.$el.querySelector(selector).offsetTop; |
|
|
|
|
|
