Expand frontend

2025-02-25 18:45:27 -06:00 · 2020-07-12 17:30:24 +02:00 · 2020-07-12 17:30:24 +02:00 · e24c2491a6
commit e24c2491a6
parent 72a2718a93
53 changed files with 1197 additions and 862 deletions
--- a/frontend/mix-manifest.json
+++ b/frontend/mix-manifest.json
@ -1,8 +1,13 @@
 {
+    "/public/js/manifest.js": "/public/js/manifest.js",
+    "/public/js/manifest.js.map": "/public/js/manifest.js.map",
+    "/public/js/vendor.js": "/public/js/vendor.js",
+    "/public/js/vendor.js.map": "/public/js/vendor.js.map",
    "/public/js/accounts.js": "/public/js/accounts.js",
+    "/public/js/accounts.js.map": "/public/js/accounts.js.map",
    "/public/js/dashboard.js": "/public/js/dashboard.js",
    "/public/css/app.css": "/public/css/app.css",
-    "/public/js/manifest.js": "/public/js/manifest.js",
+    "/public/js/dashboard.js.map": "/public/js/dashboard.js.map",
    "/public/js/register.js": "/public/js/register.js",
-    "/public/js/vendor.js": "/public/js/vendor.js"
+    "/public/js/register.js.map": "/public/js/register.js.map"
 }
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
--- a/frontend/public/js/accounts.js
+++ b/frontend/public/js/accounts.js
@ -0,0 +1,2 @@
+(window.webpackJsonp=window.webpackJsonp||[]).push([[2],{205:function(t,s,a){t.exports=a(210)},210:function(t,s,a){"use strict";a.r(s);var e=a(9),n={name:"Index"},c=a(1),i=Object(c.a)(n,(function(){var t=this.$createElement,s=this._self._c||t;return s("div",[s("router-view")],1)}),[],!1,null,"6b40cc75",null).exports,r={name:"List",props:{accountTypes:String},data:function(){return{accounts:[]}},mounted:function(){var t=this;axios.get("./api/v1/accounts?type="+this.$props.accountTypes).then((function(s){t.loadAccounts(s.data.data)}))},methods:{loadAccounts:function(t){for(var s in t)if(t.hasOwnProperty(s)&&/^0$|^[1-9]\d*$/.test(s)&&s<=4294967294){var a=t[s];"asset"===a.attributes.type&&null!==a.attributes.account_role&&(a.attributes.account_role=this.$t("firefly.account_role_"+a.attributes.account_role)),"asset"===a.attributes.type&&null===a.attributes.account_role&&(a.attributes.account_role=this.$t("firefly.Default asset account")),null===a.attributes.iban&&(a.attributes.iban=a.attributes.account_number),this.accounts.push(a)}}}},o=Object(c.a)(r,(function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",{staticClass:"row"},[a("div",{staticClass:"col-lg-12 col-md-12 col-sm-12 col-xs-12"},[a("div",{staticClass:"card"},[t._m(0),t._v(" "),a("div",{staticClass:"card-body p-0"},[a("table",{staticClass:"table table-sm table-striped"},[a("thead",[a("tr",[a("th",[t._v(" ")]),t._v(" "),a("th",[t._v(t._s(t.$t("list.name")))]),t._v(" "),"asset"===t.$props.accountTypes?a("th",[t._v(t._s(t.$t("list.role")))]):t._e(),t._v(" "),a("th",[t._v(t._s(t.$t("list.iban")))]),t._v(" "),a("th",{staticStyle:{"text-align":"right"}},[t._v(t._s(t.$t("list.currentBalance")))]),t._v(" "),a("th",[t._v(t._s(t.$t("list.balanceDiff")))])])]),t._v(" "),a("tbody",t._l(t.accounts,(function(s){return a("tr",[t._m(1,!0),t._v(" "),a("td",[a("router-link",{attrs:{to:{name:"accounts.show",params:{id:s.id}},title:s.attributes.name}},[t._v(t._s(s.attributes.name)+"\n                            ")])],1),t._v(" "),"asset"===t.$props.accountTypes?a("td",[t._v("\n                            "+t._s(s.attributes.account_role)+"\n                        ")]):t._e(),t._v(" "),a("td",[t._v("\n                            "+t._s(s.attributes.iban)+"\n                        ")]),t._v(" "),a("td",{staticStyle:{"text-align":"right"}},[t._v("\n                            "+t._s(Intl.NumberFormat("en-US",{style:"currency",currency:s.attributes.currency_code}).format(s.attributes.current_balance))+"\n                        ")]),t._v(" "),a("td",[t._v("diff")])])})),0)])]),t._v(" "),a("div",{staticClass:"card-footer"},[t._v("\n                Footer stuff.\n            ")])])])])}),[function(){var t=this.$createElement,s=this._self._c||t;return s("div",{staticClass:"card-header"},[s("h3",{staticClass:"card-title"},[this._v("Title thing")]),this._v(" "),s("div",{staticClass:"card-tools"},[s("div",{staticClass:"input-group input-group-sm",staticStyle:{width:"150px"}},[s("input",{staticClass:"form-control float-right",attrs:{type:"text",name:"table_search",placeholder:"Search"}}),this._v(" "),s("div",{staticClass:"input-group-append"},[s("button",{staticClass:"btn btn-default",attrs:{type:"submit"}},[s("i",{staticClass:"fas fa-search"})])])])])])},function(){var t=this.$createElement,s=this._self._c||t;return s("td",[s("div",{staticClass:"btn-group btn-group-xs"},[s("a",{staticClass:"btn btn-xs btn-default",attrs:{href:"edit"}},[s("i",{staticClass:"fa fas fa-pencil-alt"})]),this._v(" "),s("a",{staticClass:"btn btn-xs btn-danger",attrs:{href:"del"}},[s("i",{staticClass:"fa far fa-trash"})])])])}],!1,null,"27a44b66",null).exports,u={name:"Show"},l=Object(c.a)(u,(function(){var t=this.$createElement;return(this._self._c||t)("div",[this._v("\n    I am a show\n")])}),[],!1,null,"dcd61a50",null).exports;a(155);var p=[{path:"/",component:i},{path:"/accounts/asset",name:"accounts.index.asset",component:o,props:{accountTypes:"asset"}},{path:"/accounts/expense",component:o,props:{accountTypes:"expense"}},{path:"/accounts/revenue",component:o,props:{accountTypes:"revenue"}},{path:"/accounts/liabilities",component:o,props:{accountTypes:"liabilities"}},{path:"/accounts/show/:id",name:"accounts.show",component:l}],_=new e.a({mode:"history",routes:p}),d=a(154),h={};Vue.use(e.a),new Vue({router:_,i18n:d,render:function(t){return t(i,{props:h})}}).$mount("#accounts")}},[[205,0,1]]]);
+//# sourceMappingURL=accounts.js.map
--- a/frontend/public/js/accounts.js.map
+++ b/frontend/public/js/accounts.js.map
--- a/frontend/public/js/dashboard.js
+++ b/frontend/public/js/dashboard.js
--- a/frontend/public/js/dashboard.js.LICENSE.txt
+++ b/frontend/public/js/dashboard.js.LICENSE.txt
@ -1,5 +0,0 @@
-/*!
- * AdminLTE v3.0.5 (https://adminlte.io)
- * Copyright 2014-2020 Colorlib <http://colorlib.com>
- * Licensed under MIT (https://github.com/ColorlibHQ/AdminLTE/blob/master/LICENSE)
- */
--- a/frontend/public/js/dashboard.js.map
+++ b/frontend/public/js/dashboard.js.map
--- a/frontend/public/js/register.js
+++ b/frontend/public/js/register.js
--- a/frontend/public/js/register.js.map
+++ b/frontend/public/js/register.js.map
--- a/frontend/public/js/vendor.js
+++ b/frontend/public/js/vendor.js
--- a/frontend/public/js/vendor.js.LICENSE.txt
+++ b/frontend/public/js/vendor.js.LICENSE.txt
@ -4,6 +4,18 @@
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
  */

+/*!
+  * vue-router v3.3.4
+  * (c) 2020 Evan You
+  * @license MIT
+  */
+
+/*!
+ * AdminLTE v3.0.5 (https://adminlte.io)
+ * Copyright 2014-2020 Colorlib <http://colorlib.com>
+ * Licensed under MIT (https://github.com/ColorlibHQ/AdminLTE/blob/master/LICENSE)
+ */
+
 /*!
 * Chart.js v2.9.3
 * https://www.chartjs.org
@ -64,12 +76,6 @@
 * http://jquery.org/license
 */

-/*!
- * vue-i18n v8.18.2 
- * (c) 2020 kazuya kawaguchi
- * Released under the MIT License.
- */
-
 /**!
 * @fileOverview Kickass library to create and place poppers near their reference elements.
 * @version 1.16.1
--- a/frontend/public/js/vendor.js.map
+++ b/frontend/public/js/vendor.js.map
--- a/frontend/src/components/accounts/Edit.vue
+++ b/frontend/src/components/accounts/Edit.vue
@ -0,0 +1,33 @@
+<!--
+  - Edit.vue
+  - Copyright (c) 2020 james@firefly-iii.org
+  -
+  - This file is part of Firefly III (https://github.com/firefly-iii).
+  -
+  - This program is free software: you can redistribute it and/or modify
+  - it under the terms of the GNU Affero General Public License as
+  - published by the Free Software Foundation, either version 3 of the
+  - License, or (at your option) any later version.
+  -
+  - This program is distributed in the hope that it will be useful,
+  - but WITHOUT ANY WARRANTY; without even the implied warranty of
+  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  - GNU Affero General Public License for more details.
+  -
+  - You should have received a copy of the GNU Affero General Public License
+  - along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<template>
+
+</template>
+
+<script>
+    export default {
+        name: "Edit"
+    }
+</script>
+
+<style scoped>
+
+</style>
--- a/frontend/src/components/accounts/Index.vue
+++ b/frontend/src/components/accounts/Index.vue
@ -0,0 +1,35 @@
+<!--
+  - Index.vue
+  - Copyright (c) 2020 james@firefly-iii.org
+  -
+  - This file is part of Firefly III (https://github.com/firefly-iii).
+  -
+  - This program is free software: you can redistribute it and/or modify
+  - it under the terms of the GNU Affero General Public License as
+  - published by the Free Software Foundation, either version 3 of the
+  - License, or (at your option) any later version.
+  -
+  - This program is distributed in the hope that it will be useful,
+  - but WITHOUT ANY WARRANTY; without even the implied warranty of
+  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  - GNU Affero General Public License for more details.
+  -
+  - You should have received a copy of the GNU Affero General Public License
+  - along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<template>
+    <div>
+        <router-view></router-view>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: "Index"
+    }
+</script>
+
+<style scoped>
+
+</style>
--- a/frontend/src/components/accounts/List.vue
+++ b/frontend/src/components/accounts/List.vue
@ -0,0 +1,143 @@
+<!--
+  - List.vue
+  - Copyright (c) 2020 james@firefly-iii.org
+  -
+  - This file is part of Firefly III (https://github.com/firefly-iii).
+  -
+  - This program is free software: you can redistribute it and/or modify
+  - it under the terms of the GNU Affero General Public License as
+  - published by the Free Software Foundation, either version 3 of the
+  - License, or (at your option) any later version.
+  -
+  - This program is distributed in the hope that it will be useful,
+  - but WITHOUT ANY WARRANTY; without even the implied warranty of
+  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  - GNU Affero General Public License for more details.
+  -
+  - You should have received a copy of the GNU Affero General Public License
+  - along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<template>
+    <div class="row">
+        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
+            <div class="card">
+                <div class="card-header">
+                    <h3 class="card-title">Title thing</h3>
+                    <div class="card-tools">
+                        <div class="input-group input-group-sm" style="width: 150px;">
+                            <input type="text" name="table_search" class="form-control float-right" placeholder="Search">
+
+                            <div class="input-group-append">
+                                <button type="submit" class="btn btn-default">
+                                    <i class="fas fa-search"></i>
+                                </button>
+                            </div>
+                        </div>
+                    </div>
+                    <!-- TODO -->
+                    <!--
+                    <div class="card-tools">
+                        <ul class="pagination pagination-sm float-right">
+                            <li class="page-item"><a class="page-link" href="#">«</a></li>
+                            <li class="page-item"><a class="page-link" href="#">1</a></li>
+                            <li class="page-item"><a class="page-link" href="#">2</a></li>
+                            <li class="page-item"><a class="page-link" href="#">3</a></li>
+                            <li class="page-item"><a class="page-link" href="#">»</a></li>
+                        </ul>
+                    </div>
+                    -->
+                </div>
+                <div class="card-body p-0">
+                    <table class="table table-sm table-striped">
+                        <thead>
+                        <tr>
+                            <th>&nbsp;</th>
+                            <th>{{ $t('list.name') }}</th>
+                            <th v-if="'asset' === $props.accountTypes">{{ $t('list.role') }}</th>
+                            <th>{{ $t('list.iban') }}</th>
+                            <th style="text-align: right;">{{ $t('list.currentBalance') }}</th>
+                            <th>{{ $t('list.balanceDiff') }}</th>
+                        </tr>
+                        </thead>
+                        <tbody>
+                        <tr v-for="account in accounts">
+                            <td>
+                                <div class="btn-group btn-group-xs">
+                                    <a href="edit" class="btn btn-xs btn-default"><i class="fa fas fa-pencil-alt"></i></a>
+                                    <a href="del" class="btn btn-xs btn-danger"><i class="fa far fa-trash"></i></a>
+                                </div>
+                            </td>
+                            <td>
+                                <router-link :to="{ name: 'accounts.show', params: { id: account.id }}"
+                                             :title="account.attributes.name">{{ account.attributes.name }}
+                                </router-link>
+                            </td>
+                            <td v-if="'asset' === $props.accountTypes">
+                                {{ account.attributes.account_role }}
+                            </td>
+                            <td>
+                                {{ account.attributes.iban }}
+                            </td>
+                            <td style="text-align: right;">
+                                {{ Intl.NumberFormat('en-US', {style: 'currency', currency:
+                                account.attributes.currency_code}).format(account.attributes.current_balance)}}
+                            </td>
+                            <td>diff</td>
+                        </tr>
+                        </tbody>
+                    </table>
+                </div>
+                <div class="card-footer">
+                    Footer stuff.
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+    export default {
+        name: "List",
+        props: {
+            accountTypes: String
+        },
+        data() {
+            return {
+                accounts: []
+            }
+        },
+        mounted() {
+            axios.get('./api/v1/accounts?type=' + this.$props.accountTypes)
+                .then(response => {
+                          this.loadAccounts(response.data.data);
+                      }
+                );
+        },
+        methods: {
+            loadAccounts(data) {
+                for (let key in data) {
+                    if (data.hasOwnProperty(key) && /^0$|^[1-9]\d*$/.test(key) && key <= 4294967294) {
+                        let acct = data[key];
+
+                        // some conversions here.
+                        if ('asset' === acct.attributes.type && null !== acct.attributes.account_role) {
+                            acct.attributes.account_role = this.$t('firefly.account_role_' + acct.attributes.account_role);
+                        }
+                        if ('asset' === acct.attributes.type && null === acct.attributes.account_role) {
+                            acct.attributes.account_role = this.$t('firefly.Default asset account');
+                        }
+                        if (null === acct.attributes.iban) {
+                            acct.attributes.iban = acct.attributes.account_number;
+                        }
+                        this.accounts.push(acct);
+                    }
+                }
+            },
+        }
+    }
+</script>
+
+<style scoped>
+
+</style>
--- a/frontend/src/components/accounts/Show.vue
+++ b/frontend/src/components/accounts/Show.vue
@ -0,0 +1,35 @@
+<!--
+  - Show.vue
+  - Copyright (c) 2020 james@firefly-iii.org
+  -
+  - This file is part of Firefly III (https://github.com/firefly-iii).
+  -
+  - This program is free software: you can redistribute it and/or modify
+  - it under the terms of the GNU Affero General Public License as
+  - published by the Free Software Foundation, either version 3 of the
+  - License, or (at your option) any later version.
+  -
+  - This program is distributed in the hope that it will be useful,
+  - but WITHOUT ANY WARRANTY; without even the implied warranty of
+  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  - GNU Affero General Public License for more details.
+  -
+  - You should have received a copy of the GNU Affero General Public License
+  - along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<template>
+    <div>
+        I am a show
+    </div>
+</template>
+
+<script>
+    export default {
+        name: "Show"
+    }
+</script>
+
+<style scoped>
+
+</style>
--- a/frontend/src/components/transactions/TransactionListLarge.vue
+++ b/frontend/src/components/transactions/TransactionListLarge.vue
@ -19,7 +19,7 @@
  -->

 <template>
-    <table class="table table-striped">
+    <table class="table table-striped table-sm">
        <caption style="display:none;">{{ $t('firefly.transaction_table_description') }}</caption>
        <thead>
        <tr>
--- a/frontend/src/components/transactions/TransactionListMedium.vue
+++ b/frontend/src/components/transactions/TransactionListMedium.vue
@ -19,7 +19,7 @@
  -->

 <template>
-    <table class="table table-striped">
+    <table class="table table-striped table-sm">
        <caption style="display:none;">{{ $t('firefly.transaction_table_description') }}</caption>
        <thead>
        <tr>
--- a/frontend/src/components/transactions/TransactionListSmall.vue
+++ b/frontend/src/components/transactions/TransactionListSmall.vue
@ -19,7 +19,7 @@
  -->

 <template>
-    <table class="table table-striped">
+    <table class="table table-striped table-sm">
        <caption style="display:none;">{{ $t('firefly.transaction_table_description') }}</caption>
        <thead>
        <tr>
--- a/frontend/src/locales/cs.json
+++ b/frontend/src/locales/cs.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "Pokladni\u010dky",
        "piggy_bank": "Pokladni\u010dka",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "V\u00fdchoz\u00ed \u00fa\u010det s aktivy",
+        "account_role_defaultAsset": "V\u00fdchoz\u00ed \u00fa\u010det aktiv",
+        "account_role_savingAsset": "Spo\u0159ic\u00ed \u00fa\u010det",
+        "account_role_sharedAsset": "Sd\u00edlen\u00fd \u00fa\u010det aktiv",
+        "account_role_ccAsset": "Kreditn\u00ed karta",
+        "account_role_cashWalletAsset": "Pen\u011b\u017eenka"
    },
    "list": {
        "piggy_bank": "Pokladni\u010dka",
        "percentage": "pct.",
        "amount": "\u010c\u00e1stka",
        "name": "Jm\u00e9no",
+        "role": "Role",
+        "iban": "IBAN",
+        "lastActivity": "Posledn\u00ed aktivita",
+        "currentBalance": "Aktu\u00e1ln\u00ed z\u016fstatek",
+        "balanceDiff": "Rozd\u00edl z\u016fstatku",
        "next_expected_match": "Dal\u0161\u00ed o\u010dek\u00e1van\u00e1 shoda"
    },
    "config": {
--- a/frontend/src/locales/de.json
+++ b/frontend/src/locales/de.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "Sparschweine",
        "piggy_bank": "Sparschwein",
-        "amounts": "Betr\u00e4ge"
+        "amounts": "Betr\u00e4ge",
+        "Default asset account": "Standard-Bestandskonto",
+        "account_role_defaultAsset": "Standard-Bestandskonto",
+        "account_role_savingAsset": "Sparkonto",
+        "account_role_sharedAsset": "Gemeinsames Bestandskonto",
+        "account_role_ccAsset": "Kreditkarte",
+        "account_role_cashWalletAsset": "Geldb\u00f6rse"
    },
    "list": {
        "piggy_bank": "Sparschwein",
        "percentage": "%",
        "amount": "Betrag",
        "name": "Name",
+        "role": "Rolle",
+        "iban": "IBAN",
+        "lastActivity": "Letzte Aktivit\u00e4t",
+        "currentBalance": "Aktueller Kontostand",
+        "balanceDiff": "Saldendifferenz",
        "next_expected_match": "N\u00e4chste erwartete \u00dcbereinstimmung"
    },
    "config": {
--- a/frontend/src/locales/el.json
+++ b/frontend/src/locales/el.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "\u039a\u03bf\u03c5\u03bc\u03c0\u03b1\u03c1\u03ac\u03b4\u03b5\u03c2",
        "piggy_bank": "\u039a\u03bf\u03c5\u03bc\u03c0\u03b1\u03c1\u03ac\u03c2",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "\u0392\u03b1\u03c3\u03b9\u03ba\u03cc\u03c2 \u03bb\u03bf\u03b3\u03b1\u03c1\u03b9\u03b1\u03c3\u03bc\u03cc\u03c2 \u03ba\u03b5\u03c6\u03b1\u03bb\u03b1\u03af\u03bf\u03c5",
+        "account_role_defaultAsset": "\u0392\u03b1\u03c3\u03b9\u03ba\u03cc\u03c2 \u03bb\u03bf\u03b3\u03b1\u03c1\u03b9\u03b1\u03c3\u03bc\u03cc\u03c2 \u03ba\u03b5\u03c6\u03b1\u03bb\u03b1\u03af\u03bf\u03c5",
+        "account_role_savingAsset": "\u039b\u03bf\u03b3\u03b1\u03c1\u03b9\u03b1\u03c3\u03bc\u03cc\u03c2 \u03b1\u03c0\u03bf\u03c4\u03b1\u03bc\u03af\u03b5\u03c5\u03c3\u03b7\u03c2",
+        "account_role_sharedAsset": "\u039a\u03bf\u03b9\u03bd\u03cc\u03c2 \u03bb\u03bf\u03b3\u03b1\u03c1\u03b9\u03b1\u03c3\u03bc\u03cc\u03c2 \u03ba\u03b5\u03c6\u03b1\u03bb\u03b1\u03af\u03bf\u03c5",
+        "account_role_ccAsset": "\u03a0\u03b9\u03c3\u03c4\u03c9\u03c4\u03b9\u03ba\u03ae \u03ba\u03ac\u03c1\u03c4\u03b1",
+        "account_role_cashWalletAsset": "\u03a0\u03bf\u03c1\u03c4\u03bf\u03c6\u03cc\u03bb\u03b9 \u03bc\u03b5\u03c4\u03c1\u03b7\u03c4\u03ce\u03bd"
    },
    "list": {
        "piggy_bank": "\u039a\u03bf\u03c5\u03bc\u03c0\u03b1\u03c1\u03ac\u03c2",
        "percentage": "pct.",
        "amount": "\u03a0\u03bf\u03c3\u03cc",
        "name": "\u038c\u03bd\u03bf\u03bc\u03b1",
+        "role": "\u03a1\u03cc\u03bb\u03bf\u03c2",
+        "iban": "IBAN",
+        "lastActivity": "\u03a4\u03b5\u03bb\u03b5\u03c5\u03c4\u03b1\u03af\u03b1 \u03b4\u03c1\u03b1\u03c3\u03c4\u03b7\u03c1\u03b9\u03cc\u03c4\u03b7\u03c4\u03b1",
+        "currentBalance": "\u03a4\u03c1\u03ad\u03c7\u03bf\u03bd \u03c5\u03c0\u03cc\u03bb\u03bf\u03b9\u03c0\u03bf",
+        "balanceDiff": "\u0394\u03b9\u03b1\u03c6\u03bf\u03c1\u03ac \u03c5\u03c0\u03bf\u03bb\u03bf\u03af\u03c0\u03bf\u03c5",
        "next_expected_match": "\u0395\u03c0\u03cc\u03bc\u03b5\u03bd\u03b7 \u03b1\u03bd\u03b1\u03bc\u03b5\u03bd\u03cc\u03bc\u03b5\u03bd\u03b7 \u03b1\u03bd\u03c4\u03b9\u03c3\u03c4\u03bf\u03af\u03c7\u03b9\u03c3\u03b7"
    },
    "config": {
--- a/frontend/src/locales/en.json
+++ b/frontend/src/locales/en.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "Piggy banks",
        "piggy_bank": "Piggy bank",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "Default asset account",
+        "account_role_defaultAsset": "Default asset account",
+        "account_role_savingAsset": "Savings account",
+        "account_role_sharedAsset": "Shared asset account",
+        "account_role_ccAsset": "Credit card",
+        "account_role_cashWalletAsset": "Cash wallet"
    },
    "list": {
        "piggy_bank": "Piggy bank",
        "percentage": "pct.",
        "amount": "Amount",
        "name": "Name",
+        "role": "Role",
+        "iban": "IBAN",
+        "lastActivity": "Last activity",
+        "currentBalance": "Current balance",
+        "balanceDiff": "Balance difference",
        "next_expected_match": "Next expected match"
    },
    "config": {
--- a/frontend/src/locales/es.json
+++ b/frontend/src/locales/es.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "Alcanc\u00edas",
        "piggy_bank": "Alcanc\u00eda",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "Cuenta de ingresos por defecto",
+        "account_role_defaultAsset": "Cuentas de ingresos por defecto",
+        "account_role_savingAsset": "Cuentas de ahorros",
+        "account_role_sharedAsset": "Cuenta de ingresos compartida",
+        "account_role_ccAsset": "Tarjeta de Cr\u00e9dito",
+        "account_role_cashWalletAsset": "Billetera de efectivo"
    },
    "list": {
        "piggy_bank": "Alcancilla",
        "percentage": "pct.",
        "amount": "Monto",
        "name": "Nombre",
+        "role": "Rol",
+        "iban": "IBAN",
+        "lastActivity": "Actividad m\u00e1s reciente",
+        "currentBalance": "Balance actual",
+        "balanceDiff": "Diferencia de saldo",
        "next_expected_match": "Pr\u00f3xima coincidencia esperada"
    },
    "config": {
--- a/frontend/src/locales/fi.json
+++ b/frontend/src/locales/fi.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "S\u00e4\u00e4st\u00f6possut",
        "piggy_bank": "S\u00e4\u00e4st\u00f6possu",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "Oletusomaisuustili",
+        "account_role_defaultAsset": "Oletusk\u00e4ytt\u00f6tili",
+        "account_role_savingAsset": "S\u00e4\u00e4st\u00f6tili",
+        "account_role_sharedAsset": "Jaettu k\u00e4ytt\u00f6tili",
+        "account_role_ccAsset": "Luottokortti",
+        "account_role_cashWalletAsset": "K\u00e4teinen"
    },
    "list": {
        "piggy_bank": "S\u00e4\u00e4st\u00f6possu",
        "percentage": "pros.",
        "amount": "Summa",
        "name": "Nimi",
+        "role": "Rooli",
+        "iban": "IBAN",
+        "lastActivity": "Viimeisin tapahtuma",
+        "currentBalance": "T\u00e4m\u00e4nhetkinen saldo",
+        "balanceDiff": "Saldomuutos",
        "next_expected_match": "Seuraava lasku odotettavissa"
    },
    "config": {
--- a/frontend/src/locales/fr.json
+++ b/frontend/src/locales/fr.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "Tirelires",
        "piggy_bank": "Tirelire",
-        "amounts": "Montants"
+        "amounts": "Montants",
+        "Default asset account": "Compte d\u2019actif par d\u00e9faut",
+        "account_role_defaultAsset": "Compte d'actif par d\u00e9faut",
+        "account_role_savingAsset": "Compte d\u2019\u00e9pargne",
+        "account_role_sharedAsset": "Compte d'actif partag\u00e9",
+        "account_role_ccAsset": "Carte de cr\u00e9dit",
+        "account_role_cashWalletAsset": "Porte-monnaie"
    },
    "list": {
        "piggy_bank": "Tirelire",
        "percentage": "pct.",
        "amount": "Montant",
        "name": "Nom",
+        "role": "R\u00f4le",
+        "iban": "Num\u00e9ro IBAN",
+        "lastActivity": "Activit\u00e9 r\u00e9cente",
+        "currentBalance": "Solde courant",
+        "balanceDiff": "Diff\u00e9rence de solde",
        "next_expected_match": "Prochaine association attendue"
    },
    "config": {
--- a/frontend/src/locales/hu.json
+++ b/frontend/src/locales/hu.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "Malacperselyek",
        "piggy_bank": "Malacpersely",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "Alap\u00e9rtelmezett eszk\u00f6zsz\u00e1mla",
+        "account_role_defaultAsset": "Alap\u00e9rtelmezett eszk\u00f6zsz\u00e1mla",
+        "account_role_savingAsset": "Megtakar\u00edt\u00e1si sz\u00e1mla",
+        "account_role_sharedAsset": "Megosztott eszk\u00f6zsz\u00e1mla",
+        "account_role_ccAsset": "Hitelk\u00e1rtya",
+        "account_role_cashWalletAsset": "K\u00e9szp\u00e9nz"
    },
    "list": {
        "piggy_bank": "Malacpersely",
        "percentage": "%",
        "amount": "\u00d6sszeg",
        "name": "N\u00e9v",
+        "role": "Szerepk\u00f6r",
+        "iban": "IBAN",
+        "lastActivity": "Utols\u00f3 aktivit\u00e1s",
+        "currentBalance": "Aktu\u00e1lis egyenleg",
+        "balanceDiff": "Egyenleg k\u00fcl\u00f6nbs\u00e9g",
        "next_expected_match": "K\u00f6vetkez\u0151 v\u00e1rhat\u00f3 egyez\u00e9s"
    },
    "config": {
--- a/frontend/src/locales/id.json
+++ b/frontend/src/locales/id.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "Piggy banks",
        "piggy_bank": "Celengan",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "Akun aset standar",
+        "account_role_defaultAsset": "Akun aset standar",
+        "account_role_savingAsset": "Rekening tabungan",
+        "account_role_sharedAsset": "Akun aset bersama",
+        "account_role_ccAsset": "Kartu kredit",
+        "account_role_cashWalletAsset": "Cash wallet"
    },
    "list": {
        "piggy_bank": "Celengan",
        "percentage": "pct.",
        "amount": "Jumlah",
        "name": "Nama",
+        "role": "Peran",
+        "iban": "IBAN",
+        "lastActivity": "Aktifitas terakhir",
+        "currentBalance": "Saldo saat ini",
+        "balanceDiff": "Perbedaan saldo",
        "next_expected_match": "Transaksi yang diharapkan berikutnya"
    },
    "config": {
--- a/frontend/src/locales/it.json
+++ b/frontend/src/locales/it.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "Salvadanai",
        "piggy_bank": "Salvadanaio",
-        "amounts": "Importi"
+        "amounts": "Importi",
+        "Default asset account": "Conto attivit\u00e0 predefinito",
+        "account_role_defaultAsset": "Conto attivit\u00e0 predefinito",
+        "account_role_savingAsset": "Conto risparmio",
+        "account_role_sharedAsset": "Conto attivit\u00e0 condiviso",
+        "account_role_ccAsset": "Carta di credito",
+        "account_role_cashWalletAsset": "Portafoglio"
    },
    "list": {
        "piggy_bank": "Salvadanaio",
        "percentage": "perc.",
        "amount": "Importo",
        "name": "Nome",
+        "role": "Ruolo",
+        "iban": "IBAN",
+        "lastActivity": "Ultima attivit\u00e0",
+        "currentBalance": "Saldo corrente",
+        "balanceDiff": "Differenze saldi",
        "next_expected_match": "Prossimo abbinamento previsto"
    },
    "config": {
--- a/frontend/src/locales/nb.json
+++ b/frontend/src/locales/nb.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "Sparegriser",
        "piggy_bank": "Sparegris",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "Standard aktivakonto",
+        "account_role_defaultAsset": "Standard aktivakonto",
+        "account_role_savingAsset": "Sparekonto",
+        "account_role_sharedAsset": "Delt aktivakonto",
+        "account_role_ccAsset": "Kredittkort",
+        "account_role_cashWalletAsset": "Kontant lommebok"
    },
    "list": {
        "piggy_bank": "Sparegris",
        "percentage": "pct.",
        "amount": "Bel\u00f8p",
        "name": "Navn",
+        "role": "Rolle",
+        "iban": "IBAN",
+        "lastActivity": "Siste aktivitet",
+        "currentBalance": "N\u00e5v\u00e6rende saldo",
+        "balanceDiff": "Saldodifferanse",
        "next_expected_match": "Neste forventede treff"
    },
    "config": {
--- a/frontend/src/locales/nl.json
+++ b/frontend/src/locales/nl.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "Spaarpotjes",
        "piggy_bank": "Spaarpotje",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "Standaard betaalrekening",
+        "account_role_defaultAsset": "Standaard betaalrekening",
+        "account_role_savingAsset": "Spaarrekening",
+        "account_role_sharedAsset": "Gedeelde betaalrekening",
+        "account_role_ccAsset": "Credit card",
+        "account_role_cashWalletAsset": "Cash"
    },
    "list": {
        "piggy_bank": "Spaarpotje",
        "percentage": "pct",
        "amount": "Bedrag",
        "name": "Naam",
+        "role": "Rol",
+        "iban": "IBAN",
+        "lastActivity": "Laatste activiteit",
+        "currentBalance": "Huidig saldo",
+        "balanceDiff": "Saldoverschil",
        "next_expected_match": "Volgende verwachte match"
    },
    "config": {
--- a/frontend/src/locales/pl.json
+++ b/frontend/src/locales/pl.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "Skarbonki",
        "piggy_bank": "Skarbonka",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "Domy\u015blne konto aktyw\u00f3w",
+        "account_role_defaultAsset": "Domy\u015blne konto aktyw\u00f3w",
+        "account_role_savingAsset": "Konto oszcz\u0119dno\u015bciowe",
+        "account_role_sharedAsset": "Wsp\u00f3\u0142dzielone konto aktyw\u00f3w",
+        "account_role_ccAsset": "Karta kredytowa",
+        "account_role_cashWalletAsset": "Portfel got\u00f3wkowy"
    },
    "list": {
        "piggy_bank": "Skarbonka",
        "percentage": "%",
        "amount": "Kwota",
        "name": "Nazwa",
+        "role": "Rola",
+        "iban": "IBAN",
+        "lastActivity": "Ostatnia aktywno\u015b\u0107",
+        "currentBalance": "Bie\u017c\u0105ce saldo",
+        "balanceDiff": "R\u00f3\u017cnica sald",
        "next_expected_match": "Nast\u0119pne oczekiwane dopasowanie"
    },
    "config": {
--- a/frontend/src/locales/pt-br.json
+++ b/frontend/src/locales/pt-br.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "Cofrinhos",
        "piggy_bank": "Cofrinho",
-        "amounts": "Quantias"
+        "amounts": "Quantias",
+        "Default asset account": "Conta padr\u00e3o",
+        "account_role_defaultAsset": "Conta padr\u00e3o",
+        "account_role_savingAsset": "Conta poupan\u00e7a",
+        "account_role_sharedAsset": "Contas de ativos compartilhadas",
+        "account_role_ccAsset": "Cart\u00e3o de cr\u00e9dito",
+        "account_role_cashWalletAsset": "Carteira de dinheiro"
    },
    "list": {
        "piggy_bank": "Cofrinho",
        "percentage": "pct.",
        "amount": "Total",
        "name": "Nome",
+        "role": "Papel",
+        "iban": "IBAN",
+        "lastActivity": "\u00daltima atividade",
+        "currentBalance": "Saldo atual",
+        "balanceDiff": "Diferen\u00e7a de saldo",
        "next_expected_match": "Pr\u00f3ximo correspondente esperado"
    },
    "config": {
--- a/frontend/src/locales/ro.json
+++ b/frontend/src/locales/ro.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "Pu\u0219culi\u021b\u0103",
        "piggy_bank": "Pu\u0219culi\u021b\u0103",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "Ccont de active implicit",
+        "account_role_defaultAsset": "Contul implicit activ",
+        "account_role_savingAsset": "Cont de economii",
+        "account_role_sharedAsset": "Contul de active partajat",
+        "account_role_ccAsset": "Card de credit",
+        "account_role_cashWalletAsset": "Cash - Numerar"
    },
    "list": {
        "piggy_bank": "Pu\u0219culi\u021b\u0103",
        "percentage": "procent %",
        "amount": "Sum\u0103",
        "name": "Nume",
+        "role": "Rol",
+        "iban": "IBAN",
+        "lastActivity": "Ultima activitate",
+        "currentBalance": "Sold curent",
+        "balanceDiff": "Diferen\u021ba de sold",
        "next_expected_match": "Urm\u0103toarea potrivire a\u0219teptat\u0103"
    },
    "config": {
--- a/frontend/src/locales/ru.json
+++ b/frontend/src/locales/ru.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "\u041a\u043e\u043f\u0438\u043b\u043a\u0438",
        "piggy_bank": "\u041a\u043e\u043f\u0438\u043b\u043a\u0430",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "\u0421\u0447\u0451\u0442 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e",
+        "account_role_defaultAsset": "\u0421\u0447\u0451\u0442 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e",
+        "account_role_savingAsset": "\u0421\u0431\u0435\u0440\u0435\u0433\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u0441\u0447\u0435\u0442",
+        "account_role_sharedAsset": "\u041e\u0431\u0449\u0438\u0439 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0441\u0447\u0451\u0442",
+        "account_role_ccAsset": "\u041a\u0440\u0435\u0434\u0438\u0442\u043d\u0430\u044f \u043a\u0430\u0440\u0442\u0430",
+        "account_role_cashWalletAsset": "\u041a\u043e\u0448\u0435\u043b\u0451\u043a \u0441 \u043d\u0430\u043b\u0438\u0447\u043d\u044b\u043c\u0438"
    },
    "list": {
        "piggy_bank": "\u041a\u043e\u043f\u0438\u043b\u043a\u0430",
        "percentage": "\u043f\u0440\u043e\u0446\u0435\u043d\u0442\u043e\u0432",
        "amount": "\u0421\u0443\u043c\u043c\u0430",
        "name": "\u0418\u043c\u044f",
+        "role": "\u0420\u043e\u043b\u044c",
+        "iban": "IBAN",
+        "lastActivity": "\u041f\u043e\u0441\u043b\u0435\u0434\u043d\u044f\u044f \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c",
+        "currentBalance": "\u0422\u0435\u043a\u0443\u0449\u0438\u0439 \u0431\u0430\u043b\u0430\u043d\u0441",
+        "balanceDiff": "\u0420\u0430\u0437\u043d\u043e\u0441\u0442\u044c \u0431\u0430\u043b\u0430\u043d\u0441\u0430",
        "next_expected_match": "\u0421\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u043e\u0436\u0438\u0434\u0430\u0435\u043c\u044b\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442"
    },
    "config": {
--- a/frontend/src/locales/sv.json
+++ b/frontend/src/locales/sv.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "Spargrisar",
        "piggy_bank": "Piggy bank",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "F\u00f6rvalt tillg\u00e5ngskonto",
+        "account_role_defaultAsset": "F\u00f6rvalt tillg\u00e5ngskonto",
+        "account_role_savingAsset": "Sparkonto",
+        "account_role_sharedAsset": "Delat tillg\u00e5ngskonto",
+        "account_role_ccAsset": "Kreditkort",
+        "account_role_cashWalletAsset": "Pl\u00e5nbok"
    },
    "list": {
        "piggy_bank": "Spargris",
        "percentage": "procent",
        "amount": "Belopp",
        "name": "Namn",
+        "role": "Roll",
+        "iban": "IBAN",
+        "lastActivity": "Senaste aktivitet",
+        "currentBalance": "Nuvarande saldo",
+        "balanceDiff": "Saldodifferens",
        "next_expected_match": "N\u00e4sta f\u00f6rv\u00e4ntade tr\u00e4ff"
    },
    "config": {
--- a/frontend/src/locales/tr.json
+++ b/frontend/src/locales/tr.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "Piggy banks",
        "piggy_bank": "Kumbara",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "Varsay\u0131lan varl\u0131k hesab\u0131",
+        "account_role_defaultAsset": "Varsay\u0131lan varl\u0131k hesab\u0131",
+        "account_role_savingAsset": "Birikim hesab\u0131",
+        "account_role_sharedAsset": "Payla\u015f\u0131lan varl\u0131k hesab\u0131",
+        "account_role_ccAsset": "Kredi Kart\u0131",
+        "account_role_cashWalletAsset": "Nakit c\u00fczdan"
    },
    "list": {
        "piggy_bank": "Kumbara",
        "percentage": "yzd.",
        "amount": "Miktar",
        "name": "\u0130sim",
+        "role": "Rol",
+        "iban": "IBAN numaras\u0131",
+        "lastActivity": "Son Etkinlik",
+        "currentBalance": "Cari bakiye",
+        "balanceDiff": "Bakiye fark\u0131",
        "next_expected_match": "Beklenen sonraki e\u015fle\u015fme"
    },
    "config": {
--- a/frontend/src/locales/vi.json
+++ b/frontend/src/locales/vi.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "Heo \u0111\u1ea5t",
        "piggy_bank": "Heo \u0111\u1ea5t",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "M\u1eb7c \u0111\u1ecbnh t\u00e0i kho\u1ea3n",
+        "account_role_defaultAsset": "t\u00e0i kho\u1ea3n m\u1eb7c \u0111\u1ecbnh",
+        "account_role_savingAsset": "T\u00e0i kho\u1ea3n ti\u1ebft ki\u1ec7m",
+        "account_role_sharedAsset": "t\u00e0i kho\u1ea3n d\u00f9ng chung",
+        "account_role_ccAsset": "Th\u1ebb t\u00edn d\u1ee5ng",
+        "account_role_cashWalletAsset": "V\u00ed ti\u1ec1n m\u1eb7t"
    },
    "list": {
        "piggy_bank": "\u1ed0ng heo con",
        "percentage": "ph\u1ea7n tr\u0103m.",
        "amount": "S\u1ed1 ti\u1ec1n",
        "name": "T\u00ean",
+        "role": "Quy t\u1eafc",
+        "iban": "IBAN",
+        "lastActivity": "Ho\u1ea1t \u0111\u1ed9ng cu\u1ed1i c\u00f9ng",
+        "currentBalance": "S\u1ed1 d\u01b0 hi\u1ec7n t\u1ea1i",
+        "balanceDiff": "S\u1ed1 d\u01b0 ch\u00eanh l\u1ec7ch",
        "next_expected_match": "Tr\u1eadn \u0111\u1ea5u d\u1ef1 ki\u1ebfn ti\u1ebfp theo"
    },
    "config": {
--- a/frontend/src/locales/zh-cn.json
+++ b/frontend/src/locales/zh-cn.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "\u5b58\u94b1\u7f50",
        "piggy_bank": "\u5b58\u94b1\u7f50",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "\u9884\u8bbe\u8d44\u4ea7\u5e10\u6237",
+        "account_role_defaultAsset": "\u9884\u8bbe\u8d44\u4ea7\u5e10\u6237",
+        "account_role_savingAsset": "\u50a8\u84c4\u5e10\u6237",
+        "account_role_sharedAsset": "\u5171\u7528\u8d44\u4ea7\u5e10\u6237",
+        "account_role_ccAsset": "\u4fe1\u7528\u5361",
+        "account_role_cashWalletAsset": "\u73b0\u91d1\u94b1\u5305"
    },
    "list": {
        "piggy_bank": "\u5b58\u94b1\u7f50",
        "percentage": "%",
        "amount": "\u91d1\u989d",
        "name": "\u540d\u79f0",
+        "role": "\u89d2\u8272",
+        "iban": "\u56fd\u9645\u94f6\u884c\u5e10\u6237\u53f7\u7801 (IBAN)",
+        "lastActivity": "\u4e0a\u6b21\u6d3b\u52a8",
+        "currentBalance": "\u76ee\u524d\u9980\u989d",
+        "balanceDiff": "\u9980\u989d\u5dee",
        "next_expected_match": "\u4e0b\u4e00\u4e2a\u9884\u671f\u7684\u914d\u5bf9"
    },
    "config": {
--- a/frontend/src/locales/zh-tw.json
+++ b/frontend/src/locales/zh-tw.json
@ -28,13 +28,24 @@
        "saved": "Saved",
        "piggy_banks": "\u5c0f\u8c6c\u64b2\u6eff",
        "piggy_bank": "\u5c0f\u8c6c\u64b2\u6eff",
-        "amounts": "Amounts"
+        "amounts": "Amounts",
+        "Default asset account": "\u9810\u8a2d\u8cc7\u7522\u5e33\u6236",
+        "account_role_defaultAsset": "\u9810\u8a2d\u8cc7\u7522\u5e33\u6236",
+        "account_role_savingAsset": "\u5132\u84c4\u5e33\u6236",
+        "account_role_sharedAsset": "\u5171\u7528\u8cc7\u7522\u5e33\u6236",
+        "account_role_ccAsset": "\u4fe1\u7528\u5361",
+        "account_role_cashWalletAsset": "\u73fe\u91d1\u9322\u5305"
    },
    "list": {
        "piggy_bank": "\u5c0f\u8c6c\u64b2\u6eff",
        "percentage": "pct.",
        "amount": "\u91d1\u984d",
        "name": "\u540d\u7a31",
+        "role": "\u89d2\u8272",
+        "iban": "\u570b\u969b\u9280\u884c\u5e33\u6236\u865f\u78bc (IBAN)",
+        "lastActivity": "\u4e0a\u6b21\u6d3b\u52d5",
+        "currentBalance": "\u76ee\u524d\u9918\u984d",
+        "balanceDiff": "\u9918\u984d\u5dee",
        "next_expected_match": "\u4e0b\u4e00\u500b\u9810\u671f\u7684\u914d\u5c0d"
    },
    "config": {
--- a/frontend/src/pages/accounts.js
+++ b/frontend/src/pages/accounts.js
@ -0,0 +1,64 @@
+/*
+ * accounts.js
+ * Copyright (c) 2020 james@firefly-iii.org
+ *
+ * This file is part of Firefly III (https://github.com/firefly-iii).
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+require('../bootstrap');
+
+import VueRouter from 'vue-router';
+import Index from "../components/accounts/Index";
+import List from "../components/accounts/List";
+import Show from "../components/accounts/Show";
+
+
+const routes = [
+    {path: '/', component: Index},
+    {path: '/accounts/asset', name: 'accounts.index.asset', component: List, props: {accountTypes: 'asset'}},
+    {path: '/accounts/expense', component: List, props: {accountTypes: 'expense'}},
+    {path: '/accounts/revenue', component: List, props: {accountTypes: 'revenue'}},
+    {path: '/accounts/liabilities', component: List, props: {accountTypes: 'liabilities'}},
+    {path: '/accounts/show/:id', name: 'accounts.show', component: Show}
+]
+
+// 3. Create the router instance and pass the `routes` option
+// You can pass in additional options here, but let's
+// keep it simple for now.
+const router = new VueRouter({
+                                 mode: 'history',
+                                 routes // short for `routes: routes`
+                             })
+
+// i18n
+let i18n = require('../i18n');
+
+let props = {};
+// new Vue({router,
+//             i18n,
+//             el: "#accounts",
+//             render: (createElement) => {
+//                 return createElement(List, { props: props });
+//             },
+//         });
+Vue.use(VueRouter);          // <== very important
+new Vue({
+            router,
+            i18n,
+            render(createElement) {
+                return createElement(Index, {props: props});
+            }
+        }).$mount('#accounts');
--- a/public/v2/js/accounts.js
+++ b/public/v2/js/accounts.js
@ -0,0 +1,2 @@
+(window.webpackJsonp=window.webpackJsonp||[]).push([[2],{205:function(t,s,a){t.exports=a(210)},210:function(t,s,a){"use strict";a.r(s);var e=a(9),n={name:"Index"},c=a(1),i=Object(c.a)(n,(function(){var t=this.$createElement,s=this._self._c||t;return s("div",[s("router-view")],1)}),[],!1,null,"6b40cc75",null).exports,r={name:"List",props:{accountTypes:String},data:function(){return{accounts:[]}},mounted:function(){var t=this;axios.get("./api/v1/accounts?type="+this.$props.accountTypes).then((function(s){t.loadAccounts(s.data.data)}))},methods:{loadAccounts:function(t){for(var s in t)if(t.hasOwnProperty(s)&&/^0$|^[1-9]\d*$/.test(s)&&s<=4294967294){var a=t[s];"asset"===a.attributes.type&&null!==a.attributes.account_role&&(a.attributes.account_role=this.$t("firefly.account_role_"+a.attributes.account_role)),"asset"===a.attributes.type&&null===a.attributes.account_role&&(a.attributes.account_role=this.$t("firefly.Default asset account")),null===a.attributes.iban&&(a.attributes.iban=a.attributes.account_number),this.accounts.push(a)}}}},o=Object(c.a)(r,(function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",{staticClass:"row"},[a("div",{staticClass:"col-lg-12 col-md-12 col-sm-12 col-xs-12"},[a("div",{staticClass:"card"},[t._m(0),t._v(" "),a("div",{staticClass:"card-body p-0"},[a("table",{staticClass:"table table-sm table-striped"},[a("thead",[a("tr",[a("th",[t._v(" ")]),t._v(" "),a("th",[t._v(t._s(t.$t("list.name")))]),t._v(" "),"asset"===t.$props.accountTypes?a("th",[t._v(t._s(t.$t("list.role")))]):t._e(),t._v(" "),a("th",[t._v(t._s(t.$t("list.iban")))]),t._v(" "),a("th",{staticStyle:{"text-align":"right"}},[t._v(t._s(t.$t("list.currentBalance")))]),t._v(" "),a("th",[t._v(t._s(t.$t("list.balanceDiff")))])])]),t._v(" "),a("tbody",t._l(t.accounts,(function(s){return a("tr",[t._m(1,!0),t._v(" "),a("td",[a("router-link",{attrs:{to:{name:"accounts.show",params:{id:s.id}},title:s.attributes.name}},[t._v(t._s(s.attributes.name)+"\n                            ")])],1),t._v(" "),"asset"===t.$props.accountTypes?a("td",[t._v("\n                            "+t._s(s.attributes.account_role)+"\n                        ")]):t._e(),t._v(" "),a("td",[t._v("\n                            "+t._s(s.attributes.iban)+"\n                        ")]),t._v(" "),a("td",{staticStyle:{"text-align":"right"}},[t._v("\n                            "+t._s(Intl.NumberFormat("en-US",{style:"currency",currency:s.attributes.currency_code}).format(s.attributes.current_balance))+"\n                        ")]),t._v(" "),a("td",[t._v("diff")])])})),0)])]),t._v(" "),a("div",{staticClass:"card-footer"},[t._v("\n                Footer stuff.\n            ")])])])])}),[function(){var t=this.$createElement,s=this._self._c||t;return s("div",{staticClass:"card-header"},[s("h3",{staticClass:"card-title"},[this._v("Title thing")]),this._v(" "),s("div",{staticClass:"card-tools"},[s("div",{staticClass:"input-group input-group-sm",staticStyle:{width:"150px"}},[s("input",{staticClass:"form-control float-right",attrs:{type:"text",name:"table_search",placeholder:"Search"}}),this._v(" "),s("div",{staticClass:"input-group-append"},[s("button",{staticClass:"btn btn-default",attrs:{type:"submit"}},[s("i",{staticClass:"fas fa-search"})])])])])])},function(){var t=this.$createElement,s=this._self._c||t;return s("td",[s("div",{staticClass:"btn-group btn-group-xs"},[s("a",{staticClass:"btn btn-xs btn-default",attrs:{href:"edit"}},[s("i",{staticClass:"fa fas fa-pencil-alt"})]),this._v(" "),s("a",{staticClass:"btn btn-xs btn-danger",attrs:{href:"del"}},[s("i",{staticClass:"fa far fa-trash"})])])])}],!1,null,"27a44b66",null).exports,u={name:"Show"},l=Object(c.a)(u,(function(){var t=this.$createElement;return(this._self._c||t)("div",[this._v("\n    I am a show\n")])}),[],!1,null,"dcd61a50",null).exports;a(155);var p=[{path:"/",component:i},{path:"/accounts/asset",name:"accounts.index.asset",component:o,props:{accountTypes:"asset"}},{path:"/accounts/expense",component:o,props:{accountTypes:"expense"}},{path:"/accounts/revenue",component:o,props:{accountTypes:"revenue"}},{path:"/accounts/liabilities",component:o,props:{accountTypes:"liabilities"}},{path:"/accounts/show/:id",name:"accounts.show",component:l}],_=new e.a({mode:"history",routes:p}),d=a(154),h={};Vue.use(e.a),new Vue({router:_,i18n:d,render:function(t){return t(i,{props:h})}}).$mount("#accounts")}},[[205,0,1]]]);
+//# sourceMappingURL=accounts.js.map
--- a/public/v2/js/accounts.js.map
+++ b/public/v2/js/accounts.js.map
--- a/public/v2/js/dashboard.js
+++ b/public/v2/js/dashboard.js
--- a/public/v2/js/dashboard.js.LICENSE.txt
+++ b/public/v2/js/dashboard.js.LICENSE.txt
@ -1,5 +0,0 @@
-/*!
- * AdminLTE v3.0.5 (https://adminlte.io)
- * Copyright 2014-2020 Colorlib <http://colorlib.com>
- * Licensed under MIT (https://github.com/ColorlibHQ/AdminLTE/blob/master/LICENSE)
- */
--- a/public/v2/js/dashboard.js.map
+++ b/public/v2/js/dashboard.js.map
--- a/public/v2/js/register.js
+++ b/public/v2/js/register.js
--- a/public/v2/js/register.js.map
+++ b/public/v2/js/register.js.map
--- a/public/v2/js/vendor.js
+++ b/public/v2/js/vendor.js
--- a/public/v2/js/vendor.js.LICENSE.txt
+++ b/public/v2/js/vendor.js.LICENSE.txt
@ -4,6 +4,18 @@
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
  */

+/*!
+  * vue-router v3.3.4
+  * (c) 2020 Evan You
+  * @license MIT
+  */
+
+/*!
+ * AdminLTE v3.0.5 (https://adminlte.io)
+ * Copyright 2014-2020 Colorlib <http://colorlib.com>
+ * Licensed under MIT (https://github.com/ColorlibHQ/AdminLTE/blob/master/LICENSE)
+ */
+
 /*!
 * Chart.js v2.9.3
 * https://www.chartjs.org
@ -64,12 +76,6 @@
 * http://jquery.org/license
 */

-/*!
- * vue-i18n v8.18.2 
- * (c) 2020 kazuya kawaguchi
- * Released under the MIT License.
- */
-
 /**!
 * @fileOverview Kickass library to create and place poppers near their reference elements.
 * @version 1.16.1
--- a/public/v2/js/vendor.js.map
+++ b/public/v2/js/vendor.js.map
--- a/resources/assets/js/locales/ru.json
+++ b/resources/assets/js/locales/ru.json
@ -36,7 +36,7 @@
        "description": "\u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435",
        "split_transaction_title_help": "\u0415\u0441\u043b\u0438 \u0432\u044b \u0441\u043e\u0437\u0434\u0430\u0451\u0442\u0435 \u0440\u0430\u0437\u0434\u0435\u043b\u0451\u043d\u043d\u0443\u044e \u0442\u0440\u0430\u043d\u0437\u0430\u043a\u0446\u0438\u044e, \u0442\u043e \u0434\u043e\u043b\u0436\u043d\u044b \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u043e\u0431\u0449\u0435\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0434\u043b\u044f \u0432\u0441\u0435\u0445 \u0435\u0451 \u0441\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0438\u0445.",
        "destination_account_reconciliation": "\u0412\u044b \u043d\u0435 \u043c\u043e\u0436\u0435\u0442\u0435 \u0440\u0435\u0434\u0430\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u0447\u0451\u0442 \u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0434\u043b\u044f \u0441\u0432\u0435\u0440\u044f\u0435\u043c\u043e\u0439 \u0442\u0440\u0430\u043d\u0437\u0430\u043a\u0446\u0438\u0438.",
-        "source_account_reconciliation": "\u0412\u044b \u043d\u0435 \u043c\u043e\u0436\u0435\u0442\u0435 \u0440\u0435\u0434\u0430\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0438\u0441\u0445\u043e\u0434\u043d\u044b\u0439 \u0430\u043a\u043a\u0430\u0443\u043d\u0442 \u0441\u0432\u0435\u0440\u043a\u0438.",
+        "source_account_reconciliation": "\u0412\u044b \u043d\u0435 \u043c\u043e\u0436\u0435\u0442\u0435 \u0440\u0435\u0434\u0430\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u0447\u0451\u0442-\u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a \u0434\u043b\u044f \u0441\u0432\u0435\u0440\u044f\u0435\u043c\u043e\u0439 \u0442\u0440\u0430\u043d\u0437\u0430\u043a\u0446\u0438\u0438.",
        "budget": "\u0411\u044e\u0434\u0436\u0435\u0442",
        "you_create_withdrawal": "\u0412\u044b \u0441\u043e\u0437\u0434\u0430\u0451\u0442\u0435 \u0440\u0430\u0441\u0445\u043e\u0434.",
        "you_create_transfer": "\u0412\u044b \u0441\u043e\u0437\u0434\u0430\u0451\u0442\u0435 \u043f\u0435\u0440\u0435\u0432\u043e\u0434.",
@ -58,14 +58,14 @@
        "profile_oauth_edit_client": "\u0418\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u043a\u043b\u0438\u0435\u043d\u0442\u0430",
        "profile_oauth_name_help": "\u0427\u0442\u043e-\u0442\u043e, \u0447\u0442\u043e \u0432\u0430\u0448\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0438 \u0437\u043d\u0430\u044e\u0442, \u0438 \u0447\u0435\u043c\u0443 \u0434\u043e\u0432\u0435\u0440\u044f\u044e\u0442.",
        "profile_oauth_redirect_url": "URL \u0440\u0435\u0434\u0438\u0440\u0435\u043a\u0442\u0430",
-        "profile_oauth_redirect_url_help": "Your application's authorization callback URL.",
+        "profile_oauth_redirect_url_help": "URL \u043e\u0431\u0440\u0430\u0442\u043d\u043e\u0433\u043e \u0432\u044b\u0437\u043e\u0432\u0430 \u0434\u043b\u044f \u0432\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.",
        "profile_authorized_apps": "\u0410\u0432\u0442\u043e\u0440\u0438\u0437\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f",
        "profile_authorized_clients": "\u0410\u0432\u0442\u043e\u0440\u0438\u0437\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u043a\u043b\u0438\u0435\u043d\u0442\u044b",
        "profile_scopes": "\u0420\u0430\u0437\u0440\u0435\u0448\u0435\u043d\u0438\u044f",
        "profile_revoke": "\u041e\u0442\u043a\u043b\u044e\u0447\u0438\u0442\u044c",
        "profile_personal_access_tokens": "\u041f\u0435\u0440\u0441\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0435 Access Tokens",
        "profile_personal_access_token": "\u041f\u0435\u0440\u0441\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0439 Access Token",
-        "profile_personal_access_token_explanation": "Here is your new personal access token. This is the only time it will be shown so don't lose it! You may now use this token to make API requests.",
+        "profile_personal_access_token_explanation": "\u0412\u043e\u0442 \u0432\u0430\u0448 \u043d\u043e\u0432\u044b\u0439 \u043f\u0435\u0440\u0441\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0439 \u0442\u043e\u043a\u0435\u043d \u0434\u043e\u0441\u0442\u0443\u043f\u0430. \u041e\u043d \u0431\u0443\u0434\u0435\u0442 \u043f\u043e\u043a\u0430\u0437\u0430\u043d \u0432\u0430\u043c \u0442\u043e\u043b\u044c\u043a\u043e \u0441\u0435\u0439\u0447\u0430\u0441, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043d\u0435 \u043f\u043e\u0442\u0435\u0440\u044f\u0439\u0442\u0435 \u0435\u0433\u043e! \u0422\u0435\u043f\u0435\u0440\u044c \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u044d\u0442\u043e\u0442 \u0442\u043e\u043a\u0435\u043d, \u0447\u0442\u043e\u0431\u044b \u0434\u0435\u043b\u0430\u0442\u044c \u0437\u0430\u043f\u0440\u043e\u0441\u044b \u043f\u043e API.",
        "profile_no_personal_access_token": "You have not created any personal access tokens.",
        "profile_create_new_token": "\u0421\u043e\u0437\u0434\u0430\u0442\u044c \u043d\u043e\u0432\u044b\u0439 \u0442\u043e\u043a\u0435\u043d",
        "profile_create_token": "\u0421\u043e\u0437\u0434\u0430\u0442\u044c \u0442\u043e\u043a\u0435\u043d",
--- a/resources/views/v2/partials/layout/sidebar.twig
+++ b/resources/views/v2/partials/layout/sidebar.twig
@ -121,8 +121,8 @@

                <li class="nav-header text-uppercase">{{ 'others'|_ }}</li>

-                <li class="nav-item has-treeview">
-                    <a href="#" class="nav-link">
+                <li class="nav-item has-treeview {{ menuOpenRoutePartial('accounts') }}">
+                    <a href="#" class="nav-link {{ activeRoutePartial('accounts') }}">
                        <i class="nav-icon fas fa-credit-card"></i>
                        <p>
                            {{ 'accounts'|_ }}
@ -131,26 +131,27 @@
                    </a>
                    <ul class="nav nav-treeview">
                        <li class="nav-item">
-                            <a href="{{ route('accounts.empty-index') }}#/asset" class="nav-link">
+                            <!-- dingflofbips "{{ activeRoutePartialObjectType('accounts', 'asset') }}" -->
+                            <a href="{{ route('accounts.index','asset') }}" class="nav-link {{ activeRoutePartialObjectType('accounts', 'asset') }}">
                                <i class="far fa-money-bill-alt nav-icon"></i>
                                <p>{{ 'asset_accounts'|_ }}</p>
                            </a>
                        </li>
                        <li class="nav-item">
-                            <a href="{{ route('accounts.empty-index') }}#/expense" class="nav-link">
+                            <a href="{{ route('accounts.index','expense') }}" class="nav-link {{ activeRoutePartialObjectType('accounts', 'expense') }}">
                                <i class="fas fa-shopping-cart nav-icon"></i>
                                <p>{{ 'expense_accounts'|_ }}</p>
                            </a>
                        </li>
                        <li class="nav-item">
-                            <a href="{{ route('accounts.empty-index') }}#/revenue" class="nav-link">
+                            <a href="{{ route('accounts.index','revenue') }}" class="nav-link {{ activeRoutePartialObjectType('accounts', 'revenue') }}">
                                <i class="fas fa-briefcase nav-icon"></i>
                                <p>{{ 'revenue_accounts'|_ }}</p>
                            </a>
                        </li>
                        <li class="nav-item">
-                            <a href="{{ route('accounts.empty-index') }}#/liabilities" class="nav-link">
-                                <i class="far fa-funnel-dollar nav-icon"></i>
+                            <a href="{{ route('accounts.index','liabilities') }}" class="nav-link {{ activeRoutePartialObjectType('accounts', 'liabilities') }}">
+                                <i class="fas fa-funnel-dollar nav-icon"></i>
                                <p>{{ 'liabilities_accounts'|_ }}</p>
                            </a>
                        </li>