<apex:page controller="SelectProduct2Extension" showHeader="true" id="allPage" action="{!init}">
<apex:stylesheet value="{!URLFOR($Resource.blockUIcss)}"/>
<apex:includeScript value="{!URLFOR($Resource.jquery183minjs)}"/>
<apex:includeScript value="{!URLFOR($Resource.PleaseWaitDialog)}"/>

<script>
function checkAll() {
    var productCount=document.getElementById('allPage:allForm:allBlock:productSection:productCnt').value;
    if (document.getElementById('checker').checked == true) {
        for (var i = 0; i < productCount; i++) {
            document.getElementById('allPage:allForm:allBlock:productSection:productTable:' + i + ':proRowCheckbox').checked = true;
        }
    } else {
        for (var i = 0; i < productCount; i++) {
            document.getElementById('allPage:allForm:allBlock:productSection:productTable:' + i + ':proRowCheckbox').checked = false;
        }
    }
}

function searchProductJs() {
    var productCount=document.getElementById('allPage:allForm:allBlock:productSection:productCnt').value;
    var isChanged = false;
    for (var i = 0; i < productCount; i++) {
        var nowChk = document.getElementById('allPage:allForm:allBlock:productSection:productTable:' + i + ':proRowCheckbox').checked;
        var oldChk = document.getElementById('allPage:allForm:allBlock:productSection:productTable:' + i + ':proRowOldCheckbox').checked;
        if (nowChk != oldChk) {
            isChanged = true;
            break;
        }
    }
    
    if (isChanged) {
        if (window.confirm('产品的选择有变化，要保存所做的变更吗？\n点击 [确定] 保存并检索\n点击 [取消] 只检索，放弃保存')) {
            saveAndSearch(1, j$(escapeVfId('Family')).value());
        } else {
            searchProduct(j$(escapeVfId('Family')).value());
        }
    } else {
        searchProduct(j$(escapeVfId('Family')).value());
    }
}

function sortTableJs(key) {
    var productCount=document.getElementById('allPage:allForm:allBlock:productSection:productCnt').value;
    var isChanged = false;
    for (var i = 0; i < productCount; i++) {
        var nowChk = document.getElementById('allPage:allForm:allBlock:productSection:productTable:' + i + ':proRowCheckbox').checked;
        var oldChk = document.getElementById('allPage:allForm:allBlock:productSection:productTable:' + i + ':proRowOldCheckbox').checked;
        if (nowChk != oldChk) {
            isChanged = true;
            break;
        }
    }
    
    if (isChanged) {
        if (window.confirm('产品的选择有变化，要保存所做的变更吗？\n点击 [确定] 保存并排序\n点击 [取消] 只排序，放弃保存')) {
            saveAndSort(2, key, j$(escapeVfId('Family')).value());
        } else {
            sortTable(key, j$(escapeVfId('Family')).value());
        }
    } else {
        sortTable(key, j$(escapeVfId('Family')).value());
    }
}
</script>
    <apex:form id="allForm">
        <apex:actionFunction name="sortTable" action="{!sortTable}" rerender="productSection, message" onComplete="unblockUI();">
            <apex:param name="firstParam" assignTo="{!sortKey}" value="" />
            <apex:param name="family" assignTo="{!family}" value="" />
        </apex:actionFunction>
        <apex:actionFunction name="saveAndSearch" action="{!save}" rerender="productSection, message" onComplete="unblockUI();">
            <apex:param name="firstParam" assignTo="{!saveType}" value="" />
            <apex:param name="family" assignTo="{!family}" value="" />
        </apex:actionFunction>
        <apex:actionFunction name="saveAndSort" action="{!save}" rerender="productSection, message" onComplete="unblockUI();">
            <apex:param name="firstParam" assignTo="{!saveType}" value="" />
            <apex:param name="secondParam" assignTo="{!sortKey}" value="" />
            <apex:param name="family" assignTo="{!family}" value="" />
        </apex:actionFunction>
        <apex:actionFunction name="searchProduct" action="{!searchProduct}" rerender="productSection, message" onComplete="unblockUI();">
            <apex:param name="family" assignTo="{!family}" value="" />
        </apex:actionFunction>
        
        <apex:outputPanel id="allPanel">
            <apex:pageBlock title="产品选择" id="allBlock">
                <apex:pageBlockButtons >
                        <apex:commandButton action="{!save}" value="保存" rerender="message"/>
                        <apex:commandButton action="{!cancel}" value="取消" rerender="message"/>
                </apex:pageBlockButtons>
                
                <apex:pageBlock id="searchBlock">
                    <apex:inputHidden value="{!multiStatus}" id="multiStatus"/>
                    <table>
                        <tr>
                            <td colspan="2">{!$ObjectType.Product2.fields.Asset_Model_No__c.label}</td>
                            <td colspan="3"><apex:inputText value="{!assetModelNo}" style="width:100px"/></td>
                        </tr>
