style: 样式修改

src/page-instrument/view-detail/index.module.less

@@ -142,5 +142,8 @@
         #osmdCanvasPage1 {
             padding-bottom: 0 !important;
         }
+        #cursorImg-0 {
+            opacity: 0 !important;
+        }
     }
 }

src/view/music-score/index.module.less

@@ -19,7 +19,7 @@
         #osmdCanvasPage1{
             position: absolute !important;
             left: 0;
-            top: 0;
+            top: -6%;
         }
     }
 }

src/view/music-score/index.tsx

@@ -143,7 +143,7 @@ export default defineComponent({
 					state.musicRenderType == EnumMusicRenderType.staff ? "staff" : "jianpuTone",
 				]}
 			>
-				{props.showSelection && musicData.showSelection && <Selection />}
+				{props.showSelection && musicData.showSelection && !state.isPreView && <Selection />}
 			</div>
 		);
 	},

src/view/plugins/move-music-score/index.module.less

@@ -38,4 +38,20 @@
     .noteMove{
         display: none;
     }
+}
+
+.hideTool {
+    transform: translateX(-120%);
+} 
+
+.rightHideIcon {
+    width: 15px;
+    height: 30px;
+    position: absolute;
+    left: 0;
+    top: 50%;
+    z-index: 10;
+    cursor: pointer;
+    transition: all 0.5s;
+    transform: rotate(180deg);
 }

src/view/plugins/move-music-score/index.tsx

@@ -1,5 +1,5 @@
 import { Row, showToast } from "vant";
-import { defineComponent, onMounted, reactive, nextTick } from "vue";
+import { defineComponent, onMounted, reactive, nextTick, ref } from "vue";
 import state from "/src/state";
 import request from "/src/utils/request";
 import { getQuery } from "/src/utils/queryString";
@@ -9,9 +9,12 @@ import "@varlet/ui/es/tooltip/style";
 import "@varlet/ui/es/button-group/style";
 import "@varlet/ui/es/switch/style";
 import { storeData } from "/src/store";
+import rightHideIcon from './image/right_hide_icon.png';
 
 let extStyleConfigJson: any = {};
 const clientWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
+const showToolBox = ref(true);
+
 export const moveData = reactive({
 	/** 开启移动 */
 	open: false,
@@ -441,37 +444,49 @@ export default defineComponent({
 		});
 		return () => (
 			<div class={[moveData.open ? "" : styles.moveDisabled]}>
-				<div class={styles.toolBox} id="toolBox">
-					<Switch v-model={moveData.open} />
-					{moveData.open && (
-						<>
-							{moveData.tool.isAddAndSub && (
-								<ButtonGroup size="small" elevation={false}>
-									<Button onClick={() => handleAddAndSub('add')}>加</Button>
-									<Button onClick={() => handleAddAndSub('sub')}>减</Button>
-								</ButtonGroup>
-							)}
-							{/* <ButtonGroup size="small">
-								
-								<Button>
-									<Icon name="arrow-down" style={{ transform: "rotate(-90deg)" }} />
+				<div id="toolBox">
+					<div class={[styles.toolBox, !showToolBox.value && styles.hideTool]} >
+						<Switch v-model={moveData.open} />
+						{moveData.open && (
+							<>
+								{moveData.tool.isAddAndSub && (
+									<ButtonGroup size="small" elevation={false}>
+										<Button onClick={() => handleAddAndSub('add')}>加</Button>
+										<Button onClick={() => handleAddAndSub('sub')}>减</Button>
+									</ButtonGroup>
+								)}
+								{/* <ButtonGroup size="small">
+									
+									<Button>
+										<Icon name="arrow-down" style={{ transform: "rotate(-90deg)" }} />
+									</Button>
+								</ButtonGroup> */}
+								<Button size="small" onClick={handleUndo} disabled={undoData.undoList.length ? false : true}>
+									<Icon name="arrow-down" style={{ transform: "rotate(90deg)" }} />
 								</Button>
-							</ButtonGroup> */}
-							<Button size="small" onClick={handleUndo} disabled={undoData.undoList.length ? false : true}>
-								<Icon name="arrow-down" style={{ transform: "rotate(90deg)" }} />
-							</Button>
 
-							<Button size="small" onClick={handleDeleteMoveNote} disabled={moveData.activeIndex > -1 ? false : true}>
-								{moveData.modelList[moveData.activeIndex]?.isDelete ? '显示元素' : '删除元素'}
-							</Button>
-							<Button size="small" onClick={resetMoveNote}>
-								重置数据
-							</Button>
-							<Button size="small" type="primary" onClick={filterMoveData}>
-								保存数据
-							</Button>
-						</>
-					)}
+								<Button size="small" onClick={handleDeleteMoveNote} disabled={moveData.activeIndex > -1 ? false : true}>
+									{moveData.modelList[moveData.activeIndex]?.isDelete ? '显示元素' : '删除元素'}
+								</Button>
+								<Button size="small" onClick={resetMoveNote}>
+									重置数据
+								</Button>
+								<Button size="small" type="primary" onClick={filterMoveData}>
+									保存数据
+								</Button>
+								<Button size="small" type="primary" onClick={() => showToolBox.value = false}>
+									收起
+								</Button>
+							</>
+						)}
+					</div>
+					{
+					!showToolBox.value && 
+						<img 
+							class={[styles.rightHideIcon, !showToolBox.value ? styles.rightIconShow : '']} 
+							src={rightHideIcon}
+							onClick={() => showToolBox.value = true } />
+					}  
 				</div>
 				{moveData.modelList.map((item: any, index: number) => {
 					return (