mirror of
https://github.com/pure-admin/vue-pure-admin.git
synced 2025-06-08 17:37:24 +08:00
2 lines
9.0 KiB
JavaScript
2 lines
9.0 KiB
JavaScript
import{s as I}from"./vue3-danmaku.esm-28152722.js";const c=[{avatar:"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAoKCgoKCgsMDAsPEA4QDxYUExMUFiIYGhgaGCIzICUgICUgMy03LCksNy1RQDg4QFFeT0pPXnFlZXGPiI+7u/sBCgoKCgoKCwwMCw8QDhAPFhQTExQWIhgaGBoYIjMgJSAgJSAzLTcsKSw3LVFAODhAUV5PSk9ecWVlcY+Ij7u7+//CABEIADIAMgMBIgACEQEDEQH/xAAbAAEAAgMBAQAAAAAAAAAAAAAFBAYBAgMAB//aAAgBAQAAAAD7HU4ObhMC3AnlYvY8ISwA+6WDOd4/RA96FVeF66BOVWB3TsAOgZC27wv/xAAYAQEBAQEBAAAAAAAAAAAAAAACAwQAAf/aAAgBAhAAAAC3sw8uyRDQPV//xAAYAQADAQEAAAAAAAAAAAAAAAAAAgMBBP/aAAgBAxAAAACQ7LfmoUTNvFf/xAA0EAACAQMBBAcHAwUAAAAAAAABAgMABBESBRMxQRAhIjJRYbEUIzRCUnOBM3KSU2KRoeH/2gAIAQEAAT8AmmSCJpHOAoq6vZp8lmITkgonSQCMZxikkdGDxsVbxFbK2l7TGUkwHQfy6Ln4if7jetbcdglvH9TFv40hD71CGzlQpAyACRkt4VcxojxOdIj06GzwA5VKkilGUdjUcNxD9XlwI5g1Bfm0u4nC5UHDeYNWu0LS4B3D6mHHIwaufiJ/uN61tm6Et6GPCIbv8mtqi4gtrFkzjeuxIGRq+TP4orI1jpK+8MHAfVprYcM8kVysmoIGiwG8UfVgVcwh1ecDGiYcvlNWk7W9zDKucqwyPEVOczzfvb1q/wBkXWqR4Sja8nDHGCajAEagHIAx/jourmK0haaV9KrWyrFZLRZJ07MqNhc8Q3M/irfZFlaOGQF2HzOc1cACeYD+o3r0XptYEJKAyMx06TgsxOaupr+MhkIQk6TlfPlkVNCIxBc3A9onLjRG/WtWV1BPFlRp09TpzBHLoufiJ/uN69G05JLxt8C2ksQpTiAMHIq0mQz6HnMnZwurBwBRhKTLLK5Y6Oz/AGf9qwla3u4TykBRh/sdFx8RN9xvWpri43Unv5O6fmNSSSCHGtsb0DGfKrFm3zdZ7o9RUskhMnbbu+NLJJrh7bfqJz869onxjfSY/callk3knvG7x51//8QAIxEAAgEEAQMFAAAAAAAAAAAAAQIRAAMSMRAEIXETMjNBUf/aAAgBAgEBPwBMUTNv3tSdQrgZDYpwMmx0N8PdFv0iBMAyKS4QroF99JcxDhhMntwxgUCoJIER90jZCeG2PBpvjNWtHzx//8QAIBEAAgICAgIDAAAAAAAAAAAAAQIAERASAyEyM0GBkf/aAAgBAwEBPwBtmbURuErdRb1W/nCIW3vqMgJVr8YyWVIyvYG/5CKwJze36jY//9k=",name:"美绪",text:"马什么梅？"},{avatar:"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAoKCgoKCgsMDAsPEA4QDxYUExMUFiIYGhgaGCIzICUgICUgMy03LCksNy1RQDg4QFFeT0pPXnFlZXGPiI+7u/sBCgoKCgoKCwwMCw8QDhAPFhQTExQWIhgaGBoYIjMgJSAgJSAzLTcsKSw3LVFAODhAUV5PSk9ecWVlcY+Ij7u7+//CABEIADIAMgMBIgACEQEDEQH/xAAbAAACAwEBAQAAAAAAAAAAAAAABQIDBAEGB//aAAgBAQAAAAD65hzG3WLcATfCbHYQ9IY0uiEfRkU1IOr+RoUG1ornWj7Y6//EABgBAQADAQAAAAAAAAAAAAAAAAQAAgUD/9oACAECEAAAACEf3IJba51tGDNq/wD/xAAYAQEAAwEAAAAAAAAAAAAAAAAEAQMFAv/aAAgBAxAAAABSg0MWQdj+c6VozP/EAC0QAAIBAwMBBgUFAAAAAAAAAAECEQADBBASMUEiUVJhcZEFExQhgSAyQoKx/9oACAEBAAE/AKu5oEi2A3meKOXf8cfgV9Xe2kEgyOeCKsZSXAqs0XP91z7+wC3MSCzeg/RbuG06uO8T6a5kNkOOu0CpUXWQMdo4kQRPQihPd9tH+4jXIw0yDukq0RNHFu2/iOVku0pfx7foHt91MttbMyN7njqQDo3BPkdWEqRJEjkV8QOV2LVq2xBBlkoq+y181CrgHn1nXHffZQ+UH8aEwCaEoJP9qzbe+ySOUO7XCuxca2f5CR6jS477H7bftPWt7+NvekdzbWXYyo60rvtXtHgda3v4j71Yd/qLPaPJ6+Vb38be9f/EACYRAAECBAQHAQAAAAAAAAAAAAECAwAEEBIREzFSITNBQlFhgXL/2gAIAQIBAT8AffKDYjXqYznd5hhwuI46ijjOOaSfaYUm232Ik9F/KKQFRMN2LHgiJVdrmG6s32fYa5iP0Kf/xAAmEQABAgQFBAMAAAAAAAAAAAABAgMAEBESBBNCUoEhMTNhUXFy/9oACAEDAQE/AGGAoXK4EZLWwQ+2G19Oxk28RlhI9GEqur9xi9HMm3C2qtAfRhhy9J+axiUXIrtnhdfEOeNf5Mv/2Q==",name:"博士",text:"马东什么？"},{avatar:"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAoKCgoKCgsMDAsPEA4QDxYUExMUFiIYGhgaGCIzICUgICUgMy03LCksNy1RQDg4QFFeT0pPXnFlZXGPiI+7u/sBCgoKCgoKCwwMCw8QDhAPFhQTExQWIhgaGBoYIjMgJSAgJSAzLTcsKSw3LVFAODhAUV5PSk9ecWVlcY+Ij7u7+//CABEIADIAMgMBIgACEQEDEQH/xAAxAAACAgMBAAAAAAAAAAAAAAAABgQFAQIHAwEBAAMBAAAAAAAAAAAAAAAAAwABAgT/2gAMAwEAAhADEAAAAI7CsPnN1VeZ0okpTbSWASKzwmMPRy3PuuWhpv4KvQ7pcJYTUb+hdLQYWJoaVU+RU3jcXiaoegAhWOAPeeaBd1wGtf/EAC4QAAIBAwIEBAUFAQAAAAAAAAECAwAEEQUhBhASMRMiQWEUI3KBoSAzQlFSkv/aAAgBAQABPwDTxidHHbdTyZGjdkcYYelBGKM4HlUgH7/osXInRfQsK0q18abxGHkj/JrV0KXrEfzUGtLiE0F1G48r4GfcVJDJFI0TbMp52W91D9VXt42mWQCu0QUqHZQC7SyDIRA22QO5NXkFyLeFpnWRggYsMZw/+ioAPsRVlOtrpsshx+6d2OFGw3J/oVK897YR6nbfORCTkp0OVQ7lRk5Aq5gMZSVR8qVepfbPpy0jDSRyEZxIg/6JrjKJytlEEJ63uJD7ttXB6Tn41bhW8Mwxxjqzt3OBWrx+Bw9fQsRvIgBzjYutcP3F8upWVmZZltvjFPQW22BqeAJpHh+kWyeyhsL+KXS9RcB1WLpYZGSc4NcKwxTrcRy+qrj2IJIqe3S5AEsSOAcgMobB+9Lb9KhVAAHYCntRIjI6hkYYZWGQRUGm2ltMssVsiSKCAVGMZqWFZ4fDY4XYn7ULaEgF182N/Me9cIuI3kY9gFodLAEHINFgKDKdqwK1LVotOMSsnWz5JAPYUeJZyTiKMVwv2n+la08npcZOBjke3LVWZtRuizE4kI5f/8QAIBEBAAIBAgcAAAAAAAAAAAAAAQARAwIQEiAhMTJBcf/aAAgBAgEBPwDL5HzkadfX0RDjmTSUJtks1MqWpVypk7uxt//EACARAQABAwMFAAAAAAAAAAAAAAEAAhEhAxATEiIxYXH/2gAIAQMBAT8A0m1L9l+2++Sg9sF45p1N7M6iUJYwM5GYW4ZmZT4Njb//2Q==",name:"柚子",text:"什么冬梅？"}],x=["1","2","3","4","5","6","7","8","9"],E=()=>x.map((r,t)=>{const n=t%3;return{avatar:c[n].avatar,name:c[n].name,text:r}}),N={class:"card-header"},M={class:"font-medium"},k={class:"flex gap-5"},h={class:"danmu-item"},v=["src"],D={class:"main"},S={class:"ml-5"},T={class:"ml-5"},R={class:"ml-5"},U={class:"flex"},y=Vue.defineComponent({name:"Danmaku"}),K=Vue.defineComponent({...y,setup(r){const t=Vue.ref(),n=Vue.ref(E()),V=Vue.ref("");let s=0;const u=Vue.reactive({channels:5,useSlot:!0,loop:!0,speeds:200,fontSize:20,top:10,right:0,debounce:100,randomChannel:!0});Vue.onMounted(()=>{window.onresize=()=>B()}),Vue.onUnmounted(()=>{window.onresize=null});function l(o){switch(o){case"play":t.value.play();break;case"pause":t.value.pause();break;case"stop":t.value.stop();break;case"show":t.value.show();break;case"hide":t.value.hide();break;case"reset":t.value.reset();break}}function i(o){u.useSlot=o,n.value=o?E():x,setTimeout(()=>{t.value.stop(),t.value.play()})}function C(o){u.speeds<=10&&o===-10||(u.speeds+=o,t.value.reset())}function g(o){u.fontSize+=o,t.value.reset()}function d(o){!u.channels&&o===-1||(u.channels+=o)}function B(){s&&clearTimeout(s),s=window.setTimeout(()=>{t.value.resize()},500)}function Q(){if(!V.value)return;const o=u.useSlot?{avatar:"https://i.loli.net/2021/01/17/xpwbm3jKytfaNOD.jpg",name:"你",text:V.value}:V.value;t.value.add(o),V.value=""}return(o,e)=>{const p=Vue.resolveComponent("el-link"),a=Vue.resolveComponent("el-button"),m=Vue.resolveComponent("el-input"),f=Vue.resolveComponent("el-card");return Vue.openBlock(),Vue.createBlock(f,null,{header:Vue.withCtx(()=>[Vue.createElementVNode("div",N,[Vue.createElementVNode("span",M,[Vue.createTextVNode(" 弹幕组件，采用开源的 "),Vue.createVNode(p,{href:"https://github.com/hellodigua/vue-danmaku/tree/vue3",target:"_blank",style:{"font-size":"16px",margin:"0 4px 5px"}},{default:Vue.withCtx(()=>[Vue.createTextVNode(" vue3-danmaku ")]),_:1})])])]),default:Vue.withCtx(()=>[Vue.createElementVNode("div",k,[Vue.createVNode(Vue.unref(I),Vue.mergeProps({ref_key:"danmaku",ref:t,class:"demo",danmus:n.value,"onUpdate:danmus":e[0]||(e[0]=A=>n.value=A),isSuspend:""},u),{dm:Vue.withCtx(({danmu:A,index:w})=>[Vue.createElementVNode("div",h,[Vue.createElementVNode("img",{class:"img",src:A.avatar},null,8,v),Vue.createElementVNode("span",null,Vue.toDisplayString(w)+Vue.toDisplayString(A.name)+"：",1),Vue.createElementVNode("span",null,Vue.toDisplayString(A.text),1)])]),_:1},16,["danmus"]),Vue.createElementVNode("div",D,[Vue.createElementVNode("p",null,[Vue.createTextVNode(" 播放： "),Vue.createVNode(a,{onClick:e[1]||(e[1]=A=>l("play"))},{default:Vue.withCtx(()=>[Vue.createTextVNode("播放")]),_:1}),Vue.createVNode(a,{onClick:e[2]||(e[2]=A=>l("pause"))},{default:Vue.withCtx(()=>[Vue.createTextVNode("暂停")]),_:1}),Vue.createVNode(a,{onClick:e[3]||(e[3]=A=>l("stop"))},{default:Vue.withCtx(()=>[Vue.createTextVNode("停止")]),_:1})]),Vue.createElementVNode("p",null,[Vue.createTextVNode(" 模式： "),Vue.createVNode(a,{onClick:e[4]||(e[4]=A=>i(!0))},{default:Vue.withCtx(()=>[Vue.createTextVNode("弹幕 slot")]),_:1}),Vue.createVNode(a,{onClick:e[5]||(e[5]=A=>i(!1))},{default:Vue.withCtx(()=>[Vue.createTextVNode("普通文本")]),_:1})]),Vue.createElementVNode("p",null,[Vue.createTextVNode(" 显示： "),Vue.createVNode(a,{onClick:e[6]||(e[6]=A=>l("show"))},{default:Vue.withCtx(()=>[Vue.createTextVNode("显示")]),_:1}),Vue.createVNode(a,{onClick:e[7]||(e[7]=A=>l("hide"))},{default:Vue.withCtx(()=>[Vue.createTextVNode("隐藏")]),_:1})]),Vue.createElementVNode("p",null,[Vue.createTextVNode(" 速度： "),Vue.createVNode(a,{onClick:e[8]||(e[8]=A=>C(-10))},{default:Vue.withCtx(()=>[Vue.createTextVNode("减速")]),_:1}),Vue.createVNode(a,{onClick:e[9]||(e[9]=A=>C(10))},{default:Vue.withCtx(()=>[Vue.createTextVNode("增速")]),_:1}),Vue.createElementVNode("span",S,"当前速度："+Vue.toDisplayString(u.speeds)+"像素/s",1)]),Vue.createElementVNode("p",null,[Vue.createTextVNode(" 字号： "),Vue.createVNode(a,{disabled:u.useSlot,onClick:e[10]||(e[10]=A=>g(-1))},{default:Vue.withCtx(()=>[Vue.createTextVNode(" 缩小 ")]),_:1},8,["disabled"]),Vue.createVNode(a,{disabled:u.useSlot,onClick:e[11]||(e[11]=A=>g(1))},{default:Vue.withCtx(()=>[Vue.createTextVNode(" 放大 ")]),_:1},8,["disabled"]),Vue.createElementVNode("span",T,"当前字号："+Vue.toDisplayString(u.fontSize)+"px",1)]),Vue.createElementVNode("p",null,[Vue.createTextVNode(" 轨道： "),Vue.createVNode(a,{onClick:e[12]||(e[12]=A=>d(-1))},{default:Vue.withCtx(()=>[Vue.createTextVNode("-1")]),_:1}),Vue.createVNode(a,{onClick:e[13]||(e[13]=A=>d(1))},{default:Vue.withCtx(()=>[Vue.createTextVNode("+1")]),_:1}),Vue.createVNode(a,{onClick:e[14]||(e[14]=A=>d(-u.channels))},{default:Vue.withCtx(()=>[Vue.createTextVNode(" 填满 ")]),_:1}),Vue.createElementVNode("span",R,"当前轨道："+Vue.toDisplayString(u.channels),1)]),Vue.createElementVNode("p",U,[Vue.createVNode(m,{type:"text",placeholder:"输入评论后，回车发送弹幕",modelValue:V.value,"onUpdate:modelValue":e[15]||(e[15]=A=>V.value=A),onKeyup:Vue.withKeys(Q,["enter"])},null,8,["modelValue","onKeyup"])])])])]),_:1})}}});export{K as default};
|