WIP - sent gdd skelet, todo: api clear send not ok

This commit is contained in:
ogerly 2021-03-01 16:15:11 +01:00
parent 94d5dcb778
commit 3339f42975
5 changed files with 105 additions and 68 deletions

View File

@ -1,7 +1,6 @@
import Vue from 'vue' import Vue from 'vue'
import VueRouter from 'vue-router' import VueRouter from 'vue-router'
import routes from './routes' import routes from './routes'
import {store} from '../store/store';
Vue.use(VueRouter) Vue.use(VueRouter)

View File

@ -95,9 +95,9 @@ export const store = new Vuex.Store({
}, },
ajaxCreate: async ({ dispatch, state }) => { ajaxCreate: async ({ dispatch, state }) => {
console.log('action: ajaxCreate') console.log('action: ajaxCreate')
console.log(state) console.log(state.ajaxCreateData)
const result = await communityAPI.create( const result = await communityAPI.create(
state.session_id, state.ajaxCreateData.session_id,
state.ajaxCreateData.email, state.ajaxCreateData.email,
state.ajaxCreateData.amount, state.ajaxCreateData.amount,
state.ajaxCreateData.memo, state.ajaxCreateData.memo,

View File

@ -8,27 +8,35 @@
</base-button> </base-button>
<b-collapse id="collapse-1" class="mt-2"> <b-collapse id="collapse-1" class="mt-2">
<b-card > <b-card >
<p class="card-text">
<div v-if="scan">
<b-row> <b-row>
<b-col>
<qrcode-capture @detect="onDetect" capture="user" ></qrcode-capture> <qrcode-capture @detect="onDetect" capture="user" ></qrcode-capture>
</b-col>
<b-col>
<span v-if="scan">
<qrcode-stream @decode="onDecode" @detect="onDetect" ></qrcode-stream>
<b-iconstack font-scale="5" @click="scan=false">
<b-icon stacked icon="upc-scan" variant="info" scale="0.75"></b-icon>
<b-icon stacked icon="slash-circle" variant="danger"></b-icon>
</b-iconstack>
</span>
<span v-else >
<img src="img/icons/gradido/qr-scan-pure.png" width="90" @click="scan=true"/>
scan jetzt
</span>
</b-col>
</b-row> </b-row>
<b-form @submit="onSubmit" @reset="onReset" v-if="show">
<b-row>
<qrcode-stream @decode="onDecode" @detect="onDetect" ></qrcode-stream>
<b-alert show variant="secondary">
<span class="alert-text"><strong>QR Code Scanner</strong> - Scanne den QR Code deines Partners</span>
</b-alert>
<b-alert show variant="warning" >
<span class="alert-text" @click="scan=false"><strong>abrechen!</strong></span>
</b-alert>
</b-row>
</div>
<validation-observer v-slot="{handleSubmit}" ref="formValidator">
<b-form role="form" @submit.prevent="handleSubmit(onSubmit)" @reset="onReset" v-if="show">
<br> <br>
<qrcode-drop-zone id="input-0" v-model="form.img"></qrcode-drop-zone> <qrcode-drop-zone id="input-0" v-model="form.img"></qrcode-drop-zone>
<br> <br>
@ -37,43 +45,73 @@
id="input-group-1" id="input-group-1"
label="Empfänger:" label="Empfänger:"
label-for="input-1" label-for="input-1"
description="We'll never share your email with anyone else."> description="We'll never share your email with anyone else."
size="lg"
class="mb-3"
>
<b-input-group-prepend>
<b-button variant="outline-primary">
<img src="img/icons/gradido/qr-scan-pure.png" width="50" @click="scan=true"/></b-button>
</b-input-group-prepend>
<b-form-input <b-form-input
id="input-1" id="input-1"
v-model="form.email" v-model="form.email"
type="email" type="email"
placeholder="E-Mail" placeholder="E-Mail"
required></b-form-input> :rules="{required: true, email: true}"
required
<b-input-group-append> style="font-size: xx-large; padding-left:20px"></b-form-input>
<b-button variant="outline-primary" @click="adressbook">Adressbuch</b-button>
</b-input-group-append>
</b-input-group> </b-input-group>
</div> </div>
<br> <br>
<div> <div>
<b-input-group id="input-group-2" label="Betrag:" label-for="input-2"> <b-input-group id="input-group-2" label="Betrag:" label-for="input-2"
<b-form-input id="input-2" size="lg"
v-model="form.amount1" class="mb-3"
>
<b-input-group-prepend>
<b-button variant="outline-primary">
<img src="img/icons/gradido/plus.png" width="50">
</b-button>
</b-input-group-prepend>
<b-form-input
id="input-2"
v-model="form.amount"
type="number" type="number"
required placeholder="0.01"
min="0" placeholder="0"> step="0.01"
</b-form-input>.<h1>GDD.</h1> min="0.01"
<b-form-input id="input-3" max="1000"
v-model="form.amount2" style="font-size: xx-large; padding-left:20px">
type="number"
min="00" placeholder="00">
</b-form-input> </b-form-input>
<b-input-group-prepend>
<b-button >
<div class="h1">GDD</div>
</b-button>
</b-input-group-prepend>
</b-input-group> </b-input-group>
<b-input-group >
<b-input-group-prepend>
<b-button >
<h1><b-icon icon="chat-right-text"></b-icon></h1>
</b-button>
</b-input-group-prepend>
<b-form-textarea v-model="form.memo"></b-form-textarea>
</b-input-group>
</div> </div>
<br> <br>
<b-button type="submit" variant="primary">jetzt versenden</b-button> <b-button type="submit" variant="primary">jetzt versenden</b-button>
<b-button type="reset" variant="danger">Cancel</b-button> <b-button type="reset" variant="danger">Cancel</b-button>
<br> <br>
</b-form> </b-form>
</p> </validation-observer>
</b-card> </b-card>
</b-collapse> </b-collapse>
</b-col> </b-col>
@ -100,8 +138,8 @@ export default {
form: { form: {
img: '', img: '',
email: '', email: '',
amount1: '', amount: '',
amount2: '' memo:''
} }
} }
}, },
@ -135,28 +173,31 @@ export default {
// ... // ...
} }
}, },
onSubmit(event) { async onSubmit() {
event.preventDefault() //event.preventDefault()
alert(JSON.stringify(this.form)) console.log("onSubmit", this.form)
this.modal = true console.log("this.form.img", this.form.img)
this.modal.h4 = 'TODO 1' console.log("this.form.email", this.form.email)
console.log("this.form.amount", this.form.amount)
console.log("this.form.memo", this.form.memo)
this.$store.state.ajaxCreateData.session_id = this.$cookies.get('gdd_session_id'),
this.$store.state.ajaxCreateData.email = this.form.email,
this.$store.state.ajaxCreateData.amount = this.form.amount,
this.$store.state.ajaxCreateData.memo = this.form.memo,
this.$store.dispatch('ajaxCreate')
}, },
onReset(event) { onReset(event) {
event.preventDefault() event.preventDefault()
// Reset our form values // Reset our form values
this.form.email = '' this.form.email = ''
this.form.amount1 = '' this.form.amount = ''
this.form.amount2 = ''
// Trick to reset/clear native browser form validation state // Trick to reset/clear native browser form validation state
this.show = false this.show = false
this.$nextTick(() => { this.$nextTick(() => {
this.show = true this.show = true
}) })
},
adressbook() {
this.modal = true
this.modaldata.h4 = 'Adressbuch'
this.modaldata.p = 'TODO ADRESSBUCH LISTE'
} }
}, },
computed: { computed: {

View File

@ -5,24 +5,21 @@
<stats-card :title="$t('site.overview.current_balance')" <stats-card :title="$t('site.overview.current_balance')"
type="gradient-red" type="gradient-red"
sub-title="balance_gdd" sub-title="balance_gdd"
img="img/icons/gradido/my_gradido.png"
class="mb-4"> class="mb-4">
{{ balance_gdd }} GDD {{ balance_gdd }} GDD
<template slot="footer"> <template slot="footer">
<span class="text-success mr-2">{{ balance_gtt }} GTT</span> <span class="text-success mr-2">Wird immer angezeigt</span>
</template> </template>
</stats-card> </stats-card>
</b-col> </b-col>
<b-col xl="6" md="6"> <b-col xl="6" md="6">
<stats-card :title="$t('site.overview.gradido_received')" <stats-card :title="$t('site.overview.gradido_received')"
type="gradient-orange" type="gradient-orange"
sub-title="2,356 GDD" :sub-title="balance_gtt"
img="img/icons/gradido/plus.png"
class="mb-4"> class="mb-4">
{{ balance_gtt }} GTT
<template slot="footer"> <template slot="footer">
<span class="text-success mr-2">+ 12.18%</span> <span class="text-nowrap">Wird nur angezeigt wenn user GTT besitzt.</span>
<span class="text-nowrap">{{ $t('site.overview.since_last_month') }}</span>
</template> </template>
</stats-card> </stats-card>
</b-col> </b-col>
@ -36,8 +33,8 @@ export default {
data(){ data(){
return { return {
balance_gdd: this.$store.state.user.balance, balance_gdd: this.$store.state.user.balance,
balance_gtt: 2000, balance_gtt: "0",
}
} }
},
}; };
</script> </script>

@ -1 +1 @@
Subproject commit 97b29601641c608113adad66e8b766f5169b32c3 Subproject commit 9b9115290c8d2ead756d64b70ae63a6571aa4693