Remember container state on user page (#4361)

* Remember container state on user page

* remove unnecessary code
This commit is contained in:
MeiMei 2019-02-24 10:38:53 +09:00 committed by syuilo
parent a6c5e62923
commit febfb97bb4
5 changed files with 17 additions and 6 deletions

View file

@ -3,7 +3,7 @@
<header v-if="showHeader"> <header v-if="showHeader">
<div class="title"><slot name="header"></slot></div> <div class="title"><slot name="header"></slot></div>
<slot name="func"></slot> <slot name="func"></slot>
<button v-if="bodyTogglable" @click="() => showBody = !showBody"> <button v-if="bodyTogglable" @click="toggleContent(!showBody)">
<template v-if="showBody"><fa icon="angle-up"/></template> <template v-if="showBody"><fa icon="angle-up"/></template>
<template v-else><fa icon="angle-down"/></template> <template v-else><fa icon="angle-down"/></template>
</button> </button>
@ -48,6 +48,7 @@ export default Vue.extend({
methods: { methods: {
toggleContent(show: boolean) { toggleContent(show: boolean) {
this.showBody = show; this.showBody = show;
this.$emit('toggle', show);
} }
} }
}); });

View file

@ -6,7 +6,9 @@
<x-note v-for="n in user.pinnedNotes" :key="n.id" :note="n" :mini="true"/> <x-note v-for="n in user.pinnedNotes" :key="n.id" :note="n" :mini="true"/>
</div> </div>
</ui-container> </ui-container>
<ui-container v-if="images.length > 0" :body-togglable="true"> <ui-container v-if="images.length > 0" :body-togglable="true"
:expanded="$store.state.device.expandUsersPhotos"
@toggle="expanded => $store.commit('device/set', { key: 'expandUsersPhotos', value: expanded })">
<template #header><fa :icon="['far', 'images']"/> {{ $t('images') }}</template> <template #header><fa :icon="['far', 'images']"/> {{ $t('images') }}</template>
<div class="sainvnaq"> <div class="sainvnaq">
<router-link v-for="image in images" <router-link v-for="image in images"
@ -17,7 +19,9 @@
></router-link> ></router-link>
</div> </div>
</ui-container> </ui-container>
<ui-container :body-togglable="true"> <ui-container :body-togglable="true"
:expanded="$store.state.device.expandUsersActivity"
@toggle="expanded => $store.commit('device/set', { key: 'expandUsersActivity', value: expanded })">
<template #header><fa :icon="['far', 'chart-bar']"/> {{ $t('activity') }}</template> <template #header><fa :icon="['far', 'chart-bar']"/> {{ $t('activity') }}</template>
<div> <div>
<div ref="chart"></div> <div ref="chart"></div>

View file

@ -3,7 +3,9 @@
<mk-note-detail v-for="n in user.pinnedNotes" :key="n.id" :note="n" :compact="true"/> <mk-note-detail v-for="n in user.pinnedNotes" :key="n.id" :note="n" :compact="true"/>
<!--<mk-calendar @chosen="warp" :start="new Date(user.createdAt)"/>--> <!--<mk-calendar @chosen="warp" :start="new Date(user.createdAt)"/>-->
<div class="activity"> <div class="activity">
<ui-container :body-togglable="true"> <ui-container :body-togglable="true"
:expanded="$store.state.device.expandUsersActivity"
@toggle="expanded => $store.commit('device/set', { key: 'expandUsersActivity', value: expanded })">
<template #header><fa icon="chart-bar"/>{{ $t('activity') }}</template> <template #header><fa icon="chart-bar"/>{{ $t('activity') }}</template>
<x-activity :user="user" :limit="35" style="padding: 16px;"/> <x-activity :user="user" :limit="35" style="padding: 16px;"/>
</ui-container> </ui-container>

View file

@ -1,5 +1,7 @@
<template> <template>
<ui-container :body-togglable="true"> <ui-container :body-togglable="true"
:expanded="$store.state.device.expandUsersPhotos"
@toggle="expanded => $store.commit('device/set', { key: 'expandUsersPhotos', value: expanded })">
<template #header><fa icon="camera"/> {{ $t('title') }}</template> <template #header><fa icon="camera"/> {{ $t('title') }}</template>
<div class="dzsuvbsrrrwobdxifudxuefculdfiaxd"> <div class="dzsuvbsrrrwobdxifudxuefculdfiaxd">

View file

@ -68,7 +68,9 @@ const defaultDeviceSettings = {
mobileNotificationPosition: 'bottom', mobileNotificationPosition: 'bottom',
deckMode: false, deckMode: false,
useOsDefaultEmojis: false, useOsDefaultEmojis: false,
disableShowingAnimatedImages: false disableShowingAnimatedImages: false,
expandUsersPhotos: true,
expandUsersActivity: true,
}; };
export default (os: MiOS) => new Vuex.Store({ export default (os: MiOS) => new Vuex.Store({