期计量，增加报表

css/main.css

@@ -43,6 +43,9 @@ body {
 .sjs-height-1,.sjs-height-2{
   overflow: hidden;
 }
+.sjs-height-4{
+  overflow: auto;
+}
 .sjs-bottom{
   height:400px;
   overflow-y: auto;
@@ -466,3 +469,39 @@ body {
   height:400px;
   overflow: hidden
 }
+/*打印工具栏*/
+.print-toolsbar{
+  padding-bottom:5px
+}
+.print-toolsbar .panel {
+  display:inline-block;
+  vertical-align:top;
+  background:#f7f7f9
+}
+.print-toolsbar .panel .panel-foot{
+  text-align: center;
+  font-size: 12px
+}
+.print-list {
+  border-right:1px solid #ccc
+}
+.print-list .form-list {
+  overflow: auto
+}
+.print-list .list-tools{
+  height:50px;
+  padding:10px 0;
+  border-bottom:1px solid #f2f2f2
+}
+.pageContainer {
+  background: #ededed;
+  text-align: center
+}
+.pageContainer .page{
+  border:9px solid transparent;
+  display: inline-block;
+}
+.pageContainer .page img{
+  width:inherit;
+  height: inherit;
+}

jiliang-approval.html

@@ -106,7 +106,7 @@
     				<div class="panel-title fluid">
     					<div class="title-main d-flex justify-content-between">
                 <div>
-                  <div class="d-inline-block">
+                  <div class="d-inline-block mr-3">
                     <ul class="nav nav-pills m-0">
   										<li class="nav-item">
   											<a class="nav-link" href="jiliang-qi.html">返回</a>
@@ -114,19 +114,12 @@
   										<li class="nav-item">
   											<a class="nav-link active" href="jiliang-qi-detail.html">计量数据</a>
   										</li>
-                      <li class="nav-item"><a class="nav-link" href="jiliang-qi-detail2.html">报表</a></li>
   									</ul>
                   </div>
                   <div class="d-inline-block">
                     <div class="form-check-inline">
                       <label class="form-check-label">
                         <input class="form-check-input" type="checkbox">
-                        审批过程
-                      </label>
-                    </div>
-                    <div class="form-check-inline">
-                      <label class="form-check-label">
-                        <input class="form-check-input" type="checkbox">
                         变更令
                       </label>
                     </div>

jiliang-qi-detail.html

@@ -5,7 +5,7 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
     <meta http-equiv="x-ua-compatible" content="ie=edge">
-    <title>计量管理-计量支付</title>
+    <title>期计量-计量支付</title>
     <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css">
     <link rel="stylesheet" href="css/main.css">
     <link rel="stylesheet" href="css/font-awesome/font-awesome.min.css">
@@ -116,6 +116,7 @@
   										</li>
                       <li class="nav-item"><a class="nav-link" href="jiliang-qi-detail2.html">本期计量台帐</a></li>
                       <li class="nav-item"><a class="nav-link" href="jiliang-qi-detail3.html">合同支付</a></li>
+                      <li class="nav-item"><a class="nav-link" href="jiliang-qi-detail4.html">报表</a></li>
   									</ul>
                   </div>
                 </div>

jiliang-qi-detail2.html

@@ -5,7 +5,7 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
     <meta http-equiv="x-ua-compatible" content="ie=edge">
-    <title>计量管理-计量支付</title>
+    <title>期计量-计量支付</title>
     <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css">
     <link rel="stylesheet" href="css/main.css">
     <link rel="stylesheet" href="css/font-awesome/font-awesome.min.css">
@@ -98,7 +98,7 @@
           <li class="nav-item"><a href="jiliang-qi.html"title="期计量"><i class="fa fa-calendar-check-o"></i> 期计量</a></li>
           <li class="nav-item"><a href="biangeng.html"title="变更管理"><i class="fa fa-retweet"></i> 变更管理</a></li>
 					<li class="nav-item"><a href="hetong.html"title="合同管理"><i class="fa fa-handshake-o"></i> 合同管理</a></li>
-				</ul>
+        </ul>
 			</div>
 		</div>
     <div class="main-panel">
@@ -116,17 +116,23 @@
   										</li>
   										<li class="nav-item"><a class="nav-link active" href="jiliang-qi-detail2.html">本期计量台帐</a></li>
                       <li class="nav-item"><a class="nav-link" href="jiliang-qi-detail3.html">合同支付</a></li>
+                      <li class="nav-item"><a class="nav-link" href="jiliang-qi-detail4.html">报表</a></li>
+
                     </ul>
                   </div>
                 </div>
                 <div>
                   <a href="#sub-sp" data-toggle="modal" data-target="#sub-sp" class="btn btn-primary btn-sm pull-right">上报审批</a>
+                    <a href="#sub-sp2" data-toggle="modal" data-target="#sub-sp2" class="btn btn-primary btn-sm pull-right">重新上报</a>
                   <a href="#sp-list" data-toggle="modal" data-target="#sp-list" class="btn btn-outline-secondary btn-sm pull-right">审批中</a>
+                  <a href="#sp-list" data-toggle="modal" data-target="#sp-list" class="btn btn-outline-warning btn-sm pull-right text-muted">审批退回</a>
                   <!--审批-->
                   <a href="#sp-done" data-toggle="modal" data-target="#sp-done" class="btn btn-success btn-sm pull-right">审批通过</a>
-                  <a href="#sp-back" data-toggle="modal" data-target="#sp-back" class="btn btn-warning btn-sm pull-right">审批退回</a>                </div>
-    					</div>
-    				</div>
+                  <a href="#sp-back" data-toggle="modal" data-target="#sp-back" class="btn btn-warning btn-sm pull-right">审批退回</a>
+                  <a href="#" class="btn btn-outline-danger btn-sm pull-right text-truncate" style="max-width: 100px;">删除 第5期</a>
+                </div>
+      				</div>
+            </div>
     				<div class="content-wrap">
               <div class="c-header p-0"></div>
     					<div class="c-body">

jiliang-qi-detail3.html

@@ -5,7 +5,7 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
     <meta http-equiv="x-ua-compatible" content="ie=edge">
-    <title>计量管理-计量支付</title>
+    <title>期计量-计量支付</title>
     <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css">
     <link rel="stylesheet" href="css/main.css">
     <link rel="stylesheet" href="css/font-awesome/font-awesome.min.css">
@@ -97,7 +97,7 @@
           <li class="nav-item active"><a href="jiliang-qi.html"title="期计量"><i class="fa fa-calendar-check-o"></i> 期计量</a></li>
           <li class="nav-item"><a href="biangeng.html"title="变更管理"><i class="fa fa-retweet"></i> 变更管理</a></li>
 					<li class="nav-item"><a href="hetong.html"title="合同管理"><i class="fa fa-handshake-o"></i> 合同管理</a></li>
-				</ul>
+        </ul>
 			</div>
 		</div>
     <div class="main-panel">
@@ -115,17 +115,22 @@
   										</li>
   										<li class="nav-item"><a class="nav-link" href="jiliang-qi-detail2.html">本期计量台帐</a></li>
                       <li class="nav-item"><a class="nav-link active" href="jiliang-qi-detail3.html">合同支付</a></li>
+                      <li class="nav-item"><a class="nav-link" href="jiliang-qi-detail4.html">报表</a></li>
                     </ul>
                   </div>
                 </div>
                 <div>
                   <a href="#sub-sp" data-toggle="modal" data-target="#sub-sp" class="btn btn-primary btn-sm pull-right">上报审批</a>
+                    <a href="#sub-sp2" data-toggle="modal" data-target="#sub-sp2" class="btn btn-primary btn-sm pull-right">重新上报</a>
                   <a href="#sp-list" data-toggle="modal" data-target="#sp-list" class="btn btn-outline-secondary btn-sm pull-right">审批中</a>
+                  <a href="#sp-list" data-toggle="modal" data-target="#sp-list" class="btn btn-outline-warning btn-sm pull-right text-muted">审批退回</a>
                   <!--审批-->
                   <a href="#sp-done" data-toggle="modal" data-target="#sp-done" class="btn btn-success btn-sm pull-right">审批通过</a>
-                  <a href="#sp-back" data-toggle="modal" data-target="#sp-back" class="btn btn-warning btn-sm pull-right">审批退回</a>                </div>
-    					</div>
-    				</div>
+                  <a href="#sp-back" data-toggle="modal" data-target="#sp-back" class="btn btn-warning btn-sm pull-right">审批退回</a>
+                  <a href="#" class="btn btn-outline-danger btn-sm pull-right text-truncate" style="max-width: 100px;">删除 第5期</a>
+                </div>
+              </div>
+            </div>
     				<div class="content-wrap">
               <div class="c-header p-0"></div>
     					<div class="c-body">

jiliang-qi-detail4.html

@@ -0,0 +1,510 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta http-equiv="x-ua-compatible" content="ie=edge">
+    <title>期计量-计量支付</title>
+    <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css">
+    <link rel="stylesheet" href="css/main.css">
+    <link rel="stylesheet" href="css/font-awesome/font-awesome.min.css">
+    <script src=js/echarts/echarts.min.js></script>
+    <!--zTree-->
+  	<link rel="stylesheet" href="css/ztree/zTreeStyle.css" type="text/css">
+</head>
+<body>
+  <div class="header">
+		<h1 class="logo"><a>计量管理-纵横变更管理系统</a></h1>
+    <div class="poj-name">
+      <span class="name">项目A</span>
+      <div class="btn-group">
+        <a class=" btn" data-toggle="dropdown" >
+          <span class="fa fa-caret-down" data-toggle="tooltip" data-placement="bottom" title="切换项目"></span>
+        </a>
+        <div class="dropdown-menu">
+         <a href="#" class="dropdown-item">项目B</a>
+         <a href="#" class="dropdown-item">项目C</a>
+         <a href="#" class="dropdown-item">项目D</a>
+       </div>
+     </div><a href="settings-poj.html" class="btn" data-toggle="tooltip" data-placement="bottom" title="项目设置"><i class="fa fa-cogs"></i></a>
+    </div>
+    <div class="poj-name">
+      <span class="name">WWUJ-1</span>
+      <div class="btn-group">
+        <a class=" btn" data-toggle="dropdown" >
+          <span class="fa fa-caret-down" data-toggle="tooltip" data-placement="bottom" title="切换项目"></span>
+        </a>
+        <div class="dropdown-menu">
+         <a href="#" class="dropdown-item">WWUJ-2</a>
+         <a href="#" class="dropdown-item">WWUJ-3</a>
+         <a href="#" class="dropdown-item">WWUJ-4</a>
+       </div>
+     </div>
+    </div>
+    <div class="poj-name">
+      <span class="name">期计量</span>
+    </div>
+		<div class="header-box">
+			<div class="header-nav"></div>
+			<div class="header-user pull-right">
+				<div class="avatar btn-group">
+					<a class="dropdown-toggle" data-toggle="dropdown">
+						<span class="pic"><img src="img/avatar.png"></span>
+						<span>张三</span>
+						<span class="caret"></span>
+					</a>
+					<div class="dropdown-menu">
+					 <a href="account-info.html"  class="dropdown-item">账号资料</a>
+					 <a href="#"  class="dropdown-item">账号安全</a>
+					 <div class="dropdown-divider"></div>
+ 					 <a href="#"  class="dropdown-item">新手引导</a>
+					 <a href="#"  class="dropdown-item">帮助中心</a>
+					 <a href="#" class="dropdown-item">退出登录</a>
+				 </div>
+				</div>
+				<div class="msg">
+					<a>
+					<i class="fa fa-bell"></i><sup >0</sup>
+					</a>
+				</div>
+			</div>
+		</div>
+	</div>
+	<div class="main">
+		<div class="main-nav">
+			<div class="nav-top">
+				<ul class="nav nav-pills flex-column bg-nav">
+					<li class="nav-item"><a href="dashboard.html"title="代办事项"><i class="fa fa-dashboard"></i> 代办事项</a></li>
+					<li class="nav-item"><a href="biaoduan.html"title="标段管理"><i class="fa fa-list-ul"></i> 标段管理</a></li>
+					<li class="nav-item"><a href="javascript:void(0);"title="台帐管理"><i class="fa fa-list-alt"></i> 台帐管理 <i class="fa fa-angle-down pull-right menu-arrow"></i></a>
+            <ul class="sub-menu">
+              <li><a href="taizhang.html">台帐分解</a></li>
+            </ul>
+            <ul class="sub-menu">
+              <li><a href="taizhang-bg.html">台帐修订</a></li>
+            </ul>
+            <ul class="sub-menu">
+              <li><a href="taizhang-jl.html">计量台帐</a></li>
+            </ul>
+          </li>
+          <li class="nav-item"><a href="javascript:void(0);"title="计量管理"><i class="fa fa-calendar-check-o"></i> 中间计量  <i class="fa fa-angle-down pull-right menu-arrow"></i></a>
+            <ul class="sub-menu">
+              <li><a href="jiliang.html">计量编制</a></li>
+            </ul>
+            <ul class="sub-menu">
+              <li><a href="jiliang-list.html">计量审批</a></li>
+            </ul>
+          </li>
+          <li class="nav-item active"><a href="jiliang-qi.html"title="期计量"><i class="fa fa-calendar-check-o"></i> 期计量</a></li>
+          <li class="nav-item"><a href="biangeng.html"title="变更管理"><i class="fa fa-retweet"></i> 变更管理</a></li>
+					<li class="nav-item"><a href="hetong.html"title="合同管理"><i class="fa fa-handshake-o"></i> 合同管理</a></li>
+        </ul>
+			</div>
+		</div>
+    <div class="main-panel">
+    			<div class="panel-content">
+    				<div class="panel-title fluid">
+    					<div class="title-main d-flex justify-content-between">
+                <div>
+                  <div class="d-inline-block">
+                    <ul class="nav nav-pills m-0">
+  										<li class="nav-item">
+  											<a class="nav-link" href="jiliang-qi.html">返回</a>
+  										</li>
+  										<li class="nav-item">
+  											<a class="nav-link" href="jiliang-qi-detail.html">中间计量表</a>
+  										</li>
+  										<li class="nav-item"><a class="nav-link" href="jiliang-qi-detail2.html">本期计量台帐</a></li>
+                      <li class="nav-item"><a class="nav-link" href="jiliang-qi-detail3.html">合同支付</a></li>
+                      <li class="nav-item"><a class="nav-link active" href="jiliang-qi-detail4.html">报表</a></li>
+                    </ul>
+                  </div>
+                </div>
+                <div>
+                  <a href="#sub-sp" data-toggle="modal" data-target="#sub-sp" class="btn btn-primary btn-sm pull-right">上报审批</a>
+                    <a href="#sub-sp2" data-toggle="modal" data-target="#sub-sp2" class="btn btn-primary btn-sm pull-right">重新上报</a>
+                  <a href="#sp-list" data-toggle="modal" data-target="#sp-list" class="btn btn-outline-secondary btn-sm pull-right">审批中</a>
+                  <a href="#sp-list" data-toggle="modal" data-target="#sp-list" class="btn btn-outline-warning btn-sm pull-right text-muted">审批退回</a>
+                  <!--审批-->
+                  <a href="#sp-done" data-toggle="modal" data-target="#sp-done" class="btn btn-success btn-sm pull-right">审批通过</a>
+                  <a href="#sp-back" data-toggle="modal" data-target="#sp-back" class="btn btn-warning btn-sm pull-right">审批退回</a>
+                  <a href="#" class="btn btn-outline-danger btn-sm pull-right text-truncate" style="max-width: 100px;">删除 第5期</a>
+                </div>
+      				</div>
+            </div>
+    				<div class="content-wrap">
+              <div class="c-header p-0"></div>
+    					<div class="c-body">
+                <div class="row">
+                  <div class="col-2">
+                    <div class="sjs-height-1">
+                      <div class="text-center"><a href="#add-c" data-toggle="modal" data-target="#add-c" class=" btn btn-outline-primary btn-sm">添加定制报表</a></div>
+                      <ul id="treeDemo2" class="ztree"></ul>
+                    </div>
+                  </div>
+                  <div class="col-10">
+                    <div class="toolsbar-f d-flex justify-content-between">
+                      <div class="print-toolsbar">
+                        <div class="panel">
+                          <div class="panel-body">
+                            <button class="btn btn-secondary btn-sm" type="button">
+                              <i class="fa fa-print"></i><br>
+                              打印 <span id="checkCount" class="badge badge-light">5</span>
+                            </button>
+                            <button class="btn btn-secondary btn-sm" type="button" href="#export" data-toggle="modal" data-target="#export">
+                              <i class="fa fa-share-square-o"></i><br>
+                              导出 <span id="checkCount" class="badge badge-light">5</span>
+                            </button>
+                          </div>
+                        </div>
+                        <div class="panel">
+                            <div class="panel-body">
+                              <div class="btn-group" role="group" aria-label="Button group with nested dropdown">
+                                <div class="btn-group" role="group">
+                                  <button id="btnGroupDrop1" type="button" class="btn btn-secondary btn-sm dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                                    纵向
+                                  </button>
+                                  <div class="dropdown-menu" aria-labelledby="btnGroupDrop1">
+                                    <a class="dropdown-item" href="#">横向</a>
+                                  </div>
+                                </div>
+                                <div class="btn-group" role="group">
+                                  <button id="btnGroupDrop1" type="button" class="btn btn-secondary btn-sm dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                                    A4
+                                  </button>
+                                  <div class="dropdown-menu" aria-labelledby="btnGroupDrop1">
+                                    <a class="dropdown-item" href="#">A3</a>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div class="panel-foot text-muted">
+                              预览设置
+                            </div>
+                        </div>
+                        <div class="panel">
+                            <div class="panel-body">
+                              <div class="btn-group" role="group">
+                                <button type="button" class="btn btn-secondary btn-sm" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="缩小">-</button>
+                                <button class="btn btn-secondary btn-sm" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="重置默认大小">1000%</button>
+                                <button type="button" class="btn btn-secondary btn-sm" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="放大">+</button>
+                              </div>
+                            </div>
+                            <div class="panel-foot text-muted">
+                              缩放
+                            </div>
+                        </div>
+                        <div class="panel">
+                            <div class="panel-body">
+                              <div class="btn-group" role="group" aria-label="Button group with nested dropdown">
+                                <button type="button" class="btn btn-secondary btn-sm" data-toggle="modal" data-target="#paper"><i class="fa fa-file-o"></i> 纸张</button>
+                                <button type="button" class="btn btn-secondary btn-sm" data-toggle="modal" data-target="#format"><i class="fa fa-bold"></i> 格式</button>
+                                <button type="button" class="btn btn-secondary btn-sm" data-toggle="modal" data-target="#content"><i class="fa fa-file-text-o"></i> 内容</button>
+                              </div>
+                            </div>
+                            <div class="panel-foot text-muted">
+                              报表设置
+                            </div>
+                        </div>
+                        <div class="panel">
+                          <div class="panel-body">
+                            <div class="input-group input-group-sm">
+                              <div class="input-group-prepend">
+                                <button type="button" class="btn btn-secondary btn-sm" disabled="" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="上一页"><i class="fa fa-chevron-left"></i></button>
+                              </div>
+                              <input class="form-control" value="1/10" style="width:60px" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="输入页码按回车键，快速跳转">
+                              <div class="input-group-append">
+                                <button type="button" class="btn btn-secondary btn-sm" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="下一页"><i class="fa fa-chevron-right"></i></button>
+                              </div>
+                            </div>
+                          </div>
+                          <div class="panel-foot text-muted">
+                            翻页
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="sjs-height-4">
+                      <div class="print-view form-view">
+                      <div class="pageContainer">
+                        <div class="page">
+                          <img src="img/baobiao.png">
+                        </div>
+                      </div>
+                    </div>
+                    </div>
+                  </div>
+                </div>
+    					</div>
+    				</div>
+    			</div>
+    		</div>
+      </div>
+      <!--上报审批-->
+      <div class="modal fade" id="sub-sp" data-backdrop="static">
+          <div class="modal-dialog" role="document">
+              <div class="modal-content">
+                  <div class="modal-header">
+                      <h5 class="modal-title">上报审批</h5>
+                  </div>
+                  <div class="modal-body">
+                    <div class="form-group">
+                      <label>搜索审批人</label>
+                      <div class="input-group">
+                        <input class="form-control" placeholder="请输入姓名进行检索" type="text">
+                        <div class="input-group-append">
+                          <button class="btn btn-outline-secondary" type="button"><i class="fa fa-search"></i></button>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="card border-primary">
+                      <div class="card-body">
+                        <h5 class="card-title">
+                          <a href="#" class="btn btn-primary btn-sm pull-right">添加</a>张三
+                        </h5>
+                        <h6 class="card-subtitle mb-2 text-muted">监理</h6>
+                        <p class="card-text">XXXXX公司</p>
+                      </div>
+                    </div>
+                    <div class="card mt-3">
+                      <div class="card-header">
+                        审批流程
+                      </div>
+                      <ul class="list-group list-group-flush">
+                        <li class="list-group-item"><a href="" class="text-danger pull-right">移除</a>1 张三  <small class="text-muted">监理</small></li>
+                        <li class="list-group-item"><a href="" class="text-danger pull-right">移除</a>2 王五 <small class="text-muted">监理</small></li>
+                        <li class="list-group-item"><a href="" class="text-danger pull-right">移除</a>3 李四 <small class="text-muted">监理</small></li>
+                      </ul>
+                    </div>
+                  </div>
+                  <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
+                    <button type="button" class="btn btn-primary">确认上报</button>
+                  </div>
+              </div>
+          </div>
+      </div>
+      <!--审批流程/结果-->
+      <div class="modal fade" id="sp-list" data-backdrop="static">
+          <div class="modal-dialog" role="document">
+              <div class="modal-content">
+                  <div class="modal-header">
+                      <h5 class="modal-title">审批流程</h5>
+                  </div>
+                  <div class="modal-body">
+                    <div class="card mt-3">
+                      <ul class="list-group list-group-flush">
+                        <li class="list-group-item">
+                          <span class="text-success pull-right">审批通过</span>
+                           <h5 class="card-title">1 张三 <small class="text-muted">监理</small></h5>
+                           <p class="card-text">审批意见。2018-01-01</p>
+                        </li>
+                        <li class="list-group-item">
+                          <span class="text-warning pull-right">审批中</span>
+                           <h5 class="card-title">2 王五 <small class="text-muted">监理</small></h5>
+                           <p class="card-text"></p>
+                        </li>
+                        <li class="list-group-item">
+                           <h5 class="card-title">3 李四 <small class="text-muted">监理</small></h5>
+                        </li>
+                      </ul>
+                    </div>
+                  </div>
+                  <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
+                  </div>
+              </div>
+          </div>
+      </div>
+      <!--审批通过-->
+      <div class="modal fade" id="sp-done" data-backdrop="static">
+          <div class="modal-dialog" role="document">
+              <div class="modal-content">
+                  <div class="modal-header">
+                      <h5 class="modal-title">审批通过</h5>
+                  </div>
+                  <div class="modal-body">
+                    <div class="card mt-3">
+                      <ul class="list-group list-group-flush">
+                        <li class="list-group-item">
+                          <span class="text-success pull-right">审批通过</span>
+                           <h5 class="card-title">1 张三 <small class="text-muted">监理</small></h5>
+                           <p class="card-text">审批意见。2018-01-01</p>
+                        </li>
+                        <li class="list-group-item">
+                          <span class="text-warning pull-right">审批中</span>
+                           <h5 class="card-title">2 王五 <small class="text-muted">监理</small></h5>
+                           <div class="form-group">
+                             <label>审批意见<b class="text-danger">*</b></label>
+                             <textarea class="form-control" ></textarea>
+                           </div>
+                        </li>
+                        <li class="list-group-item">
+                           <h5 class="card-title">3 李四 <small class="text-muted">监理</small></h5>
+                        </li>
+                      </ul>
+                    </div>
+                  </div>
+                  <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
+                    <button type="button" class="btn btn-success" >确认通过</button>
+                  </div>
+              </div>
+          </div>
+      </div>
+      <!--审批退回-->
+      <div class="modal fade" id="sp-back" data-backdrop="static">
+          <div class="modal-dialog" role="document">
+              <div class="modal-content">
+                  <div class="modal-header">
+                      <h5 class="modal-title">审批退回</h5>
+                  </div>
+                  <div class="modal-body">
+                    <div class="card mt-3">
+                      <ul class="list-group list-group-flush">
+                        <li class="list-group-item">
+                          <span class="text-success pull-right">审批通过</span>
+                           <h5 class="card-title">1 张三 <small class="text-muted">监理</small></h5>
+                           <p class="card-text">审批意见。2018-01-01</p>
+                        </li>
+                        <li class="list-group-item">
+                          <span class="text-warning pull-right">审批中</span>
+                           <h5 class="card-title">2 王五 <small class="text-muted">监理</small></h5>
+                           <div class="form-group">
+                             <label>审批意见<b class="text-danger">*</b></label>
+                             <textarea class="form-control" ></textarea>
+                           </div>
+                           <div class="alert alert-warning">审批退回，将直接退回给上报人。</data-min-view>
+                        </li>
+                        <li class="list-group-item">
+                           <h5 class="card-title">3 李四 <small class="text-muted">监理</small></h5>
+                        </li>
+                      </ul>
+                    </div>
+                  </div>
+                  <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
+                    <button type="button" class="btn btn-warning" >确认退回</button>
+                  </div>
+              </div>
+          </div>
+      </div>
+      <!--添加定制报表-->
+      <div class="modal fade" id="add-c" data-backdrop="static">
+          <div class="modal-dialog" role="document">
+              <div class="modal-content">
+                  <div class="modal-header">
+                      <h5 class="modal-title">添加定制报表</h5>
+                  </div>
+                  <div class="modal-body">
+                    <div class="form-group">
+                      <label>输入提取码</label>
+                      <div class="input-group">
+                        <input class="form-control" placeholder="请输入6位提取码" type="text">
+                        <div class="input-group-append">
+                          <button class="btn btn-outline-secondary" type="button"><i class="fa fa-search"></i></button>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="card mt-3">
+                      <ul class="list-group list-group-flush">
+                        <li class="list-group-item">
+                           <h5 class="card-title text-danger">提取码不存在</h5>
+                        </li>
+                      </ul>
+                    </div>
+                    <div class="card mt-3">
+                      <ul class="list-group list-group-flush">
+                        <li class="list-group-item">
+                           <h5 class="card-title">XXX项目</h5>
+                           <p class="card-text">包含报表 14 张</p>
+                        </li>
+                      </ul>
+                    </div>
+                  </div>
+                  <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
+                    <!--有结果出现添加-->
+                    <button type="button" class="btn btn-primary" >确认添加</button>
+                  </div>
+              </div>
+          </div>
+      </div>
+    <!-- JS. -->
+    <script src="js/jquery/jquery-3.2.1.min.js"></script>
+    <script src="js/popper/popper.min.js"></script>
+    <script src="js/bootstrap/bootstrap.min.js"></script>
+    <script src="js/global.js"></script>
+    <script type="text/javascript">  autoFlashHeight();</script>
+    <!-- zTree -->
+    <script type="text/javascript" src="js/ztree/jquery.ztree.core.js"></script>
+    <script type="text/javascript" src="js/ztree/jquery.ztree.excheck.js"></script>
+    <script type="text/javascript">
+        		<!--
+        		var setting = {
+        			view: {
+        				selectedMulti: false
+        			},
+        			data: {
+        				simpleData: {
+        					enable: true
+        				}
+        			},
+        			callback: {
+        				onCheck: onCheck
+        			}
+        		};
+
+        		var zNodes =[
+        			{ id:1, pId:0, name:"通用报表", open:true},
+        			{ id:11, pId:1, name:"XXX表 1-1"},
+        			{ id:122, pId:11, name:"报表 1-2-2"},
+        			{ id:123, pId:11, name:"报表 1-2-3"},
+        			{ id:12, pId:1, name:"YYY表", open:true},
+        			{ id:124, pId:12, name:"报表 1-2-1"},
+        			{ id:125, pId:12, name:"报表 1-2-2"},
+        			{ id:126, pId:12, name:"报表 1-2-3"},
+        			{ id:2, pId:0, name:"定制报表", open:true},
+        			{ id:21, pId:2, name:"AA报表 2-1"},
+        			{ id:221, pId:21, name:"报表 2-2-1"},
+        			{ id:222, pId:21, name:"报表 2-2-2"},
+        			{ id:223, pId:21, name:"报表 2-2-3"},
+        			{ id:22, pId:2, name:"BB报表 2-2", open:true},
+        			{ id:224, pId:22, name:"报表 2-2-1"},
+        			{ id:225, pId:22, name:"报表 2-2-2"},
+        			{ id:226, pId:22, name:"报表 2-2-3"}
+        		];
+
+        		var clearFlag = false;
+        		function onCheck(e, treeId, treeNode) {
+        			count();
+        			if (clearFlag) {
+        				clearCheckedOldNodes();
+        			}
+        		}
+        		function clearCheckedOldNodes() {
+        			var zTree = $.fn.zTree.getZTreeObj("treeDemo2"),
+        			nodes = zTree.getChangeCheckedNodes();
+        			for (var i=0, l=nodes.length; i<l; i++) {
+        				nodes[i].checkedOld = nodes[i].checked;
+        			}
+        		}
+        		function count() {
+        			var zTree = $.fn.zTree.getZTreeObj("treeDemo2"),
+        			checkCount = zTree.getCheckedNodes(true).length;
+        			$("#checkCount2").text(checkCount);
+
+        		}
+        		function createTree() {
+        			$.fn.zTree.init($("#treeDemo2"), setting, zNodes);
+        			count();
+        		}
+        		$(document).ready(function(){
+        			createTree();
+        		});
+        		//-->
+        </script>
+    </body>
+
+</html>

jiliang.html

@@ -138,6 +138,7 @@
                   </div>
                   <div class="btn-group">
                     <a href="#add-qd" data-toggle="modal" data-target="#add-qd" class="btn btn-success btn-sm">添加计量清单</a>
+                    <a href="#add-qd2" data-toggle="modal" data-target="#add-qd2" class="btn btn-success btn-sm">添加计量清单2</a>
                   </div>
                 </div>
                 <div>
@@ -145,6 +146,7 @@
                   <a href="#sp-list" data-toggle="modal" data-target="#sp-list" class="btn btn-outline-success btn-sm pull-right">审批完成</a>
                   <a href="#sp-list" data-toggle="modal" data-target="#sp-list" class="btn btn-outline-secondary btn-sm pull-right">审批中</a>
                   <a href="#sp-list" data-toggle="modal" data-target="#sp-list" class="btn btn-outline-warning btn-sm pull-right text-muted">审批退回</a>
+                  <a href="#del" data-toggle="modal" data-target="#del" class="btn btn-outline-danger btn-sm pull-right">删除 WJQR1-201710</a>
                 </div>
               </div>
     				</div>
@@ -437,7 +439,7 @@
                     </div>
                     <div class="form-group">
                       <label>计量月份</label>
-                      <input data-view="months" data-min-view="months" class="datepicker-here form-control" placeholder="按时间筛选" type="text" data-date-format="yyyy MM " data-language="zh">
+                      <input  data-date-format="yyyy MM dd" data-language="zh" class="datepicker-here form-control" placeholder="按时间筛选" type="text">
                     </div>
                     <div class="form-group">
                       <label>计量期</label>
@@ -457,30 +459,64 @@
       </div>
       <!--弹出添加计量清单-->
       <div class="modal fade" id="add-qd" data-backdrop="static">
-          <div class="modal-dialog modal-lgx" role="document">
+          <div class="modal-dialog modal-lg" role="document">
               <div class="modal-content">
                   <div class="modal-header">
-                      <h5 class="modal-title">添加计量清单</h5>
+                      <h5 class="modal-title">选择计量范围</h5>
                   </div>
                   <div class="modal-body">
-                    <div class="row">
-                      <div class="col-3">
-                        <div class="modal-height-500">
-                          侧栏
+                      <div class="input-group mb-3">
+                        <input type="text" class="form-control" placeholder="输入项目节编号/名称 检索">
+                        <div class="input-group-append">
+                          <button class="btn btn-primary" type="button">检索</button>
                         </div>
                       </div>
-                      <div class="col-9">
-                        <div class="modal-height-500">
-                          <table class="table table-bordered">
-                            <tr><th>1</th><th>项目节编号</th><th>清单编号</th><th>名称</th><th>单位</th><th>单价</th><th>操作</th></tr>
-                          </table>
-                        </div>
+                      <!--检索结果-->
+                      <table class="table table-sm table-bordered">
+                        <legend class="h5 ">检索结果</legend>
+                        <tr><th width="200">项目节编号</th><th>项目节名称</th><th width="90">添加</th></tr>
+                        <tr><td>1-2-5</td><td>排水沟工程</td><td><a href="#">添加</a></td></tr>
+                      </table>
+                      <table class="table table-sm table-bordered">
+                        <legend class="h5 ">已添加项目节</legend>
+                        <tr><th width="200">项目节编号</th><th>项目节名称</th><th width="90">移除</th></tr>
+                        <tr><td>1-2-6-1</td><td>填方边坡防护与加固</td><td><a href="#" class="text-danger">移除</a></td></tr>
+                        <tr><td>1-2-6-2</td><td>高边坡防护与加固</td><td><a href="#" class="text-danger">移除</a></td></tr>
+                      </table>
+                  </div>
+                  <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
+                    <button type="button" class="btn btn-primary">选择计量清单</button>
+                  </div>
+              </div>
+          </div>
+      </div>
+      <!--弹出添加计量清单-->
+      <div class="modal fade" id="add-qd2" data-backdrop="static">
+          <div class="modal-dialog modal-lg" role="document">
+              <div class="modal-content">
+                  <div class="modal-header">
+                      <h5 class="modal-title">选择计量清单</h5>
+                  </div>
+                  <div class="modal-body">
+                    <div class="input-group mb-3">
+                      <input type="text" class="form-control" placeholder="输入清单编号/名称 检索">
+                      <div class="input-group-append">
+                        <button class="btn btn-primary" type="button">检索</button>
                       </div>
                     </div>
+                    <!--检索结果-->
+                    <table class="table table-sm table-bordered">
+                      <legend>检索结果</legend>
+                      <tr><th>清单编号</th><th>名称</th><th>单位</th><th>单价</th><th width="90">选择</th></tr>
+                      <tr><td>203-1-1</td><td><a href="#">挖土方</a></td><td>m3</td><td>7.54</td><td><input type="checkbox" checked> 已选择</td></tr>
+                      <tr><td colspan="5"><span>└</span> 1-2-5 排水沟工程</td></tr>
+                      <tr><td>203-1-1</td><td>挖土方</td><td>m3</td><td>7.54</td><td><input type="checkbox"></td></tr>
+                    </table>
                   </div>
                   <div class="modal-footer">
+                    <button type="button" class="btn btn-primary">选择计量范围</button>
                     <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
-                    <button type="button" class="btn btn-primary">添加</button>
                   </div>
               </div>
           </div>
@@ -541,13 +577,19 @@
   								<option>自增编号</option>
   							</select>
   						</div>
+              <!--文本-->
+              <div class="form-group">
+  					    <label>文本</label>
+  					    <input class="form-control" type="text" maxlength="10">
+  					  </div>
+              <!--自增编号-->
   						<div class="form-group">
   					    <label>自动编号位数</label>
   					    <input min="3" class="form-control" step="1" max="6" value="3" type="number">
   					  </div>
   						<div class="form-group">
   					    <label>起始编号</label>
-  					    <input class="form-control" value="001" type="text">
+  					    <input class="form-control" value="001" type="text" maxlength="6">
   					  </div>
   						<button class="btn btn-primary">添加组件</button>
   		      </div>
@@ -615,24 +657,27 @@
                             <option>自增编号</option>
                           </select>
                         </div>
+                        <!--文本-->
                         <div class="form-group">
-                          <label>自动编号位数</label>
-                          <input min="3" class="form-control" step="1" max="6" value="3" type="number">
-                        </div>
-                        <div class="form-group">
-                          <label>起始编号</label>
-                          <input class="form-control" value="001" type="text">
-                        </div>
-                        <button class="btn btn-primary">添加组件</button>
+            					    <label>文本</label>
+            					    <input class="form-control" type="text" maxlength="10">
+            					  </div>
+                        <!--自增编号-->
+            						<div class="form-group">
+            					    <label>自动编号位数</label>
+            					    <input min="3" class="form-control" step="1" max="6" value="3" type="number">
+            					  </div>
+            						<div class="form-group">
+            					    <label>起始编号</label>
+            					    <input class="form-control" value="001" type="text" maxlength="6">
+            					  </div>
+            						<button class="btn btn-primary">添加组件</button>
                       </div>
                     </div>
                   </div>
                   <div class="modal-footer d-flex justify-content-between">
-                    <button type="button" class="btn btn-outline-danger text-truncate" style="max-width: 200px;" title="删除 WJQR1-201710">删除 WJQR1-201710</button>
-                    <div>
                       <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
                       <button type="button" class="btn btn-primary">确定</button>
-                    </div>
                   </div>
               </div>
           </div>
@@ -744,6 +789,20 @@
               </div>
           </div>
       </div>
+      <!--删除-->
+      <div class="modal fade" id="del" data-backdrop="static">
+          <div class="modal-dialog" role="document">
+              <div class="modal-content">
+                  <div class="modal-body">
+                    <h5>确认删除 WJQR1-201710 ？</h5>
+                  </div>
+                  <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
+                    <button type="button" class="btn btn-danger" >确认删除</button>
+                  </div>
+              </div>
+          </div>
+      </div>
     <!-- JS. -->
     <script src="js/jquery/jquery-3.2.1.min.js"></script>
     <script src="js/popper/popper.min.js"></script>

js/datepicker/datepicker.zh.js

@@ -9,4 +9,4 @@
     dateFormat: 'yyyy-mm-dd',
     timeFormat: 'hh:ii',
     firstDay: 0
-}; })(jQuery);
+}; })(jQuery);

js/global.js

@@ -3,9 +3,11 @@ function autoFlashHeight(){
     var cHeader = $(".c-header").height();
     var sBar = $(".sjs-bar").height();
     var sBarz = $(".side-bar").height();
+    var pBarz = $(".toolsbar-f").height();
     $(".sjs-height-1").height($(window).height()-cHeader-160);
     $(".sjs-height-2").height($(window).height()-cHeader-sBarz-160);
     $(".sjs-height-3").height($(window).height()-cHeader-sBar-560);
+    $(".sjs-height-4").height($(window).height()-cHeader-pBarz-160);
 };
 $(window).resize(autoFlashHeight);
 /*全局自适应高度结束*/