mirror of
https://github.com/hotomoe/hotomoe
synced 2024-12-05 10:18:09 +09:00
[Client] Some optimizations
This commit is contained in:
parent
212176ee5c
commit
cc81d41a05
@ -1,13 +1,8 @@
|
|||||||
import Vue from 'vue';
|
import Vue from 'vue';
|
||||||
|
|
||||||
import followButton from './follow-button.vue';
|
import followButton from './follow-button.vue';
|
||||||
import muteAndBlock from './mute-and-block.vue';
|
|
||||||
import error from './error.vue';
|
import error from './error.vue';
|
||||||
import apiSettings from './api-settings.vue';
|
|
||||||
import passwordSettings from './password-settings.vue';
|
|
||||||
import profileEditor from './profile-editor.vue';
|
|
||||||
import noteSkeleton from './note-skeleton.vue';
|
import noteSkeleton from './note-skeleton.vue';
|
||||||
import theme from './theme.vue';
|
|
||||||
import instance from './instance.vue';
|
import instance from './instance.vue';
|
||||||
import cwButton from './cw-button.vue';
|
import cwButton from './cw-button.vue';
|
||||||
import tagCloud from './tag-cloud.vue';
|
import tagCloud from './tag-cloud.vue';
|
||||||
@ -27,7 +22,6 @@ import pollEditor from './poll-editor.vue';
|
|||||||
import reactionIcon from './reaction-icon.vue';
|
import reactionIcon from './reaction-icon.vue';
|
||||||
import reactionsViewer from './reactions-viewer.vue';
|
import reactionsViewer from './reactions-viewer.vue';
|
||||||
import time from './time.vue';
|
import time from './time.vue';
|
||||||
import timer from './timer.vue';
|
|
||||||
import mediaList from './media-list.vue';
|
import mediaList from './media-list.vue';
|
||||||
import uploader from './uploader.vue';
|
import uploader from './uploader.vue';
|
||||||
import streamIndicator from './stream-indicator.vue';
|
import streamIndicator from './stream-indicator.vue';
|
||||||
@ -52,13 +46,8 @@ import formButton from './ui/form/button.vue';
|
|||||||
import formRadio from './ui/form/radio.vue';
|
import formRadio from './ui/form/radio.vue';
|
||||||
|
|
||||||
Vue.component('mk-follow-button', followButton);
|
Vue.component('mk-follow-button', followButton);
|
||||||
Vue.component('mk-mute-and-block', muteAndBlock);
|
|
||||||
Vue.component('mk-error', error);
|
Vue.component('mk-error', error);
|
||||||
Vue.component('mk-api-settings', apiSettings);
|
|
||||||
Vue.component('mk-password-settings', passwordSettings);
|
|
||||||
Vue.component('mk-profile-editor', profileEditor);
|
|
||||||
Vue.component('mk-note-skeleton', noteSkeleton);
|
Vue.component('mk-note-skeleton', noteSkeleton);
|
||||||
Vue.component('mk-theme', theme);
|
|
||||||
Vue.component('mk-instance', instance);
|
Vue.component('mk-instance', instance);
|
||||||
Vue.component('mk-cw-button', cwButton);
|
Vue.component('mk-cw-button', cwButton);
|
||||||
Vue.component('mk-tag-cloud', tagCloud);
|
Vue.component('mk-tag-cloud', tagCloud);
|
||||||
@ -78,7 +67,6 @@ Vue.component('mk-poll-editor', pollEditor);
|
|||||||
Vue.component('mk-reaction-icon', reactionIcon);
|
Vue.component('mk-reaction-icon', reactionIcon);
|
||||||
Vue.component('mk-reactions-viewer', reactionsViewer);
|
Vue.component('mk-reactions-viewer', reactionsViewer);
|
||||||
Vue.component('mk-time', time);
|
Vue.component('mk-time', time);
|
||||||
Vue.component('mk-timer', timer);
|
|
||||||
Vue.component('mk-media-list', mediaList);
|
Vue.component('mk-media-list', mediaList);
|
||||||
Vue.component('mk-uploader', uploader);
|
Vue.component('mk-uploader', uploader);
|
||||||
Vue.component('mk-stream-indicator', streamIndicator);
|
Vue.component('mk-stream-indicator', streamIndicator);
|
||||||
|
@ -1,49 +0,0 @@
|
|||||||
<template>
|
|
||||||
<time class="mk-time">
|
|
||||||
{{ hh }}:{{ mm }}:{{ ss }}
|
|
||||||
</time>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
import Vue from 'vue';
|
|
||||||
|
|
||||||
export default Vue.extend({
|
|
||||||
props: {
|
|
||||||
time: {
|
|
||||||
type: [Date, String],
|
|
||||||
required: true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
tickId: null,
|
|
||||||
hh: null,
|
|
||||||
mm: null,
|
|
||||||
ss: null
|
|
||||||
};
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
_time(): Date {
|
|
||||||
return typeof this.time == 'string' ? new Date(this.time) : this.time;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
created() {
|
|
||||||
this.tick();
|
|
||||||
this.tickId = setInterval(this.tick, 1000);
|
|
||||||
},
|
|
||||||
destroyed() {
|
|
||||||
clearInterval(this.tickId);
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
tick() {
|
|
||||||
const now = new Date().getTime();
|
|
||||||
const start = this._time.getTime();
|
|
||||||
const ago = Math.floor((now - start) / 1000);
|
|
||||||
|
|
||||||
this.hh = Math.floor(ago / (60 * 60)).toString().padStart(2, '0');
|
|
||||||
this.mm = Math.floor(ago / 60).toString().padStart(2, '0');
|
|
||||||
this.ss = (ago % 60).toString().padStart(2, '0');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
@ -15,7 +15,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="pages">
|
<div class="pages">
|
||||||
<div class="profile" v-show="page == 'profile'">
|
<div class="profile" v-show="page == 'profile'">
|
||||||
<mk-profile-editor/>
|
<x-profile-editor/>
|
||||||
|
|
||||||
<ui-card>
|
<ui-card>
|
||||||
<div slot="title"><fa :icon="['fab', 'twitter']"/> {{ $t('twitter') }}</div>
|
<div slot="title"><fa :icon="['fab', 'twitter']"/> {{ $t('twitter') }}</div>
|
||||||
@ -36,7 +36,7 @@
|
|||||||
<div slot="title"><fa icon="palette"/> {{ $t('theme') }}</div>
|
<div slot="title"><fa icon="palette"/> {{ $t('theme') }}</div>
|
||||||
|
|
||||||
<section>
|
<section>
|
||||||
<mk-theme/>
|
<x-theme/>
|
||||||
</section>
|
</section>
|
||||||
</ui-card>
|
</ui-card>
|
||||||
|
|
||||||
@ -205,7 +205,7 @@
|
|||||||
</ui-card>
|
</ui-card>
|
||||||
|
|
||||||
<div class="muteAndBlock" v-show="page == 'muteAndBlock'">
|
<div class="muteAndBlock" v-show="page == 'muteAndBlock'">
|
||||||
<mk-mute-and-block/>
|
<x-mute-and-block/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ui-card class="apps" v-show="page == 'apps'">
|
<ui-card class="apps" v-show="page == 'apps'">
|
||||||
@ -218,7 +218,7 @@
|
|||||||
<ui-card class="password" v-show="page == 'security'">
|
<ui-card class="password" v-show="page == 'security'">
|
||||||
<div slot="title"><fa icon="unlock-alt"/> {{ $t('password') }}</div>
|
<div slot="title"><fa icon="unlock-alt"/> {{ $t('password') }}</div>
|
||||||
<section>
|
<section>
|
||||||
<mk-password-settings/>
|
<x-password-settings/>
|
||||||
</section>
|
</section>
|
||||||
</ui-card>
|
</ui-card>
|
||||||
|
|
||||||
@ -237,7 +237,7 @@
|
|||||||
</ui-card>
|
</ui-card>
|
||||||
|
|
||||||
<div class="api" v-show="page == 'api'">
|
<div class="api" v-show="page == 'api'">
|
||||||
<mk-api-settings/>
|
<x-api-settings/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ui-card class="other" v-show="page == 'other'">
|
<ui-card class="other" v-show="page == 'other'">
|
||||||
@ -302,7 +302,12 @@ export default Vue.extend({
|
|||||||
XApps,
|
XApps,
|
||||||
XSignins,
|
XSignins,
|
||||||
XTags,
|
XTags,
|
||||||
XDriveSettings: () => import('../../../common/views/components/drive-settings.vue')
|
XTheme: () => import('../../../common/views/components/theme.vue'),
|
||||||
|
XDriveSettings: () => import('../../../common/views/components/drive-settings.vue'),
|
||||||
|
XMuteAndBlock: () => import('../../../common/views/components/mute-and-block.vue'),
|
||||||
|
XPasswordSettings: () => import('../../../common/views/components/password-settings.vue'),
|
||||||
|
XProfileEditor: () => import('../../../common/views/components/profile-editor.vue'),
|
||||||
|
XApiSettings: () => import('../../../common/views/components/api-settings.vue'),
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
initialPage: {
|
initialPage: {
|
||||||
|
@ -5,12 +5,12 @@
|
|||||||
<div class="signin-as" v-html="this.$t('signed-in-as').replace('{}', `<b>${name}</b>`)"></div>
|
<div class="signin-as" v-html="this.$t('signed-in-as').replace('{}', `<b>${name}</b>`)"></div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<mk-profile-editor/>
|
<x-profile-editor/>
|
||||||
|
|
||||||
<ui-card>
|
<ui-card>
|
||||||
<div slot="title"><fa icon="palette"/> {{ $t('theme') }}</div>
|
<div slot="title"><fa icon="palette"/> {{ $t('theme') }}</div>
|
||||||
<section>
|
<section>
|
||||||
<mk-theme/>
|
<x-theme/>
|
||||||
</section>
|
</section>
|
||||||
</ui-card>
|
</ui-card>
|
||||||
|
|
||||||
@ -87,7 +87,7 @@
|
|||||||
|
|
||||||
<x-drive-settings/>
|
<x-drive-settings/>
|
||||||
|
|
||||||
<mk-mute-and-block/>
|
<x-mute-and-block/>
|
||||||
|
|
||||||
<ui-card>
|
<ui-card>
|
||||||
<div slot="title"><fa icon="volume-up"/> {{ $t('sound') }}</div>
|
<div slot="title"><fa icon="volume-up"/> {{ $t('sound') }}</div>
|
||||||
@ -140,12 +140,12 @@
|
|||||||
</section>
|
</section>
|
||||||
</ui-card>
|
</ui-card>
|
||||||
|
|
||||||
<mk-api-settings />
|
<x-api-settings />
|
||||||
|
|
||||||
<ui-card>
|
<ui-card>
|
||||||
<div slot="title"><fa icon="unlock-alt"/> {{ $t('password') }}</div>
|
<div slot="title"><fa icon="unlock-alt"/> {{ $t('password') }}</div>
|
||||||
<section>
|
<section>
|
||||||
<mk-password-settings/>
|
<x-password-settings/>
|
||||||
</section>
|
</section>
|
||||||
</ui-card>
|
</ui-card>
|
||||||
|
|
||||||
@ -184,7 +184,12 @@ export default Vue.extend({
|
|||||||
i18n: i18n('mobile/views/pages/settings.vue'),
|
i18n: i18n('mobile/views/pages/settings.vue'),
|
||||||
|
|
||||||
components: {
|
components: {
|
||||||
XDriveSettings: () => import('../../../common/views/components/drive-settings.vue')
|
XTheme: () => import('../../../common/views/components/theme.vue'),
|
||||||
|
XDriveSettings: () => import('../../../common/views/components/drive-settings.vue'),
|
||||||
|
XMuteAndBlock: () => import('../../../common/views/components/mute-and-block.vue'),
|
||||||
|
XPasswordSettings: () => import('../../../common/views/components/password-settings.vue'),
|
||||||
|
XProfileEditor: () => import('../../../common/views/components/profile-editor.vue'),
|
||||||
|
XApiSettings: () => import('../../../common/views/components/api-settings.vue'),
|
||||||
},
|
},
|
||||||
|
|
||||||
data() {
|
data() {
|
||||||
|
Loading…
Reference in New Issue
Block a user