| 1 |
- import{d as V,e as R,X as c,r as I,p as J,H as E,O as X,f as t,c1 as q,bT as H,k as g,F,c as M,a as K,u as Q,M as Y,U as Z,w as B,ck as ee,cl as W,j as L,v as te,x as se,A as $,W as ie,a6 as ae,l as le,aV as oe}from"./index-e6046b8b.js";import{i as ne}from"./icon_back-c5ec0a72.js";import{i as ce,P as re,a as D,b as j,c as ue,d as de}from"./index-162d1f68.js";import{T as pe}from"./index-b2963ed6.js";import{i as me,a as fe}from"./icon-collect-active-4272e308.js";import{i as ge}from"./icon_default-d1bcaf5f.js";import{T as ve}from"./index-a51381cb.js";import{c as he,d as we,e as ye}from"./api-fc2c6579.js";import{g as N,s as f,a as _e,b as z}from"./api-2711f51c.js";import{T as O}from"./index-0b0b91fb.js";import{s as ke}from"./state-26546a52.js";import{u as Se}from"./index-c51f530a.js";import"./Slider-50609f2e.js";import"./index-b1c5c259.js";const be="_container_11l7k_1",xe="_iconBack_11l7k_6",Ce="_separator_11l7k_36",Ie="_wrap_11l7k_41",Ae="_wrapBottom_11l7k_47",Pe="_content_11l7k_50",Be="_tools_11l7k_57",Le="_contentWrap_11l7k_71",Ne="_musicList_11l7k_78",Re="_wrapList_11l7k_92",Te="_empty_11l7k_98",Ge="_itemContainer_11l7k_104",Ue="_item_11l7k_104",Ee="_active_11l7k_126",Fe="_arrow_11l7k_129",Me="_img_11l7k_132",We="_title_11l7k_155",$e="_titleName_11l7k_162",De="_titleDes_11l7k_169",je="_btn_11l7k_179",ze="_showPlayLoading_11l7k_203",Oe="_loadingWrap_11l7k_206",Ve="_musicStaff_11l7k_211",Je="_goBtn_11l7k_226",Xe="_favitor_11l7k_235",qe="_musicName_11l7k_253",He="_staffImgs_11l7k_261",Ke="_previewWindow_11l7k_278",Qe="_previewClose_11l7k_283",Ye="_previewIframe_11l7k_290",a={container:be,iconBack:xe,separator:Ce,wrap:Ie,wrapBottom:Ae,content:Pe,tools:Be,contentWrap:Le,musicList:Ne,wrapList:Re,empty:Te,itemContainer:Ge,item:Ue,active:Ee,arrow:Fe,img:Me,title:We,titleName:$e,titleDes:De,btn:je,showPlayLoading:ze,loadingWrap:Oe,musicStaff:Ve,goBtn:Je,favitor:Xe,musicName:qe,staffImgs:He,previewWindow:Ke,previewClose:Qe,previewIframe:Ye},Ze=""+new URL("icon_goXiaoku-5d0db670.png",import.meta.url).href,et=""+new URL("icon-close-1bf25bcf.png",import.meta.url).href,tt=V({name:"music-guide",emits:["close"],setup(k,{emit:A}){const l=R({box:{height:"0px"},show:!1,steps:[{ele:"",eleRect:{},img:N("music1.png"),handStyle:{top:"0.91rem"},imgStyle:{top:c(-4),left:c(0),width:c(533),height:c(271)},btnsStyle:{bottom:c(40),left:c(159)},eleRectPadding:{left:7,top:7,width:14,height:14},boxStyle:{}},{ele:"",img:N("music2.png"),imgStyle:{top:c(-4),left:c(-205),width:c(420),height:c(228)},btnsStyle:{bottom:c(35),left:c(-48)},boxStyle:{borderRadius:"25px"},eleRectPadding:{left:7,top:7,width:14,height:14}},{ele:"",img:N("music3.png"),imgStyle:{top:"100%",left:c(-130),width:c(401),height:c(304)},btnsStyle:{bottom:c(100),left:c(30)},boxStyle:{borderRadius:"40px"},eleRectPadding:{left:7,top:7,width:14,height:14},type:"bottom"}],step:0}),d=I(!1),e=I({});(async()=>{var o;try{const r=await _e({guideTag:"teacher-guideInfo"});r.data?e.value=JSON.parse((o=r.data)==null?void 0:o.guideValue)||null:e.value={},e.value&&e.value.musicGuide?d.value=!1:d.value=!0}catch(r){console.log(r)}})();const w=()=>{var r,v,_,u;const o=document.getElementById("music-".concat(l.step));if(o){const m=o.getBoundingClientRect();if(console.log(o.style.display,"ele"),o.style.display=="none"){y();return}const h=((r=l.steps[l.step].eleRectPadding)==null?void 0:r.left)||0,C=((v=l.steps[l.step].eleRectPadding)==null?void 0:v.top)||0,i=((_=l.steps[l.step].eleRectPadding)==null?void 0:_.width)||0,s=((u=l.steps[l.step].eleRectPadding)==null?void 0:u.height)||0;l.box={left:m.x-h+"px",top:m.y-C+"px",width:m.width+i+"px",height:m.height+s+"px"}}else y()},x=async o=>{try{if(o!=="xiaoku-music")return;e.value?e.value.musicGuide=!1:e.value={musicGuide:!1};try{await z({guideTag:"teacher-guideInfo",guideValue:JSON.stringify(e.value)})}catch(r){console.log(r)}l.step=0,w(),d.value=!0}catch(r){}};J(()=>{w(),window.addEventListener("resize",S),E.on("teacher-guideInfo",o=>x(o))});const S=()=>{w()};X(()=>{window.removeEventListener("resize",S),E.off("teacher-guideInfo",x)});const y=()=>{if(l.step>=3){b();return}l.step=l.step+1,w()},b=async()=>{e.value?e.value.musicGuide=!0:e.value={musicGuide:!0};try{const o=await z({guideTag:"teacher-guideInfo",guideValue:JSON.stringify(e.value)})}catch(o){console.log(o)}d.value=!1};return()=>t(F,null,[d.value?q(t("div",{"onUpdate:show":o=>d.value=o,class:["n-modal-mask","n-modal-mask-guide"]},[t("div",{class:f.content,onClick:()=>y()},[t("div",{class:f.backBtn,onClick:o=>{o.stopPropagation(),b()}},[g("跳过")]),t("div",{class:f.box,style:{...l.box,...l.steps[l.step].boxStyle},id:"modeType-".concat(l.step)},[l.steps.map((o,r)=>{var v,_,u,m;return t("div",{onClick:h=>h.stopPropagation(),class:f.item,style:o.type=="bottom"?{display:r===l.step?"":"none",left:"".concat((v=o.eleRect)==null?void 0:v.left,"px"),top:"-".concat((_=o.imgStyle)==null?void 0:_.height)}:{display:r===l.step?"":"none",left:"".concat((u=o.eleRect)==null?void 0:u.left,"px"),top:"".concat((m=l.box)==null?void 0:m.height)}},[t("img",{class:f.img,style:o.imgStyle,src:o.img},null),t("div",{class:f.btns,style:o.btnsStyle},[l.step+1==l.steps.length?t(F,null,[t("div",{class:[f.endBtn],onClick:()=>b()},[g("完成")]),t("div",{class:f.nextBtn,onClick:()=>{l.step=0,w()}},[g("再看一遍")])]):t("div",{class:f.btn,onClick:()=>y()},[g("下一步 ("),l.step+1,g("/"),l.steps.length,g(")")])])])})])])]),[[H,d.value,"show"]]):null])}});function st(k){return typeof k=="function"||Object.prototype.toString.call(k)==="[object Object]"&&!oe(k)}const wt=V({name:"XiaokuMusic",setup(){const k=M(),A=K(),l=Q(),d=R({page:1,rows:20,status:!0,name:"",musicSheetCategoriesId:A.query.id||""}),e=R({loading:!1,finshed:!1,reshing:!1,tags:[],tagIndex:0,list:[],listActive:0,playState:"pause",showPlayer:!1,previewModal:!1,showPreivew:!1,previewUrl:"",showCloseBtn:!0}),P=I(!1),w=M(),x=async()=>{const i=sessionStorage.getItem("musicSubjectList")?JSON.parse(sessionStorage.getItem("musicSubjectList")):[];e.tags=[{name:"全部",id:0},...i]},S=async()=>{var s;e.loading=!0;let i={};try{i=await he({...d,musicSubject:e.tagIndex?e.tagIndex:""})}catch(n){console.log(n)}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<d.rows,console.log("🚀 ~ data.finshed:",e.finshed)),e.list[e.listActive]&&v(e.list[e.listActive]),e.loading=!1,setTimeout(()=>{P.value=!0},500)},y=()=>{e.listActive=0,e.showPlayer=!1,e.playState="pause",d.page=1,e.finshed=!1,S()},b=I(),o=()=>{console.log(e.finshed),!(e.loading||e.finshed)&&(d.page=d.page+1,S())},r=i=>{var s;((s=i.data)==null?void 0:s.api)==="api_fingerPreView"&&(e.showCloseBtn=!i.data.state)};J(async()=>{Se(document.querySelector(".musicList-container"),s=>{const n=s[0],{height:p}=n.contentRect;console.log(p,"height - 11"),document.documentElement.style.setProperty("--xiaoku-music-height",p+"px")}),x(),await S();const i=new IntersectionObserver(s=>{s[0].intersectionRatio>0&&o()});Y(()=>{i.observe(b.value)}),window.addEventListener("message",r)}),X(()=>{window.removeEventListener("message",r)});const v=async i=>{const s=await we({type:"MUSIC",materialId:i.id});(s==null?void 0:s.code)===200&&(i.favitor=s.data)},_=i=>{const s=e.list.findIndex(n=>n.id===i.id);s>-1&&(e.listActive=s),v(i)},u=Z(()=>{if(e.list[e.listActive]){const i=/(localhost|192)/.test(location.host)?"https://dev.kt.colexiu.com":location.origin;console.log(e.list[e.listActive].xmlFileUrl,"data.list[data.listActive]"),"".concat(i,"/instrument?modelType=practise&id=").concat(e.list[e.listActive].xmlFileUrl,"&Authorization=").concat(w.getToken,"/#/preview")}return e.list[e.listActive]||{}}),m=()=>{e.list[e.listActive].favitor=!e.list[e.listActive].favitor,ye({favoriteFlag:e.list[e.listActive].favitor,type:"MUSIC",materialId:e.list[e.listActive].id})},h=i=>{const s=e.list.findIndex(n=>n.id===i.id);s>-1&&(e.listActive===s?e.playState=e.playState==="play"?"pause":"play":e.playState="play",e.showPlayer=!0,e.listActive=s)},C=i=>{i==="play"?e.playState="play":i==="pause"?e.playState="pause":i==="pre"?e.list[e.listActive-1]&&h(e.list[e.listActive-1]):i==="next"?e.list[e.listActive+1]&&h(e.list[e.listActive+1]):i==="favitor"&&m()};return()=>{let i;return t("div",{class:a.container},[t(B,{align:"center",wrapItem:!1,size:16},{default:()=>[t("img",{style:{cursor:"pointer"},src:ne,class:a.iconBack,onClick:()=>l.push({path:"/xiaoku-ai"})},null),t(ee,{separator:""},{default:()=>[t(W,{onClick:()=>l.push({path:"/xiaoku-ai"})},{default:()=>[g("全部列表")]}),t("img",{class:a.separator,src:ce},null),t(W,null,{default:()=>[A.query.name]})]})]}),t("div",{class:[a.wrap,e.showPlayer?a.wrapBottom:""]},[t("div",{class:a.content},[t("div",{class:a.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},st(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,y()}},{default:()=>[s.name]})))?i:{default:()=>[i]})])]}),t(pe,{style:{marginLeft:"auto"},round:!0,border:!1,onSearch:s=>{d.name=s,e.reshing=!0,y()}},null)]),t("div",{class:a.contentWrap},[t("div",{class:[a.musicList,"musicList-container"]},[t("div",{class:a.wrapList},[e.list.map((s,n)=>t("div",{class:a.itemContainer},[t("div",{class:[a.item,e.listActive===n&&a.active],onClick:()=>_(s)},[t("div",{class:a.img},[t(te,{lazy:!0,objectFit:"cover",previewDisabled:!0,src:s.titleImg||ge,onLoad:p=>{p.target.dataset.loaded="true"}},null),t(re,{class:[e.listActive===n&&e.playState==="play"?"":a.showPlayLoading]},null)]),t("div",{class:a.title},[t("div",{class:a.titleName},[t(ve,{text:s.musicSheetName},null)]),t("div",{class:a.titleDes},[s.composer])]),n==0?t(L,se({color:"#259CFE",textColor:"#fff"},{id:"music-1"},{round:!0,class:a.btn,type:"primary",onClick:p=>{p.stopPropagation(),h(s)}}),{default:()=>[g("试听"),t("img",{src:e.listActive===n&&e.playState==="play"?D:j},null)]}):t(L,{color:"#259CFE",textColor:"#fff",round:!0,class:a.btn,type:"primary",onClick:p=>{p.stopPropagation(),h(s)}},{default:()=>[g("试听"),t("img",{src:e.listActive===n&&e.playState==="play"?D:j},null)]}),t("img",{class:a.arrow,src:ue},null)])])),!e.finshed&&t("div",{ref:b,class:a.loadingWrap},[t($,{show:!0},null)]),!e.loading&&e.list.length===0&&t("div",{class:a.empty},[t(O,null,null)])])]),t("div",{class:a.musicStaff},[t("div",{class:a.musicName},[u.value.musicSheetName]),t("img",{id:"music-2",style:{display:u.value.id?"":"none"},class:[a.goBtn],src:Ze,onClick:()=>{C("pause");const s=/(localhost|192)/.test(location.host)?"https://test.lexiaoya.cn":location.origin,n="".concat(s,"/instrument?platform=pc&showGuide=true&id=").concat(u.value.id,"&Authorization=").concat(k.getToken);window.matchMedia("(display-mode: standalone)").matches?(ke.application=window.matchMedia("(display-mode: standalone)").matches,e.previewModal=!0,e.previewUrl=n,e.showPreivew=!1):window.open(n)}},null),t("div",{style:{display:u.value.id?"":"none"},class:a.favitor,onClick:()=>m()},[t(ie,{name:"favitor",mode:"out-in"},{default:()=>[u.value.favitor?t("img",{src:me,key:"1"},null):t("img",{src:fe,key:"2"},null)]})]),t("div",{class:a.staffImgs},[t(ae,{name:"van-fade"},{default:()=>{var s,n,p,T,G;return[(s=u.value)!=null&&s.musicSvg||(n=u.value)!=null&&n.musicImg?(G=((p=u.value)==null?void 0:p.musicSvg)||((T=u.value)==null?void 0:T.musicImg))==null?void 0:G.split(",").map((U,it)=>t("img",{src:U,key:U},null)):t(O,null,null)]}})])])])])]),e.list.length!==0&&t(de,{show:e.showPlayer,playState:e.playState,item:u.value,onChange:s=>C(s)},null),P.value?t(tt,null,null):null,t(le,{show:e.previewModal,"onUpdate:show":[s=>e.previewModal=s,s=>{s||(e.previewUrl="")}],class:a.previewWindow,showIcon:!1,displayDirective:"show"},{default:()=>[t($,{show:e.showPreivew,style:"--n-opacity-spinning: 1;"},{default:()=>[t("img",{style:{display:e.showCloseBtn?"":"none"},src:et,class:a.previewClose,onClick:()=>{e.previewModal=!1,e.previewUrl=""}},null),t("iframe",{class:a.previewIframe,onLoad:()=>{e.showPreivew=!1},frameborder:"0",src:e.previewUrl},null)]})]})])}}});export{wt as default};
|
