mirror of
https://github.com/IT4Change/gradido.git
synced 2026-02-06 09:56:05 +00:00
step 1 from new style done
This commit is contained in:
ogerly
parent
5f3b19c595
commit
c4e671256a
@ -215,6 +215,9 @@ a:hover,
|
|||||||
.gradido-global-color-accent {
|
.gradido-global-color-accent {
|
||||||
color: #047006;
|
color: #047006;
|
||||||
}
|
}
|
||||||
|
.gradido-global-border-color-accent {
|
||||||
|
border-color: #047006 !important;
|
||||||
|
}
|
||||||
|
|
||||||
.gradido-global-color-gray {
|
.gradido-global-color-gray {
|
||||||
color: #858383;
|
color: #858383;
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="container contribution-form">
|
<div class="contribution-form">
|
||||||
<div class="my-3">
|
<!-- <div class="my-3">
|
||||||
<h3>{{ $t('contribution.formText.yourContribution') }}</h3>
|
<h3>{{ $t('contribution.formText.yourContribution') }}</h3>
|
||||||
{{ $t('contribution.formText.bringYourTalentsTo') }}
|
{{ $t('contribution.formText.bringYourTalentsTo') }}
|
||||||
<ul class="my-3">
|
<ul class="my-3">
|
||||||
@ -11,7 +11,7 @@
|
|||||||
<div class="my-3">
|
<div class="my-3">
|
||||||
<b>{{ $t('contribution.formText.describeYourCommunity') }}</b>
|
<b>{{ $t('contribution.formText.describeYourCommunity') }}</b>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div> -->
|
||||||
<b-form
|
<b-form
|
||||||
ref="form"
|
ref="form"
|
||||||
@submit.prevent="submit"
|
@submit.prevent="submit"
|
||||||
@ -126,7 +126,10 @@ export default {
|
|||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
value: { type: Object, required: true },
|
value: { type: Object, required: true },
|
||||||
updateAmount: { type: String, required: false },
|
isThisMonth: { type: Boolean, required: true },
|
||||||
|
minimalDate: { type: Date, required: true },
|
||||||
|
maxGddLastMonth: { type: Number, required: true },
|
||||||
|
maxGddThisMonth: { type: Number, required: true },
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
@ -137,9 +140,9 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
numberFormat(value) {
|
// numberFormat(value) {
|
||||||
return value.replace(PATTERN_NON_DIGIT, '')
|
// return value.replace(PATTERN_NON_DIGIT, '')
|
||||||
},
|
// },
|
||||||
submit() {
|
submit() {
|
||||||
this.form.amount = this.form.amount.replace(PATTERN_NON_DIGIT, '')
|
this.form.amount = this.form.amount.replace(PATTERN_NON_DIGIT, '')
|
||||||
// spreading is needed for testing
|
// spreading is needed for testing
|
||||||
@ -153,19 +156,15 @@ export default {
|
|||||||
this.form.memo = ''
|
this.form.memo = ''
|
||||||
this.form.amount = ''
|
this.form.amount = ''
|
||||||
},
|
},
|
||||||
textForMonth(date, availableAmount) {
|
// textForMonth(date, availableAmount) {
|
||||||
const obj = {
|
// const obj = {
|
||||||
monthAndYear: this.$d(date, 'monthAndYear'),
|
// monthAndYear: this.$d(date, 'monthAndYear'),
|
||||||
creation: availableAmount,
|
// creation: availableAmount,
|
||||||
}
|
// }
|
||||||
return this.$t('contribution.formText.openAmountForMonth', obj)
|
// return this.$t('contribution.formText.openAmountForMonth', obj)
|
||||||
},
|
// },
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
minimalDate() {
|
|
||||||
const date = new Date(this.maximalDate)
|
|
||||||
return new Date(date.setMonth(date.getMonth() - 1, 1))
|
|
||||||
},
|
|
||||||
disabled() {
|
disabled() {
|
||||||
return (
|
return (
|
||||||
this.form.date === '' ||
|
this.form.date === '' ||
|
||||||
@ -178,25 +177,6 @@ export default {
|
|||||||
(!this.isThisMonth && parseInt(this.form.amount) > parseInt(this.maxGddLastMonth))
|
(!this.isThisMonth && parseInt(this.form.amount) > parseInt(this.maxGddLastMonth))
|
||||||
)
|
)
|
||||||
},
|
},
|
||||||
isThisMonth() {
|
|
||||||
const formDate = new Date(this.form.date)
|
|
||||||
return (
|
|
||||||
formDate.getFullYear() === this.maximalDate.getFullYear() &&
|
|
||||||
formDate.getMonth() === this.maximalDate.getMonth()
|
|
||||||
)
|
|
||||||
},
|
|
||||||
maxGddLastMonth() {
|
|
||||||
// when existing contribution is edited, the amount is added back on top of the amount
|
|
||||||
return this.form.id && !this.isThisMonth
|
|
||||||
? parseInt(this.$store.state.creation[1]) + parseInt(this.updateAmount)
|
|
||||||
: this.$store.state.creation[1]
|
|
||||||
},
|
|
||||||
maxGddThisMonth() {
|
|
||||||
// when existing contribution is edited, the amount is added back on top of the amount
|
|
||||||
return this.form.id && this.isThisMonth
|
|
||||||
? parseInt(this.$store.state.creation[2]) + parseInt(this.updateAmount)
|
|
||||||
: this.$store.state.creation[2]
|
|
||||||
},
|
|
||||||
validMaxGDD() {
|
validMaxGDD() {
|
||||||
return Number(this.isThisMonth ? this.maxGddThisMonth : this.maxGddLastMonth)
|
return Number(this.isThisMonth ? this.maxGddThisMonth : this.maxGddLastMonth)
|
||||||
},
|
},
|
||||||
|
|||||||
@ -1,18 +1,30 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="open-creations-amount bg-white appBoxShadow gradido-border-radius p-4">
|
<div class="open-creations-amount bg-white appBoxShadow gradido-border-radius p-4">
|
||||||
<b-table striped hover :items="items"></b-table>
|
<div class="my-3">
|
||||||
|
<ul class="my-3">
|
||||||
|
<li v-html="textForMonth(new Date(minimalDate), maxGddLastMonth)"></li>
|
||||||
|
<li v-html="textForMonth(new Date(), maxGddThisMonth)"></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
name: 'OpenCreationsAmount',
|
name: 'OpenCreationsAmount',
|
||||||
data() {
|
props: {
|
||||||
return {
|
minimalDate: { type: Date, required: true },
|
||||||
items: [
|
maxGddLastMonth: { type: Number, required: true },
|
||||||
{ monat: 'Oktober', status: 'Max. erreicht', eingereicht: '50 h', stundenOffen: '0 h' },
|
maxGddThisMonth: { type: Number, required: true },
|
||||||
{ monat: 'November', status: 'einreichen', eingereicht: '20 h', stundenOffen: '30 h' },
|
},
|
||||||
],
|
|
||||||
}
|
methods: {
|
||||||
|
textForMonth(date, availableAmount) {
|
||||||
|
const obj = {
|
||||||
|
monthAndYear: this.$d(date, 'monthAndYear'),
|
||||||
|
creation: availableAmount,
|
||||||
|
}
|
||||||
|
return this.$t('contribution.formText.openAmountForMonth', obj)
|
||||||
|
},
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="transaction-confirm-link">
|
<div class="transaction-confirm-link bg-white appBoxShadow gradido-border-radius p-3">
|
||||||
<b-row class="confirm-box-link">
|
<b-row class="confirm-box-link">
|
||||||
<b-col class="text-right mt-4 mb-3">
|
<b-col class="text-right mt-4 mb-3">
|
||||||
<div class="alert-heading text-left h3">{{ $t('gdd_per_link.header') }}</div>
|
<div class="alert-heading text-left h3">{{ $t('gdd_per_link.header') }}</div>
|
||||||
@ -9,7 +9,7 @@
|
|||||||
</b-col>
|
</b-col>
|
||||||
</b-row>
|
</b-row>
|
||||||
|
|
||||||
<b-container class="bv-example-row mt-3 mb-3 gray-background p-2">
|
<b-container class="bv-example-row mt-3 mb-5">
|
||||||
<div class="alert-heading text-left h3">{{ $t('advanced-calculation') }}</div>
|
<div class="alert-heading text-left h3">{{ $t('advanced-calculation') }}</div>
|
||||||
<b-row class="pr-3">
|
<b-row class="pr-3">
|
||||||
<b-col class="text-right">{{ $t('form.current_balance') }}</b-col>
|
<b-col class="text-right">{{ $t('form.current_balance') }}</b-col>
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="transaction-confirm-send">
|
<div class="transaction-confirm-send bg-white appBoxShadow gradido-border-radius p-3">
|
||||||
<b-row class="confirm-box-send">
|
<b-row class="confirm-box-send">
|
||||||
<b-col>
|
<b-col>
|
||||||
<div class="display-4 pb-4">{{ $t('form.send_check') }}</div>
|
<div class="display-4 pb-4">{{ $t('form.send_check') }}</div>
|
||||||
@ -33,7 +33,7 @@
|
|||||||
</b-col>
|
</b-col>
|
||||||
</b-row>
|
</b-row>
|
||||||
|
|
||||||
<b-container class="bv-example-row mt-3 mb-3 gray-background p-2">
|
<b-container class="bv-example-row mt-5 mb-5">
|
||||||
<div class="alert-heading text-left h3">{{ $t('advanced-calculation') }}</div>
|
<div class="alert-heading text-left h3">{{ $t('advanced-calculation') }}</div>
|
||||||
<b-row class="pr-3">
|
<b-row class="pr-3">
|
||||||
<b-col class="text-right">{{ $t('form.current_balance') }}</b-col>
|
<b-col class="text-right">{{ $t('form.current_balance') }}</b-col>
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<b-row>
|
<div class="bg-white appBoxShadow gradido-border-radius p-4">
|
||||||
<b-col>
|
<b-row>
|
||||||
<b-card class="p-0 gradido-custom-background">
|
<b-col>
|
||||||
<div class="h3 mb-4">{{ $t('gdd_per_link.created') }}</div>
|
<div class="h3 mb-4">{{ $t('gdd_per_link.created') }}</div>
|
||||||
<clipboard-copy
|
<clipboard-copy
|
||||||
:link="link"
|
:link="link"
|
||||||
@ -18,9 +18,9 @@
|
|||||||
{{ $t('form.close') }}
|
{{ $t('form.close') }}
|
||||||
</b-button>
|
</b-button>
|
||||||
</div>
|
</div>
|
||||||
</b-card>
|
</b-col>
|
||||||
</b-col>
|
</b-row>
|
||||||
</b-row>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import ClipboardCopy from '../ClipboardCopy.vue'
|
import ClipboardCopy from '../ClipboardCopy.vue'
|
||||||
|
|||||||
@ -1,35 +1,29 @@
|
|||||||
<template>
|
<template>
|
||||||
<b-container>
|
<div class="bg-white appBoxShadow gradido-border-radius p-4">
|
||||||
<b-row>
|
<div>
|
||||||
<b-col>
|
<div class="gradido-font-15rem">{{ $t('form.sorry') }}</div>
|
||||||
<b-card class="p-0 gradido-custom-background">
|
<hr />
|
||||||
<div class="p-4 gradido-font-15rem">
|
|
||||||
<div>{{ $t('form.sorry') }}</div>
|
|
||||||
<hr />
|
|
||||||
|
|
||||||
<div class="test-send_transaction_error">{{ $t('form.send_transaction_error') }}</div>
|
<div class="test-send_transaction_error">{{ $t('form.send_transaction_error') }}</div>
|
||||||
|
|
||||||
<hr />
|
<hr />
|
||||||
<div class="test-receiver-not-found" v-if="errorResult === 'recipient not known'">
|
<div class="test-receiver-not-found" v-if="errorResult === 'recipient not known'">
|
||||||
{{ $t('transaction.receiverNotFound') }}
|
{{ $t('transaction.receiverNotFound') }}
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="test-receiver-not-found"
|
class="test-receiver-not-found"
|
||||||
v-if="errorResult === 'GraphQL error: The recipient account was deleted'"
|
v-if="errorResult === 'GraphQL error: The recipient account was deleted'"
|
||||||
>
|
>
|
||||||
{{ $t('transaction.receiverDeleted') }}
|
{{ $t('transaction.receiverDeleted') }}
|
||||||
</div>
|
</div>
|
||||||
<div v-else>{{ errorResult }}</div>
|
<div v-else>{{ errorResult }}</div>
|
||||||
</div>
|
</div>
|
||||||
<p class="text-center mt-3">
|
<p class="text-center mt-5">
|
||||||
<b-button variant="secondary" @click="$emit('on-reset')">
|
<b-button variant="secondary" @click="$emit('on-reset')">
|
||||||
{{ $t('form.close') }}
|
{{ $t('form.close') }}
|
||||||
</b-button>
|
</b-button>
|
||||||
</p>
|
</p>
|
||||||
</b-card>
|
</div>
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
</b-container>
|
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
|
|||||||
@ -1,20 +1,14 @@
|
|||||||
<template>
|
<template>
|
||||||
<b-container>
|
<div class="bg-white appBoxShadow gradido-border-radius p-3">
|
||||||
<b-row>
|
<div class="p-4">
|
||||||
<b-col>
|
{{ $t('form.thx') }}
|
||||||
<b-card class="p-0 gradido-custom-background">
|
<hr />
|
||||||
<div class="p-4">
|
{{ $t('form.send_transaction_success') }}
|
||||||
{{ $t('form.thx') }}
|
</div>
|
||||||
<hr />
|
<div class="text-center mt-5">
|
||||||
{{ $t('form.send_transaction_success') }}
|
<b-button variant="primary" @click="$emit('on-reset')">{{ $t('form.close') }}</b-button>
|
||||||
</div>
|
</div>
|
||||||
<p class="text-center mt-3">
|
</div>
|
||||||
<b-button variant="primary" @click="$emit('on-reset')">{{ $t('form.close') }}</b-button>
|
|
||||||
</p>
|
|
||||||
</b-card>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
</b-container>
|
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
|
|||||||
@ -1,131 +1,125 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="component-navbar">
|
<div class="auth-header position-sticky">
|
||||||
<b-navbar toggleable="lg" type="light" variant="faded">
|
<b-navbar toggleable="lg" class="pr-4">
|
||||||
<div class="navbar-brand">
|
<b-navbar-brand>
|
||||||
<b-navbar-nav @click="$emit('set-visible', false)">
|
<b-img
|
||||||
<b-nav-item to="/overview">
|
class="imgLogo ml--3 mt-lg--2 mt-3 p-2 mb-3 zindex1000"
|
||||||
<img :src="logo" class="navbar-brand-img" alt="..." />
|
:src="logo"
|
||||||
</b-nav-item>
|
width="200"
|
||||||
|
alt="..."
|
||||||
|
/>
|
||||||
|
</b-navbar-brand>
|
||||||
|
<b-img class="sheet-img position-absolute zindex1000" :src="sheet"></b-img>
|
||||||
|
|
||||||
|
<b-collapse id="nav-collapse" is-nav class="ml-5">
|
||||||
|
<b-navbar-nav class="ml-auto" right>
|
||||||
|
<div class="mb-2">
|
||||||
|
<router-link to="/profile">
|
||||||
|
<div>
|
||||||
|
<div class="d-flex">
|
||||||
|
<div class="mr-3">
|
||||||
|
<b-avatar
|
||||||
|
button
|
||||||
|
variant="primary"
|
||||||
|
:text="avatarShortName"
|
||||||
|
class="align-baseline"
|
||||||
|
></b-avatar>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div class="small">{{ avatarLongName }}</div>
|
||||||
|
|
||||||
|
<div class="text-right small">
|
||||||
|
<small>{{ $store.state.email }}</small>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</router-link>
|
||||||
|
</div>
|
||||||
</b-navbar-nav>
|
</b-navbar-nav>
|
||||||
</div>
|
</b-collapse>
|
||||||
|
|
||||||
<b-navbar-nav class="ml-auto" is-nav>
|
|
||||||
<b-nav-item>
|
|
||||||
<b-icon v-if="pending" icon="three-dots" animation="cylon"></b-icon>
|
|
||||||
<div v-else>{{ pending ? $t('em-dash') : balance | amount }} {{ $t('GDD') }}</div>
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item
|
|
||||||
to="/profile"
|
|
||||||
right
|
|
||||||
class="d-none d-sm-none d-md-none d-lg-flex shadow-lg"
|
|
||||||
data-test="navbar-item-username"
|
|
||||||
>
|
|
||||||
<small>
|
|
||||||
{{ $store.state.firstName }} {{ $store.state.lastName }}
|
|
||||||
<b>{{ $store.state.email }}</b>
|
|
||||||
<b-icon class="ml-3" icon="gear-fill" aria-hidden="true"></b-icon>
|
|
||||||
</small>
|
|
||||||
</b-nav-item>
|
|
||||||
</b-navbar-nav>
|
|
||||||
|
|
||||||
<b-navbar-toggle
|
|
||||||
target="false"
|
|
||||||
@click="$emit('set-visible', (visibleCollapse = !visible))"
|
|
||||||
></b-navbar-toggle>
|
|
||||||
</b-navbar>
|
</b-navbar>
|
||||||
|
<!-- <div class="alertBox">
|
||||||
<b-collapse id="collapse-nav" v-model="visibleCollapse" class="p-3 b-collaps-gradido">
|
<b-alert show dismissible variant="light" class="nav-alert text-dark">
|
||||||
<b-nav vertical @click="$emit('set-visible', false)">
|
<small>{{ $t('1000thanks') }}</small>
|
||||||
<div class="text-right">
|
</b-alert>
|
||||||
<b-link to="/profile">
|
</div> -->
|
||||||
<small>
|
|
||||||
{{ $store.state.firstName }}
|
|
||||||
{{ $store.state.lastName }}
|
|
||||||
<b>{{ $store.state.email }}</b>
|
|
||||||
</small>
|
|
||||||
</b-link>
|
|
||||||
</div>
|
|
||||||
<b-nav-item to="/overview" class="mb-3">
|
|
||||||
<b-icon icon="house" aria-hidden="true"></b-icon>
|
|
||||||
{{ $t('navigation.overview') }}
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item to="/send" class="mb-3">
|
|
||||||
<b-icon icon="arrow-left-right" aria-hidden="true"></b-icon>
|
|
||||||
{{ $t('navigation.send') }}
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item to="/transactions" class="mb-3">
|
|
||||||
<b-icon icon="layout-text-sidebar-reverse" aria-hidden="true"></b-icon>
|
|
||||||
{{ $t('navigation.transactions') }}
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item to="/gdt" class="mb-3">
|
|
||||||
<b-icon icon="layout-text-sidebar-reverse" aria-hidden="true"></b-icon>
|
|
||||||
{{ $t('gdt.gdt') }}
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item to="/community" class="mb-3">
|
|
||||||
<b-icon icon="people" aria-hidden="true"></b-icon>
|
|
||||||
{{ $t('navigation.community') }}
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item to="/profile" class="mb-3">
|
|
||||||
<b-icon icon="gear" aria-hidden="true"></b-icon>
|
|
||||||
{{ $t('navigation.profile') }}
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item to="/information" class="mb-3">
|
|
||||||
<b-icon icon="info-circle" aria-hidden="true"></b-icon>
|
|
||||||
{{ $t('navigation.info') }}
|
|
||||||
</b-nav-item>
|
|
||||||
<br />
|
|
||||||
<b-nav-item class="mb-3" v-if="$store.state.isAdmin" @click="$emit('admin')">
|
|
||||||
<b-icon icon="shield-check" aria-hidden="true"></b-icon>
|
|
||||||
{{ $t('navigation.admin_area') }}
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item class="mb-3" @click="$emit('logout')">
|
|
||||||
<b-icon icon="power" aria-hidden="true"></b-icon>
|
|
||||||
{{ $t('navigation.logout') }}
|
|
||||||
</b-nav-item>
|
|
||||||
</b-nav>
|
|
||||||
</b-collapse>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
name: 'navbar',
|
name: 'AuthNavbar',
|
||||||
props: {
|
props: {
|
||||||
visible: {
|
balance: { type: Number, required: true },
|
||||||
type: Boolean,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
balance: {
|
|
||||||
type: Number,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
pending: {
|
|
||||||
type: Boolean,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
logo: 'img/brand/green.png',
|
logo: '/img/brand/green.png',
|
||||||
visibleCollapse: this.visible,
|
sheet: '/img/template/Blaetter.png',
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
computed: {
|
||||||
visible() {
|
avatarShortName() {
|
||||||
this.visibleCollapse = this.visible
|
return this.$store.state.firstName[0] + this.$store.state.lastName[0]
|
||||||
|
},
|
||||||
|
avatarLongName() {
|
||||||
|
return `${this.$store.state.firstName} ${this.$store.state.lastName}`
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style>
|
|
||||||
.b-collaps-gradido {
|
<style lang="scss">
|
||||||
position: absolute;
|
.auth-header {
|
||||||
z-index: 100000;
|
font-family: 'Open Sans', sans-serif !important;
|
||||||
background-color: #dfe0e3f5;
|
height: 150px;
|
||||||
width: 100%;
|
|
||||||
box-shadow: #b4b4b4 0px 13px 22px;
|
|
||||||
font-size: large;
|
|
||||||
}
|
}
|
||||||
.b-collaps-gradido li :hover {
|
|
||||||
background-color: #e9e7e7f5;
|
.authNavbar > .nav-link {
|
||||||
|
color: #383838 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-toggler {
|
||||||
|
font-size: 2.25rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.authNavbar > .router-link-exact-active {
|
||||||
|
color: #0e79bc !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
button.navbar-toggler > span.navbar-toggler-icon {
|
||||||
|
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(4, 112, 6, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
|
||||||
|
}
|
||||||
|
|
||||||
|
.sheet-img {
|
||||||
|
top: -11px;
|
||||||
|
left: 50%;
|
||||||
|
max-width: 64%;
|
||||||
|
}
|
||||||
|
.alertBox {
|
||||||
|
left: 20%;
|
||||||
|
right: 20%;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 1000;
|
||||||
|
top: 25px;
|
||||||
|
}
|
||||||
|
@media screen and (max-width: 1170px) {
|
||||||
|
.sheet-img {
|
||||||
|
left: 40%;
|
||||||
|
}
|
||||||
|
.alertBox {
|
||||||
|
position: static;
|
||||||
|
margin-left: 5%;
|
||||||
|
margin-right: 5%;
|
||||||
|
z-index: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media screen and (max-width: 450px) {
|
||||||
|
.sheet-img {
|
||||||
|
top: -15px;
|
||||||
|
left: 10%;
|
||||||
|
max-width: 61%;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -1,126 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="auth-header position-sticky">
|
|
||||||
<b-navbar toggleable="lg" class="pr-4">
|
|
||||||
<b-navbar-brand>
|
|
||||||
<b-img
|
|
||||||
class="imgLogo ml--3 mt-lg--2 mt-3 p-2 mb-3 zindex1000"
|
|
||||||
:src="logo"
|
|
||||||
width="200"
|
|
||||||
alt="..."
|
|
||||||
/>
|
|
||||||
|
|
||||||
</b-navbar-brand>
|
|
||||||
<b-img class="sheet-img position-absolute zindex1000" :src="sheet"></b-img>
|
|
||||||
|
|
||||||
<b-collapse id="nav-collapse" is-nav class="ml-5">
|
|
||||||
<b-navbar-nav class="ml-auto" right>
|
|
||||||
<div class="mb-2">
|
|
||||||
<router-link to="/profile">
|
|
||||||
<div>
|
|
||||||
<div class="d-flex">
|
|
||||||
<div class="mr-3">
|
|
||||||
<b-avatar
|
|
||||||
button
|
|
||||||
variant="primary"
|
|
||||||
:text="avatarShortName"
|
|
||||||
class="align-baseline"
|
|
||||||
></b-avatar>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<div class="small">{{ avatarLongName }}</div>
|
|
||||||
|
|
||||||
<div class="text-right small">
|
|
||||||
<small>{{ $store.state.email }}</small>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</router-link>
|
|
||||||
</div>
|
|
||||||
</b-navbar-nav>
|
|
||||||
</b-collapse>
|
|
||||||
</b-navbar>
|
|
||||||
<!-- <div class="alertBox">
|
|
||||||
<b-alert show dismissible variant="light" class="nav-alert text-dark">
|
|
||||||
<small>{{ $t('1000thanks') }}</small>
|
|
||||||
</b-alert>
|
|
||||||
</div> -->
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
name: 'AuthNavbar',
|
|
||||||
props: {
|
|
||||||
balance: { type: Number, required: true },
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
logo: '/img/brand/green.png',
|
|
||||||
sheet: '/img/template/Blaetter.png',
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
avatarShortName() {
|
|
||||||
return this.$store.state.firstName[0] + this.$store.state.lastName[0]
|
|
||||||
},
|
|
||||||
avatarLongName() {
|
|
||||||
return `${this.$store.state.firstName} ${this.$store.state.lastName}`
|
|
||||||
},
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss">
|
|
||||||
.auth-header {
|
|
||||||
font-family: 'Open Sans', sans-serif !important;
|
|
||||||
height: 150px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.authNavbar > .nav-link {
|
|
||||||
color: #383838 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-toggler {
|
|
||||||
font-size: 2.25rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.authNavbar > .router-link-exact-active {
|
|
||||||
color: #0e79bc !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
button.navbar-toggler > span.navbar-toggler-icon {
|
|
||||||
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(4, 112, 6, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
|
|
||||||
}
|
|
||||||
|
|
||||||
.sheet-img {
|
|
||||||
top: -11px;
|
|
||||||
left: 50%;
|
|
||||||
max-width: 64%;
|
|
||||||
}
|
|
||||||
.alertBox {
|
|
||||||
left: 20%;
|
|
||||||
right: 20%;
|
|
||||||
position: absolute;
|
|
||||||
z-index: 1000;
|
|
||||||
top: 25px;
|
|
||||||
}
|
|
||||||
@media screen and (max-width: 1170px) {
|
|
||||||
.sheet-img {
|
|
||||||
left: 40%;
|
|
||||||
}
|
|
||||||
.alertBox {
|
|
||||||
position: static;
|
|
||||||
margin-left: 5%;
|
|
||||||
margin-right: 5%;
|
|
||||||
z-index: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@media screen and (max-width: 450px) {
|
|
||||||
.sheet-img {
|
|
||||||
top: -15px;
|
|
||||||
left: 10%;
|
|
||||||
max-width: 61%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,47 +1,72 @@
|
|||||||
<template>
|
<template>
|
||||||
<div id="component-sidebar">
|
<div id="component-sidebar ">
|
||||||
<div class="pl-3">
|
<div id="side-menu" ref="sideMenu" class="pl-lg-1 gradido-border-radius appBoxShadow pt-2 mt-4">
|
||||||
<p></p>
|
<!-- @mouseout="$emit('toogleMobilMenu')" -->
|
||||||
<div class="mb-6">
|
<div class="mb-6 mt-3">
|
||||||
<b-nav vertical class="w-200">
|
<b-nav vertical class="w-200">
|
||||||
<b-nav-item to="/overview" class="mb-3">
|
<b-nav-item to="/overview" class="mb-3">
|
||||||
<b-icon icon="house" aria-hidden="true"></b-icon>
|
<b-icon icon="house" aria-hidden="true"></b-icon>
|
||||||
{{ $t('navigation.overview') }}
|
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.overview') }}</span>
|
||||||
</b-nav-item>
|
</b-nav-item>
|
||||||
|
<b-nav-item to="/storys" class="mb-3">
|
||||||
|
<b-icon icon="card-heading" aria-hidden="true"></b-icon>
|
||||||
|
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.topStories') }}</span>
|
||||||
|
</b-nav-item>
|
||||||
|
<b-nav-item to="/addresses" class="mb-3">
|
||||||
|
<b-icon icon="bookmark" aria-hidden="true"></b-icon>
|
||||||
|
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.adresses') }}</span>
|
||||||
|
</b-nav-item>
|
||||||
|
|
||||||
<b-nav-item to="/send" class="mb-3">
|
<b-nav-item to="/send" class="mb-3">
|
||||||
<b-icon icon="arrow-left-right" aria-hidden="true"></b-icon>
|
<b-icon icon="arrow-left-right" aria-hidden="true"></b-icon>
|
||||||
{{ $t('navigation.send') }}
|
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.send') }}</span>
|
||||||
</b-nav-item>
|
</b-nav-item>
|
||||||
<b-nav-item to="/transactions" class="mb-3">
|
<b-nav-item to="/transactions" class="mb-3">
|
||||||
<b-icon icon="layout-text-sidebar-reverse" aria-hidden="true"></b-icon>
|
<b-icon icon="layout-text-sidebar-reverse" aria-hidden="true"></b-icon>
|
||||||
{{ $t('navigation.transactions') }}
|
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.transactions') }}</span>
|
||||||
</b-nav-item>
|
</b-nav-item>
|
||||||
<b-nav-item to="/gdt" class="mb-3">
|
<b-nav-item to="/profile" class="mb-3">
|
||||||
<b-icon icon="layout-text-sidebar-reverse" aria-hidden="true"></b-icon>
|
<b-icon icon="person" aria-hidden="true"></b-icon>
|
||||||
{{ $t('gdt.gdt') }}
|
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.profile') }}</span>
|
||||||
</b-nav-item>
|
</b-nav-item>
|
||||||
<b-nav-item to="/community" class="mb-3">
|
<b-nav-item to="/community" class="mb-3">
|
||||||
<b-icon icon="people" aria-hidden="true"></b-icon>
|
<b-icon icon="people" aria-hidden="true"></b-icon>
|
||||||
{{ $t('navigation.community') }}
|
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.members') }}</span>
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item to="/profile" class="mb-3" data-test="profile-menu">
|
|
||||||
<b-icon icon="gear" aria-hidden="true"></b-icon>
|
|
||||||
{{ $t('navigation.profile') }}
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item to="/information" class="mb-3">
|
|
||||||
<b-icon icon="info-circle" aria-hidden="true"></b-icon>
|
|
||||||
{{ $t('navigation.info') }}
|
|
||||||
</b-nav-item>
|
</b-nav-item>
|
||||||
</b-nav>
|
</b-nav>
|
||||||
<hr />
|
<hr />
|
||||||
<b-nav vertical class="w-100">
|
<b-nav vertical class="w-100">
|
||||||
|
<b-nav-item
|
||||||
|
@click="
|
||||||
|
lightmode = !lightmode
|
||||||
|
$emit('modeToggle')
|
||||||
|
"
|
||||||
|
class="mb-3"
|
||||||
|
>
|
||||||
|
<b-icon :icon="lightmode ? 'toggle-on' : 'toggle-off'" aria-hidden="true"></b-icon>
|
||||||
|
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.lightmode') }}</span>
|
||||||
|
<label for="checkbox" class="switch-label">
|
||||||
|
<span v-if="lightmode">{{ $t('navigation.moon') }}</span>
|
||||||
|
<span v-else>{{ $t('navigation.sun') }}</span>
|
||||||
|
</label>
|
||||||
|
</b-nav-item>
|
||||||
|
<b-nav-item to="/settings" class="mb-3">
|
||||||
|
<b-icon icon="gear" aria-hidden="true"></b-icon>
|
||||||
|
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.settings') }}</span>
|
||||||
|
</b-nav-item>
|
||||||
<b-nav-item class="mb-3" v-if="$store.state.isAdmin" @click="$emit('admin')">
|
<b-nav-item class="mb-3" v-if="$store.state.isAdmin" @click="$emit('admin')">
|
||||||
<b-icon icon="shield-check" aria-hidden="true"></b-icon>
|
<b-icon icon="shield-check" aria-hidden="true"></b-icon>
|
||||||
{{ $t('navigation.admin_area') }}
|
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.admin_area') }}</span>
|
||||||
</b-nav-item>
|
</b-nav-item>
|
||||||
<b-nav-item class="mb-3" @click="$emit('logout')" data-test="logout-menu">
|
<b-nav-item class="mb-3" @click="$emit('logout')">
|
||||||
<b-icon icon="power" aria-hidden="true"></b-icon>
|
<b-icon icon="power" aria-hidden="true"></b-icon>
|
||||||
{{ $t('navigation.logout') }}
|
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.logout') }}</span>
|
||||||
|
</b-nav-item>
|
||||||
|
<b-nav-item
|
||||||
|
class="mt-4 mb-3 d-block d-md-none d-lg-none"
|
||||||
|
@click="$emit('toogleMobilMenu')"
|
||||||
|
>
|
||||||
|
<b-icon icon="x" aria-hidden="true"></b-icon>
|
||||||
</b-nav-item>
|
</b-nav-item>
|
||||||
</b-nav>
|
</b-nav>
|
||||||
</div>
|
</div>
|
||||||
@ -51,6 +76,11 @@
|
|||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
name: 'sidebar',
|
name: 'sidebar',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
lightmode: false,
|
||||||
|
}
|
||||||
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style>
|
<style>
|
||||||
@ -58,4 +88,8 @@ export default {
|
|||||||
#component-sidebar .active {
|
#component-sidebar .active {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
#component-sidebar {
|
||||||
|
min-width: 53px;
|
||||||
|
max-width: 200px;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -1,95 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div id="component-sidebar ">
|
|
||||||
<div id="side-menu" ref="sideMenu" class="pl-lg-1 gradido-border-radius appBoxShadow pt-2 mt-4">
|
|
||||||
<!-- @mouseout="$emit('toogleMobilMenu')" -->
|
|
||||||
<div class="mb-6 mt-3">
|
|
||||||
<b-nav vertical class="w-200">
|
|
||||||
<b-nav-item to="/overview" class="mb-3">
|
|
||||||
<b-icon icon="house" aria-hidden="true"></b-icon>
|
|
||||||
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.overview') }}</span>
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item to="/storys" class="mb-3">
|
|
||||||
<b-icon icon="card-heading" aria-hidden="true"></b-icon>
|
|
||||||
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.topStories') }}</span>
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item to="/addresses" class="mb-3">
|
|
||||||
<b-icon icon="bookmark" aria-hidden="true"></b-icon>
|
|
||||||
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.adresses') }}</span>
|
|
||||||
</b-nav-item>
|
|
||||||
|
|
||||||
<b-nav-item to="/send" class="mb-3">
|
|
||||||
<b-icon icon="arrow-left-right" aria-hidden="true"></b-icon>
|
|
||||||
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.send') }}</span>
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item to="/transactions" class="mb-3">
|
|
||||||
<b-icon icon="layout-text-sidebar-reverse" aria-hidden="true"></b-icon>
|
|
||||||
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.transactions') }}</span>
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item to="/profile" class="mb-3">
|
|
||||||
<b-icon icon="person" aria-hidden="true"></b-icon>
|
|
||||||
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.profile') }}</span>
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item to="/community" class="mb-3">
|
|
||||||
<b-icon icon="people" aria-hidden="true"></b-icon>
|
|
||||||
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.members') }}</span>
|
|
||||||
</b-nav-item>
|
|
||||||
</b-nav>
|
|
||||||
<hr />
|
|
||||||
<b-nav vertical class="w-100">
|
|
||||||
<b-nav-item
|
|
||||||
@click="
|
|
||||||
lightmode = !lightmode
|
|
||||||
$emit('modeToggle')
|
|
||||||
"
|
|
||||||
class="mb-3"
|
|
||||||
>
|
|
||||||
<b-icon :icon="lightmode ? 'toggle-on' : 'toggle-off'" aria-hidden="true"></b-icon>
|
|
||||||
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.lightmode') }}</span>
|
|
||||||
<label for="checkbox" class="switch-label">
|
|
||||||
<span v-if="lightmode">{{ $t('navigation.moon') }}</span>
|
|
||||||
<span v-else>{{ $t('navigation.sun') }}</span>
|
|
||||||
</label>
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item to="/settings" class="mb-3">
|
|
||||||
<b-icon icon="gear" aria-hidden="true"></b-icon>
|
|
||||||
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.settings') }}</span>
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item class="mb-3" v-if="$store.state.isAdmin" @click="$emit('admin')">
|
|
||||||
<b-icon icon="shield-check" aria-hidden="true"></b-icon>
|
|
||||||
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.admin_area') }}</span>
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item class="mb-3" @click="$emit('logout')">
|
|
||||||
<b-icon icon="power" aria-hidden="true"></b-icon>
|
|
||||||
<span class="d-none d-lg-inline ml-2">{{ $t('navigation.logout') }}</span>
|
|
||||||
</b-nav-item>
|
|
||||||
<b-nav-item
|
|
||||||
class="mt-4 mb-3 d-block d-md-none d-lg-none"
|
|
||||||
@click="$emit('toogleMobilMenu')"
|
|
||||||
>
|
|
||||||
<b-icon icon="x" aria-hidden="true"></b-icon>
|
|
||||||
</b-nav-item>
|
|
||||||
</b-nav>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
name: 'sidebar',
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
lightmode: false,
|
|
||||||
}
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
<style>
|
|
||||||
.component-navbar .active,
|
|
||||||
#component-sidebar .active {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
#component-sidebar {
|
|
||||||
min-width: 53px;
|
|
||||||
max-width: 200px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -13,10 +13,10 @@
|
|||||||
<div class="small">{{ CONFIG.COMMUNITY_NAME }}</div>
|
<div class="small">{{ CONFIG.COMMUNITY_NAME }}</div>
|
||||||
</b-col>
|
</b-col>
|
||||||
<b-col cols="4" class="border-left border-light">
|
<b-col cols="4" class="border-left border-light">
|
||||||
<b-icon icon="people" class="ml-3 mr-3"></b-icon> 1240
|
<b-icon icon="people" class="ml-3 mr-3"></b-icon>
|
||||||
|
1240
|
||||||
</b-col>
|
</b-col>
|
||||||
</b-row>
|
</b-row>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@ -2,32 +2,33 @@
|
|||||||
<div class="translucent-color-opacity">
|
<div class="translucent-color-opacity">
|
||||||
<div class="text-center">
|
<div class="text-center">
|
||||||
<b-badge
|
<b-badge
|
||||||
v-if="showStatus"
|
class="position-absolute mt--2 ml--4 px-3 zindex1"
|
||||||
class="position-absolute mt--2 ml--5 px-3"
|
:variant="showStatus ? 'success' : 'light'"
|
||||||
:variant="badge ? 'success' : 'light'"
|
|
||||||
>
|
>
|
||||||
GDD Senden
|
GDD
|
||||||
</b-badge>
|
</b-badge>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="wallet-amount bg-white appBoxShadow gradido-border-radius p-4 border border-success"
|
class="wallet-amount bg-white appBoxShadow gradido-border-radius p-4 border"
|
||||||
:class="badge ? 'border-success' : 'border-light'"
|
:class="showStatus ? 'gradido-global-border-color-accent' : 'border-light opacity-05'"
|
||||||
>
|
>
|
||||||
<b-row>
|
<b-row>
|
||||||
<b-col cols="9" class="h4">GDD Konto</b-col>
|
<b-col cols="9" class="h4">GDD Konto</b-col>
|
||||||
<b-col cols="3" class="text-center">
|
<b-col cols="3" class="text-center">
|
||||||
<div v-if="showStatus">
|
<div>
|
||||||
<b-icon
|
<b-icon
|
||||||
:icon="badge ? 'check-circle' : 'circle'"
|
:icon="showStatus ? 'check-circle' : 'circle'"
|
||||||
:variant="badge ? 'success' : 'light'"
|
:class="showStatus ? 'gradido-global-border-color-accent' : ''"
|
||||||
></b-icon>
|
></b-icon>
|
||||||
<div class="small">{{ badge ? 'aktiv' : 'inaktiv' }}</div>
|
<div class="small">{{ badge ? 'aktiv' : 'inaktiv' }}</div>
|
||||||
</div>
|
</div>
|
||||||
</b-col>
|
</b-col>
|
||||||
</b-row>
|
</b-row>
|
||||||
<div>
|
<div>
|
||||||
<b-icon icon="layers" class="mr-3" variant="success"></b-icon>
|
<b-icon icon="layers" class="mr-3 gradido-global-border-color-accent"></b-icon>
|
||||||
<span :class="badge ? 'text-success' : 'text-light'">{{ balance | GDD }}</span>
|
<span :class="badge ? 'gradido-global-color-accent' : 'text-light'">
|
||||||
|
{{ balance | GDD }}
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -10,8 +10,8 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
class="wallet-amount bg-white appBoxShadow gradido-border-radius p-4 border opacity-05"
|
class="wallet-amount bg-white appBoxShadow gradido-border-radius p-4 border"
|
||||||
:class="badge ? 'border-success' : 'border-light'"
|
:class="showStatus ? 'gradido-global-border-color-accent' : 'border-light opacity-05'"
|
||||||
>
|
>
|
||||||
<b-row>
|
<b-row>
|
||||||
<b-col cols="9" class="h4">GDT Konto</b-col>
|
<b-col cols="9" class="h4">GDT Konto</b-col>
|
||||||
@ -19,7 +19,7 @@
|
|||||||
<div>
|
<div>
|
||||||
<b-icon
|
<b-icon
|
||||||
:icon="badge ? 'check-circle' : 'circle'"
|
:icon="badge ? 'check-circle' : 'circle'"
|
||||||
:variant="badge ? 'success' : 'light'"
|
class="gradido-global-border-color-accent"
|
||||||
></b-icon>
|
></b-icon>
|
||||||
<div class="small">{{ badge ? 'aktiv' : 'inaktiv' }}</div>
|
<div class="small">{{ badge ? 'aktiv' : 'inaktiv' }}</div>
|
||||||
</div>
|
</div>
|
||||||
@ -37,6 +37,7 @@ export default {
|
|||||||
name: 'GdtAmount',
|
name: 'GdtAmount',
|
||||||
props: {
|
props: {
|
||||||
badge: { type: Boolean, default: false },
|
badge: { type: Boolean, default: false },
|
||||||
|
showStatus: { type: Boolean, default: false },
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -0,0 +1,17 @@
|
|||||||
|
<template>
|
||||||
|
<div class="contribution-info">
|
||||||
|
<div>
|
||||||
|
<h3>{{ $t('contribution.formText.yourContribution') }}</h3>
|
||||||
|
{{ $t('contribution.formText.bringYourTalentsTo') }}
|
||||||
|
|
||||||
|
<div class="my-3">
|
||||||
|
<b>{{ $t('contribution.formText.describeYourCommunity') }}</b>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'LastContributions',
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@ -1,18 +1,32 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div class="list-group">
|
<div class="list-group bg-white appBoxShadow gradido-border-radius p-3">
|
||||||
<b-row @click="visible = !visible" class="">
|
<b-row @click="visible = !visible" class="">
|
||||||
<b-col cols="2">
|
<b-col cols="2">
|
||||||
<b-avatar :icon="getLinesByType.icon" variant="light" size="4em"></b-avatar>
|
<b-avatar
|
||||||
|
:icon="getLinesByType.icon"
|
||||||
|
variant="light"
|
||||||
|
size="4em"
|
||||||
|
:class="getLinesByType.iconclasses"
|
||||||
|
></b-avatar>
|
||||||
</b-col>
|
</b-col>
|
||||||
<b-col>
|
<b-col>
|
||||||
<div>
|
<!-- <div>
|
||||||
{{ getLinesByType }}
|
{{ getLinesByType }}
|
||||||
|
</div> -->
|
||||||
|
<div>
|
||||||
|
{{ date }}
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
{{ getLinesByType.description }}
|
||||||
|
</div>
|
||||||
|
<div class="small">
|
||||||
|
{{ getLinesByType.descriptiontext }}
|
||||||
</div>
|
</div>
|
||||||
</b-col>
|
</b-col>
|
||||||
<b-col cols="3">
|
<b-col cols="3">
|
||||||
<div class="small">Gesendet</div>
|
<div class="small mt-2">GDT erhalten</div>
|
||||||
<div class="small">{{ amount | GDT }}</div>
|
<div class="">{{ getLinesByType.credittext }}</div>
|
||||||
</b-col>
|
</b-col>
|
||||||
<b-col cols="1"><collapse-icon class="text-right" :visible="visible" /></b-col>
|
<b-col cols="1"><collapse-icon class="text-right" :visible="visible" /></b-col>
|
||||||
</b-row>
|
</b-row>
|
||||||
@ -75,7 +89,7 @@ export default {
|
|||||||
case GdtEntryType.CVS2: {
|
case GdtEntryType.CVS2: {
|
||||||
return {
|
return {
|
||||||
icon: 'heart',
|
icon: 'heart',
|
||||||
iconclasses: 'gradido-global-color-accent m-mb-1 font2em',
|
iconclasses: 'gradido-global-color-accent',
|
||||||
description: this.$t('gdt.contribution'),
|
description: this.$t('gdt.contribution'),
|
||||||
descriptiontext: this.$n(this.amount, 'decimal') + ' €',
|
descriptiontext: this.$n(this.amount, 'decimal') + ' €',
|
||||||
credittext: this.$n(this.gdt, 'decimal') + ' GDT',
|
credittext: this.$n(this.gdt, 'decimal') + ' GDT',
|
||||||
@ -84,7 +98,7 @@ export default {
|
|||||||
case GdtEntryType.ELOPAGE_PUBLISHER: {
|
case GdtEntryType.ELOPAGE_PUBLISHER: {
|
||||||
return {
|
return {
|
||||||
icon: 'person-check',
|
icon: 'person-check',
|
||||||
iconclasses: 'gradido-global-color-accent m-mb-1 font2em',
|
iconclasses: 'gradido-global-color-accent',
|
||||||
description: this.$t('gdt.recruited-member'),
|
description: this.$t('gdt.recruited-member'),
|
||||||
descriptiontext: '5%',
|
descriptiontext: '5%',
|
||||||
credittext: this.$n(this.amount, 'decimal') + ' GDT',
|
credittext: this.$n(this.amount, 'decimal') + ' GDT',
|
||||||
@ -93,7 +107,7 @@ export default {
|
|||||||
case GdtEntryType.GLOBAL_MODIFICATOR: {
|
case GdtEntryType.GLOBAL_MODIFICATOR: {
|
||||||
return {
|
return {
|
||||||
icon: 'gift',
|
icon: 'gift',
|
||||||
iconclasses: 'gradido-global-color-accent m-mb-1 font2em',
|
iconclasses: 'gradido-global-color-accent',
|
||||||
description: this.$t('gdt.gdt-received'),
|
description: this.$t('gdt.gdt-received'),
|
||||||
descriptiontext: this.comment,
|
descriptiontext: this.comment,
|
||||||
credittext: this.$n(this.gdt, 'decimal') + ' GDT',
|
credittext: this.$n(this.gdt, 'decimal') + ' GDT',
|
||||||
|
|||||||
@ -1,6 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="transaction-slot-creation">
|
<div class="transaction-slot-creation">
|
||||||
|
|
||||||
<b-row @click="visible = !visible" class="">
|
<b-row @click="visible = !visible" class="">
|
||||||
<b-col cols="2">
|
<b-col cols="2">
|
||||||
<b-avatar icon="gift" variant="success" size="4em"></b-avatar>
|
<b-avatar icon="gift" variant="success" size="4em"></b-avatar>
|
||||||
@ -19,8 +18,6 @@
|
|||||||
<b-collapse class="pb-4 pt-5" v-model="visible">
|
<b-collapse class="pb-4 pt-5" v-model="visible">
|
||||||
<decay-information :typeId="typeId" :decay="decay" :amount="amount" />
|
<decay-information :typeId="typeId" :decay="decay" :amount="amount" />
|
||||||
</b-collapse>
|
</b-collapse>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
|||||||
@ -14,11 +14,11 @@
|
|||||||
<!-- navbar -->
|
<!-- navbar -->
|
||||||
<b-row>
|
<b-row>
|
||||||
<b-col>
|
<b-col>
|
||||||
<navbar-new class="main-navbar" :balance="balance"></navbar-new>
|
<navbar class="main-navbar" :balance="balance"></navbar>
|
||||||
</b-col>
|
</b-col>
|
||||||
</b-row>
|
</b-row>
|
||||||
<div ref="sideMenuRow" class="d-none d-lg-none d-md-none zindex1000">
|
<div ref="sideMenuRow" class="d-none d-lg-none d-md-none zindex1000">
|
||||||
<sidebar-new
|
<sidebar
|
||||||
class="main-sidebar"
|
class="main-sidebar"
|
||||||
@admin="admin"
|
@admin="admin"
|
||||||
@logout="logout"
|
@logout="logout"
|
||||||
@ -29,7 +29,7 @@
|
|||||||
<b-row fluid class="d-flex">
|
<b-row fluid class="d-flex">
|
||||||
<!-- Sidebar left -->
|
<!-- Sidebar left -->
|
||||||
<b-col cols="2" class="d-none d-lg-block d-md-block">
|
<b-col cols="2" class="d-none d-lg-block d-md-block">
|
||||||
<sidebar-new
|
<sidebar
|
||||||
class="main-sidebar"
|
class="main-sidebar"
|
||||||
@admin="admin"
|
@admin="admin"
|
||||||
@logout="logout"
|
@logout="logout"
|
||||||
@ -57,6 +57,7 @@
|
|||||||
/>
|
/>
|
||||||
</b-col>
|
</b-col>
|
||||||
<b-col cols="12">
|
<b-col cols="12">
|
||||||
|
<!-- router-view -->
|
||||||
<div class="main-content mt-3">
|
<div class="main-content mt-3">
|
||||||
<fade-transition :duration="200" origin="center top" mode="out-in">
|
<fade-transition :duration="200" origin="center top" mode="out-in">
|
||||||
<router-view
|
<router-view
|
||||||
@ -98,10 +99,8 @@
|
|||||||
import ContentHeader from '@/layouts/templates/ContentHeader.vue'
|
import ContentHeader from '@/layouts/templates/ContentHeader.vue'
|
||||||
import RightSide from '@/layouts/templates/RightSide.vue'
|
import RightSide from '@/layouts/templates/RightSide.vue'
|
||||||
import SkeletonOverview from '@/components/skeleton/Overview.vue'
|
import SkeletonOverview from '@/components/skeleton/Overview.vue'
|
||||||
// import Navbar from '@/components/Menu/Navbar.vue'
|
import Navbar from '@/components/Menu/Navbar.vue'
|
||||||
import NavbarNew from '@/components/Menu/NavbarNew.vue'
|
import Sidebar from '@/components/Menu/Sidebar.vue'
|
||||||
// import Sidebar from '@/components/Menu/Sidebar.vue'
|
|
||||||
import SidebarNew from '@/components/Menu/SidebarNew.vue'
|
|
||||||
import SessionLogoutTimeout from '@/components/SessionLogoutTimeout.vue'
|
import SessionLogoutTimeout from '@/components/SessionLogoutTimeout.vue'
|
||||||
import { transactionsQuery } from '@/graphql/queries'
|
import { transactionsQuery } from '@/graphql/queries'
|
||||||
import { logout } from '@/graphql/mutations'
|
import { logout } from '@/graphql/mutations'
|
||||||
@ -115,10 +114,8 @@ export default {
|
|||||||
SkeletonOverview,
|
SkeletonOverview,
|
||||||
ContentHeader,
|
ContentHeader,
|
||||||
RightSide,
|
RightSide,
|
||||||
// Navbar,
|
Navbar,
|
||||||
NavbarNew,
|
Sidebar,
|
||||||
// Sidebar,
|
|
||||||
SidebarNew,
|
|
||||||
SessionLogoutTimeout,
|
SessionLogoutTimeout,
|
||||||
ContentFooter,
|
ContentFooter,
|
||||||
FadeTransition,
|
FadeTransition,
|
||||||
|
|||||||
@ -1,91 +1,89 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div>
|
<b-container v-if="path === '/overview'">
|
||||||
<b-container v-if="path === '/overview'">
|
<b-row>
|
||||||
<b-row>
|
<b-col cols="5">
|
||||||
<b-col cols="5">
|
<div>
|
||||||
<div>
|
<gdd-amount :balance="balance" :showStatus="false" />
|
||||||
<gdd-amount :balance="balance" :showStatus="false" />
|
</div>
|
||||||
</div>
|
</b-col>
|
||||||
</b-col>
|
<b-col cols="7">
|
||||||
<b-col cols="7">
|
<div>
|
||||||
<div>
|
<community-member />
|
||||||
<community-member />
|
</div>
|
||||||
</div>
|
</b-col>
|
||||||
</b-col>
|
</b-row>
|
||||||
</b-row>
|
</b-container>
|
||||||
</b-container>
|
<b-container v-if="path === '/storys'"><h2>Deine Community im Überblick</h2></b-container>
|
||||||
<b-container v-if="path === '/storys'"><h2>Deine Community im Überblick</h2></b-container>
|
<b-container v-if="path === '/addresses'">Deine Favoriten im Überblick</b-container>
|
||||||
<b-container v-if="path === '/addresses'">Deine Favoriten im Überblick</b-container>
|
<b-container v-if="path === '/send'">
|
||||||
<b-container v-if="path === '/send'">
|
<b-row>
|
||||||
<b-row>
|
<b-col cols="6">
|
||||||
<b-col cols="6">
|
<div>
|
||||||
<div>
|
<gdd-amount :balance="balance" :badge="true" :showStatus="true" />
|
||||||
|
</div>
|
||||||
|
</b-col>
|
||||||
|
<b-col cols="6">
|
||||||
|
<div>
|
||||||
|
<gdt-amount />
|
||||||
|
</div>
|
||||||
|
</b-col>
|
||||||
|
</b-row>
|
||||||
|
</b-container>
|
||||||
|
<b-container v-if="path === '/transactions'">
|
||||||
|
<b-row>
|
||||||
|
<b-col cols="6">
|
||||||
|
<div>
|
||||||
|
<router-link to="transaction">
|
||||||
<gdd-amount :balance="balance" :badge="true" :showStatus="true" />
|
<gdd-amount :balance="balance" :badge="true" :showStatus="true" />
|
||||||
</div>
|
</router-link>
|
||||||
</b-col>
|
</div>
|
||||||
<b-col cols="6">
|
</b-col>
|
||||||
<div>
|
<b-col cols="6">
|
||||||
|
<div>
|
||||||
|
<router-link to="gdt">
|
||||||
<gdt-amount />
|
<gdt-amount />
|
||||||
</div>
|
</router-link>
|
||||||
</b-col>
|
</div>
|
||||||
</b-row>
|
</b-col>
|
||||||
</b-container>
|
</b-row>
|
||||||
<b-container v-if="path === '/transactions'">
|
</b-container>
|
||||||
<b-row>
|
<b-container v-if="path === '/gdt'">
|
||||||
<b-col cols="6">
|
<b-row>
|
||||||
<div>
|
<b-col cols="6">
|
||||||
<router-link to="transaction">
|
<div>
|
||||||
<gdd-amount :balance="balance" :badge="true" :showStatus="true" />
|
<router-link to="transactions">
|
||||||
</router-link>
|
<gdd-amount :balance="balance" :badge="true" :showStatus="false" />
|
||||||
</div>
|
</router-link>
|
||||||
</b-col>
|
</div>
|
||||||
<b-col cols="6">
|
</b-col>
|
||||||
<div>
|
<b-col cols="6">
|
||||||
<router-link to="gdt">
|
<div>
|
||||||
<gdt-amount />
|
<router-link to="gdt">
|
||||||
</router-link>
|
<gdt-amount :badge="true" :showStatus="true" />
|
||||||
</div>
|
</router-link>
|
||||||
</b-col>
|
</div>
|
||||||
</b-row>
|
</b-col>
|
||||||
</b-container>
|
</b-row>
|
||||||
<b-container v-if="path === '/gdt'">
|
</b-container>
|
||||||
<b-row>
|
<b-container v-if="path === '/profile'">
|
||||||
<b-col cols="6">
|
<b-row>
|
||||||
<div>
|
<b-col>
|
||||||
<router-link to="transactions">
|
<div class="p-4 bg-white appBoxShadow gradido-border-radius">
|
||||||
<gdd-amount :balance="balance" />
|
<b-row>
|
||||||
</router-link>
|
<b-col cols="8" class="h3">Zeige deiner Community wer du bist.</b-col>
|
||||||
</div>
|
<b-col cols="4" class="text-small text-muted">vor 4 Stunden geändert</b-col>
|
||||||
</b-col>
|
</b-row>
|
||||||
<b-col cols="6">
|
<b-row>
|
||||||
<div>
|
<b-col cols="2" class=""><b-avatar size="72px" rounded="lg"></b-avatar></b-col>
|
||||||
<router-link to="gdt">
|
<b-col cols="10" class="">Text</b-col>
|
||||||
<gdt-amount :badge="true" />
|
</b-row>
|
||||||
</router-link>
|
</div>
|
||||||
</div>
|
</b-col>
|
||||||
</b-col>
|
</b-row>
|
||||||
</b-row>
|
</b-container>
|
||||||
</b-container>
|
<b-container v-if="path === '/community'"><nav-community /></b-container>
|
||||||
<b-container v-if="path === '/profile'">
|
<b-container v-if="path === '/settings'">settings content header</b-container>
|
||||||
<b-row>
|
|
||||||
<b-col>
|
|
||||||
<div class="p-4 bg-white appBoxShadow gradido-border-radius">
|
|
||||||
<b-row>
|
|
||||||
<b-col cols="8" class="h3">Zeige deiner Community wer du bist.</b-col>
|
|
||||||
<b-col cols="4" class="text-small text-muted">vor 4 Stunden geändert</b-col>
|
|
||||||
</b-row>
|
|
||||||
<b-row>
|
|
||||||
<b-col cols="2" class=""><b-avatar size="72px" rounded="lg"></b-avatar></b-col>
|
|
||||||
<b-col cols="10" class="">Text</b-col>
|
|
||||||
</b-row>
|
|
||||||
</div>
|
|
||||||
</b-col>
|
|
||||||
</b-row>
|
|
||||||
</b-container>
|
|
||||||
<b-container v-if="path === '/community'"><nav-community /></b-container>
|
|
||||||
<b-container v-if="path === '/settings'">settings content header</b-container>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
@ -102,7 +102,8 @@
|
|||||||
</b-row>
|
</b-row>
|
||||||
</b-container>
|
</b-container>
|
||||||
<b-container v-if="path === '/community'">
|
<b-container v-if="path === '/community'">
|
||||||
<last-contributions />
|
<contribution-info />
|
||||||
|
<last-contributions class="mt-5" />
|
||||||
</b-container>
|
</b-container>
|
||||||
<b-container v-if="path === '/settings'">settings ride side</b-container>
|
<b-container v-if="path === '/settings'">settings ride side</b-container>
|
||||||
</div>
|
</div>
|
||||||
@ -111,6 +112,7 @@
|
|||||||
import LastTransactions from '@/components/Template/RightSide/LastTransactions.vue'
|
import LastTransactions from '@/components/Template/RightSide/LastTransactions.vue'
|
||||||
import Favourites from '@/components/Template/RightSide/Favourites.vue'
|
import Favourites from '@/components/Template/RightSide/Favourites.vue'
|
||||||
import TopStorysByMonth from '@/components/Template/RightSide/TopStorysByMonth.vue'
|
import TopStorysByMonth from '@/components/Template/RightSide/TopStorysByMonth.vue'
|
||||||
|
import ContributionInfo from '@/components/Template/RightSide/ContributionInfo.vue'
|
||||||
import LastContributions from '@/components/Template/RightSide/LastContributions.vue'
|
import LastContributions from '@/components/Template/RightSide/LastContributions.vue'
|
||||||
import YourOverview from '@/components/Template/RightSide/YourOverview.vue'
|
import YourOverview from '@/components/Template/RightSide/YourOverview.vue'
|
||||||
|
|
||||||
@ -121,6 +123,7 @@ export default {
|
|||||||
Favourites,
|
Favourites,
|
||||||
TopStorysByMonth,
|
TopStorysByMonth,
|
||||||
LastContributions,
|
LastContributions,
|
||||||
|
ContributionInfo,
|
||||||
YourOverview,
|
YourOverview,
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
|
|||||||
@ -3,12 +3,20 @@
|
|||||||
<div>
|
<div>
|
||||||
<b-tabs no-nav-style v-model="tabIndex" content-class="mt-3" align="center">
|
<b-tabs no-nav-style v-model="tabIndex" content-class="mt-3" align="center">
|
||||||
<b-tab>
|
<b-tab>
|
||||||
<open-creations-amount />
|
<open-creations-amount
|
||||||
|
:minimalDate="minimalDate"
|
||||||
|
:maxGddThisMonth="maxGddThisMonth"
|
||||||
|
:maxGddLastMonth="maxGddLastMonth"
|
||||||
|
/>
|
||||||
|
<div class="mb-3"></div>
|
||||||
<contribution-form
|
<contribution-form
|
||||||
@set-contribution="setContribution"
|
@set-contribution="setContribution"
|
||||||
@update-contribution="updateContribution"
|
@update-contribution="updateContribution"
|
||||||
v-model="form"
|
v-model="form"
|
||||||
:updateAmount="updateAmount"
|
:isThisMonth="isThisMonth"
|
||||||
|
:minimalDate="minimalDate"
|
||||||
|
:maxGddLastMonth="maxGddLastMonth"
|
||||||
|
:maxGddThisMonth="maxGddThisMonth"
|
||||||
/>
|
/>
|
||||||
</b-tab>
|
</b-tab>
|
||||||
<b-tab>
|
<b-tab>
|
||||||
@ -75,6 +83,7 @@ export default {
|
|||||||
amount: '',
|
amount: '',
|
||||||
},
|
},
|
||||||
updateAmount: '',
|
updateAmount: '',
|
||||||
|
maximalDate: new Date(),
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
@ -89,6 +98,31 @@ export default {
|
|||||||
this.hashLink = to.hash
|
this.hashLink = to.hash
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
computed: {
|
||||||
|
minimalDate() {
|
||||||
|
const date = new Date(this.maximalDate)
|
||||||
|
return new Date(date.setMonth(date.getMonth() - 1, 1))
|
||||||
|
},
|
||||||
|
isThisMonth() {
|
||||||
|
const formDate = new Date(this.form.date)
|
||||||
|
return (
|
||||||
|
formDate.getFullYear() === this.maximalDate.getFullYear() &&
|
||||||
|
formDate.getMonth() === this.maximalDate.getMonth()
|
||||||
|
)
|
||||||
|
},
|
||||||
|
maxGddLastMonth() {
|
||||||
|
// when existing contribution is edited, the amount is added back on top of the amount
|
||||||
|
return this.form.id && !this.isThisMonth
|
||||||
|
? parseInt(this.$store.state.creation[1]) + parseInt(this.updateAmount)
|
||||||
|
: parseInt(this.$store.state.creation[1])
|
||||||
|
},
|
||||||
|
maxGddThisMonth() {
|
||||||
|
// when existing contribution is edited, the amount is added back on top of the amount
|
||||||
|
return this.form.id && this.isThisMonth
|
||||||
|
? parseInt(this.$store.state.creation[2]) + parseInt(this.updateAmount)
|
||||||
|
: parseInt(this.$store.state.creation[2])
|
||||||
|
},
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
setContribution(data) {
|
setContribution(data) {
|
||||||
this.$apollo
|
this.$apollo
|
||||||
|
|||||||
@ -1,8 +1,8 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div class="container-fluid">
|
<div>
|
||||||
<community-news class="mb-5 shadow" />
|
<community-news class="mb-5 shadow" />
|
||||||
<gdd-transaction-list
|
<!-- <gdd-transaction-list
|
||||||
:transactions="transactions"
|
:transactions="transactions"
|
||||||
:pageSize="5"
|
:pageSize="5"
|
||||||
:timestamp="timestamp"
|
:timestamp="timestamp"
|
||||||
@ -10,38 +10,38 @@
|
|||||||
:transactionLinkCount="transactionLinkCount"
|
:transactionLinkCount="transactionLinkCount"
|
||||||
:pending="pending"
|
:pending="pending"
|
||||||
v-on="$listeners"
|
v-on="$listeners"
|
||||||
/>
|
/> -->
|
||||||
<gdd-transaction-list-footer :count="transactionCount" />
|
<!-- <gdd-transaction-list-footer :count="transactionCount" /> -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import CommunityNews from '@/components/Overview/CommunityNews.vue'
|
import CommunityNews from '@/components/Overview/CommunityNews.vue'
|
||||||
import GddTransactionList from '@/components/GddTransactionList.vue'
|
// import GddTransactionList from '@/components/GddTransactionList.vue'
|
||||||
import GddTransactionListFooter from '@/components/GddTransactionListFooter.vue'
|
// import GddTransactionListFooter from '@/components/GddTransactionListFooter.vue'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'Overview',
|
name: 'Overview',
|
||||||
components: {
|
components: {
|
||||||
CommunityNews,
|
CommunityNews,
|
||||||
GddTransactionList,
|
// GddTransactionList,
|
||||||
GddTransactionListFooter,
|
// GddTransactionListFooter,
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
timestamp: Date.now(),
|
// timestamp: Date.now(),
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
transactions: {
|
// transactions: {
|
||||||
default: () => [],
|
// default: () => [],
|
||||||
},
|
// },
|
||||||
transactionCount: { type: Number, default: 0 },
|
// transactionCount: { type: Number, default: 0 },
|
||||||
transactionLinkCount: { type: Number, default: 0 },
|
// transactionLinkCount: { type: Number, default: 0 },
|
||||||
pending: {
|
// pending: {
|
||||||
type: Boolean,
|
// type: Boolean,
|
||||||
default: true,
|
// default: true,
|
||||||
},
|
// },
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// updateTransactions(pagination) {
|
// updateTransactions(pagination) {
|
||||||
@ -51,9 +51,9 @@ export default {
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style>
|
<style>
|
||||||
.g-border {
|
/* .g-border {
|
||||||
border: #ffffff 2px;
|
border: #ffffff 2px;
|
||||||
border-style: inset;
|
border-style: inset;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
}
|
} */
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -34,7 +34,11 @@
|
|||||||
</b-tabs> -->
|
</b-tabs> -->
|
||||||
|
|
||||||
<div v-if="gdt">
|
<div v-if="gdt">
|
||||||
<div>{{ titleGdt }}</div>
|
<div
|
||||||
|
class="gradido-global-color-accent appBoxShadow gradido-border-radius p-3 mb-3 text-right blurtext"
|
||||||
|
>
|
||||||
|
{{ titleGdt }}
|
||||||
|
</div>
|
||||||
|
|
||||||
<gdt-transaction-list
|
<gdt-transaction-list
|
||||||
v-model="currentPage"
|
v-model="currentPage"
|
||||||
@ -140,6 +144,17 @@ export default {
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style>
|
<style>
|
||||||
|
.blurtext {
|
||||||
|
color: transparent;
|
||||||
|
text-shadow: #047006 0 0 15px;
|
||||||
|
transition: 0.4s;
|
||||||
|
}
|
||||||
|
.blurtext:hover {
|
||||||
|
transition: 0.4s;
|
||||||
|
color: #047006;
|
||||||
|
text-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
.nav-tabs > li > a {
|
.nav-tabs > li > a {
|
||||||
padding-top: 14px;
|
padding-top: 14px;
|
||||||
margin-bottom: 14px;
|
margin-bottom: 14px;
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user