<!--                        <tr>-->
<!--                            <td colspan="2">{!$ObjectType.Product2.fields.SFDA_Status__c.label}</td>-->
<!--                            <td colspan="5">-->
<!--                                <select id="SFDA" style="width:280px" size="4" multiple="multiple"/>-->
<!--                                <apex:inputField id="hiddenSFDA" value="{!pro.SFDA_Status__c}" style="display:none"/>-->
<!--                            </td>-->
<!--                        </tr>-->
                        <tr>
                            <td width="50px">{!$ObjectType.Product2.fields.Family.label}</td>
                            <td>
                                <select id="Family" style="width:100px" size="1" />
                                <apex:inputField id="hiddenFamily" value="{!pro.Family}" style="display:none"/>
                            </td>
                            <td width="20px"/>
                            <td width="50px">{!$ObjectType.Product2.fields.Category2__c.label}</td>
                            <td><apex:inputText value="{!category2}" style="width:100px"/></td>
                            <td width="20px"/>
                            <td width="50px">{!$ObjectType.Product2.fields.Category3__c.label}</td>
                            <td><apex:inputText value="{!category3}" style="width:100px"/></td>
                            <td width="20px"/>
                            <td width="50px">{!$ObjectType.Product2.fields.Category4__c.label}</td>
                            <td><apex:inputText value="{!category4}" style="width:100px"/></td>
                            <td width="20px"/>
                            <td width="50px">{!$ObjectType.Product2.fields.Category5__c.label}</td>
                            <td><apex:inputText value="{!category5}" style="width:100px"/></td>
                        </tr>
                        <tr>
<!--                            <td><apex:commandButton action="{!searchProduct}" value="搜索" rerender="productSection, message"/></td>-->
                            <td><apex:commandButton value="搜索" onclick="blockme(); searchProductJs(); return false;" rerender="dummy"/></td>
                        </tr>
                    </table>
                    <script>
                        j$(escapeVfId('Family')).append(j$(escapeVfId('allPage:allForm:allBlock:searchBlock:hiddenFamily')).children("option"));
                        //j$(escapeVfId('SFDA')).children('option[value=]').remove();
                        //j$(escapeVfId('SFDA')).children('option[value=準備中]').remove();
                        //j$(escapeVfId('SFDA')).children('option[value=新製品申請中]').remove();
                        for (var i = 0; i < j$(escapeVfId('Family'))[0].childNodes.length; i++) {
                            j$(escapeVfId('Family'))[0].childNodes[i].selected = false;
                        }
                    </script>
                </apex:pageBlock>
                
                <apex:outputPanel id="message">
                    <apex:pageMessages />
                </apex:outputPanel>
                
                <apex:pageblocksection columns="1" title="产品" id="productSection">
                    <apex:inputHidden id="productCnt" value="{!productCount}"/>
                    <apex:pageblocktable value="{!productRecords}" var="product" id="productTable">
                         <apex:column >
                             <apex:facet name="header"><input type='checkbox' onClick='checkAll()' id='checker'/></apex:facet>
                             <apex:inputCheckbox value="{!product.check}" id="proRowCheckbox"/>
                             <apex:inputCheckbox value="{!product.oldCheck}" id="proRowOldCheckbox" style="display:none"/>
                         </apex:column>
                         <apex:column >
                             <apex:facet name="header"><a href="#" onclick="sortTableJs('0');return false;" style="text-decoration: underline;">{!$ObjectType.Product2.fields.Asset_Model_No__c.label}</a>　{!sortOrder[0]}</apex:facet>
                             <apex:outputField value="{!product.rec.Asset_Model_No__c}"/>
                         </apex:column>
                         <apex:column >
                             <apex:facet name="header"><a href="#" onclick="sortTableJs('1');return false;" style="text-decoration: underline;">{!$ObjectType.Product2.fields.MDM_Name__c.label}</a>　{!sortOrder[1]}</apex:facet>
                             <apex:outputField value="{!product.rec.MDM_Name__c}"/>
                            </apex:column>
                         <apex:column >
                             <apex:facet name="header"><a href="#" onclick="sortTableJs('2');return false;" style="text-decoration: underline;">{!$ObjectType.Product2.fields.OT_CODE_no_link__c.label}</a>　{!sortOrder[2]}</apex:facet>
                             <apex:outputField value="{!product.rec.OT_CODE_no_link__c}"/>
                         </apex:column>
                         <apex:column >
                             <apex:facet name="header"><a href="#" onclick="sortTableJs('4');return false;" style="text-decoration: underline;">{!$ObjectType.Product2.fields.SFDA_Status__c.label}</a>　{!sortOrder[4]}</apex:facet>
                             <apex:outputField value="{!product.rec.SFDA_Status__c}"/>
                         </apex:column>
                         <apex:column >
                             <apex:facet name="header"><a href="#" onclick="sortTableJs('3');return false;" style="text-decoration: underline;">{!$ObjectType.Product2.fields.Family.label}</a>　{!sortOrder[3]}</apex:facet>
                             <apex:outputField value="{!product.rec.Family}"/>
                         </apex:column>
