mirror of
https://github.com/IT4Change/gradido.git
synced 2026-02-06 09:56:05 +00:00
fix(frontend): WiP migration
This commit is contained in:
Mateusz Michałowski
parent
71bf1c7e0d
commit
263aedae23
@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<div class="community-switch">
|
||||
<div v-if="!validCommunityIdentifier">
|
||||
<b-dropdown no-flip :text="value.name">
|
||||
<b-dropdown-item
|
||||
<BDropdown no-flip :text="value.name">
|
||||
<BDropdownItem
|
||||
v-for="community in communities"
|
||||
@click.prevent="updateCommunity(community)"
|
||||
:key="community.id"
|
||||
@ -10,13 +10,13 @@
|
||||
:active="value.uuid === community.uuid"
|
||||
>
|
||||
{{ community.name }}
|
||||
</b-dropdown-item>
|
||||
</b-dropdown>
|
||||
</BDropdownItem>
|
||||
</BDropdown>
|
||||
</div>
|
||||
<div v-else class="mb-4 mt-2">
|
||||
<b-row>
|
||||
<b-col class="font-weight-bold" :title="value.description">{{ value.name }}</b-col>
|
||||
</b-row>
|
||||
<BRow>
|
||||
<BCol class="font-weight-bold" :title="value.description">{{ value.name }}</BCol>
|
||||
</BRow>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -1,12 +1,12 @@
|
||||
<template>
|
||||
<div class="contribution-form">
|
||||
<b-form
|
||||
<BForm
|
||||
ref="form"
|
||||
@submit.prevent="submit"
|
||||
class="form-style p-3 bg-white appBoxShadow gradido-border-radius"
|
||||
>
|
||||
<label>{{ $t('contribution.selectDate') }}</label>
|
||||
<b-form-datepicker
|
||||
<BFormInput
|
||||
id="contribution-date"
|
||||
v-model="form.date"
|
||||
:locale="$i18n.locale"
|
||||
@ -17,10 +17,11 @@
|
||||
:label-no-date-selected="$t('contribution.noDateSelected')"
|
||||
required
|
||||
:no-flip="true"
|
||||
type="date"
|
||||
>
|
||||
<template #nav-prev-year><span></span></template>
|
||||
<template #nav-next-year><span></span></template>
|
||||
</b-form-datepicker>
|
||||
</BFormInput>
|
||||
|
||||
<div v-if="showMessage" class="p-3" data-test="contribtion-message">
|
||||
{{ noOpenCreation }}
|
||||
@ -58,9 +59,9 @@
|
||||
typ="ContributionForm"
|
||||
></input-amount>
|
||||
|
||||
<b-row class="mt-5">
|
||||
<b-col cols="12" lg="6">
|
||||
<b-button
|
||||
<BRow class="mt-5">
|
||||
<BCol cols="12" lg="6">
|
||||
<BButton
|
||||
block
|
||||
type="reset"
|
||||
variant="secondary"
|
||||
@ -68,10 +69,10 @@
|
||||
data-test="button-cancel"
|
||||
>
|
||||
{{ $t('form.cancel') }}
|
||||
</b-button>
|
||||
</b-col>
|
||||
<b-col cols="12" lg="6" class="text-right mt-4 mt-lg-0">
|
||||
<b-button
|
||||
</BButton>
|
||||
</BCol>
|
||||
<BCol cols="12" lg="6" class="text-right mt-4 mt-lg-0">
|
||||
<BButton
|
||||
block
|
||||
type="submit"
|
||||
variant="gradido"
|
||||
@ -79,11 +80,11 @@
|
||||
data-test="button-submit"
|
||||
>
|
||||
{{ form.id ? $t('form.change') : $t('contribution.submit') }}
|
||||
</b-button>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</BButton>
|
||||
</BCol>
|
||||
</BRow>
|
||||
</div>
|
||||
</b-form>
|
||||
</BForm>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
@ -2,47 +2,47 @@
|
||||
<div class="transaction-confirm-link">
|
||||
<div class="bg-white appBoxShadow gradido-border-radius p-3">
|
||||
<div class="h3 mb-4">{{ $t('gdd_per_link.header') }}</div>
|
||||
<b-row class="mt-5">
|
||||
<b-col offset="2">
|
||||
<BRow class="mt-5">
|
||||
<BCol offset="2">
|
||||
<div class="mt-3 h5">{{ $t('form.memo') }}</div>
|
||||
<div>{{ memo }}</div>
|
||||
</b-col>
|
||||
<b-col cols="3">
|
||||
</BCol>
|
||||
<BCol cols="3">
|
||||
<div class="small">{{ $t('send_gdd') }}</div>
|
||||
<div>{{ amount | GDD }}</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</BCol>
|
||||
</BRow>
|
||||
|
||||
<b-row class="mt-5 pr-3 text-color-gdd-yellow h3">
|
||||
<b-col cols="2" class="text-right">
|
||||
<BRow class="mt-5 pr-3 text-color-gdd-yellow h3">
|
||||
<BCol cols="2" class="text-right">
|
||||
<b-icon class="text-color-gdd-yellow" icon="droplet-half"></b-icon>
|
||||
</b-col>
|
||||
<b-col>{{ $t('advanced-calculation') }}</b-col>
|
||||
</b-row>
|
||||
<b-row class="pr-3" offset="2">
|
||||
<b-col offset="2">{{ $t('form.current_balance') }}</b-col>
|
||||
<b-col>{{ balance | GDD }}</b-col>
|
||||
</b-row>
|
||||
<b-row class="pr-3">
|
||||
<b-col offset="2">
|
||||
</BCol>
|
||||
<BCol>{{ $t('advanced-calculation') }}</BCol>
|
||||
</BRow>
|
||||
<BRow class="pr-3" offset="2">
|
||||
<BCol offset="2">{{ $t('form.current_balance') }}</BCol>
|
||||
<BCol>{{ balance | GDD }}</BCol>
|
||||
</BRow>
|
||||
<BRow class="pr-3">
|
||||
<BCol offset="2">
|
||||
<strong>{{ $t('form.your_amount') }}</strong>
|
||||
</b-col>
|
||||
<b-col class="borderbottom">
|
||||
</BCol>
|
||||
<BCol class="borderbottom">
|
||||
<strong>{{ (amount * -1) | GDD }}</strong>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="pr-3">
|
||||
<b-col offset="2">{{ $t('form.new_balance') }}</b-col>
|
||||
<b-col>{{ (balance - amount) | GDD }}</b-col>
|
||||
</b-row>
|
||||
<b-row class="mt-5">
|
||||
<b-col cols="12" md="6" lg="6">
|
||||
<b-button block @click="$emit('on-back')" class="mb-3 mb-md-0 mb-lg-0">
|
||||
</BCol>
|
||||
</BRow>
|
||||
<BRow class="pr-3">
|
||||
<BCol offset="2">{{ $t('form.new_balance') }}</BCol>
|
||||
<BCol>{{ (balance - amount) | GDD }}</BCol>
|
||||
</BRow>
|
||||
<BRow class="mt-5">
|
||||
<BCol cols="12" md="6" lg="6">
|
||||
<BButton block @click="$emit('on-back')" class="mb-3 mb-md-0 mb-lg-0">
|
||||
{{ $t('back') }}
|
||||
</b-button>
|
||||
</b-col>
|
||||
<b-col cols="12" md="6" lg="6" class="text-lg-right">
|
||||
<b-button
|
||||
</BButton>
|
||||
</BCol>
|
||||
<BCol cols="12" md="6" lg="6" class="text-lg-right">
|
||||
<BButton
|
||||
block
|
||||
class="send-button"
|
||||
variant="gradido"
|
||||
@ -50,9 +50,9 @@
|
||||
@click="$emit('send-transaction')"
|
||||
>
|
||||
{{ $t('form.generate_now') }}
|
||||
</b-button>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</BButton>
|
||||
</BCol>
|
||||
</BRow>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -1,18 +1,18 @@
|
||||
<template>
|
||||
<div class="transaction-form">
|
||||
<b-row>
|
||||
<b-col cols="12">
|
||||
<b-card class="appBoxShadow gradido-border-radius" body-class="p-4">
|
||||
<BRow>
|
||||
<BCol cols="12">
|
||||
<BCard class="appBoxShadow gradido-border-radius" body-class="p-4">
|
||||
<validation-observer v-slot="{ handleSubmit }" ref="formValidator">
|
||||
<b-form role="form" @submit.prevent="handleSubmit(onSubmit)" @reset="onReset">
|
||||
<b-form-radio-group v-model="radioSelected">
|
||||
<b-row class="mb-4">
|
||||
<b-col cols="12" lg="6">
|
||||
<b-row class="bg-248 gradido-border-radius pt-lg-2 mr-lg-2">
|
||||
<b-col cols="10" @click="radioSelected = sendTypes.send" class="pointer">
|
||||
<BForm role="form" @submit.prevent="handleSubmit(onSubmit)" @reset="onReset">
|
||||
<BFormRadioGroup v-model="radioSelected">
|
||||
<BRow class="mb-4">
|
||||
<BCol cols="12" lg="6">
|
||||
<BRow class="bg-248 gradido-border-radius pt-lg-2 mr-lg-2">
|
||||
<BCol cols="10" @click="radioSelected = sendTypes.send" class="pointer">
|
||||
{{ $t('send_gdd') }}
|
||||
</b-col>
|
||||
<b-col cols="2">
|
||||
</BCol>
|
||||
<BCol cols="2">
|
||||
<b-form-radio
|
||||
name="shipping"
|
||||
size="lg"
|
||||
@ -20,49 +20,49 @@
|
||||
stacked
|
||||
class="custom-radio-button pointer"
|
||||
></b-form-radio>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<b-row class="bg-248 gradido-border-radius pt-lg-2 ml-lg-2 mt-2 mt-lg-0">
|
||||
<b-col cols="10" @click="radioSelected = sendTypes.link" class="pointer">
|
||||
</BCol>
|
||||
</BRow>
|
||||
</BCol>
|
||||
<BCol>
|
||||
<BRow class="bg-248 gradido-border-radius pt-lg-2 ml-lg-2 mt-2 mt-lg-0">
|
||||
<BCol cols="10" @click="radioSelected = sendTypes.link" class="pointer">
|
||||
{{ $t('send_per_link') }}
|
||||
</b-col>
|
||||
<b-col cols="2" class="pointer">
|
||||
<b-form-radio
|
||||
</BCol>
|
||||
<BCol cols="2" class="pointer">
|
||||
<BFormRadio
|
||||
name="shipping"
|
||||
:value="sendTypes.link"
|
||||
size="lg"
|
||||
class="custom-radio-button"
|
||||
></b-form-radio>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-form-radio-group>
|
||||
/>
|
||||
</BCol>
|
||||
</BRow>
|
||||
</BCol>
|
||||
</BRow>
|
||||
</BFormRadioGroup>
|
||||
<div class="mt-4 mb-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>
|
||||
<b-row>
|
||||
<b-col class="mb-4" cols="12" v-if="radioSelected === sendTypes.send">
|
||||
<b-row>
|
||||
<b-col>{{ $t('form.recipientCommunity') }}</b-col>
|
||||
</b-row>
|
||||
<b-row>
|
||||
<b-col class="font-weight-bold">
|
||||
<BRow>
|
||||
<BCol>
|
||||
<BRow>
|
||||
<BCol class="mb-4" cols="12" v-if="radioSelected === sendTypes.send">
|
||||
<BRow>
|
||||
<BCol>{{ $t('form.recipientCommunity') }}</BCol>
|
||||
</BRow>
|
||||
<BRow>
|
||||
<BCol class="font-weight-bold">
|
||||
<community-switch
|
||||
v-model="form.targetCommunity"
|
||||
:disabled="isBalanceDisabled"
|
||||
/>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-col>
|
||||
<b-col cols="12" v-if="radioSelected === sendTypes.send">
|
||||
</BCol>
|
||||
</BRow>
|
||||
</BCol>
|
||||
<BCol cols="12" v-if="radioSelected === sendTypes.send">
|
||||
<div v-if="!userIdentifier">
|
||||
<input-identifier
|
||||
:name="$t('form.recipient')"
|
||||
@ -74,15 +74,15 @@
|
||||
/>
|
||||
</div>
|
||||
<div v-else class="mb-4">
|
||||
<b-row>
|
||||
<b-col>{{ $t('form.recipient') }}</b-col>
|
||||
</b-row>
|
||||
<b-row>
|
||||
<b-col class="font-weight-bold">{{ userName }}</b-col>
|
||||
</b-row>
|
||||
<BRow>
|
||||
<BCol>{{ $t('form.recipient') }}</BCol>
|
||||
</BRow>
|
||||
<BRow>
|
||||
<BCol class="font-weight-bold">{{ userName }}</BCol>
|
||||
</BRow>
|
||||
</div>
|
||||
</b-col>
|
||||
<b-col cols="12" lg="6">
|
||||
</BCol>
|
||||
<BCol cols="12" lg="6">
|
||||
<input-amount
|
||||
v-model="form.amount"
|
||||
:name="$t('form.amount')"
|
||||
@ -92,13 +92,13 @@
|
||||
typ="TransactionForm"
|
||||
:disabled="isBalanceDisabled"
|
||||
></input-amount>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</BCol>
|
||||
</BRow>
|
||||
</BCol>
|
||||
</BRow>
|
||||
|
||||
<b-row>
|
||||
<b-col>
|
||||
<BRow>
|
||||
<BCol>
|
||||
<input-textarea
|
||||
v-model="form.memo"
|
||||
:name="$t('form.message')"
|
||||
@ -107,13 +107,13 @@
|
||||
:rules="{ required: true, min: 5, max: 255 }"
|
||||
:disabled="isBalanceDisabled"
|
||||
/>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</BCol>
|
||||
</BRow>
|
||||
<div v-if="!!isBalanceDisabled" class="text-danger mt-5">
|
||||
{{ $t('form.no_gdd_available') }}
|
||||
</div>
|
||||
<b-row v-else class="test-buttons mt-3">
|
||||
<b-col cols="12" md="6" lg="6">
|
||||
<BRow v-else class="test-buttons mt-3">
|
||||
<BCol cols="12" md="6" lg="6">
|
||||
<b-button
|
||||
block
|
||||
type="reset"
|
||||
@ -123,18 +123,18 @@
|
||||
>
|
||||
{{ $t('form.reset') }}
|
||||
</b-button>
|
||||
</b-col>
|
||||
<b-col cols="12" md="6" lg="6" class="text-lg-right">
|
||||
</BCol>
|
||||
<BCol cols="12" md="6" lg="6" class="text-lg-right">
|
||||
<b-button block type="submit" variant="gradido">
|
||||
{{ $t('form.check_now') }}
|
||||
</b-button>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-form>
|
||||
</BCol>
|
||||
</BRow>
|
||||
</BForm>
|
||||
</validation-observer>
|
||||
</b-card>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</BCard>
|
||||
</BCol>
|
||||
</BRow>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
@ -1,61 +1,141 @@
|
||||
<template>
|
||||
<!-- <div class="input-hour">-->
|
||||
<!-- <validation-provider-->
|
||||
<!-- tag="div"-->
|
||||
<!-- :rules="rules"-->
|
||||
<!-- :name="name"-->
|
||||
<!-- v-slot="{ valid, validated, ariaInput }"-->
|
||||
<!-- >-->
|
||||
<!-- <b-form-group :label="label" :label-for="labelFor">-->
|
||||
<!-- <b-form-input-->
|
||||
<!-- v-model="currentValue"-->
|
||||
<!-- v-bind="ariaInput"-->
|
||||
<!-- :id="labelFor"-->
|
||||
<!-- :name="name"-->
|
||||
<!-- :placeholder="placeholder"-->
|
||||
<!-- type="number"-->
|
||||
<!-- :state="validated ? valid : false"-->
|
||||
<!-- step="0.25"-->
|
||||
<!-- min="0"-->
|
||||
<!-- :max="validMaxTime"-->
|
||||
<!-- class="bg-248"-->
|
||||
<!-- ></b-form-input>-->
|
||||
<!-- </b-form-group>-->
|
||||
<!-- </validation-provider>-->
|
||||
<!-- </div>-->
|
||||
<div class="input-hour">
|
||||
<validation-provider
|
||||
tag="div"
|
||||
:rules="rules"
|
||||
:name="name"
|
||||
v-slot="{ valid, validated, ariaInput }"
|
||||
>
|
||||
<b-form-group :label="label" :label-for="labelFor">
|
||||
<b-form-input
|
||||
v-model="currentValue"
|
||||
v-bind="ariaInput"
|
||||
:id="labelFor"
|
||||
:name="name"
|
||||
:placeholder="placeholder"
|
||||
type="number"
|
||||
:state="validated ? valid : false"
|
||||
step="0.25"
|
||||
min="0"
|
||||
:max="validMaxTime"
|
||||
class="bg-248"
|
||||
></b-form-input>
|
||||
</b-form-group>
|
||||
</validation-provider>
|
||||
<BFormGroup :label="label" :label-for="labelFor">
|
||||
<BFormInput
|
||||
:model-value="currentValue"
|
||||
@update:modelValue="currentValue"
|
||||
v-bind="ariaInput"
|
||||
:id="labelFor"
|
||||
:name="name"
|
||||
:placeholder="placeholder"
|
||||
type="number"
|
||||
:state="meta.valid"
|
||||
step="0.25"
|
||||
min="0"
|
||||
:max="validMaxTime"
|
||||
class="bg-248"
|
||||
/>
|
||||
</BFormGroup>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'InputHour',
|
||||
props: {
|
||||
rules: {
|
||||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
name: { type: String, required: true },
|
||||
label: { type: String, required: true },
|
||||
placeholder: { type: String, required: true },
|
||||
value: { type: Number, required: true, default: 0 },
|
||||
validMaxTime: { type: Number, required: true },
|
||||
<!--<script>-->
|
||||
<!--export default {-->
|
||||
<!-- name: 'InputHour',-->
|
||||
<!-- props: {-->
|
||||
<!-- rules: {-->
|
||||
<!-- type: Object,-->
|
||||
<!-- default: () => {},-->
|
||||
<!-- },-->
|
||||
<!-- name: { type: String, required: true },-->
|
||||
<!-- label: { type: String, required: true },-->
|
||||
<!-- placeholder: { type: String, required: true },-->
|
||||
<!-- value: { type: Number, required: true, default: 0 },-->
|
||||
<!-- validMaxTime: { type: Number, required: true },-->
|
||||
<!-- },-->
|
||||
<!-- data() {-->
|
||||
<!-- return {-->
|
||||
<!-- currentValue: 0,-->
|
||||
<!-- }-->
|
||||
<!-- },-->
|
||||
<!-- computed: {-->
|
||||
<!-- labelFor() {-->
|
||||
<!-- return this.name + '-input-field'-->
|
||||
<!-- },-->
|
||||
<!-- },-->
|
||||
<!-- watch: {-->
|
||||
<!-- currentValue() {-->
|
||||
<!-- this.$emit('input', Number(this.currentValue))-->
|
||||
<!-- },-->
|
||||
<!-- value() {-->
|
||||
<!-- if (this.value !== this.currentValue) this.currentValue = this.value-->
|
||||
<!-- this.$emit('updateAmount', this.currentValue)-->
|
||||
<!-- },-->
|
||||
<!-- },-->
|
||||
<!--}-->
|
||||
<!--</script>-->
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, watch } from 'vue'
|
||||
import { useField } from 'vee-validate'
|
||||
|
||||
// Props
|
||||
const props = defineProps({
|
||||
rules: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
currentValue: 0,
|
||||
name: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
label: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
placeholder: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
modelValue: {
|
||||
type: Number,
|
||||
required: true,
|
||||
default: 0,
|
||||
},
|
||||
validMaxTime: {
|
||||
type: Number,
|
||||
required: true,
|
||||
},
|
||||
})
|
||||
|
||||
// Emits
|
||||
const emit = defineEmits(['update:modelValue', 'updateAmount'])
|
||||
|
||||
// Use vee-validate's useField
|
||||
const { value: currentValue, meta } = useField(props.name, props.rules, {
|
||||
initialValue: props.modelValue,
|
||||
})
|
||||
|
||||
// Computed
|
||||
const labelFor = computed(() => `${props.name}-input-field`)
|
||||
|
||||
// Watch for external value changes
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(newValue) => {
|
||||
if (newValue !== currentValue.value) {
|
||||
currentValue.value = newValue
|
||||
emit('updateAmount', newValue)
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
labelFor() {
|
||||
return this.name + '-input-field'
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
currentValue() {
|
||||
this.$emit('input', Number(this.currentValue))
|
||||
},
|
||||
value() {
|
||||
if (this.value !== this.currentValue) this.currentValue = this.value
|
||||
this.$emit('updateAmount', this.currentValue)
|
||||
},
|
||||
},
|
||||
}
|
||||
)
|
||||
|
||||
// Watch for internal value changes
|
||||
watch(currentValue, (newValue) => {
|
||||
emit('update:modelValue', Number(newValue))
|
||||
emit('updateAmount', Number(newValue))
|
||||
})
|
||||
</script>
|
||||
|
||||
@ -1,62 +1,143 @@
|
||||
<template>
|
||||
<validation-provider
|
||||
tag="div"
|
||||
:rules="rules"
|
||||
:name="name"
|
||||
v-slot="{ errors, valid, validated, ariaInput, ariaMsg }"
|
||||
>
|
||||
<b-form-group :label="label" :label-for="labelFor" data-test="input-textarea">
|
||||
<b-form-textarea
|
||||
v-model="currentValue"
|
||||
<!-- <validation-provider-->
|
||||
<!-- tag="div"-->
|
||||
<!-- :rules="rules"-->
|
||||
<!-- :name="name"-->
|
||||
<!-- v-slot="{ errors, valid, validated, ariaInput, ariaMsg }"-->
|
||||
<!-- >-->
|
||||
<!-- <b-form-group :label="label" :label-for="labelFor" data-test="input-textarea">-->
|
||||
<!-- <b-form-textarea-->
|
||||
<!-- v-model="currentValue"-->
|
||||
<!-- v-bind="ariaInput"-->
|
||||
<!-- :id="labelFor"-->
|
||||
<!-- class="bg-248"-->
|
||||
<!-- :name="name"-->
|
||||
<!-- :placeholder="placeholder"-->
|
||||
<!-- :state="validated ? valid : false"-->
|
||||
<!-- trim-->
|
||||
<!-- rows="4"-->
|
||||
<!-- max-rows="4"-->
|
||||
<!-- :disabled="disabled"-->
|
||||
<!-- no-resize-->
|
||||
<!-- ></b-form-textarea>-->
|
||||
<!-- <b-form-invalid-feedback v-bind="ariaMsg">-->
|
||||
<!-- {{ errors[0] }}-->
|
||||
<!-- </b-form-invalid-feedback>-->
|
||||
<!-- </b-form-group>-->
|
||||
<!-- </validation-provider>-->
|
||||
<div>
|
||||
<BFormGroup :label="label" :label-for="labelFor" data-test="input-textarea">
|
||||
<BFormTextarea
|
||||
:model-value="currentValue"
|
||||
@update:modelValue="currentValue = $event"
|
||||
v-bind="ariaInput"
|
||||
:id="labelFor"
|
||||
class="bg-248"
|
||||
:name="name"
|
||||
:placeholder="placeholder"
|
||||
:state="validated ? valid : false"
|
||||
:state="meta.valid"
|
||||
trim
|
||||
rows="4"
|
||||
max-rows="4"
|
||||
:disabled="disabled"
|
||||
no-resize
|
||||
></b-form-textarea>
|
||||
<b-form-invalid-feedback v-bind="ariaMsg">
|
||||
{{ errors[0] }}
|
||||
</b-form-invalid-feedback>
|
||||
</b-form-group>
|
||||
</validation-provider>
|
||||
></BFormTextarea>
|
||||
<BFormInvalidFeedback v-bind="ariaMsg">
|
||||
{{ errorMessage }}
|
||||
</BFormInvalidFeedback>
|
||||
</BFormGroup>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'InputTextarea',
|
||||
props: {
|
||||
rules: {
|
||||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
name: { type: String, required: true },
|
||||
label: { type: String, required: true },
|
||||
placeholder: { type: String, required: true },
|
||||
value: { type: String, required: true },
|
||||
disabled: { required: false, type: Boolean, default: false },
|
||||
<!--<script>-->
|
||||
<!--export default {-->
|
||||
<!-- name: 'InputTextarea',-->
|
||||
<!-- props: {-->
|
||||
<!-- rules: {-->
|
||||
<!-- type: Object,-->
|
||||
<!-- default: () => {},-->
|
||||
<!-- },-->
|
||||
<!-- name: { type: String, required: true },-->
|
||||
<!-- label: { type: String, required: true },-->
|
||||
<!-- placeholder: { type: String, required: true },-->
|
||||
<!-- value: { type: String, required: true },-->
|
||||
<!-- disabled: { required: false, type: Boolean, default: false },-->
|
||||
<!-- },-->
|
||||
<!-- data() {-->
|
||||
<!-- return {-->
|
||||
<!-- currentValue: this.value,-->
|
||||
<!-- }-->
|
||||
<!-- },-->
|
||||
<!-- computed: {-->
|
||||
<!-- labelFor() {-->
|
||||
<!-- return this.name + '-input-field'-->
|
||||
<!-- },-->
|
||||
<!-- },-->
|
||||
<!-- watch: {-->
|
||||
<!-- currentValue() {-->
|
||||
<!-- this.$emit('input', this.currentValue)-->
|
||||
<!-- },-->
|
||||
<!-- value() {-->
|
||||
<!-- if (this.value !== this.currentValue) this.currentValue = this.value-->
|
||||
<!-- },-->
|
||||
<!-- },-->
|
||||
<!--}-->
|
||||
<!--</script>-->
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, watch } from 'vue'
|
||||
import { useField } from 'vee-validate'
|
||||
|
||||
// Props
|
||||
const props = defineProps({
|
||||
rules: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
currentValue: this.value,
|
||||
name: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
label: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
placeholder: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
modelValue: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
})
|
||||
|
||||
// Emits
|
||||
const emit = defineEmits(['update:modelValue'])
|
||||
|
||||
// Use vee-validate's useField
|
||||
const { value: currentValue, errorMessage, meta } = useField(props.name, props.rules, {
|
||||
initialValue: props.modelValue,
|
||||
})
|
||||
|
||||
// Computed
|
||||
const labelFor = computed(() => `${props.name}-input-field`)
|
||||
|
||||
// Watch for external value changes
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(newValue) => {
|
||||
if (newValue !== currentValue.value) {
|
||||
currentValue.value = newValue
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
labelFor() {
|
||||
return this.name + '-input-field'
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
currentValue() {
|
||||
this.$emit('input', this.currentValue)
|
||||
},
|
||||
value() {
|
||||
if (this.value !== this.currentValue) this.currentValue = this.value
|
||||
},
|
||||
},
|
||||
}
|
||||
)
|
||||
|
||||
// Watch for internal value changes
|
||||
watch(currentValue, (newValue) => {
|
||||
emit('update:modelValue', newValue)
|
||||
})
|
||||
</script>
|
||||
|
||||
@ -1,16 +1,16 @@
|
||||
<template>
|
||||
<div class="gdt-transaction-list">
|
||||
<div class="list-group bg-white appBoxShadow gradido-border-radius p-3 mb-3">
|
||||
<b-row @click="visible = !visible" class="align-items-center">
|
||||
<b-col cols="3" lg="2" md="2">
|
||||
<b-avatar
|
||||
<BRow @click="visible = !visible" class="align-items-center">
|
||||
<BCol cols="3" lg="2" md="2">
|
||||
<BAvatar
|
||||
:icon="getLinesByType.icon"
|
||||
variant="light"
|
||||
size="3em"
|
||||
:class="getLinesByType.iconclasses"
|
||||
></b-avatar>
|
||||
</b-col>
|
||||
<b-col>
|
||||
></BAvatar>
|
||||
</BCol>
|
||||
<BCol>
|
||||
<!-- <div>
|
||||
{{ getLinesByType }}
|
||||
</div> -->
|
||||
@ -24,24 +24,24 @@
|
||||
<div class="small">
|
||||
{{ getLinesByType.descriptiontext }}
|
||||
</div>
|
||||
</b-col>
|
||||
<b-col cols="8" lg="3" md="3" sm="8" offset="3" offset-md="0" offset-lg="0">
|
||||
</BCol>
|
||||
<BCol cols="8" lg="3" md="3" sm="8" offset="3" offset-md="0" offset-lg="0">
|
||||
<div class="small mb-2">{{ $t('gdt.credit') }}</div>
|
||||
<div class="font-weight-bold">{{ getLinesByType.credittext }}</div>
|
||||
</b-col>
|
||||
<b-col cols="12" md="1" lg="1" class="text-right">
|
||||
</BCol>
|
||||
<BCol cols="12" md="1" lg="1" class="text-right">
|
||||
<collapse-icon class="text-right" :visible="visible" />
|
||||
</b-col>
|
||||
</b-row>
|
||||
</BCol>
|
||||
</BRow>
|
||||
|
||||
<b-collapse :id="collapseId" class="mt-2" v-model="visible">
|
||||
<BCollapse :id="collapseId" class="mt-2" v-model="visible">
|
||||
<transaction-collapse
|
||||
:amount="amount"
|
||||
:gdtEntryType="gdtEntryType"
|
||||
:factor="factor"
|
||||
:gdt="gdt"
|
||||
></transaction-collapse>
|
||||
</b-collapse>
|
||||
</BCollapse>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -1,22 +1,22 @@
|
||||
<template>
|
||||
<div class="gdt-transaction-collapse py-4 mb-4 gradido-no-border">
|
||||
<b-row class="gdt-list-collapse-header-text mb-3">
|
||||
<b-col class="collapse-headline">
|
||||
<BRow class="gdt-list-collapse-header-text mb-3">
|
||||
<BCol class="collapse-headline">
|
||||
<b>{{ getLinesByType.headline }}</b>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="gdt-list-collapse-box--all">
|
||||
<b-col cols="12" lg="4" md="4">
|
||||
</BCol>
|
||||
</BRow>
|
||||
<BRow class="gdt-list-collapse-box--all">
|
||||
<BCol cols="12" lg="4" md="4">
|
||||
<div class="collapse-first">{{ getLinesByType.first }}</div>
|
||||
<div class="collapse-second">{{ getLinesByType.second }}</div>
|
||||
</b-col>
|
||||
<b-col offset="1" offset-md="0" offset-lg="0">
|
||||
</BCol>
|
||||
<BCol offset="1" offset-md="0" offset-lg="0">
|
||||
<div class="collapse-firstMath">{{ getLinesByType.firstMath }}</div>
|
||||
<div class="collapse-secondMath">
|
||||
{{ getLinesByType.secondMath }}
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</BCol>
|
||||
</BRow>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
@ -317,7 +317,7 @@
|
||||
<!--</script>-->
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { ref, onMounted, watch } from 'vue'
|
||||
import { useStore } from 'vuex'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { useLazyQuery, useMutation, useQuery } from '@vue/apollo-composable'
|
||||
@ -385,9 +385,8 @@ const logoutUser = async () => {
|
||||
const updateTransactions = async ({ currentPage, pageSize }) => {
|
||||
pending.value = true
|
||||
try {
|
||||
// const { result } = useQuery(transactionsQuery, undefined, { fetchPolicy: 'network-only' })
|
||||
// console.log(result)
|
||||
const result = await useTransactionsQuery()
|
||||
if (!result) return //TODO this return mitigate an error when this method is called second time but without actual request
|
||||
const { transactionList } = result
|
||||
GdtBalance.value =
|
||||
transactionList.balance.balanceGDT === null ? 0 : Number(transactionList.balance.balanceGDT)
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="circles">
|
||||
<b-container class="bg-white appBoxShadow gradido-border-radius p-4 mt--3">
|
||||
<BContainer class="bg-white appBoxShadow gradido-border-radius p-4 mt--3">
|
||||
<div class="h3">{{ $t('circles.headline') }}</div>
|
||||
<div class="my-4 text-small">
|
||||
<span v-for="(line, lineNumber) of $t('circles.text').split('\n')" v-bind:key="lineNumber">
|
||||
@ -8,10 +8,10 @@
|
||||
<br />
|
||||
</span>
|
||||
</div>
|
||||
<b-row class="my-5">
|
||||
<b-col cols="12">
|
||||
<BRow class="my-5">
|
||||
<BCol cols="12">
|
||||
<div class="text-lg-right">
|
||||
<b-button
|
||||
<BButton
|
||||
:href="this.humhubUri"
|
||||
v-if="this.humhubAllowed"
|
||||
variant="gradido"
|
||||
@ -19,16 +19,16 @@
|
||||
target="_blank"
|
||||
>
|
||||
{{ $t('circles.button') }}
|
||||
</b-button>
|
||||
</BButton>
|
||||
<RouterLink v-else to="/settings/extern">
|
||||
<b-button variant="gradido">
|
||||
<BButton variant="gradido">
|
||||
{{ $t('circles.button') }}
|
||||
</b-button>
|
||||
</BButton>
|
||||
</RouterLink>
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
</BCol>
|
||||
</BRow>
|
||||
</BContainer>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<div class="community-page">
|
||||
<div>
|
||||
<b-tabs no-nav-style borderless v-model="tabIndex" align="center">
|
||||
<b-tab no-body>
|
||||
<BTabs no-nav-style borderless v-model="tabIndex" align="center">
|
||||
<BTab no-body>
|
||||
<open-creations-amount
|
||||
:minimalDate="minimalDate"
|
||||
:maxGddLastMonth="maxForMonths[0]"
|
||||
@ -10,16 +10,16 @@
|
||||
/>
|
||||
<div class="mb-3"></div>
|
||||
<contribution-form
|
||||
@set-contribution="saveContribution"
|
||||
@update-contribution="updateContribution"
|
||||
@set-contribution="handleSaveContribution"
|
||||
@update-contribution="handleUpdateContribution"
|
||||
v-model="form"
|
||||
:isThisMonth="isThisMonth"
|
||||
:minimalDate="minimalDate"
|
||||
:maxGddLastMonth="maxForMonths[0]"
|
||||
:maxGddThisMonth="maxForMonths[1]"
|
||||
/>
|
||||
</b-tab>
|
||||
<b-tab no-body>
|
||||
</BTab>
|
||||
<BTab no-body>
|
||||
<div v-if="items.length === 0">
|
||||
{{ $t('contribution.noContributions.myContributions') }}
|
||||
</div>
|
||||
@ -27,17 +27,17 @@
|
||||
<contribution-list
|
||||
@closeAllOpenCollapse="closeAllOpenCollapse"
|
||||
:items="items"
|
||||
@update-list-contributions="updateListContributions"
|
||||
@update-contribution-form="updateContributionForm"
|
||||
@delete-contribution="deleteContribution"
|
||||
@update-list-contributions="handleUpdateListContributions"
|
||||
@update-contribution-form="handleUpdateContributionForm"
|
||||
@delete-contribution="handleDeleteContribution"
|
||||
@update-status="updateStatus"
|
||||
:contributionCount="contributionCount"
|
||||
:showPagination="true"
|
||||
:pageSize="pageSize"
|
||||
/>
|
||||
</div>
|
||||
</b-tab>
|
||||
<b-tab no-body>
|
||||
</BTab>
|
||||
<BTab no-body>
|
||||
<div v-if="itemsAll.length === 0">
|
||||
{{ $t('contribution.noContributions.allContributions') }}
|
||||
</div>
|
||||
@ -52,254 +52,490 @@
|
||||
:allContribution="true"
|
||||
/>
|
||||
</div>
|
||||
</b-tab>
|
||||
</b-tabs>
|
||||
</BTab>
|
||||
</BTabs>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
<!--<script>-->
|
||||
<!--import OpenCreationsAmount from '@/components/Contributions/OpenCreationsAmount'-->
|
||||
<!--import ContributionForm from '@/components/Contributions/ContributionForm'-->
|
||||
<!--import ContributionList from '@/components/Contributions/ContributionList'-->
|
||||
<!--import { createContribution, updateContribution, deleteContribution } from '@/graphql/mutations'-->
|
||||
<!--import { listContributions, listAllContributions, openCreations } from '@/graphql/queries'-->
|
||||
|
||||
<!--const COMMUNITY_TABS = ['contribute', 'contributions', 'community']-->
|
||||
|
||||
<!--export default {-->
|
||||
<!-- name: 'Community',-->
|
||||
<!-- components: {-->
|
||||
<!-- ContributionForm,-->
|
||||
<!-- ContributionList,-->
|
||||
<!-- OpenCreationsAmount,-->
|
||||
<!-- },-->
|
||||
<!-- data() {-->
|
||||
<!-- return {-->
|
||||
<!-- tabIndex: 0,-->
|
||||
<!-- items: [],-->
|
||||
<!-- itemsAll: [],-->
|
||||
<!-- currentPage: 1,-->
|
||||
<!-- pageSize: 25,-->
|
||||
<!-- currentPageAll: 1,-->
|
||||
<!-- pageSizeAll: 25,-->
|
||||
<!-- contributionCount: 0,-->
|
||||
<!-- contributionCountAll: 0,-->
|
||||
<!-- form: {-->
|
||||
<!-- id: null,-->
|
||||
<!-- date: '',-->
|
||||
<!-- memo: '',-->
|
||||
<!-- hours: 0,-->
|
||||
<!-- amount: '',-->
|
||||
<!-- },-->
|
||||
<!-- originalContributionDate: '',-->
|
||||
<!-- updateAmount: '',-->
|
||||
<!-- maximalDate: new Date(),-->
|
||||
<!-- openCreations: [],-->
|
||||
<!-- }-->
|
||||
<!-- },-->
|
||||
<!-- mounted() {-->
|
||||
<!-- this.updateTabIndex()-->
|
||||
<!-- },-->
|
||||
<!-- apollo: {-->
|
||||
<!-- OpenCreations: {-->
|
||||
<!-- query() {-->
|
||||
<!-- return openCreations-->
|
||||
<!-- },-->
|
||||
<!-- fetchPolicy: 'network-only',-->
|
||||
<!-- variables() {-->
|
||||
<!-- return {}-->
|
||||
<!-- },-->
|
||||
<!-- update({ openCreations }) {-->
|
||||
<!-- this.openCreations = openCreations-->
|
||||
<!-- },-->
|
||||
<!-- error({ message }) {-->
|
||||
<!-- this.toastError(message)-->
|
||||
<!-- },-->
|
||||
<!-- },-->
|
||||
<!-- ListAllContributions: {-->
|
||||
<!-- query() {-->
|
||||
<!-- return listAllContributions-->
|
||||
<!-- },-->
|
||||
<!-- variables() {-->
|
||||
<!-- return {-->
|
||||
<!-- currentPage: this.currentPageAll,-->
|
||||
<!-- pageSize: this.pageSizeAll,-->
|
||||
<!-- }-->
|
||||
<!-- },-->
|
||||
<!-- fetchPolicy: 'no-cache',-->
|
||||
<!-- update({ listAllContributions }) {-->
|
||||
<!-- this.contributionCountAll = listAllContributions.contributionCount-->
|
||||
<!-- this.itemsAll = listAllContributions.contributionList-->
|
||||
<!-- },-->
|
||||
<!-- error({ message }) {-->
|
||||
<!-- this.toastError(message)-->
|
||||
<!-- },-->
|
||||
<!-- },-->
|
||||
<!-- ListContributions: {-->
|
||||
<!-- query() {-->
|
||||
<!-- return listContributions-->
|
||||
<!-- },-->
|
||||
<!-- fetchPolicy: 'network-only',-->
|
||||
<!-- variables() {-->
|
||||
<!-- return {-->
|
||||
<!-- currentPage: this.currentPage,-->
|
||||
<!-- pageSize: this.pageSize,-->
|
||||
<!-- }-->
|
||||
<!-- },-->
|
||||
<!-- update({ listContributions }) {-->
|
||||
<!-- this.contributionCount = listContributions.contributionCount-->
|
||||
<!-- this.items = listContributions.contributionList-->
|
||||
<!-- if (this.items.find((item) => item.status === 'IN_PROGRESS')) {-->
|
||||
<!-- this.tabIndex = 1-->
|
||||
<!-- if (this.$route.params.tab !== 'contributions')-->
|
||||
<!-- this.$router.push({ params: { tab: 'contributions' } })-->
|
||||
<!-- this.toastInfo(this.$t('contribution.alert.answerQuestionToast'))-->
|
||||
<!-- }-->
|
||||
<!-- },-->
|
||||
<!-- error({ message }) {-->
|
||||
<!-- this.toastError(message)-->
|
||||
<!-- },-->
|
||||
<!-- },-->
|
||||
<!-- },-->
|
||||
<!-- watch: {-->
|
||||
<!-- '$route.params.tab'() {-->
|
||||
<!-- this.updateTabIndex()-->
|
||||
<!-- },-->
|
||||
<!-- },-->
|
||||
<!-- 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()-->
|
||||
<!-- )-->
|
||||
<!-- },-->
|
||||
<!-- amountToAdd() {-->
|
||||
<!-- // when existing contribution is edited, the amount is added back on top of the amount-->
|
||||
<!-- if (this.form.id) return parseInt(this.updateAmount)-->
|
||||
<!-- return 0-->
|
||||
<!-- },-->
|
||||
<!-- maxForMonths() {-->
|
||||
<!-- const originalContributionDate = new Date(this.originalContributionDate)-->
|
||||
<!-- if (this.openCreations && this.openCreations.length)-->
|
||||
<!-- return this.openCreations.slice(1).map((creation) => {-->
|
||||
<!-- if (-->
|
||||
<!-- creation.year === originalContributionDate.getFullYear() &&-->
|
||||
<!-- creation.month === originalContributionDate.getMonth()-->
|
||||
<!-- )-->
|
||||
<!-- return parseInt(creation.amount) + this.amountToAdd-->
|
||||
<!-- return parseInt(creation.amount)-->
|
||||
<!-- })-->
|
||||
<!-- return [0, 0]-->
|
||||
<!-- },-->
|
||||
<!-- },-->
|
||||
<!-- methods: {-->
|
||||
<!-- updateTabIndex() {-->
|
||||
<!-- const index = COMMUNITY_TABS.indexOf(this.$route.params.tab)-->
|
||||
<!-- this.$nextTick(() => {-->
|
||||
<!-- this.tabIndex = index > -1 ? index : 0-->
|
||||
<!-- })-->
|
||||
<!-- this.closeAllOpenCollapse()-->
|
||||
<!-- },-->
|
||||
<!-- closeAllOpenCollapse() {-->
|
||||
<!-- this.$el.querySelectorAll('.collapse.show').forEach((value) => {-->
|
||||
<!-- this.$root.$emit('bv::toggle::collapse', value.id)-->
|
||||
<!-- })-->
|
||||
<!-- },-->
|
||||
<!-- refetchData() {-->
|
||||
<!-- this.$apollo.queries.ListAllContributions.refetch()-->
|
||||
<!-- this.$apollo.queries.ListContributions.refetch()-->
|
||||
<!-- this.$apollo.queries.OpenCreations.refetch()-->
|
||||
<!-- },-->
|
||||
<!-- saveContribution(data) {-->
|
||||
<!-- this.$apollo-->
|
||||
<!-- .mutate({-->
|
||||
<!-- fetchPolicy: 'no-cache',-->
|
||||
<!-- mutation: createContribution,-->
|
||||
<!-- variables: {-->
|
||||
<!-- creationDate: data.date,-->
|
||||
<!-- memo: data.memo,-->
|
||||
<!-- amount: data.amount,-->
|
||||
<!-- },-->
|
||||
<!-- })-->
|
||||
<!-- .then((result) => {-->
|
||||
<!-- this.toastSuccess(this.$t('contribution.submitted'))-->
|
||||
<!-- this.refetchData()-->
|
||||
<!-- })-->
|
||||
<!-- .catch((err) => {-->
|
||||
<!-- this.toastError(err.message)-->
|
||||
<!-- })-->
|
||||
<!-- },-->
|
||||
<!-- updateContribution(data) {-->
|
||||
<!-- this.$apollo-->
|
||||
<!-- .mutate({-->
|
||||
<!-- fetchPolicy: 'no-cache',-->
|
||||
<!-- mutation: updateContribution,-->
|
||||
<!-- variables: {-->
|
||||
<!-- contributionId: data.id,-->
|
||||
<!-- creationDate: data.date,-->
|
||||
<!-- memo: data.memo,-->
|
||||
<!-- amount: data.amount,-->
|
||||
<!-- },-->
|
||||
<!-- })-->
|
||||
<!-- .then((result) => {-->
|
||||
<!-- this.toastSuccess(this.$t('contribution.updated'))-->
|
||||
<!-- this.refetchData()-->
|
||||
<!-- })-->
|
||||
<!-- .catch((err) => {-->
|
||||
<!-- this.toastError(err.message)-->
|
||||
<!-- })-->
|
||||
<!-- },-->
|
||||
<!-- deleteContribution(data) {-->
|
||||
<!-- this.$apollo-->
|
||||
<!-- .mutate({-->
|
||||
<!-- fetchPolicy: 'no-cache',-->
|
||||
<!-- mutation: deleteContribution,-->
|
||||
<!-- variables: {-->
|
||||
<!-- id: data.id,-->
|
||||
<!-- },-->
|
||||
<!-- })-->
|
||||
<!-- .then((result) => {-->
|
||||
<!-- this.toastSuccess(this.$t('contribution.deleted'))-->
|
||||
<!-- this.refetchData()-->
|
||||
<!-- })-->
|
||||
<!-- .catch((err) => {-->
|
||||
<!-- this.toastError(err.message)-->
|
||||
<!-- })-->
|
||||
<!-- },-->
|
||||
<!-- updateListAllContributions(pagination) {-->
|
||||
<!-- this.currentPageAll = pagination.currentPage-->
|
||||
<!-- this.pageSizeAll = pagination.pageSize-->
|
||||
<!-- this.$apollo.queries.ListAllContributions.refetch()-->
|
||||
<!-- },-->
|
||||
<!-- updateListContributions(pagination) {-->
|
||||
<!-- this.currentPage = pagination.currentPage-->
|
||||
<!-- this.pageSize = pagination.pageSize-->
|
||||
<!-- this.$apollo.queries.ListContributions.refetch()-->
|
||||
<!-- },-->
|
||||
<!-- updateContributionForm(item) {-->
|
||||
<!-- this.form.id = item.id-->
|
||||
<!-- this.form.date = item.contributionDate-->
|
||||
<!-- this.originalContributionDate = item.contributionDate-->
|
||||
<!-- this.form.memo = item.memo-->
|
||||
<!-- this.form.amount = item.amount-->
|
||||
<!-- this.form.hours = item.amount / 20-->
|
||||
<!-- this.updateAmount = item.amount-->
|
||||
<!-- this.tabIndex = 0-->
|
||||
<!-- this.$router.push({ params: { tab: 'contribute' } })-->
|
||||
<!-- },-->
|
||||
<!-- updateTransactions(pagination) {-->
|
||||
<!-- this.$emit('update-transactions', pagination)-->
|
||||
<!-- },-->
|
||||
<!-- updateStatus(id) {-->
|
||||
<!-- this.items.find((item) => item.id === id).status = 'PENDING'-->
|
||||
<!-- },-->
|
||||
<!-- },-->
|
||||
<!--}-->
|
||||
<!--</script>-->
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, watch, onMounted } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { useQuery, useMutation } from '@vue/apollo-composable'
|
||||
import OpenCreationsAmount from '@/components/Contributions/OpenCreationsAmount'
|
||||
import ContributionForm from '@/components/Contributions/ContributionForm'
|
||||
import ContributionList from '@/components/Contributions/ContributionList'
|
||||
import { createContribution, updateContribution, deleteContribution } from '@/graphql/mutations'
|
||||
import { listContributions, listAllContributions, openCreations } from '@/graphql/queries'
|
||||
import { useAppToast } from '../composables/useToast'
|
||||
|
||||
const COMMUNITY_TABS = ['contribute', 'contributions', 'community']
|
||||
|
||||
export default {
|
||||
name: 'Community',
|
||||
components: {
|
||||
ContributionForm,
|
||||
ContributionList,
|
||||
OpenCreationsAmount,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tabIndex: 0,
|
||||
items: [],
|
||||
itemsAll: [],
|
||||
currentPage: 1,
|
||||
pageSize: 25,
|
||||
currentPageAll: 1,
|
||||
pageSizeAll: 25,
|
||||
contributionCount: 0,
|
||||
contributionCountAll: 0,
|
||||
form: {
|
||||
id: null,
|
||||
date: '',
|
||||
memo: '',
|
||||
hours: 0,
|
||||
amount: '',
|
||||
},
|
||||
originalContributionDate: '',
|
||||
updateAmount: '',
|
||||
maximalDate: new Date(),
|
||||
openCreations: [],
|
||||
// Props and emits
|
||||
const emit = defineEmits(['update-transactions'])
|
||||
|
||||
// Router
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
|
||||
const { toastError, toastSuccess, toastInfo } = useAppToast()
|
||||
|
||||
// Reactive state
|
||||
const tabIndex = ref(0)
|
||||
const items = ref([])
|
||||
const itemsAll = ref([])
|
||||
const currentPage = ref(1)
|
||||
const pageSize = ref(25)
|
||||
const currentPageAll = ref(1)
|
||||
const pageSizeAll = ref(25)
|
||||
const contributionCount = ref(0)
|
||||
const contributionCountAll = ref(0)
|
||||
const form = ref({
|
||||
id: null,
|
||||
date: '',
|
||||
memo: '',
|
||||
hours: 0,
|
||||
amount: '',
|
||||
})
|
||||
const originalContributionDate = ref('')
|
||||
const updateAmount = ref('')
|
||||
const maximalDate = ref(new Date())
|
||||
const openCreationsData = ref([])
|
||||
|
||||
// Computed properties
|
||||
const minimalDate = computed(() => {
|
||||
const date = new Date(maximalDate.value)
|
||||
return new Date(date.setMonth(date.getMonth() - 1, 1))
|
||||
})
|
||||
|
||||
const isThisMonth = computed(() => {
|
||||
const formDate = new Date(form.value.date)
|
||||
return (
|
||||
formDate.getFullYear() === maximalDate.value.getFullYear() &&
|
||||
formDate.getMonth() === maximalDate.value.getMonth()
|
||||
)
|
||||
})
|
||||
|
||||
const amountToAdd = computed(() => (form.value.id ? parseInt(updateAmount.value) : 0))
|
||||
|
||||
const maxForMonths = computed(() => {
|
||||
const originalDate = new Date(originalContributionDate.value)
|
||||
if (openCreationsData.value && openCreationsData.value.length) {
|
||||
return openCreationsData.value.slice(1).map((creation) => {
|
||||
if (
|
||||
creation.year === originalDate.getFullYear() &&
|
||||
creation.month === originalDate.getMonth()
|
||||
) {
|
||||
return parseInt(creation.amount) + amountToAdd.value
|
||||
}
|
||||
return parseInt(creation.amount)
|
||||
})
|
||||
}
|
||||
return [0, 0]
|
||||
})
|
||||
|
||||
// Queries
|
||||
const { onResult: onOpenCreationsResult, refetch: refetchOpenCreations } = useQuery(openCreations)
|
||||
const { onResult: onListAllContributionsResult, refetch: refetchAllContributions } = useQuery(
|
||||
listAllContributions,
|
||||
() => ({
|
||||
currentPage: currentPageAll.value,
|
||||
pageSize: pageSizeAll.value,
|
||||
}),
|
||||
{ fetchPolicy: 'no-cache' },
|
||||
)
|
||||
const { onResult: onListContributionsResult, refetch: refetchContributions } = useQuery(
|
||||
listContributions,
|
||||
() => ({
|
||||
currentPage: currentPage.value,
|
||||
pageSize: pageSize.value,
|
||||
}),
|
||||
{ fetchPolicy: 'network-only' },
|
||||
)
|
||||
|
||||
// Mutations
|
||||
const { mutate: createContributionMutation } = useMutation(createContribution)
|
||||
const { mutate: updateContributionMutation } = useMutation(updateContribution)
|
||||
const { mutate: deleteContributionMutation } = useMutation(deleteContribution)
|
||||
|
||||
// Query results
|
||||
onOpenCreationsResult(({ data }) => {
|
||||
if (data) {
|
||||
openCreationsData.value = data.openCreations
|
||||
}
|
||||
})
|
||||
|
||||
onListAllContributionsResult(({ data }) => {
|
||||
if (data) {
|
||||
contributionCountAll.value = data.listAllContributions.contributionCount
|
||||
itemsAll.value = data.listAllContributions.contributionList
|
||||
}
|
||||
})
|
||||
|
||||
onListContributionsResult(({ data }) => {
|
||||
if (data) {
|
||||
contributionCount.value = data.listContributions.contributionCount
|
||||
items.value = data.listContributions.contributionList
|
||||
if (items.value.find((item) => item.status === 'IN_PROGRESS')) {
|
||||
tabIndex.value = 1
|
||||
if (route.params.tab !== 'contributions') {
|
||||
router.push({ params: { tab: 'contributions' } })
|
||||
}
|
||||
// Assuming toastInfo is available globally or imported
|
||||
toastInfo(t('contribution.alert.answerQuestionToast'))
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.updateTabIndex()
|
||||
},
|
||||
apollo: {
|
||||
OpenCreations: {
|
||||
query() {
|
||||
return openCreations
|
||||
},
|
||||
fetchPolicy: 'network-only',
|
||||
variables() {
|
||||
return {}
|
||||
},
|
||||
update({ openCreations }) {
|
||||
this.openCreations = openCreations
|
||||
},
|
||||
error({ message }) {
|
||||
this.toastError(message)
|
||||
},
|
||||
},
|
||||
ListAllContributions: {
|
||||
query() {
|
||||
return listAllContributions
|
||||
},
|
||||
variables() {
|
||||
return {
|
||||
currentPage: this.currentPageAll,
|
||||
pageSize: this.pageSizeAll,
|
||||
}
|
||||
},
|
||||
fetchPolicy: 'no-cache',
|
||||
update({ listAllContributions }) {
|
||||
this.contributionCountAll = listAllContributions.contributionCount
|
||||
this.itemsAll = listAllContributions.contributionList
|
||||
},
|
||||
error({ message }) {
|
||||
this.toastError(message)
|
||||
},
|
||||
},
|
||||
ListContributions: {
|
||||
query() {
|
||||
return listContributions
|
||||
},
|
||||
fetchPolicy: 'network-only',
|
||||
variables() {
|
||||
return {
|
||||
currentPage: this.currentPage,
|
||||
pageSize: this.pageSize,
|
||||
}
|
||||
},
|
||||
update({ listContributions }) {
|
||||
this.contributionCount = listContributions.contributionCount
|
||||
this.items = listContributions.contributionList
|
||||
if (this.items.find((item) => item.status === 'IN_PROGRESS')) {
|
||||
this.tabIndex = 1
|
||||
if (this.$route.params.tab !== 'contributions')
|
||||
this.$router.push({ params: { tab: 'contributions' } })
|
||||
this.toastInfo(this.$t('contribution.alert.answerQuestionToast'))
|
||||
}
|
||||
},
|
||||
error({ message }) {
|
||||
this.toastError(message)
|
||||
},
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
'$route.params.tab'() {
|
||||
this.updateTabIndex()
|
||||
},
|
||||
},
|
||||
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()
|
||||
)
|
||||
},
|
||||
amountToAdd() {
|
||||
// when existing contribution is edited, the amount is added back on top of the amount
|
||||
if (this.form.id) return parseInt(this.updateAmount)
|
||||
return 0
|
||||
},
|
||||
maxForMonths() {
|
||||
const originalContributionDate = new Date(this.originalContributionDate)
|
||||
if (this.openCreations && this.openCreations.length)
|
||||
return this.openCreations.slice(1).map((creation) => {
|
||||
if (
|
||||
creation.year === originalContributionDate.getFullYear() &&
|
||||
creation.month === originalContributionDate.getMonth()
|
||||
)
|
||||
return parseInt(creation.amount) + this.amountToAdd
|
||||
return parseInt(creation.amount)
|
||||
})
|
||||
return [0, 0]
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
updateTabIndex() {
|
||||
const index = COMMUNITY_TABS.indexOf(this.$route.params.tab)
|
||||
this.$nextTick(() => {
|
||||
this.tabIndex = index > -1 ? index : 0
|
||||
})
|
||||
this.closeAllOpenCollapse()
|
||||
},
|
||||
closeAllOpenCollapse() {
|
||||
this.$el.querySelectorAll('.collapse.show').forEach((value) => {
|
||||
this.$root.$emit('bv::toggle::collapse', value.id)
|
||||
})
|
||||
},
|
||||
refetchData() {
|
||||
this.$apollo.queries.ListAllContributions.refetch()
|
||||
this.$apollo.queries.ListContributions.refetch()
|
||||
this.$apollo.queries.OpenCreations.refetch()
|
||||
},
|
||||
saveContribution(data) {
|
||||
this.$apollo
|
||||
.mutate({
|
||||
fetchPolicy: 'no-cache',
|
||||
mutation: createContribution,
|
||||
variables: {
|
||||
creationDate: data.date,
|
||||
memo: data.memo,
|
||||
amount: data.amount,
|
||||
},
|
||||
})
|
||||
.then((result) => {
|
||||
this.toastSuccess(this.$t('contribution.submitted'))
|
||||
this.refetchData()
|
||||
})
|
||||
.catch((err) => {
|
||||
this.toastError(err.message)
|
||||
})
|
||||
},
|
||||
updateContribution(data) {
|
||||
this.$apollo
|
||||
.mutate({
|
||||
fetchPolicy: 'no-cache',
|
||||
mutation: updateContribution,
|
||||
variables: {
|
||||
contributionId: data.id,
|
||||
creationDate: data.date,
|
||||
memo: data.memo,
|
||||
amount: data.amount,
|
||||
},
|
||||
})
|
||||
.then((result) => {
|
||||
this.toastSuccess(this.$t('contribution.updated'))
|
||||
this.refetchData()
|
||||
})
|
||||
.catch((err) => {
|
||||
this.toastError(err.message)
|
||||
})
|
||||
},
|
||||
deleteContribution(data) {
|
||||
this.$apollo
|
||||
.mutate({
|
||||
fetchPolicy: 'no-cache',
|
||||
mutation: deleteContribution,
|
||||
variables: {
|
||||
id: data.id,
|
||||
},
|
||||
})
|
||||
.then((result) => {
|
||||
this.toastSuccess(this.$t('contribution.deleted'))
|
||||
this.refetchData()
|
||||
})
|
||||
.catch((err) => {
|
||||
this.toastError(err.message)
|
||||
})
|
||||
},
|
||||
updateListAllContributions(pagination) {
|
||||
this.currentPageAll = pagination.currentPage
|
||||
this.pageSizeAll = pagination.pageSize
|
||||
this.$apollo.queries.ListAllContributions.refetch()
|
||||
},
|
||||
updateListContributions(pagination) {
|
||||
this.currentPage = pagination.currentPage
|
||||
this.pageSize = pagination.pageSize
|
||||
this.$apollo.queries.ListContributions.refetch()
|
||||
},
|
||||
updateContributionForm(item) {
|
||||
this.form.id = item.id
|
||||
this.form.date = item.contributionDate
|
||||
this.originalContributionDate = item.contributionDate
|
||||
this.form.memo = item.memo
|
||||
this.form.amount = item.amount
|
||||
this.form.hours = item.amount / 20
|
||||
this.updateAmount = item.amount
|
||||
this.tabIndex = 0
|
||||
this.$router.push({ params: { tab: 'contribute' } })
|
||||
},
|
||||
updateTransactions(pagination) {
|
||||
this.$emit('update-transactions', pagination)
|
||||
},
|
||||
updateStatus(id) {
|
||||
this.items.find((item) => item.id === id).status = 'PENDING'
|
||||
},
|
||||
},
|
||||
}
|
||||
})
|
||||
|
||||
// Methods
|
||||
const updateTabIndex = () => {
|
||||
const index = COMMUNITY_TABS.indexOf(route.params.tab)
|
||||
tabIndex.value = index > -1 ? index : 0
|
||||
closeAllOpenCollapse()
|
||||
}
|
||||
|
||||
const closeAllOpenCollapse = () => {
|
||||
document.querySelectorAll('.collapse.show').forEach((el) => {
|
||||
// Assuming you're using bootstrap-vue, adjust if using a different library
|
||||
el.classList.remove('show')
|
||||
})
|
||||
}
|
||||
|
||||
const refetchData = () => {
|
||||
refetchAllContributions()
|
||||
refetchContributions()
|
||||
refetchOpenCreations()
|
||||
}
|
||||
|
||||
const handleSaveContribution = async (data) => {
|
||||
try {
|
||||
await createContributionMutation({
|
||||
variables: {
|
||||
creationDate: data.date,
|
||||
memo: data.memo,
|
||||
amount: data.amount,
|
||||
},
|
||||
})
|
||||
toastSuccess(t('contribution.submitted'))
|
||||
refetchData()
|
||||
} catch (err) {
|
||||
toastError(err.message)
|
||||
}
|
||||
}
|
||||
|
||||
const handleUpdateContribution = async (data) => {
|
||||
try {
|
||||
await updateContributionMutation({
|
||||
variables: {
|
||||
contributionId: data.id,
|
||||
creationDate: data.date,
|
||||
memo: data.memo,
|
||||
amount: data.amount,
|
||||
},
|
||||
})
|
||||
toastSuccess(t('contribution.updated'))
|
||||
refetchData()
|
||||
} catch (err) {
|
||||
toastError(err.message)
|
||||
}
|
||||
}
|
||||
|
||||
const handleDeleteContribution = async (data) => {
|
||||
try {
|
||||
await deleteContributionMutation({
|
||||
variables: { id: data.id },
|
||||
})
|
||||
toastSuccess(t('contribution.deleted'))
|
||||
refetchData()
|
||||
} catch (err) {
|
||||
toastError(err.message)
|
||||
}
|
||||
}
|
||||
|
||||
const handleUpdateListAllContributions = (pagination) => {
|
||||
currentPageAll.value = pagination.currentPage
|
||||
pageSizeAll.value = pagination.pageSize
|
||||
refetchAllContributions()
|
||||
}
|
||||
|
||||
const handleUpdateListContributions = (pagination) => {
|
||||
currentPage.value = pagination.currentPage
|
||||
pageSize.value = pagination.pageSize
|
||||
refetchContributions()
|
||||
}
|
||||
|
||||
const handleUpdateContributionForm = (item) => {
|
||||
form.value = {
|
||||
id: item.id,
|
||||
date: item.contributionDate,
|
||||
memo: item.memo,
|
||||
amount: item.amount,
|
||||
hours: item.amount / 20,
|
||||
}
|
||||
originalContributionDate.value = item.contributionDate
|
||||
updateAmount.value = item.amount
|
||||
tabIndex.value = 0
|
||||
router.push({ params: { tab: 'contribute' } })
|
||||
}
|
||||
|
||||
const updateTransactions = (pagination) => {
|
||||
emit('update-transactions', pagination)
|
||||
}
|
||||
|
||||
const updateStatus = (id) => {
|
||||
const item = items.value.find((item) => item.id === id)
|
||||
if (item) item.status = 'PENDING'
|
||||
}
|
||||
|
||||
// Watchers
|
||||
watch(() => route.params.tab, updateTabIndex)
|
||||
|
||||
// Lifecycle hooks
|
||||
onMounted(updateTabIndex)
|
||||
</script>
|
||||
<style scoped>
|
||||
.tab-content {
|
||||
|
||||
@ -11,31 +11,6 @@
|
||||
</BLink>
|
||||
</div>
|
||||
<hr />
|
||||
<!--<div class="h3">{{ $t('community.openContributionLinks') }}</div>
|
||||
<div v-if="count > 0">
|
||||
{{
|
||||
$t('community.openContributionLinkText', {
|
||||
name: CONFIG.COMMUNITY_NAME,
|
||||
count,
|
||||
})
|
||||
}}
|
||||
</div>
|
||||
<div v-else>
|
||||
{{ $t('community.noOpenContributionLinkText') }}
|
||||
</div>
|
||||
<ul>
|
||||
<li v-for="item in itemsContributionLinks" v-bind:key="item.id">
|
||||
<div>{{ item.name }}</div>
|
||||
<div>{{ item.memo }}</div>
|
||||
<div>
|
||||
{{ item.amount | GDD }}
|
||||
<span v-if="item.cycle === 'ONCE'">{{ $t('contribution-link.unique') }}</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<hr />-->
|
||||
|
||||
<div class="h3">{{ $t('community.admins') }}</div>
|
||||
<ul>
|
||||
<li v-for="item in admins" :key="item.id">{{ item.firstName }} {{ item.lastName }}</li>
|
||||
@ -50,117 +25,60 @@
|
||||
<div class="h3">{{ $t('contact') }}</div>
|
||||
<BLink :href="`mailto:${supportMail}`">{{ supportMail }}</BLink>
|
||||
</BContainer>
|
||||
<!--
|
||||
<hr />
|
||||
<b-container>
|
||||
<div class="h3">{{ $t('community.statistic') }}</div>
|
||||
<div>
|
||||
<div>
|
||||
{{ $t('community.members') }}
|
||||
<span class="h4">{{ totalUsers }}</span>
|
||||
</div>
|
||||
<div>
|
||||
{{ $t('statistic.totalGradidoCreated') }}
|
||||
<span class="h4">{{ totalGradidoCreated | GDD }}</span>
|
||||
</div>
|
||||
<div>
|
||||
{{ $t('statistic.totalGradidoDecayed') }}
|
||||
<span class="h4">{{ totalGradidoDecayed | GDD }}</span>
|
||||
</div>
|
||||
<div>
|
||||
{{ $t('statistic.totalGradidoAvailable') }}
|
||||
<span class="h4">{{ totalGradidoAvailable | GDD }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</b-container>
|
||||
-->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
<script setup>
|
||||
import { ref, computed, onMounted } from 'vue'
|
||||
import { useQuery } from '@vue/apollo-composable'
|
||||
import CONFIG from '@/config'
|
||||
import { listContributionLinks, searchAdminUsers } from '@/graphql/queries'
|
||||
// , communityStatistics
|
||||
import { useAppToast } from '../composables/useToast'
|
||||
|
||||
export default {
|
||||
name: 'InfoStatistic',
|
||||
data() {
|
||||
return {
|
||||
CONFIG,
|
||||
count: null,
|
||||
countAdminUser: null,
|
||||
itemsContributionLinks: [],
|
||||
itemsAdminUser: [],
|
||||
supportMail: CONFIG.COMMUNITY_SUPPORT_MAIL,
|
||||
membersCount: '1203',
|
||||
totalUsers: null,
|
||||
totalGradidoCreated: null,
|
||||
totalGradidoDecayed: null,
|
||||
totalGradidoAvailable: null,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
admins() {
|
||||
return this.itemsAdminUser.filter((item) => item.role === 'ADMIN')
|
||||
},
|
||||
moderators() {
|
||||
return this.itemsAdminUser.filter((item) => item.role === 'MODERATOR')
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
getContributionLinks() {
|
||||
this.$apollo
|
||||
.query({
|
||||
query: listContributionLinks,
|
||||
})
|
||||
.then((result) => {
|
||||
this.count = result.data.listContributionLinks.count
|
||||
this.itemsContributionLinks = result.data.listContributionLinks.links
|
||||
})
|
||||
.catch(() => {
|
||||
this.toastError('listContributionLinks has no result, use default data')
|
||||
})
|
||||
},
|
||||
getAdminUsers() {
|
||||
this.$apollo
|
||||
.query({
|
||||
query: searchAdminUsers,
|
||||
})
|
||||
.then((result) => {
|
||||
this.countAdminUser = result.data.searchAdminUsers.userCount
|
||||
this.itemsAdminUser = result.data.searchAdminUsers.userList
|
||||
})
|
||||
.catch(() => {
|
||||
this.toastError('searchAdminUsers has no result, use default data')
|
||||
})
|
||||
},
|
||||
/*
|
||||
getCommunityStatistics() {
|
||||
this.$apollo
|
||||
.query({
|
||||
query: communityStatistics,
|
||||
})
|
||||
.then((result) => {
|
||||
this.totalUsers = result.data.communityStatistics.totalUsers
|
||||
this.totalGradidoCreated = result.data.communityStatistics.totalGradidoCreated
|
||||
this.totalGradidoDecayed =
|
||||
Number(result.data.communityStatistics.totalGradidoDecayed) +
|
||||
Number(result.data.communityStatistics.totalGradidoUnbookedDecayed)
|
||||
this.totalGradidoAvailable = result.data.communityStatistics.totalGradidoAvailable
|
||||
})
|
||||
.catch(() => {
|
||||
this.toastError('communityStatistics has no result, use default data')
|
||||
})
|
||||
},
|
||||
*/
|
||||
updateTransactions(pagination) {
|
||||
this.$emit('update-transactions', pagination)
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.getContributionLinks()
|
||||
this.getAdminUsers()
|
||||
// this.getCommunityStatistics()
|
||||
this.updateTransactions(0)
|
||||
},
|
||||
const emit = defineEmits(['update-transactions'])
|
||||
|
||||
const { toastError } = useAppToast()
|
||||
|
||||
const count = ref(null)
|
||||
const countAdminUser = ref(null)
|
||||
const itemsContributionLinks = ref([])
|
||||
const itemsAdminUser = ref([])
|
||||
const supportMail = CONFIG.COMMUNITY_SUPPORT_MAIL
|
||||
|
||||
const admins = computed(() => itemsAdminUser.value.filter((item) => item.role === 'ADMIN'))
|
||||
const moderators = computed(() => itemsAdminUser.value.filter((item) => item.role === 'MODERATOR'))
|
||||
|
||||
const { onResult: onContributionLinksResult, onError: onContributionLinksError } = useQuery(
|
||||
listContributionLinks,
|
||||
)
|
||||
const { onResult: onAdminUsersResult, onError: onAdminUsersError } = useQuery(searchAdminUsers)
|
||||
|
||||
onContributionLinksResult(({ data }) => {
|
||||
if (data) {
|
||||
count.value = data.listContributionLinks.count
|
||||
itemsContributionLinks.value = data.listContributionLinks.links
|
||||
}
|
||||
})
|
||||
|
||||
onAdminUsersResult(({ data }) => {
|
||||
if (data) {
|
||||
countAdminUser.value = data.searchAdminUsers.userCount
|
||||
itemsAdminUser.value = data.searchAdminUsers.userList
|
||||
}
|
||||
})
|
||||
|
||||
onContributionLinksError(() => {
|
||||
toastError('listContributionLinks has no result, use default data')
|
||||
})
|
||||
|
||||
onAdminUsersError(() => {
|
||||
toastError('searchAdminUsers has no result, use default data')
|
||||
})
|
||||
|
||||
const updateTransactions = (pagination) => {
|
||||
emit('update-transactions', pagination)
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
updateTransactions(0)
|
||||
})
|
||||
</script>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user