cc-element-components
Version:
该项目是基于`element-plus`二次封装组件,使用的技术栈为`vue3` + `typescript` + `element-plus`。在此项目当中,我们会基于`element-plus`的组件库已有组件封装如下组件: - 图标选择器 - 时间选择器 - 城市选择器 - 省市区选择器 - 通知菜单 - 趋势标记 - 评论 - 数据列表 - 数值统计 - 倒计时 - 分割面板 - 时间轴 - 弹框拓展 - 进度条拓展 - 导航菜单拓展 - 可配置项表格 - 可配置项表单 - 日历
2 lines (1 loc) • 1.79 kB
JavaScript
(function(e,a){typeof exports=="object"&&typeof module!="undefined"?module.exports=a(require("vue")):typeof define=="function"&&define.amd?define(["vue"],a):(e=typeof globalThis!="undefined"?globalThis:e||self,e.index=a(e.Vue))})(this,function(e){"use strict";var a="",r=(n,t)=>{for(const[l,o]of t)n[l]=o;return n};const f={class:"cc-avatar-list"};var d=r(e.defineComponent({props:{list:null,theme:{default:"dark"},size:{default:"large"},shape:{default:"circle"},max:{default:1/0}},setup(n){const t=n,l=e.ref(t.list),o=e.computed(()=>t.max!==1/0?t.list.length-t.max:0);return e.onMounted(()=>{t.max!==1/0&&(l.value=t.list.slice(0,t.max))}),e.watch(()=>t.list,i=>{l.value=i,t.max!==1/0&&(l.value=i.slice(0,t.max))},{deep:!0}),(i,x)=>{const p=e.resolveComponent("el-avatar"),_=e.resolveComponent("el-tooltip"),y=e.resolveComponent("el-button");return e.openBlock(),e.createElementBlock("div",f,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.value,(c,s)=>(e.openBlock(),e.createBlock(_,{key:s,effect:n.theme,content:c.title,placement:"top"},{default:e.withCtx(()=>[e.createVNode(p,{class:e.normalizeClass(["cc-avatar-list-item",{"cc-avatar-list-item-left":s>0}]),style:e.normalizeStyle({left:-s*15+"px"}),src:c.src,size:n.size,shape:n.shape},null,8,["class","style","src","size","shape"])]),_:2},1032,["effect","content"]))),128)),n.max!==1/0?(e.openBlock(),e.createBlock(y,{key:0,type:"warning",circle:"",size:n.size,style:e.normalizeStyle([{position:"relative",cursor:"default"},{left:-(t.list.length-e.unref(o))*15+"px"}])},{default:e.withCtx(()=>[e.createTextVNode("+"+e.toDisplayString(e.unref(o)),1)]),_:1},8,["size","style"])):e.createCommentVNode("v-if",!0)])}}}),[["__scopeId","data-v-761256d9"]]),m={install(n){n.component("cc-avatar-list",d)}};return m});