[Client] Split some components to improve performance
This commit is contained in:
parent
6090630260
commit
4114ce4a04
3 changed files with 34 additions and 21 deletions
|
@ -27,9 +27,6 @@ import uploader from './uploader.vue';
|
||||||
import streamIndicator from './stream-indicator.vue';
|
import streamIndicator from './stream-indicator.vue';
|
||||||
import ellipsis from './ellipsis.vue';
|
import ellipsis from './ellipsis.vue';
|
||||||
import urlPreview from './url-preview.vue';
|
import urlPreview from './url-preview.vue';
|
||||||
import twitterSetting from './twitter-setting.vue';
|
|
||||||
import githubSetting from './github-setting.vue';
|
|
||||||
import discordSetting from './discord-setting.vue';
|
|
||||||
import fileTypeIcon from './file-type-icon.vue';
|
import fileTypeIcon from './file-type-icon.vue';
|
||||||
import emoji from './emoji.vue';
|
import emoji from './emoji.vue';
|
||||||
import welcomeTimeline from './welcome-timeline.vue';
|
import welcomeTimeline from './welcome-timeline.vue';
|
||||||
|
@ -73,9 +70,6 @@ Vue.component('mk-uploader', uploader);
|
||||||
Vue.component('mk-stream-indicator', streamIndicator);
|
Vue.component('mk-stream-indicator', streamIndicator);
|
||||||
Vue.component('mk-ellipsis', ellipsis);
|
Vue.component('mk-ellipsis', ellipsis);
|
||||||
Vue.component('mk-url-preview', urlPreview);
|
Vue.component('mk-url-preview', urlPreview);
|
||||||
Vue.component('mk-twitter-setting', twitterSetting);
|
|
||||||
Vue.component('mk-github-setting', githubSetting);
|
|
||||||
Vue.component('mk-discord-setting', discordSetting);
|
|
||||||
Vue.component('mk-file-type-icon', fileTypeIcon);
|
Vue.component('mk-file-type-icon', fileTypeIcon);
|
||||||
Vue.component('mk-emoji', emoji);
|
Vue.component('mk-emoji', emoji);
|
||||||
Vue.component('mk-welcome-timeline', welcomeTimeline);
|
Vue.component('mk-welcome-timeline', welcomeTimeline);
|
||||||
|
|
|
@ -20,21 +20,21 @@
|
||||||
<ui-card>
|
<ui-card>
|
||||||
<div slot="title"><fa :icon="['fab', 'twitter']"/> {{ $t('twitter') }}</div>
|
<div slot="title"><fa :icon="['fab', 'twitter']"/> {{ $t('twitter') }}</div>
|
||||||
<section>
|
<section>
|
||||||
<mk-twitter-setting/>
|
<x-twitter-setting/>
|
||||||
</section>
|
</section>
|
||||||
</ui-card>
|
</ui-card>
|
||||||
|
|
||||||
<ui-card>
|
<ui-card>
|
||||||
<div slot="title"><fa :icon="['fab', 'github']"/> {{ $t('github') }}</div>
|
<div slot="title"><fa :icon="['fab', 'github']"/> {{ $t('github') }}</div>
|
||||||
<section>
|
<section>
|
||||||
<mk-github-setting/>
|
<x-github-setting/>
|
||||||
</section>
|
</section>
|
||||||
</ui-card>
|
</ui-card>
|
||||||
|
|
||||||
<ui-card>
|
<ui-card>
|
||||||
<div slot="title"><fa :icon="['fab', 'discord']"/> {{ $t('discord') }}</div>
|
<div slot="title"><fa :icon="['fab', 'discord']"/> {{ $t('discord') }}</div>
|
||||||
<section>
|
<section>
|
||||||
<mk-discord-setting/>
|
<x-discord-setting/>
|
||||||
</section>
|
</section>
|
||||||
</ui-card>
|
</ui-card>
|
||||||
</div>
|
</div>
|
||||||
|
@ -299,6 +299,16 @@ import X2fa from './settings.2fa.vue';
|
||||||
import XApps from './settings.apps.vue';
|
import XApps from './settings.apps.vue';
|
||||||
import XSignins from './settings.signins.vue';
|
import XSignins from './settings.signins.vue';
|
||||||
import XTags from './settings.tags.vue';
|
import XTags from './settings.tags.vue';
|
||||||
|
import XTwitterSetting from '../../../common/views/components/twitter-setting.vue';
|
||||||
|
import XGithubSetting from '../../../common/views/components/github-setting.vue';
|
||||||
|
import XDiscordSetting from '../../../common/views/components/discord-setting.vue';
|
||||||
|
import XTheme from '../../../common/views/components/theme.vue';
|
||||||
|
import XDriveSettings from '../../../common/views/components/drive-settings.vue';
|
||||||
|
import XMuteAndBlock from '../../../common/views/components/mute-and-block.vue';
|
||||||
|
import XPasswordSettings from '../../../common/views/components/password-settings.vue';
|
||||||
|
import XProfileEditor from '../../../common/views/components/profile-editor.vue';
|
||||||
|
import XApiSettings from '../../../common/views/components/api-settings.vue';
|
||||||
|
|
||||||
import { url, langs, clientVersion as version } from '../../../config';
|
import { url, langs, clientVersion as version } from '../../../config';
|
||||||
import checkForUpdate from '../../../common/scripts/check-for-update';
|
import checkForUpdate from '../../../common/scripts/check-for-update';
|
||||||
|
|
||||||
|
@ -309,12 +319,15 @@ export default Vue.extend({
|
||||||
XApps,
|
XApps,
|
||||||
XSignins,
|
XSignins,
|
||||||
XTags,
|
XTags,
|
||||||
XTheme: () => import('../../../common/views/components/theme.vue').then(m => m.default),
|
XTwitterSetting,
|
||||||
XDriveSettings: () => import('../../../common/views/components/drive-settings.vue').then(m => m.default),
|
XGithubSetting,
|
||||||
XMuteAndBlock: () => import('../../../common/views/components/mute-and-block.vue').then(m => m.default),
|
XDiscordSetting,
|
||||||
XPasswordSettings: () => import('../../../common/views/components/password-settings.vue').then(m => m.default),
|
XTheme,
|
||||||
XProfileEditor: () => import('../../../common/views/components/profile-editor.vue').then(m => m.default),
|
XDriveSettings,
|
||||||
XApiSettings: () => import('../../../common/views/components/api-settings.vue').then(m => m.default),
|
XMuteAndBlock,
|
||||||
|
XPasswordSettings,
|
||||||
|
XProfileEditor,
|
||||||
|
XApiSettings,
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
initialPage: {
|
initialPage: {
|
||||||
|
|
|
@ -192,17 +192,23 @@ import Vue from 'vue';
|
||||||
import i18n from '../../../i18n';
|
import i18n from '../../../i18n';
|
||||||
import { apiUrl, clientVersion as version, codename, langs } from '../../../config';
|
import { apiUrl, clientVersion as version, codename, langs } from '../../../config';
|
||||||
import checkForUpdate from '../../../common/scripts/check-for-update';
|
import checkForUpdate from '../../../common/scripts/check-for-update';
|
||||||
|
import XTheme from '../../../common/views/components/theme.vue';
|
||||||
|
import XDriveSettings from '../../../common/views/components/drive-settings.vue';
|
||||||
|
import XMuteAndBlock from '../../../common/views/components/mute-and-block.vue';
|
||||||
|
import XPasswordSettings from '../../../common/views/components/password-settings.vue';
|
||||||
|
import XProfileEditor from '../../../common/views/components/profile-editor.vue';
|
||||||
|
import XApiSettings from '../../../common/views/components/api-settings.vue';
|
||||||
|
|
||||||
export default Vue.extend({
|
export default Vue.extend({
|
||||||
i18n: i18n('mobile/views/pages/settings.vue'),
|
i18n: i18n('mobile/views/pages/settings.vue'),
|
||||||
|
|
||||||
components: {
|
components: {
|
||||||
XTheme: () => import('../../../common/views/components/theme.vue').then(m => m.default),
|
XTheme,
|
||||||
XDriveSettings: () => import('../../../common/views/components/drive-settings.vue').then(m => m.default),
|
XDriveSettings,
|
||||||
XMuteAndBlock: () => import('../../../common/views/components/mute-and-block.vue').then(m => m.default),
|
XMuteAndBlock,
|
||||||
XPasswordSettings: () => import('../../../common/views/components/password-settings.vue').then(m => m.default),
|
XPasswordSettings,
|
||||||
XProfileEditor: () => import('../../../common/views/components/profile-editor.vue').then(m => m.default),
|
XProfileEditor,
|
||||||
XApiSettings: () => import('../../../common/views/components/api-settings.vue').then(m => m.default),
|
XApiSettings,
|
||||||
},
|
},
|
||||||
|
|
||||||
data() {
|
data() {
|
||||||
|
|
Loading…
Reference in a new issue