<link href="/css/tabs.css" rel="stylesheet" type="text/css">
<table width="100%" border="0" align="center" cellpadding="3" cellspacing="1" class="table">
    <tr>
        <td colspan="13" height="22" class="td_bg">
            <TABLE cellSpacing=0 cellPadding=0 width="100%" border=0 id="menuTab">
                <TBODY>
                <TR>
                    <TD height="30" align="center" class="tab-on" onclick="switchCell(1)" name="navcell">
                        更换清单
                    </TD>
                    <TD height="30" align="center" class="tab-off" onclick="switchCell(2)" name="navcell">
                        维修清单
                    </TD>
                    <TD height="30" align="center" class="tab-off"  onclick="switchCell(3)" name="navcell">
                        辅料清单
                    </TD>
                    <TD height="30" align="center" class="tab-off" onclick="switchCell(4)" name="navcell">
                        待定...
                    </TD>
                    <TD height="30" class=tab-none>&nbsp;</TD>
                </TR>
                </TBODY>
            </TABLE>
        </td>
    </tr>
</table>
<div>
    <!-- 更换清单 菜单 -->
    <div class="ui-layout-west con-1" style="padding: 0px; overflow: hidden;float: left;width:15%;">
        <iframe src="/store-room/left?t=1&fix_id=<?= $fix_id ?>" width="100%" height="65%" frameborder="0"></iframe>
    </div>
    <!-- end -->
    <!-- 维修清单 菜单 -->
    <div class="ui-layout-west con-2" style="padding: 0px; overflow: hidden;float: left;width:15%;display: none">
        <iframe src="/store-room/left?t=2&fix_id=<?= $fix_id ?>" width="100%" height="65%" frameborder="0"></iframe>
    </div>
    <!-- end -->
    <!-- 辅料清单 菜单 -->
    <div class="ui-layout-west con-3" style="padding: 0px; overflow: hidden;float: left;width:15%;display: none">
<!--        <iframe src="/store-room/trims-room" width="100%" height="65%" frameborder="0"></iframe>-->
    </div>
    <!-- end -->
    <!-- 待定 菜单 -->
    <div class="ui-layout-west con-4" style="padding: 0px; overflow: hidden;float: left;width:15%;display: none">
        <!--            <iframe src="/store-room/left?t=4" width="100%" height="65%" frameborder="0"></iframe>-->
        待定
    </div>
    <!-- end -->
</div>
<!--  内容 -->
<div id="container" class="ui-layout-center" style="padding: 0px; overflow: hidden;float: left;width:85% ">
    <iframe width="100%" height="65%" frameborder="0"></iframe>
</div>
<!-- end -->
<div id="bottom" style="width: 100%;height: 20%;float: left">
    <iframe src="/fix-car-item/index?fix_id=<?= $fix_id ?>&t=1" width="100%" height="100%" frameborder="0"></iframe>
</div>
<div style="width: 100%;text-align: center">
    <input type="button" class="act_btn" value="返回" onclick="goBack()">
</div>
<script type="text/javascript" language="javascript" src="/js/jquery-1.8.3.js"></script>
<script>
    function switchCell(index) {
        $('#menuTab td').not('.tab-none').each(function (i) {
            if (index == (1 + i)) {
                $(this).addClass('tab-on');
                $(this).removeClass('tab-off');
                $('.con-' + index).show();
            } else {
                $(this).removeClass('tab-on');
                $(this).addClass('tab-off');
                $('.con-' + index).siblings().hide();
            }
        });

        var $iframe = $bottom = '';
        if(3 == index){
            $('.con-3').hide();
            $('#container').css('width','100%');
            $iframe = '<iframe src="/store-room/trims-room?fix_id=<?= $fix_id ?>" width="100%" height="65%" frameborder="0"></iframe>';
            $bottom = '<iframe src="/fix-car-item/index?fix_id=<?= $fix_id ?>&t=3" width="100%" height="65%" frameborder="0"></iframe>';
        }else if(1 == index){
            $('#container').css('width','85%');
            $iframe = '<iframe src="/store-room/shop?op=1&fix_id=<?= $fix_id ?>" width="100%" height="65%" frameborder="0"></iframe>';
            $bottom = '<iframe src="/fix-car-item/index?fix_id=<?= $fix_id ?>&t=1" width="100%" height="65%" frameborder="0"></iframe>';
        }else if(2 == index){
            $('#container').css('width','85%');
            $iframe = '<iframe src="/store-room/container?op=1&fix_id=<?= $fix_id ?>" width="100%" height="65%" frameborder="0"></iframe>';
            $bottom = '<iframe src="/fix-car-item/index?fix_id=<?= $fix_id ?>&t=2" width="100%" height="65%" frameborder="0"></iframe>';
        }
        $('#container').html($iframe);
        $('#bottom').html($bottom);
    }
    //内容
    function openTab(url){
        url += '&car_price=<?= $car_price ?>';
        var $iframe = '<iframe src="'+url+'" width="100%" height="65%" frameborder="0"></iframe>';
            $('#container').html($iframe);
    }
    //底部
    function openBottom(url){
        var $iframeBottom = '<iframe src="'+url+'" width="100%" height="65%" frameborder="0"></iframe>';
        $('#bottom').html($iframeBottom);
    }

    function goBack(){
        window.history.go(-1);
    }
</script>