多期比较，样式调整

app/public/js/measure_compare.js

@@ -383,5 +383,15 @@ $(document).ready(() => {
         SpreadJsObj.reloadColData(billsSheet, 9, compareStages.length * 2);
         SpreadJsObj.reLoadSheetHeader(leafXmjSheet);
         SpreadJsObj.reloadColData(posSheet, 9, compareStages.length);
+    });
+    $('[name=compareType]').click(function () {
+        $('[name=compareType]').removeClass('active');
+        $(this).addClass('active');
+        $('#compareType').children().removeClass('active');
+        $(this.getAttribute('href')).addClass('active');
+        billsSpread.refresh();
+        posSpread.refresh();
+        gclSpread.refresh();
+        leafXmjSpread.refresh();
     })
 });

app/view/measure/compare.ejs

@@ -1,61 +1,57 @@
 <% include ../tender/tender_sub_menu.ejs %>
 <div class="panel-content">
     <div class="panel-title">
-        <div class="title-main d-flex">
+        <div class="title-main d-flex justify-content-between">
             <% include ../tender/tender_sub_mini_menu.ejs %>
             <div>
-                <div class="bc-bar mb-1">
-                    <ul class="nav nav-tabs">
-                        <li class="nav-item">
-                            <a class="nav-link" data-toggle="tab" href="#tz" role="tab">台账</a>
-                        </li>
-                        <li class="nav-item">
-                            <a class="nav-link active" data-toggle="tab" href="#gcl" role="tab">工程量清单</a>
-                        </li>
-                        <li class="nav-item">
-                            <div>
-                                <div class="d-inline-block">
-                                    <div class="dropdown">
-                                        <button class="btn btn-sm btn-light dropdown-toggle text-primary" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                                            <i class="fa fa-list-ol"></i> 显示层级
-                                        </button>
-                                        <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
-                                            <a class="dropdown-item" name="showLevel" tag="1" href="javascirpt: void(0);">第一层</a>
-                                            <a class="dropdown-item" name="showLevel" tag="2" href="javascirpt: void(0);">第二层</a>
-                                            <a class="dropdown-item" name="showLevel" tag="3" href="javascirpt: void(0);">第三层</a>
-                                            <a class="dropdown-item" name="showLevel" tag="4" href="javascirpt: void(0);">第四层</a>
-                                            <a class="dropdown-item" name="showLevel" tag="5" href="javascirpt: void(0);">第五层</a>
-                                            <a class="dropdown-item" name="showLevel" tag="last" href="javascirpt: void(0);">最底层</a>
-                                            <a class="dropdown-item" name="showLevel" tag="leafXmj" href="javascirpt: void(0);">只显示项目节</a>
-                                        </div>
-                                    </div>
-                                </div>
-                                <div class="d-inline-block">
-                                    <button href="#cate-set" class="btn btn-sm btn-light text-primary" data-toggle="modal" data-target="#select-qi"><i class="fa fa-clone"></i> 选择比较期</button>
-                                </div>
-                                <% if (ctx.app.config.is_debug) { %>
-                                <div class="d-inline-block ml-3">
-                                    <a id="exportExcel" class="btn btn-primary btn-sm" href="javascript: void(0)">导出清单汇总Excel</a>
-                                </div>
-                                <% } %>
-                                <div class="d-inline-block ml-3">
-                                    期数据来源：
-                                    <div class="form-check form-check-inline">
-                                        <input class="form-check-input" type="radio" id="radio_contract" value="contract" name="compare-data">
-                                        <label class="form-check-label" for="radio_contract">合同</label>
-                                    </div>
-                                    <div class="form-check form-check-inline">
-                                        <input class="form-check-input" type="radio" id="radio_qc" value="qc" name="compare-data">
-                                        <label class="form-check-label" for="radio_qc">变更</label>
-                                    </div>
-                                    <div class="form-check form-check-inline">
-                                        <input class="form-check-input" type="radio" id="radio_gather" value="gather" checked name="compare-data">
-                                        <label class="form-check-label" for="radio_gather">完成</label>
-                                    </div>
-                                </div>
-                            </div>
-                        </li>
-                    </ul>
+                <div class="d-inline-block">
+                    <div class="btn-group group-tab">
+                        <a class="btn btn-sm btn-light active" href="#gcl" data-toggle="tab" name="compareType">
+                            工程量清单
+                        </a>
+                        <a class="btn btn-sm btn-light" href="#tz" data-toggle="tab" name="compareType">
+                            0号台账
+                        </a>
+                    </div>
+                </div>
+                <div class="d-inline-block">
+                    <div class="dropdown">
+                        <button class="btn btn-sm btn-light dropdown-toggle text-primary" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                            <i class="fa fa-list-ol"></i> 显示层级
+                        </button>
+                        <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+                            <a class="dropdown-item" name="showLevel" tag="1" href="javascirpt: void(0);">第一层</a>
+                            <a class="dropdown-item" name="showLevel" tag="2" href="javascirpt: void(0);">第二层</a>
+                            <a class="dropdown-item" name="showLevel" tag="3" href="javascirpt: void(0);">第三层</a>
+                            <a class="dropdown-item" name="showLevel" tag="4" href="javascirpt: void(0);">第四层</a>
+                            <a class="dropdown-item" name="showLevel" tag="5" href="javascirpt: void(0);">第五层</a>
+                            <a class="dropdown-item" name="showLevel" tag="last" href="javascirpt: void(0);">最底层</a>
+                            <a class="dropdown-item" name="showLevel" tag="leafXmj" href="javascirpt: void(0);">只显示项目节</a>
+                        </div>
+                    </div>
+                </div>
+                <div class="d-inline-block">
+                    <button href="#cate-set" class="btn btn-sm btn-light text-primary" data-toggle="modal" data-target="#select-qi"><i class="fa fa-clone"></i> 选择比较期</button>
+                </div>
+                <% if (ctx.app.config.is_debug) { %>
+                <div class="d-inline-block ml-3">
+                    <a id="exportExcel" class="btn btn-primary btn-sm" href="javascript: void(0)">导出清单汇总Excel</a>
+                </div>
+                <% } %>
+                <div class="d-inline-block ml-3">
+                    期数据来源：
+                    <div class="form-check form-check-inline">
+                        <input class="form-check-input" type="radio" id="radio_contract" value="contract" name="compare-data">
+                        <label class="form-check-label" for="radio_contract">合同</label>
+                    </div>
+                    <div class="form-check form-check-inline">
+                        <input class="form-check-input" type="radio" id="radio_qc" value="qc" name="compare-data">
+                        <label class="form-check-label" for="radio_qc">变更</label>
+                    </div>
+                    <div class="form-check form-check-inline">
+                        <input class="form-check-input" type="radio" id="radio_gather" value="gather" checked name="compare-data">
+                        <label class="form-check-label" for="radio_gather">完成</label>
+                    </div>
                 </div>
             </div>
         </div>
@@ -63,7 +59,7 @@
     <div class="content-wrap">
         <div class="c-header p-0"></div>
         <div class="c-body">
-            <div class="tab-content">
+            <div class="tab-content" id="compareType">
                 <div class="tab-pane" id="tz">
                     <div class="sjs-height-1" id="bills-spread">
                     </div>