chore：update

src/components/layout/Header.vue

@@ -110,7 +110,7 @@ const isScrolled = computed(() => {
 }
 .app-header-right {
   display: flex;
-  color: #666;
+  color: #333;
 
   .app-header-logout {
     background: url('https://webapp-pub.ezijing.com/project/saas/logout.png') no-repeat left center;

src/modules/home/components/Banner.vue

 <script lang="ts" setup>
-import { Swiper, SwiperSlide } from 'swiper/vue'
-import 'swiper/css'
-const list = [{ url: 'https://webapp-pub.ezijing.com/project_online/fi/banner.jpg' }]
+// import { Swiper, SwiperSlide } from 'swiper/vue'
+// import 'swiper/css'
+// const list = [{ url: 'https://webapp-pub.ezijing.com/project_online/paa/banner.jpg' }]
 </script>
 <template>
   <div class="banner">
-    <Swiper autoplay>
-      <SwiperSlide v-for="(item, index) in list" :key="index">
-        <img :src="item.url" />
-      </SwiperSlide>
-    </Swiper>
+    <!-- <Swiper autoplay>
+      <SwiperSlide v-for="(item, index) in list" :key="index"> -->
+    <div class="banner_con">
+      <div class="banner_tit">PAA私人资产分析师</div>
+      <div class="banner_desc">
+        PAA，即私人资产分析师（Private Assets
+        Analyst）认证体系是由隶属于清控紫荆教育（以清华大学五道口金融学院相关知识产权创设而成）的清控紫荆金融保险研究院和清控紫荆金融保险学院，针对金融保险企业绩优营销员、保险公司TOP
+        AGENT、TEAM-LEADER等受众研发设计的教学培训认证体系。
+      </div>
+    </div>
+    <!-- </SwiperSlide>
+    </Swiper> -->
   </div>
 </template>
 
 <style lang="scss">
 .banner {
-  img {
-    width: 100%;
-    height: 700px;
-    object-fit: cover;
-    object-position: center;
+  background: url('https://webapp-pub.ezijing.com/project_online/paa/banner.jpg') no-repeat center;
+  background-size: 100% 100%;
+  width: 100%;
+  object-fit: cover;
+  object-position: center;
+  box-sizing: border-box;
+  .banner_con {
+    width: 1200px;
+    margin: auto;
+    text-align: left;
+    padding: 253px 0 179px 0;
+
+    .banner_tit {
+      font-size: 40px;
+      font-weight: bold;
+      line-height: 50px;
+      color: #ffffff;
+    }
+    .banner_desc {
+      margin-top: 63px;
+      width: 650px;
+      font-size: 22px;
+      font-weight: 400;
+      line-height: 46px;
+      color: #ffffff;
+    }
   }
 }
 </style>

src/modules/home/components/ExamProcess.vue

+<script setup lang="ts"></script>
+
+<template>
+  <div class="main" id="apply">
+    <div class="main_con">
+      <div class="con_tit">
+        <img src="https://webapp-pub.ezijing.com/project_online/paa/course_tit_icon.png" class="tit_icon icon1" />
+        <div class="tit_txt">认证考试流程</div>
+        <img src="https://webapp-pub.ezijing.com/project_online/paa/course_tit_icon.png" class="tit_icon icon2" />
+      </div>
+      <img src="https://webapp-pub.ezijing.com/project_online/paa/exam_process.png" class="con_img" />
+    </div>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.main {
+  width: 100%;
+
+  background: url('https://webapp-pub.ezijing.com/project_online/paa/exam_bg.png') no-repeat center / 100% 100%;
+  box-sizing: border-box;
+  .main_con {
+    padding: 84px 0 127px 0;
+    margin: auto;
+    text-align: center;
+    .con_tit {
+      display: flex;
+      justify-content: center;
+      .tit_icon {
+        width: 40px;
+        height: 13px;
+      }
+      .icon1 {
+        padding-top: 5px;
+        margin-right: -7px;
+      }
+      .icon2 {
+        padding-top: 20px;
+        margin-left: -7px;
+      }
+      .tit_txt {
+        font-size: 28px;
+        font-weight: 400;
+        line-height: 34px;
+        color: #ffffff;
+      }
+    }
+    .con_img {
+      margin-top: 83px;
+    }
+  }
+}
+</style>

src/modules/home/components/Main.vue

 <script lang="ts" setup>
 import 'swiper/css'
+const mainList: Array<{ img: string; tit: string }> = [
+  {
+    img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online/paa/main1.png',
+    tit: '严谨的课程体系'
+  },
+  {
+    img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online/paa/main2.png',
+    tit: '系统的教学平台'
+  },
+  {
+    img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online/paa/main1.png',
+    tit: '灵活的学习模式'
+  }
+]
+const mainList1: Array<{ img: string; img1: string; tit: string; desc: string }> = [
+  {
+    img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online/paa/main4_1.png',
+    img1: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online/paa/main4_2.png',
+    tit: '考培分离',
+    desc: '灵活自如公平公正'
+  },
+  {
+    img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online/paa/main5_1.png',
+    img1: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online/paa/main5_2.png',
+    tit: '千人千卷',
+    desc: '因材施教百炼成钢'
+  },
+  {
+    img: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online/paa/main6_1.png',
+    img1: 'https://webapp-pub.oss-cn-beijing.aliyuncs.com/project_online/paa/main6_2.png',
+    tit: '专属辅导',
+    desc: '高效学习精准施教'
+  }
+]
 </script>
 <template>
   <div class="main">
     <div class="main_con">
-      <img src="https://webapp-pub.ezijing.com/project_online/fi/main1.png" alt="" />
-      <div class="con_content">
-        清控紫荆金融保险研究院&清控紫荆金融保险学院，基于政策指导，通过汇聚清华等国内外高校、行业骨干企业、行业研究机构的科研资源与实践成果，打造国内顶尖、国际卓越的金融保险智库，达到“产学研”的深度融合；通过创立通晓金融保险理论与行业实务双方面的金融保险课题研发团队，针对金融保险不同领域、不同阶段的学习需求，为金融从业者提供专业学习契机、为金融机构培育高素质国际化人才。
+      <div class="con_tit">PAA 做私人权属资产服务的专家</div>
+      <div class="con_line"></div>
+      <div class="con_list">
+        <div class="list_item" v-for="(item, index) in mainList" :key="index">
+          <img :src="item.img" class="item_img" />
+          <div class="item_tit">{{ item.tit }}</div>
+        </div>
       </div>
     </div>
     <div class="main_con1">
-      核心产品为紫荆教育专属版权产品，站在高起点、高站位、高规格的“三高”教育标准平台上，向社会和企业精<br />英人士教授与传承“格与质”、“道与术”、“欲与渔”的经营管理品格和能力，主打行业认证类、行业标准类<br />和定制专属类等三类金融职业类培育体系。
+      <div class="con1_list">
+        <div class="list_item" v-for="(item, index) in mainList1" :key="index">
+          <img :src="item.img" class="item_img" />
+          <img :src="item.img1" class="item_img1" />
+          <div class="item_line"></div>
+          <div class="item_tit">{{ item.tit }}</div>
+          <div class="item_desc">{{ item.desc }}</div>
+        </div>
+      </div>
     </div>
   </div>
 </template>
 <style lang="scss" scoped>
 .main {
-  background: #f5f5f5;
   .main_con {
     width: 1200px;
-    margin: 95px auto;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-
-    .con_content {
-      background: #ffffff;
-      position: relative;
-      margin-left: -143px;
-      z-index: 100;
-      font-size: 20px;
-      font-weight: 400;
-      line-height: 40px;
+    height: 185px;
+    background: #ffffff;
+    box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.15);
+    border-radius: 16px;
+    margin: -70px auto;
+    position: relative;
+    z-index: 10;
+    box-sizing: border-box;
+    .con_tit {
+      text-align: center;
+      font-size: 22px;
+      font-weight: bold;
+      line-height: 50px;
       color: #333333;
-      padding: 69px 55px 62px 58px;
+      padding-top: 33px;
+    }
+    .con_line {
+      border-bottom: 1px dashed #000000;
+    }
+    .con_list {
+      display: flex;
+      justify-content: space-around;
+      align-items: center;
+      margin-top: 19px;
+      .list_item {
+        display: flex;
+        align-items: center;
+        .item_tit {
+          margin-left: 15px;
+          font-size: 20px;
+          font-weight: 400;
+          line-height: 50px;
+          color: #333333;
+        }
+      }
     }
   }
   .main_con1 {
-    height: 308px;
-    background: url('https://webapp-pub.ezijing.com/project_online/fi/main2.png') no-repeat center;
-    background-size: 100% 100%;
-    font-size: 24px;
-    font-weight: 400;
-    line-height: 40px;
-    color: #ffffff;
-    text-align: center;
-    padding-top: 100px;
+    width: 1200px;
+    margin: 144px auto;
+    padding: 0 50px;
     box-sizing: border-box;
+    .con1_list {
+      display: grid;
+      grid-template-columns: repeat(3, 1fr);
+      grid-column-gap: 85px;
+      .list_item {
+        width: 310px;
+        height: 367px;
+        background: #ffffff;
+        border-radius: 4px;
+        border: 1px solid #dadada;
+        padding-top: 104px;
+        box-sizing: border-box;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        cursor: pointer;
+        .item_img1 {
+          display: none;
+        }
+        .item_line {
+          width: 50px;
+          height: 2px;
+          background: #aa1941;
+          margin: 41px auto;
+          text-align: center;
+        }
+        .item_tit {
+          font-size: 24px;
+          font-weight: 500;
+          line-height: 34px;
+          color: #333333;
+        }
+        .item_desc {
+          display: none;
+          font-size: 20px;
+          font-weight: 400;
+          line-height: 50px;
+          color: #ffffff;
+        }
+        &:hover {
+          background: #c1ab85;
+          padding-top: 84px;
+
+          .item_img {
+            display: none;
+          }
+          .item_img1 {
+            display: block;
+          }
+          .item_line {
+            background: #ffffff;
+          }
+          .item_tit {
+            color: #ffffff;
+          }
+          .item_desc {
+            display: block;
+          }
+        }
+      }
+    }
   }
 }
 </style>

src/modules/home/components/Teacher.vue

@@ -83,10 +83,10 @@ function next(swiper) {
 <template>
   <section class="section" id="teacher">
     <div class="section__inner">
-      <div class="section-title">
-        <em class="section-title_dot"></em>
-        <h2>师资团队</h2>
-        <em class="section-title_dot"></em>
+      <div class="con_tit">
+        <img src="https://webapp-pub.ezijing.com/project_online/paa/course_tit_icon.png" class="tit_icon icon1" />
+        <div class="tit_txt">师资团队</div>
+        <img src="https://webapp-pub.ezijing.com/project_online/paa/course_tit_icon.png" class="tit_icon icon2" />
       </div>
       <h3 class="subtitle">清华大学知名教授、博士生导师</h3>
       <div class="my-swiper">
@@ -96,7 +96,8 @@ function next(swiper) {
           :slidesPerView="4"
           :spaceBetween="20"
           :modules="[Navigation]"
-          @swiper="swiper => (swiper1 = swiper)">
+          @swiper="swiper => (swiper1 = swiper)"
+        >
           <SwiperSlide v-for="(item, index) in list" :key="index" class="teacher-item">
             <img :src="item.avatar" />
             <h3>{{ item.name }}</h3>
@@ -116,9 +117,10 @@ function next(swiper) {
           :slidesPerView="4"
           :spaceBetween="20"
           :modules="[Navigation]"
-          @swiper="swiper => (swiper2 = swiper)">
-          <SwiperSlide v-for="(item, index) in list2" :key="index" class="teacher-item">
-            <img :src="item.avatar" />
+          @swiper="swiper => (swiper2 = swiper)"
+        >
+          <SwiperSlide v-for="(item, index) in list2" :key="index" class="teacher-item1">
+            <!-- <img :src="item.avatar" /> -->
             <h3>{{ item.name }}</h3>
             <ol v-if="item.children?.length">
               <li v-for="item in item.children" :key="item">{{ item }}</li>
@@ -137,7 +139,8 @@ function next(swiper) {
   --section-title-color: #fff;
   --section-title-dot-bgcolor: #fff;
   --section-title-dot-border-color: #fff;
-  background: url('https://webapp-pub.ezijing.com/project_online/fi/teacher_bg.jpg') no-repeat center top;
+  background: url('https://webapp-pub.ezijing.com/project_online/fi/teacher_bg.jpg') no-repeat center;
+  background-size: 100% 100%;
 }
 .section-title {
   padding-bottom: 0;
@@ -148,6 +151,29 @@ function next(swiper) {
   min-height: 1080px;
   margin: 0 auto;
 }
+.con_tit {
+  display: flex;
+  justify-content: center;
+  padding-top: 84px;
+  .tit_icon {
+    width: 40px;
+    height: 13px;
+  }
+  .icon1 {
+    padding-top: 5px;
+    margin-right: -7px;
+  }
+  .icon2 {
+    padding-top: 20px;
+    margin-left: -7px;
+  }
+  .tit_txt {
+    font-size: 28px;
+    font-weight: 400;
+    line-height: 34px;
+    color: #ffffff;
+  }
+}
 .subtitle {
   margin: 60px 0 30px;
   font-size: 24px;
@@ -216,4 +242,45 @@ function next(swiper) {
     margin-top: 10px;
   }
 }
+.teacher-item1 {
+  width: 267px;
+  height: 208px;
+  background-color: #fff;
+  border-radius: 4px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding-top: 32px;
+  box-sizing: border-box;
+  h3 {
+    // margin-top: 12px;
+    font-size: 18px;
+    font-weight: 500;
+    line-height: 1;
+    color: #333;
+    text-align: center;
+  }
+  ol {
+    margin-top: 29px;
+    li {
+      position: relative;
+      margin: 0 29px;
+      font-size: 16px;
+      line-height: 24px;
+      color: #535353;
+      &::before {
+        content: '';
+        position: absolute;
+        left: -10px;
+        top: 9px;
+        width: 5px;
+        height: 5px;
+        background: #c1ab85;
+      }
+    }
+  }
+  li + li {
+    margin-top: 11px;
+  }
+}
 </style>

src/modules/home/views/Index.vue

@@ -2,15 +2,21 @@
 import Banner from '../components/Banner.vue'
 import Main from '../components/Main.vue'
 import ProjectSystem from '../components/ProjectSystem.vue'
-import Teacher from '../components/Teacher.vue'
-import Knowledge from '../components/Knowledge.vue'
 import Course from '../components/Course.vue'
-import Brand from '../components/Brand.vue'
-import Contact from '../components/Contact.vue'
+import ExamProcess from '../components/ExamProcess.vue'
+
+import Teacher from '../components/Teacher.vue'
+// import Knowledge from '../components/Knowledge.vue'
+// import Brand from '../components/Brand.vue'
+// import Contact from '../components/Contact.vue'
 </script>
 
 <template>
   <Banner></Banner>
+  <Main></Main>
+  <ProjectSystem></ProjectSystem>
+  <Course></Course>
+  <ExamProcess></ExamProcess>
   <Teacher></Teacher>
 </template>