| 1 |
- import{j as x,_ as R,a as q}from"./entry/index-C7JiT1GB.js";import{ab as z,ah as k,bj as N,Q as K,a4 as M,aq as V,aY as D,aB as A,bR as E}from"./antd-FjOLgRLC.js";import{d as B,f as S,c as w,u as a,w as I,Z as s,a7 as g,a8 as i,_ as p,aa as P,k as n,$ as _,G as T,a0 as m,ab as C,F as O,a1 as F}from"./vue-ByATgq5d.js";const j=[{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"},Y=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),b=w(()=>{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=w(()=>{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(f){c.value=f,y("update:currentPage",f)}}:!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(b.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:f=>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(K),{class:"tag",color:t.color},{default:i(()=>[T(m(t.extra),1)]),_:2},1032,["color"])])):C("",!0)])]),avatar:i(()=>[t.avatar?(s(),g(a(M),{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"])])):C("",!0),_("div",U,m(t.datetime),1)])]),_:2},1024)]),_:2},1024))),128))]),_:1},8,["class","pagination"]))}}),G=R(Y,[["__scopeId","data-v-cff26da6"]]),Z={key:0},tt=B({__name:"index",setup(o){const{prefixCls:v}=x("header-notify"),{createMessage:r}=q(),y=S(j),h={},c=w(()=>{let l=0;for(let d=0;d<j.length;d++)l+=j[d].list.length;return l});function b(l){r.success("你点击了通知，ID="+l.id),l.titleDelete=!l.titleDelete}return(l,d)=>(s(),p("div",{class:F(a(v))},[n(a(V),{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)):C("",!0)]),default:i(()=>[e.key==="1"?(s(),g(G,{key:0,list:e.list,onTitleClick:b},null,8,["list"])):(s(),g(G,{key:1,list:e.list},null,8,["list"]))]),_:2},1024))),128))]),_:1})]),default:i(()=>[n(a(A),{count:c.value,dot:"",numberStyle:h},{default:i(()=>[n(a(E))]),_:1},8,["count"])]),_:1},8,["overlayClassName"])],2))}});export{tt as default};
|
