add

src/App.vue

@@ -2,7 +2,7 @@
     <div id="app"
         :style="{width: designWidth + 'px', height: designHeight + 'px'}"
     >
-        <page-header />
+        <!-- <page-header /> -->
 
         <div class="app-container">
             <router-view></router-view>

src/components/Header/index.vue

 <template>
     <header id="header">
         <div class="logo">
-            <img src="./images/logo.png" alt="科艺logo"><span class="logo-desc">数字化管理平台</span>
+            <!-- <img src="./images/logo.png" alt="科艺logo"><span class="logo-desc">数字化管理平台</span> -->
         </div>
         <h2 class="title"><span>{{ currPageTitle }}</span></h2>
         <div class="date">
@@ -101,7 +101,7 @@ export default {
     line-height: @pageHeaderHeight + 4;
     white-space: nowrap;
     text-align: center;
-    background: url('./images/header-bg.png') no-repeat center top;
+    // background: url('./images/header-bg.png') no-repeat center top;
 
     > span {
         font-size: 34px;

src/pages/growth.vue

+<template>
+    <div class="grow"></div>
+</template>
+<script>
+export default {
+
+}
+</script>
+<style lang="less" scoped>
+.grow{
+    width: 1920px;
+    height: 1080px;
+    background: url('../../static/images/sixthForm/grow.png') no-repeat;
+}
+</style>

src/pages/sixthFormStudent.vue

+<template>
+    <div  class="sixth-page">
+        <div class="left">
+            <!-- 身心健康 -->
+            <div class="left-top" @click="healthy"></div>
+            <!-- 学业分析 -->
+            <div class="left-bottom"></div>
+        </div>
+        <div class="center">
+            <div class="research"></div>
+        </div>
+        <div class="right">
+            <div class="right-top"></div>
+            <div class="right-bottom">
+                <div class="title"></div>
+                <div class="swiper">
+                    <!-- 轮播图 -->
+                    <swiper :options="swiperOption" v-if="activeImgs.length">
+                        <swiper-slide class="swiper-slide" v-for="(item, key) in activeImgs" :key="key" >
+                            <img :src=item />
+                        </swiper-slide>
+                    </swiper>
+                </div>
+            </div>
+            <div class="edit"></div>
+        </div>
+
+    </div>
+</template>
+<script>
+import { swiper, swiperSlide } from 'vue-awesome-swiper'
+import 'swiper/dist/css/swiper.css'
+import active1 from '../../static/images/sixthForm/1.png'
+import active2 from '../../static/images/sixthForm/2.png'
+import active3 from '../../static/images/sixthForm/3.png'
+export default {
+    components: {
+        swiper,
+        swiperSlide
+    },
+    data () {
+        return {
+            activeImgs: [active1, active2, active3],
+            swiperOption: {
+                watchSlidesProgress: true,
+                slidesPerView: 'auto',
+                centeredSlides: true,
+                loop: true,
+                loopedSlides: 3,
+                spaceBetween: 0,
+                autoplay: true,
+                pagination: {
+                    el: '.swiper-pagination'
+                    // clickable :true,
+                },
+                on: {
+                    progress: function (progress) {
+                        for (var i = 0; i < this.slides.length; i++) {
+                            var slide = this.slides.eq(i)
+                            var slideProgress = this.slides[i].progress
+                            var modify = 1
+                            if (Math.abs(slideProgress) > 1) {
+                                modify = (Math.abs(slideProgress) - 1) * 0.3 + 1
+                            }
+                            var translate = slideProgress * modify * 270 + 'px'
+                            var scale = 1 - Math.abs(slideProgress) / 3
+                            var zIndex = 999 - Math.abs(Math.round(10 * slideProgress))
+                            slide.transform('translateX(' + translate + ') scale(' + scale + ')')
+                            slide.css('zIndex', zIndex)
+                            slide.css('opacity', 1)
+                            if (Math.abs(slideProgress) > 3) {
+                                slide.css('opacity', 0)
+                            }
+                        }
+                    },
+                    setTransition: function (transition) {
+                        for (var i = 0; i < this.slides.length; i++) {
+                            var slide = this.slides.eq(i)
+                            slide.transition(transition)
+                        }
+                    }
+                }
+            }
+        }
+    },
+    methods: {
+        healthy () {
+
+        }
+    }
+}
+</script>
+<style lang="less">
+#swiper1 {
+    width: 498px;
+    height: 208px;
+    .swiper-container {
+        padding-top: 20px;
+        width: 100%;
+        height: 100%;
+
+        .swiper-slide {
+            width: 393px;
+            height: 208px;
+            background: rgba(0, 34, 36, 0.3);
+            border-radius: 10px;
+            overflow: hidden;
+
+            &.swiper-slide-prev, &.swiper-slide-next {
+                opacity: .5;
+            }
+
+            &.swiper-slide-active {
+                z-index: 10;
+                opacity: 1;
+            }
+            img {
+                display: block;
+            }
+        }
+    }
+}
+</style>
+<style lang="less" scoped>
+@imagePath: "../../static/images/sixthForm/";
+.sixth-page{
+    width: 1920px;
+    height: 1080px;
+    background: url('@{imagePath}bg.png') no-repeat center;
+    .left{
+        .left-top{
+            width: 96px;
+            height: 22px;
+            background: url('@{imagePath}btn.png') no-repeat;
+            position: absolute;
+            top: 111px;
+            left: 408px;
+        }
+        .left-bottom{
+            width: 96px;
+            height: 22px;
+            background: url('@{imagePath}btn.png') no-repeat;
+            position: absolute;
+            bottom: 271px;
+            left: 410px;
+        }
+    }
+    .center{
+        .research{
+            width: 828px;
+            height: 70px;
+            background: url('@{imagePath}research.png') no-repeat;
+            position: absolute;
+            top: 736px;
+            left: 546px;
+        }
+    }
+    .right{
+        .right-top{
+            width: 96px;
+            height: 22px;
+            background: url('@{imagePath}btn.png') no-repeat;
+            position: absolute;
+            top: 110px;
+            left: 1798px;
+        }
+        .right-bottom{
+            position: absolute;
+            top: 821px;
+            left: 1406px;
+            .title{
+                width: 152px;
+                height: 18px;
+                background: url('@{imagePath}title.png');
+            }
+        }
+        .edit{
+            width: 83px;
+            height: 35px;
+            background: url('@{imagePath}return.png');
+            position: absolute;
+            top: 39px;
+            left: 1822px;
+        }
+    }
+}
+</style>