|  | @@ -12,6 +12,7 @@ import IntonationDown from "./imgs/pitchLow.png"
 | 
	
		
			
				|  |  |  import IntonationUp from "./imgs/pitchHigh.png"
 | 
	
		
			
				|  |  |  import MultipleRestMeasures from "./multipleRestMeasures"
 | 
	
		
			
				|  |  |  import { browser } from "../../utils";
 | 
	
		
			
				|  |  | +import { transform } from "lodash";
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  export default defineComponent({
 | 
	
		
			
				|  |  |  	name: "selection",
 | 
	
	
		
			
				|  | @@ -51,18 +52,18 @@ export default defineComponent({
 | 
	
		
			
				|  |  |  					staveBox: null as any,
 | 
	
		
			
				|  |  |  				};
 | 
	
		
			
				|  |  |  				if (!notesList.includes(item.noteId)) {
 | 
	
		
			
				|  |  | -					let staveBbox: any = {};
 | 
	
		
			
				|  |  | +					let staveBbox: any = {}, customBgBox: any = {};
 | 
	
		
			
				|  |  |  					if (item.stave?.attrs?.id) {
 | 
	
		
			
				|  |  |  						const staveEle = document.querySelector(`#${item.stave.attrs.id}`);
 | 
	
		
			
				|  |  |  						staveBbox = staveEle?.parentElement?.parentElement?.getBoundingClientRect?.() || {
 | 
	
		
			
				|  |  |  							x: 0,
 | 
	
		
			
				|  |  |  							width: 0,
 | 
	
		
			
				|  |  |  						};
 | 
	
		
			
				|  |  | +						customBgBox = staveEle?.querySelector('.vf-custom-bg')?.getBoundingClientRect() || { y: 0, height: 0 }
 | 
	
		
			
				|  |  |  						// console.log("🚀 ~ staveBbox:", staveBbox.height)
 | 
	
		
			
				|  |  |  					}
 | 
	
		
			
				|  |  |  					if (item.svgElement) {
 | 
	
		
			
				|  |  |  						const noteEle = document.querySelector(`#vf-${item.svgElement?.attrs?.id}`);
 | 
	
		
			
				|  |  | -		
 | 
	
		
			
				|  |  |  						if (noteEle) {
 | 
	
		
			
				|  |  |  							const noteBbox = noteEle.getBoundingClientRect?.() || { x: 0, width: 0 };
 | 
	
		
			
				|  |  |  							if (state.musicRenderType !== EnumMusicRenderType.staff) {
 | 
	
	
		
			
				|  | @@ -88,14 +89,16 @@ export default defineComponent({
 | 
	
		
			
				|  |  |  								}
 | 
	
		
			
				|  |  |  								
 | 
	
		
			
				|  |  |  							} else {
 | 
	
		
			
				|  |  | +								const needTransY = -(staveBbox.height - customBgBox.height) / 2 + "px";
 | 
	
		
			
				|  |  |  								noteItem.bbox = {
 | 
	
		
			
				|  |  |  									left: noteBbox.x - parentLeft - noteBbox.width / 4 + "px",
 | 
	
		
			
				|  |  | -									top: staveBbox.y - parentTop + "px",
 | 
	
		
			
				|  |  | +									top: customBgBox.y ? customBgBox.y - parentTop + "px" : staveBbox.y - parentTop + "px",
 | 
	
		
			
				|  |  |  									width: noteBbox.width * 1.5 + "px",
 | 
	
		
			
				|  |  |  									height: staveBbox.height + "px",
 | 
	
		
			
				|  |  |  									x: item.bbox?.x,
 | 
	
		
			
				|  |  |  									y: item.bbox?.y,
 | 
	
		
			
				|  |  | -									originWidth: item.bbox?.width
 | 
	
		
			
				|  |  | +									originWidth: item.bbox?.width,
 | 
	
		
			
				|  |  | +									transform: `translateY(${needTransY})`
 | 
	
		
			
				|  |  |  								};
 | 
	
		
			
				|  |  |  							}
 | 
	
		
			
				|  |  |  							
 | 
	
	
		
			
				|  | @@ -219,8 +222,10 @@ export default defineComponent({
 | 
	
		
			
				|  |  |  						const currItem = selectData.staves.find(stave => {
 | 
	
		
			
				|  |  |  							return stave.MeasureNumberXML === item.MeasureNumberXML	
 | 
	
		
			
				|  |  |  						})
 | 
	
		
			
				|  |  | +						// 获取stave里面vf-custom-bg的位置坐标,才是准确的坐标
 | 
	
		
			
				|  |  | +						const currBgX = document.getElementById(currItem.stave.attrs.id)?.querySelector('.vf-custom-bg')?.getBoundingClientRect()?.x || 0;
 | 
	
		
			
				|  |  |  						return currItem && {
 | 
	
		
			
				|  |  | -							left: currItem.staveBox.left,
 | 
	
		
			
				|  |  | +							left: currBgX ? currBgX + 'px' : currItem.staveBox.left,
 | 
	
		
			
				|  |  |  							top: currItem.staveBox.top,
 | 
	
		
			
				|  |  |  							height: selectData.measureHeight + 'px'  // 小节的高度
 | 
	
		
			
				|  |  |  						}
 |