@gct-paas/v-ben 0.1.6-dev.13 → 0.1.6-dev.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.min.css +1 -1
- package/dist/loader.esm.min.js +2 -2
- package/es/components/v-ben-button/src/PopConfirmButton.vue_vue_type_script_lang.mjs +1 -1
- package/es/components/v-ben-table/index.d.ts +1 -0
- package/es/components/v-ben-table/src/BasicTable.vue.d.ts +26 -21
- package/es/components/v-ben-table/src/BasicTable.vue.mjs +16 -19
- package/es/components/v-ben-table/src/BasicTable.vue_vue_type_script_lang.mjs +76 -12
- package/es/components/v-ben-table/src/BasicTable.vue_vue_type_style_index_0_lang.css +50 -0
- package/es/components/v-ben-table/src/components/TableAction.vue_vue_type_script_setup_true_lang.mjs +3 -9
- package/es/components/v-ben-table/src/components/TableAction.vue_vue_type_style_index_0_lang.css +1 -0
- package/es/components/v-ben-table/src/components/TableActionAuto.vue_vue_type_script_setup_true_lang.mjs +3 -9
- package/es/components/v-ben-table/src/components/TableActionAuto.vue_vue_type_style_index_0_lang.css +1 -0
- package/es/components/v-ben-table/src/const.d.ts +8 -0
- package/es/components/v-ben-table/src/const.mjs +14 -0
- package/es/components/v-ben-table/src/hooks/useColumns.d.ts +7 -0
- package/es/components/v-ben-table/src/hooks/useColumns.mjs +143 -0
- package/es/components/v-ben-table/src/hooks/usePagination.d.ts +10 -0
- package/es/components/v-ben-table/src/hooks/usePagination.mjs +63 -0
- package/es/components/v-ben-table/src/hooks/useTableScroll.d.ts +17 -0
- package/es/components/v-ben-table/src/hooks/useTableScroll.mjs +126 -0
- package/es/components/v-ben-table/src/props.d.ts +2 -0
- package/es/components/v-ben-table/src/props.mjs +39 -1
- package/es/components/v-ben-table/src/types/pagination.d.ts +1 -1
- package/es/components/v-ben-table/src/utils/dom-utils.d.ts +13 -0
- package/es/components/v-ben-table/src/utils/dom-utils.mjs +36 -0
- package/es/hooks/useDesign.mjs +10 -0
- package/package.json +5 -5
package/dist/index.min.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.vben-basic-table-action{align-items:center;display:flex}.vben-basic-table-action .action-divider{display:table}.vben-basic-table-action.left{justify-content:flex-start}.vben-basic-table-action.center{justify-content:center}.vben-basic-table-action.right{justify-content:flex-end}.vben-basic-table-action button{align-items:center;display:flex}.vben-basic-table-action button span{margin-left:0!important}.vben-basic-table-action button.ant-btn-circle span{margin:auto!important}.vben-basic-table-action .ant-divider,.vben-basic-table-action .ant-divider-vertical{margin:0 10px}.vben-basic-table-action .icon-more{transform:rotate(90deg)}.vben-basic-table-action .icon-more svg{font-size:1.1em;font-weight:700}.custom-btn-container[data-v-305f4090]{white-space:nowrap;text-align:center;cursor:pointer;user-select:none;touch-action:manipulation;color:#fff;border:1px solid #0000;border-color:var(--ant-primary-color);background-image:none;background:var(--ant-primary-color);text-shadow:0 -1px #0000001f;vertical-align:top;border-radius:4px;justify-content:center;align-items:center;height:32px;font-size:14px;font-weight:400;line-height:1.5715;transition:all .3s cubic-bezier(.645,.045,.355,1);display:inline-flex;position:relative;box-shadow:0 2px #0000000b}.custom-btn-container .btn-left[data-v-305f4090]{justify-content:center;align-items:center;height:32px;margin-right:1px;padding:4px 12px;display:flex}.custom-btn-container .btn-left-title[data-v-305f4090]{margin-left:4px;line-height:22px}.custom-btn-container .btn-left[data-v-305f4090]:hover{color:#fff;border-color:var(--ant-primary-color-hover);background:var(--ant-primary-color-hover)}.custom-btn-container .btn-right[data-v-305f4090]{justify-content:center;align-items:center;height:32px;margin-left:2px;padding:4px 12px;display:flex;position:relative}.custom-btn-container .btn-right[data-v-305f4090]:before{content:"";background-color:#fff;width:1px;height:14px;position:absolute;left:-2px}.custom-btn-container .btn-right[data-v-305f4090]:hover{color:#fff;border-color:var(--ant-primary-color-hover);background:var(--ant-primary-color-hover)}
|
|
1
|
+
.vben-basic-table{max-width:100%;height:100%}.vben-basic-table .ant-table-tbody>tr>td,.vben-basic-table .ant-table-thead>tr>td,.vben-basic-table .ant-table-tbody>tr>th,.vben-basic-table .ant-table-thead>tr>th{border-right:1px solid #0000!important}.vben-basic-table-form-container{padding:16px}.vben-basic-table-form-container .ant-form{border-radius:2px;width:100%;margin-bottom:16px;padding:12px 10px 6px}.vben-basic-table .ant-table-cell .ant-tag{margin-right:0}.vben-basic-table .ant-table-wrapper{border-radius:2px;padding:6px}.vben-basic-table .ant-table-wrapper .ant-table-title{padding:0 0 8px!important}.vben-basic-table .ant-table-wrapper .ant-table.ant-table-bordered .ant-table-title{border:none!important}.vben-basic-table .empty-basic-table-wrapper.ant-table-wrapper:has(div.ant-spin-nested-loading>div.ant-spin-container>div.ant-table-empty) .ant-spin-nested-loading>div.ant-spin-container>div.ant-table-empty>div.ant-table-container>div.ant-table-body{max-height:none!important}.vben-basic-table .ant-table{width:100%;overflow-x:hidden}.vben-basic-table .ant-pagination{margin:10px 0 0!important}.vben-basic-table--inset .ant-table-wrapper{padding:0}.ant-table-thead th{background-color:#f5f5f5}.vben-basic-table-action{align-items:center;display:flex}.vben-basic-table-action .action-divider{display:table}.vben-basic-table-action.left{justify-content:flex-start}.vben-basic-table-action.center{justify-content:center}.vben-basic-table-action.right{justify-content:flex-end}.vben-basic-table-action button{align-items:center;display:flex}.vben-basic-table-action button span{font-size:14px;margin-left:0!important}.vben-basic-table-action button.ant-btn-circle span{margin:auto!important}.vben-basic-table-action .ant-divider,.vben-basic-table-action .ant-divider-vertical{margin:0 10px}.vben-basic-table-action .icon-more{transform:rotate(90deg)}.vben-basic-table-action .icon-more svg{font-size:1.1em;font-weight:700}.custom-btn-container[data-v-305f4090]{white-space:nowrap;text-align:center;cursor:pointer;user-select:none;touch-action:manipulation;color:#fff;border:1px solid #0000;border-color:var(--ant-primary-color);background-image:none;background:var(--ant-primary-color);text-shadow:0 -1px #0000001f;vertical-align:top;border-radius:4px;justify-content:center;align-items:center;height:32px;font-size:14px;font-weight:400;line-height:1.5715;transition:all .3s cubic-bezier(.645,.045,.355,1);display:inline-flex;position:relative;box-shadow:0 2px #0000000b}.custom-btn-container .btn-left[data-v-305f4090]{justify-content:center;align-items:center;height:32px;margin-right:1px;padding:4px 12px;display:flex}.custom-btn-container .btn-left-title[data-v-305f4090]{margin-left:4px;line-height:22px}.custom-btn-container .btn-left[data-v-305f4090]:hover{color:#fff;border-color:var(--ant-primary-color-hover);background:var(--ant-primary-color-hover)}.custom-btn-container .btn-right[data-v-305f4090]{justify-content:center;align-items:center;height:32px;margin-left:2px;padding:4px 12px;display:flex;position:relative}.custom-btn-container .btn-right[data-v-305f4090]:before{content:"";background-color:#fff;width:1px;height:14px;position:absolute;left:-2px}.custom-btn-container .btn-right[data-v-305f4090]:hover{color:#fff;border-color:var(--ant-primary-color-hover);background:var(--ant-primary-color-hover)}
|
|
2
2
|
/*$vite$:1*/
|
package/dist/loader.esm.min.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
/*! @gct-paas/v-ben v0.1.6-dev.
|
|
2
|
-
import{cssLoader as e,permission as t,t as n,useNamespace as o}from"@gct-paas/core";import{Fragment as l,computed as a,createBlock as r,createCommentVNode as i,createElementBlock as u,createElementVNode as s,createSlots as c,createTextVNode as p,createVNode as d,defineComponent as f,guardReactiveProps as y,h as m,mergeProps as b,normalizeClass as v,normalizeProps as g,openBlock as h,ref as C,renderList as k,renderSlot as B,resolveComponent as x,toDisplayString as _,toRaw as w,unref as S,useAttrs as T,vShow as A,withCtx as $,withDirectives as D,withModifiers as O}from"vue";import{omit as F}from"lodash-es";import{MoreOutlined as P}from"@ant-design/icons-vue";import{Button as j,Divider as I,Dropdown as N,Menu as R,Popconfirm as K,Tooltip as z}from"ant-design-vue";var L=Object.prototype.toString;function E(e,t){return L.call(e)===`[object ${t}]`}function M(e){return void 0!==e}function H(e){return!M(e)}function U(e){return null!==e&&E(e,"Object")}function V(e){return ne(e)||Y(e)?0===e.length:e instanceof Map||e instanceof Set?0===e.size:!!U(e)&&0===Object.keys(e).length}function W(e){return E(e,"Date")}function q(e){return null===e}function G(e){return H(e)&&q(e)}function J(e){return H(e)||q(e)}function Q(e){return E(e,"Number")}function X(e){return E(e,"Promise")&&U(e)&&Z(e.then)&&Z(e.then)}function Y(e){return E(e,"String")}function Z(e){return"function"==typeof e}function ee(e){return E(e,"Boolean")}function te(e){return E(e,"RegExp")}function ne(e){return!!e&&Array.isArray(e)}function oe(e){return"undefined"!=typeof window&&E(e,"Window")}function le(e){return U(e)&&!!e.tagName}function ae(e){return E(e,"Map")}function re(e){return/^http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- ./?%&=]*)?/.test(e)}function ie(e){return void 0===e||!e&&0!==e&&"0"!==e||!/[^\s]/.test(e+"")}var ue=f({name:"TableHeaderCell",components:{},props:{column:{type:Object,default:()=>({})}},setup:e=>({getTitle:a(()=>{var t,n;return(null===(t=e.column)||void 0===t?void 0:t.customTitle)||(null===(n=e.column)||void 0===n?void 0:n.title)})})}),se=(e,t)=>{const n=e.__vccOpts||e;for(const[o,l]of t)n[o]=l;return n},ce=f({name:"BasicTable",components:{HeaderCell:/* @__PURE__ */se(ue,[["render",function(e,t,n,o,l,a){return h(),u("span",null,_(e.getTitle),1)}]])},props:{clickToRowSelect:{type:Boolean,default:!0},isTreeTable:Boolean,tableSetting:{type:Object,default:{}},inset:Boolean,showTableSetting:Boolean,autoCreateKey:{type:Boolean,default:!0},striped:{type:Boolean,default:!0},showSummary:Boolean,summaryFunc:{type:[Function,Array],default:null},summaryData:{type:Array,default:null},indentSize:{type:Number,default:24},canColDrag:{type:Boolean,default:!0},api:{type:Function,default:null},beforeFetch:{type:Function,default:null},afterFetch:{type:Function,default:null},handleSearchInfoFn:{type:Function,default:null},immediate:{type:Boolean,default:!0},emptyDataIsShowTable:{type:Boolean,default:!0},searchInfo:{type:Object,default:null},defSort:{type:Object,default:null},useSearchForm:Boolean,columns:{type:Array,default:()=>[]},showIndexColumn:{type:Boolean,default:!0},indexColumnProps:{type:Object,default:null},actionColumn:{type:Object,default:null},ellipsis:{type:Boolean,default:!0},isCanResizeParent:{type:Boolean,default:!1},canResize:{type:Boolean,default:!0},clearSelectOnPageChange:Boolean,resizeHeightOffset:{type:Number,default:0},rowSelection:{type:Object,default:null},title:{type:[String,Function],default:null},titleHelpMessage:{type:[String,Array]},maxHeight:Number,dataSource:{type:Array,default:null},rowKey:{type:[String,Function],default:""},bordered:Boolean,pagination:{type:[Object,Boolean],default:null},loading:Boolean,rowClassName:{type:Function},scroll:{type:Object,default:null},beforeEditSubmit:{type:Function},rowDraggable:{type:Boolean,default:!1},supportSameLevel:{type:Boolean,default:!1},rowDragApi:{type:Function,default:null},expandedRowKeys:{type:Array,default:()=>[]},emptyFull:{type:Boolean,default:!1}},emits:["change"],setup(e,{attrs:t,emit:n}){const o=C(null),l=C([]);return{formRef:C(null),tableElRef:o,getBindValues:a(()=>{let e={...t};return e=F(e,["class","onChange"]),e}),handleTableChange:function(...e){n("change",...e)},expandKeysList:l,getEmptyDataIsShowTable:a(()=>{const{emptyDataIsShowTable:t,useSearchForm:n,dataSource:o}=e;return!(!t&&n&&!o.length)})}},mounted(){this.expandKeysList=this.getBindValues.expandedRowKeys}}),pe={ref:"wrapRef"},de={key:0,class:"pr26px"},fe={key:1,class:"pr8px"},ye=/* @__PURE__ */se(ce,[["render",function(e,t,n,o,a,i){const s=x("HeaderCell"),p=x("a-table");return h(),u("div",pe,[B(e.$slots,"beforeTable"),D(d(p,b({ref:"tableElRef"},e.getBindValues,{"expanded-row-keys":e.expandKeysList,"onUpdate:expandedRowKeys":t[0]||(t[0]=t=>e.expandKeysList=t),onChange:e.handleTableChange}),c({headerCell:$(({column:t})=>[e.rowDraggable&&(null==t?void 0:t.dataIndex)===e.getBindValues.columns[0].dataIndex?(h(),u(l,{key:0},[e.isTreeTable?(h(),u("span",de)):(h(),u("span",fe)),d(s,{column:t},null,8,["column"])],64)):(h(),r(s,{key:1,column:t},null,8,["column"]))]),bodyCell:$(t=>[B(e.$slots,"bodyCell",g(y(t||{})))]),_:2},[k(Object.keys(e.$slots),t=>({name:t,fn:$(n=>[B(e.$slots,t,g(y(n||{})))])}))]),1040,["expanded-row-keys","onChange"]),[[A,e.getEmptyDataIsShowTable]])],512)}]]),me={key:0,class:"text-14px"},be={key:0,class:"text-14px"},ve=/* @__PURE__ */f({__name:"TableAction",props:{actions:{type:Array,default:null},dropDownActions:{type:Array,default:null},divider:{type:Boolean,default:!0},outside:Boolean,stopButtonPropagation:{type:Boolean,default:!1}},setup(e){const n=e,s=o("basic-table-action"),c=t.has;function p(e){const t=e.ifShow;let n=!0;return ee(t)&&(n=t),Z(t)&&(n=t(e)),n}const f=a(()=>(w(n.actions)||[]).filter(e=>c(e.auth)&&p(e)).map(e=>{const{popConfirm:t}=e;return{getPopupContainer:()=>document.body,type:"link",size:"small",...e,...t||{},onConfirm:null==t?void 0:t.confirm,onCancel:null==t?void 0:t.cancel,enable:!!t}})),y=a(()=>{const e=(w(n.dropDownActions)||[]).filter(e=>c(e.auth)&&p(e));return e.map((t,o)=>{const{label:l,popConfirm:a}=t;return{...t,...a,onConfirm:null==a?void 0:a.confirm,onCancel:null==a?void 0:a.cancel,text:l,divider:o<e.length-1&&n.divider}})}),m=a(()=>"left");function g(e){n.stopButtonPropagation&&e.composedPath().find(e=>{var t;return"BUTTON"===(null===(t=e.tagName)||void 0===t?void 0:t.toUpperCase())})&&e.stopPropagation()}return(t,n)=>{const o=x("a-button");return h(),u("div",{class:v([S(s).b(),m.value]),onClick:g},[(h(!0),u(l,null,k(f.value,(t,n)=>{return h(),u(l,{key:`${n}-${t.label}`},[t.tooltip?(h(),r(S(z),b({key:0,placement:"bottom"},{ref_for:!0},(o=t.tooltip,{getPopupContainer:()=>document.body,...Y(o)?{title:o}:o})),{default:$(()=>[d(S(De),b({ref_for:!0},t),{default:$(()=>[t.label?(h(),u("span",me,_(t.label),1)):i("",!0)]),_:2},1040)]),_:2},1040)):(h(),r(S(De),b({key:1,ref_for:!0},t),{default:$(()=>[t.label?(h(),u("span",be,_(t.label),1)):i("",!0)]),_:2},1040)),e.divider&&n<f.value.length-1?(h(),r(S(I),{key:2,type:"vertical",class:"action-divider"})):i("",!0)],64);var o}),128)),e.dropDownActions&&y.value.length>0?(h(),r(S(Pe),{key:0,trigger:["hover"],"drop-menu-list":y.value,popconfirm:""},{default:$(()=>[B(t.$slots,"more"),t.$slots.more?i("",!0):(h(),r(o,{key:0,type:"link",size:"small"},{default:$(()=>[d(S(P),{class:"icon-more"})]),_:1}))]),_:3},8,["drop-menu-list"])):i("",!0)],2)}}}),ge={key:0,class:"text-14px"},he={key:0,class:"text-14px"},Ce=/* @__PURE__ */f({__name:"TableActionAuto",props:{actions:{type:Array,default:null},divider:{type:Boolean,default:!0},outside:Boolean,stopButtonPropagation:{type:Boolean,default:!1},maxDispalyCount:{type:Number,default:4}},setup(e){const n=e,s=o("basic-table-action"),c=t.has,p=a(()=>[...w(n.actions)||[]].filter(e=>c(e.auth)&&function(e){const t=e.ifShow??!0;return Z(t)?t(e):!!t}(e))),f=a(()=>{let e=[];return e=n.maxDispalyCount>=p.value.length?[...p.value]:p.value.slice(0,n.maxDispalyCount),e.map(e=>{const{popConfirm:t}=e;return{getPopupContainer:()=>document.body,type:"link",size:"small",...e,...t||{},onConfirm:null==t?void 0:t.confirm,onCancel:null==t?void 0:t.cancel,enable:!!t}})}),y=a(()=>{let e=[];return n.maxDispalyCount>=p.value.length?[]:(e=p.value.slice(n.maxDispalyCount),e.map((t,o)=>{const{label:l,popConfirm:a}=t;return{...t,...a,onConfirm:null==a?void 0:a.confirm,onCancel:null==a?void 0:a.cancel,text:l,divider:o<e.length-1&&n.divider}}))}),m=a(()=>"left");function g(e){n.stopButtonPropagation&&e.composedPath().find(e=>{var t;return"BUTTON"===(null===(t=e.tagName)||void 0===t?void 0:t.toUpperCase())})&&e.stopPropagation()}return(t,n)=>{const o=x("a-button");return h(),u("div",{class:v([S(s).b(),m.value]),onClick:O(g,["stop"])},[(h(!0),u(l,null,k(f.value,(t,n)=>{return h(),u(l,{key:`${n}-${t.label}`},[t.tooltip?(h(),r(S(z),b({key:0,ref_for:!0},(o=t.tooltip,{getPopupContainer:()=>document.body,placement:"bottom",...Y(o)?{title:o}:o})),{default:$(()=>[d(S(De),b({ref_for:!0},t),{default:$(()=>[t.label?(h(),u("span",ge,_(t.label),1)):i("",!0)]),_:2},1040)]),_:2},1040)):(h(),r(S(De),b({key:1,ref_for:!0},t),{default:$(()=>[t.label?(h(),u("span",he,_(t.label),1)):i("",!0)]),_:2},1040)),e.divider&&n<f.value.length-1?(h(),r(S(I),{key:2,type:"vertical",class:"action-divider"})):i("",!0)],64);var o}),128)),y.value.length>0?(h(),r(S(Pe),{key:0,trigger:["hover"],"drop-menu-list":y.value,popconfirm:""},{default:$(()=>[B(t.$slots,"more"),t.$slots.more?i("",!0):(h(),r(o,{key:0,type:"link",size:"small"},{default:$(()=>[d(S(P),{class:"icon-more"})]),_:1}))]),_:3},8,["drop-menu-list"])):i("",!0)],2)}}}),ke=["primary","error","warning","success",""],Be={color:{type:String,validator:e=>ke.includes(e),default:""},loading:{type:Boolean},disabled:{type:Boolean},preIcon:{type:String},postIcon:{type:String},iconSize:{type:Number,default:14},onClick:{type:Function,default:null}},xe=/* @__PURE__ */f({name:"AButton",extends:j,inheritAttrs:!1,__name:"BasicButton",props:Be,setup(e){const t=e,n=T(),o=a(()=>{const{color:e,disabled:n}=t;return[{[`ant-btn-${e}`]:!!e,"is-disabled":n}]}),l=a(()=>({...S(n),...t}));return(e,t)=>(h(),r(S(j),b(l.value,{class:o.value,onClick:e.onClick}),{default:$(t=>[B(e.$slots,"default",g(y(t||{})))]),_:3},16,["class","onClick"]))}}),_e=f({name:"PopButton",inheritAttrs:!1,props:{enable:{type:Boolean,default:!0}},setup(e,{slots:t}){const o=T(),l=a(()=>Object.assign({okText:n("sys.okText"),cancelText:n("sys.cancelText"),overlayStyle:{}},{...e,...S(o)}));return()=>{const n=F(S(l),"icon"),o=F(n,"title");o.disabled&&(o.color="");const a=m(xe,o,t);return e.enable?m(K,n,{default:()=>a}):a}}}),we=_e,Se={class:"custom-btn-container"},Te={class:"btn-left-title"},Ae=/* @__PURE__ */se(/* @__PURE__ */f({__name:"custom-button",props:{title:{}},emits:["btn-left-click","btn-right-click"],setup:e=>(t,n)=>(h(),u("div",Se,[s("div",{class:"btn-left",onClick:n[0]||(n[0]=O(e=>t.$emit("btn-left-click"),["stop"]))},[B(t.$slots,"left-icon",{},void 0,!0),s("div",Te,_(e.title),1)]),s("div",{class:"btn-right",onClick:n[1]||(n[1]=O(e=>t.$emit("btn-right-click"),["stop"]))},[B(t.$slots,"right-icon",{},void 0,!0)])]))}),[["__scopeId","data-v-305f4090"]]),$e=xe,De=we,Oe={class:"ml-1"},Fe={key:1,class:"ml-1"},Pe=/* @__PURE__ */f({name:"VDropdown",__name:"Dropdown",props:{popconfirm:Boolean,trigger:{type:Array,default:()=>["contextmenu"]},dropMenuList:{type:Array,default:()=>[]},selectedKeys:{type:Array,default:()=>[]}},emits:["menuEvent"],setup(e,{emit:t}){const n=N,o=R,a=R.Item,c=R.Divider,f=K,y=e,m=t;function v(e){const t=F(e,["confirm","cancel","icon"]);return!e.onConfirm&&e.confirm&&Z(e.confirm)&&(t.onConfirm=e.confirm),!e.onCancel&&e.cancel&&Z(e.cancel)&&(t.onCancel=e.cancel),t}return(t,g)=>(h(),r(S(n),b({trigger:e.trigger},t.$attrs),{overlay:$(()=>[d(S(o),{"selected-keys":e.selectedKeys},{default:$(()=>[(h(!0),u(l,null,k(e.dropMenuList,t=>{return h(),u(l,{key:`${t.event}`},[d(S(a),b({class:t.class},{ref_for:!0},(n=t.event,{key:n}),{disabled:t.disabled,onClick:e=>function(e){var t;const{event:n}=e;m("menuEvent",y.dropMenuList.find(e=>`${e.event}`==`${n}`)),null===(t=e.onClick)||void 0===t||t.call(e)}(t)}),{default:$(()=>[e.popconfirm&&t.popConfirm?(h(),r(S(f),b({key:0,ref_for:!0},v(t.popConfirm)),{default:$(()=>[s("div",null,[s("span",Oe,_(t.text),1)])]),_:2},1040)):(h(),u("span",Fe,_(t.text),1))]),_:2},1040,["class","disabled","onClick"]),t.divider?(h(),r(S(c),{key:`d-${t.event}`})):i("",!0)],64);var n}),128))]),_:1},8,["selected-keys"])]),default:$(()=>[s("span",null,[B(t.$slots,"default")]),p(" "+_(e.dropMenuList)+" ",1)]),_:3},16,["trigger"]))}});function je(){}var Ie=new URL("./index.min.css",import.meta.url);e.load(Ie.href);export{ye as BasicTable,$e as Button,Ae as CustomButton,Pe as Dropdown,De as PopConfirmButton,ve as TableAction,Ce as TableActionAuto,E as is,ne as isArray,ee as isBoolean,W as isDate,M as isDef,le as isElement,V as isEmpty,ie as isEmptyStr,Z as isFunction,ae as isMap,q as isNull,G as isNullAndUnDef,J as isNullOrUnDef,Q as isNumber,U as isObject,X as isPromise,te as isRegExp,Y as isString,H as isUnDef,re as isUrl,oe as isWindow,je as run};
|
|
1
|
+
/*! @gct-paas/v-ben v0.1.6-dev.14 */
|
|
2
|
+
import{cssLoader as e,permission as t,t as n,useNamespace as o}from"@gct-paas/core";import{Fragment as l,computed as a,createBlock as i,createCommentVNode as r,createElementBlock as s,createElementVNode as u,createSlots as c,createTextVNode as d,createVNode as f,defineComponent as p,guardReactiveProps as m,h as y,mergeProps as g,nextTick as h,normalizeClass as v,normalizeProps as b,onActivated as C,onMounted as w,openBlock as S,ref as x,renderList as B,renderSlot as k,resolveComponent as T,toDisplayString as P,toRaw as _,toValue as A,unref as $,useAttrs as O,vShow as R,watch as F,withCtx as I,withDirectives as D,withModifiers as H}from"vue";import{cloneDeep as z,omit as L}from"lodash-es";import{LeftOutlined as j,MoreOutlined as E,RightOutlined as N}from"@ant-design/icons-vue";import{Button as K,Divider as W,Dropdown as M,Menu as V,Popconfirm as U,Tooltip as q}from"ant-design-vue";var G=Object.prototype.toString;function X(e,t){return G.call(e)===`[object ${t}]`}function Y(e){return void 0!==e}function J(e){return!Y(e)}function Q(e){return null!==e&&X(e,"Object")}function Z(e){return ce(e)||ie(e)?0===e.length:e instanceof Map||e instanceof Set?0===e.size:!!Q(e)&&0===Object.keys(e).length}function ee(e){return X(e,"Date")}function te(e){return null===e}function ne(e){return J(e)&&te(e)}function oe(e){return J(e)||te(e)}function le(e){return X(e,"Number")}function ae(e){return X(e,"Promise")&&Q(e)&&re(e.then)&&re(e.then)}function ie(e){return X(e,"String")}function re(e){return"function"==typeof e}function se(e){return X(e,"Boolean")}function ue(e){return X(e,"RegExp")}function ce(e){return!!e&&Array.isArray(e)}function de(e){return"undefined"!=typeof window&&X(e,"Window")}function fe(e){return Q(e)&&!!e.tagName}function pe(e){return X(e,"Map")}function me(e){return/^http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- ./?%&=]*)?/.test(e)}function ye(e){return void 0===e||!e&&0!==e&&"0"!==e||!/[^\s]/.test(e+"")}var ge=(e,t)=>{const n=e.__vccOpts||e;for(const[o,l]of t)n[o]=l;return n},he=/* @__PURE__ */ge(p({name:"TableHeaderCell",components:{},props:{column:{type:Object,default:()=>({})}},setup:e=>({getTitle:a(()=>{var t,n;return(null===(t=e.column)||void 0===t?void 0:t.customTitle)||(null===(n=e.column)||void 0===n?void 0:n.title)})})}),[["render",function(e,t,n,o,l,a){return S(),s("span",null,P(e.getTitle),1)}]]),ve={clickToRowSelect:{type:Boolean,default:!0},isTreeTable:Boolean,tableSetting:{type:Object,default:{}},inset:Boolean,showTableSetting:Boolean,autoCreateKey:{type:Boolean,default:!0},striped:{type:Boolean,default:!0},showSummary:Boolean,summaryFunc:{type:[Function,Array],default:null},summaryData:{type:Array,default:null},indentSize:{type:Number,default:24},canColDrag:{type:Boolean,default:!0},api:{type:Function,default:null},beforeFetch:{type:Function,default:null},afterFetch:{type:Function,default:null},handleSearchInfoFn:{type:Function,default:null},immediate:{type:Boolean,default:!0},emptyDataIsShowTable:{type:Boolean,default:!0},searchInfo:{type:Object,default:null},defSort:{type:Object,default:null},useSearchForm:Boolean,columns:{type:Array,default:()=>[]},showIndexColumn:{type:Boolean,default:!0},indexColumnProps:{type:Object,default:null},actionColumn:{type:Object,default:null},ellipsis:{type:Boolean,default:!0},isCanResizeParent:{type:Boolean,default:!1},canResize:{type:Boolean,default:!0},clearSelectOnPageChange:Boolean,resizeHeightOffset:{type:Number,default:0},rowSelection:{type:Object,default:null},title:{type:[String,Function],default:null},titleHelpMessage:{type:[String,Array]},maxHeight:Number,dataSource:{type:Array,default:null},rowKey:{type:[String,Function],default:""},bordered:Boolean,pagination:{type:[Object,Boolean],default:null},loading:Boolean,rowClassName:{type:Function},scroll:{type:Object,default:null},beforeEditSubmit:{type:Function},rowDraggable:{type:Boolean,default:!1},supportSameLevel:{type:Boolean,default:!1},rowDragApi:{type:Function,default:null},expandedRowKeys:{type:Array,default:()=>[]},emptyFull:{type:Boolean,default:!1}},be=["clickToRowSelect","isTreeTable","tableSetting","inset","showTableSetting","autoCreateKey","striped","showSummary","summaryFunc","summaryData","indentSize","canColDrag","api","beforeFetch","afterFetch","handleSearchInfoFn","immediate","emptyDataIsShowTable","searchInfo","defSort","useSearchForm","showIndexColumn","indexColumnProps","actionColumn","ellipsis","isCanResizeParent","canResize","clearSelectOnPageChange","resizeHeightOffset","titleHelpMessage","beforeEditSubmit","rowDraggable","supportSameLevel","rowDragApi","emptyFull"],Ce="INDEX",we="ACTION",Se=["20","50","80","100"];function xe(e,t){const{key:n,dataIndex:o,children:l}=e;e.align=e.align||"left",t&&(n||void 0===o||(e.key=Array.isArray(o)?o.join("."):String(o)),se(e.ellipsis)||Object.assign(e,{ellipsis:{showTitle:!1}})),l&&l.length&&Be(l,!!t);const a=e.customCell;e.customCell=(t,n)=>({...a&&a(t,n),onMouseenter(t){if(!e.ellipsis)return;const n=t.target;n.scrollWidth>n.clientWidth&&n.setAttribute("title",n.textContent??"")}})}function Be(e,t){e&&e.forEach(e=>{const{children:n}=e;xe(e,t),Be(n,t)})}function ke({page:e,type:t,originalElement:n}){return"prev"===t?0===e?null:y(j):"next"===t?1===e?null:y(N):n}var Te="undefined"!=typeof window&&"undefined"!=typeof document,Pe=("undefined"!=typeof WorkerGlobalScope&&(globalThis,WorkerGlobalScope),Object.prototype.toString),_e=()=>{};function Ae(e){return Array.isArray(e)?e:[e]}function $e(e){const t=Object.create(null);return n=>t[n]||(t[n]=e(n))}var Oe=/\B([A-Z])/g,Re=($e(e=>e.replace(Oe,"-$1").toLowerCase()),/-(\w)/g);function Fe(e,t=200,n={}){return function(e,t){return function(...n){return new Promise((o,l)=>{Promise.resolve(e(()=>t.apply(this,n),{fn:t,thisArg:this,args:n})).then(o).catch(l)})}}(function(e,t={}){let n,o,l=_e;const a=e=>{clearTimeout(e),l(),l=_e};let i;return r=>{const s=A(e),u=A(t.maxWait);return n&&a(n),s<=0||void 0!==u&&u<=0?(o&&(a(o),o=void 0),Promise.resolve(r())):new Promise((e,c)=>{l=t.rejectOnCancel?c:e,i=r,u&&!o&&(o=setTimeout(()=>{n&&a(n),o=void 0,e(i())},u)),n=setTimeout(()=>{o&&a(o),o=void 0,e(r())},s)})}}(t,n),e)}$e(e=>e.replace(Re,(e,t)=>t?t.toUpperCase():""));var Ie=Te?window:void 0;function De(e,t,n,o,l,i,r,s){const u=x(215),c=Fe(f,100),d=a(()=>{const{canResize:t,scroll:n}=$(e);return t&&!(n||{}).y});function f(){h(()=>{g()})}F(()=>{var e;return[$(d),null===(e=$(i))||void 0===e?void 0:e.length]},()=>{c()},{flush:"post"});let p=null,m=null,y=null;async function g(){const{resizeHeightOffset:n,maxHeight:o,isCanResizeParent:a,useSearchForm:c}=$(e),f=$(l),g=$(i),v=$(t);if(!v)return;const b=v.$el;if(!b)return;if(!y&&(y=b.querySelector(".ant-table-body"),!y))return;const C=y.scrollHeight>y.clientHeight,w=y.scrollWidth>y.clientWidth;if(C?b.classList.contains("hide-scrollbar-y")&&b.classList.remove("hide-scrollbar-y"):b.classList.contains("hide-scrollbar-y")||b.classList.add("hide-scrollbar-y"),w?b.classList.contains("hide-scrollbar-x")&&b.classList.remove("hide-scrollbar-x"):b.classList.contains("hide-scrollbar-x")||b.classList.add("hide-scrollbar-x"),y.style.height="unset",!$(d)||!$(g)||0===g.length)return;await h();const S=b.querySelector(".ant-table-thead ");if(!S)return;let x=32,B=12;se(f)?B=-8:(p=b.querySelector(".ant-pagination"),B+=p?p.offsetHeight||0:24);let k=0;se(f)||(m?k+=m.offsetHeight||0:m=b.querySelector(".ant-table-footer"));let T=0;S&&(T=S.offsetHeight);let P=0;if($(r)&&a){var _,A,O;const e=12,t=16;let n=10;const o=(null===(_=$(r))||void 0===_?void 0:_.offsetHeight)??0;let l=(null===(A=$(s))||void 0===A?void 0:A.$el.offsetHeight)??0;l&&(l+=t),se(f)&&!f&&(n=0),se(c)&&!c&&(x=0),P=o-l-((null===(O=b.querySelector(".ant-table-title"))||void 0===O?void 0:O.offsetHeight)??0)-e-n}else P=function(e){const t=document.documentElement,n=t.scrollLeft,o=t.scrollTop,l=t.clientLeft,a=t.clientTop,i=window.pageXOffset,r=window.pageYOffset,{left:s,top:u,width:c,height:d}=function(e){return e&&e.getBoundingClientRect?e.getBoundingClientRect():0}(e),f=s+i-((i||n)-(l||0)),p=u+r-((r||o)-(a||0)),m=window.document.documentElement.clientWidth,y=window.document.documentElement.clientHeight;return{left:f,top:p,right:m-c-f,bottom:y-d-p,rightIncludeBody:m-f,bottomIncludeBody:y-p}}(S).bottomIncludeBody;let R=P-(n||0)-x-B-k-T;if(R=(R>o?o:R)??R,function(e){u.value=e}(R),f&&!se(f)){const e=b.querySelector(".ant-table-body");e&&(e.style.height=`${R}px`)}}function v(){g(),h(()=>{c()})}(function(...e){const t=a(()=>{const t=Ae(A(e[0])).filter(e=>null!=e);return t.every(e=>"string"!=typeof e)?t:void 0});return n=([e,t,n,o],l,a)=>{if(!(null==e?void 0:e.length)||!(null==t?void 0:t.length)||!(null==n?void 0:n.length))return;const i=(r=o,"[object Object]"===Pe.call(r)?{...o}:o);var r;const s=e.flatMap(e=>t.flatMap(t=>n.map(n=>((e,t,n,o)=>(e.addEventListener(t,n,o),()=>e.removeEventListener(t,n,o)))(e,t,n,i))));a(()=>{s.forEach(e=>e())})},o={flush:"post"},F(()=>{var n,o;return[null!==(n=null===(o=t.value)||void 0===o?void 0:o.map(e=>function(e){var t;const n=A(e);return null!==(t=null==n?void 0:n.$el)&&void 0!==t?t:n}(e)))&&void 0!==n?n:[Ie].filter(e=>null!=e),Ae(A(t.value?e[1]:e[0])),Ae($(t.value?e[2]:e[1])),A(t.value?e[3]:e[2])]},n,{...o,immediate:!0});var n,o})(window,"resize",Fe(g,280)),w(v),C(v);const b=a(()=>{var e;let l=0;$(o)&&(l+=60);const a=$(n).filter(e=>!e.defaultHidden);a.forEach(e=>{l+=Number.parseFloat(String(e.width))||0});const i=a.filter(e=>!Reflect.has(e,"width")).length;0!==i&&(l+=150*i);const r=$(t);return((null==r||null===(e=r.$el)||void 0===e?void 0:e.offsetWidth)??0)>l?void 0:l});return{getScrollRef:a(()=>{const t=$(u),{canResize:n,scroll:o}=$(e);return{x:$(b),y:n?t:null,scrollToFirstRowOnChange:!1,...o}}),redoHeight:f}}Te&&window.document,Te&&window.navigator,Te&&window.location,Number.POSITIVE_INFINITY;var He="vben";function ze(e){return{prefixCls:`${He}-${e}`,prefixVar:He}}var Le=["headerCell","bodyCell"],je=p({name:"BasicTable",components:{HeaderCell:he},props:ve,emits:["change"],setup(e,{attrs:o,emit:l,slots:i,expose:r}){const s=x(null),u=x([...e.expandedRowKeys??[]]),c=x(null),d=x(null),{prefixCls:f}=ze("basic-table"),p=a(()=>({...e,...o})),{getPaginationInfo:m,setPagination:y,getPagination:g,getShowPagination:h,setShowPagination:v}=function(e){const t=x({}),o=x(!0);F(()=>$(e).pagination,e=>{!se(e)&&e&&(t.value={...$(t),...e})},{deep:!0});const l=a(()=>{const{pagination:l}=$(e);return!(!$(o)||se(l)&&!l)&&{current:1,pageSize:20,size:"small",defaultPageSize:20,showTotal:e=>n("sys.component.table.total",{total:e}),showSizeChanger:!0,pageSizeOptions:Se,itemRender:ke,showQuickJumper:!0,...se(l)?{}:l??{},...$(t)}});return{getPagination:function(){return $(l)},getPaginationInfo:l,setShowPagination:async function(e){o.value=e},getShowPagination:function(){return $(o)},setPagination:function(e){const n=$(l);t.value={...se(n)?{}:n,...e}}}}(p),b=a(()=>$(m)),C=a(()=>$(p).rowSelection??null),w=a(()=>$(p).dataSource??[]),{getViewColumns:S,getColumnsRef:B}=function(e,o){const l=x($(e).columns),i=a(()=>{const t=z($(l));if(function(e,t,o){const{showIndexColumn:l,indexColumnProps:a,isTreeTable:i}=$(e);let r=!1;if($(i))return;if(o.forEach(()=>{const e=o.findIndex(e=>e.flag===Ce);l?r=-1===e:l||-1===e||o.splice(e,1)}),!r)return;const s=o.some(e=>"left"===e.fixed);o.unshift({flag:Ce,width:70,title:n("sys.component.table.index"),align:"center",customRender:({index:e})=>{const n=$(t);if(se(n))return`${e+1}`;const{current:o=1,pageSize:l=20}=n;return((o<1?1:o)-1)*l+e+1},...s?{fixed:"left"}:{},...a})}(e,o,t),function(e,t){const{actionColumn:n}=$(e);if(!n)return;const o=t.findIndex(e=>e.flag===we);-1===o&&t.push({...t[o],fixed:"right",...n,flag:we})}(e,t),!t)return[];const{ellipsis:a}=$(e);return t.forEach(e=>{const{customRender:t,slots:n}=e;xe(e,Reflect.has(e,"ellipsis")?!!e.ellipsis:!!a&&!t&&!n)}),t}),r=a(()=>{const e=function(e){const t=[],n=[],o=[];for(const l of e)"left"!==l.fixed?"right"!==l.fixed?o.push(l):n.push(l):t.push(l);return[...t,...o,...n].filter(e=>!e.defaultHidden)}($(i)),n=e=>{const{slots:t}=e;return t&&(null==t?void 0:t.title)||(e.customTitle=e.title,Reflect.deleteProperty(e,"title")),e};return z(e).filter(e=>{return(!(n=e.auth)||(Array.isArray(n)?n.some(e=>t.has(String(e))):t.has(String(n))))&&function(e){const t=e.ifShow;return se(t)?t:!re(t)||t(e)}(e);var n}).map(e=>{var t;return(null===(t=e.children)||void 0===t?void 0:t.length)&&(e.children=e.children.map(n)),n(e)})});return F(()=>$(e).columns,e=>{l.value=e}),{getColumnsRef:i,getViewColumns:r}}(p,b),{getScrollRef:k,redoHeight:T}=De(p,s,B,C,b,w,c,d),P=a(()=>{let e={...o,...$(p),scroll:$(k),tableLayout:"fixed",columns:_($(S)),pagination:_($(m)),rowSelection:$(C),dataSource:$(w)};return e=L(e,[...be,"class","onChange"]),e}),A=a(()=>{const e=$(P);return[f,o.class,{[`${f}-form-container`]:e.useSearchForm,[`${f}--inset`]:e.inset}]}),O=a(()=>{const{emptyDataIsShowTable:t,useSearchForm:n,dataSource:o}=e;return!(!t&&n&&!(null==o?void 0:o.length))}),R=a(()=>Object.keys(i).filter(e=>!Le.includes(e)));return r({redoHeight:T,setPagination:y,getPagination:g,getShowPagination:h,setShowPagination:v}),{formRef:d,tableElRef:s,wrapRef:c,getBindValues:P,getWrapperClass:A,handleTableChange:function(...e){l("change",...e);const{onChange:t}=$(p);t&&"function"==typeof t&&t(...e)},expandKeysList:u,getEmptyDataIsShowTable:O,slotNames:R,emptyFull:e.emptyFull,redoHeight:T}},mounted(){this.expandKeysList=this.getBindValues.expandedRowKeys??[],this.redoHeight()}}),Ee=/* @__PURE__ */ge(je,[["render",function(e,t,n,o,l,a){const i=T("HeaderCell"),r=T("a-table");return S(),s("div",{ref:"wrapRef",class:v(e.getWrapperClass)},[k(e.$slots,"beforeTable"),D(f(r,g({ref:"tableElRef"},e.getBindValues,{"expanded-row-keys":e.expandKeysList,"onUpdate:expandedRowKeys":t[0]||(t[0]=t=>e.expandKeysList=t),class:e.emptyFull?"empty-basic-table-wrapper":"",onChange:e.handleTableChange}),c({headerCell:I(({column:e})=>[f(i,{column:e},null,8,["column"])]),bodyCell:I(t=>[k(e.$slots,"bodyCell",b(m(t||{})))]),_:2},[B(e.slotNames,t=>({name:t,fn:I(n=>[k(e.$slots,t,b(m(n||{})))])}))]),1040,["expanded-row-keys","class","onChange"]),[[R,e.getEmptyDataIsShowTable]])],2)}]]),Ne={key:0},Ke={key:0},We=/* @__PURE__ */p({__name:"TableAction",props:{actions:{type:Array,default:null},dropDownActions:{type:Array,default:null},divider:{type:Boolean,default:!0},outside:Boolean,stopButtonPropagation:{type:Boolean,default:!1}},setup(e){const n=e,u=o("basic-table-action"),c=t.has;function d(e){const t=e.ifShow;let n=!0;return se(t)&&(n=t),re(t)&&(n=t(e)),n}const p=a(()=>(_(n.actions)||[]).filter(e=>c(e.auth)&&d(e)).map(e=>{const{popConfirm:t}=e;return{getPopupContainer:()=>document.body,type:"link",size:"small",...e,...t||{},onConfirm:null==t?void 0:t.confirm,onCancel:null==t?void 0:t.cancel,enable:!!t}})),m=a(()=>{const e=(_(n.dropDownActions)||[]).filter(e=>c(e.auth)&&d(e));return e.map((t,o)=>{const{label:l,popConfirm:a}=t;return{...t,...a,onConfirm:null==a?void 0:a.confirm,onCancel:null==a?void 0:a.cancel,text:l,divider:o<e.length-1&&n.divider}})}),y=a(()=>"left");function h(e){n.stopButtonPropagation&&e.composedPath().find(e=>{var t;return"BUTTON"===(null===(t=e.tagName)||void 0===t?void 0:t.toUpperCase())})&&e.stopPropagation()}return(t,n)=>{const o=T("a-button");return S(),s("div",{class:v([$(u).b(),y.value]),onClick:h},[(S(!0),s(l,null,B(p.value,(t,n)=>{return S(),s(l,{key:`${n}-${t.label}`},[t.tooltip?(S(),i($(q),g({key:0,placement:"bottom"},{ref_for:!0},(o=t.tooltip,{getPopupContainer:()=>document.body,...ie(o)?{title:o}:o})),{default:I(()=>[f($(nt),g({ref_for:!0},t),{default:I(()=>[t.label?(S(),s("span",Ne,P(t.label),1)):r("",!0)]),_:2},1040)]),_:2},1040)):(S(),i($(nt),g({key:1,ref_for:!0},t),{default:I(()=>[t.label?(S(),s("span",Ke,P(t.label),1)):r("",!0)]),_:2},1040)),e.divider&&n<p.value.length-1?(S(),i($(W),{key:2,type:"vertical",class:"action-divider"})):r("",!0)],64);var o}),128)),e.dropDownActions&&m.value.length>0?(S(),i($(at),{key:0,trigger:["hover"],"drop-menu-list":m.value,popconfirm:""},{default:I(()=>[k(t.$slots,"more"),t.$slots.more?r("",!0):(S(),i(o,{key:0,type:"link",size:"small"},{default:I(()=>[f($(E),{class:"icon-more"})]),_:1}))]),_:3},8,["drop-menu-list"])):r("",!0)],2)}}}),Me={key:0},Ve={key:0},Ue=/* @__PURE__ */p({__name:"TableActionAuto",props:{actions:{type:Array,default:null},divider:{type:Boolean,default:!0},outside:Boolean,stopButtonPropagation:{type:Boolean,default:!1},maxDispalyCount:{type:Number,default:4}},setup(e){const n=e,u=o("basic-table-action"),c=t.has,d=a(()=>[..._(n.actions)||[]].filter(e=>c(e.auth)&&function(e){const t=e.ifShow??!0;return re(t)?t(e):!!t}(e))),p=a(()=>{let e=[];return e=n.maxDispalyCount>=d.value.length?[...d.value]:d.value.slice(0,n.maxDispalyCount),e.map(e=>{const{popConfirm:t}=e;return{getPopupContainer:()=>document.body,type:"link",size:"small",...e,...t||{},onConfirm:null==t?void 0:t.confirm,onCancel:null==t?void 0:t.cancel,enable:!!t}})}),m=a(()=>{let e=[];return n.maxDispalyCount>=d.value.length?[]:(e=d.value.slice(n.maxDispalyCount),e.map((t,o)=>{const{label:l,popConfirm:a}=t;return{...t,...a,onConfirm:null==a?void 0:a.confirm,onCancel:null==a?void 0:a.cancel,text:l,divider:o<e.length-1&&n.divider}}))}),y=a(()=>"left");function h(e){n.stopButtonPropagation&&e.composedPath().find(e=>{var t;return"BUTTON"===(null===(t=e.tagName)||void 0===t?void 0:t.toUpperCase())})&&e.stopPropagation()}return(t,n)=>{const o=T("a-button");return S(),s("div",{class:v([$(u).b(),y.value]),onClick:H(h,["stop"])},[(S(!0),s(l,null,B(p.value,(t,n)=>{return S(),s(l,{key:`${n}-${t.label}`},[t.tooltip?(S(),i($(q),g({key:0,ref_for:!0},(o=t.tooltip,{getPopupContainer:()=>document.body,placement:"bottom",...ie(o)?{title:o}:o})),{default:I(()=>[f($(nt),g({ref_for:!0},t),{default:I(()=>[t.label?(S(),s("span",Me,P(t.label),1)):r("",!0)]),_:2},1040)]),_:2},1040)):(S(),i($(nt),g({key:1,ref_for:!0},t),{default:I(()=>[t.label?(S(),s("span",Ve,P(t.label),1)):r("",!0)]),_:2},1040)),e.divider&&n<p.value.length-1?(S(),i($(W),{key:2,type:"vertical",class:"action-divider"})):r("",!0)],64);var o}),128)),m.value.length>0?(S(),i($(at),{key:0,trigger:["hover"],"drop-menu-list":m.value,popconfirm:""},{default:I(()=>[k(t.$slots,"more"),t.$slots.more?r("",!0):(S(),i(o,{key:0,type:"link",size:"small"},{default:I(()=>[f($(E),{class:"icon-more"})]),_:1}))]),_:3},8,["drop-menu-list"])):r("",!0)],2)}}}),qe=["primary","error","warning","success",""],Ge={color:{type:String,validator:e=>qe.includes(e),default:""},loading:{type:Boolean},disabled:{type:Boolean},preIcon:{type:String},postIcon:{type:String},iconSize:{type:Number,default:14},onClick:{type:Function,default:null}},Xe=/* @__PURE__ */p({name:"AButton",extends:K,inheritAttrs:!1,__name:"BasicButton",props:Ge,setup(e){const t=e,n=O(),o=a(()=>{const{color:e,disabled:n}=t;return[{[`ant-btn-${e}`]:!!e,"is-disabled":n}]}),l=a(()=>({...$(n),...t}));return(e,t)=>(S(),i($(K),g(l.value,{class:o.value,onClick:e.onClick}),{default:I(t=>[k(e.$slots,"default",b(m(t||{})))]),_:3},16,["class","onClick"]))}}),Ye=p({name:"PopButton",inheritAttrs:!1,props:{enable:{type:Boolean,default:!0}},setup(e,{slots:t}){const o=O(),l=a(()=>Object.assign({okText:n("sys.okText"),cancelText:n("sys.cancelText"),overlayStyle:{}},{...e,...$(o)}));return()=>{const n=L($(l),"icon"),o=L(n,"title");o.disabled&&(o.color="");const a=y(Xe,o,t);return e.enable?y(U,n,{default:()=>a}):a}}}),Je=Ye,Qe={class:"custom-btn-container"},Ze={class:"btn-left-title"},et=/* @__PURE__ */ge(/* @__PURE__ */p({__name:"custom-button",props:{title:{}},emits:["btn-left-click","btn-right-click"],setup:e=>(t,n)=>(S(),s("div",Qe,[u("div",{class:"btn-left",onClick:n[0]||(n[0]=H(e=>t.$emit("btn-left-click"),["stop"]))},[k(t.$slots,"left-icon",{},void 0,!0),u("div",Ze,P(e.title),1)]),u("div",{class:"btn-right",onClick:n[1]||(n[1]=H(e=>t.$emit("btn-right-click"),["stop"]))},[k(t.$slots,"right-icon",{},void 0,!0)])]))}),[["__scopeId","data-v-305f4090"]]),tt=Xe,nt=Je,ot={class:"ml-1"},lt={key:1,class:"ml-1"},at=/* @__PURE__ */p({name:"VDropdown",__name:"Dropdown",props:{popconfirm:Boolean,trigger:{type:Array,default:()=>["contextmenu"]},dropMenuList:{type:Array,default:()=>[]},selectedKeys:{type:Array,default:()=>[]}},emits:["menuEvent"],setup(e,{emit:t}){const n=M,o=V,a=V.Item,c=V.Divider,p=U,m=e,y=t;function h(e){const t=L(e,["confirm","cancel","icon"]);return!e.onConfirm&&e.confirm&&re(e.confirm)&&(t.onConfirm=e.confirm),!e.onCancel&&e.cancel&&re(e.cancel)&&(t.onCancel=e.cancel),t}return(t,v)=>(S(),i($(n),g({trigger:e.trigger},t.$attrs),{overlay:I(()=>[f($(o),{"selected-keys":e.selectedKeys},{default:I(()=>[(S(!0),s(l,null,B(e.dropMenuList,t=>{return S(),s(l,{key:`${t.event}`},[f($(a),g({class:t.class},{ref_for:!0},(n=t.event,{key:n}),{disabled:t.disabled,onClick:e=>function(e){var t;const{event:n}=e;y("menuEvent",m.dropMenuList.find(e=>`${e.event}`==`${n}`)),null===(t=e.onClick)||void 0===t||t.call(e)}(t)}),{default:I(()=>[e.popconfirm&&t.popConfirm?(S(),i($(p),g({key:0,ref_for:!0},h(t.popConfirm)),{default:I(()=>[u("div",null,[u("span",ot,P(t.text),1)])]),_:2},1040)):(S(),s("span",lt,P(t.text),1))]),_:2},1040,["class","disabled","onClick"]),t.divider?(S(),i($(c),{key:`d-${t.event}`})):r("",!0)],64);var n}),128))]),_:1},8,["selected-keys"])]),default:I(()=>[u("span",null,[k(t.$slots,"default")]),d(" "+P(e.dropMenuList)+" ",1)]),_:3},16,["trigger"]))}});function it(){}var rt=new URL("./index.min.css",import.meta.url);e.load(rt.href);export{Ee as BasicTable,tt as Button,et as CustomButton,at as Dropdown,nt as PopConfirmButton,We as TableAction,Ue as TableActionAuto,X as is,ce as isArray,se as isBoolean,ee as isDate,Y as isDef,fe as isElement,Z as isEmpty,ye as isEmptyStr,re as isFunction,pe as isMap,te as isNull,ne as isNullAndUnDef,oe as isNullOrUnDef,le as isNumber,Q as isObject,ae as isPromise,ue as isRegExp,ie as isString,J as isUnDef,me as isUrl,de as isWindow,it as run};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import BasicButton_default from "./BasicButton.vue.mjs";
|
|
2
2
|
import { computed, defineComponent, h, unref, useAttrs } from "vue";
|
|
3
3
|
import { omit } from "lodash-es";
|
|
4
|
-
import { Popconfirm } from "ant-design-vue";
|
|
5
4
|
import { t } from "@gct-paas/core";
|
|
5
|
+
import { Popconfirm } from "ant-design-vue";
|
|
6
6
|
var PopConfirmButton_vue_vue_type_script_lang_default = defineComponent({
|
|
7
7
|
name: "PopButton",
|
|
8
8
|
inheritAttrs: false,
|
|
@@ -5,7 +5,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
5
5
|
};
|
|
6
6
|
isTreeTable: BooleanConstructor;
|
|
7
7
|
tableSetting: {
|
|
8
|
-
type: import('vue').PropType<import('
|
|
8
|
+
type: import('vue').PropType<import('..').TableSetting>;
|
|
9
9
|
default: {};
|
|
10
10
|
};
|
|
11
11
|
inset: BooleanConstructor;
|
|
@@ -69,7 +69,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
69
69
|
};
|
|
70
70
|
useSearchForm: BooleanConstructor;
|
|
71
71
|
columns: {
|
|
72
|
-
type: import('vue').PropType<import('
|
|
72
|
+
type: import('vue').PropType<import('..').BasicColumn[]>;
|
|
73
73
|
default: () => never[];
|
|
74
74
|
};
|
|
75
75
|
showIndexColumn: {
|
|
@@ -77,11 +77,11 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
77
77
|
default: boolean;
|
|
78
78
|
};
|
|
79
79
|
indexColumnProps: {
|
|
80
|
-
type: import('vue').PropType<import('
|
|
80
|
+
type: import('vue').PropType<import('..').BasicColumn>;
|
|
81
81
|
default: null;
|
|
82
82
|
};
|
|
83
83
|
actionColumn: {
|
|
84
|
-
type: import('vue').PropType<import('
|
|
84
|
+
type: import('vue').PropType<import('..').BasicColumn>;
|
|
85
85
|
default: null;
|
|
86
86
|
};
|
|
87
87
|
ellipsis: {
|
|
@@ -102,7 +102,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
102
102
|
default: number;
|
|
103
103
|
};
|
|
104
104
|
rowSelection: {
|
|
105
|
-
type: import('vue').PropType<import('
|
|
105
|
+
type: import('vue').PropType<import('..').TableRowSelection | null>;
|
|
106
106
|
default: null;
|
|
107
107
|
};
|
|
108
108
|
title: {
|
|
@@ -128,7 +128,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
128
128
|
};
|
|
129
129
|
loading: BooleanConstructor;
|
|
130
130
|
rowClassName: {
|
|
131
|
-
type: import('vue').PropType<(record: import('
|
|
131
|
+
type: import('vue').PropType<(record: import('..').TableCustomRecord<unknown>, index: number) => string>;
|
|
132
132
|
};
|
|
133
133
|
scroll: {
|
|
134
134
|
type: import('vue').PropType<{
|
|
@@ -168,10 +168,15 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
168
168
|
}>, {
|
|
169
169
|
formRef: import('vue').Ref<null, null>;
|
|
170
170
|
tableElRef: import('vue').Ref<null, null>;
|
|
171
|
+
wrapRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
|
|
171
172
|
getBindValues: import('vue').ComputedRef<IObject>;
|
|
173
|
+
getWrapperClass: import('vue').ComputedRef<import('vue').ClassValue[]>;
|
|
172
174
|
handleTableChange: (...args: unknown[]) => void;
|
|
173
|
-
expandKeysList: import('vue').Ref<
|
|
175
|
+
expandKeysList: import('vue').Ref<string[], string[]>;
|
|
174
176
|
getEmptyDataIsShowTable: import('vue').ComputedRef<boolean>;
|
|
177
|
+
slotNames: import('vue').ComputedRef<string[]>;
|
|
178
|
+
emptyFull: boolean;
|
|
179
|
+
redoHeight: () => void;
|
|
175
180
|
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "change"[], "change", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
|
|
176
181
|
clickToRowSelect: {
|
|
177
182
|
type: BooleanConstructor;
|
|
@@ -179,7 +184,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
179
184
|
};
|
|
180
185
|
isTreeTable: BooleanConstructor;
|
|
181
186
|
tableSetting: {
|
|
182
|
-
type: import('vue').PropType<import('
|
|
187
|
+
type: import('vue').PropType<import('..').TableSetting>;
|
|
183
188
|
default: {};
|
|
184
189
|
};
|
|
185
190
|
inset: BooleanConstructor;
|
|
@@ -243,7 +248,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
243
248
|
};
|
|
244
249
|
useSearchForm: BooleanConstructor;
|
|
245
250
|
columns: {
|
|
246
|
-
type: import('vue').PropType<import('
|
|
251
|
+
type: import('vue').PropType<import('..').BasicColumn[]>;
|
|
247
252
|
default: () => never[];
|
|
248
253
|
};
|
|
249
254
|
showIndexColumn: {
|
|
@@ -251,11 +256,11 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
251
256
|
default: boolean;
|
|
252
257
|
};
|
|
253
258
|
indexColumnProps: {
|
|
254
|
-
type: import('vue').PropType<import('
|
|
259
|
+
type: import('vue').PropType<import('..').BasicColumn>;
|
|
255
260
|
default: null;
|
|
256
261
|
};
|
|
257
262
|
actionColumn: {
|
|
258
|
-
type: import('vue').PropType<import('
|
|
263
|
+
type: import('vue').PropType<import('..').BasicColumn>;
|
|
259
264
|
default: null;
|
|
260
265
|
};
|
|
261
266
|
ellipsis: {
|
|
@@ -276,7 +281,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
276
281
|
default: number;
|
|
277
282
|
};
|
|
278
283
|
rowSelection: {
|
|
279
|
-
type: import('vue').PropType<import('
|
|
284
|
+
type: import('vue').PropType<import('..').TableRowSelection | null>;
|
|
280
285
|
default: null;
|
|
281
286
|
};
|
|
282
287
|
title: {
|
|
@@ -302,7 +307,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
302
307
|
};
|
|
303
308
|
loading: BooleanConstructor;
|
|
304
309
|
rowClassName: {
|
|
305
|
-
type: import('vue').PropType<(record: import('
|
|
310
|
+
type: import('vue').PropType<(record: import('..').TableCustomRecord<unknown>, index: number) => string>;
|
|
306
311
|
};
|
|
307
312
|
scroll: {
|
|
308
313
|
type: import('vue').PropType<{
|
|
@@ -344,7 +349,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
344
349
|
}>, {
|
|
345
350
|
clickToRowSelect: boolean;
|
|
346
351
|
isTreeTable: boolean;
|
|
347
|
-
tableSetting: import('
|
|
352
|
+
tableSetting: import('..').TableSetting;
|
|
348
353
|
inset: boolean;
|
|
349
354
|
showTableSetting: boolean;
|
|
350
355
|
autoCreateKey: boolean;
|
|
@@ -363,16 +368,16 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
363
368
|
searchInfo: Recordable<unknown>;
|
|
364
369
|
defSort: Recordable<unknown>;
|
|
365
370
|
useSearchForm: boolean;
|
|
366
|
-
columns: import('
|
|
371
|
+
columns: import('..').BasicColumn[];
|
|
367
372
|
showIndexColumn: boolean;
|
|
368
|
-
indexColumnProps: import('
|
|
369
|
-
actionColumn: import('
|
|
373
|
+
indexColumnProps: import('..').BasicColumn;
|
|
374
|
+
actionColumn: import('..').BasicColumn;
|
|
370
375
|
ellipsis: boolean;
|
|
371
376
|
isCanResizeParent: boolean;
|
|
372
377
|
canResize: boolean;
|
|
373
378
|
clearSelectOnPageChange: boolean;
|
|
374
379
|
resizeHeightOffset: number;
|
|
375
|
-
rowSelection: import('
|
|
380
|
+
rowSelection: import('..').TableRowSelection<unknown> | null;
|
|
376
381
|
title: string | ((data: Recordable) => string);
|
|
377
382
|
dataSource: Recordable<unknown>[];
|
|
378
383
|
rowKey: string | ((record: Recordable) => string);
|
|
@@ -391,18 +396,18 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
391
396
|
}, {}, {
|
|
392
397
|
HeaderCell: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
|
|
393
398
|
column: {
|
|
394
|
-
type: import('vue').PropType<import('
|
|
399
|
+
type: import('vue').PropType<import('..').BasicColumn>;
|
|
395
400
|
default: () => {};
|
|
396
401
|
};
|
|
397
402
|
}>, {
|
|
398
403
|
getTitle: import('vue').ComputedRef<void | string | number | boolean | JSX.Element | import('vue').VNodeArrayChildren | ((props: import('ant-design-vue/lib/table/interface').ColumnTitleProps<Recordable<unknown>>) => import('ant-design-vue/lib/_util/type').VueNode) | null>;
|
|
399
404
|
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
|
|
400
405
|
column: {
|
|
401
|
-
type: import('vue').PropType<import('
|
|
406
|
+
type: import('vue').PropType<import('..').BasicColumn>;
|
|
402
407
|
default: () => {};
|
|
403
408
|
};
|
|
404
409
|
}>> & Readonly<{}>, {
|
|
405
|
-
column: import('
|
|
410
|
+
column: import('..').BasicColumn;
|
|
406
411
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
407
412
|
}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
408
413
|
export default _default;
|
|
@@ -1,36 +1,33 @@
|
|
|
1
1
|
import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.mjs";
|
|
2
2
|
import BasicTable_vue_vue_type_script_lang_default from "./BasicTable.vue_vue_type_script_lang.mjs";
|
|
3
|
-
import
|
|
3
|
+
import './BasicTable.vue_vue_type_style_index_0_lang.css';/* empty css */
|
|
4
|
+
import { createElementBlock, createSlots, createVNode, guardReactiveProps, mergeProps, normalizeClass, normalizeProps, openBlock, renderList, renderSlot, resolveComponent, vShow, withCtx, withDirectives } from "vue";
|
|
4
5
|
//#region src/components/v-ben-table/src/BasicTable.vue
|
|
5
|
-
var _hoisted_1 = { ref: "wrapRef" };
|
|
6
|
-
var _hoisted_2 = {
|
|
7
|
-
key: 0,
|
|
8
|
-
class: "pr26px"
|
|
9
|
-
};
|
|
10
|
-
var _hoisted_3 = {
|
|
11
|
-
key: 1,
|
|
12
|
-
class: "pr8px"
|
|
13
|
-
};
|
|
14
6
|
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
15
7
|
const _component_HeaderCell = resolveComponent("HeaderCell");
|
|
16
8
|
const _component_a_table = resolveComponent("a-table");
|
|
17
|
-
return openBlock(), createElementBlock("div",
|
|
9
|
+
return openBlock(), createElementBlock("div", {
|
|
10
|
+
ref: "wrapRef",
|
|
11
|
+
class: normalizeClass(_ctx.getWrapperClass)
|
|
12
|
+
}, [renderSlot(_ctx.$slots, "beforeTable"), withDirectives(createVNode(_component_a_table, mergeProps({ ref: "tableElRef" }, _ctx.getBindValues, {
|
|
18
13
|
"expanded-row-keys": _ctx.expandKeysList,
|
|
19
14
|
"onUpdate:expandedRowKeys": _cache[0] || (_cache[0] = ($event) => _ctx.expandKeysList = $event),
|
|
15
|
+
class: _ctx.emptyFull ? "empty-basic-table-wrapper" : "",
|
|
20
16
|
onChange: _ctx.handleTableChange
|
|
21
17
|
}), createSlots({
|
|
22
|
-
headerCell: withCtx(({ column }) => [
|
|
23
|
-
key: 1,
|
|
24
|
-
column
|
|
25
|
-
}, null, 8, ["column"]))]),
|
|
18
|
+
headerCell: withCtx(({ column }) => [createVNode(_component_HeaderCell, { column }, null, 8, ["column"])]),
|
|
26
19
|
bodyCell: withCtx((data) => [renderSlot(_ctx.$slots, "bodyCell", normalizeProps(guardReactiveProps(data || {})))]),
|
|
27
20
|
_: 2
|
|
28
|
-
}, [renderList(
|
|
21
|
+
}, [renderList(_ctx.slotNames, (slotName) => {
|
|
29
22
|
return {
|
|
30
|
-
name:
|
|
31
|
-
fn: withCtx((data) => [renderSlot(_ctx.$slots,
|
|
23
|
+
name: slotName,
|
|
24
|
+
fn: withCtx((data) => [renderSlot(_ctx.$slots, slotName, normalizeProps(guardReactiveProps(data || {})))])
|
|
32
25
|
};
|
|
33
|
-
})]), 1040, [
|
|
26
|
+
})]), 1040, [
|
|
27
|
+
"expanded-row-keys",
|
|
28
|
+
"class",
|
|
29
|
+
"onChange"
|
|
30
|
+
]), [[vShow, _ctx.getEmptyDataIsShowTable]])], 2);
|
|
34
31
|
}
|
|
35
32
|
var BasicTable_default = /* @__PURE__ */ _plugin_vue_export_helper_default(BasicTable_vue_vue_type_script_lang_default, [["render", _sfc_render]]);
|
|
36
33
|
//#endregion
|
|
@@ -1,40 +1,104 @@
|
|
|
1
1
|
import HeaderCell_default from "./components/HeaderCell.vue.mjs";
|
|
2
|
-
import { basicProps } from "./props.mjs";
|
|
3
|
-
import {
|
|
2
|
+
import { basicProps, basicTableInternalPropKeys } from "./props.mjs";
|
|
3
|
+
import { useColumns } from "./hooks/useColumns.mjs";
|
|
4
|
+
import { usePagination } from "./hooks/usePagination.mjs";
|
|
5
|
+
import { useTableScroll } from "./hooks/useTableScroll.mjs";
|
|
6
|
+
import { useDesign } from "../../../hooks/useDesign.mjs";
|
|
7
|
+
import { computed, defineComponent, ref, toRaw, unref } from "vue";
|
|
4
8
|
import { omit } from "lodash-es";
|
|
5
9
|
//#region src/components/v-ben-table/src/BasicTable.vue?vue&type=script&lang.ts
|
|
10
|
+
var RESERVED_SLOT_NAMES = ["headerCell", "bodyCell"];
|
|
6
11
|
var BasicTable_vue_vue_type_script_lang_default = defineComponent({
|
|
7
12
|
name: "BasicTable",
|
|
8
13
|
components: { HeaderCell: HeaderCell_default },
|
|
9
14
|
props: basicProps,
|
|
10
15
|
emits: ["change"],
|
|
11
|
-
setup(props, { attrs, emit }) {
|
|
16
|
+
setup(props, { attrs, emit, slots, expose }) {
|
|
12
17
|
const tableElRef = ref(null);
|
|
13
|
-
const expandKeysList = ref([]);
|
|
18
|
+
const expandKeysList = ref([...props.expandedRowKeys ?? []]);
|
|
19
|
+
const wrapRef = ref(null);
|
|
14
20
|
const formRef = ref(null);
|
|
21
|
+
const { prefixCls } = useDesign("basic-table");
|
|
22
|
+
const getProps = computed(() => {
|
|
23
|
+
return {
|
|
24
|
+
...props,
|
|
25
|
+
...attrs
|
|
26
|
+
};
|
|
27
|
+
});
|
|
28
|
+
const { getPaginationInfo, setPagination, getPagination, getShowPagination, setShowPagination } = usePagination(getProps);
|
|
29
|
+
const getPaginationRef = computed(() => unref(getPaginationInfo));
|
|
30
|
+
const getRowSelectionRef = computed(() => {
|
|
31
|
+
return unref(getProps).rowSelection ?? null;
|
|
32
|
+
});
|
|
33
|
+
const getDataSourceRef = computed(() => {
|
|
34
|
+
return unref(getProps).dataSource ?? [];
|
|
35
|
+
});
|
|
36
|
+
const { getViewColumns, getColumnsRef } = useColumns(getProps, getPaginationRef);
|
|
37
|
+
const { getScrollRef, redoHeight } = useTableScroll(getProps, tableElRef, getColumnsRef, getRowSelectionRef, getPaginationRef, getDataSourceRef, wrapRef, formRef);
|
|
15
38
|
const getBindValues = computed(() => {
|
|
16
|
-
let propsData = {
|
|
17
|
-
|
|
39
|
+
let propsData = {
|
|
40
|
+
...attrs,
|
|
41
|
+
...unref(getProps),
|
|
42
|
+
scroll: unref(getScrollRef),
|
|
43
|
+
tableLayout: "fixed",
|
|
44
|
+
columns: toRaw(unref(getViewColumns)),
|
|
45
|
+
pagination: toRaw(unref(getPaginationInfo)),
|
|
46
|
+
rowSelection: unref(getRowSelectionRef),
|
|
47
|
+
dataSource: unref(getDataSourceRef)
|
|
48
|
+
};
|
|
49
|
+
propsData = omit(propsData, [
|
|
50
|
+
...basicTableInternalPropKeys,
|
|
51
|
+
"class",
|
|
52
|
+
"onChange"
|
|
53
|
+
]);
|
|
18
54
|
return propsData;
|
|
19
55
|
});
|
|
56
|
+
const getWrapperClass = computed(() => {
|
|
57
|
+
const values = unref(getBindValues);
|
|
58
|
+
return [
|
|
59
|
+
prefixCls,
|
|
60
|
+
attrs.class,
|
|
61
|
+
{
|
|
62
|
+
[`${prefixCls}-form-container`]: values.useSearchForm,
|
|
63
|
+
[`${prefixCls}--inset`]: values.inset
|
|
64
|
+
}
|
|
65
|
+
];
|
|
66
|
+
});
|
|
20
67
|
function handleTableChange(...args) {
|
|
21
68
|
emit("change", ...args);
|
|
69
|
+
const { onChange } = unref(getProps);
|
|
70
|
+
if (onChange && typeof onChange === "function") onChange(...args);
|
|
22
71
|
}
|
|
72
|
+
const getEmptyDataIsShowTable = computed(() => {
|
|
73
|
+
const { emptyDataIsShowTable, useSearchForm, dataSource } = props;
|
|
74
|
+
if (emptyDataIsShowTable || !useSearchForm) return true;
|
|
75
|
+
return !!dataSource?.length;
|
|
76
|
+
});
|
|
77
|
+
const slotNames = computed(() => Object.keys(slots).filter((name) => !RESERVED_SLOT_NAMES.includes(name)));
|
|
78
|
+
expose({
|
|
79
|
+
redoHeight,
|
|
80
|
+
setPagination,
|
|
81
|
+
getPagination,
|
|
82
|
+
getShowPagination,
|
|
83
|
+
setShowPagination
|
|
84
|
+
});
|
|
23
85
|
return {
|
|
24
86
|
formRef,
|
|
25
87
|
tableElRef,
|
|
88
|
+
wrapRef,
|
|
26
89
|
getBindValues,
|
|
90
|
+
getWrapperClass,
|
|
27
91
|
handleTableChange,
|
|
28
92
|
expandKeysList,
|
|
29
|
-
getEmptyDataIsShowTable
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
})
|
|
93
|
+
getEmptyDataIsShowTable,
|
|
94
|
+
slotNames,
|
|
95
|
+
emptyFull: props.emptyFull,
|
|
96
|
+
redoHeight
|
|
34
97
|
};
|
|
35
98
|
},
|
|
36
99
|
mounted() {
|
|
37
|
-
this.expandKeysList = this.getBindValues.expandedRowKeys;
|
|
100
|
+
this.expandKeysList = this.getBindValues.expandedRowKeys ?? [];
|
|
101
|
+
this.redoHeight();
|
|
38
102
|
}
|
|
39
103
|
});
|
|
40
104
|
//#endregion
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
.vben-basic-table {
|
|
2
|
+
max-width: 100%;
|
|
3
|
+
height: 100%;
|
|
4
|
+
}
|
|
5
|
+
.vben-basic-table .ant-table-tbody > tr > td,
|
|
6
|
+
.vben-basic-table .ant-table-thead > tr > td,
|
|
7
|
+
.vben-basic-table .ant-table-tbody > tr > th,
|
|
8
|
+
.vben-basic-table .ant-table-thead > tr > th {
|
|
9
|
+
border-right: 1px solid transparent !important;
|
|
10
|
+
}
|
|
11
|
+
.vben-basic-table-form-container {
|
|
12
|
+
padding: 16px;
|
|
13
|
+
}
|
|
14
|
+
.vben-basic-table-form-container .ant-form {
|
|
15
|
+
width: 100%;
|
|
16
|
+
margin-bottom: 16px;
|
|
17
|
+
padding: 12px 10px 6px;
|
|
18
|
+
border-radius: 2px;
|
|
19
|
+
}
|
|
20
|
+
.vben-basic-table .ant-table-cell .ant-tag {
|
|
21
|
+
margin-right: 0;
|
|
22
|
+
}
|
|
23
|
+
.vben-basic-table .ant-table-wrapper {
|
|
24
|
+
padding: 6px;
|
|
25
|
+
border-radius: 2px;
|
|
26
|
+
}
|
|
27
|
+
.vben-basic-table .ant-table-wrapper .ant-table-title {
|
|
28
|
+
padding: 0 0 8px !important;
|
|
29
|
+
}
|
|
30
|
+
.vben-basic-table .ant-table-wrapper .ant-table.ant-table-bordered .ant-table-title {
|
|
31
|
+
border: none !important;
|
|
32
|
+
}
|
|
33
|
+
.vben-basic-table .empty-basic-table-wrapper.ant-table-wrapper:has(
|
|
34
|
+
div.ant-spin-nested-loading > div.ant-spin-container > div.ant-table-empty
|
|
35
|
+
) .ant-spin-nested-loading > div.ant-spin-container > div.ant-table-empty > div.ant-table-container > div.ant-table-body {
|
|
36
|
+
max-height: none !important;
|
|
37
|
+
}
|
|
38
|
+
.vben-basic-table .ant-table {
|
|
39
|
+
width: 100%;
|
|
40
|
+
overflow-x: hidden;
|
|
41
|
+
}
|
|
42
|
+
.vben-basic-table .ant-pagination {
|
|
43
|
+
margin: 10px 0 0 !important;
|
|
44
|
+
}
|
|
45
|
+
.vben-basic-table--inset .ant-table-wrapper {
|
|
46
|
+
padding: 0;
|
|
47
|
+
}
|
|
48
|
+
.ant-table-thead th {
|
|
49
|
+
background-color: #f5f5f5;
|
|
50
|
+
}
|
package/es/components/v-ben-table/src/components/TableAction.vue_vue_type_script_setup_true_lang.mjs
CHANGED
|
@@ -3,18 +3,12 @@ import { PopConfirmButton } from "../../../v-ben-button/index.mjs";
|
|
|
3
3
|
import { Dropdown as Dropdown$1 } from "../../../v-ben-dropdown/index.mjs";
|
|
4
4
|
import "../../../index.mjs";
|
|
5
5
|
import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createVNode, defineComponent, mergeProps, normalizeClass, openBlock, renderList, renderSlot, resolveComponent, toDisplayString, toRaw, unref, withCtx } from "vue";
|
|
6
|
+
import { permission, useNamespace } from "@gct-paas/core";
|
|
6
7
|
import { MoreOutlined } from "@ant-design/icons-vue";
|
|
7
8
|
import { Divider, Tooltip } from "ant-design-vue";
|
|
8
|
-
import { permission, useNamespace } from "@gct-paas/core";
|
|
9
9
|
//#region src/components/v-ben-table/src/components/TableAction.vue?vue&type=script&setup=true&lang.ts
|
|
10
|
-
var _hoisted_1 = {
|
|
11
|
-
|
|
12
|
-
class: "text-14px"
|
|
13
|
-
};
|
|
14
|
-
var _hoisted_2 = {
|
|
15
|
-
key: 0,
|
|
16
|
-
class: "text-14px"
|
|
17
|
-
};
|
|
10
|
+
var _hoisted_1 = { key: 0 };
|
|
11
|
+
var _hoisted_2 = { key: 0 };
|
|
18
12
|
var TableAction_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
|
|
19
13
|
__name: "TableAction",
|
|
20
14
|
props: {
|
|
@@ -3,18 +3,12 @@ import { PopConfirmButton } from "../../../v-ben-button/index.mjs";
|
|
|
3
3
|
import { Dropdown as Dropdown$1 } from "../../../v-ben-dropdown/index.mjs";
|
|
4
4
|
import "../../../index.mjs";
|
|
5
5
|
import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createVNode, defineComponent, mergeProps, normalizeClass, openBlock, renderList, renderSlot, resolveComponent, toDisplayString, toRaw, unref, withCtx, withModifiers } from "vue";
|
|
6
|
+
import { permission, useNamespace } from "@gct-paas/core";
|
|
6
7
|
import { MoreOutlined } from "@ant-design/icons-vue";
|
|
7
8
|
import { Divider, Tooltip } from "ant-design-vue";
|
|
8
|
-
import { permission, useNamespace } from "@gct-paas/core";
|
|
9
9
|
//#region src/components/v-ben-table/src/components/TableActionAuto.vue?vue&type=script&setup=true&lang.ts
|
|
10
|
-
var _hoisted_1 = {
|
|
11
|
-
|
|
12
|
-
class: "text-14px"
|
|
13
|
-
};
|
|
14
|
-
var _hoisted_2 = {
|
|
15
|
-
key: 0,
|
|
16
|
-
class: "text-14px"
|
|
17
|
-
};
|
|
10
|
+
var _hoisted_1 = { key: 0 };
|
|
11
|
+
var _hoisted_2 = { key: 0 };
|
|
18
12
|
var TableActionAuto_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
|
|
19
13
|
__name: "TableActionAuto",
|
|
20
14
|
props: {
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/** 默认列对齐 */
|
|
2
|
+
export declare const DEFAULT_ALIGN: "left";
|
|
3
|
+
export declare const INDEX_COLUMN_FLAG = "INDEX";
|
|
4
|
+
export declare const ACTION_COLUMN_FLAG = "ACTION";
|
|
5
|
+
/** 可选每页条数 */
|
|
6
|
+
export declare const PAGE_SIZE_OPTIONS: string[];
|
|
7
|
+
/** 默认每页条数 */
|
|
8
|
+
export declare const PAGE_SIZE = 20;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
//#region src/components/v-ben-table/src/const.ts
|
|
2
|
+
/** 默认列对齐 */
|
|
3
|
+
var DEFAULT_ALIGN = "left";
|
|
4
|
+
var INDEX_COLUMN_FLAG = "INDEX";
|
|
5
|
+
var ACTION_COLUMN_FLAG = "ACTION";
|
|
6
|
+
/** 可选每页条数 */
|
|
7
|
+
var PAGE_SIZE_OPTIONS = [
|
|
8
|
+
"20",
|
|
9
|
+
"50",
|
|
10
|
+
"80",
|
|
11
|
+
"100"
|
|
12
|
+
];
|
|
13
|
+
//#endregion
|
|
14
|
+
export { ACTION_COLUMN_FLAG, DEFAULT_ALIGN, INDEX_COLUMN_FLAG, PAGE_SIZE_OPTIONS };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { BasicColumn, BasicTableProps } from '../types/table';
|
|
2
|
+
import { PaginationProps } from '../types/pagination';
|
|
3
|
+
import { ComputedRef } from 'vue';
|
|
4
|
+
export declare function useColumns(propsRef: ComputedRef<BasicTableProps>, getPaginationRef: ComputedRef<boolean | PaginationProps>): {
|
|
5
|
+
getColumnsRef: ComputedRef<BasicColumn[]>;
|
|
6
|
+
getViewColumns: ComputedRef<BasicColumn[]>;
|
|
7
|
+
};
|
|
@@ -0,0 +1,143 @@
|
|
|
1
|
+
import { isBoolean, isFunction } from "../../../../utils/is.mjs";
|
|
2
|
+
import { ACTION_COLUMN_FLAG, INDEX_COLUMN_FLAG } from "../const.mjs";
|
|
3
|
+
import { computed, ref, unref, watch } from "vue";
|
|
4
|
+
import { cloneDeep } from "lodash-es";
|
|
5
|
+
import { permission, t } from "@gct-paas/core";
|
|
6
|
+
//#region src/components/v-ben-table/src/hooks/useColumns.ts
|
|
7
|
+
function handleItem(item, ellipsis) {
|
|
8
|
+
const { key, dataIndex, children } = item;
|
|
9
|
+
item.align = item.align || "left";
|
|
10
|
+
if (ellipsis) {
|
|
11
|
+
if (!key && dataIndex !== void 0) item.key = Array.isArray(dataIndex) ? dataIndex.join(".") : String(dataIndex);
|
|
12
|
+
if (!isBoolean(item.ellipsis)) Object.assign(item, { ellipsis: { showTitle: false } });
|
|
13
|
+
}
|
|
14
|
+
if (children && children.length) handleChildren(children, !!ellipsis);
|
|
15
|
+
const originalCustomCell = item.customCell;
|
|
16
|
+
/** 只有内容超出的时候才出 title */
|
|
17
|
+
item.customCell = (record, rowIndex) => {
|
|
18
|
+
return {
|
|
19
|
+
...originalCustomCell && originalCustomCell(record, rowIndex),
|
|
20
|
+
onMouseenter(event) {
|
|
21
|
+
if (!item.ellipsis) return;
|
|
22
|
+
const el = event.target;
|
|
23
|
+
if (el.scrollWidth > el.clientWidth) el.setAttribute("title", el.textContent ?? "");
|
|
24
|
+
}
|
|
25
|
+
};
|
|
26
|
+
};
|
|
27
|
+
}
|
|
28
|
+
function handleChildren(children, ellipsis) {
|
|
29
|
+
if (!children) return;
|
|
30
|
+
children.forEach((item) => {
|
|
31
|
+
const { children: childCols } = item;
|
|
32
|
+
handleItem(item, ellipsis);
|
|
33
|
+
handleChildren(childCols, ellipsis);
|
|
34
|
+
});
|
|
35
|
+
}
|
|
36
|
+
function handleIndexColumn(propsRef, getPaginationRef, columns) {
|
|
37
|
+
const { showIndexColumn, indexColumnProps, isTreeTable } = unref(propsRef);
|
|
38
|
+
let pushIndexColumns = false;
|
|
39
|
+
if (unref(isTreeTable)) return;
|
|
40
|
+
columns.forEach(() => {
|
|
41
|
+
const indIndex = columns.findIndex((column) => column.flag === INDEX_COLUMN_FLAG);
|
|
42
|
+
if (showIndexColumn) pushIndexColumns = indIndex === -1;
|
|
43
|
+
else if (!showIndexColumn && indIndex !== -1) columns.splice(indIndex, 1);
|
|
44
|
+
});
|
|
45
|
+
if (!pushIndexColumns) return;
|
|
46
|
+
const isFixedLeft = columns.some((item) => item.fixed === "left");
|
|
47
|
+
columns.unshift({
|
|
48
|
+
flag: INDEX_COLUMN_FLAG,
|
|
49
|
+
width: 70,
|
|
50
|
+
title: t("sys.component.table.index"),
|
|
51
|
+
align: "center",
|
|
52
|
+
customRender: ({ index }) => {
|
|
53
|
+
const getPagination = unref(getPaginationRef);
|
|
54
|
+
if (isBoolean(getPagination)) return `${index + 1}`;
|
|
55
|
+
const { current = 1, pageSize = 20 } = getPagination;
|
|
56
|
+
return ((current < 1 ? 1 : current) - 1) * pageSize + index + 1;
|
|
57
|
+
},
|
|
58
|
+
...isFixedLeft ? { fixed: "left" } : {},
|
|
59
|
+
...indexColumnProps
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
function handleActionColumn(propsRef, columns) {
|
|
63
|
+
const { actionColumn } = unref(propsRef);
|
|
64
|
+
if (!actionColumn) return;
|
|
65
|
+
const hasIndex = columns.findIndex((column) => column.flag === ACTION_COLUMN_FLAG);
|
|
66
|
+
if (hasIndex === -1) columns.push({
|
|
67
|
+
...columns[hasIndex],
|
|
68
|
+
fixed: "right",
|
|
69
|
+
...actionColumn,
|
|
70
|
+
flag: ACTION_COLUMN_FLAG
|
|
71
|
+
});
|
|
72
|
+
}
|
|
73
|
+
function sortFixedColumn(columns) {
|
|
74
|
+
const fixedLeftColumns = [];
|
|
75
|
+
const fixedRightColumns = [];
|
|
76
|
+
const defColumns = [];
|
|
77
|
+
for (const column of columns) {
|
|
78
|
+
if (column.fixed === "left") {
|
|
79
|
+
fixedLeftColumns.push(column);
|
|
80
|
+
continue;
|
|
81
|
+
}
|
|
82
|
+
if (column.fixed === "right") {
|
|
83
|
+
fixedRightColumns.push(column);
|
|
84
|
+
continue;
|
|
85
|
+
}
|
|
86
|
+
defColumns.push(column);
|
|
87
|
+
}
|
|
88
|
+
return [
|
|
89
|
+
...fixedLeftColumns,
|
|
90
|
+
...defColumns,
|
|
91
|
+
...fixedRightColumns
|
|
92
|
+
].filter((item) => !item.defaultHidden);
|
|
93
|
+
}
|
|
94
|
+
function hasColumnAuth(auth) {
|
|
95
|
+
if (!auth) return true;
|
|
96
|
+
if (Array.isArray(auth)) return auth.some((key) => permission.has(String(key)));
|
|
97
|
+
return permission.has(String(auth));
|
|
98
|
+
}
|
|
99
|
+
function isIfShow(column) {
|
|
100
|
+
const ifShow = column.ifShow;
|
|
101
|
+
if (isBoolean(ifShow)) return ifShow;
|
|
102
|
+
if (isFunction(ifShow)) return ifShow(column);
|
|
103
|
+
return true;
|
|
104
|
+
}
|
|
105
|
+
function useColumns(propsRef, getPaginationRef) {
|
|
106
|
+
const columnsRef = ref(unref(propsRef).columns);
|
|
107
|
+
const getColumnsRef = computed(() => {
|
|
108
|
+
const columns = cloneDeep(unref(columnsRef));
|
|
109
|
+
handleIndexColumn(propsRef, getPaginationRef, columns);
|
|
110
|
+
handleActionColumn(propsRef, columns);
|
|
111
|
+
if (!columns) return [];
|
|
112
|
+
const { ellipsis } = unref(propsRef);
|
|
113
|
+
columns.forEach((item) => {
|
|
114
|
+
const { customRender, slots } = item;
|
|
115
|
+
handleItem(item, Reflect.has(item, "ellipsis") ? !!item.ellipsis : !!ellipsis && !customRender && !slots);
|
|
116
|
+
});
|
|
117
|
+
return columns;
|
|
118
|
+
});
|
|
119
|
+
const getViewColumns = computed(() => {
|
|
120
|
+
const viewColumns = sortFixedColumn(unref(getColumnsRef));
|
|
121
|
+
const mapFn = (column) => {
|
|
122
|
+
const { slots } = column;
|
|
123
|
+
if (!slots || !slots?.title) {
|
|
124
|
+
column.customTitle = column.title;
|
|
125
|
+
Reflect.deleteProperty(column, "title");
|
|
126
|
+
}
|
|
127
|
+
return column;
|
|
128
|
+
};
|
|
129
|
+
return cloneDeep(viewColumns).filter((column) => hasColumnAuth(column.auth) && isIfShow(column)).map((column) => {
|
|
130
|
+
if (column.children?.length) column.children = column.children.map(mapFn);
|
|
131
|
+
return mapFn(column);
|
|
132
|
+
});
|
|
133
|
+
});
|
|
134
|
+
watch(() => unref(propsRef).columns, (columns) => {
|
|
135
|
+
columnsRef.value = columns;
|
|
136
|
+
});
|
|
137
|
+
return {
|
|
138
|
+
getColumnsRef,
|
|
139
|
+
getViewColumns
|
|
140
|
+
};
|
|
141
|
+
}
|
|
142
|
+
//#endregion
|
|
143
|
+
export { useColumns };
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { PaginationProps } from '../types/pagination';
|
|
2
|
+
import { BasicTableProps } from '../types/table';
|
|
3
|
+
import { ComputedRef } from 'vue';
|
|
4
|
+
export declare function usePagination(refProps: ComputedRef<BasicTableProps>): {
|
|
5
|
+
getPagination: () => boolean | PaginationProps;
|
|
6
|
+
getPaginationInfo: ComputedRef<boolean | PaginationProps>;
|
|
7
|
+
setShowPagination: (flag: boolean) => Promise<void>;
|
|
8
|
+
getShowPagination: () => boolean;
|
|
9
|
+
setPagination: (info: Partial<PaginationProps>) => void;
|
|
10
|
+
};
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import { isBoolean } from "../../../../utils/is.mjs";
|
|
2
|
+
import { PAGE_SIZE_OPTIONS } from "../const.mjs";
|
|
3
|
+
import { computed, h, ref, unref, watch } from "vue";
|
|
4
|
+
import { t } from "@gct-paas/core";
|
|
5
|
+
import { LeftOutlined, RightOutlined } from "@ant-design/icons-vue";
|
|
6
|
+
//#region src/components/v-ben-table/src/hooks/usePagination.ts
|
|
7
|
+
function itemRender({ page, type, originalElement }) {
|
|
8
|
+
if (type === "prev") return page === 0 ? null : h(LeftOutlined);
|
|
9
|
+
if (type === "next") return page === 1 ? null : h(RightOutlined);
|
|
10
|
+
return originalElement;
|
|
11
|
+
}
|
|
12
|
+
function usePagination(refProps) {
|
|
13
|
+
const configRef = ref({});
|
|
14
|
+
const show = ref(true);
|
|
15
|
+
watch(() => unref(refProps).pagination, (pagination) => {
|
|
16
|
+
if (!isBoolean(pagination) && pagination) configRef.value = {
|
|
17
|
+
...unref(configRef),
|
|
18
|
+
...pagination
|
|
19
|
+
};
|
|
20
|
+
}, { deep: true });
|
|
21
|
+
const getPaginationInfo = computed(() => {
|
|
22
|
+
const { pagination } = unref(refProps);
|
|
23
|
+
if (!unref(show) || isBoolean(pagination) && !pagination) return false;
|
|
24
|
+
return {
|
|
25
|
+
current: 1,
|
|
26
|
+
pageSize: 20,
|
|
27
|
+
size: "small",
|
|
28
|
+
defaultPageSize: 20,
|
|
29
|
+
showTotal: (total) => t("sys.component.table.total", { total }),
|
|
30
|
+
showSizeChanger: true,
|
|
31
|
+
pageSizeOptions: PAGE_SIZE_OPTIONS,
|
|
32
|
+
itemRender,
|
|
33
|
+
showQuickJumper: true,
|
|
34
|
+
...isBoolean(pagination) ? {} : pagination ?? {},
|
|
35
|
+
...unref(configRef)
|
|
36
|
+
};
|
|
37
|
+
});
|
|
38
|
+
function setPagination(info) {
|
|
39
|
+
const paginationInfo = unref(getPaginationInfo);
|
|
40
|
+
configRef.value = {
|
|
41
|
+
...!isBoolean(paginationInfo) ? paginationInfo : {},
|
|
42
|
+
...info
|
|
43
|
+
};
|
|
44
|
+
}
|
|
45
|
+
function getPagination() {
|
|
46
|
+
return unref(getPaginationInfo);
|
|
47
|
+
}
|
|
48
|
+
function getShowPagination() {
|
|
49
|
+
return unref(show);
|
|
50
|
+
}
|
|
51
|
+
async function setShowPagination(flag) {
|
|
52
|
+
show.value = flag;
|
|
53
|
+
}
|
|
54
|
+
return {
|
|
55
|
+
getPagination,
|
|
56
|
+
getPaginationInfo,
|
|
57
|
+
setShowPagination,
|
|
58
|
+
getShowPagination,
|
|
59
|
+
setPagination
|
|
60
|
+
};
|
|
61
|
+
}
|
|
62
|
+
//#endregion
|
|
63
|
+
export { usePagination };
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { PaginationProps } from '../types/pagination';
|
|
2
|
+
import { BasicColumn, BasicTableProps, TableRowSelection } from '../types/table';
|
|
3
|
+
import { ComputedRef, Ref } from 'vue';
|
|
4
|
+
type TableComponentRef = {
|
|
5
|
+
$el: HTMLElement;
|
|
6
|
+
} | null;
|
|
7
|
+
type FormComponentRef = {
|
|
8
|
+
$el: HTMLElement;
|
|
9
|
+
} | null;
|
|
10
|
+
export declare function useTableScroll(propsRef: ComputedRef<BasicTableProps>, tableElRef: Ref<TableComponentRef>, columnsRef: ComputedRef<BasicColumn[]>, rowSelectionRef: ComputedRef<TableRowSelection | null>, getPaginationRef: ComputedRef<PaginationProps | boolean>, getDataSourceRef: ComputedRef<Recordable[]>, wrapRef: Ref<HTMLElement | null>, formRef: Ref<FormComponentRef>): {
|
|
11
|
+
getScrollRef: ComputedRef<{
|
|
12
|
+
x?: number | string | true;
|
|
13
|
+
y?: number | string;
|
|
14
|
+
} | undefined>;
|
|
15
|
+
redoHeight: () => void;
|
|
16
|
+
};
|
|
17
|
+
export {};
|
|
@@ -0,0 +1,126 @@
|
|
|
1
|
+
import { isBoolean } from "../../../../utils/is.mjs";
|
|
2
|
+
import { getViewportOffset } from "../utils/dom-utils.mjs";
|
|
3
|
+
import { computed, nextTick, onActivated, onMounted, ref, unref, watch } from "vue";
|
|
4
|
+
import { useDebounceFn, useEventListener } from "@vueuse/core";
|
|
5
|
+
//#region src/components/v-ben-table/src/hooks/useTableScroll.ts
|
|
6
|
+
function useTableScroll(propsRef, tableElRef, columnsRef, rowSelectionRef, getPaginationRef, getDataSourceRef, wrapRef, formRef) {
|
|
7
|
+
const tableHeightRef = ref(215);
|
|
8
|
+
const debounceRedoHeight = useDebounceFn(redoHeight, 100);
|
|
9
|
+
const getCanResize = computed(() => {
|
|
10
|
+
const { canResize, scroll } = unref(propsRef);
|
|
11
|
+
return canResize && !(scroll || {}).y;
|
|
12
|
+
});
|
|
13
|
+
watch(() => [unref(getCanResize), unref(getDataSourceRef)?.length], () => {
|
|
14
|
+
debounceRedoHeight();
|
|
15
|
+
}, { flush: "post" });
|
|
16
|
+
function redoHeight() {
|
|
17
|
+
nextTick(() => {
|
|
18
|
+
calcTableHeight();
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
function setHeight(height) {
|
|
22
|
+
tableHeightRef.value = height;
|
|
23
|
+
}
|
|
24
|
+
let paginationEl = null;
|
|
25
|
+
let footerEl = null;
|
|
26
|
+
let bodyEl = null;
|
|
27
|
+
async function calcTableHeight() {
|
|
28
|
+
const { resizeHeightOffset, maxHeight, isCanResizeParent, useSearchForm } = unref(propsRef);
|
|
29
|
+
const pagination = unref(getPaginationRef);
|
|
30
|
+
const tableData = unref(getDataSourceRef);
|
|
31
|
+
const table = unref(tableElRef);
|
|
32
|
+
if (!table) return;
|
|
33
|
+
const tableEl = table.$el;
|
|
34
|
+
if (!tableEl) return;
|
|
35
|
+
if (!bodyEl) {
|
|
36
|
+
bodyEl = tableEl.querySelector(".ant-table-body");
|
|
37
|
+
if (!bodyEl) return;
|
|
38
|
+
}
|
|
39
|
+
const hasScrollBarY = bodyEl.scrollHeight > bodyEl.clientHeight;
|
|
40
|
+
const hasScrollBarX = bodyEl.scrollWidth > bodyEl.clientWidth;
|
|
41
|
+
if (hasScrollBarY) {
|
|
42
|
+
if (tableEl.classList.contains("hide-scrollbar-y")) tableEl.classList.remove("hide-scrollbar-y");
|
|
43
|
+
} else if (!tableEl.classList.contains("hide-scrollbar-y")) tableEl.classList.add("hide-scrollbar-y");
|
|
44
|
+
if (hasScrollBarX) {
|
|
45
|
+
if (tableEl.classList.contains("hide-scrollbar-x")) tableEl.classList.remove("hide-scrollbar-x");
|
|
46
|
+
} else if (!tableEl.classList.contains("hide-scrollbar-x")) tableEl.classList.add("hide-scrollbar-x");
|
|
47
|
+
bodyEl.style.height = "unset";
|
|
48
|
+
if (!unref(getCanResize) || !unref(tableData) || tableData.length === 0) return;
|
|
49
|
+
await nextTick();
|
|
50
|
+
const headEl = tableEl.querySelector(".ant-table-thead ");
|
|
51
|
+
if (!headEl) return;
|
|
52
|
+
let paddingHeight = 32;
|
|
53
|
+
let paginationHeight = 12;
|
|
54
|
+
if (!isBoolean(pagination)) {
|
|
55
|
+
paginationEl = tableEl.querySelector(".ant-pagination");
|
|
56
|
+
if (paginationEl) {
|
|
57
|
+
const offsetHeight = paginationEl.offsetHeight;
|
|
58
|
+
paginationHeight += offsetHeight || 0;
|
|
59
|
+
} else paginationHeight += 24;
|
|
60
|
+
} else paginationHeight = -8;
|
|
61
|
+
let footerHeight = 0;
|
|
62
|
+
if (!isBoolean(pagination)) if (!footerEl) footerEl = tableEl.querySelector(".ant-table-footer");
|
|
63
|
+
else {
|
|
64
|
+
const offsetHeight = footerEl.offsetHeight;
|
|
65
|
+
footerHeight += offsetHeight || 0;
|
|
66
|
+
}
|
|
67
|
+
let headerHeight = 0;
|
|
68
|
+
if (headEl) headerHeight = headEl.offsetHeight;
|
|
69
|
+
let bottomIncludeBody = 0;
|
|
70
|
+
if (unref(wrapRef) && isCanResizeParent) {
|
|
71
|
+
const tablePadding = 12;
|
|
72
|
+
const formMargin = 16;
|
|
73
|
+
let paginationMargin = 10;
|
|
74
|
+
const wrapHeight = unref(wrapRef)?.offsetHeight ?? 0;
|
|
75
|
+
let formHeight = unref(formRef)?.$el.offsetHeight ?? 0;
|
|
76
|
+
if (formHeight) formHeight += formMargin;
|
|
77
|
+
if (isBoolean(pagination) && !pagination) paginationMargin = 0;
|
|
78
|
+
if (isBoolean(useSearchForm) && !useSearchForm) paddingHeight = 0;
|
|
79
|
+
const headerCellHeight = tableEl.querySelector(".ant-table-title")?.offsetHeight ?? 0;
|
|
80
|
+
bottomIncludeBody = wrapHeight - formHeight - headerCellHeight - tablePadding - paginationMargin;
|
|
81
|
+
} else bottomIncludeBody = getViewportOffset(headEl).bottomIncludeBody;
|
|
82
|
+
let height = bottomIncludeBody - (resizeHeightOffset || 0) - paddingHeight - paginationHeight - footerHeight - headerHeight;
|
|
83
|
+
height = (height > maxHeight ? maxHeight : height) ?? height;
|
|
84
|
+
setHeight(height);
|
|
85
|
+
if (pagination && !isBoolean(pagination)) {
|
|
86
|
+
const body = tableEl.querySelector(".ant-table-body");
|
|
87
|
+
if (body) body.style.height = `${height}px`;
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
useEventListener(window, "resize", useDebounceFn(calcTableHeight, 280));
|
|
91
|
+
function mountCalcHeight() {
|
|
92
|
+
calcTableHeight();
|
|
93
|
+
nextTick(() => {
|
|
94
|
+
debounceRedoHeight();
|
|
95
|
+
});
|
|
96
|
+
}
|
|
97
|
+
onMounted(mountCalcHeight);
|
|
98
|
+
onActivated(mountCalcHeight);
|
|
99
|
+
const getScrollX = computed(() => {
|
|
100
|
+
let width = 0;
|
|
101
|
+
if (unref(rowSelectionRef)) width += 60;
|
|
102
|
+
const NORMAL_WIDTH = 150;
|
|
103
|
+
const columns = unref(columnsRef).filter((item) => !item.defaultHidden);
|
|
104
|
+
columns.forEach((item) => {
|
|
105
|
+
width += Number.parseFloat(String(item.width)) || 0;
|
|
106
|
+
});
|
|
107
|
+
const len = columns.filter((item) => !Reflect.has(item, "width")).length;
|
|
108
|
+
if (len !== 0) width += len * NORMAL_WIDTH;
|
|
109
|
+
return (unref(tableElRef)?.$el?.offsetWidth ?? 0) > width ? void 0 : width;
|
|
110
|
+
});
|
|
111
|
+
return {
|
|
112
|
+
getScrollRef: computed(() => {
|
|
113
|
+
const tableHeight = unref(tableHeightRef);
|
|
114
|
+
const { canResize, scroll } = unref(propsRef);
|
|
115
|
+
return {
|
|
116
|
+
x: unref(getScrollX),
|
|
117
|
+
y: canResize ? tableHeight : null,
|
|
118
|
+
scrollToFirstRowOnChange: false,
|
|
119
|
+
...scroll
|
|
120
|
+
};
|
|
121
|
+
}),
|
|
122
|
+
redoHeight
|
|
123
|
+
};
|
|
124
|
+
}
|
|
125
|
+
//#endregion
|
|
126
|
+
export { useTableScroll };
|
|
@@ -184,3 +184,5 @@ export declare const basicProps: {
|
|
|
184
184
|
default: boolean;
|
|
185
185
|
};
|
|
186
186
|
};
|
|
187
|
+
/** BasicTable 自有配置，不传给 ant-design-vue Table */
|
|
188
|
+
export declare const basicTableInternalPropKeys: readonly ["clickToRowSelect", "isTreeTable", "tableSetting", "inset", "showTableSetting", "autoCreateKey", "striped", "showSummary", "summaryFunc", "summaryData", "indentSize", "canColDrag", "api", "beforeFetch", "afterFetch", "handleSearchInfoFn", "immediate", "emptyDataIsShowTable", "searchInfo", "defSort", "useSearchForm", "showIndexColumn", "indexColumnProps", "actionColumn", "ellipsis", "isCanResizeParent", "canResize", "clearSelectOnPageChange", "resizeHeightOffset", "titleHelpMessage", "beforeEditSubmit", "rowDraggable", "supportSameLevel", "rowDragApi", "emptyFull"];
|
|
@@ -168,5 +168,43 @@ var basicProps = {
|
|
|
168
168
|
default: false
|
|
169
169
|
}
|
|
170
170
|
};
|
|
171
|
+
/** BasicTable 自有配置，不传给 ant-design-vue Table */
|
|
172
|
+
var basicTableInternalPropKeys = [
|
|
173
|
+
"clickToRowSelect",
|
|
174
|
+
"isTreeTable",
|
|
175
|
+
"tableSetting",
|
|
176
|
+
"inset",
|
|
177
|
+
"showTableSetting",
|
|
178
|
+
"autoCreateKey",
|
|
179
|
+
"striped",
|
|
180
|
+
"showSummary",
|
|
181
|
+
"summaryFunc",
|
|
182
|
+
"summaryData",
|
|
183
|
+
"indentSize",
|
|
184
|
+
"canColDrag",
|
|
185
|
+
"api",
|
|
186
|
+
"beforeFetch",
|
|
187
|
+
"afterFetch",
|
|
188
|
+
"handleSearchInfoFn",
|
|
189
|
+
"immediate",
|
|
190
|
+
"emptyDataIsShowTable",
|
|
191
|
+
"searchInfo",
|
|
192
|
+
"defSort",
|
|
193
|
+
"useSearchForm",
|
|
194
|
+
"showIndexColumn",
|
|
195
|
+
"indexColumnProps",
|
|
196
|
+
"actionColumn",
|
|
197
|
+
"ellipsis",
|
|
198
|
+
"isCanResizeParent",
|
|
199
|
+
"canResize",
|
|
200
|
+
"clearSelectOnPageChange",
|
|
201
|
+
"resizeHeightOffset",
|
|
202
|
+
"titleHelpMessage",
|
|
203
|
+
"beforeEditSubmit",
|
|
204
|
+
"rowDraggable",
|
|
205
|
+
"supportSameLevel",
|
|
206
|
+
"rowDragApi",
|
|
207
|
+
"emptyFull"
|
|
208
|
+
];
|
|
171
209
|
//#endregion
|
|
172
|
-
export { basicProps };
|
|
210
|
+
export { basicProps, basicTableInternalPropKeys };
|
|
@@ -66,7 +66,7 @@ export interface PaginationProps {
|
|
|
66
66
|
* to display the total number and range
|
|
67
67
|
* @type Function
|
|
68
68
|
*/
|
|
69
|
-
showTotal?: (total: number, range
|
|
69
|
+
showTotal?: (total: number, range?: [number, number]) => string;
|
|
70
70
|
/**
|
|
71
71
|
* specify the size of Pagination, can be set to small
|
|
72
72
|
* @default ''
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
export interface IViewportOffsetResult {
|
|
2
|
+
left: number;
|
|
3
|
+
top: number;
|
|
4
|
+
right: number;
|
|
5
|
+
bottom: number;
|
|
6
|
+
rightIncludeBody: number;
|
|
7
|
+
bottomIncludeBody: number;
|
|
8
|
+
}
|
|
9
|
+
export declare function getBoundingClientRect(element: Element): DOMRect | number;
|
|
10
|
+
/**
|
|
11
|
+
* 获取元素相对视口的偏移，用于计算表格可用高度
|
|
12
|
+
*/
|
|
13
|
+
export declare function getViewportOffset(element: Element): IViewportOffsetResult;
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
//#region src/components/v-ben-table/src/utils/dom-utils.ts
|
|
2
|
+
function getBoundingClientRect(element) {
|
|
3
|
+
if (!element || !element.getBoundingClientRect) return 0;
|
|
4
|
+
return element.getBoundingClientRect();
|
|
5
|
+
}
|
|
6
|
+
/**
|
|
7
|
+
* 获取元素相对视口的偏移，用于计算表格可用高度
|
|
8
|
+
*/
|
|
9
|
+
function getViewportOffset(element) {
|
|
10
|
+
const doc = document.documentElement;
|
|
11
|
+
const docScrollLeft = doc.scrollLeft;
|
|
12
|
+
const docScrollTop = doc.scrollTop;
|
|
13
|
+
const docClientLeft = doc.clientLeft;
|
|
14
|
+
const docClientTop = doc.clientTop;
|
|
15
|
+
const pageXOffset = window.pageXOffset;
|
|
16
|
+
const pageYOffset = window.pageYOffset;
|
|
17
|
+
const { left: retLeft, top: rectTop, width: rectWidth, height: rectHeight } = getBoundingClientRect(element);
|
|
18
|
+
const scrollLeft = (pageXOffset || docScrollLeft) - (docClientLeft || 0);
|
|
19
|
+
const scrollTop = (pageYOffset || docScrollTop) - (docClientTop || 0);
|
|
20
|
+
const offsetLeft = retLeft + pageXOffset;
|
|
21
|
+
const offsetTop = rectTop + pageYOffset;
|
|
22
|
+
const left = offsetLeft - scrollLeft;
|
|
23
|
+
const top = offsetTop - scrollTop;
|
|
24
|
+
const clientWidth = window.document.documentElement.clientWidth;
|
|
25
|
+
const clientHeight = window.document.documentElement.clientHeight;
|
|
26
|
+
return {
|
|
27
|
+
left,
|
|
28
|
+
top,
|
|
29
|
+
right: clientWidth - rectWidth - left,
|
|
30
|
+
bottom: clientHeight - rectHeight - top,
|
|
31
|
+
rightIncludeBody: clientWidth - left,
|
|
32
|
+
bottomIncludeBody: clientHeight - top
|
|
33
|
+
};
|
|
34
|
+
}
|
|
35
|
+
//#endregion
|
|
36
|
+
export { getViewportOffset };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gct-paas/v-ben",
|
|
3
|
-
"version": "0.1.6-dev.
|
|
3
|
+
"version": "0.1.6-dev.15",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "paas 平台历史 v-ben 内容",
|
|
6
6
|
"loader": "dist/loader.esm.min.js",
|
|
@@ -41,14 +41,14 @@
|
|
|
41
41
|
"sortablejs": "^1.15.7",
|
|
42
42
|
"vue": "^3.5.30",
|
|
43
43
|
"vue-types": "^6.0.0",
|
|
44
|
-
"@gct-paas/core": "0.1.6-dev.
|
|
45
|
-
"@gct-paas/scss": "0.1.6-dev.
|
|
44
|
+
"@gct-paas/core": "0.1.6-dev.15",
|
|
45
|
+
"@gct-paas/scss": "0.1.6-dev.15"
|
|
46
46
|
},
|
|
47
47
|
"peerDependencies": {
|
|
48
48
|
"@gct-paas/api": "^0.1.6-dev.11",
|
|
49
49
|
"vue": ">=3",
|
|
50
|
-
"@gct-paas/core": "0.1.6-dev.
|
|
51
|
-
"@gct-paas/scss": "0.1.6-dev.
|
|
50
|
+
"@gct-paas/core": "0.1.6-dev.15",
|
|
51
|
+
"@gct-paas/scss": "0.1.6-dev.15"
|
|
52
52
|
},
|
|
53
53
|
"scripts": {
|
|
54
54
|
"dev": "cross-env NODE_ENV=development vite build --watch --config vite.dev.config.ts",
|