getdetail.html 38 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>表单</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
  7. <meta name="apple-mobile-web-app-capable" content="yes">
  8. <link href="../../css/mui.min.css" rel="stylesheet" />
  9. <link href="../../css/mui.picker.css" rel="stylesheet" />
  10. <link href="../../css/mui.poppicker.css" rel="stylesheet" />
  11. <link href="../../css/OA-style.css" rel="stylesheet" />
  12. <style>
  13. .mui-input-row .mui-btn {
  14. float: left;
  15. width: 27%;
  16. margin-left: 10px;
  17. }
  18. .mui-btn-blue,
  19. .mui-btn-primary,
  20. input[type=submit] {
  21. width: 150px;
  22. }
  23. @media screen and (max-width: 768px) {
  24. #yy {
  25. width: 100%;
  26. }
  27. }
  28. .inp {
  29. width: 15%;
  30. }
  31. .bg {
  32. height: 300px;
  33. width: 100%;
  34. background: #62949a;
  35. }
  36. .bg_bt {
  37. margin: 50px;
  38. width: 10%;
  39. }
  40. .div_center {
  41. background: #FFFFFF;
  42. width: 90%;
  43. height: auto;
  44. margin-left: 5%;
  45. border-radius: 10px;
  46. margin-top: 10px;
  47. padding: 30px;
  48. }
  49. .ldsp {
  50. font-size: 1.5em;
  51. }
  52. .div1_center {
  53. padding: 10px;
  54. }
  55. .fl {
  56. float: left;
  57. }
  58. .ov {
  59. overflow: hidden;
  60. }
  61. .div_border {
  62. border: #000000 1px solid;
  63. height: auto;
  64. font-size: 13px;
  65. color: #9c9c9c;
  66. padding: 10px;
  67. }
  68. .hongse {
  69. color: #CF2D28;
  70. }
  71. .text_cent {
  72. text-align: center;
  73. border: #000000 1px solid;
  74. padding: 10px;
  75. margin-top: 10px;
  76. display: block;
  77. word-break: break-all;
  78. word-wrap: break-word;
  79. }
  80. .yanse {
  81. color: #B6B6B6;
  82. }
  83. #xx {
  84. height: 100px;
  85. }
  86. html,
  87. body {
  88. background-color: #efeff4;
  89. }
  90. .mui-views,
  91. .mui-view,
  92. .mui-pages,
  93. .mui-page,
  94. .mui-page-content {
  95. position: absolute;
  96. left: 0;
  97. right: 0;
  98. top: 0;
  99. bottom: 0;
  100. width: 100%;
  101. height: 100%;
  102. background-color: #efeff4;
  103. }
  104. .mui-pages {
  105. top: 43px;
  106. height: auto;
  107. }
  108. .mui-scroll-wrapper,
  109. .mui-scroll {
  110. background-color: #efeff4;
  111. }
  112. .mui-page.mui-transitioning {
  113. -webkit-transition: -webkit-transform 300ms ease;
  114. transition: transform 300ms ease;
  115. }
  116. .mui-page-left {
  117. -webkit-transform: translate3d(0, 0, 0);
  118. transform: translate3d(0, 0, 0);
  119. }
  120. .mui-ios .mui-page-left {
  121. -webkit-transform: translate3d(-20%, 0, 0);
  122. transform: translate3d(-20%, 0, 0);
  123. }
  124. .mui-navbar {
  125. position: fixed;
  126. right: 0;
  127. left: 0;
  128. z-index: 10;
  129. height: 44px;
  130. background-color: #468CF0;
  131. }
  132. .mui-navbar .mui-bar {
  133. position: absolute;
  134. background: transparent;
  135. text-align: center;
  136. }
  137. .mui-android .mui-navbar-inner.mui-navbar-left {
  138. opacity: 0;
  139. }
  140. .mui-ios .mui-navbar-left .mui-left,
  141. .mui-ios .mui-navbar-left .mui-center,
  142. .mui-ios .mui-navbar-left .mui-right {
  143. opacity: 0;
  144. }
  145. .mui-navbar .mui-btn-nav {
  146. -webkit-transition: none;
  147. transition: none;
  148. -webkit-transition-duration: .0s;
  149. transition-duration: .0s;
  150. }
  151. .mui-navbar .mui-bar .mui-title {
  152. display: inline-block;
  153. width: auto;
  154. }
  155. .mui-page-shadow {
  156. position: absolute;
  157. right: 100%;
  158. top: 0;
  159. width: 16px;
  160. height: 100%;
  161. z-index: -1;
  162. content: '';
  163. }
  164. .mui-page-shadow {
  165. background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, .01) 50%, rgba(0, 0, 0, .2) 100%);
  166. background: linear-gradient(to right, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, .01) 50%, rgba(0, 0, 0, .2) 100%);
  167. }
  168. .mui-navbar-inner.mui-transitioning,
  169. .mui-navbar-inner .mui-transitioning {
  170. -webkit-transition: opacity 300ms ease, -webkit-transform 300ms ease;
  171. transition: opacity 300ms ease, transform 300ms ease;
  172. }
  173. .mui-page {
  174. display: none;
  175. }
  176. .mui-pages .mui-page {
  177. display: block;
  178. }
  179. .mui-page .mui-table-view:first-child {
  180. margin-top: 15px;
  181. }
  182. .mui-page .mui-table-view:last-child {
  183. margin-bottom: 30px;
  184. }
  185. .mui-table-view {
  186. margin-top: 0px;
  187. }
  188. .mui-table-view span.mui-pull-right {
  189. color: #999;
  190. }
  191. .mui-table-view-divider {
  192. background-color: #efeff4;
  193. font-size: 14px;
  194. }
  195. .mui-content>.mui-table-view:first-child {
  196. margin-top: -1px;
  197. }
  198. .mui-bar {
  199. box-shadow: none;
  200. }
  201. .mui-table-view-cell:after {
  202. left: 0px;
  203. }
  204. /*.mui-input-row label {
  205. padding: 0;
  206. line-height: 21px;
  207. }*/
  208. input[type=color],
  209. input[type=date],
  210. input[type=datetime-local],
  211. input[type=datetime],
  212. input[type=email],
  213. input[type=month],
  214. input[type=number],
  215. input[type=password],
  216. input[type=search],
  217. input[type=tel],
  218. input[type=text],
  219. input[type=time],
  220. input[type=url],
  221. input[type=week],
  222. select,
  223. textarea {}
  224. .mui-table-view-divider:before,
  225. .mui-table-view-divider:after {
  226. height: 0;
  227. }
  228. .head {
  229. height: 40px;
  230. }
  231. #head {
  232. line-height: 40px;
  233. }
  234. .head-img {
  235. width: 40px;
  236. height: 40px;
  237. }
  238. #head-img1 {
  239. position: absolute;
  240. bottom: 10px;
  241. right: 40px;
  242. width: 40px;
  243. height: 40px;
  244. }
  245. .update {
  246. font-style: normal;
  247. color: #999999;
  248. margin-right: -25px;
  249. font-size: 15px
  250. }
  251. .mui-fullscreen {
  252. position: fixed;
  253. z-index: 20;
  254. background-color: #000;
  255. }
  256. .mui-ios .mui-navbar .mui-bar .mui-title {
  257. position: static;
  258. }
  259. /*问题反馈在setting页面单独的css*/
  260. #feedback .mui-popover {
  261. position: fixed;
  262. }
  263. #feedback .mui-table-view:last-child {
  264. margin-bottom: 0px;
  265. }
  266. #feedback .mui-table-view:first-child {
  267. margin-top: 0px;
  268. }
  269. .mui-plus.mui-plus-stream .mui-stream-hidden {
  270. display: none !important;
  271. }
  272. </style>
  273. </head>
  274. <body>
  275. <!--页面主结构开始-->
  276. <div id="app" class="mui-views">
  277. <div class="mui-view">
  278. <div class="mui-navbar">
  279. </div>
  280. <div class="mui-pages">
  281. </div>
  282. </div>
  283. </div>
  284. <!--页面主结构结束-->
  285. <!--单页面开始-->
  286. <div id="setting" class="mui-page">
  287. <!--页面标题栏开始-->
  288. <div class="mui-navbar-inner mui-bar mui-bar-nav">
  289. <button type="button" class="mui-left mui-action-back mui-btn mui-btn-link mui-btn-nav mui-pull-left" id="to_flowPage">
  290. <img class="mui-icon mui-icon-left-nav" src="../../images/back.png" height="20">
  291. </button>
  292. <h1 id="title" class="mui-center mui-title">审批详情</h1>
  293. </div>
  294. <!--页面主内容区开始-->
  295. <div class="mui-page-content">
  296. <div class="mui-scroll-wrapper" id="pullrefresh">
  297. <div class="mui-scroll">
  298. <div class="mui-content-padded" style="margin: 5px;" id="form_element">
  299. <form class="mui-input-group" id="">
  300. <div class="mui-input-row">
  301. <label>审核单号</label>
  302. <input type="text" id="tripid" readonly="readonly">
  303. </div>
  304. <div class="mui-input-row">
  305. <label>部门</label>
  306. <!--<select id="tripdepart">
  307. <template v-for="item in items">
  308. <option v-bind:value="item.GROUPNAME">{{item.GROUPNAME}}</option>
  309. </template>
  310. </select>-->
  311. <input type="text" id="tripdepart" readonly="readonly" value="">
  312. </div>
  313. <div class="mui-input-row">
  314. <label>出差人数</label>
  315. <input type="number" id="tripnum" readonly="readonly">
  316. </div>
  317. <div class="mui-input-row">
  318. <label>经办人</label>
  319. <input type="text" id="tripmanid" readonly="readonly" value="">
  320. </div>
  321. <div class="mui-input-row" style="height: 80px;">
  322. <label>出差地点</label>
  323. <textarea rows="" cols="" id="address" readonly="readonly"></textarea>
  324. </div>
  325. <div class="mui-input-row">
  326. <label> 出差人员</label>
  327. <input type="text" id="tripmen" readonly="readonly">
  328. </div>
  329. <div class="mui-input-row" style="height: 100px;" id="triptime">
  330. <label>出差时间</label><br><br>
  331. <div class="mui-input-row" style="height: 70px;">
  332. <span>
  333. <button type="button" class="mui-btn" ><span id="bengintime">开始时间</span></button>
  334. </span>
  335. <label style="width: 3%;"> 至 </label>
  336. <span>
  337. <button type="button" class="mui-btn" ><span id="endtime">结束时间</span></button>
  338. </span>
  339. <label style="width: 3%;">共</label>
  340. <span> <input type="text" id="triptotalday" readonly="readonly" style="border: solid 1px gainsboro; width: 40px;margin-left: 10px;padding-left: 12px;float: left;"> </span>
  341. <label style="width: 3%;margin-left:-10px;">天</label>
  342. </div>
  343. </div>
  344. <div id="size5" class="mui-input-row" style="display: none;">
  345. <label>财务审核出差人天数</label>
  346. <input type="text" id="approveday" >
  347. </div>
  348. <div id="size7" class="mui-input-row" style="display: none;">
  349. <label>财务审核出差人天数</label>
  350. <input type="text" id="size7_approveday" readonly="readonly">
  351. </div>
  352. <div class="mui-input-row">
  353. <label>是否派车</label>
  354. <div id="" style="margin-top: 8px;">
  355. <input name="wheacar" id="wheacar" type="radio" value="1" disabled="disabled" />是
  356. <input name="wheacar" id="wheacar" type="radio" style="margin-left: 15px;" value="2" disabled="disabled" />否
  357. </div>
  358. </div>
  359. <div class="mui-input-row">
  360. <label>是否全程跟随</label>
  361. <input name="whealltrip" id="whealltrip" type="text" readonly="readonly" />
  362. <!--<select name="whealltrip" id="whealltrip">
  363. <option value="-1">请选择</option>
  364. <option value="0">不派车</option>
  365. <option value="1">全程跟随</option>
  366. <option value="2">接</option>
  367. <option value="3">送</option>
  368. <option value="4">接和送</option>
  369. </select> -->
  370. </div>
  371. <div class="mui-input-row" style="height: 80px;">
  372. <label>出差 派车事由</label>
  373. <textarea rows="" cols="" id="reason" readonly="readonly"></textarea>
  374. </div>
  375. <div class="mui-input-row" id="paiche" style="height: auto; display: none;">
  376. <label style="width: 50%;">驾驶员及用车时间</label>
  377. <br />
  378. <br />
  379. <div id="onlypaiche" class="" style="display: none;">
  380. <label style="width: 3%;" id="paiche_type"></label>
  381. <input type="button" id="drive_name" class="mui-btn" value="驾驶员" style="border: 1px gainsboro solid;" @click="choosePerson({'backId':'drive_name','backType':'bpmFormUser','isMultiDept':'0'})">
  382. <input type="hidden" id="drive" value="" />
  383. <label style="width: 20%;">车牌号</label>
  384. <input type="text" id="chepainum" value="" style="width: 30%;border: 1px gainsboro solid;margin-left: -5%;" />
  385. <br />
  386. <br />
  387. <button type="button" class="mui-btn" id="yc_begintime" readonly="readonly" onclick="time('yc_begintime')" style="margin-left: 40px;">开始时间</button>
  388. <label style="width: 20%;">至</label>
  389. <button type="button" class="mui-btn" id="yc_endtime" readonly="readonly" onclick="time('yc_endtime')" style="width: 30%;margin-left: -5%;">结束时间</button><br /><br />
  390. <label style="width: 3%;margin-left: 30px;">共</label>
  391. <input type="text" id="yc_triptotalday" style="width: 40px;margin-left: 10px;padding-left: 12px;">
  392. <label style="width: 3%;margin-left:-10px;">天</label>
  393. </div>
  394. <div id="jie" class="" style="display: none;">
  395. <br />
  396. <br />
  397. <input type="text" value="(可在出差人员返程时填写)" style="width: 100%;font-size: 12px;margin-left: 15px;color: #a6a6a6;;"/>
  398. <br />
  399. <label style="width: 3%;">接:</label>
  400. <input type="button" id="drive_jie_name" value="驾驶员" style="border: 1px gainsboro solid;" class="mui-btn" @click="choosePerson({'backId':'drive_jie_name','backType':'bpmFormUser','isMultiDept':'0'})">
  401. <input type="hidden" id="drive_jie" value="" />
  402. <label style="width: 20%;">车牌号</label>
  403. <input type="text" id="jie_chepainum" value="" style="width: 30%;border: 1px gainsboro solid;margin-left: -5%;" />
  404. <br />
  405. <br />
  406. <button type="button" class="mui-btn" id="yc_jie_begintime" readonly="readonly" onclick="time('yc_jie_begintime')" style="margin-left: 40px;">开始时间</button>
  407. <label style="width: 20%;">至</label>
  408. <button type="button" class="mui-btn" id="yc_jie_endtime" readonly="readonly" onclick="time('yc_jie_endtime')" style="width: 30%;margin-left: -5%;">结束时间</button><br /><br />
  409. <label style="width: 3%;margin-left: 30px;">共</label>
  410. <input type="text" id="yc_jie_triptotalday" style="width: 40px;margin-left: 10px;padding-left: 12px;">
  411. <label style="width: 3%;margin-left:-10px;">天</label>
  412. </div>
  413. </div>
  414. <!--派车显示-->
  415. <div class="mui-input-row" id="xs_paiche" style="height: auto; display: none;">
  416. <label style="width: 50%;">驾驶员及用车时间</label>
  417. <br />
  418. <br />
  419. <div id="xs_onlypaiche" class="" style="display: none;">
  420. <label style="width: 3%;" id="xs_paiche_type"></label>
  421. <input type="button" id="xs_drive_name" class="mui-btn" style="width: 30%;border: 1px gainsboro solid;">
  422. <label style="width: 20%;">车牌号</label>
  423. <input type="text" id="xs_chepainum" readonly="readonly" value="" style="width: 30%;border: 1px gainsboro solid;margin-left: -5%;" />
  424. <br />
  425. <br />
  426. <input type="button" class="mui-btn" id="xs_yc_begintime" readonly="readonly" style="border: 1px gainsboro solid;width: 30%;margin-left: 9%;">
  427. <label style="width: 20%;">至</label>
  428. <input type="button" class="mui-btn" id="xs_yc_endtime" readonly="readonly" style="border: 1px gainsboro solid;width: 30%;margin-left: -5%;"><br /><br />
  429. <label style="width: 3%;margin-left: 30px;">共</label>
  430. <input type="text" id="xs_yc_triptotalday" readonly="readonly" style="width: 40px;margin-left: 10px;padding-left: 12px;">
  431. <label style="width: 3%;margin-left:-10px;">天</label>
  432. </div>
  433. <div id="xs_jie" class="" style="display: none;">
  434. <br />
  435. <br />
  436. <label style="width: 3%;">接:</label>
  437. <input type="button" id="xs_drive_jie_name" style="width: 30%;border: 1px gainsboro solid;" class="mui-btn" >
  438. <label style="width: 20%;">车牌号</label>
  439. <input type="text" id="xs_jie_chepainum" readonly="readonly" value="" style="width: 30%;border: 1px gainsboro solid;margin-left: -5%;" />
  440. <br />
  441. <br />
  442. <input type="button" class="mui-btn" id="xs_yc_jie_begintime" readonly="readonly" style="border: 1px gainsboro solid;width: 30%;margin-left: 9%;">
  443. <label style="width: 20%;">至</label>
  444. <input type="button" class="mui-btn" id="xs_yc_jie_endtime" readonly="readonly" style="border: 1px gainsboro solid;width: 30%;margin-left: -5%;"><br /><br />
  445. <label style="width: 3%;margin-left: 30px;">共</label>
  446. <input type="text" id="xs_yc_jie_triptotalday" readonly="readonly" style="width: 40px;margin-left: 10px;padding-left: 12px;">
  447. <label style="width: 3%;margin-left:-10px;">天</label>
  448. </div>
  449. </div>
  450. <div id="div_pcapproveday" class="mui-input-row" style="display: none;">
  451. <label> 财务审核司机天数</label>
  452. <input type="text" id="pcapproveday">
  453. </div>
  454. <div id="sizedayu5" class="mui-input-row" style="display: none;">
  455. <label> 财务审核司机天数</label>
  456. <input type="text" id="sizedayu5_pcapproveday" readonly="readonly">
  457. </div>
  458. <div id="jiesong" style="display: none;">
  459. <div id="" class="mui-input-row" >
  460. <label> 财务审核送去司机天数</label>
  461. <input type="text" id="song_approveday">
  462. </div>
  463. <div id="" class="mui-input-row" >
  464. <label> 财务审核接回司机天数</label>
  465. <input type="text" id="jie_approveday">
  466. </div>
  467. </div>
  468. <div id="size7_yc" style="display: none;">
  469. <div id="" class="mui-input-row" >
  470. <label> 财务审核送去司机天数</label>
  471. <input type="text" id="size7_song_approveday" readonly="readonly">
  472. </div>
  473. <div id="" class="mui-input-row" >
  474. <label> 财务审核接回司机天数</label>
  475. <input type="text" id="last_approveday">
  476. </div>
  477. </div>
  478. </form>
  479. <div>
  480. <div id="nexthj">
  481. <h4 style="color: darkcyan;margin: 15px;" id="nexthuanjietitle">下一环节:科室审批</h4>
  482. <form class="mui-input-group">
  483. <section id="startFlow2">
  484. <!-- 0并行分支,1手动分支,2条件分支 -->
  485. <template>
  486. <div class="mui-input-row">
  487. <label style="padding: 10px 0px 0px 15px;">下一环节审批人</label>
  488. </div>
  489. <div class="mui-input-row" style="height: auto;">
  490. <textarea id="approveman_name" rows="1" placeholder="请选择人员" readonly="readonly" @click="choosePerson({'backId':'approveman_name','backType':'bpmFormUser','isMultiDept':'0'})"></textarea>
  491. <input type="hidden" id="approveman" value="" />
  492. </div>
  493. <div class="mui-input-row">
  494. <label style="padding: 10px 0px 0px 15px;">审批备注</label>
  495. </div>
  496. <div class="mui-input-row" style="height: auto;">
  497. <textarea id="beizhu" rows="2"></textarea>
  498. </div>
  499. </template>
  500. </section>
  501. </form>
  502. </div>
  503. <h4 style="color: darkcyan;margin: 15px;">流转过程:</h4>
  504. <!--<div class="mui-input-row">
  505. <label> 下环节审批人</label>
  506. <input type="text" id="approveman">
  507. </div>-->
  508. <div v-for="item in items">
  509. <div style="text-align: center;border: #999999 1px solid; margin-top: 10px;">
  510. <p>
  511. 环节名称:
  512. <template v-if="item.prhuanjie == 1">启动</template>
  513. <template v-if="item.prhuanjie == 2">科室审批</template>
  514. <template v-if="item.prhuanjie == 3">车队派车</template>
  515. <template v-if="item.prhuanjie == 4">领导审批</template>
  516. <template v-if="item.prhuanjie == 5">财务核对</template>
  517. <template v-if="item.prhuanjie == 6">车队长再次派车</template>
  518. <template v-if="item.prhuanjie == 7">财务再次审批</template>
  519. <br /> 创建时间:{{item.prbegintime}} 环节办结:{{item.prendtime}}
  520. <br /> {{item.name2}}
  521. <br /> 审核备注 {{item.remark}}
  522. </p>
  523. </div>
  524. </div>
  525. <div class="mui-button-row" id="caozuo">
  526. <button type="button" class="mui-btn mui-btn-primary" id="saveBtn">确认审批</button>&nbsp;&nbsp;
  527. <button type="button" class="mui-btn mui-btn-danger" id="returnBth">驳回</button>
  528. </div>
  529. </div>
  530. </div>
  531. </div>
  532. </div>
  533. </div>
  534. </div>
  535. <!--单页面结束-->
  536. <div id="personComponent" class="mui-page">
  537. <div class="mui-navbar-inner mui-bar mui-bar-nav">
  538. <a class="mui-action-back back mui-pull-left"><img src="../../images/back.png"></a>
  539. <h1 class="mui-center mui-title">人员选择</h1>
  540. </div>
  541. <div class="mui-page-content">
  542. <div class="mui-scroll-wrapper" id="person-scroll">
  543. <div class="mui-scroll">
  544. <div class="mui-card" id="personData">
  545. <user-select v-on:increment="selectUser()" :group-users="groupUsers" :depts="depts"></user-select>
  546. </div>
  547. </div>
  548. <nav class="mui-bar mui-bar-tab">
  549. <button type="button" class="mui-btn mui-pull-left mui-btn-primary mui-action-back mui-btn-danger" style="margin-left: 30px;">取消</button>
  550. <button type="button" class="mui-btn mui-pull-right mui-btn-primary" onclick="selectUser()" style="margin-right: 30px;">确定</button>
  551. </nav>
  552. </div>
  553. </div>
  554. </div>
  555. <script src="../../js/mui.min.js"></script>
  556. <script src="../../js/mui.view.js"></script>
  557. <script src="../../js/mui.picker.min.js"></script>
  558. <script src="../../js/vue.min.js"></script>
  559. <script src="../../js/config.js"></script>
  560. <script src="../../js/app.js"></script>
  561. <script src="../../js/jquery-1.11.2.min.js"></script>
  562. <script src="../../js/dj/component/vue.userselect.js"></script>
  563. <script type="text/javascript">
  564. //日期控件
  565. function time(id) {
  566. var dDate = new Date();
  567. dDate.setFullYear(2014, 7, 16);
  568. var minDate = new Date();
  569. minDate.setFullYear(2010, 0, 1);
  570. var maxDate = new Date();
  571. maxDate.setFullYear(2016, 11, 31);
  572. plus.nativeUI.pickDate(function(e) {
  573. var d = e.date;
  574. var month=d.getMonth() + 1;
  575. if(month < 10){
  576. month= "0"+ month;
  577. }
  578. var day=d.getDate();
  579. if(day < 10){
  580. day= "0"+ day;
  581. }
  582. var a = d.getFullYear() + "-" + month + "-" + day;
  583. $("#" + id).html(a);
  584. }, {
  585. title: "请选择日期",
  586. date: dDate,
  587. minDate: minDate,
  588. maxDate: maxDate
  589. });
  590. }
  591. var url = API.API_URL();
  592. mui.init();
  593. var viewApi = mui('#app').view({
  594. defaultPage: '#setting'
  595. });
  596. //初始化单页的区域滚动
  597. mui('.mui-scroll-wrapper').scroll({
  598. bounce: false, //滚动条是否有弹力默认是true
  599. indicators: false //是否显示滚动条
  600. });
  601. // mui("#pullrefresh").pullRefresh().setStopped(true);
  602. // mui('#pullrefresh').pullRefresh().setStopped(true); //暂时禁止滚动
  603. var view = viewApi.view;
  604. function test(o) {
  605. alert(o);
  606. };
  607. (function($, doc) {
  608. //处理view的后退与webview后退
  609. var oldBack = $.back;
  610. $.back = function() {
  611. if(viewApi.canBack()) { //如果view可以后退,则执行view的后退
  612. viewApi.back();
  613. } else { //执行webview后退
  614. oldBack();
  615. }
  616. };
  617. //监听页面切换事件方案1,通过view元素监听所有页面切换事件,目前提供pageBeforeShow|pageShow|pageBeforeBack|pageBack四种事件(before事件为动画开始前触发)
  618. //第一个参数为事件名称,第二个参数为事件回调,其中e.detail.page为当前页面的html对象
  619. view.addEventListener('pageBeforeShow',
  620. function(e) {
  621. console.log(e.detail.page.id + ' beforeShow');
  622. });
  623. view.addEventListener('pageShow', function(e) {
  624. console.log(e.detail.page.id + ' show');
  625. });
  626. view.addEventListener('pageBeforeBack', function(e) {
  627. console.log(e.detail.page.id + ' beforeBack');
  628. });
  629. view.addEventListener('pageBack', function(e) {
  630. console.log(e.detail.page.id + ' back');
  631. });
  632. })(mui);
  633. var vmA = new Vue({
  634. el: '#form_element',
  635. data: {
  636. items: [] //列表信息流数据
  637. }
  638. });
  639. var wheaend = "";
  640. var processSize = "";
  641. var driveSize = "";
  642. var whealltrip = "";
  643. mui.plusReady(function() {
  644. var url = API.API_URL();
  645. var self = plus.webview.currentWebview();
  646. var tripid = self.tripid;
  647. var trip_state = self.state;
  648. //alert(tripid)
  649. var serviceId = "oa_2018V001PHONE_tripdetail";
  650. var state = app.getState(); //获取登陆信息
  651. var staffId = state.user.useId; //获取登录id
  652. var obj = {
  653. tripid: tripid,
  654. };
  655. app.ajax(serviceId, obj, function(data) {
  656. //服务器返回响应
  657. console.log(JSON.stringify(data))
  658. var result = data.returnParams;
  659. var trip = data.trip;
  660. var tripprocess = data.tripprocess;
  661. var tripdrive = data.tripdrive;
  662. var tripman = data.tripman;
  663. var approveman = data.approveman;
  664. processSize = data.processSize;
  665. driveSize = data.driveSize;
  666. wheaend = data.wheaend;
  667. var tripdepart = trip[0].tripdepart;
  668. var tripnum = trip[0].tripnum;
  669. var address = trip[0].address;
  670. var tripmen = trip[0].name2;
  671. var bengintime = trip[0].bengintime;
  672. var endtime = trip[0].endtime;
  673. var triptotalday = trip[0].triptotalday;
  674. var wheacar = trip[0].wheacar;
  675. whealltrip = trip[0].whealltrip;
  676. var reason = trip[0].reason;
  677. if(trip_state == "完结"){
  678. $("#caozuo").css("display", "none");
  679. $("#size7").css("display", "block");
  680. var wanjie_approveday=trip[0].approveday;
  681. $("#size7_approveday").attr("value", wanjie_approveday);
  682. if(driveSize==1){
  683. $("#sizedayu5").css("display", "block");
  684. var wanjie_pcapproveday=tripdrive[0].pcapproveday;
  685. $("#sizedayu5_pcapproveday").attr("value", wanjie_pcapproveday);
  686. }
  687. if(driveSize==2){
  688. $("#size7_yc").css("display", "block");
  689. var wanjie_song_pcapproveday=tripdrive[0].pcapproveday;
  690. var wanjie_jie_pcapproveday=tripdrive[1].pcapproveday;
  691. $("#size7_song_approveday").attr("value", wanjie_song_pcapproveday);
  692. $("#last_approveday").attr("value", wanjie_jie_pcapproveday);
  693. $("#last_approveday").attr("readonly", "readonly");
  694. }
  695. }
  696. $("#tripid").attr("value", tripid);
  697. $("#tripdepart").attr("value", tripdepart);
  698. $("#tripnum").attr("value", tripnum);
  699. $("#address").html(address);
  700. $("#tripmen").attr("value", tripmen);
  701. $("#bengintime").html(bengintime);
  702. $("#endtime").html(endtime);
  703. $("#triptotalday").attr("value", triptotalday);
  704. if(wheacar == 1) {
  705. $("input[ name='wheacar']").eq(0).attr('checked', true);
  706. }
  707. if(wheacar == 2) {
  708. $("input[ name='wheacar']").eq(1).attr('checked', true);
  709. }
  710. if(whealltrip == 0) {
  711. $("#whealltrip").attr("value", "不派车");
  712. }
  713. if(whealltrip == 1) {
  714. $("#whealltrip").attr("value", "全程跟随");
  715. }
  716. if(whealltrip == 2) {
  717. $("#whealltrip").attr("value", "接");
  718. }
  719. if(whealltrip == 3) {
  720. $("#whealltrip").attr("value", "送");
  721. }
  722. if(whealltrip == 4) {
  723. $("#whealltrip").attr("value", "接和送");
  724. }
  725. $("#reason").html(reason);
  726. $("#tripmanid").attr("value", tripman);
  727. //alert(tripman)
  728. //console.log(trip.length);
  729. vmA.items = [];
  730. if(tripprocess.length > 0) {
  731. vmA.items = vmA.items.concat(tripprocess);
  732. }
  733. if(processSize == 2) {
  734. $("#nexthuanjietitle").html("下一环节:车队派车");
  735. }
  736. if(processSize == 3) {
  737. $("#paiche").css("display", "block");
  738. $("#onlypaiche").css("display", "block");
  739. $("#nexthuanjietitle").html("下一环节:领导审批");
  740. if(whealltrip == 1) {
  741. $("#paiche_type").html("全程跟随:");
  742. }
  743. if(whealltrip == 2) {
  744. $("#paiche_type").html("送:");
  745. }
  746. if(whealltrip == 3) {
  747. $("#paiche_type").html("接:");
  748. }
  749. if(whealltrip == 4) {
  750. $("#paiche_type").html("送:");
  751. $("#jie").css("display", "block");
  752. }
  753. }
  754. if(processSize == 4) {
  755. $("#nexthuanjietitle").html("下一环节:财务核对");
  756. }
  757. if(processSize == 5 && trip_state != "完结") {
  758. $("#size5").css("display", "block");
  759. $("#nexthuanjietitle").html("下一环节:车队长再次派车");
  760. if(driveSize==1){
  761. $("#div_pcapproveday").css("display", "block");
  762. }
  763. if(driveSize==2){
  764. $("#jiesong").css("display", "block");
  765. }
  766. }
  767. if(processSize == 6) {
  768. $("#paiche").css("display", "block");
  769. $("#jie").css("display", "block");
  770. $("#nexthuanjietitle").html("下一环节:财务再次审批");
  771. $("#sizedayu5").css("display", "block");
  772. var pcapproveday = tripdrive[0].pcapproveday;
  773. $("#sizedayu5_pcapproveday").attr("value", pcapproveday);
  774. }
  775. if(processSize == 7 && trip_state != "完结") {
  776. //财务审批出差人
  777. $("#size7").css("display", "block");
  778. var approveday = trip[0].approveday;
  779. $("#size7_approveday").attr("value", approveday);
  780. //财务审批送司机
  781. $("#size7_yc").css("display", "block");
  782. var pcapproveday = tripdrive[0].pcapproveday;
  783. $("#size7_song_approveday").attr("value", pcapproveday);
  784. }
  785. if(processSize >= 4) {//显示派车情况
  786. $("#xs_paiche").css("display", "block");
  787. $("#xs_onlypaiche").css("display", "block");
  788. var name3=tripdrive[0].name3;
  789. var pcbegintime=tripdrive[0].pcbegintime;
  790. var pcendtime=tripdrive[0].pcendtime;
  791. var pctotalday=tripdrive[0].pctotalday;
  792. var chepai=tripdrive[0].chepai;
  793. $("#xs_drive_name").attr("value", name3);
  794. $("#xs_chepainum").attr("value", chepai);
  795. $("#xs_yc_begintime").attr("value", pcbegintime);
  796. $("#xs_yc_endtime").attr("value", pcendtime);
  797. $("#xs_yc_triptotalday").attr("value", pctotalday);
  798. if(driveSize==1){
  799. var pcwhealltrip=tripdrive[0].pcwhealltrip;
  800. if(pcwhealltrip == 1) {
  801. $("#xs_paiche_type").html("全程跟随:");
  802. }
  803. if(pcwhealltrip == 2 || pcwhealltrip == 4) {
  804. $("#xs_paiche_type").html("送:");
  805. }
  806. if(pcwhealltrip == 3) {
  807. $("#xs_paiche_type").html("接:");
  808. }
  809. }
  810. if(driveSize==2){
  811. $("#xs_jie").css("display", "block");
  812. var pcwhealltrip=tripdrive[0].pcwhealltrip;
  813. $("#xs_paiche_type").html("送:");
  814. var name3_2=tripdrive[1].name3;
  815. var pcbegintime_2=tripdrive[1].pcbegintime;
  816. var pcendtime_2=tripdrive[1].pcendtime;
  817. var pctotalday_2=tripdrive[1].pctotalday;
  818. var chepai_2=tripdrive[1].chepai;
  819. $("#xs_drive_jie_name").attr("value", name3_2);
  820. $("#xs_jie_chepainum").attr("value", chepai_2);
  821. $("#xs_yc_jie_begintime").attr("value", pcbegintime_2);
  822. $("#xs_yc_jie_endtime").attr("value", pcendtime_2);
  823. $("#xs_yc_jie_triptotalday").attr("value", pctotalday_2);
  824. }
  825. }
  826. if(wheaend == "end") {
  827. $("#nexthj").css("display", "none");
  828. }
  829. });
  830. })
  831. var saveBtn = document.getElementById("saveBtn");
  832. saveBtn.addEventListener("click", function() {
  833. var btnArray = ['否', '是'];
  834. mui.confirm('确定要审核吗?', '警告', btnArray, function(e) {
  835. if(e.index == 1) { //确认
  836. var approveman = $("#approveman").val();
  837. //alert(approveman)
  838. if(wheaend == "noend") {
  839. if($("#approveman").val() == "") {
  840. alert('下一环节审批人不能为空');
  841. return false;
  842. }
  843. if($("#beizhu").val() == "") {
  844. alert('审批备注不能为空');
  845. return false;
  846. }
  847. }
  848. //科室审批
  849. var beizhu = $("#beizhu").val();
  850. var tripid = $("#tripid").val();
  851. var wheacar = $("input[name='wheacar']:checked").val();
  852. // wheaend;
  853. // processSize;
  854. // whealltrip;
  855. var s = "{";
  856. s += "tripid:'" + tripid + "',approveman:'" + approveman + "',processSize:'" + processSize +
  857. "',beizhu:'" + beizhu + "',wheacar:'" + wheacar + "',whealltrip:'" + whealltrip +
  858. "',wheaend:'" + wheaend+"'";
  859. //alert(s);
  860. if(processSize == 3){
  861. if($("#drive").val() == "") {
  862. alert('驾驶员不能为空');
  863. return false;
  864. }
  865. if($("#yc_begintime").html() == "") {
  866. alert('用车开始时间不能为空');
  867. return false;
  868. }
  869. if($("#yc_endtime").html() == "") {
  870. alert('用车结束时间不能为空');
  871. return false;
  872. }
  873. if($("#yc_triptotalday").val() == "") {
  874. alert('用车结束时间不能为空');
  875. return false;
  876. }
  877. if($("#chepainum").val() == "") {
  878. alert('用车结束时间不能为空');
  879. return false;
  880. }
  881. var drive_id=$("#drive").val();
  882. var yc_begintime=$("#yc_begintime").html();
  883. var yc_endtime=$("#yc_endtime").html();
  884. var yc_triptotalday=$("#yc_triptotalday").val();
  885. var chepainum=$("#chepainum").val();
  886. s+=",drive_id:'"+drive_id+"',yc_begintime:'"+yc_begintime+"',yc_endtime:'"+yc_endtime+
  887. "',yc_triptotalday:'"+yc_triptotalday+"',chepainum:'"+chepainum+"'";
  888. if(whealltrip == 4){
  889. var drive_jie_id=$("#drive_jie").val();
  890. var yc_jie_begintime=$("#yc_jie_begintime").html();
  891. var yc_jie_endtime=$("#yc_jie_endtime").html();
  892. var yc_jie_triptotalday=$("#yc_jie_triptotalday").val();
  893. var jie_chepainum=$("#jie_chepainum").val();
  894. if(drive_jie_id != "" && yc_jie_begintime != "" && yc_jie_endtime != ""
  895. && yc_jie_triptotalday != "" && jie_chepainum != "" ){
  896. s+=",drive_jie_id:'"+drive_jie_id+"',yc_jie_begintime:'"+yc_jie_begintime+"',yc_jie_endtime:'"+yc_jie_endtime+
  897. "',yc_jie_triptotalday:'"+yc_jie_triptotalday+"',jie_chepainum:'"+jie_chepainum+"'";
  898. }else{
  899. s+=",drive_jie_id:'"+""+"',yc_jie_begintime:'"+""+"',yc_jie_endtime:'"+""+
  900. "',yc_jie_triptotalday:'"+""+"',jie_chepainum:'"+""+"'";
  901. }
  902. }else{
  903. s+=",drive_jie_id:'"+""+"',yc_jie_begintime:'"+""+"',yc_jie_endtime:'"+""+
  904. "',yc_jie_triptotalday:'"+""+"',jie_chepainum:'"+""+"'";
  905. }
  906. }
  907. if(processSize == 5){
  908. if($("#approveday").val() == "") {
  909. alert('出差人审核天数不能为空');
  910. return false;
  911. }
  912. var approveday=$("#approveday").val();
  913. s+=",approveday:'"+approveday+"'";
  914. if(driveSize == 1){
  915. if($("#pcapproveday").val() == "") {
  916. alert('司机审核天数不能为空');
  917. return false;
  918. }
  919. var pcapproveday=$("#pcapproveday").val();
  920. s+=",pcapproveday:'"+pcapproveday+"',driveSize:'"+driveSize+"'";
  921. }
  922. if(driveSize == 2){
  923. if($("#song_approveday").val() == "") {
  924. alert('送去司机审核天数不能为空');
  925. return false;
  926. }
  927. if($("#jie_approveday").val() == "") {
  928. alert('接回司机审核天数不能为空');
  929. return false;
  930. }
  931. var song_approveday=$("#song_approveday").val();
  932. var jie_approveday=$("#jie_approveday").val();
  933. s+=",song_approveday:'"+song_approveday+"',jie_approveday:'"+jie_approveday+"',driveSize:'"+driveSize+"'";
  934. }
  935. }
  936. if(processSize == 6){//车队长再次派车
  937. if($("#drive_jie").val() == "") {
  938. alert('驾驶员不能为空');
  939. return false;
  940. }
  941. if($("#yc_jie_begintime").html() == "") {
  942. alert('用车开始时间不能为空');
  943. return false;
  944. }
  945. if($("#yc_jie_endtime").html() == "") {
  946. alert('用车结束时间不能为空');
  947. return false;
  948. }
  949. if($("#yc_jie_triptotalday").val() == "") {
  950. alert('合计天数不能为空');
  951. return false;
  952. }
  953. if($("#jie_chepainum").val() == "") {
  954. alert('车牌号不能为空');
  955. return false;
  956. }
  957. var drive_last_id=$("#drive_jie").val();
  958. var yc_last_begintime=$("#yc_jie_begintime").html();
  959. var yc_last_endtime=$("#yc_jie_endtime").html();
  960. var yc_last_triptotalday=$("#yc_jie_triptotalday").val();
  961. var last_chepainum=$("#jie_chepainum").val();
  962. s+=",drive_last_id:'"+drive_last_id+"',yc_last_begintime:'"+yc_last_begintime+"',yc_last_endtime:'"+yc_last_endtime+
  963. "',yc_last_triptotalday:'"+yc_last_triptotalday+"',last_chepainum:'"+last_chepainum+"'";
  964. }
  965. if(processSize == 7){//财务再次审批
  966. if($("#last_approveday").val() == "") {
  967. alert('审批天数不能为空');
  968. return false;
  969. }
  970. var last_approveday=$("#last_approveday").val();
  971. s+=",last_approveday:'"+last_approveday+"'";
  972. }
  973. s+= "}";
  974. mui.ajax(url, {
  975. type: 'POST',
  976. dataType: 'json',
  977. data: {
  978. 'serviceId': 'oa_2018V001PHONE_trippizhun',
  979. 'params': s,
  980. },
  981. headers: {
  982. 'Accept': 'application/json'
  983. },
  984. success: function(data) {
  985. console.log(JSON.stringify(data));
  986. if(data.returnCode == "0") {
  987. var returnParams = data.returnParams;
  988. var jieguo=returnParams.jieguo;
  989. if(jieguo == true) {
  990. mui.toast('审批成功');
  991. mui.back();
  992. var list = plus.webview.currentWebview().opener();
  993. //触发父页面的自定义事件(refresh),从而进行刷新
  994. mui.fire(list, 'refresh');
  995. //返回true,继续页面关闭逻辑
  996. return true;
  997. } else {
  998. mui.toast('审批失败');
  999. }
  1000. }
  1001. },
  1002. error: function(xhr, type, errorThrown) {
  1003. //异常处理;
  1004. console.log(xhr + "========" + type + "===========" + errorThrown);
  1005. }
  1006. });
  1007. } else {
  1008. }
  1009. })
  1010. })
  1011. var returnBth = document.getElementById("returnBth");
  1012. returnBth.addEventListener("click", function() {
  1013. if($("#beizhu").val() == "") {
  1014. alert('审批备注不能为空');
  1015. return false;
  1016. }
  1017. var tripid = $("#tripid").val();
  1018. var beizhu = $("#beizhu").val();
  1019. processSize
  1020. var btnArray = ['否', '是'];
  1021. mui.confirm('确定要驳回吗?', '警告', btnArray, function(e) {
  1022. if(e.index == 1) {//确认
  1023. mui.ajax(url, {
  1024. type: 'POST',
  1025. dataType: 'json',
  1026. data: {
  1027. 'serviceId': 'oa_2018V001PHONE_tripbohui',
  1028. 'params': '{tripid:"' + tripid + '",processSize:"' + processSize + '",beizhu:"' + beizhu + '"}'
  1029. },
  1030. headers: {
  1031. 'Accept': 'application/json'
  1032. },
  1033. success: function(data) {
  1034. console.log(JSON.stringify(data));
  1035. if(data.returnCode == "0") {
  1036. var returnParams = data.returnParams;
  1037. var jieguo=returnParams.jieguo;
  1038. if(jieguo == true) {
  1039. mui.toast('驳回成功');
  1040. mui.back();
  1041. var list = plus.webview.currentWebview().opener();
  1042. //触发父页面的自定义事件(refresh),从而进行刷新
  1043. mui.fire(list, 'refresh');
  1044. //返回true,继续页面关闭逻辑
  1045. return true;
  1046. } else {
  1047. mui.toast('驳回失败');
  1048. }
  1049. }
  1050. },
  1051. error: function(xhr, type, errorThrown) {
  1052. //异常处理;
  1053. console.log(xhr + "========" + type + "===========" + errorThrown);
  1054. }
  1055. });
  1056. }
  1057. else {
  1058. }
  1059. })
  1060. })
  1061. </script>
  1062. </body>
  1063. </html>