Vue 双层嵌套

这种的需要双层嵌套。

代码：

 <table id="ict-table" class="ict-table ict-report-table blue-theme">
        <thead>
            <tr>
                <th class="width36"></th>
                <th>@L("Product")</th>
                <th class="width160" v-show="SpinnerBlock">盘拉工序</th>
                <th class="width160" v-show="InlineAnnealing">在线退火工序</th>
                <th class="width160" v-show="InnerGrooving">内螺纹成型工序</th>
                <th class="width160" v-show="Winding">精整工序</th>
                <th class="width160" v-show="Annealing">退火包装工序</th>
                <th class="width160" v-show="InnerGrooving2">内螺纹成型工序</th>
            </tr>
        </thead>
        <tbody>
            <template v-for="item in GroupInfoList">
                <tr>
                    <td class="ict-toggle-td" v-on:click="Show(item)"><span v-show="!item.IsShow">+</span><span v-show="item.IsShow">-</span></td>
                    <td>
                        <div class="lh48 f16">{{item.customerName}}</div>
                        <div class="lh30">
                            <span class="f14 fwb">{{item.specification}}</span>
                            <span> -- {{item.technology}}</span>
                        </div>
                    </td>
                    <td v-show="SpinnerBlock">
                        <div class="w45p fl lh48 f24 fwb tac">{{item.盘拉工序.num}}</div>
                        <div class="w55p fl" v-show="LastTD!='SpinnerBlock'">
                            <div class="tac lh24 f12">在制：{{item.盘拉工序.working}}</div>
                            <div class="tac lh24 f12">下料：{{item.盘拉工序.worked}}</div>
                        </div>
                        <div class="cb bst f14 gray fwb tal">{{item.盘拉工序.weight.toFixed(3)}}吨</div>
                    </td>
                    <td v-show="InlineAnnealing">
                        <div class="w45p fl lh48 f24 fwb tac">{{item.在线退火工序.num}}</div>
                        <div class="w55p fl" v-show="LastTD!='InlineAnnealing'">
                            <div class="tac lh24 f12">在制：{{item.在线退火工序.working}}</div>
                            <div class="tac lh24 f12">下料：{{item.在线退火工序.worked}}</div>
                        </div>
                        <div class="cb bst f14 gray fwb tal">{{item.在线退火工序.weight.toFixed(3)}}吨</div>
                    </td>
                    <td v-show="InnerGrooving">
                        <div class="w45p fl lh48 f24 fwb tac">{{item.内螺纹成型工序.num}}</div>
                        <div class="w55p fl"  v-show="LastTD!='InnerGrooving'">
                            <div class="tac lh24 f12">在制：{{item.内螺纹成型工序.working}}</div>
                            <div class="tac lh24 f12">下料：{{item.内螺纹成型工序.worked}}</div>
                        </div>
                        <div class="cb bst f14 gray fwb tal">{{item.内螺纹成型工序.weight.toFixed(3)}}吨</div>
                    </td>
                    <td v-show="Winding">
                        <div class="w45p fl lh48 f24 fwb tac">{{item.精整工序.num}}</div>
                        <div class="w55p fl"  v-show="LastTD!='Winding'">
                            <div class="tac lh24 f12">在制：{{item.精整工序.working}}</div>
                            <div class="tac lh24 f12">下料：{{item.精整工序.worked}}</div>
                        </div>
                        <div class="cb bst f14 gray fwb tal">{{item.精整工序.weight.toFixed(3)}}吨</div>
                    </td>
                    <td v-show="Annealing">
                        <div class="w45p fl lh48 f24 fwb tac">{{item.退火包装工序.num}}</div>
                        <div class="w55p fl" v-show="LastTD!='Annealing'">
                            <div class="tac lh24 f12">在制：{{item.退火包装工序.working}}</div>
                            <div class="tac lh24 f12">下料：{{item.退火包装工序.worked}}</div>
                        </div>
                        <div class="cb bst f14 gray fwb tal">{{item.退火包装工序.weight.toFixed(3)}}吨</div>
                    </td>
                    <td v-show="InnerGrooving2">
                        <div class="w45p fl lh48 f24 fwb tac">{{item.内螺纹成型工序.num}}</div>
                        <div class="w55p fl"  v-show="LastTD!='InnerGrooving2'">
                            <div class="tac lh24 f12">在制：{{item.内螺纹成型工序.working}}</div>
                            <div class="tac lh24 f12">下料：{{item.内螺纹成型工序.worked}}</div>
                        </div>
                        <div class="cb bst f14 gray fwb tal">{{item.内螺纹成型工序.weight.toFixed(3)}}吨</div>
                    </td>
                </tr>
                 <tr class="ict-toggle-row ict-table-extended" v-show="item.IsShow"> 
                     <td colspan="{{Colspan}}" v-if="!item.IsLoaded">
                         <div class="ict-loading"></div>
                     </td>
                    <td colspan="{{Colspan}}" v-if="item.IsLoaded">
                        <div class="ict-inner-td-wrapper">
                            <table class="ict-table">
                                <thead>
                                    <tr>
                                        <th class="width36"></th>
                                        <th class="">设备</th>
                                        <th class="width50">筐号</th>
                                        <th class="width160">批号</th>
                                        <th class="width70">重量</th>
                                        <th class="width50">等级</th>
                                        <th class="width50">判定</th>
                                        <th class="width50">状态</th>
                                        <th class="width110">上料时间</th>
                                        <th class="width110">下料时间</th>
                                        <th class="width36"></th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr v-bind:class="{'in-processing':l.state==0}" v-for="l in item.list">
                                        <td class="tac">{{$index+1}}</td>
                                        <td>{{l.equipmentName}}</td>
                                        <td>{{l.basketCode}}</td>
                                        <td>{{l.code}}</td>
                                        <td>{{l.weight}}</td>
                                        <td>{{l.grade}}</td>
                                        <td>{{l.quality==0?"合格":l.quality==1?"不合格":"待判定"}}</td>
                                        <td>{{l.state==0?"在制":"下料"}}</td>
                                        <td>{{l.loadTime}}</td>
                                        <td>{{l.unloadTime}}</td>
                                        <td style="padding:0;">
                                            <a href="../../Quality/Tracing?code={{l.code}}&ticketid={{l.ticketID}}" class="ict-link tac" title="@L("PrdTracing")">…</a>
                                        </td>
                                    </tr>
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <td colspan="11">
                                            <div class="ict-pager clearfix" v-show="TotalCount>0">
                                                <div class="ict-pager-navs w50p tal">
                                                    <a href="javascript:;" class="ict-pager-nav ict-pager-nav-first {{CurrentPage==1?'disabled':''}}" v-on:click="CurrentPage=1">@L("PageFirst")</a>
                                                    <a href="javascript:;" class="ict-pager-nav ict-pager-nav-prev {{CurrentPage<2?'disabled':''}}" v-on:click="CurrentPage=CurrentPage-1">@L("PagePrev")</a>
                                                    <div class="ict-pager-displayer">
                                                        <span class="ict-pager-current-page">{{CurrentPage}}</span>
                                                        <span class="ict-pager-spliter">/</span>
                                                        <span class="ict-pager-total-pages">{{TotalPages}}</span>
                                                    </div>
                                                    <a href="javascript:;" class="ict-pager-nav ict-pager-nav-next {{CurrentPage>TotalPages-1?'disabled':''}}" v-on:click="CurrentPage=CurrentPage+1">@L("PageNext")</a>
                                                    <a href="javascript:;" class="ict-pager-nav ict-pager-nav-last {{CurrentPage>TotalPages-1?'disabled':''}}" v-on:click="CurrentPage=TotalPages">@L("PageLast")</a>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                </tfoot>
                            </table>
                        </div>
                    </td>
                </tr>
            </template>

        </tbody>
    </table>

两行的时候使用template