class Edit {
    constructor() {
        title("分类管理")
        this.principal = JSON.parse(localStorage.getItem("principal"))
        this.additional = JSON.parse(localStorage.getItem("additional"))

        this.renderPage()
    }

    renderPage() {
        $(".selected ul").innerHTML = ""
        this.principal.forEach(v => {
            $(".selected ul").innerHTML += `
                <li>${v.title}</li>
            `
        });

        $(".optional ul").innerHTML = ""

        this.additional.forEach(v => {
            $(".optional ul").innerHTML += `
                <li>${v.title}</li>
            `
        });

        click(".selected ul li", (v,i) => {
            if (i != 0) {
                this.additional.push(this.principal[i])
                this.principal = this.principal.filter((val,index) => {
                    return index != i
                });

                localStorage.setItem("principal", JSON.stringify(this.principal))
                localStorage.setItem("additional", JSON.stringify(this.additional))
        
                this.renderPage()
            }
        })

        click(".optional ul li", (v,i) => {
            this.principal.push(this.additional[i])
            this.additional = this.additional.filter((val,index) => {
                return index != i
            });

            localStorage.setItem("principal", JSON.stringify(this.principal))
            localStorage.setItem("additional", JSON.stringify(this.additional))
    
            this.renderPage()
        })
    }
}
new Edit()