11

11

src/router/index.js

@@ -6,6 +6,7 @@ import detile1 from '@/views/consult/detile1.vue'
 import detile2 from '@/views/consult/detile2.vue'
 import detile3 from '@/views/consult/detile3.vue'
 import detile4 from '@/views/consult/detile4.vue'
+import detile5 from '@/views/consult/detile5.vue'
 import aboutUs from '@/views/aboutUs'
 import project from '@/views/project'
 //detile1
@@ -46,6 +47,11 @@ export default new Router({
       component: detile4
     },
     {
+      path: '/detile5',
+      name: 'detile5',
+      component: detile5
+    },
+    {
       path: '/aboutUs',
       name: 'aboutUs',
       component: aboutUs

src/views/consult/detile5.vue

@@ -0,0 +1,95 @@
+<template>
+  <div class="container">
+    <div class="msgWrap">
+      <h2>收好你的考级证书，它可能是你考入名校的垫脚石！</h2>
+      <p> 2020年暑期考级刚刚结束，相信很多琴童都已经拿到了考级证书，记得把你们的证书收好，它们将在你高考时有大用处！</p>
+      <img src="@/assets/images/consult/infoImg-5-1.png"
+           alt=""
+           width="100%">
+      <p>
+        在很多“211”、“985”高校中都设有艺术特长生，在报考高水平艺术团时，很多院校都对等级证书有所要求，有些学校甚至把<span>“报考项目需获得社会考级最高等级证书”</span>作为门槛。拥有高级别考级证书的孩子，等于拥有了高考降分的机会，往往在冲刺阶段占有更加有利的条件。拥有高级别考级证书、或比赛及演出获奖证书，在报考很多高校高水平艺术团等都享受本科
+        <span>第一批次最终模拟投档线下20分以内，有的高校甚至40分以内。</span>
+      </p>
+
+      <p>比如 <span>南京大学</span> 在2019年的高水平艺术团招生简章中，拥有考级证书就是报考的硬性条件：
+      <p>
+        <img src="@/assets/images/consult/infoImg-5-2.png"
+             alt=""
+             width="100%">
+      <p><span>‍北京邮电大学</span> 也明确写出，器乐类学生需要业余9级及以上的证书。
+      <p>
+        <img src="@/assets/images/consult/infoImg-5-3.png"
+             alt=""
+             width="100%">
+
+      <p>除此以外，包括 <span>中国政法大学、复旦大学、南开大学、浙江大学、华中科技大学、东南大学、南京航空航天大学、南京理工大学</span> 在内的多所高校，都在高水平艺术团的招生简章中，对证书与比赛方面做出了相应的要求。</p>
+      <img src="@/assets/images/consult/infoImg-5-4.png"
+           alt=""
+           width="100%">
+      <img src="@/assets/images/consult/infoImg-5-5.png"
+           alt=""
+           width="100%">
+      <img src="@/assets/images/consult/infoImg-5-6.png"
+           alt=""
+           width="100%">
+      <p>近年，各大高校为储备高水平艺术人才，相继出台了高水平艺术团的招生计划，这一政策无疑让拥有艺术特长的莘莘学子离自己梦寐以求的学府更近了一步。艺术没有止境，坚持下去，说不定哪天它就会变成你考入名校的垫脚石！</p>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  data () {
+    return {};
+  },
+};
+</script>
+<style lang="less" scoped>
+.container {
+  background: #f4f4f4;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  img {
+    margin-bottom: 30px;
+  }
+  .msgWrap {
+    width: 1000px;
+    background-color: #fff;
+    min-height: 500px;
+    margin: 70px auto 244px;
+    padding: 66px 75px;
+    text-align: left;
+    h2 {
+      font-size: 34px;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: #1a1a1a;
+      line-height: 48px;
+      margin-bottom: 90px;
+    }
+    h3 {
+      color: #1a1a1a;
+      margin-bottom: 20px;
+    }
+    h4,
+    h5 {
+      color: #1a1a1a;
+      margin-bottom: 10px;
+      font-size: 16px;
+      line-height: 36px;
+    }
+    p {
+      font-size: 16px;
+      font-family: PingFangSC-Regular, PingFang SC;
+      font-weight: 400;
+      color: #1a1a1a;
+      line-height: 36px;
+      margin-bottom: 30px;
+      text-indent: 32px;
+      span {
+        font-weight: 600;
+      }
+    }
+  }
+}
+</style>

src/views/index/blocks/consult.vue

@@ -222,7 +222,18 @@
               </div>
             </div>
           </swiper-slide>
-
+          <!-- <swiper-slide class="swiper-slide">
+            <div class="textItem"
+                 @click="gotoDetail(5)">
+              <img src="../images/consult5.png"
+                   alt=""
+                   width="369px">
+              <div class="textWrap">
+                <h4>收好你的考级证书，它可能是你考入名校的垫脚石！</h4>
+                <p>2020年暑期考级刚刚结束，相信很多琴童都已经拿到了考级证书，记得把你们的证书收好，它们将在你高考时有大用处！</p>
+              </div>
+            </div>
+          </swiper-slide> -->
         </swiper>
         <div class="prev"
              @click="onPrev"></div>
@@ -382,6 +393,7 @@ export default {
             white-space: nowrap;
             text-overflow: ellipsis;
             margin-bottom: 24px;
+            overflow: hidden;
           }
           p {
             text-align: left;