mirror of
https://github.com/YunoHost/yunohost-portal.git
synced 2024-09-03 20:06:23 +02:00
edit: remove submit button disabled state
This commit is contained in:
parent
89a50ab18f
commit
01affca1da
4 changed files with 11 additions and 26 deletions
|
@ -18,33 +18,20 @@ const attrs = computed(() => {
|
|||
props.loading === true
|
||||
? props.loadingIcon || 'loading'
|
||||
: props.loading === false
|
||||
? 'thumb-up'
|
||||
: props.icon,
|
||||
? 'thumb-up'
|
||||
: props.icon,
|
||||
iconClass: props.loading ? 'animate-spin' : '',
|
||||
...baseAttrs,
|
||||
}
|
||||
})
|
||||
|
||||
const onClick = (e: MouseEvent) => {
|
||||
if (props.loading !== null) {
|
||||
if (props.loading) {
|
||||
e.preventDefault()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<YButton
|
||||
v-bind="attrs"
|
||||
:aria-disabled="loading !== null"
|
||||
:class="{ 'btn-disabled no-animation': loading !== null }"
|
||||
type="submit"
|
||||
@click="onClick"
|
||||
/>
|
||||
<YButton v-bind="attrs" type="submit" @click="onClick" />
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.btn-disabled {
|
||||
pointer-events: unset;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -9,7 +9,7 @@ import type { Feedback } from '@/composables/form'
|
|||
const { t } = useI18n()
|
||||
|
||||
const user = await useUser()
|
||||
const loading: Ref<boolean | null> = ref(false)
|
||||
const loading: Ref<boolean> = ref(false)
|
||||
const feedback: Ref<Feedback> = ref(null)
|
||||
|
||||
const { handleSubmit, setFieldError, resetForm, meta } = useForm({
|
||||
|
@ -29,9 +29,8 @@ const { handleSubmit, setFieldError, resetForm, meta } = useForm({
|
|||
watch(
|
||||
() => meta.value.dirty,
|
||||
(value) => {
|
||||
// remove loading and feedback on edition
|
||||
// remove global feedback on edition
|
||||
if (value) {
|
||||
loading.value = null
|
||||
feedback.value = null
|
||||
}
|
||||
},
|
||||
|
@ -49,7 +48,7 @@ const onSubmit = handleSubmit(async (form) => {
|
|||
|
||||
if (error.value) {
|
||||
// Reset form dirty state but keep previous values
|
||||
resetForm({ values: form })
|
||||
resetForm({ values: { ...form, mail: user.value.mail } })
|
||||
const errData = error.value.data
|
||||
let message
|
||||
|
||||
|
@ -67,7 +66,7 @@ const onSubmit = handleSubmit(async (form) => {
|
|||
} else if (data.value) {
|
||||
Object.assign(user.value, data)
|
||||
resetForm({
|
||||
values: data.value,
|
||||
values: { ...data.value, mail: user.value.mail },
|
||||
})
|
||||
feedback.value = {
|
||||
variant: 'success',
|
||||
|
|
|
@ -7,7 +7,7 @@ import type { Feedback } from '@/composables/form'
|
|||
|
||||
const { t } = useI18n()
|
||||
|
||||
const loading: Ref<boolean | null> = ref(false)
|
||||
const loading: Ref<boolean> = ref(false)
|
||||
const feedback: Ref<Feedback> = ref(null)
|
||||
|
||||
const { handleSubmit, setFieldError, resetForm, meta } = useForm({
|
||||
|
@ -37,9 +37,8 @@ const { handleSubmit, setFieldError, resetForm, meta } = useForm({
|
|||
watch(
|
||||
() => meta.value.dirty,
|
||||
(value) => {
|
||||
// remove loading and feedback on edition
|
||||
// remove global feedback on edition
|
||||
if (value) {
|
||||
loading.value = null
|
||||
feedback.value = null
|
||||
}
|
||||
},
|
||||
|
|
|
@ -3,7 +3,7 @@ import type { Feedback } from '@/composables/form'
|
|||
|
||||
withDefaults(
|
||||
defineProps<{
|
||||
loading: boolean | null
|
||||
loading: boolean
|
||||
feedback?: Feedback
|
||||
submitVariant?: 'success' | 'warning' | 'error'
|
||||
}>(),
|
||||
|
|
Loading…
Reference in a new issue