From 14e2083f8d8e33ee95395ef00f7e3b0b35adad91 Mon Sep 17 00:00:00 2001
From: yujialong <479214531@qq.com>
Date: Fri, 7 Jul 2023 14:30:52 +0800
Subject: [PATCH] =?UTF-8?q?=E8=87=AA=E7=94=B1=E7=94=B5=E5=AD=90=E6=BF=80?=
 =?UTF-8?q?=E5=85=89=E6=A0=87=E9=A2=98=E6=94=B9=E6=88=90=E5=AF=8C=E6=96=87?=
 =?UTF-8?q?=E6=9C=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/deviceIntroBeam/index.vue    |   2 +-
 src/pages/deviceIntroLayout/index.vue  |   2 +-
 src/pages/deviceIntroLinear/index.vue  |   3 +-
 src/pages/exp/index.vue                | 816 +++++++++++----------
 src/pages/overviewDevHistory/index.vue |   3 +-
 src/pages/overviewIntro/index.vue      |   6 +-
 src/pages/overviewSetup/index.vue      |   2 +-
 src/pages/talent/index.vue             | 956 +++++++++++++------------
 src/pages/userSharing/index.vue        | 839 +++++++++++-----------
 9 files changed, 1350 insertions(+), 1279 deletions(-)

diff --git a/src/pages/deviceIntroBeam/index.vue b/src/pages/deviceIntroBeam/index.vue
index 0f0219f..3bb77cd 100644
--- a/src/pages/deviceIntroBeam/index.vue
+++ b/src/pages/deviceIntroBeam/index.vue
@@ -17,7 +17,7 @@
     </el-carousel>
 
     <div class="block share">
-      <h6>{{ modules[1].form.title }}</h6>
+      <h6 v-html="modules[1].form.title"></h6>
       <p class="en"
          v-html="modules[1].form.des"></p>
       <div class="sum">{{ modules[2].form.title }}</div>
diff --git a/src/pages/deviceIntroLayout/index.vue b/src/pages/deviceIntroLayout/index.vue
index e2c5d57..2be18f5 100644
--- a/src/pages/deviceIntroLayout/index.vue
+++ b/src/pages/deviceIntroLayout/index.vue
@@ -18,7 +18,7 @@
 
     <div class="block share">
       <div class="inner">
-        <h6>{{ modules[1].form.title }}</h6>
+        <h6 v-html="modules[1].form.title"></h6>
         <p class="en">{{ modules[1].form.subTitle }}</p>
         <div class="card"
              v-html="modules[1].form.des"></div>
diff --git a/src/pages/deviceIntroLinear/index.vue b/src/pages/deviceIntroLinear/index.vue
index 7ce300f..03882d7 100644
--- a/src/pages/deviceIntroLinear/index.vue
+++ b/src/pages/deviceIntroLinear/index.vue
@@ -18,7 +18,8 @@
 
     <div class="block history gray">
       <div class="inner">
-        <h2 class="wow fadeInLeft">{{ modules[1].form.title }}</h2>
+        <h2 class="wow fadeInLeft"
+            v-html="modules[1].form.title"></h2>
         <p class="en"
            v-html="modules[1].form.des"></p>
         <div class="texts wow fadeInDown"
diff --git a/src/pages/exp/index.vue b/src/pages/exp/index.vue
index 88cb78d..b3d713b 100644
--- a/src/pages/exp/index.vue
+++ b/src/pages/exp/index.vue
@@ -1,10 +1,15 @@
 <template>
   <div class="wrap">
-    <el-carousel :interval="6000" :arrow="(modules[0] && modules[0].list.filter(e => e.isEnable).length > 1) ? 'hover' : 'never'" :indicator-position="modules[0].list.filter(e => e.isEnable).length > 1 ? '' : 'none'">
+    <el-carousel :interval="6000"
+                 :arrow="(modules[0] && modules[0].list.filter(e => e.isEnable).length > 1) ? 'hover' : 'never'"
+                 :indicator-position="modules[0].list.filter(e => e.isEnable).length > 1 ? '' : 'none'">
       <template v-for="(item, i) in modules[0].list">
-        <el-carousel-item v-if="item.pic && item.isEnable" :key="i">
-          <div :class="['banner-item', {'cursor-pointer': isLink(item.link.linkName)}]" @click="openLink(item)">
-            <img :src="item.pic" alt="">
+        <el-carousel-item v-if="item.pic && item.isEnable"
+                          :key="i">
+          <div :class="['banner-item', {'cursor-pointer': isLink(item.link.linkName)}]"
+               @click="openLink(item)">
+            <img :src="item.pic"
+                 alt="">
             <p class="banner-name">{{ item.title }}</p>
           </div>
         </el-carousel-item>
@@ -13,42 +18,67 @@
 
     <div class="block station">
       <div class="inner">
-        <h6 class="wow fadeInUp">{{ modules[1].form.title }}</h6>
-        <p class="en wow fadeInUp" data-wow-delay="0.5s">{{ modules[1].form.subTitle }}</p>
-        <div v-if="modules[1].form.pic" class="text-center">
-          <video v-if="Util.isVideo(modules[1].form.mediaType)" class="pic" ref="video" autoplay controls loop>
-            <source :src="modules[1].form.pic" type="video/mp4">
+        <h6 class="wow fadeInUp"
+            v-html="modules[1].form.title"></h6>
+        <p class="en wow fadeInUp"
+           data-wow-delay="0.5s">{{ modules[1].form.subTitle }}</p>
+        <div v-if="modules[1].form.pic"
+             class="text-center">
+          <video v-if="Util.isVideo(modules[1].form.mediaType)"
+                 class="pic"
+                 ref="video"
+                 autoplay
+                 controls
+                 loop>
+            <source :src="modules[1].form.pic"
+                    type="video/mp4">
             您的浏览器不支持 video 标签。
           </video>
-          <img v-else class="pic" :src="modules[1].form.pic" alt="">
+          <img v-else
+               class="pic"
+               :src="modules[1].form.pic"
+               alt="">
         </div>
-        <div class="des" v-html="modules[1].form.des"></div>
+        <div class="des"
+             v-html="modules[1].form.des"></div>
       </div>
     </div>
 
     <ul class="list">
-      <li :class="['item1', {'cursor-pointer': isLink(modules[2].form.link.linkName)}]" @click="openLink(modules[2].form)">
-        <img src="@/assets/images/exp/2.png" alt="">
+      <li :class="['item1', {'cursor-pointer': isLink(modules[2].form.link.linkName)}]"
+          @click="openLink(modules[2].form)">
+        <img src="@/assets/images/exp/2.png"
+             alt="">
         <h6>{{ modules[2].form.title }}</h6>
       </li>
-      <li :class="['item2', {'cursor-pointer': isLink(modules[3].form.link.linkName)}]" @click="openLink(modules[3].form)">
-        <img src="@/assets/images/exp/3.png" alt="">
+      <li :class="['item2', {'cursor-pointer': isLink(modules[3].form.link.linkName)}]"
+          @click="openLink(modules[3].form)">
+        <img src="@/assets/images/exp/3.png"
+             alt="">
         <h6>{{ modules[3].form.title }}</h6>
       </li>
-      <li :class="['item3', {'cursor-pointer': isLink(modules[4].form.link.linkName)}]" @click="openLink(modules[4].form)">
-        <img src="@/assets/images/exp/4.png" alt="">
+      <li :class="['item3', {'cursor-pointer': isLink(modules[4].form.link.linkName)}]"
+          @click="openLink(modules[4].form)">
+        <img src="@/assets/images/exp/4.png"
+             alt="">
         <h6>{{ modules[4].form.title }}</h6>
       </li>
-      <li :class="['item4', {'cursor-pointer': isLink(modules[5].form.link.linkName)}]" @click="openLink(modules[5].form)">
-        <img src="@/assets/images/exp/5.png" alt="">
+      <li :class="['item4', {'cursor-pointer': isLink(modules[5].form.link.linkName)}]"
+          @click="openLink(modules[5].form)">
+        <img src="@/assets/images/exp/5.png"
+             alt="">
         <h6>{{ modules[5].form.title }}</h6>
       </li>
-      <li :class="['item5', {'cursor-pointer': isLink(modules[6].form.link.linkName)}]" @click="openLink(modules[6].form)">
-        <img src="@/assets/images/exp/6.png" alt="">
+      <li :class="['item5', {'cursor-pointer': isLink(modules[6].form.link.linkName)}]"
+          @click="openLink(modules[6].form)">
+        <img src="@/assets/images/exp/6.png"
+             alt="">
         <h6>{{ modules[6].form.title }}</h6>
       </li>
-      <li :class="['item6', {'cursor-pointer': isLink(modules[7].form.link.linkName)}]" @click="openLink(modules[7].form)">
-        <img src="@/assets/images/exp/7.png" alt="">
+      <li :class="['item6', {'cursor-pointer': isLink(modules[7].form.link.linkName)}]"
+          @click="openLink(modules[7].form)">
+        <img src="@/assets/images/exp/7.png"
+             alt="">
         <h6>{{ modules[7].form.title }}</h6>
       </li>
     </ul>
