index.html 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  6. <meta http-equiv="x-ua-compatible" content="ie=edge">
  7. <title>设计数量表管理平台</title>
  8. <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css">
  9. <link rel="stylesheet" href="css/font-awesome/font-awesome.min.css">
  10. <link rel="stylesheet" href="css/main.css">
  11. <!--zTree-->
  12. <link href="css/ztree/zTreeStyle.css" rel="stylesheet" type="text/css">
  13. </head>
  14. <body>
  15. <div class="sj-header">
  16. <div class="container p-0 py-3">
  17. <nav class="navbar navbar-dark p-0">
  18. <span class="navbar-brand mb-0"><h2 class="p-0">设计数量表管理平台</h2></span>
  19. <div class="ml-auto"><a href="" class="btn btn-sm btn-outline-light">登录</a></div>
  20. </nav>
  21. </div>
  22. </div>
  23. <div class="container">
  24. <div class="row">
  25. <div class="col-3 px-0 ">
  26. <div class="side-bar rounded auto-height">
  27. <ul class="list-unstyled rounded">
  28. <li class="py-3 px-3 active rounded"><div class="d-flex ">工程可行性研究阶段<span class="ml-auto"><i class="fas fa-angle-up"></i></span></div>
  29. <div class="w-100 ztree-item">
  30. <ul class="ztree" id="treeDemo2"></ul>
  31. </div>
  32. </li>
  33. <li class="d-flex py-3 px-3">初步设计阶段<span class="ml-auto"><i class="fas fa-angle-down"></i></span></li>
  34. <li class="d-flex py-3 px-3">施工图设计阶段<span class="ml-auto"><i class="fas fa-angle-down"></i></span></li>
  35. </ul>
  36. </div>
  37. </div>
  38. <div class="col-9 pr-0">
  39. <div class="comtent-item rounded auto-height" style="overflow: hidden">
  40. <div class="d-flex justify-content-between p-3 border-bottom">
  41. <h5>公路用地数量估算表 G-02-03-01-B</h5>
  42. <div class="ml-auto">
  43. <a href="" class="btn btn-sm btn-success"><i class="fas fa-download"></i> 下载</a>
  44. </div>
  45. </div>
  46. <div class="content-height">
  47. <img src="img/baobiao.png">
  48. </div>
  49. </div>
  50. </div>
  51. <div class="col-12">
  52. <p class="m-0 text-right text-light mt-1">主办单位:广东省交通运输工程造价事务中心<span class="px-2">|</span>技术支持:珠海纵横创新软件有限公司</p>
  53. </div>
  54. </div>
  55. </div>
  56. </body>
  57. <!-- JS. -->
  58. <script src="js/jquery/jquery.min.js"></script>
  59. <script src="js/bootstrap/bootstrap.bundle.js"></script>
  60. <script src="js/global.js"></script>
  61. <!-- zTree -->
  62. <script src="js/ztree/jquery.ztree.core.js" type="text/javascript">
  63. </script>
  64. <script src="js/ztree/jquery.ztree.excheck.js" type="text/javascript">
  65. </script>
  66. <script type="text/javascript">
  67. autoFlashHeight();
  68. </script>
  69. <script type="text/javascript">
  70. <!--
  71. var setting = {
  72. view: {
  73. selectedMulti: false
  74. },
  75. check: {
  76. enable: false
  77. },
  78. data: {
  79. simpleData: {
  80. enable: true
  81. }
  82. },
  83. callback: {
  84. onCheck: onCheck
  85. }
  86. };
  87. var zNodes = [{
  88. name: "第一篇 总体设计",
  89. open: true,
  90. children: [{
  91. name: "主要技术经济指标表",
  92. open: true,
  93. isParent: true
  94. }]
  95. },
  96. {
  97. name: "第二篇 路线",
  98. open: true,
  99. isParent: true
  100. }
  101. ];
  102. var clearFlag = false;
  103. function onCheck(e, treeId, treeNode) {
  104. count();
  105. if (clearFlag) {
  106. clearCheckedOldNodes();
  107. }
  108. }
  109. function clearCheckedOldNodes() {
  110. var zTree = $.fn.zTree.getZTreeObj("treeDemo3"),
  111. nodes = zTree.getChangeCheckedNodes();
  112. for (var i = 0, l = nodes.length; i < l; i++) {
  113. nodes[i].checkedOld = nodes[i].checked;
  114. }
  115. }
  116. function count() {
  117. var zTree = $.fn.zTree.getZTreeObj("treeDemo2"),
  118. checkCount = zTree.getCheckedNodes(true).length;
  119. $("#checkCount2").text(checkCount);
  120. }
  121. function createTree() {
  122. $.fn.zTree.init($("#treeDemo2"), setting, zNodes);
  123. count();
  124. }
  125. $(document).ready(function() {
  126. createTree();
  127. });
  128. </script>
  129. </html>