商丘12345 前端

index.js 13KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467
  1. $(function() {
  2. var mySwiper = new Swiper('.swiper-container', {
  3. // loop: true,
  4. // autoplay: {
  5. // delay: 60000,
  6. // },
  7. pagination: { /* 分页器*/
  8. el: '.swiper-pagination',
  9. clickable: true,
  10. },
  11. navigation: {
  12. nextEl: '.swiper-button-next',
  13. prevEl: '.swiper-button-prev',
  14. },
  15. // followFinger : false,
  16. // speed:800,
  17. on: {
  18. init: function() {
  19. swiperAnimateCache(this); //隐藏动画元素
  20. swiperAnimate(this); //初始化完成开始动画
  21. },
  22. transitionEnd: function() {
  23. swiperAnimate(this); //每个slide切换结束时也运行当前slide动画
  24. },
  25. }
  26. })
  27. Ajax();
  28. deprtment();// 第五屏部门下拉
  29. laydate.render({
  30. elem: '#time1',
  31. range: '~',
  32. format: 'yyyy-MM-dd',
  33. theme: '#114a97',
  34. done: function(value, date) {
  35. oneScreen(value && value.split(' ~ ')[0], value && value.split(' ~ ')[1])
  36. }
  37. });
  38. laydate.render({
  39. elem: '#time2',
  40. range: '~',
  41. format: 'yyyy-MM-dd',
  42. theme: '#114a97',
  43. done: function(value, date) {
  44. twoScreen(value && value.split(' ~ ')[0], value && value.split(' ~ ')[1],$(".areaTwo").val())
  45. satisfaction(value && value.split(' ~ ')[0], value && value.split(' ~ ')[1],$(".areaTwo").val())
  46. }
  47. });
  48. laydate.render({
  49. elem: '#time3',
  50. format: 'yyyy-MM-dd',
  51. theme: '#114a97',
  52. done: function(value) {
  53. threeScreen(value,$(".areaThree").val())
  54. }
  55. });
  56. laydate.render({
  57. elem: '#test6',
  58. range: '~',
  59. format: 'yyyy-MM-dd',
  60. theme: '#114a97',
  61. done: function(value, date) {
  62. fiveScreen(value && value.split(' ~ ')[0], value && value.split(' ~ ')[1],$(".areaFive").val())
  63. }
  64. });
  65. })
  66. var cityObj = {
  67. ele1: "sqs_count",
  68. ele2: "syq_count",
  69. ele3: "lyq_count",
  70. ele4: "ycs_count",
  71. ele5: "mqx_count",
  72. ele6: "sx_count",
  73. ele7: "nlx_count",
  74. ele8: "zcx_count",
  75. ele9: "ycx_count",
  76. ele10: "xyx_count",
  77. ele11: "cxyt_count",
  78. ele12: "lhpz_count",
  79. ele13: "saz_count",
  80. ele14: "djbl_count"
  81. }
  82. var vars = {};
  83. getCountUp(cityObj)
  84. function getCountUp(obj1) {
  85. var options = {  
  86. useEasing: true,
  87.   useGrouping: true,
  88.   separator: ',',
  89.   decimal: '.',
  90. };
  91. $.each(obj1, function(k, v) {
  92. new CountUp(v, 0, 0, 0, 2, options).start()
  93. vars[v] = new CountUp(v, 0, 0, 0, 2, options)
  94. })
  95. }
  96. var myDate = new Date();
  97. function turn(aa) {
  98. if(aa < 10) {
  99. aa = "0" + aa;
  100. }
  101. return aa
  102. }
  103. // 第三屏 第四屏 发光外框 定时
  104. (function() {
  105. var i = 0;
  106. var length = $(".orderState_ul >li").length;
  107. var j = 0;
  108. var length_1 = $(".orderTtype_Con li").length;
  109. setInterval(function() {
  110. if(i == length) {
  111. i = 0;
  112. $(".orderState_ul >li").removeClass('active');
  113. }
  114. $(".orderState_ul >li").eq(i).addClass('active').siblings().removeClass('active');
  115. if(i == 5) {
  116. $(".orderState_ul >li").eq(4).removeClass('active');
  117. }
  118. i++;
  119. if(j == length_1) {
  120. j = 0;
  121. }
  122. $(".orderTtype_Con li").eq(j).addClass('active').siblings().removeClass('active');
  123. j++;
  124. }, 2000);
  125. })();
  126. //第一屏幕 开始
  127. function oneScreen(sd,ed) {
  128. $.ajax({
  129. type: "get",
  130. url: huayi.config.callcenter_url + "/info/GetAreaCountByDateNew",
  131. async: true,
  132. dataType: 'json',
  133. data: {
  134. start: sd,
  135. end: ed,
  136. },
  137. success: function(data) {
  138. if(data.state.toLowerCase() == 'success') {
  139. var con = data.data;
  140. $(con).each(function(i, n) {
  141. if(n.AreaName.indexOf('睢阳区') != -1) {
  142. $(".SYQ_num").html(n.SLCount)
  143. }
  144. if(n.AreaName.indexOf('梁园区') != -1) {
  145. $(".LYQ_num").html(n.SLCount)
  146. }
  147. if(n.AreaName.indexOf('民权县') != -1) {
  148. $(".MQ_num").html(n.SLCount)
  149. }
  150. if(n.AreaName.indexOf('睢县') != -1) {
  151. $(".SX_num").html(n.SLCount)
  152. }
  153. if(n.AreaName.indexOf('宁陵县') != -1) {
  154. $(".NL_num").html(n.SLCount)
  155. }
  156. if(n.AreaName.indexOf('柘城县') != -1) {
  157. $(".ZC_num").html(n.SLCount)
  158. }
  159. if(n.AreaName.indexOf('虞城县') != -1) {
  160. $(".YCX_num").text(n.SLCount)
  161. }
  162. if(n.AreaName.indexOf('夏邑县') != -1) {
  163. $(".XYX_num").html(n.SLCount)
  164. }
  165. if(n.AreaName.indexOf('城乡一体化示范区') != -1) {
  166. $(".KFQ_num").html(n.SLCount)
  167. }
  168. if(n.AreaName.indexOf('总计') != -1) {
  169. $(".allSLCount").html(n.SLCount); //受理量
  170. $(".allJACount").html(n.JACount); //结案量
  171. //$(".allJARate").html(n.JARate); //结案量
  172. $(".allJARate").html("93%"); //结案量
  173. $(".allMYRate").html(n.MYRate); //满意度
  174. }
  175. })
  176. }
  177. }
  178. });
  179. }
  180. //第二屏
  181. function twoScreen(start, end, areaTwoVal) {
  182. // if(!areaTwoVal) {
  183. // areaTwoVal = "sqs12345"
  184. // }
  185. $.ajax({
  186. type: "get",
  187. url: huayi.config.callcenter_url + "info/GetSourceByDateNew",
  188. async: true,
  189. dataType: 'json',
  190. data: {
  191. start: start,
  192. end: end,
  193. branchcode: areaTwoVal
  194. },
  195. success: function(data) {
  196. if(data.state.toLowerCase() == 'success') {
  197. //layer.close(index);
  198. $('.orderSource ul li .rectangle').remove();
  199. var con = data.data;
  200. var obj=con[0];
  201. var con_list=[];
  202. con_list=con.shift();
  203. con.splice(3,0,obj);
  204. var Percent;
  205. $(con).each(function(i, n) {
  206. if(n.Source.indexOf('信箱') != -1) {
  207. n.Source = '信箱'
  208. }
  209. if(n.Source.indexOf('APP') != -1) {
  210. n.Source = 'APP'
  211. }
  212. if(n.Source.indexOf('政务') != -1) {
  213. n.Source = '政务网'
  214. }
  215. var str = '<div class="source_kuang rectangle">' +
  216. '<div class="pbout">' +
  217. '<div class="percent_box">' +
  218. '<div class="percent_out"></div> ' +
  219. ' <div class="percent_in"></div>' +
  220. ' <div class="percent_word"><p>' + n.Rate.split('%')[0] + '</p>%<p style="margin-top: 16px;">占总量</p>' +
  221. '</div>' +
  222. '</div>' +
  223. '</div>' +
  224. '<p class="num_word">' +
  225. '<span>' + n.Source + '</span><span>' + n.Count + '</span>' +
  226. '</p>' +
  227. '</div>'
  228. $('.orderSource ul li').eq(i).prepend(str)
  229. })
  230. }
  231. }
  232. });
  233. }
  234. //第三屏
  235. function threeScreen(sd,areaTwoVal) {
  236. $.ajax({
  237. type: "get",
  238. url: huayi.config.callcenter_url + "Info/GetTypeCountNew",
  239. async: true,
  240. dataType: 'json',
  241. data: {
  242. date: sd,
  243. branchcode: areaTwoVal
  244. },
  245. success: function(data) {
  246. if(data.state.toLowerCase() == 'success') {
  247. $('.orderTtype_Con ul').html('');
  248. // layer.close(index);
  249. var con = data.data;
  250. var img_name = '';
  251. $(con).each(function(i, n) {
  252. if(n.TypeName.indexOf('咨询') != -1) {
  253. img_name = 'order_ZX.png'
  254. }
  255. if(n.TypeName.indexOf('求助') != -1) {
  256. img_name = 'order_QZ.png'
  257. }
  258. if(n.TypeName.indexOf('投诉') != -1) {
  259. img_name = 'order_TS.png'
  260. }
  261. if(n.TypeName.indexOf('建议') != -1) {
  262. img_name = 'order_JY.png'
  263. }
  264. if(n.TypeName.indexOf('表扬') != -1) {
  265. img_name = 'order_BY.png'
  266. }
  267. if(n.TypeName.indexOf('其他') != -1) {
  268. img_name = 'order_QT.png'
  269. }
  270. $('<li>' +
  271. '<div class="typeWord">' + n.TypeName + '</div>' +
  272. '<img src="img/' + img_name + '" alt="" />' +
  273. '<p class="typeWord_line">数据展示</p>' +
  274. '<p class="order_count">' + n.DayCount + '</p>' +
  275. '<p class="typeWord_line">今日' + n.TypeName + '量</p>' +
  276. '<p class="order_count">' + n.MonthCount + '</p>' +
  277. '<p class="typeWord_line">本月' + n.TypeName + '量</p>' +
  278. '<p class="order_count">' + n.TotalCount + '</p>' +
  279. '<p class="typeWord_line">' + n.TypeName + '总量</p>' +
  280. '<div class="persent_box">' +
  281. '<div class="persent_kuang">' + n.Percent + '</div>' +
  282. '</div>' +
  283. '<p class="persent_word">总计类型占比</p>' +
  284. '</li>').appendTo('.orderTtype_Con ul');
  285. })
  286. }
  287. }
  288. });
  289. }
  290. //第五屏js
  291. function fiveScreen(sd,ed,areaTwoVal) {
  292. // if(!sd){
  293. // sd="2019-11-01"
  294. // }if(!ed){
  295. // ed="2019-11-30"
  296. // }
  297. keyWord(sd, ed,areaTwoVal);
  298. }
  299. $(".depart").change(function() {
  300. keyWordDetail($('#test6').val() && $('#test6').val().split(' ~ ')[0], $('#test6').val() && $('#test6').val().split(' ~ ')[1],$(".areaFive").val());
  301. })
  302. // 第二屏
  303. $(".areaTwo").change(function() {
  304. var areaTwoVal=$(this).val();
  305. twoScreen($('#time2').val() && $('#time2').val().split(' ~ ')[0], $('#time2').val() && $('#time2').val().split(' ~ ')[1],areaTwoVal);
  306. satisfaction($('#time2').val() && $('#time2').val().split(' ~ ')[0], $('#time2').val() && $('#time2').val().split(' ~ ')[1],areaTwoVal)
  307. });
  308. //第三屏
  309. $(".areaThree").change(function() {
  310. var areaTwoVal=$(this).val();
  311. threeScreen($('#time3').val(),areaTwoVal);
  312. });
  313. //第五屏
  314. $(".areaFive").change(function() {
  315. var areaTwoVal=$(this).val();
  316. fiveScreen($('#test6').val() && $('#test6').val().split(' ~ ')[0], $('#test6').val() && $('#test6').val().split(' ~ ')[1],areaTwoVal);
  317. deprtment ()
  318. });
  319. //部门下拉框
  320. function deprtment () {
  321. $.getJSON( huayi.config.callcenter_url +"info/GetDeptList",
  322. {
  323. branchcode: $(".areaFive").val()
  324. },
  325. function(result) {
  326. if(result.state.toLowerCase() == "success") {
  327. goodslist = result.data;
  328. $(".depart").empty();
  329. $('<option value="">请选择部门</option>').appendTo($(".depart"));
  330. $(goodslist).each(function(i, n) {
  331. $('<option value="' + n.F_DeptId
  332. + '">' + n.F_DeptName
  333. + '</option>').appendTo($(".depart"));
  334. })
  335. }
  336. });
  337. }
  338. //区县筛选
  339. areaSelect ();
  340. function areaSelect () {
  341. $.getJSON( huayi.config.callcenter_url +"CountyBranch/GetBranchListS", function(result) {
  342. if(result.state.toLowerCase() == "success") {
  343. goodslist = result.data;
  344. // 第五屏
  345. $(".areaFive").empty();
  346. $(goodslist).each(function(i, n) {
  347. $('<option value="' + n.F_Code
  348. + '">' + n.F_Name
  349. + '</option>').appendTo($(".areaFive"));
  350. });
  351. //第3屏
  352. $(".areaThree").empty();
  353. $(goodslist).each(function(i, n) {
  354. $('<option value="' + n.F_Code
  355. + '">' + n.F_Name
  356. + '</option>').appendTo($(".areaThree"));
  357. });
  358. //第2屏
  359. $(".areaTwo").empty();
  360. $(goodslist).each(function(i, n) {
  361. $('<option value="' + n.F_Code
  362. + '">' + n.F_Name
  363. + '</option>').appendTo($(".areaTwo"));
  364. });
  365. }
  366. });
  367. }
  368. // 左侧关键词
  369. function keyWord(sd, ed,areaTwoVal) {
  370. $.ajax({
  371. type: "get",
  372. url: huayi.config.callcenter_url + "info/GetKeyCountRankByDate",
  373. async: true,
  374. dataType: 'json',
  375. data: {
  376. start: sd,
  377. end: ed,
  378. branchcode: areaTwoVal
  379. },
  380. success: function(data) {
  381. if(data.state.toLowerCase() == 'success') {
  382. var con = data.data;
  383. if (con.length>0) {
  384. // $(".keyW_t").text(con[0].TypeName)
  385. $('.tagcloud').html('');
  386. $(con).each(function(k, j) {
  387. if(k < 12) {
  388. var strs = '<div index="'+j.Id+'" class="tagcloud_bj">' +
  389. '<p class="tag_title">' + j.TypeName + '</p>' +
  390. '<p class="imgs">' + j.Count + '</p>' +
  391. '</div>'
  392. $('.tagcloud').append(strs);
  393. }
  394. })
  395. $(".tagcloud div:first-child").removeClass("tagcloud_bj");
  396. $(".tagcloud div:first-child").addClass("tagcloud_bjShine");
  397. keyWordDetail(sd, ed,areaTwoVal);
  398. }else{
  399. $('.tagcloud').html('');
  400. }
  401. }
  402. }
  403. });
  404. }
  405. // 右侧部门
  406. function keyWordDetail(sd, ed,areaTwoVal) {
  407. $.ajax({
  408. type: "get",
  409. url: huayi.config.callcenter_url + "info/GetDeptKeyCountByDateNew",
  410. async: true,
  411. dataType: 'json',
  412. data: {
  413. start: sd,
  414. end: ed,
  415. branchcode: areaTwoVal,
  416. deptid: $('.depart').val(),
  417. keyid: $(".tagcloud_bjShine").eq(0).attr("index")
  418. },
  419. success: function(data) {
  420. if(data.state.toLowerCase() == 'success') {
  421. $('.scroll_table tbody').html('');
  422. var con = data.data;
  423. $(con).each(function (j, n) {
  424. var rate = '';
  425. if (n.rate) { rate = n.rate;}
  426. var str = '<tr><td>' + n.deptname + '</td><td>' + n.acceptcount + '</td><td>' + rate + '</td></tr>'
  427. $('.scroll_table tbody').append(str);
  428. })
  429. $(".scroll_table").Scroll({
  430. line: 1,
  431. speed: 500,
  432. timer: 2000
  433. });
  434. }
  435. }
  436. });
  437. }
  438. $(".tagcloud").on("click","div",function(){
  439. $(".tagcloud div").addClass("tagcloud_bj");
  440. $(".tagcloud div").removeClass("tagcloud_bjShine");
  441. $(this).removeClass("tagcloud_bj");
  442. $(this).addClass("tagcloud_bjShine");
  443. keyWordDetail($('#test6').val() && $('#test6').val().split(' ~ ')[0], $('#test6').val() && $('#test6').val().split(' ~ ')[1],$(".areaFive").val());
  444. });
  445. function Ajax() {
  446. oneScreen($('#time1').val() && $('#time1').val().split(' ~ ')[0], $('#time1').val() && $('#time1').val().split(' ~ ')[1])
  447. twoScreen($('#time2').val() && $('#time2').val().split(' ~ ')[0], $('#time2').val() && $('#time2').val().split(' ~ ')[1])
  448. satisfaction($('#time2').val() && $('#time2').val().split(' ~ ')[0], $('#time2').val() && $('#time2').val().split(' ~ ')[1])
  449. threeScreen($('#time3').val(),$(".areaThree").val());
  450. fiveScreen($('#test6').val() && $('#test6').val().split(' ~ ')[0], $('#test6').val() && $('#test6').val().split(' ~ ')[1],$(".areaFive").val())
  451. }