summaryrefslogtreecommitdiff
path: root/src/web/app
diff options
context:
space:
mode:
Diffstat (limited to 'src/web/app')
-rw-r--r--src/web/app/common/-tags/authorized-apps.tag34
-rw-r--r--src/web/app/common/-tags/signin-history.tag116
-rw-r--r--src/web/app/desktop/views/components/settings.apps.vue39
-rw-r--r--src/web/app/desktop/views/components/settings.signins.vue98
-rw-r--r--src/web/app/desktop/views/components/settings.vue10
-rw-r--r--src/web/app/init.ts2
6 files changed, 146 insertions, 153 deletions
diff --git a/src/web/app/common/-tags/authorized-apps.tag b/src/web/app/common/-tags/authorized-apps.tag
deleted file mode 100644
index ed1570650a..0000000000
--- a/src/web/app/common/-tags/authorized-apps.tag
+++ /dev/null
@@ -1,34 +0,0 @@
-<mk-authorized-apps>
- <div class="none ui info" v-if="!fetching && apps.length == 0">
- <p>%fa:info-circle%%i18n:common.tags.mk-authorized-apps.no-apps%</p>
- </div>
- <div class="apps" v-if="apps.length != 0">
- <div each={ app in apps }>
- <p><b>{ app.name }</b></p>
- <p>{ app.description }</p>
- </div>
- </div>
- <style lang="stylus" scoped>
- :scope
- display block
-
- > .apps
- > div
- padding 16px 0 0 0
- border-bottom solid 1px #eee
-
- </style>
- <script lang="typescript">
- this.mixin('api');
-
- this.apps = [];
- this.fetching = true;
-
- this.on('mount', () => {
- this.$root.$data.os.api('i/authorized_apps').then(apps => {
- this.apps = apps;
- this.fetching = false;
- });
- });
- </script>
-</mk-authorized-apps>
diff --git a/src/web/app/common/-tags/signin-history.tag b/src/web/app/common/-tags/signin-history.tag
deleted file mode 100644
index a347c7c235..0000000000
--- a/src/web/app/common/-tags/signin-history.tag
+++ /dev/null
@@ -1,116 +0,0 @@
-<mk-signin-history>
- <div class="records" v-if="history.length != 0">
- <mk-signin-record each={ rec in history } rec={ rec }/>
- </div>
- <style lang="stylus" scoped>
- :scope
- display block
-
- </style>
- <script lang="typescript">
- this.mixin('i');
- this.mixin('api');
-
- this.mixin('stream');
- this.connection = this.stream.getConnection();
- this.connectionId = this.stream.use();
-
- this.history = [];
- this.fetching = true;
-
- this.on('mount', () => {
- this.$root.$data.os.api('i/signin_history').then(history => {
- this.update({
- fetching: false,
- history: history
- });
- });
-
- this.connection.on('signin', this.onSignin);
- });
-
- this.on('unmount', () => {
- this.connection.off('signin', this.onSignin);
- this.stream.dispose(this.connectionId);
- });
-
- this.onSignin = signin => {
- this.history.unshift(signin);
- this.update();
- };
- </script>
-</mk-signin-history>
-
-<mk-signin-record>
- <header @click="toggle">
- <template v-if="rec.success">%fa:check%</template>
- <template v-if="!rec.success">%fa:times%</template>
- <span class="ip">{ rec.ip }</span>
- <mk-time time={ rec.created_at }/>
- </header>
- <pre ref="headers" class="json" show={ show }>{ JSON.stringify(rec.headers, null, 2) }</pre>
-
- <style lang="stylus" scoped>
- :scope
- display block
- border-bottom solid 1px #eee
-
- > header
- display flex
- padding 8px 0
- line-height 32px
- cursor pointer
-
- > [data-fa]
- margin-right 8px
- text-align left
-
- &.check
- color #0fda82
-
- &.times
- color #ff3100
-
- > .ip
- display inline-block
- text-align left
- padding 8px
- line-height 16px
- font-family monospace
- font-size 14px
- color #444
- background #f8f8f8
- border-radius 4px
-
- > mk-time
- margin-left auto
- text-align right
- color #777
-
- > pre
- overflow auto
- margin 0 0 16px 0
- max-height 100px
- white-space pre-wrap
- word-break break-all
- color #4a535a
-
- </style>
-
- <script lang="typescript">
- import hljs from 'highlight.js';
-
- this.rec = this.opts.rec;
- this.show = false;
-
- this.on('mount', () => {
- hljs.highlightBlock(this.$refs.headers);
- });
-
- this.toggle = () => {
- this.update({
- show: !this.show
- });
- };
- </script>
-</mk-signin-record>
diff --git a/src/web/app/desktop/views/components/settings.apps.vue b/src/web/app/desktop/views/components/settings.apps.vue
new file mode 100644
index 0000000000..0503b03abd
--- /dev/null
+++ b/src/web/app/desktop/views/components/settings.apps.vue
@@ -0,0 +1,39 @@
+<template>
+<div class="root">
+ <div class="none ui info" v-if="!fetching && apps.length == 0">
+ <p>%fa:info-circle%%i18n:common.tags.mk-authorized-apps.no-apps%</p>
+ </div>
+ <div class="apps" v-if="apps.length != 0">
+ <div v-for="app in apps">
+ <p><b>{{ app.name }}</b></p>
+ <p>{{ app.description }}</p>
+ </div>
+ </div>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+export default Vue.extend({
+ data() {
+ return {
+ fetching: true,
+ apps: []
+ };
+ },
+ mounted() {
+ (this as any).api('i/authorized_apps').then(apps => {
+ this.apps = apps;
+ this.fetching = false;
+ });
+ }
+});
+</script>
+
+<style lang="stylus" scoped>
+.root
+ > .apps
+ > div
+ padding 16px 0 0 0
+ border-bottom solid 1px #eee
+</style>
diff --git a/src/web/app/desktop/views/components/settings.signins.vue b/src/web/app/desktop/views/components/settings.signins.vue
new file mode 100644
index 0000000000..ddc567f06f
--- /dev/null
+++ b/src/web/app/desktop/views/components/settings.signins.vue
@@ -0,0 +1,98 @@
+<template>
+<div class="root">
+<div class="signins" v-if="signins.length != 0">
+ <div v-for="signin in signins">
+ <header @click="signin._show = !signin._show">
+ <template v-if="signin.success">%fa:check%</template>
+ <template v-else>%fa:times%</template>
+ <span class="ip">{{ signin.ip }}</span>
+ <mk-time :time="signin.created_at"/>
+ </header>
+ <div class="headers" v-show="signin._show">
+ <tree-view :data="signin.headers"/>
+ </div>
+ </div>
+</div>
+</div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+export default Vue.extend({
+ data() {
+ return {
+ fetching: true,
+ signins: [],
+ connection: null,
+ connectionId: null
+ };
+ },
+ mounted() {
+ (this as any).api('i/signin_history').then(signins => {
+ this.signins = signins;
+ this.fetching = false;
+ });
+
+ this.connection = (this as any).os.stream.getConnection();
+ this.connectionId = (this as any).os.stream.use();
+
+ this.connection.on('signin', this.onSignin);
+ },
+ beforeDestroy() {
+ this.connection.off('signin', this.onSignin);
+ (this as any).os.stream.dispose(this.connectionId);
+ },
+ methods: {
+ onSignin(signin) {
+ this.signins.unshift(signin);
+ }
+ }
+});
+</script>
+
+<style lang="stylus" scoped>
+.root
+ > .signins
+ > div
+ border-bottom solid 1px #eee
+
+ > header
+ display flex
+ padding 8px 0
+ line-height 32px
+ cursor pointer
+
+ > [data-fa]
+ margin-right 8px
+ text-align left
+
+ &.check
+ color #0fda82
+
+ &.times
+ color #ff3100
+
+ > .ip
+ display inline-block
+ text-align left
+ padding 8px
+ line-height 16px
+ font-family monospace
+ font-size 14px
+ color #444
+ background #f8f8f8
+ border-radius 4px
+
+ > .mk-time
+ margin-left auto
+ text-align right
+ color #777
+
+ > .headers
+ overflow auto
+ margin 0 0 16px 0
+ max-height 100px
+ white-space pre-wrap
+ word-break break-all
+
+</style>
diff --git a/src/web/app/desktop/views/components/settings.vue b/src/web/app/desktop/views/components/settings.vue
index 0eb18770a5..096ba57fd7 100644
--- a/src/web/app/desktop/views/components/settings.vue
+++ b/src/web/app/desktop/views/components/settings.vue
@@ -81,7 +81,7 @@
<section class="apps" v-show="page == 'apps'">
<h1>アプリケーション</h1>
- <mk-authorized-apps/>
+ <x-apps/>
</section>
<section class="twitter" v-show="page == 'twitter'">
@@ -101,7 +101,7 @@
<section class="signin" v-show="page == 'security'">
<h1>サインイン履歴</h1>
- <mk-signin-history/>
+ <x-signins/>
</section>
<section class="api" v-show="page == 'api'">
@@ -161,6 +161,8 @@ import XMute from './settings.mute.vue';
import XPassword from './settings.password.vue';
import X2fa from './settings.2fa.vue';
import XApi from './settings.api.vue';
+import XApps from './settings.apps.vue';
+import XSignins from './settings.signins.vue';
import { docsUrl, license, lang, version } from '../../../config';
import checkForUpdate from '../../../common/scripts/check-for-update';
@@ -170,7 +172,9 @@ export default Vue.extend({
XMute,
XPassword,
X2fa,
- XApi
+ XApi,
+ XApps,
+ XSignins
},
data() {
return {
diff --git a/src/web/app/init.ts b/src/web/app/init.ts
index 716fe45e7a..38b74d450d 100644
--- a/src/web/app/init.ts
+++ b/src/web/app/init.ts
@@ -5,6 +5,7 @@
import Vue from 'vue';
import VueRouter from 'vue-router';
import VModal from 'vue-js-modal';
+import * as TreeView from 'vue-json-tree-view';
import Element from 'element-ui';
import ElementLocaleEn from 'element-ui/lib/locale/lang/en';
import ElementLocaleJa from 'element-ui/lib/locale/lang/ja';
@@ -23,6 +24,7 @@ switch (lang) {
Vue.use(VueRouter);
Vue.use(VModal);
+Vue.use(TreeView);
Vue.use(Element, { locale: elementLocale });
// Register global directives
generated by cgit v1.2.3-freya (git 2.53.0.84.g453e7b744a) at 2026-03-04 15:20:26 +0000