pending_advent.html 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420
  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.0">
  6. <title>逸管FEP</title>
  7. <link rel="stylesheet" href="{__MOBILE__}/css/base.css">
  8. <link rel="stylesheet" href="{__MOBILE__}/css/pending.css">
  9. <link rel="stylesheet" href="{__MOBILE__}/layui/css/layui.css">
  10. <link rel="stylesheet" href="{__MOBILE__}/layui-v2.8.18-rc.1/layui-v2.8.18-rc.1/layui/css/layui.css">
  11. <style>
  12. .footer_icon1 {
  13. background-image: url('{__MOBILE__}/img/first.png') !important;
  14. }
  15. .footer_icon2 {
  16. background-image: url('{__MOBILE__}/img/second.png') !important;
  17. }
  18. .footer_icon3 {
  19. background-image: url('{__MOBILE__}/img/third-a.png') !important;
  20. }
  21. .footer_icon4 {
  22. background-image: url('{__MOBILE__}/img/forth.png') !important;
  23. }
  24. </style>
  25. </head>
  26. <body>
  27. <!-- <div class="top">
  28. <span><img src="{__MOBILE__}/img/left.png" alt="" style="width: 5vw;"></span><span>待处理</span><span><img
  29. src="{__MOBILE__}/img/list.png" alt="" style="width: 5vw;"></span>
  30. </div> -->
  31. <div class="pending">
  32. <div class="layui-tab layui-tab-brief">
  33. <ul class="layui-tab-title">
  34. <a href="{:url('mobile/index/pending')}">
  35. <li>待审项目<span class="dot-img">
  36. {if $red}<img src="{__MOBILE__}/img/dot.png" alt="" style="width: 1.2vh;">{/if}</span></li>
  37. </a>
  38. {if $unit_type != 1}
  39. <a href="{:url('mobile/index/pending_invite')}">
  40. <li>待审请款&nbsp;<span class="dot-img">{if $red}<img src="{__MOBILE__}/img/dot.png" alt="" style="width: 1.2vh;">{/if}</span></li>
  41. </a>
  42. {/if}
  43. <a href="{:url('mobile/index/pending_advent')}">
  44. <li class="layui-this">临期</li>
  45. </a>
  46. <a href="{:url('mobile/index/pending_late')}">
  47. <li>逾期</li>
  48. </a>
  49. </ul>
  50. <div class="layui-tab-content">
  51. <div class="layui-tab-item">
  52. </div>
  53. <div class="layui-tab-item layui-show">
  54. <div class="kan-sreach">
  55. <form id="taskForm" class="layui-form" lay-filter="barsearchform">
  56. <div class="layui-input-wrap" style="display: flex;">
  57. <input type="text" name="keyword" lay-filter="search" placeholder="搜索…"
  58. class="layui-input">
  59. <span><button type="button" lay-submit lay-filter="webform"><img
  60. src="{__MOBILE__}/img/search.png" alt=""
  61. style="height: 5vw;"></button></span>
  62. </div>
  63. </form>
  64. <!--<div class="kan-sift"><span id="btn">筛选</span><span><img src="{__MOBILE__}/img/sift.png"-->
  65. <!-- alt=""></span></div>-->
  66. </div>
  67. <div style="margin-bottom: 18vw;">
  68. {volist name="advent_list" id="vo"}
  69. <div class="pending-item">
  70. <div class="pending-top">
  71. <span style="font-size: 4vw;"><b>{$vo.project_name}</b></span>
  72. <a href='{:url("mobile/index/pdetail")}?id={$vo.id}'>
  73. <span style="display: flex;align-items: center;font-size: 3.5vw;color: #187FDD;">
  74. <span style="width:15vw;"><b>查看详情</b></span>
  75. <span><img src="{__MOBILE__}/img/right2.png" alt=""
  76. style="width: 4vw;height: 3.5vw;"></span>
  77. </span>
  78. </a>
  79. </div>
  80. <div class="pending-content">项目编号:{$vo.project_num}</div>
  81. <div class="pending-content content">
  82. <span>项目状态:
  83. {switch $vo.project_status}
  84. {case 1}立项中{/case}
  85. {case 2}审批中{/case}
  86. {case 3}待接收{/case}
  87. {case 4}待分配{/case}
  88. {case 5}作业中{/case}
  89. {case 6}归档中{/case}
  90. {case 7}退审中{/case}
  91. {case 8}已归档{/case}
  92. {case 9}已退审{/case}
  93. {default /}未知
  94. {/switch}
  95. </span>
  96. <span class="pending-advent">
  97. <span>剩余时间:</span>
  98. <span><b>{$vo.advent_time}</b></span>
  99. </span>
  100. </div>
  101. <div class="pending-content content">
  102. <span>项目负责人:{$vo.review_head_name}</span><span>作业负责人:{$vo.operate_head_name}</span>
  103. </div>
  104. <div class="pending-content"
  105. style="display: flex;justify-content: space-between;align-items: center;">
  106. <span style="color: darkgray;"><b>{$vo.review_unit_name}</b></span>
  107. </div>
  108. </div>
  109. {/volist}
  110. </div>
  111. </div>
  112. <div class="layui-tab-item">
  113. </div>
  114. <div>
  115. <!-- <div>
  116. 页面里的内容 <button id="btn">展示弹窗</button>
  117. </div> -->
  118. <div class="mask" id="mask"></div>
  119. <div class="dialog" id="dialog">
  120. <div class="sift">
  121. <div class="sift-top" style="margin-bottom: 2vw;">
  122. <b>项目状态</b>
  123. </div>
  124. <form class="layui-form" action="">
  125. <div class="layui-form-item">
  126. <div class="layui-input-block">
  127. <input type="radio" name="project_status" value="2" title="审批中" class="sift-state">
  128. <input type="radio" name="project_status" value="3" title="待接收" class="sift-state">
  129. <input type="radio" name="project_status" value="4" title="分配中" class="sift-state">
  130. <input type="radio" name="project_status" value="5" title="作业中" class="sift-state">
  131. <input type="radio" name="project_status" value="6" title="归档中" class="sift-state">
  132. <input type="radio" name="project_status" value="7" title="退审中" class="sift-state">
  133. <input type="radio" name="project_status" value="8" title="已归档" class="sift-state">
  134. <input type="radio" name="project_status" value="9" title="已退审" class="sift-state">
  135. </div>
  136. <!--<div class="sift-top">-->
  137. <!-- <b>相关区域</b>-->
  138. <!--</div>-->
  139. </div>
  140. <!--<div class="layui-form-item">-->
  141. <!-- <div class="layui-input-inline">-->
  142. <!-- <select name="province">-->
  143. <!-- <option value=""selected>请选择省</option>-->
  144. <!-- <option value="浙江" >浙江省</option>-->
  145. <!-- <option value="你的工号">江西省</option>-->
  146. <!-- <option value="你最喜欢的老师">福建省</option>-->
  147. <!-- </select>-->
  148. <!-- </div>-->
  149. <!-- <div class="layui-input-inline">-->
  150. <!-- <select name="city">-->
  151. <!-- <option value="">请选择市</option>-->
  152. <!-- <option value="杭州">杭州</option>-->
  153. <!-- <option value="宁波" disabled>宁波</option>-->
  154. <!-- <option value="温州">温州</option>-->
  155. <!-- <option value="温州">台州</option>-->
  156. <!-- <option value="温州">绍兴</option>-->
  157. <!-- </select>-->
  158. <!-- </div>-->
  159. <!-- <div class="layui-input-inline">-->
  160. <!-- <select name="area">-->
  161. <!-- <option value="">请选择县/区</option>-->
  162. <!-- <option value="西湖区">西湖区</option>-->
  163. <!-- <option value="余杭区">余杭区</option>-->
  164. <!-- <option value="拱墅区">临安市</option>-->
  165. <!-- </select>-->
  166. <!-- </div>-->
  167. <!-- <div class="layui-form-mid layui-text-em">
  168. <i class="layui-icon layui-icon-tips" lay-tips="{
  169. content: '此处只是演示联动排版,并未做联动交互',
  170. margin: '0 0 0 -10px'
  171. } "></i>
  172. </div> -->
  173. <!--</div>-->
  174. <!--<div class="layui-form-item">-->
  175. <!-- <div class="sift-top">-->
  176. <!-- <b>日期范围</b>-->
  177. <!-- </div>-->
  178. <!-- <div class="layui-inline" id="ID-laydate-rangeLinked"-->
  179. <!-- style="display: flex;align-items: center;">-->
  180. <!-- <div class="layui-input-inline">-->
  181. <!-- <input type="text" autocomplete="off" id="ID-laydate-start-date-1" style="margin: 0;padding: 0;text-align: center;"-->
  182. <!-- class="layui-input" placeholder="开始日期" id="datePicker" name="project_start_time">-->
  183. <!-- </div>-->
  184. <!-- <div class="layui-form-mid">-</div>-->
  185. <!-- <div class="layui-input-inline">-->
  186. <!-- <input type="text" autocomplete="off" id="ID-laydate-end-date-1" class="layui-input" style="margin: 0;padding: 0;text-align: center;"-->
  187. <!-- placeholder="结束日期" id="datePicker1" name="project_end_time">-->
  188. <!-- </div>-->
  189. <!-- </div>-->
  190. <!--</div>-->
  191. <div class="layui-form-item">
  192. <div class="sift-bottom">
  193. <div class="layui-input-block">
  194. <button type="button" class="layui-btn" lay-submit lay-filter="demo1"
  195. style="padding: 0;">立即提交</button>
  196. <!-- <button type="reset" class="layui-btn layui-btn-primary">重置</button> -->
  197. </div>
  198. </div>
  199. </div>
  200. </form>
  201. </div>
  202. </div>
  203. </div>
  204. </div>
  205. </div>
  206. </div>
  207. <div class="footer">
  208. <div class="footer_ge">
  209. <a href="{:url('mobile/index/main')}" title="首页">
  210. <div class="footer_icon footer_icon1"></div>
  211. 首页
  212. </a>
  213. </div>
  214. <div class="footer_ge">
  215. <a href="{:url('mobile/index/kan_list')}" title="看板">
  216. <div class="dot">
  217. <div>
  218. <div class="footer_icon footer_icon2"></div>
  219. <div>看板</div>
  220. </div>
  221. <div class="dot-img">
  222. {if $red_kan} <img src="{__MOBILE__}/img/dot.png" alt="" style="width: 1.2vh;"> {/if}
  223. </div>
  224. </div>
  225. </a>
  226. </div>
  227. <div class="footer_ge">
  228. <a href="{:url('mobile/index/pending')}" title="待处理" style="color: #187FDD;">
  229. <div class="dot">
  230. <div>
  231. <div class="footer_icon footer_icon3"></div>
  232. <div>待处理</div>
  233. </div>
  234. <div class="dot-img">
  235. {if $red} <img src="{__MOBILE__}/img/dot.png" alt="" style="width: 1.2vh;margin-left: -4.5vw;">{/if}
  236. </div>
  237. </div>
  238. </a>
  239. </div>
  240. <div class="footer_ge">
  241. <a href="{:url('mobile/index/person')}" title="我的">
  242. <div class="footer_icon footer_icon4"></div>
  243. 我的
  244. </a>
  245. </div>
  246. </div>
  247. <script src="{__MOBILE__}/layui-v2.8.18-rc.1/layui-v2.8.18-rc.1/layui/layui.js"></script>
  248. <script>
  249. layui.use(function () {
  250. var form = layui.form;
  251. form.on('submit(webform)', function (data) {
  252. console.log(data.field);
  253. const host = window.location.host;
  254. window.location.href = 'http://' + host + '/mobile/index/pending_advent?keyword=' + data.field['keyword'];
  255. return false;
  256. });
  257. })
  258. </script>
  259. <script>
  260. layui.use(function () {
  261. var form = layui.form;
  262. // 输入框点缀事件 - 位置示例
  263. form.on('input-affix(location)', function (data) {
  264. var elem = data.elem; // 输入框
  265. // do something
  266. layer.msg('模拟获取位置中…', { icon: 16, time: 1.5 * 1000 }, function () {
  267. elem.value = '浙江杭州'; // 向输入框赋值
  268. })
  269. });
  270. // 输入框点缀事件 - 搜索示例
  271. form.on('input-affix(search)', function (data) {
  272. var elem = data.elem; // 输入框
  273. var value = elem.value; // 输入框的值
  274. if (!value) {
  275. layer.msg('请输入搜索内容');
  276. return elem.focus()
  277. };
  278. // 模拟搜索跳转
  279. location.href = '?keywords=' + value + '&_' + new Date().getTime() + '#affix-custom';
  280. });
  281. });
  282. </script>
  283. <script>
  284. /*const btn = document.getElementById('btn');
  285. console.log(btn);
  286. const mask = document.getElementById('mask');
  287. const dialog = document.getElementById('dialog');
  288. btn.addEventListener('click', () => {
  289. mask.classList.add('show');
  290. dialog.classList.add('show');
  291. });
  292. mask.addEventListener('click', () => {
  293. mask.classList.remove('show');
  294. dialog.classList.remove('show');
  295. });*/
  296. </script>
  297. <script>
  298. layui.use(function () {
  299. var laydate = layui.laydate;
  300. // 日期范围 - 左右面板联动选择模式
  301. laydate.render({
  302. elem: '#ID-laydate-rangeLinked',
  303. range: ['#ID-laydate-start-date-1', '#ID-laydate-end-date-1'],
  304. rangeLinked: true // 开启日期范围选择时的区间联动标注模式 --- 2.8+ 新增
  305. });
  306. });
  307. </script>
  308. <script>
  309. layui.use(['form', 'laydate', 'util'], function () {
  310. var form = layui.form;
  311. var layer = layui.layer;
  312. var laydate = layui.laydate;
  313. var util = layui.util;
  314. // 自定义验证规则
  315. form.verify({
  316. pass: function (value) {
  317. if (!/(.+){6,12}$/.test(value)) {
  318. return '密码必须 6 到 12 位';
  319. }
  320. }
  321. });
  322. // 指定开关事件
  323. form.on('switch(switchTest)', function (data) {
  324. layer.msg('开关 checked:' + (this.checked ? 'true' : 'false'), {
  325. offset: '6px'
  326. });
  327. layer.tips('温馨提示:请注意开关状态的文字可以随意定义,而不仅仅是 ON|OFF', data.othis)
  328. });
  329. //buttom
  330. form.on('button', function (data) {
  331. console.log(data.field);
  332. });
  333. // 提交事件
  334. form.on('submit(demo1)', function (data) {
  335. var field = data.field; // 获取表单字段值
  336. // 显示填写结果,仅作演示用
  337. // console.log(field);
  338. const host = window.location.host;
  339. window.location.href = 'http://' + host + '/mobile/index/pending_advent?project_status=' + data.field['project_status']+'&province=' + data.field['province']+'&city=' + data.field['city']+'&area=' + data.field['area']+'&project_start_time=' + data.field['project_start_time']+'&project_end_time=' + data.field['project_end_time'];
  340. return false; // 阻止默认 form 跳转
  341. });
  342. // 日期
  343. laydate.render({
  344. elem: '#date'
  345. });
  346. // 普通事件
  347. util.on('lay-on', {
  348. // 获取验证码
  349. "get-vercode": function (othis) {
  350. var isvalid = form.validate('.demo-phone'); // 主动触发验证,v2.7.0 新增
  351. // 验证通过
  352. if (isvalid) {
  353. layer.msg('手机号规则验证通过');
  354. // 此处可继续书写「发送验证码」等后续逻辑
  355. // …
  356. }
  357. }
  358. });
  359. });
  360. </script>
  361. </body>
  362. </html>