web/storagenode: added held amount in table for current period

Change-Id: I0e3018ab27b5d8c86bee7d0f95bd6ae75cc205cf
This commit is contained in:
NickolaiYurchenko 2020-04-23 23:11:20 +03:00
parent 895eac1711
commit 16d9d86833
3 changed files with 29 additions and 9 deletions

View File

@ -61,7 +61,7 @@
<p class="estimation-table-container__info-area__text">{{ grossTotal | centsToDollars }}</p>
</div>
</div>
<div class="estimation-table-container__held-area" v-if="!isCurrentPeriod">
<div class="estimation-table-container__held-area" v-if="!isCurrentPeriod || isSatelliteSelected">
<p class="estimation-table-container__held-area__text">Held back</p>
<p class="estimation-table-container__held-area__text">-{{ held | centsToDollars }}</p>
</div>
@ -91,7 +91,12 @@ import { Component, Prop, Vue, Watch } from 'vue-property-decorator';
import EstimationPeriodDropdown from '@/app/components/payments/EstimationPeriodDropdown.vue';
import { NODE_ACTIONS } from '@/app/store/modules/node';
import { BANDWIDTH_DOWNLOAD_PRICE_PER_TB, BANDWIDTH_REPAIR_PRICE_PER_TB, DISK_SPACE_PRICE_PER_TB, PAYOUT_ACTIONS } from '@/app/store/modules/payout';
import {
BANDWIDTH_DOWNLOAD_PRICE_PER_TB,
BANDWIDTH_REPAIR_PRICE_PER_TB,
DISK_SPACE_PRICE_PER_TB,
PAYOUT_ACTIONS,
} from '@/app/store/modules/payout';
import { HeldInfo } from '@/app/types/payout';
import { formatBytes, TB } from '@/app/utils/converter';
@ -128,7 +133,7 @@ export default class EstimationArea extends Vue {
return !this.$store.state.payoutModule.periodRange.start && isCurrentMonthSelected;
}
public get isSomeSatelliteSelected(): boolean {
public get isSatelliteSelected(): boolean {
return !!this.$store.state.node.selectedSatellite.id;
}
@ -143,6 +148,10 @@ export default class EstimationArea extends Vue {
* Returns calculated or stored held amount.
*/
public get held(): number {
if (this.isCurrentPeriod) {
return this.currentMonthHeld();
}
return this.heldInfo.held;
}
@ -259,6 +268,13 @@ export default class EstimationArea extends Vue {
),
];
}
/**
* Returns current month held amount based on currend day of month.
*/
private currentMonthHeld(): number {
return this.grossTotal * this.$store.state.payoutModule.heldPercentage / 100;
}
}
</script>

View File

@ -16,7 +16,6 @@
</div>
<div class="held-progress__border"></div>
<p class="held-progress__main-text">It is your <span class="bold">{{ monthsOnNetwork }} month</span> on network</p>
<!-- <p class="held-progress__hint">25% of Storage Node revenue is withheld, 75% is paid to the Storage Node Operator</p>-->
</div>
</template>
@ -47,11 +46,7 @@ export default class HeldProgress extends Vue {
* Returns approximated number of months that node is online.
*/
public get monthsOnNetwork(): number {
const now = new Date();
const secondsInMonthApproximately = 2628000;
const differenceInSeconds = (now.getTime() - this.$store.state.node.selectedSatellite.joinDate.getTime()) / 1000;
return Math.ceil(differenceInSeconds / secondsInMonthApproximately);
return this.$store.getters.monthsOnNetwork;
}
/**

View File

@ -157,4 +157,13 @@ export const node = {
commit(NODE_MUTATIONS.SET_DAILY_DATA, response);
},
},
getters: {
monthsOnNetwork: (state): number => {
const now = new Date();
const secondsInMonthApproximately = 2628000;
const differenceInSeconds = (now.getTime() - state.selectedSatellite.joinDate.getTime()) / 1000;
return Math.ceil(differenceInSeconds / secondsInMonthApproximately);
},
},
};