造价书 特征及内容，添加规则 修改为 侧开

css/main.css

@@ -309,6 +309,18 @@ a{
 .bottom-content .tab-content .ovf-hidden{
     overflow: hidden;
 }
+.tn-nav{
+  width:30px;
+  height: 100%;
+  border-left:1px solid #dee2e6 ;
+}
+.tn-nav > span{
+  width:20px;
+}
+.tn-nav:hover{
+  background:#f7f7f9;
+  cursor: pointer;
+}
 .form-signin {
     max-width: 500px;
     margin: 150px auto;

zaojiashu.html

@@ -740,7 +740,7 @@
                                 </div>
                                 <div class="tab-pane active" id="tenr" role="tabpanel">
                                   <div class="row">
-                                      <div class="col-4">
+                                      <div class="col">
                                         <div class="main-data-bottom">
                                             工作内容
                                         </div>
@@ -753,7 +753,8 @@
                                           <a href="" class="btn btn-sm" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="上移"><i class="fa fa-arrow-up" aria-hidden="true"></i></a>
                                         </div>
                                       </div>
-                                      <div class="col-4">
+                                      <!--打开添加规则后 col-6 修改为col-4 -->
+                                      <div class="col-6">
                                         <div class="main-data-bottom">
                                             项目特征
                                         </div>
@@ -766,9 +767,24 @@
                                           <a href="" class="btn btn-sm" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="上移"><i class="fa fa-arrow-up" aria-hidden="true"></i></a>
                                         </div>
                                       </div>
-                                      <div class="col-4">
+                                      <div class="col-auto">
+                                        <div class="tn-nav d-flex align-items-start flex-column" data-toggle="tooltip" data-placement="left" title="" data-original-title="打开排版规则">
+                                            <span class="mt-3 ml-2 text-primary">排版规则</span>
+                                            <i class="fa fa-arrow-left mt-auto mb-3 text-primary ml-2"></i>
+                                        </div>
+                                      </div>
+                                      <!-- <div class="col-4">
                                         <div class="main-data-bottom">
-                                          <div class=" container-fluid my-2">
+                                          <div class="container-fluid my-2">
+                                            <div class="mb-2 d-flex justify-content-between"><span>排版规则</span><a href="#"><i class="fa fa-arrow-right" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="收起排版规则"></i></a></div>
+                                            <div class="mb-2 row">
+                                             <div class="col-6">
+                                               <button class="btn btn-primary btn-sm">应用到选中清单</button>
+                                             </div>
+                                             <div class="col-6">
+                                               <button class="btn btn-primary btn-sm">应用到所有清单</button>
+                                             </div>
+                                            </div>
                                             <div class="mb-1 row">
                                              <label class="col-5 px-0 col-form-label text-right">添加位置：</label>
                                              <div class="col-7">
@@ -805,17 +821,9 @@
                                                <select class="form-control form-control-sm"><option>1</option></select>
                                              </div>
                                             </div>
-                                            <div class="mb-1 row">
-                                             <div class="col-6">
-                                               <button class="btn btn-primary btn-sm">应用到选中清单</button>
-                                             </div>
-                                             <div class="col-6">
-                                               <button class="btn btn-primary btn-sm">应用到所有清单</button>
-                                             </div>
-                                            </div>
                                           </div>
                                         </div>
-                                      </div>
+                                      </div> -->
                                   </div>
                                 </div>
                             </div>