CNCEC_SUBQHSE_WUHUAN/SGGL/FineUIPro.Web/common/mainMenu_Party.aspx

710 lines
23 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="mainMenu_Party.aspx.cs" Inherits="FineUIPro.Web.common.mainMenu_Party" %>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>首页</title>
<link href="../res/index/css/reset.css" rel="stylesheet" />
<link href="../res/index/css/home.css" rel="stylesheet" />
<link href="../res/index/css/swiper-3.4.2.min.css" rel="stylesheet" />
<style type="text/css">
* {
box-sizing: border-box;
}
.flexV {
flex-direction: column;
}
.wrap {
height: 100%;
padding: 15px;
}
.bottom-wrap {
padding: 0;
margin-bottom: 5px;
}
.bottom-wrap:last-child {
margin-bottom: 0;
}
.bw-item-content {
padding: 5px;
}
.top {
display: flex;
display: -webkit-flex;
overflow: hidden;
width: 100%;
}
.bw-b-bottom {
/* width: 100%;*/
height: 100%;
}
.itemlr {
margin: 0 5px;
}
.bw-b-bottom-up {
border-radius: 0;
height: 100%;
margin: 0;
box-shadow: none;
}
.yj-info {
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
color: red;
font-size: 20px;
}
.yj-info .tit {
font-weight: 700;
margin-bottom: 20px;
}
.yj-info .tel {
font-weight: 700;
}
.tab-wrap {
left: auto;
right: 15px;
top: 5px;
}
.tab .t-item {
width: auto;
padding: 5px 10px;
}
.bottom-list {
height: 100px;
padding: 15px;
overflow: hidden;
color: #fff;
margin: 0 10px;
}
.bottom-list .bl-left {
float: left;
margin-right: 30px;
margin-left: 50px;
}
.bottom-list .bl-right {
float: right;
margin-right: 50px;
}
.tab .t-item {
font-size: 12px;
}
.content-body {
display: flex;
flex-direction: column;
flex: 3;
}
.content-body .content-item {
}
.part-item {
display: flex;
align-items: center;
}
.part-tag {
display: flex;
flex-direction: column;
background-color: #107ca2;
opacity: 0.8;
flex: 1;
border-radius: 10px;
}
.part-tag + .part-tag {
margin-left: 20px;
}
.item-top {
display: flex;
justify-content: center;
align-items: center;
font-size: 20px;
color: #fff;
border-bottom: 1px solid #f2f2f2;
padding: 10px 0px;
}
.unit {
display: flex;
justify-content: flex-end;
text-align: right;
font-size: 16px;
padding-right: 30px;
}
.num {
display: flex;
justify-content: center;
flex: 1;
}
.unit-btn {
display: flex;
justify-content: center;
padding: 10px 0px;
font-size: 16px;
color: #fff;
}
.do-btn {
display: flex;
justify-content: center;
background-color: #107ca2;
opacity: 0.8;
flex: 1;
border-radius: 10px;
padding: 20px 0px;
color: #fff;
}
.base-wrap{
padding:15px 10px;
height:100%;
}
.base-wrap .base-tit{
font-size:12px;
color:#fff;
}
.base-wrap .base-txt-wrap{
margin-top:5px;
background-color:#0B508B;
border-radius:5px;
color:#FFAE72;
height:100%;
align-items:center;
justify-content:space-around;
}
.base-wrap .base-txt-wrap .num-1{
background-color:#2A759C;
padding:5px;
font-size:40px;
}
.yj-info-1{
height:100%;
}
.yj-info-1-list{
color:#fff;
}
.yj-info-1 .telbg{
height:100%;
width:85px;
background: url(../res/index/images/tel.png) center center no-repeat;
background-size: contain;
}
.yj-info-1-list-item{
padding:0 5px;
background-color:#2A759C;
margin-bottom:5px;
font-size:12px;
align-items:center;
justify-content:center;
}
.yj-info-1-list-item:last-child{
margin-bottom:0;
}
.yj-info-1-list-item .telnum{
text-align:center;
align-items:center;
justify-content:center;
display:flex;
}
.yj-info-1-info{
color:#fff;
background-color:#2A759C;
text-align:center;
font-size:16px;
height:40px;
line-height:40px;
margin-top:5px;
}
.info-wrap{
width:100%;
height:100%;
padding:5px 10px;
}
.info-wrap .info-item{
align-items:center;
justify-content: center;
margin:0 20px;
}
.info-wrap .info-item .title {
margin-bottom:5px;
font-size:14px;
}
.info-wrap .info-item .item {
width:100%;
height: 40%;
background-color:#267AA4;
border-radius:15px;
align-items:center;
justify-content:space-around;
}
.info-wrap .info-item .item .i-num{
color:#F48A5C;
font-size:28px;
}
.info-wrap .info-item .item .i-num-c{
color:#C1DF8E;
}
.tab .t-item {
width: auto;
padding: 5px 10px;
}
.tit-item {
padding: 0 10px;
color: #fff;
justify-content: space-between;
font-size: 12px;
}
.tip-item {
margin-left: 10px;
align-items: center;
font-size: 10px;
}
.tip {
width: 25px;
height: 13px;
background-color: #258F76;
border-radius: 2px;
margin-right: 5px;
}
.tip-next {
background-color: #92BF55;
}
.mglone{
margin-left: 2px;
}
.mgrone{
margin-right: 2px;
}
.mgbone{
margin-bottom: 2px;
}
.pdtb0{
padding-top:0 !important;
padding-bottom:0 !important;
}
.tit-center{
text-align:center;
font-size:12px;
}
.tit-one{
padding: 10px 0;
}
.content-ul .c-item .tit {
display:block;
position:relative;
padding-left: 2em;
}
.content-ul .c-item .tit::before {
content: '';
position: absolute;
border-color: #57B8BD;
border-style: solid;
border-width: 0.25em;
height: 0;
top: 0;
left: 0.6em;
margin-top: 0.5em;
width: 0;
border-radius:50%;
}
.content-ul .c-item .tit-read::before {
content: '';
position: absolute;
border-color: #ffffff;
border-style: solid;
border-width: 0.25em;
height: 0;
top: 0;
left: 0.6em;
margin-top: 0.25em;
width: 0;
border-radius:50%
}
.content-ul .c-item .tit .tit-t{
flex:1;
min-width: 0;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
word-break: keep-all;
}
.content-ul .c-item.disabled .tit::before{
display:none !important;
}
.content-ul .c-item .tit .tit-v{
margin-left: 12px;
width: 80px;
}
.top-wrap{
width: 100%;
height: 100%;
justify-content: center;
align-items:center;
/*上移,数字能居中*/
margin-top:-18px;
}
.top-desc{
margin-bottom: 15px;
width:100%;
padding: 0 10px;
}
.content-1 {
width: 100%;
margin-bottom: 5px;
align-items: center;
padding:0 15px;
}
.content-1 .cc-num-wrap {
justify-content: space-around;
align-items:center;
}
.content-1 .cc-num-wrap .cc-num {
color: #F4B286;
background-color: #4967AD;
font-size: 38px;
/* padding: 0 2px; */
display: flex;
align-items: center;
justify-content: center;
height: 60px;
width: 40px;
border-radius:6px;
}
.content-1 .unit1 {
margin-left: 6px;
font-size: 16px;
color: #fff;
}
.tab-tit{
padding:10px;
height:40px;
}
.swiper-container-img {
width: 100%;
height: 100%;
}
.swiper-container-img .swiper-slide {
text-align: center;
font-size: 18px;
/*background: #000;*/
}
.swiper-container-img .swiper-slide img {
/*图片的宽高自动可以设置100%撑满*/
width: 100%;
height: auto;
max-width: 100%;
max-height: 100%;
-ms-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
position: absolute;
left: 50%;
top: 50%;
}
.swiper-container-img .swiper-slide .title {
font-size: 16px;
font-weight: 300;
position: relative;
z-index: 99;
color: #0B508B;
text-align: left;
text-indent: 45px;
}
</style>
</head>
<body>
<div class="wrap flex flexV">
<div class="bottom-wrap flex1">
<div class="top flex">
<div class="bw-b-bottom flex1 mgrone">
<div class="bw-b-bottom-up flex flexV">
<div class="tab-tit">组织生活会</div>
<div class="bw-item-content flex1">
<!-- Swiper -->
<div class="swiper-container swiper-container-img" id="swiperImg">
<div class="swiper-wrapper">
<%= swiperHtml1 %>
<%--<div class="swiper-slide">
<div class="title">Slide 1</div>
<!-- Required swiper-lazy class and image source specified in data-src attribute -->
<img data-src="http://lorempixel.com/1600/1200/nature/1" class="swiper-lazy">
<!-- Preloader image -->
<div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
</div>
<div class="swiper-slide">
<div class="title">Slide 2</div>
<img data-src="http://lorempixel.com/1600/1200/nature/2" class="swiper-lazy">
<div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
</div>
<div class="swiper-slide">
<div class="title">Slide 3</div>
<img data-src="http://lorempixel.com/1600/1200/nature/3" class="swiper-lazy">
<div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
</div>
<div class="swiper-slide">
<div class="title">Slide 4</div>
<img data-src="http://lorempixel.com/1600/1200/nature/4" class="swiper-lazy">
<div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
</div>
<div class="swiper-slide">
<div class="title">Slide 5</div>
<img data-src="http://lorempixel.com/1600/1200/nature/5" class="swiper-lazy">
<div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
</div>
<div class="swiper-slide">
<div class="title">Slide 6</div>
<img data-src="http://lorempixel.com/1600/1200/nature/6" class="swiper-lazy">
<div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
</div>--%>
</div>
<!-- Add Pagination -->
<div class="swiper-pagination swiper-pagination-white"></div>
<!-- Navigation -->
<div class="swiper-button-next swiper-button-white"></div>
<div class="swiper-button-prev swiper-button-white"></div>
</div>
</div>
</div>
</div>
<div class="bw-b-bottom flex1">
<div class="bw-b-bottom-up flex flexV">
<div class="tab-tit">主题党日活动</div>
<div class="bw-item-content flex1">
<!-- Swiper -->
<div class="swiper-container swiper-container-img" id="swiperImg1">
<div class="swiper-wrapper">
<%= swiperHtml2 %>
<%--<div class="swiper-slide">
<div class="title">Slide 1</div>
<!-- Required swiper-lazy class and image source specified in data-src attribute -->
<img data-src="http://lorempixel.com/1600/1200/nature/1" class="swiper-lazy">
<!-- Preloader image -->
<div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
</div>
<div class="swiper-slide">
<div class="title">Slide 2</div>
<img data-src="http://lorempixel.com/1600/1200/nature/2" class="swiper-lazy">
<div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
</div>
<div class="swiper-slide">
<div class="title">Slide 3</div>
<img data-src="http://lorempixel.com/1600/1200/nature/3" class="swiper-lazy">
<div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
</div>
<div class="swiper-slide">
<div class="title">Slide 4</div>
<img data-src="http://lorempixel.com/1600/1200/nature/4" class="swiper-lazy">
<div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
</div>
<div class="swiper-slide">
<div class="title">Slide 5</div>
<img data-src="http://lorempixel.com/1600/1200/nature/5" class="swiper-lazy">
<div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
</div>
<div class="swiper-slide">
<div class="title">Slide 6</div>
<img data-src="http://lorempixel.com/1600/1200/nature/6" class="swiper-lazy">
<div class="swiper-lazy-preloader swiper-lazy-preloader-white"></div>
</div>--%>
</div>
<!-- Add Pagination -->
<div class="swiper-pagination swiper-pagination-white"></div>
<!-- Navigation -->
<div class="swiper-button-next swiper-button-white"></div>
<div class="swiper-button-prev swiper-button-white"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="bottom-wrap flex1">
<div class="top flex">
<div class="bg-item flex1 mgrone" id="divJD_wrap" style="margin-bottom:0;">
<div class="bw-item-content flex flexV" style="padding:0;">
<div class="tit-new">党员先锋岗、示范岗</div>
<div class="" style="padding: 0 10px 0; overflow: hidden;">
<div class="swiper-container " id='swiper1' runat="server">
</div>
</div>
</div>
</div>
<div class="bg-item flex1" style="margin-bottom:0;">
<div class="bw-item-content flex flexV" style="padding:0;">
<div class="tit-new">党史学习教育</div>
<div class="" style="padding: 0 10px 0; overflow: hidden;">
<div class="swiper-container " id='swiper2' runat="server">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
<script type="text/javascript" src="../res/index/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="../res/index/js/swiper-3.4.2.jquery.min.js"></script>
<script type="text/javascript">
var basePath = '<%= ResolveUrl("~/") %>';
</script>
<!-- Swiper JS -->
<script src="../package/swiper-bundle.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var widthImg = $(".swiper-container-img").width();
$(".swiper-container-img").css("width", widthImg + 'px')
var swiperImg = new Swiper('#swiperImg', {
nextButton: '.swiper-button-next',
prevButton: '.swiper-button-prev',
pagination: '.swiper-pagination',
paginationClickable: true,
// Disable preloading of all images
preloadImages: false,
// Enable lazy loading
lazyLoading: true,
autoplay: 3000,
loop: true,
preventClicks: true
});
var swiperImg1 = new Swiper('#swiperImg1', {
nextButton: '.swiper-button-next',
prevButton: '.swiper-button-prev',
pagination: '.swiper-pagination',
paginationClickable: true,
// Disable preloading of all images
preloadImages: false,
// Enable lazy loading
lazyLoading: true,
autoplay: 3000,
loop: true,
preventClicks: false
});
$("#swiperImg,#swiperImg1").on('click', '.swiper-slide', function () {
var data = $(this).attr("data-id");
window.open(data);
});
})
</script>
<script type="text/javascript">
var slidesNum = 5
var mySwiper = null
var mySwiper_JD = null
var slidesNum_JD = 15
var swiper3 = '<%=swiper3 %>'
var accident = { "title": "质量事故", "xFontNum": 0, "legend": null, "categories": ["潮州华瀛", "黄州危废", "山东滨州首站", "嘉盛工程", "湘渝盐化", "东华能源", "广汇启东", "重庆涪陵", "开阳PPA项目", "广西华谊", "金新锅炉", "兴力项目", "济民可信", "哈密广汇", "俄罗斯", "印尼罐区", "印度TALCHER", "天津渤化", "宜都兴发", "图克二期", "云华安"], "series": [{ "name": null, "type": null, "data": [0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0], "data2": [0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0], "data3": [0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0], "data4": [34.56, 37.80, 21.00, 0.00, 6.00, 29.45, 43.12, 29.00, 0.00, 2.84, 95.00, 95.00, 90.00, 23.00, 39.00, 15.00, 17.23, 50.00, 99.00, 86.00, 64.00], "dataString": null, "dataObject": null, "jd": null, "sg": null, "time": null, "ht": null, "convert": null, "pieData": null, "loc": null }], "series2": null }
$(document).ready(function () {
var height = $("#divJD_wrap").height() - 30
var width = $("#divJD_wrap").width()
$("#swiper1").css("height", (height) + 'px').css("width", (width - 30) + 'px')
slidesNum = Math.floor((height) / 24)
$("#swiper1").html(swiper3)
mySwiper = new Swiper('#swiper1', {
autoplay: 3000,//可选选项,自动滑动
direction: 'vertical',
loop: true,
slidesPerView: 7
})
$("#swiper2").css("height", (height) + 'px').css("width", (width - 30) + 'px')
var swiper4 = '<%=swiper4 %>'
$("#swiper2").html(swiper4)
if (accident.categories.length > slidesNum) {
mySwiper_JD = new Swiper('#swiper2', {
autoplay: 3000,//可选选项,自动滑动
direction: 'vertical',
loop: true,
slidesPerView: 7
})
}
})
</script>
<script>
// 点击列表
$("#swiper1").on('click', 'li', function () {
var $this = $(this)
var data = $this.attr("data-id")
var noticeId = $this.attr("notice-id")
//$(".project-list-wrap").show();
//return
if (data != "") {
//Window1.GetShowReference(data) + "return false;";
//document.getElementById("hdNoticeId").value = noticeId;
//document.getElementById("imgBtn").click();
window.open(data);
//top.window.location.reload();
}
})
// 点击列表
$("#swiper2").on('click', 'li', function () {
var $this = $(this)
var data = $this.attr("data-id")
var noticeId = $this.attr("notice-id")
//$(".project-list-wrap").show();
//return
if (data != "") {
//Window1.GetShowReference(data) + "return false;";
//document.getElementById("hdNoticeId").value = noticeId;
//document.getElementById("imgBtn").click();
window.open(data);
//top.window.location.reload();
}
})
</script>
</html>