<apex:page controller="RentalApplySequenceController"  showHeader="false" sidebar="false" id="allPage" action="{!init}" title="排队查看">
<apex:stylesheet value="{!URLFOR($Resource.blockUIcss)}"/>
<apex:includeScript value="{!URLFOR($Resource.jquery183minjs)}"/>
<apex:includeScript value="{!URLFOR($Resource.PleaseWaitDialog)}"/>
<apex:includeScript value="/soap/ajax/29.0/connection.js"/>
<apex:includeScript value="/soap/ajax/29.0/apex.js"/>

<style type="text/css">
    .hideDropdown select{
        display: none
    }
    .table-head{padding-right:17px;}
    .tablehead0{padding-right:0;}
    .table-body table tr:nth-child(2n){background-color:#f2f2f2;}
    /*以下是下拉复选框的样式  start*/
    * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }
    .nav {
        width: 160px;
        line-height: 20px;
        border: 1px solid #000;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        margin: 0;
        z-index: 9999;
        display: inline-block;
        /*display: none;*/
    }
    ul,
    li {
        list-style: none;
    }
    .nav li input {
        margin: 0px 3px 0px 3px;
    }

    .nav li p:hover {
        background: #1e90ff;
        color: #fff;
    }
    .nav_a li input {
        margin: 0px 3px 0px 3px;
    }

    .nav_a li p:hover {
        background: #1e90ff;
        color: #fff;
    }
    #classification {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    #classification_a {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .nav_close {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 9990;
        display: none;
    }
    .nav_close_a {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 9999;
        display: none;
        background-color: red;
    }
    /*以下是下拉复选框的样式  end*/
    .transparent_class { 
        /*filter:alpha(opacity=50);
        -moz-opacity:0.5;
        -khtml-opacity: 0.5;
        opacity: 0.5;*/
    }
