IT4Change/Ocelot-Social
3
0
Fork 0
mirror of https://github.com/IT4Change/Ocelot-Social.git synced 2025-12-13 07:45:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Play with callbacks

Browse Source
This commit is contained in:
Wolfgang Huß 2021-01-28 13:51:26 +01:00
parent e062cbaa0c
commit 2068dd507b
3 changed files with 41 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
webapp/components/ComponentSlider/ComponentSlider.vue
View File

@ -1,19 +1,7 @@
<template> <template>
<div class="Slider"> <div class="Slider">
<!-- <h2 class="subTitle">{{ $t('login.login') + ' XXX' }}</h2> --> <!-- <h2 class="subTitle">{{ $t('login.login') + ' XXX' }}</h2> -->
<div <slot :name="activeSliderName" />
v-for="sliderName in sliders"
:key="sliderName"
:class="[
'Slider__component',
activeSliderName === sliderName && '--visible',
activeSliderName !== sliderName && '--hidden',
]"
:data-test="sliderName + '-component'"
@validation="validation(sliderName)"
>
<slot :name="sliderName" />
</div>
<base-button <base-button
style="float: right" style="float: right"
icon="check" icon="check"
@ -52,10 +40,6 @@ export default {
// }, // },
}, },
methods: { methods: {
validation(sliderName) {
console.log('validation !!!')
disabled = false
},
nextComponent() { nextComponent() {
if (this.sliderIndex < this.sliders.length - 1) { if (this.sliderIndex < this.sliders.length - 1) {
this.sliderIndex++ this.sliderIndex++
@ -71,17 +55,17 @@ export default {
// cursor: pointer; // cursor: pointer;
// } // }
.Slider { // .Slider {
&__component { // &__component {
// Wolle &:hover { // // Wolle &:hover {
// border-bottom: 2px solid #c9c6ce; // // border-bottom: 2px solid #c9c6ce;
// } // // }
// Wolle &.--visible { // // Wolle &.--visible {
// } // // }
&.--hidden { // // &.--hidden {
display: none; // // display: none;
} // // }
} // }
} // }
</style> </style>

11
webapp/components/Registration/RegistrationItemEnterInvite.vue
View File

@ -28,7 +28,9 @@
export default { export default {
name: 'RegistrationItemEnterInvite', name: 'RegistrationItemEnterInvite',
props: { props: {
validateCallback: { type: Function, required: true },
email: { type: String, required: true }, email: { type: String, required: true },
// test: { type: Boolean, required: true },
}, },
data() { data() {
return { return {
@ -49,7 +51,11 @@ export default {
}, },
methods: { methods: {
async handleInput() { async handleInput() {
this.disabled = true // Wolle this.disabled = true
console.log('handleInput !!!')
console.log('email: ', this.email)
// console.log('test: ', this.test)
this.validateCallback(false)
}, },
async handleInputValid() { async handleInputValid() {
console.log('handleInputValid !!!') console.log('handleInputValid !!!')
@ -57,7 +63,8 @@ export default {
const { nonce } = this.formData const { nonce } = this.formData
const email = this.email const email = this.email
// Wolle this.$emit('nonceEntered', { email, nonce }) // Wolle this.$emit('nonceEntered', { email, nonce })
this.$emit('validation', { email, nonce }) // this.$emit('validation', { email, nonce })
this.validateCallback(true, { email, nonce })
}, },
handleSubmitVerify() { handleSubmitVerify() {
// const { nonce } = this.formData // const { nonce } = this.formData

31
webapp/components/Registration/RegistrationSlider.vue
View File

@ -7,16 +7,24 @@
</a> </a>
</template> </template>
<h1 class="title">{{ $t('components.registration.signup.title', metadata) }}</h1> <h1 class="title">{{ $t('components.registration.signup.title', metadata) }}</h1>
<component-slider :sliders="sliders"> <component-slider :sliders="sliders" :submitCallback="submit">
<!-- <template #enter-nonce slot="{test}"> -->
<template #enter-nonce> <template #enter-nonce>
<registration-item-enter-invite email="user@example.org"> <registration-item-enter-invite
:email="'user@example.org'"
:validateCallback="validation"
>
<ds-space margin-bottom="xxx-small" margin-top="large" centered> <ds-space margin-bottom="xxx-small" margin-top="large" centered>
<nuxt-link to="/login">{{ $t('site.back-to-login') }}</nuxt-link> <nuxt-link to="/login">{{ $t('site.back-to-login') }}</nuxt-link>
</ds-space> </ds-space>
</registration-item-enter-invite> </registration-item-enter-invite>
</template> </template>
<template #create-user-account> <template #create-user-account>
<registration-item-create-user-account nonce="AAAAAA" email="user@example.org" /> <registration-item-create-user-account
nonce="AAAAAA"
email="user@example.org"
:validateCallback="validation"
/>
</template> </template>
</component-slider> </component-slider>
<template #topMenu> <template #topMenu>
@ -60,16 +68,15 @@ export default {
// }, // },
}, },
methods: { methods: {
// Wolle clear() { validation(is, data = null) {
// this.unprocessedSearchInput = '' console.log('validation: ', is, data)
// this.previousSearchTerm = '' // this.disabled = !is
// this.searchValue = '' },
// this.$emit('clearSearch') submit() {
// clearTimeout(this.searchProcess) console.log('submit !!!')
// }, },
}, },
} }
</script> </script>
<style lang="scss"> <style lang="scss"></style>
</style>