@processmaker/screen-builder 2.85.8 → 2.85.9

package/dist/vue-form-builder.es.js

@@ -17359,6 +17359,14 @@ const ac = {
       }
     },
     async submitForm(t, e = !1, r = null) {
+      const a = {
+        name: "after-submit",
+        validation: !0
+      };
+      if (this.$emit("after-submit", a, ...arguments), a.validation === !1) {
+        this.$emit("submit", this.vdata, e, r);
+        return;
+      }
       if (await this.validateNow(qv(this)), this.hasSubmitted(!0), !this.valid__ || this.disableSubmit__) {
         this.message__ && window.ProcessMaker.alert(this.message__, "danger");
         return;
@@ -44237,12 +44245,15 @@ const mK = {
     },
     setCurrentPage(t) {
       this.$refs.component.setCurrentPage(t);
+    },
+    afterSubmit() {
+      this.$emit("after-submit", ...arguments);
     }
   }
 };
 var gK = function() {
   var e = this, r = e._self._c;
-  return r("b-container", { attrs: { fluid: "" } }, [e.displayAsyncLoading ? r("div", { ref: "watchersAsynchronous", staticClass: "alert alert-light", attrs: { role: "alert" } }, [r("svg", { staticClass: "lds-gear", attrs: { width: "20px", height: "20px", xmlns: "http://www.w3.org/2000/svg", "xmlns:xlink": "http://www.w3.org/1999/xlink", viewBox: "0 0 100 100", preserveAspectRatio: "xMidYMid" } }, [r("g", { attrs: { transform: "translate(50 50)" } }, [r("g", { attrs: { transform: "rotate(248.825)" } }, [r("animateTransform", { attrs: { attributeName: "transform", type: "rotate", values: "0;360", keyTimes: "0;1", dur: "4.7s", repeatCount: "indefinite" } }), r("path", { attrs: { d: "M37.43995192304605 -6.5 L47.43995192304605 -6.5 L47.43995192304605 6.5 L37.43995192304605 6.5 A38 38 0 0 1 35.67394948182593 13.090810836924174 L35.67394948182593 13.090810836924174 L44.33420351967032 18.090810836924174 L37.83420351967032 29.34914108612188 L29.17394948182593 24.34914108612188 A38 38 0 0 1 24.34914108612188 29.17394948182593 L24.34914108612188 29.17394948182593 L29.34914108612188 37.83420351967032 L18.090810836924184 44.33420351967032 L13.090810836924183 35.67394948182593 A38 38 0 0 1 6.5 37.43995192304605 L6.5 37.43995192304605 L6.500000000000001 47.43995192304605 L-6.499999999999995 47.43995192304606 L-6.499999999999996 37.43995192304606 A38 38 0 0 1 -13.09081083692417 35.67394948182593 L-13.09081083692417 35.67394948182593 L-18.09081083692417 44.33420351967032 L-29.34914108612187 37.834203519670325 L-24.349141086121872 29.173949481825936 A38 38 0 0 1 -29.17394948182592 24.34914108612189 L-29.17394948182592 24.34914108612189 L-37.83420351967031 29.349141086121893 L-44.33420351967031 18.0908108369242 L-35.67394948182592 13.090810836924193 A38 38 0 0 1 -37.43995192304605 6.5000000000000036 L-37.43995192304605 6.5000000000000036 L-47.43995192304605 6.500000000000004 L-47.43995192304606 -6.499999999999993 L-37.43995192304606 -6.499999999999994 A38 38 0 0 1 -35.67394948182593 -13.090810836924167 L-35.67394948182593 -13.090810836924167 L-44.33420351967032 -18.090810836924163 L-37.834203519670325 -29.34914108612187 L-29.173949481825936 -24.34914108612187 A38 38 0 0 1 -24.349141086121893 -29.17394948182592 L-24.349141086121893 -29.17394948182592 L-29.349141086121897 -37.834203519670304 L-18.0908108369242 -44.334203519670304 L-13.090810836924195 -35.67394948182592 A38 38 0 0 1 -6.500000000000005 -37.43995192304605 L-6.500000000000005 -37.43995192304605 L-6.500000000000007 -47.43995192304605 L6.49999999999999 -47.43995192304606 L6.499999999999992 -37.43995192304606 A38 38 0 0 1 13.090810836924149 -35.67394948182594 L13.090810836924149 -35.67394948182594 L18.090810836924142 -44.33420351967033 L29.349141086121847 -37.83420351967034 L24.349141086121854 -29.17394948182595 A38 38 0 0 1 29.17394948182592 -24.349141086121893 L29.17394948182592 -24.349141086121893 L37.834203519670304 -29.349141086121897 L44.334203519670304 -18.0908108369242 L35.67394948182592 -13.090810836924197 A38 38 0 0 1 37.43995192304605 -6.500000000000007 M0 -20A20 20 0 1 0 0 20 A20 20 0 1 0 0 -20" } })], 1)])]), e._v(" " + e._s(e.$t("Loading...")) + " ")]) : e._e(), r(e.component, { ref: "component", tag: "component", attrs: { vdata: e.value, _parent: e._parent, "_initial-page": e.currentPage }, on: { submit: e.submit, asyncWatcherTriggered: e.onAsyncWatcherOn, asyncWatcherCompleted: e.onAsyncWatcherOff } }), e.showErrors && e.building.error ? r("screen-renderer-error", { model: { value: e.building, callback: function(a) {
+  return r("b-container", { attrs: { fluid: "" } }, [e.displayAsyncLoading ? r("div", { ref: "watchersAsynchronous", staticClass: "alert alert-light", attrs: { role: "alert" } }, [r("svg", { staticClass: "lds-gear", attrs: { width: "20px", height: "20px", xmlns: "http://www.w3.org/2000/svg", "xmlns:xlink": "http://www.w3.org/1999/xlink", viewBox: "0 0 100 100", preserveAspectRatio: "xMidYMid" } }, [r("g", { attrs: { transform: "translate(50 50)" } }, [r("g", { attrs: { transform: "rotate(248.825)" } }, [r("animateTransform", { attrs: { attributeName: "transform", type: "rotate", values: "0;360", keyTimes: "0;1", dur: "4.7s", repeatCount: "indefinite" } }), r("path", { attrs: { d: "M37.43995192304605 -6.5 L47.43995192304605 -6.5 L47.43995192304605 6.5 L37.43995192304605 6.5 A38 38 0 0 1 35.67394948182593 13.090810836924174 L35.67394948182593 13.090810836924174 L44.33420351967032 18.090810836924174 L37.83420351967032 29.34914108612188 L29.17394948182593 24.34914108612188 A38 38 0 0 1 24.34914108612188 29.17394948182593 L24.34914108612188 29.17394948182593 L29.34914108612188 37.83420351967032 L18.090810836924184 44.33420351967032 L13.090810836924183 35.67394948182593 A38 38 0 0 1 6.5 37.43995192304605 L6.5 37.43995192304605 L6.500000000000001 47.43995192304605 L-6.499999999999995 47.43995192304606 L-6.499999999999996 37.43995192304606 A38 38 0 0 1 -13.09081083692417 35.67394948182593 L-13.09081083692417 35.67394948182593 L-18.09081083692417 44.33420351967032 L-29.34914108612187 37.834203519670325 L-24.349141086121872 29.173949481825936 A38 38 0 0 1 -29.17394948182592 24.34914108612189 L-29.17394948182592 24.34914108612189 L-37.83420351967031 29.349141086121893 L-44.33420351967031 18.0908108369242 L-35.67394948182592 13.090810836924193 A38 38 0 0 1 -37.43995192304605 6.5000000000000036 L-37.43995192304605 6.5000000000000036 L-47.43995192304605 6.500000000000004 L-47.43995192304606 -6.499999999999993 L-37.43995192304606 -6.499999999999994 A38 38 0 0 1 -35.67394948182593 -13.090810836924167 L-35.67394948182593 -13.090810836924167 L-44.33420351967032 -18.090810836924163 L-37.834203519670325 -29.34914108612187 L-29.173949481825936 -24.34914108612187 A38 38 0 0 1 -24.349141086121893 -29.17394948182592 L-24.349141086121893 -29.17394948182592 L-29.349141086121897 -37.834203519670304 L-18.0908108369242 -44.334203519670304 L-13.090810836924195 -35.67394948182592 A38 38 0 0 1 -6.500000000000005 -37.43995192304605 L-6.500000000000005 -37.43995192304605 L-6.500000000000007 -47.43995192304605 L6.49999999999999 -47.43995192304606 L6.499999999999992 -37.43995192304606 A38 38 0 0 1 13.090810836924149 -35.67394948182594 L13.090810836924149 -35.67394948182594 L18.090810836924142 -44.33420351967033 L29.349141086121847 -37.83420351967034 L24.349141086121854 -29.17394948182595 A38 38 0 0 1 29.17394948182592 -24.349141086121893 L29.17394948182592 -24.349141086121893 L37.834203519670304 -29.349141086121897 L44.334203519670304 -18.0908108369242 L35.67394948182592 -13.090810836924197 A38 38 0 0 1 37.43995192304605 -6.500000000000007 M0 -20A20 20 0 1 0 0 20 A20 20 0 1 0 0 -20" } })], 1)])]), e._v(" " + e._s(e.$t("Loading...")) + " ")]) : e._e(), r(e.component, { ref: "component", tag: "component", attrs: { vdata: e.value, _parent: e._parent, "_initial-page": e.currentPage }, on: { "after-submit": e.afterSubmit, submit: e.submit, asyncWatcherTriggered: e.onAsyncWatcherOn, asyncWatcherCompleted: e.onAsyncWatcherOff } }), e.showErrors && e.building.error ? r("screen-renderer-error", { model: { value: e.building, callback: function(a) {
     e.building = a;
   }, expression: "building" } }) : e._e(), r("watchers-synchronous", { ref: "watchersSynchronous" })], 1);
 }, vK = [], bK = /* @__PURE__ */ oe(
@@ -44414,6 +44425,9 @@ const yK = {
         t.registerCustomFunction(e, this.customFunctions[e]);
       }), t.$children instanceof Array && t.$children.forEach((e) => this.registerCustomFunctions(e));
     },
+    afterSubmit() {
+      this.$emit("after-submit", ...arguments);
+    },
     submit(t, e = !1, r = null) {
       this.$emit("submit", this.data, e, r);
     },
@@ -44486,14 +44500,14 @@ const yK = {
 };
 var xK = function() {
   var e = this, r = e._self._c;
-  return r("div", { ref: "formRendererContainer", class: [e.containerClass, e.containerDeviceClass], style: e.cssDevice, attrs: { id: "vue-form-renderer", "data-cy": "screen-renderer-container" } }, [r("custom-css-output", [e._v(e._s(e.customCssWrapped))]), r("screen-renderer", { ref: "renderer", staticClass: "p-0", attrs: { value: e.data, _parent: e._parent, definition: e.definition, "current-page": e.currentPage, "data-cy": "screen-renderer", "show-errors": e.showErrors, "test-screen-definition": e.testScreenDefinition || !1, "loop-context": e.loopContext }, on: { submit: e.submit } })], 1);
+  return r("div", { ref: "formRendererContainer", class: [e.containerClass, e.containerDeviceClass], style: e.cssDevice, attrs: { id: "vue-form-renderer", "data-cy": "screen-renderer-container" } }, [r("custom-css-output", [e._v(e._s(e.customCssWrapped))]), r("screen-renderer", { ref: "renderer", staticClass: "p-0", attrs: { value: e.data, _parent: e._parent, definition: e.definition, "current-page": e.currentPage, "data-cy": "screen-renderer", "show-errors": e.showErrors, "test-screen-definition": e.testScreenDefinition || !1, "loop-context": e.loopContext }, on: { "after-submit": e.afterSubmit, submit: e.submit } })], 1);
 }, SK = [], _K = /* @__PURE__ */ oe(
   yK,
   xK,
   SK,
   !1,
   null,
-  "caa03b53",
+  "d595a04b",
   null,
   null
 );
@@ -48527,6 +48541,13 @@ const UX = WX.exports, av = 200, GX = {
     buttonIcon: {
       type: String,
       default: () => "fa fa-file"
+    },
+    /**
+     * Is multi page mode enabled
+     */
+    isMultiPage: {
+      type: Boolean,
+      default: !0
     }
   },
   data() {
@@ -48641,9 +48662,9 @@ var HX = function() {
   }, expression: "activeTab" } }, e._l(e.validLocalOpenedPages, function(a, i) {
     return r("b-tab", { key: `tab-${i}`, staticClass: "h-100 w-100", scopedSlots: e._u([{ key: "title", fn: function() {
       var n;
-      return [r("b-badge", { staticClass: "mr-1", attrs: { variant: "primary" } }, [e._v(" " + e._s(e.pageNumber(a)) + " ")]), r("span", { attrs: { "data-test": `tab-${i}` } }, [e._v(" " + e._s((n = e.pages[a]) == null ? void 0 : n.name) + " ")]), r("span", { staticClass: "close-tab", attrs: { "data-test": `close-tab-${i}`, role: "link" }, on: { click: function(s) {
+      return [r("b-badge", { staticClass: "mr-1", attrs: { variant: "primary" } }, [e._v(" " + e._s(e.pageNumber(a)) + " ")]), r("span", { attrs: { "data-test": `tab-${i}` } }, [e._v(" " + e._s((n = e.pages[a]) == null ? void 0 : n.name) + " ")]), e.isMultiPage ? r("span", { staticClass: "close-tab", attrs: { "data-test": `close-tab-${i}`, role: "link" }, on: { click: function(s) {
         return s.stopPropagation(), e.closeTab(i);
-      } } }, [r("i", { staticClass: "fas fa-times" })])];
+      } } }, [r("i", { staticClass: "fas fa-times" })]) : e._e()];
     }, proxy: !0 }, { key: "default", fn: function() {
       return [r("div", { staticClass: "h-100 w-100", attrs: { "data-test": "tab-content" } }, [e._t("default", null, { currentPage: a })], 2)];
     }, proxy: !0 }], null, !0) });
@@ -49407,7 +49428,7 @@ var dee = function() {
                     boundaryPadding: 16
                   }`, modifiers: { hover: !0, right: !0 } }], key: o, staticClass: "gray-text", attrs: { boundary: "viewport", "data-cy": `controls-${s.component}` } }, [s.config && s.config.icon ? r("i", { class: s.config.icon }) : e._e(), r("span", { staticClass: "svg-icon", staticStyle: { width: "12px", height: "12px" }, domProps: { innerHTML: e._s(s.config.svg) } }), e._v(" " + e._s(e.$t(s.label)) + " ")]);
     }), 1) : e._e()], 1)], 1)];
-  })], 2)], 1)], 1), r("b-col", { ref: "screen-container", staticClass: "overflow-auto mh-100 p-0 d-flex flex-column position-relative", attrs: { id: "screen-container" } }, [r("tabs-bar", { ref: "tabsBar", attrs: { pages: e.config }, on: { "tab-opened": function(a) {
+  })], 2)], 1)], 1), r("b-col", { ref: "screen-container", staticClass: "overflow-auto mh-100 p-0 d-flex flex-column position-relative", attrs: { id: "screen-container" } }, [r("tabs-bar", { ref: "tabsBar", attrs: { pages: e.config, "is-multi-page": e.showToolbar }, on: { "tab-opened": function(a) {
     e.currentPage = a;
   } }, scopedSlots: e._u([{ key: "tabs-start", fn: function() {
     return [e.showToolbar ? r("pages-dropdown", { attrs: { data: e.sortedPages }, on: { addPage: function(a) {
@@ -49495,7 +49516,7 @@ var dee = function() {
   pee,
   !1,
   null,
-  "18839616",
+  "404a695f",
   null,
   null
 );
@@ -50801,6 +50822,9 @@ const zee = Iee.exports, jee = () => new Promise((t) => {
       }
       return "card-header text-capitalize text-white " + e;
     },
+    afterSubmit() {
+      this.$emit("after-submit", ...arguments);
+    },
     submit(t = null, e = !1, r = null) {
       var a;
       this.disabled || (this.disabled = !0, t && this.onUpdate(Object.assign({}, this.requestData, t)), e ? this.loadingButton = !0 : this.loadingButton = !1, this.$emit("submit", this.task, e, r), (a = this.task) != null && a.allow_interstitial && !this.loadingButton && !this.disableInterstitial && (this.task.interstitial_screen._interstitial = !0, this.screen = this.task.interstitial_screen));
@@ -50888,9 +50912,9 @@ var Nee = function() {
   var e = this, r = e._self._c;
   return r("div", { staticClass: "tab-pane active show h-100", attrs: { id: "tab-form", role: "tabpanel", "aria-labelledby": "tab-form" } }, [e.screen ? [r("b-overlay", { attrs: { show: e.disabled, id: "overlay-background", variant: "white", cardStyles: "pointer-events: none;pointer-events: none;inset: 1px", rounded: "sm" }, scopedSlots: e._u([{ key: "overlay", fn: function() {
     return [r("div", { staticClass: "text-center" }, [r("p", [e._v("Please claim this task to continue.")])])];
-  }, proxy: !0 }], null, !1, 2499821482) }, [r("div", { staticClass: "card card-body border-top-0 h-100", class: e.screenTypeClass }, [e.renderComponent === "task-screen" ? r("div", [r("vue-form-renderer", { key: e.refreshScreen, ref: "renderer", attrs: { config: e.screen.config, computed: e.screen.computed, "custom-css": e.screen.custom_css, watchers: e.screen.watchers, "loop-context": e.loopContext }, on: { update: e.onUpdate, submit: e.submit }, model: { value: e.requestData, callback: function(a) {
+  }, proxy: !0 }], null, !1, 2499821482) }, [r("div", { staticClass: "card card-body border-top-0 h-100", class: e.screenTypeClass }, [e.renderComponent === "task-screen" ? r("div", [r("vue-form-renderer", { key: e.refreshScreen, ref: "renderer", attrs: { config: e.screen.config, computed: e.screen.computed, "custom-css": e.screen.custom_css, watchers: e.screen.watchers, "loop-context": e.loopContext }, on: { update: e.onUpdate, "after-submit": e.afterSubmit, submit: e.submit }, model: { value: e.requestData, callback: function(a) {
     e.requestData = a;
-  }, expression: "requestData" } })], 1) : r("div", [r(e.renderComponent, { tag: "component", attrs: { "process-id": e.processId, "instance-id": e.requestId, "token-id": e.taskId, screen: e.screen.config, "csrf-token": e.csrfToken, computed: e.screen.computed, "custom-css": e.screen.custom_css, watchers: e.screen.watchers, data: e.requestData, type: e.screen.type }, on: { submit: e.submit } })], 1)]), e.shouldAddSubmitButton ? r("div", { staticClass: "card-footer" }, [r("button", { staticClass: "btn btn-primary", attrs: { type: "button" }, on: { click: function(a) {
+  }, expression: "requestData" } })], 1) : r("div", [r(e.renderComponent, { tag: "component", attrs: { "process-id": e.processId, "instance-id": e.requestId, "token-id": e.taskId, screen: e.screen.config, "csrf-token": e.csrfToken, computed: e.screen.computed, "custom-css": e.screen.custom_css, watchers: e.screen.watchers, data: e.requestData, type: e.screen.type }, on: { "after-submit": e.afterSubmit, submit: e.submit } })], 1)]), e.shouldAddSubmitButton ? r("div", { staticClass: "card-footer" }, [r("button", { staticClass: "btn btn-primary", attrs: { type: "button" }, on: { click: function(a) {
     return e.submit(null);
   } } }, [e._v(" " + e._s(e.$t("Complete Task")) + " ")])]) : e._e()])] : e._e(), e.showTaskIsCompleted ? [r("div", { staticClass: "card card-body text-center" }, [r("h1", [e._v(" " + e._s(e.$t("Task Completed")) + " "), r("i", { staticClass: "fas fa-clipboard-check" })])])] : e._e()], 2);
 }, Ree = [], Fee = /* @__PURE__ */ oe(