更新优化打包

dist/assets/index.fbcd64fe.js → dist/assets/index.20ca9a8b.js

@@ -1 +1 @@
-import{C as n}from"./index.5d094fac.js";import{d as o,V as l,a as t,u as i,j as s}from"./vendor.a0144ce9.js";import{n as c,e as m,c as r}from"./icon_name_active.5a25be96.js";import{C as d,a as p}from"./index.f7cec036.js";import"./index.71fa0d03.js";import"./index.6b5c8453.js";/* empty css                *//* empty css               *//* empty css               *//* empty css               *//* empty css               *//* empty css               *//* empty css               *//* empty css                *//* empty css                */import"./icon_tips.9bbfc6f5.js";import"./index.05e981c6.js";import"./index.523f0064.js";/* empty css                *//* empty css               */import"./index.ac03cc7c.js";import"./icon_student.bbb32387.js";import"./checkbox_default.b252ed9d.js";const v="_classWrap_kvlzi_1",u="_tabs_kvlzi_4",b="_tabItem_kvlzi_11",j="_title_kvlzi_23",_="_tabItemRight_kvlzi_26",x="_tabItemActive_kvlzi_29";var e={classWrap:v,tabs:u,tabItem:b,title:j,tabItemRight:_,tabItemActive:x},K=o({name:"ClassArrangement",setup(){const a=l(1);return()=>t("div",{class:e.classWrap},[t(n,null,null),t("div",{class:e.tabs},[t("div",{class:[e.tabItem,e.tabItemActive]},[t(i,{name:c,size:38},null),t("span",{class:e.title},[s("\u8BFE\u7A0B\u4FE1\u606F")])]),t("div",{class:[e.tabItem,e.tabItemRight,a.value>1?e.tabItemActive:""]},[t(i,{name:a.value>1?m:r,size:38},null),t("span",{class:e.title},[s("\u8BFE\u7A0B\u5B89\u6392")])])]),t("div",{style:{display:a.value===1?"block":"none"}},[t(d,{onSubmit:I=>{a.value=2}},null)]),t("div",{style:{display:a.value===2?"block":"none"}},[t(p,{onBack:()=>a.value=1,active:a.value},null)])])}});export{K as default};
+import{C as n}from"./index.5d094fac.js";import{d as o,V as l,a as t,u as i,j as s}from"./vendor.a0144ce9.js";import{n as c,e as m,c as r}from"./icon_name_active.5a25be96.js";import{C as d,a as p}from"./index.f98bc5a5.js";import"./index.71fa0d03.js";import"./index.6b5c8453.js";/* empty css                *//* empty css               *//* empty css               *//* empty css               *//* empty css               *//* empty css               *//* empty css               *//* empty css                *//* empty css                */import"./icon_tips.9bbfc6f5.js";import"./index.05e981c6.js";import"./index.523f0064.js";/* empty css                *//* empty css               */import"./index.ac03cc7c.js";import"./icon_student.bbb32387.js";import"./checkbox_default.25179a07.js";const v="_classWrap_kvlzi_1",u="_tabs_kvlzi_4",b="_tabItem_kvlzi_11",j="_title_kvlzi_23",_="_tabItemRight_kvlzi_26",x="_tabItemActive_kvlzi_29";var e={classWrap:v,tabs:u,tabItem:b,title:j,tabItemRight:_,tabItemActive:x},K=o({name:"ClassArrangement",setup(){const a=l(1);return()=>t("div",{class:e.classWrap},[t(n,null,null),t("div",{class:e.tabs},[t("div",{class:[e.tabItem,e.tabItemActive]},[t(i,{name:c,size:38},null),t("span",{class:e.title},[s("\u8BFE\u7A0B\u4FE1\u606F")])]),t("div",{class:[e.tabItem,e.tabItemRight,a.value>1?e.tabItemActive:""]},[t(i,{name:a.value>1?m:r,size:38},null),t("span",{class:e.title},[s("\u8BFE\u7A0B\u5B89\u6392")])])]),t("div",{style:{display:a.value===1?"block":"none"}},[t(d,{onSubmit:I=>{a.value=2}},null)]),t("div",{style:{display:a.value===2?"block":"none"}},[t(p,{onBack:()=>a.value=1,active:a.value},null)])])}});export{K as default};

