From 3409e773bf708cb4c4abe2fc1c2b0c13c9236c43 Mon Sep 17 00:00:00 2001
From: Stanislav Popov <popstas@gmail.com>
Date: Thu, 27 Aug 2020 19:17:18 +0500
Subject: [PATCH] fix: move current columns after table stats

---
 components/Stats.vue   |  8 ++++----
 components/Toolbar.vue | 25 ++++---------------------
 pages/index.vue        | 42 ++++++++++++++++++++++++++++++++++--------
 3 files changed, 42 insertions(+), 33 deletions(-)

diff --git a/components/Stats.vue b/components/Stats.vue
index a4aeabf..d9e57e6 100644
--- a/components/Stats.vue
+++ b/components/Stats.vue
@@ -134,7 +134,7 @@ export default {
           }
           val = Math.round(sum / this.filteredItems.length);
           validateClass = this.getColumnValidateClass(val, field.validate);
-          valueText = val + " (average)";
+          valueText = val + " (average)"; // tolang
         }
 
         // enum
@@ -205,11 +205,11 @@ export default {
           // console.log('dupls: ', dupls);
 
           val = dupls.length;
-          validateClass = dupls.length > 0 ? "warning" : "success";
+          validateClass = dupls.length > 0 ? "warning" : "success"; // tolang
           if (dupls.length > 0) {
-            valueText = `${dupls.length} non-unique values`;
+            valueText = `${dupls.length} non-unique values`; // tolang
           } else {
-            valueText = `all unique`;
+            valueText = `all unique`; // tolang
           }
         }
 
diff --git a/components/Toolbar.vue b/components/Toolbar.vue
index 9c6a506..af6650d 100644
--- a/components/Toolbar.vue
+++ b/components/Toolbar.vue
@@ -61,6 +61,10 @@
 
     <QueryInput class="filter__query"></QueryInput>
 
+    <div>
+      total: {{ filteredItems.length }}
+    </div>
+
     <div class="filter-presets">filters:
       <FilterPresetButton
         :preset="preset"
@@ -78,17 +82,6 @@
         :key="preset.name"
       ></ColumnPresetButton>
     </div>
-
-    <div class="current-columns"><span style="margin-right:18px;">current:</span>
-       <ColumnField
-        :field="field"
-        :checked="$store.getters.fieldExists(field)"
-        @click="$emit('toggleField', field)"
-        :class="{ 'available-fields__field': true, active: $store.getters.fieldExists(field) }"
-        v-for="field of fieldsWithoutComments"
-        :key="field.name"
-      ></ColumnField>
-    </div>
   </div>
 </template>
 
@@ -108,7 +101,6 @@
 <script>
 import FilterPresetButton from "~/components/FilterPresetButton";
 import ColumnPresetButton from "~/components/ColumnPresetButton";
-import ColumnField from "~/components/ColumnField";
 import FieldGroup from "~/components/FieldGroup";
 import QueryInput from "~/components/QueryInput";
 import "vue-awesome/icons/check-double";
@@ -119,7 +111,6 @@ export default {
   components: {
     FilterPresetButton,
     ColumnPresetButton,
-    ColumnField,
     FieldGroup,
     QueryInput
   },
@@ -148,14 +139,6 @@ export default {
       return this.$store.state.fields;
     },
 
-    fieldsWithoutComments() {
-      return this.$store.state.fields.map(f => {
-        f = {...f};
-        delete (f.comment);
-        return f;
-      });
-    },
-
     availableFields() {
       return this.$store.state.availableFields;
     },
diff --git a/pages/index.vue b/pages/index.vue
index 3ee7b80..db72944 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -24,6 +24,19 @@
     <div v-if="!jsonLoading && !jsonLoadError">
       <Toolbar @toggleField="toggleField" @setFields="setFields"></Toolbar>
 
+      <Stats></Stats>
+
+      <div class="current-columns"><span style="margin-right:18px;">current:</span>
+        <ColumnField
+          :field="field"
+          :checked="$store.getters.fieldExists(field)"
+          @click="toggleField(field)"
+          :class="{ 'available-fields__field': true, active: $store.getters.fieldExists(field) }"
+          v-for="field of fieldsWithoutComments"
+          :key="field.name"
+        ></ColumnField>
+      </div>
+
       <div><br>
         total: {{ filteredItems.length }}
       </div>
@@ -34,8 +47,6 @@
         </button>
       </div>
 
-      <Stats></Stats>
-
       <v-client-table
         v-if="filteredItems.length > 0"
         :columns="columns"
@@ -65,6 +76,7 @@
 
 <script>
 import Toolbar from "~/components/Toolbar";
+import ColumnField from "~/components/ColumnField";
 import ItemDetails from "~/components/ItemDetails";
 import Stats from "~/components/Stats";
 import ReportHistory from "~/components/ReportHistory";
@@ -74,14 +86,20 @@ import _ from "lodash";
 import XLSX from "xlsx";
 
 export default {
-  components: { Toolbar, ItemDetails, Stats, ReportHistory },
+  components: {
+    Toolbar,
+    ItemDetails,
+    Stats,
+    ReportHistory,
+    ColumnField,
+  },
   data() {
     return {
       routerProcess: false,
       tests: this.$store.state.tests,
       jsonLoadError: false,
       jsonLoading: true,
-      introTourSteps: [
+      introTourSteps: [ // tolang
         {
           target: '.current-json',
           header: {
@@ -124,13 +142,13 @@ export default {
           offset: -200,
         },
         {
-          target: '.current-columns',
-          content: `Quick remove current table columns.`,
+          target: '.table-stats',
+          content: `Stats by filtered rows: average, non-unique, enum values.`,
           offset: -200,
         },
         {
-          target: '.table-stats',
-          content: `Stats by filtered rows: average, non-unique, enum values.`,
+          target: '.current-columns',
+          content: `Quick remove current table columns.`,
           offset: -200,
         },
         {
@@ -168,6 +186,14 @@ export default {
       return this.$store.state.filteredItems;
     },
 
+    fieldsWithoutComments() {
+      return this.$store.state.fields.map(f => {
+        f = {...f};
+        delete (f.comment);
+        return f;
+      });
+    },
+
     tableOptions() {
       // console.log("this.filteredItems: ", this.filteredItems);