@modeltables/fontawesome-vuetify 2.1.0 → 2.2.0

package/components/dataSets/dataSetItems.ts

@@ -1,7 +1,39 @@
-export class DataSetItems {
+import { selectedRow, unSelectedRow } from "../helpers/resources";
+
+export class DataSetItems{
     id: number = 0;
     startPosition: boolean = false;
-    selected: boolean = false;
-    rowClass: string = '';
     dataItem: Object = Object.assign({});
+    changeMultipleSet: ((item: DataSetItems) => void)[] = [];
+    changeItemSet: ((item: DataSetItems, dataItems: DataSetItems[]) => void)[] = [];
+    properties: DataSetItemProps = new DataSetItemProps();
+}
+
+export class DataSetItemProps{
+    rowClass: string = unSelectedRow;
+    selected: boolean = false;
+}
+
+export const changeActiveSets = (method: any, item: DataSetItems) => {
+    for(let state of method){
+        state(item);
+    }
+}
+
+export const changeMultipleSets = (method: any, item: DataSetItems, dataItems: DataSetItems[] = []) => {
+    for(let state of method){
+        state(item, dataItems);
+    }
+}
+
+export const changeSet = (dataSetItems: DataSetItems[], multiSelected: boolean) => {
+    for(const value of dataSetItems){
+    if(!multiSelected){
+        value.properties.selected = true;
+        value.properties.rowClass = selectedRow;
+    }else{
+        value.properties.selected = false;
+        value.properties.rowClass = unSelectedRow;
+    }
+    }
 }

package/components/helpers/instances.ts

@@ -27,4 +27,4 @@ export const isEqual = (object1: Object, object2: Object) => {
     }
 
     return true;
-}
+}

package/components/table/TableView.vue

@@ -16,7 +16,7 @@ import PaginationView from '@/components/pagination/PaginationView.vue';
 import DataItem from '@/components/table/data/ItemView.vue';
 import { isEqual } from '../helpers/instances';
 import { DataSetHeader } from '../dataSets/dataSetHeader';
-import { DataSetItems } from '../dataSets/dataSetItems';
+import { changeActiveSets, changeMultipleSets, changeSet, DataSetItems } from '../dataSets/dataSetItems';
 
 export default {
   props: {
@@ -154,7 +154,7 @@ export default {
       faIndent: faIndent,
       faCheck: faCheck,
       faSquare: faSquare,
-      multiSelectionItems: [] as Object[],
+      multiSelectedItems: [] as Object[],
       lastItem: {},
       completes: this.completes,
       filters: { CurrentPage: 1, PerPage: 10, SortColumn: '', SortDirection: 1 } as any,
@@ -167,7 +167,10 @@ export default {
       pageCount: this.pagination!.PageCount,
       totalCount:this.pagination!.TotalCount,
       showTime: this.showTime,
-      isEqual: isEqual
+      isEqual: isEqual,
+      changeMultipleSets: changeMultipleSets,
+      changeActiveSets: changeActiveSets,
+      changeSet: changeSet
     };
   },
   methods: {
@@ -192,9 +195,25 @@ export default {
       for(let [index, item] of dataItems.entries()){
         let dataSet = new DataSetItems();
         dataSet.id = index + 1;
-        dataSet.selected = false;
-        dataSet.rowClass = '';
-        dataSet.dataItem = item
+        dataSet.dataItem = item;
+
+        dataSet.changeMultipleSet = [(item: DataSetItems) => {
+          if(this.multiSelectedItems.some(element => isEqual(element, item.dataItem))){
+            item.properties.rowClass = unSelectedRow;
+            item.properties.selected = false;
+          }else{
+            item.properties.rowClass = selectedRow;
+            item.properties.selected = true;
+          }
+        }];
+
+        dataSet.changeItemSet = [(item: DataSetItems, dataItems: DataSetItems[]) => {
+          for(let dataSet of dataItems){
+            dataSet.properties.rowClass = unSelectedRow;
+          }
+
+          changeActiveSets(dataSet.changeMultipleSet, item);
+        }]
         
         if(dataSet.id == 1){
           dataSet.startPosition = true;
@@ -247,28 +266,25 @@ export default {
       
       if(this.select){
         for(let dataSet of this.dataSetItems){
-          dataSet.rowClass = '';
+          dataSet.properties.rowClass = unSelectedRow;
         }
 
-        item.rowClass = selectedRow;
+        changeMultipleSets(item.changeItemSet, item, this.dataSetItems);
         this.$emit(itemSelection, item.dataItem);
       }
 
       if(this.multiSelect){
-        item.selected = !item.selected;
-
-        if(!this.multiSelectionItems.length){
-          item.rowClass = selectedRow;
-          this.multiSelectionItems = [item.dataItem];
-        }else if(item.selected){
-          item.rowClass = selectedRow;
-          this.multiSelectionItems = [...this.multiSelectionItems, item.dataItem]
+        
+        if(!this.multiSelectedItems.length){
+          this.multiSelectedItems = [item.dataItem];
+        }else if(this.multiSelectedItems.some(element => isEqual(element, item.dataItem))){
+          this.multiSelectedItems = this.multiSelectedItems.filter(element => !isEqual(element, item.dataItem));
         }else{
-          item.rowClass = unSelectedRow;
-          this.multiSelectionItems = this.multiSelectionItems.filter(element => !isEqual(element, item.dataItem));
+          this.multiSelectedItems = [...this.multiSelectedItems, item.dataItem]
         }
 
-        this.$emit(multiSelection, this.multiSelectionItems);
+        changeActiveSets(item.changeMultipleSet, item);
+        this.$emit(multiSelection, this.multiSelectedItems);
       }
     },
     filterValue(event: any, dataItem: any){
@@ -338,16 +354,7 @@ export default {
       console.log(event);
     },
     multiSelectItems(event){
-      for(const value of this.dataSetItems){
-        if(!this.multiSelected){
-          value.selected = true;
-          value.rowClass = selectedRow;
-        }else{
-          value.selected = false;
-          value.rowClass = unSelectedRow;
-        }
-      }
-
+      changeSet(this.dataSetItems, this.multiSelected);
       this.multiSelected = !this.multiSelected;
     }
   }
@@ -413,9 +420,9 @@ export default {
                     </Filters>
                   </td>
                 </tr>
-                <tr @click="updateItem(dataSet, dataSet.id!)" :class="dataSet.rowClass">
-                  <td v-if="multiSelect" v-bind="dataSet.dataItem">
-                    <FontAwesomeIcon v-if="dataSet.selected" :icon="faCheck"></FontAwesomeIcon>
+                <tr @click="updateItem(dataSet, dataSet.id!)" v-bind="dataSet.properties" :class="dataSet.properties.rowClass">
+                  <td v-if="multiSelect">
+                    <FontAwesomeIcon v-if="dataSet.properties.selected" :icon="faCheck"></FontAwesomeIcon>
                     <FontAwesomeIcon v-else :icon="faSquare"></FontAwesomeIcon>
                   </td>
                   <td v-for="(prop) in Object.keys(dataSet.dataItem)">