</style>
<script>
    // 滚轴是否显示
    window.onload = function gunzhou(){
    // window.onload = () => {
        gzShow();
    }
    function gzShow(){
        // console.log(j$('#tablebody').height());
        if(j$('#tablebody').height() >= 270){
            j$('#table-head').addClass("table-head");
        }else{
            j$('#table-head').addClass("tablehead0");
        }
    }
    //下拉多选框  strat
    j$(document).bind("click",function(e){
        var e = e || window.event;    //事件对象，兼容IE
        var target = e.target || e.srcElement;  //源对象，兼容火狐和IE
        while(target){
            // console.log(target.id);
            if (target.id && (target.id == "nav" ||target.id == "nav_a")){   
             //循环判断至根节点，防止点击的是#selected和它的子元素
                return;
            }
           target = target.parentNode;
        }
        j$("#selectCheckId").hide();   //点击的不是#selected和它的子元素，隐藏下拉菜单
        j$("#selectCheckId_a").hide();
    })
    
    //选择备品存放地 下拉框值有变动以后触发
    function selectCunFangDiJs(Obj){
        var selectId = Obj.value;
        //如果备品存放地选择无
        // console.log('00:'+selectId);
        //消除选择的其他选项
        if(j$("#classification").children().text() != "--无--"){
            j$("#classification").children().remove();
            j$("#classification").append("<span class='valClass_CF' id='initial'>--无--</span>");
        }
        var inputObj = j$(".li-input");
        if(inputObj != null){
            for(var i = 0; i < inputObj.length;i++){
                if(inputObj[i].checked){
                    inputObj[i].checked = false;
                }
            }
        }
        j$("#selectCheckId").show();
        // j$("#selectCheckId_a").hide();        
    }
    //点击 本部选择
    function selectBenBu(obj,name){
        var checked1 = j$(obj).prop("checked");
	    if (checked1 == true) {
	        j$("#classification").children("#initial").remove();
	        var idTemp = j$(obj).value().trim();
	        idTemp = 'Id'+idTemp.split('.')[0];
	        j$("#classification").append("<span class='valClass' id='" + (idTemp) + "'>" + (j$(obj)
	            .value().trim() + ",") + "</span>");
	    } else {
	        var idTemp = 'Id'+name.split('.')[0];
	        j$("#classification").children("#" + (idTemp)).remove();
	        var length = j$("#classification").html().length;
	        if (length === 0) {
	            j$("#classification").append("<span class='valClass' id='initial'>--无--</span>");
	        }
	    }
	    var optioncheck = j$(".valClass");
	    var hint = '';
	    for(var i = 0;i<optioncheck.length;i++){
            if(optioncheck[i].innerText != '--无--'){
                hint +=optioncheck[i].innerText;
            }
	    }
        // console.log(hint);
        j$(escapeVfId('allPage:allForm:searchBlock:mainSection:ApplyBB:S_ApplyBenBu')).val(hint);
    }
    function navClose(){
        j$("#selectCheckId").toggle();
    }

    // 办事处点击选择
    function selectAgency(obj,name){
        var checked1 = j$(obj).prop("checked");
        if (checked1 == true) {
            j$("#classification_a").children("#initial_a").remove();
            var idTemp = j$(obj).value().trim();
            idTemp = 'Id'+idTemp.split('.')[0];
            j$("#classification_a").append("<span class='valClass_a' id='" + (idTemp) + "'>" + (j$(obj)
                .value().trim() + ",") + "</span>");
        } else {
            var idTemp = 'Id'+name.split('.')[0];
            j$("#classification_a").children("#" + (idTemp)).remove();
            var length = j$("#classification_a").html().length;
            if (length === 0) {
                j$("#classification_a").append("<span class='valClass_a' id='initial_a'>--无--</span>");
            }
        }
        var optioncheck = j$(".valClass_a");
        var hint = '';
        for(var i = 0;i<optioncheck.length;i++){
            if(optioncheck[i].innerText != '--无--' ){
                hint +=optioncheck[i].innerText;
            }
        }
        j$(escapeVfId('allPage:allForm:searchBlock:mainSection:ApplyAA:S_Agency')).val(hint);
    }
    function navClose_a(){
        j$("#selectCheckId_a").toggle();
    }

    function searchJs() {
        blockme();
        searchfunc();
    }
    function checkEventJs(obj){
        blockme();
        j$(escapeVfId('allPage:allForm:checkEventId')).val(obj);
        checkEvent();
    }
