初始化提交

js/case.js

@@ -0,0 +1,107 @@
+// 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) {
+    }
+})
+