dist/assets/teacher_cert-legacy.f997e14c.js

@@ -1 +0,0 @@
-;(function(){System.register([],function(exports){'use strict';return{execute:function execute(){var musicCert=exports('m',"./assets/music_cert.c3745c92.png");var teacherCert=exports('t',"./assets/teacher_cert.e88e7df1.png");}};});})();

dist/assets/teacher_cert.5c45c8b4.js

@@ -1 +0,0 @@
-var e="./assets/music_cert.c3745c92.png",s="./assets/teacher_cert.e88e7df1.png";export{e as m,s as t};

dist/index.html

@@ -35,12 +35,12 @@
     <meta name="msapplication-tap-highlight" content="no" />
     <title>酷乐秀</title>
     <script src="./flexible.js" charset="UTF-8"></script>
-    <script type="module" crossorigin src="./assets/index.b33bf224.js"></script>
+    <script type="module" crossorigin src="./assets/index.63f0cafa.js"></script>
     <link rel="modulepreload" href="./assets/vendor.a0144ce9.js">
     <link rel="modulepreload" href="./assets/index.71fa0d03.js">
     <link rel="stylesheet" href="./assets/vendor.42d1964e.css">
     <link rel="stylesheet" href="./assets/index.5242455e.css">
-    <link rel="stylesheet" href="./assets/index.5062a520.css">
+    <link rel="stylesheet" href="./assets/teacher.a6c9550a.css">
     <script type="module">!function(){try{new Function("m","return import(m)")}catch(o){console.warn("vite: loading legacy build because dynamic import is unsupported, syntax error above should be ignored");var e=document.getElementById("vite-legacy-polyfill"),n=document.createElement("script");n.src=e.src,n.onload=function(){System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))},document.body.appendChild(n)}}();</script>
   </head>
 
@@ -49,7 +49,7 @@
     
     <!-- <script type="module" src="/src/teacher/main.ts"></script> -->
     <script nomodule>!function(){var e=document,t=e.createElement("script");if(!("noModule"in t)&&"onbeforeload"in t){var n=!1;e.addEventListener("beforeload",(function(e){if(e.target===t)n=!0;else if(!e.target.hasAttribute("nomodule")||!n)return;e.preventDefault()}),!0),t.type="module",t.src=".",e.head.appendChild(t),t.remove()}}();</script>
-    <script nomodule id="vite-legacy-polyfill" src="./assets/polyfills-legacy.38ab39eb.js"></script>
-    <script nomodule id="vite-legacy-entry" data-src="./assets/index-legacy.ac498d2b.js">System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))</script>
+    <script nomodule id="vite-legacy-polyfill" src="./assets/polyfills-legacy.230ab621.js"></script>
+    <script nomodule id="vite-legacy-entry" data-src="./assets/index-legacy.acf04c3c.js">System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))</script>
   </body>
 </html>

dist/teacher.html

@@ -35,12 +35,12 @@
     <meta name="msapplication-tap-highlight" content="no" />
     <title>酷乐秀</title>
     <script src="./flexible.js" charset="UTF-8"></script>
-    <script type="module" crossorigin src="./assets/teacher.6422bcba.js"></script>
+    <script type="module" crossorigin src="./assets/teacher.64549df4.js"></script>
     <link rel="modulepreload" href="./assets/vendor.a0144ce9.js">
     <link rel="modulepreload" href="./assets/index.71fa0d03.js">
     <link rel="stylesheet" href="./assets/index.5242455e.css">
     <link rel="stylesheet" href="./assets/vendor.42d1964e.css">
-    <link rel="stylesheet" href="./assets/index.5062a520.css">
+    <link rel="stylesheet" href="./assets/teacher.a6c9550a.css">
     <script type="module">!function(){try{new Function("m","return import(m)")}catch(o){console.warn("vite: loading legacy build because dynamic import is unsupported, syntax error above should be ignored");var e=document.getElementById("vite-legacy-polyfill"),n=document.createElement("script");n.src=e.src,n.onload=function(){System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))},document.body.appendChild(n)}}();</script>
   </head>
 
