Files
WebETA/src/components/CardCompany.vue
2024-06-10 20:54:13 -06:00

80 lines
2.3 KiB
Vue

<script setup>
import { RouterLink } from 'vue-router';
import { getDateMonthDay } from '../helpers/date_formats';
import { useI18n } from 'vue-i18n';
defineProps({
company: {
type: Object,
required: true,
}
});
const { t } = useI18n()
</script>
<template>
<div class="card-fixed flex-column">
<h2>{{ company.company_name }}</h2>
<div class="divider"></div>
<div class="row mt-4">
<div class="col-lg-6 col-sm-12">
<!-- <p><span>RFC:</span> {{ company.rfc }}</p> -->
<!-- <p><span>Tipo de empresa:</span> {{ company.company_type || 'No definido' }}</p> -->
<p><span>{{ t('labels.codeId') }}:</span> {{ company.company_code }}</p>
<p><span>{{ t('labels.dateMembership') }}: </span>{{getDateMonthDay(company.createdAt)}}</p>
<p><span>{{ t('company.segment') }}:</span> {{ company._categories }}</p>
<!-- <p><span>Afiliación: </span> {{company.membership}}</p> -->
</div>
<div class="col-lg-6 col-sm-12">
<p><span>{{ t('labels.locationLoadState') }}: </span>{{company._company_state}}</p>
<p><span>{{ t('labels.locationLoadCity') }}: </span>{{company._company_city}}</p>
<p><span>{{ t('labels.truckUsed') }}: </span>{{company._truck_types}}</p>
<p><span>{{ t('labels.infoCompany') }}: </span>{{company.company_description}}</p>
</div>
</div>
<div class="d-flex justify-content-end">
<RouterLink
class="btn-primary-sm"
:to="{name: 'public-users', params: {id: company._id}}"
>{{ t('buttons.profile') }}</RouterLink>
</div>
</div>
</template>
<style scoped>
h2{
font-size: 1.5rem;
font-weight: 800;
color: #323030;
}
p {
font-size: 1rem;
font-weight: 400;
color: #323032;
}
p span {
font-weight: 700;
}
@media (max-width: 768px) {
h2{
font-size: 1.1rem;
font-weight: 600;
color: #323030;
}
p {
font-size: 0.9rem;
font-weight: 400;
color: #323032;
}
p span {
font-weight: 700;
}
}
</style>