85 lines
1.7 KiB
Vue
85 lines
1.7 KiB
Vue
<template>
|
|
<div class="card-body text-center">
|
|
<!-- Fournisseur Avatar -->
|
|
<ClientAvatar
|
|
:avatar-url="avatarUrl"
|
|
:initials="initials"
|
|
:alt="fournisseurName"
|
|
:editable="true"
|
|
@edit="$emit('edit-avatar')"
|
|
/>
|
|
|
|
<!-- Fournisseur Name -->
|
|
<h5 class="font-weight-bolder mb-0">
|
|
{{ fournisseurName }}
|
|
</h5>
|
|
<p class="text-sm text-secondary mb-3">
|
|
{{ fournisseurType }}
|
|
</p>
|
|
|
|
<!-- Quick Stats -->
|
|
<div class="row text-center mt-3">
|
|
<div class="col-6 border-end">
|
|
<h6 class="text-sm font-weight-bolder mb-0">
|
|
{{ contactsCount }}
|
|
</h6>
|
|
<p class="text-xs text-secondary mb-0">Contacts</p>
|
|
</div>
|
|
<div class="col-6">
|
|
<h6 class="text-sm font-weight-bolder mb-0">
|
|
<i
|
|
class="fas"
|
|
:class="
|
|
isActive
|
|
? 'fa-check-circle text-success'
|
|
: 'fa-times-circle text-danger'
|
|
"
|
|
></i>
|
|
</h6>
|
|
<p class="text-xs text-secondary mb-0">Statut</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import ClientAvatar from "@/components/atoms/client/ClientAvatar.vue";
|
|
import { defineProps, defineEmits } from "vue";
|
|
defineProps({
|
|
avatarUrl: {
|
|
type: String,
|
|
default: null,
|
|
},
|
|
initials: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
fournisseurName: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
fournisseurType: {
|
|
type: String,
|
|
default: "Fournisseur",
|
|
},
|
|
contactsCount: {
|
|
type: Number,
|
|
default: 0,
|
|
},
|
|
isActive: {
|
|
type: Boolean,
|
|
default: true,
|
|
},
|
|
});
|
|
|
|
defineEmits(["edit-avatar"]);
|
|
</script>
|
|
|
|
<style scoped>
|
|
.avatar-sm .avatar-placeholder {
|
|
width: 36px;
|
|
height: 36px;
|
|
font-size: 0.875rem;
|
|
}
|
|
</style>
|