@processmaker/screen-builder 2.24.1-patch1 → 2.25.1

package/package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@processmaker/screen-builder",
-  "version": "2.24.1-patch1",
+  "version": "2.25.1",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -1738,9 +1738,9 @@
       }
     },
     "@processmaker/vue-form-elements": {
-      "version": "0.28.6",
-      "resolved": "https://registry.npmjs.org/@processmaker/vue-form-elements/-/vue-form-elements-0.28.6.tgz",
-      "integrity": "sha512-uxHsOkCNLJEF4mJu7dK4+qn2SL/mWDswdoV1kQjNjQkwBk10uGXDdAbtliHRbld3HDMAPUQAu69c+1fS8pDqjA==",
+      "version": "0.28.7",
+      "resolved": "https://registry.npmjs.org/@processmaker/vue-form-elements/-/vue-form-elements-0.28.7.tgz",
+      "integrity": "sha512-CVtaOlyrrcWLoY8bqUyb0KOi9e7kKf0oDdACyrvTpy7UzsaYP05lf6KOqMKyKUXAvpHg8UVJKjxJTbJfflNDKA==",
       "dev": true,
       "requires": {
         "@tinymce/tinymce-vue": "2.0.0",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@processmaker/screen-builder",
-  "version": "2.24.1-patch1",
+  "version": "2.25.1",
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",
@@ -44,7 +44,7 @@
     "@cypress/code-coverage": "^3.8.1",
     "@fortawesome/fontawesome-free": "^5.6.1",
     "@panter/vue-i18next": "^0.15.2",
-    "@processmaker/vue-form-elements": "0.28.6",
+    "@processmaker/vue-form-elements": "0.28.7",
     "@processmaker/vue-multiselect": "^2.2.0",
     "@vue/cli-plugin-babel": "^3.6.0",
     "@vue/cli-plugin-e2e-cypress": "^4.0.3",
@@ -85,7 +85,7 @@
   },
   "peerDependencies": {
     "@panter/vue-i18next": "^0.15.0",
-    "@processmaker/vue-form-elements": "0.28.6",
+    "@processmaker/vue-form-elements": "0.28.7",
     "i18next": "^15.0.8",
     "vue": "^2.6.12",
     "vuex": "^3.1.1"

package/src/components/renderer/file-download.vue

@@ -16,7 +16,7 @@
           >
             <i class="fas fa-file-download"/> {{ $t('Download') }}
           </b-btn>
-          {{ file.name }}
+          {{ file.file_name }}
         </div>
       </template>
       <div v-else>
@@ -39,18 +39,12 @@ export default {
       rowId: null,
     };
   },
-  props: ['name', 'value', 'endpoint', 'requestFiles', 'label'],
+  props: ['name', 'value', 'endpoint', 'requestFiles', 'label', 'transient-data'],
   mounted() {
-    this.$root.$on('set-upload-data-name',
-      (recordList, index, id) => this.listenRecordList(recordList, index, id));
-
     if (this.donwloadingNotAvailable) {
       // Not somewhere we can download anything (like web entry start event)
       return;
     }
-
-    this.checkIfInRecordList();
-    this.setPrefix();
     this.setFilesInfo();
   },
   watch: {
@@ -103,24 +97,11 @@ export default {
       }
       return false;
     },
+    requestData() {
+      return {_parent: {...this.$parent._parent}, ...this.transientData};
+    },
   },
   methods: {
-    parentRecordList(node) {
-      if (node.$parent && node.$parent.$options) {
-        if (node.$parent.$options._componentTag ===  'form-record-list') {
-          return node.$parent;
-        }
-        return this.parentRecordList(node.$parent);
-      }
-      return null;
-    },
-    listenRecordList(recordList, index, id) {
-      const parent = this.parentRecordList(this);
-      if (parent !== recordList) {
-        return;
-      }
-      this.rowId = (parent !== null) ? id : null;
-    },
     downloadFile(file) {
       if (this.collection) {
         this.downloadCollectionFile(file);
@@ -133,15 +114,16 @@ export default {
 
       if (_.has(window, 'PM4ConfigOverrides.getFileEndpoint')) {
         endpoint = window.PM4ConfigOverrides.getFileEndpoint;
-      }
-
-      if (endpoint && file.token) {
-        return `${endpoint}/${file.id}?&token=${file.token}`;
+        return `${endpoint}/${file.id}`;
       }
 
       return `/files/${file.id}/contents`;
     },
     setPrefix() {
+      if (this.name.startsWith('_parent.')) {
+        // do not set the loop prefix
+        return;
+      }
       let parent = this.$parent;
       let i = 0;
       while (!parent.loopContext) {
@@ -177,93 +159,53 @@ export default {
       const url = window.URL.createObjectURL(new Blob([response.data]));
       const link = document.createElement('a');
       link.href = url;
-      link.setAttribute('download', file.name);
+      link.setAttribute('download', file.file_name);
       document.body.appendChild(link);
       link.click();
     },
     setFilesInfo() {
       if (this.collection) {
+        this.setPrefix();
         this.setFilesInfoFromCollectionValue();
       } else {
         this.setFilesInfoFromRequest();
       }
     },
-    setFilesInfoFromRequest() {
-      if (!this.value) {
+    setFilesInfoFromRequest() { 
+      const fileId = this.value ? this.value : _.get(this.requestData, this.fileDataName, null);
+      let endpoint = this.endpoint;
+      
+      if (!this.requestId || !fileId) {
         return;
       }
-
-      let requestFiles = _.get(
-        window,
-        `PM4ConfigOverrides.requestFiles["${this.fileDataName}"]`,
-        []
-      );
-
-      requestFiles = requestFiles.filter(file => {
-        // Filter any requestFiles that don't exist in this component's value. This can happen if
-        // a file is uploaded but the task is not saved.
-        if (Array.isArray(this.value)) {
-          return this.value.some(valueFile => valueFile.file === file.id);
-        } else {
-          return file.id === this.value;
+      
+      if (!endpoint) {
+        endpoint = 'requests/' + this.requestId + '/files?id=' + fileId;
+        if (_.has(window, 'PM4ConfigOverrides.getFileEndpoint')) {
+          endpoint = window.PM4ConfigOverrides.getFileEndpoint;
+          endpoint += '/' + fileId;
         }
-      });
-
-      // Might be accessing individual files from inside a loop
-      if (requestFiles.length === 0 && this.fileDataName.endsWith('.file')) {
-        requestFiles = this.requestFileInsideALoop();
       }
 
-      this.filesInfo = requestFiles.map(file => {
-        const info = { id: file.id, name: file.file_name };
-        if (file.token) {
-          // web entry
-          info.token = file.token;
+      this.$dataProvider.get(endpoint).then(response => {
+        const fileInfo = response.data.data ? _.get(response, 'data.data.0', null) : _.get(response, 'data', null);
+        if (fileInfo) {
+          this.filesInfo.push(fileInfo);
+        } else {
+          window.ProcessMaker.alert(
+            this.$t('File Download Missing File'),
+            'danger'
+          );
         }
-        return info;
       });
     },
-    requestFileInsideALoop() {
-      const path = this.fileDataName.slice(0, -5);
-      const loopFile = _.get(
-        window,
-        `PM4ConfigOverrides.requestFiles.${path}`,
-        null
-      );
-      if (loopFile) {
-        return [loopFile]; // Treat as single file download
-      }
-      return [];
-    },
     setFilesInfoFromCollectionValue() {
-      if (!this.value) {
+      const files = this.value ? this.value : _.get(this.requestData, this.fileDataName);
+      if (!this.value && !files) {
         this.filesInfo = [];
         return;
       }
-      if (Array.isArray(this.value)) {
-        // multi file upload
-        this.filesInfo = this.value.map(value => value.file);
-      } else {
-        this.filesInfo = [this.value];
-      }
-
-    },
-    checkIfInRecordList() {
-      const parent = this.parentRecordList(this);
-      if (parent !== null) {
-        const recordList = parent;
-        const prefix = recordList.name + '.';
-        this.setFileUploadNameForChildren(recordList.$children, prefix);
-      }
-    },
-    setFileUploadNameForChildren(children, prefix) {
-      children.forEach(child => {
-        if (_.get(child, '$options.name') === 'FileDownload') {
-          child.prefix = prefix;
-        } else if (_.get(child, '$children', []).length > 0) {
-          this.setFileUploadNameForChildren(child.$children, prefix);
-        }
-      });
+      this.filesInfo = [this.value ? this.value : files];
     },
   },
 };

package/src/components/renderer/file-upload.vue

@@ -103,8 +103,6 @@ export default {
 
     this.removeDefaultClasses();
 
-    this.checkIfInRecordList();
-
     this.setPrefix();
     if (this.$refs['uploader']) {
       this.$refs['uploader'].$forceUpdate();
@@ -438,15 +436,6 @@ export default {
         this.prefix = parent.loopContext + '.';
       }
     },
-    setFileUploadNameForChildren(children, prefix) {
-      children.forEach(child => {
-        if (_.get(child, '$options.name') === 'FileUpload') {
-          child.prefix = prefix;
-        } else if (_.get(child, '$children', []).length > 0) {
-          this.setFileUploadNameForChildren(child.$children, prefix);
-        }
-      });
-    },
     addFile(file) {
       if (this.disabled) {
         file.ignored = true;
@@ -556,14 +545,6 @@ export default {
           : null;
       }
     },
-    checkIfInRecordList() {
-      const parent = this.parentRecordList(this);
-      if (parent !== null) {
-        const recordList = parent;
-        const prefix = recordList.name + '.';
-        this.setFileUploadNameForChildren(recordList.$children, prefix);
-      }
-    },
   },
 };
 </script>

package/src/components/renderer/form-record-list.vue

@@ -90,6 +90,7 @@
         debug-context="Record List Add"
         :key="Array.isArray(value) ? value.length : 0"
         :_parent="validationData"
+        @update="updateRowDataNamePrefix"
       />
     </b-modal>
     <b-modal
@@ -116,6 +117,7 @@
         debug-context="Record List Edit"
         :_parent="validationData"
         :key="editFormVersion"
+        @update="updateRowDataNamePrefix"
       />
     </b-modal>
     <b-modal
@@ -195,12 +197,14 @@ export default {
         },
       },
       initFormValues: {},
+      currentRowIndex: null,
     };
   },
   mounted() {
     if (this._perPage) {
       this.perPage = this._perPage;
     }
+    this.updateRowDataNamePrefix = _.debounce(this.updateRowDataNamePrefix, 100);
   },
   computed: {
     popupConfig() {
@@ -280,6 +284,9 @@ export default {
     },
   },
   methods: {
+    updateRowDataNamePrefix() {
+      this.setUploadDataNamePrefix(this.currentRowIndex);
+    },
     sortChanged(payload) {
       this.lastSortConfig = payload;
       this.tableData.data = this.sort(this.tableData.data, payload);
@@ -309,6 +316,7 @@ export default {
       return field.key === '__filedownload';
     },
     setUploadDataNamePrefix(index = null) {
+      this.currentRowIndex = index;
       let  rowId = null;
       if (index !== null  && this.editItem) {
         rowId = this.editItem.row_id;
@@ -428,8 +436,7 @@ export default {
       // Add the item to our model and emit change
       // @todo Also check that value is an array type, if not, reset it to an array
       let data = this.value ? JSON.parse(JSON.stringify(this.value)) : [];
-
-      const item = JSON.parse(JSON.stringify(this.addItem));
+      const item = JSON.parse(JSON.stringify({...this.addItem, _parent: undefined }));
       delete item._parent;
       data[data.length] = item;
 

package/src/components/screen-renderer.vue

@@ -26,7 +26,7 @@ import Json2Vue from '../mixins/Json2Vue';
 import CurrentPageProperty from '../mixins/CurrentPageProperty';
 import WatchersSynchronous from '@/components/watchers-synchronous';
 import ScreenRendererError from '../components/renderer/screen-renderer-error';
-import { cloneDeep, isEqual, debounce } from 'lodash';
+import { cloneDeep, isEqual } from 'lodash';
 
 export default {
   name: 'screen-renderer',
@@ -43,7 +43,6 @@ export default {
   mounted() {
     this.currentDefinition = cloneDeep(this.definition);
     this.component = this.buildComponent(this.currentDefinition);
-    this.rebuildScreen = debounce(this.rebuildScreen, 25);
   },
   watch: {
     definition: {

package/src/form-builder-controls.js

@@ -283,6 +283,7 @@ export default [
           type: 'FormInput',
           field: 'minDate',
           config: {
+            name: 'Minimum Date',
             label: 'Minimum Date',
             validation: 'date_or_mustache',
           },
@@ -291,8 +292,9 @@ export default [
           type: 'FormInput',
           field: 'maxDate',
           config: {
+            name: 'Maximum Date',
             label: 'Maximum Date',
-            validation: 'date_or_mustache',
+            validation: 'after_min_date|date_or_mustache',
           },
         },
         keyNameProperty,

package/src/mixins/Json2Vue.js

@@ -222,6 +222,9 @@ export default {
       });
     },
     registerVariable(name, element = {}) {
+      if (name && name.startsWith('_parent.') || name && name.includes('._parent.')) {
+        return;
+      }
       if (!this.validVariableName(name)) {
         return;
       }

package/src/mixins/extensions/DataManager.js

@@ -3,7 +3,7 @@ import _ from 'lodash';
 export default {
   methods: {
     dataFields(screen, definition) {
-      this.variables.filter(v => !this.isComputedVariable(v.name, definition))
+      this.variables.filter(v => (!v.name.startsWith('_parent') && !v.name.includes('._parent.') && !this.isComputedVariable(v.name, definition)))
         .forEach(v => {
           let component = _.get(v, 'element.component');
           let dataFormat = _.get(v, 'config.dataFormat', null);