ayanova/src/api/form-custom-template.js

@@ -1,8 +1,26 @@
-/* XXeslint-disable */
+/*eslint-disable */
 import store from "../store";
 import gzapi from "./gzapi";
 import _ from "../libs/lodash.min.js";
 
+
+function addDataKeyNames(obj) {
+  //debugger;
+  //iterate the array of objects
+  //if it has a "type" property then it's a custom field so add its data key name
+
+  
+  for (var i = 0; i < obj.length; i++) {
+    if(obj[i].type){
+      obj[i]["dataKey"]="c"+parseInt(obj[i].fld.replace( /^\D+/g, ''))
+    }
+  }
+
+  //return the whole thing again now translated
+  return obj;
+}
+
+
 export default {
   get(formKey) {
     return new Promise(function getFormTemplate(resolve) {
@@ -15,7 +33,7 @@ export default {
 
           store.commit("addFormCustomTemplateItem", {
             formKey: formKey,
-            value: JSON.parse(res.data.template)
+            value: addDataKeyNames(JSON.parse(res.data.template))
           });
           resolve();
         });

ayanova/src/components/custom-fields-control.vue

@@ -61,6 +61,8 @@
 /**
  * v-if="item.hide == false"
  *
+ * some discussion here might be useful: https://github.com/vuejs/vue/issues/1056
+ * 
  * TODO: have the template, have the custom field data, now just need to show it all properly and update the fragment of json when changes made which then updates the
  * parent object.
  *
@@ -92,7 +94,7 @@ CUSTOM FIELD DATA:
 export default {
   data() {
     return {
-      obj: { me: 1, c2: "This is my c2 data!" },
+      obj: { me: 1, c2: "This is my c2 data!",  WidgetCustom2: "Here is my OBJ.WidgetCustom2 Data!" },
       WidgetCustom2: "Here is my WidgetCustom2 Data!"
     };
   },
@@ -116,6 +118,9 @@ export default {
     },
     bindName: function() {
       return this.obj.c2;
+    },
+    translateFieldNameToDataObjectKeyName: function(fldName){
+      return "c2";
     }
   },
   beforeCreate() {