微信公共号

nngkxxdp/src/main/resources/static/xmtjz/index.html

@@ -123,87 +123,8 @@
         <li><img src="images/toutiao2.png" alt=""><span>今日头条</span></li>
     </ul>
     <div class="list">
-        <div style="width: 697px;position: relative;">
-            <ul class="banner">
-                <li class="click">南岸区</li>
-                <li>各区县政府</li>
-                <li>巿级部门</li>
-            </ul>
-            <ul class="item">
-                <li class="click">
-                    <img src="images/logo-zf.png" alt="" class="logo">
-                    <div class="name">
-                        <span>重</span><span>庆</span><span>市</span><span>南</span><span>岸</span><span>区</span><span>人</span>民<span></span>
-                        <span>政</span><span>府</span>
-                    </div>
-                    <img src="images/erweima.png" alt="" class="code">
-                </li>
-                <li>
-                    <img src="images/logo-zf.png" alt="" class="logo">
-                    <div class="name">
-                        <span>重</span><span>庆</span><span>市</span><span>南</span><span>岸</span><span>区</span><span>人</span>民<span></span>
-                        <span>政</span><span>府</span>
-                    </div>
-                    <img src="images/erweima.png" alt="" class="code">
-                </li>
-                <li>
-                    <img src="images/logo-zf.png" alt="" class="logo">
-                    <div class="name">
-                        <span>重</span><span>庆</span><span>市</span><span>南</span><span>岸</span><span>区</span><span>人</span>民<span></span>
-                        <span>政</span><span>府</span>
-                    </div>
-                    <img src="images/erweima.png" alt="" class="code">
-                </li>
-                <li>
-                    <img src="images/logo-zf.png" alt="" class="logo">
-                    <div class="name">
-                        <span>重</span><span>庆</span><span>市</span><span>南</span><span>岸</span><span>区</span><span>人</span>民<span></span>
-                        <span>政</span><span>府</span>
-                    </div>
-                    <img src="images/erweima.png" alt="" class="code">
-                </li>
-                <li>
-                    <img src="images/logo-zf.png" alt="" class="logo">
-                    <div class="name">
-                        <span>重</span><span>庆</span><span>市</span><span>南</span><span>岸</span><span>区</span><span>人</span>民<span></span>
-                        <span>政</span><span>府</span>
-                    </div>
-                    <img src="images/erweima.png" alt="" class="code">
-                </li>
-                <li>
-                    <img src="images/logo-zf.png" alt="" class="logo">
-                    <div class="name">
-                        <span>重</span><span>庆</span><span>市</span><span>南</span><span>岸</span><span>区</span><span>人</span>民<span></span>
-                        <span>政</span><span>府</span>
-                    </div>
-                    <img src="images/erweima.png" alt="" class="code">
-                </li>
-                <li>
-                    <img src="images/logo-zf.png" alt="" class="logo">
-                    <div class="name">
-                        <span>重</span><span>庆</span><span>市</span><span>南</span><span>岸</span><span>区</span><span>人</span>民<span></span>
-                        <span>政</span><span>府</span>
-                    </div>
-                    <img src="images/erweima.png" alt="" class="code">
-                </li>
-                <li>
-                    <img src="images/logo-zf.png" alt="" class="logo">
-                    <div class="name">
-                        <span>重</span><span>庆</span><span>市</span><span>南</span><span>岸</span><span>区</span><span>人</span>民<span></span>
-                        <span>政</span><span>府</span>
-                    </div>
-                    <img src="images/erweima.png" alt="" class="code">
-                </li>
-                <li>
-                    <img src="images/logo-zf.png" alt="" class="logo">
-                    <div class="name">
-                        <span>重</span><span>庆</span><span>市</span><span>南</span><span>岸</span><span>区</span><span>人</span>民<span></span>
-                        <span>政</span><span>府</span>
-                    </div>
-                    <img src="images/erweima.png" alt="" class="code">
-                </li>
-            </ul>
-            <div class="message">
+        <div style="width: 1394px;position: relative;">
+            <div class="message" style="display: none;position: absolute;z-index: 11;">
                 <div style="background-image: url(images/m.jpg);" alt="" class="img">
                     开幕！
                 </div>
