mirror of
https://github.com/IT4Change/gradido.git
synced 2025-12-13 07:45:54 +00:00
style transactions list, style plugins
This commit is contained in:
ogerly
parent
e9ba63d0ec
commit
f8e1514bb2
@ -56,4 +56,8 @@ export default {
|
||||
);
|
||||
height: 13px;
|
||||
}
|
||||
|
||||
.text-color-gdd-yellow {
|
||||
color: rgb(197 141 56);
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -178,6 +178,9 @@ a:hover,
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.zindex1 {
|
||||
z-index: 1;
|
||||
}
|
||||
.zindex10 {
|
||||
z-index: 10;
|
||||
}
|
||||
@ -198,6 +201,13 @@ a:hover,
|
||||
z-index: 100000;
|
||||
}
|
||||
|
||||
.opacity-1 {
|
||||
opacity: 1;
|
||||
}
|
||||
.opacity-05 {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.gradido-global-color-blue {
|
||||
color: #0e79bc;
|
||||
}
|
||||
|
||||
@ -1,38 +1,13 @@
|
||||
<template>
|
||||
<b-row class="transaction-form">
|
||||
<b-col xl="12" md="12" class="p-0">
|
||||
<b-card class="p-0 m-0 gradido-custom-background">
|
||||
<b-card class="p-0 m-0 appBoxShadow gradido-border-radius">
|
||||
<validation-observer v-slot="{ handleSubmit }" ref="formValidator">
|
||||
<b-form role="form" @submit.prevent="handleSubmit(onSubmit)" @reset="onReset">
|
||||
<b-row>
|
||||
<b-col>
|
||||
<b-form-radio
|
||||
v-model="radioSelected"
|
||||
name="radios"
|
||||
:value="sendTypes.send"
|
||||
size="lg"
|
||||
>
|
||||
{{ $t('send_gdd') }}
|
||||
</b-form-radio>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<b-form-radio
|
||||
v-model="radioSelected"
|
||||
name="radios"
|
||||
:value="sendTypes.link"
|
||||
size="lg"
|
||||
>
|
||||
{{ $t('send_per_link') }}
|
||||
</b-form-radio>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<div class="mt-4" v-if="radioSelected === sendTypes.link">
|
||||
<h2 class="alert-heading">{{ $t('gdd_per_link.header') }}</h2>
|
||||
<div>
|
||||
{{ $t('gdd_per_link.choose-amount') }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<b-row>
|
||||
<b-col cols="12">
|
||||
<div v-if="radioSelected === sendTypes.send">
|
||||
<validation-provider
|
||||
name="Email"
|
||||
@ -66,12 +41,14 @@
|
||||
></b-form-input>
|
||||
</b-input-group>
|
||||
<b-col v-if="errors">
|
||||
<span v-for="error in errors" :key="error" class="errors">{{ error }}</span>
|
||||
<span v-for="error in errors" :key="error" class="errors">
|
||||
{{ error }}
|
||||
</span>
|
||||
</b-col>
|
||||
</validation-provider>
|
||||
</div>
|
||||
|
||||
<div class="mt-4 mb-4">
|
||||
</b-col>
|
||||
<b-col cols="12">
|
||||
<validation-provider
|
||||
:name="$t('form.amount')"
|
||||
:rules="{
|
||||
@ -106,9 +83,45 @@
|
||||
<span v-for="error in errors" class="errors" :key="error">{{ error }}</span>
|
||||
</b-col>
|
||||
</validation-provider>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<div class="h3">Versandart</div>
|
||||
<b-form-radio-group v-model="radioSelected">
|
||||
<b-row>
|
||||
<b-col cols="9">Gdd versenden</b-col>
|
||||
<b-col cols="3">
|
||||
<b-form-radio
|
||||
name="shipping"
|
||||
size="lg"
|
||||
:value="sendTypes.send"
|
||||
stacked
|
||||
></b-form-radio>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row>
|
||||
<b-col cols="9">Gdd versenden per Link</b-col>
|
||||
<b-col cols="3">
|
||||
<b-form-radio
|
||||
name="shipping"
|
||||
:value="sendTypes.link"
|
||||
size="lg"
|
||||
></b-form-radio>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<div class="mt-4" v-if="radioSelected === sendTypes.link">
|
||||
<h2 class="alert-heading">{{ $t('gdd_per_link.header') }}</h2>
|
||||
<div>
|
||||
{{ $t('gdd_per_link.choose-amount') }}
|
||||
</div>
|
||||
</div>
|
||||
</b-form-radio-group>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<div class="mb-4">
|
||||
<b-row>
|
||||
<b-col>
|
||||
<validation-provider
|
||||
:rules="{
|
||||
required: true,
|
||||
@ -135,8 +148,8 @@
|
||||
<span v-for="error in errors" class="errors" :key="error">{{ error }}</span>
|
||||
</b-col>
|
||||
</validation-provider>
|
||||
</div>
|
||||
|
||||
</b-col>
|
||||
</b-row>
|
||||
<div v-if="!!isBalanceDisabled" class="text-danger">
|
||||
{{ $t('form.no_gdd_available') }}
|
||||
</div>
|
||||
@ -152,7 +165,6 @@
|
||||
</b-button>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<br />
|
||||
</b-form>
|
||||
</validation-observer>
|
||||
</b-card>
|
||||
|
||||
@ -13,7 +13,10 @@
|
||||
</div>
|
||||
|
||||
<div v-for="({ id, typeId }, index) in transactions" :key="id">
|
||||
<transaction-list-item :typeId="typeId" class="pointer">
|
||||
<transaction-list-item
|
||||
:typeId="typeId"
|
||||
class="pointer appBoxShadow gradido-border-radius mb-3"
|
||||
>
|
||||
<template #DECAY>
|
||||
<transaction-decay
|
||||
class="list-group-item"
|
||||
|
||||
@ -27,9 +27,9 @@
|
||||
></b-avatar>
|
||||
</div>
|
||||
<div>
|
||||
<div>{{ avatarLongName }}</div>
|
||||
<div class="small">{{ avatarLongName }}</div>
|
||||
|
||||
<div class="text-right m">
|
||||
<div class="text-right small">
|
||||
<small>{{ $store.state.email }}</small>
|
||||
</div>
|
||||
</div>
|
||||
@ -40,11 +40,11 @@
|
||||
</b-navbar-nav>
|
||||
</b-collapse>
|
||||
</b-navbar>
|
||||
<div class="alertBox">
|
||||
<!-- <div class="alertBox">
|
||||
<b-alert show dismissible variant="light" class="nav-alert text-dark">
|
||||
<small>{{ $t('1000thanks') }}</small>
|
||||
</b-alert>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="community-news">
|
||||
<b-card class="bg-white">CommunityNews</b-card>
|
||||
<b-card class="bg-white appBoxShadow gradido-border-radius">CommunityNews</b-card>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
@ -1,8 +1,15 @@
|
||||
<template>
|
||||
<div class="community-member">
|
||||
<div>
|
||||
<div class="text-center">
|
||||
<b-badge class="position-absolute mt--2 ml--5 px-3" variant="success">aktiv</b-badge>
|
||||
</div>
|
||||
<div
|
||||
class="community-member bg-white appBoxShadow gradido-border-radius p-4 border border-success"
|
||||
>
|
||||
<div>CommunityMember components</div>
|
||||
<div>{{ CONFIG.COMMUNITY_NAME }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import CONFIG from '@/config'
|
||||
|
||||
@ -1,7 +1,23 @@
|
||||
<template>
|
||||
<div class="wallet-amount">
|
||||
<div>GDD Amount components</div>
|
||||
<div>{{ balance | GDD }}</div>
|
||||
<div class="translucent-color-opacity">
|
||||
<div v-if="badge" class="text-center">
|
||||
<b-badge class="position-absolute mt--2 ml--5 px-3" variant="success">GDD Senden</b-badge>
|
||||
</div>
|
||||
<div
|
||||
class="wallet-amount bg-white appBoxShadow gradido-border-radius p-4 border border-success"
|
||||
>
|
||||
<b-row>
|
||||
<b-col cols="10" class="h4">GDD Konto</b-col>
|
||||
<b-col cols="2" class="text-center">
|
||||
<b-icon icon="check-circle" variant="success"></b-icon>
|
||||
<div class="small">aktiv</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<div>
|
||||
<b-icon icon="layers" class="mr-3" variant="success"></b-icon>
|
||||
<span class="text-success">{{ balance | GDD }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
@ -9,6 +25,7 @@ export default {
|
||||
name: 'GddAmount',
|
||||
props: {
|
||||
balance: { type: Number, required: true },
|
||||
badge: { type: Boolean, default: false },
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,7 +1,24 @@
|
||||
<template>
|
||||
<div class="wallet-amount">
|
||||
<div>GDT Amount components</div>
|
||||
<div>0.00 GDT</div>
|
||||
<div>
|
||||
<div class="text-center">
|
||||
<b-badge class="position-absolute mt--2 ml--4 px-3 zindex1" variant="light">GDT</b-badge>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="wallet-amount bg-white appBoxShadow gradido-border-radius p-4 border border-light opacity-05"
|
||||
>
|
||||
<b-row>
|
||||
<b-col cols="9" class="h4">GDT Konto</b-col>
|
||||
<b-col cols="3" class="text-center">
|
||||
<b-icon icon="circle" variant="light"></b-icon>
|
||||
<div class="small">inaktiv</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<div>
|
||||
<b-icon icon="layers" class="mr-3"></b-icon>
|
||||
0.00 GDT
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="collapse-icon">
|
||||
<b-icon
|
||||
:icon="visible ? 'caret-up-square' : 'caret-down-square'"
|
||||
:icon="visible ? 'arrow-up-circle' : 'arrow-down-circle'"
|
||||
:class="visible ? 'text-black' : 'text-muted'"
|
||||
/>
|
||||
</div>
|
||||
|
||||
58
frontend/src/components/TransactionRows/Name.vue
Normal file
58
frontend/src/components/TransactionRows/Name.vue
Normal file
@ -0,0 +1,58 @@
|
||||
<template>
|
||||
<div class="name">
|
||||
<div class="gdd-transaction-list-item-name">
|
||||
<div v-if="linkedUser && linkedUser.email">
|
||||
<b-link @click.stop="tunnelEmail">
|
||||
{{ itemText }}
|
||||
</b-link>
|
||||
<span v-if="transactionLinkId">
|
||||
{{ $t('via_link') }}
|
||||
<b-icon
|
||||
icon="link45deg"
|
||||
variant="muted"
|
||||
class="m-mb-1"
|
||||
:title="$t('gdd_per_link.redeemed-title')"
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
<span v-else>{{ itemText }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'Name',
|
||||
props: {
|
||||
amount: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
linkedUser: {
|
||||
type: Object,
|
||||
required: false,
|
||||
},
|
||||
text: {
|
||||
type: String,
|
||||
required: false,
|
||||
},
|
||||
transactionLinkId: {
|
||||
type: Number,
|
||||
required: false,
|
||||
default: null,
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
tunnelEmail() {
|
||||
this.$emit('set-tunneled-email', this.linkedUser.email)
|
||||
this.$router.push({ path: '/send' })
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
itemText() {
|
||||
return this.linkedUser
|
||||
? this.linkedUser.firstName + ' ' + this.linkedUser.lastName
|
||||
: this.text
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@ -1,55 +1,46 @@
|
||||
<template>
|
||||
<div class="transaction-slot-creation">
|
||||
<div @click="visible = !visible">
|
||||
<!-- Collaps Icon -->
|
||||
<collapse-icon class="text-right" :visible="visible" />
|
||||
<div>
|
||||
<b-row>
|
||||
<!-- ICON -->
|
||||
<b-col cols="1">
|
||||
<type-icon color="gradido-global-color-accent" icon="gift" />
|
||||
|
||||
<b-row @click="visible = !visible" class="">
|
||||
<b-col cols="2">
|
||||
<b-avatar icon="gift" variant="success" size="4em"></b-avatar>
|
||||
</b-col>
|
||||
|
||||
<b-col cols="11">
|
||||
<!-- Amount / Name || Text -->
|
||||
<amount-and-name-row :amount="amount" :linkedUser="linkedUser" v-on="$listeners" />
|
||||
|
||||
<!-- Nachricht Memo -->
|
||||
<memo-row :memo="memo" />
|
||||
|
||||
<!-- Datum -->
|
||||
<date-row :date="balanceDate" />
|
||||
|
||||
<!-- Decay -->
|
||||
<decay-row :decay="decay.decay" />
|
||||
<b-col>
|
||||
<div>{{ linkedUser.firstName }} {{ linkedUser.lastName }}</div>
|
||||
<div class="small">{{ balanceDate }}</div>
|
||||
<div class="small">{{ balanceDate }}</div>
|
||||
</b-col>
|
||||
<b-col cols="3">
|
||||
<div class="small">Empfangen</div>
|
||||
<div class="small">{{ amount | GDD }}</div>
|
||||
</b-col>
|
||||
<b-col cols="1"><collapse-icon class="text-right" :visible="visible" /></b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
|
||||
<b-collapse class="pb-4 pt-5" v-model="visible">
|
||||
<decay-information :typeId="typeId" :decay="decay" :amount="amount" />
|
||||
</b-collapse>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import CollapseIcon from '../TransactionRows/CollapseIcon'
|
||||
import TypeIcon from '../TransactionRows/TypeIcon'
|
||||
import AmountAndNameRow from '../TransactionRows/AmountAndNameRow'
|
||||
import MemoRow from '../TransactionRows/MemoRow'
|
||||
import DateRow from '../TransactionRows/DateRow'
|
||||
import DecayRow from '../TransactionRows/DecayRow'
|
||||
// import TypeIcon from '../TransactionRows/TypeIcon'
|
||||
// import AmountAndNameRow from '../TransactionRows/AmountAndNameRow'
|
||||
// import MemoRow from '../TransactionRows/MemoRow'
|
||||
// import DateRow from '../TransactionRows/DateRow'
|
||||
// import DecayRow from '../TransactionRows/DecayRow'
|
||||
import DecayInformation from '../DecayInformations/DecayInformation'
|
||||
|
||||
export default {
|
||||
name: 'TransactionCreation',
|
||||
components: {
|
||||
CollapseIcon,
|
||||
TypeIcon,
|
||||
AmountAndNameRow,
|
||||
MemoRow,
|
||||
DateRow,
|
||||
DecayRow,
|
||||
// TypeIcon,
|
||||
// AmountAndNameRow,
|
||||
// MemoRow,
|
||||
// DateRow,
|
||||
// DecayRow,
|
||||
DecayInformation,
|
||||
},
|
||||
props: {
|
||||
|
||||
@ -1,24 +1,12 @@
|
||||
<template>
|
||||
<div class="transaction-slot-decay">
|
||||
<div @click="visible = !visible">
|
||||
<!-- Collaps Icon -->
|
||||
<collapse-icon class="text-right" :visible="visible" />
|
||||
<div>
|
||||
<b-row>
|
||||
<!-- ICON -->
|
||||
<b-col cols="1">
|
||||
<type-icon color="gradido-global-color-gray" icon="droplet-half" />
|
||||
</b-col>
|
||||
|
||||
<b-col cols="11">
|
||||
<!-- Amount / Name || Text -->
|
||||
<amount-and-name-row
|
||||
:amount="amount"
|
||||
:text="$t('decay.decay_since_last_transaction')"
|
||||
/>
|
||||
<b-row @click="visible = !visible" class="text-color-gdd-yellow">
|
||||
<b-col cols="1"><type-icon color="text-color-gdd-yellow" icon="droplet-half" /></b-col>
|
||||
<b-col>
|
||||
{{ $t('decay.decay_since_last_transaction') }}
|
||||
</b-col>
|
||||
<b-col cols="1"><collapse-icon class="text-right" :visible="visible" /></b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
|
||||
<b-collapse class="pb-4 pt-5" v-model="visible">
|
||||
<decay-information-decay
|
||||
@ -28,12 +16,10 @@
|
||||
/>
|
||||
</b-collapse>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import CollapseIcon from '../TransactionRows/CollapseIcon'
|
||||
import TypeIcon from '../TransactionRows/TypeIcon'
|
||||
import AmountAndNameRow from '../TransactionRows/AmountAndNameRow'
|
||||
import DecayInformationDecay from '../DecayInformations/DecayInformation-Decay'
|
||||
|
||||
export default {
|
||||
@ -41,7 +27,6 @@ export default {
|
||||
components: {
|
||||
CollapseIcon,
|
||||
TypeIcon,
|
||||
AmountAndNameRow,
|
||||
DecayInformationDecay,
|
||||
},
|
||||
props: {
|
||||
|
||||
@ -1,29 +1,19 @@
|
||||
<template>
|
||||
<div class="transaction-slot-link gradido-shadow-inset">
|
||||
<div>
|
||||
<div class="transaction-link-details" @click="showTransactionLinks()">
|
||||
<!-- Collaps Icon -->
|
||||
<collapse-icon class="text-right" :visible="visible" />
|
||||
<div>
|
||||
<b-row>
|
||||
<b-col cols="1">
|
||||
<type-icon color="text-danger" icon="link45deg" />
|
||||
<div class="transaction-slot-link">
|
||||
<b-row @click="showTransactionLinks()">
|
||||
<b-col cols="2">
|
||||
<b-avatar icon="link" variant="danger" size="4em"></b-avatar>
|
||||
</b-col>
|
||||
|
||||
<b-col cols="11">
|
||||
<!-- Amount / Name || Text -->
|
||||
<amount-and-name-row :amount="amount" :text="$t('gdd_per_link.links_sum')" />
|
||||
|
||||
<!-- Count Links -->
|
||||
<link-count-row :count="transactionLinkCount" />
|
||||
|
||||
<!-- Decay -->
|
||||
<decay-row :decay="decay.decay" />
|
||||
<b-col>
|
||||
<div>{{ $t('gdd_per_link.links_sum') }}</div>
|
||||
<div class="small">{{ transactionLinkCount }} offene Links</div>
|
||||
</b-col>
|
||||
<b-col cols="3">
|
||||
<div class="small">Insgesamt</div>
|
||||
<div class="small">{{ amount | GDD }}</div>
|
||||
</b-col>
|
||||
<b-col cols="1"><collapse-icon class="text-right" :visible="visible" /></b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<b-collapse v-model="visible">
|
||||
<collapse-links-list
|
||||
v-model="currentPage"
|
||||
@ -34,14 +24,13 @@
|
||||
/>
|
||||
</b-collapse>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import CollapseIcon from '../TransactionRows/CollapseIcon'
|
||||
import TypeIcon from '../TransactionRows/TypeIcon'
|
||||
import AmountAndNameRow from '../TransactionRows/AmountAndNameRow'
|
||||
import LinkCountRow from '../TransactionRows/LinkCountRow'
|
||||
import DecayRow from '../TransactionRows/DecayRow'
|
||||
// import TypeIcon from '../TransactionRows/TypeIcon'
|
||||
// import AmountAndNameRow from '../TransactionRows/AmountAndNameRow'
|
||||
// import LinkCountRow from '../TransactionRows/LinkCountRow'
|
||||
// import DecayRow from '../TransactionRows/DecayRow'
|
||||
import CollapseLinksList from '../DecayInformations/CollapseLinksList'
|
||||
import { listTransactionLinks } from '@/graphql/queries'
|
||||
|
||||
@ -49,10 +38,10 @@ export default {
|
||||
name: 'TransactionSlotLink',
|
||||
components: {
|
||||
CollapseIcon,
|
||||
TypeIcon,
|
||||
AmountAndNameRow,
|
||||
LinkCountRow,
|
||||
DecayRow,
|
||||
// TypeIcon,
|
||||
// AmountAndNameRow,
|
||||
// LinkCountRow,
|
||||
// DecayRow,
|
||||
CollapseLinksList,
|
||||
},
|
||||
props: {
|
||||
|
||||
@ -1,61 +1,50 @@
|
||||
<template>
|
||||
<div class="transaction-slot-receive">
|
||||
<div @click="visible = !visible">
|
||||
<!-- Collaps Icon -->
|
||||
<collapse-icon class="text-right" :visible="visible" />
|
||||
|
||||
<div>
|
||||
<b-row>
|
||||
<!-- ICON -->
|
||||
<b-col cols="1">
|
||||
<type-icon color="gradido-global-color-accent" icon="arrow-right-circle" />
|
||||
<b-row @click="visible = !visible" class="">
|
||||
<b-col cols="2">
|
||||
<b-avatar icon="arrow-right-circle" variant="success" size="4em"></b-avatar>
|
||||
</b-col>
|
||||
|
||||
<b-col cols="11">
|
||||
<!-- Amount / Name || Text -->
|
||||
<amount-and-name-row
|
||||
<b-col>
|
||||
<div>
|
||||
<name
|
||||
v-on="$listeners"
|
||||
:amount="amount"
|
||||
:linkedUser="linkedUser"
|
||||
:transactionLinkId="transactionLinkId"
|
||||
/>
|
||||
|
||||
<!-- Nachricht Memo -->
|
||||
<memo-row :memo="memo" />
|
||||
|
||||
<!-- Datum -->
|
||||
<date-row :date="balanceDate" />
|
||||
|
||||
<!-- Decay -->
|
||||
<decay-row :decay="decay.decay" />
|
||||
</b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
|
||||
<div class="small">{{ balanceDate }}</div>
|
||||
<div class="small">{{ balanceDate }}</div>
|
||||
</b-col>
|
||||
<b-col cols="3">
|
||||
<div class="small">Empfangen</div>
|
||||
<div class="small">{{ amount | GDD }}</div>
|
||||
</b-col>
|
||||
<b-col cols="1"><collapse-icon class="text-right" :visible="visible" /></b-col>
|
||||
</b-row>
|
||||
<b-collapse class="pb-4 pt-5" v-model="visible">
|
||||
<decay-information :typeId="typeId" :decay="decay" :amount="amount" />
|
||||
</b-collapse>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import CollapseIcon from '../TransactionRows/CollapseIcon'
|
||||
import TypeIcon from '../TransactionRows/TypeIcon'
|
||||
import AmountAndNameRow from '../TransactionRows/AmountAndNameRow'
|
||||
import MemoRow from '../TransactionRows/MemoRow'
|
||||
import DateRow from '../TransactionRows/DateRow'
|
||||
import DecayRow from '../TransactionRows/DecayRow'
|
||||
// import TypeIcon from '../TransactionRows/TypeIcon'
|
||||
import Name from '../TransactionRows/Name'
|
||||
// import MemoRow from '../TransactionRows/MemoRow'
|
||||
// import DateRow from '../TransactionRows/DateRow'
|
||||
// import DecayRow from '../TransactionRows/DecayRow'
|
||||
import DecayInformation from '../DecayInformations/DecayInformation'
|
||||
|
||||
export default {
|
||||
name: 'TransactionReceive',
|
||||
components: {
|
||||
CollapseIcon,
|
||||
TypeIcon,
|
||||
AmountAndNameRow,
|
||||
MemoRow,
|
||||
DateRow,
|
||||
DecayRow,
|
||||
// TypeIcon,
|
||||
Name,
|
||||
// MemoRow,
|
||||
// DateRow,
|
||||
// DecayRow,
|
||||
DecayInformation,
|
||||
},
|
||||
props: {
|
||||
|
||||
@ -1,61 +1,50 @@
|
||||
<template>
|
||||
<div class="transaction-slot-send">
|
||||
<div @click="visible = !visible">
|
||||
<!-- Collaps Icon -->
|
||||
<collapse-icon class="text-right" :visible="visible" />
|
||||
|
||||
<div>
|
||||
<b-row>
|
||||
<!-- ICON -->
|
||||
<b-col cols="1">
|
||||
<type-icon color="text-danger" icon="arrow-left-circle" />
|
||||
<b-row @click="visible = !visible" class="">
|
||||
<b-col cols="2">
|
||||
<b-avatar icon="arrow-left-circle" variant="danger" size="4em"></b-avatar>
|
||||
</b-col>
|
||||
|
||||
<b-col cols="11">
|
||||
<!-- Amount / Name -->
|
||||
<amount-and-name-row
|
||||
<b-col>
|
||||
<div>
|
||||
<name
|
||||
v-on="$listeners"
|
||||
:amount="amount"
|
||||
:linkedUser="linkedUser"
|
||||
:transactionLinkId="transactionLinkId"
|
||||
/>
|
||||
|
||||
<!-- Memo -->
|
||||
<memo-row :memo="memo" />
|
||||
|
||||
<!-- Datum -->
|
||||
<date-row :date="balanceDate" />
|
||||
|
||||
<!-- Decay -->
|
||||
<decay-row :decay="decay.decay" />
|
||||
</b-col>
|
||||
</b-row>
|
||||
</div>
|
||||
|
||||
<div class="small">{{ balanceDate }}</div>
|
||||
<div class="small">{{ balanceDate }}</div>
|
||||
</b-col>
|
||||
<b-col cols="3">
|
||||
<div class="small">Gesendet</div>
|
||||
<div class="small">{{ amount | GDD }}</div>
|
||||
</b-col>
|
||||
<b-col cols="1"><collapse-icon class="text-right" :visible="visible" /></b-col>
|
||||
</b-row>
|
||||
<b-collapse class="pb-4 pt-5" v-model="visible">
|
||||
<decay-information :typeId="typeId" :decay="decay" :amount="amount" />
|
||||
</b-collapse>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import CollapseIcon from '../TransactionRows/CollapseIcon'
|
||||
import TypeIcon from '../TransactionRows/TypeIcon'
|
||||
import AmountAndNameRow from '../TransactionRows/AmountAndNameRow'
|
||||
import MemoRow from '../TransactionRows/MemoRow'
|
||||
import DateRow from '../TransactionRows/DateRow'
|
||||
import DecayRow from '../TransactionRows/DecayRow'
|
||||
// import TypeIcon from '../TransactionRows/TypeIcon'
|
||||
import Name from '../TransactionRows/Name'
|
||||
// import MemoRow from '../TransactionRows/MemoRow'
|
||||
// import DateRow from '../TransactionRows/DateRow'
|
||||
// import DecayRow from '../TransactionRows/DecayRow'
|
||||
import DecayInformation from '../DecayInformations/DecayInformation'
|
||||
|
||||
export default {
|
||||
name: 'TransactionSend',
|
||||
components: {
|
||||
CollapseIcon,
|
||||
TypeIcon,
|
||||
AmountAndNameRow,
|
||||
MemoRow,
|
||||
DateRow,
|
||||
DecayRow,
|
||||
// TypeIcon,
|
||||
Name,
|
||||
// MemoRow,
|
||||
// DateRow,
|
||||
// DecayRow,
|
||||
DecayInformation,
|
||||
},
|
||||
props: {
|
||||
|
||||
@ -4,12 +4,12 @@
|
||||
<b-container v-if="path === '/overview'">
|
||||
<b-row>
|
||||
<b-col cols="5">
|
||||
<div class="p-4 bg-white appBoxShadow gradido-border-radius">
|
||||
<div>
|
||||
<gdd-amount :balance="balance" />
|
||||
</div>
|
||||
</b-col>
|
||||
<b-col cols="7">
|
||||
<div class="p-4 bg-white appBoxShadow gradido-border-radius">
|
||||
<div>
|
||||
<community-member />
|
||||
</div>
|
||||
</b-col>
|
||||
@ -20,12 +20,12 @@
|
||||
<b-container v-if="path === '/send'">
|
||||
<b-row>
|
||||
<b-col cols="6">
|
||||
<div class="p-4 bg-white appBoxShadow gradido-border-radius">
|
||||
<gdd-amount :balance="balance" />
|
||||
<div>
|
||||
<gdd-amount :balance="balance" :badge="true" />
|
||||
</div>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<div class="p-4 bg-white appBoxShadow gradido-border-radius">
|
||||
<div>
|
||||
<gdt-amount />
|
||||
</div>
|
||||
</b-col>
|
||||
@ -34,12 +34,12 @@
|
||||
<b-container v-if="path === '/transactions'">
|
||||
<b-row>
|
||||
<b-col cols="6">
|
||||
<div class="p-4 bg-white appBoxShadow gradido-border-radius">
|
||||
<gdd-amount :balance="balance" />
|
||||
<div>
|
||||
<gdd-amount :balance="balance" :badge="true" />
|
||||
</div>
|
||||
</b-col>
|
||||
<b-col cols="6">
|
||||
<div class="p-4 bg-white appBoxShadow gradido-border-radius">
|
||||
<div>
|
||||
<gdt-amount />
|
||||
</div>
|
||||
</b-col>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user