@chewel611/naive-ui-plus 0.0.1 → 0.0.2

package/lib/table/PTable.vue.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("naive-ui"),e=require("vue"),N=require("@vicons/antd"),te={id:"data-content"},oe={key:0,class:"rounded-lg bg-gray-50 flex flex-row gap-2 items-center justify-end p-5 mb-5"},le={key:1},ne={key:2},ae=e.defineComponent({__name:"PTable",props:{idField:{default:"id"},item:{},columns:{},modalWidth:{default:800},hiddenAdd:{type:Boolean,default:!1},hiddenEdit:{type:Boolean,default:!1},hiddenDelete:{type:Boolean,default:!1},onLoad:{},onGet:{},onOpenModal:{},onCloseModal:{},onSave:{},onDelete:{}},setup(R,{expose:$}){const S=e.ref(null),z=r.useDialog(),p=r.useMessage(),m=e.ref(!1),v=e.ref([]),w=e.ref([]),b=e.ref(null),u=e.ref(!1),h=e.ref(!1),y=e.ref(!1),c=e.ref({page:1,itemCount:0,pageSize:10,pageSizes:[10,20,30,50],showSizePicker:!0,onChange:async t=>{c.value.page=t,await f()},onUpdatePageSize:async t=>{c.value.pageSize=t,await f()}}),l=R,L=t=>{const o=n=>{const a=[];return t&&t.forEach(i=>{i.key!=="edit"&&i.key!=="delete"&&a.push({label:i.name,key:i.key,props:{onClick:()=>i.action(n)}})}),a};return{title:"操作",key:"actions",width:100,fixed:"left",render:n=>{let a=[];if(l.hiddenEdit||a.push({label:"编辑",key:"edit",props:{onClick:()=>q(n)}}),l.hiddenDelete||a.push({label:"删除",key:"delete",props:{onClick:()=>I(n)}}),a=[...a,...o(n)],!(a.length<=0))return e.h(r.NDropdown,{options:a,placement:"bottom-start"},{default:()=>e.h(r.NButton,{size:"small",type:"primary"},{default:()=>["操作",e.h(r.NIcon,()=>e.h(N.MoreOutlined))]})})}}},H=e.computed(()=>{const t=l.columns.filter(n=>n.key!="action").map(n=>({title:n.title,key:n.key,width:n.width,render:n.render,ellipsis:n.ellipsis?{tooltip:!0}:!1})),o=l.columns.reduce((n,a)=>a.key==="action"?a:n,void 0)?.action;return o&&o?.length>0||!l.hiddenDelete||!l.hiddenEdit?[{type:"selection",fixed:"left"},...t,L(o)]:[{type:"selection",fixed:"left"},...t]}),M=async()=>{await f()},I=t=>{E([t])},F=()=>{const t=V();E(t)},E=t=>{t&&t.length>0&&z.warning({title:"警告",content:"删除数据不可恢复, 确认删除吗?",positiveText:"确定",negativeText:"取消",onPositiveClick:async()=>{if(l.onDelete)try{await l.onDelete(t)?(f(),p.success("删除成功")):p.error("删除失败")}catch(o){console.error(o),p.error("删除异常,详情F12请查看控制台日志")}}})},P=()=>{if(l.onOpenModal){l.onOpenModal();return}h.value=!1,u.value=!0},q=async t=>{if(l.onOpenModal){l.onOpenModal(t);return}l.onGet&&(t=await l.onGet(t[l.idField])),b.value=t,Object.assign(l.item,t),u.value=!1,h.value=!0},O=async()=>{if(l.onSave)try{y.value=!0,(u.value?await l.onSave():await l.onSave(b.value[l.idField]))&&(k(),await f())}catch(t){console.error(t),p.error("操作失败, 详情F12请查看控制台日志")}finally{y.value=!1}},k=()=>{l.onCloseModal&&l.onCloseModal(),Object.keys(l.item).forEach(t=>l.item[t]=void 0),b.value=null,u.value=!1,h.value=!1},V=()=>v.value?w.value.filter(o=>v.value.includes(o.id)).map(o=>e.toRaw(o)):[],W=()=>V()[0],A=()=>e.toRaw(w.value),f=async()=>{if(!m.value){m.value=!0;try{if(l.onLoad){var{data:t,total:o}=await l.onLoad(c.value.page,c.value.pageSize);w.value=t,c.value.itemCount=o}}catch(n){console.error(n),p.error("获取数据失败, 详情F12请查看控制台日志")}finally{m.value=!1}}},U=e.computed(()=>{const t=e.unref(S);if(!t)return;const o=t?.$el,n=o.querySelector(".n-data-table-thead "),{bottomIncludeBody:a}=G(n),i=64;let d=2,s=24;const g=o.querySelector(".n-data-table__pagination");if(g){const _=g.offsetHeight;d+=_||0}else d+=28;let C=a-(i+d+s);return console.log("height",C),C}),j=t=>!t||!t.getBoundingClientRect?0:t.getBoundingClientRect(),G=t=>{const o=document.documentElement,n=o.scrollLeft,a=o.scrollTop,i=o.clientLeft,d=o.clientTop,s=window.pageXOffset,g=window.pageYOffset,C=j(t),{left:_,top:K,width:X,height:Y}=C,J=(s||n)-(i||0),Q=(g||a)-(d||0),Z=_+s,ee=K+g,x=Z-J,B=ee-Q,T=window.document.documentElement.clientWidth,D=window.document.documentElement.clientHeight;return{left:x,top:B,right:T-X-x,bottom:D-Y-B,rightIncludeBody:T-x,bottomIncludeBody:D-B}};return e.onMounted(async()=>await M()),$({getData:A,getSelectedRow:W,getSelectedRows:V,closeModal:k,refreshData:f,resetPage:()=>{c.value.page=1}}),(t,o)=>{const n=r.NTooltip,a=r.NDataTable,i=r.NSpace,d=r.NModal;return e.openBlock(),e.createBlock(e.unref(r.NCard),{title:" ","header-class":"p-4","content-class":"pl-4 pr-4",bordered:!1},{"header-extra":e.withCtx(()=>[t.hiddenAdd?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(n,{key:0,trigger:"hover"},{trigger:e.withCtx(()=>[e.createVNode(e.unref(r.NIcon),{size:"18",class:"mr-1 cursor-pointer hover:text-blue-600",onClick:P},{default:e.withCtx(()=>[e.createVNode(e.unref(N.PlusSquareOutlined))]),_:1})]),default:e.withCtx(()=>[o[3]||(o[3]=e.createElementVNode("span",null,"新增",-1))]),_:1,__:[3]})),t.hiddenDelete?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(n,{key:1,trigger:"hover"},{trigger:e.withCtx(()=>[e.createVNode(e.unref(r.NIcon),{size:"18",class:"mr-1 cursor-pointer hover:text-blue-600",onClick:F},{default:e.withCtx(()=>[e.createVNode(e.unref(N.DeleteOutlined))]),_:1})]),default:e.withCtx(()=>[o[4]||(o[4]=e.createElementVNode("span",null,"删除",-1))]),_:1,__:[4]})),e.createVNode(n,{trigger:"hover"},{trigger:e.withCtx(()=>[e.createVNode(e.unref(r.NIcon),{size:"18",class:"cursor-pointer hover:text-blue-600",onClick:M},{default:e.withCtx(()=>[e.createVNode(e.unref(N.ReloadOutlined))]),_:1})]),default:e.withCtx(()=>[o[5]||(o[5]=e.createElementVNode("span",null,"刷新",-1))]),_:1,__:[5]})]),default:e.withCtx(()=>[e.createElementVNode("div",te,[t.$slots.toolbar?(e.openBlock(),e.createElementBlock("div",oe,[e.renderSlot(t.$slots,"toolbar")])):e.createCommentVNode("",!0),e.createVNode(a,{remote:"",ref_key:"$table",ref:S,"checked-row-keys":v.value,"onUpdate:checkedRowKeys":o[0]||(o[0]=s=>v.value=s),"max-height":U.value,loading:m.value,bordered:!1,"single-line":!1,columns:H.value,data:w.value,pagination:c.value,"row-key":s=>s[t.idField]},null,8,["checked-row-keys","max-height","loading","columns","data","pagination","row-key"]),t.$slots.addModal?(e.openBlock(),e.createElementBlock("div",le,[e.createVNode(d,{title:"新增",preset:"dialog",show:u.value,"onUpdate:show":o[1]||(o[1]=s=>u.value=s),closable:!1,"close-on-esc":!1,"mask-closable":!1,style:e.normalizeStyle({width:`${t.modalWidth}px`})},{action:e.withCtx(()=>[e.createVNode(i,null,{default:e.withCtx(()=>[e.createVNode(e.unref(r.NButton),{type:"primary",loading:y.value,onClick:O},{default:e.withCtx(()=>o[6]||(o[6]=[e.createTextVNode("保存",-1)])),_:1,__:[6]},8,["loading"]),e.createVNode(e.unref(r.NButton),{onClick:k},{default:e.withCtx(()=>o[7]||(o[7]=[e.createTextVNode("取消",-1)])),_:1,__:[7]})]),_:1})]),default:e.withCtx(()=>[e.renderSlot(t.$slots,"addModal")]),_:3},8,["show","style"])])):e.createCommentVNode("",!0),t.$slots.editModal?(e.openBlock(),e.createElementBlock("div",ne,[e.createVNode(d,{title:"编辑",show:h.value,"onUpdate:show":o[2]||(o[2]=s=>h.value=s),preset:"dialog",closable:!1,"close-on-esc":!1,"mask-closable":!1,style:e.normalizeStyle({width:`${t.modalWidth}px`})},{action:e.withCtx(()=>[e.createVNode(i,null,{default:e.withCtx(()=>[e.createVNode(e.unref(r.NButton),{type:"primary",loading:y.value,onClick:O},{default:e.withCtx(()=>o[8]||(o[8]=[e.createTextVNode("保存",-1)])),_:1,__:[8]},8,["loading"]),e.createVNode(e.unref(r.NButton),{onClick:k},{default:e.withCtx(()=>o[9]||(o[9]=[e.createTextVNode("取消",-1)])),_:1,__:[9]})]),_:1})]),default:e.withCtx(()=>[e.renderSlot(t.$slots,"editModal")]),_:3},8,["show","style"])])):e.createCommentVNode("",!0)])]),_:3})}}});exports.default=ae;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("naive-ui"),e=require("vue"),N=require("@vicons/antd"),te={id:"data-content"},oe={key:0,class:"rounded-lg bg-gray-50 flex flex-row gap-2 items-center justify-end p-5 mb-5"},le={key:1},ne={key:2},ae=e.defineComponent({__name:"PTable",props:{idField:{default:"id"},item:{},columns:{},modalWidth:{default:800},hiddenAdd:{type:Boolean,default:!1},hiddenEdit:{type:Boolean,default:!1},hiddenDelete:{type:Boolean,default:!1},onLoad:{},onGet:{},onOpenModal:{},onCloseModal:{},onSave:{},onDelete:{}},setup(R,{expose:$}){const S=e.ref(null),z=i.useDialog(),p=i.useMessage(),m=e.ref(!1),v=e.ref([]),w=e.ref([]),b=e.ref(null),u=e.ref(!1),h=e.ref(!1),y=e.ref(!1),c=e.ref({page:1,itemCount:0,pageSize:10,pageSizes:[10,20,30,50],showSizePicker:!0,onChange:async t=>{c.value.page=t,await f()},onUpdatePageSize:async t=>{c.value.pageSize=t,await f()}}),l=R,L=t=>{const o=n=>{const a=[];return t&&t.forEach(s=>{s.key!=="edit"&&s.key!=="delete"&&a.push({label:s.name,key:s.key,props:{onClick:()=>s.action(n)}})}),a};return{title:"操作",key:"actions",width:100,fixed:"right",render:n=>{let a=[];if(l.hiddenEdit||a.push({label:"编辑",key:"edit",props:{onClick:()=>W(n)}}),l.hiddenDelete||a.push({label:"删除",key:"delete",props:{onClick:()=>I(n)}}),a=[...a,...o(n)],!(a.length<=0))return e.h(i.NDropdown,{options:a,placement:"bottom-start"},{default:()=>e.h(i.NButton,{size:"small",type:"primary"},{default:()=>["操作",e.h(i.NIcon,()=>e.h(N.MoreOutlined))]})})}}},H=e.computed(()=>{const t=l.columns.filter(n=>n.key!="action").map(n=>({title:n.title,key:n.key,width:n.width,fixed:n.fixed??!1,render:n.render,ellipsis:n.ellipsis?{tooltip:!0}:!1})),o=l.columns.reduce((n,a)=>a.key==="action"?a:n,void 0)?.action;return o&&o?.length>0||!l.hiddenDelete||!l.hiddenEdit?[{type:"selection",fixed:"left"},...t,L(o)]:[{type:"selection",fixed:"left"},...t]}),M=async()=>{await f()},I=t=>{E([t])},P=()=>{const t=x();E(t)},E=t=>{t&&t.length>0&&z.warning({title:"警告",content:"删除数据不可恢复, 确认删除吗?",positiveText:"确定",negativeText:"取消",onPositiveClick:async()=>{if(l.onDelete)try{await l.onDelete(t)?(f(),p.success("删除成功")):p.error("删除失败")}catch(o){p.error(o.message)}}})},q=()=>{if(l.onOpenModal){l.onOpenModal();return}h.value=!1,u.value=!0},W=async t=>{if(l.onOpenModal){l.onOpenModal(t);return}l.onGet&&(t=await l.onGet(t[l.idField])),b.value=t,Object.assign(l.item,t),u.value=!1,h.value=!0},O=async()=>{if(l.onSave)try{y.value=!0,(u.value?await l.onSave():await l.onSave(b.value[l.idField]))&&(k(),await f())}catch(t){p.error(t.message)}finally{y.value=!1}},k=()=>{l.onCloseModal&&l.onCloseModal(),Object.keys(l.item).forEach(t=>l.item[t]=void 0),b.value=null,u.value=!1,h.value=!1},x=()=>v.value?w.value.filter(o=>v.value.includes(o.id)).map(o=>e.toRaw(o)):[],A=()=>x()[0],U=()=>e.toRaw(w.value),f=async()=>{if(!m.value){m.value=!0;try{if(l.onLoad){var{data:t,total:o}=await l.onLoad(c.value.page,c.value.pageSize);w.value=t,c.value.itemCount=o}}catch(n){p.error(n.message)}finally{m.value=!1}}},j=e.computed(()=>{const t=e.unref(S);if(!t)return;const o=t?.$el,n=o.querySelector(".n-data-table-thead "),{bottomIncludeBody:a}=G(n),s=64;let d=2,r=24;const g=o.querySelector(".n-data-table__pagination");if(g){const V=g.offsetHeight;d+=V||0}else d+=28;let C=a-(s+d+r);return console.log("height",C),C}),F=t=>!t||!t.getBoundingClientRect?0:t.getBoundingClientRect(),G=t=>{const o=document.documentElement,n=o.scrollLeft,a=o.scrollTop,s=o.clientLeft,d=o.clientTop,r=window.pageXOffset,g=window.pageYOffset,C=F(t),{left:V,top:K,width:X,height:Y}=C,J=(r||n)-(s||0),Q=(g||a)-(d||0),Z=V+r,ee=K+g,_=Z-J,B=ee-Q,T=window.document.documentElement.clientWidth,D=window.document.documentElement.clientHeight;return{left:_,top:B,right:T-X-_,bottom:D-Y-B,rightIncludeBody:T-_,bottomIncludeBody:D-B}};return e.onMounted(async()=>await M()),$({getData:U,getSelectedRow:A,getSelectedRows:x,closeModal:k,refreshData:f,resetPage:()=>{c.value.page=1}}),(t,o)=>{const n=i.NTooltip,a=i.NDataTable,s=i.NSpace,d=i.NModal;return e.openBlock(),e.createBlock(e.unref(i.NCard),{title:" ","header-class":"p-4","content-class":"pl-4 pr-4",bordered:!1},{"header-extra":e.withCtx(()=>[t.hiddenAdd?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(n,{key:0,trigger:"hover"},{trigger:e.withCtx(()=>[e.createVNode(e.unref(i.NIcon),{size:"18",class:"mr-1 cursor-pointer hover:text-blue-600",onClick:q},{default:e.withCtx(()=>[e.createVNode(e.unref(N.PlusSquareOutlined))]),_:1})]),default:e.withCtx(()=>[o[3]||(o[3]=e.createElementVNode("span",null,"新增",-1))]),_:1,__:[3]})),t.hiddenDelete?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(n,{key:1,trigger:"hover"},{trigger:e.withCtx(()=>[e.createVNode(e.unref(i.NIcon),{size:"18",class:"mr-1 cursor-pointer hover:text-blue-600",onClick:P},{default:e.withCtx(()=>[e.createVNode(e.unref(N.DeleteOutlined))]),_:1})]),default:e.withCtx(()=>[o[4]||(o[4]=e.createElementVNode("span",null,"删除",-1))]),_:1,__:[4]})),e.createVNode(n,{trigger:"hover"},{trigger:e.withCtx(()=>[e.createVNode(e.unref(i.NIcon),{size:"18",class:"cursor-pointer hover:text-blue-600",onClick:M},{default:e.withCtx(()=>[e.createVNode(e.unref(N.ReloadOutlined))]),_:1})]),default:e.withCtx(()=>[o[5]||(o[5]=e.createElementVNode("span",null,"刷新",-1))]),_:1,__:[5]})]),default:e.withCtx(()=>[e.createElementVNode("div",te,[t.$slots.toolbar?(e.openBlock(),e.createElementBlock("div",oe,[e.renderSlot(t.$slots,"toolbar")])):e.createCommentVNode("",!0),e.createVNode(a,{remote:"",ref_key:"$table",ref:S,"checked-row-keys":v.value,"onUpdate:checkedRowKeys":o[0]||(o[0]=r=>v.value=r),"max-height":j.value,loading:m.value,bordered:!1,"single-line":!1,columns:H.value,data:w.value,pagination:c.value,"row-key":r=>r[t.idField]},null,8,["checked-row-keys","max-height","loading","columns","data","pagination","row-key"]),t.$slots.addModal?(e.openBlock(),e.createElementBlock("div",le,[e.createVNode(d,{title:"新增",preset:"dialog",show:u.value,"onUpdate:show":o[1]||(o[1]=r=>u.value=r),closable:!1,"close-on-esc":!1,"mask-closable":!1,style:e.normalizeStyle({width:`${t.modalWidth}px`})},{action:e.withCtx(()=>[e.createVNode(s,null,{default:e.withCtx(()=>[e.createVNode(e.unref(i.NButton),{type:"primary",loading:y.value,onClick:O},{default:e.withCtx(()=>o[6]||(o[6]=[e.createTextVNode("保存",-1)])),_:1,__:[6]},8,["loading"]),e.createVNode(e.unref(i.NButton),{onClick:k},{default:e.withCtx(()=>o[7]||(o[7]=[e.createTextVNode("取消",-1)])),_:1,__:[7]})]),_:1})]),default:e.withCtx(()=>[e.renderSlot(t.$slots,"addModal")]),_:3},8,["show","style"])])):e.createCommentVNode("",!0),t.$slots.editModal?(e.openBlock(),e.createElementBlock("div",ne,[e.createVNode(d,{title:"编辑",show:h.value,"onUpdate:show":o[2]||(o[2]=r=>h.value=r),preset:"dialog",closable:!1,"close-on-esc":!1,"mask-closable":!1,style:e.normalizeStyle({width:`${t.modalWidth}px`})},{action:e.withCtx(()=>[e.createVNode(s,null,{default:e.withCtx(()=>[e.createVNode(e.unref(i.NButton),{type:"primary",loading:y.value,onClick:O},{default:e.withCtx(()=>o[8]||(o[8]=[e.createTextVNode("保存",-1)])),_:1,__:[8]},8,["loading"]),e.createVNode(e.unref(i.NButton),{onClick:k},{default:e.withCtx(()=>o[9]||(o[9]=[e.createTextVNode("取消",-1)])),_:1,__:[9]})]),_:1})]),default:e.withCtx(()=>[e.renderSlot(t.$slots,"editModal")]),_:3},8,["show","style"])])):e.createCommentVNode("",!0)])]),_:3})}}});exports.default=ae;

package/lib/table/typing.d.ts

@@ -9,6 +9,7 @@ export interface DataTableColumnDefine {
     title: string;
     key: string;
     width?: number;
+    fixed?: string;
     ellipsis?: boolean;
     action?: DataTableColumnActionDefine[];
     render?: (data: any, index: number) => VNodeChild;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@chewel611/naive-ui-plus",
   "private": false,
-  "version": "0.0.1",
+  "version": "0.0.2",
   "license": "MIT",
   "type": "module",
   "sideEffects": false,
@@ -39,7 +39,7 @@
     "vue-router": "^4.5.1"
   },
   "dependencies": {
-    "@chewel/naive-ui-plus": "^0.0.64",
+    "@chewel611/naive-ui-plus": "^0.0.1",
     "@vicons/antd": "^0.13.0",
     "element-resize-detector": "^1.2.4",
     "i18n-jsautotranslate": "^3.18.98",