@@ -214,15 +135,13 @@
                 </ul>
                 <div class="arrow"></div>
             </div>
-        </div>
-        <div style="width: 697px;">
             <ul class="banner">
-                <li style="background: #fff;"></li>
-                <li style="background: #fff;"></li>
-                <li style="background: #fff;"></li>
+                <li index="2" class="click">南岸区</li>
+                <li index="0">各区县政府</li>
+                <li index="1">巿级部门</li>
             </ul>
             <ul class="item">
-                <li>
+                <li class="click">
                     <img src="images/logo-zf.png" alt="" class="logo">
                     <div class="name">
                         <span>重</span><span>庆</span><span>市</span><span>南</span><span>岸</span><span>区</span><span>人</span>民<span></span>
@@ -286,7 +205,7 @@
                     </div>
                     <img src="images/erweima.png" alt="" class="code">
                 </li>
-                <li>
+                <li class="wxInfo" onclick="openDetail()">
                     <img src="images/logo-zf.png" alt="" class="logo">
                     <div class="name">
                         <span>重</span><span>庆</span><span>市</span><span>南</span><span>岸</span><span>区</span><span>人</span>民<span></span>
@@ -329,6 +248,7 @@
         initHotData();
         // 获取热点推荐数据
         getHotRecommend();
+        // 获取微信公众号南岸区数据
     };
     // 日历选择时间
     layui.use('laydate', function () {
@@ -429,7 +349,7 @@
 <script>
     // 获取热点推荐
     function getHotRecommend() {
-        var items = [0,1,2,3,4,5];
+        var items = [0, 1, 2, 3, 4, 5];
         var hotIndexs = getRandomArrayElements(items, 4);
         var subIndexs = [];
         subIndexs.push(getRandom(hotList[hotIndexs[0]].length))
@@ -437,10 +357,30 @@
         subIndexs.push(getRandom(hotList[hotIndexs[2]].length))
         subIndexs.push(getRandom(hotList[hotIndexs[3]].length))
         var hotData = []
-        for (var i=0;i<4;i++) {
+        for (var i = 0; i < 4; i++) {
             hotData.push(hotList[hotIndexs[i]][subIndexs[i]])
         }
         var hotHtml = ""
+        hotData.forEach((item) = > {
+            hotHtml += "<div class=\"mokuai1\">" +
+                "<div class=\"top\">" + item.title + "</div>" +
+                "<div class=\"center\">" +
+                "<div class=\"left\">" + item.nowTime + "</div>" +
+                "<div class=\"right\">" +
+                "<img src=\"images/ef-redian-gongju.png\"></img>" +
+                "<p>10w+</p>" +
+                "</div>" +
+                "</div>" +
+                "<div class=\"border\"></div>" +
+                "<div class=\"bottom\">" +
+                "<img class=\"left\" src='" + getHotLogo(item.officialAccount) + "'></img>" +
+                "<div class=\"center\">" + item.officialAccount + "</div>" +
+                "<img class=\"right\" src=\"images/erweima.png\"></img>" +
+                "</div>" +
+                "</div>"
+        }
+    )
+        ;
         hotData.forEach((item) => {
             hotHtml += `<div onclick="openUrl('${item.url}')" class="mokuai1 select-hand"><div class="top">${item.title}</div><div class="center"><div class="left">${item.nowTime}</div><div class="right"></div></div><div class="border"></div><div class="bottom"><img class="left" src="${getHotLogo(item.officialAccount)}"></img><div class="center">${item.officialAccount}</div><img class="right" src="images/erweima.png"></div></div>`
         });
@@ -488,6 +428,7 @@
             $(this).removeClass('hover');
         })
     }
+
     // 初始化热点推荐的列表
     function initHotData() {
         hot1 = getHotData({page: 1, limit: 12, name: "重庆市南岸区人民政府"}, PATH);
@@ -496,10 +437,15 @@
         hot4 = getHotData({page: 1, limit: 12, name: "南岸健康卫士"}, PATH);
         hot5 = getHotData({page: 1, limit: 12, name: "南岸公安"}, PATH);
         hot6 = getHotData({page: 1, limit: 12, name: "重庆南岸消防"}, PATH);
-        hotList.push(hot1);hotList.push(hot2);hotList.push(hot3);
-        hotList.push(hot4);hotList.push(hot5);hotList.push(hot6);
+        hotList.push(hot1);
+        hotList.push(hot2);
+        hotList.push(hot3);
+        hotList.push(hot4);
+        hotList.push(hot5);
+        hotList.push(hot6);
         console.log('list', hotList)
     }
+
     // 拿随机数组
     function getRandomArrayElements(arr, count) {
         var shuffled = arr.slice(0), i = arr.length, min = i - count, temp, index;
@@ -511,27 +457,72 @@
         }
         return shuffled.slice(min);
     }
