From bacb32ca2a3352f39bb16566b68e4e1b2bbe9ab4 Mon Sep 17 00:00:00 2001
From: Stanislav Popov <popstas@gmail.com>
Date: Tue, 25 Aug 2020 01:39:14 +0500
Subject: [PATCH] feat: filters in table stats enum values

---
 components/ItemDetails.vue |  2 +-
 components/Stats.vue       | 30 +++++++++++++++++++++++++++---
 2 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/components/ItemDetails.vue b/components/ItemDetails.vue
index e4f4761..3559f2d 100644
--- a/components/ItemDetails.vue
+++ b/components/ItemDetails.vue
@@ -103,7 +103,7 @@ export default {
           groups[groupName].fields.push(field);
         }
       }
-      console.log('groups: ', groups);
+      // console.log('groups: ', groups);
       return groups;
     }
   },
diff --git a/components/Stats.vue b/components/Stats.vue
index 0203049..a635280 100644
--- a/components/Stats.vue
+++ b/components/Stats.vue
@@ -4,7 +4,22 @@
     <ul>
       <li v-for="fStat in stats" :key="fStat.name" :class="['table-stats__field', fStat.class]">
         <span class="table-stats__field-name item-details__label" v-html="fStat.title"></span>
-        <span class="table-stats__field-value item-details__value" v-html="fStat.value"></span>
+
+        <span v-if="fStat.subvalues.length === 0"
+          class="table-stats__field-value item-details__value"
+          v-html="fStat.value"></span>
+
+        <span v-else class="table-stats__field-value item-details__value">
+          <div v-for="subval of fStat.subvalues" :key="subval.value"
+            :class="{'item-details__subvalue': true, [subval.validateClass]: true}"
+          >
+            {{ subval.value }}: {{ subval.count }}
+
+            <FilterPresetButton class="field-preset" :preset="{ q: fStat.name + '=' + subval.value }" toggle>
+              <icon name="filter" scale="0.6"></icon>
+            </FilterPresetButton>
+          </div>
+        </span>
       </li>
     </ul>
   </div>
@@ -61,9 +76,9 @@
 </style>
 
 <script>
+import FilterPresetButton from "~/components/FilterPresetButton";
 export default {
-  props: [""],
-  components: {},
+  components: {FilterPresetButton},
   data() {
     return {
       fieldGroupsOpened: {},
@@ -80,6 +95,7 @@ export default {
         if (!field) continue;
 
         let val = "";
+        let subvalues = [];
         let valueText = "";
         let validateClass = "";
 
@@ -138,7 +154,14 @@ export default {
             else if (valClass == 'warning' && validateClass != 'danger') validateClass = valClass;
             else if (!validateClass) validateClass = valClass;
 
+            subvalues.push({
+              validateClass: valClass,
+              value: valName,
+              count: count,
+            });
+
             // if (valClass === 'success') valClass = '';
+            // TODO: remove, not used, subvalues
             msg.push(
               `<span class="item-details__subvalue ${valClass}">${valName}: ${count}</span>`
             );
@@ -183,6 +206,7 @@ export default {
             title: field.comment || field.name,
             class: validateClass,
             value: valueText || val,
+            subvalues: subvalues,
           });
         }
       }