mirror of
https://github.com/YunoHost/yunohost-admin.git
synced 2024-09-03 20:06:15 +02:00
79 lines
1.8 KiB
Vue
79 lines
1.8 KiB
Vue
<template>
|
|
<div>
|
|
<BCardBody>
|
|
<slot name="disclaimer" />
|
|
|
|
<BForm
|
|
:id="id" :inline="inline" :class="formClasses"
|
|
@submit.prevent="onSubmit" novalidate
|
|
>
|
|
<slot name="default" />
|
|
|
|
<slot name="server-error" v-bind="{ errorFeedback }">
|
|
<BAlert
|
|
v-if="errorFeedback"
|
|
variant="danger" class="my-3" icon="ban"
|
|
>
|
|
<div v-html="errorFeedback" />
|
|
</BAlert>
|
|
</slot>
|
|
</BForm>
|
|
</BCardBody>
|
|
|
|
<BCardFooter v-if="!noFooter">
|
|
<slot name="footer">
|
|
<BButton type="submit" variant="success" :form="id">
|
|
{{ submitText || $t('save') }}
|
|
</BButton>
|
|
</slot>
|
|
</BCardFooter>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'AbstractForm',
|
|
|
|
props: {
|
|
id: { type: String, default: 'ynh-form' },
|
|
submitText: { type: String, default: null },
|
|
validation: { type: Object, default: null },
|
|
serverError: { type: String, default: '' },
|
|
inline: { type: Boolean, default: false },
|
|
formClasses: { type: [Array, String, Object], default: null },
|
|
noFooter: { type: Boolean, default: false }
|
|
},
|
|
|
|
computed: {
|
|
errorFeedback () {
|
|
if (this.serverError) return this.serverError
|
|
else if (this.validation && this.validation.$anyError) {
|
|
return this.$i18n.t('form_errors.invalid_form')
|
|
} else return ''
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
onSubmit (e) {
|
|
const v = this.validation
|
|
if (v) {
|
|
v.$touch()
|
|
if (v.$pending || v.$invalid) return
|
|
}
|
|
this.$emit('submit', e)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.card-footer {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
align-items: center;
|
|
|
|
& > *:not(:first-child) {
|
|
margin-left: .5rem;
|
|
}
|
|
}
|
|
</style>
|