40 lines
868 B
Vue
40 lines
868 B
Vue
<template>
|
|
<div v-if="contact">
|
|
<div class="card shadow-sm mb-3">
|
|
<div class="card-header bg-white pane-header">
|
|
Contact '{{ contact.name }}'
|
|
</div>
|
|
<div class="card-body">
|
|
<div v-if="contact.emails.length > 0">
|
|
<ul>
|
|
<li v-for="(email, index) in contact.emails">{{ email }}</li>
|
|
</ul>
|
|
</div>
|
|
<div v-else>
|
|
<p>No email addresses</p>
|
|
</div>
|
|
<div v-if="contact.phones.length > 0">
|
|
<ul>
|
|
<li v-for="(phone, index) in contact.phones">
|
|
{{ phone.e164 }} {{ phone.can_sms }}
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div v-else>
|
|
<p>No phone numbers</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div v-else>
|
|
<p>select a contact</p>
|
|
</div>
|
|
</template>
|
|
<script setup lang="ts">
|
|
import { Contact } from "@/type/api";
|
|
|
|
interface Props {
|
|
contact?: Contact;
|
|
}
|
|
const props = defineProps<Props>();
|
|
</script>
|