From 661249c05fce181417586ba49b2cfecfd873753f Mon Sep 17 00:00:00 2001 From: John Cardinal Date: Tue, 26 Nov 2019 20:31:06 +0000 Subject: [PATCH] --- ayanova/devdocs/todo.txt | 27 +-- .../src/components/custom-fields-control.vue | 187 ++++++++++++++---- 2 files changed, 158 insertions(+), 56 deletions(-) diff --git a/ayanova/devdocs/todo.txt b/ayanova/devdocs/todo.txt index 253f8fae..854ad3e8 100644 --- a/ayanova/devdocs/todo.txt +++ b/ayanova/devdocs/todo.txt @@ -45,7 +45,13 @@ CURRENT ROADMAP CURRENT TODOs =-=-=-=-=-=-= -NOW: working on Custom2 biz rule when empty on regular record (not new yet, just getting it working on regular up front) +TODO: Custom fields component + - implement each type of control + - Add code to coerce the value or handle a completely change of datatype on the record + - i.e. it was text and now is a date etc + + + TODO: Make sure can easily make new record in Widget form before getting into deeper stuff or making any other object forms. @@ -59,25 +65,6 @@ TODO: Widget edit form, new record sb time and dates pre-filled in? Server invol - some objects may be configurable what the default date/time range is so maybe enable that for widget to test - SB defaults route on server or is this a profile thing and user selectable? -TODO: Widget edit form, new record cdata error as it's empty on new - - To see, create new and edit the custom2 - -TODO: Custom fields - - Needs to cache the customization data of the form and concurrency token used to fetch it and then it checks the concurrency token periodically - - {"data":{"id":1,"concurrencyToken":3761005,"formKey":"widget","template":"[{\"fld\":\"WidgetNotes\",\"required\":\"true\"},{\"fld\":\"WidgetCustom1\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"datetime\"},{\"fld\":\"WidgetCustom2\",\"hide\":\"false\",\"required\":\"true\",\"type\":\"text\"},{\"fld\":\"WidgetCustom3\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"number\"},{\"fld\":\"WidgetCustom4\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"bool\"},{\"fld\":\"WidgetCustom5\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"currency\"},{\"fld\":\"WidgetCustom6\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"date\"},{\"fld\":\"WidgetCustom7\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"time\"}]"}} - - - Needs to be aware of and handle the fact that the end user may change the data type - - if it expects a type of value and finds one it can't co-erce into the new type then it should zap it or set it null by default. - - This could get ugly so just stick to a simple system like wiping uncoercable data and fuck it, they made their choice :) - - Implement then Componentize - - Maybe start with a component first now that I have my feet wet in it, saves time - - Have to think about the design, but probably most useful when on the same page as the main record just like in v7 windows - - Should be a single component I can reference on the form that handles it all directly - - Custom field "slot" maybe just like the VUE Way so that it can be easily optionally shown or not in it's slot - - Though, these need to be part of the record as well, hmmm...maybe better if they appear to be just normal fields and are added dynamically?? - - It would be nice though to just insert a slot and let a component handle it rather than buncvh of code on every form... - - It's kind of like one control that is bound to the JSON custom fields-field and it would update it as edited and required so I guess this is how to think about it and implement it, as a control - TODO: Form customize UI - Where you create custom fields and edit - If a user changes a field data type there needs to be a big warning before accepting it. diff --git a/ayanova/src/components/custom-fields-control.vue b/ayanova/src/components/custom-fields-control.vue index 7acd4e9c..b70fde23 100644 --- a/ayanova/src/components/custom-fields-control.vue +++ b/ayanova/src/components/custom-fields-control.vue @@ -34,7 +34,18 @@ px-2 >
- CURRENCY CONTROL HERE +
DATE CONTROL HERE @@ -46,7 +57,6 @@ DATE and TIME CONTROL HERE
- {{ lt(item.fld) }} - -
NUMBER INPUT CONTROL HERE @@ -131,21 +127,21 @@ CUSTOM FIELD DATA: export default { data() { return { - c1: null, - // c2: null, this was replaced with a computed property as will all others - c3: null, - c4: null, - c5: null, - c6: null, - c7: null, - c8: null, - c9: null, - c10: null, - c12: null, - c13: null, - c14: null, - c15: null, - c16: null + // c1: null, + // // c2: null, this was replaced with a computed property as will all others + // c3: null, + // c4: null, + // c5: null, + // c6: null, + // c7: null, + // c8: null, + // c9: null, + // c10: null, + // c12: null, + // c13: null, + // c14: null, + // c15: null, + // c16: null }; }, props: { @@ -155,6 +151,14 @@ export default { parentVM: Object }, computed: { + c1: { + get: function() { + return this.GetValueForField("c1"); + }, + set: function(newValue) { + this.SetValueForField("c1", newValue); + } + }, c2: { get: function() { return this.GetValueForField("c2"); @@ -162,12 +166,127 @@ export default { set: function(newValue) { this.SetValueForField("c2", newValue); } + }, + c3: { + get: function() { + return this.GetValueForField("c3"); + }, + set: function(newValue) { + this.SetValueForField("c3", newValue); + } + }, + c4: { + get: function() { + return this.GetValueForField("c4"); + }, + set: function(newValue) { + this.SetValueForField("c4", newValue); + } + }, + c5: { + get: function() { + return this.GetValueForField("c5"); + }, + set: function(newValue) { + this.SetValueForField("c5", newValue); + } + }, + c6: { + get: function() { + return this.GetValueForField("c6"); + }, + set: function(newValue) { + this.SetValueForField("c6", newValue); + } + }, + c7: { + get: function() { + return this.GetValueForField("c7"); + }, + set: function(newValue) { + this.SetValueForField("c7", newValue); + } + }, + c8: { + get: function() { + return this.GetValueForField("c8"); + }, + set: function(newValue) { + this.SetValueForField("c8", newValue); + } + }, + c9: { + get: function() { + return this.GetValueForField("c9"); + }, + set: function(newValue) { + this.SetValueForField("c9", newValue); + } + }, + c10: { + get: function() { + return this.GetValueForField("c10"); + }, + set: function(newValue) { + this.SetValueForField("c10", newValue); + } + }, + c11: { + get: function() { + return this.GetValueForField("c11"); + }, + set: function(newValue) { + this.SetValueForField("c11", newValue); + } + }, + c12: { + get: function() { + return this.GetValueForField("c12"); + }, + set: function(newValue) { + this.SetValueForField("c12", newValue); + } + }, + c13: { + get: function() { + return this.GetValueForField("c13"); + }, + set: function(newValue) { + this.SetValueForField("c13", newValue); + } + }, + c14: { + get: function() { + return this.GetValueForField("c14"); + }, + set: function(newValue) { + this.SetValueForField("c14", newValue); + } + }, + c15: { + get: function() { + return this.GetValueForField("c15"); + }, + set: function(newValue) { + this.SetValueForField("c15", newValue); + } + }, + c16: { + get: function() { + return this.GetValueForField("c16"); + }, + set: function(newValue) { + this.SetValueForField("c16", newValue); + } } }, methods: { lt: function(ltkey) { return window.$gz.locale.get(ltkey); }, + ltFormat() { + return window.$gz.locale.format(); + }, form() { //nothing return window.$gz.form; @@ -199,14 +318,12 @@ export default { SetValueForField: function(dataKey, newValue) { //https://stackoverflow.com/questions/39868963/vue-2-mutating-props-vue-warn - //debugger; - //Is this a new or empty custom fields object? if (this.value === null || this.value === undefined) { this.value = "{}"; //empty json fragment, field will be added later below } - //Get the data out of the json string value + //Get the current data out of the json string value // var cData = JSON.parse(this.value); if (!window.$gz._.has(cData, dataKey)) { @@ -233,7 +350,6 @@ export default { } }, beforeCreate() { - // console.log("custom-fields-control::BEFORECREATE: TOP"); //check pre-requisites exist just in case if (window.$gz.errorHandler.devMode()) { if (!window.$gz._) { @@ -245,7 +361,6 @@ export default { } }, created() { - // console.log("custom-fields-control::BEFORECREATE: TOP"); if (window.$gz.errorHandler.devMode()) { //debugger; if (!this.formKey) {