// 收件人
let addresseeName = document.querySelector(".addressee-name input")
// 收件人联系电话
let addresseePhone = document.querySelector(".addressee-phone input")
// 收货地址-城市下拉框
let citySelect = document.querySelectorAll(".distpicker select")
// 收货地址-详细地址
let addressInfo = document.querySelector(".addressee-address textarea")

// 添加收货地址弹框显示/隐藏
function popUpShow() {
    document.querySelector(".address-pop-up").style.display = "block"
}

function popUpHide() {
    document.querySelector(".address-pop-up").style.display = "none"
}

// 收件人校验
function nameCheckFun() {
    addresseeName.onfocus = function () {
        if (this.nextElementSibling.style.display === "block") {
            this.style.border = "1px #FF7200 solid"
        } else {
            this.style.border = "1px #0147a6 solid"
        }
    }
    addresseeName.onblur = function () {
        if (this.value === "") {
            this.style.border = "1px #FF7200 solid"
            this.nextElementSibling.style.display = "block"
        } else {
            this.style.border = "1px #c1c1c1 solid"
            this.nextElementSibling.style.display = "none"
        }
    }
}

// 收件人联系电话正则校验
function phoneCheckFun() {
    addresseePhone.onfocus = function () {
        if (this.nextElementSibling.style.display === "block") {
            this.style.border = "1px #FF7200 solid"
        } else {
            this.style.border = "1px #0147a6 solid"
        }
    }
    addresseePhone.onblur = function () {
        if (this.value === "") {
            this.style.border = "1px #FF7200 solid"
            this.nextElementSibling.style.display = "block"
        } else {
            if (phoneCheck.test(this.value)) {
                this.style.border = "1px #c1c1c1 solid"
                this.nextElementSibling.style.display = "none"
            } else {
                this.style.border = "1px #FF7200 solid"
                this.nextElementSibling.style.display = "block"
                this.nextElementSibling.innerHTML = "请您输入正确的手机号码"
            }
        }
    }
}

// 收货地址-城市下拉框
function cityCheckFun() {
    for (let i = 0, j = citySelect.length; i < j; i++) {
        citySelect[i].onfocus = function () {
            citySelect[i].style.border = "1px #0147a6 solid"
        }
        citySelect[i].onblur = function () {
            if (citySelect[i].value === "") {
                citySelect[i].style.border = "1px #FF7200 solid"
            } else {
                citySelect[i].style.border = "1px #c1c1c1 solid"
            }
        }
    }
}

// 收货地址-详细地址
function addressInfoCheckFun() {
    addressInfo.onfocus = function () {
        if (this.nextElementSibling.style.display === "block") {
            this.style.border = "1px #FF7200 solid"
        } else {
            this.style.border = "1px #0147a6 solid"
        }
    }
    addressInfo.onblur = function () {
        if (this.value === "") {
            this.style.border = "1px #FF7200 solid"
            this.nextElementSibling.style.display = "block"
        } else {
            this.style.border = "1px #c1c1c1 solid"
            this.nextElementSibling.style.display = "none"
        }
    }
}

// 提交时表单验证方法
function saveFormCheckFun() {
    if (addresseeName.value === "") {
        addresseeName.nextElementSibling.style.display = "block"
        addresseeName.style.border = "1px #FF7200 solid"
    } else {
        addresseeName.nextElementSibling.style.display = "none"
        addresseeName.style.border = "1px #c1c1c1 solid"
    }
    if (addresseePhone.value === "") {
        addresseePhone.nextElementSibling.style.display = "block"
        addresseePhone.style.border = "1px #FF7200 solid"
    } else {
        if (phoneCheck.test(addresseePhone.value)) {
            addresseePhone.style.border = "1px #c1c1c1 solid"
            addresseePhone.nextElementSibling.style.display = "none"
        } else {
            addresseePhone.style.border = "1px #FF7200 solid"
            addresseePhone.nextElementSibling.style.display = "block"
            addresseePhone.nextElementSibling.innerHTML = "请您输入正确的手机号码"
        }
    }
    for (let i = 0, j = citySelect.length; i < j; i++) {
        if (citySelect[i].value === "") {
            citySelect[i].style.border = "1px #FF7200 solid"
        } else {
            citySelect[i].style.border = "1px #c1c1c1 solid"
        }
    }
    if (addressInfo.value === "") {
        addressInfo.nextElementSibling.style.display = "block"
        addressInfo.style.border = "1px #FF7200 solid"
    } else {
        addressInfo.nextElementSibling.style.display = "none"
        addressInfo.style.border = "1px #c1c1c1 solid"
    }
}

// 页面加载时执行
window.onload = function () {
    nameCheckFun();
    phoneCheckFun();
    cityCheckFun();
    addressInfoCheckFun();
    let addressList = document.querySelectorAll(".address-list")
    if (addressList.length > 0) {
        document.querySelector(".address-wrapper .title p").style.display = "flex"
        document.querySelector(".add-address-none").style.display = "none"
        addressList[0].style.border = " 1px solid #0147a6 "
        for (let i = 0, j = addressList.length; i < j; i++) {
            addressList[i].onclick = function () {
                for (let i = 0; i < addressList.length; i++) {
                    addressList[i].style.border = "1px solid #fff "
                }
                this.style.border = "1px solid #0147a6"
            }
        }
        let setDefaultBtn = document.querySelectorAll(".address-wrapper .set-default")
        for (let i = 0, j = setDefaultBtn.length; i < j; i++) {
            setDefaultBtn[i].onclick = function () {
                for (let i = 0; i < setDefaultBtn.length; i++) {
                    setDefaultBtn[i].parentNode.parentNode.querySelector(".default").style.display = "none"
                    setDefaultBtn[i].style.display = "inline-block"
                }
                this.parentNode.previousElementSibling.querySelector(".default").style.display = "block"
                this.style.display = "none"
            }
        }
        let delBtn = document.querySelectorAll(".address-wrapper .del")
        for (let i = 0, j = delBtn.length; i < j; i++) {
            delBtn[i].onclick = function () {
                this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode)
                let addressListLength = document.querySelectorAll(".address-list").length
                if (addressListLength === 0) {
                    document.querySelector(".address-wrapper .title p").style.display = "none"
                    document.querySelector(".add-address-none").style.display = "flex"
                }
            }
        }
    }
}