fix(notify): add explicit save button for balance threshold
Replace blur-based auto-save with an explicit Save button so users know when their threshold is persisted. Shows success toast on save.
This commit is contained in:
@@ -19,7 +19,7 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<template v-if="notifyEnabled">
|
<template v-if="notifyEnabled">
|
||||||
<!-- Custom threshold -->
|
<!-- Custom threshold with save button -->
|
||||||
<div>
|
<div>
|
||||||
<label class="input-label">
|
<label class="input-label">
|
||||||
{{ t('profile.balanceNotify.threshold') }}
|
{{ t('profile.balanceNotify.threshold') }}
|
||||||
@@ -34,8 +34,14 @@
|
|||||||
step="0.01"
|
step="0.01"
|
||||||
class="input flex-1"
|
class="input flex-1"
|
||||||
:placeholder="systemDefaultThreshold > 0 ? `${t('profile.balanceNotify.systemDefault')} $${systemDefaultThreshold}` : t('profile.balanceNotify.thresholdPlaceholder')"
|
:placeholder="systemDefaultThreshold > 0 ? `${t('profile.balanceNotify.systemDefault')} $${systemDefaultThreshold}` : t('profile.balanceNotify.thresholdPlaceholder')"
|
||||||
@blur="handleThresholdUpdate"
|
|
||||||
/>
|
/>
|
||||||
|
<button
|
||||||
|
@click="handleThresholdUpdate"
|
||||||
|
:disabled="savingThreshold"
|
||||||
|
class="btn btn-primary btn-sm whitespace-nowrap"
|
||||||
|
>
|
||||||
|
{{ savingThreshold ? t('common.saving') : t('common.save') }}
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -152,6 +158,7 @@ const customThreshold = ref<number | null>(props.threshold)
|
|||||||
const extraEmails = ref<string[]>([...props.extraEmails])
|
const extraEmails = ref<string[]>([...props.extraEmails])
|
||||||
const pendingEmails = ref<PendingEmail[]>([])
|
const pendingEmails = ref<PendingEmail[]>([])
|
||||||
const newEmail = ref('')
|
const newEmail = ref('')
|
||||||
|
const savingThreshold = ref(false)
|
||||||
|
|
||||||
watch(() => props.enabled, (val) => { notifyEnabled.value = val })
|
watch(() => props.enabled, (val) => { notifyEnabled.value = val })
|
||||||
watch(() => props.threshold, (val) => { customThreshold.value = val })
|
watch(() => props.threshold, (val) => { customThreshold.value = val })
|
||||||
@@ -174,12 +181,16 @@ const handleToggle = async () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const handleThresholdUpdate = async () => {
|
const handleThresholdUpdate = async () => {
|
||||||
|
savingThreshold.value = true
|
||||||
try {
|
try {
|
||||||
const threshold = customThreshold.value && customThreshold.value > 0 ? customThreshold.value : 0
|
const threshold = customThreshold.value && customThreshold.value > 0 ? customThreshold.value : 0
|
||||||
const updated = await userAPI.updateProfile({ balance_notify_threshold: threshold })
|
const updated = await userAPI.updateProfile({ balance_notify_threshold: threshold })
|
||||||
authStore.user = updated
|
authStore.user = updated
|
||||||
|
appStore.showSuccess(t('common.saved'))
|
||||||
} catch (err: unknown) {
|
} catch (err: unknown) {
|
||||||
appStore.showError(extractApiErrorMessage(err, t('common.error')))
|
appStore.showError(extractApiErrorMessage(err, t('common.error')))
|
||||||
|
} finally {
|
||||||
|
savingThreshold.value = false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user