From 6fef3d057958e6f79ff369fc68267d84679ad086 Mon Sep 17 00:00:00 2001 From: negue Date: Sat, 7 Jan 2023 22:51:30 +0100 Subject: [PATCH] check for unsaved changes when pressing cancel --- .../settings/components/inlineSettingMixin.js | 20 ++++++++++++++++--- .../inlineSettings/audioThemeSetting.vue | 2 +- .../settings/inlineSettings/classSetting.vue | 8 ++++++-- .../inlineSettings/dateFormatSetting.vue | 2 +- .../dayStartAdjustmentSetting.vue | 2 +- .../settings/inlineSettings/deleteAccount.vue | 2 +- .../inlineSettings/displayNameSetting.vue | 2 +- .../inlineSettings/languageSetting.vue | 2 +- .../inlineSettings/passwordSetting.vue | 2 +- .../settings/inlineSettings/resetAccount.vue | 2 +- .../inlineSettings/userEmailSetting.vue | 2 +- .../inlineSettings/userNameSetting.vue | 2 +- website/common/locales/en/settings.json | 1 + 13 files changed, 34 insertions(+), 15 deletions(-) diff --git a/website/client/src/pages/settings/components/inlineSettingMixin.js b/website/client/src/pages/settings/components/inlineSettingMixin.js index 4886b9314a..d1009cf625 100644 --- a/website/client/src/pages/settings/components/inlineSettingMixin.js +++ b/website/client/src/pages/settings/components/inlineSettingMixin.js @@ -28,7 +28,7 @@ export const InlineSettingMixin = { openModal () { if (this.sharedState.inlineSettingAlreadyOpen) { if (this.sharedState.inlineSettingUnsavedValues) { - if (window.confirm('Are you sure? You will lose your unsaved changes.')) { + if (window.confirm(this.$t('confirmCancelChanges'))) { this._hidePrevious(); this._openIt(); } else { @@ -53,12 +53,26 @@ export const InlineSettingMixin = { this.sharedState.instanceOfCurrentlyOpened.resetControls(); this.sharedState.instanceOfCurrentlyOpened.closeModal(); }, + /** + * This is just for the cancel buttons - so that they also ask if there are unchanged values + */ + requestCloseModal () { + if (this.sharedState.inlineSettingUnsavedValues && !window.confirm(this.$t('confirmCancelChanges'))) { + return; + } + + this.resetControls(); + this.closeModal(); + }, + /** + * This is for the save methods to call it after they are done + */ closeModal () { this.modalVisible = false; this.sharedState.markAsClosed(); }, - modalValuesChanged () { - this.sharedState.inlineSettingUnsavedValues = true; + modalValuesChanged (value = true) { + this.sharedState.inlineSettingUnsavedValues = value; }, resetControls () {}, }, diff --git a/website/client/src/pages/settings/inlineSettings/audioThemeSetting.vue b/website/client/src/pages/settings/inlineSettings/audioThemeSetting.vue index 0fd7f895f5..e17ec6d947 100644 --- a/website/client/src/pages/settings/inlineSettings/audioThemeSetting.vue +++ b/website/client/src/pages/settings/inlineSettings/audioThemeSetting.vue @@ -83,7 +83,7 @@ diff --git a/website/client/src/pages/settings/inlineSettings/classSetting.vue b/website/client/src/pages/settings/inlineSettings/classSetting.vue index 0ef82aed96..e6c2a832d1 100644 --- a/website/client/src/pages/settings/inlineSettings/classSetting.vue +++ b/website/client/src/pages/settings/inlineSettings/classSetting.vue @@ -54,7 +54,7 @@ :key="classType" class="class-card" :class="{[classType]: true, selected: classType === selectedClass}" - @click="selectedClass = classType" + @click="markSelectedClass(classType)" > @@ -269,6 +269,10 @@ export default { this.resetControls(); }, methods: { + markSelectedClass (newValue) { + this.selectedClass = newValue; + this.modalValuesChanged(this.previousValue !== newValue); + }, async changeClassAndClose () { if (this.user.flags.classSelected && !window.confirm(this.$t('changeClassConfirmCost'))) { return; diff --git a/website/client/src/pages/settings/inlineSettings/dateFormatSetting.vue b/website/client/src/pages/settings/inlineSettings/dateFormatSetting.vue index cde6b7186b..5d69d21562 100644 --- a/website/client/src/pages/settings/inlineSettings/dateFormatSetting.vue +++ b/website/client/src/pages/settings/inlineSettings/dateFormatSetting.vue @@ -51,7 +51,7 @@ diff --git a/website/client/src/pages/settings/inlineSettings/dayStartAdjustmentSetting.vue b/website/client/src/pages/settings/inlineSettings/dayStartAdjustmentSetting.vue index 79f97b000f..770b12e7d3 100644 --- a/website/client/src/pages/settings/inlineSettings/dayStartAdjustmentSetting.vue +++ b/website/client/src/pages/settings/inlineSettings/dayStartAdjustmentSetting.vue @@ -71,7 +71,7 @@ diff --git a/website/client/src/pages/settings/inlineSettings/deleteAccount.vue b/website/client/src/pages/settings/inlineSettings/deleteAccount.vue index 7b5dd9944d..097b6f4a66 100644 --- a/website/client/src/pages/settings/inlineSettings/deleteAccount.vue +++ b/website/client/src/pages/settings/inlineSettings/deleteAccount.vue @@ -63,7 +63,7 @@ primary-button-color="btn-danger" primary-button-label="deleteAccount" @saveClicked="deleteAccount()" - @cancelClicked="closeModal()" + @cancelClicked="requestCloseModal()" /> diff --git a/website/client/src/pages/settings/inlineSettings/displayNameSetting.vue b/website/client/src/pages/settings/inlineSettings/displayNameSetting.vue index 5dc714e2b4..ba48d89a78 100644 --- a/website/client/src/pages/settings/inlineSettings/displayNameSetting.vue +++ b/website/client/src/pages/settings/inlineSettings/displayNameSetting.vue @@ -73,7 +73,7 @@ diff --git a/website/client/src/pages/settings/inlineSettings/languageSetting.vue b/website/client/src/pages/settings/inlineSettings/languageSetting.vue index e3d3fbda0d..526e157741 100644 --- a/website/client/src/pages/settings/inlineSettings/languageSetting.vue +++ b/website/client/src/pages/settings/inlineSettings/languageSetting.vue @@ -63,7 +63,7 @@ diff --git a/website/client/src/pages/settings/inlineSettings/passwordSetting.vue b/website/client/src/pages/settings/inlineSettings/passwordSetting.vue index c6010a16e8..9a90a550dd 100644 --- a/website/client/src/pages/settings/inlineSettings/passwordSetting.vue +++ b/website/client/src/pages/settings/inlineSettings/passwordSetting.vue @@ -55,7 +55,7 @@ diff --git a/website/client/src/pages/settings/inlineSettings/resetAccount.vue b/website/client/src/pages/settings/inlineSettings/resetAccount.vue index 6383814612..c376d7fe25 100644 --- a/website/client/src/pages/settings/inlineSettings/resetAccount.vue +++ b/website/client/src/pages/settings/inlineSettings/resetAccount.vue @@ -69,7 +69,7 @@ primary-button-color="btn-danger" primary-button-label="resetAccount" @saveClicked="reset()" - @cancelClicked="closeModal()" + @cancelClicked="requestCloseModal()" /> diff --git a/website/client/src/pages/settings/inlineSettings/userEmailSetting.vue b/website/client/src/pages/settings/inlineSettings/userEmailSetting.vue index 14f51d21fb..5480cc8c47 100644 --- a/website/client/src/pages/settings/inlineSettings/userEmailSetting.vue +++ b/website/client/src/pages/settings/inlineSettings/userEmailSetting.vue @@ -52,7 +52,7 @@ diff --git a/website/client/src/pages/settings/inlineSettings/userNameSetting.vue b/website/client/src/pages/settings/inlineSettings/userNameSetting.vue index 6789d870df..2254119cc9 100644 --- a/website/client/src/pages/settings/inlineSettings/userNameSetting.vue +++ b/website/client/src/pages/settings/inlineSettings/userNameSetting.vue @@ -48,7 +48,7 @@ diff --git a/website/common/locales/en/settings.json b/website/common/locales/en/settings.json index a95a4ad897..d065ebfade 100644 --- a/website/common/locales/en/settings.json +++ b/website/common/locales/en/settings.json @@ -1,6 +1,7 @@ { "settings": "Settings", "generalSettings": "General Settings", + "confirmCancelChanges": "Are you sure? You will lose your unsaved changes.", "account": "Account", "loginMethods": "Login Methods", "character": "Character",