<script setup>
import { ref, onBeforeMount, computed } from 'vue';
import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n';
import { dashIfEmpty, toDate } from 'src/filters';
import VnLv from 'src/components/ui/VnLv.vue';
import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
import CardSummary from 'components/ui/CardSummary.vue';
import VnUserLink from 'src/components/ui/VnUserLink.vue';
import VnTitle from 'src/components/common/VnTitle.vue';
import RoleDescriptorProxy from 'src/pages/Account/Role/Card/RoleDescriptorProxy.vue';
import DepartmentDescriptorProxy from 'src/pages/Worker/Department/Card/DepartmentDescriptorProxy.vue';
import { useAdvancedSummary } from 'src/composables/useAdvancedSummary';
import WorkerDescriptorMenu from './WorkerDescriptorMenu.vue';

const route = useRoute();
const { t } = useI18n();

const $props = defineProps({
    id: {
        type: Number,
        default: 0,
    },
});

const entityId = computed(() => $props.id || route.params.id);
const basicDataUrl = ref(null);
const advancedSummary = ref();

onBeforeMount(async () => {
    advancedSummary.value = await useAdvancedSummary('Workers', entityId.value);
    basicDataUrl.value = `#/worker/${entityId.value}/basic-data`;
});
</script>

<template>
    <CardSummary
        ref="summary"
        url="Workers/summary"
        :user-filter="{ where: { id: entityId } }"
        data-key="Worker"
        module-name="Worker"
    >
        <template #header="{ entity }">
            <div>{{ entity.id }} - {{ entity.firstName }} {{ entity.lastName }}</div>
        </template>
        <template #menu="{ entity }">
            <WorkerDescriptorMenu :worker="entity" :is-excluded="workerExcluded" />
        </template>
        <template #body="{ entity: worker }">
            <QCard class="vn-two">
                <VnTitle :url="basicDataUrl" :text="t('globals.summary.basicData')" />
                <div class="vn-card-group">
                    <div class="vn-card-content">
                        <VnLv :label="t('globals.name')" :value="worker.user?.nickname" />
                        <VnLv :label="t('globals.department')">
                            <template #value>
                                <span
                                    class="link"
                                    v-text="worker.department?.department?.name"
                                />
                                <DepartmentDescriptorProxy
                                    :id="worker.department?.department?.id"
                                />
                            </template>
                        </VnLv>
                        <VnLv :label="t('worker.summary.boss')" link>
                            <template #value>
                                <VnUserLink
                                    v-if="worker.boss"
                                    :name="dashIfEmpty(worker.boss?.name)"
                                    :worker-id="worker.bossFk"
                                />
                            </template>
                        </VnLv>
                        <VnLv :value="worker.mobileExtension">
                            <template #label>
                                {{ t('worker.summary.phoneExtension') }}
                                <VnLinkPhone :phone-number="worker.mobileExtension" />
                            </template>
                        </VnLv>
                        <VnLv :value="worker.phone">
                            <template #label>
                                {{ t('worker.summary.entPhone') }}
                                <VnLinkPhone :phone-number="worker.phone" />
                            </template>
                        </VnLv>
                        <VnLv :value="advancedSummary?.client?.phone">
                            <template #label>
                                {{ t('worker.summary.personalPhone') }}
                                <VnLinkPhone
                                    :phone-number="advancedSummary?.client?.phone"
                                />
                            </template>
                        </VnLv>
                    </div>
                    <div class="vn-card-content">
                        <VnLv
                            :label="t('worker.summary.fiDueDate')"
                            :value="toDate(advancedSummary.fiDueDate)"
                        />
                        <VnLv :label="t('worker.summary.sex')" :value="worker.sex" />
                        <VnLv
                            :label="t('worker.summary.seniority')"
                            :value="toDate(advancedSummary.seniority)"
                        />
                        <VnLv
                            :label="t('worker.summary.fi')"
                            :value="advancedSummary.fi"
                        />
                        <VnLv
                            :label="t('worker.summary.birth')"
                            :value="toDate(advancedSummary.birth)"
                        />
                        <VnLv
                            :label="t('worker.summary.isFreelance')"
                            :value="advancedSummary.isFreelance"
                        />
                        <VnLv
                            :label="t('worker.summary.isSsDiscounted')"
                            :value="advancedSummary.isSsDiscounted"
                        />
                        <VnLv
                            :label="t('worker.summary.hasMachineryAuthorized')"
                            :value="advancedSummary.hasMachineryAuthorized"
                        />
                        <VnLv
                            :label="t('worker.summary.isDisable')"
                            :value="advancedSummary.isDisable"
                        />
                    </div>
                </div>
            </QCard>
            <QCard class="vn-one">
                <VnTitle :text="t('worker.summary.userData')" />
                <VnLv :label="t('globals.name')" :value="worker?.user?.nickname" />
                <VnLv
                    :label="t('globals.params.email')"
                    :value="worker.user?.emailUser?.email"
                    copy
                />
                <VnLv :label="t('worker.summary.role')">
                    <template #value>
                        <span class="link">
                            {{ worker?.user?.role?.name }}
                            <RoleDescriptorProxy :id="worker?.user?.role?.id" />
                        </span>
                    </template>
                </VnLv>
                <VnLv :value="worker?.sip?.extension">
                    <template #label>
                        {{ t('worker.summary.sipExtension') }}
                        <VnLinkPhone :phone-number="worker?.sip?.extension" />
                    </template>
                </VnLv>
                <VnLv :label="t('queue')" :value="worker.sip?.queueMember?.queue" />
            </QCard>
            <QCard class="vn-one" v-if="advancedSummary">
                <VnTitle
                    :url="`#/worker/${entityId}/business`"
                    :text="t('worker.summary.business')"
                />
                <VnLv
                    :label="t('worker.summary.started')"
                    :value="toDate(advancedSummary.currentBusiness?.started)"
                />
                <VnLv
                    :label="t('worker.summary.ended')"
                    :value="toDate(advancedSummary.currentBusiness?.ended)"
                />

                <VnLv
                    :label="t('worker.summary.reasonEnd')"
                    :value="advancedSummary.currentBusiness?.reasonEnd?.reason"
                />
                <VnLv
                    :label="t('worker.summary.notes')"
                    :value="advancedSummary.currentBusiness?.notes"
                />
            </QCard>
        </template>
    </CardSummary>
</template>