@@ -62,18 +92,18 @@ import Util from '@/libs/util'
 import WOW from 'wow.js'
 export default {
   mixins: [mixins],
-  data() {
+  data () {
     return {
       routes: [],
       Util
     }
   },
-  mounted() {
+  mounted () {
     new WOW().init()
   },
   methods: {
     // 获取文章详情
-    getInfo() {
+    getInfo () {
       // 预览/详情
       this.$post(`${this.api[this.preview ? 'getRedisCache' : 'findPage']}?columnId=${this.id}`).then(({ data }) => {
         if (data.length) {
@@ -84,7 +114,7 @@ export default {
           this.modules = json
           console.log("🚀 ~ file: index.vue ~ line 180 ~ this.$post ~ json", json)
         }
-      }).catch(err => {})
+      }).catch(err => { })
     },
   }
 };
@@ -92,442 +122,436 @@ export default {
 
 <style lang="scss" scoped>
 @import url(../../plugins/wow/animate.css);
-@import "../../styles/page/page.scss";
-.wrap{
-  /deep/ .el-carousel {
-    height: 12.6rem;
-    .el-carousel__container{
-      height: 12.6rem;
-    }
-    img{
-      height: 12.6rem;
+@import '../../styles/page/page.scss';
+.wrap {
+    /deep/ .el-carousel {
+        height: 12.6rem;
+        .el-carousel__container {
+            height: 12.6rem;
+        }
+        img {
+            height: 12.6rem;
+        }
     }
-  }
 }
 .banner-item {
-  .banner-name {
-    font-size: 2.16rem;
-    left: 17%;
-    bottom: 20%;
-  }
-}
-.block  {
-  padding: 3.85rem 0;
-  .inner {
-    h6 {
-      font-size: 1.76rem;
+    .banner-name {
+        font-size: 2.16rem;
+        left: 17%;
+        bottom: 20%;
     }
-    .en {
-      font-size: 1.76rem;
-      margin: 0px 0 2rem;
+}
+.block {
+    padding: 3.85rem 0;
+    .inner {
+        h6 {
+            font-size: 1.76rem;
+        }
+        .en {
+            font-size: 1.76rem;
+            margin: 0px 0 2rem;
+        }
     }
-  }
 }
 .station {
-  h6 {
-    position: relative;
-    font-size: 2rem;
-    font-family: PingFangSC-Medium, PingFang SC;
-    font-weight: bold;
-    color: #333333;
-    line-height: 1;
-  }
-  .en {
-    margin-bottom: 20px;
-    font-size: 1.7rem;
-    font-family: AppleSystemUIFont;
-    color: #E4E4E4;
-    line-height: 1;
-  }
-  .pic {
-    width: 64%;
-    height: auto;
-    margin: 0 auto;
-  }
-  .des {
-    margin-top: 2.75rem;
-    font-size: .98rem;
-    color: #333;
-    line-height: 1.7rem;
-    -webkit-line-clamp: inherit;
-  }
-}
-.list {
-  display: flex;
-  flex-wrap: wrap;
-  margin-top: 1.5rem;
-  width: 1200px;
-  margin: auto;
-  li {
-    position: relative;
-    height: 20.1rem;
-    overflow: hidden;
-    &:hover {
-      img {
-        transform: scale(1.3);
-      }
+    h6 {
+        position: relative;
+        font-size: 2rem;
+        font-family: PingFangSC-Medium, PingFang SC;
+        font-weight: bold;
+        color: #333333;
+        line-height: 1;
     }
-  }
-  img {
-    width: 100%;
-    height: 100%;
-    transition: .5s;
-  }
-  h6 {
-    position: absolute;
-    top: 192px;
-    left: 60px;
-    font-size: 1.12rem;
-    font-family: PingFangSC-Medium, PingFang SC;
-    font-weight: 500;
-    color: #fff;
-  }
-  .item1, .item2 {
-    width: 25%;
-  }
-  .item3 {
-    width: 50%;
-  }
-  .item4 {
-    width: 40%;
-  }
-  .item5 {
-    width: 32%;
-  }
-  .item6 {
-    width: 28%;
-  }
-}
-
-@media (min-width: 280px) and (max-width: 768px) {
-  .wrap{
-    /deep/ .el-carousel {
-      height: 15rem;
-      .el-carousel__container{
-        height: 15rem;
-      }
-      img{
-        height: 15rem;
-      }
+    .en {
+        margin-bottom: 20px;
+        font-size: 1.7rem;
+        font-family: AppleSystemUIFont;
+        color: #e4e4e4;
+        line-height: 1;
     }
-  }
-  .station{
     .pic {
-      height: 20rem;
+        width: 64%;
+        height: auto;
+        margin: 0 auto;
     }
-  }
-  .list {
-    li {
-      height: 20rem;
-      h6 {
-        top: 5rem;
-      }
+    .des {
+        margin-top: 2.75rem;
+        font-size: 0.98rem;
+        color: #333;
+        line-height: 1.7rem;
+        -webkit-line-clamp: inherit;
     }
-  }
 }
-@media (max-width: 320px) {
-  .wrap {
-    /deep/ .el-carousel {
-      height: 13rem !important;
-    }
-    /deep/ .el-carousel__item {
-      height: 13rem !important;
-    }
-    /deep/ .el-carousel__container {
-      height: 13rem !important;
+.list {
+    display: flex;
+    flex-wrap: wrap;
+    margin-top: 1.5rem;
+    width: 1200px;
+    margin: auto;
+    li {
+        position: relative;
+        height: 20.1rem;
+        overflow: hidden;
+        &:hover {
+            img {
+                transform: scale(1.3);
+            }
+        }
     }
-  }
-  .banner-item{
     img {
-      height: 13rem !important;
-    }
-    .banner-name {
-      padding: 7rem 0 0 1rem;
-      font-size: 1.5rem;
+        width: 100%;
+        height: 100%;
+        transition: 0.5s;
     }
-  }
-  .block  {
-    padding: 2rem 0;
-    .inner {
-      width: 90%;
-      .text-center {
-        .pic {
-          width: 100%;
-          height: auto;
-        }
-      }
-     
+    h6 {
+        position: absolute;
+        top: 192px;
+        left: 60px;
+        font-size: 1.12rem;
+        font-family: PingFangSC-Medium, PingFang SC;
+        font-weight: 500;
+        color: #fff;
     }
-  }
-  .list {
-    width: 80%;
-    margin: 0 auto;
-    li {
-      margin-top: 1rem;
-      width: 100% !important;
+    .item1,
+    .item2 {
+        width: 25%;
     }
-  }
-}
-@media (min-width: 320px) and (max-width: 375px) {
-  .wrap {
-    /deep/ .el-carousel {
-      height: 13rem !important;
+    .item3 {
+        width: 50%;
     }
-    /deep/ .el-carousel__item {
-      height: 13rem !important;
+    .item4 {
+        width: 40%;
     }
-    /deep/ .el-carousel__container {
-      height: 13rem !important;
+    .item5 {
+        width: 32%;
     }
-  }
-  .banner-item{
-    img {
-      height: 13rem !important;
+    .item6 {
+        width: 28%;
     }
-    .banner-name {
-      padding: 7rem 0 0 1rem;
-      font-size: 1.5rem;
+}
+
+@media (min-width: 280px) and (max-width: 768px) {
+    .wrap {
+        /deep/ .el-carousel {
+            height: 15rem;
+            .el-carousel__container {
+                height: 15rem;
+            }
+            img {
+                height: 15rem;
+            }
+        }
     }
-  }
-  .block  {
-    padding: 2rem 0;
-    .inner {
-      width: 90%;
-      .text-center {
+    .station {
         .pic {
-          width: 100%;
-          height: auto;
+            height: 20rem;
         }
-      }
-     
     }
-  }
-  .list {
-    width: 80%;
-    margin: 0 auto;
-    li {
-      margin-top: 1rem;
-      width: 100% !important;
+    .list {
+        li {
+            height: 20rem;
+            h6 {
+                top: 5rem;
+            }
+        }
     }
-  }
 }
- @media (min-width: 375px) and (max-width: 480px) {
-  .wrap {
-    /deep/ .el-carousel {
-      height: 13rem !important;
+@media (max-width: 320px) {
+    .wrap {
+        /deep/ .el-carousel {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__item {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__container {
+            height: 13rem !important;
+        }
     }
-    /deep/ .el-carousel__item {
-      height: 13rem !important;
+    .banner-item {
+        img {
+            height: 13rem !important;
+        }
+        .banner-name {
+            padding: 7rem 0 0 1rem;
+            font-size: 1.5rem;
+        }
     }
-    /deep/ .el-carousel__container {
-      height: 13rem !important;
+    .block {
+        padding: 2rem 0;
+        .inner {
+            width: 90%;
+            .text-center {
+                .pic {
+                    width: 100%;
+                    height: auto;
+                }
+            }
+        }
     }
-  }
-  .banner-item{
-    img {
-      height: 13rem !important;
+    .list {
+        width: 80%;
+        margin: 0 auto;
+        li {
+            margin-top: 1rem;
+            width: 100% !important;
+        }
     }
-    .banner-name {
-      padding: 7rem 0 0 1rem;
-      font-size: 1.5rem;
+}
+@media (min-width: 320px) and (max-width: 375px) {
+    .wrap {
+        /deep/ .el-carousel {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__item {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__container {
+            height: 13rem !important;
+        }
     }
-  }
-  .block  {
-    padding: 2rem 0;
-    .inner {
-      width: 90%;
-      .text-center {
-        .pic {
-          width: 100%;
-          height: auto;
+    .banner-item {
+        img {
+            height: 13rem !important;
+        }
+        .banner-name {
+            padding: 7rem 0 0 1rem;
+            font-size: 1.5rem;
         }
-      }
-     
     }
-  }
-  .list {
-    width: 80%;
-    margin: 0 auto;
-    li {
-      margin-top: 1rem;
-      width: 100% !important;
+    .block {
+        padding: 2rem 0;
+        .inner {
+            width: 90%;
+            .text-center {
+                .pic {
+                    width: 100%;
+                    height: auto;
+                }
+            }
+        }
+    }
+    .list {
+        width: 80%;
+        margin: 0 auto;
+        li {
+            margin-top: 1rem;
+            width: 100% !important;
+        }
     }
-  }
 }
-@media (min-width: 480px) and (max-width: 640px) {
-  .wrap {
-    /deep/ .el-carousel {
-      height: 13rem !important;
+@media (min-width: 375px) and (max-width: 480px) {
+    .wrap {
+        /deep/ .el-carousel {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__item {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__container {
+            height: 13rem !important;
+        }
     }
-    /deep/ .el-carousel__item {
-      height: 13rem !important;
+    .banner-item {
+        img {
+            height: 13rem !important;
+        }
+        .banner-name {
+            padding: 7rem 0 0 1rem;
+            font-size: 1.5rem;
+        }
     }
-    /deep/ .el-carousel__container {
-      height: 13rem !important;
+    .block {
+        padding: 2rem 0;
+        .inner {
+            width: 90%;
+            .text-center {
+                .pic {
+                    width: 100%;
+                    height: auto;
+                }
+            }
+        }
     }
-  }
-  .banner-item{
-    img {
-      height: 13rem !important;
+    .list {
+        width: 80%;
+        margin: 0 auto;
+        li {
+            margin-top: 1rem;
+            width: 100% !important;
+        }
     }
-    .banner-name {
-      padding: 7rem 0 0 1rem;
-      font-size: 1.5rem;
+}
+@media (min-width: 480px) and (max-width: 640px) {
+    .wrap {
+        /deep/ .el-carousel {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__item {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__container {
+            height: 13rem !important;
+        }
     }
-  }
-  .block  {
-    padding: 2rem 0;
-    .inner {
-      width: 90%;
-      .text-center {
-        .pic {
-          width: 100%;
-          height: auto;
+    .banner-item {
+        img {
+            height: 13rem !important;
+        }
+        .banner-name {
+            padding: 7rem 0 0 1rem;
+            font-size: 1.5rem;
         }
-      }
-     
     }
-  }
-  .list {
-    width: 80%;
-    margin: 0 auto;
-    li {
-      margin-top: 1rem;
-      width: 100% !important;
+    .block {
+        padding: 2rem 0;
+        .inner {
+            width: 90%;
+            .text-center {
+                .pic {
+                    width: 100%;
+                    height: auto;
+                }
+            }
+        }
+    }
+    .list {
+        width: 80%;
+        margin: 0 auto;
+        li {
+            margin-top: 1rem;
+            width: 100% !important;
+        }
     }
-  }
 }
 @media (min-width: 640px) and (max-width: 768px) {
-  .wrap {
-    /deep/ .el-carousel {
-      height: 13rem !important;
-    }
-    /deep/ .el-carousel__item {
-      height: 13rem !important;
-    }
-    /deep/ .el-carousel__container {
-      height: 13rem !important;
-    }
-  }
-  .banner-item{
-    img {
-      height: 13rem !important;
+    .wrap {
+        /deep/ .el-carousel {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__item {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__container {
+            height: 13rem !important;
+        }
     }
-    .banner-name {
-      padding: 7rem 0 0 1rem;
-      font-size: 1.5rem;
+    .banner-item {
+        img {
+            height: 13rem !important;
+        }
+        .banner-name {
+            padding: 7rem 0 0 1rem;
+            font-size: 1.5rem;
+        }
     }
-  }
-  .block  {
-    padding: 2rem 0;
-    .inner {
-      width: 90%;
-      .text-center {
-        .pic {
-          width: 100%;
-          height: auto;
+    .block {
+        padding: 2rem 0;
+        .inner {
+            width: 90%;
+            .text-center {
+                .pic {
+                    width: 100%;
+                    height: auto;
+                }
+            }
         }
-      }
-     
     }
-  }
-  .list {
-    width: 80%;
-    margin: 0 auto;
-    li {
-      margin-top: 1rem;
-      width: 100% !important;
+    .list {
+        width: 80%;
+        margin: 0 auto;
+        li {
+            margin-top: 1rem;
+            width: 100% !important;
+        }
     }
-  }
 }
 @media (min-width: 768px) and (max-width: 980px) {
-  .wrap {
-    /deep/ .el-carousel {
-      height: 13rem !important;
-    }
-    /deep/ .el-carousel__item {
-      height: 13rem !important;
-    }
-    /deep/ .el-carousel__container {
-      height: 13rem !important;
+    .wrap {
+        /deep/ .el-carousel {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__item {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__container {
+            height: 13rem !important;
+        }
     }
-  }
-  .banner-item{
-    img {
-      height: 13rem !important;
+    .banner-item {
+        img {
+            height: 13rem !important;
+        }
+        .banner-name {
+            padding: 7rem 0 0 1rem;
+            font-size: 1.5rem;
+        }
     }
-    .banner-name {
-      padding: 7rem 0 0 1rem;
-      font-size: 1.5rem;
+    .block {
+        padding: 2rem 0;
+        .inner {
+            width: 90%;
+            .text-center {
+                .pic {
+                    width: 100%;
+                    height: auto;
+                }
+            }
+        }
     }
-  }
-  .block  {
-    padding: 2rem 0;
-    .inner {
-      width: 90%;
-      .text-center {
-        .pic {
-          width: 100%;
-          height: auto;
+    .list {
+        display: flex;
+        width: 100%;
+        li {
+            width: 25%;
         }
-      }
-     
     }
-  }
-  .list {
-    display: flex;
-    width: 100%;
-    li {
-      width: 25% ;
+    .item3 {
+        width: 50% !important;
     }
-  }
-  .item3 {
-    width: 50% !important;
-  }
 }
 @media (min-width: 980px) and (max-width: 1200px) {
-  .wrap {
-    /deep/ .el-carousel {
-      height: 13rem !important;
-    }
-    /deep/ .el-carousel__item {
-      height: 13rem !important;
-    }
-    /deep/ .el-carousel__container {
-      height: 13rem !important;
+    .wrap {
+        /deep/ .el-carousel {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__item {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__container {
+            height: 13rem !important;
+        }
     }
-  }
-  .banner-item{
-    img {
-      height: 13rem !important;
+    .banner-item {
+        img {
+            height: 13rem !important;
+        }
+        .banner-name {
+            padding: 7rem 0 0 1rem;
+            font-size: 1.5rem;
+        }
     }
-    .banner-name {
-      padding: 7rem 0 0 1rem;
-      font-size: 1.5rem;
+    .block {
+        padding: 2rem 0;
+        .inner {
+            width: 90%;
+            .text-center {
+                .pic {
+                    width: 100%;
+                    height: auto;
+                }
+            }
+        }
     }
-  }
-  .block  {
-    padding: 2rem 0;
-    .inner {
-      width: 90%;
-      .text-center {
-        .pic {
-          width: 100%;
-          height: auto;
+    .list {
+        display: flex;
+        width: 100%;
+        li {
+            width: 25%;
         }
-      }
-     
     }
-  }
-  .list {
-    display: flex;
-    width: 100%;
-    li {
-      width: 25% ;
+    .item3 {
+        width: 50% !important;
     }
-  }
-  .item3 {
-    width: 50% !important;
-  }
 }
 </style>
\ No newline at end of file
diff --git a/src/pages/overviewDevHistory/index.vue b/src/pages/overviewDevHistory/index.vue
index 90754a9..3bddad6 100644
--- a/src/pages/overviewDevHistory/index.vue
+++ b/src/pages/overviewDevHistory/index.vue
@@ -19,7 +19,8 @@
 
     <div class="block history">
       <div class="inner">
-        <h2 class="wow fadeInLeft">{{ modules[1].form.title }}</h2>
+        <h2 class="wow fadeInLeft"
+            v-html="modules[1].form.title"></h2>
         <p class="en">{{ modules[1].form.des }}</p>
         <div v-if="modules[2].list.length"
              class="event">
diff --git a/src/pages/overviewIntro/index.vue b/src/pages/overviewIntro/index.vue
index f5f4445..8287459 100644
--- a/src/pages/overviewIntro/index.vue
+++ b/src/pages/overviewIntro/index.vue
@@ -24,12 +24,12 @@
              src="http://10.10.11.7/images/overviewIntro/1.png"
              alt="">
         <div class="right">
-          <h6>
-            {{ modules[1].form.title }}
+          <div class="relative">
+            <h6 v-html="modules[1].form.title"></h6>
             <img class="title-bg"
                  src="http://10.10.11.7/images/overviewIntro/2.png"
                  alt="">
-          </h6>
+          </div>
           <div class="text"
                v-html="modules[1].form.des"></div>
         </div>
diff --git a/src/pages/overviewSetup/index.vue b/src/pages/overviewSetup/index.vue
index a6b410a..ab25c6e 100644
--- a/src/pages/overviewSetup/index.vue
+++ b/src/pages/overviewSetup/index.vue
@@ -20,7 +20,7 @@
     <div class="tab-content">
       <div class="org">
         <div class="left">
-          <h6>{{ modules[1].form.title }}</h6>
+          <h6 v-html="modules[1].form.title"></h6>
           <p class="text"
              v-html="modules[1].form.des"></p>
         </div>
diff --git a/src/pages/talent/index.vue b/src/pages/talent/index.vue
index 0767917..f9e2a26 100644
--- a/src/pages/talent/index.vue
+++ b/src/pages/talent/index.vue
@@ -1,7 +1,9 @@
 <template>
   <div class="wrap">
     <div class="single-banner">
-      <img class="banner-img" :src="modules[0].form.pic" alt="">
+      <img class="banner-img"
+           :src="modules[0].form.pic"
+           alt="">
       <div class="texts">
         <h6 class="banner-title">{{ modules[0].form.title }}</h6>
         <p class="banner-des">{{ modules[0].form.des }}</p>
@@ -10,18 +12,28 @@
 
     <div class="block talent">
       <div class="inner">
-        <div class="item wow bounceInLeft" data-wow-delay="0.5s" :class="{'cursor-pointer': isLink(modules[1].form.link.linkName)}" @click="openLink(modules[1].form)">
+        <div class="item wow bounceInLeft"
+             data-wow-delay="0.5s"
+             :class="{'cursor-pointer': isLink(modules[1].form.link.linkName)}"
+             @click="openLink(modules[1].form)">
           <div class="img-wrap">
-            <img class="pic" :src="modules[1].form.pic" alt="">
+            <img class="pic"
+                 :src="modules[1].form.pic"
+                 alt="">
           </div>
           <div class="texts">
             <h6>{{ modules[1].form.title }}</h6>
             <div class="des">{{ modules[1].form.des }}</div>
           </div>
         </div>
-        <div class="item wow bounceInRight" data-wow-delay="0.6s" :class="{'cursor-pointer': isLink(modules[2].form.link.linkName)}" @click="openLink(modules[2].form)">
+        <div class="item wow bounceInRight"
+             data-wow-delay="0.6s"
+             :class="{'cursor-pointer': isLink(modules[2].form.link.linkName)}"
+             @click="openLink(modules[2].form)">
           <div class="img-wrap">
-            <img class="pic" :src="modules[2].form.pic" alt="">
+            <img class="pic"
+                 :src="modules[2].form.pic"
+                 alt="">
           </div>
           <div class="texts">
             <h6>{{ modules[2].form.title }}</h6>
@@ -32,12 +44,18 @@
     </div>
 
     <div class="style">
-      <h6 class="wow fadeInUp">{{ modules[3].form.title }}</h6>
-      <el-carousel :interval="4000" type="card" height="30rem">
+      <h6 class="wow fadeInUp"
+          v-html="modules[3].form.title"></h6>
+      <el-carousel :interval="4000"
+                   type="card"
+                   height="30rem">
         <template v-for="(item, i) in modules[4].list">
-          <el-carousel-item v-if="item.isEnable" :key="i">
-            <div class="item" @click="openLink(item)">
-              <img :src="item.pic" alt="">
+          <el-carousel-item v-if="item.isEnable"
+                            :key="i">
+            <div class="item"
+                 @click="openLink(item)">
+              <img :src="item.pic"
+                   alt="">
               <p class="text">{{ item.title }}</p>
             </div>
           </el-carousel-item>
@@ -47,26 +65,36 @@
 
     <div class="block intro">
       <div class="inner">
-        <div class="item wow fadeInDown" data-wow-delay="0.1s">
+        <div class="item wow fadeInDown"
+             data-wow-delay="0.1s">
           <div class="img-wrap">
-            <img class="pic" :src="modules[5].form.pic" alt="">
+            <img class="pic"
+                 :src="modules[5].form.pic"
+                 alt="">
           </div>
           <div class="texts">
             <p class="type">{{ modules[5].form.subTitle }}</p>
             <h6>{{ modules[5].form.title }}</h6>
             <div class="des">{{ modules[5].form.des }}</div>
-            <el-button v-if="isLink(modules[5].form.link.linkName)" type="primary" @click="openLink(modules[5].form)">{{ $t('column.seeMore') }}</el-button>
+            <el-button v-if="isLink(modules[5].form.link.linkName)"
+                       type="primary"
+                       @click="openLink(modules[5].form)">{{ $t('column.seeMore') }}</el-button>
           </div>
         </div>
-        <div class="item wow fadeInDown" data-wow-delay="0.3s">
+        <div class="item wow fadeInDown"
+             data-wow-delay="0.3s">
           <div class="img-wrap">
-            <img class="pic" :src="modules[6].form.pic" alt="">
+            <img class="pic"
+                 :src="modules[6].form.pic"
+                 alt="">
           </div>
           <div class="texts">
             <p class="type">{{ modules[6].form.subTitle }}</p>
             <h6>{{ modules[6].form.title }}</h6>
             <div class="des">{{ modules[6].form.des }}</div>
-            <el-button v-if="isLink(modules[6].form.link.linkName)" type="primary" @click="openLink(modules[6].form)">{{ $t('column.seeMore') }}</el-button>
+            <el-button v-if="isLink(modules[6].form.link.linkName)"
+                       type="primary"
+                       @click="openLink(modules[6].form)">{{ $t('column.seeMore') }}</el-button>
           </div>
         </div>
       </div>
@@ -82,7 +110,7 @@ import Breadcrumb from '@/components/breadcrumb'
 import WOW from 'wow.js'
 export default {
   mixins: [mixins],
-  data() {
+  data () {
     return {
       routes: []
     }
@@ -90,12 +118,12 @@ export default {
   components: {
     Breadcrumb
   },
-  mounted() {
+  mounted () {
     new WOW().init()
   },
   methods: {
     // 获取文章详情
-    getInfo() {
+    getInfo () {
       // 预览/详情
       this.$post(`${this.api[this.preview ? 'getRedisCache' : 'findPage']}?columnId=${this.id}`).then(({ data }) => {
         if (data.length) {
@@ -106,7 +134,7 @@ export default {
           this.modules = json
           console.log("🚀 ~ file: index.vue ~ line 180 ~ this.$post ~ json", json)
         }
-      }).catch(err => {})
+      }).catch(err => { })
     },
   }
 };
@@ -114,517 +142,515 @@ export default {
 
 <style lang="scss" scoped>
 @import url(../../plugins/wow/animate.css);
-@import "../../styles/page/page.scss";
+@import '../../styles/page/page.scss';
 .wrap {
-  background: #F8F9FB;
+    background: #f8f9fb;
 }
 .single-banner {
-  .banner-img {
-    height: 21.6rem;
-  }
-  .texts {
-    h6 {
-      font-size: 2.16rem;
-      margin-bottom: .95rem;
+    .banner-img {
+        height: 21.6rem;
     }
-    .banner-des {
-      font-size: 1.08rem;
+    .texts {
+        h6 {
+            font-size: 2.16rem;
+            margin-bottom: 0.95rem;
+        }
+        .banner-des {
+            font-size: 1.08rem;
+        }
     }
-  }
 }
-.block  {
-  padding: 3.85rem 0;
+.block {
+    padding: 3.85rem 0;
 }
 .talent {
-  .inner {
-    width: 1200px;
-    max-width: 1504px;
-  }
-  .item {
-    display: flex;
-    padding: 2.1rem;
-    margin-bottom: 1.8rem;
-    color: #333;
-    background: #fff;
-    transition: .5s;
-    &:nth-child(even) {
-      justify-content: space-between;
-      flex-direction: row-reverse;
-      .texts {
-        padding-left: 0;
-      }
-    }
-    &:hover {
-      color: #fff;
-      background: #005388;
-      .pic {
-        transform: scale(1.1);
-      }
+    .inner {
+        width: 1200px;
+        max-width: 1504px;
+    }
+    .item {
+        display: flex;
+        padding: 2.1rem;
+        margin-bottom: 1.8rem;
+        color: #333;
+        background: #fff;
+        transition: 0.5s;
+        &:nth-child(even) {
+            justify-content: space-between;
+            flex-direction: row-reverse;
+            .texts {
+                padding-left: 0;
+            }
+        }
+        &:hover {
+            color: #fff;
+            background: #005388;
+            .pic {
+                transform: scale(1.1);
+            }
+        }
+    }
+    .img-wrap {
+        width: 32rem;
+        overflow: hidden;
+    }
+    .pic {
+        width: 100%;
+        height: 100%;
+        transition: 0.5s;
+    }
+    .texts {
+        width: 44.375rem;
+        padding: 3.9rem 3.6rem 1.5rem 4rem;
+    }
+    h6 {
+        margin-bottom: 1.2rem;
+        font-size: 1.92rem;
+        font-family: PingFangSC-Light, PingFang SC;
+        font-weight: 300;
+    }
+    .des {
+        font-size: 0.88rem;
+        line-height: 1.65rem;
+        -webkit-line-clamp: 5;
     }
-  }
-  .img-wrap {
-    width: 32rem;
-    overflow: hidden;
-  }
-  .pic {
-    width: 100%;
-    height: 100%;
-    transition: .5s;
-  }
-  .texts {
-    width: 44.375rem;
-    padding: 3.9rem 3.6rem 1.5rem 4rem;
-  }
-  h6 {
-    margin-bottom: 1.2rem;
-    font-size: 1.92rem;
-    font-family: PingFangSC-Light, PingFang SC;
-    font-weight: 300;
-  }
-  .des {
-    font-size: .88rem;
-    line-height: 1.65rem;
-    -webkit-line-clamp: 5;
-  }
 }
 .style {
-  width: 1200px;
-  margin: 0 auto;
-  h6 {
-    margin-bottom: 2.95rem;
-    font-size: 1.92rem;
-    font-family: PingFangSC-Medium, PingFang SC;
-    font-weight: 500;
-    text-align: center;
-    color: #333333;
-  }
-  .item {
-    position: relative;
-    width: 100%;
-    height: 25.5rem;
-  }
-  img {
-    width: 100%;
-    height: 100%;
-  }
-  .text {
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    padding: 0 1.5rem;
-    line-height: 2.72rem;
-    font-size: .96rem;
-    color: #fff;
-    background: rgba(0,0,0,0.38);
-  }
-}
-.intro {
-  .inner {
     width: 1200px;
-    max-width: 1504px;
-  }
-  .item {
-    display: flex;
-    align-items: center;
-    margin-bottom: 36px;
-    color: #333;
-    background: #fff;
-    transition: .5s;
-    &:nth-child(even) {
-      flex-direction: row-reverse;
-    }
-    &:hover {
-      color: #fff;
-      background: #465f85;
-      .pic {
-        transform: scale(1.1);
-      }
+    margin: 0 auto;
+    h6 {
+        margin-bottom: 2.95rem;
+        font-size: 1.92rem;
+        font-family: PingFangSC-Medium, PingFang SC;
+        font-weight: 500;
+        text-align: center;
+        color: #333333;
+    }
+    .item {
+        position: relative;
+        width: 100%;
+        height: 25.5rem;
+    }
+    img {
+        width: 100%;
+        height: 100%;
+    }
+    .text {
+        position: absolute;
+        bottom: 0;
+        left: 0;
+        width: 100%;
+        padding: 0 1.5rem;
+        line-height: 2.72rem;
+        font-size: 0.96rem;
+        color: #fff;
+        background: rgba(0, 0, 0, 0.38);
     }
-  }
-  .img-wrap {
-    height: auto;
-    overflow: hidden;
-  }
-  .pic {
-    width: 100%;
-    height: 100%;
-    transition: .5s;
-  }
-  .texts {
-    width: 45%;
-    padding: 0 2.9rem;
-  }
-  .type {
-    font-size: .88rem;
-  }
-  h6 {
-    margin: 1rem 0;
-    font-size: 1.28rem;
-    font-family: PingFangSC-Medium, PingFang SC;
-    font-weight: 500;
-  }
-  .des {
-    margin-bottom: 1.5rem;
-    font-size: 0.9rem;
-    line-height: 1.5rem;
-  }
 }
-@media (min-width: 280px) and (max-width: 1200px) {
-  .single-banner{
-    .texts {
-      left: 200px;
-      .banner-title{
-        font-size: 2.2rem;
-      }
+.intro {
+    .inner {
+        width: 1200px;
+        max-width: 1504px;
+    }
+    .item {
+        display: flex;
+        align-items: center;
+        margin-bottom: 36px;
+        color: #333;
+        background: #fff;
+        transition: 0.5s;
+        &:nth-child(even) {
+            flex-direction: row-reverse;
+        }
+        &:hover {
+            color: #fff;
+            background: #465f85;
+            .pic {
+                transform: scale(1.1);
+            }
+        }
     }
-   
-  }
-  .block {
-    padding: 30px 0;
-    .inner{
-      .item {
-        flex-direction: column;
-        padding: 1.5rem;
-      }
-      .texts{
+    .img-wrap {
+        height: auto;
+        overflow: hidden;
+    }
+    .pic {
         width: 100%;
-        padding: 1.5rem;
-      }
+        height: 100%;
+        transition: 0.5s;
     }
-  }
-  .style {
-    /deep/ .el-carousel__container{
-      height: 27rem !important;
+    .texts {
+        width: 45%;
+        padding: 0 2.9rem;
+    }
+    .type {
+        font-size: 0.88rem;
     }
-    .wow { 
-      margin-bottom: 2rem;
-      
+    h6 {
+        margin: 1rem 0;
+        font-size: 1.28rem;
+        font-family: PingFangSC-Medium, PingFang SC;
+        font-weight: 500;
     }
-    .item{
-      height: 25rem;
+    .des {
+        margin-bottom: 1.5rem;
+        font-size: 0.9rem;
+        line-height: 1.5rem;
+    }
+}
+@media (min-width: 280px) and (max-width: 1200px) {
+    .single-banner {
+        .texts {
+            left: 200px;
+            .banner-title {
+                font-size: 2.2rem;
+            }
+        }
+    }
+    .block {
+        padding: 30px 0;
+        .inner {
+            .item {
+                flex-direction: column;
+                padding: 1.5rem;
+            }
+            .texts {
+                width: 100%;
+                padding: 1.5rem;
+            }
+        }
+    }
+    .style {
+        /deep/ .el-carousel__container {
+            height: 27rem !important;
+        }
+        .wow {
+            margin-bottom: 2rem;
+        }
+        .item {
+            height: 25rem;
+        }
     }
-  }
 }
 
 @media (max-width: 320px) {
-  .single-banner{
-    .banner-img {
-      height: 12rem;
-    }
-    .texts {
-      left: 2rem;
-      top:3rem;
-      .banner-title{
-        font-size: 1.5rem;
-      }
-      .banner-des {
-        font-size: 1rem;
-      }
+    .single-banner {
+        .banner-img {
+            height: 12rem;
+        }
+        .texts {
+            left: 2rem;
+            top: 3rem;
+            .banner-title {
+                font-size: 1.5rem;
+            }
+            .banner-des {
+                font-size: 1rem;
+            }
+        }
     }
-  }
-  .block  {
-    .inner {
-      width: 100%;
-      .item  {
-        .img-wrap {
-          width: 100%;
-          height: auto;
+    .block {
+        .inner {
+            width: 100%;
+            .item {
+                .img-wrap {
+                    width: 100%;
+                    height: auto;
+                }
+            }
         }
-      }
     }
-  }
-  .style {
-    width: 100%;
-   /deep/ .el-carousel {
-    height: 13rem !important;
-   }     
-   /deep/ .el-carousel__container {
-    height: 13rem !important;
-   }
-   .item {
-    height: 13rem;
-    .text {
-      line-height: 1.5rem;
-      font-size: 1rem;
+    .style {
+        width: 100%;
+        /deep/ .el-carousel {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__container {
+            height: 13rem !important;
+        }
+        .item {
+            height: 13rem;
+            .text {
+                line-height: 1.5rem;
+                font-size: 1rem;
+            }
+        }
     }
-   }
-  }
 }
 @media (min-width: 320px) and (max-width: 375px) {
-  .single-banner{
-    .banner-img {
-      height: 12rem;
-    }
-    .texts {
-      left: 2rem;
-      top:3rem;
-      .banner-title{
-        font-size: 1.5rem;
-      }
-      .banner-des {
-        font-size: 1rem;
-      }
+    .single-banner {
+        .banner-img {
+            height: 12rem;
+        }
+        .texts {
+            left: 2rem;
+            top: 3rem;
+            .banner-title {
+                font-size: 1.5rem;
+            }
+            .banner-des {
+                font-size: 1rem;
+            }
+        }
     }
-  }
-  .block  {
-    .inner {
-      width: 100%;
-      .item  {
-        .img-wrap {
-          width: 100%;
-          height: auto;
+    .block {
+        .inner {
+            width: 100%;
+            .item {
+                .img-wrap {
+                    width: 100%;
+                    height: auto;
+                }
+            }
         }
-      }
     }
-  }
-  .style {
-    width: 100%;
-   /deep/ .el-carousel {
-    height: 13rem !important;
-   }     
-   /deep/ .el-carousel__container {
-    height: 13rem !important;
-   }
-   .item {
-    height: 13rem;
-    .text {
-      line-height: 1.5rem;
-      font-size: 1rem;
+    .style {
+        width: 100%;
+        /deep/ .el-carousel {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__container {
+            height: 13rem !important;
+        }
+        .item {
+            height: 13rem;
+            .text {
+                line-height: 1.5rem;
+                font-size: 1rem;
+            }
+        }
     }
-   }
-  }
 }
 @media (min-width: 375px) and (max-width: 480px) {
-  .single-banner{
-    .banner-img {
-      height: 12rem;
-    }
-    .texts {
-      left: 2rem;
-      top:3rem;
-      .banner-title{
-        font-size: 1.5rem;
-      }
-      .banner-des {
-        font-size: 1rem;
-      }
+    .single-banner {
+        .banner-img {
+            height: 12rem;
+        }
+        .texts {
+            left: 2rem;
+            top: 3rem;
+            .banner-title {
+                font-size: 1.5rem;
+            }
+            .banner-des {
+                font-size: 1rem;
+            }
+        }
     }
-  }
-  .block  {
-    .inner {
-      width: 100%;
-      .item  {
-        .img-wrap {
-          width: 100%;
-          height: auto;
+    .block {
+        .inner {
+            width: 100%;
+            .item {
+                .img-wrap {
+                    width: 100%;
+                    height: auto;
+                }
+            }
         }
-      }
     }
-  }
-  .style {
-    width: 100%;
-   /deep/ .el-carousel {
-    height: 13rem !important;
-   }     
-   /deep/ .el-carousel__container {
-    height: 13rem !important;
-   }
-   .item {
-    height: 13rem;
-    .text {
-      line-height: 1.5rem;
-      font-size: 1rem;
+    .style {
+        width: 100%;
+        /deep/ .el-carousel {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__container {
+            height: 13rem !important;
+        }
+        .item {
+            height: 13rem;
+            .text {
+                line-height: 1.5rem;
+                font-size: 1rem;
+            }
+        }
     }
-   }
-  }
 }
 @media (min-width: 480px) and (max-width: 640px) {
-  .single-banner{
-    .banner-img {
-      height: 12rem;
-    }
-    .texts {
-      left: 2rem;
-      top:3rem;
-      .banner-title{
-        font-size: 1.5rem;
-      }
-      .banner-des {
-        font-size: 1rem;
-      }
+    .single-banner {
+        .banner-img {
+            height: 12rem;
+        }
+        .texts {
+            left: 2rem;
+            top: 3rem;
+            .banner-title {
+                font-size: 1.5rem;
+            }
+            .banner-des {
+                font-size: 1rem;
+            }
+        }
     }
-  }
-  .block  {
-    .inner {
-      width: 100%;
-      .item  {
-        .img-wrap {
-          width: 100%;
-          height: auto;
+    .block {
+        .inner {
+            width: 100%;
+            .item {
+                .img-wrap {
+                    width: 100%;
+                    height: auto;
+                }
+            }
         }
-      }
     }
-  }
-  .style {
-    width: 100%;
-   /deep/ .el-carousel {
-    height: 13rem !important;
-   }     
-   /deep/ .el-carousel__container {
-    height: 13rem !important;
-   }
-   .item {
-    height: 13rem;
-    .text {
-      line-height: 1.5rem;
-      font-size: 1rem;
+    .style {
+        width: 100%;
+        /deep/ .el-carousel {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__container {
+            height: 13rem !important;
+        }
+        .item {
+            height: 13rem;
+            .text {
+                line-height: 1.5rem;
+                font-size: 1rem;
+            }
+        }
     }
-   }
-  }
 }
 @media (min-width: 640px) and (max-width: 768px) {
-  .single-banner{
-    .banner-img {
-      height: 12rem;
-    }
-    .texts {
-      left: 2rem;
-      top:3rem;
-      .banner-title{
-        font-size: 1.5rem;
-      }
-      .banner-des {
-        font-size: 1rem;
-      }
+    .single-banner {
+        .banner-img {
+            height: 12rem;
+        }
+        .texts {
+            left: 2rem;
+            top: 3rem;
+            .banner-title {
+                font-size: 1.5rem;
+            }
+            .banner-des {
+                font-size: 1rem;
+            }
+        }
     }
-  }
-  .block  {
-    .inner {
-      width: 100%;
-      .item  {
-        .img-wrap {
-          width: 100%;
-          height: auto;
+    .block {
+        .inner {
+            width: 100%;
+            .item {
+                .img-wrap {
+                    width: 100%;
+                    height: auto;
+                }
+            }
         }
-      }
     }
-  }
-  .style {
-    width: 100%;
-   /deep/ .el-carousel {
-    height: 13rem !important;
-   }     
-   /deep/ .el-carousel__container {
-    height: 13rem !important;
-   }
-   .item {
-    height: 13rem;
-    .text {
-      line-height: 1.5rem;
-      font-size: 1rem;
+    .style {
+        width: 100%;
+        /deep/ .el-carousel {
+            height: 13rem !important;
+        }
+        /deep/ .el-carousel__container {
+            height: 13rem !important;
+        }
+        .item {
+            height: 13rem;
+            .text {
+                line-height: 1.5rem;
+                font-size: 1rem;
+            }
+        }
     }
-   }
-  }
 }
 @media (min-width: 768px) and (max-width: 980px) {
-  .single-banner{
-    .banner-img {
-      height: 12rem;
+    .single-banner {
+        .banner-img {
+            height: 12rem;
+        }
+        .texts {
+            left: 2rem;
+            top: 3rem;
+            .banner-title {
+                font-size: 1.5rem;
+            }
+            .banner-des {
+                font-size: 1rem;
+            }
+        }
     }
-    .texts {
-      left: 2rem;
-      top:3rem;
-      .banner-title{
-        font-size: 1.5rem;
-      }
-      .banner-des {
-        font-size: 1rem;
-      }
+    .block {
+        .inner {
+            width: 100%;
+            .item {
+                width: 100%;
+                flex-direction: row;
+                .img-wrap {
+                    width: 60%;
+                    height: auto;
+                }
+                .texts {
+                    width: 80%;
+                    margin-left: 1.5rem;
+                }
+            }
+        }
     }
-  }
-  .block  {
-    .inner {
-      width: 100%;
-      .item  {
+    .style {
         width: 100%;
-        flex-direction: row;
-        .img-wrap {
-          width: 60%;
-          height: auto;
+        /deep/ .el-carousel {
+            height: 18rem !important;
         }
-        .texts {
-          width: 80%;
-          margin-left: 1.5rem;
+        /deep/ .el-carousel__container {
+            height: 18rem !important;
+        }
+        .item {
+            height: 18rem;
+            .text {
+                line-height: 1.5rem;
+                font-size: 1rem;
+            }
         }
-      }
-    }
-  }
-  .style {
-    width: 100%;
-   /deep/ .el-carousel {
-    height: 18rem !important;
-   }     
-   /deep/ .el-carousel__container {
-    height: 18rem !important;
-   }
-   .item {
-    height: 18rem;
-    .text {
-      line-height: 1.5rem;
-      font-size: 1rem;
     }
-   }
-  }
 }
 @media (min-width: 980px) and (max-width: 1200px) {
-  .single-banner{
-    .banner-img {
-      height: 12rem;
+    .single-banner {
+        .banner-img {
+            height: 12rem;
+        }
+        .texts {
+            left: 2rem;
+            top: 3rem;
+            .banner-title {
+                font-size: 1.5rem;
+            }
+            .banner-des {
+                font-size: 1rem;
+            }
+        }
     }
-    .texts {
-      left: 2rem;
-      top:3rem;
-      .banner-title{
-        font-size: 1.5rem;
-      }
-      .banner-des {
-        font-size: 1rem;
-      }
+    .block {
+        .inner {
+            width: 100%;
+            .item {
+                width: 100%;
+                flex-direction: row;
+                .img-wrap {
+                    width: 60%;
+                    height: auto;
+                }
+                .texts {
+                    width: 80%;
+                    margin-left: 1.5rem;
+                }
+            }
+        }
     }
-  }
-  .block  {
-    .inner {
-      width: 100%;
-      .item  {
+    .style {
         width: 100%;
-        flex-direction: row;
-        .img-wrap {
-          width: 60%;
-          height: auto;
+        /deep/ .el-carousel {
+            height: 20rem !important;
         }
-        .texts {
-          width: 80%;
-          margin-left: 1.5rem;
+        /deep/ .el-carousel__container {
+            height: 20rem !important;
+        }
+        .item {
+            height: 20rem;
+            .text {
+                line-height: 1.5rem;
+                font-size: 1rem;
+            }
         }
-      }
-    }
-  }
-  .style {
-    width: 100%;
-   /deep/ .el-carousel {
-    height: 20rem !important;
-   }     
-   /deep/ .el-carousel__container {
-    height: 20rem !important;
-   }
-   .item {
-    height: 20rem;
-    .text {
-      line-height: 1.5rem;
-      font-size: 1rem;
     }
-   }
-  }
 }
 </style>
\ No newline at end of file
diff --git a/src/pages/userSharing/index.vue b/src/pages/userSharing/index.vue
index 84868c1..c10f8bf 100644
--- a/src/pages/userSharing/index.vue
+++ b/src/pages/userSharing/index.vue
@@ -1,7 +1,9 @@
 <template>
   <div class="wrap">
     <div class="single-banner">
-      <img class="banner-img" :src="modules[0].form.pic" alt="">
+      <img class="banner-img"
+           :src="modules[0].form.pic"
+           alt="">
       <div class="texts">
         <h6 class="banner-title">{{ modules[0].form.title }}</h6>
         <p class="banner-des">{{ modules[0].form.des }}</p>
@@ -11,12 +13,19 @@
     <div class="block share">
       <div class="inner">
         <div class="left">
-          <h6 class="wow fadeInUp">{{ modules[1].form.title }}</h6>
-          <p class="en wow fadeInUp" data-wow-delay="0.5s">USERS SHARE</p>
-          <div class="des wow fadeInUp" data-wow-delay="0.8s">{{ modules[1].form.des }}</div>
+          <h6 class="wow fadeInUp"
+              v-html="modules[1].form.title"></h6>
+          <p class="en wow fadeInUp"
+             data-wow-delay="0.5s">USERS SHARE</p>
+          <div class="des wow fadeInUp"
+               data-wow-delay="0.8s">{{ modules[1].form.des }}</div>
         </div>
-        <img class="pic wow bounceInRight" data-wow-delay="0.8s" src="@/assets/images/userSharing/1.png" alt="">
-        <div class="card wow bounceInLeft" data-wow-delay="0.8s">
+        <img class="pic wow bounceInRight"
+             data-wow-delay="0.8s"
+             src="@/assets/images/userSharing/1.png"
+             alt="">
+        <div class="card wow bounceInLeft"
+             data-wow-delay="0.8s">
           <p class="title">{{ modules[1].form.subTitle }}</p>
           <p class="en-text">EFFICIENT OPERATION, CLASSIFICATION OPEN</p>
         </div>
@@ -25,18 +34,29 @@
 
     <div class="block gray">
       <ul class="group">
-        <li class="wow bounceInDown" :class="{'cursor-pointer': isLink(modules[2].form.link.linkName)}" @click="openLink(modules[2].form)">
-          <img src="@/assets/images/userSharing/2.png" alt="">
+        <li class="wow bounceInDown"
+            :class="{'cursor-pointer': isLink(modules[2].form.link.linkName)}"
+            @click="openLink(modules[2].form)">
+          <img src="@/assets/images/userSharing/2.png"
+               alt="">
           <h6>{{ modules[2].form.title }}</h6>
           <div class="des">{{ modules[2].form.des }}</div>
         </li>
-        <li class="wow bounceInDown" data-wow-delay="0.1s" :class="{'cursor-pointer': isLink(modules[3].form.link.linkName)}" @click="openLink(modules[3].form)">
-          <img src="@/assets/images/userSharing/3.png" alt="">
+        <li class="wow bounceInDown"
+            data-wow-delay="0.1s"
+            :class="{'cursor-pointer': isLink(modules[3].form.link.linkName)}"
+            @click="openLink(modules[3].form)">
+          <img src="@/assets/images/userSharing/3.png"
+               alt="">
           <h6>{{ modules[3].form.title }}</h6>
           <div class="des">{{ modules[3].form.des }}</div>
         </li>
-        <li class="wow bounceInDown" data-wow-delay="0.2s" :class="{'cursor-pointer': isLink(modules[4].form.link.linkName)}" @click="openLink(modules[4].form)">
-          <img src="@/assets/images/userSharing/4.png" alt="">
+        <li class="wow bounceInDown"
+            data-wow-delay="0.2s"
+            :class="{'cursor-pointer': isLink(modules[4].form.link.linkName)}"
+            @click="openLink(modules[4].form)">
+          <img src="@/assets/images/userSharing/4.png"
+               alt="">
           <h6>{{ modules[4].form.title }}</h6>
           <div class="des">{{ modules[4].form.des }}</div>
         </li>
@@ -52,17 +72,17 @@ import Util from '@/libs/util'
 import WOW from 'wow.js'
 export default {
   mixins: [mixins],
-  data() {
+  data () {
     return {
       routes: []
     }
   },
-  mounted() {
+  mounted () {
     new WOW().init()
   },
   methods: {
     // 获取文章详情
-    getInfo() {
+    getInfo () {
       // 预览/详情
       this.$post(`${this.api[this.preview ? 'getRedisCache' : 'findPage']}?columnId=${this.id}`).then(({ data }) => {
         if (data.length) {
@@ -73,7 +93,7 @@ export default {
           this.modules = json
           console.log("🚀 ~ file: index.vue ~ line 180 ~ this.$post ~ json", json)
         }
-      }).catch(err => {})
+      }).catch(err => { })
     },
   }
 };
@@ -81,464 +101,463 @@ export default {
 
 <style lang="scss" scoped>
 @import url(../../plugins/wow/animate.css);
-@import "../../styles/page/page.scss";
+@import '../../styles/page/page.scss';
 .single-banner {
-  .banner-img {
-    height: 21.6rem;
-  }
-  .texts {
-    h6 {
-      font-size: 2.16rem;
-      margin-bottom: .95rem;
+    .banner-img {
+        height: 21.6rem;
     }
-    .banner-des {
-      font-size: .96rem;
+    .texts {
+        h6 {
+            font-size: 2.16rem;
+            margin-bottom: 0.95rem;
+        }
+        .banner-des {
+            font-size: 0.96rem;
+        }
     }
-  }
 }
-.block  {
-  padding: 3.85rem 0;
+.block {
+    padding: 3.85rem 0;
 }
 .share {
-  position: relative;
-  .inner {
-    display: flex;
-
-  }
-  .left {
-    width: 40%;
-  }
-  h6 {
     position: relative;
-    font-size: 1.76rem;
-    font-family: PingFangSC-Medium, PingFang SC;
-    font-weight: 500;
-    color: #333333;
-  }
-  .en {
-    margin-top: 0;
-    font-size: 1.28rem;
-    font-family: AppleSystemUIFont;
-    color: #E4E4E4;
-  }
-  .des {
-    margin-top: 25px;
-    font-size: .81rem;
-    color: #333;
-    line-height: 1.75rem;
-    -webkit-line-clamp:5;
-  }
-  .pic {
-    width: 60%;
-    height: auto;
-    border-top-left-radius: 20px;
-  }
-  .card {
-    position: absolute;
-    bottom: 5.2rem;
-    left: 0;
-    width: 66.75rem;
-    padding: 1.875rem 0 1.875rem 21.5%;
-    background: #7BACC4;
-    border-radius: 0px 100px 0px 0px;
-    opacity: 0.88;
-  }
-  .title {
-    margin-bottom: .625rem;
-    font-size: 1.44rem;
-    font-family: PingFangSC-Medium, PingFang SC;
-    font-weight: 500;
-    color: #fff;
-  }
-  .en-text {
-    font-size: 1.04rem;
-    font-family: AppleSystemUIFont;
-    color: #fff;
-    letter-spacing: 2px;
-  }
+    .inner {
+        display: flex;
+    }
+    .left {
+        width: 40%;
+    }
+    h6 {
+        position: relative;
+        font-size: 1.76rem;
+        font-family: PingFangSC-Medium, PingFang SC;
+        font-weight: 500;
+        color: #333333;
+    }
+    .en {
+        margin-top: 0;
+        font-size: 1.28rem;
+        font-family: AppleSystemUIFont;
+        color: #e4e4e4;
+    }
+    .des {
+        margin-top: 25px;
+        font-size: 0.81rem;
+        color: #333;
+        line-height: 1.75rem;
+        -webkit-line-clamp: 5;
+    }
+    .pic {
+        width: 60%;
+        height: auto;
+        border-top-left-radius: 20px;
+    }
+    .card {
+        position: absolute;
+        bottom: 5.2rem;
+        left: 0;
+        width: 66.75rem;
+        padding: 1.875rem 0 1.875rem 21.5%;
+        background: #7bacc4;
+        border-radius: 0px 100px 0px 0px;
+        opacity: 0.88;
+    }
+    .title {
+        margin-bottom: 0.625rem;
+        font-size: 1.44rem;
+        font-family: PingFangSC-Medium, PingFang SC;
+        font-weight: 500;
+        color: #fff;
+    }
+    .en-text {
+        font-size: 1.04rem;
+        font-family: AppleSystemUIFont;
+        color: #fff;
+        letter-spacing: 2px;
+    }
 }
 .group {
-  display: flex;
-  justify-content: center;
-  width: 1200px;
-  margin: 0 auto;
-  li {
-    position: relative;
-    flex: 1;
-    height: 15rem;
-    padding: 5.5rem 1rem 0 1.6rem;
-    margin-right: 1rem;
-    color: #fff;
-    overflow: hidden;
-    &:last-child {
-      margin-right: 0;
-    }
-    &:hover {
-      img {
-        transform: scale(1.3);
-      }
+    display: flex;
+    justify-content: center;
+    width: 1200px;
+    margin: 0 auto;
+    li {
+        position: relative;
+        flex: 1;
+        height: 15rem;
+        padding: 5.5rem 1rem 0 1.6rem;
+        margin-right: 1rem;
+        color: #fff;
+        overflow: hidden;
+        &:last-child {
+            margin-right: 0;
+        }
+        &:hover {
+            img {
+                transform: scale(1.3);
+            }
+        }
     }
-  }
-  img {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    transition: .5s;
-  }
-  h6 {
-    position: relative;
-    font-size: 1.2rem;
-    font-family: PingFangSC-Medium, PingFang SC;
-    font-weight: 500;
-  }
-  .des {
-    position: relative;
-    margin-top: 1rem;
-    font-size: 0.72rem;
-    font-family: PingFangSC-Medium, PingFang SC;
-    font-weight: 500;
-    line-height: 31px;
-  }
-}
-@media (max-width: 1200px)  {
-  body{
-    width: 100% !important;
-  }
-  .share{
-    width: 100%;
-    .inner{
-      width: 100%;
-      flex-direction: column;
-      .left{
+    img {
+        position: absolute;
+        top: 0;
+        left: 0;
         width: 100%;
-      }
+        height: 100%;
+        transition: 0.5s;
+    }
+    h6 {
+        position: relative;
+        font-size: 1.2rem;
+        font-family: PingFangSC-Medium, PingFang SC;
+        font-weight: 500;
     }
-    .des{
-      display: block;
-      padding: 0 10px;
+    .des {
+        position: relative;
+        margin-top: 1rem;
+        font-size: 0.72rem;
+        font-family: PingFangSC-Medium, PingFang SC;
+        font-weight: 500;
+        line-height: 31px;
     }
-    .pic{
-      width: 100%;
+}
+@media (max-width: 1200px) {
+    body {
+        width: 100% !important;
     }
-    .card{
-      width: 100%;
+    .share {
+        width: 100%;
+        .inner {
+            width: 100%;
+            flex-direction: column;
+            .left {
+                width: 100%;
+            }
+        }
+        .des {
+            display: block;
+            padding: 0 10px;
+        }
+        .pic {
+            width: 100%;
+        }
+        .card {
+            width: 100%;
+        }
     }
-  }
-  .group {
-    width: 100%;
-    flex-direction: column;
-    li{
-      width: 100%;
-      margin-top: 20px;
+    .group {
+        width: 100%;
+        flex-direction: column;
+        li {
+            width: 100%;
+            margin-top: 20px;
+        }
     }
-  }
 }
 
 @media (max-width: 320px) {
-  .wrap {
-    .single-banner {
-      .banner-img {
-        height: 13rem;
-      }
-      .texts {
-        top: 7rem;
-        left: 2rem;
-        .banner-title{
-          font-size: 1.5rem;
-          margin-bottom: .5rem;
-        }
-        .banner-des{
-          font-size: .85rem;
+    .wrap {
+        .single-banner {
+            .banner-img {
+                height: 13rem;
+            }
+            .texts {
+                top: 7rem;
+                left: 2rem;
+                .banner-title {
+                    font-size: 1.5rem;
+                    margin-bottom: 0.5rem;
+                }
+                .banner-des {
+                    font-size: 0.85rem;
+                }
+            }
         }
-      }
     }
-  }
-  .block {
-    padding: 2rem 0;
-    .inner {
-      .pic  {
-        height: auto;
-      }
-      .card{
-        padding: 1.875rem 0 1.875rem 18.5%;
-        bottom: 0;
-        .title {
-          font-size: 1.4rem;
+    .block {
+        padding: 2rem 0;
+        .inner {
+            .pic {
+                height: auto;
+            }
+            .card {
+                padding: 1.875rem 0 1.875rem 18.5%;
+                bottom: 0;
+                .title {
+                    font-size: 1.4rem;
+                }
+                .en-text {
+                    font-size: 0.9rem;
+                }
+            }
         }
-        .en-text {
-          font-size: .9rem;
-        }
-      }
     }
-  }
 }
 @media (min-width: 320px) and (max-width: 375px) {
-  .wrap {
-    .single-banner {
-      .banner-img {
-        height: 13rem;
-      }
-      .texts {
-        top: 7rem;
-        left: 2rem;
-        .banner-title{
-          font-size: 1.5rem;
-          margin-bottom: .5rem;
+    .wrap {
+        .single-banner {
+            .banner-img {
+                height: 13rem;
+            }
+            .texts {
+                top: 7rem;
+                left: 2rem;
+                .banner-title {
+                    font-size: 1.5rem;
+                    margin-bottom: 0.5rem;
+                }
+                .banner-des {
+                    font-size: 0.85rem;
+                }
+            }
         }
-        .banner-des{
-          font-size: .85rem;
-        }
-      }
     }
-  }
-  .block {
-    padding: 2rem 0;
-    .inner {
-      .pic  {
-        height: auto;
-      }
-      .card{
-        padding: 1.875rem 0 1.875rem 18.5%;
-        bottom: 0;
-        .title {
-          font-size: 1.4rem;
-        }
-        .en-text {
-          font-size: .9rem;
+    .block {
+        padding: 2rem 0;
+        .inner {
+            .pic {
+                height: auto;
+            }
+            .card {
+                padding: 1.875rem 0 1.875rem 18.5%;
+                bottom: 0;
+                .title {
+                    font-size: 1.4rem;
+                }
+                .en-text {
+                    font-size: 0.9rem;
+                }
+            }
         }
-      }
     }
-  }
-  .group {
-    li {
-      height: auto;
+    .group {
+        li {
+            height: auto;
+        }
     }
-  }
 }
 @media (min-width: 375px) and (max-width: 480px) {
-  .wrap {
-    .single-banner {
-      .banner-img {
-        height: 13rem;
-      }
-      .texts {
-        top: 7rem;
-        left: 2rem;
-        .banner-title{
-          font-size: 1.5rem;
-          margin-bottom: .5rem;
+    .wrap {
+        .single-banner {
+            .banner-img {
+                height: 13rem;
+            }
+            .texts {
+                top: 7rem;
+                left: 2rem;
+                .banner-title {
+                    font-size: 1.5rem;
+                    margin-bottom: 0.5rem;
+                }
+                .banner-des {
+                    font-size: 0.85rem;
+                }
+            }
         }
-        .banner-des{
-          font-size: .85rem;
-        }
-      }
     }
-  }
-  .block {
-    padding: 2rem 0;
-    .inner {
-      .pic  {
-        height: auto;
-      }
-      .card{
-        padding: 1.875rem 0 1.875rem 18.5%;
-        bottom: 0;
-        .title {
-          font-size: 1.4rem;
-        }
-        .en-text {
-          font-size: .9rem;
+    .block {
+        padding: 2rem 0;
+        .inner {
+            .pic {
+                height: auto;
+            }
+            .card {
+                padding: 1.875rem 0 1.875rem 18.5%;
+                bottom: 0;
+                .title {
+                    font-size: 1.4rem;
+                }
+                .en-text {
+                    font-size: 0.9rem;
+                }
+            }
         }
-      }
     }
-  }
-  .group {
-    li {
-      height: auto;
+    .group {
+        li {
+            height: auto;
+        }
     }
-  }
 }
 @media (min-width: 480px) and (max-width: 640px) {
-  .wrap {
-    .single-banner {
-      .banner-img {
-        height: 13rem;
-      }
-      .texts {
-        top: 7rem;
-        left: 2rem;
-        .banner-title{
-          font-size: 1.5rem;
-          margin-bottom: .5rem;
-        }
-        .banner-des{
-          font-size: .85rem;
+    .wrap {
+        .single-banner {
+            .banner-img {
+                height: 13rem;
+            }
+            .texts {
+                top: 7rem;
+                left: 2rem;
+                .banner-title {
+                    font-size: 1.5rem;
+                    margin-bottom: 0.5rem;
+                }
+                .banner-des {
+                    font-size: 0.85rem;
+                }
+            }
         }
-      }
     }
-  }
-  .block {
-    padding: 2rem 0;
-    .inner {
-      .pic  {
-        height: auto;
-      }
-      .card{
-        padding: 1.875rem 0 1.875rem 18.5%;
-        bottom: 0;
-        .title {
-          font-size: 1.4rem;
-        }
-        .en-text {
-          font-size: .9rem;
+    .block {
+        padding: 2rem 0;
+        .inner {
+            .pic {
+                height: auto;
+            }
+            .card {
+                padding: 1.875rem 0 1.875rem 18.5%;
+                bottom: 0;
+                .title {
+                    font-size: 1.4rem;
+                }
+                .en-text {
+                    font-size: 0.9rem;
+                }
+            }
         }
-      }
     }
-  }
-  .group {
-    li {
-      height: auto;
+    .group {
+        li {
+            height: auto;
+        }
     }
-  }
 }
 @media (min-width: 640px) and (max-width: 768px) {
-  .wrap {
-    .single-banner {
-      .banner-img {
-        height: 13rem;
-      }
-      .texts {
-        top: 7rem;
-        left: 2rem;
-        .banner-title{
-          font-size: 1.5rem;
-          margin-bottom: .5rem;
-        }
-        .banner-des{
-          font-size: .85rem;
+    .wrap {
+        .single-banner {
+            .banner-img {
+                height: 13rem;
+            }
+            .texts {
+                top: 7rem;
+                left: 2rem;
+                .banner-title {
+                    font-size: 1.5rem;
+                    margin-bottom: 0.5rem;
+                }
+                .banner-des {
+                    font-size: 0.85rem;
+                }
+            }
         }
-      }
     }
-  }
-  .block {
-    padding: 2rem 0;
-    .inner {
-      .pic  {
-        height: auto;
-      }
-      .card{
-        padding: 1.875rem 0 1.875rem 18.5%;
-        bottom: 0;
-        .title {
-          font-size: 1.4rem;
-        }
-        .en-text {
-          font-size: .9rem;
+    .block {
+        padding: 2rem 0;
+        .inner {
+            .pic {
+                height: auto;
+            }
+            .card {
+                padding: 1.875rem 0 1.875rem 18.5%;
+                bottom: 0;
+                .title {
+                    font-size: 1.4rem;
+                }
+                .en-text {
+                    font-size: 0.9rem;
+                }
+            }
         }
-      }
     }
-  }
-  .group {
-    flex-direction: row;
-    li {
-      .des {
-        line-height: 1rem;
-      }
+    .group {
+        flex-direction: row;
+        li {
+            .des {
+                line-height: 1rem;
+            }
+        }
     }
-  }
 }
 @media (min-width: 768px) and (max-width: 980px) {
-  .wrap {
-    .single-banner {
-      .banner-img {
-        height: 13rem;
-      }
-      .texts {
-        top: 7rem;
-        left: 2rem;
-        .banner-title{
-          font-size: 1.5rem;
-          margin-bottom: .5rem;
-        }
-        .banner-des{
-          font-size: .85rem;
+    .wrap {
+        .single-banner {
+            .banner-img {
+                height: 13rem;
+            }
+            .texts {
+                top: 7rem;
+                left: 2rem;
+                .banner-title {
+                    font-size: 1.5rem;
+                    margin-bottom: 0.5rem;
+                }
+                .banner-des {
+                    font-size: 0.85rem;
+                }
+            }
         }
-      }
     }
-  }
-  .block {
-    padding: 2rem 0;
-    .inner {
-      .pic  {
-        height: auto;
-      }
-      .card{
-        padding: 1.875rem 0 1.875rem 18.5%;
-        bottom: 0;
-        .title {
-          font-size: 1.4rem;
+    .block {
+        padding: 2rem 0;
+        .inner {
+            .pic {
+                height: auto;
+            }
+            .card {
+                padding: 1.875rem 0 1.875rem 18.5%;
+                bottom: 0;
+                .title {
+                    font-size: 1.4rem;
+                }
+                .en-text {
+                    font-size: 0.9rem;
+                }
+            }
         }
-        .en-text {
-          font-size: .9rem;
-        }
-      }
     }
-  }
-  .group {
-    flex-direction: row;
-    li {
-      .des {
-        line-height: 1rem;
-      }
+    .group {
+        flex-direction: row;
+        li {
+            .des {
+                line-height: 1rem;
+            }
+        }
     }
-  }
 }
 @media (min-width: 980px) and (max-width: 1200px) {
-  .wrap {
-    .single-banner {
-      .banner-img {
-        height: 13rem;
-      }
-      .texts {
-        top: 7rem;
-        left: 2rem;
-        .banner-title{
-          font-size: 1.5rem;
-          margin-bottom: .5rem;
-        }
-        .banner-des{
-          font-size: .85rem;
+    .wrap {
+        .single-banner {
+            .banner-img {
+                height: 13rem;
+            }
+            .texts {
+                top: 7rem;
+                left: 2rem;
+                .banner-title {
+                    font-size: 1.5rem;
+                    margin-bottom: 0.5rem;
+                }
+                .banner-des {
+                    font-size: 0.85rem;
+                }
+            }
         }
-      }
     }
-  }
-  .block {
-    padding: 2rem 0;
-    .inner {
-      .pic  {
-        height: auto;
-      }
-      .card{
-        padding: 1.875rem 0 1.875rem 18.5%;
-        bottom: 0;
-        .title {
-          font-size: 1.4rem;
+    .block {
+        padding: 2rem 0;
+        .inner {
+            .pic {
+                height: auto;
+            }
+            .card {
+                padding: 1.875rem 0 1.875rem 18.5%;
+                bottom: 0;
+                .title {
+                    font-size: 1.4rem;
+                }
+                .en-text {
+                    font-size: 0.9rem;
+                }
+            }
         }
-        .en-text {
-          font-size: .9rem;
-        }
-      }
     }
-  }
-  .group {
-    flex-direction: row;
-    li {
-      .des {
-        line-height: 1rem;
-      }
+    .group {
+        flex-direction: row;
+        li {
+            .des {
+                line-height: 1rem;
+            }
+        }
     }
-  }
 }
 </style>
\ No newline at end of file