1 |
- import{f as x,c as K,a as R}from"./entry/index-DShbtsWl.js";import{aa as z,ag as k,b8 as N,Q as V,a1 as q,a0 as D,aV as M,bC as A,aJ as E}from"./antd-BmrhB3rb.js";import{d as B,f as S,c as C,u as a,w as I,Z as s,a8 as g,a9 as i,_ as p,aa as P,k as n,$ as _,G as T,a0 as m,ab as j,F as O,a1 as F}from"./vue-BjERyvPm.js";const w=[{key:"1",name:"通知",list:[{id:"000000001",avatar:"https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png",title:"你收到了 14 份新周报",description:"",datetime:"2017-08-09",type:"1"},{id:"000000002",avatar:"https://gw.alipayobjects.com/zos/rmsportal/OKJXDXrmkNshAMvwtvhu.png",title:"你推荐的 曲妮妮 已通过第三轮面试",description:"",datetime:"2017-08-08",type:"1"},{id:"000000003",avatar:"https://gw.alipayobjects.com/zos/rmsportal/kISTdvpyTAhtGxpovNWd.png",title:"这种模板可以区分多种通知类型",description:"",datetime:"2017-08-07",type:"1"},{id:"000000004",avatar:"https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png",title:"左侧图标用于区分不同的类型",description:"",datetime:"2017-08-07",type:"1"},{id:"000000005",avatar:"https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png",title:"标题可以设置自动显示省略号,本例中标题行数已设为1行,如果内容超过1行将自动截断并支持tooltip显示完整标题。",description:"",datetime:"2017-08-07",type:"1"},{id:"000000006",avatar:"https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png",title:"左侧图标用于区分不同的类型",description:"",datetime:"2017-08-07",type:"1"},{id:"000000007",avatar:"https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png",title:"左侧图标用于区分不同的类型",description:"",datetime:"2017-08-07",type:"1"},{id:"000000008",avatar:"https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png",title:"左侧图标用于区分不同的类型",description:"",datetime:"2017-08-07",type:"1"},{id:"000000009",avatar:"https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png",title:"左侧图标用于区分不同的类型",description:"",datetime:"2017-08-07",type:"1"},{id:"000000010",avatar:"https://gw.alipayobjects.com/zos/rmsportal/GvqBnKhFgObvnSGkDsje.png",title:"左侧图标用于区分不同的类型",description:"",datetime:"2017-08-07",type:"1"}]},{key:"2",name:"消息",list:[{id:"000000006",avatar:"https://gw.alipayobjects.com/zos/rmsportal/fcHMVNCjPOsbUGdEduuv.jpeg",title:"曲丽丽 评论了你",description:"描述信息描述信息描述信息",datetime:"2017-08-07",type:"2",clickClose:!0},{id:"000000007",avatar:"https://gw.alipayobjects.com/zos/rmsportal/fcHMVNCjPOsbUGdEduuv.jpeg",title:"朱偏右 回复了你",description:"这种模板用于提醒谁与你发生了互动",datetime:"2017-08-07",type:"2",clickClose:!0},{id:"000000008",avatar:"https://gw.alipayobjects.com/zos/rmsportal/fcHMVNCjPOsbUGdEduuv.jpeg",title:"标题",description:"请将鼠标移动到此处,以便测试超长的消息在此处将如何处理。本例中设置的描述最大行数为2,超过2行的描述内容将被省略并且可以通过tooltip查看完整内容",datetime:"2017-08-07",type:"2",clickClose:!0}]},{key:"3",name:"待办",list:[{id:"000000009",avatar:"",title:"任务名称",description:"任务需要在 2017-01-12 20:00 前启动",datetime:"",extra:"未开始",color:"",type:"3"},{id:"000000010",avatar:"",title:"第三方紧急代码变更",description:"冠霖 需在 2017-01-07 前完成代码变更任务",datetime:"",extra:"马上到期",color:"red",type:"3"},{id:"000000011",avatar:"",title:"信息安全考试",description:"指派竹尔于 2017-01-09 前完成更新并发布",datetime:"",extra:"已耗时 8 天",color:"gold",type:"3"},{id:"000000012",avatar:"",title:"ABCD 版本发布",description:"指派竹尔于 2017-01-09 前完成更新并发布",datetime:"",extra:"进行中",color:"blue",type:"3"}]}],L={class:"title"},$={key:0,class:"extra"},X={key:1},H={key:0,class:"description"},U={class:"datetime"},J=B({__name:"NoticeList",props:{list:{type:Array,default:()=>[]},pageSize:{type:[Boolean,Number],default:5},currentPage:{type:Number,default:1},titleRows:{type:Number,default:1},descRows:{type:Number,default:2},onTitleClick:{type:Function}},emits:["update:currentPage"],setup(o,{emit:v}){const r=o,y=v,{prefixCls:h}=x("header-notify-list"),c=S(r.currentPage||1),f=C(()=>{const{pageSize:e,list:u}=r;if(e===!1)return[];let t=z(e)?e:5;return u.slice(t*(a(c)-1),t*a(c))});I(()=>r.currentPage,e=>{c.value=e});const l=C(()=>{const{list:e,pageSize:u}=r,t=z(u)?u:Number(u)&&5;return t>0&&e&&e.length>t?{total:e.length,pageSize:t,current:a(c),onChange(b){c.value=b,y("update:currentPage",b)}}:!1});function d(e){r.onTitleClick&&r.onTitleClick(e)}return(e,u)=>(s(),g(a(k),{class:F(a(h)),bordered:"",pagination:l.value},{default:i(()=>[(s(!0),p(O,null,P(f.value,t=>(s(),g(a(k).Item,{key:t.id,class:"list-item"},{default:i(()=>[n(a(k).Item.Meta,null,{title:i(()=>[_("div",L,[n(a(N).Paragraph,{onClick:b=>d(t),delete:!!t.titleDelete,ellipsis:o.titleRows&&o.titleRows>0?{rows:o.titleRows,tooltip:!!t.title}:!1,content:t.title},null,8,["onClick","delete","ellipsis","content"]),t.extra?(s(),p("div",$,[n(a(V),{class:"tag",color:t.color},{default:i(()=>[T(m(t.extra),1)]),_:2},1032,["color"])])):j("",!0)])]),avatar:i(()=>[t.avatar?(s(),g(a(q),{key:0,class:"avatar",src:t.avatar},null,8,["src"])):(s(),p("span",X,m(t.avatar),1))]),description:i(()=>[_("div",null,[t.description?(s(),p("div",H,[n(a(N).Paragraph,{ellipsis:o.descRows&&o.descRows>0?{rows:o.descRows,tooltip:!!t.description}:!1,content:t.description},null,8,["ellipsis","content"])])):j("",!0),_("div",U,m(t.datetime),1)])]),_:2},1024)]),_:2},1024))),128))]),_:1},8,["class","pagination"]))}}),G=K(J,[["__scopeId","data-v-cff26da6"]]),Z={key:0},tt=B({__name:"index",setup(o){const{prefixCls:v}=x("header-notify"),{createMessage:r}=R(),y=S(w),h={},c=C(()=>{let l=0;for(let d=0;d<w.length;d++)l+=w[d].list.length;return l});function f(l){r.success("你点击了通知,ID="+l.id),l.titleDelete=!l.titleDelete}return(l,d)=>(s(),p("div",{class:F(a(v))},[n(a(E),{title:"",trigger:"click",overlayClassName:`${a(v)}__overlay`},{content:i(()=>[n(a(D),null,{default:i(()=>[(s(!0),p(O,null,P(y.value,e=>(s(),g(a(D).TabPane,{key:e.key},{tab:i(()=>[T(m(e.name)+" ",1),e.list.length!==0?(s(),p("span",Z,"("+m(e.list.length)+")",1)):j("",!0)]),default:i(()=>[e.key==="1"?(s(),g(G,{key:0,list:e.list,onTitleClick:f},null,8,["list"])):(s(),g(G,{key:1,list:e.list},null,8,["list"]))]),_:2},1024))),128))]),_:1})]),default:i(()=>[n(a(M),{count:c.value,dot:"",numberStyle:h},{default:i(()=>[n(a(A))]),_:1},8,["count"])]),_:1},8,["overlayClassName"])],2))}});export{tt as default};
|