UNPKG

@blueking/vxe-table

Version:

一个基于 vue 的 PC 端表格组件,支持增删改查、虚拟树、列拖拽,懒加载、快捷菜单、数据校验、树形结构、打印、导入导出、自定义模板、渲染器、JSON 配置式...

1 lines 5.62 kB
var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../../ui"),_util=require("../../src/util"),_dom=require("../../../ui/src/dom"),_utils=require("../../../ui/src/utils");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let{renderer,hooks}=_ui.VxeUI,tableFilterMethodKeys=["openFilter","setFilter","clearFilter","saveFilterPanel","resetFilterPanel","getCheckedFilters","updateFilterOptionStatus"];hooks.add("tableFilterModule",{setupTable(c){let{props:d,reactData:h,internalData:n}=c,{refTableHeader:F,refTableBody:_,refTableFilter:g}=c.getRefMaps(),{computeFilterOpts:p,computeMouseOpts:v}=c.getComputeMaps(),i=e=>{var t=h.filterStore;t.options.forEach(e=>{e.checked=e._checked}),c.confirmFilterEvent(e)},a=(e,t,l)=>{var r=h.filterStore;r.options.forEach(e=>{e._checked=!1}),l._checked=t,c.checkFilterOptions(),i(e)},o=(e,t,l)=>{l._checked=t,c.checkFilterOptions()},e=e=>{var t=h.filterStore;c.handleClearFilter(t.column),c.confirmFilterEvent(e)},s={checkFilterOptions(){var e=h.filterStore;e.isAllSelected=e.options.every(e=>e._checked),e.isIndeterminate=!e.isAllSelected&&e.options.some(e=>e._checked)},triggerFilterEvent(e,v,t){let{initStore:l,filterStore:m}=h;if(m.column===v&&m.visible)m.visible=!1;else{let{target:d,pageX:h}=e,p=(0,_dom.getDomNode)().visibleWidth;var{filters:i,filterMultiple:a,filterRender:o}=v,o=(0,_utils.isEnableConf)(o)?renderer.get(o.name):null;let r=v.filterRecoverMethod||(o?o.tableFilterRecoverMethod||o.filterRecoverMethod:null);n._currFilterParams=t,Object.assign(m,{multiple:a,options:i,column:v,style:null}),m.options.forEach(e=>{var{_checked:t,checked:l}=e;(e._checked=l)||t===l||r&&r({option:e,column:v,$table:c})}),this.checkFilterOptions(),m.visible=!0,l.filter=!0,(0,_vue.nextTick)(()=>{var r=F.value,i=_.value,r=r?r.$el:null,i=i.$el;if(i){var a=g.value,a=a?a.$el:null;if(a){var o=a.offsetWidth,n=a.offsetHeight,s=a.querySelector(".vxe-table--filter-header"),a=a.querySelector(".vxe-table--filter-footer"),u=o/2,f=i.clientWidth-o-10;let e,t;var c={top:d.offsetTop+d.offsetParent.offsetTop+d.offsetHeight+"px"};let l=null;r=i.clientHeight-(r?r.clientHeight/2:0);r<=n&&(l=Math.max(40,r-(a?a.offsetHeight:0)-(s?s.offsetHeight:0))),"left"===v.fixed?e=d.offsetLeft+d.offsetParent.offsetLeft-u:"right"===v.fixed?t=d.offsetParent.offsetWidth-d.offsetLeft+(d.offsetParent.offsetParent.offsetWidth-d.offsetParent.offsetLeft)-v.renderWidth-u:e=d.offsetLeft+d.offsetParent.offsetLeft-u-i.scrollLeft,e?(0<(n=h+o-u+10-p)&&(e-=n),c.left=Math.min(f,Math.max(10,e))+"px"):t&&(0<(r=h+o-u+10-p)&&(t+=r),c.right=Math.max(10,t)+"px"),m.style=c,m.maxHeight=l}}})}c.dispatchEvent("filter-visible",{column:v,field:v.field,property:v.field,filterList:c.getCheckedFilters(),visible:m.visible},e)},handleClearFilter(e){if(e){var{filters:l,filterRender:r}=e;if(l){r=(0,_utils.isEnableConf)(r)?renderer.get(r.name):null;let t=e.filterResetMethod||(r?r.tableFilterResetMethod||r.filterResetMethod:null);l.forEach(e=>{e._checked=!1,e.checked=!1,t||(e.data=_xeUtils.default.clone(e.resetValue,!0))}),t&&t({options:l,column:e,$table:c})}}},handleColumnConfirmFilter(e,t){var l=d.mouseConfig;let{scrollXLoad:r,scrollYLoad:i}=h;var a=p.value,o=v.value,n=e.field;let s=[],u=[];e.filters.forEach(e=>{e.checked&&(s.push(e.value),u.push(e.data))});var f=c.getCheckedFilters(),e={$table:c,$event:t,column:e,field:n,property:n,values:s,datas:u,filters:f,filterList:f};return a.remote||(c.handleTableData(!0),c.checkSelectionStatus()),l&&o.area&&c.handleFilterEvent&&c.handleFilterEvent(t,e),t&&c.dispatchEvent("filter-change",e,t),c.closeFilter(),c.updateFooter().then(()=>{var{scrollXLoad:e,scrollYLoad:t}=h;if(r||e||i||t)return(r||e)&&c.updateScrollXSpace(),(i||t)&&c.updateScrollYSpace(),c.refreshScroll()}).then(()=>(c.updateCellAreas(),c.recalculate(!0))).then(()=>{setTimeout(()=>c.recalculate(),50)})},confirmFilterEvent(e){var t=h.filterStore,t=t.column;c.handleColumnConfirmFilter(t,e)},handleFilterChangeRadioOption:a,handleFilterChangeMultipleOption:o,handleFilterChangeOption(e,t,l){var r=h.filterStore;r.multiple?o(0,t,l):a(e,t,l)},handleFilterConfirmFilter:i,handleFilterResetFilter:e};return Object.assign(Object.assign({},{openFilter(e){let r=(0,_util.handleFieldOrColumn)(c,e);if(r&&r.filters){let t=n.elemStore,l=r.fixed;return c.scrollToColumn(r).then(()=>{var e=(0,_util.getRefElem)(t[`${l||"main"}-header-wrapper`]||t["main-header-wrapper"]);e&&(e=e.querySelector(`.vxe-header--column.${r.id} .vxe-filter--btn`),(0,_dom.triggerEvent)(e,"click"))})}return(0,_vue.nextTick)()},setFilter(e,t,l){e=(0,_util.handleFieldOrColumn)(c,e);return e&&e.filters&&(e.filters=(0,_util.toFilters)(t||[]),l)?c.handleColumnConfirmFilter(e,new Event("click")):(0,_vue.nextTick)()},clearFilter(e){var t=h.filterStore,l=n.tableFullColumn,r=p.value;let i;return e?(i=(0,_util.handleFieldOrColumn)(c,e))&&s.handleClearFilter(i):l.forEach(s.handleClearFilter),e&&i===t.column||Object.assign(t,{isAllSelected:!1,isIndeterminate:!1,style:null,options:[],column:null,multiple:!1,visible:!1}),r.remote?(0,_vue.nextTick)():c.updateData()},saveFilterPanel(){return i(null),(0,_vue.nextTick)()},resetFilterPanel(){return e(null),(0,_vue.nextTick)()},getCheckedFilters(){var e=n.tableFullColumn;let a=[];return e.forEach(e=>{var{field:t,filters:l}=e;let r=[],i=[];l&&l.length&&(l.forEach(e=>{e.checked&&(r.push(e.value),i.push(e.data))}),r.length)&&a.push({column:e,field:t,property:t,values:r,datas:i})}),a},updateFilterOptionStatus(e,t){return e._checked=t,e.checked=t,(0,_vue.nextTick)()}}),s)},setupGrid(e){return e.extendTableMethods(tableFilterMethodKeys)}});