@@ -48,7 +48,7 @@
     <div id="app"></div>
     
     <script nomodule>!function(){var e=document,t=e.createElement("script");if(!("noModule"in t)&&"onbeforeload"in t){var n=!1;e.addEventListener("beforeload",(function(e){if(e.target===t)n=!0;else if(!e.target.hasAttribute("nomodule")||!n)return;e.preventDefault()}),!0),t.type="module",t.src=".",e.head.appendChild(t),t.remove()}}();</script>
-    <script nomodule id="vite-legacy-polyfill" src="./assets/polyfills-legacy.38ab39eb.js"></script>
-    <script nomodule id="vite-legacy-entry" data-src="./assets/teacher-legacy.c482b42e.js">System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))</script>
+    <script nomodule id="vite-legacy-polyfill" src="./assets/polyfills-legacy.230ab621.js"></script>
+    <script nomodule id="vite-legacy-entry" data-src="./assets/teacher-legacy.ef753b13.js">System.import(document.getElementById('vite-legacy-entry').getAttribute('data-src'))</script>
   </body>
 </html>

src/teacher/music-cert/index.module.less

@@ -1,5 +1,5 @@
 .music-cert {
-  background: linear-gradient(213deg, #5ae2b8 0%, #27c695 100%);
+  background: #16146a;
   min-height: 100vh;
   position: relative;
   overflow: hidden;
@@ -12,109 +12,61 @@
   }
 
   .cert-section {
-    margin: 362px 14px 0;
-    background: #cbfdd5;
+    margin: 337px 14px 8px;
+    background: #2c288a;
     border-radius: 29px;
-    border: 15px solid #cbfdd5;
-    position: relative;
-    z-index: 3;
+    display: flex;
+    align-items: center;
+    flex-direction: column;
 
-    .cert-text {
-      background: #ffffff;
-      border-radius: 26px;
-      padding: 8px 13px 12px;
-      margin-bottom: 13px;
-      &:last-child {
-        margin-bottom: 0;
-      }
+    .title {
+      display: inline-block;
+      font-size: 16px;
+      font-weight: 600;
+      color: #ffffff;
+      line-height: 32px;
+      background: linear-gradient(171deg, #c1d9ff 0%, #ffd1fa 100%);
+      border-radius: 16px;
+      padding: 0 20px;
+      margin: 0 auto;
+      margin-top: -16px;
     }
 
-    .cert-tree {
-      padding-left: 5px;
-      padding-right: 5px;
-    }
+    .item {
+      margin: 0 20px;
+      padding: 16px 0;
+      display: flex;
+      align-items: center;
+      border-bottom: 1px dashed #ffffff;
 
-    .cert-padding {
-      padding: 8px 13px 17px;
-    }
+      .logo {
+        width: 50px;
+        height: 50px;
+        margin-left: 28px;
+      }
 
-    .title {
-      display: block;
-      // width: 148px;
-      height: 32px;
-      margin: 0 auto;
-    }
-    .cert-join {
-      padding-top: 14px;
-      font-size: 13px;
-      color: #005852;
-      line-height: 22px;
-    }
-    .cert-desc {
-      padding-top: 9px;
-      text-align: center;
-      font-size: 13px;
-      color: #005852;
-      line-height: 26px;
-      p {
-        position: relative;
-        z-index: 2;
-        display: inline-block;
-        // padding: 0 8px;
-        &::after {
-          content: ' ';
-          width: 100%;
-          display: inline-block;
-          height: 10px;
-          background: #cbfdd5;
-          border-radius: 5px;
-          opacity: 0.63;
-          position: absolute;
-          left: 0;
-          bottom: 3px;
-          z-index: -1;
-        }
+      &:last-child {
+        border-bottom: 0;
       }
     }
-  }
 
-  .cert-item {
-    display: flex;
-    align-items: flex-start;
-    justify-content: space-between;
-    margin-bottom: 15px;
-    &:last-child {
-      margin-bottom: 0;
-    }
-    .certLogo {
-      width: 63px;
-      height: 52px;
-      .logo {
-        width: inherit;
-        height: inherit;
+    .subTitle {
+      display: flex;
+      align-items: center;
+      font-size: 16px;
+      font-weight: 500;
+      color: #ffffff;
+      line-height: 30px;
+      img {
+        margin-right: 6px;
+        height: 17px;
       }
     }
 
-    .certInfo {
-      margin-left: 10px;
-      .certInfoHeader {
-        display: flex;
-        align-items: center;
-        font-size: 16px;
-        font-weight: 500;
-        color: #333333;
-        line-height: 30px;
-        .num {
-          width: 25px;
-          height: 18px;
-          margin-right: 6px;
-        }
-      }
-      .certInfoDesc {
-        font-size: 13px;
-        color: #666666;
-        line-height: 22px;
-      }
+    .subConent {
+      font-size: 13px;
+      color: #ffffff;
+      line-height: 22px;
     }
   }
 

src/teacher/music-cert/index.tsx

@@ -71,62 +71,70 @@ export default defineComponent({
           <div class={styles['music-cert']}>
             <div class={styles.certWrapper}>
               <div class={[styles['cert-section'], 'mb12']}>
-                <div class={[styles['cert-text'], styles['cert-tree']]}>
+                <div class={styles.title}>来成为酷乐秀音乐人吧！</div>
+
+                <div class={styles.item}>
+                  <div class={styles.content}>
+                    <div class={styles.subTitle}>
+                      <img src={getAssetsHomeFile('1.png')} />
+                      <span>教学视频分享达人</span>
+                    </div>
+                    <div class={styles.subConent}>
+                      发布您制作的教学视频内容，展现不同类型的
+                    </div>
+                  </div>
                   <img
-                    src={getAssetsHomeFile('tip.png')}
-                    class={styles.title}
+                    src={getAssetsHomeFile('logo2.png')}
+                    class={styles.logo}
                   />
-                  <div class={styles['cert-desc']}>
-                    <p style={{ paddingRight: 0 }}>
-                      酷乐秀对有能力编曲的音乐人开通上传曲谱权限，
-                    </p>
-                    <p>开通后您可上传自己编曲的乐谱MIDI</p>
-                    <p>让平台学员进行练习，并获取收益</p>
+                </div>
+
+                <div class={styles.item}>
+                  <div class={styles.content}>
+                    <div class={styles.subTitle}>
+                      <img src={getAssetsHomeFile('2.png')} />
+                      <span>教学视频分享达人</span>
+                    </div>
+                    <div class={styles.subConent}>
+                      发布您制作的教学视频内容，展现不同类型的
+                    </div>
                   </div>
+                  <img
+                    src={getAssetsHomeFile('logo3.png')}
+                    class={styles.logo}
+                  />
                 </div>
 
-                <div class={[styles['cert-show'], styles['cert-text']]}>
-                  <div class={[styles['cert-item']]}>
-                    <div class={styles.certLogo}>
-                      <Image
-                        class={styles.logo}
-                        src={getAssetsHomeFile('logo1.png')}
-                      />
+                <div class={styles.item}>
+                  <div class={styles.content}>
+                    <div class={styles.subTitle}>
+                      <img src={getAssetsHomeFile('3.png')} />
+                      <span>教学视频分享达人</span>
                     </div>
-                    <div class={styles.certInfo}>
-                      <div class={styles.certInfoHeader}>
-                        <Image
-                          class={styles.num}
-                          src={getAssetsHomeFile('1.png')}
-                        />
-                        MP3文件上传
-                      </div>
-                      <div class={styles.certInfoDesc}>
-                        您可上传自己编曲的乐谱MP3，并自定义乐谱价格，为平台学员提供智能陪练练习。
-                      </div>
+                    <div class={styles.subConent}>
+                      发布您制作的教学视频内容，展现不同类型的
                     </div>
                   </div>
+                  <img
+                    src={getAssetsHomeFile('logo1.png')}
+                    class={styles.logo}
+                  />
+                </div>
 
-                  <div class={[styles['cert-item']]}>
-                    <div class={styles.certLogo}>
-                      <Image
-                        class={styles.logo}
-                        src={getAssetsHomeFile('logo2.png')}
-                      />
+                <div class={styles.item}>
+                  <div class={styles.content}>
+                    <div class={styles.subTitle}>
+                      <img src={getAssetsHomeFile('4.png')} />
+                      <span>教学视频分享达人</span>
                     </div>
-                    <div class={styles.certInfo}>
-                      <div class={styles.certInfoHeader}>
-                        <Image
-                          class={styles.num}
-                          src={getAssetsHomeFile('2.png')}
-                        />
-                        乐谱收益
-                      </div>
-                      <div class={styles.certInfoDesc}>
-                        您可对上传的乐谱自定义价格，学员可自行挑选乐谱购买，购买后您将获取学员购买收入。
-                      </div>
+                    <div class={styles.subConent}>
+                      发布您制作的教学视频内容，展现不同类型的
                     </div>
                   </div>
+                  <img
+                    src={getAssetsHomeFile('logo4.png')}
+                    class={styles.logo}
+                  />
                 </div>
               </div>
 

src/teacher/teacher-cert/cert-info.module.less

@@ -1,166 +1,60 @@
 .cert-info {
-  background: linear-gradient(180deg, #86dbf7 0%, #9be4ff 100%);
-  // padding: 0 0 12px;
   min-height: 100vh;
   position: relative;
   overflow: hidden;
-  .certContent {
-    background: url('./images/header.png') no-repeat center top;
-    background-size: 100%;
-    width: 100%;
-    height: 230px;
-    margin-top: 40px;
-    margin-bottom: -18px;
-    z-index: 2;
-    position: relative;
-  }
-
-  .certHeader {
-    line-height: var(--van-nav-bar-height);
-    text-align: center;
-    max-width: 60%;
-    margin: 0 auto;
-    color: var(--van-nav-bar-title-text-color);
-    font-weight: var(--van-font-weight-bold);
-    font-size: var(--van-nav-bar-title-font-size);
-  }
-
-  .certWhite {
-    background-color: #ffffff;
-  }
+  background: url('./images/header.png') no-repeat center top #2dc7aa;
+  background-size: 100%;
+  width: 100%;
 
   .certWrapper {
-    background: #4ebc55;
+    padding-top: 300px;
   }
 
-  .cert-section {
-    margin: 0 14px;
-    background: #cbfdd5;
-    border-radius: 29px;
-    border: 15px solid #cbfdd5;
-    position: relative;
-    z-index: 3;
-
-    .cert-text {
-      background: #ffffff;
-      border-radius: 26px;
-      padding: 8px 24px 12px;
-      margin-bottom: 13px;
-      &:last-child {
-        margin-bottom: 0;
-      }
-    }
-    .cert-padding {
-      padding: 8px 14px 17px;
-    }
+  .section {
+    background-color: #fff;
+    margin: 0 12px 10px;
+    padding: 14px 13px;
+    border-radius: 10px;
+    border: 1px solid #e0f7f3;
 
     .title {
-      display: block;
-      // width: 148px;
-      height: 32px;
-      margin: 0 auto;
-    }
-    .cert-join {
-      padding-top: 14px;
-      font-size: 13px;
-      color: #005852;
-      line-height: 22px;
-    }
-    .cert-desc {
-      padding-top: 9px;
-      text-align: center;
-      font-size: 13px;
-      color: #005852;
-      line-height: 26px;
-      p {
-        position: relative;
-        z-index: 2;
-        display: inline-block;
-        padding: 0 8px;
-        &::after {
-          content: ' ';
-          width: 100%;
-          display: inline-block;
-          height: 10px;
-          background: #cbfdd5;
-          border-radius: 5px;
-          opacity: 0.63;
-          position: absolute;
-          left: 0;
-          bottom: 3px;
-          z-index: -1;
-        }
+      display: flex;
+      img {
+        height: 29px;
       }
+      font-size: 16px;
+      font-weight: 600;
+      color: #2dc7aa;
+      line-height: 26px;
     }
-  }
 
-  .cert-tree {
-    position: relative;
-    &::before,
-    &::after {
-      content: ' ';
-      display: inline-block;
-      position: absolute;
-    }
-    &::before {
-      top: -13px;
-      left: 3px;
-      background: url('./images/tree2.png') no-repeat center;
-      background-size: 100%;
-      width: 38px;
-      height: 42px;
-    }
-    &::after {
-      right: 0px;
-      bottom: -20px;
-      background: url('./images/tree1.png') no-repeat center;
-      background-size: 100%;
-      width: 39px;
-      height: 45px;
+    .content {
+      font-size: 14px;
+      color: #333333;
+      line-height: 22px;
+      padding: 10px 6px;
+      text-align: justify;
     }
   }
 
-  .cert-show {
-    padding: 18px 7px !important;
-  }
-
-  .cert-item {
+  .operation {
     display: flex;
-    align-items: flex-start;
-    // justify-content: space-between;
-    margin-bottom: 15px;
-    &:last-child {
-      margin-bottom: 0;
+
+    .item {
+      flex: 1;
+      text-align: center;
     }
-    .certLogo {
-      width: 63px;
-      height: 52px;
-      .logo {
-        width: inherit;
-        height: inherit;
-      }
+
+    img {
+      width: 50px;
+      height: 50px;
     }
 
-    .certInfo {
-      margin-left: 10px;
-      .certInfoHeader {
-        display: flex;
-        align-items: center;
-        font-size: 16px;
-        font-weight: 500;
-        color: #333333;
-        line-height: 30px;
-        .num {
-          width: 25px;
-          height: 18px;
-          margin-right: 6px;
-        }
-      }
-      .certInfoDesc {
-        font-size: 13px;
-        color: #666666;
-        line-height: 22px;
-      }
+    p {
+      padding-top: 5px;
+      font-size: 12px;
+      color: #666666;
+      line-height: 22px;
     }
   }
 

src/teacher/teacher-cert/cert-info.tsx

@@ -33,141 +33,72 @@ export default defineComponent({
   render() {
     return (
       <div class={styles['cert-info']}>
-        {/* <div class={styles.certContent}> */}
-        <ColHeader
-          v-slots={{
-            content: () => (
-              <Sticky position="top" offsetTop={0}></Sticky>
-              //   <div class={[styles.certHeader, this.headStatus ? styles.certWhite : null]}>
-              //     老师认证
-              //   </div>
-            )
-          }}
-        />
-
-        <div class={styles.certContent}></div>
-
         <div class={styles.certWrapper}>
-          <div class={styles['cert-section']}>
-            <div class={[styles['cert-text'], styles['cert-tree']]}>
-              <img src={getAssetsHomeFile('base.png')} class={styles.title} />
-              <div class={styles['cert-desc']}>
-                <p>酷乐秀是一款为器乐学习者提供智能陪练及</p>
-                <p style={{ paddingRight: 0 }}>线上授课撮合的乐器教学平台，</p>
-                <p>器乐老师可通过自身的专业知识为自己带来</p>
-                <p style={{ paddingRight: 0, fontWeight: 'bold' }}>
-                  授课及曲谱销售收益。
-                </p>
-              </div>
+          <div class={styles.section}>
+            <div class={styles.title}>
+              <img src={getAssetsHomeFile('1.png')} />
+              什么是酷乐秀音乐达人？
             </div>
 
-            <div class={[styles['cert-show'], styles['cert-text']]}>
-              <div class={[styles['cert-item']]}>
-                <div class={styles.certLogo}>
-                  <Image
-                    class={styles.logo}
-                    src={getAssetsHomeFile('logo1.png')}
-                  />
-                </div>
-                <div class={styles.certInfo}>
-                  <div class={styles.certInfoHeader}>
-                    <Image
-                      class={styles.num}
-                      src={getAssetsHomeFile('1.png')}
-                    />
-                    线上授课
-                  </div>
-                  <div class={styles.certInfoDesc}>
-                    认证成为酷乐秀老师后，可设置您的空闲时间为平台中的求学者进行1对1的线上课程指导。
-                  </div>
-                </div>
-              </div>
+            <p class={styles.content}>
+              酷乐秀音乐人是酷乐秀优质的内容创作提供者，包含乐谱歌单达人，教学视频分享达人，演奏MLog达人，直播up达人
+            </p>
 
-              <div class={[styles['cert-item']]}>
-                <div class={styles.certLogo}>
-                  <Image
-                    class={styles.logo}
-                    src={getAssetsHomeFile('logo2.png')}
-                  />
-                </div>
-                <div class={styles.certInfo}>
-                  <div class={styles.certInfoHeader}>
-                    <Image
-                      class={styles.num}
-                      src={getAssetsHomeFile('2.png')}
-                    />
-                    个人风采展示
-                  </div>
-                  <div class={styles.certInfoDesc}>
-                    可发布自己的专业经历、获奖记录及音视频资料对求学者展示，让学员更加深入的了解您的专业技能，从而提高约课率。
-                  </div>
-                </div>
+            <div class={styles.operation}>
+              <div class={styles.item}>
+                <img src={getAssetsHomeFile('logo1.png')} />
+                <p>乐谱歌单</p>
               </div>
-
-              <div class={[styles['cert-item']]}>
-                <div class={styles.certLogo}>
-                  <Image
-                    class={styles.logo}
-                    src={getAssetsHomeFile('logo3.png')}
-                  />
-                </div>
-                <div class={styles.certInfo}>
-                  <div class={styles.certInfoHeader}>
-                    <Image
-                      class={styles.num}
-                      src={getAssetsHomeFile('3.png')}
-                    />
-                    曲谱上传
-                  </div>
-                  <div class={styles.certInfoDesc}>
-                    可上传您制作的MIDI乐谱为求学者提供学习曲目的途径，并从中获得收益。
-                  </div>
-                </div>
+              <div class={styles.item}>
+                <img src={getAssetsHomeFile('logo2.png')} />
+                <p>教学视频</p>
               </div>
-
-              <div class={[styles['cert-item']]}>
-                <div class={styles.certLogo}>
-                  <Image
-                    class={styles.logo}
-                    src={getAssetsHomeFile('logo4.png')}
-                  />
-                </div>
-                <div class={styles.certInfo}>
-                  <div class={styles.certInfoHeader}>
-                    <Image
-                      class={styles.num}
-                      src={getAssetsHomeFile('4.png')}
-                    />
-                    收益提现
-                  </div>
-                  <div class={styles.certInfoDesc}>
-                    在您授课及上传曲谱销售后，经过平台核算，将您获得的收益发放至您的个人账户下，您可随时将自己获得的收益提现。
-                  </div>
-                </div>
+              <div class={styles.item}>
+                <img src={getAssetsHomeFile('logo3.png')} />
+                <p>演奏MLog</p>
+              </div>
+              <div class={styles.item}>
+                <img src={getAssetsHomeFile('logo4.png')} />
+                <p>直播up达人</p>
               </div>
             </div>
+          </div>
 
-            <div class={[styles['cert-text'], styles['cert-padding']]}>
-              <img src={getAssetsHomeFile('join.png')} class={styles.title} />
-              <div class={styles['cert-join']}>
-                在艺术的殿堂中，为他人照亮前进的道路，用自己的经验和点拨，传播艺术的种子，获取硕果。
-              </div>
+          <div class={styles.section}>
+            <div class={styles.title}>
+              <img src={getAssetsHomeFile('2.png')} />
+              酷乐秀能为达人提供哪些服务？
             </div>
+
+            <p class={styles.content}>
+              酷乐秀提供现金激励，商业分成等福利政策，帮助达人内容变现，
+              提供流量扶持等政策，帮助达人推广优质內容。
+            </p>
           </div>
 
-          <Sticky position="bottom" offsetBottom={0}>
-            <div class={styles['btn-group']}>
-              <div
-                class={[
-                  styles.btn,
-                  teacherState.authStatus ? styles.disabled : null
-                ]}
-                onClick={this.onClick}
-              ></div>
+          <div class={styles.section}>
+            <div class={styles.title}>
+              <img src={getAssetsHomeFile('3.png')} />
+              成为酷乐秀达人的意义是什么？
             </div>
-          </Sticky>
+
+            <p class={styles.content}>
+              酷乐秀给所有热爱音乐热爱分享热爱转播技能的达人一个分享交流创作的平台，让音乐圈无圈，让爱好者无界。
+            </p>
+          </div>
         </div>
-        {/* </div> */}
+
+        <Sticky position="bottom" offsetBottom={0}>
+          <div class={styles['btn-group']}>
+            <div
+              class={[
+                styles.btn,
+                teacherState.authStatus ? styles.disabled : null
+              ]}
+              onClick={this.onClick}
+            ></div>
+          </div>
+        </Sticky>
       </div>
     )
   }