ayanova/src/components/data-table.vue

@@ -22,8 +22,19 @@
     <v-card>
       <v-card-title>
         <template v-if="preFilterMode">
-          <!-- {icon:null,viz:null,ayatype:null,id:null,clearable:false} -->
-          preFilterMode {{ preFilterMode }}
+          <div class="my-2">
+            <v-btn text @click="preFilterNav()">
+              <v-icon data-cy="clickThru">{{ preFilterMode.icon }}</v-icon>
+            </v-btn>
+            <span @click="preFilterNav()" class="text-h5">
+              {{ preFilterMode.viz }}</span
+            >
+            <v-btn text @click="preFilterClear()">
+              <v-icon>$clear</v-icon>
+            </v-btn>
+          </div>
+
+          <!-- v-if="preFilterMode.ayatype && preFilterMode.id" {icon:null,viz:null,ayatype:null,id:null,clearable:false} -->
         </template>
         <template v-else>
           <v-select
@@ -459,7 +470,8 @@ export default {
       type: String,
       default: undefined
     },
-    preFilterMode: {//{icon:null,viz:null,ayatype:null,id:null,clearable:false}
+    preFilterMode: {
+      //{icon:null,viz:null,ayatype:null,id:null,clearable:false}
       type: Object,
       default: null
     },
@@ -549,6 +561,18 @@ export default {
     }
   },
   methods: {
+    preFilterNav: function() {
+      window.$gz.eventBus.$emit("openobject", {
+        type: this.preFilterMode.ayatype,
+        id: this.preFilterMode.id
+      });
+    },
+    preFilterClear: function() {
+      this.$emit("clear-pre-filter");
+      // this.preFilterMode = null;
+      // this.clientCriteria = null;
+      // getDataFromApi();
+    },
     //Used by narrow view to get the "header" text for a column based on the column key
     getHeaderText(key) {
       //key format is row-column e.g."500-2"

ayanova/src/plugins/vuetify.js

@@ -8,7 +8,35 @@ import Vuetify from "vuetify/lib";
 //tree shaking compatible icon method
 //https://stackoverflow.com/a/58261449/8939
 import { library } from "@fortawesome/fontawesome-svg-core";
-import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
+import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome"; //https://github.com/FortAwesome/vue-fontawesome
+
+/*
+https://github.com/FortAwesome/vue-fontawesome#advanced
+import {
+  FontAwesomeIcon,
+  FontAwesomeLayers,
+  FontAwesomeLayersText
+} from "@fortawesome/vue-fontawesome"; //https://github.com/FortAwesome/vue-fontawesome
+Vue.component("font-awesome-layers", FontAwesomeLayers);
+Vue.component("font-awesome-layers-text", FontAwesomeLayersText);
+
+
+classes seem to work when props don't for
+  let classes = {
+    'fa-spin': props.spin,
+    'fa-pulse': props.pulse,
+    'fa-fw': props.fixedWidth,
+    'fa-border': props.border,
+    'fa-li': props.listItem,
+    'fa-inverse': props.inverse,
+    'fa-flip-horizontal': props.flip === 'horizontal' || props.flip === 'both',
+    'fa-flip-vertical': props.flip === 'vertical' || props.flip === 'both',
+    [`fa-${props.size}`]: props.size !== null,
+    [`fa-rotate-${props.rotation}`]: props.rotation !== null,
+    [`fa-pull-${props.pull}`]: props.pull !== null,
+    'fa-swap-opacity': props.swapOpacity
+  }
+*/
 
 Vue.component("font-awesome-icon", FontAwesomeIcon); // Register component globally
 

ayanova/src/views/inv-part-inventory.vue

@@ -16,6 +16,7 @@
       :client-criteria="clientCriteria"
       :pre-filter-mode="preFilterMode"
       @selection-change="handleSelected"
+      @clear-pre-filter="clearPreFilter"
       data-cy="partInventoryTable"
     >
     </gz-data-table>
@@ -73,6 +74,11 @@ export default {
   methods: {
     handleSelected(selected) {
       this.selectedItems = selected;
+    },
+    clearPreFilter() {
+      this.clientCriteria = null;
+      this.preFilterMode = null;
+      this.reload = !this.reload;
     }
   }
 };

ayanova/src/views/login.vue

@@ -35,6 +35,39 @@
     <v-row align="center" justify="center" class="mx-auto mt-sm-12 mb-16">
       <v-col cols="12" offset-md="4">
         <form>
+          <!-- <div>
+            <v-icon class="fa-spin">$ayiWrench</v-icon>
+            <v-icon class="fa-pulse">$ayiWrench</v-icon>
+            <v-icon>$ayiBusinessTime</v-icon>
+            <v-icon class="fa-fw">$ayiBusinessTime</v-icon>
+            <v-icon class="fa-border">$ayiBusinessTime</v-icon>
+            <v-icon class="fa-li">$ayiBusinessTime</v-icon>
+            <v-icon class="fa-inverse">$ayiBusinessTime</v-icon>
+            <v-icon class="fa-flip-horizontal">$ayiBusinessTime</v-icon>
+            <v-icon class="fa-flip-vertical">$ayiBusinessTime</v-icon>
+            <v-icon class="fa-flip-both">$ayiBusinessTime</v-icon>
+            <v-icon class="fa-xs">$ayiBusinessTime</v-icon>
+            <v-icon class="fa-6x">$ayiBusinessTime</v-icon>
+            <v-icon class="fa-rotate-90">$ayiBusinessTime</v-icon>
+            <v-icon class="fa-swap-opacity">$ayiBusinessTime</v-icon>
+            <font-awesome-layers class="fa-2x">
+              <font-awesome-icon icon="filter" />
+              <font-awesome-icon
+                style="color: gray;"
+                transform="grow-3 down-2"
+                icon="ban"
+              />
+            </font-awesome-layers>
+
+            <font-awesome-layers full-width class="fa-4x">
+              <font-awesome-icon icon="bell" />
+              <font-awesome-layers-text
+                class="gray8"
+                transform="down-2 shrink-8"
+                value="Q"
+              />
+            </font-awesome-layers>
+          </div> -->
           <v-row>
             <!-- Customer logo -->
             <v-col v-if="showCustomSmallLogo()" cols="12">