diff --git a/src/client/app/admin/views/announcements.vue b/src/client/app/admin/views/announcements.vue index 8fc8ad4ceb..b0e5448cf9 100644 --- a/src/client/app/admin/views/announcements.vue +++ b/src/client/app/admin/views/announcements.vue @@ -52,8 +52,8 @@ export default Vue.extend({ type: 'warning', text: this.$t('_remove.are-you-sure').replace('$1', this.announcements.find((_, j) => j == i).title), showCancelButton: true - }).then(res => { - if (!res) return; + }).then(({ canceled }) => { + if (canceled) return; this.announcements = this.announcements.filter((_, j) => j !== i); this.save(true); this.$root.dialog({ diff --git a/src/client/app/admin/views/emoji.vue b/src/client/app/admin/views/emoji.vue index 0dcc421613..0819a07546 100644 --- a/src/client/app/admin/views/emoji.vue +++ b/src/client/app/admin/views/emoji.vue @@ -120,8 +120,8 @@ export default Vue.extend({ type: 'warning', text: this.$t('remove-emoji.are-you-sure').replace('$1', emoji.name), showCancelButton: true - }).then(res => { - if (!res) return; + }).then(({ canceled }) => { + if (canceled) return; this.$root.api('admin/emoji/remove', { id: emoji.id diff --git a/src/client/app/common/views/components/api-settings.vue b/src/client/app/common/views/components/api-settings.vue index 062218b3f4..e96eb28d93 100644 --- a/src/client/app/common/views/components/api-settings.vue +++ b/src/client/app/common/views/components/api-settings.vue @@ -50,10 +50,13 @@ export default Vue.extend({ methods: { regenerateToken() { - this.$input({ + this.$root.dialog({ title: this.$t('enter-password'), - type: 'password' - }).then(password => { + input: { + type: 'password' + } + }).then(({ canceled, result: password }) => { + if (canceled) return; this.$root.api('i/regenerate_token', { password: password }); diff --git a/src/client/app/common/views/components/dialog.vue b/src/client/app/common/views/components/dialog.vue index abbdb8536e..5cc885881b 100644 --- a/src/client/app/common/views/components/dialog.vue +++ b/src/client/app/common/views/components/dialog.vue @@ -2,15 +2,17 @@
-
+
+ + @ - OK - Cancel + OK + Cancel
@@ -20,6 +22,7 @@ import Vue from 'vue'; import * as anime from 'animejs'; import { faTimesCircle, faQuestionCircle } from '@fortawesome/free-regular-svg-icons'; +import parseAcct from "../../../../../misc/acct/parse"; export default Vue.extend({ props: { @@ -36,9 +39,15 @@ export default Vue.extend({ type: String, required: false }, + input: { + required: false + }, select: { required: false }, + user: { + required: false + }, showCancelButton: { type: Boolean, default: false @@ -51,6 +60,8 @@ export default Vue.extend({ data() { return { + inputValue: this.input && this.input.default ? this.input.default : null, + userInputValue: null, selectedValue: null }; }, @@ -94,10 +105,21 @@ export default Vue.extend({ }, methods: { - ok() { - const result = this.select ? this.selectedValue : true; - this.$emit('ok', result); - this.close(); + async ok() { + if (this.user) { + const user = await this.$root.api('users/show', parseAcct(this.userInputValue)); + if (user) { + this.$emit('ok', user); + this.close(); + } + } else { + const result = + this.input ? this.inputValue : + this.select ? this.selectedValue : + true; + this.$emit('ok', result); + this.close(); + } }, cancel() { @@ -127,6 +149,14 @@ export default Vue.extend({ onBgClick() { this.cancel(); + }, + + onInputKeydown(e) { + if (e.which == 13) { // Enter + e.preventDefault(); + e.stopPropagation(); + this.ok(); + } } } }); diff --git a/src/client/app/common/views/components/games/reversi/reversi.index.vue b/src/client/app/common/views/components/games/reversi/reversi.index.vue index b82a60a360..07472998de 100644 --- a/src/client/app/common/views/components/games/reversi/reversi.index.vue +++ b/src/client/app/common/views/components/games/reversi/reversi.index.vue @@ -99,23 +99,22 @@ export default Vue.extend({ this.$emit('go', game); }, - match() { - this.$input({ - title: this.$t('enter-username') - }).then(username => { - this.$root.api('users/show', { - username - }).then(user => { - this.$root.api('games/reversi/match', { - userId: user.id - }).then(res => { - if (res == null) { - this.$emit('matching', user); - } else { - this.$emit('go', res); - } - }); - }); + async match() { + const { result: user } = await this.$root.dialog({ + title: this.$t('enter-username'), + user: { + local: true + } + }); + if (user == null) return; + this.$root.api('games/reversi/match', { + userId: user.id + }).then(res => { + if (res == null) { + this.$emit('matching', user); + } else { + this.$emit('go', res); + } }); }, diff --git a/src/client/app/common/views/components/note-menu.vue b/src/client/app/common/views/components/note-menu.vue index c4b1a02fee..b8f34beb0c 100644 --- a/src/client/app/common/views/components/note-menu.vue +++ b/src/client/app/common/views/components/note-menu.vue @@ -99,8 +99,8 @@ export default Vue.extend({ type: 'warning', text: this.$t('delete-confirm'), showCancelButton: true - }).then(res => { - if (!res) return; + }).then(({ canceled }) => { + if (canceled) return; this.$root.api('notes/delete', { noteId: this.note.id diff --git a/src/client/app/common/views/components/password-settings.vue b/src/client/app/common/views/components/password-settings.vue index d41b5a5bd1..bcea32576f 100644 --- a/src/client/app/common/views/components/password-settings.vue +++ b/src/client/app/common/views/components/password-settings.vue @@ -11,34 +11,43 @@ import i18n from '../../../i18n'; export default Vue.extend({ i18n: i18n('common/views/components/password-settings.vue'), methods: { - reset() { - this.$input({ + async reset() { + const { canceled: canceled1, result: currentPassword } = await this.$root.dialog({ title: this.$t('enter-current-password'), - type: 'password' - }).then(currentPassword => { - this.$input({ - title: this.$t('enter-new-password'), + input: { type: 'password' - }).then(newPassword => { - this.$input({ - title: this.$t('enter-new-password-again'), - type: 'password' - }).then(newPassword2 => { - if (newPassword !== newPassword2) { - this.$root.dialog({ - title: null, - text: this.$t('not-match') - }); - return; - } - this.$root.api('i/change_password', { - currentPasword: currentPassword, - newPassword: newPassword - }).then(() => { - this.$notify(this.$t('changed')); - }); - }); + } + }); + if (canceled1) return; + + const { canceled: canceled2, result: newPassword } = await this.$root.dialog({ + title: this.$t('enter-new-password'), + input: { + type: 'password' + } + }); + if (canceled2) return; + + const { canceled: canceled3, result: newPassword2 } = await this.$root.dialog({ + title: this.$t('enter-new-password-again'), + input: { + type: 'password' + } + }); + if (canceled3) return; + + if (newPassword !== newPassword2) { + this.$root.dialog({ + title: null, + text: this.$t('not-match') }); + return; + } + this.$root.api('i/change_password', { + currentPasword: currentPassword, + newPassword: newPassword + }).then(() => { + this.$notify(this.$t('changed')); }); } } diff --git a/src/client/app/common/views/components/profile-editor.vue b/src/client/app/common/views/components/profile-editor.vue index 80c322fa9e..b402f046b1 100644 --- a/src/client/app/common/views/components/profile-editor.vue +++ b/src/client/app/common/views/components/profile-editor.vue @@ -222,10 +222,13 @@ export default Vue.extend({ }, updateEmail() { - this.$input({ + this.$root.dialog({ title: this.$t('@.enter-password'), - type: 'password' - }).then(password => { + input: { + type: 'password' + } + }).then(({ canceled, result: password }) => { + if (canceled) return; this.$root.api('i/update_email', { password: password, email: this.email == '' ? null : this.email diff --git a/src/client/app/common/views/components/ui/input.vue b/src/client/app/common/views/components/ui/input.vue index 4d77810b47..d735cc1c2f 100644 --- a/src/client/app/common/views/components/ui/input.vue +++ b/src/client/app/common/views/components/ui/input.vue @@ -14,17 +14,19 @@ :disabled="disabled" :required="required" :readonly="readonly" + :placeholder="placeholder" :pattern="pattern" :autocomplete="autocomplete" :spellcheck="spellcheck" @focus="focused = true" @blur="focused = false" + @keydown="$emit('keydown', $event)" >