</script>
<apex:form id="allForm">
    <apex:actionFunction name="changeCunfangdi" rerender="S_bieBenBuApply" oncomplete="unblockUI();"/>
    <!-- <apex:actionFunction name="changebenbu" rerender="S_AgencyApply" oncomplete="unblockUI();"/> -->
    <apex:actionFunction name="searchfunc" action="{!searchBtn}" rerender="MySequence,checEventFrame" onComplete="gzShow();unblockUI();"/>
    <apex:actionFunction name="recordNumChangeAction" action="{!recordNumChange}" rerender="MySequence" oncomplete="unblockUI();">
    </apex:actionFunction>
    <apex:actionFunction name="checkEvent" action="{!checkEvent}" rerender="checEventFrame" oncomplete="window.scrollTo(0, 200);unblockUI();">
    </apex:actionFunction>
    <apex:inputHidden id="checkEventId" value="{!checkEventId}" /> 
 	<apex:pageBlock id="searchBlock" title="查看排队情况">
		<apex:pageBlockSection title="检索" id="mainSection" columns="4"  >
	        <apex:pageBlockSectionItem >
	            <apex:outputLabel value="申请单号" />
	            <apex:inputText id="S_raName" value="{!S_raName}"/>
	        </apex:pageBlockSectionItem>
	        <apex:pageBlockSectionItem >
	            <apex:outputLabel value="型号" />
	            <apex:inputText id="S_Fixture_Model_No" value="{!S_Fixture_Model_No}"/>
	        </apex:pageBlockSectionItem>
	        <apex:pageBlockSectionItem >
	            <apex:outputLabel value="备品出借担当" />
	            <apex:inputField id="S_Person_In_Charge" value="{!S_Ra_Person.Person_In_Charge__c}" styleClass="hideDropdown" />
	        </apex:pageBlockSectionItem>
        
	        <apex:pageBlockSectionItem rendered="{!isEquipmentCenter}">
	            <apex:outputLabel for="S_bieBenBu" value="队列所在地区本部" />
				<apex:inputText id="S_bieBenBu" value="{!S_bieBenBu}"/>
	        </apex:pageBlockSectionItem>
            <!-- onchange="blockme(); changebenbu()" -->
            <!-- changebenbu(); -->
	        <apex:pageBlockSectionItem rendered="{!isEquipmentCenter}">
	            <apex:outputLabel for="S_bieCunFangDi" value="备品存放地" />
	            <apex:selectList value="{!S_bieCunFangDi}"  onchange="blockme(); changeCunfangdi();selectCunFangDiJs(this);return false;" size="1" style="width:160px" id="S_bieCunFangDi">
				<apex:selectOptions value="{!bieCunFangDiOps}"/>
				</apex:selectList>
	        </apex:pageBlockSectionItem>
            <apex:pageBlockSectionItem rendered="{!!isEquipmentCenter}"></apex:pageBlockSectionItem>
	        <apex:pageBlockSectionItem id="ApplyBB">
	            <apex:outputLabel for="S_bieBenBuApply" value="申请人所属本部" />
				<apex:outputPanel style="position: relative; " id="S_bieBenBuApply">
					<apex:inputHidden id="S_ApplyBenBu" value="{!S_ApplyBenBu}" />
    				<ul class="nav" id="nav" style="background-color: #FFFFFF;left:0px;">
                        <li id="classification" class="transparent_class" style="margin-left:0px;height:20px;" onclick="navClose();return false;">
                            <span id="initial">--无--</span>
                        </li>
                        <li id="selectCheckId" style="margin-left:0px;display: none;">
                        	<ul>
                        	<apex:repeat value="{!SApplyBenBu}" var="orr" id="selSD">
	                        <li class="sdclass" style="margin-left:0px">
	                            <p class="ul-nav" name="cate_id[]" >
	                                <input type="checkbox" value="{!orr.parameterName}" class="li-input" onclick="selectBenBu(this,'{!orr.parameterName}');" style="display: inline-block;vertical-align: middle;" />
	                                <font style="">{!orr.parameterName}</font>
	                            </p>
	                        </li>
	                        </apex:repeat>
	                    	</ul>
                        </li>
                        <!-- style="display: none;" -->
            		</ul>
                    <div class="nav_close"></div>
        		</apex:outputPanel>
	        </apex:pageBlockSectionItem>
	        <apex:pageBlockSectionItem id="ApplyAA" >
                <apex:outputLabel for="S_AgencyApply" value="申请者办事处" />
                <apex:outputPanel style="position: relative; " id="S_AgencyApply">
                <apex:inputHidden id="S_Agency" value="{!S_Agency}" />
                <ul class="nav" id="nav_a" style="background-color: #FFFFFF;left:0px;">
                    <li id="classification_a" class="transparent_class" style="margin-left:0px;height:20px;" onclick="navClose_a();return false;">
                        <span id="initial_a">--无--</span>
                    </li>
                    <li id="selectCheckId_a" style="margin-left:0px;display: none;">
                        <ul>
                        <apex:repeat value="{!SApplyAgency}" var="orr" id="selSD">
                        <li class="sdclass" style="margin-left:0px">
                            <p class="ul-nav" name="cate_id[]" >
                                <input type="checkbox" value="{!orr.parameterName}" class="li-input" onclick="selectAgency(this,'{!orr.parameterName}');" style="display: inline-block;vertical-align: middle;" />
                                <font style="">{!orr.parameterName}</font>
                            </p>
                        </li>
                        </apex:repeat>
                        </ul>
                    </li>
                    <!-- style="display: none;" -->
                </ul>
            </apex:outputPanel>
	        </apex:pageBlockSectionItem>
	        <apex:pageBlockSectionItem rendered="{!isEquipmentCenter}" >
	            <apex:outputLabel for="S_bieBeiPinFenLei" value="备品分类" />
	                <apex:selectList value="{!S_bieBeiPinFenLei}" size="1" id="bieBeiPinFenLei" style="width:180px">
	                    <apex:selectOptions value="{!bieBeiPinFenLeiOps}"/>
	                </apex:selectList>
	        </apex:pageBlockSectionItem>
	        <apex:pageBlockSectionItem rendered="{!isEquipmentCenter}" >
	            <apex:outputLabel for="S_Product_category" value="产品分类(GI/SP)" />
				<apex:selectList value="{!S_Product_category}" size="1" style="width:60px" id="S_Product_category">
				<apex:selectOptions value="{!bieChanPinFenLeiOps}"/>
				</apex:selectList>
	        </apex:pageBlockSectionItem>
	        
	        <apex:pageBlockSectionItem >
	         	 <apex:commandButton style="" value="检索" onclick="searchJs(); return false;"/>
	     	</apex:pageBlockSectionItem>
	    </apex:pageBlockSection>
	    
	    <!-- 数据 -->
	</apex:pageBlock>
	<apex:pageBlock id="MySequence">
	<apex:outputPanel id="message">
        <apex:pageMessages />
    </apex:outputPanel>
    <apex:pageBlockButtons location="top" id="pageBlockButton1">
    <table align="right" style="width: 700px;">
        <tr>
            <td>{!(currPage-1)*selctRecordNum}&nbsp;-&nbsp;{!IF(currPage*selctRecordNum > totalRecords, totalRecords, currPage*selctRecordNum)}</td>
            <td>&nbsp;&nbsp;共{!totalRecords}个</td>
            <td align="right" width="150px">显示
                <apex:selectList value="{!selRecordOption}" id="selRecordOption" size="1" onchange="blockme();recordNumChangeAction();" disabled="{!IF(totalRecords<20,true,false)}"><apex:selectOptions value="{!recordNum}"/></apex:selectList>条记录
            </td>
            <td align="right" width="55px">第{!currPage}页</td>
            <td align="right" width="45px">
                <apex:commandLink action="{!firstPage}" value="首页" id="firstPg" onclick="blockme();" oncomplete="unblockUI();" reRender="MySequence" style="{!IF(currPage==1,'display: none;','')}color: blue;"/>
                <apex:outputText value="首页" style="{!IF(currPage!=1,'display: none;','')}color: gray;"></apex:outputText>
            </td>
            <td align="right" width="55px">
                <apex:commandLink action="{!previousPage}" value="上一页" id="previous" onclick="blockme();" oncomplete="unblockUI();" reRender="MySequence" style="{!IF(currPage==1,'display: none;','')}color: blue;"/>
                <apex:outputText value="上一页" style="{!IF(currPage!=1,'display: none;','')}color: gray;"></apex:outputText>
            </td>
            <td width="3px"></td>
            <td align="left" width="55px">
                <apex:commandLink action="{!nextPage}" value="下一页" id="next" onclick="blockme();" oncomplete="gzShow();unblockUI();" reRender="MySequence" style="{!IF(totalPage==currPage ||totalPage == 0,'display: none;','')}color: blue;"/>
                <apex:outputText value="下一页" style="{!IF(totalPage!=currPage && totalPage != 0,'display: none;','')}color: gray;"></apex:outputText>
            </td>
            <td align="left" width="45px">
                <apex:commandLink action="{!endPage}" value="尾页" id="endPg" onclick="blockme();" oncomplete="gzShow();unblockUI();" reRender="MySequence" style="{!IF(totalPage==currPage||totalPage == 0,'display: none;','')}color: blue;"/>
                <apex:outputText value="尾页" style="{!IF(totalPage!=currPage
                    && totalPage != 0,'display: none;','')}color: gray;"></apex:outputText>
            </td>
            <!-- HWAG-B4R3SS  END 20181026-->
            <td align="left">共{!totalPage}页</td>
        </tr>
    </table>
	</apex:pageBlockButtons>
	<!-- <div  style="height: 270px;overflow-y:auto;"> -->
        <div class="" id="table-head">
        <table class="list" border="0" cellpadding="0" cellspacing="0" width="100%"  >
        	<!-- style="table-layout: fixed;" -->
        	<colgroup style="{!IF(isEquipmentCenter,'','display:none;')}" >
            <col width="10%" />
            <col width="10%" />
            <col width="8%" />
            <!-- 2022015 -->
            <col width="6%" />
            <col width="10%"/>
            <col width="4%"/>
            <col width="8%"/>
            <col width="6%"/>
            <col width="6%"/>
            <col width="6%"/>
            <col width="6%"/>
            <col width="4%"/>
            <col width="16%"/>
            </colgroup> 
            <colgroup style="{!IF(isEquipmentCenter,'display:none;','')}" >
            <col width="16%" />
            <col width="16%" />
            <col width="16%" />
            <col width="12%" />
            <col width="10%"/>
            <col width="10%"/>
            <col width="10%"/>
            <col width="10%"/>
            </colgroup>   
            <thead>
            <tr class="headerRow" >
                <th style="padding-bottom: 6px;">申请单号No.</th>
                <th style="padding-bottom: 6px;">一览No.</th>
                <th style="padding-bottom: 6px;">型号</th>
                <th style="padding-bottom: 6px;">排队备品<br/>预计出库时间</th> 
                <th style="padding-bottom: 6px; {!IF(isEquipmentCenter,'','display:none;')}">队列所在地区本部</th> <!-- 申请人看不到  -->
                <th style="padding-bottom: 6px;{!IF(isEquipmentCenter,'','display:none;')}">产品分类<br/>(GI/SP)</th> <!-- 申请人看不到 -->
                <th style="padding-bottom: 6px;{!IF(isEquipmentCenter,'','display:none;')}">备品分类</th> <!-- 申请人看不到 -->
                <th style="padding-bottom: 6px;{!IF(isEquipmentCenter,'','display:none;')}">备品存放地</th> <!-- 申请人看不到 -->
                <th style="padding-bottom: 6px;">申请者<br/>销售本部</th>
                <th style="padding-bottom: 6px;">申请者<br/>办事处</th> 
                <th style="padding-bottom: 6px;">备品出借担当</th> 
                <th style="padding-bottom: 6px;">排队NO.</th> 
                <th style="padding-bottom: 6px;{!IF(isEquipmentCenter,'','display:none;')}">序列NO.</th> <!-- 申请人看不到 -->
            </tr>
            </thead>
        </table>
        </div>
        <div class="table-body" id="table-body" style="height: 270px;overflow-y:auto;">
        <table class="list" border="0" cellpadding="0" cellspacing="0" id="tablebody" style="table-layout:fixed;" >
            <colgroup style="{!IF(isEquipmentCenter,'','display:none;')}" >
            <col width="10%" />
            <col width="10%" />
            <col width="8%" />
            <!-- 2022015 -->
            <col width="6%" />
            <col width="10%"/>
            <col width="4%"/>
            <col width="8%"/>
            <col width="6%"/>
            <col width="6%"/>
            <col width="6%"/>
            <col width="6%"/>
            <col width="4%"/>
            <col width="16%"/>
            </colgroup> 
            <colgroup style="{!IF(isEquipmentCenter,'display:none;','')}" >
            <col width="16%" />
            <col width="16%" />
            <col width="16%" />
            <col width="12%" />
            <col width="10%"/>
            <col width="10%"/>
            <col width="10%"/>
            <col width="10%"/>
            </colgroup>  
            <tbody>
            <apex:repeat value="{!raesInfoListList[currPage-1]}" var="info"  id="Sequence" >
            <tr height="48px">
                <td><apex:outputField value="{!info.raesd.Rental_Apply__c}"/></td>
                <!-- <span><apex:outputLink value="/{!rased.Id}"> <apex:outputField value="{!rased.Rental_Apply__c}" id="opname"/></apex:outputLink></span> -->
                <td style="white-space: pre-wrap;word-wrap:break-word;"><apex:outputField value="{!info.raesd.Rental_Apply_Equipment_Set__c}"/></td>
                <td style="white-space: pre-wrap;word-wrap:break-word;"><apex:outputField value="{!info.raesd.Fixture_Model_No__c}"/></td>
                <td style="white-space: pre-wrap;word-wrap:break-word;"><apex:outputField value="{!info.raesd.Rental_Apply_Equipment_Set__r.QueueShippmentDateNew__c}"/></td>
                <apex:outputPanel rendered="{!isEquipmentCenter}" layout="none"> 
                <td style="white-space: pre-wrap;word-wrap:break-word;"><apex:outputField value="{!info.raesd.Salesdepartment_before__c}"/></td>
                <td style="white-space: pre-wrap;word-wrap:break-word;"><apex:outputField value="{!info.raesd.Product_category_text__c}"/></td>
                <td style="white-space: pre-wrap;word-wrap:break-word;"><apex:outputField value="{!info.raesd.Equipment_Type_text__c}"/></td>
                <td style="white-space: pre-wrap;word-wrap:break-word;"><apex:outputField value="{!info.raesd.Internal_asset_location_before__c}"/></td>
                </apex:outputPanel>
                <td style="white-space: pre-wrap;word-wrap:break-word;"><apex:outputField value="{!info.raesd.Rental_Apply__r.Salesdepartment_text__c}"/></td>
                <td style="white-space: pre-wrap;word-wrap:break-word;"><apex:outputField value="{!info.raesd.Rental_Apply__r.WorkPlace__c}"/></td>
                <td style="white-space: pre-wrap;word-wrap:break-word;"><apex:outputField value="{!info.raesd.Rental_Apply__r.Person_In_Charge__c}"/></td>
                <td style="white-space: pre-wrap;word-wrap:break-word;">
                	<apex:outputField value="{!info.raesd.Queue_Number__c}" rendered="{!!isEquipmentCenter}" />
                	<apex:outputLink value="" rendered="{!isEquipmentCenter}" onclick="checkEventJs('1;{!info.raesd.Rental_Apply_Equipment_Set__c}');return false;"> {!info.raesd.Queue_Number__c}</apex:outputLink>
                </td>
                <apex:outputPanel rendered="{!isEquipmentCenter}" layout="none"> 
                <td>
                    <apex:repeat value="{!info.raqList}" var="qL"  id="SeriesNo" >
                    <apex:outputLink value="" onclick="checkEventJs('2;{!qL.Id}');return false;">{!qL.Salesdepartment__c};{!qL.Equipment_Type__c};{!qL.Product_category__c};<font style="color: red;font-weight: 800;">{!qL.Series_No__c}</font>
                    </apex:outputLink><br/>
                    </apex:repeat>
                </td>
            	</apex:outputPanel>
            </tr>
            </apex:repeat>
            </tbody>
        </table>
	</div>
	</apex:pageBlock>
</apex:form>

<apex:outputPanel id="checEventFrame">
    <apex:iframe id="theIframe" rendered="{!IF(!ISBLANK(frameUrl),true,false)}" title="排队一览" src="{!frameUrl}"/>
</apex:outputPanel>
</apex:page>