change-back.js 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335
  1. var reqList = []; //记录请求的参数和url,用于后退时使用
  2. Vue.use(Vuedals.default);
  3. new Vue({
  4. el: "#main",
  5. data: {
  6. appname: "退改签",
  7. isback: true,
  8. isrefresh: true,
  9. isfilter: false,
  10. isopen: false,
  11. //请求页面所需参数
  12. level: '',
  13. area: '',
  14. areaTitle: '',
  15. index: '9',
  16. selectedDateType: 1, //折线图坐标值1-日,2-周,3-月
  17. endDate: '',
  18. startDate: '',
  19. lowLevel: '',
  20. chooseYear: '',
  21. userRole: '',
  22. //数据结果
  23. topDatas: {
  24. index_2: 0,
  25. index_9: 0,
  26. index_10: 0
  27. }
  28. },
  29. components: {
  30. vuedals: Vuedals.Component
  31. },
  32. methods: {
  33. changeTag: function(val) {
  34. this.index = val;
  35. loadData([1, 2], this);
  36. //存储请求所带的参数
  37. reqList.push({
  38. level: this.level,
  39. area: this.area,
  40. areaTitle: this.areaTitle,
  41. index: this.index,
  42. date:this.endDate,
  43. endDate: this.endDate,
  44. startDate: this.startDate,
  45. lowLevel: this.lowLevel
  46. })
  47. },
  48. getNewLineData: function(arg) {
  49. this.selectedDateType = arg.dateType;
  50. loadData([1], this);
  51. },
  52. getAreaData: function(arg) {
  53. //如果level改变,则需要重新加载整个页面的数据,否则只需加载底部区域数据
  54. if(arg.level == this.level) {
  55. this.lowLevel = arg.lowLevel;
  56. loadData([2], this);
  57. } else {
  58. this.level = arg.level;
  59. this.lowLevel = arg.lowLevel;
  60. this.area = arg.area;
  61. this.areaTitle = arg.areaTitle;
  62. loadData([0, 1, 2], this);
  63. }
  64. EventBus.$emit('update-area-name', {areaName: this.areaTitle});
  65. //存储请求所带的参数
  66. reqList.push({
  67. level: this.level,
  68. area: this.area,
  69. areaTitle: this.areaTitle,
  70. index: this.index,
  71. endDate: this.endDate,
  72. startDate: this.startDate,
  73. lowLevel: this.lowLevel,
  74. })
  75. }
  76. },
  77. mounted: function() {
  78. //初始化数据
  79. initData(this);
  80. //获得顶部各tab的值
  81. loadData([0, 1, 2], this); //参数组数表示请求的区域为上中下
  82. //存储请求所带的参数
  83. reqList.push({
  84. level: this.level,
  85. area: this.area,
  86. areaTitle: this.areaTitle,
  87. index: this.index,
  88. endDate: this.endDate,
  89. startDate: this.startDate,
  90. lowLevel: this.lowLevel
  91. });
  92. //设置监听器, 监听折线图日期变化
  93. var vm = this;
  94. //监听后退按钮的操作
  95. EventBus.$on("back-click", function(arg) {
  96. EventBus.$emit('update-statistics-time', {}); //更新统计时间
  97. if(reqList.length == 1) {
  98. history.go(-1);
  99. } else {
  100. var preInfo = reqList.pop();
  101. var info = reqList[reqList.length - 1];
  102. vm.level = info.level;
  103. vm.area = info.area;
  104. vm.areaTitle = info.areaTitle;
  105. vm.lowLevel = info.lowLevel;
  106. vm.index = info.index;
  107. loadData([0, 1, 2], vm);
  108. EventBus.$emit('update-area-name', {areaName: vm.areaTitle});
  109. }
  110. });
  111. //监听页面刷新
  112. EventBus.$on("refresh-click", function(arg) {
  113. EventBus.$emit('update-statistics-time', {}); //更新统计时间
  114. loadData([0, 1, 2], vm);
  115. });
  116. $("#main").removeClass("c-hide");
  117. }
  118. })
  119. function initData(vm) {
  120. //获得缓存中缓存的角色权限
  121. var userRole = window.sessionStorage.getItem("selectedRole");
  122. if(!userRole) {
  123. return false;
  124. }
  125. vm.userRole = JSON.parse(userRole);
  126. vm.level = vm.userRole.code == '350200' ? 4 : vm.userRole.code.length == 6 ? 3 : 2;
  127. vm.area = vm.userRole.code;
  128. vm.areaTitle = vm.userRole.name;
  129. var now = new Date();
  130. if(now.getMonth() >= 6) {
  131. vm.chooseYear = now.getFullYear();
  132. } else {
  133. vm.chooseYear = now.getFullYear() - 1;
  134. }
  135. vm.startDate = getStartDate(vm.chooseYear);
  136. vm.endDate = getEndDate(vm.chooseYear);
  137. //更新头部信息
  138. EventBus.$emit('update-all-prompt-info', {
  139. areaName: vm.areaTitle,
  140. selectDate: "",
  141. dimensionVal: vm.analysisName
  142. });
  143. }
  144. function getTopReqParams(index1, vm) {
  145. var url = "/statistics/index_all",
  146. data = {
  147. index: index1,
  148. level: vm.level,
  149. area: vm.area,
  150. startDate: vm.startDate,
  151. endDate: vm.endDate
  152. };
  153. return {
  154. url: url,
  155. data: data
  156. };
  157. }
  158. function getTopTagDatas(vm) {
  159. var reqs = [],
  160. indexs = ['2', '9', '10'];
  161. for(i = 0; i < indexs.length; i++) {
  162. var item = getTopReqParams(indexs[i], vm);
  163. reqs.push(httpRequest.get(item.url, {
  164. data: item.data
  165. }));
  166. }
  167. Promise.all(reqs).then(function(ress) {
  168. for(i = 0; i < ress.length; i++) {
  169. var res = ress[i];
  170. if(res.status == 200) {
  171. for(key in res.data) {
  172. vm.topDatas[key] = res.data[key];
  173. }
  174. } else {
  175. console.log(res.msg);
  176. }
  177. }
  178. })
  179. }
  180. function initReqParams(vm) {
  181. reqParam = [{
  182. url: "/statistics/interval_total",
  183. reqType: 'get',
  184. data: {
  185. index: vm.index,
  186. level: vm.level,
  187. area: vm.area,
  188. startDate: vm.startDate,
  189. endDate: vm.endDate,
  190. interval: vm.selectedDateType
  191. }
  192. }, {
  193. url: "/statistics/lowlevel_all",
  194. reqType: 'get',
  195. data: {
  196. sort: 1,
  197. date: vm.endDate,
  198. level: vm.level,
  199. index: vm.index,
  200. area: vm.area
  201. }
  202. }];
  203. if(vm.lowLevel) {
  204. reqParam[1].data.lowLevel = vm.lowLevel;
  205. }
  206. return reqParam;
  207. }
  208. function loadData(loadArr, vm) {
  209. if(loadArr.indexOf(0) > -1) {
  210. getTopTagDatas(vm);
  211. }
  212. //获取其他请求的参数
  213. var reqParams = initReqParams(vm),
  214. reqPromise = [],
  215. newArr = []; //记录非顶部请求的请求数组
  216. for(i = 0; i < loadArr.length; i++) {
  217. if(loadArr[i] == 0) {
  218. // do nothing
  219. } else {
  220. var j = loadArr[i] - 1;
  221. var param = reqParams[j];
  222. reqPromise.push(httpRequest.get(param.url, {
  223. data: param.data
  224. }));
  225. newArr.push(loadArr[i]);
  226. }
  227. }
  228. if(reqPromise.length > 0) {
  229. Promise.all(reqPromise).then(function(ress) {
  230. var res1 = [],
  231. res2 = [];
  232. if(ress.length==2){
  233. res1 = ress[0] || [],
  234. res2 = ress[1] || [];
  235. }
  236. if(loadArr[0]==1){//点击日周月
  237. res1 = ress[0] || [];
  238. }
  239. if(loadArr[0]==2){//点击区、社区
  240. res2 = ress[0] || [];
  241. }
  242. if(res1 && res1.status == 200) {
  243. handleSecondPanelData(res1.data, vm);
  244. }
  245. if(res2) {
  246. if(res2.status == 200) {
  247. listHandle(res2.data, vm);
  248. } else {
  249. console.log(res2.msg);
  250. }
  251. }
  252. })
  253. }
  254. }
  255. function handleSecondPanelData(data, vm) {
  256. var xDatas = [],
  257. yDatas = [],
  258. names = [],
  259. colors = ['#12b7f5'],
  260. labels = {
  261. '2': '退签人数新增趋势',
  262. '9': '待审核数新增趋势',
  263. '10': '改签人数新增趋势'
  264. },
  265. index_names = {
  266. 'index_2': '退签人数',
  267. 'index_9': '待审核数',
  268. 'index_10': '改签人数'
  269. };
  270. for(var p in data) {
  271. names.push(index_names[p]);
  272. var xData = _.map(data[p].data, function(o) {
  273. return o.range;
  274. });
  275. var yData = _.map(data[p].data, function(o) {
  276. return o.amount;
  277. });
  278. xDatas.push(xData);
  279. yDatas.push(yData);
  280. }
  281. EventBus.$emit("draw-line-chart", {
  282. panelName: labels[vm.index],
  283. quotaNames: names,
  284. xData: xDatas[0],
  285. yDatas: yDatas,
  286. colors: colors
  287. });
  288. }
  289. function listHandle(data, vm) {
  290. for(i in data) {
  291. var list = data[i];
  292. var topArr = [];
  293. topArr = soreRank(getKeyValueArr(list, 'amount'));
  294. var arr = _.map(list, function(o, index) {
  295. var cols = [o.name];
  296. cols.push(o.amount);
  297. return {
  298. rank: topArr[index],
  299. code: o.code,
  300. name: o.name,
  301. cols: cols
  302. }
  303. });
  304. var headers = {
  305. '2': ["排名", "退签人数"],
  306. '9': ["排名", "待审核数"],
  307. '10': ["排名", "改签人数"]
  308. };
  309. EventBus.$emit("render-area-data", {
  310. level: vm.level,
  311. area: vm.area,
  312. lowLevel: vm.lowLevel,
  313. headers: headers[vm.index],
  314. rows: arr
  315. });
  316. }
  317. }