From dc45707cfc5d2394c4a2afb0424059a3c37bd4ba Mon Sep 17 00:00:00 2001
From: Julien Calixte <julienc@bam.tech>
Date: Sun, 1 Mar 2020 00:28:53 +0100
Subject: [PATCH] :rotating_light: (transaction create)

---
 src/components/TransactionCreate.vue | 64 +++++++++++++++++++++-------
 1 file changed, 48 insertions(+), 16 deletions(-)

diff --git a/src/components/TransactionCreate.vue b/src/components/TransactionCreate.vue
index ddf4f48..a0ff026 100644
--- a/src/components/TransactionCreate.vue
+++ b/src/components/TransactionCreate.vue
@@ -3,7 +3,9 @@
     <nav class="breadcrumb" aria-label="breadcrumbs" v-if="account">
       <ul>
         <li>
-          <router-link :to="{ name: 'account', params: { id: account._id } }">{{ account.name }}</router-link>
+          <router-link :to="{ name: 'account', params: { id: account._id } }">
+            {{ account.name }}
+          </router-link>
         </li>
         <li v-if="tag && tag !== noTag">
           <a href="#" @click.prevent>{{ transactionTagLabel[tag].label }}</a>
@@ -32,9 +34,13 @@
                   maxlength="30"
                   placeholder="Nom de la dépense"
                 />
-                <p
-                  class="help is-info"
-                >{{ $tc('validation.max_char', 30 - name.length, { max: 30 - name.length }) }}</p>
+                <p class="help is-info">
+                  {{
+                    $tc('validation.max_char', 30 - name.length, {
+                      max: 30 - name.length
+                    })
+                  }}
+                </p>
               </div>
             </div>
           </div>
@@ -65,16 +71,21 @@
                         v-for="(currency, k) in account.currencies"
                         :key="k"
                         :value="currency"
-                      >{{ currency.symbol || currency.name }}</option>
+                      >
+                        {{ currency.symbol || currency.name }}
+                      </option>
                     </select>
                   </span>
-                  <a
-                    v-else
-                    class="button is-static"
-                  >{{ account.mainCurrency.symbol || account.mainCurrency.name }}</a>
+                  <a v-else class="button is-static">
+                    {{
+                      account.mainCurrency.symbol || account.mainCurrency.name
+                    }}
+                  </a>
                 </p>
               </div>
-              <p class="help is-info">montant max : {{ maxAmount | money(currency) }}</p>
+              <p class="help is-info">
+                montant max : {{ maxAmount | money(currency) }}
+              </p>
             </div>
           </div>
         </div>
@@ -85,7 +96,12 @@
           <div class="field-body">
             <div class="field">
               <div class="control" v-if="transaction.location">
-                <input type="text" readonly class="input" v-model="transaction.location.place" />
+                <input
+                  type="text"
+                  readonly
+                  class="input"
+                  v-model="transaction.location.place"
+                />
               </div>
             </div>
           </div>
@@ -97,7 +113,13 @@
           <div class="field-body">
             <div class="field">
               <div class="control">
-                <input type="date" class="input" v-model="date" placeholder="Date" :max="today" />
+                <input
+                  type="date"
+                  class="input"
+                  v-model="date"
+                  placeholder="Date"
+                  :max="today"
+                />
               </div>
             </div>
           </div>
@@ -118,7 +140,9 @@
                       v-for="(user, k) in account.users"
                       :key="k"
                       :value="user.alias"
-                    >{{ user.alias }}</option>
+                    >
+                      {{ user.alias }}
+                    </option>
                   </select>
                 </div>
               </div>
@@ -130,10 +154,14 @@
             <label class="label">Pour</label>
             <button
               class="button is-primary is-small"
-              :class="{ 'is-outlined': payForUsers.length !== account.users.length}"
+              :class="{
+                'is-outlined': payForUsers.length !== account.users.length
+              }"
               type="button"
               @click="selectAll"
-            >tous</button>
+            >
+              tous
+            </button>
           </div>
           <div class="field-body">
             <div class="field is-narrow">
@@ -148,7 +176,11 @@
         </div>
       </div>
     </div>
-    <fab-button @valid="submitTransaction" :margin="true" :button-style="backgroundColor">
+    <fab-button
+      @valid="submitTransaction"
+      :margin="true"
+      :button-style="backgroundColor"
+    >
       <awe-icon icon="check" />
     </fab-button>
   </div>