You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
geografia-fe/geografia-vue/src/components/ChatList.vue

48 lines
1.2 KiB
Vue

<!-- eslint-disable vue/no-use-v-if-with-v-for -->
<script setup>
//Fix v-if riga 20
import ChatPreview from "@/components/ChatPreview.vue";
import ChatView from "./single_chat/ChatView.vue";
</script>
<template>
<!-- Fix nested conditions in ChatPreview -->
<div id="background chat-list">
<ChatPreview
v-for="chat in $options.demo_chats.history"
v-if="!selectedChat"
:key="chat.id"
:chat-picture="chat.picture"
:chat-name="chat.name"
:chat-last-message="chat.last_message"
:chat-seen="chat.seen"
:chat-date="chat.date"
:chat-new-messages="chat.new_messages"
@click="showChat(chat)"
/>
<ChatView v-if="selectedChat" :chat-id="chatId" @hideChat="hideChat" />
</div>
</template>
<script>
import demo_chats_json from "../assets/demo_chats.json";
export default {
demo_chats: demo_chats_json,
data() {
return { selectedChat: false, chatId: null };
},
methods: {
showChat(chat) {
this.$emit("change-header", [chat.picture, chat.name]);
this.selectedChat = !this.selectedChat;
this.chatId = chat.id;
},
hideChat() {
this.selectedChat = false;
},
},
};
</script>
<style scoped></style>