1 |
- import{d as A,e as k,r as N,U as G,cw as E,w as q,f as t,o as M,cx as J,j as L,$ as u,q as O,a0 as V,a1 as Z,a2 as H,k as v,F as W,c as K,a as Q,u as Y,a9 as tt,Z as B,cu as et,cv as j,z as st,t as at,T as it,am as lt,b6 as ot}from"./index-28c1a609.js";import{T as nt}from"./index-e263283f.js";import{i as ct,a as rt}from"./icon-collect-active-4272e308.js";import{T as X}from"./index-347fa178.js";import{N as dt}from"./Slider-2c65f385.js";import{c as ut,d as pt,e as mt,f as ft}from"./api-41c213c1.js";import{g as R,s as _}from"./index-06d640df.js";import{T as z}from"./index-f7a7debf.js";const gt="_container_1dh8a_1",ht="_separator_1dh8a_32",_t="_wrap_1dh8a_36",vt="_content_1dh8a_42",yt="_tools_1dh8a_49",wt="_contentWrap_1dh8a_59",St="_musicList_1dh8a_65",bt="_wrapList_1dh8a_76",xt="_empty_1dh8a_83",It="_itemContainer_1dh8a_89",Ct="_item_1dh8a_89",Lt="_active_1dh8a_110",Pt="_arrow_1dh8a_113",kt="_img_1dh8a_116",Nt="_title_1dh8a_137",At="_titleName_1dh8a_144",Bt="_titleDes_1dh8a_151",Rt="_btn_1dh8a_161",Tt="_showPlayLoading_1dh8a_183",$t="_loadingWrap_1dh8a_186",Ft="_musicStaff_1dh8a_191",Ut="_goBtn_1dh8a_207",Dt="_favitor_1dh8a_215",Et="_musicName_1dh8a_233",Wt="_staffImgs_1dh8a_241",l={container:gt,separator:ht,wrap:_t,content:vt,tools:yt,contentWrap:wt,musicList:St,wrapList:bt,empty:xt,itemContainer:It,item:Ct,active:Lt,arrow:Pt,img:kt,title:Nt,titleName:At,titleDes:Bt,btn:Rt,showPlayLoading:Tt,loadingWrap:$t,musicStaff:Ft,goBtn:Ut,favitor:Dt,musicName:Et,staffImgs:Wt},jt=""+new URL("icon_back-17d73f64.svg",import.meta.url).href,zt=""+new URL("icon_separator-36fe21d8.svg",import.meta.url).href,Gt=""+new URL("icon_arrow-653dc704.svg",import.meta.url).href,T=""+new URL("icon_play-e55ce8d9.svg",import.meta.url).href,$=""+new URL("icon_pause-b55f26df.svg",import.meta.url).href,Mt=""+new URL("icon_goXiaoku-af3839bc.svg",import.meta.url).href,Ot=""+new URL("icon_default-7bc33289.png",import.meta.url).href,Xt="_container_hsosf_1",qt="_hidden_hsosf_15",Jt="_item_hsosf_19",Vt="_img_hsosf_25",Zt="_rotateImg_hsosf_1",Ht="_svgcontainer_hsosf_50",Kt="_progress_hsosf_55",Qt="_title_hsosf_66",Yt="_titleName_hsosf_70",te="_titleDes_hsosf_77",ee="_playBtns_hsosf_89",se="_playBtn_hsosf_89",ae="_timeWrap_hsosf_111",ie="_timeProgress_hsosf_117",le="_time_hsosf_111",m={container:Xt,hidden:qt,item:Jt,img:Vt,rotateImg:Zt,svgcontainer:Ht,progress:Kt,title:Qt,titleName:Yt,titleDes:te,playBtns:ee,playBtn:se,timeWrap:ae,timeProgress:ie,time:le},oe=""+new URL("icon_pre-f15675ed.svg",import.meta.url).href,ne=""+new URL("icon_next-7ede96c3.svg",import.meta.url).href,ce=A({name:"playItem",props:{item:{type:Object,default:()=>({})},show:{type:Boolean,default:!1},playState:{type:String,default:"pause"}},emits:["change"],setup(c,{emit:y}){let a=null;const o=k({isFirst:!0,duration:0,currentTime:0}),e=N(),h=()=>{if(o.duration=e.value.duration,o.isFirst){o.isFirst=!1;return}c.playState==="play"&&e.value.play()},C=p=>{e.value.pause(),o.currentTime=p,clearTimeout(a),a=setTimeout(()=>{e.value.currentTime=p,c.playState==="play"&&e.value.play(),a=null},300)},f=G(()=>`${E(o.currentTime)} / ${E(o.duration)}`);return q(()=>c.playState,p=>{p==="play"?e.value.play():e.value.pause()}),()=>t("div",{class:[m.container,c.show?m.show:m.hidden]},[t("div",{class:[m.item]},[t("div",{class:m.img},[t(M,{lazy:!0,objectFit:"cover",previewDisabled:!0,src:c.item.titleImg,onLoad:p=>{p.target.dataset.loaded="true"}},null),t("svg",{class:m.svgcontainer},[t("defs",null,[t("linearGradient",{id:"GradientProgress"},[t("stop",{"stop-color":"#5BECFF",offset:"0%"},null),t("stop",{"stop-color":"#259CFE",offset:"100%"},null)])])]),t(J,{type:"circle",class:m.progress,showIndicator:!1,percentage:o.currentTime/o.duration*100},null)]),t("div",{class:m.title},[t("div",{class:m.titleName},[t(X,{text:c.item.musicSheetName},null)]),t("div",{class:m.titleDes},[c.item.composer])]),t("div",{class:m.playBtns},[t(L,{color:"rgba(246,246,246,1)",circle:!0,bordered:!1,onClick:()=>y("change","pre")},{default:()=>[t("img",{src:oe},null)]}),t(L,{color:"rgba(57,130,246,1)",class:m.playBtn,circle:!0,bordered:!1,onClick:()=>y("change",c.playState==="pause"?"play":"pause")},{default:()=>[t("img",{style:{display:c.playState==="pause"?"":"none",transform:"scale(1.5) translateX(1Px)"},src:T},null),t("img",{style:{display:c.playState==="play"?"":"none",transform:"scale(1.5)"},src:$},null)]}),t(L,{color:"rgba(246,246,246,1)",circle:!0,bordered:!1,onClick:()=>y("change","next")},{default:()=>[t("img",{src:ne},null)]})]),t("div",{class:m.timeWrap},[t(dt,{tooltip:!1,step:.01,class:m.timeProgress,value:o.currentTime,max:o.duration,"onUpdate:value":p=>C(p)},null),t("div",{class:m.time},[f.value]),t("audio",{ref:e,src:c.item.audioFileUrl||c.item.metronomeUrl,onLoadedmetadata:h,onEnded:()=>{y("change","pause")},onTimeupdate:()=>{a||(o.currentTime=e.value.currentTime)}},null)])])])}}),re="_audioAnimate_29dwa_1",de="_musicWave_29dwa_1",ue={audioAnimate:re,musicWave:de},pe=A({name:"playLoading",setup(){return()=>t("div",{class:ue.audioAnimate},[t("div",null,null),t("div",null,null),t("div",null,null),t("div",null,null)])}}),me=A({name:"music-guide",emits:["close"],setup(c,{emit:y}){const a=k({box:{height:"0px"},show:!1,steps:[{ele:"",eleRect:{},img:R("music1.png"),handStyle:{top:"0.91rem"},imgStyle:{top:u(-4),left:u(0),width:u(534),height:u(228)},btnsStyle:{bottom:u(40),left:u(159)},eleRectPadding:{left:7,top:7,width:14,height:14}},{ele:"",img:R("music2.png"),imgStyle:{top:u(-4),left:u(-205),width:u(420),height:u(228)},btnsStyle:{bottom:u(35),left:u(-48)},boxStyle:{borderRadius:"25px"},eleRectPadding:{left:7,top:7,width:14,height:14}},{ele:"",img:R("music3.png"),imgStyle:{top:"100%",left:"-130px",width:u(401),height:u(304)},btnsStyle:{bottom:u(100),left:u(30)},boxStyle:{borderRadius:"40px"},eleRectPadding:{left:7,top:7,width:14,height:14},type:"bottom"}],step:0}),o=N(!1),e=localStorage.getItem("teacher-guideInfo");e&&JSON.parse(e).musicGuide?o.value=!1:o.value=!0;const h=()=>{var x,w,I,r;const n=document.getElementById(`music-${a.step}`);if(n){const g=n.getBoundingClientRect();if(console.log(n.style.display,"ele"),n.style.display=="none"){f();return}const S=((x=a.steps[a.step].eleRectPadding)==null?void 0:x.left)||0,P=((w=a.steps[a.step].eleRectPadding)==null?void 0:w.top)||0,i=((I=a.steps[a.step].eleRectPadding)==null?void 0:I.width)||0,s=((r=a.steps[a.step].eleRectPadding)==null?void 0:r.height)||0;a.box={left:g.x-S+"px",top:g.y-P+"px",width:g.width+i+"px",height:g.height+s+"px"},console.log(`coai-${a.step}`,a.box)}else f()};O(()=>{h(),window.addEventListener("resize",C)});const C=()=>{h()};V(()=>{window.removeEventListener("resize",C)});const f=()=>{if(a.step>=3){p();return}a.step=a.step+1,h()},p=()=>{let n=JSON.parse(localStorage.getItem("teacher-guideInfo")||"{}")||null;n?n.musicGuide=!0:n={musicGuide:!0},localStorage.setItem("teacher-guideInfo",JSON.stringify(n)),o.value=!1};return()=>t(W,null,[o.value?Z(t("div",{"onUpdate:show":n=>o.value=n,class:["n-modal-mask","n-modal-mask-guide"]},[t("div",{class:_.content,onClick:()=>f()},[t("div",{class:_.backBtn,onClick:n=>{n.stopPropagation(),p()}},[v("跳过")]),t("div",{class:_.box,style:{...a.box,...a.steps[a.step].boxStyle},id:`modeType-${a.step}`},[a.steps.map((n,x)=>{var w,I,r,g;return t("div",{onClick:S=>S.stopPropagation(),class:_.item,style:n.type=="bottom"?{display:x===a.step?"":"none",left:`${(w=n.eleRect)==null?void 0:w.left}px`,top:`-${(I=n.imgStyle)==null?void 0:I.height}`}:{display:x===a.step?"":"none",left:`${(r=n.eleRect)==null?void 0:r.left}px`,top:`${(g=a.box)==null?void 0:g.height}`}},[t("img",{class:_.img,style:n.imgStyle,src:n.img},null),t("div",{class:_.btns,style:n.btnsStyle},[a.step+1==a.steps.length?t(W,null,[t("div",{class:[_.endBtn],onClick:()=>p()},[v("完成")]),t("div",{class:_.nextBtn,onClick:()=>{a.step=0,h()}},[v("再看一遍")])]):t("div",{class:_.btn,onClick:()=>f()},[v("下一步 ("),a.step+1,v("/"),a.steps.length,v(")")])])])})])])]),[[H,o.value,"show"]]):null])}});function fe(c){return typeof c=="function"||Object.prototype.toString.call(c)==="[object Object]"&&!ot(c)}const Ie=A({name:"XiaokuMusic",setup(){const c=K(),y=Q(),a=Y(),o=k({page:1,rows:20,status:!0,name:"",musicSheetCategoriesId:y.query.id||""}),e=k({loading:!1,finshed:!1,reshing:!1,tags:[],tagIndex:0,list:[],listActive:0,playState:"pause",showPlayer:!1}),h=N(!1),C=async()=>{const i=await ut();Array.isArray(i==null?void 0:i.data)&&(e.tags=[{name:"全部",id:0},...i.data])},f=async()=>{var s;e.loading=!0;let i={};try{i=await pt({...o,musicSubject:e.tagIndex?e.tagIndex:""})}catch(d){console.log(d)}e.reshing&&(e.list=[],e.reshing=!1),(i==null?void 0:i.code)===200&&Array.isArray((s=i==null?void 0:i.data)==null?void 0:s.rows)&&(e.list=[...e.list,...i.data.rows],e.finshed=i.data.rows.length<o.rows,console.log("🚀 ~ data.finshed:",e.finshed)),e.list[e.listActive]&&w(e.list[e.listActive]),e.loading=!1,setTimeout(()=>{h.value=!0},500)},p=()=>{e.listActive=0,e.showPlayer=!1,e.playState="pause",o.page=1,e.finshed=!1,f()},n=N(),x=()=>{console.log(e.finshed),!(e.loading||e.finshed)&&(o.page=o.page+1,f())};O(async()=>{C(),await f();const i=new IntersectionObserver(s=>{s[0].intersectionRatio>0&&x()});tt(()=>{i.observe(n.value)})});const w=async i=>{const s=await mt({type:"MUSIC",materialId:i.id});(s==null?void 0:s.code)===200&&(i.favitor=s.data)},I=i=>{const s=e.list.findIndex(d=>d.id===i.id);s>-1&&(e.listActive=s),w(i)},r=G(()=>e.list[e.listActive]||{}),g=()=>{e.list[e.listActive].favitor=!e.list[e.listActive].favitor,ft({favoriteFlag:e.list[e.listActive].favitor,type:"MUSIC",materialId:e.list[e.listActive].id})},S=i=>{const s=e.list.findIndex(d=>d.id===i.id);s>-1&&(e.listActive===s?e.playState=e.playState==="play"?"pause":"play":e.playState="play",e.showPlayer=!0,e.listActive=s)},P=i=>{i==="play"?e.playState="play":i==="pause"?e.playState="pause":i==="pre"?e.list[e.listActive-1]&&S(e.list[e.listActive-1]):i==="next"?e.list[e.listActive+1]&&S(e.list[e.listActive+1]):i==="favitor"&&g()};return()=>{let i;return t("div",{class:l.container},[t(B,{align:"center",wrapItem:!1,size:16},{default:()=>[t("img",{style:{cursor:"pointer"},src:jt,onClick:()=>a.push({path:"/xiaoku-ai"})},null),t(et,{separator:""},{default:()=>[t(j,{onClick:()=>a.push({path:"/xiaoku-ai"})},{default:()=>[v("全部列表")]}),t("img",{class:l.separator,src:zt},null),t(j,null,{default:()=>[y.query.name]})]})]}),t("div",{class:l.wrap,style:{paddingBottom:e.showPlayer?"108Px":""}},[t("div",{class:l.content},[t("div",{class:l.tools},[t(B,{style:{width:"100%"},size:[24,12],wrapItem:!1},{default:()=>[t("div",{id:"music-0"},[t(B,{style:{width:"100%"},size:[24,12],wrapItem:!1},fe(i=e.tags.map(s=>t(L,{round:!0,textColor:e.tagIndex===s.id?"#fff":"#000",color:e.tagIndex===s.id?"#198CFE":"#fff",onClick:()=>{e.tagIndex=s.id,e.reshing=!0,p()}},{default:()=>[s.name]})))?i:{default:()=>[i]})])]}),t(nt,{style:{marginLeft:"auto"},round:!0,border:!1,onSearch:s=>{o.name=s,e.reshing=!0,p()}},null)]),t("div",{class:l.contentWrap},[t("div",{class:l.musicList},[t("div",{class:l.wrapList},[e.list.map((s,d)=>t("div",{class:l.itemContainer},[t("div",{class:[l.item,e.listActive===d&&l.active],onClick:()=>I(s)},[t("div",{class:l.img},[t(M,{width:60,height:60,lazy:!0,objectFit:"cover",previewDisabled:!0,src:s.titleImg||Ot,onLoad:b=>{b.target.dataset.loaded="true"}},null),t(pe,{class:[e.listActive===d&&e.playState==="play"?"":l.showPlayLoading]},null)]),t("div",{class:l.title},[t("div",{class:l.titleName},[t(X,{text:s.musicSheetName},null)]),t("div",{class:l.titleDes},[s.composer])]),d==0?t(L,st({color:"#259CFE",textColor:"#fff"},{id:"music-1"},{round:!0,class:l.btn,type:"primary",onClick:b=>{b.stopPropagation(),S(s)}}),{default:()=>[v("试听"),t("img",{src:e.listActive===d&&e.playState==="play"?$:T},null)]}):t(L,{color:"#259CFE",textColor:"#fff",round:!0,class:l.btn,type:"primary",onClick:b=>{b.stopPropagation(),S(s)}},{default:()=>[v("试听"),t("img",{src:e.listActive===d&&e.playState==="play"?$:T},null)]}),t("img",{class:l.arrow,src:Gt},null)])])),!e.finshed&&t("div",{ref:n,class:l.loadingWrap},[t(at,{show:!0},null)]),!e.loading&&e.list.length===0&&t("div",{class:l.empty},[t(z,null,null)])])]),t("div",{class:l.musicStaff},[t("div",{class:l.musicName},[r.value.musicSheetName]),t("img",{id:"music-2",style:{display:r.value.id?"":"none"},class:l.goBtn,src:Mt,onClick:()=>{P("pause");const d=`${/(localhost|192)/.test(location.host)?"https://test.lexiaoya.cn":location.origin}/instrument?platform=pc&showGuide=true&id=${r.value.id}&Authorization=${c.getToken}`;window.open(d)}},null),t("div",{style:{display:r.value.id?"":"none"},class:l.favitor,onClick:()=>g()},[t(it,{name:"favitor",mode:"out-in"},{default:()=>[r.value.favitor?t("img",{src:ct,key:"1"},null):t("img",{src:rt,key:"2"},null)]})]),t("div",{class:l.staffImgs},[t(lt,{name:"van-fade"},{default:()=>{var s,d,b,F,U;return[(s=r.value)!=null&&s.musicSvg||(d=r.value)!=null&&d.musicImg?(U=((b=r.value)==null?void 0:b.musicSvg)||((F=r.value)==null?void 0:F.musicImg))==null?void 0:U.split(",").map((D,ge)=>t("img",{src:D,key:D},null)):t(z,null,null)]}})])])])])]),e.list.length!==0&&t(ce,{show:e.showPlayer,playState:e.playState,item:r.value,onChange:s=>P(s)},null),h.value?t(me,null,null):null])}}});export{Ie as default};
|