From 3d4fccef457babe88c0bb4e6b470c30e03ae266e Mon Sep 17 00:00:00 2001 From: syuilo <syuilotan@yahoo.co.jp> Date: Thu, 22 Feb 2018 01:25:57 +0900 Subject: [PATCH] wip --- src/web/app/common/views/components/index.ts | 2 + .../app/desktop/scripts/password-dialog.ts | 11 ----- .../views/components/password-setting.vue | 37 --------------- .../{2fa-setting.vue => settings.2fa.vue} | 28 ++++++----- .../{mute-setting.vue => settings.mute.vue} | 4 +- .../views/components/settings.password.vue | 47 +++++++++++++++++++ .../app/desktop/views/components/settings.vue | 14 ++++-- .../views/components/widgets/access-log.vue | 1 + 8 files changed, 78 insertions(+), 66 deletions(-) delete mode 100644 src/web/app/desktop/scripts/password-dialog.ts delete mode 100644 src/web/app/desktop/views/components/password-setting.vue rename src/web/app/desktop/views/components/{2fa-setting.vue => settings.2fa.vue} (68%) rename src/web/app/desktop/views/components/{mute-setting.vue => settings.mute.vue} (92%) create mode 100644 src/web/app/desktop/views/components/settings.password.vue diff --git a/src/web/app/common/views/components/index.ts b/src/web/app/common/views/components/index.ts index a61022dbe0..bde313910e 100644 --- a/src/web/app/common/views/components/index.ts +++ b/src/web/app/common/views/components/index.ts @@ -17,6 +17,7 @@ import ellipsis from './ellipsis.vue'; import messaging from './messaging.vue'; import messagingRoom from './messaging-room.vue'; import urlPreview from './url-preview.vue'; +import twitterSetting from './twitter-setting.vue'; Vue.component('mk-signin', signin); Vue.component('mk-signup', signup); @@ -35,3 +36,4 @@ Vue.component('mk-ellipsis', ellipsis); Vue.component('mk-messaging', messaging); Vue.component('mk-messaging-room', messagingRoom); Vue.component('mk-url-preview', urlPreview); +Vue.component('mk-twitter-setting', twitterSetting); diff --git a/src/web/app/desktop/scripts/password-dialog.ts b/src/web/app/desktop/scripts/password-dialog.ts deleted file mode 100644 index 39d7f3db7a..0000000000 --- a/src/web/app/desktop/scripts/password-dialog.ts +++ /dev/null @@ -1,11 +0,0 @@ -import * as riot from 'riot'; - -export default (title, onOk, onCancel) => { - const dialog = document.body.appendChild(document.createElement('mk-input-dialog')); - return (riot as any).mount(dialog, { - title: title, - type: 'password', - onOk: onOk, - onCancel: onCancel - }); -}; diff --git a/src/web/app/desktop/views/components/password-setting.vue b/src/web/app/desktop/views/components/password-setting.vue deleted file mode 100644 index 883a494cce..0000000000 --- a/src/web/app/desktop/views/components/password-setting.vue +++ /dev/null @@ -1,37 +0,0 @@ -<template> -<div> - <button @click="reset" class="ui primary">%i18n:desktop.tags.mk-password-setting.reset%</button> -</div> -</template> - -<script lang="ts"> -import Vue from 'vue'; -import passwordDialog from '../../scripts/password-dialog'; -import dialog from '../../scripts/dialog'; -import notify from '../../scripts/notify'; - -export default Vue.extend({ - methods: { - reset() { - passwordDialog('%i18n:desktop.tags.mk-password-setting.enter-current-password%', currentPassword => { - passwordDialog('%i18n:desktop.tags.mk-password-setting.enter-new-password%', newPassword => { - passwordDialog('%i18n:desktop.tags.mk-password-setting.enter-new-password-again%', newPassword2 => { - if (newPassword !== newPassword2) { - dialog(null, '%i18n:desktop.tags.mk-password-setting.not-match%', [{ - text: 'OK' - }]); - return; - } - (this as any).api('i/change_password', { - current_password: currentPassword, - new_password: newPassword - }).then(() => { - notify('%i18n:desktop.tags.mk-password-setting.changed%'); - }); - }); - }); - }); - } - } -}); -</script> diff --git a/src/web/app/desktop/views/components/2fa-setting.vue b/src/web/app/desktop/views/components/settings.2fa.vue similarity index 68% rename from src/web/app/desktop/views/components/2fa-setting.vue rename to src/web/app/desktop/views/components/settings.2fa.vue index 8271cbbf36..87783e799d 100644 --- a/src/web/app/desktop/views/components/2fa-setting.vue +++ b/src/web/app/desktop/views/components/settings.2fa.vue @@ -1,16 +1,16 @@ <template> -<div class="mk-2fa-setting"> +<div class="2fa"> <p>%i18n:desktop.tags.mk-2fa-setting.intro%<a href="%i18n:desktop.tags.mk-2fa-setting.url%" target="_blank">%i18n:desktop.tags.mk-2fa-setting.detail%</a></p> <div class="ui info warn"><p>%fa:exclamation-triangle%%i18n:desktop.tags.mk-2fa-setting.caution%</p></div> - <p v-if="!data && !I.two_factor_enabled"><button @click="register" class="ui primary">%i18n:desktop.tags.mk-2fa-setting.register%</button></p> - <template v-if="I.two_factor_enabled"> + <p v-if="!data && !os.i.two_factor_enabled"><button @click="register" class="ui primary">%i18n:desktop.tags.mk-2fa-setting.register%</button></p> + <template v-if="os.i.two_factor_enabled"> <p>%i18n:desktop.tags.mk-2fa-setting.already-registered%</p> <button @click="unregister" class="ui">%i18n:desktop.tags.mk-2fa-setting.unregister%</button> </template> <div v-if="data"> <ol> <li>%i18n:desktop.tags.mk-2fa-setting.authenticator% <a href="https://support.google.com/accounts/answer/1066447" target="_blank">%i18n:desktop.tags.mk-2fa-setting.howtoinstall%</a></li> - <li>%i18n:desktop.tags.mk-2fa-setting.scan%<br><img src={ data.qr }></li> + <li>%i18n:desktop.tags.mk-2fa-setting.scan%<br><img :src="data.qr"></li> <li>%i18n:desktop.tags.mk-2fa-setting.done%<br> <input type="number" v-model="token" class="ui"> <button @click="submit" class="ui primary">%i18n:desktop.tags.mk-2fa-setting.submit%</button> @@ -23,8 +23,6 @@ <script lang="ts"> import Vue from 'vue'; -import passwordDialog from '../../scripts/password-dialog'; -import notify from '../../scripts/notify'; export default Vue.extend({ data() { @@ -35,7 +33,10 @@ export default Vue.extend({ }, methods: { register() { - passwordDialog('%i18n:desktop.tags.mk-2fa-setting.enter-password%', password => { + (this as any).apis.input({ + title: '%i18n:desktop.tags.mk-2fa-setting.enter-password%', + type: 'password' + }).then(password => { (this as any).api('i/2fa/register', { password: password }).then(data => { @@ -45,11 +46,14 @@ export default Vue.extend({ }, unregister() { - passwordDialog('%i18n:desktop.tags.mk-2fa-setting.enter-password%', password => { + (this as any).apis.input({ + title: '%i18n:desktop.tags.mk-2fa-setting.enter-password%', + type: 'password' + }).then(password => { (this as any).api('i/2fa/unregister', { password: password }).then(() => { - notify('%i18n:desktop.tags.mk-2fa-setting.unregistered%'); + (this as any).apis.notify('%i18n:desktop.tags.mk-2fa-setting.unregistered%'); (this as any).os.i.two_factor_enabled = false; }); }); @@ -59,10 +63,10 @@ export default Vue.extend({ (this as any).api('i/2fa/done', { token: this.token }).then(() => { - notify('%i18n:desktop.tags.mk-2fa-setting.success%'); + (this as any).apis.notify('%i18n:desktop.tags.mk-2fa-setting.success%'); (this as any).os.i.two_factor_enabled = true; }).catch(() => { - notify('%i18n:desktop.tags.mk-2fa-setting.failed%'); + (this as any).apis.notify('%i18n:desktop.tags.mk-2fa-setting.failed%'); }); } } @@ -70,7 +74,7 @@ export default Vue.extend({ </script> <style lang="stylus" scoped> -.mk-2fa-setting +.2fa color #4a535a </style> diff --git a/src/web/app/desktop/views/components/mute-setting.vue b/src/web/app/desktop/views/components/settings.mute.vue similarity index 92% rename from src/web/app/desktop/views/components/mute-setting.vue rename to src/web/app/desktop/views/components/settings.mute.vue index fe78401af9..0768b54ef8 100644 --- a/src/web/app/desktop/views/components/mute-setting.vue +++ b/src/web/app/desktop/views/components/settings.mute.vue @@ -1,5 +1,5 @@ <template> -<div class="mk-mute-setting"> +<div> <div class="none ui info" v-if="!fetching && users.length == 0"> <p>%fa:info-circle%%i18n:desktop.tags.mk-mute-setting.no-users%</p> </div> @@ -18,7 +18,7 @@ export default Vue.extend({ data() { return { fetching: true, - users: null + users: [] }; }, mounted() { diff --git a/src/web/app/desktop/views/components/settings.password.vue b/src/web/app/desktop/views/components/settings.password.vue new file mode 100644 index 0000000000..be3f0370d6 --- /dev/null +++ b/src/web/app/desktop/views/components/settings.password.vue @@ -0,0 +1,47 @@ +<template> +<div> + <button @click="reset" class="ui primary">%i18n:desktop.tags.mk-password-setting.reset%</button> +</div> +</template> + +<script lang="ts"> +import Vue from 'vue'; + +export default Vue.extend({ + methods: { + reset() { + (this as any).apis.input({ + title: '%i18n:desktop.tags.mk-password-setting.enter-current-password%', + type: 'password' + }).then(currentPassword => { + (this as any).apis.input({ + title: '%i18n:desktop.tags.mk-password-setting.enter-new-password%', + type: 'password' + }).then(newPassword => { + (this as any).apis.input({ + title: '%i18n:desktop.tags.mk-password-setting.enter-new-password-again%', + type: 'password' + }).then(newPassword2 => { + if (newPassword !== newPassword2) { + (this as any).apis.dialog({ + title: null, + text: '%i18n:desktop.tags.mk-password-setting.not-match%', + actions: [{ + text: 'OK' + }] + }); + return; + } + (this as any).api('i/change_password', { + current_password: currentPassword, + new_password: newPassword + }).then(() => { + (this as any).apis.notify('%i18n:desktop.tags.mk-password-setting.changed%'); + }); + }); + }); + }); + } + } +}); +</script> diff --git a/src/web/app/desktop/views/components/settings.vue b/src/web/app/desktop/views/components/settings.vue index 148e11ed2a..b36698b647 100644 --- a/src/web/app/desktop/views/components/settings.vue +++ b/src/web/app/desktop/views/components/settings.vue @@ -30,7 +30,7 @@ <section class="mute" v-show="page == 'mute'"> <h1>%i18n:desktop.tags.mk-settings.mute%</h1> - <mk-mute-setting/> + <x-mute/> </section> <section class="apps" v-show="page == 'apps'"> @@ -45,12 +45,12 @@ <section class="password" v-show="page == 'security'"> <h1>%i18n:desktop.tags.mk-settings.password%</h1> - <mk-password-setting/> + <x-password/> </section> <section class="2fa" v-show="page == 'security'"> <h1>%i18n:desktop.tags.mk-settings.2fa%</h1> - <mk-2fa-setting/> + <x-2fa/> </section> <section class="signin" v-show="page == 'security'"> @@ -74,10 +74,16 @@ <script lang="ts"> import Vue from 'vue'; import XProfile from './settings.profile.vue'; +import XMute from './settings.mute.vue'; +import XPassword from './settings.password.vue'; +import X2fa from './settings.2fa.vue'; export default Vue.extend({ components: { - XProfile + XProfile, + XMute, + XPassword, + X2fa }, data() { return { diff --git a/src/web/app/desktop/views/components/widgets/access-log.vue b/src/web/app/desktop/views/components/widgets/access-log.vue index ad0a22829d..a04da1daaf 100644 --- a/src/web/app/desktop/views/components/widgets/access-log.vue +++ b/src/web/app/desktop/views/components/widgets/access-log.vue @@ -100,6 +100,7 @@ export default define({ > .ip margin-right 4px + padding 0 4px > b margin-right 4px