<!DOCTYPE html>
<html>
  <head>
 	 <base href="#springUrl('/assets/adminlte/')"/>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>群发图文管理</title>
 	  <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <!-- Bootstrap 3.3.5 -->
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
    <!-- Font Awesome -->
    <link rel="stylesheet" href="plugins/font-awesome/css/font-awesome.min.css">
    <!-- Ionicons -->
    <link rel="stylesheet" href="plugins/ionicons/css/ionicons.min.css">

       <!-- DataTables -->
    <link rel="stylesheet" href="plugins/datatables/dataTables.bootstrap.css">

    <!-- Theme style -->
    <link rel="stylesheet" href="dist/css/AdminLTE.min.css">
    <!-- AdminLTE Skins. Choose a skin from the css/skins
         folder instead of downloading all of them to reduce the load. -->
    <link rel="stylesheet" href="dist/css/skins/_all-skins.min.css">
    <!-- iCheck -->
    <link rel="stylesheet" href="plugins/iCheck/flat/blue.css">
    <!-- Morris chart -->
    <link rel="stylesheet" href="plugins/morris/morris.css">
    <link rel="stylesheet"
	href="plugins/ztree/css/metroStyle/metroStyle.css" type="text/css" />
    <!-- jvectormap -->
    <link rel="stylesheet" href="plugins/jvectormap/jquery-jvectormap-1.2.2.css">
    <!-- Date Picker -->
    <link rel="stylesheet" href="plugins/datepicker/datepicker3.css">
    <!-- Daterange picker -->
    <link rel="stylesheet" href="plugins/daterangepicker/daterangepicker-bs3.css">
    <!-- bootstrap wysihtml5 - text editor -->
    <link rel="stylesheet" href="plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
        <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
    <link rel="stylesheet" href="plugins/select2/select2.min.css">
    <style>
    .modal-backdrop{z-index:998;}
    </style>
  </head>
  <body class="hold-transition skin-blue sidebar-mini">


 <div class="wrapper">
 <div id="treeSelect" style="z-index:100000000000;"></div> 
    <div class="content-wrapper"  style="margin-left:0;">
    
     <section class="content-header">
          <h1>
             	群发图文管理
            <small>群发图文信息</small> 
          </h1>
          <ol class="breadcrumb">
            <li><a href="#springUrl('/page/user/showstatics')"><i class="fa fa-dashboard"></i>首页</a></li>
            <li><a class="active">群发图文列表</a></li>
          </ol>
        </section>
    
    <div id="myModal" class="modal fade">
		<div class="modal-dialog">
			<div class="modal-content">
			<!-- dialog body -->
			<div class="modal-body">
				<button type="button" class="close" data-dismiss="modal">&times;</button>
				群发中，请稍后......
			</div>
			<!-- dialog buttons -->
			</div>
		</div>
	</div>
	
	<div id="MassMyModal" class="modal fade" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="z-index:9999">
	<form id="MassSendForm">
		<div class="modal-dialog" style="width:50%" > 
			<div class="modal-content" style="width:80%;margin:0px auto;">
			<div class="modal-header"> 
				<button type="button" class="close" data-dismiss="modal">&times;</button>
				<h4 class="modal-title" id="myModalLabel">选择群发对象</h4> 
			</div> 
			<!-- dialog body -->
			<div class="modal-body" style="width:100%;"> 
			<div class="form-group form-md-line-input">   
					<label style="width:100%">群发方式</label> 
					<label><input type="radio" name="sendType" value="0" checked>全部用户</label>
					<label><input type="radio" name="sendType" value="1">按条件</label>
			</div> 
			<div   style="display:none" id="sex">
				<label style="clear:both;width:100%">性别</label>
				<select class="form-control select2 select2-hidden-accessible"
					name="sex" style="width: 100%;" tabindex="-1"
					>
					<option value="">全部</option>
					<option value="1">男</option>
					<option value="2">女</option>
				</select>
			</div>   
			<div class="form-group form-md-line-input" style="display:none" id="massSendArea">
					<label style="clear:both;width:100%">地区</label> 
					<texterae style="-webkit-box-flex: 1;float:left;width:80%;" rows="2" type="text" class="form-control" name="area" id="area"
					maxlength="2000" placeholder="请点击选择按钮选择地区" disabled></texterae> 
					<input type="text" class="form-control" name="areaIds"
											id="areaIds" value="" maxlength="2000"
											disabled style="display: none"> 
					<a style="width: 15%;-webkit-box-flex: 0; margin-left: 20px; margin-top: 2px;float:left" class="btn btn-primary btn-sm" id="areaselect" >选择</a>
			</div>
			 <div class="form-group form-md-line-input" style="display:none" id="massSendTag">
			 	<label style="clear:both;width:100%">选择标签</label>  
			 	<select  class="form-control select2" multiple='multiple' style="width: 100%" id="addlabel" name="tags" data-placeholder='请选择标签'> 
				</select> 
			 </div>
				<div class="box-footer" style="clear:both;"> 
				<a class="btn btn-primary" id="massSend" >群发</a>  
				<a  id="massSendCanel" class="btn btn-default">取消</a>
				</div>
				<input name="newMedias" style="display:none;"/> 
			</div>
			<!-- dialog buttons -->
			</div>
		</div>
		</form>
	</div>
	
        <!-- Main content -->
        <section class="content">
          <div class="row">
            <div class="col-xs-12">
              <div class="box">
              <div class="box-header">
               <form id="seachTableForm" action="#springUrl('/a/newsmedia/list')" method="get">
               <div class="col-xs-2">
						<input type="text" class="form-control required" placeholder="标题" name="title" value="$!{NewsMedia.title}">
					</div>
					 <div class="col-xs-2">
						<input type="text" class="form-control required" placeholder="作者" name="author" value="$!{NewsMedia.author}">
					</div>  
					<div class="col-xs-5"> 
						<button type="submit" class="btn btn-primary">搜索</button>
						  #if($shiro.hasPermission("mp:newsmedia:edit"))
                  			 <a href="#springUrl('/a/newsmedia/newsMediaForm')"  class="btn bg-olive">新增图文</a>
                   		  #end
                   		  <a href="javascript:void(0);" id="sendMessageMass" class="btn bg-olive">组合群发</a>
					</div> 
				</form>
                </div>
                <!-- /.box-header -->
                <div class="box-body">
                  <table id="userlilst" class="table table-bordered table-striped">
                  		<thead>
                  			<th hidden="true">media_id</th>
                  			<th></th>  
                  			<th>缩略图</th>
                  			<th>标题</th>
                  			<th>作者</th>
                  			<th>描述</th>
                  			<th>最后更新时间</th>
                  			<th>操作</th>
                  		</thead>
	                    <tbody id="tablebody">
	                    
	                    </tbody>
                  </table>
                </div><!-- /.box-body -->
              </div><!-- /.box -->
            </div><!-- /.col -->
          </div><!-- /.row -->
        </section><!-- /.content -->
      </div><!-- /.content-wrapper -->  
   	


      <!-- Add the sidebar's background. This div must be placed
           immediately after the control sidebar -->
      <div class="control-sidebar-bg"></div>
    </div><!-- ./wrapper -->

