class index {
    constructor() {
        this.baseUrl = "http://127.0.0.1:3000/api"
        this.index = 0;
        this.getLeftMenu();
    }



    getLeftMenu() {
        var self = this;
        $.ajax({
            type: "GET",
            url: this.baseUrl + "/type/leftMenu",
            success: function (res) {
                self.leftArr = res.result
                self.leftArr.forEach((v, i) => {
                    $(".left").append(`
                        <li  class="${i == 0 ? 'active' : ''}">
                            <div style="background-position: 0 ${v.position}px;" class="img"></div>
                            <p>${v.title}</p>
                        </li>
                    `);
                });

                $(".left li").click(function () {
                    $(this).addClass("active").siblings().removeClass("active")
                    self.index = $(this).index();
                    self.getRightMenu()
                });

                self.getRightMenu();


            }
        });
    }

    getRightMenu() {
        var self = this;
        $.ajax({
            type: "GET",
            url: this.baseUrl + "/type/rightMenu",
            data: {
                url: this.leftArr[this.index].url
            },
            success: function (res) {
                console.log(res.result);
                $(".right").empty();
                res.result.forEach(v => {
                    $(".right").append(`
                    <li>
                        <img src="${v.img}" alt="">
                        <p>${v.title}</p>
                    </li>
                    `)
                })
            }
        });
    }
}


new index();