From 094cf0d7c9a30c3cce493efcf7879642d8ad733a Mon Sep 17 00:00:00 2001
From: Alex H <hessmikey@gmail.com>
Date: Mon, 17 Apr 2023 22:19:01 -0400
Subject: [PATCH] added the ability to clear non-required fields, added a new
 icon

---
 ui/src/main.js                         |  2 +
 ui/src/router/views/import-generic.vue | 63 ++++++++++++++++++++++++--
 2 files changed, 61 insertions(+), 4 deletions(-)

diff --git a/ui/src/main.js b/ui/src/main.js
index cb336b0..e21c08b 100644
--- a/ui/src/main.js
+++ b/ui/src/main.js
@@ -7,6 +7,7 @@ import {
   faCheck,
   faTimes,
   faArrowUp,
+  faArrowRotateLeft,
   faAngleLeft,
   faAngleRight,
   faCalendar,
@@ -38,6 +39,7 @@ library.add(
   faCheck,
   faTimes,
   faArrowUp,
+  faArrowRotateLeft,
   faAngleLeft,
   faAngleRight,
   faCalendar,
diff --git a/ui/src/router/views/import-generic.vue b/ui/src/router/views/import-generic.vue
index 35bbb11..5a3db76 100644
--- a/ui/src/router/views/import-generic.vue
+++ b/ui/src/router/views/import-generic.vue
@@ -181,6 +181,13 @@ export default {
         this.isFullTankString = true
       }
     },
+    clearHeadingProperty(property) {
+      if (property === 'comments') {
+        this.fileHeadingMap[property] = []
+      } else {
+        this.fileHeadingMap[property] = null
+      }
+    },
   },
 }
 </script>
@@ -258,7 +265,19 @@ export default {
                 </option>
               </b-select>
             </b-field>
-            <b-field :label="$t('fuelsubtype')">
+            <b-field>
+              <template v-slot:label>
+                {{ $t('fuelsubtype') }}
+                <b-tooltip type="is-dark" label="Clear selection">
+                  <b-button
+                    type="is-ghost"
+                    size="is-small"
+                    icon-pack="fas"
+                    icon-right="arrow-rotate-left"
+                    @click="clearHeadingProperty('fuelSubType')"
+                  ></b-button>
+                </b-tooltip>
+              </template>
               <b-select v-model="fileHeadingMap.fuelSubType" expanded>
                 <option v-for="(option, index) in fileHeadings" :key="index" :value="index">
                   {{ option }}
@@ -313,21 +332,57 @@ export default {
                 <b-input v-model="notFilledValueString"></b-input>
               </b-field>
             </span>
-            <b-field :label="$t('missedfillup')">
+            <b-field>
+              <template v-slot:label>
+                {{ $t('missedfillup') }}
+                <b-tooltip type="is-dark" label="Clear selection">
+                  <b-button
+                    type="is-ghost"
+                    size="is-small"
+                    icon-pack="fas"
+                    icon-right="arrow-rotate-left"
+                    @click="clearHeadingProperty('hasMissedFillup')"
+                  ></b-button>
+                </b-tooltip>
+              </template>
               <b-select v-model="fileHeadingMap.hasMissedFillup">
                 <option v-for="(option, index) in fileHeadings" :key="index" :value="index">
                   {{ option }}
                 </option>
               </b-select>
             </b-field>
-            <b-field :label="$t('fillingstation')">
+            <b-field>
+              <template v-slot:label>
+                {{ $t('fillingstation') }}
+                <b-tooltip type="is-dark" label="Clear selection">
+                  <b-button
+                    type="is-ghost"
+                    size="is-small"
+                    icon-pack="fas"
+                    icon-right="arrow-rotate-left"
+                    @click="clearHeadingProperty('fillingStation')"
+                  ></b-button>
+                </b-tooltip>
+              </template>
               <b-select v-model="fileHeadingMap.fillingStation">
                 <option v-for="(option, index) in fileHeadings" :key="index" :value="index">
                   {{ option }}
                 </option>
               </b-select>
             </b-field>
-            <b-field :label="$t('comments')">
+            <b-field>
+              <template v-slot:label>
+                {{ $t('comments') }}
+                <b-tooltip type="is-dark" label="Clear selection">
+                  <b-button
+                    type="is-ghost"
+                    size="is-small"
+                    icon-pack="fas"
+                    icon-right="arrow-rotate-left"
+                    @click="clearHeadingProperty('comments')"
+                  ></b-button>
+                </b-tooltip>
+              </template>
               <b-select v-model="fileHeadingMap.comments" type="textarea" multiple expanded>
                 <option v-for="(option, index) in fileHeadings" :key="index" :value="index">
                   {{ option }}