// Avoid `console` errors in browsers that lack a console.
// 记录高亮 成功案例
let index = 1
function changePage(i) {
    // 移除兄弟元素样式
    $(`#role${i}`).siblings().removeClass("active")
    // 设置选中  数字选中
    if (typeof i === "number") {
        $(`#role${i}`).addClass("active")
        index = i
    } else {//上下分页  判断最长和最短 
        if (index <= 0 && index > 3) return
        i ? changePage(--index) : changePage(++index)
    }
}
function changeclick() {
    console.log(123);
}

$.ajax({
    url: serveUrl + '?c=index&a=case_list',
    type: 'post',
    dataType: 'json',
    data: {
        www: 5,
        page: 1,
        pagesize: 10,
    },
    success: function (res) {
        //getting data
        var caseTada = res.data.list
        var cont = res.data.count
        console.log(cont);
        //right case
        var caseRight = ''
        for (var i = 0; i <= 2; i++) {
            caseRight += `
                <div class="sidebar-rc-post">
                <ul>
                    <li style="border-bottom:1px solid #c0c0c0;margin-bottom:15px;padding-bottom:15px">
                        <div class="rc-post-thumb">
                            <a href="case-details.html?id=${caseTada[i].id}">
                                <img id="modal" style=" display:block;width:85px;height:65px;" src="${caseTada[i].img}" alt="" />
                            </a>
                        </div>
                        <div class="rc-post-content">
                            <h4 style="width:320px !important">
                                <a href="case-details.html?id=${caseTada[i].id}">${caseTada[i].title}</a>
                            </h4>
                            <div class="widget-date">${timestampToTime(Number(caseTada[i].create_time))}</div>
                        </div>
                    </li>
                    

                </ul>
                </div>				
                `
        }
        $('#caseTree').append(caseRight)
        //   left case
        var caseDetails = ''
        for (var i = 0; i < caseTada.length; i++) {
            caseDetails += `
                <div class="blog-wrapper mb-40">
                <div class="blog-thumb">
                    <img class="bottom-case" src="${caseTada[i].img}" alt="" />
                </div>
                <div class="meta-info">
                    <ul>
                        <li class="posts-time">${timestampToTime(Number(caseTada[i].create_time))}</li>
                    </ul>
                </div>
                <div class="blog-content">
                   
                    <h class="title1">${caseTada[i].title} </h>
                    <p class="title2">${caseTada[i].title} </p>
                    <p></p>
                </div>
                <div class="link-box">
                    <a href="case-details.html?id=${caseTada[i].id}">查看详情</a>
                </div>
            </div>
                `
        }
        $('#fatherel').append(caseDetails)
        //paging device
        pageHtml = `<li id="upPage" onclick="changePage(true)">
                             <a href="#">上一页</a>
                       </li>`

        for (let i = 1; i <= Math.ceil(res.data.count / 10); i++) {
            pageHtml += `<li class="${i ? '' : 'active'}" id="role${i}" onclick="changeclick">
                <a href="case.html">
                    <span>${i}</span>
                </a>
            </li>
                `
        }
        pageHtml += `<li onclick="changePage(false)">
                                  <a href="#" id="nextPage">下一页</a>
                          </li>`
        $('#pageUl').append(pageHtml)
    },
    error: function (err) {
    }
})