Merge pull request #1719 from gradido/decay-icon-deacy-information

larger icon and deacy information if center
This commit is contained in:
Alexander Friedland 2022-04-01 14:23:56 +02:00 committed by GitHub
commit fbc2fe38a3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 81 additions and 71 deletions

View File

@ -1,22 +1,27 @@
<template> <template>
<div class="decayinformation-decay"> <div class="decayinformation-decay">
<div class="d-flex">
<div class="text-center pb-3 gradido-max-width">
<b-icon icon="droplet-half" height="12" class="mb-2" />
<b>{{ $t('decay.calculation_decay') }}</b>
</div>
</div>
<b-row> <b-row>
<b-col cols="6" class="text-right"> <b-col cols="1"></b-col>
<div>{{ $t('decay.decay') }}</div> <b-col cols="11">
</b-col> <div class="d-flex">
<b-col cols="6"> <div class="text-center pb-3 gradido-max-width">
<div> <b-icon icon="droplet-half" class="mr-2" />
{{ previousBookedBalance | GDD }} <b>{{ $t('decay.calculation_decay') }}</b>
{{ decay | GDD }} {{ $t('math.equal') }} </div>
<b>{{ balance | GDD }}</b>
</div> </div>
<b-row>
<b-col cols="5" class="text-right">
<div>{{ $t('decay.decay') }}</div>
</b-col>
<b-col cols="7">
<div>
{{ previousBookedBalance | GDD }}
{{ decay | GDD }} {{ $t('math.equal') }}
<b>{{ balance | GDD }}</b>
</div>
</b-col>
</b-row>
</b-col> </b-col>
</b-row> </b-row>
</div> </div>

View File

@ -1,64 +1,69 @@
<template> <template>
<div class="decayinformation-long"> <div class="decayinformation-long">
<div class="d-flex">
<div class="text-center pb-3 gradido-max-width">
<b-icon icon="droplet-half" class="mr-2" />
<b>{{ $t('decay.calculation_decay') }}</b>
</div>
</div>
<b-row> <b-row>
<b-col cols="6" class="text-right"> <b-col cols="1"></b-col>
<div>{{ $t('decay.last_transaction') }}</div> <b-col cols="11">
</b-col> <div class="d-flex">
<b-col cols="6"> <div class="text-center pb-3 gradido-max-width">
<div> <b-icon icon="droplet-half" class="mr-2" />
<span> <b>{{ $t('decay.calculation_decay') }}</b>
{{ $d(new Date(decay.start), 'long') }} </div>
</span>
</div> </div>
</b-col>
</b-row>
<b-row>
<b-col cols="6" class="text-right">
<div>{{ $t('decay.past_time') }}</div>
</b-col>
<b-col cols="6">
<span v-if="duration">{{ durationText }}</span>
</b-col>
</b-row>
<!-- Decay--> <b-row>
<b-row> <b-col cols="5" class="text-right">
<b-col cols="6" class="text-right"> <div>{{ $t('decay.last_transaction') }}</div>
<div>{{ $t('decay.decay') }}</div> </b-col>
</b-col> <b-col cols="7">
<b-col cols="6">{{ decay.decay | GDD }}</b-col> <div>
</b-row> <span>
<hr class="mt-2 mb-2" /> {{ $d(new Date(decay.start), 'long') }}
<b-row> </span>
<b-col class="text-center pt-3 pb-2"> </div>
<b>{{ $t('decay.calculation_total') }}</b> </b-col>
</b-col> </b-row>
</b-row> <b-row>
<!-- Type--> <b-col cols="5" class="text-right">
<b-row> <div>{{ $t('decay.past_time') }}</div>
<!-- eslint-disable-next-line @intlify/vue-i18n/no-dynamic-keys--> </b-col>
<b-col cols="6" class="text-right">{{ $t(`decay.types.${typeId.toLowerCase()}`) }}</b-col> <b-col cols="7">
<b-col cols="6">{{ amount | GDD }}</b-col> <span v-if="duration">{{ durationText }}</span>
</b-row> </b-col>
<!-- Decay--> </b-row>
<b-row>
<b-col cols="6" class="text-right">{{ $t('decay.decay') }}</b-col> <!-- Decay-->
<b-col cols="6">{{ decay.decay | GDD }}</b-col> <b-row>
</b-row> <b-col cols="5" class="text-right">
<!-- Total--> <div>{{ $t('decay.decay') }}</div>
<b-row> </b-col>
<b-col cols="6" class="text-right"> <b-col cols="7">{{ decay.decay | GDD }}</b-col>
<div>{{ $t('decay.total') }}</div> </b-row>
</b-col> <hr class="mt-2 mb-2" />
<b-col cols="6"> <b-row>
<b>{{ (Number(amount) + Number(decay.decay)) | GDD }}</b> <b-col class="text-center pt-3 pb-2">
<b>{{ $t('decay.calculation_total') }}</b>
</b-col>
</b-row>
<!-- Type-->
<b-row>
<!-- eslint-disable-next-line @intlify/vue-i18n/no-dynamic-keys-->
<b-col cols="5" class="text-right">{{ $t(`decay.types.${typeId.toLowerCase()}`) }}</b-col>
<b-col cols="7">{{ amount | GDD }}</b-col>
</b-row>
<!-- Decay-->
<b-row>
<b-col cols="5" class="text-right">{{ $t('decay.decay') }}</b-col>
<b-col cols="7">{{ decay.decay | GDD }}</b-col>
</b-row>
<!-- Total-->
<b-row>
<b-col cols="5" class="text-right">
<div>{{ $t('decay.total') }}</div>
</b-col>
<b-col cols="7">
<b>{{ (Number(amount) + Number(decay.decay)) | GDD }}</b>
</b-col>
</b-row>
</b-col> </b-col>
</b-row> </b-row>
</div> </div>