JakeHillion/storj
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

web/satellite: billing history UX improved

Browse Source 
added sorting header title
currency numbers are displayed with two digits now

Change-Id: I9531f112ff70ffb89b8a2dfe05ab02eb767dd107
This commit is contained in:
VitaliiShpital 2020-05-05 14:14:15 +03:00 committed by Vitalii Shpital
parent 18078bf7ee
commit 0ae0cea93b
4 changed files with 15 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
web/satellite/src/components/account/billing/billingHistory/BillingItem.vue
View File

@ -15,14 +15,14 @@
<b>
{{ billingItem.quantity.currency }}
<span v-if="billingItem.type === 1">
{{ billingItem.quantity.received }}
{{ billingItem.quantity.received.toFixed(2) }}
</span>
<span v-else>
{{ billingItem.quantity.total }}
{{ billingItem.quantity.total.toFixed(2) }}
</span>
</b>
<span v-if="billingItem.type === 1">
of {{ billingItem.quantity.total }}
of <b>{{ billingItem.quantity.total.toFixed(2) }}</b>
</span>
</p>
<p class="container__item download" v-html="billingItem.downloadLinkHtml()"></p>

8
web/satellite/src/components/account/billing/billingHistory/SortingHeader.vue
View File

@ -15,7 +15,9 @@
<div class="sort-header-container__item amount">
<p class="sort-header-container__item__name">Amount</p>
</div>
<div class="sort-header-container__item download"></div>
<div class="sort-header-container__item download">
<p class="sort-header-container__item__name">Download</p>
</div>
</div>
</template>
@ -60,8 +62,8 @@ export default class SortingHeader extends Vue {}
}
.download {
text-align: right;
margin: 0;
min-width: 130px;
width: 10%;
min-width: 10%;
}
</style>

9
web/satellite/tests/unit/account/billing/billingHistory/__snapshots__/BillingItem.spec.ts.snap
View File

@ -10,7 +10,7 @@ exports[`BillingItem renders correctly if charge 1`] = `
<p class="container__item amount"><b>
USD $
<span>
5
5.00
</span></b>
<!---->
</p>
@ -28,7 +28,7 @@ exports[`BillingItem renders correctly if invoice 1`] = `
<p class="container__item amount"><b>
USD $
<span>
5
5.00
</span></b>
<!---->
</p>
@ -46,10 +46,9 @@ exports[`BillingItem renders correctly if transaction 1`] = `
<p class="container__item amount"><b>
USD $
<span>
5
5.00
</span></b> <span>
of 5
</span></p>
of <b>5.00</b></span></p>
<p class="container__item download"><a class="download-link" target="_blank" href="test">Checkout</a></p>
</div>
`;

4
web/satellite/tests/unit/account/billing/billingHistory/__snapshots__/SortingHeader.spec.ts.snap
View File

@ -14,6 +14,8 @@ exports[`SortingHeader renders correctly 1`] = `
<div class="sort-header-container__item amount">
<p class="sort-header-container__item__name">Amount</p>
</div>
<div class="sort-header-container__item download"></div>
<div class="sort-header-container__item download">
<p class="sort-header-container__item__name">Download</p>
</div>
</div>
`;