<template>
    <div class="flex flex-col w-full gap-2 lg:flex-row">
        <div class="bg-white flex-1 p-[20px] rounded-[10px] space-y-4">
            <CardAttribute
                :title="$t('Register.processing_projects')"
                :value="user.processing_projects_count"
            />
            <CardAttribute
                :title="
                    isClient
                        ? $t('Register.new_proposals')
                        : $t('projects.successful_jobs')
                "
                :value="isClient ? user.proposal_count : user.successful_jobs"
            />

            <Button
                :href="
                    !isClient
                        ? route('projects.index')
                        : route('client.projects.create')
                "
                buttonStyle="blue_view"
                size="full-sm"
            >
                <div class="w-full flex items-center justify-center gap-1.5">
                    <span>
                        <svg
                            v-if="isClient"
                            width="15"
                            height="14"
                            viewBox="0 0 15 14"
                            fill="none"
                            xmlns="http://www.w3.org/2000/svg"
                        >
                            <g clip-path="url(#clip0_1103_51150)">
                                <path
                                    d="M8.75 3.33398V12.6673"
                                    stroke="white"
                                    stroke-width="1.5"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                />
                                <path
                                    d="M4.0835 8H13.4168"
                                    stroke="white"
                                    stroke-width="1.5"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                />
                            </g>
                            <defs>
                                <clipPath id="clip0_1103_51150">
                                    <rect
                                        width="16"
                                        height="16"
                                        fill="white"
                                        transform="translate(0.75)"
                                    />
                                </clipPath>
                            </defs>
                        </svg>
                        <svg
                            v-if="!isClient"
                            width="15"
                            height="14"
                            viewBox="0 0 15 14"
                            fill="none"
                            xmlns="http://www.w3.org/2000/svg"
                        >
                            <g clip-path="url(#clip0_1103_51140)">
                                <path
                                    d="M7.41667 11.3333C9.994 11.3333 12.0833 9.244 12.0833 6.66667C12.0833 4.08934 9.994 2 7.41667 2C4.83934 2 2.75 4.08934 2.75 6.66667C2.75 9.244 4.83934 11.3333 7.41667 11.3333Z"
                                    stroke="white"
                                    stroke-width="1.5"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                />
                                <path
                                    d="M14.75 14L10.75 10"
                                    stroke="white"
                                    stroke-width="1.5"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                />
                            </g>
                            <defs>
                                <clipPath id="clip0_1103_51140">
                                    <rect
                                        width="16"
                                        height="16"
                                        fill="white"
                                        transform="translate(0.75)"
                                    />
                                </clipPath>
                            </defs>
                        </svg> </span
                    >{{
                        isClient
                            ? $t("Register.create")
                            : $t("Register.explore")
                    }}
                    {{ $t("Register.new_project") }}
                </div>
            </Button>
        </div>
        <div class="bg-white flex-1 p-[20px] rounded-[10px] space-y-4">
            <CardAttribute
                :title="$t('Register.active_orders')"
                :value="user.active_orders_count"
            />
            <CardAttribute
                :title="$t('Register.orders_requests')"
                :value="
                    isClient
                        ? user.service_orders_count
                        : user.servicesOrders.length
                "
            />

            <Button
                :href="
                    isClient
                        ? route('services.index')
                        : $page.props.user?.is_engineer
                        ? route('engineer.services.create')
                        : route('firm.services.create')
                "
                buttonStyle="blue_view"
                size="full-sm"
            >
                <span class="w-full flex items-center justify-center gap-1.5">
                    <span class="">
                        <svg
                            v-if="isClient"
                            width="15"
                            height="14"
                            viewBox="0 0 15 14"
                            fill="none"
                            xmlns="http://www.w3.org/2000/svg"
                        >
                            <g clip-path="url(#clip0_1103_51140)">
                                <path
                                    d="M7.41667 11.3333C9.994 11.3333 12.0833 9.244 12.0833 6.66667C12.0833 4.08934 9.994 2 7.41667 2C4.83934 2 2.75 4.08934 2.75 6.66667C2.75 9.244 4.83934 11.3333 7.41667 11.3333Z"
                                    stroke="white"
                                    stroke-width="1.5"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                />
                                <path
                                    d="M14.75 14L10.75 10"
                                    stroke="white"
                                    stroke-width="1.5"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                />
                            </g>
                            <defs>
                                <clipPath id="clip0_1103_51140">
                                    <rect
                                        width="16"
                                        height="16"
                                        fill="white"
                                        transform="translate(0.75)"
                                    />
                                </clipPath>
                            </defs>
                        </svg>
                        <svg
                            v-if="!isClient"
                            width="15"
                            height="14"
                            viewBox="0 0 15 14"
                            fill="none"
                            xmlns="http://www.w3.org/2000/svg"
                        >
                            <g clip-path="url(#clip0_1103_51150)">
                                <path
                                    d="M8.75 3.33398V12.6673"
                                    stroke="white"
                                    stroke-width="1.5"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                />
                                <path
                                    d="M4.0835 8H13.4168"
                                    stroke="white"
                                    stroke-width="1.5"
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                />
                            </g>
                            <defs>
                                <clipPath id="clip0_1103_51150">
                                    <rect
                                        width="16"
                                        height="16"
                                        fill="white"
                                        transform="translate(0.75)"
                                    />
                                </clipPath>
                            </defs>
                        </svg>
                    </span>
                    {{
                        isClient
                            ? $t("Register.explore")
                            : $t("Register.create")
                    }}
                    {{ $t("Register.new_service") }}
                </span>
            </Button>
        </div>
    </div>
</template>

<script>
import moment from "moment";
import Button from "@/Jetstream/Button";
import CardAttribute from "./CardAttribute.vue";
export default {
    props: { user: {}, isClient: false },
    data() {
        return {
            checkstate: false,
        };
    },
    components: {
        Button,
        CardAttribute,
    },
    mounted() {},
};
</script>