<!-- END CONTAINER -->
<!-- BEGIN FOOTER -->
<!-- END FOOTER -->
    <script src="plugins/jQuery/jQuery-2.1.4.min.js"></script>
    <!-- Bootstrap 3.3.5 -->
    <script src="bootstrap/js/bootstrap.min.js"></script>
    <!-- DataTables -->
    <script src="plugins/datatables/jquery.dataTables.min.js"></script>
     <script src="plugins/datatables/extensions/i18n/lanauage_ch.js"></script>
    <script src="plugins/datatables/dataTables.bootstrap.min.js"></script> 
    <script src="plugins/jquery-validation/js/jquery.validate.min.js"></script>
    <script src="plugins/ztree/js/jquery.ztree.all.min.js"
		type="text/javascript"></script>
	<script src="plugins/jquery-validation/js/jquery.validate.min.js"></script>
	<script src="js/jquery.form.min.js"></script> 
    <!-- SlimScroll -->
    <script src="plugins/slimScroll/jquery.slimscroll.min.js"></script>
    <!-- FastClick -->
    <script src="plugins/fastclick/fastclick.min.js"></script>
    <!-- AdminLTE App -->
    <script src="dist/js/app.min.js"></script>
    <!-- AdminLTE for demo purposes -->
    <script src="dist/js/demo.js"></script>
 <script src="plugins/bootbox/bootbox.min.js"></script>
 <script src="common/js/cfapp.js"></script>
 <script type="text/javascript" src="common/js/seachImageText.js"></script>
 <script src="plugins/select2/select2.full.min.js"></script>
 <script src="js/jquery.serializejson.js"></script>
 <script>
     var csrfheader = {name:'_csrf_header',value:'${_csrf.headerName}'};
     var csrftoken  = {name:'_csrf',value:'${_csrf.token}'};
 </script>
