prescription-analysis.js 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586
  1. var reqList = [];
  2. var agePie,
  3. ageBar;
  4. Vue.use(Vuedals.default);
  5. new Vue({
  6. el: "#main",
  7. data: {
  8. //页面请求参数
  9. level: '',
  10. area: '',
  11. areaTitle: '',
  12. userRole: {},
  13. lowLevel: '3', //市级对应lowLevel为3,逐级递减
  14. dateType: 1, //折线图坐标值1-日,2-周,3-月
  15. startDate: "",
  16. endDate: "",
  17. sDate: "", //折线图中自定义的时间
  18. eDate: "", //折线图中自定义的时间
  19. tagCode: 1, //顶部各个tag标签对应的值
  20. sumType: 1, //记录从筛选页面选择的统计维度 1-订单统计,2-费用统计,3-配送统计,4-年龄统计
  21. sumTypeName: "订单统计",
  22. disease: "", //疾病类型
  23. diseaseName: "全部",
  24. chooseYear: '',
  25. dateValue: [],
  26. orderTagDatas: {
  27. total: 0,
  28. finishCount: 0,
  29. patientCancelCount: 0,
  30. noReviewedCount: 0,
  31. processingCount: 0,
  32. payOuttimeCount: 0
  33. },
  34. paymentData: {
  35. sum: 0,
  36. avg: 0
  37. },
  38. expressData: {
  39. self: 0,
  40. doctor: 0,
  41. delivery: 0
  42. },
  43. ageDatas: [
  44. {name: "0~6岁", color: "#ff5442", value: 0},
  45. {name: "7~18岁", color: "#ffc800", value: 0},
  46. {name: "19~30岁", color: "#4ce428", value: 0},
  47. {name: "31~50岁", color: "#24bbfa", value: 0},
  48. {name: "51~64岁", color: "#fb5dab", value: 0},
  49. {name: "65岁以上", color: "#9b5ffd", value: 0}]
  50. },
  51. components: {
  52. vuedals: Vuedals.Component
  53. },
  54. mounted: function(){
  55. //初始化数据
  56. initData(this);
  57. //获得顶部各tab的值
  58. loadData([0,1,2], this); //参数组数表示请求的区域为上中下
  59. //存储请求所带的参数
  60. reqList.push({
  61. level: this.level,
  62. area: this.area,
  63. areaTitle: this.areaTitle,
  64. endDate: this.endDate,
  65. startDate: this.startDate,
  66. lowLevel: this.lowLevel,
  67. tagCode: this.tagCode,
  68. sumType: this.sumType,
  69. disease: this.disease,
  70. dateType: this.dateType
  71. });
  72. //设置监听器, 监听折线图日期变化
  73. var vm = this;
  74. //监听后退按钮的操作
  75. EventBus.$on("back-click", function(arg){
  76. EventBus.$emit('update-statistics-time', {}); //更新统计时间
  77. if(reqList.length == 1){
  78. history.go(-1);
  79. }
  80. else{
  81. var preInfo = reqList.pop();
  82. var info = reqList[reqList.length - 1];
  83. vm.level = info.level;
  84. vm.area = info.area;
  85. vm.areaTitle = info.areaTitle;
  86. vm.lowLevel = info.lowLevel;
  87. vm.tagCode = info.tagCode;
  88. vm.sumType = info.sumType;
  89. vm.disease = info.disease;
  90. vm.dateType = info.dateType;
  91. loadData([0,1,2], vm);
  92. EventBus.$emit('update-area-name', {areaName: vm.areaTitle});
  93. }
  94. });
  95. //监听页面刷新
  96. EventBus.$on("refresh-click", function(arg){
  97. loadData([0,1,2], vm);
  98. });
  99. //弹出筛选框
  100. EventBus.$on('filter-click', function(arg) {
  101. //弹框显示筛选条件
  102. Vuedals.Bus.$emit('new', {
  103. title: '条件筛选',
  104. onClose:function(data){
  105. vm.sumType = data.sumType;
  106. vm.sumTypeName = data.sumTypeName;
  107. vm.disease = data.disease;
  108. vm.diseaseName = data.diseaseName;
  109. vm.chooseYear = data.chooseYear;
  110. vm.startDate = getStartDate(vm.chooseYear);
  111. vm.endDate = getEndDate(vm.chooseYear)
  112. //将参数职位初始值
  113. vm.level = vm.userRole.code == '350200' ? 4 : vm.userRole.code.length == 6 ? 3 : 2;
  114. vm.lowLevel = vm.level - 1;
  115. vm.area = vm.userRole.code;
  116. vm.areaTitle = vm.userRole.name;
  117. vm.dateType = 1;
  118. vm.tagCode = 1;
  119. EventBus.$emit('update-area-name', {areaName: vm.areaTitle});
  120. //然后清空请求列表数组
  121. reqList.splice(0, reqList.length);
  122. loadData([0, 1, 2], vm);//刷新数据
  123. //存储请求所带的参数
  124. reqList.push({
  125. level: vm.level,
  126. area: vm.area,
  127. areaTitle: vm.areaTitle,
  128. endDate: vm.endDate,
  129. startDate: vm.startDate,
  130. lowLevel: vm.lowLevel,
  131. tagCode: vm.tagCode,
  132. sumType: vm.sumType,
  133. disease: vm.disease,
  134. dateType: vm.dateType
  135. });
  136. EventBus.$emit('update-statistics-year',{selectDate: vm.chooseYear} );//显示统计维度的名称
  137. EventBus.$emit('update-dimension-name', {dimensionVal: vm.sumTypeName});//显示疾病类型的名称
  138. EventBus.$emit('update-dimension2-name', {dimensionVal2: vm.diseaseName});//显示疾病类型的名称
  139. EventBus.$emit('update-statistics-time', {});//更新统计时间
  140. },
  141. component: 'prescription-filter',
  142. props: {
  143. sumType: vm.sumType,
  144. disease: vm.disease,
  145. chooseYear: vm.chooseYear
  146. }
  147. });
  148. });
  149. $("#main").removeClass("c-hide");
  150. window.onresize = function() {
  151. if(agePie){
  152. agePie.resize();
  153. }
  154. if(ageBar){
  155. ageBar.resize();
  156. }
  157. if(window.lineCharts){
  158. window.lineCharts.resize(); //日周月折线图
  159. }
  160. if(window.barCharts){
  161. window.barCharts.resize(); //日周月折线图
  162. }
  163. }
  164. },
  165. methods: {
  166. changeTagCode: function(val){
  167. this.tagCode = val;
  168. if(this.sumType == 2){
  169. //费用统计只查看人均费用的变化趋势
  170. loadData([2], this);
  171. }else{
  172. loadData([1,2], this);
  173. }
  174. //存储请求所带的参数
  175. reqList.push({
  176. level: this.level,
  177. area: this.area,
  178. areaTitle: this.areaTitle,
  179. endDate: this.endDate,
  180. startDate: this.startDate,
  181. lowLevel: this.lowLevel,
  182. tagCode: this.tagCode,
  183. sumType: this.sumType,
  184. disease: this.disease,
  185. dateType: this.dateType
  186. })
  187. },
  188. getBarData: function(arg){
  189. this.dateType = arg.dateType || this.dateType;
  190. var dateValue = arg.dateValue;
  191. console.log(arg);
  192. if(dateValue){
  193. this.dateValue = arg.dateValue;
  194. this.sDate = dateValue[0];
  195. this.eDate = dateValue[1];
  196. }
  197. loadData([1], this);
  198. },
  199. getPaymentLineData: function(arg){
  200. this.dateType = arg.dateType;
  201. loadData([1], this);
  202. },
  203. getBottomAreaData: function(arg){
  204. //如果level改变,则需要重新加载整个页面的数据,否则只需加载底部区域数据
  205. if(arg.level == this.level){
  206. this.lowLevel = arg.lowLevel || 3;
  207. loadData([2], this);
  208. }else{
  209. this.level = arg.level;
  210. //长处方这边level改了lowLevel也需要跟着一起变
  211. this.lowLevel = arg.level - 1;
  212. this.area = arg.area;
  213. this.areaTitle = arg.areaTitle;
  214. loadData([0,1,2], this);
  215. }
  216. EventBus.$emit('update-area-name', {areaName: this.areaTitle});
  217. //存储请求所带的参数
  218. reqList.push({
  219. level: this.level,
  220. area: this.area,
  221. areaTitle: this.areaTitle,
  222. endDate: this.endDate,
  223. startDate: this.startDate,
  224. lowLevel: this.lowLevel,
  225. tagCode: this.tagCode,
  226. sumType: this.sumType,
  227. disease: this.disease,
  228. dateType: this.dateType
  229. })
  230. },
  231. exportData: function(){
  232. var sheet = XLSX.utils.table_to_sheet($('#listTable')[0]);
  233. var disease = this.diseaseName == "全部" ? "" : this.diseaseName,
  234. areaName = this.area == "350200" ? "厦门市" : this.areaTitle,
  235. fileName = areaName + disease;
  236. switch(this.sumType){
  237. case 1:
  238. var names = ["续方总量", "已完成", "居民取消", "审核未通过", "进行中", "其他原因取消"];
  239. fileName += names[this.tagCode - 1];
  240. if(this.tagCode > 1){
  241. fileName += "订单";
  242. }
  243. break;
  244. case 2:
  245. var names = ["费用总计", "人均费用"];
  246. fileName += "续方"+names[this.tagCode -1];
  247. break;
  248. case 3:
  249. var names = ["居民自取", "物流配送", "健管师配送"];
  250. fileName += names[this.tagCode - 1] + "订单";
  251. break;
  252. case 4:
  253. fileName += "续方人数";
  254. break;
  255. default:
  256. fileName += "续方情况";
  257. break;
  258. }
  259. openDownloadDialog(sheet2blob(sheet), fileName+'.xlsx');
  260. }
  261. }
  262. });
  263. function initData(vm){
  264. //获得缓存中缓存的角色权限
  265. var userRole = window.sessionStorage.getItem("selectedRole");
  266. if(!userRole){
  267. return false;
  268. }
  269. vm.userRole = JSON.parse(userRole);
  270. vm.level = vm.userRole.code == '350200' ? 4 : vm.userRole.code.length == 6 ? 3 : 2;
  271. vm.lowLevel = vm.level - 1;
  272. vm.area = vm.userRole.code;
  273. vm.areaTitle = vm.userRole.name;
  274. var now = new Date(),
  275. year = now.getFullYear();
  276. if(now.getMonth() < 6){
  277. vm.chooseYear = year - 1;
  278. }else {
  279. vm.chooseYear = year;
  280. }
  281. vm.startDate = vm.sDate = getStartDate(vm.chooseYear);
  282. vm.endDate = vm.eDate = getEndDate(vm.chooseYear);
  283. vm.dateValue = [vm.sDate, vm.eDate];
  284. EventBus.$emit('update-area-name', {areaName: vm.areaTitle});
  285. var now = new Date();
  286. vm.endDate = now.format("yyyy-MM-dd");
  287. EventBus.$emit('update-statistics-year',{selectDate: vm.chooseYear} );
  288. EventBus.$emit('update-dimension-name', {dimensionVal: vm.sumTypeName});//显示统计维度的名称
  289. EventBus.$emit('update-dimension2-name', {dimensionVal2: vm.diseaseName});//显示疾病类型的名称
  290. }
  291. function initReqParams(vm){
  292. //sumType: 1-订单统计,2-费用统计,3-配送统计,4-年龄统计
  293. var reqParam = [];
  294. switch(vm.sumType){
  295. case 1:
  296. //tagCode: 1.总量,2.已完成,3.居民取消,4.审核不通过,5.进行中,6.其他原因取消
  297. reqParam = [{
  298. url: "/statistics/getPrescriptionCount",
  299. data: {level: vm.level, area: vm.area, disease: vm.disease, year: vm.chooseYear}
  300. },{
  301. url: "/statistics/getPrescriptionTotalHistogram",
  302. data: {level: vm.level, area: vm.area, disease: vm.disease, type: vm.tagCode, interval: vm.dateType, year: vm.chooseYear, startTime: vm.sDate, endTime: vm.eDate}
  303. },{
  304. url: "/statistics/getPrescriptionTotalLowLevel",
  305. data: {level: vm.level, lowlevel: vm.lowLevel, area: vm.area, disease: vm.disease, type: vm.tagCode, year: vm.chooseYear, startTime: vm.startDate, endTime: vm.endDate}
  306. }];
  307. break;
  308. case 2:
  309. //dateType: 折线图坐标值1-日,2-周,3-月
  310. //tagCode: 1.总量,2.平均值
  311. // vm.startDate = getBeforeMonthStartDate(3, vm.dateType);
  312. reqParam = [{
  313. url: "/statistics/getPrescriptionCost",
  314. data: {level: vm.level, area: vm.area, disease: vm.disease, year: vm.chooseYear}
  315. },{
  316. url: "/statistics/getPrescriptionCostAvgLine",
  317. data: {level: vm.level, area: vm.area, disease: vm.disease, type: vm.dateType, year: vm.chooseYear, startDate: vm.startDate, endDate: vm.endDate}
  318. },{
  319. url: "/statistics/getPrescriptionCostLowLevel",
  320. data: {level: vm.level, lowlevel: vm.lowLevel, area: vm.area, disease: vm.disease, type: vm.tagCode, year: vm.chooseYear, startTime: vm.startDate, endTime: vm.endDate}
  321. }];
  322. break;
  323. case 3:
  324. //tagCode: 1.自取,2.快递配送,3.健管师配送
  325. reqParam = [{
  326. url: "/statistics/getPrescriptionDispatchingTotal",
  327. data: {level: vm.level, area: vm.area, disease: vm.disease, year: vm.chooseYear}
  328. },{
  329. url: "/statistics/getPrescriptionDispatchingHistogram",
  330. data: {level: vm.level, area: vm.area, disease: vm.disease, type: vm.tagCode, interval: vm.dateType, year: vm.chooseYear, startTime: vm.sDate, endTime: vm.eDate}
  331. },{
  332. url: "/statistics/getPrescriptionDispatchingLowLevel",
  333. data: {level: vm.level, lowlevel: vm.lowLevel, area: vm.area, disease: vm.disease, type: vm.tagCode, year: vm.chooseYear, startTime: vm.startDate, endTime: vm.endDate}
  334. }];
  335. break;
  336. case 4:
  337. reqParam = [{
  338. url: "/statistics/getPrescriptionAgeTotal",
  339. data: {level: vm.level, area: vm.area, disease: vm.disease, year: vm.chooseYear}
  340. },{
  341. url: "/statistics/getPrescriptionAgeHistogram",
  342. data: {level: vm.level, area: vm.area, disease: vm.disease, year: vm.chooseYear, startTime: vm.startDate, endTime: vm.endDate}
  343. },{
  344. url: "/statistics/getPrescriptionAgeLowLevel",
  345. data: {level: vm.level, lowlevel: vm.lowLevel, area: vm.area, disease: vm.disease, year: vm.chooseYear, startTime: vm.startDate, endTime: vm.endDate}
  346. }];
  347. break;
  348. default:
  349. reqParam = [];
  350. break;
  351. };
  352. return reqParam;
  353. }
  354. function loadData(loadArr, vm){
  355. //获取其他请求的参数
  356. var reqParams = initReqParams(vm),
  357. reqPromise = [];
  358. for(i=0; i<loadArr.length; i++){
  359. var j = loadArr[i];
  360. var param = reqParams[j];
  361. reqPromise.push(httpRequest.get(param.url, {data: param.data}));
  362. }
  363. if(reqPromise.length > 0){
  364. Promise.all(reqPromise).then(function(ress){
  365. var res1, res2, res2;
  366. for(var i=0; i<loadArr.length; i++){
  367. var j = loadArr[i] + 1;
  368. if(j == 1){
  369. res1 = ress[i];
  370. }
  371. if(j == 2){
  372. res2 = ress[i];
  373. }
  374. if(j == 3){
  375. res3 = ress[i];
  376. }
  377. }
  378. if(res1){
  379. if(res1.status == 200){
  380. handleTopPanelData(res1.data, vm);
  381. }else{
  382. console.log(res1.msg);
  383. }
  384. }
  385. if(res2){
  386. if(res2.status == 200){
  387. handleSecondPanelData(res2.data, vm);
  388. }else{
  389. console.log(res2.msg);
  390. }
  391. }
  392. if(res3){
  393. if(res3.status == 200){
  394. listHandle(res3.data, vm);
  395. }else{
  396. console.log(res3.msg);
  397. }
  398. }
  399. })
  400. }
  401. }
  402. function handleTopPanelData(data, vm){
  403. switch(vm.sumType){
  404. case 1:
  405. vm.orderTagDatas = {
  406. total: data.total,
  407. finishCount: data.finishCount,
  408. patientCancelCount: data.patientCancelCount,
  409. noReviewedCount: data.noReviewedCount,
  410. processingCount: data.processingCount,
  411. payOuttimeCount: data.payOuttimeCount
  412. };
  413. break;
  414. case 2:
  415. vm.paymentData = {
  416. sum: data.sum,
  417. avg: data.avg
  418. }
  419. break;
  420. case 3:
  421. vm.expressData = {
  422. self: data.seltTotal,
  423. doctor: data.doctorTotal,
  424. delivery: data.deliveryTotal
  425. }
  426. break;
  427. case 4:
  428. var len = vm.ageDatas.length,
  429. color = ['#ff5442', '#ffc800 ','#4ce428', '#24bbfa','#fb5dab', "#9b5ffd"],
  430. objName = ['0age', '7age', '19age', '31age', '51age', '65age'],
  431. arr = [];
  432. for(i=0; i<len; i++){
  433. vm.ageDatas[i].value = data[objName[i]];
  434. }
  435. //绘制饼图
  436. agePie = drawPieChart("agePie", vm.ageDatas, color);
  437. }
  438. }
  439. function handleSecondPanelData(data, vm){
  440. switch(vm.sumType){
  441. case 1:
  442. case 3:
  443. var color = "#17b3ec",
  444. xAxisData = [],
  445. seriesData = [];
  446. for(i=0; i<data.length; i++){
  447. var item = data[i];
  448. xAxisData.push(item.date);
  449. seriesData.push(item.count);
  450. }
  451. var names,panelName;
  452. if(vm.sumType == 1){
  453. names = ["续方总量", "已完成", "居民取消", "审核未通过", "进行中", "其他原因取消"];
  454. panelName = "续方订单趋势";
  455. }else if(vm.sumType == 3){
  456. panelName = "订单配送趋势";
  457. names = ["居民自取", "物流配送", "健管师配送"];
  458. }
  459. // EventBus.$emit("draw-bar-chart", {
  460. // panelName: "近半年统计",
  461. // xData: xAxisData,
  462. // yData: seriesData,
  463. // quotaName: names[vm.tagCode - 1],
  464. // color: color,
  465. // unit: "笔",
  466. // selectedDateType: vm.dateType
  467. // });
  468. console.log(vm.dateValue);
  469. EventBus.$emit("draw-line-chart", {
  470. panelName : panelName,
  471. quotaNames : ["订单数"],
  472. xData : xAxisData,
  473. yDatas : [seriesData],
  474. colors : [color],
  475. unit: "笔",
  476. selectedDateType: vm.dateType,
  477. dateValue: vm.dateValue
  478. });
  479. break;
  480. case 2:
  481. var yDatas = [],
  482. colors = ['#12b7f5'];
  483. var xData = _.map(data, function(o){
  484. return o.date;
  485. });
  486. var yData = _.map(data, function(o){
  487. return o.avg;
  488. });
  489. yDatas.push(yData);
  490. EventBus.$emit("draw-line-chart", {
  491. panelName : "人均费用趋势",
  492. quotaNames : ["人均费用"],
  493. xData : xData,
  494. yDatas : yDatas,
  495. colors : colors,
  496. unit: "元",
  497. selectedDateType: vm.dateType
  498. });
  499. break;
  500. case 4:
  501. var color = "#17b3ec",
  502. xAxisData = ['0~6岁', '7~18岁', '19~30岁', '31~50岁', '51~64岁', '65岁以上'],
  503. fieldName = ['0ageRate', '7ageRate', '19ageRate', '31ageRate', '51ageRate', '65ageRate']
  504. seriesData = [];
  505. for(i=0; i<6; i++){
  506. seriesData.push(data[fieldName[i]]);
  507. }
  508. ageBar = drawBarChart("ageBar", xAxisData, seriesData, color, "人均使用次数");
  509. break;
  510. }
  511. }
  512. function listHandle(data, vm){
  513. var list = data;
  514. var topArr = soreRank(getKeyValueArr(list, 'val'));
  515. var arr = _.map(list, function(o, index){
  516. var cols = [o.name, o.val];
  517. return {
  518. rank: topArr[index],
  519. code: o.code,
  520. name: o.name,
  521. cols: cols
  522. }
  523. });
  524. var headers = {
  525. '1': ["排名", "续方总量", "已完成", "居民取消", "审核未通过", "进行中", "其他原因取消"],
  526. '2': ["排名", "费用总计", "人均费用"],
  527. '3': ["排名", "居民自取", "物流配送", "健管师配送"],
  528. '4': ["排名", "总人数"]
  529. };
  530. EventBus.$emit("render-area-data",{
  531. level: vm.level,
  532. area: vm.area,
  533. lowLevel: vm.lowLevel,
  534. headers:["排名", headers[vm.sumType][vm.tagCode]],
  535. rows: arr
  536. });
  537. }
  538. /*
  539. * months : 月份差距(例如months=3,则获取今天往前数3个月的那天的值)
  540. */
  541. function getBeforeMonthStartDate(months,type){
  542. //type: 折线图坐标值1-日,2-周,3-月
  543. //从1号开始算每个月开始的时间
  544. var sDate = new Date(),
  545. now = new Date();
  546. sDate.setMonth(now.getMonth() - months + 1);// 包含本月算一个月
  547. var sDateStr = sDate.format("yyyy-MM-dd");
  548. var startDate = "";
  549. if(type == '3'){
  550. startDate = sDateStr.substr(0,8)+"01";
  551. }else{
  552. startDate = sDateStr;
  553. }
  554. return startDate;
  555. }