✨ (transaction) save location in transaction

.env

@@ -1 +1,2 @@
 VUE_APP_COUCHDB=https://couch.li212.fr
+VUE_APP_MAP_KEY=AnLDo_m_IGvMsQPLuBak9igWj3gNYvqBodj0esZZ7VfI1OkqVWvg04eTZ4U9R0Y2 

src/components/TagList.vue

@@ -46,7 +46,7 @@
       <div
         v-for="(category, k) in filteredCategories"
         :key="k"
-        class="category-list-container column is-half"
+        class="category-list-container column is-one-third"
       >
         <div class="columns category-list">
           <div class="column is-2 tag-element account-color">

src/components/TransactionCreate.vue

@@ -126,7 +126,7 @@
         </div>
         <transaction-tag-update v-model="tag" />
       </div>
-      <div class="column">
+      <div class="column" v-if="account.users.length > 1">
         <div class="field is-horizontal">
           <div class="field-label is-normal">
             <label class="label">Payé par</label>
@@ -290,6 +290,7 @@ export default class TransactionCreate extends Vue {
       mainCurrency: this.currency,
       currencies: this.account.currencies,
       transactionType: TransactionType.normal,
+      location: this.transaction.location,
       exchange: await exchangeService.get(this.currency.code, date, currencies)
     }
     const response: PouchDB.Core.Response = hasId

src/services/MapService.ts

