<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort() + path+"/";
	request.setAttribute("contextPath", basePath);
	
	String redirectUrl= request.getParameter("redirectUrl");
	request.setAttribute("redirectUrl", redirectUrl);
%>
<!DOCTYPE html>
<html>
	<head>
        <base href="<%=basePath%>">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <title>更多${flname }</title>
    <script src="<%=basePath %>app/lib/flexible.js"></script>
    <link rel="stylesheet" href="<%=basePath %>app/lib/flexible.css">
    <link rel="stylesheet" href="<%=basePath %>app/lib/swiper-4.3.2.min.css" />
    <link rel="stylesheet" href="<%=basePath %>app/css/basem.css">
    <link rel="stylesheet" href="<%=basePath %>app/css/public.css">
    <link rel="stylesheet" href="<%=basePath %>app/css/index.css">
    <link rel="stylesheet" href="<%=basePath %>app/css/logome.css">

	</head>
	<body>
	<div class="xzMore" style="overflow: hidden;">
        <div class="titbox blubg">
            <a class="titreturn fl" href="javascript:void(0)" onclick="back()"><img src="<%=basePath %>app/img/fanhui16@2x.png" alt=""></a>
            <h1 id="h1name"><c:if test="${!data.pager.isEmpty() }">${data.category[0].name }</c:if></h1>
            <a href="#" class="check">
                <img src="<%=basePath %>app/img/pil@2x.png" alt="">
                <span class="smtxt" num="1">多选推介</span>
            </a>
            <script type="text/javascript">
			function back(){
				window.history.go(-1);
			}
			</script>
        </div>
        <div class="top50">
        <div class="scrollNav">
            <ul class="kindul tabs">
                <c:forEach var="cg" varStatus="status" items="${data.category }">
                <li <c:if test="${status.index == 0 }">class="default"</c:if> ><!-- onclick="replace('${cg.id}', '${cg.num}', '${cg.type}', '${cg.twotype}', '2', '1', '${cg.name }')" -->
	                        <a href="javascript:void(0);"> 
	                            ${cg.name }
	                            <%-- <c:if test="${status.index == 0 }"><i></i></c:if> --%>
	                        </a>
	                        <input type="hidden" value="${cg.id}" id="categoryid" type="hidden"/>
	                        <input type="hidden" value="${cg.num}" id="num" type="hidden"/>
	                        <input type="hidden" value="${cg.name}" id="name" type="hidden"/>
	                        <input type="hidden" value="${cg.type}" id="type" type="hidden"/>
	                        <input type="hidden" value="${cg.twotype}" id="twotype" type="hidden"/>
	                    </li>
             </c:forEach>  
            </ul> 
            </div>
            <script type="text/javascript">
            function replace(categoryid, num, type, twotype, ismore, page, name){
    			$('#h1name').text(name);
    			
    			var sslide = $('.swiper-container2 .swiper-wrapper .swiper-slide');
                var products = sslide.eq($('.tabs .default').index());
    			var num = products.children('p').attr('num');
    			if(num == '1'){
    				$.ajax({
       	             type: "GET",
       	             url: "<%=basePath%>web/mgmProduct/now.cs",
       	             data: {
       	            	 categoryid:categoryid, 
       	            	 num: num, 
       	            	 type: type, 
       	            	 twotype: twotype, 
       	            	 ismore: ismore,
       	            	 page: page
       	             },
       	             dataType: "json",
       	             success: function(data){
       	            	products.html("");
       	                         var html="";
       	                         data.forEach(function(value,index,array){
       	                        	 html += "<div class='Section'>";
       	                        	 html += "<span class='fl'>"+value.name+"</span>";
       	                        	 html += "<a href='<%=basePath %>web/mgmProduct/more.cs?categoryid="+value.id+"&num="+value.num+"&type="+value.type+"&twotype="+value.twotype+"&ismore=2&page=1' class='fr'>更多 <img src='<%=basePath %>app/img/jinr@2x.png' class='jinr'> </a>";
       	                        	 html += "</div>";
       	                        	 html += "<ul>";
       	                        	 value.pager.results.forEach(function(value,index,array){
       	                        		 html += "<li>";
       	                        		 html += "<a href='<%=basePath%>web/mgmProduct/detail.cs?productid="+value.id+"&plat=H5'>";
       	                        		 html += "<label class='mycheck hide'>";
       	                        		 html += "<input type='hidden' class='mid' value='"+value.id+"' />";
       	                        		 html += "<input type='checkbox' name='checkid' value='1' value='' />";    
       	                        		 html += "<div class='option'></div>";          
       	                        		 html += "</label>";          
       	                        		 html += "<div class='referinfo'>";    
       	                        		 html += "<img src='"+value.productImg +"' alt=''>";    
       	                        		 html += "<div class='referCont'>";        
       	                        		 html += "<p class='refertit'>"+value.productName +"</p>";        
       	                        		 html += "<p>";            
       	                        		 html += "<span class='designation graytxt'>"+value.productRemark +"</span>";   
       	                        		 if(value.commissionRate != '0'){
       	                        			 html += "<span class='commission'>佣金："+value.commissionRate+ "%</span>";       
       	                        		 }
       	                        		 html += "</p>";                
       	                        		 html += "<p>";           
       	                        		 html += "<span class='designation graytxt'>价格：</span>";
       	                        		 html += "<span class='price'>"+value.productPrice +"</span>";                
       	                        		 html += "</p>";                
       	                        		 html += "<p>";            
       	                        		 html += "<span class='designation graytxt'>类型：</span>";            
       	                        		 html += "<span class='graytxt'>"+value.gc +"</span>";                
       	                        		 html += "</p>";                
       	                        		 html += "</div>";             
       	                        		 html += "</div>";            
       	                        		 html += "</a>";       
       	                        		 html += "<div class='buy'>"; 
       	                        		 html += "<a href='<%=basePath %>web/mgmProduct/buyNow.cs?productId="+value.id +"' class='buygo'>立即购买</a>"; 
       	                        		 html += "<a href='<%=basePath %>web/mgmProduct/recommend.cs?productids="+value.id+"' class='buyt'>我要推介</a>";     
       	                        		 html += "</div>";    
       	                        		 html += "</li>";
       	                             
       	                        	 });
       	                        	 html += "</ul>";
       	                        });
       	                      products.html(html);
       	                   	  $('.tabs .default').click();
       	                 }
       	         });
    			}
    			
    		}
            </script>
        </div>
         <!-- 房产推介 -->
                <div class="referrals swiper-container2" id="products">
                <div class="swiper-wrapper" style="height:auto">
                <div class="swiper-slide">
                
                
                <c:forEach var="p" varStatus="status" items="${data.pager}">
                    <div class="Section">
                        <span class="fl">${p.name}</span>
                        <a href="<%=basePath %>web/mgmProduct/more.cs?categoryid=${p.id }&num=${p.num }&type=${p.type }&twotype=${p.twotype }&ismore=2&page=1" class="fr">更多 <img src="<%=basePath %>app/img/jinr@2x.png" class="jinr"> </a>
                    </div>
                    <ul>
                    <c:forEach var="p1" varStatus="status" items="${p.pager.results }">
                        <li>
                            <a href="<%=basePath%>web/mgmProduct/detail.cs?productid=${p1.id }&plat=H5">
                                <label class="mycheck hide">
                                		<input type="hidden" class="mid" value="${p1.id }" />
                                      <input type="checkbox" name="checkid" value="1" value="" />
                                      <div class="option"></div><!--该div盛放的是优化后的按钮图片-->
                                </label>

                                <div class="referinfo">
                                    <img src="${p1.productImg }" alt="">
                                    <div class="referCont">
                                        <p class="refertit">${p1.productName }</p>
                                        <p>
                                            <span class="designation graytxt">${p1.productRemark }</span>
                                            <c:if test="${p1.commissionRate != '0' }"><span class="commission">佣金：${p1.commissionRate }%</span></c:if>
                                        </p>
                                        <p>
                                            <span class="designation graytxt">价格：</span>
                                            <span class="price">${p1.productPrice }</span>
                                        </p>
                                        <p>
                                            <span class="designation graytxt">类型：</span>
                                            <span class="graytxt">${p1.gc }</span>
                                        </p>
                                    </div>
                                </div>
                            </a>
                            <div class="buy">
                                <a href="<%=basePath %>web/mgmProduct/buyNow.cs?productId=${p1.id }" class="buygo">立即购买</a>
                                <a href="<%=basePath %>web/mgmProduct/recommend.cs?productids=${p1.id }" class="buyt">我要推介</a>
                            </div>
                        </li>
                        </c:forEach>
                    </ul>
                    
                    </c:forEach>
                  
                  
                  </div>
                  
                  
                  
                  <c:forEach var="cg" varStatus="status" items="${data.category }">
	                  <c:if test="${status.index != 0 }">
	                  		<div class="swiper-slide">
			                  <p style="text-align: center;" num='1'>正在加载中。。。</p>
			                </div>
			             </c:if>
                  </c:forEach>
                  
                  
                  
                  </div>
                </div>
              

		</div>
    </body>
	<script src="<%=basePath %>app/lib/swiper-4.3.2.min.js"></script>
	<script type="text/javascript" src="<%=basePath %>res/js/jquery.min.js"></script>
    <script type="text/javascript" src="<%=basePath %>res/js/layer/layer.min.js"></script>
    <script type="text/javascript" src="<%=basePath %>app/js/public.js"></script>
    <script type="text/javascript">
        $(".check").click(function(){
        	var num = $(this).find("span").attr("num");
        	if(num == "1"){
        	    $(this).find("span").html("批量推介");
        	    $(this).find("span").attr("num", "2");
		          $(".mycheck").removeClass("hide");
        	}else if(num == "2"){
        	    var ids = "";
        	    var all = $('input:checkbox[name="checkid"]:checked');
        	    if(all.length == 0){
        	    	layer.msg("请选择要推介的产品");
        	    	
        	    	return false;
        	    }
        	    all.each(function(index){
        	    	if(index == 0){
        	    		ids += $(this).parent().children('.mid').val();
        	    	}else{
        	    		ids += "," + $(this).parent().children('.mid').val();
        	    	}
        	    });
        	    
        	    window.location.href = '<%=basePath%>web/mgmProduct/recommend.cs?productids=' + ids;
        	}
        })


        var mySwiper2 = new Swiper('.xzMore .swiper-container2',{
            autoHeight: true,
            on:{
	                 slideChangeTransitionStart: function(){
	                  $(".tabs .default").removeClass('default');
	                  $(".tabs li").eq(mySwiper2.activeIndex).addClass('default');
	                  var iobj = $('.tabs .default');
	              	if(typeof(iobj) != "undefined"){
	              		var categoryid = iobj.children("#categoryid").val();
	              		var num = iobj.children("#num").val();
	              		var type = iobj.children("#type").val();
	              		var twotype = iobj.children("#twotype").val();
	              		var name = iobj.children("#name").val();
	              		//最后一个参数是1代表是城市首次检索
	                  	replace(categoryid, num, type, twotype, "2", "1", name);
	              	}else{
	              		var name = iobj.children("#name").val();
	              		$("#h1name").text(name);
	              	}
	              	
	              	//每次滑动页面初始化多选按钮
	              	$("input:checkbox").removeAttr("checked");
	              	$(".mycheck").removeClass("hide");
	              	$(".mycheck").addClass("hide");
	              	$(".check").find("span").html("多选推介");
	              	$(".check").find("span").attr("num", "1");
	              //上面导航列表同时滚动
	              	var w = 0;
	              	$(".tabs li").each(function(){
					    w = w + $(this).width();
					    if($(this).attr('class').indexOf('default') >= 0){
					    	return false;
					    }
					  });
	              	 $(".scrollNav").scrollLeft(w);
                }
            }
        });
        $(".tabs li").click(function(e){
              e.preventDefault();
              $(".tabs .default").removeClass('default');
              $(this).addClass('default');
              mySwiper2.slideTo($(this).index());
        });
        $(".tabs li").click(function(e){
            e.preventDefault();
        });
    </script>



</html>
