商丘12345 前端

addNotification.html 11KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <script src="../Script/Common/huayi.load.js"></script>
  6. <script src="../Script/Common/huayi.config.js"></script>
  7. <!--<link href="../js/bootstrap-select/css/bootstrap-select.css" rel="stylesheet" />-->
  8. <link rel="stylesheet" href="../js/zTree/zTreeStyle.css" />
  9. <link rel="stylesheet" href="../css/init.css" />
  10. <link rel="stylesheet" href="../css/notification/css/notifucation.css" />
  11. <link rel="stylesheet" href="../css/notification/css/addNotifucation.css">
  12. <title></title>
  13. <style type="text/css">
  14. .xl{
  15. right: -32px;
  16. }
  17. .orderType{
  18. /*width: 196px;*/
  19. height: 35px;
  20. }
  21. ul li{
  22. list-style: none;
  23. }
  24. .inpBox {
  25. border: 1px solid #cccccc;
  26. height: 31px;
  27. width: 77%;
  28. display: inline-block;
  29. position: relative;
  30. vertical-align: middle;
  31. position: absolute;
  32. /*left: 0px;
  33. top: 0px;*/
  34. z-index: 111;
  35. }
  36. .selDpart1{
  37. position: absolute;
  38. left: 0px;
  39. top: 30px;
  40. z-index: 11111;
  41. width: 220px;
  42. line-height: 30px;
  43. background: #FFFFFF;
  44. display: none;
  45. }
  46. #sponsor{
  47. width: 218px;
  48. border: 1px solid #00a1cb;
  49. margin: 0;
  50. padding: 0;
  51. list-style: none;
  52. max-height: 212px;
  53. overflow-x: hidden;
  54. overflow-y: scroll;
  55. }
  56. #sponsor li{
  57. margin: 0;
  58. padding-left: 10px;
  59. width: 220px;
  60. height: 30px;
  61. line-height: 30px;
  62. list-style: none;
  63. }
  64. #sponsor li:hover{
  65. background: #00a1cb;
  66. }
  67. .addTree {
  68. background: #fff;
  69. position: absolute;
  70. width: 100%;
  71. border: 1px solid darkgrey;
  72. right: 0;
  73. top: 29px;
  74. display: none;
  75. z-index: 222;
  76. }
  77. .xl {
  78. display: inline-block;
  79. background: url(../../img/dropDown.png) no-repeat;
  80. height: 100%;
  81. background-position: center center;
  82. width: 20px;
  83. position: absolute;
  84. right: 0;
  85. top: 0px;
  86. /* background-color: #f7bc8b; */
  87. cursor: pointer;
  88. }
  89. .ztree li span {
  90. border: none;
  91. padding: 0;
  92. }
  93. .inps {
  94. width: 76%;
  95. height: 29px;
  96. outline: none;
  97. border: 0;
  98. border-image-width: 0;
  99. padding: 0;
  100. padding-left: 3px;
  101. }
  102. .xl {
  103. display: inline-block;
  104. background: url(../img/dropDown.png) no-repeat;
  105. height: 100%;
  106. background-position: center center;
  107. width: 20px;
  108. position: absolute;
  109. right: 0;
  110. top: 0px;
  111. /* background-color: #f7bc8b; */
  112. cursor: pointer;
  113. }
  114. .Cleans {
  115. display: inline-block;
  116. width: 20px;
  117. position: absolute;
  118. right: 21px;
  119. top: 8px;
  120. display: none;
  121. }
  122. .reasons{
  123. display: none;
  124. }
  125. .other_reasons{
  126. width: 80%;
  127. position: absolute;
  128. }
  129. .other_contant{
  130. width: 80%;
  131. position: absolute;
  132. }
  133. </style>
  134. </head>
  135. <body>
  136. <div class="container" style="margin-left: 15px;">
  137. <div class="tab_contents" id="tab_user_contents">
  138. <ul class="project_items form-horizontal showtabs">
  139. <li class="form-group">
  140. <label for="customer_layer" class="col-md-2" >通报部门:</label>
  141. <div class="inpBox">
  142. <input type="text" class="inps" onkeyup="darptSearch()"/>
  143. <i class="Cleans fa fa-close"></i>
  144. <i class="xl xl_one"></i>
  145. <div class="addTree xlAdd">
  146. <ul id="addTreeDemo" class="ztree"></ul>
  147. </div>
  148. </div>
  149. </li>
  150. <li class="form-group">
  151. <label for="customer_layer" class="col-md-2" style="float: left;">通报原因:</label>
  152. <div class="col-md-9" style="width: 80%;position: absolute;left:110px;padding-left: 0;">
  153. <select name="" class="form-control orderType">
  154. <option value="0">请选择通报原因</option>
  155. </select>
  156. </div>
  157. </li>
  158. <li class="form-group drop_down reasons">
  159. <label for="customer_layer" class="col-md-2" style="float: left;">其他原因:</label>
  160. <textarea name="" rows="" cols="" class="other_reasons"></textarea>
  161. </li>
  162. <!--<li class="form-group drop_down">
  163. <label for="customer_layer" class="col-md-2" style="float: left;">通报内容:</label>
  164. <textarea name="" rows="" cols="" class="other_contant"></textarea>
  165. </li>-->
  166. </ul>
  167. <div class="form-group clearfix" style="text-align: center;">
  168. <div class="col-md-offset-5 col-md-10">
  169. <button class="project_save btn btn-primary" id="save_btns" type="submit">保存</button>
  170. </div>
  171. </div>
  172. </div>
  173. </div>
  174. <input type="hidden" id="PID" />
  175. <input type="hidden" id="Dpment" />
  176. <script type="text/javascript">
  177. $(function(){
  178. var id = helper.request.queryString("ids");
  179. tree();
  180. //所属分类下拉
  181. $('.inps').focus(function () {
  182. $('.xlAdd').css('display', 'block')
  183. })
  184. $('.xl').click(function () {
  185. if ($('.xlAdd').css('display') == 'block') {
  186. $('.xlAdd').css('display', 'none')
  187. } else {
  188. $('.xlAdd').css('display', 'block')
  189. }
  190. })
  191. $('.addTree').mouseleave(function () {
  192. $(this).css('display', 'none')
  193. })
  194. //清除
  195. $(".Cleans ").click(function () {
  196. $('.inps').val("");
  197. $("#PID").val("");
  198. $("#Dpment").val("");
  199. })
  200. //获取部门
  201. function tree() {
  202. $.get(huayi.config.callcenter_url + 'Department/GetDeptList', {
  203. "token": $.cookie("token"),
  204. // "pid": pid
  205. }, function (result) {
  206. result = $.parseJSON(result);
  207. $.fn.zTree.init($("#addTreeDemo"), setting1, result.data); //实例化树形图
  208. });
  209. }
  210. var setting1 = {
  211. data: {
  212. key: {
  213. name: "F_DeptName"
  214. },
  215. simpleData: {
  216. enable: true,
  217. idKey: "F_DeptId",
  218. pIdKey: "F_PartentId",
  219. rootPId: 0
  220. }
  221. },
  222. callback: {
  223. onClick: zTreeOnClick
  224. }
  225. };
  226. function zTreeOnClick(event, treeId, treeNode) {
  227. if (treeNode.level >= 2) {
  228. $('.inps').val(treeNode.F_DeptName);
  229. $("#PID").val(treeNode.F_DeptId);
  230. $("#Dpment").val(treeNode.F_DeptId);
  231. $(".Cleans").show();
  232. }
  233. };
  234. //通报原因
  235. getOrderType();
  236. function getOrderType() {
  237. $.get(huayi.config.callcenter_url + 'Dictionary/GetDicValueListByParentId', {
  238. "token": $.cookie("token"),
  239. pid: 62
  240. }, function(result) {
  241. result = $.parseJSON(result);
  242. var Count = result.data;
  243. $(Count).each(function(i, n) {
  244. $('<option value="' + n.F_ValueId + '">' + n.F_Value + '</option>').appendTo($(".orderType"));
  245. })
  246. });
  247. }
  248. $('.orderType').change(()=>{
  249. if($('.orderType').val()==76){
  250. $('.reasons').css('display','block')
  251. }else{
  252. $('.reasons').css('display','none')
  253. }
  254. })
  255. $('#save_btns').click(function() {
  256. if($('#PID').val() == '') {
  257. layer.confirm('请选择 部门!', {
  258. btn: ['确定']
  259. });
  260. return;
  261. }
  262. var customertype=$('.orderType').val();
  263. var noticeinfo=$('.orderType option:selected').text();
  264. if(customertype==0){
  265. customertype='';
  266. noticeinfo=''
  267. }else if(customertype==76 && !$('.other_reasons').val()){
  268. layer.msg('请填写其他原因')
  269. return
  270. }
  271. if(id){
  272. $.post(huayi.config.callcenter_url + 'NoticeCriticism/EditNotice', {
  273. nid:id,
  274. deptids:$('#PID').val(),
  275. noticeid:customertype,
  276. content: $('.other_reasons').val(),//其他原因
  277. noticeinfo: noticeinfo,//通报内容
  278. "token": $.cookie("token")
  279. }, function(result) {
  280. result = $.parseJSON(result);
  281. if(result.state.toLowerCase() == "success") {
  282. var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
  283. parent.layer.close(index); //再执行关闭
  284. parent.layer.msg("修改成功!");
  285. parent.$('#table1').bootstrapTable('refresh');
  286. }
  287. })
  288. }else{
  289. $.post(huayi.config.callcenter_url + 'NoticeCriticism/AddNotice', {
  290. deptids:$('#PID').val(),
  291. noticeid:customertype,
  292. content: $('.other_reasons').val(),//其他原因
  293. noticeinfo: noticeinfo,//通报内容
  294. "token": $.cookie("token")
  295. }, function(result) {
  296. result = $.parseJSON(result);
  297. if(result.state.toLowerCase() == "success") {
  298. var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
  299. parent.layer.close(index); //再执行关闭
  300. parent.layer.msg("保存成功!");
  301. parent.$('#table1').bootstrapTable('refresh');
  302. }
  303. })
  304. }
  305. })
  306. if(id) {
  307. $.get(huayi.config.callcenter_url + 'NoticeCriticism/GetNotice', {
  308. nid: id,
  309. "token": $.cookie("token")
  310. }, function(result) {
  311. result = $.parseJSON(result);
  312. if(result.state.toLowerCase() == "success") {
  313. var con = result.data;
  314. if(con.dModel.F_NoticeID==76){
  315. $('.reasons').css('display','block')
  316. }else{
  317. $('.reasons').css('display','none')
  318. }
  319. $('.inps').val(con.NoticeDeptName);//部门名称
  320. $("#PID").val(con.dModel.F_DeptIds);//部门id
  321. $('.orderType').val(con.dModel.F_NoticeID);//通报原因
  322. $('.other_reasons').val(con.dModel.F_Content);//其他原因
  323. }
  324. })
  325. }
  326. })
  327. </script>
  328. <!--<script src="../js/bootstrap-select/js/bootstrap-select.js"></script>-->
  329. <script src="../js/laydate/laydate.js"></script>
  330. <script src="../js/zTree/jquery.ztree.core.js"></script>
  331. </body>
  332. </html>