/
githubmirror
/
socket.io
Обзор
Документация
Войти
/
githubmirror
/
socket.io
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
main
examples/private-messaging/src/components/User.vue
63 строки
1 KB
Damien Arrachequesne
docs(examples): 1st part of the "private messaging" example
10 фев 2021, 02:33
Не верифицирован
10 фев 2021, 02:33
8b404f4
Код
Авторство
О чём код?
<template> <div class="user" @click="onClick" :class="{ selected: selected }"> <div class="description"> <div class="name"> {{ user.username }} {{ user.self ? " (yourself)" : "" }} </div> <div class="status"> <status-icon :connected="user.connected" />{{ status }} </div> </div> <div v-if="user.hasNewMessages" class="new-messages">!</div> </div> </template> <script> import StatusIcon from "./StatusIcon"; export default { name: "User", components: { StatusIcon }, props: { user: Object, selected: Boolean, }, methods: { onClick() { this.$emit("select"); }, }, computed: { status() { return this.user.connected ? "online" : "offline"; }, }, }; </script> <style scoped> .selected { background-color: #1164a3; } .user { padding: 10px; } .description { display: inline-block; } .status { color: #92959e; } .new-messages { color: white; background-color: red; width: 20px; border-radius: 5px; text-align: center; float: right; margin-top: 10px; } </style>