浏览代码

评测报告UI

skyblued 2 年之前
父节点
当前提交
a70bbf5fd8

+ 2 - 3
src/subpages/colexiu-report-share/header/index.tsx

@@ -1,7 +1,6 @@
 import { defineComponent, toRefs, PropType, ref, Transition, onMounted } from 'vue'
 import { Button, Grid, GridItem, Popup, Dialog, Toast } from 'vant'
 import qs from 'query-string'
-import { MusicSheelDetail, ShaeetStatusType } from '../../colexiu'
 import BackIcon from '../../colexiu/header/icons/back.svg'
 import { heardLevel } from '/src/constant/formats'
 import Note from '/src/pages/report/note'
@@ -31,7 +30,7 @@ export default defineComponent({
   name: 'ColexiuReportHeader',
   props: {
     detail: {
-      type: Object as PropType<MusicSheelDetail | null>,
+      type: Object as PropType<any | null>,
     },
     record: {
       type: Object,
@@ -64,7 +63,7 @@ export default defineComponent({
       } else {
         const behaviorId = sessionStorage.getItem('behaviorId') || '' + new Date().valueOf()
         const url = qs.stringifyUrl({
-          url: location.origin + '/accompany',
+          url: location.origin + '/orchestra-music-score',
           query: {
             id: search.id as string,
             behaviorId,

+ 1 - 1
src/subpages/colexiu-report/header/index.tsx

@@ -62,7 +62,7 @@ export default defineComponent({
       } else {
         const behaviorId = sessionStorage.getItem('behaviorId') || '' + new Date().valueOf()
         const url = qs.stringifyUrl({
-          url: location.origin + '/accompany',
+          url: location.origin + '/orchestra-music-score',
           query: {
             id: search.id as string,
             behaviorId,

+ 1 - 1
src/subpages/colexiu-share/index.tsx

@@ -41,7 +41,7 @@ const awaken = () => {
     }
     const behaviorId = sessionStorage.getItem('behaviorId') || '' + new Date().valueOf()
     const url = qs.stringifyUrl({
-      url: location.origin + '/accompany',
+      url: location.origin + '/orchestra-music-score',
       query: {
         id: search.id as string,
         behaviorId,

+ 82 - 75
src/subpages/colexiu/popups/evaluating/content.tsx

@@ -24,6 +24,8 @@ import Image2 from './icons/4.svg'
 import Image3 from './icons/3.svg'
 import Image4 from './icons/2.svg'
 import Image5 from './icons/1.svg'
+import iconShare from './icons/icon-share.svg'
+import iconUpload from './icons/icon-upload.svg'
 import { useOriginSearch } from '../../uses'
 import { onChangeModelType } from '../../buttons'
 
@@ -36,7 +38,7 @@ const scoreInfos: any = {
   2: {
     img: Image2,
     tips: '你的演奏还不熟练,音准和完整性还需加强,加紧训练才能有好成绩哦~',
-    mome: '还要加油哦',
+    mome: '还要加油哦',
   },
   3: {
     img: Image3,
@@ -74,7 +76,7 @@ export default defineComponent({
     const shareLoadedPngData = ref('')
     const { data } = toRefs(props)
     const pathname =
-      location.origin.indexOf('localhost') > -1 || location.origin.indexOf('192.168') > -1 ? '' : '/accompany'
+      location.origin.indexOf('localhost') > -1 || location.origin.indexOf('192.168') > -1 ? '' : '/orchestra-music-score'
     const getShareUrl = () => {
       const shareData: any = {
         id: data.value?.recordId,
@@ -159,77 +161,77 @@ export default defineComponent({
       return (
         <div>
           <div class={styles.box}>
-            {/* <img class={styles.bg} src={bg} /> */}
             <div class={styles.wrap}>
-              <div class={styles.top}>
-                {info === 5 && <img class={styles.iconLeft} src={iconBadge} />}
-                <div class={styles.title}>
-                  <div style={{ position: 'relative', zIndex: 1, 'white-space': 'nowrap' }}>
-                    <span class={styles.num}>{data.value?.score}</span>
-                    <span class={styles.txt}>
-                      分 <span>{scoreInfos[info].mome}</span>
-                    </span>
+              <div class={styles.wrapContainer}>
+                <div class={styles.top}>
+                  {/* {info === 5 && <img class={styles.iconLeft} src={iconBadge} />} */}
+                  <div class={styles.title}>
+                    <div style={{ position: 'relative', zIndex: 1, 'white-space': 'nowrap' }}>
+                      <span class={styles.num}>{data.value?.score}</span>
+                      <span class={styles.txt}>分 {scoreInfos[info].mome}</span>
+                    </div>
+                    <div class={styles.line}></div>
                   </div>
-                  <div class={styles.line}></div>
+                  <img class={styles.iconTop} src={scoreInfos[info].img} />
+                </div>
+                <div class={styles.evaluatWrap}>
+                  <Grid>
+                    <GridItem
+                      vSlots={{
+                        icon: () => (
+                          <div>
+                            <img class={styles.evaluatIcon} src={IntonationIcon} />
+                            <span class={styles.evaluatTitle}>音准</span>
+                          </div>
+                        ),
+                        text: () => (
+                          <span class={styles.fraction}>
+                            {data.value?.intonation}
+                            <span>分</span>
+                          </span>
+                        ),
+                      }}
+                    ></GridItem>
+                    <div class={styles.line}></div>
+                    <GridItem
+                      vSlots={{
+                        icon: () => (
+                          <div>
+                            <img class={styles.evaluatIcon} src={CadenceIcon} />
+                            <span class={styles.evaluatTitle}>节奏</span>
+                          </div>
+                        ),
+                        text: () => (
+                          <span class={styles.fraction}>
+                            {data.value?.cadence}
+                            <span>分</span>
+                          </span>
+                        ),
+                      }}
+                    ></GridItem>
+                    <div class={styles.line}></div>
+                    <GridItem
+                      vSlots={{
+                        icon: () => (
+                          <div>
+                            <img class={styles.evaluatIcon} src={IntegrityIcon} />
+                            <span class={styles.evaluatTitle}>完整性</span>
+                          </div>
+                        ),
+                        text: () => (
+                          <span class={styles.fraction}>
+                            {data.value?.integrity}
+                            <span>分</span>
+                          </span>
+                        ),
+                      }}
+                    ></GridItem>
+                  </Grid>
                 </div>
-                <img class={styles.iconTop} src={scoreInfos[info].img} />
-              </div>
-              <div class={styles.evaluatWrap}>
-                <Grid>
-                  <GridItem
-                    vSlots={{
-                      icon: () => (
-                        <div>
-                          <img class={styles.evaluatIcon} src={IntonationIcon} />
-                          <span class={styles.evaluatTitle}>音准</span>
-                        </div>
-                      ),
-                      text: () => (
-                        <span class={styles.fraction}>
-                          {data.value?.intonation}
-                          <span>分</span>
-                        </span>
-                      ),
-                    }}
-                  ></GridItem>
-                  <div class={styles.line}></div>
-                  <GridItem
-                    vSlots={{
-                      icon: () => (
-                        <div>
-                          <img class={styles.evaluatIcon} src={CadenceIcon} />
-                          <span class={styles.evaluatTitle}>节奏</span>
-                        </div>
-                      ),
-                      text: () => (
-                        <span class={styles.fraction}>
-                          {data.value?.cadence}
-                          <span>分</span>
-                        </span>
-                      ),
-                    }}
-                  ></GridItem>
-                  <div class={styles.line}></div>
-                  <GridItem
-                    vSlots={{
-                      icon: () => (
-                        <div>
-                          <img class={styles.evaluatIcon} src={IntegrityIcon} />
-                          <span class={styles.evaluatTitle}>完整性</span>
-                        </div>
-                      ),
-                      text: () => (
-                        <span class={styles.fraction}>
-                          {data.value?.integrity}
-                          <span>分</span>
-                        </span>
-                      ),
-                    }}
-                  ></GridItem>
-                </Grid>
-              </div>
 
-              <div class={styles.tips}>{scoreInfos[info].tips}</div>
+                <div class={styles.tips}>{scoreInfos[info].tips}</div>
+                
+              </div>
               <div class={styles.btns}>
                 {detailState.frozenMode ? null : (
                   <Button onClick={() => {
@@ -246,6 +248,16 @@ export default defineComponent({
                   <img class={styles.btnIcon} src={iconReport} alt="查看报告" />
                 </Button>
               </div>
+              <div class={styles.rigthBtns}>
+                <div class={styles.skepBtn} onClick={() => emit('upload')}>
+                  <img src={iconUpload} />
+                  上传
+                </div>
+                <div class={styles.skepBtn} onClick={() => (shareShow.value = true)}>
+                  <img src={iconShare} />
+                  分享
+                </div>
+              </div>
             </div>
             <Popup
               teleport="body"
@@ -275,12 +287,7 @@ export default defineComponent({
             </Popup>
             <Button class={styles.button} icon={backIcon} onClick={() => emit('restart')}></Button>
 
-            <Button class={styles.skepBtn} onClick={() => emit('upload')}>
-              保存演奏
-            </Button>
-            <Button class={[styles.skepBtn, styles.sharBtn]} onClick={() => (shareShow.value = true)}>
-              分享
-            </Button>
+            
           </div>
         </div>
       )

文件差异内容过多而无法显示
+ 687 - 107
src/subpages/colexiu/popups/evaluating/icons/1.svg


文件差异内容过多而无法显示
+ 503 - 110
src/subpages/colexiu/popups/evaluating/icons/2.svg


文件差异内容过多而无法显示
+ 484 - 79
src/subpages/colexiu/popups/evaluating/icons/3.svg


文件差异内容过多而无法显示
+ 459 - 69
src/subpages/colexiu/popups/evaluating/icons/4.svg


文件差异内容过多而无法显示
+ 474 - 67
src/subpages/colexiu/popups/evaluating/icons/5.svg


+ 2 - 2
src/subpages/colexiu/popups/evaluating/icons/cadence.svg

@@ -6,8 +6,8 @@
             <g id="编组-10" transform="translate(211.000000, 63.000000)">
                 <g id="编组-4" transform="translate(18.000000, 34.411322)">
                     <g id="编组-5" transform="translate(144.200000, 65.588678)">
-                        <path d="M16.0007214,10.5467681 L15.4185357,10.5467681 L14.7313532,11.6196168 C14.6473534,11.7509497 14.5002017,11.8281126 14.3444036,11.8225241 C14.1886055,11.8169356 14.0473606,11.729428 13.9729864,11.5924143 L13.1708921,10.115849 L11.9394042,13.1368588 C11.7705957,13.5509988 11.1634955,13.479306 11.0956162,13.0372008 L10.396485,8.46539068 L9.78684248,11.6864792 C9.70599748,12.1143475 9.11974411,12.1781592 8.94864762,11.7780018 L8.15367179,9.91805838 L7.75453138,10.3904169 C7.67088986,10.4895664 7.54784275,10.5467681 7.41793145,10.5467681 L6.44474069,10.5467681 C6.24527423,10.8922541 5.8386268,11.060693 5.45328718,10.9574416 C5.06794756,10.8541901 4.8,10.5049941 4.8,10.1060611 C4.8,9.70712821 5.06794756,9.35793214 5.45328718,9.2546807 C5.8386268,9.15142927 6.24527423,9.31986815 6.44474069,9.6653542 L7.21353088,9.6653542 L7.94139011,8.80351599 C8.04003843,8.68670104 8.19219714,8.62938263 8.34339939,8.65207851 C8.49460164,8.67477439 8.62322675,8.77423924 8.68323196,8.91486854 L9.18991147,10.1000867 L10.0092933,5.77004889 C10.1013244,5.28319929 10.802998,5.2954023 10.8777415,5.78530266 L11.7255971,11.3264901 L12.7059063,8.92147851 C12.846241,8.57725168 13.3236841,8.55081181 13.5011363,8.87749679 L14.3914483,10.5162605 L14.8060967,9.86848361 C14.8870846,9.74190553 15.0270019,9.66533439 15.1772718,9.6653542 L15.8886061,9.6653542 C16.0443893,9.29876579 16.4266137,9.08215459 16.8211538,9.1368681 C17.2156939,9.1915816 17.5245501,9.50402956 17.5746985,9.89917587 C17.6248469,10.2943222 17.403831,10.6740167 17.035466,10.8255511 C16.6671011,10.9770856 16.2428849,10.8628205 16.0004671,10.5467681 L16.0007214,10.5467681 Z" id="路径" fill="#2DC7AA" fill-rule="nonzero"></path>
-                        <rect id="矩形" stroke="#2DC7AA" x="3.3" y="3.91132219" width="15" height="11" rx="2"></rect>
+                        <path d="M16.0007214,10.5467681 L15.4185357,10.5467681 L14.7313532,11.6196168 C14.6473534,11.7509497 14.5002017,11.8281126 14.3444036,11.8225241 C14.1886055,11.8169356 14.0473606,11.729428 13.9729864,11.5924143 L13.1708921,10.115849 L11.9394042,13.1368588 C11.7705957,13.5509988 11.1634955,13.479306 11.0956162,13.0372008 L10.396485,8.46539068 L9.78684248,11.6864792 C9.70599748,12.1143475 9.11974411,12.1781592 8.94864762,11.7780018 L8.15367179,9.91805838 L7.75453138,10.3904169 C7.67088986,10.4895664 7.54784275,10.5467681 7.41793145,10.5467681 L6.44474069,10.5467681 C6.24527423,10.8922541 5.8386268,11.060693 5.45328718,10.9574416 C5.06794756,10.8541901 4.8,10.5049941 4.8,10.1060611 C4.8,9.70712821 5.06794756,9.35793214 5.45328718,9.2546807 C5.8386268,9.15142927 6.24527423,9.31986815 6.44474069,9.6653542 L7.21353088,9.6653542 L7.94139011,8.80351599 C8.04003843,8.68670104 8.19219714,8.62938263 8.34339939,8.65207851 C8.49460164,8.67477439 8.62322675,8.77423924 8.68323196,8.91486854 L9.18991147,10.1000867 L10.0092933,5.77004889 C10.1013244,5.28319929 10.802998,5.2954023 10.8777415,5.78530266 L11.7255971,11.3264901 L12.7059063,8.92147851 C12.846241,8.57725168 13.3236841,8.55081181 13.5011363,8.87749679 L14.3914483,10.5162605 L14.8060967,9.86848361 C14.8870846,9.74190553 15.0270019,9.66533439 15.1772718,9.6653542 L15.8886061,9.6653542 C16.0443893,9.29876579 16.4266137,9.08215459 16.8211538,9.1368681 C17.2156939,9.1915816 17.5245501,9.50402956 17.5746985,9.89917587 C17.6248469,10.2943222 17.403831,10.6740167 17.035466,10.8255511 C16.6671011,10.9770856 16.2428849,10.8628205 16.0004671,10.5467681 L16.0007214,10.5467681 Z" id="路径" fill="#FF8057" fill-rule="nonzero"></path>
+                        <rect id="矩形" stroke="#FF8057" x="3.3" y="3.91132219" width="15" height="11" rx="2"></rect>
                     </g>
                 </g>
             </g>

+ 22 - 0
src/subpages/colexiu/popups/evaluating/icons/icon-share.svg

@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="40px" height="40px" viewBox="0 0 40 40" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>分享</title>
+    <defs>
+        <linearGradient x1="5.16878207e-12%" y1="-6.80011603e-14%" x2="100%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FF9C63" offset="0%"></stop>
+            <stop stop-color="#FF7144" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="评测结果-18分" transform="translate(-654.000000, -175.000000)">
+            <g id="分享" transform="translate(654.000000, 175.000000)">
+                <circle id="椭圆形备份" fill="url(#linearGradient-1)" cx="20" cy="20" r="20"></circle>
+                <g id="编组备份-2" transform="translate(11.000000, 11.000000)" stroke="#FFFFFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
+                    <polyline id="Stroke-1" points="11 0 18 0 18 7"></polyline>
+                    <path d="M18,11.7373 L18,16.5003 C18,17.3293 17.328,18.0003 16.5,18.0003 L1.5,18.0003 C0.671,18.0003 0,17.3293 0,16.5003 L0,1.5003 C0,0.6723 0.671,0.0003 1.5,0.0003 L6,0.0003" id="Stroke-3"></path>
+                    <line x1="9.8999" y1="8.1006" x2="17.5499" y2="0.4506" id="Stroke-5"></line>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

+ 24 - 0
src/subpages/colexiu/popups/evaluating/icons/icon-upload.svg

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="40px" height="40px" viewBox="0 0 40 40" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>上传</title>
+    <defs>
+        <linearGradient x1="5.16878207e-12%" y1="-6.80011603e-14%" x2="100%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FF9C63" offset="0%"></stop>
+            <stop stop-color="#FF7144" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="评测结果-18分" transform="translate(-654.000000, -81.000000)">
+            <g id="上传" transform="translate(654.000000, 81.000000)">
+                <circle id="椭圆形" fill="url(#linearGradient-1)" cx="20" cy="20" r="20"></circle>
+                <g id="编组" transform="translate(9.500000, 11.000000)" stroke="#FFFFFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
+                    <path d="M4.058,6.4426 C1.731,6.9926 0,9.0706 0,11.5496 C0,14.4496 2.367,16.7996 5.286,16.7996 C5.786,16.7996 6.271,16.7306 6.73,16.6016" id="Stroke-1"></path>
+                    <path d="M16.9423,6.4426 C19.2693,6.9926 21.0003,9.0706 21.0003,11.5496 C21.0003,14.4496 18.6333,16.7996 15.7143,16.7996 C15.2143,16.7996 14.7293,16.7306 14.2703,16.6016" id="Stroke-3"></path>
+                    <path d="M16.9135,6.3 C16.9135,2.821 14.0735,0 10.5705,0 C7.0675,0 4.2285,2.821 4.2285,6.3" id="Stroke-5"></path>
+                    <polyline id="Stroke-7" points="6.9056 10.4377 10.5706 6.7857 14.3406 10.4997"></polyline>
+                    <line x1="10.5707" y1="15.7502" x2="10.5707" y2="8.6432" id="Stroke-9"></line>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

+ 1 - 1
src/subpages/colexiu/popups/evaluating/icons/integrity.svg

@@ -2,7 +2,7 @@
 <svg width="23px" height="21px" viewBox="0 0 23 21" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <title>编组备份 11</title>
     <g id="修改" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="评测" transform="translate(-482.000000, -163.000000)" fill="#2DC7AA" fill-rule="nonzero">
+        <g id="评测" transform="translate(-482.000000, -163.000000)" fill="#FF8057" fill-rule="nonzero">
             <g id="编组-10" transform="translate(211.000000, 63.000000)">
                 <g id="编组-4" transform="translate(18.000000, 34.411322)">
                     <g id="编组" transform="translate(253.200000, 65.588678)">

+ 1 - 1
src/subpages/colexiu/popups/evaluating/icons/intonation.svg

@@ -2,7 +2,7 @@
 <svg width="23px" height="21px" viewBox="0 0 23 21" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <title>编组备份</title>
     <g id="修改" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="评测" transform="translate(-261.000000, -163.000000)" fill="#2DC7AA" fill-rule="nonzero">
+        <g id="评测" transform="translate(-261.000000, -163.000000)" fill="#FF8057" fill-rule="nonzero">
             <g id="编组-10" transform="translate(211.000000, 63.000000)">
                 <g id="编组-4" transform="translate(18.000000, 34.411322)">
                     <g id="编组备份" transform="translate(32.200000, 65.588678)">

+ 49 - 60
src/subpages/colexiu/popups/evaluating/index.module.less

@@ -3,8 +3,8 @@
   height: 100vh;
   display: flex;
   align-items: center;
+  justify-content: center;
   box-sizing: border-box;
-  // background-color: #caeffd;
 }
 .bg {
   position: absolute;
@@ -24,7 +24,6 @@
   background-color: transparent;
   font-size: 0;
   img {
-    // opacity: 0;
     width: 23px;
     height: 23px;
     display: block;
@@ -38,99 +37,73 @@
   width: 272px;
 }
 .skepBtn {
-  position: absolute;
-  top: 15px;
-  right: 51px;
-  width: 40px;
-  height: 13px;
-  border-radius: 9px;
-  border: none;
-  padding: 0;
+  width: 100%;
   display: flex;
+  flex-direction: column;
   align-items: center;
   justify-content: center;
-
-  :global {
-    .van-button__text {
-      font-size: 6px;
-      font-weight: 500;
-      color: var(--primary-color);
-    }
+  margin-bottom: 16px;
+  color: #fff;
+  & > img{
+    display: block;
+    width: 100%;
+    margin-bottom: 4Px;
   }
 }
-.sharBtn {
-  width: 30px;
-  right: 17px;
-}
 
 .wrap {
   position: relative;
+  width: 184px;
+  box-sizing: border-box;
+  z-index: 1;
+}
+.wrapContainer{
   display: flex;
   flex-direction: column;
-  width: 181px;
-  height: 119px;
-  margin: 0 auto;
   align-items: center;
-  box-sizing: border-box;
-  // background-color: #fffaed;
-  background: url('./icons/wrap_bg.png') no-repeat center;
-  background-size: contain;
-  border-radius: 4px;
-  padding-bottom: 6px;
-  // border: 1px solid #fff;
-  margin-top: 13px;
-  z-index: 1;
+  padding-top: 60px;
 }
 .top {
+  position: relative;
   display: flex;
   align-items: center;
   width: 100%;
-  margin-top: -12px;
-  height: 46px;
+  height: 0;
   .title {
-    position: relative;
-    margin-left: 10px;
+    position: absolute;
+    left: 50%;
+    top: -35px;
     font-size: 7px;
-    color: var(--primary-color);
+    color: #fff;
     font-weight: bold;
+    z-index: 1;
+    transform: translateX(-60%);
   }
-  .line {
-    position: absolute;
-    bottom: 0;
-    // width: 61px;
-    left: 0;
-    right: 0;
-    height: 4px;
-    background: #fcd660;
-    border-radius: 2px;
-    opacity: 0.59;
-  }
-  .num {
-    font-size: 15px;
+  .num{
+    font-size: 18px;
+    color: #FFF79E;
   }
   .txt {
     font-size: 9px;
-    > span {
-      font-size: 7px;
-    }
   }
   .iconLeft {
     width: 36px;
     height: 40px;
   }
   .iconTop {
-    // width: 75px;
-    margin-left: auto;
-    transform: translateY(-14px);
+    position: absolute;
+    top: -55px;
+    width: 100%;
   }
 }
 
 .evaluatWrap {
+  position: relative;
   width: 164px;
   height: 35px;
-  // padding: 8px;
-  // padding-top: 4px;
   box-sizing: border-box;
+  z-index: 1;
+  box-shadow: 0px 1px 2px 0px rgba(255,207,147,0.28);
   :global {
     .van-grid {
       align-items: center;
@@ -183,16 +156,22 @@
   }
 }
 .tips {
+  position: relative;
   padding: 6px 12px 4px 12px;
   width: 100%;
   font-size: 6px;
-  color: #808080;
+  color: #333;
   line-height: 9px;
   height: 30px;
   box-sizing: border-box;
+  z-index: 1;
+  background: rgba(254,247,228,1);
+  border-radius: 12px;
 }
 .btns {
   display: flex;
+  justify-content: space-evenly;
+  padding: 10px 0;
   :global {
     .van-button {
       width: 48px;
@@ -209,6 +188,16 @@
     display: block;
   }
 }
+.rigthBtns{
+  position: absolute;
+  right: -32px;
+  top: 0;
+  width: 16px;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+}
 .confirm {
   width: 122px;
   height: 74px;

+ 24 - 20
src/subpages/colexiu/popups/sound-effect/icons/back.svg

@@ -1,16 +1,16 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<svg width="49px" height="49px" viewBox="0 0 49 49" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>返回</title>
+<svg width="48px" height="49px" viewBox="0 0 48 49" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>编组 8</title>
     <defs>
-        <linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
-            <stop stop-color="#FFD048" offset="0%"></stop>
-            <stop stop-color="#FEA60A" offset="100%"></stop>
+        <linearGradient x1="-5.48380785e-12%" y1="5.38483651%" x2="100%" y2="100%" id="linearGradient-1">
+            <stop stop-color="#FF9C63" offset="0%"></stop>
+            <stop stop-color="#FF7144" offset="100%"></stop>
         </linearGradient>
-        <rect id="path-2" x="0" y="0" width="46" height="46" rx="19"></rect>
+        <rect id="path-2" x="0" y="0" width="46" height="46" rx="18"></rect>
         <filter x="-5.4%" y="-3.3%" width="110.9%" height="113.0%" filterUnits="objectBoundingBox" id="filter-3">
             <feOffset dx="0" dy="2" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
             <feGaussianBlur stdDeviation="0.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
-            <feColorMatrix values="0 0 0 0 0.658747134   0 0 0 0 0.473557177   0 0 0 0 0  0 0 0 0.236465561 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+            <feColorMatrix values="0 0 0 0 0.741508152   0 0 0 0 0.472091343   0 0 0 0 0.43649793  0 0 0 0.273082386 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
         </filter>
         <filter x="-6.5%" y="-4.3%" width="113.0%" height="115.2%" filterUnits="objectBoundingBox" id="filter-4">
             <feGaussianBlur stdDeviation="1.5" in="SourceAlpha" result="shadowBlurInner1"></feGaussianBlur>
@@ -18,34 +18,38 @@
             <feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"></feComposite>
             <feColorMatrix values="0 0 0 0 1   0 0 0 0 1   0 0 0 0 1  0 0 0 0.5 0" type="matrix" in="shadowInnerInner1" result="shadowMatrixInner1"></feColorMatrix>
             <feGaussianBlur stdDeviation="0.5" in="SourceAlpha" result="shadowBlurInner2"></feGaussianBlur>
-            <feOffset dx="0" dy="-2" in="shadowBlurInner2" result="shadowOffsetInner2"></feOffset>
+            <feOffset dx="-1" dy="-3" in="shadowBlurInner2" result="shadowOffsetInner2"></feOffset>
             <feComposite in="shadowOffsetInner2" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner2"></feComposite>
-            <feColorMatrix values="0 0 0 0 1   0 0 0 0 1   0 0 0 0 1  0 0 0 0.5 0" type="matrix" in="shadowInnerInner2" result="shadowMatrixInner2"></feColorMatrix>
+            <feColorMatrix values="0 0 0 0 0.983016304   0 0 0 0 0.353183073   0 0 0 0 0.108247927  0 0 0 0.615220717 0" type="matrix" in="shadowInnerInner2" result="shadowMatrixInner2"></feColorMatrix>
             <feMerge>
                 <feMergeNode in="shadowMatrixInner1"></feMergeNode>
                 <feMergeNode in="shadowMatrixInner2"></feMergeNode>
             </feMerge>
         </filter>
-        <path d="M16.3315521,11.7451434 L16.206436,11.8833072 C15.2897948,12.9656778 15.352257,14.5635719 16.373745,15.5648477 L23.7718331,22.8176888 L16.330111,30.1143302 C15.2861965,31.193098 15.3077984,32.8877282 16.3736037,33.9324444 C17.4483951,34.9859688 19.1827174,34.9859688 20.2572131,33.9323019 L29.6713698,24.7033981 C30.7137911,23.6261407 30.6921908,21.9315665 29.6264702,20.8867154 L20.2038265,11.651977 C19.1235252,10.6478386 17.428805,10.6686613 16.373745,11.7028447 L16.3315521,11.7451434 Z" id="path-5"></path>
-        <filter x="-13.4%" y="-4.2%" width="126.9%" height="116.8%" filterUnits="objectBoundingBox" id="filter-6">
-            <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
-            <feGaussianBlur stdDeviation="0.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
-            <feColorMatrix values="0 0 0 0 0.775183636   0 0 0 0 0.564279529   0 0 0 0 0.0355340198  0 0 0 1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
+        <polyline id="path-5" points="26.5 33.5 15.5 22.5 26.5 11.5"></polyline>
+        <filter x="-77.3%" y="-38.8%" width="282.1%" height="195.8%" filterUnits="objectBoundingBox" id="filter-6">
+            <feMorphology radius="2.5" operator="dilate" in="SourceAlpha" result="shadowSpreadOuter1"></feMorphology>
+            <feOffset dx="1" dy="2" in="shadowSpreadOuter1" result="shadowOffsetOuter1"></feOffset>
+            <feMorphology radius="2.5" operator="erode" in="SourceAlpha" result="shadowInner"></feMorphology>
+            <feOffset dx="1" dy="2" in="shadowInner" result="shadowInner"></feOffset>
+            <feComposite in="shadowOffsetOuter1" in2="shadowInner" operator="out" result="shadowOffsetOuter1"></feComposite>
+            <feGaussianBlur stdDeviation="2" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 1   0 0 0 0 0.421828951   0 0 0 0 0.235175305  0 0 0 1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
         </filter>
     </defs>
-    <g id="第一版" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="校音" transform="translate(-36.000000, -19.000000)">
-            <g id="返回" transform="translate(37.268293, 19.000000)">
+    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="评测结果-18分" transform="translate(-32.000000, -18.000000)">
+            <g id="返回" transform="translate(33.000000, 18.000000)">
                 <g id="矩形">
                     <use fill="black" fill-opacity="1" filter="url(#filter-3)" xlink:href="#path-2"></use>
                     <use fill="url(#linearGradient-1)" fill-rule="evenodd" xlink:href="#path-2"></use>
                     <use fill="black" fill-opacity="1" filter="url(#filter-4)" xlink:href="#path-2"></use>
                 </g>
-                <ellipse id="椭圆形" fill="#FFFFFF" opacity="0.483383179" transform="translate(9.654568, 10.912808) rotate(43.000000) translate(-9.654568, -10.912808) " cx="9.65456821" cy="10.9128077" rx="1.98414685" ry="3.9682937"></ellipse>
-                <g id="路径" fill-rule="nonzero" transform="translate(23.000097, 22.817687) scale(-1, 1) translate(-23.000097, -22.817687) ">
+                <g id="Stroke-1" stroke-linecap="round" stroke-linejoin="round">
                     <use fill="black" fill-opacity="1" filter="url(#filter-6)" xlink:href="#path-5"></use>
-                    <use fill="#FFFFFF" xlink:href="#path-5"></use>
+                    <use stroke="#FFFFFF" stroke-width="5" xlink:href="#path-5"></use>
                 </g>
+                <ellipse id="椭圆形" fill="#FFFFFF" opacity="0.503383" transform="translate(9.654568, 10.912808) rotate(43.000000) translate(-9.654568, -10.912808) " cx="9.65456821" cy="10.9128077" rx="1.98414685" ry="3.9682937"></ellipse>
             </g>
         </g>
     </g>

+ 3 - 3
src/subpages/colexiu/uses/use-config.ts

@@ -1,18 +1,18 @@
 import { ref } from "vue"
-import { useClientType } from "."
 import request from "/src/helpers/request"
+import { getRequestHostname } from "/src/helpers/utils"
 
 /**
  *  获取免费使用比例
  */
 export const useConfigMusicSheetFreeRate = async () => {
   const config = ref(.1)
-  const client = useClientType()
+  const prefix = getRequestHostname()
   try {
     const res = await request.get(
       '/sysParamConfig/queryByParamNameList',
       {
-        prefix: client === 'teacher' ? '/api-teacher' : '/api-student',
+        prefix: prefix,
         params: {
           paramNames: 'music_sheet_free_rate'
         }

部分文件因为文件数量过多而无法显示