Parcourir la source

列表弹出页按钮 有旋律线和没有旋律线时候样式改动

黄琪勇 il y a 11 mois
Parent
commit
480524571a

+ 15 - 11
src/page-instrument/header-top/index.module.less

@@ -22,6 +22,21 @@
     }
     .title{
         width: 216px;
+        &.isMusicList{
+            :global{
+                .van-notice-bar .van-notice-bar__content::after{
+                    position: absolute;
+                    top: 50%;
+                    right: 0;
+                    transform: translateY(-50%);
+                    content: "";
+                    width: 11px;
+                    height: 6px;
+                    background: url("./image/sj.png") no-repeat;
+                    background-size: 100% 100%;                         
+                }
+            }
+        }
         :global{
             .van-notice-bar{
                 height: 30px;
@@ -33,17 +48,6 @@
                 .van-notice-bar__content{
                     position: relative;
                     padding-right: 16px;
-                    &::after{
-                        position: absolute;
-                        top: 50%;
-                        right: 0;
-                        transform: translateY(-50%);
-                        content: "";
-                        width: 11px;
-                        height: 6px;
-                        background: url("./image/sj.png") no-repeat;
-                        background-size: 100% 100%;                         
-                    }
                 }
             }
         }

+ 6 - 5
src/page-instrument/header-top/index.tsx

@@ -605,8 +605,8 @@ export default defineComponent({
           <div class={styles.headTopLeftBox}>
             <img src={iconBack} class={['headTopBackBtn', styles.img, !headTopData.showBack && styles.hidenBack]} onClick={handleBack} />
             {
-              state.modeType === "practise" && smoothAnimationState.isShow.value ? 
-                <div class={styles.title} onClick={()=>{
+              state.modeType === "practise" && smoothAnimationState.isShow.value ?
+                <div class={[styles.title,isMusicList.value && styles.isMusicList]} onClick={()=>{
                   isMusicList.value && (musicListShow.value = true)
                 }}>
                   <NoticeBar
@@ -614,9 +614,10 @@ export default defineComponent({
                     background="none"
                   />
               </div> :
-              <img src={listImg} class={[styles.img]} onClick={()=>{
-                  isMusicList.value && (musicListShow.value = true)
-              }} />
+                isMusicList.value &&
+                <img src={listImg} class={[styles.img]} onClick={()=>{
+                  musicListShow.value = true
+                }} />
             }
           </div>
           {/* 模式切换 */}