<!--                         <apex:column>-->
<!--                             <apex:facet name="header"><a href="#" onclick="sortTable('5');return false;" style="text-decoration: underline;">{!$ObjectType.Product2.fields.Intra_Trade_List_RMB__c.label}</a>　{!sortOrder[5]}</apex:facet>-->
<!--                             <apex:outputField value="{!product.rec.Intra_Trade_List_RMB__c}"/>-->
<!--                         </apex:column>-->
<!--                         <apex:column>-->
<!--                             <apex:facet name="header"><a href="#" onclick="sortTable('6');return false;" style="text-decoration: underline;">{!$ObjectType.Product2.fields.Foreign_Trade_List_US__c.label}</a>　{!sortOrder[6]}</apex:facet>-->
<!--                             <apex:outputField value="{!product.rec.Foreign_Trade_List_US__c}"/>-->
<!--                         </apex:column>-->
                         <apex:column >
                             <apex:facet name="header"><a href="#" onclick="sortTableJs('5');return false;" style="text-decoration: underline;">{!$ObjectType.Product2.fields.Category2__c.label}</a>　{!sortOrder[5]}</apex:facet>
                             <apex:outputField value="{!product.rec.Category2__c}"/>
                         </apex:column>
                         <apex:column >
                             <apex:facet name="header"><a href="#" onclick="sortTableJs('6');return false;" style="text-decoration: underline;">{!$ObjectType.Product2.fields.Category3__c.label}</a>　{!sortOrder[6]}</apex:facet>
                             <apex:outputField value="{!product.rec.Category3__c}"/>
                         </apex:column>
                         <apex:column >
                             <apex:facet name="header"><a href="#" onclick="sortTableJs('7');return false;" style="text-decoration: underline;">{!$ObjectType.Product2.fields.Category4__c.label}</a>　{!sortOrder[7]}</apex:facet>
                             <apex:outputField value="{!product.rec.Category4__c}"/>
                         </apex:column>
                         <apex:column >
                             <apex:facet name="header"><a href="#" onclick="sortTableJs('8');return false;" style="text-decoration: underline;">{!$ObjectType.Product2.fields.Category5__c.label}</a>　{!sortOrder[8]}</apex:facet>
                             <apex:outputField value="{!product.rec.Category5__c}"/>
                         </apex:column>
                    </apex:pageblocktable>
                </apex:pageblocksection>
            </apex:pageBlock>
        </apex:outputPanel>
    </apex:form>
</apex:page>