mail/front/src/views/room/MemberList.vue

38 lines
864 B
Vue

<script setup lang="ts">
import Badge from "@/components/Badge.vue";
import User from "@/components/User.vue";
import { Address } from "@/store/models/model";
import { defineProps, PropType } from "vue";
const props = defineProps({ type: String, members: Object as PropType<Address[]> });
// const members: Address[] = [];
// for (let i = 0; i < 4; i++) {
// if (!props.members) continue;
// members?.push(props?.members[0]);
// }
// todo deal with long list and responsive
</script>
<template>
<div class="main">
<Badge :value="props.type + ': '" />
<div class="users">
<User class="user" v-for="(member, index) in props?.members" :key="index" :address="member" />
</div>
</div>
</template>
<style scoped>
.main {
display: flex;
}
.users {
display: flex;
}
.user {
margin-left: 5px;
}
</style>