60 lines
2.1 KiB
Vue
60 lines
2.1 KiB
Vue
<template>
|
|
<modal :buttons="false" :action="l('chat.recentConversations')" dialogClass="w-100 modal-lg">
|
|
<tabs style="flex-shrink:0;margin-bottom:10px" v-model="selectedTab"
|
|
:tabs="[l('chat.pms'), l('chat.channels')]"></tabs>
|
|
<div>
|
|
<div v-show="selectedTab === '0'" class="recent-conversations">
|
|
<user-view v-for="recent in recentPrivate" v-if="recent.character"
|
|
:key="recent.character" :character="getCharacter(recent.character)"></user-view>
|
|
</div>
|
|
<div v-show="selectedTab === '1'" class="recent-conversations">
|
|
<channel-view v-for="recent in recentChannels" :key="recent.channel" :id="recent.channel"
|
|
:text="recent.name"></channel-view>
|
|
</div>
|
|
</div>
|
|
</modal>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import {Component} from '@f-list/vue-ts';
|
|
import CustomDialog from '../components/custom_dialog';
|
|
import Modal from '../components/Modal.vue';
|
|
import Tabs from '../components/tabs';
|
|
import ChannelView from './ChannelTagView.vue';
|
|
import core from './core';
|
|
import {Character, Conversation} from './interfaces';
|
|
import l from './localize';
|
|
import UserView from './user_view';
|
|
|
|
@Component({
|
|
components: {'user-view': UserView, 'channel-view': ChannelView, modal: Modal, tabs: Tabs}
|
|
})
|
|
export default class RecentConversations extends CustomDialog {
|
|
l = l;
|
|
selectedTab = '0';
|
|
|
|
get recentPrivate(): ReadonlyArray<Conversation.RecentPrivateConversation> {
|
|
return core.conversations.recent;
|
|
}
|
|
|
|
get recentChannels(): ReadonlyArray<Conversation.RecentChannelConversation> {
|
|
return core.conversations.recentChannels;
|
|
}
|
|
|
|
getCharacter(name: string): Character {
|
|
return core.characters.get(name);
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.recent-conversations {
|
|
display: flex;
|
|
flex-direction: column;
|
|
max-height: 500px;
|
|
flex-wrap: wrap;
|
|
& > * {
|
|
margin: 3px;
|
|
}
|
|
}
|
|
</style> |