@modelforms/fontawesome-vuetify 3.8.1 → 3.9.0

package/README.md

@@ -100,6 +100,7 @@ The FormPlate component is designed with a built-in GridModelHandler that manage
 
 Grid model value fields have a rules with corresponding client validation messages.
 
+Event completeChanges is ordinary event updating complete control changes. 
 The main event is submit with data model as argument.
 
 Licence 

package/components/form/Form.vue

@@ -51,7 +51,7 @@
                         :label="col.label"
                         :rules="col.rules" 
                         :title="col.complete?.title"
-                        v-on:value="value($event, col.name)"/>
+                        v-on:complete="complete($event, col.name)"/>
 
                     <Area 
                         v-if="col.type == 'area'"
@@ -64,7 +64,7 @@
                     <File 
                         v-if="col.type == 'file'"
                         :value="col.value"
-                        :accept="col.accept"
+                        :accept="col.accept!"
                         :label="col.label"
                         :model="form.model" 
                         :rules="col.rules" 
@@ -101,7 +101,7 @@ import Date  from './../form/date/Date.vue';
 import Complete  from './../form/complete/Complete.vue';
 import Area  from './../form/area/Area.vue';
 import { GridModel } from './models/formModels';
-import { button, event } from './helpers/resources';
+import { button, completeChangeEvent, event } from './helpers/resources';
 import { Validation } from './models/formModels';
 import { initForm } from './helpers/init';
 import File from './file/File.vue';
@@ -136,7 +136,7 @@ export default{
             offset: this.titlePosition(this.form.title)
         }
     },
-    emits: [event],
+    emits: [event, completeChangeEvent],
     methods: {
         submit(e: any) {
             this.$emit(event, this.model)
@@ -144,6 +144,10 @@ export default{
         value(event: any, name: string) {
             this.model[name] = event;
         },
+        complete(event: any, name: string) {
+            this.model[name] = event;
+            this.$emit(completeChangeEvent, { name, value: event });
+        },
         init(form: GridModel<any>) {
             initForm(form);
             this.validation.form = form;

package/components/form/complete/Complete.vue

@@ -39,7 +39,7 @@
     import { faArrowAltCircleDown, faSquare } from '@fortawesome/free-regular-svg-icons';
     import { faCheck, faChevronDown } from '@fortawesome/free-solid-svg-icons';
     import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
-    import { empty, defaultIcon, valueEvent, searchError, validationEvent } from '../helpers/resources';
+    import { empty, defaultIcon, valueEvent, searchError, validationEvent, completeEvent } from '../helpers/resources';
     import { FilterOptions } from '../models/formModels';
     import { initComponent } from '../helpers/init';
     import { isEqual } from '../helpers/equal';
@@ -85,7 +85,7 @@
         components: {
             FontAwesomeIcon: FontAwesomeIcon,
         },
-        emits: [valueEvent, validationEvent],
+        emits: [valueEvent, validationEvent, completeEvent],
         mounted() {
             if(this.multiple){
                 this.initAriaRows();
@@ -121,12 +121,12 @@
                 if(event.length!) {
                     this.value = event;
                     this.selected = [this.items.find(item => item[this.title!] == event)!];
-                    this.$emit(valueEvent, [this.selected]);
+                    this.$emit(completeEvent, [this.selected]);
                 }
             },
             blur(event) {
                 if(this.isValid){
-                    this.$emit(valueEvent, this.selected);
+                    this.$emit(completeEvent, this.selected);
                 }else{
                     this.$emit(validationEvent, this.isValid)
                 }

package/components/form/helpers/resources.ts

@@ -2,6 +2,8 @@ export const button = 'SUBMIT';
 export const event = 'submit';
 export const valueEvent = 'value';
 export const validationEvent = 'validation';
+export const completeEvent = 'complete';
+export const completeChangeEvent = 'completeChange';
 
 export const searchError = 'Wrong search parameter type!';
 export const ruleError = 'Wrong rule parameter type! ';