<!doctype html>
<html>
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="renderer" content="webkit"> 
  <title>编辑分页</title>
  <link type="text/css" rel="Stylesheet" href="/admin/drag/css/drag.frame.css">
  <link type="text/css" rel="Stylesheet" href="/admin/drag/css/kesion.form.css">
  <style>
	.paging-list ul{ padding-right:20px;}
	.paging-list li{width:50%;float:left; padding-bottom:20px; cursor:pointer;}
	.paging-list .image{margin-left:20px; background:#fff; padding:15px 0px;border:1px solid #ebebeb;}
  	.paging-list .image img{ width:100%; display:block; overflow:hidden;}
	.paging-list .active .image{border:1px solid #21B384;}
  	.paging-tips{ padding:0 20px 20px 20px; line-height:26px; color:#999;}
  </style>
  <script src="/KS_inc/jquery.js" type="text/javascript"></script>
</head>
<body>
   
   	
    
    <div id="content">
        <div class="ks-tips-bar" style="margin:0 20px;">提示：网站颜色可在网站基本配置中重新配置</div>
        <div class="ks-title">选择样式</div>	
        <div class="paging-list">
            <ul>
                <li class="active" data-id="1">
                	<div class="image"><img src="/admin/drag/images/paging/paging-01.jpg" /></div>
                </li>
                <li data-id="2">
                	<div class="image"><img src="/admin/drag/images/paging/paging-02.jpg" /></div>
                </li>
                <li data-id="3">
                	<div class="image"><img src="/admin/drag/images/paging/paging-03.jpg" /></div>
                </li>
                <li data-id="4">
                	<div class="image"><img src="/admin/drag/images/paging/paging-04.jpg" /></div>
                </li>
                <li data-id="5">
                	<div class="image"><img src="/admin/drag/images/paging/paging-05.jpg" /></div>
                </li>
            </ul>
        </div>
        <div class="clear"></div>
        <div class="ks-title">颜色信息</div>	
        <div class="paging-tips">
        	<p>默认：普通信息颜色</p>
        	<p>选中：网站主色</p>
        </div>
       
	</div>
 	
    <div class="ks-btn-center" style="border-top:1px solid #ebebeb; padding:20px 0;">
      <button class="ks-btn ks-btn-normal" onClick="Save()" id="btn-save">保存</button>
      &nbsp;
      <button class="ks-btn" onClick="parent.closeWindow(window.name)">取消</button>
    
    </div>
	    
   <script src="/ks_inc/kesion.assembly.js"></script>
   <script src="/ks_inc/jquery.nicescroll.js"></script>
   
	<script>
		
		var $content = $('#content');
		
		$(function(){			
			tabHeight();
			$content.niceScroll({  
				cursorcolor:"#dbdbdb",  
				cursoropacitymax:1,  
				touchbehavior:false,  
				cursorwidth:"6px",  
				cursorborder:"0", 
				cursorborderradius:"6px"  
			}); 			
			
			var pagingId = window.location.href.split('pagingId=')[1];
			$('.paging-list').find('li[data-id="'+pagingId+'"]').addClass('active').siblings().removeClass('active');
			if(pagingId==3){
				$('.paging-tips').html('<p>默认：黑色（固定）</p><p>选中：黑色（固定）</p>');
			};
			
		});
		$('.paging-list').on('click','li',function(){
			$(this).addClass('active').siblings().removeClass('active');
			if($(this).attr('data-id')==3){
				$('.paging-tips').html('<p>默认：黑色（固定）</p><p>选中：黑色（固定）</p>');
			}else{
				$('.paging-tips').html('<p>默认：普通信息颜色</p><p>选中：网站主色</p>');
			};
		});
		$(window).resize(function(){
			tabHeight();
		});
		
		function tabHeight(){
			var tabHeight = $(window).height()-$('.ks-btn-center').outerHeight();
			$content.height(tabHeight);
			
		};
		
		
		
		//保存
		function Save(){
			var pagingId = 	$('.paging-list').find('.active').attr('data-id');
			var pageStr = parent.PageStrResult(pagingId);
			//修改id
			parent.$moduleObject.attr('drag-paging',pagingId);
			parent.$moduleObject.find('.m-paging')[0].outerHTML = pageStr;
			parent.closeWindow(window.name);//关闭窗口

		};
		
		
    </script>
	

</body>
</html>