feat: 老师端云教练修改

src/page-instrument/custom-plugins/guide-page/student-bottom.tsx

@@ -5,7 +5,7 @@ import styles from "./index.module.less";
 import { getImage } from "./images";
 import { getQuery } from "/src/utils/queryString";
 import { getGuidance, setGuidance } from "./api";
-import state from "/src/state";
+import state, { IPlatform } from "/src/state";
 
 export default defineComponent({
 	name: "studentB-guide",
@@ -14,7 +14,46 @@ export default defineComponent({
 		const data = reactive({
 			box: {},
 			show: false,
-			steps: [
+			steps: state.platform === IPlatform.PC ? [
+				{
+					ele: "",
+					eleRect: {} as DOMRect,
+					img: getImage("studentB1.png"),
+					handStyle: {
+						top: "-1.39rem",
+						left: "1.7rem",
+						transform: "rotate(180deg)",
+					},
+					imgStyle: {
+						top: "-5.01rem",
+						width: "6.48rem",
+						height: "3.01rem",
+						left: "1.2rem",
+					},
+					btnsStyle: {
+						top: "-1.61rem",
+						left: "3.2rem",
+					},
+				},
+				{
+					ele: "",
+					img: getImage("studentB2.png"),
+					handStyle: {
+						top: "-1.39rem",
+						left: "1.5rem",
+						transform: "rotate(180deg)",
+					},
+					imgStyle: {
+						top: "-5.01rem",
+						width: "6.48rem",
+						height: "3.01rem",
+					},
+					btnsStyle: {
+						top: "-1.61rem",
+						left: "2.3rem",
+					},
+				},
+			] : [
 				{
 					ele: "",
 					eleRect: {} as DOMRect,

src/page-instrument/follow-model/index.module.less

@@ -42,7 +42,7 @@
   width: 36px;
   height: 36px;
   left: 32px;
-  bottom: 12px;
+  bottom: 12px !important;
   margin-left: initial;
 }
 

src/page-instrument/header-top/index.tsx

@@ -84,7 +84,6 @@ export const headTopData = reactive({
 export const headData = reactive({
   speedShow: false,
   musicTypeShow: false,
-  showGragGuide: false, // 是否显示可拖动弹窗的引导页(老师端需要显示)
 });
 
 export default defineComponent({
@@ -357,11 +356,6 @@ export default defineComponent({
           guideInfo = {}
         }
         state.guideInfo = guideInfo;
-        if (guideInfo && guideInfo.teacherDrag) {
-          headData.showGragGuide = false;
-        } else {
-          headData.showGragGuide = true;
-        }
 		  }catch(e){
 		    console.log(e)
 		  }
@@ -377,7 +371,6 @@ export default defineComponent({
       }catch(e){
         console.log(e)
       }   
-      headData.showGragGuide = false;
     }
 
     return () => (
@@ -577,7 +570,7 @@ export default defineComponent({
 
         <Popup v-model:show={headTopData.settingMode} class="popup-custom van-scale center-closeBtn settingBoxClass_drag" transition="van-scale" teleport="body" closeable style={positionInfo.styleDrag.value}>
           <Settting />
-          { state.platform === IPlatform.PC && <Dragbom showGuide={headData.showGragGuide} onGuideDone={handleGuide}  /> }
+          { state.platform === IPlatform.PC && <Dragbom showGuide={!state.guideInfo?.teacherDrag} onGuideDone={handleGuide}  /> }
         </Popup>
 
         {/* 模式切换 */}

src/page-instrument/header-top/music-type/index.tsx

@@ -51,7 +51,6 @@ export default defineComponent({
 			}catch(e){
 				console.log(e)
 			}   
-			musicTypeData.show = false;
 	  	}
 
 		const parentClassName = "transBoxClass_drag";
@@ -86,7 +85,7 @@ export default defineComponent({
 				</div>
 				<Popup teleport="body" closeOnClickOverlay={false} defaultStyle={false} v-model:show={musicTypeData.show} class="transBoxClass_drag" style={positionInfo.styleDrag.value}>
 					<TheComfirm tip="设置成功，是否立即重新加载？" onClose={handleResult} />
-					{ state.platform === IPlatform.PC && <Dragbom showGuide={headData.showGragGuide} onGuideDone={handleGuide}  /> }
+					{ state.platform === IPlatform.PC && <Dragbom showGuide={!state.guideInfo?.teacherDrag} onGuideDone={handleGuide}  /> }
 				</Popup>
 			</>
 		);

src/page-instrument/header-top/settting/index.tsx

@@ -33,6 +33,7 @@ import { browser } from "/src/utils";
 import { storeData } from "/src/store";
 import useDrag from "/src/view/plugins/useDrag/index";
 import Dragbom from "/src/view/plugins/useDrag/dragbom";
+import { setGuidance } from "/src/page-instrument/custom-plugins/guide-page/api";
 
 export default defineComponent({
 	name: "header-settting",
@@ -115,7 +116,16 @@ export default defineComponent({
 		  toRef(helperData, 'recommendationShow'),
 		  userId
 		)
-	
+	    // 完成拖动弹窗引导页
+		const handleGuide = async () => {
+			state.guideInfo.teacherDrag = true;
+				  try{
+					  const res = await setGuidance({guideTag:'guideInfo',guideValue:JSON.stringify(state.guideInfo)})
+			}catch(e){
+			  console.log(e)
+			}   
+		}
+
 		return () => (
 			<div class={styles["header-settting"]}>
 				<div class={[styles.content, state.platform === IPlatform.PC && styles.pcContent]}>
@@ -311,7 +321,7 @@ export default defineComponent({
 							helperData.recommendationShow = false;
 						}}
 					/>
-					{ state.platform === IPlatform.PC && <Dragbom /> }
+					{ state.platform === IPlatform.PC && <Dragbom showGuide={!state.guideInfo?.teacherDrag} /> }
 				</Popup>
 			</div>
 		);

src/view/plugins/toggleMusicSheet/choosePartName/index.module.less

@@ -72,4 +72,33 @@
     position: relative;
     z-index: 9;
   }
+  &.pcContainer {
+    width: 500PX;
+    height: 380PX;
+    .button {
+      margin-bottom: 30PX;
+    }
+    .title {
+      font-size: 20PX;
+    }
+    .closeIcon {
+      margin: initial !important;
+      top: -6PX;
+    }
+    .top {
+      padding-left: 30PX;
+      &::before { 
+        left: 20PX;
+      }
+    }
+    :global {
+      .van-button__content {
+        font-size: 20PX;
+      }
+    }
+  }
+}
+.pcPartTop {
+  z-index: 9999;
+  height: 12px;
 }

src/view/plugins/toggleMusicSheet/choosePartName/index.tsx

@@ -1,6 +1,7 @@
 import { PropType, computed, defineComponent, ref, toRefs, onMounted } from 'vue'
 import { Picker, Button, Icon } from 'vant'
 import styles from './index.module.less'
+import state, { IPlatform } from "/src/state";
 
 export default defineComponent({
   name: 'choosePartName',
@@ -36,7 +37,8 @@ export default defineComponent({
 			// console.log(myPicker.value,99999,selValues.value,props.partIndex)
 		});
     return () => (
-      <div class={styles.container}>
+      <div class={[styles.container, state.platform === IPlatform.PC && styles.pcContainer]}>
+        { state.platform === IPlatform.PC && <div class={[styles.pcPartTop,'top_drag']}></div> }
         <div class={styles.top}>
           <div class={styles.title}>请选择您练习的乐器</div>
           {/* <Icon name="cross" size={24} onClick={() => emit('close')} /> */}

src/view/plugins/toggleMusicSheet/index.tsx

@@ -1,11 +1,15 @@
-import { computed, defineComponent, reactive } from 'vue'
+import { computed, defineComponent, reactive, toRef } from 'vue'
 import styles from './index.module.less'
 import { Icon, Popup } from 'vant'
 import ChoosePartName from './choosePartName'
-import state, { togglePlay } from "/src/state";
+import state, { togglePlay, IPlatform } from "/src/state";
 import qs from 'query-string'
 import { getInstrumentName, sortMusical } from "/src/constant/instruments";
 import { getQuery } from "/src/utils/queryString";
+import useDrag from "/src/view/plugins/useDrag/index";
+import Dragbom from "/src/view/plugins/useDrag/dragbom";
+import { setGuidance } from "/src/page-instrument/custom-plugins/guide-page/api";
+import { storeData } from "/src/store";
 
 export const toggleMusicSheet = reactive({
   show: false,
@@ -21,7 +25,6 @@ export default defineComponent({
 
     const partListNames = computed(() => {
       let partList = state.partListNames || []
-      console.log(777777,state.partListNames)
       partList = partList.filter((item: any) => !item?.toLocaleUpperCase()?.includes('COMMON'))
       const arr =  partList.map((item: any, index: number) => {
         // 该声轨能否被选
@@ -79,8 +82,32 @@ export default defineComponent({
       location.href = _url
     }
 
+    const parentClassName = "switchBoxClass_drag";
+    const userId = storeData.user?.id ? String(storeData.user?.id) : '';
+    const positionInfo = state.platform !== IPlatform.PC ? {
+      styleDrag: { value: null }
+    } : useDrag(
+      [
+        `${parentClassName} .top_drag`,
+        `${parentClassName} .bom_drag`
+      ],
+      parentClassName,
+      toRef(toggleMusicSheet, 'show'),
+      userId
+    )
+
+    // 完成拖动弹窗引导页
+    const handleGuide = async () => {
+      state.guideInfo.teacherDrag = true;
+			try{
+				const res = await setGuidance({guideTag:'guideInfo',guideValue:JSON.stringify(state.guideInfo)})
+      }catch(e){
+        console.log(e)
+      }   
+    }
+
     return () => (
-      <Popup class={styles.popup} v-model:show={toggleMusicSheet.show}>
+      <Popup class={styles.popup} v-model:show={toggleMusicSheet.show} class="switchBoxClass_drag" style={positionInfo.styleDrag.value}>
         <ChoosePartName
           partIndex={trackIdx.value || 0}
           partListNames={partListNames.value}
@@ -92,6 +119,7 @@ export default defineComponent({
             }
           }}
         />
+        { state.platform === IPlatform.PC && <Dragbom showGuide={!state.guideInfo?.teacherDrag} onGuideDone={handleGuide}  /> }
       </Popup>
     )
   },