12345 |
- import{c as f}from"./index.72328493.js";import{M as u,a3 as h,am as l,o as s,a as d,_ as e,U as a,u as c,F as v,ad as b,T as g,Y as x,Z as y,f as k}from"./vue.aade88c7.js";const w={class:"notice-bar-container layout-pd"},B=u({name:"makeNoticeBar"}),N=u({...B,setup(D){const n=k(()=>f(()=>import("./index.acf820af.js"),["./index.acf820af.js","./vue.aade88c7.js","./index.72328493.js","./index.b5b78cd7.css","./index.824b7afa.css"],import.meta.url)),r=h({noticeList:["🎉🎉🔥基于vue3.x 、Typescript、vite、Element plus等","适配手机、平板、pc的后台开源免费模板库(vue2.x请切换vue-prev-admin分支)","仓库地址:https://gitee.com/lyt-top/vue-next-admin","演示地址:https://lyt-top.gitee.io/vue-next-admin-preview/#/login"],tableData:[{a1:"mode",a2:"通知栏模式,用于右侧 icon 图标点击",a3:"string",a4:"closeable / link",a5:""},{a1:"text",a2:"通知文本内容,scrollable 为 false 时生效",a3:"string",a4:"",a5:""},{a1:"color",a2:"通知文本颜色",a3:"string",a4:"",a5:"#e6a23c"},{a1:"background",a2:"通知背景色",a3:"string",a4:"",a5:"#fdf6ec"},{a1:"size",a2:"字体大小,单位px",a3:"number / string",a4:"",a5:"14"},{a1:"height",a2:"通知栏高度,单位px",a3:"number / string",a4:"",a5:"40"},{a1:"delay",a2:"动画延迟时间 (s)",a3:"number / string",a4:"",a5:"1"},{a1:"speed",a2:"滚动速率 (px/s)",a3:"number / string",a4:"",a5:"100"},{a1:"scrollable",a2:"是否开启垂直滚动",a3:"boolean",a4:"true",a5:"false"},{a1:"leftIcon",a2:"自定义左侧图标",a3:"string",a4:"",a5:""},{a1:"rightIcon",a2:"自定义右侧图标",a3:"string",a4:"",a5:""}],tableData1:[{a1:"close",a2:"通知栏模式(mode)closeable 时回调事件",a3:"function",a4:""},{a1:"link",a2:"通知栏模式(mode)link 时回调事件",a3:"function",a4:""}]});return(E,T)=>{const o=l("el-card"),m=l("el-carousel-item"),_=l("el-carousel"),t=l("el-table-column"),i=l("el-table");return s(),d("div",w,[e(o,{shadow:"hover",header:"滚动通知栏:默认"},{default:a(()=>[e(c(n),{text:`🎉🎉🔥基于vue3.x 、Typescript、vite、Element plus等,适配手机、平板、pc
- 的后台开源免费模板库(vue2.x请切换vue-prev-admin分支),仓库地址:https://gitee.com/lyt-top/vue-next-admin`})]),_:1}),e(o,{shadow:"hover",header:"滚动通知栏:设置样式",class:"mt15"},{default:a(()=>[e(c(n),{text:`🎉🎉🔥基于vue3.x 、Typescript、vite、Element plus等,适配手机、平板、pc
- 的后台开源免费模板库(vue2.x请切换vue-prev-admin分支),仓库地址:https://gitee.com/lyt-top/vue-next-admin`,leftIcon:"iconfont icon-tongzhi2",rightIcon:"ele-ArrowRight",background:"#ecf5ff",color:"#409eff"})]),_:1}),e(o,{shadow:"hover",header:"滚动通知栏:搭配 NoticeBar 和 Carousel 走马灯 组件可以实现垂直滚动的效果",class:"mt15"},{default:a(()=>[e(c(n),{scrollable:!0},{default:a(()=>[e(_,{height:"40px",direction:"vertical",autoplay:!0,"indicator-position":"none",interval:3e3},{default:a(()=>[(s(!0),d(v,null,b(r.noticeList,p=>(s(),g(m,{key:p},{default:a(()=>[x(y(p),1)]),_:2},1024))),128))]),_:1})]),_:1})]),_:1}),e(o,{shadow:"hover",header:"滚动通知栏:参数",class:"mt15"},{default:a(()=>[e(i,{data:r.tableData,style:{width:"100%"}},{default:a(()=>[e(t,{prop:"a1",label:"参数"}),e(t,{prop:"a2",label:"说明"}),e(t,{prop:"a3",label:"类型"}),e(t,{prop:"a4",label:"可选值"}),e(t,{prop:"a5",label:"默认值"})]),_:1},8,["data"])]),_:1}),e(o,{shadow:"hover",header:"图标选择器(宽度自动):事件",class:"mt15"},{default:a(()=>[e(i,{data:r.tableData1,style:{width:"100%"}},{default:a(()=>[e(t,{prop:"a1",label:"事件名称"}),e(t,{prop:"a2",label:"说明"}),e(t,{prop:"a3",label:"类型"}),e(t,{prop:"a4",label:"回调参数"})]),_:1},8,["data"])]),_:1})])}}});export{N as default};
- //# sourceMappingURL=index.7b3cc9c5.js.map
|