hetong-list.html 37 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619
  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/main.css">
  10. <link rel="stylesheet" href="css/font-awesome/all.min.css">
  11. <link href="css/datepicker/datepicker.min.css" rel="stylesheet" type="text/css">
  12. <script src=js/echarts/echarts.min.js></script>
  13. <link rel="stylesheet" href="css/spreadjs/sheets/gc.spread.sheets.excelsmartcost.css">
  14. <!--zTree-->
  15. <link rel="stylesheet" href="css/ztree/zTreeStyle.css" type="text/css">
  16. </head>
  17. <body>
  18. <div class="main">
  19. <div class="main-nav d-flex align-items-start flex-column">
  20. <div class="logo"><img src="img/logo.png"></div>
  21. <div class="nav-top">
  22. <ul class="nav nav-pills nav-stacked bg-nav">
  23. <li><a href="dashboard.html" data-toggle="tooltip" data-placement="right" title="" data-original-title="代办事项"><i class="fas fa-chalkboard"></i><span>待办</span></a></li>
  24. <li class="active"><a href="hetong.html" data-toggle="tooltip" data-placement="right" title="" data-original-title="合同管理"><i class="fas fa-book-open"></i><span>合同管理</span></a></li>
  25. <li class=""><a href="anquan.html" data-toggle="tooltip" data-placement="right" title="" data-original-title="安全巡检"><i class="fas fa-users-cog"></i><span>安全巡检</span></a></li>
  26. <li class=""><a href="zhiliang.html" data-toggle="tooltip" data-placement="right" title="" data-original-title="质量巡检"><i class="fas fa-toolbox"></i><span>质量巡检</span></a></li>
  27. </ul>
  28. </div>
  29. <div class="nav-bottom mt-auto">
  30. <ul class="nav nav-pills nav-stacked bg-nav">
  31. <li><a href="settings-poj.html" data-toggle="tooltip" data-placement="right" title="" data-original-title="项目设置"><i class="fa fa-cogs"></i><span>项目设置</span></a></li>
  32. </ul>
  33. <div class="dropup my-1 ml-1">
  34. <a href="" class="btn btn-sm btn-light" data-toggle="dropdown" aria-haspopup="false" aria-expanded="false">
  35. 张三
  36. </a>
  37. <div class="dropdown-menu">
  38. <a href="account-info.html" class="dropdown-item">账号资料</a>
  39. <a href="#" class="dropdown-item">账号安全</a>
  40. <div class="dropdown-divider"></div>
  41. <a href="#" class="dropdown-item">帮助中心</a>
  42. <a href="#" class="dropdown-item">退出登录</a>
  43. </div>
  44. </div>
  45. </div>
  46. </div>
  47. <div class="main-panel">
  48. <div class="panel-sidebar">
  49. <div class="sidebar-title" data-toggle="tooltip" data-placement="right" data-original-title="中交第一公路工程局有限公司国道311线满别公路施工一分部">中交第一公路工程局有限公司国道...</div>
  50. <div class="scrollbar-auto">
  51. <div class="nav-box">
  52. <ul class="nav-list list-unstyled">
  53. <li><a href="hetong-panel.html"><i class="fas fa-chart-pie"></i> <span>合同概况</span></a></li>
  54. </ul>
  55. </div>
  56. <div class="nav-box">
  57. <ul class="nav-list list-unstyled">
  58. <li class="active"><a href="hetong-list.html"><span>收入合同 </span></a></li>
  59. </ul>
  60. <ul class="nav-list list-unstyled">
  61. <li class=""><a href="hetong-list2.html"><span>支出合同</span></a></li>
  62. </ul>
  63. </div>
  64. <div class="side-fold"><a href="#" data-toggle="tooltip" data-placement="top" data-original-title="折叠侧栏"><i class="fa fa-sign-out fa-flip-horizontal"></i></a></div>
  65. </div>
  66. </div>
  67. <div class="panel-content">
  68. <div class="panel-title">
  69. <div class="title-main d-flex justify-content-between">
  70. <!--工具-->
  71. <div class="d-inline-block">
  72. 维护项目节:
  73. <a href="" class="btn btn-sm btn-light text-primary" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="添加子项"><i class="fa fa-plus" aria-hidden="true"></i></a>
  74. <a href="" class="btn btn-sm btn-light text-primary" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="删除"><i class="fa fa-times" aria-hidden="true"></i></a>
  75. <a href="" class="btn btn-sm btn-light text-primary disabled" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="升级"><i class="fa fa-arrow-left" aria-hidden="true"></i></a>
  76. <a href="" class="btn btn-sm btn-light text-primary disabled" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="降级"><i class="fa fa-arrow-right" aria-hidden="true"></i></a>
  77. <a href="" class="btn btn-sm btn-light text-primary" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="下移"><i class="fa fa-arrow-down" aria-hidden="true"></i></a>
  78. <a href="" class="btn btn-sm btn-light text-primary" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="上移"><i class="fa fa-arrow-up" aria-hidden="true"></i></a>
  79. </div>
  80. <div>
  81. <a href="#ht-setting" data-toggle="modal" data-target="#ht-setting" class="btn btn-sm btn-outline-primary pull-right"><i class="fas fa-cog"></i> 设置</a>
  82. <a href="#add-ht" data-toggle="modal" data-target="#add-ht" class="btn btn-sm btn-primary pull-right">新建收入合同</a>
  83. </div>
  84. </div>
  85. </div>
  86. <div class="content-wrap">
  87. <div class="c-header p-0 col-12"></div>
  88. <div class="c-body">
  89. <div class="sjs-height-1">
  90. <table class="table table-bordered">
  91. <thead>
  92. <tr><th width="70">序号</th><th width="250">项目内容</th><th>合同名称</th><th>合同编号</th><th>合同金额</th><th>回款金额</th><th>状态</th></tr>
  93. </thead>
  94. <tr><td><span class="mr-1" title="收起"><i class="fal fa-minus-square"></i></span>1</td><td>第一部分 建筑安装工程费</td><td></td><td></td><td></td><td></td><td></td></tr>
  95. <tr><td class="pl-2">1.1</td><td>劳务</td><td></td><td></td><td></td><td></td><td></td></tr>
  96. <tr><td class="pl-2">1.2</td><td>材料</td><td></td><td></td><td class="text-right">140472827.00</td><td class="text-right">74852127.07</td><td></td></tr>
  97. <tr><td class="pl-3">1.2.1</td><td>钢筋、工字钢、型钢、角钢、钢板</td><td>台州湾大桥及接线工程TS15标钢筋及型钢供应合同</td><td>CD03-CL-2015-117</td><td class="text-right">62851000.00</td><td class="text-right">0.00</td><td><i class="fas fa-circle text-warning"></i> 履行中</td></tr>
  98. <tr><td class="pl-3">1.2.2</td><td>碎石</td><td>台州湾大桥及接线工程TS15标碎石供应合同</td><td>CD03-CL-2015-118</td><td class="text-right">6557000.00</td><td class="text-right">3787300.07</td><td><i class="fas fa-circle text-warning"></i> 履行中</td></tr>
  99. <tr><td class="pl-3">1.2.3</td><td>水泥</td><td>台州湾大桥及接线工程TS15标水泥供应合同</td><td>CD03-CL-2015-119</td><td class="text-right">43064827.00</td><td class="text-right">43064827.00</td><td><i class="fas fa-circle text-secondary"></i> 待关闭</td></tr>
  100. <tr><td class="pl-3">1.2.3</td><td>预应力管桩</td><td>台州湾大桥及接线工程TS15标预应力管桩供应合同</td><td>CD03-CL-2015-120</td><td class="text-right">28000000.00</td><td class="text-right">28000000.00</td><td><i class="fas fa-circle text-success"></i> 正常关闭</td></tr>
  101. <tr><td class="pl-2">1.3</td><td>机械</td><td></td><td></td><td></td><td></td><td></td></tr>
  102. <tr><td class="pl-2">1.4</td><td>临时工程</td><td></td><td></td><td></td><td></td><td></td></tr>
  103. <tr><td class="pl-2">1.5</td><td>施工测量、检测及试验</td><td></td><td></td><td></td><td></td><td></td></tr>
  104. <tr><td class="pl-2">1.6</td><td>其他直接费</td><td></td><td></td><td></td><td></td><td></td></tr>
  105. <tr><td class="pl-2">1.7</td><td>专项费用</td><td></td><td></td><td></td><td></td><td></td></tr>
  106. <tr><td class="pl-2">1.8</td><td>施工场地建设</td><td></td><td></td><td></td><td></td><td></td></tr>
  107. <tr><td class="pl-2">1.9</td><td>安全生产</td><td></td><td></td><td></td><td></td><td></td></tr>
  108. <tr><td>2</td><td>第二部分 土地使用及拆迁补偿费</td><td></td><td></td><td></td><td></td><td></td></tr>
  109. </table>
  110. </div>
  111. <div class="bcontent-wrap">
  112. <div class="bc-bar mb-1">
  113. <ul class="nav nav-tabs">
  114. <li class="nav-item">
  115. <a class="nav-link active" data-toggle="tab" href="#ht-detail" role="tab">合同详情</a>
  116. </li>
  117. <li class="nav-item">
  118. <a class="nav-link" data-toggle="tab" href="#ht-huikuan" role="tab">合同回款</a>
  119. </li>
  120. <li class="nav-item">
  121. <a class="nav-link " data-toggle="tab" href="#ht-fujian" role="tab">合同文件</a>
  122. </li>
  123. <li class="nav-item ml-auto">
  124. <div class="mr-3">
  125. <!--合同详情操作-->
  126. <div class="d-inline-block">
  127. <a href="#close" data-toggle="modal" data-target="#close" class="btn btn-sm btn-success">关闭合同</a>
  128. <a href="#edit" data-toggle="modal" data-target="#edit" class="btn btn-sm btn-primary">编辑合同</a>
  129. </div>
  130. <!--合同回款操作-->
  131. <!-- <div class="d-inline-block">
  132. <a href="#receivables" data-toggle="modal" data-target="#receivables" class="btn btn-sm btn-primary">添加回款</a>
  133. </div> -->
  134. <!--合同文件操作-->
  135. <!-- <div class="d-inline-block">
  136. <a href="#upload-file" data-toggle="modal" data-target="#upload-file" class="btn btn-sm btn-primary">上传文件</a>
  137. </div> -->
  138. </div>
  139. </li>
  140. </ul>
  141. </div>
  142. <div class="tab-content">
  143. <div class="tab-pane active" id="ht-detail">
  144. <div class="sp-wrap col-8" >
  145. <table class="table table-bordered">
  146. <tr><th width="10%">项目内容</th><td width="40%">1.2.2 碎石</td><th width="10%">合同名称</th><td width="40%">台州湾大桥及接线工程TS15标碎石供应合同</td></tr>
  147. <tr><th>合同编号</th><td>CD03-CL-2015-118</td><th>状态</th><td><i class="fas fa-circle text-warning"></i> 履行中</td></tr>
  148. <tr><th>合同金额</th><td>6,557,000.00 </td><th>创建时间</th><td>2020-08-02 14:23 </td></tr>
  149. <tr><th>回款金额</th><td>3,787,300.07</td><th>未回款金额</th><td>2,769,700.00</td></tr>
  150. <tr><th>回款进度</th><td colspan="3"><div class="progress">
  151. <div class="progress-bar bg-success" style="width: 57.7%;" data-placement="bottom" data-toggle="tooltip" data-original-title="已回款:¥3,787,300.07">57.7%</div>
  152. <div class="progress-bar bg-gray" style="width:42.3%;" data-placement="bottom" data-toggle="tooltip" data-original-title="未回款:¥2,769,700.00">42.3%</div>
  153. </div></td></tr>
  154. <tr><th>甲方</th><td></td><th>甲方签约人</th><td></td></tr>
  155. <tr><th>乙方</th><td></td><th>乙方签约人</th><td></td></tr>
  156. <tr><th>签约日期</th><td></td><th></th><td></td></tr>
  157. <tr><th>备注</th><td colspan="3"></td></tr>
  158. </table>
  159. </div>
  160. </div>
  161. <div class="tab-pane " id="ht-huikuan">
  162. <div class="sp-wrap" >
  163. <table class="table table-bordered">
  164. <thead>
  165. <tr><th></th><th>回款日期</th><th>回款金额</th><th>回款方式</th><th>创建人</th><th>创建时间</th><th>备注</th><th>附件</th><th>操作</th></tr>
  166. </thead>
  167. <tbody>
  168. <tr><td>1</td><td>2020-08-01</td><td class="text-right">10,000.00</td><td>支票</td><td>张三</td><td>2020-08-01</td><td>备注内容</td><td><a class="btn btn-sm" href="#file" data-toggle="modal" data-target="#file"><i class="fa fa-paperclip "></i> 3</a></td><td><a href="">编辑</a> <a href="" class="text-danger">删除</a></td></tr>
  169. </tbody>
  170. </table>
  171. </div>
  172. </div>
  173. <div class="tab-pane" id="ht-fujian">
  174. <div class="sp-wrap" >
  175. <table class="table table-bordered">
  176. <thead>
  177. <tr><th></th><th>名称</th><th>上传者</th><th>上传时间</th><th>操作</th></tr>
  178. </thead>
  179. <tr><td>1</td><td><a href="#" target="_blank">XXX合同.doc</a></td><td>张三</td><td>2020-09-01</td><td><a href="#">下载</a> <a href="#" class="text-danger">删除</a></td></tr>
  180. </table>
  181. </div>
  182. </div>
  183. </div>
  184. </div>
  185. </div>
  186. </div>
  187. </div>
  188. </div>
  189. </div>
  190. <!--关闭合同-->
  191. <div class="modal fade" id="close" data-backdrop="static">
  192. <div class="modal-dialog" role="document">
  193. <div class="modal-content">
  194. <div class="modal-header">
  195. <h5 class="modal-title">关闭合同</h5>
  196. </div>
  197. <div class="modal-body">
  198. 关闭后,合同将锁定,无法进行编辑、上传文件等操作。
  199. </div>
  200. <div class="modal-footer">
  201. <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">关闭</button>
  202. <button type="button" class="btn btn-sm btn-success" >确定关闭</button>
  203. </div>
  204. </div>
  205. </div>
  206. </div>
  207. <!--编辑合同-->
  208. <div class="modal fade" id="edit" data-backdrop="static">
  209. <div class="modal-dialog" role="document">
  210. <div class="modal-content">
  211. <div class="modal-header">
  212. <h5 class="modal-title">编辑合同</h5>
  213. </div>
  214. <div class="modal-body">
  215. <div class="modal-height-500" style="overflow-y: auto">
  216. <div class="form-group">
  217. <label>合同项目</label>
  218. <select class="form-control form-control-sm">
  219. <optgroup label="1 第一部分 建筑安装工程费">
  220. <option>1.1 劳务</option>
  221. <option>1.2 材料</option>
  222. <option>1.3 机械</option>
  223. <option>1.4 临时工程</option>
  224. <option>1.5 施工测量、检测及试验</option>
  225. <option>1.6 其他直接费</option>
  226. <option>1.7 专项费用</option>
  227. <option>1.8 施工场地建设</option>
  228. <option>1.9 安全生产</option>
  229. </optgroup>
  230. <optgroup label="2 第二部分 土地使用及拆迁补偿费">
  231. <option>2.1 ...</option>
  232. <option>2.2 ...</option>
  233. <option>2.3 ...</option>
  234. </optgroup>
  235. </select>
  236. </div>
  237. <div class="form-group">
  238. <label>序号<b class="text-danger">*</b></label>
  239. <input class="form-control form-control-sm nospin" type="text" value=" 1.2.2">
  240. </div>
  241. <div class="form-group">
  242. <label>项目内容<b class="text-danger">*</b></label>
  243. <input class="form-control form-control-sm nospin" type="text" value="碎石">
  244. </div>
  245. <div class="form-group">
  246. <label>合同名称<b class="text-danger">*</b></label>
  247. <input class="form-control form-control-sm nospin" type="text" value="台州湾大桥及接线工程TS15标碎石供应合同">
  248. </div>
  249. <div class="form-group">
  250. <label>合同金额<b class="text-danger">*</b></label>
  251. <input class="form-control form-control-sm nospin" type="number" min="1" value=" 6,557,000.00 ">
  252. </div>
  253. <div class="form-group">
  254. <label>甲方<b class="text-danger">*</b></label>
  255. <input class="form-control form-control-sm nospin" type="text" value="">
  256. </div>
  257. <div class="form-group">
  258. <label>甲方签约人<b class="text-danger">*</b></label>
  259. <input class="form-control form-control-sm nospin" type="text" value="">
  260. </div>
  261. <div class="form-group">
  262. <label>乙方<b class="text-danger">*</b></label>
  263. <input class="form-control form-control-sm nospin" type="text" value="">
  264. </div>
  265. <div class="form-group">
  266. <label>乙方签约人<b class="text-danger">*</b></label>
  267. <input class="form-control form-control-sm nospin" type="text" value="">
  268. </div>
  269. <div class="form-group">
  270. <label>合同签约日期<b class="text-danger">*</b></label>
  271. <input class="datepicker-here form-control form-control-sm" placeholder="点击选择日期" data-view="days" data-min-view="days" data-date-format="yyyy-MM-DD" data-language="zh" type="text">
  272. </div>
  273. <div class="form-group">
  274. <label>备注</label>
  275. <textarea class="form-control form-control-sm"></textarea>
  276. </div>
  277. </div>
  278. </div>
  279. <div class="modal-footer">
  280. <button type="button" class="btn btn-sm btn-outline-danger mr-5" href="#del-ht" data-toggle="modal" data-target="#del-ht" data-dismiss="modal">删除合同</button>
  281. <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">关闭</button>
  282. <button type="button" class="btn btn-sm btn-primary" >确定</button>
  283. </div>
  284. </div>
  285. </div>
  286. </div>
  287. <!--删除合同-->
  288. <div class="modal fade" id="del-ht" data-backdrop="static">
  289. <div class="modal-dialog" role="document">
  290. <div class="modal-content">
  291. <div class="modal-header">
  292. <h5 class="modal-title">删除合同</h5>
  293. </div>
  294. <div class="modal-body">
  295. <p class="mb-2">删除后,数据无法恢复,请谨慎操作。</p>
  296. <p class="mb-2">请在下方文本框输入文本「<span class="text-danger">确认删除本合同</span>」,以此确认删除操作。</p>
  297. <p class="mb-2"><input type="text" class="form-control form-control-sm" placeholder="输入文本,确认删除"></p>
  298. </div>
  299. <div class="modal-footer">
  300. <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">关闭</button>
  301. <button type="button" class="btn btn-sm btn-danger" >确定删除</button>
  302. </div>
  303. </div>
  304. </div>
  305. </div>
  306. <!--添加回款-->
  307. <div class="modal fade" id="receivables" data-backdrop="static">
  308. <div class="modal-dialog" role="document">
  309. <div class="modal-content">
  310. <div class="modal-header">
  311. <h5 class="modal-title">添加回款</h5>
  312. </div>
  313. <div class="modal-body">
  314. <div class="form-group">
  315. <label>回款日期<b class="text-danger">*</b></label>
  316. <input class="datepicker-here form-control form-control-sm" placeholder="点击选择日期" data-view="days" data-min-view="days" data-date-format="yyyy-MM-DD" data-language="zh" type="text">
  317. </div>
  318. <div class="form-group">
  319. <label>回款金额<b class="text-danger">*</b></label>
  320. <input class="form-control form-control-sm nospin" type="number" min="1" placeholder="元">
  321. </div>
  322. <div class="form-group">
  323. <label>回款方式<b class="text-danger">*</b></label>
  324. <select class="form-control form-control-sm" >
  325. <option>支票</option>
  326. <option>现金</option>
  327. <option>网上转账</option>
  328. <option>电汇</option>
  329. <option>邮政汇款</option>
  330. <option>支付宝</option>
  331. <option>微信支付</option>
  332. <option>其他</option>
  333. </select>
  334. </div>
  335. <div class="form-group">
  336. <label>备注</label>
  337. <textarea class="form-control form-control-sm"></textarea>
  338. </div>
  339. </div>
  340. <div class="modal-footer">
  341. <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">关闭</button>
  342. <button type="button" class="btn btn-sm btn-primary" >确定</button>
  343. </div>
  344. </div>
  345. </div>
  346. </div>
  347. <!--上传文件-->
  348. <div class="modal fade" id="upload-file" data-backdrop="static">
  349. <div class="modal-dialog" role="document">
  350. <div class="modal-content">
  351. <div class="modal-header">
  352. <h5 class="modal-title">上传文件</h5>
  353. </div>
  354. <div class="modal-body">
  355. <div class="form-group">
  356. <label for="formGroupExampleInput">大小限制:30MB,支持<span data-toggle="tooltip" data-placement="bottom" title="doc,docx,xls,xlsx,ppt,pptx,pdf">office等文档格式</span>、<span data-toggle="tooltip" data-placement="bottom" title="jpg,png,bmp">图片格式</span>、<span data-toggle="tooltip" data-placement="bottom" title="rar,zip">压缩包格式</span></label>
  357. <input type="file" class="form-control">
  358. </div>
  359. </div>
  360. <div class="modal-footer">
  361. <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">关闭</button>
  362. <button type="button" class="btn btn-sm btn-primary" >确定</button>
  363. </div>
  364. </div>
  365. </div>
  366. </div>
  367. <!--附件-->
  368. <div class="modal fade" id="file" data-backdrop="static">
  369. <div class="modal-dialog" role="document">
  370. <div class="modal-content">
  371. <div class="modal-header">
  372. <h5 class="modal-title">附件</h5>
  373. </div>
  374. <div class="modal-body">
  375. <div class="form-group">
  376. <label for="formGroupExampleInput">大小限制:30MB,支持<span data-toggle="tooltip" data-placement="bottom" title="doc,docx,xls,xlsx,ppt,pptx,pdf">office等文档格式</span>、<span data-toggle="tooltip" data-placement="bottom" title="jpg,png,bmp">图片格式</span>、<span data-toggle="tooltip" data-placement="bottom" title="rar,zip">压缩包格式</span></label>
  377. <input type="file" class="form-control">
  378. </div>
  379. <div class="modal-height-500">
  380. <table class="table table-sm table-bordered">
  381. <thead>
  382. <tr><th>文件名</th><th>上传人</th><th>上传时间</th><th>操作</th></tr>
  383. </thead>
  384. <tr><td><a href="#" target="_blank">XXXX.jpg</a></td><td>张三</td><td>2018-01-01</td><td><a href="#" target="_blank">下载</a> <a class="text-danger" href="#" target="_blank" title="删除"><i class="fa fa-remove "></i></a></td></tr>
  385. <tr><td><a href="#" target="_blank">YYYY.jpg</a></td><td>李四</td><td>2018-01-01</td><td><a href="#" target="_blank">下载</a></td></tr>
  386. </table>
  387. </div>
  388. </div>
  389. <div class="modal-footer">
  390. <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">关闭</button>
  391. <button type="button" class="btn btn-sm btn-primary" >确定</button>
  392. </div>
  393. </div>
  394. </div>
  395. </div>
  396. <!--设置-->
  397. <div class="modal fade" id="ht-setting" data-backdrop="static">
  398. <div class="modal-dialog" role="document">
  399. <div class="modal-content">
  400. <div class="modal-header">
  401. <h5 class="modal-title">合同设置</h5>
  402. </div>
  403. <div class="modal-body">
  404. <ul class="nav nav-tabs mb-3" role="tablist">
  405. <li class="nav-item">
  406. <a class="nav-link active" data-toggle="tab" href="#bianhao" role="tab" aria-controls="home" aria-selected="true">合同编号规则</a>
  407. </li>
  408. </ul>
  409. <div class="tab-content">
  410. <div class="tab-pane active" id="bianhao">
  411. <h5>当前规则:WWUJ-1-201803-001</h5>
  412. <h5>
  413. <span class="badge badge-light" title="标段名">WWUJ-1 <a href="#" class="text-danger" title="移除"><i class="fas fa-times"></i></a></span>
  414. <span class="badge badge-light" title="文本">-<a href="#" class="text-danger" title="移除"><i class="fas fa-times"></i></a></span>
  415. <span class="badge badge-light" title="当前年月">201803 <a href="#" class="text-danger" title="移除"><i class="fas fa-times"></i></a></span>
  416. <span class="badge badge-light" title="自动编号">0000 <a href="#" class="text-danger" title="移除"><i class="fas fa-times"></i></a></span>
  417. </h5>
  418. <h5 class="my-3">添加新规则组件</h5>
  419. <div class="form-group">
  420. <select class="form-control form-control-sm">
  421. <option>请选择组件</option>
  422. <option>标段名</option>
  423. <option>文本</option>
  424. <option>当前年月</option>
  425. <option>自增编号</option>
  426. </select>
  427. </div>
  428. <!-- <div class="form-group">
  429. <select class="form-control form-control-sm">
  430. <option>请选择</option>
  431. <option>-</option>
  432. <option>_</option>
  433. <option>无</option>
  434. </select>
  435. </div> -->
  436. <div class="form-group">
  437. <label>自动编号位数</label>
  438. <input min="3" class="form-control form-control-sm" step="1" max="6" value="3" type="number">
  439. </div>
  440. <div class="form-group">
  441. <label>起始编号</label>
  442. <input class="form-control form-control-sm" value="001" type="text">
  443. </div>
  444. <button class="btn btn-sm btn-outline-primary">添加组件</button>
  445. </div>
  446. </div>
  447. </div>
  448. <div class="modal-footer">
  449. <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">关闭</button>
  450. <button type="button" class="btn btn-sm btn-primary">确定</button>
  451. </div>
  452. </div>
  453. </div>
  454. </div>
  455. <!--弹出添加合同-->
  456. <div class="modal fade" id="add-ht" data-backdrop="static">
  457. <div class="modal-dialog" role="document">
  458. <div class="modal-content">
  459. <div class="modal-header">
  460. <h5 class="modal-title">新建合同</h5>
  461. </div>
  462. <div class="modal-body">
  463. <div class="form-group">
  464. <label>合同项目</label>
  465. <select class="form-control form-control-sm">
  466. <optgroup label="1 第一部分 建筑安装工程费">
  467. <option>1.1 劳务</option>
  468. <option>1.2 材料</option>
  469. <option>1.3 机械</option>
  470. <option>1.4 临时工程</option>
  471. <option>1.5 施工测量、检测及试验</option>
  472. <option>1.6 其他直接费</option>
  473. <option>1.7 专项费用</option>
  474. <option>1.8 施工场地建设</option>
  475. <option>1.9 安全生产</option>
  476. </optgroup>
  477. <optgroup label="2 第二部分 土地使用及拆迁补偿费">
  478. <option>2.1 ...</option>
  479. <option>2.2 ...</option>
  480. <option>2.3 ...</option>
  481. </optgroup>
  482. </select>
  483. </div>
  484. <div class="form-group">
  485. <label>合同编号<b class="text-danger">*</b></label>
  486. <div class="input-group input-group-sm">
  487. <input type="text" class="form-control" value="CD03-CL-2015-121" placeholder="请输入合同编号">
  488. <div class="input-group-append">
  489. <button class="btn btn-outline-secondary" type="button" >自动编号</button>
  490. </div>
  491. </div>
  492. </div>
  493. <div class="form-group">
  494. <label>合同名称<b class="text-danger">*</b></label>
  495. <input class="form-control form-control-sm" placeholder="输入合同名称" type="text">
  496. </div>
  497. <div class="form-group">
  498. <label>合同类型<b class="text-danger">*</b></label>
  499. <select class="form-control form-control-sm">
  500. <option>请选择</option>
  501. <option>支出合同</option>
  502. <option>收入合同</option>
  503. </select>
  504. </div>
  505. <div class="form-group">
  506. <label>合同金额<b class="text-danger">*</b></label>
  507. <div class="input-group input-group-sm">
  508. <input type="text" class="form-control nospin" placeholder="输入合同金额" mini="1">
  509. <div class="input-group-append">
  510. <span class="input-group-text">元</span>
  511. </div>
  512. </div>
  513. </div>
  514. </div>
  515. <div class="modal-footer">
  516. <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">取消</button>
  517. <button type="button" class="btn btn-sm btn-primary">确定添加</button>
  518. </div>
  519. </div>
  520. </div>
  521. </div>
  522. <!--选择合同项目节模板-->
  523. <div class="modal fade" id="temple" data-backdrop="static">
  524. <div class="modal-dialog" role="document">
  525. <div class="modal-content">
  526. <div class="modal-header">
  527. <h5 class="modal-title">选择合同项目节模板</h5>
  528. </div>
  529. <div class="modal-body">
  530. <div class="alert alert-warning p-2">
  531. 默认项目节无法修改,可自行增加维护子节点
  532. </div>
  533. <div class="row">
  534. <div class="col-6">
  535. <div class="card border-primary">
  536. <div class="card-body">
  537. <div class="custom-control custom-radio">
  538. <input type="radio" id="customRadio1" name="customRadio" class="custom-control-input">
  539. <label class="custom-control-label" for="customRadio1">项目节模板1</label>
  540. </div>
  541. </div>
  542. <div class="modal-height-300" style="overflow: auto;">
  543. <table class="table table-bordered">
  544. <tr><th>项目节</th><th>名称</th></tr>
  545. <tr><td>1</td><td>第一部分 建筑安装工程费</td></tr>
  546. <tr><td>2</td><td>第二部分 土地使用及拆迁补偿费</td></tr>
  547. <tr><td>3</td><td>第三部分 工程建设其他费</td></tr>
  548. <tr><td class="in-2">2-1</td><td>建设项目管理费</td></tr>
  549. <tr><td class="in-2">2-2</td><td>研究试验费</td></tr>
  550. <tr><td class="in-2">2-3</td><td>建设项目前期工作费</td></tr>
  551. <tr><td class="in-2">2-4</td><td>专项评价(估)费</td></tr>
  552. <tr><td class="in-2">2-5</td><td>联合诗运转费</td></tr>
  553. <tr><td class="in-2">2-6</td><td>工程保通管理费</td></tr>
  554. <tr><td class="in-2">2-7</td><td>工程保险费</td></tr>
  555. <tr><td class="in-2">2-8</td><td>其他相关费用</td></tr>
  556. <tr><td>4</td><td>第四部分 预备费</td></tr>
  557. <tr><td>5</td><td>第五部分 建设期贷款利息</td></tr>
  558. </table>
  559. </div>
  560. </div>
  561. </div>
  562. <div class="col-6">
  563. <div class="card">
  564. <div class="card-body">
  565. <div class="custom-control custom-radio">
  566. <input type="radio" id="customRadio1" name="customRadio" class="custom-control-input">
  567. <label class="custom-control-label" for="customRadio1">项目节模板2</label>
  568. </div>
  569. </div>
  570. <div class="modal-height-300" style="overflow: auto;">
  571. <table class="table table-bordered">
  572. <tr><th>项目节</th><th>名称</th></tr>
  573. <tr><td>1</td><td>第一部分 建筑安装工程费</td></tr>
  574. <tr><td class="in-2">1-1</td><td>劳务</td></tr>
  575. <tr><td class="in-2">1-2</td><td>材料</td></tr>
  576. <tr><td class="in-2">1-3</td><td>机械</td></tr>
  577. <tr><td class="in-2">1-4</td><td>设备购置</td></tr>
  578. <tr><td class="in-2">1-5</td><td>临时工程</td></tr>
  579. <tr><td class="in-2">1-6</td><td>施工测量、检测及试验</td></tr>
  580. <tr><td class="in-2">1-7</td><td>其他直接费</td></tr>
  581. <tr><td class="in-2">1-8</td><td>专项费用</td></tr>
  582. <tr><td class="in-3">1-8-1</td><td>施工场地建设</td></tr>
  583. <tr><td class="in-3">1-8-2</td><td>安全生产</td></tr>
  584. <tr><td>2</td><td>第二部分 土地使用及拆迁补偿费</td></tr>
  585. <tr><td>3</td><td>第三部分 工程建设其他费</td></tr>
  586. <tr><td>4</td><td>第四部分 预备费</td></tr>
  587. <tr><td>5</td><td>第五部分 建设期贷款利息</td></tr>
  588. </table>
  589. </div>
  590. </div>
  591. </div>
  592. </div>
  593. </div>
  594. <div class="modal-footer">
  595. <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">关闭</button>
  596. <button type="button" class="btn btn-sm btn-primary" >确定</button>
  597. </div>
  598. </div>
  599. </div>
  600. </div>
  601. <!-- JS. -->
  602. <script src="js/jquery/jquery-3.2.1.min.js"></script>
  603. <script src="js/popper/popper.min.js"></script>
  604. <script src="js/bootstrap/bootstrap.min.js"></script>
  605. <script src="js/global.js"></script>
  606. <script src="js/datepicker/datepicker.min.js"></script>
  607. <script src="js/datepicker/datepicker.zh.js"></script>
  608. <script src="js/spreadjs/sheets/gc.spread.sheets.all.10.0.1.min.js"></script>
  609. <!-- zTree -->
  610. <script type="text/javascript" src="js/ztree/jquery.ztree.core.js"></script>
  611. <script type="text/javascript" src="js/ztree/jquery.ztree.excheck.js"></script>
  612. <script type="text/javascript"> autoFlashHeight();</script>
  613. <script type="text/javascript"> $('#temple').modal('show');</script>
  614. </body>
  615. </html>