Bladeren bron

feat:增加随心装的页面

xzh 4 jaren geleden
bovenliggende
commit
8696428eed

BIN
pc/src/assets/images/core-products/sxz/banner.png


BIN
pc/src/assets/images/core-products/sxz/item-1.png


BIN
pc/src/assets/images/core-products/sxz/item-2.png


BIN
pc/src/assets/images/core-products/sxz/item-3.png


+ 115 - 0
pc/src/page/coreProducts/sxz.vue

@@ -0,0 +1,115 @@
+<template>
+  <div class="sxz-container">
+    <div class="banner">
+      <div class="container" v-html="`随心装 . 快速打造心中家的模样`"></div>
+    </div>
+    <div class="plate-w" ref="homeLayout">
+      <div class="plate item" v-for="(item,i) in sequenceArr" :key="i">
+        <div class="container">
+          <h2 class="common-title">{{item.name}}</h2>
+          <img  :src="item.img" />
+        </div>
+      </div>
+    </div>
+    
+  </div>
+</template>
+
+<script>
+import { getPosition } from '@/util'
+import { mapState } from 'vuex'
+import sequence from '@/components/sequence'
+export default {
+  data () {
+    return {
+      sequenceArr: [
+        {
+          name: this.$t('conduct.conductHouse.itemTitle1'),
+          img: require('@/assets/images/core-products/sxz/item-1.png'),
+          runAnimation: true
+        },
+        {
+          name: this.$t('conduct.conductHouse.itemTitle2'),
+          img: require('@/assets/images/core-products/sxz/item-2.png'),
+          runAnimation: true
+        },
+        {
+          name: this.$t('conduct.conductHouse.itemTitle3'),
+          img: require('@/assets/images/core-products/sxz/item-3.png'),
+          runAnimation: true
+        },
+        {
+          name: '快速打造线上3D家装效果,让人工智能真正服务于生活',
+          img: require('@/assets/images/core-products/sxz/item-3.png'),
+          runAnimation: true
+        }
+      ],
+    }
+  },
+  computed: {
+    ...mapState({
+      language: state => state.language.current
+    })
+  },
+  components: {
+    sequence
+  },
+  mounted () {
+    const ISZH = this.language === 'zh'
+  },
+  destroyed () {
+  },
+}
+</script>
+<style lang="scss">
+.sxz-container {
+  .banner {
+    width: 100%;
+    height: 420px;
+    background: url(~@/assets/images/core-products/sxz/banner.png) no-repeat center center;
+    font-size: 40px;
+    margin-bottom: 0;
+    line-height: 56px;
+    .container {
+      display: flex;
+      align-items: center;
+    }
+  }
+  .item {
+    padding: 110px 0 0;
+    img {
+      
+    }
+  }
+  .boom {
+    height: 530px;
+  }
+  .common-title {
+    margin-top: 0;
+    margin-bottom: 50px;
+    font-size: 30px;
+  }
+  .sub-list {
+    li {
+      display: inline-block;
+      vertical-align: middle;
+      text-align: center;
+      width: 412px;
+      margin-right: 20px;
+      padding-bottom: 70px;
+      img {
+        width: 100%;
+        height: 255px;
+      }
+      &:last-child {
+        margin-right: 0;
+      }
+    }
+  }
+  .plate-w {
+    margin-bottom: 110px;
+  }
+}
+
+
+</style>

+ 5 - 0
pc/src/router/index.js

@@ -23,6 +23,11 @@ let router = new Router({
           component: resolve => require(['@/page/coreProducts'], resolve)
         },
         {
+          path: '/sxz',
+          name: 'sxz',
+          component: resolve => require(['@/page/coreProducts/sxz'], resolve)
+        },
+        {
           path: '/about',
           name: 'about',
           component: resolve => require(['@/page/about'], resolve)