@processmaker/screen-builder 2.26.0 → 2.27.0

package/package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@processmaker/screen-builder",
-  "version": "2.26.0",
+  "version": "2.27.0",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@processmaker/screen-builder",
-  "version": "2.26.0",
+  "version": "2.27.0",
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",

package/src/components/inspector/screen-selector.vue

@@ -102,6 +102,12 @@ export default {
     },
   },
   mounted() {
+    this.$root.$on('remove-nested', (nestedScreenId) => {
+      if (this.value === nestedScreenId) {
+        this.$emit('input', null);
+      }
+    });
+
     let pmql = '(type = "FORM" or type = "DISPLAY")';
     if (this.screenType === formTypes.display) {
       pmql = '(type = "DISPLAY")';

package/src/components/renderer/form-nested-screen.vue

@@ -116,6 +116,7 @@ export default {
                 globalObject['nestedScreens'] = {};
               }
               globalObject.nestedScreens['id_' + id] = this.config;
+              this.$root.$emit('nested-screen-updated');
             }
           });
       }

package/src/components/vue-form-builder.vue

@@ -474,6 +474,7 @@ export default {
   watch: {
     config: {
       handler() {
+        this.checkForCaptchaInLoops();
         this.$emit('change', this.config);
         this.loadVariablesTree();
       },
@@ -517,6 +518,36 @@ export default {
     refreshContent() {
       this.editorContentKey++;
     },
+    checkForCaptchaInLoops() {
+      this.config.forEach(page => {
+        this.checkForCaptcha(page.items);
+      });
+    },
+    checkForCaptcha(items, insideLoop = false, nestedScreen = null) {
+      items.forEach(item => {
+        if (!item.items && item.component == 'Captcha' && insideLoop) {
+          if (nestedScreen && nestedScreen.config.screen) {
+            this.$root.$emit('remove-nested', nestedScreen.config.screen);
+            nestedScreen.config.screen = null;
+            globalObject.ProcessMaker.alert(this.$t('You are trying to place a nested screen within CAPTCHA elements inside a loop. CAPTCHA controls cannot be placed within a Loop control.'), 'danger');
+          } else {
+            items.splice(items.indexOf(item), 1);
+            globalObject.ProcessMaker.alert(this.$t('CAPTCHA controls cannot be placed within a Loop control.'), 'danger');
+          }
+        }
+        if (item.items) {
+          this.checkForCaptcha(item.items, true);
+        }
+        if (item.component == 'FormNestedScreen' && insideLoop && item.config.screen && window.nestedScreens) {
+          let nestedScreenItems = window.nestedScreens['id_' + item.config.screen];
+          if (nestedScreenItems) {
+            nestedScreenItems.forEach(nestedScreenPage => {
+              this.checkForCaptcha(nestedScreenPage.items, true, item);
+            });
+          }
+        }
+      });
+    },
     loadVariablesTree() {
       const definition = {
         config : this.$parent.config,
@@ -843,6 +874,9 @@ export default {
   },
   mounted() {
     this.loadVariablesTree();
+    this.$root.$on('nested-screen-updated', () => {
+      this.checkForCaptchaInLoops();
+    });
   },
 };
 </script>

package/dist/demo.html

@@ -1,10 +0,0 @@
-<meta charset="utf-8">
-<title>vue-form-builder demo</title>
-<script src="./vue-form-builder.umd.js"></script>
-
-<link rel="stylesheet" href="./vue-form-builder.css">
-
-
-<script>
-console.log(vue-form-builder)
-</script>