From 0638b6cb69670b50e38f34d37008a590648aa787 Mon Sep 17 00:00:00 2001 From: MeiMei <30769358+mei23@users.noreply.github.com> Date: Thu, 22 Aug 2019 18:33:50 +0900 Subject: [PATCH] =?UTF-8?q?Room=E3=81=A7=E6=9C=AA=E4=BF=9D=E5=AD=98?= =?UTF-8?q?=E8=AD=A6=E5=91=8A=E3=83=80=E3=82=A4=E3=82=A2=E3=83=AD=E3=82=B0?= =?UTF-8?q?=E3=81=AA=E3=81=A9=E3=82=92=E8=BF=BD=E5=8A=A0=20(#5332)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Room保存時にダイアログを表示するように * Roomから移動するときに未保存ならば警告するように --- locales/ja-JP.yml | 2 + .../app/common/views/pages/room/room.vue | 52 ++++++++++++++++++- 2 files changed, 53 insertions(+), 1 deletion(-) diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index 31d51c25fc..70192a55c7 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -2300,8 +2300,10 @@ room: exit: "戻る" remove: "しまう" save: "保存" + saved: "保存しました" clear: "片付け" clear-confirm: "全ての家具をしまいますか?" + leave-confirm: "未保存の変更があります、移動しますか?" chooseImage: "画像を選択" room-type: "部屋のタイプ" carpet-color: "床の色" diff --git a/src/client/app/common/views/pages/room/room.vue b/src/client/app/common/views/pages/room/room.vue index 2456f8f8e8..1e81920c22 100644 --- a/src/client/app/common/views/pages/room/room.vue +++ b/src/client/app/common/views/pages/room/room.vue @@ -42,7 +42,7 @@
- {{ $t('save') }} + {{ $t('save') }} {{ $t('clear') }}
@@ -87,11 +87,14 @@ export default Vue.extend({ isTranslateMode: false, isRotateMode: false, isMyRoom: false, + changed: false, faBoxOpen, faSave, faTrashAlt, faUndo, faArrowsAlt, faBan, faBroom, }; }, async mounted() { + window.addEventListener('beforeunload', this.beforeunload); + const user = await this.$root.api('users/show', { ...parseAcct(this.acct) }); @@ -125,11 +128,37 @@ export default Vue.extend({ }); }, + beforeRouteLeave(to, from, next) { + if (this.changed) { + this.$root.dialog({ + type: 'warning', + text: this.$t('leave-confirm'), + showCancelButton: true + }).then(({ canceled }) => { + if (canceled) { + next(false); + } else { + next(); + } + }); + } else { + next(); + } + }, + beforeDestroy() { room.destroy(); + window.removeEventListener('beforeunload', this.beforeunload); }, methods: { + beforeunload(e: BeforeUnloadEvent) { + if (this.changed) { + e.preventDefault(); + e.returnValue = ''; + } + }, + async add() { const { canceled, result: id } = await this.$root.dialog({ type: null, @@ -143,17 +172,30 @@ export default Vue.extend({ }); if (canceled) return; room.addFurniture(id); + this.changed = true; }, remove() { this.isTranslateMode = false; this.isRotateMode = false; room.removeFurniture(); + this.changed = true; }, save() { this.$root.api('room/update', { room: room.getRoomInfo() + }).then(() => { + this.changed = false; + this.$root.dialog({ + type: 'success', + text: this.$t('saved') + }); + }).catch((e: any) => { + this.$root.dialog({ + type: 'error', + text: e.message + }); }); }, @@ -165,6 +207,7 @@ export default Vue.extend({ }).then(({ canceled }) => { if (canceled) return; room.removeAllFurnitures(); + this.changed = true; }); }, @@ -174,22 +217,26 @@ export default Vue.extend({ }).then(file => { room.updateProp(key, `/proxy/?${urlQuery({ url: file.thumbnailUrl })}`); this.$refs.preview.selected(room.getSelectedObject()); + this.changed = true; }); }, updateColor(key, ev) { room.updateProp(key, ev.target.value); this.$refs.preview.selected(room.getSelectedObject()); + this.changed = true; }, updateCarpetColor(ev) { room.updateCarpetColor(ev.target.value); this.carpetColor = ev.target.value; + this.changed = true; }, updateRoomType(type) { room.changeRoomType(type); this.roomType = type; + this.changed = true; }, translate() { @@ -200,6 +247,7 @@ export default Vue.extend({ this.isTranslateMode = true; room.enterTransformMode('translate'); } + this.changed = true; }, rotate() { @@ -210,12 +258,14 @@ export default Vue.extend({ this.isRotateMode = true; room.enterTransformMode('rotate'); } + this.changed = true; }, exit() { this.isTranslateMode = false; this.isRotateMode = false; room.exitTransformMode(); + this.changed = true; } } });