
<template>
    <div>
        <div class="breadcrumb-header justify-content-between">
            <div class="my-auto">
                <h4 class="page-title">Cấu hình bảng giá mặc định</h4>
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="javascript:void(0);">Trang chủ</a></li>
                    <li class="breadcrumb-item active" aria-current="page">Cấu hình bảng giá mặc định</li>
                </ol>
            </div>
        </div>
        <div class="row row-sm">
            <div class="col-12 mb-3">
                <button class="btn btn-success" type="button" @click="exportToExcel">
                    <i class="fe fe-download"></i>
                    <span class="pl-2"> Xuất Excel</span>
                </button>
            </div>
            <div class="col-lg-3 col-md-4">
                <div class="card custom-card">
                    <div class="card-header">
                        <div class="card-title">Loại giá</div>
                    </div>
                    <div class="main-content-left main-content-left-mail card-body pt-0 ">
                        <div class="main-settings-menu">
                            <nav class="nav main-nav-column">
                                <template v-for="menuItem in sidebarMenuList">
                                    <a @click="selectMenu(menuItem.Id)" class="nav-link thumb mb-2"
                                        href="javascript:void(0);" :class="menuItem.Id === selectedMenu ? 'active' : ''">
                                        <i class="fe fe-navigation"></i> {{ menuItem.Name }} </a>
                                </template>


                            </nav>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-lg-9 col-md-8">
                <PriceList v-if="selectedMenu === 1" priceType="1"></PriceList>
                <PriceList v-if="selectedMenu === 2" priceType="2"></PriceList>
            </div>

        </div>

    </div>
</template>

<script setup>
//#region Imports
import { ref, reactive, onMounted } from 'vue'

//#endregion

//#region Services
import priceService from "@/services/priceService";
//#endregion


//#region Imports
import PriceList from './components/priceList.vue';
//#endregion


const sidebarMenuList = [
    { Id: 1, Name: "Giá cố định theo khoảng" },
    { Id: 2, Name: "Bước giá theo khoảng" }
];
const selectedMenu = ref(1);


const selectMenu = (id) => {

    selectedMenu.value = id;

};

const exportToExcel = async () => {
    var result = await priceService.exportDefaultPriceList();
    console.log(result);
    if (result.Result === 1) {
        if (result.Url.length > 0) {
            const link = document.createElement("a");
            link.href = result.Url;
            // link.setAttribute("download", "banggia.xlsx");
            // document.body.appendChild(link);
            link.click();

        }
    } else {

    }
};

</script>
