12345 |
- /*
- All material copyright ESRI, All Rights Reserved, unless otherwise specified.
- See https://js.arcgis.com/4.25/esri/copyright.txt for details.
- */
- import{_ as e}from"../chunks/tslib.es6.js";import t from"../core/Error.js";import{isSome as s}from"../core/maybe.js";import{on as i,watch as a,initial as n}from"../core/reactiveUtils.js";import{formatFileSize as r}from"../core/unitFormatUtils.js";import{property as l}from"../core/accessorSupport/decorators/property.js";import"../core/arrayUtils.js";import{cast as o}from"../core/accessorSupport/decorators/cast.js";import{subclass as d}from"../core/accessorSupport/decorators/subclass.js";import c from"./Widget.js";import m from"./Attachments/AttachmentsViewModel.js";import{getIconPath as h,isSupportedImage as u}from"./Attachments/support/attachmentUtils.js";import{storeNode as p,discardNode as b,isRTL as g}from"./support/widgetUtils.js";import{messageBundle as _}from"./support/decorators/messageBundle.js";import{tsx as f}from"./support/jsxFactory.js";const v={addButton:!0,addSubmitButton:!0,cancelAddButton:!0,cancelUpdateButton:!0,deleteButton:!0,errorMessage:!0,progressBar:!0,updateButton:!0},y={base:"esri-attachments",loaderContainer:"esri-attachments__loader-container",loader:"esri-attachments__loader",fadeIn:"esri-attachments--fade-in",container:"esri-attachments__container",containerList:"esri-attachments__container--list",containerPreview:"esri-attachments__container--preview",actions:"esri-attachments__actions",deleteButton:"esri-attachments__delete-button",addAttachmentButton:"esri-attachments__add-attachment-button",errorMessage:"esri-attachments__error-message",items:"esri-attachments__items",item:"esri-attachments__item",itemButton:"esri-attachments__item-button",itemMask:"esri-attachments__item-mask",itemMaskIcon:"esri-attachments__item-mask--icon",itemImage:"esri-attachments__image",itemImageResizable:"esri-attachments__image--resizable",itemLabel:"esri-attachments__label",itemFilename:"esri-attachments__filename",itemChevronIcon:"esri-attachments__item-chevron-icon",itemLink:"esri-attachments__item-link",itemLinkOverlay:"esri-attachments__item-link-overlay",itemLinkOverlayIcon:"esri-attachments__item-link-overlay-icon",itemEditIcon:"esri-attachments__item-edit-icon",itemAddIcon:"esri-attachments__item-add-icon",itemAddButton:"esri-attachments__item-add-button",formNode:"esri-attachments__form-node",fileFieldset:"esri-attachments__file-fieldset",fileLabel:"esri-attachments__file-label",fileName:"esri-attachments__file-name",fileInput:"esri-attachments__file-input",metadata:"esri-attachments__metadata",metadataFieldset:"esri-attachments__metadata-fieldset",progressBar:"esri-attachments__progress-bar",esriWidget:"esri-widget",esriButton:"esri-button",buttonDisabled:"esri-button--disabled",esriButtonSecondary:"esri-button--secondary",esriButtonTertiary:"esri-button--tertiary",esriButtonThird:"esri-button--third",esriButtonSmall:"esri-button--small",esriButtonHalf:"esri-button--half",empty:"esri-widget__content--empty",iconExternalLink:"esri-icon-link-external",iconEdit:"esri-icon-edit",iconRight:"esri-icon-right",iconLeft:"esri-icon-left",iconPlus:"esri-icon-plus"},A=window.CSS;let w=class extends c{constructor(e,t){super(e,t),this.displayType="auto",this.messages=null,this.messagesUnits=null,this.selectedFile=null,this.submitting=!1,this.viewModel=new m,this.visibleElements={...v},this._supportsImageOrientation=A&&A.supports&&A.supports("image-orientation","from-image"),this._addAttachmentForm=null,this._updateAttachmentForm=null}initialize(){this.addHandles([i((()=>this.viewModel?.attachmentInfos),"change",(()=>this.scheduleRender())),i((()=>this.viewModel?.fileInfos),"change",(()=>this.scheduleRender())),a((()=>this.viewModel?.mode),(()=>this._modeChanged()),n)])}loadDependencies(){return Promise.all([import("@esri/calcite-components/dist/components/calcite-icon.js")])}get abilities(){return this.viewModel.abilities}set abilities(e){this.viewModel.abilities=e}get effectiveDisplayType(){const{displayType:e}=this;return e&&"auto"!==e?e:this.viewModel.supportsResizeAttachments?"preview":"list"}get graphic(){return this.viewModel.graphic}set graphic(e){this.viewModel.graphic=e}get label(){return this.messages?.widgetLabel??""}set label(e){this._overrideIfSome("label",e)}castVisibleElements(e){return{...v,...e}}addAttachment(){const{_addAttachmentForm:e,viewModel:s}=this;return this._set("submitting",!0),this._set("error",null),s.addAttachment(e).then((e=>(this._set("submitting",!1),this._set("error",null),s.mode="view",e))).catch((e=>{throw this._set("submitting",!1),this._set("error",new t("attachments:add-attachment",this.messages.addErrorMessage,e)),e}))}deleteAttachment(e){const{viewModel:s}=this;return this._set("submitting",!0),this._set("error",null),s.deleteAttachment(e).then((e=>(this._set("submitting",!1),this._set("error",null),s.mode="view",e))).catch((e=>{throw this._set("submitting",!1),this._set("error",new t("attachments:delete-attachment",this.messages.deleteErrorMessage,e)),e}))}updateAttachment(){const{viewModel:e}=this,{_updateAttachmentForm:s}=this;return this._set("submitting",!0),this._set("error",null),e.updateAttachment(s).then((t=>(this._set("submitting",!1),this._set("error",null),e.mode="view",t))).catch((e=>{throw this._set("submitting",!1),this._set("error",new t("attachments:update-attachment",this.messages.updateErrorMessage,e)),e}))}addFile(){const e=this.viewModel.addFile(this.selectedFile,this._addAttachmentForm);return this.viewModel.mode="view",e}updateFile(){const{viewModel:e}=this,t=e.updateFile(this.selectedFile,this._updateAttachmentForm,e.activeFileInfo);return e.mode="view",t}deleteFile(e){const t=this.viewModel.deleteFile(e||this.viewModel.activeFileInfo.file);return this.viewModel.mode="view",t}render(){const{submitting:e,viewModel:t}=this,{state:s}=t;return f("div",{class:this.classes(y.base,y.esriWidget)},e?this.renderProgressBar():null,"loading"===s?this.renderLoading():this.renderAttachments(),this.renderErrorMessage())}renderErrorMessage(){const{error:e,visibleElements:t}=this;return e&&t.errorMessage?f("div",{key:"error-message",class:y.errorMessage},e.message):null}renderAttachments(){const{activeFileInfo:e,mode:t,activeAttachmentInfo:s}=this.viewModel;return"add"===t?this.renderAddForm():"edit"===t?this.renderDetailsForm(s||e):this.renderAttachmentContainer()}renderLoading(){return f("div",{class:y.loaderContainer,key:"loader"},f("div",{class:y.loader}))}renderProgressBar(){return this.visibleElements.progressBar?f("div",{class:y.progressBar,key:"progress-bar"}):null}renderAddForm(){const{submitting:e,selectedFile:t}=this,s=e||!t,i=this.visibleElements.cancelAddButton?f("button",{type:"button",bind:this,disabled:e,onclick:this._cancelForm,class:this.classes(y.esriButton,y.esriButtonTertiary,y.esriButtonSmall,y.esriButtonHalf,e&&y.buttonDisabled)},this.messages.cancel):null,a=this.visibleElements.addSubmitButton?f("button",{type:"submit",disabled:s,class:this.classes(y.esriButton,y.esriButtonSecondary,y.esriButtonSmall,y.esriButtonHalf,{[y.buttonDisabled]:s})},this.messages.add):null,n=t?f("span",{key:"file-name",class:y.fileName},t.name):null,r=f("form",{bind:this,afterCreate:p,afterRemoved:b,"data-node-ref":"_addAttachmentForm",onsubmit:this._submitAddAttachment},f("fieldset",{class:y.fileFieldset},n,f("label",{class:this.classes(y.fileLabel,y.esriButton,y.esriButtonSecondary)},t?this.messages.changeFile:this.messages.selectFile,f("input",{class:y.fileInput,type:"file",name:"attachment",bind:this,onchange:this._handleFileInputChange}))),a,i);return f("div",{key:"add-form-container",class:y.formNode},r)}renderDetailsForm(e){const{visibleElements:t,viewModel:i,selectedFile:a,submitting:n}=this,{abilities:l}=i,o=n||!a;let d,c,m,h;a?(d=a.type,c=a.name,m=a.size):"file"in e?(d=e.file.type,c=e.file.name,m=e.file.size):(d=e.contentType,c=e.name,m=e.size,h=e.url);const u=l.editing&&l.operations.delete&&t.deleteButton?f("button",{key:"delete-button",type:"button",disabled:n,bind:this,onclick:t=>this._submitDeleteAttachment(t,e),class:this.classes(y.esriButton,y.esriButtonSmall,y.esriButtonTertiary,y.deleteButton,{[y.buttonDisabled]:n})},this.messages.delete):void 0,g=l.editing&&l.operations.update&&t.updateButton?f("button",{disabled:o,key:"update-button",type:"submit",class:this.classes(y.esriButton,y.esriButtonSmall,y.esriButtonThird,{[y.buttonDisabled]:o})},this.messages.update):void 0,_=this.visibleElements.cancelUpdateButton?f("button",{disabled:n,key:"cancel-button",type:"button",bind:this,onclick:this._cancelForm,class:this.classes(y.esriButton,y.esriButtonSmall,y.esriButtonTertiary,y.esriButtonThird,{[y.buttonDisabled]:n})},this.messages.cancel):void 0,v=l.editing&&l.operations.update?f("fieldset",{key:"file",class:y.fileFieldset},f("span",{key:"file-name",class:y.fileName},c),f("label",{class:this.classes(y.fileLabel,y.esriButton,y.esriButtonSecondary)},this.messages.changeFile,f("input",{class:y.fileInput,type:"file",name:"attachment",bind:this,onchange:this._handleFileInputChange}))):void 0,A=f("fieldset",{key:"size",class:y.metadataFieldset},f("label",null,r(this.messagesUnits,m))),w=f("fieldset",{key:"content-type",class:y.metadataFieldset},f("label",null,d)),F=s(h)?f("a",{class:y.itemLink,href:h,rel:"noreferrer",target:"_blank"},this.renderImageMask(e,400),f("div",{class:y.itemLinkOverlay},f("span",{class:y.itemLinkOverlayIcon},f("calcite-icon",{icon:"launch"})))):this.renderImageMask(e,400),k=f("form",{bind:this,afterCreate:p,afterRemoved:b,"data-node-ref":"_updateAttachmentForm",onsubmit:t=>this._submitUpdateAttachment(t,e)},f("div",{class:y.metadata},A,w),v,f("div",{class:y.actions},u,_,g));return f("div",{key:"edit-form-container",class:y.formNode},F,k)}renderImageMask(e,t){return"file"in e?this.renderGenericImageMask(e.file.name,e.file.type):this.renderImageMaskForAttachment(e,t)}renderGenericImageMask(e,t){const{supportsResizeAttachments:s}=this.viewModel,i=h(t),a={[y.itemImageResizable]:s};return f("div",{class:this.classes(y.itemMaskIcon,y.itemMask)},f("img",{title:e,alt:e,src:i,class:this.classes(a,y.itemImage)}))}renderImageMaskForAttachment(e,t){const{supportsResizeAttachments:s}=this.viewModel,{contentType:i,name:a,url:n}=e;if(!s||!u(i))return this.renderGenericImageMask(a,i);const r=this._getCSSTransform(e),l=r?{transform:r,"image-orientation":"none"}:{},o=`${n}${n.includes("?")?"&":"?"}w=${t}`,d={[y.itemImageResizable]:s};return f("div",{class:this.classes(y.itemMask)},f("img",{styles:l,alt:a,title:a,src:o,class:this.classes(d,y.itemImage)}))}renderFile(e){const{file:t}=e;return f("li",{class:y.item,key:t},f("button",{key:"details-button",bind:this,class:y.itemButton,title:this.messages.attachmentDetails,"aria-label":this.messages.attachmentDetails,onclick:()=>this._startEditFile(e),type:"button"},this.renderImageMask(e),f("label",{class:y.itemLabel},f("span",{class:y.itemFilename},t.name||this.messages.noTitle),f("span",{"aria-hidden":"true",class:this.classes(y.itemChevronIcon,g(this.container)?y.iconLeft:y.iconRight)}))))}renderAttachmentInfo({attachmentInfo:e,displayType:t}){const{viewModel:s,effectiveDisplayType:i}=this,{abilities:a,supportsResizeAttachments:n}=s,{contentType:r,name:l,url:o}=e,d=this.renderImageMask(e,"list"===t?48:400),c=a.editing?f("span",{"aria-hidden":"true",class:this.classes(y.itemChevronIcon,g(this.container)?y.iconLeft:y.iconRight)}):null,m=[d,"preview"===i&&n&&u(r)?null:f("label",{class:y.itemLabel},f("span",{class:y.itemFilename},l||this.messages.noTitle),c)],h=a.editing?f("button",{key:"details-button",bind:this,class:y.itemButton,title:this.messages.attachmentDetails,"aria-label":this.messages.attachmentDetails,"data-attachment-info-id":e.id,onclick:()=>this._startEditAttachment(e),type:"button"},m):f("a",{key:"details-link",class:y.itemButton,href:o,target:"_blank"},m);return f("li",{class:y.item,key:e},h)}renderAttachmentContainer(){const{effectiveDisplayType:e,viewModel:t,visibleElements:s}=this,{attachmentInfos:i,abilities:a,fileInfos:n}=t,r=!!i?.length,l=!!n?.length,o={[y.containerList]:"preview"!==e,[y.containerPreview]:"preview"===e},d=a.editing&&a.operations.add&&s.addButton?f("button",{bind:this,onclick:()=>this._startAddAttachment(),class:this.classes(y.esriButton,y.esriButtonTertiary,y.addAttachmentButton),type:"button"},f("span",{"aria-hidden":"true",class:this.classes(y.itemAddIcon,y.iconPlus)}),this.messages.add):void 0,c=r?f("ul",{key:"attachments-list",class:y.items},i.toArray().map((t=>this.renderAttachmentInfo({attachmentInfo:t,displayType:e})))):void 0,m=l?f("ul",{key:"file-list",class:y.items},n.toArray().map((e=>this.renderFile(e)))):void 0,h=l||r?void 0:f("div",{class:y.empty},this.messages.noAttachments);return f("div",{key:"attachments-container",class:this.classes(y.container,o)},c,m,h,d)}_modeChanged(){this._set("error",null),this._set("selectedFile",null)}_handleFileInputChange(e){const t=e.target,s=t&&t.files&&t.files.item(0);this._set("selectedFile",s)}_submitDeleteAttachment(e,t){e.preventDefault(),"file"in t?this.deleteFile(t.file):this.deleteAttachment(t)}_submitAddAttachment(e){e.preventDefault(),this.viewModel.filesEnabled?this.addFile():this.addAttachment()}_submitUpdateAttachment(e,t){e.preventDefault(),"file"in t?this.updateFile():this.updateAttachment()}_startEditAttachment(e){const{viewModel:t}=this;t.activeFileInfo=null,t.activeAttachmentInfo=e,t.mode="edit"}_startEditFile(e){const{viewModel:t}=this;t.activeAttachmentInfo=null,t.activeFileInfo=e,t.mode="edit"}_startAddAttachment(){this.viewModel.mode="add"}_cancelForm(e){e.preventDefault(),this.viewModel.mode="view"}_getCSSTransform(e){const{orientationInfo:t}=e;return!this._supportsImageOrientation&&t?[t.rotation?`rotate(${t.rotation}deg)`:"",t.mirrored?"scaleX(-1)":""].join(" "):""}};e([l()],w.prototype,"abilities",null),e([l()],w.prototype,"displayType",void 0),e([l({readOnly:!0})],w.prototype,"effectiveDisplayType",null),e([l()],w.prototype,"graphic",null),e([l()],w.prototype,"label",null),e([l(),_("esri/widgets/Attachments/t9n/Attachments")],w.prototype,"messages",void 0),e([l(),_("esri/core/t9n/Units")],w.prototype,"messagesUnits",void 0),e([l({readOnly:!0})],w.prototype,"selectedFile",void 0),e([l({readOnly:!0})],w.prototype,"submitting",void 0),e([l({readOnly:!0})],w.prototype,"error",void 0),e([l({type:m})],w.prototype,"viewModel",void 0),e([l()],w.prototype,"visibleElements",void 0),e([o("visibleElements")],w.prototype,"castVisibleElements",null),w=e([d("esri.widgets.Attachments")],w);const F=w;export{F as default};
|