diff --git a/src/client/app/common/mios.ts b/src/client/app/common/mios.ts index 463f763888..4e471cf96f 100644 --- a/src/client/app/common/mios.ts +++ b/src/client/app/common/mios.ts @@ -88,6 +88,7 @@ export default class MiOS extends EventEmitter { propsData: props }).$mount(); document.body.appendChild(w.$el); + return w; } /** diff --git a/src/client/app/desktop/views/components/timeline.vue b/src/client/app/desktop/views/components/timeline.vue index a798e5d7b4..be714d7bf9 100644 --- a/src/client/app/desktop/views/components/timeline.vue +++ b/src/client/app/desktop/views/components/timeline.vue @@ -4,18 +4,20 @@ <span :data-is-active="src == 'home'" @click="src = 'home'">%fa:home% ホーム</span> <span :data-is-active="src == 'local'" @click="src = 'local'">%fa:R comments% ローカル</span> <span :data-is-active="src == 'global'" @click="src = 'global'">%fa:globe% グローバル</span> - - <button @click="list" title="リスト">%fa:list%</button> + <span :data-is-active="src == 'list'" @click="src = 'list'" v-if="list">%fa:list% {{ list.title }}</span> + <button @click="chooseList" title="リスト">%fa:list%</button> </header> <x-core v-if="src == 'home'" ref="tl" key="home" src="home"/> <x-core v-if="src == 'local'" ref="tl" key="local" src="local"/> <x-core v-if="src == 'global'" ref="tl" key="global" src="global"/> + <mk-user-list-timeline v-if="src == 'list'" ref="tl" key="list" :list="list"/> </div> </template> <script lang="ts"> import Vue from 'vue'; import XCore from './timeline.core.vue'; +import MkUserListsWindow from './user-lists-window.vue'; export default Vue.extend({ components: { @@ -24,7 +26,8 @@ export default Vue.extend({ data() { return { - src: 'home' + src: 'home', + list: null }; }, @@ -39,8 +42,11 @@ export default Vue.extend({ (this.$refs.tl as any).warp(date); }, - list() { - + chooseList() { + const w = (this as any).os.new(MkUserListsWindow); + w.$once('choosen', list => { + this.list = list; + }); } } }); diff --git a/src/client/app/desktop/views/components/ui.header.account.vue b/src/client/app/desktop/views/components/ui.header.account.vue index b91448af49..5148c5b967 100644 --- a/src/client/app/desktop/views/components/ui.header.account.vue +++ b/src/client/app/desktop/views/components/ui.header.account.vue @@ -86,7 +86,10 @@ export default Vue.extend({ }, list() { this.close(); - (this as any).os.new(MkUserListsWindow); + const w = (this as any).os.new(MkUserListsWindow); + w.$once('choosen', list => { + this.$router.push(`i/lists/${ list.id }`); + }); }, settings() { this.close(); diff --git a/src/client/app/desktop/views/components/user-lists-window.vue b/src/client/app/desktop/views/components/user-lists-window.vue index 30b1794a29..3342b60bf7 100644 --- a/src/client/app/desktop/views/components/user-lists-window.vue +++ b/src/client/app/desktop/views/components/user-lists-window.vue @@ -3,7 +3,7 @@ <span slot="header">%fa:list% リスト</span> <button class="ui" @click="add">リストを作成</button> - <router-link v-for="list in lists" :key="list.id" :to="`/i/lists/${list.id}`">{{ list.title }}</router-link> + <a v-for="list in lists" :key="list.id" @click="choice(list)">{{ list.title }}</a> </mk-window> </template> @@ -31,9 +31,12 @@ export default Vue.extend({ title }); - this.$router.push(`i/lists/${ list.id }`); + this.$emit('choosen', list); }); }, + choice(list) { + this.$emit('choosen', list); + }, close() { (this as any).$refs.window.close(); }