@@ -23,9 +23,7 @@ class MapService {
   }
 
   private url(latitude: number, longitude: number) {
-    return `https://dev.virtualearth.net/REST/v1/Locations/${latitude},${longitude}?key=${
+    return `https://dev.virtualearth.net/REST/v1/Locations/${latitude},${longitude}?key=${this.key}`
-      this.key
-    }`
   }
 }
 

src/views/transactions/TransactionItem.vue

@@ -25,92 +25,96 @@
         </li>
       </ul>
     </nav>
-    <h3 class="subtitle is-3">{{ transaction.date | fulldate }}</h3>
+    <div class="columns is-centered">
-    <div class="resume">
+      <div class="column is-half">
-      Dépense payée par
+        <h3 class="subtitle is-3">{{ transaction.date | fulldate }}</h3>
-      <span class="pay-by">{{ transaction.payBy }}</span>
+        <div class="resume">
-      pour
+          Dépense payée par
-      <span>{{ payForLabel.join(', ') }}</span>
+          <span class="pay-by">{{ transaction.payBy }}</span>
-      d'une somme de
+          <span v-if="!uniqueUser">
-      <span class="numeric">{{
+            pour
-        transaction.amount | money(transaction.mainCurrency)
+            <span class="pay-for">{{ payForLabel.join(', ') }}</span>
-      }}</span
+          </span>
-      >.
+          <span v-if="transaction.location">
-    </div>
+            à {{ transaction.location.place }}
-    <div v-if="transaction.exchange" class="exchange">
+          </span>
-      <div v-if="currencies.length">
+          d'une somme de
-        <hr />
+          <span class="numeric">{{
-        <h3 class="subtitle is-3">
+            transaction.amount | money(transaction.mainCurrency)
-          Taux d'échange le {{ transaction.date | fulldate }}
+          }}</span>
-        </h3>
+          .
-        <div class="columns is-centered">
+        </div>
-          <div class="column">
+      </div>
-            <table class="table is-fullwidth is-striped is-bordered">
+      <div v-if="transaction.exchange">
-              <caption>
+        <div v-if="currencies.length" class="exchange column is-half">
-                <span class="numeric">{{
+          <h3 class="subtitle is-3">
-                  transaction.amount | money(transaction.mainCurrency)
+            Taux d'échange
-                }}</span>
+          </h3>
-              </caption>
+          <div class="columns is-centered">
-              <tbody>
+            <div class="column">
-                <tr v-for="(currency, k) in currencies" :key="k">
+              <table class="table is-fullwidth is-striped is-bordered">
-                  <td class="numeric">
+                <caption>
-                    {{
+                  <span class="numeric">{{
-                      (transaction.amount *
+                    transaction.amount | money(transaction.mainCurrency)
-                        transaction.exchange.rates[currency.code])
+                  }}</span>
-                        | moneypad(currency)
+                </caption>
-                    }}
+                <tbody>
-                  </td>
+                  <tr v-for="(currency, k) in currencies" :key="k">
-                </tr>
+                    <td class="numeric">
-              </tbody>
+                      {{
-            </table>
+                        (transaction && transaction.amount) ||
-          </div>
+                          (1 * getRate(currency.code)) | moneypad(currency)
-          <div class="column">
+                      }}
-            <table class="table is-fullwidth is-striped is-bordered">
+                    </td>
-              <caption>
+                  </tr>
-                <span class="numeric">{{
+                </tbody>
-                  1 | money(transaction.mainCurrency)
+              </table>
-                }}</span>
+            </div>
-              </caption>
+            <div class="column">
-              <tbody>
+              <table class="table is-fullwidth is-striped is-bordered">
-                <tr v-for="(currency, k) in currencies" :key="k">
+                <caption>
-                  <td class="numeric">
+                  <span class="numeric">{{
-                    {{
+                    1 | money(transaction.mainCurrency)
-                      transaction.exchange.rates[currency.code]
+                  }}</span>
-                        | moneypad(currency)
+                </caption>
-                    }}
+                <tbody>
-                  </td>
+                  <tr v-for="(currency, k) in currencies" :key="k">
-                </tr>
+                    <td class="numeric">
-              </tbody>
+                      {{ getRate(currency.code) | moneypad(currency) }}
-            </table>
+                    </td>
-          </div>
+                  </tr>
-          <div class="column">
+                </tbody>
-            <table
+              </table>
-              class="table is-hoverable is-fullwidth is-striped is-bordered"
+            </div>
-            >
+            <div class="column">
-              <caption>
+              <table
-                {{
+                class="table is-hoverable is-fullwidth is-striped is-bordered"
-                  $tc('transaction.money', currencies.length)
+              >
-                }}
+                <caption>
-              </caption>
+                  {{
-              <tbody>
+                    $tc('transaction.money', currencies.length)
-                <tr v-for="(currency, k) in currencies" :key="k">
+                  }}
-                  <td>{{ 1 | money(currency) }}</td>
+                </caption>
-                  <td class="numeric">
+                <tbody>
-                    {{
+                  <tr v-for="(currency, k) in currencies" :key="k">
-                      (1 / transaction.exchange.rates[currency.code])
+                    <td>{{ 1 | money(currency) }}</td>
-                        | moneypad(transaction.mainCurrency)
+                    <td class="numeric">
-                    }}
+                      {{
-                  </td>
+                        (1 / getRate(currency.code))
-                </tr>
+                          | moneypad(transaction && transaction.mainCurrency)
-              </tbody>
+                      }}
-            </table>
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
+            </div>
           </div>
         </div>
       </div>
-    </div>
+      <div v-else class="column is-half">
-    <div v-else>
+        <online-view @online="retrieveExchange" />
-      <online-view @online="retrieveExchange" />Le taux d'échange n'a pas pu
+        Le taux d'échange n'a pas pu être récupéré.
-      être récupéré.
+      </div>
     </div>
     <div class="buttons is-centered" v-if="account && !account.archive">
       <router-link
@@ -118,11 +122,12 @@
         tag="button"
         class="button"
         :to="{ name: 'transaction-update', params: { id } }"
-        >modifier</router-link
-      >
-      <confirm-button class="is-danger" @confirm="removeTransaction"
-        >supprimer</confirm-button
       >
+        modifier
+      </router-link>
+      <confirm-button class="is-danger" @confirm="removeTransaction">
+        supprimer
+      </confirm-button>
     </div>
   </div>
 </template>
@@ -227,6 +232,22 @@ export default class TransactionItem extends Vue {
     }
   }
 
+  public getRate(code: string) {
+    return (
+      (this.transaction &&
+        this.transaction.exchange &&
+        this.transaction.exchange.rates[code]) ||
+      1
+    )
+  }
+
+  public uniqueUser() {
+    if (!this.transaction) {
+      return false
+    }
+    return this.transaction.payBy === this.payForLabel.join(',')
+  }
+
   public get accountId(): string {
     return (this.transaction && this.transaction.accountId) || ''
   }
@@ -303,7 +324,8 @@ table.table {
 .buttons {
   margin-top: 15px;
 }
-.pay-by {
+.pay-by,
+.pay-for {
   font-weight: bold;
 }
 .numeric {