Merge branch 'iteration-20240612' into jenkins-test

src/hooks/useDrag/index.module.less

@@ -8,21 +8,26 @@
   position: absolute;
   left: 0;
   bottom: 0;
+  z-index: 11;
+
   .box {
     width: 42px;
     height: 100%;
     background: url('./img/left.png') no-repeat;
     background-size: 100% 100%;
+
     &.right {
       background: url('./img/right.png') no-repeat;
       background-size: 100% 100%;
     }
   }
 }
+
 .guide {
   position: absolute;
   left: 0;
   top: calc(100% - 10px);
+
   &::before {
     content: '';
     display: block;
@@ -34,6 +39,7 @@
     height: 200vh;
     background: rgba(0, 0, 0, 0.2);
   }
+
   .guideBg {
     position: relative;
     z-index: 99;
@@ -42,6 +48,7 @@
     background: url('./img/modalDragBg.png') no-repeat;
     background-size: 100% 100%;
   }
+
   .guideDone {
     position: absolute;
     z-index: 99;
@@ -53,30 +60,36 @@
     background-size: 100% 100%;
     cursor: pointer;
   }
+
   &.guideTop {
     top: initial;
     bottom: 2px;
+
     .guideBg {
       background: url('./img/modalDragBg2.png') no-repeat;
       background-size: 100% 100%;
     }
   }
+
   &.guideLeft {
     top: initial;
     left: -280px;
     bottom: -4px;
+
     .guideBg {
       background: url('./img/modalDragBgLeft.png') no-repeat;
       background-size: 100% 100%;
     }
   }
+
   &.guideRight {
     top: initial;
     left: calc(100% - 12px);
     bottom: -4px;
+
     .guideBg {
       background: url('./img/modalDragBgRight.png') no-repeat;
       background-size: 100% 100%;
     }
   }
-}
+}

src/views/tempo-practice/index.module.less

@@ -139,7 +139,6 @@
 
 
     .beat {
-      transition: all .1s ease;
       border: 2px solid #fff;
       // width: 65px;
       // height: 86px;
@@ -172,7 +171,6 @@
     border: 3px solid #fff;
     background: #FFFFFF;
     position: relative;
-    transition: all .1s ease;
 
     .direction {
       position: absolute;
@@ -380,7 +378,6 @@
       .beat {
         width: 85px;
         height: 105px;
-        transition: all .1s ease;
 
         img {
           width: 64px;
@@ -401,7 +398,6 @@
         .beat {
           width: 42px !important;
           height: 56px !important;
-          transition: all .1s ease;
 
           img {
             width: 28px;

src/views/tempo-practice/index.tsx

@@ -150,8 +150,8 @@ export default defineComponent({
     const handlePlayType = () => {
       handleStop();
       // 判断是否有设置
-
-      if (setting.playType === 'beat') {
+      const playType = getSettingValue('playType');
+      if (playType === 'beat') {
         updateSettingValue('playType', 'tempo');
       } else {
         updateSettingValue('playType', 'beat');
@@ -271,6 +271,13 @@ export default defineComponent({
     };
 
     onMounted(() => {
+      // 安卓的状态栏
+      postMessage({
+        api: 'setStatusBarVisibility',
+        content: {
+          isVisibility: 0
+        }
+      });
       if (route.query.modeType) {
         state.modeType = route.query.modeType;
       }
@@ -289,6 +296,22 @@ export default defineComponent({
       window.removeEventListener('message', onIframeHandle);
     });
 
+    watch(
+      () => state.settingStatus,
+      () => {
+        if (!state.settingStatus) {
+          state.speedList.forEach((item: any) => {
+            if (item.value === getSettingValue('speed')) {
+              item.color = '#1CACF1';
+            } else {
+              item.color = '#060606';
+            }
+          });
+          handleStop();
+        }
+      }
+    );
+
     expose({
       resetSetting
     });

src/views/tempo-practice/setting-modal/index.tsx

@@ -161,8 +161,7 @@ export default defineComponent({
           props.class,
           styles.settingContainer,
           state.win === 'pc' ? styles.pcS : '',
-          state.platform === 'modal' && state.win !== 'pc' ? styles.modalS : '',
-          'settingContainer_pc'
+          state.platform === 'modal' && state.win !== 'pc' ? styles.modalS : ''
         ]}>
         {/* <div class={styles.title}></div> */}
         <div class={[styles.iconTitBox, 'iconTitBoxMove']}>
@@ -288,7 +287,7 @@ export default defineComponent({
                         <div
                           draggable={true}
                           onDragstart={(e: any) => {
-                            console.log('1111');
+                            // console.log('1111');
                             e.dataTransfer.setData(
                               'text',
                               JSON.stringify({

src/views/tempo-practice/setting-pc-modal/index.module.less

@@ -6,10 +6,24 @@
   overflow: hidden;
 
   .settingModalShow {
+    z-index: 10;
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
     height: 100% !important;
     width: 354px !important;
   }
 
+
+  .iconTitBox {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 20px;
+    z-index: 11;
+
+  }
+
   &.modal {
     height: 300px;
 
@@ -71,6 +85,12 @@
   background: url("../images/pc_bg.png") no-repeat center center / cover;
   width: 639px;
 
+  z-index: 10;
+  // &::before {
+  //   content: '';
+
+  // }
+
   .btnSubmit {
     position: absolute;
     bottom: 11px;

src/views/tempo-practice/setting-pc-modal/index.tsx

@@ -30,8 +30,10 @@ export default defineComponent({
       <div
         class={[
           styles.settingPcModal,
-          state.platform === 'modal' && state.win !== 'pc' ? styles.modal : ''
+          state.platform === 'modal' && state.win !== 'pc' ? styles.modal : '',
+          'settingContainer_pc'
         ]}>
+        <div class={[styles.iconTitBox, 'iconTitBoxMove']}></div>
         <div class={styles.conCon}>
           <div class={styles.container}>
             {setting_modal.scorePart?.map((item: any, i: number) => (
@@ -63,6 +65,7 @@ export default defineComponent({
                             part.forEach((child: any, cj: number) => {
                               if (i === ci && jIndex === cj) {
                                 child.url = dropItem.url;
+                                child.index = dropItem.index;
                               }
                             });
                           }