|
@@ -1,7 +1,10 @@
|
|
|
<template>
|
|
|
<div class="sxz-container">
|
|
|
<div class="banner">
|
|
|
- <div class="container" v-html="$t('conduct.sxz.bannerTitle')"></div>
|
|
|
+ <div class="container">
|
|
|
+ <h1>{{ $t('conduct.sxz.bannerTitle') }}<a target="_blank" href="https://sxz.4dkankan.com">{{ $t('home.bannerMoreBtn') }}</a></h1>
|
|
|
+ <h4 class="sub-title">{{ $t('conduct.sxz.bannerSubTitle') }}</h4>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div class="plate-w" ref="homeLayout">
|
|
|
<div class="plate item" v-for="(item,i) in sequenceArr" :key="i">
|
|
@@ -21,7 +24,6 @@
|
|
|
<h2 class="common-title">{{ cases.name }}</h2>
|
|
|
<ul class="case-list">
|
|
|
<li v-for="item in cases.list" :key="item.link" :style="{'background-image': `url(${item.img})`}" @click="toLink(item.link)">
|
|
|
- <h2>{{ item.name }}</h2>
|
|
|
</li>
|
|
|
</ul>
|
|
|
</div>
|
|
@@ -42,7 +44,7 @@ export default {
|
|
|
return {
|
|
|
sequenceArr: [
|
|
|
{
|
|
|
- name: this.$t('conduct.sxz.itemTitle3'),
|
|
|
+ name: this.$t('conduct.sxz.itemTitle1'),
|
|
|
img: require('@/assets/images/core-products/sxz/item-1.png'),
|
|
|
runAnimation: true
|
|
|
},
|
|
@@ -52,12 +54,12 @@ export default {
|
|
|
runAnimation: true
|
|
|
},
|
|
|
{
|
|
|
- name: this.$t('conduct.sxz.itemTitle4'),
|
|
|
+ name: this.$t('conduct.sxz.itemTitle3'),
|
|
|
img: [require('@/assets/images/core-products/sxz/r06_s.jpeg'), require('@/assets/images/core-products/sxz/r06.jpeg')],
|
|
|
runAnimation: true
|
|
|
},
|
|
|
{
|
|
|
- name: this.$t('conduct.sxz.itemTitle5'),
|
|
|
+ name: this.$t('conduct.sxz.itemTitle4'),
|
|
|
iframeLink: '//www.4dkankan.com/decor.html?m=t-V7Wsf2Y&m2=vr-t-V7Wsf2Y-011',
|
|
|
runAnimation: true
|
|
|
}
|
|
@@ -67,24 +69,19 @@ export default {
|
|
|
list: [
|
|
|
{
|
|
|
name: '轻奢三房',
|
|
|
- img: require('@/assets/images/core-products/sxz/case1.png'),
|
|
|
- link: 'https://test.4dkankan.com/spc.html?m=vr-t-5JCEMWu-003'
|
|
|
- },
|
|
|
- {
|
|
|
- name: '轻奢三房',
|
|
|
- img: require('@/assets/images/core-products/sxz/case2.png'),
|
|
|
- link: 'https://www.4dkankan.com/spc.html?m=vr-t-V7Wsf2Y-011'
|
|
|
- },
|
|
|
- {
|
|
|
- name: '轻奢三房',
|
|
|
- img: require('@/assets/images/core-products/sxz/case3.png'),
|
|
|
+ img: require('@/assets/images/core-products/sxz/case-1.png'),
|
|
|
link: 'https://www.4dkankan.com/spc.html?m=vr-t-nn57rQe-039'
|
|
|
},
|
|
|
{
|
|
|
name: '轻奢三房',
|
|
|
- img: require('@/assets/images/core-products/sxz/case4.png'),
|
|
|
+ img: require('@/assets/images/core-products/sxz/case-2.png'),
|
|
|
link: 'https://www.4dkankan.com/spc.html?m=vr-t-g9Ob6XN-069'
|
|
|
},
|
|
|
+ {
|
|
|
+ name: '轻奢三房',
|
|
|
+ img: require('@/assets/images/core-products/sxz/case-3.png'),
|
|
|
+ link: 'https://test.4dkankan.com/spc.html?m=vr-t-5JCEMWu-003'
|
|
|
+ }
|
|
|
]
|
|
|
}
|
|
|
}
|
|
@@ -120,10 +117,36 @@ export default {
|
|
|
font-size: 40px;
|
|
|
margin-bottom: 0;
|
|
|
line-height: 56px;
|
|
|
+ padding: 160px 0;
|
|
|
.container {
|
|
|
- display: flex;
|
|
|
align-items: center;
|
|
|
}
|
|
|
+ h1 {
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 40px;
|
|
|
+ a {
|
|
|
+ color: #909090;
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 20px;
|
|
|
+ margin-left: 25px;
|
|
|
+ cursor: pointer;
|
|
|
+ position: relative;
|
|
|
+ display: inline-block;
|
|
|
+ &::after {
|
|
|
+ content: '';
|
|
|
+ display: block;
|
|
|
+ width: 100%;
|
|
|
+ height: 1px;
|
|
|
+ background: #909090;
|
|
|
+ margin-top: 1px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .sub-title {
|
|
|
+ font-size: 20px;
|
|
|
+ margin-top: 20px;
|
|
|
+ font-weight: 400;
|
|
|
+ }
|
|
|
}
|
|
|
.item {
|
|
|
padding: 110px 0 0;
|
|
@@ -150,7 +173,7 @@ export default {
|
|
|
display: flex;
|
|
|
li {
|
|
|
flex: 1;
|
|
|
- height: 453px;
|
|
|
+ height: 255px;
|
|
|
margin-right: 20px;
|
|
|
font-size: 24px;
|
|
|
color: #202020;
|