+
     // 拿随机值
     function getRandom(max) {
-        return Math.round(Math.random()*max);
+        return Math.round(Math.random() * max);
     }
+
     function getHotLogo(str) {
         switch (str) {
             case "重庆市南岸区人民政府":
-                return "images/logo-zf.png";break;
+                return "images/logo-zf.png";
+                break;
             case "广阳湾智创生态城":
-                return "images/logo-zcstc.png";break;
+                return "images/logo-zcstc.png";
+                break;
             case "南岸文旅":
-                return "images/logo-nawl.png";break;
+                return "images/logo-nawl.png";
+                break;
             case "南岸健康卫士":
-                return "images/logo-najkws.png";break;
+                return "images/logo-najkws.png";
+                break;
             case "南岸公安":
-                return "images/logo-naga.png";break;
+                return "images/logo-naga.png";
+                break;
             case "重庆南岸消防":
-                return "images/logo-naxf.png";break;
+                return "images/logo-naxf.png";
+                break;
         }
     }
 </script>
 
+<script>
+    var page = 1, limit = 12, regionlimit = 10;
+    // 南岸区公众号矩阵的tab进行切换
+    $(".third .banner li").click(function () {
+        var index = this.getAttribute("index");
+        page = 1;
+        if (index == 2) {
+            initPage();
+        } else if (index == 0) {
+            regionPage(2);
+        } else if (index == 1) {
+            departments(1);
+        }
+    })
+    function openDetail() {
+        var tapsTitleLi = $('.third .list li .wxInfo');
+        console.log(tapsTitleLi);
+    }
+    // $('.third .list li').onclick(function () {
+    //     console.log("12312312")
+    //     $(this).addClass('hover');
+    //     var tapsTitleLi = $('.third .list li');
+    //     tapsTitleLi.each(function (index) {
+    //         var classStr = $(this).attr('class');
+    //         console.log(classStr);
+    //         if (classStr && classStr.indexOf('hover') != -1) {
+    //             $('.third .message').css('top', (index * 75) + 'px')
+    //         }
+    //     });
+    //     $('.third .message').css('display', 'flex')
+    // })
+    // $('.third .list li').mouseout(function () {
+    //     $('.third .message').css('display', 'none')
+    //     $(this).removeClass('hover');
+    // })
+</script>
+
 
 </html>

nngkxxdp/src/main/resources/static/xmtjz/js/index.js

@@ -48,6 +48,37 @@ function changeDate(params, path) {
   });
 }
 
+function initPage() {
+    var loading = layer.load(2, {
+        shade: [0.3, '#393D49'],
+    });
+
+    $.ajax({
+        type: 'GET',
+        url: PATH + '/article/getAllOfficialAccount',
+        dataType: 'json',
+        data: {
+            'official': '重庆市南岸区人民政府'
+        },
+        success: function (json) {
+            if (json.data) {
+                var data = json.data;
+                topData = data.array;
+                ofaData = data.ofa;
+                // initTop(data.array);
+                // $('.box-contanier').empty().append(topLeftComponent(topData[topModule[0]], topModule[0]) + topRightComponent(topData[topModule[1]], topModule[1]));
+                $('.box-contanier').empty().append(topComponent(topData, topModule[0]));
+                initCenterByLeft(data.ofa);
+                initJrttList(data.jrtt);
+            }
+            layer.close(loading);
+        },
+        error: function (e) {
+            layer.close(loading);
+        }
+    });
+}
+
 function openUrl(url) {
   window.open(url);
 }