商丘市柘城县——前端

Work-bianji.html 9.2KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336
  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. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  9. <link href="../css/mui.min.css" rel="stylesheet" />
  10. <link href="../css/mui.picker.css" rel="stylesheet" />
  11. <link href="../css/mui.poppicker.css" rel="stylesheet" />
  12. <link rel="stylesheet" href="css/iconfont.css" />
  13. <link rel="stylesheet" href="css/inits.css" />
  14. <style>
  15. body{
  16. font-size: 14px;
  17. }
  18. .mui-bar-popover {
  19. width: 30%;
  20. }
  21. .mui-popover.mui-bar-popover .mui-table-view {
  22. width: 100%;
  23. }
  24. .mui-table-view .mui-table-view-cell>a:not(.mui-btn) {
  25. text-align: center;
  26. }
  27. .mui-table-view-cell {
  28. padding: 1px 15px!important;
  29. }
  30. .san {
  31. font-size: 14px;
  32. margin-right: 5px
  33. }
  34. .nav_a {
  35. border-right: 1px solid #ccc;
  36. }
  37. .radio_box {
  38. display: inline-block;
  39. }
  40. .mui-radio input[type=radio]:before {
  41. font-size: 20px;
  42. vertical-align: middle;
  43. }
  44. .mui-radio.mui-left input[type=radio] {
  45. line-height: 24px!important;
  46. }
  47. .mui-radio.mui-left label {
  48. padding-right: 1px!important;
  49. padding-left: 51px!important;
  50. }
  51. .ztext {
  52. width: 100%;
  53. margin: 0;
  54. border: 0;
  55. }
  56. .action {
  57. padding: 5px 15px;
  58. }
  59. .type_down {
  60. float: right!important;
  61. display: inline-block!important;
  62. vertical-align: middle!important;
  63. line-height: 42px;
  64. }
  65. .type_con {
  66. width: 55%!important;
  67. float: left!important;
  68. vertical-align: middle!important;
  69. display: inline-block!important;
  70. padding: 10px 0!important;
  71. }
  72. .label {
  73. width: 30%!important;
  74. padding: 11px 0px!important;
  75. }
  76. .get_yzm {
  77. padding: 5px!important;
  78. width: auto!important;
  79. }
  80. .yzm_con {
  81. float: left!important;
  82. width: 40%!important;
  83. }
  84. .mui-bar-nav {
  85. background-color: #00a1cb;
  86. }
  87. .mui-input-row label {
  88. text-align: -webkit-right;
  89. }
  90. .mui-input-row{
  91. font-size: 14px;
  92. }
  93. .mui-btn-block {
  94. padding: 10px;
  95. width: 100%;
  96. }
  97. .mui-input-row select {
  98. font-size: 14px;
  99. }
  100. .size-14{
  101. font-size: 14px;
  102. }
  103. input{
  104. font-size: 14px;
  105. }
  106. </style>
  107. </head>
  108. <body>
  109. <header class="mui-bar mui-bar-nav " style="padding-right: 15px;height: 50px;color: #fff;">
  110. <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" style="color: #fff;"></a>
  111. <h1 class="mui-center mui-title" style="color:#fff;">编辑工单</h1>
  112. </header>
  113. <div class="mui-content">
  114. <ul class="mui-table-view">
  115. <li class="mui-table-view-cell">
  116. <div class="mui-input-row">
  117. <label class="label">保密要求:</label>
  118. <div class="mui-input-row mui-radio mui-left radio_box">
  119. <label>保密</label>
  120. <input type="radio" type="radio" name="secret" value="1" />
  121. </div>
  122. <div class="mui-input-row mui-radio mui-left radio_box">
  123. <label>公开</label>
  124. <input type="radio" type="radio" name="secret" value="0" />
  125. </div>
  126. </div>
  127. </li>
  128. <li class="mui-table-view-cell">
  129. <div class="mui-input-row">
  130. <label class="label">紧急程度:</label>
  131. <div class="mui-input-row mui-radio mui-left radio_box">
  132. <label>普通</label>
  133. <input type="radio" type="radio" name="jinji" value="1" />
  134. </div>
  135. <div class="mui-input-row mui-radio mui-left radio_box">
  136. <label>紧急</label>
  137. <input type="radio" type="radio" name="jinji" value="2" />
  138. </div>
  139. </div>
  140. </li>
  141. <li class="mui-table-view-cell" id="showUserPicker">
  142. <div class=" mui-input-row mui-select">
  143. <label class="label">诉求类型:</label>
  144. <!--<input type="text" id='userResult' class="ui-alert type_con" data-index="" readonly="readonly" />-->
  145. <select name="" id="userResult">
  146. </select>
  147. </div>
  148. </li>
  149. <li class="mui-table-view-cell">
  150. <div class="mui-input-row">
  151. <label class="label">诉求主题:</label>
  152. <input type="text" id="title" placeholder="请填写您的诉求主题">
  153. </div>
  154. </li>
  155. <li class="mui-table-view-cell">
  156. <div class="mui-input-row">
  157. <label class="label">内容:</label>
  158. <textarea class="ztext content size-14" name="" id="textarea" rows="3" cols="" placeholder="请详细描述您的问题和建议..."></textarea>
  159. </div>
  160. </li>
  161. <li class="mui-table-view-cell">
  162. <div class="mui-input-row">
  163. <label class="label">投诉地址:</label>
  164. <input type="text" id="AreaName" placeholder="请填写您的称呼">
  165. </div>
  166. </li>
  167. <li class="mui-table-view-cell">
  168. <div class="mui-input-row">
  169. <label class="label">联系人:</label>
  170. <input type="text" id="name" placeholder="请填写您的称呼">
  171. </div>
  172. </li>
  173. <li class="mui-table-view-cell">
  174. <div class="mui-input-row">
  175. <label class="label">联系电话:</label>
  176. <input type="text" id="phone" placeholder="请填写联系电话">
  177. </div>
  178. </li>
  179. </ul>
  180. <p class="action">
  181. <i class="iconfont icon-gantanhao" style="margin-right: 5px;font-size: 20px;vertical-align: middle;"></i>
  182. <span style="color: #f81737;">以上内容都为必填内容,请如实填写</span>
  183. </p>
  184. <!--<button type="button" class="mui-btn mui-btn-primary mui-btn-block block_button">提交</button>-->
  185. <div style="padding: 10px;">
  186. <button type="button" data-loading-text="提交中" class="mui-btn mui-btn-primary mui-btn-block block_button submit">提交</button>
  187. </div>
  188. </div>
  189. <script src="../js/mui.min.js?"></script>
  190. <script src="../js/mui.picker.js"></script>
  191. <script src="../js/mui.poppicker.js"></script>
  192. <script src="../js/zepto.js"></script>
  193. <script src="../js/huayi.config.js"></script>
  194. <script type="text/javascript">
  195. mui.init({
  196. swipeBack: false,
  197. })
  198. mui.plusReady(function() {
  199. var wv = plus.webview.currentWebview();
  200. var vText = wv.token;
  201. var name = wv.name;
  202. if(name) {
  203. Select();
  204. $.ajax({
  205. type: "get",
  206. url: huayi.config.callcenter_url + 'WorkOrder/GetWorkOrder',
  207. async: false,
  208. data: {
  209. workorderid: name,
  210. "token": vText
  211. },
  212. dataType: 'json',
  213. success: function(result) {
  214. if(result.state.toLowerCase() == "success") {
  215. var Data = result.data.data;
  216. $("#name").val(Data[0].F_CusName);
  217. $("#AreaName").val(Data[0].AreaName+Data[0].F_SourceAddress);
  218. $("#phone").val(Data[0].F_CusPhone);
  219. $("#title").val(Data[0].F_ComTitle);
  220. $('.content').val(Data[0].F_ComContent);
  221. $("#userResult").val(Data[0].F_InfoType + '');
  222. $(' input[name="secret"][value="' + Data[0].F_IsProtect + '"]').prop("checked", "checked");
  223. $(' input[name="jinji"][value="' + Data[0].F_Level + '"]').prop("checked", "checked");
  224. }
  225. }
  226. });
  227. }
  228. //提交按钮
  229. $('.submit').on('tap', function() {
  230. if($('#name').val() == '') {
  231. mui.alert('请输入姓名!')
  232. } else if($('#phone').val() == '') {
  233. mui.alert('请输入联系电话!')
  234. } else if($('#title').val() == '') {
  235. mui.alert('请输入诉求主题!')
  236. } else if($('.content').val() == '') {
  237. mui.alert('请输入诉求内容!')
  238. } else {
  239. Submit()
  240. }
  241. })
  242. function Submit() {
  243. $.ajax({
  244. type: "post",
  245. url: huayi.config.callcenter_url + 'WorkOrder/EditWorkOrder',
  246. async: true,
  247. data: {
  248. workorderid: name,
  249. isprotect: $('input[name="secret"]:checked').val(), //(0普通1保密)
  250. level: $('input[name="jinji"]:checked').val(), //=(1普通2紧急)
  251. content: $('.content').val(), //投诉内容
  252. cusname: $('#name').val(), //投诉人姓名
  253. cusphone: $('#phone').val(), //投诉人电话
  254. sourceaddress: $('#AreaName').val(), //详细地址
  255. type: $("#userResult").val(),//类型
  256. title: $("#title").val(),
  257. issubmit: 1, //=(0保存1保存并提交)
  258. token: vText
  259. },
  260. success: function(data) {
  261. var str = JSON.parse(data);
  262. if(str.state.toLowerCase() == "success") {
  263. mui.toast('修改成功!');
  264. // $("#name").val('');
  265. // $("#phone").val('');
  266. // $("#title").val('');
  267. // $(".content").val('');
  268. // $("#cityResult3").val('');
  269. // $("#zhuTiResult").val('');
  270. // $("#userResult").val('');
  271. // $('#detail_address').val('');
  272. // $('input[name="secret"][value="0"]').prop("checked", "checked");
  273. var wobj = plus.webview.getWebviewById("WorkDetails");
  274. wobj.reload(true);
  275. }
  276. }
  277. });
  278. }
  279. function Select() {
  280. //工单类型
  281. $.ajax({
  282. type: "get",
  283. url: huayi.config.callcenter_url + 'Dictionary/GetDicValueListById?',
  284. async: false,
  285. data: {
  286. token: vText,
  287. id: 2
  288. },
  289. dataType: 'json',
  290. success: function(data) {
  291. var type_data = data.data;
  292. $(type_data).each(function(i, n) {
  293. $("<option value='" + n.F_ValueId + "'>" + n.F_Value + "</option>").appendTo("#userResult");
  294. })
  295. }
  296. });
  297. }
  298. });
  299. </script>
  300. </body>
  301. </html>