mirror of
https://github.com/firefly-iii/firefly-iii.git
synced 2025-10-22 12:11:19 +00:00
Rebuil frontend.
This commit is contained in:
James Cole
@@ -19,83 +19,91 @@
|
||||
-->
|
||||
|
||||
<template>
|
||||
<table class="table table-striped table-sm">
|
||||
<caption style="display:none;">{{ $t('firefly.transaction_table_description') }}</caption>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col" class="text-left">{{ $t('firefly.description') }}</th>
|
||||
<th scope="col">{{ $t('firefly.opposing_account') }}</th>
|
||||
<th scope="col" class="text-right">{{ $t('firefly.amount') }}</th>
|
||||
<th scope="col">{{ $t('firefly.category') }}</th>
|
||||
<th scope="col">{{ $t('firefly.budget') }}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="transaction in this.transactions">
|
||||
<td>
|
||||
<a :href="'transactions/show/' + transaction.id " :title="transaction.date">
|
||||
<span v-if="transaction.attributes.transactions.length > 1">{{ transaction.attributes.group_title }}</span>
|
||||
<span v-if="1===transaction.attributes.transactions.length">{{ transaction.attributes.transactions[0].description }}</span>
|
||||
</a>
|
||||
</td>
|
||||
<td>
|
||||
<table class="table table-striped table-sm">
|
||||
<caption style="display:none;">{{ $t('firefly.transaction_table_description') }}</caption>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col" class="text-left">{{ $t('firefly.description') }}</th>
|
||||
<th scope="col">{{ $t('firefly.opposing_account') }}</th>
|
||||
<th scope="col" class="text-right">{{ $t('firefly.amount') }}</th>
|
||||
<th scope="col">{{ $t('firefly.category') }}</th>
|
||||
<th scope="col">{{ $t('firefly.budget') }}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="transaction in this.transactions">
|
||||
<td>
|
||||
<a :href="'transactions/show/' + transaction.id " :title="transaction.date">
|
||||
<span v-if="transaction.attributes.transactions.length > 1">{{ transaction.attributes.group_title }}</span>
|
||||
<span v-if="1===transaction.attributes.transactions.length">{{ transaction.attributes.transactions[0].description }}</span>
|
||||
</a>
|
||||
</td>
|
||||
<td>
|
||||
<span v-for="tr in transaction.attributes.transactions">
|
||||
<a :href="'accounts/show/' + tr.destination_id" v-if="'withdrawal' === tr.type">{{ tr.destination_name }}</a>
|
||||
<a :href="'accounts/show/' + tr.source_id" v-if="'deposit' === tr.type">{{ tr.source_name }}</a>
|
||||
<a :href="'accounts/show/' + tr.destination_id" v-if="'transfer' === tr.type && tr.source_id === account_id">{{ tr.destination_name }}</a>
|
||||
<a :href="'accounts/show/' + tr.source_id" v-if="'transfer' === tr.type && tr.destination_id === account_id">{{ tr.source_name }}</a>
|
||||
<br />
|
||||
<br/>
|
||||
</span>
|
||||
</td>
|
||||
<td style="text-align:right;">
|
||||
</td>
|
||||
<td style="text-align:right;">
|
||||
<span v-for="tr in transaction.attributes.transactions">
|
||||
<span v-if="'withdrawal' === tr.type" class="text-danger">
|
||||
{{ Intl.NumberFormat('en-US', {style: 'currency', currency: tr.currency_code}).format(tr.amount * -1)}}<br>
|
||||
{{ Intl.NumberFormat(locale, {style: 'currency', currency: tr.currency_code}).format(tr.amount * -1) }}<br>
|
||||
</span>
|
||||
<span v-if="'deposit' === tr.type" class="text-success">
|
||||
{{ Intl.NumberFormat('en-US', {style: 'currency', currency: tr.currency_code}).format(tr.amount)}}<br>
|
||||
{{ Intl.NumberFormat(locale, {style: 'currency', currency: tr.currency_code}).format(tr.amount) }}<br>
|
||||
</span>
|
||||
<span v-if="'transfer' === tr.type && tr.source_id === account_id" class="text-info">
|
||||
{{ Intl.NumberFormat('en-US', {style: 'currency', currency: tr.currency_code}).format(tr.amount * -1)}}<br>
|
||||
{{ Intl.NumberFormat(locale, {style: 'currency', currency: tr.currency_code}).format(tr.amount * -1) }}<br>
|
||||
</span>
|
||||
<span v-if="'transfer' === tr.type && tr.destination_id === account_id" class="text-info">
|
||||
{{ Intl.NumberFormat('en-US', {style: 'currency', currency: tr.currency_code}).format(tr.amount)}}<br>
|
||||
{{ Intl.NumberFormat(locale, {style: 'currency', currency: tr.currency_code}).format(tr.amount) }}<br>
|
||||
</span>
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
</td>
|
||||
<td>
|
||||
<span v-for="tr in transaction.attributes.transactions">
|
||||
<a :href="'categories/show/' + tr.category_id" v-if="0!==tr.category_id">{{ tr.category_name }}</a><br />
|
||||
<a :href="'categories/show/' + tr.category_id" v-if="0!==tr.category_id">{{ tr.category_name }}</a><br/>
|
||||
</span>
|
||||
</td>
|
||||
<td>
|
||||
</td>
|
||||
<td>
|
||||
<span v-for="tr in transaction.attributes.transactions">
|
||||
<a :href="'budgets/show/' + tr.budget_id" v-if="0!==tr.budget_id">{{ tr.budget_name }}</a><br />
|
||||
<a :href="'budgets/show/' + tr.budget_id" v-if="0!==tr.budget_id">{{ tr.budget_name }}</a><br/>
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "TransactionListLarge",
|
||||
props: {
|
||||
transactions: {
|
||||
type: Array,
|
||||
default: function () {
|
||||
return [];
|
||||
}
|
||||
},
|
||||
account_id: {
|
||||
type: Number,
|
||||
default: function () {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
}
|
||||
export default {
|
||||
name: "TransactionListLarge",
|
||||
data() {
|
||||
return {
|
||||
locale: 'en-US'
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.locale = localStorage.locale ?? 'en-US';
|
||||
},
|
||||
props: {
|
||||
transactions: {
|
||||
type: Array,
|
||||
default: function () {
|
||||
return [];
|
||||
}
|
||||
},
|
||||
account_id: {
|
||||
type: Number,
|
||||
default: function () {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
@@ -19,71 +19,79 @@
|
||||
-->
|
||||
|
||||
<template>
|
||||
<table class="table table-striped table-sm">
|
||||
<caption style="display:none;">{{ $t('firefly.transaction_table_description') }}</caption>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col" class="text-left">{{ $t('firefly.description') }}</th>
|
||||
<th scope="col">{{ $t('firefly.opposing_account') }}</th>
|
||||
<th scope="col" class="text-right">{{ $t('firefly.amount') }}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="transaction in this.transactions">
|
||||
<td>
|
||||
<a :href="'transactions/show/' + transaction.id " :title="transaction.date">
|
||||
<span v-if="transaction.attributes.transactions.length > 1">{{ transaction.attributes.group_title }}</span>
|
||||
<span v-if="1===transaction.attributes.transactions.length">{{ transaction.attributes.transactions[0].description }}</span>
|
||||
</a>
|
||||
</td>
|
||||
<td>
|
||||
<table class="table table-striped table-sm">
|
||||
<caption style="display:none;">{{ $t('firefly.transaction_table_description') }}</caption>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col" class="text-left">{{ $t('firefly.description') }}</th>
|
||||
<th scope="col">{{ $t('firefly.opposing_account') }}</th>
|
||||
<th scope="col" class="text-right">{{ $t('firefly.amount') }}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="transaction in this.transactions">
|
||||
<td>
|
||||
<a :href="'transactions/show/' + transaction.id " :title="transaction.date">
|
||||
<span v-if="transaction.attributes.transactions.length > 1">{{ transaction.attributes.group_title }}</span>
|
||||
<span v-if="1===transaction.attributes.transactions.length">{{ transaction.attributes.transactions[0].description }}</span>
|
||||
</a>
|
||||
</td>
|
||||
<td>
|
||||
<span v-for="tr in transaction.attributes.transactions">
|
||||
<a :href="'accounts/show/' + tr.destination_id" v-if="'withdrawal' === tr.type">{{ tr.destination_name }}</a>
|
||||
<a :href="'accounts/show/' + tr.source_id" v-if="'deposit' === tr.type">{{ tr.source_name }}</a>
|
||||
<a :href="'accounts/show/' + tr.destination_id" v-if="'transfer' === tr.type && tr.source_id === account_id">{{ tr.destination_name }}</a>
|
||||
<a :href="'accounts/show/' + tr.source_id" v-if="'transfer' === tr.type && tr.destination_id === account_id">{{ tr.source_name }}</a>
|
||||
<br />
|
||||
<br/>
|
||||
</span>
|
||||
</td>
|
||||
<td style="text-align:right;">
|
||||
</td>
|
||||
<td style="text-align:right;">
|
||||
<span v-for="tr in transaction.attributes.transactions">
|
||||
<span v-if="'withdrawal' === tr.type" class="text-danger">
|
||||
{{ Intl.NumberFormat('en-US', {style: 'currency', currency: tr.currency_code}).format(tr.amount * -1)}}<br>
|
||||
{{ Intl.NumberFormat(locale, {style: 'currency', currency: tr.currency_code}).format(tr.amount * -1) }}<br>
|
||||
</span>
|
||||
<span v-if="'deposit' === tr.type" class="text-success">
|
||||
{{ Intl.NumberFormat('en-US', {style: 'currency', currency: tr.currency_code}).format(tr.amount)}}<br>
|
||||
{{ Intl.NumberFormat(locale, {style: 'currency', currency: tr.currency_code}).format(tr.amount) }}<br>
|
||||
</span>
|
||||
<span v-if="'transfer' === tr.type && tr.source_id === account_id" class="text-info">
|
||||
{{ Intl.NumberFormat('en-US', {style: 'currency', currency: tr.currency_code}).format(tr.amount * -1)}}<br>
|
||||
{{ Intl.NumberFormat(locale, {style: 'currency', currency: tr.currency_code}).format(tr.amount * -1) }}<br>
|
||||
</span>
|
||||
<span v-if="'transfer' === tr.type && tr.destination_id === account_id" class="text-info">
|
||||
{{ Intl.NumberFormat('en-US', {style: 'currency', currency: tr.currency_code}).format(tr.amount)}}<br>
|
||||
{{ Intl.NumberFormat(locale, {style: 'currency', currency: tr.currency_code}).format(tr.amount) }}<br>
|
||||
</span>
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "TransactionListMedium",
|
||||
props: {
|
||||
transactions: {
|
||||
type: Array,
|
||||
default: function () {
|
||||
return [];
|
||||
}
|
||||
},
|
||||
account_id: {
|
||||
type: Number,
|
||||
default: function () {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
}
|
||||
export default {
|
||||
name: "TransactionListMedium",
|
||||
data() {
|
||||
return {
|
||||
locale: 'en-US'
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.locale = localStorage.locale ?? 'en-US';
|
||||
},
|
||||
props: {
|
||||
transactions: {
|
||||
type: Array,
|
||||
default: function () {
|
||||
return [];
|
||||
}
|
||||
},
|
||||
account_id: {
|
||||
type: Number,
|
||||
default: function () {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
@@ -1723,9 +1723,9 @@ caniuse-api@^3.0.0:
|
||||
lodash.uniq "^4.5.0"
|
||||
|
||||
caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001109, caniuse-lite@^1.0.30001181:
|
||||
version "1.0.30001183"
|
||||
resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001183.tgz#7a57ba9d6584119bb5f2bc76d3cc47ba9356b3e2"
|
||||
integrity sha512-7JkwTEE1hlRKETbCFd8HDZeLiQIUcl8rC6JgNjvHCNaxOeNmQ9V4LvQXRUsKIV2CC73qKxljwVhToaA3kLRqTw==
|
||||
version "1.0.30001185"
|
||||
resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001185.tgz#3482a407d261da04393e2f0d61eefbc53be43b95"
|
||||
integrity sha512-Fpi4kVNtNvJ15H0F6vwmXtb3tukv3Zg3qhKkOGUq7KJ1J6b9kf4dnNgtEAFXhRsJo0gNj9W60+wBvn0JcTvdTg==
|
||||
|
||||
chalk@^1.1.3:
|
||||
version "1.1.3"
|
||||
|
||||
Reference in New Issue
Block a user