UNPKG

@farris/ui-vue

Version:

Farris Vue, a Farris Design based Vue3 component library.

2 lines (1 loc) 18 kB
(function(m,_){typeof exports=="object"&&typeof module<"u"?_(exports,require("../common/index.umd.js"),require("vue"),require("@vueuse/core"),require("lodash-es"),require("../locale/index.umd.js"),require("../data-view/index.umd.js"),require("../input-group/index.umd.js"),require("../button/index.umd.js")):typeof define=="function"&&define.amd?define(["exports","../common/index.umd.js","vue","@vueuse/core","lodash-es","../locale/index.umd.js","../data-view/index.umd.js","../input-group/index.umd.js","../button/index.umd.js"],_):(m=typeof globalThis<"u"?globalThis:m||self,_(m["tree-grid"]={},m.common,m.Vue,m.VueUseCore,m.LodashES,m.locale,m.dataView,m.FInputGroup,m.FButton))})(this,function(m,_,n,je,w,Ge,a,Ae,Pe){"use strict";const He={enable:{type:Boolean,default:!1},index:{type:Number,default:1},mode:{type:String,default:"server"},showGoto:{type:Boolean,default:!1},showIndex:{type:Boolean,default:!0},showLimits:{type:Boolean,default:!1},showPageInfo:{type:Boolean,default:!0},size:{type:Number,default:20},sizeLimits:{type:Array,default:[10,20,30,50,100]},total:{type:Number,default:0},disabled:{type:Boolean,default:!1}},Me={enable:{type:Boolean,default:!1},fields:{type:Array,default:[]},mode:{type:String,default:"client"},multiSort:{type:Boolean,default:!1}},ke={customGroupRow:{type:Function,default:()=>{}},customGroupRowStyle:{type:Function,default:()=>{}},customSummaryStyle:{type:Function,default:()=>{}},enable:{type:Boolean,default:!1},groupColSpan:{type:Number,default:1},groupFields:{type:Array,default:[]},showGroupedColumn:{type:Boolean,default:!0},showGroupPanel:{type:Boolean,default:!1},showSummary:{type:Boolean,default:!1},summaryPosition:{type:String,default:"separate"}},Le={enable:{type:Boolean,default:!1},filterStyle:{type:String,default:"filter-column"},mode:{type:String,default:"server"},showSummary:{type:Boolean,default:!0}},Ee={wrapHeadings:{type:Boolean,default:!1}},Ue={customRowStyle:{type:Function,default:()=>{}},customCellStyle:{type:Function,default:()=>{}},disable:{type:Function,default:()=>{}},height:{type:Number,default:28},showHovering:{type:Boolean,default:!0},wrapContent:{type:Boolean,default:!1}},ze={enable:{type:Boolean,default:!1},customSummaryStyle:{type:Function,default:()=>{}},groupFields:{type:Array,default:[]},mode:{type:String,default:"client"},position:{type:String,default:"bottom"}},We={fitColumns:{type:Boolean,default:!1},fitMode:{type:String,default:"average"},groups:{type:Array,defaut:[]},reorderColumn:{type:Boolean,default:!1},resizeColumn:{type:Boolean,default:!0},resizeColumnOnDoubleClick:{type:Boolean,default:!0}},Ve={selectOnEditing:{type:Boolean,default:!1},editMode:{type:String,default:"cell"}},qe={show:{type:Boolean,default:!1},message:{type:String,default:`${Ge.LocaleService.getLocaleValue("datagrid.loadingMessage")}...`}},Se={customClass:{type:String,default:""},sort:{type:Object},filter:{type:Object},autoCheckChildren:{type:Boolean,default:!1},columns:{type:Array,default:[]},columnOption:{type:Object},commandOption:{type:Object,default:{enable:!1,commands:[]}},data:{type:Array,default:[]},disabled:{type:Boolean,default:!1},disabledField:{type:String,default:"disabled"},displayField:{type:String,default:"name"},editable:{type:Boolean,default:!1},editOption:{type:Object,default:{selectOnEditing:!1,editMode:"cell"}},fit:{type:Boolean,default:!1},header:{type:Object},height:{type:Number,default:-1},hierarchy:{type:Object,default:{cascadeOption:{autoCancelParent:!0,autoCheckChildren:!1,autoCheckParent:!1,selectionRange:"All"},parentIdField:"parent"}},id:{type:String,default:""},idField:{type:String,default:"id",require:!0},loadData:{type:Function},loading:{type:Boolean,default:!1},minHeight:{type:Number,default:300},minWidth:{type:Number,default:400},newDataItem:{type:Function,default:()=>{}},pagination:{type:Object,default:{enable:!1,mode:"server",size:-1}},rowNumber:{type:Object,default:{enable:!0,width:36,heading:"序号"}},rowOption:{type:Object,default:{wrapContent:!1}},selection:{type:Object,default:{enableSelectRow:!0,multiSelect:!1,multiSelectMode:"DependOnCheck",showCheckbox:!1,showSelectAll:!1,showSelection:!1}},selectionValues:{type:Array,default:[]},showBorder:{type:Boolean,default:!1},showHeader:{type:Boolean,default:!0},showHorizontalLines:{type:Boolean,default:!0},showLines:{type:Boolean,default:!1},showOptions:{type:Boolean,default:!1},showScrollBar:{type:String,default:"auto"},showSetting:{type:Boolean,default:!1},showStripe:{type:Boolean,default:!0},showTreeNodeIcons:{type:Boolean,default:!1},showVerticallLines:{type:Boolean,default:!1},treeNodeIconsData:{type:[Object,String],default:{}},width:{type:Number,default:-1},virtualized:{type:Boolean,default:!1},emptyTemplate:{type:Object},summary:{type:Object,default:{enable:!1,groupFields:["numericField1","numericField2"]}},autoHeight:{type:Boolean,default:!1},visible:{type:Boolean,default:!0},checkboxPosition:{type:String,default:"after-expand"},enableColumnSettingSolution:{type:Boolean,default:!1},searchable:{type:Boolean,default:!1},customSearch:{type:Function}};function Ye(l,p,E,U,D,B,z,$,R,C,v,T,J,d,N,Q,j,f,I){const{calculateCellPositionInRow:ie}=B,{columnContext:G,hasLeftFixedColumn:X,hasRightFixedColumn:O}=z,{gridDataStyle:Z,leftFixedGridDataStyle:oe,rightFixedGridDataStyle:ue}=d,{renderDataRow:i}=a.getHierarchyRow(l,p,G,j,$,R,C,v,T,J,d,N,Q,f,I),re=[i];function y(h,ee){const te=ie(h);return j.value.filter(P=>P.visible!==!1).map((P,H)=>re[P.type](P,te,ee,H))}function A(){return n.createVNode("div",{ref:U,class:"fv-grid-content-left-fixed"},[n.createVNode("div",{class:"fv-grid-data",style:oe.value},[y(G.value.leftColumns.filter(h=>h.visible),"left")])])}function se(){return n.createVNode("div",{ref:E,class:"fv-grid-content-primary"},[n.createVNode("div",{class:"fv-grid-data",style:Z.value},[y(G.value.primaryColumns.filter(h=>h.visible),"primary")])])}function x(){return n.createVNode("div",{ref:D,class:"fv-grid-content-right-fixed"},[n.createVNode("div",{class:"fv-grid-data",style:ue.value},[y(G.value.rightColumns.filter(h=>h.visible),"right")])])}function de(){const h=[];return X.value&&h.push(A()),h.push(se()),O.value&&h.push(x()),h}return{renderDataArea:de}}const be=n.defineComponent({name:"FTreeGrid",props:Se,emits:["selectionChange","clickRow","expandNode","unSelectItem","dblclickNode","doubleClickRow","unSelectItem","selectItem","filterChanged","unSelectAll","selectAll","sortChanged","selectionUpdate","endEditCell"],setup(l,p){var Ne,_e;const E=n.ref(!1),U=n.ref(!1),D=0,B=n.ref(((Ne=l.rowOption)==null?void 0:Ne.height)||28);let z=[],$=[];const R=n.ref(20),C=n.ref(l.columns),v=a.useIdentify(l),{idField:T}=v,J=n.ref(),d=n.ref(),N=n.ref(),Q=n.ref(),j=n.ref(),f=n.ref([]),I=n.ref(!1),ie=n.ref(((_e=l.rowOption)==null?void 0:_e.wrapContent)||!1),G=a.useGroupData(l,v),X=a.useFilter(l,p),O=a.useHierarchy(l),{collapseField:Z}=O,{showLoading:oe,renderLoading:ue}=a.useLoading(l,J),i=a.useDataView(l,new Map,X,O,v),{dataView:re}=i,y=a.useSelection(l,i,v,f,p),{showSelection:A,selectedValues:se}=y,x=a.useSelectHierarchyItem(l,f,i,v,y,p),de=n.computed(()=>l.disabled),h=n.computed(()=>l.virtualized?Math.min(i.dataView.value.length,R.value):i.dataView.value.length),ee=a.usePagination(l,i),{shouldRenderPagination:te}=ee,{containerStyleObject:P}=a.useDataViewContainerStyle(l,f),H=n.ref(""),le=n.ref([]),$e=n.computed(()=>l.searchable||!1),M=n.ref(0),Je=a.useCommandColumn(l),{applyCommands:we}=Je;we(C);const{applyColumnSetting:ce,removeColumnSetting:Qe}=a.useSettingColumn(l);l.showSetting&&ce(C);const W=a.useColumn(l,p),fe=a.useSort(l),{applyColumnSorter:Ie,columnContext:ne,updateColumnRenderContext:Xe}=W;Ie(i,fe);const me=a.useGroupColumn(l,ne),k=a.useRow(l,p,y,v),L=a.useEdit(l,p,v,k,f),ye=a.useVisualDataBound(l,i,B),Ze=a.useVisualDataCell(l,L,ye),et=a.useVisualDataRow(l,i,L,O,v,ye,Ze,B),he=a.useVisualData(l,C,i,h,D,et),{getVisualData:V}=he,tt=a.useCellPosition(l,ne,B,E),ve=a.useSidebar(l,y),{sidebarWidth:lt}=ve,g=a.useVirtualScroll(l,i,f,ne,he,h,D,lt,B,E),{onWheel:nt,dataGridWidth:Oe,viewPortHeight:De,viewPortWidth:ae,resetScroll:ge,updateVisibleRowsOnLatestVisibleScope:at}=g,Be=a.useFitColumn(l,ne,d,ae,me),{calculateColumnsSize:q}=Be,Fe=a.useFilterHistory(),it=a.useColumnFilter(d,j,i,Fe,g),ot=a.useDragColumn(l,p,W,i,me,G,g),ut=n.computed(()=>{const e={"fv-grid":!0,"fv-grid-bordered":l.showBorder,"fv-grid-horizontal-bordered":l.showHorizontalLines,"fv-datagrid-strip":l.showStripe};return _.getCustomClass(e,l.customClass)}),rt=n.computed(()=>({"fv-grid-content":!0,"fv-grid-content-hover":I.value,"fv-grid-wrap-content":ie.value,"fv-grid-scrollbar-visible":g.shouldShowVirticalScrollbar.value&&I.value})),{renderDataArea:st}=Ye(l,p,N,Q,j,tt,W,i,L,O,k,y,x,g,he,ye,f,B,E),{renderGridHeader:dt,renderGridColumnResizeOverlay:ct,shouldShowHeader:ft}=a.getColumnHeader(l,p,d,Q,j,W,i,ot,it,X,Fe,Be,me,y,ve,fe,g,ae,f,U),{renderDataGridSidebar:mt}=a.getSidebar(l,k,y,ve,g),{renderDisableMask:yt}=a.getDisableMask(),{renderHorizontalScrollbar:ht}=a.getHorizontalScrollbar(l,d,g),{renderVerticalScrollbar:vt}=a.getVerticalScrollbar(l,d,g);function gt(){var e,t,c;if(d.value&&d.value.clientHeight>0&&((e=d.value)==null?void 0:e.clientWidth)>0){const o=Math.ceil(d.value.clientHeight/B.value);o>R.value&&(R.value=o,at()),De.value=((t=N.value)==null?void 0:t.clientHeight)||0,Oe.value=((c=d.value)==null?void 0:c.clientWidth)||0}d.value&&(d.value.clientHeight>0||d.value.clientWidth>0)&&q()}n.onMounted(()=>{d.value&&(R.value=Math.max(Math.ceil(d.value.clientHeight/B.value),R.value),f.value=V(0,h.value+D-1),je.useResizeObserver(d.value,gt),q(),n.nextTick(()=>{d.value&&(Oe.value=d.value.clientWidth),N.value&&(ae.value=N.value.clientWidth,De.value=N.value.clientHeight)})),oe.value&&ue()}),n.onUnmounted(()=>{}),n.watch(ae,()=>{d.value&&q()});function Ct(e){i.collapseTo(e),i.reOrderVisibleIndex(),ge()}function pt(e){i.expandTo(e),i.reOrderVisibleIndex(),ge()}function Ce(){const e=y.getSelectionRow();return e?e.dataIndex-1:-1}function St(e){const t=e!==void 0?e:Ce(),c=i.insertNewDataItem(t===-1?0:t);return f.value=V(0,h.value+D-1),c}function bt(){const e=Ce();i.insertNewChildDataItem(e),f.value=V(0,h.value+D-1)}function wt(e,t){const c=f.value.find(s=>s.raw[T.value]===t),o=c?c.dataIndex-1:-1;i.insertNewChildDataItems(e,o)}function It(){const e=Ce(),t=x.getNextSelectableHierarchyItemId(e);i.removeHierarchyDataItem(e),f.value=V(0,h.value+D-1),t&&x.selectItemById(t)}function Ot(e){L.onEditingRow(e)}function Dt(e){L.acceptEditingRow(e)}function Bt(e){L.cancelEditingRow(e)}function Y(e){e&&(C.value=e,we(C),l.showSetting&&ce(C),Xe(C.value),Ie(i,fe),q())}n.watch(()=>l.columns,e=>{if(l.showSetting&&l.enableColumnSettingSolution){Y(C.value);return}Y(e)});function Ft(e,t){e&&(i.load(e),i.reOrderVisibleIndex(),t!=null&&t.keepScrollPosition?g.scrollTo(g.offsetY.value):ge())}function pe(e){k.activeRowById(e)}function xt(e,t={isCurrent:!0}){t!=null&&t.isCurrent&&pe(e),x.selectItemById(e)}function Rt(e){const t=f.value.find(c=>c.raw[v.idField.value]===e);t&&k.clickRowItem(t)}function Tt(e){x.selectItemByIds(e)}function Nt(){return y.getSelectedItems()}function xe(){y.clearSelection()}function _t(){y.emptyCurrentRowId()}const jt=n.computed(()=>!f.value||!f.value.length),{renderEmpty:Gt}=a.getEmpty(l,p);function At(){return y.getSelectionRow()}function Pt(e,t={clearCurrent:!0}){t!=null&&t.clearCurrent&&pe(""),x.unSelectItemByIds(e)}function Ht(){return y.currentSelectedDataId.value}function Mt(e,t,c){const o=re.value.find(s=>s[T.value]===e);if(o){if(Object.keys(o).forEach(r=>{Object.prototype.hasOwnProperty.call(t,r)&&(o[r]=t[r])}),c){const{collapseField:r,disabledField:S,checkedField:F,visibleField:b,hasChildren:K}=c;r&&!w.isUndefined(t[r])&&(o.__fv_collapse__=t[r]),F&&!w.isUndefined(t[F])&&(o.__fv_checked__=t[F]),S&&!w.isUndefined(t[S])&&(o.__fv_disabled__=t[S]),b&&!w.isUndefined(t[b])&&(o.__fv_visible__=t[b]),w.isUndefined(K)||(o.__fv_hasChildren__=K)}const s=f.value.find(r=>r.raw[T.value]===e),u=f.value.findIndex(r=>r.raw[T.value]===e);if(s){if(s.raw=o,Object.keys(s.data).forEach(r=>{s.data[r].updateData(o)}),c){const{collapseField:r,disabledField:S,checkedField:F,visibleField:b,hasChildren:K}=c;r&&!w.isUndefined(t[r])&&(s.collapse=t[r]),F&&!w.isUndefined(t[F])&&(s.checked=t[F]),S&&!w.isUndefined(t[S])&&(s.disabled=t[S]),b&&!w.isUndefined(t[b])&&(s.visible=t[b]),w.isUndefined(K)||(s.raw.__fv_hasChildren__=K)}f.value=[...f.value.slice(0,u),s,...f.value.slice(u+1)],i.updateSummary()}}}function kt(e){return Object.prototype.hasOwnProperty.call(e,"raw")?i.hasRealChildren(e.raw):i.hasRealChildren(e)}function Lt(e){const t=i.dataView.value.find(c=>c[T.value]===e);return t?t[Z.value]:""}function Et(){return Z.value}n.watch(()=>l.showSetting,(e,t)=>{e!==t&&(e?ce(C):Qe(C),Y(C.value))});function Ut(e){return f.value.filter(t=>e.includes(t.raw[l.idField]))}function Re(e){const t=v.idField.value,c=f.value.find(o=>o.raw[t]===e);c&&k.changeRow(c)}function zt(){y.keepSelectingOnPaging.value||xe(),i.updateVisibleDataSummary(f.value)}function Wt(e){y.updateSelectedValues(e)}function Vt(e){y.removeSelectedValues(e)}function qt(e){n.nextTick(()=>{g.scrollToRowByIndex(e.dataIndex-1)})}function Yt(e){let t=e;const c=[];for(;t&&t[O.parentIdField.value];){const o=i.rawView.value.find(s=>s[v.idField.value]===t[O.parentIdField.value]);if(o)o[O.collapseField.value]&&c.push(o),t=o;else break}c.reverse().forEach(o=>{o[O.collapseField.value]=!1,i.toggleChildrenVisibiltyByCollapseStatus(o)})}function Kt(e,t){if(e.length!==t.length)return!1;const c=e.map(s=>s[v.idField.value]).sort(),o=t.map(s=>s[v.idField.value]).sort();return c.every((s,u)=>s===o[u])}function Te(){if(!H.value.trim()){le.value=[],M.value=0;return}const e=[],t=H.value.toLowerCase().trim();i.rawView.value.forEach(o=>{var u;let s=!1;(u=l.search)!=null&&u.customSearch?s=l.search.customSearch(t,o,l.columns):l.columns.forEach(r=>{!s&&r.field&&o[r.field]!==void 0&&String(o[r.field]).toLowerCase().includes(t)&&(s=!0)}),s&&e.push(o)});const c=!Kt(e,le.value);if(e.length>0){c?(le.value=e,M.value=0):M.value=(M.value+1)%e.length;const o=e[M.value];o&&(Yt(o),n.nextTick(()=>{i.reOrderVisibleIndex(),f.value=V(0,h.value+D-1);const s=o[v.idField.value],u=f.value.find(r=>r.raw[v.idField.value]===s);u?(Re(s),qt(u)):console.warn("搜索结果的节点未在可视数据中找到")}))}else le.value=[],M.value=0}function $t(e){e.key==="Enter"&&Te()}function Jt(){Te()}p.expose({activeRowById:pe,addNewDataItem:St,addNewChildDataItem:bt,addChildrenToNode:wt,collapseTo:Ct,expandTo:pt,removeDataItem:It,editDataItem:Ot,acceptDataItem:Dt,cancelDataItem:Bt,updateColumns:Y,updateDataSource:Ft,selectItemById:xt,selectItemByIds:Tt,getSelectedItems:Nt,clearSelection:xe,getSelectionRow:At,clickRowItemById:Rt,unSelectItemByIds:Pt,getCurrentRowId:Ht,reassignRowData:Mt,hasChildren:kt,getCollapseField:Et,getCollapseStatusById:Lt,getVisibleDataByIds:Ut,selectRowById:Re,updateDerivedData:zt,emptyCurrentRowId:_t,calculateColumnsSize:q,updateSelectedValues:Wt,removeSelectedValues:Vt});const Qt=n.computed(()=>{const e={};return g.shouldShowHorizontalScrollbar.value&&I.value&&(e.paddingBottom="10px"),g.shouldShowVirticalScrollbar.value&&I.value,e}),Xt=n.computed(()=>({...P.value,borderRadius:"5px"})),{renderDataGridPagination:nl}=a.getPagination(l,p,i,g,ee,y),Zt=n.computed(()=>({"d-flex":!0,"justify-content-between":te.value&&A.value,"justify-content-end":te.value&&!A.value,"position-relative":!0})),el=n.computed(()=>({"d-flex":!0,"align-items-center":!0}));function tl(e){const t=e.map(u=>u.id),c=[...C.value,...z,...$];c.filter(u=>u.dataType!==a.COMMAND_COLUMN_DATA_TYPE&&u.dataType!==a.SETTING_COLUMN_DATA_TYPE).forEach(u=>{const r=e.find(S=>S.id===u.id);r&&(u.width=r.actualWidth||u.width||120,r.actualWidth!==void 0&&(u.actualWidth=r.actualWidth),u.title=r.title,u.halign=r.halign,u.align=r.align,u.fixed=r.fixed)}),$=c.filter(u=>u.dataType===a.COMMAND_COLUMN_DATA_TYPE||u.dataType===a.SETTING_COLUMN_DATA_TYPE);const o=c.filter(u=>u.dataType!==a.COMMAND_COLUMN_DATA_TYPE&&u.dataType!==a.SETTING_COLUMN_DATA_TYPE),s=o.filter(u=>t.includes(u.id));z=o.filter(u=>!t.includes(u.id)),s.sort((u,r)=>{const S=e.findIndex(b=>b.id===u.id),F=e.findIndex(b=>b.id===r.id);return S-F}),Y(s)}const{renderDataGridSummary:ll}=a.getSummary(l,i,W);return()=>l.visible&&n.createVNode(n.Fragment,null,[$e.value&&n.createVNode("div",{class:"fv-grid-search",style:{padding:"8px 12px",border:"1px solid #e0e0e0",borderBottom:"none",borderRadius:"4px 4px 0 0"}},[n.createVNode("div",{style:{display:"flex",alignItems:"center"}},[n.createVNode(Ae,{value:H.value,onInput:e=>H.value=e,onKeydown:$t,placeholder:"搜索数据...",style:{flex:1}},null),n.createVNode(Pe,{type:"link",onClick:Jt,style:{cursor:"pointer",marginLeft:"8px"}},{default:()=>[n.createVNode("i",{class:"f-icon f-icon-search"},null)]})])]),n.createVNode("div",{ref:J,class:ut.value,style:Xt.value,onWheel:nt},[d.value&&ft.value&&dt(),n.createVNode("div",{ref:d,class:rt.value,onMouseover:()=>I.value=!0,onMouseleave:()=>I.value=!1,onTouchstart:e=>{e.stopPropagation(),I.value=!0,g.onTouchstartScrollThumb(e,d)},onTouchend:e=>{I.value=!1},style:Qt.value},[d.value&&mt(f),d.value&&st(),d.value&&jt.value&&Gt(),d.value&&ht(),d.value&&vt()]),d.value&&ll(),A.value&&n.createVNode("div",{class:Zt.value},[A.value&&n.createVNode("div",{class:el.value},[n.createVNode("div",null,["已选:"+se.value.length,n.createTextVNode(" 条")])])]),ct(),de.value&&yt()]),l.enableColumnSettingSolution&&n.createVNode(a.ColumnSettingSolution,{columns:[...C.value,...z],componentId:l.id,modelValue:U.value,"onUpdate:modelValue":e=>U.value=e,onChangeColumnSetting:tl},null)])}}),Ke=_.withInstall(be);m.FTreeGrid=be,m.columnOptions=We,m.default=Ke,m.editOptions=Ve,m.filterOptions=Le,m.groupOptions=ke,m.headerOptions=Ee,m.loadingOptions=qe,m.paginationOptions=He,m.rowOptions=Ue,m.sortOptions=Me,m.summaryOptions=ze,m.treeGridProps=Se,Object.defineProperties(m,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});