FeatureTable.js 14 KB

12345
  1. /*
  2. All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  3. See https://js.arcgis.com/4.25/esri/copyright.txt for details.
  4. */
  5. import{_ as e}from"../chunks/tslib.es6.js";import"../intl.js";import{deprecated as t}from"../core/deprecate.js";import{HandleOwnerMixin as i}from"../core/HandleOwner.js";import l from"../core/Logger.js";import{isSome as s}from"../core/maybe.js";import{on as o,watch as n}from"../core/reactiveUtils.js";import{property as r}from"../core/accessorSupport/decorators/property.js";import"../core/arrayUtils.js";import{cast as a}from"../core/accessorSupport/decorators/cast.js";import{subclass as d}from"../core/accessorSupport/decorators/subclass.js";import h from"./Widget.js";import c from"./FeatureTable/FeatureTableViewModel.js";import u from"./FeatureTable/Grid/support/ButtonMenu.js";import m from"./FeatureTable/Grid/support/ButtonMenuItem.js";import{Heading as g}from"./support/Heading.js";import"./support/widgetUtils.js";import{messageBundle as p}from"./support/decorators/messageBundle.js";import{tsx as b}from"./support/jsxFactory.js";import{substitute as v}from"../intl/substitute.js";const w={header:!0,menu:!0,menuItems:{clearSelection:!0,refreshData:!0,toggleColumns:!0,selectedRecordsShowAllToggle:!0,selectedRecordsShowSelectedToggle:!0,zoomToSelection:!0,deleteSelection:!0},selectionColumn:!0,columnMenus:!0},M={base:"esri-feature-table",header:"esri-feature-table__header",title:"esri-feature-table__title",content:"esri-feature-table__content",loader:"esri-feature-table__loader",loaderContainer:"esri-feature-table__loader-container",menuContainer:"esri-feature-table__menu",menuIcon:"esri-icon-handle-horizontal",menuItemGroupOpenedIcon:"esri-icon-down",menuItemGroupClosedIcon:"esri-icon-right",checkmarkIcon:"esri-icon-check-mark",promptContainer:"esri-feature-table__prompt",promptHeader:"esri-feature-table__prompt__header",promptHeading:"esri-feature-table__prompt__header__heading",promptMessage:"esri-feature-table__prompt__message",promptDivider:"esri-feature-table__prompt__divider",promptActions:"esri-feature-table__prompt__actions",widget:"esri-widget"},f=l.getLogger("esri.widgets.FeatureTable");let y=class extends(i(h)){constructor(e,t){super(e,t),this._prompt=null,this.menu=null,this.menuConfig=null,this.viewModel=new c,this.visibleElements={...w},this._showDeletePrompt=this._showDeletePrompt.bind(this),this._onDeleteSelectionClick=this._onDeleteSelectionClick.bind(this)}initialize(){this.handles.add([o((()=>this.viewModel.columns),"change",(()=>this._syncMenuConfig())),o((()=>this.viewModel.activeFilters),"change",(()=>this._syncMenuConfig())),o((()=>this.highlightIds),"change",(e=>{this._syncMenuConfig(),this._onSelectionChange(e)})),n((()=>[this.viewModel.store.querying,this.viewModel.store.syncing,this.editingEnabled]),(()=>this.scheduleRender())),n((()=>[this.menuConfig,this.editingEnabled]),(()=>this._syncMenuConfig())),n((()=>this.messages),(()=>{this.menu.label=this.messages?.options,this._syncMenuConfig()}))]),this._set("menu",new u({label:this.messages?.options,iconClass:M.menuIcon,...this.menuConfig}));const{attachmentsEnabled:e,relatedRecordsEnabled:t}=this;this.viewModel?.store?.set({attachmentsEnabled:e,relatedRecordsEnabled:t})}loadDependencies(){return Promise.all([import("@esri/calcite-components/dist/components/calcite-scrim.js"),import("@esri/calcite-components/dist/components/calcite-button.js"),import("@esri/calcite-components/dist/components/calcite-icon.js")])}destroy(){this._prompt=null,this.handles.removeAll(),this.menu?.destroy()}get activeFilters(){return this.viewModel.activeFilters}get activeSortOrders(){return this.viewModel.activeSortOrders}get attachmentsEnabled(){return this.viewModel.attachmentsEnabled}set attachmentsEnabled(e){this.viewModel.attachmentsEnabled=e}get autoRefreshEnabled(){return this.viewModel.autoRefreshEnabled}set autoRefreshEnabled(e){this.viewModel.autoRefreshEnabled=e}get columnReorderingEnabled(){return this.viewModel.columnReorderingEnabled}set columnReorderingEnabled(e){this.viewModel.columnReorderingEnabled=e}get columns(){return this.viewModel.columns}get editingEnabled(){return this.viewModel.editingEnabled}set editingEnabled(e){this.viewModel.editingEnabled=e}get fieldConfigs(){return this.viewModel.fieldConfigs}set fieldConfigs(e){this.viewModel.fieldConfigs=e}get filterGeometry(){return this.viewModel.filterGeometry}set filterGeometry(e){this.viewModel.filterGeometry=e}get grid(){return this.viewModel.grid}get hiddenFields(){return this.viewModel.hiddenFields}set hiddenFields(e){this.viewModel.hiddenFields=e}get highlightEnabled(){return this.viewModel.highlightEnabled}set highlightEnabled(e){this.viewModel.highlightEnabled=e}get highlightIds(){return this.viewModel.highlightIds}set highlightIds(e){this.viewModel.highlightIds=e}get highlightOnRowSelectEnabled(){return this.viewModel.highlightEnabled}set highlightOnRowSelectEnabled(e){this.viewModel.highlightEnabled=e}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}get layer(){return this.viewModel.layer}set layer(e){this.viewModel.layer=e}get messages(){return this.viewModel.messages}set messages(e){this.viewModel.messages=e}get messagesCommon(){return this.viewModel.messagesCommon}set messagesCommon(e){this.viewModel.messagesCommon=e}get messagesURIUtils(){return this.viewModel.messagesURIUtils}set messagesURIUtils(e){this.viewModel.messagesURIUtils=e}get multiSortEnabled(){return this.viewModel.multiSortEnabled}set multiSortEnabled(e){this.viewModel.multiSortEnabled=e}get pageSize(){return this.viewModel.pageSize}set pageSize(e){this.viewModel.pageSize=e}get relatedRecordsEnabled(){return this.viewModel.relatedRecordsEnabled}set relatedRecordsEnabled(e){this.viewModel.relatedRecordsEnabled=e}get state(){return this.viewModel.state}get tableTemplate(){return this.viewModel.tableTemplate}set tableTemplate(e){this.viewModel.tableTemplate=e}get timeExtent(){return this.viewModel.timeExtent}set timeExtent(e){this.viewModel.timeExtent=e}get view(){return this.viewModel.view}set view(e){this.viewModel.view=e}castVisibleElements(e){const t={...w,...e};return this.grid?.set("visibleElements",{...this.grid.visibleElements,selectionColumn:t.selectionColumn,columnMenus:t.columnMenus}),t}clearHighlights(){return t(f,"`FeatureTable.clearHighlights` is deprecated in favor of FeatureTable.highlightIds'",{replacement:"FeatureTable.highlightIds",version:"4.25",see:"https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-FeatureTable.html#highlightIds"}),this.viewModel.clearHighlights()}clearSelection(){return t(f,"`FeatureTable.clearSelection` is deprecated in favor of FeatureTable.highlightIds'",{replacement:"FeatureTable.highlightIds",version:"4.25",see:"https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-FeatureTable.html#highlightIds"}),this.viewModel.clearSelection()}clearSelectionFilter(){return this.viewModel.clearSelectionFilter()}deleteSelection(e){return this.highlightIds.length?e?(this._showDeletePrompt(),this.scheduleRender(),Promise.resolve()):this.viewModel.deleteSelection():Promise.resolve()}deselectRows(e){return this.viewModel.deselectRows(e)}filterBySelection(){return this.viewModel.filterBySelection()}findColumn(e){return this.viewModel.findColumn(e)}hideColumn(e){this.grid?.hideColumn(e),this._syncMenuConfig()}refresh(){return this.viewModel.refresh()}showAllColumns(){return this.viewModel.showAllColumns()}showColumn(e){this.grid?.showColumn(e),this._syncMenuConfig()}sortColumn(e,t){return this.viewModel.sortColumn(e,t)}selectRows(e){return this.viewModel.selectRows(e)}scrollToIndex(e){return this.viewModel.scrollToIndex(e)}zoomToSelection(){return this.viewModel.zoomToSelection()}render(){const{_prompt:e}=this,t=s(e)?b("calcite-scrim",null,this.renderPrompt(e)):null;return b("div",{bind:this,class:this.classes(M.base,M.widget)},this.visibleElements.header?this._renderHeader():null,b("div",{class:M.content},"disabled"!==this.state&&this.grid?.render()),t)}renderPrompt({title:e,message:t,context:i,actions:l}){const s=!!l.secondary,o=b("calcite-button",{appearance:"solid",color:"danger"===i?"red":"blue",width:s?"half":"full",onclick:l.primary.action,key:"prompt-primary-button"},l.primary.label),n=s?b("calcite-button",{appearance:"clear",color:"danger"===i?"red":"blue",width:"half",onclick:l.secondary.action,key:"prompt-secondary-button"},l.secondary.label):null;return b("div",{class:`${M.promptContainer}--${i}`},b("div",{class:M.promptHeader},b("calcite-icon",{icon:"exclamation-mark-triangle"}),b(g,{class:M.promptHeading,level:2},e)),b("div",{class:M.promptMessage},t),b("div",{class:M.promptDivider}),b("div",{class:M.promptActions},n,o))}_renderHeader(){return b("div",{key:"header",class:M.header},this._renderLoader(),this._renderTitle(),this.visibleElements.menu?this._renderMenu():null)}_renderTitle(){return b("div",{class:M.title,key:"title"},this._getTitle())}_getTitle(){const{grid:e,highlightIds:t,layer:i,messages:l,viewModel:{size:s}}=this;return e&&i?v(l.header,{title:i.title,count:s,selected:t.length||0}):""}_renderLoader(){const{state:e,store:t}=this.viewModel,i="loading"===e||t.syncing||t.querying;return b("div",{class:M.loaderContainer},i?b("div",{class:M.loader,key:"loader"}):null)}_renderMenu(){return b("div",{class:M.menuContainer},this.menu.render())}_onSelectionChange(e){const{added:t,removed:i}=e,l=t.map((e=>this.viewModel.store.getLocalItemByKey(e)||{objectId:e,feature:null,attachments:null,relatedRecords:null})),s=i.map((e=>this.viewModel.store.getLocalItemByKey(e)||{objectId:e,feature:null,attachments:null,relatedRecords:null}));this.emit("selection-change",{added:l,removed:s})}_syncMenuConfig(){this.menu?.set({...this.menuConfig,items:this._getMenuItems()})}_getMenuItems(){const e=this.menuConfig?.items,t=this._getDefaultMenuItems(),i=[];return t?.length&&i.push(...t),e?.length&&i.push(...e),i}_getDefaultMenuItems(){const{highlightIds:e,messages:t,viewModel:i,visibleElements:l}=this,{menuItems:s}=l,o=[];if(s?.refreshData&&o.push(new m({selectionEnabled:!1,label:t?.refreshData,clickFunction:()=>this.refresh()})),e.length){const i=this._getSelectionFilter();if(s?.clearSelection&&o.push(new m({selectionEnabled:!1,label:t?.clearSelection,clickFunction:()=>this.highlightIds?.removeAll()})),s?.zoomToSelection&&this.view&&o.push(new m({selectionEnabled:!1,label:t?.zoomToSelection,clickFunction:()=>this.viewModel.zoomToSelection()})),s?.selectedRecordsShowSelectedToggle&&(!i||e.length!==i.objectIds.length)){const e=t.showSelected,i=new m({selectionEnabled:!1,label:e,clickFunction:()=>{this.filterBySelection(),i.set("label",e)}});o.push(i)}s?.deleteSelection&&this.editingEnabled&&this.layer?.capabilities?.operations?.supportsDelete&&o.push(new m({selectionEnabled:!1,label:t.deleteSelection,clickFunction:this._showDeletePrompt}))}if(s?.selectedRecordsShowAllToggle&&this._hasSelectionFilter()){const e=t.showAllRecords,i=new m({selectionEnabled:!1,label:e,clickFunction:()=>{this.clearSelectionFilter(),i.set("label",e)}});o.push(i)}return s?.toggleColumns&&o.push(new m({iconClass:M.menuItemGroupClosedIcon,label:t?.toggleColumns,clickFunction:this._toggleMenuItemSelectedIcon,items:i?.columns?.items.map((({header:e,hidden:t,path:i})=>new m({label:e||i,selected:!t,selectionEnabled:!0,iconClass:M.checkmarkIcon,clickFunction:()=>this._toggleColumnFromMenuItem(i)})))})),o.length?o:null}_toggleMenuItemSelectedIcon({item:e}){e?.set("iconClass",e?.selected?M.menuItemGroupOpenedIcon:M.menuItemGroupClosedIcon)}_toggleColumnFromMenuItem(e){const{grid:t,viewModel:i}=this;i.findColumn(e)?.hidden?t.showColumn(e):t.hideColumn(e)}_showDeletePrompt(){const{messages:e,messagesCommon:t}=this,i=this.highlightIds.length||0,l=v(e.deleteSelectionCount,{count:i});this.menu.open=!1,this._prompt={title:l,message:e.deleteRecordsRemoved,context:"danger",actions:{primary:{label:t.delete,action:this._onDeleteSelectionClick},secondary:{label:e.keepRecords,action:()=>this._prompt=null}}}}async _onDeleteSelectionClick(){await this.viewModel.deleteSelection(),this._prompt=null}_getSelectionFilter(){return this.viewModel.activeFilters?.find((e=>"selection"===e.type))}_hasSelectionFilter(){return!!this._getSelectionFilter()}};e([r({readOnly:!0})],y.prototype,"activeFilters",null),e([r({readOnly:!0})],y.prototype,"activeSortOrders",null),e([r()],y.prototype,"attachmentsEnabled",null),e([r()],y.prototype,"autoRefreshEnabled",null),e([r()],y.prototype,"columnReorderingEnabled",null),e([r({readOnly:!0})],y.prototype,"columns",null),e([r()],y.prototype,"editingEnabled",null),e([r()],y.prototype,"fieldConfigs",null),e([r()],y.prototype,"filterGeometry",null),e([r({readOnly:!0})],y.prototype,"grid",null),e([r()],y.prototype,"hiddenFields",null),e([r()],y.prototype,"highlightEnabled",null),e([r()],y.prototype,"highlightIds",null),e([r()],y.prototype,"highlightOnRowSelectEnabled",null),e([r()],y.prototype,"label",null),e([r()],y.prototype,"layer",null),e([r(),p("esri/widgets/FeatureTable/t9n/FeatureTable")],y.prototype,"messages",null),e([r(),p("esri/t9n/common")],y.prototype,"messagesCommon",null),e([r(),p("esri/widgets/support/t9n/uriUtils")],y.prototype,"messagesURIUtils",null),e([r({readOnly:!0})],y.prototype,"menu",void 0),e([r()],y.prototype,"menuConfig",void 0),e([r()],y.prototype,"multiSortEnabled",null),e([r()],y.prototype,"pageSize",null),e([r()],y.prototype,"relatedRecordsEnabled",null),e([r({readOnly:!0})],y.prototype,"state",null),e([r()],y.prototype,"tableTemplate",null),e([r()],y.prototype,"timeExtent",null),e([r()],y.prototype,"view",null),e([r()],y.prototype,"viewModel",void 0),e([r()],y.prototype,"visibleElements",void 0),e([a("visibleElements")],y.prototype,"castVisibleElements",null),y=e([d("esri.widgets.FeatureTable")],y);const _=y;export{_ as default};