|
@@ -36,133 +36,172 @@
|
|
|
</head>
|
|
|
|
|
|
<body>
|
|
|
-<div class="cont-width first" style="display: flex;">
|
|
|
- <div class="left" style="width: 838px;padding-right: 47px;border-right: 1px solid rgb(20 88 180 / 18%);">
|
|
|
- <div class="title" style="background-image: url(images/line.png);">
|
|
|
- 南岸区政务新媒体发布厅
|
|
|
- </div>
|
|
|
- <div style="display: flex;justify-content: space-between;position: relative;">
|
|
|
- <ul class="list">
|
|
|
- <li class="click">
|
|
|
- <img src="images/logo-zf.png" alt=""><span>重庆市南岸区人民政府</span>
|
|
|
- <img src="images/code-b.png" alt="" class="code">
|
|
|
- <div class="arrow"></div>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <img src="images/logo-zcstc.png" alt=""><span>广阳湾智创生态城</span>
|
|
|
- <img src="images/code-a.png" alt="" class="code">
|
|
|
- <div class="arrow" style="display: none;"></div>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <img src="images/logo-nawl.png" alt=""><span>南岸文旅</span>
|
|
|
- <img src="images/code-a.png" alt="" class="code">
|
|
|
- <div class="arrow" style="display: none;"></div>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <img src="images/logo-najkws.png" alt=""><span>南岸健康卫士</span>
|
|
|
- <img src="images/code-a.png" alt="" class="code">
|
|
|
- <div class="arrow" style="display: none;"></div>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <img src="images/logo-naga.png" alt=""><span>南岸公安</span>
|
|
|
- <img src="images/code-a.png" alt="" class="code">
|
|
|
- <div class="arrow" style="display: none;"></div>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <img src="images/logo-naxf.png" alt=""><span>重庆南岸消防</span>
|
|
|
- <img src="images/code-a.png" alt="" class="code">
|
|
|
- <div class="arrow" style="display: none;"></div>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- <div class="codeBig code1" style="display: none;position: absolute;z-index: 11;">
|
|
|
- <div id="hoverTitle" style="font-weight: bold;"></div>
|
|
|
- <img id="hoverImg" src="images/code-big.png" alt="">
|
|
|
- <div style="display: flex;align-items: center;">
|
|
|
- <div class="line"></div>
|
|
|
- <div>扫码关注</div>
|
|
|
- <div class="line"></div>
|
|
|
+ <div class="cont-width first" style="display: flex;">
|
|
|
+ <div class="left" style="width: 838px;padding-right: 47px;border-right: 1px solid rgb(20 88 180 / 18%);">
|
|
|
+ <div class="title" style="background-image: url(images/line.png);">
|
|
|
+ 南岸区政务新媒体发布厅
|
|
|
+ </div>
|
|
|
+ <div style="display: flex;justify-content: space-between;position: relative;">
|
|
|
+ <ul class="list">
|
|
|
+ <li class="click">
|
|
|
+ <img src="images/logo-zf.png" alt=""><span>重庆市南岸区人民政府</span>
|
|
|
+ <img src="images/code-b.png" alt="" class="code">
|
|
|
+ <div class="arrow"></div>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <img src="images/logo-zcstc.png" alt=""><span>广阳湾智创生态城</span>
|
|
|
+ <img src="images/code-a.png" alt="" class="code">
|
|
|
+ <div class="arrow" style="display: none;"></div>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <img src="images/logo-nawl.png" alt=""><span>南岸文旅</span>
|
|
|
+ <img src="images/code-a.png" alt="" class="code">
|
|
|
+ <div class="arrow" style="display: none;"></div>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <img src="images/logo-najkws.png" alt=""><span>南岸健康卫士</span>
|
|
|
+ <img src="images/code-a.png" alt="" class="code">
|
|
|
+ <div class="arrow" style="display: none;"></div>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <img src="images/logo-naga.png" alt=""><span>南岸公安</span>
|
|
|
+ <img src="images/code-a.png" alt="" class="code">
|
|
|
+ <div class="arrow" style="display: none;"></div>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <img src="images/logo-naxf.png" alt=""><span>重庆南岸消防</span>
|
|
|
+ <img src="images/code-a.png" alt="" class="code">
|
|
|
+ <div class="arrow" style="display: none;"></div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ <div class="codeBig code1" style="display: none;position: absolute;z-index: 11;">
|
|
|
+ <div id="hoverTitle" style="font-weight: bold;"></div>
|
|
|
+ <img id="hoverImg" src="images/code-big.png" alt="">
|
|
|
+ <div style="display: flex;align-items: center;">
|
|
|
+ <div class="line"></div>
|
|
|
+ <div>扫码关注</div>
|
|
|
+ <div class="line"></div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
+ <div class="message messagetop"></div>
|
|
|
</div>
|
|
|
- <div class="message messagetop"></div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="right" style="width: 477px;padding-left: 48px;">
|
|
|
- <div class="title" style="background-image: url(images/line2.png);">
|
|
|
- 南岸发布
|
|
|
</div>
|
|
|
- <div class="time">
|
|
|
- <div id="time" style="width: 100%;height:100%;position: absolute;display: flex;align-items: center;justify-content: center;">
|
|
|
+ <div class="right" style="width: 477px;padding-left: 48px;">
|
|
|
+ <div class="title" style="background-image: url(images/line2.png);">
|
|
|
+ 南岸发布
|
|
|
+ </div>
|
|
|
+ <div class="time">
|
|
|
+ <div id="time"
|
|
|
+ style="width: 100%;height:100%;position: absolute;display: flex;align-items: center;justify-content: center;">
|
|
|
+ </div>
|
|
|
+ <img src="images/logo-rl.png" alt="" class="logo">
|
|
|
+ <img id="arrowTimeImg" src="images/arrow.png" alt="" class="arrow">
|
|
|
+ </div>
|
|
|
+ <div class="message" style="padding: 2px 23px;">
|
|
|
+ <ul class="datali"></ul>
|
|
|
</div>
|
|
|
- <img src="images/logo-rl2.png" alt="" class="logo">
|
|
|
- <img id="arrowTimeImg" src="images/arrow.png" alt="" class="arrow">
|
|
|
- </div>
|
|
|
- <div class="message" style="padding: 2px 23px;">
|
|
|
- <ul class="datali"></ul>
|
|
|
</div>
|
|
|
</div>
|
|
|
-</div>
|
|
|
-<div class="cont-width second">
|
|
|
- <div class="recommended">
|
|
|
- <div class="title" style="background-image: url(images/recommended.png);">热点推荐</div>
|
|
|
- <div class="shuaxin">
|
|
|
- <i class="iconfont "></i>
|
|
|
- </div>
|
|
|
- <div class="huan select-hand" onclick="getHotRecommend()">
|
|
|
- 换一换
|
|
|
+ <div class="cont-width second">
|
|
|
+ <div class="recommended">
|
|
|
+ <div class="title" style="background-image: url(images/recommended.png);">热点推荐</div>
|
|
|
+ <div class="shuaxin">
|
|
|
+ <i class="iconfont "></i>
|
|
|
+ </div>
|
|
|
+ <div class="huan select-hand" onclick="getHotRecommend()">
|
|
|
+ 换一换
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div class="zhong" id="hotZhong">
|
|
|
+ <div class="zhong" id="hotZhong">
|
|
|
|
|
|
+ </div>
|
|
|
</div>
|
|
|
-</div>
|
|
|
-<div class="cont-width third">
|
|
|
- <ul class="top select-hand">
|
|
|
- <li id="headTab1" class="click" onclick="checkTab(1)"><img src="images/weixin.png" alt=""><span>微信公共号</span></li>
|
|
|
- <li id="headTab2" onclick="checkTab(2)"><img id="toutiaoImg" src="images/toutiao2.png" alt=""><span>今日头条</span></li>
|
|
|
- </ul>
|
|
|
- <div id="tab1" class="list" style="display: block">
|
|
|
- <div style="width: 1394px;position: relative;padding-bottom: 30px">
|
|
|
- <div id="messageDialogT" class="message" style="display:none;position: absolute;z-index: 11;">
|
|
|
- <div id="messageDialog"></div>
|
|
|
- <div id="messageArrow" class="arrow"></div>
|
|
|
+ <div class="cont-width third">
|
|
|
+ <ul class="top select-hand">
|
|
|
+ <li id="headTab1" class="click" onclick="checkTab(1)"><img src="images/weixin.png" alt=""><span>微信公共号</span>
|
|
|
+ </li>
|
|
|
+ <li id="headTab2" onclick="checkTab(2)"><img id="toutiaoImg" src="images/toutiao2.png"
|
|
|
+ alt=""><span>今日头条</span></li>
|
|
|
+ </ul>
|
|
|
+ <div id="tab1" class="list" style="display: block">
|
|
|
+ <div style="width: 1394px;position: relative;padding-bottom: 30px">
|
|
|
+ <div id="messageDialogT" class="message" style="display:none;position: absolute;z-index: 11;">
|
|
|
+ <div id="messageDialog"></div>
|
|
|
+ <div id="messageArrow" class="arrow"></div>
|
|
|
+ </div>
|
|
|
+ <ul class="banner" style="width: 697px;">
|
|
|
+ <li index="2" class="click" style="cursor:pointer;">南岸区</li>
|
|
|
+ <li index="0" style="cursor:pointer;">各区县政府</li>
|
|
|
+ <li index="1" style="cursor:pointer;">巿级部门</li>
|
|
|
+ </ul>
|
|
|
+ <ul class="item" id="ofaList"></ul>
|
|
|
</div>
|
|
|
- <ul class="banner" style="width: 697px;">
|
|
|
- <li index="2" class="click" style="cursor:pointer;">南岸区</li>
|
|
|
- <li index="0" style="cursor:pointer;">各区县政府</li>
|
|
|
- <li index="1" style="cursor:pointer;">巿级部门</li>
|
|
|
- </ul>
|
|
|
- <ul class="item" id="ofaList"></ul>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div id="tab2" class="toutiao" style="padding: 30px;display: none">
|
|
|
- <div id="jrttList">
|
|
|
- <!-- <div class="news-item">
|
|
|
+ <div id="tab2" class="toutiao" style="padding: 30px;display: none">
|
|
|
+ <div id="jrttList">
|
|
|
+ <!-- <div class="news-item">
|
|
|
<div class="jigou"><span>南岸文旅</span></div>
|
|
|
<p>离不开的南岸⑦ | 凭南卧听,彼岸时光</p>
|
|
|
<span class="time">2022-01-24 11:09</span>
|
|
|
</div> -->
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
-</div>
|
|
|
-<div class="cont-width four">
|
|
|
- <div>
|
|
|
- <div class="title" style="background-image: url(images/senction2.png);width: 1295px;">
|
|
|
- 政务新媒体服务集锦
|
|
|
+ <div class="cont-width four">
|
|
|
+ <div>
|
|
|
+ <div class="title" style="background-image: url(images/senction2.png);width: 1295px;">
|
|
|
+ 政务新媒体服务集锦
|
|
|
+ </div>
|
|
|
+ <ul class="down">
|
|
|
+ <li class="one model-item" data-url="images/xgyy.jpg">新冠疫苗预约</li>
|
|
|
+ <li class="two model-item" data-url="images/nasf_code.png">法律服务</li>
|
|
|
+ <li class="three model-item" data-url="images/shjf_code.png">生活缴费</li>
|
|
|
+ <li class="four model-item" data-url="images/wzcx_code.png">违规查询</li>
|
|
|
+ </ul>
|
|
|
</div>
|
|
|
- <ul class="down">
|
|
|
- <li class="one model-item" data-url="images/xgyy.jpg">新冠疫苗预约</li>
|
|
|
- <li class="two model-item" data-url="images/nasf_code.png">法律服务</li>
|
|
|
- <li class="three model-item" data-url="images/shjf_code.png">生活缴费</li>
|
|
|
- <li class="four model-item" data-url="images/wzcx_code.png">违规查询</li>
|
|
|
- </ul>
|
|
|
- </div>
|
|
|
|
|
|
-</div>
|
|
|
+ </div>
|
|
|
</body>
|
|
|
<script src="layui/layui.all.js"></script>
|
|
|
<script src="js/jquery-3.5.1.min.js"></script>
|
|
|
<script src="js/index.js"></script>
|
|
|
<script>
|
|
|
+ // 日历的监听事件
|
|
|
+ var timeInput = $('.first .right .time');
|
|
|
+ var logo = $('.first .right .logo');
|
|
|
+ var arrow = $('.first .right .arrow');
|
|
|
+ $(document).click(function () {
|
|
|
+ setTimeout(function () {
|
|
|
+ if ($('.layui-laydate').length) {
|
|
|
+ timeInput.css({ 'background': '#4DA1F6', 'color': '#FFFFFF' })
|
|
|
+ logo.attr('src', "images/logo-rl2.png")
|
|
|
+ arrow.attr('src', "images/arrow2.png");
|
|
|
+ } else {
|
|
|
+ timeInput.css({ 'background': '#F4FAFF', 'color': '#1458B4' })
|
|
|
+ logo.attr('src', "images/logo-rl.png")
|
|
|
+ arrow.attr('src', "images/arrow.png");
|
|
|
+ timeInput.removeClass('click');
|
|
|
+ }
|
|
|
+ }, 50)
|
|
|
+ })
|
|
|
+ $('.first .right .time').click(function () {
|
|
|
+ var classStr = $(this).attr('class');
|
|
|
+ if (classStr && classStr.indexOf('click') != -1) {
|
|
|
+ $(this).css({ 'background': '#F4FAFF', 'color': '#1458B4' })
|
|
|
+ logo.attr('src', "images/logo-rl.png")
|
|
|
+ arrow.attr('src', "images/arrow.png");
|
|
|
+ $('.layui-laydate').remove();
|
|
|
+ $(this).removeClass('click');
|
|
|
+ } else {
|
|
|
+ $(this).css({ 'background': '#4DA1F6', 'color': '#FFFFFF' })
|
|
|
+ logo.attr('src', "images/logo-rl2.png")
|
|
|
+ arrow.attr('src', "images/arrow2.png");
|
|
|
+ $(this).addClass('click');
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+</script>
|
|
|
+<script>
|
|
|
// 热点
|
|
|
var hotList = []
|
|
|
// 进入页面调用
|
|
@@ -180,15 +219,15 @@
|
|
|
});
|
|
|
});
|
|
|
// 南岸发布今天的数据
|
|
|
- changeDate({date: new Date()}, PATH);
|
|
|
+ changeDate({ date: new Date() }, PATH);
|
|
|
// 南岸区政务新媒体发布厅
|
|
|
- getajaxTop({page: 1, limit: 12, name: "重庆市南岸区人民政府"}, PATH);
|
|
|
+ getajaxTop({ page: 1, limit: 12, name: "重庆市南岸区人民政府" }, PATH);
|
|
|
// 初始化发布厅数据
|
|
|
initHotData();
|
|
|
// 获取热点推荐数据
|
|
|
getHotRecommend();
|
|
|
// 今日头条,微信公共号
|
|
|
- getTabData({type: 1, official: "重庆市南岸区人民政府"}, PATH);
|
|
|
+ getTabData({ type: 1, official: "重庆市南岸区人民政府" }, PATH);
|
|
|
// 微信公众号 南岸区
|
|
|
initPage();
|
|
|
};
|
|
@@ -204,25 +243,19 @@
|
|
|
showBottom: false,
|
|
|
max: maxtime,
|
|
|
change: function (value, date) {
|
|
|
- console.log(value, '999')
|
|
|
- console.log(date)
|
|
|
}, done: function (value, date, endDate) {
|
|
|
- changeDate({date: value}, PATH); // 时间改变获取值
|
|
|
- console.log(value, '88888'); //得到日期生成的值,如:2017-08-18
|
|
|
- console.log(date); //得到日期时间对象:{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
|
|
|
- console.log(endDate); //得结束的日期时间对象,开启范围选择(range: true)才会返回。对象成员同上。
|
|
|
- }, ready: function(date){
|
|
|
+ changeDate({ date: value }, PATH); // 时间改变获取值
|
|
|
+ var timeInput = $('.first .right .time');
|
|
|
+ var logo = $('.first .right .logo');
|
|
|
+ var arrow = $('.first .right .arrow');
|
|
|
+ timeInput.css({ 'background': '#F4FAFF', 'color': '#1458B4' })
|
|
|
+ logo.attr('src', "images/logo-rl.png")
|
|
|
+ arrow.attr('src', "images/arrow.png");
|
|
|
+ }, ready: function (date) {
|
|
|
$("#arrowTimeImg").attr('src', "images/arrow.png");
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
- $('.first .right .arrow').click(function () {
|
|
|
- var timeInput = $('.first .right .time');
|
|
|
- var logo = $('.first .right .logo');
|
|
|
- // background: #4DA1F6;
|
|
|
- // color: #FFFFFF;
|
|
|
- // logo-rl2.png
|
|
|
- })
|
|
|
</script>
|
|
|
<script>
|
|
|
|
|
@@ -256,7 +289,7 @@
|
|
|
$(this).attr('src', 'images/code-a.png');
|
|
|
}
|
|
|
})
|
|
|
- var params = {page: 1, limit: 12, name: $(this)[0].innerText};
|
|
|
+ var params = { page: 1, limit: 12, name: $(this)[0].innerText };
|
|
|
getajaxTop(params, PATH);
|
|
|
})
|
|
|
|
|
@@ -298,7 +331,7 @@
|
|
|
var items = [0, 1, 2, 3, 4, 5];
|
|
|
var hotIndexs = getRandomArrayElements(items, 4);
|
|
|
var subIndexs = [];
|
|
|
- subIndexs.push(getRandom(hotList[hotIndexs[0]].length -1 ))
|
|
|
+ subIndexs.push(getRandom(hotList[hotIndexs[0]].length - 1))
|
|
|
subIndexs.push(getRandom(hotList[hotIndexs[1]].length - 1))
|
|
|
subIndexs.push(getRandom(hotList[hotIndexs[2]].length - 1))
|
|
|
subIndexs.push(getRandom(hotList[hotIndexs[3]].length - 1))
|
|
@@ -365,12 +398,12 @@
|
|
|
|
|
|
// 初始化热点推荐的列表
|
|
|
function initHotData() {
|
|
|
- hot1 = getHotData({page: 1, limit: 12, name: "重庆市南岸区人民政府"}, PATH);
|
|
|
- hot2 = getHotData({page: 1, limit: 12, name: "广阳湾智创生态城"}, PATH);
|
|
|
- hot3 = getHotData({page: 1, limit: 12, name: "南岸文旅"}, PATH);
|
|
|
- hot4 = getHotData({page: 1, limit: 12, name: "南岸健康卫士"}, PATH);
|
|
|
- hot5 = getHotData({page: 1, limit: 12, name: "南岸公安"}, PATH);
|
|
|
- hot6 = getHotData({page: 1, limit: 12, name: "重庆南岸消防"}, PATH);
|
|
|
+ hot1 = getHotData({ page: 1, limit: 12, name: "重庆市南岸区人民政府" }, PATH);
|
|
|
+ hot2 = getHotData({ page: 1, limit: 12, name: "广阳湾智创生态城" }, PATH);
|
|
|
+ hot3 = getHotData({ page: 1, limit: 12, name: "南岸文旅" }, PATH);
|
|
|
+ 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);
|
|
@@ -468,13 +501,13 @@
|
|
|
tapsTitleLi[index].classList = ['wxInfo click'];
|
|
|
$("#messageDialogT").addClass("click");
|
|
|
$("#messageDialogT").css("display", "block");
|
|
|
- $("#messageDialogT").css("top", (140 + top*200) + "px");
|
|
|
- $("#messageDialogT").css("left", (250 + left*220) + "px");
|
|
|
+ $("#messageDialogT").css("top", (140 + top * 200) + "px");
|
|
|
+ $("#messageDialogT").css("left", (250 + left * 220) + "px");
|
|
|
if (left >= 4) {
|
|
|
$("#messageArrow").css("left", 433 + "px");
|
|
|
$("#messageArrow").css("transform", "rotate(45deg)");
|
|
|
- $("#messageDialogT").css("left", (left*220 - 425) + "px");
|
|
|
- } else {
|
|
|
+ $("#messageDialogT").css("left", (left * 220 - 425) + "px");
|
|
|
+ } else {
|
|
|
$("#messageArrow").css("left", -14 + "px");
|
|
|
$("#messageArrow").css("transform", "rotate(224deg)");
|
|
|
}
|