@esri/solutions-components 0.8.33 → 0.8.34
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/calcite-flow_6.cjs.entry.js +22 -19
- package/dist/cjs/crowdsource-reporter.cjs.entry.js +29 -6
- package/dist/collection/components/create-feature/create-feature.js +13 -12
- package/dist/collection/components/create-related-feature/create-related-feature.js +23 -3
- package/dist/collection/components/crowdsource-reporter/crowdsource-reporter.js +31 -8
- package/dist/collection/components/feature-details/feature-details.js +0 -4
- package/dist/collection/demos/crowdsource-reporter.html +32 -8
- package/dist/components/create-feature2.js +13 -12
- package/dist/components/create-related-feature2.js +9 -3
- package/dist/components/crowdsource-reporter.js +29 -6
- package/dist/components/feature-details2.js +0 -4
- package/dist/esm/calcite-flow_6.entry.js +22 -19
- package/dist/esm/crowdsource-reporter.entry.js +29 -6
- package/dist/solutions-components/demos/crowdsource-reporter.html +32 -8
- package/dist/solutions-components/p-0ce36a4a.entry.js +17 -0
- package/dist/solutions-components/p-5c5e3745.entry.js +6 -0
- package/dist/solutions-components/solutions-components.esm.js +1 -1
- package/dist/types/components/create-related-feature/create-related-feature.d.ts +4 -0
- package/dist/types/components/crowdsource-reporter/crowdsource-reporter.d.ts +16 -3
- package/dist/types/components.d.ts +7 -2
- package/dist/types/preact.d.ts +2 -1
- package/package.json +1 -1
- package/dist/solutions-components/p-4ae34862.entry.js +0 -17
- package/dist/solutions-components/p-90c3bc54.entry.js +0 -6
|
@@ -522,14 +522,23 @@ const CreateFeature = class {
|
|
|
522
522
|
}
|
|
523
523
|
});
|
|
524
524
|
this._editor.viewModel.addHandles(handle);
|
|
525
|
+
//Add handle to watch featureFormViewModel ready state
|
|
526
|
+
const formHandle = this.reactiveUtils.watch(() => { var _a; return (_a = this._editor.viewModel.featureFormViewModel) === null || _a === void 0 ? void 0 : _a.state; }, (state) => {
|
|
527
|
+
if (state === 'ready') {
|
|
528
|
+
this._showSearchWidget = false;
|
|
529
|
+
this.progressStatus.emit(1);
|
|
530
|
+
this.drawComplete.emit();
|
|
531
|
+
}
|
|
532
|
+
});
|
|
533
|
+
this._editor.viewModel.addHandles(formHandle);
|
|
525
534
|
//Add handle to watch editor viewmodel state and then show the search widget
|
|
526
|
-
const
|
|
535
|
+
const createFeatureHandle = this.reactiveUtils.watch(() => this._editor.viewModel.state, (state) => {
|
|
527
536
|
if (state === 'creating-features') {
|
|
528
537
|
this._editorLoading = true;
|
|
529
538
|
this._showSearchWidget = true;
|
|
530
539
|
}
|
|
531
540
|
});
|
|
532
|
-
this._editor.viewModel.addHandles(
|
|
541
|
+
this._editor.viewModel.addHandles(createFeatureHandle);
|
|
533
542
|
}
|
|
534
543
|
/**
|
|
535
544
|
* Start creating the feature
|
|
@@ -547,14 +556,6 @@ const CreateFeature = class {
|
|
|
547
556
|
setTimeout(() => {
|
|
548
557
|
//on form submit
|
|
549
558
|
this._editor.viewModel.featureFormViewModel.on('submit', this.submitted.bind(this));
|
|
550
|
-
//on sketch complete emit the event
|
|
551
|
-
this._editor.viewModel.sketchViewModel.on("create", (evt) => {
|
|
552
|
-
if (evt.state === "complete") {
|
|
553
|
-
this._showSearchWidget = false;
|
|
554
|
-
this.progressStatus.emit(1);
|
|
555
|
-
this.drawComplete.emit();
|
|
556
|
-
}
|
|
557
|
-
});
|
|
558
559
|
//hides the header and footer elements in editor widget
|
|
559
560
|
this.hideEditorsElements().then(() => {
|
|
560
561
|
resolve({});
|
|
@@ -668,13 +669,13 @@ const CreateFeature = class {
|
|
|
668
669
|
* @protected
|
|
669
670
|
*/
|
|
670
671
|
async hideEditorsElements() {
|
|
671
|
-
var _a;
|
|
672
|
+
var _a, _b;
|
|
672
673
|
if (!this.customizeSubmit) {
|
|
673
674
|
return;
|
|
674
675
|
}
|
|
675
676
|
await this.timeout(700);
|
|
676
677
|
//hides the header and footer on the featureForm
|
|
677
|
-
(_a = this.el.querySelector('.esri-editor').querySelectorAll('calcite-flow-item')) === null ||
|
|
678
|
+
(_b = (_a = this.el.querySelector('.esri-editor')) === null || _a === void 0 ? void 0 : _a.querySelectorAll('calcite-flow-item')) === null || _b === void 0 ? void 0 : _b.forEach((flowItem) => {
|
|
678
679
|
var _a, _b, _c, _d, _e;
|
|
679
680
|
const article = (_c = (_b = (_a = flowItem.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('calcite-panel')) === null || _b === void 0 ? void 0 : _b.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('article');
|
|
680
681
|
//hide the header
|
|
@@ -742,6 +743,7 @@ const CreateRelatedFeature = class {
|
|
|
742
743
|
this.success = index.createEvent(this, "success", 7);
|
|
743
744
|
this.fail = index.createEvent(this, "fail", 7);
|
|
744
745
|
this.isActionPending = index.createEvent(this, "isActionPending", 7);
|
|
746
|
+
this.formReady = index.createEvent(this, "formReady", 7);
|
|
745
747
|
/**
|
|
746
748
|
* boolean: Flag to maintain form submission using submit button
|
|
747
749
|
*/
|
|
@@ -834,7 +836,7 @@ const CreateRelatedFeature = class {
|
|
|
834
836
|
}
|
|
835
837
|
render() {
|
|
836
838
|
const loaderClass = this._editorLoading ? "" : "display-none";
|
|
837
|
-
return (index.h("calcite-loader", { key: '
|
|
839
|
+
return (index.h("calcite-loader", { key: '5302b1166a175b0605604792cd40b9d3fbfabd02', class: loaderClass, label: "", scale: "s" }));
|
|
838
840
|
}
|
|
839
841
|
/**
|
|
840
842
|
* StencilJS: Called once just after the component is fully loaded and the first render() occurs.
|
|
@@ -882,6 +884,13 @@ const CreateRelatedFeature = class {
|
|
|
882
884
|
}
|
|
883
885
|
});
|
|
884
886
|
this._editor.viewModel.addHandles(attachmentHandle);
|
|
887
|
+
//Add handle to watch featureFormViewModel ready state
|
|
888
|
+
const formHandle = this.reactiveUtils.watch(() => { var _a; return (_a = this._editor.viewModel.featureFormViewModel) === null || _a === void 0 ? void 0 : _a.state; }, (state) => {
|
|
889
|
+
if (state === 'ready') {
|
|
890
|
+
this.formReady.emit();
|
|
891
|
+
}
|
|
892
|
+
});
|
|
893
|
+
this._editor.viewModel.addHandles(formHandle);
|
|
885
894
|
}
|
|
886
895
|
/**
|
|
887
896
|
* Start creating the feature feature form
|
|
@@ -907,8 +916,6 @@ const CreateRelatedFeature = class {
|
|
|
907
916
|
await this._editor.startCreateFeaturesWorkflowAtFeatureCreation(creationInfo);
|
|
908
917
|
//hides the header and footer elements in editor widget
|
|
909
918
|
await this.hideEditorsElements();
|
|
910
|
-
// Emit an event to show submit cancel buttons
|
|
911
|
-
this.isActionPending.emit(false);
|
|
912
919
|
this._editor.viewModel.featureFormViewModel.on('submit', this.submitted.bind(this));
|
|
913
920
|
}
|
|
914
921
|
/**
|
|
@@ -1316,10 +1323,6 @@ const FeatureDetails = class {
|
|
|
1316
1323
|
const param = { updateFeatures: [newGraphicInstance] };
|
|
1317
1324
|
await selectedLayer.applyEdits(param).then(() => {
|
|
1318
1325
|
this._selectedGraphic = selectFeatureAttr;
|
|
1319
|
-
//update the current graphics in info card so that, the updated values are reflected in popup content
|
|
1320
|
-
if (this._infoCard) {
|
|
1321
|
-
void this._infoCard.updateCurrentGraphic(this._selectedGraphic);
|
|
1322
|
-
}
|
|
1323
1326
|
//store the like dislike value for the current selected graphic in local storage
|
|
1324
1327
|
this.setInLocalStorage();
|
|
1325
1328
|
this._updating = false;
|
|
@@ -113,7 +113,7 @@ const CrowdsourceReporter = class {
|
|
|
113
113
|
*/
|
|
114
114
|
render() {
|
|
115
115
|
const themeClass = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light";
|
|
116
|
-
return (index.h(index.Host, { key: '
|
|
116
|
+
return (index.h(index.Host, { key: 'e512e2693a586f8a6da7bcfa171feb60da26aee3' }, this._reportSubmitted && index.h("calcite-alert", { key: 'e5805ba948f1dc43eba2a78716af452cf71a8222', "auto-close": true, class: themeClass + " report-submitted-msg", icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._reportSubmitted = false; }, open: true, placement: "top" }, index.h("div", { key: '95b9accf1f09186c09c81cfb02a8939c4869ae8d', slot: "message" }, this.reportSubmittedMessage ? this.reportSubmittedMessage : this._translations.submitMsg)), this._featureCreationFailedErrorMsg && index.h("calcite-alert", { key: 'cab7f0e0f0d882612b4fa6f00799be9870aea6c5', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._featureCreationFailedErrorMsg = ""; }, open: true, placement: "top" }, index.h("div", { key: 'b9453672d85e26cf7bdeae0923cd36020d259d49', slot: "title" }, this._translations.error), index.h("div", { key: '5084315857bc88b8f80aaa411ac3fd5e4493e918', slot: "message" }, this._featureCreationFailedErrorMsg)), this._commentSubmitted && index.h("calcite-alert", { key: '62b7d9818913c3331ca9c8e4ed23c7f0c48a7946', "auto-close": true, class: 'report-submitted ' + themeClass, icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._commentSubmitted = false; }, open: true, placement: "top" }, index.h("div", { key: '5f18444fd375657db0c2a403cb453ead75536181', slot: "message" }, this._translations.commentSubmittedMsg)), this._addingCommentFailed && index.h("calcite-alert", { key: '732f08960095fc9fefcc79fc8df387a5a4c3f781', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._addingCommentFailed = false; }, open: true, placement: "top" }, index.h("div", { key: '16415430cf33ce53c0d49cab19dce2c3e34257d6', slot: "title" }, this._translations.error), index.h("div", { key: '83e5918e00902bd49512165f4aa62813cecb4619', slot: "message" }, this._translations.addingCommentFailedMsg)), index.h("div", { key: '3e9dadd880319708e64e717ba7e7adaddf97b935' }, index.h("calcite-shell", { key: 'c72664d361b3904bc191668207c3ad31ff1f98c9', "content-behind": true }, this._getReporter())), this.filterModal()));
|
|
117
117
|
}
|
|
118
118
|
//--------------------------------------------------------------------------
|
|
119
119
|
//
|
|
@@ -290,7 +290,7 @@ const CrowdsourceReporter = class {
|
|
|
290
290
|
* @protected
|
|
291
291
|
*/
|
|
292
292
|
getFeatureCreateFlowItem() {
|
|
293
|
-
return (index.h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, onCalciteFlowItemBack: this.backFromCreateFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), this._showSubmitCancelButton && index.h("div", { class: "width-full", slot: "footer" }, index.h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), index.h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateFeaturePanel.bind(this), width: "full" }, this._translations.cancel)), index.h("calcite-panel", { "full-height": true, "full-width": true }, index.h("div", { class: "progress-bar" }, index.h("calcite-progress", { type: "determinate", value: this._updatedProgressBarStatus })), index.h("calcite-notice", { class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, index.h("div", { slot: "message" }, this._translations.featureEditFormInfoMsg)), index.h("create-feature", { customizeSubmit: true, mapView: this.mapView, onDrawComplete: this.
|
|
293
|
+
return (index.h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, onCalciteFlowItemBack: this.backFromCreateFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), this._showSubmitCancelButton && index.h("div", { class: "width-full", slot: "footer" }, index.h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), index.h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateFeaturePanel.bind(this), width: "full" }, this._translations.cancel)), index.h("calcite-panel", { "full-height": true, "full-width": true }, index.h("div", { class: "progress-bar" }, index.h("calcite-progress", { type: "determinate", value: this._updatedProgressBarStatus })), index.h("calcite-notice", { class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, index.h("div", { slot: "message" }, this._translations.featureEditFormInfoMsg)), index.h("create-feature", { customizeSubmit: true, mapView: this.mapView, onDrawComplete: this.onFormReady.bind(this), onEditingAttachment: this.showSubmitCancelButton.bind(this), onFail: this.createFeatureFailed.bind(this), onProgressStatus: this.updatedProgressStatus.bind(this), onSuccess: this.onReportSubmitted.bind(this), ref: el => this._createFeature = el, searchConfiguration: this.searchConfiguration, selectedLayerId: this._selectedLayerId }))));
|
|
294
294
|
}
|
|
295
295
|
/**
|
|
296
296
|
* Update the progress bar status when editor panel changes
|
|
@@ -301,10 +301,12 @@ const CrowdsourceReporter = class {
|
|
|
301
301
|
this._updatedProgressBarStatus = evt.detail;
|
|
302
302
|
}
|
|
303
303
|
/**
|
|
304
|
-
* When
|
|
304
|
+
* When form is ready then show submit and cancel button
|
|
305
305
|
* @protected
|
|
306
306
|
*/
|
|
307
|
-
|
|
307
|
+
onFormReady() {
|
|
308
|
+
// update the form state when form is ready
|
|
309
|
+
this.updateFormState(true);
|
|
308
310
|
this._showSubmitCancelButton = true;
|
|
309
311
|
}
|
|
310
312
|
/**
|
|
@@ -331,6 +333,10 @@ const CrowdsourceReporter = class {
|
|
|
331
333
|
if (this._createFeature) {
|
|
332
334
|
void this._createFeature.close();
|
|
333
335
|
}
|
|
336
|
+
//on back form will be closed, so update the form state
|
|
337
|
+
if (this.isFormOpen) {
|
|
338
|
+
this.updateFormState(false);
|
|
339
|
+
}
|
|
334
340
|
this.backFromSelectedPanel();
|
|
335
341
|
}
|
|
336
342
|
/**
|
|
@@ -351,6 +357,10 @@ const CrowdsourceReporter = class {
|
|
|
351
357
|
void this._createRelatedFeature.close();
|
|
352
358
|
this._showSubmitCancelButton = false;
|
|
353
359
|
}
|
|
360
|
+
//on back form will be closed, so update the form state
|
|
361
|
+
if (this.isFormOpen) {
|
|
362
|
+
this.updateFormState(false);
|
|
363
|
+
}
|
|
354
364
|
this.backFromSelectedPanel();
|
|
355
365
|
}
|
|
356
366
|
/**
|
|
@@ -367,6 +377,10 @@ const CrowdsourceReporter = class {
|
|
|
367
377
|
* @protected
|
|
368
378
|
*/
|
|
369
379
|
onReportSubmitted() {
|
|
380
|
+
//on report submit form will be closed, so update the form state
|
|
381
|
+
if (this.isFormOpen) {
|
|
382
|
+
this.updateFormState(false);
|
|
383
|
+
}
|
|
370
384
|
this._reportSubmitted = true;
|
|
371
385
|
void this.navigateToHomePage();
|
|
372
386
|
}
|
|
@@ -503,7 +517,16 @@ const CrowdsourceReporter = class {
|
|
|
503
517
|
*/
|
|
504
518
|
toggleSidePanel() {
|
|
505
519
|
this._sidePanelCollapsed = !this._sidePanelCollapsed;
|
|
506
|
-
this.togglePanel.emit(this._sidePanelCollapsed);
|
|
520
|
+
this.togglePanel.emit({ panelState: this._sidePanelCollapsed, isFormOpen: this.isFormOpen });
|
|
521
|
+
}
|
|
522
|
+
/**
|
|
523
|
+
* Hide map when form open in case of mobile
|
|
524
|
+
* @param isFormOpen updated form state
|
|
525
|
+
* @protected
|
|
526
|
+
*/
|
|
527
|
+
updateFormState(isFormOpen) {
|
|
528
|
+
this.isFormOpen = isFormOpen;
|
|
529
|
+
this.togglePanel.emit({ panelState: this._sidePanelCollapsed, isFormOpen: this.isFormOpen });
|
|
507
530
|
}
|
|
508
531
|
/**
|
|
509
532
|
* When feature is selected from list store that and show feature details
|
|
@@ -598,7 +621,7 @@ const CrowdsourceReporter = class {
|
|
|
598
621
|
* @returns Node
|
|
599
622
|
*/
|
|
600
623
|
getAddCommentFlowItem() {
|
|
601
|
-
return (index.h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._relatedTable.title, onCalciteFlowItemBack: this.backFromCreateRelatedFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), index.h("div", { class: "width-full", slot: "footer" }, this._showSubmitCancelButton && index.h("div", { class: "width-full", slot: "footer" }, index.h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateRelatedFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), index.h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateRelatedFeaturePanel.bind(this), width: "full" }, this._translations.cancel))), index.h("calcite-panel", null, index.h("create-related-feature", { customizeSubmit: true, mapView: this.mapView, onFail: this.addCommentFailed.bind(this), onIsActionPending: this.showSubmitCancelButton.bind(this), onSuccess: this.onCommentSubmitted.bind(this), ref: el => this._createRelatedFeature = el, selectedFeature: this._currentFeature, table: this._relatedTable }))));
|
|
624
|
+
return (index.h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._relatedTable.title, onCalciteFlowItemBack: this.backFromCreateRelatedFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), index.h("div", { class: "width-full", slot: "footer" }, this._showSubmitCancelButton && index.h("div", { class: "width-full", slot: "footer" }, index.h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateRelatedFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), index.h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateRelatedFeaturePanel.bind(this), width: "full" }, this._translations.cancel))), index.h("calcite-panel", null, index.h("create-related-feature", { customizeSubmit: true, mapView: this.mapView, onFail: this.addCommentFailed.bind(this), onFormReady: this.onFormReady.bind(this), onIsActionPending: this.showSubmitCancelButton.bind(this), onSuccess: this.onCommentSubmitted.bind(this), ref: el => this._createRelatedFeature = el, selectedFeature: this._currentFeature, table: this._relatedTable }))));
|
|
602
625
|
}
|
|
603
626
|
/**
|
|
604
627
|
* Sets the selected features and updates the first feature as the current selected feature
|
|
@@ -194,14 +194,23 @@ export class CreateFeature {
|
|
|
194
194
|
}
|
|
195
195
|
});
|
|
196
196
|
this._editor.viewModel.addHandles(handle);
|
|
197
|
+
//Add handle to watch featureFormViewModel ready state
|
|
198
|
+
const formHandle = this.reactiveUtils.watch(() => { var _a; return (_a = this._editor.viewModel.featureFormViewModel) === null || _a === void 0 ? void 0 : _a.state; }, (state) => {
|
|
199
|
+
if (state === 'ready') {
|
|
200
|
+
this._showSearchWidget = false;
|
|
201
|
+
this.progressStatus.emit(1);
|
|
202
|
+
this.drawComplete.emit();
|
|
203
|
+
}
|
|
204
|
+
});
|
|
205
|
+
this._editor.viewModel.addHandles(formHandle);
|
|
197
206
|
//Add handle to watch editor viewmodel state and then show the search widget
|
|
198
|
-
const
|
|
207
|
+
const createFeatureHandle = this.reactiveUtils.watch(() => this._editor.viewModel.state, (state) => {
|
|
199
208
|
if (state === 'creating-features') {
|
|
200
209
|
this._editorLoading = true;
|
|
201
210
|
this._showSearchWidget = true;
|
|
202
211
|
}
|
|
203
212
|
});
|
|
204
|
-
this._editor.viewModel.addHandles(
|
|
213
|
+
this._editor.viewModel.addHandles(createFeatureHandle);
|
|
205
214
|
}
|
|
206
215
|
/**
|
|
207
216
|
* Start creating the feature
|
|
@@ -219,14 +228,6 @@ export class CreateFeature {
|
|
|
219
228
|
setTimeout(() => {
|
|
220
229
|
//on form submit
|
|
221
230
|
this._editor.viewModel.featureFormViewModel.on('submit', this.submitted.bind(this));
|
|
222
|
-
//on sketch complete emit the event
|
|
223
|
-
this._editor.viewModel.sketchViewModel.on("create", (evt) => {
|
|
224
|
-
if (evt.state === "complete") {
|
|
225
|
-
this._showSearchWidget = false;
|
|
226
|
-
this.progressStatus.emit(1);
|
|
227
|
-
this.drawComplete.emit();
|
|
228
|
-
}
|
|
229
|
-
});
|
|
230
231
|
//hides the header and footer elements in editor widget
|
|
231
232
|
this.hideEditorsElements().then(() => {
|
|
232
233
|
resolve({});
|
|
@@ -340,13 +341,13 @@ export class CreateFeature {
|
|
|
340
341
|
* @protected
|
|
341
342
|
*/
|
|
342
343
|
async hideEditorsElements() {
|
|
343
|
-
var _a;
|
|
344
|
+
var _a, _b;
|
|
344
345
|
if (!this.customizeSubmit) {
|
|
345
346
|
return;
|
|
346
347
|
}
|
|
347
348
|
await this.timeout(700);
|
|
348
349
|
//hides the header and footer on the featureForm
|
|
349
|
-
(_a = this.el.querySelector('.esri-editor').querySelectorAll('calcite-flow-item')) === null ||
|
|
350
|
+
(_b = (_a = this.el.querySelector('.esri-editor')) === null || _a === void 0 ? void 0 : _a.querySelectorAll('calcite-flow-item')) === null || _b === void 0 ? void 0 : _b.forEach((flowItem) => {
|
|
350
351
|
var _a, _b, _c, _d, _e;
|
|
351
352
|
const article = (_c = (_b = (_a = flowItem.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('calcite-panel')) === null || _b === void 0 ? void 0 : _b.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('article');
|
|
352
353
|
//hide the header
|
|
@@ -114,7 +114,7 @@ export class CreateRelatedFeature {
|
|
|
114
114
|
}
|
|
115
115
|
render() {
|
|
116
116
|
const loaderClass = this._editorLoading ? "" : "display-none";
|
|
117
|
-
return (h("calcite-loader", { key: '
|
|
117
|
+
return (h("calcite-loader", { key: '5302b1166a175b0605604792cd40b9d3fbfabd02', class: loaderClass, label: "", scale: "s" }));
|
|
118
118
|
}
|
|
119
119
|
/**
|
|
120
120
|
* StencilJS: Called once just after the component is fully loaded and the first render() occurs.
|
|
@@ -162,6 +162,13 @@ export class CreateRelatedFeature {
|
|
|
162
162
|
}
|
|
163
163
|
});
|
|
164
164
|
this._editor.viewModel.addHandles(attachmentHandle);
|
|
165
|
+
//Add handle to watch featureFormViewModel ready state
|
|
166
|
+
const formHandle = this.reactiveUtils.watch(() => { var _a; return (_a = this._editor.viewModel.featureFormViewModel) === null || _a === void 0 ? void 0 : _a.state; }, (state) => {
|
|
167
|
+
if (state === 'ready') {
|
|
168
|
+
this.formReady.emit();
|
|
169
|
+
}
|
|
170
|
+
});
|
|
171
|
+
this._editor.viewModel.addHandles(formHandle);
|
|
165
172
|
}
|
|
166
173
|
/**
|
|
167
174
|
* Start creating the feature feature form
|
|
@@ -187,8 +194,6 @@ export class CreateRelatedFeature {
|
|
|
187
194
|
await this._editor.startCreateFeaturesWorkflowAtFeatureCreation(creationInfo);
|
|
188
195
|
//hides the header and footer elements in editor widget
|
|
189
196
|
await this.hideEditorsElements();
|
|
190
|
-
// Emit an event to show submit cancel buttons
|
|
191
|
-
this.isActionPending.emit(false);
|
|
192
197
|
this._editor.viewModel.featureFormViewModel.on('submit', this.submitted.bind(this));
|
|
193
198
|
}
|
|
194
199
|
/**
|
|
@@ -422,6 +427,21 @@ export class CreateRelatedFeature {
|
|
|
422
427
|
"resolved": "boolean",
|
|
423
428
|
"references": {}
|
|
424
429
|
}
|
|
430
|
+
}, {
|
|
431
|
+
"method": "formReady",
|
|
432
|
+
"name": "formReady",
|
|
433
|
+
"bubbles": true,
|
|
434
|
+
"cancelable": true,
|
|
435
|
+
"composed": true,
|
|
436
|
+
"docs": {
|
|
437
|
+
"tags": [],
|
|
438
|
+
"text": "Emitted on demand when form is ready"
|
|
439
|
+
},
|
|
440
|
+
"complexType": {
|
|
441
|
+
"original": "void",
|
|
442
|
+
"resolved": "void",
|
|
443
|
+
"references": {}
|
|
444
|
+
}
|
|
425
445
|
}];
|
|
426
446
|
}
|
|
427
447
|
static get methods() {
|
|
@@ -118,7 +118,7 @@ export class CrowdsourceReporter {
|
|
|
118
118
|
*/
|
|
119
119
|
render() {
|
|
120
120
|
const themeClass = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light";
|
|
121
|
-
return (h(Host, { key: '
|
|
121
|
+
return (h(Host, { key: 'e512e2693a586f8a6da7bcfa171feb60da26aee3' }, this._reportSubmitted && h("calcite-alert", { key: 'e5805ba948f1dc43eba2a78716af452cf71a8222', "auto-close": true, class: themeClass + " report-submitted-msg", icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._reportSubmitted = false; }, open: true, placement: "top" }, h("div", { key: '95b9accf1f09186c09c81cfb02a8939c4869ae8d', slot: "message" }, this.reportSubmittedMessage ? this.reportSubmittedMessage : this._translations.submitMsg)), this._featureCreationFailedErrorMsg && h("calcite-alert", { key: 'cab7f0e0f0d882612b4fa6f00799be9870aea6c5', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._featureCreationFailedErrorMsg = ""; }, open: true, placement: "top" }, h("div", { key: 'b9453672d85e26cf7bdeae0923cd36020d259d49', slot: "title" }, this._translations.error), h("div", { key: '5084315857bc88b8f80aaa411ac3fd5e4493e918', slot: "message" }, this._featureCreationFailedErrorMsg)), this._commentSubmitted && h("calcite-alert", { key: '62b7d9818913c3331ca9c8e4ed23c7f0c48a7946', "auto-close": true, class: 'report-submitted ' + themeClass, icon: "check-circle", kind: "success", label: "", onCalciteAlertClose: () => { this._commentSubmitted = false; }, open: true, placement: "top" }, h("div", { key: '5f18444fd375657db0c2a403cb453ead75536181', slot: "message" }, this._translations.commentSubmittedMsg)), this._addingCommentFailed && h("calcite-alert", { key: '732f08960095fc9fefcc79fc8df387a5a4c3f781', "auto-close": true, class: themeClass, icon: "x-octagon", kind: "danger", label: "", onCalciteAlertClose: () => { this._addingCommentFailed = false; }, open: true, placement: "top" }, h("div", { key: '16415430cf33ce53c0d49cab19dce2c3e34257d6', slot: "title" }, this._translations.error), h("div", { key: '83e5918e00902bd49512165f4aa62813cecb4619', slot: "message" }, this._translations.addingCommentFailedMsg)), h("div", { key: '3e9dadd880319708e64e717ba7e7adaddf97b935' }, h("calcite-shell", { key: 'c72664d361b3904bc191668207c3ad31ff1f98c9', "content-behind": true }, this._getReporter())), this.filterModal()));
|
|
122
122
|
}
|
|
123
123
|
//--------------------------------------------------------------------------
|
|
124
124
|
//
|
|
@@ -295,7 +295,7 @@ export class CrowdsourceReporter {
|
|
|
295
295
|
* @protected
|
|
296
296
|
*/
|
|
297
297
|
getFeatureCreateFlowItem() {
|
|
298
|
-
return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, onCalciteFlowItemBack: this.backFromCreateFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateFeaturePanel.bind(this), width: "full" }, this._translations.cancel)), h("calcite-panel", { "full-height": true, "full-width": true }, h("div", { class: "progress-bar" }, h("calcite-progress", { type: "determinate", value: this._updatedProgressBarStatus })), h("calcite-notice", { class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, h("div", { slot: "message" }, this._translations.featureEditFormInfoMsg)), h("create-feature", { customizeSubmit: true, mapView: this.mapView, onDrawComplete: this.
|
|
298
|
+
return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._selectedLayerName, onCalciteFlowItemBack: this.backFromCreateFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateFeaturePanel.bind(this), width: "full" }, this._translations.cancel)), h("calcite-panel", { "full-height": true, "full-width": true }, h("div", { class: "progress-bar" }, h("calcite-progress", { type: "determinate", value: this._updatedProgressBarStatus })), h("calcite-notice", { class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, h("div", { slot: "message" }, this._translations.featureEditFormInfoMsg)), h("create-feature", { customizeSubmit: true, mapView: this.mapView, onDrawComplete: this.onFormReady.bind(this), onEditingAttachment: this.showSubmitCancelButton.bind(this), onFail: this.createFeatureFailed.bind(this), onProgressStatus: this.updatedProgressStatus.bind(this), onSuccess: this.onReportSubmitted.bind(this), ref: el => this._createFeature = el, searchConfiguration: this.searchConfiguration, selectedLayerId: this._selectedLayerId }))));
|
|
299
299
|
}
|
|
300
300
|
/**
|
|
301
301
|
* Update the progress bar status when editor panel changes
|
|
@@ -306,10 +306,12 @@ export class CrowdsourceReporter {
|
|
|
306
306
|
this._updatedProgressBarStatus = evt.detail;
|
|
307
307
|
}
|
|
308
308
|
/**
|
|
309
|
-
* When
|
|
309
|
+
* When form is ready then show submit and cancel button
|
|
310
310
|
* @protected
|
|
311
311
|
*/
|
|
312
|
-
|
|
312
|
+
onFormReady() {
|
|
313
|
+
// update the form state when form is ready
|
|
314
|
+
this.updateFormState(true);
|
|
313
315
|
this._showSubmitCancelButton = true;
|
|
314
316
|
}
|
|
315
317
|
/**
|
|
@@ -336,6 +338,10 @@ export class CrowdsourceReporter {
|
|
|
336
338
|
if (this._createFeature) {
|
|
337
339
|
void this._createFeature.close();
|
|
338
340
|
}
|
|
341
|
+
//on back form will be closed, so update the form state
|
|
342
|
+
if (this.isFormOpen) {
|
|
343
|
+
this.updateFormState(false);
|
|
344
|
+
}
|
|
339
345
|
this.backFromSelectedPanel();
|
|
340
346
|
}
|
|
341
347
|
/**
|
|
@@ -356,6 +362,10 @@ export class CrowdsourceReporter {
|
|
|
356
362
|
void this._createRelatedFeature.close();
|
|
357
363
|
this._showSubmitCancelButton = false;
|
|
358
364
|
}
|
|
365
|
+
//on back form will be closed, so update the form state
|
|
366
|
+
if (this.isFormOpen) {
|
|
367
|
+
this.updateFormState(false);
|
|
368
|
+
}
|
|
359
369
|
this.backFromSelectedPanel();
|
|
360
370
|
}
|
|
361
371
|
/**
|
|
@@ -372,6 +382,10 @@ export class CrowdsourceReporter {
|
|
|
372
382
|
* @protected
|
|
373
383
|
*/
|
|
374
384
|
onReportSubmitted() {
|
|
385
|
+
//on report submit form will be closed, so update the form state
|
|
386
|
+
if (this.isFormOpen) {
|
|
387
|
+
this.updateFormState(false);
|
|
388
|
+
}
|
|
375
389
|
this._reportSubmitted = true;
|
|
376
390
|
void this.navigateToHomePage();
|
|
377
391
|
}
|
|
@@ -508,7 +522,16 @@ export class CrowdsourceReporter {
|
|
|
508
522
|
*/
|
|
509
523
|
toggleSidePanel() {
|
|
510
524
|
this._sidePanelCollapsed = !this._sidePanelCollapsed;
|
|
511
|
-
this.togglePanel.emit(this._sidePanelCollapsed);
|
|
525
|
+
this.togglePanel.emit({ panelState: this._sidePanelCollapsed, isFormOpen: this.isFormOpen });
|
|
526
|
+
}
|
|
527
|
+
/**
|
|
528
|
+
* Hide map when form open in case of mobile
|
|
529
|
+
* @param isFormOpen updated form state
|
|
530
|
+
* @protected
|
|
531
|
+
*/
|
|
532
|
+
updateFormState(isFormOpen) {
|
|
533
|
+
this.isFormOpen = isFormOpen;
|
|
534
|
+
this.togglePanel.emit({ panelState: this._sidePanelCollapsed, isFormOpen: this.isFormOpen });
|
|
512
535
|
}
|
|
513
536
|
/**
|
|
514
537
|
* When feature is selected from list store that and show feature details
|
|
@@ -603,7 +626,7 @@ export class CrowdsourceReporter {
|
|
|
603
626
|
* @returns Node
|
|
604
627
|
*/
|
|
605
628
|
getAddCommentFlowItem() {
|
|
606
|
-
return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._relatedTable.title, onCalciteFlowItemBack: this.backFromCreateRelatedFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), h("div", { class: "width-full", slot: "footer" }, this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateRelatedFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateRelatedFeaturePanel.bind(this), width: "full" }, this._translations.cancel))), h("calcite-panel", null, h("create-related-feature", { customizeSubmit: true, mapView: this.mapView, onFail: this.addCommentFailed.bind(this), onIsActionPending: this.showSubmitCancelButton.bind(this), onSuccess: this.onCommentSubmitted.bind(this), ref: el => this._createRelatedFeature = el, selectedFeature: this._currentFeature, table: this._relatedTable }))));
|
|
629
|
+
return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._relatedTable.title, onCalciteFlowItemBack: this.backFromCreateRelatedFeaturePanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), h("div", { class: "width-full", slot: "footer" }, this._showSubmitCancelButton && h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", onClick: this.onCreateRelatedFeatureSubmitButtonClick.bind(this), width: "full" }, this._translations.submit), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromCreateRelatedFeaturePanel.bind(this), width: "full" }, this._translations.cancel))), h("calcite-panel", null, h("create-related-feature", { customizeSubmit: true, mapView: this.mapView, onFail: this.addCommentFailed.bind(this), onFormReady: this.onFormReady.bind(this), onIsActionPending: this.showSubmitCancelButton.bind(this), onSuccess: this.onCommentSubmitted.bind(this), ref: el => this._createRelatedFeature = el, selectedFeature: this._currentFeature, table: this._relatedTable }))));
|
|
607
630
|
}
|
|
608
631
|
/**
|
|
609
632
|
* Sets the selected features and updates the first feature as the current selected feature
|
|
@@ -1425,8 +1448,8 @@ export class CrowdsourceReporter {
|
|
|
1425
1448
|
"text": "Emitted when toggle panel button is clicked in reporter"
|
|
1426
1449
|
},
|
|
1427
1450
|
"complexType": {
|
|
1428
|
-
"original": "boolean",
|
|
1429
|
-
"resolved": "boolean",
|
|
1451
|
+
"original": "{panelState: boolean, isFormOpen: boolean}",
|
|
1452
|
+
"resolved": "{ panelState: boolean; isFormOpen: boolean; }",
|
|
1430
1453
|
"references": {}
|
|
1431
1454
|
}
|
|
1432
1455
|
}];
|
|
@@ -329,10 +329,6 @@ export class FeatureDetails {
|
|
|
329
329
|
const param = { updateFeatures: [newGraphicInstance] };
|
|
330
330
|
await selectedLayer.applyEdits(param).then(() => {
|
|
331
331
|
this._selectedGraphic = selectFeatureAttr;
|
|
332
|
-
//update the current graphics in info card so that, the updated values are reflected in popup content
|
|
333
|
-
if (this._infoCard) {
|
|
334
|
-
void this._infoCard.updateCurrentGraphic(this._selectedGraphic);
|
|
335
|
-
}
|
|
336
332
|
//store the like dislike value for the current selected graphic in local storage
|
|
337
333
|
this.setInLocalStorage();
|
|
338
334
|
this._updating = false;
|
|
@@ -40,6 +40,7 @@
|
|
|
40
40
|
}
|
|
41
41
|
.over-map[dir="rtl"] {
|
|
42
42
|
right: 0px;
|
|
43
|
+
left: auto;
|
|
43
44
|
}
|
|
44
45
|
.column {
|
|
45
46
|
width: 360px;
|
|
@@ -72,6 +73,13 @@
|
|
|
72
73
|
top: calc(100% - 100px);
|
|
73
74
|
height: 100px;
|
|
74
75
|
}
|
|
76
|
+
|
|
77
|
+
.map-collapsed {
|
|
78
|
+
height: 100%;
|
|
79
|
+
top: 0;
|
|
80
|
+
width: 100%;
|
|
81
|
+
z-index: 1000;
|
|
82
|
+
}
|
|
75
83
|
}
|
|
76
84
|
</style>
|
|
77
85
|
|
|
@@ -295,22 +303,38 @@
|
|
|
295
303
|
//on change update the prop for is mobile
|
|
296
304
|
mediaQueryList.onchange = (e) => {
|
|
297
305
|
demo.isMobile = e.matches;
|
|
298
|
-
togglePanel({ detail: false })
|
|
306
|
+
togglePanel({ detail: { panelState: false, isFormOpen: false } })
|
|
299
307
|
}
|
|
300
308
|
//listen to togglePanel event
|
|
301
309
|
demo.addEventListener('togglePanel', togglePanel);
|
|
302
310
|
});
|
|
303
311
|
|
|
304
|
-
|
|
305
|
-
const
|
|
312
|
+
function togglePanel(evt) {
|
|
313
|
+
const panelState = evt.detail.panelState;
|
|
314
|
+
const hideMap = evt.detail.isFormOpen;
|
|
306
315
|
const viewDiv = document.getElementById("viewDiv");
|
|
307
316
|
const demo = document.getElementById("demo");
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
317
|
+
// in case of form is open then collapse the map
|
|
318
|
+
if (hideMap) {
|
|
319
|
+
if (panelState) {
|
|
320
|
+
demo.classList.remove("map-collapsed");
|
|
321
|
+
demo.classList.add("column-collapsed");
|
|
322
|
+
viewDiv.classList.add("map-with-panel-collapsed");
|
|
323
|
+
} else {
|
|
324
|
+
demo.classList.add("map-collapsed");
|
|
325
|
+
demo.classList.remove("column-collapsed");
|
|
326
|
+
viewDiv.classList.remove("map-with-panel-collapsed");
|
|
327
|
+
}
|
|
311
328
|
} else {
|
|
312
|
-
|
|
313
|
-
|
|
329
|
+
if (panelState) {
|
|
330
|
+
demo.classList.add("column-collapsed");
|
|
331
|
+
viewDiv.classList.add("map-with-panel-collapsed");
|
|
332
|
+
demo.classList.remove("map-collapsed");
|
|
333
|
+
} else {
|
|
334
|
+
demo.classList.remove("column-collapsed");
|
|
335
|
+
viewDiv.classList.remove("map-with-panel-collapsed");
|
|
336
|
+
demo.classList.remove("map-collapsed");
|
|
337
|
+
}
|
|
314
338
|
}
|
|
315
339
|
}
|
|
316
340
|
</script>
|
|
@@ -191,14 +191,23 @@ const CreateFeature = /*@__PURE__*/ proxyCustomElement(class CreateFeature exten
|
|
|
191
191
|
}
|
|
192
192
|
});
|
|
193
193
|
this._editor.viewModel.addHandles(handle);
|
|
194
|
+
//Add handle to watch featureFormViewModel ready state
|
|
195
|
+
const formHandle = this.reactiveUtils.watch(() => { var _a; return (_a = this._editor.viewModel.featureFormViewModel) === null || _a === void 0 ? void 0 : _a.state; }, (state) => {
|
|
196
|
+
if (state === 'ready') {
|
|
197
|
+
this._showSearchWidget = false;
|
|
198
|
+
this.progressStatus.emit(1);
|
|
199
|
+
this.drawComplete.emit();
|
|
200
|
+
}
|
|
201
|
+
});
|
|
202
|
+
this._editor.viewModel.addHandles(formHandle);
|
|
194
203
|
//Add handle to watch editor viewmodel state and then show the search widget
|
|
195
|
-
const
|
|
204
|
+
const createFeatureHandle = this.reactiveUtils.watch(() => this._editor.viewModel.state, (state) => {
|
|
196
205
|
if (state === 'creating-features') {
|
|
197
206
|
this._editorLoading = true;
|
|
198
207
|
this._showSearchWidget = true;
|
|
199
208
|
}
|
|
200
209
|
});
|
|
201
|
-
this._editor.viewModel.addHandles(
|
|
210
|
+
this._editor.viewModel.addHandles(createFeatureHandle);
|
|
202
211
|
}
|
|
203
212
|
/**
|
|
204
213
|
* Start creating the feature
|
|
@@ -216,14 +225,6 @@ const CreateFeature = /*@__PURE__*/ proxyCustomElement(class CreateFeature exten
|
|
|
216
225
|
setTimeout(() => {
|
|
217
226
|
//on form submit
|
|
218
227
|
this._editor.viewModel.featureFormViewModel.on('submit', this.submitted.bind(this));
|
|
219
|
-
//on sketch complete emit the event
|
|
220
|
-
this._editor.viewModel.sketchViewModel.on("create", (evt) => {
|
|
221
|
-
if (evt.state === "complete") {
|
|
222
|
-
this._showSearchWidget = false;
|
|
223
|
-
this.progressStatus.emit(1);
|
|
224
|
-
this.drawComplete.emit();
|
|
225
|
-
}
|
|
226
|
-
});
|
|
227
228
|
//hides the header and footer elements in editor widget
|
|
228
229
|
this.hideEditorsElements().then(() => {
|
|
229
230
|
resolve({});
|
|
@@ -337,13 +338,13 @@ const CreateFeature = /*@__PURE__*/ proxyCustomElement(class CreateFeature exten
|
|
|
337
338
|
* @protected
|
|
338
339
|
*/
|
|
339
340
|
async hideEditorsElements() {
|
|
340
|
-
var _a;
|
|
341
|
+
var _a, _b;
|
|
341
342
|
if (!this.customizeSubmit) {
|
|
342
343
|
return;
|
|
343
344
|
}
|
|
344
345
|
await this.timeout(700);
|
|
345
346
|
//hides the header and footer on the featureForm
|
|
346
|
-
(_a = this.el.querySelector('.esri-editor').querySelectorAll('calcite-flow-item')) === null ||
|
|
347
|
+
(_b = (_a = this.el.querySelector('.esri-editor')) === null || _a === void 0 ? void 0 : _a.querySelectorAll('calcite-flow-item')) === null || _b === void 0 ? void 0 : _b.forEach((flowItem) => {
|
|
347
348
|
var _a, _b, _c, _d, _e;
|
|
348
349
|
const article = (_c = (_b = (_a = flowItem.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('calcite-panel')) === null || _b === void 0 ? void 0 : _b.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('article');
|
|
349
350
|
//hide the header
|
|
@@ -17,6 +17,7 @@ const CreateRelatedFeature = /*@__PURE__*/ proxyCustomElement(class CreateRelate
|
|
|
17
17
|
this.success = createEvent(this, "success", 7);
|
|
18
18
|
this.fail = createEvent(this, "fail", 7);
|
|
19
19
|
this.isActionPending = createEvent(this, "isActionPending", 7);
|
|
20
|
+
this.formReady = createEvent(this, "formReady", 7);
|
|
20
21
|
/**
|
|
21
22
|
* boolean: Flag to maintain form submission using submit button
|
|
22
23
|
*/
|
|
@@ -109,7 +110,7 @@ const CreateRelatedFeature = /*@__PURE__*/ proxyCustomElement(class CreateRelate
|
|
|
109
110
|
}
|
|
110
111
|
render() {
|
|
111
112
|
const loaderClass = this._editorLoading ? "" : "display-none";
|
|
112
|
-
return (h("calcite-loader", { key: '
|
|
113
|
+
return (h("calcite-loader", { key: '5302b1166a175b0605604792cd40b9d3fbfabd02', class: loaderClass, label: "", scale: "s" }));
|
|
113
114
|
}
|
|
114
115
|
/**
|
|
115
116
|
* StencilJS: Called once just after the component is fully loaded and the first render() occurs.
|
|
@@ -157,6 +158,13 @@ const CreateRelatedFeature = /*@__PURE__*/ proxyCustomElement(class CreateRelate
|
|
|
157
158
|
}
|
|
158
159
|
});
|
|
159
160
|
this._editor.viewModel.addHandles(attachmentHandle);
|
|
161
|
+
//Add handle to watch featureFormViewModel ready state
|
|
162
|
+
const formHandle = this.reactiveUtils.watch(() => { var _a; return (_a = this._editor.viewModel.featureFormViewModel) === null || _a === void 0 ? void 0 : _a.state; }, (state) => {
|
|
163
|
+
if (state === 'ready') {
|
|
164
|
+
this.formReady.emit();
|
|
165
|
+
}
|
|
166
|
+
});
|
|
167
|
+
this._editor.viewModel.addHandles(formHandle);
|
|
160
168
|
}
|
|
161
169
|
/**
|
|
162
170
|
* Start creating the feature feature form
|
|
@@ -182,8 +190,6 @@ const CreateRelatedFeature = /*@__PURE__*/ proxyCustomElement(class CreateRelate
|
|
|
182
190
|
await this._editor.startCreateFeaturesWorkflowAtFeatureCreation(creationInfo);
|
|
183
191
|
//hides the header and footer elements in editor widget
|
|
184
192
|
await this.hideEditorsElements();
|
|
185
|
-
// Emit an event to show submit cancel buttons
|
|
186
|
-
this.isActionPending.emit(false);
|
|
187
193
|
this._editor.viewModel.featureFormViewModel.on('submit', this.submitted.bind(this));
|
|
188
194
|
}
|
|
189
195
|
/**
|