ayanova/src/api/gzvalidate.js

@@ -10,20 +10,57 @@ import dayjs from "dayjs";
 import locale from "./locale";
 import _ from "../libs/lodash.min.js";
 
+function isEmpty(o) {
+  if (typeof o == "number" && o == 0) {
+    return false;
+  }
+  return !o;
+}
+
 export default {
-  Required(ltkey, value) {
-    if (!_.isEmpty(value)) {
+  /*
+    ctrl.$refs[ref].value
+0
+ctrl.$refs[ref].label
+"Count"
+ctrl.$refs[ref].initialValue
+    */
+  ///////////////////////////////
+  // REQUIRED
+  //   Required(ltkey, value) {
+  //     if (!_.isEmpty(value)) {
+  //       return false;
+  //     }
+  //     //get the localized rule text
+  //     //   "ErrorRequiredFieldEmpty": "{0} is a required field.  Please enter a value for {0}",
+  //     var err = locale.get("ErrorRequiredFieldEmpty");
+  //     var fieldName = locale.get(ltkey);
+  //     err = _.replace(err, "{0}", fieldName);
+  //     //lodash replace only replaces first instance so need to do it twice
+  //     err = _.replace(err, "{0}", fieldName);
+  //     return err;
+  //   },
+  Required(v, ref) {HERE DID THIS METHOD OVER TO NEW WAY USING REF, NOW TO DO THE REST
+    var ctrl = v.$refs[ref];
+    if (isEmpty(ctrl)) {
+      return false;
+    }
+
+    var value = ctrl.value;
+    if (!isEmpty(value)) {
       return false;
     }
     //get the localized rule text
     //   "ErrorRequiredFieldEmpty": "{0} is a required field.  Please enter a value for {0}",
     var err = locale.get("ErrorRequiredFieldEmpty");
-    var fieldName = locale.get(ltkey);
+    var fieldName = ctrl.label;
     err = _.replace(err, "{0}", fieldName);
     //lodash replace only replaces first instance so need to do it twice
     err = _.replace(err, "{0}", fieldName);
     return err;
   },
+  ///////////////////////////////
+  // MAXLENGTH
   MaxLength(ltkey, value, max) {
     if (_.isEmpty(value)) {
       return false;
@@ -41,9 +78,13 @@ export default {
       return false;
     }
   },
+  ///////////////////////////////
+  // MAX 255
   Max255(ltkey, value) {
     return this.MaxLength(ltkey, value, 255);
   },
+  ///////////////////////////////
+  // AFTER
   After(startDate, endDate) {
     if (_.isEmpty(startDate)) {
       return false;
@@ -67,5 +108,12 @@ export default {
     } else {
       return false;
     }
+  },
+  ///////////////////////////////
+  // TEST
+  Test(ctrl, ref) {
+    var v = ctrl;
+    return false;
+    // return this.MaxLength(ltkey, value, 255);
   }
 };

ayanova/src/views/inventory-widget-edit.vue

@@ -1,16 +1,15 @@
 <template>
   <v-layout v-if="this.formReady">
     <v-flex>
-      <form>
+      <form ref="form">
         <v-layout align-center justify-left row wrap>
           <v-flex xs12 sm6 lg4 xl3 px-2>
             <v-text-field
               v-model="obj.name"
               :counter="255"
               :label="this.$gzlocale.get('WidgetName')"
-              :rules="[this.$gzv.Max255('WidgetName',obj.name),this.$gzv.Required('WidgetName',obj.name)]"
-              name="name"
-              required
+              :rules="[this.$gzv.Max255('WidgetName',obj.name)]"
+              ref="name"
             ></v-text-field>
           </v-flex>
           <v-flex xs12 sm6 lg4 xl3 px-2>
@@ -19,8 +18,7 @@
               :counter="10"
               :label="this.$gzlocale.get('WidgetSerial')"
               :rules="[this.$gzv.MaxLength('WidgetSerial',obj.serial,10)]"
-              name="serial"
-              required
+              ref="serial"
             ></v-text-field>
           </v-flex>
           <v-flex xs12 sm6 lg4 xl3 px-2>
@@ -28,7 +26,9 @@
               v-model="obj.count"
               :counter="10"
               :label="this.$gzlocale.get('WidgetCount')"
+              ref="count"
               name="count"
+              :rules="[this.$gzv.Required(this,'count')]"
               required
             ></v-text-field>
           </v-flex>
@@ -38,36 +38,11 @@
               v-model="obj.dollarAmount"
               :prefix="this.$gzlocale.formats.currencySymbol"
               :label="this.$gzlocale.get('WidgetDollarAmount')"
-              name="dollarAmount"
+              ref="dollarAmount"
               required
             ></v-text-field>
           </v-flex>
 
-          <!--
-            This block was for testing date validation outside of my custom control with v-validate, keeping it just for now until done my own validator code
-             <v-flex xs12 sm6 lg4 xl3 px-2>
-            <v-text-field
-              :label="this.$gzlocale.get('WidgetStartDate')"
-              v-model="obj.startDate"
-              name="startDate"
-              v-validate="'required'"
-              ref="qwerty"
-              :error-messages="errors.collect('startDate')"
-              required
-            ></v-text-field>
-          </v-flex>
-
-          <v-flex xs12 sm6 lg4 xl3 px-2>
-            <v-text-field
-              :label="this.$gzlocale.get('WidgetEndDate')"
-              v-model="obj.endDate"
-              name="endDate"             
-              v-validate="'required|gzafter:qwerty'"
-              :error-messages="errors.collect('endDate')"
-              required
-            ></v-text-field>
-          </v-flex>-->
-          <!-- YYYY-MM-DDTHH:mm:ss.sssZ -->
           <v-flex xs12 sm6 lg4 xl3 px-2>
             <gz-date-time-picker
               :label="this.$gzlocale.get('WidgetStartDate')"
@@ -87,7 +62,6 @@
           <v-flex xs12 sm6 lg4 xl3 px-2>
             <v-checkbox
               v-model="obj.active"
-              value="1"
               :label="this.$gzlocale.get('Active')"
               name="checkbox"
               required
@@ -159,14 +133,7 @@ export default {
   data() {
     return {
       obj: {},
-      formReady: false,
-      theDate: new Date(),
-      date: new Date().toISOString().substr(0, 10),
-      menu: false,
-      modal: false,
-      menu2: false,
-      pw: "",
-      pw2: ""
+      formReady: false
     };
   },
   methods: {
@@ -178,7 +145,8 @@ export default {
     },
     submit() {
       // debugger;
-      this.$validator.validateAll();
+      //this.$validator.validateAll();
+      this.$refs.form.validate();
     }
   }
 };