<!-- END PAGE LEVEL PLUGINS -->
<script>
function   formatDates(now)   {
	var now = new Date(now);
    var   year=now.getFullYear();     
    var   month=now.getMonth()+1;     
    var   date=now.getDate();     
    var   hour=now.getHours();     
    var   minute=now.getMinutes();     
    var   second=now.getSeconds();     
    return   year+"-"+month+"-"+date+"   "+hour+":"+minute+":"+second;     
} 
function   formatDateTimes(now)   {
	var now = new Date(now);
	 var   month=now.getMonth()+1;     
	    var   date=now.getDate();     
    return  month+"月"+date+"日";     
} 

 var selectedImageText = ""; //记录被选中的图文 
 
 var selectedActivity = "";




    
var sSource = "#springUrl('/a/newsmedia/fetchData')"; //列表数据
var sendMessageMassUrl = "#springUrl('/a/newsmedia/uploadMediaArticle')";//群发
var areaUrl = "#springUrl('/a/area/fetchData')";//按地区群发时，获取省市县接口 
var seachImageText = "#springUrl('/a/newsmedia/seachImageText')";
var groupUrl = "#springUrl('/a/fanssgroup/fetchdata')"; 
    jQuery(document).ready(function() {
    	  $.ajax({
           "type": "get",
           "contentType": "application/json",
           "url": groupUrl,
           "dataType": "json",
           "data": {iDisplayStart:0,
          	 iDisplayLength:0}, 
           "success": function(data){
          	data = data.aaData;
          	for(var i=0;i<data.length;i++){
              	$("#addlabel").append('<option value="'+data[i].groupid+'" data-attr="">'+data[i].name+'</option>')
          	}
           }
       }); 
    	
    	
    	Cfapp.init();  
    	 $(".select2").select2();  
    	 $('#areaselect').on('click',
    	            function() {
    	              Cfapp.treeSelect({
    	                title: '地区选择',
    	                url: areaUrl,
    	                displayFields: 'area',
    	                storeFields: 'areaIds',
    	                success: function() {
    	                  console.log('success');
    	                },
    	                cancel: function() {
    	                  console.log('cancel');
    	                }
    	              })
    	  });
    	
    	
    	$("#sendMessageMass").click(function(){//组合图文
    		selectedImageText=selectedActivity.replace(/\./g,"");
    		if(selectedImageText<1){
    			alertHtml("请选择图文,在进行群发"); 
    		}else{  
    			$.ajax({
                    "type": "GET",
                    "contentType": "application/json",
                    "url": seachImageText,
                    "dataType": "json",
                    "data": {ids:selectedImageText}, //以json格式传递
                    "success":function(data){
                    	$("#messageLabel").remove();  
                    	$(".box-footer").before(setImageTextList(data));//填充图文信息内容
                    } 
                }); 
    			$("#MassMyModal").modal('show');	
    		}
    	}) 
    	
    	if($("input[name='sendType']:checked").val()=="1" && ($("#area").val()==null || $("#area").val()=="")){
    		$("#massSendArea").append("<label id='content-error' class='error' for='content'>请选择地区！</label>");
    	}
    	
    	
    	
    	
    	$("#massSend").click(function(){//群发
    		$("#MassMyModal").modal('hide');
    		$("#myModal").modal('show');
    		$("input[name='newMedias']").val(selectedImageText);
    		var data = $("#MassSendForm").serializeJSON();
    		data.area = $("#area").text();
            data._csrf_header=csrfheader.value;
            data._csrf=csrftoken.value;
    			$.ajax({
                    "type": "POST",
                    "url": sendMessageMassUrl,
                    "dataType": "json",
                    "data": data, //以json格式传递
                    "success":function(data){    
                    	$("#myModal").modal('hide'); 
                   	 if(data.errorNo=="0"){ 
                   		alertHtml("群发成功");
                   	 }else if(data.errorNo=="2"){
                   		alertHtml("未找到相应的图文信息");
                   	 }else if(data.errorNo=="3"){
                   		alertHtml("群发失败");
                   	 }else if(data.errorNo=="4"){
                   		 alertHtml("发送失败");
                   	 }else{
                   		alertHtml("群发失败，系统异常");
                   	 }
                    }
                });     			
    	})
    	
    	$("input[name='sendType']").change(function(){
    		if($(this).val()=="0"){
    			$("#massSendArea").hide();
    			$("#sex").hide();
    			$("#massSendTag").hide();
    		}else{ 
    			$("#massSendArea").show();
    			$("#sex").show(); 
    			$("#massSendTag").show();
    		}
    	}); 
    	
    	
    	$("#massSendCanel").click(function(){
    		$("#MassMyModal").modal('hide');
    	}) 
    	
    	function alertHtml(msg){
    		Cfapp.alert({
                message: msg,
                btntext: "确定",
                success: function () {
                   
                }
            })
    	}
    	
    	
     	 
     	 var retrieveData = function (sSource, aoData, fnCallback) {
     		$("#seachTableForm input,.select2").each(function() {
				var params = {
					name : $(this).attr("name"),
					value : $(this).val()
				};
				aoData.push(params);
			})
             $.ajax({
                 "type": "GET",
                 "contentType": "application/json",
                 "url": sSource,
                 "dataType": "json",
                 "data": aoData, //以json格式传递
                 "success":fnCallback
             }); 
         };
         
         dateformatId=function(a,b,c,d){
        	 if(a.thumbMediaId){
        		 if(selectedImageText.indexOf("."+a.thumbMediaId+",")>=0){
              		return '<input type="checkbox" onchange="recordingOne(this)" class="checkchild" checked="true"  value="' + a.id + '" />';
              	}else{ 
              		return '<input type="checkbox" onchange="recordingOne(this)" class="checkchild"  value="' + a.id + '" />';
              	}	 
        	 }else{
        		 return '';
        	 }
         }  
     	  
     		      $('#userlilst').DataTable({
     		            "lengthChange": false, 
     		            "searching": false,
     		            "ordering": false,
     		            "bFiltered": false,
     		           "bStateSave": true, // save datatable state(pagination, sort, etc) in cookie.
     		            "bProcessing": true,
     		            "bServerSide": true,
     		            "sAjaxSource": sSource,
     		            "fnServerData": retrieveData,
     		            "pagingType": "full_numbers",
     		            "fnDrawCallback":function(){
     		            },
     		            "aoColumns": [
     		                        {"mData": "id"},
     		                       {"mData": dateformatId},
     		                        {"mData": "picUrl"},
     		                        {"mData": "title"},
     		                        {"mData": "author"},
     		                        {"mData": "description"},
     		                        {"mData": "createtime"},
     		                        ],
     		                    "aoColumnDefs": [
     		                        {  // set default column settings
     		                            'visible': false,
     		                            'targets': [0]
     		                        }, 
     		                        {
     		                        	"targets": [2],
      		                            "mData": "picUrl",
      		                            "className":"piccenter",
      		                            "mRender": function (a, b, c, d) 
      		                            {  
      		                            	//a表示id对应的值，c表示当前记录行对象
      		                                return '<img width="100px" height="auto" src="'+a+'" />';
      		                            }
     		                        },{
	     		       					"aTargets" : [ 6 ],
	     		   						"mData" : "createtime",
	     		   						"mRender" : function(a, b, c, d) {//a表示createtime对应的值，c表示当前记录行对象
	     		   							return formatDates(a.time, "yyyy-MM-dd HH:mm:ss");
	     		   						}
     		   						},{
	     		       					"aTargets" : [ 7 ],
	     		   						"mData" : "id",
	     		   						"mRender" : function(a, b, c, d) {//a表示createtime对应的值，c表示当前记录行对象
	     		   						var viewHTML ="#if($shiro.hasPermission('mp:newsmedia:view'))"+"<a href=#springUrl('/a/newsmedia/newsMediaForm?id="+a+"') >修改</a> "+"#end";
	     		     		             var removeHTML="#if($shiro.hasPermission('mp:newsmedia:edit'))"+"<a href='javascript:void(0);' data-id='"+a+" data-action='remove' onclick='removeData("+a+")' class='btn red'>删除</a>"+"#end";
	     		     		             return viewHTML+removeHTML;
	     		   						} 
     		   						}]//,
//      		                        {
//      		                            "aTargets": [8],
//      		                            "mData": "id",
//      		                            "mRender": function (a, b, c, d) {//a表示id对应的值，c表示当前记录行对象
     		                            	
//      		                                var viewHTML = '<a href="#" data-id="'+a+'" data-action="view" class="btn green">查看</a>';
//      		                                if(c.delflag==0){
//      		                                	 var removeHTML = '<a href="#" data-id="'+a+'" data-action="remove" class="btn red">删除</a>';
//      		                                }else{
//      		                                	 var removeHTML = '<a href="javascript:void(0)" data-id="'+a+'" data-action="remove" class="btn red" style="color:red">已取消关注</a>';
//      		                                }
//      		                                return viewHTML+removeHTML;
//      		                            }
//      		                        }
     		            
     		        });
     		      
     		      
     		     
     		     
		   		
    });
    function removeData(id){ 
		   Cfapp.confirm({
			 message: "确定要删除吗",
			 btnoktext:"确定",
			 btncanceltext:"取消",
			 success:function(){
				 $.ajax({
		              "type": "POST",
		              "url": "#springUrl('/a/imagetext/remove')",
		              "dataType": "json",
		              "data": {id:id,"_csrf_header":csrfheader.value,"_csrf":csrftoken.value}, //以json格式传递
		              "success": function(data){
		            	  if(data.errorNo==0){
		            		  Cfapp.alert({
		                          message: "删除成功",
		                          btntext: "确定",
		                          success: function () {
		                        	 location.href = "#springUrl('/a/imagetext/list')";
		                          }
		                      })
		            	  }else{
		            		  Cfapp.alert({
		                          message: "删除失败",
		                          btntext: "确定",
		                          success: function () {
		                              location.href = "#springUrl('/a/imagetext/list')";
		                          }
		                      })
		            	  }
		              }
		          }); 
			 },
			cancel:function(){
				$(".modal-backdrop").fadeOut();

			 }
		   })
	   }
</script>
</body>
<!-- END BODY -->
</html>