index-3d29136b.js 13 KB

1
  1. import{d as A,e as k,r as N,R as z,cw as E,w as q,f as t,o as M,cx as J,j as C,Z as P,q as O,_ as V,$ as Z,a0 as H,k as _,F as W,c as K,a as Q,u as Y,a8 as tt,X as B,cu as et,cv as j,x as st,a3 as at,T as it,al as lt,b5 as ot}from"./index-b7b3f9a2.js";import{T as nt}from"./index-8f45fef6.js";import{i as ct,a as rt}from"./icon-collect-active-4272e308.js";import{T as X}from"./index-a8c64ec4.js";import{N as dt}from"./Slider-b69cda08.js";import{c as ut,d as pt,e as mt,f as ft}from"./api-0f55a90b.js";import{g as R,s as h}from"./index-2c33af29.js";import{T as G}from"./index-3cd6d448.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",xt="_wrapList_1dh8a_76",bt="_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",Dt="_goBtn_1dh8a_207",Ut="_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:xt,empty:bt,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:Dt,favitor:Ut,musicName:Et,staffImgs:Wt},jt=""+new URL("icon_back-17d73f64.svg",import.meta.url).href,Gt=""+new URL("icon_separator-36fe21d8.svg",import.meta.url).href,zt=""+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",p={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:v}){let a=null;const o=k({isFirst:!0,duration:0,currentTime:0}),e=N(),g=()=>{if(o.duration=e.value.duration,o.isFirst){o.isFirst=!1;return}c.playState==="play"&&e.value.play()},I=u=>{e.value.pause(),o.currentTime=u,clearTimeout(a),a=setTimeout(()=>{e.value.currentTime=u,c.playState==="play"&&e.value.play(),a=null},300)},m=z(()=>`${E(o.currentTime)} / ${E(o.duration)}`);return q(()=>c.playState,u=>{u==="play"?e.value.play():e.value.pause()}),()=>t("div",{class:[p.container,c.show?p.show:p.hidden]},[t("div",{class:[p.item]},[t("div",{class:p.img},[t(M,{lazy:!0,objectFit:"cover",previewDisabled:!0,src:c.item.titleImg,onLoad:u=>{u.target.dataset.loaded="true"}},null),t("svg",{class:p.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:p.progress,showIndicator:!1,percentage:o.currentTime/o.duration*100},null)]),t("div",{class:p.title},[t("div",{class:p.titleName},[t(X,{text:c.item.musicSheetName},null)]),t("div",{class:p.titleDes},[c.item.composer])]),t("div",{class:p.playBtns},[t(C,{color:"rgba(246,246,246,1)",circle:!0,bordered:!1,onClick:()=>v("change","pre")},{default:()=>[t("img",{src:oe},null)]}),t(C,{color:"rgba(57,130,246,1)",class:p.playBtn,circle:!0,bordered:!1,onClick:()=>v("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(C,{color:"rgba(246,246,246,1)",circle:!0,bordered:!1,onClick:()=>v("change","next")},{default:()=>[t("img",{src:ne},null)]})]),t("div",{class:p.timeWrap},[t(dt,{tooltip:!1,step:.01,class:p.timeProgress,value:o.currentTime,max:o.duration,"onUpdate:value":u=>I(u)},null),t("div",{class:p.time},[m.value]),t("audio",{ref:e,src:c.item.audioFileUrl||c.item.metronomeUrl,onLoadedmetadata:g,onEnded:()=>{v("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:v}){const a=k({box:{height:"0px"},show:!1,steps:[{ele:"",eleRect:{},img:R("music1.png"),handStyle:{top:"0.91rem"},imgStyle:{left:"-4.4em",width:"534px",height:"228px"},btnsStyle:{bottom:"30px",left:"90px"},eleRectPadding:{left:7,top:7,width:14,height:14}},{ele:"",img:R("music2.png"),imgStyle:{top:"100%",left:"-205px",width:"420px",height:"228px"},btnsStyle:{bottom:"30px",left:P(-60)},boxStyle:{borderRadius:"25px"},eleRectPadding:{left:7,top:7,width:14,height:14}},{ele:"",img:R("music3.png"),imgStyle:{top:"100%",left:"-130px",width:P(401),height:P(304)},btnsStyle:{bottom:"90px",left:P(20)},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 g=()=>{var x,y,b,r;const n=document.getElementById(`music-${a.step}`);if(n){const f=n.getBoundingClientRect();if(console.log(n.style.display,"ele"),n.style.display=="none"){m();return}const w=((x=a.steps[a.step].eleRectPadding)==null?void 0:x.left)||0,L=((y=a.steps[a.step].eleRectPadding)==null?void 0:y.top)||0,i=((b=a.steps[a.step].eleRectPadding)==null?void 0:b.width)||0,s=((r=a.steps[a.step].eleRectPadding)==null?void 0:r.height)||0;a.box={left:f.x-w+"px",top:f.y-L+"px",width:f.width+i+"px",height:f.height+s+"px"},console.log(`coai-${a.step}`,a.box)}else m()};O(()=>{g(),window.addEventListener("resize",I)});const I=()=>{g()};V(()=>{window.removeEventListener("resize",I)});const m=()=>{if(a.step>=3){u();return}a.step=a.step+1,g()},u=()=>{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:h.content,onClick:()=>m()},[t("div",{class:h.backBtn,onClick:n=>{n.stopPropagation(),u()}},[_("跳过")]),t("div",{class:h.box,style:{...a.box,...a.steps[a.step].boxStyle},id:`modeType-${a.step}`},[a.steps.map((n,x)=>{var y,b,r,f;return t("div",{onClick:w=>w.stopPropagation(),class:h.item,style:n.type=="bottom"?{display:x===a.step?"":"none",left:`${(y=n.eleRect)==null?void 0:y.left}px`,top:`-${(b=n.imgStyle)==null?void 0:b.height}`}:{display:x===a.step?"":"none",left:`${(r=n.eleRect)==null?void 0:r.left}px`,top:`${(f=a.box)==null?void 0:f.height}`}},[t("img",{class:h.img,style:n.imgStyle,src:n.img},null),t("div",{class:h.btns,style:n.btnsStyle},[a.step+1==a.steps.length?t(W,null,[t("div",{class:[h.endBtn],onClick:()=>u()},[_("完成")]),t("div",{class:h.nextBtn,onClick:()=>{a.step=0,g()}},[_("再看一遍")])]):t("div",{class:h.btn,onClick:()=>m()},[_("下一步 ("),a.step+1,_("/"),a.steps.length,_(")")])])])})])])]),[[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(),v=Q(),a=Y(),o=k({page:1,rows:20,status:!0,name:"",musicSheetCategoriesId:v.query.id||""}),e=k({loading:!1,finshed:!1,reshing:!1,tags:[],tagIndex:0,list:[],listActive:0,playState:"pause",showPlayer:!1}),g=N(!1),I=async()=>{const i=await ut();Array.isArray(i==null?void 0:i.data)&&(e.tags=[{name:"全部",id:0},...i.data])},m=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]&&y(e.list[e.listActive]),e.loading=!1,setTimeout(()=>{g.value=!0},500)},u=()=>{e.listActive=0,e.showPlayer=!1,e.playState="pause",o.page=1,e.finshed=!1,m()},n=N(),x=()=>{console.log(e.finshed),!(e.loading||e.finshed)&&(o.page=o.page+1,m())};O(async()=>{I(),await m();const i=new IntersectionObserver(s=>{s[0].intersectionRatio>0&&x()});tt(()=>{i.observe(n.value)})});const y=async i=>{const s=await mt({type:"MUSIC",materialId:i.id});(s==null?void 0:s.code)===200&&(i.favitor=s.data)},b=i=>{const s=e.list.findIndex(d=>d.id===i.id);s>-1&&(e.listActive=s),y(i)},r=z(()=>e.list[e.listActive]||{}),f=()=>{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})},w=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)},L=i=>{i==="play"?e.playState="play":i==="pause"?e.playState="pause":i==="pre"?e.list[e.listActive-1]&&w(e.list[e.listActive-1]):i==="next"?e.list[e.listActive+1]&&w(e.list[e.listActive+1]):i==="favitor"&&f()};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:()=>[_("全部列表")]}),t("img",{class:l.separator,src:Gt},null),t(j,null,{default:()=>[v.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(C,{round:!0,textColor:e.tagIndex===s.id?"#fff":"#000",color:e.tagIndex===s.id?"#198CFE":"#fff",onClick:()=>{e.tagIndex=s.id,e.reshing=!0,u()}},{default:()=>[s.name]})))?i:{default:()=>[i]})])]}),t(nt,{style:{marginLeft:"auto"},round:!0,border:!1,onSearch:s=>{o.name=s,e.reshing=!0,u()}},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:()=>b(s)},[t("div",{class:l.img},[t(M,{width:60,height:60,lazy:!0,objectFit:"cover",previewDisabled:!0,src:s.titleImg||Ot,onLoad:S=>{S.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(C,st({color:"#259CFE",textColor:"#fff"},{id:"music-1"},{round:!0,class:l.btn,type:"primary",onClick:S=>{S.stopPropagation(),w(s)}}),{default:()=>[_("试听"),t("img",{src:e.listActive===d&&e.playState==="play"?$:T},null)]}):t(C,{color:"#259CFE",textColor:"#fff",round:!0,class:l.btn,type:"primary",onClick:S=>{S.stopPropagation(),w(s)}},{default:()=>[_("试听"),t("img",{src:e.listActive===d&&e.playState==="play"?$:T},null)]}),t("img",{class:l.arrow,src:zt},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(G,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:()=>{L("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:()=>f()},[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,S,F,D;return[(s=r.value)!=null&&s.musicSvg||(d=r.value)!=null&&d.musicImg?(D=((S=r.value)==null?void 0:S.musicSvg)||((F=r.value)==null?void 0:F.musicImg))==null?void 0:D.split(",").map((U,ge)=>t("img",{src:U,key:U},null)):t(G,null,null)]}})])])])])]),e.list.length!==0&&t(ce,{show:e.showPlayer,playState:e.playState,item:r.value,onChange:s=>L(s)},null),g.value?t(me,null,null):null])}}});export{Ie as default};