alert4.js 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308
  1. new Vue({
  2. el: '#main',
  3. data: {
  4. alertData1:'',//总人数
  5. alertData2:'',//新增人数
  6. alertData3:'',//门诊人次
  7. alertData4:'',//住院人次
  8. alertChart1:'',//左边第一块表格
  9. alertChart2:'',//右上第一块
  10. alertChart3:'',//右上第二块
  11. alertChart4:'',//右上第三块
  12. alertChart5:'',//右下
  13. bigData:'',//总数据
  14. alertType:0,
  15. alertTime:0,
  16. firstDay: "", //上月第一天
  17. lastDay: "", //上月最后一天
  18. firstMonth:'',
  19. lastMonth:'',
  20. code:[
  21. 'VIEW_15_0001',//总人数和新增人数
  22. 'VIEW_15_0002',//门诊和住院人次
  23. 'VIEW_15_0003',//区县分布
  24. 'VIEW_15_0004',//性别分布
  25. 'VIEW_15_0005',//疾病前五
  26. 'VIEW_15_0006',//就诊月趋势
  27. 'VIEW_15_0007',//就诊年趋势
  28. 'VIEW_15_0012',//就诊季趋势
  29. ],
  30. qushiMonth:'',
  31. qushiYear:'',
  32. firstDayYear: "", //本年第一天
  33. lastDayYear: "", //本年最后一天
  34. halfYearStartDate: "", //近半年开始时间
  35. halfYearEndDate: "", //近半年结束时间
  36. yesterdayDate:"",//昨天
  37. type:0,
  38. thirdJiDate:"",//三个季度前
  39. qushiSeason:"",//季度趋势
  40. },
  41. mounted: function() {
  42. var vm = this;
  43. updateFontSize();
  44. this.formatDate();
  45. this.initData(this.type);
  46. var myDate = new Date();
  47. var maxMonth = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
  48. var maxYear = myDate.getFullYear();
  49. var max = maxYear.toString()+'-'+maxMonth.toString();
  50. console.log(vm.firstMonth,vm.lastMonth)
  51. var moren = vm.firstMonth+' 至 '+vm.lastMonth;
  52. layui.use('laydate', function(){
  53. var laydate = layui.laydate;
  54. //执行一个laydate实例
  55. laydate.render({
  56. elem: '#time', //指定元素,
  57. type:'month',
  58. range: '至', //或 range: '~' 来自定义分割字符
  59. theme: '#05273e',
  60. position: 'abolute',
  61. right:'200px',
  62. value: moren,
  63. max:max,
  64. btns: ['confirm'],
  65. done: function(value, date, endDate){
  66. console.log(value); //得到日期生成的值,如:2017-08-18
  67. console.log(date); //得到日期时间对象:{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
  68. console.log(endDate); //得结束的日期时间对象,开启范围选择(range: true)才会返回。对象成员同上。
  69. console.log(vm.firstDay);
  70. if(date.month < 10){
  71. vm.firstDay = date.year+'-0'+date.month+'-01';
  72. }else{
  73. vm.firstDay = date.year+'-'+date.month+'-01';
  74. }
  75. if(endDate.month < 10){
  76. vm.lastDay = endDate.year+'-0'+endDate.month+'-'+vm.getLastDay(endDate.year,endDate.month);
  77. }else{
  78. vm.lastDay = endDate.year+'-'+endDate.month+'-'+vm.getLastDay(endDate.year,endDate.month);
  79. }
  80. vm.halfYearStartDate = getLastHalfMonthArray(endDate.year+'-'+endDate.month)
  81. vm.halfYearEndDate = vm.lastDay;
  82. vm.thirdJiDate = getThirdJiDate(endDate.year,endDate.month)
  83. vm.initData(vm.type);
  84. vm.alertTime = 0;
  85. }
  86. // showBottom: false
  87. });
  88. });
  89. },
  90. methods: {
  91. initData:function(type){
  92. var vm = this;
  93. if(type == 0){
  94. event_type = '';//全部
  95. }else if(type == 1){
  96. event_type = 1;//住院
  97. }else if(type == 2){
  98. event_type = 0;//门诊
  99. }
  100. var linkageFilter1 = "quotaDate >= '" + vm.firstDay + "' and quotaDate <= '" + vm.lastDay + "';";
  101. var linkageFilter2 = "quotaDate >= '" + vm.thirdJiDate + "' and quotaDate <= '" + vm.lastDay + "';";
  102. var linkageFilter3 = "quotaDate >= '" + vm.halfYearStartDate + "' and quotaDate <= '" + vm.halfYearEndDate + "';";
  103. console.log(linkageFilter1)
  104. var code = this.code;
  105. var urlNumber = '/gov/report/getNoChartTemplateData';
  106. var urlChart = '/gov/report/getTemplateDataByViewCode';
  107. var reqUrl = [
  108. {url:urlNumber,reqType: 'get',data: {viewCodeStr:code[0]}},//总人数
  109. {url:urlNumber,reqType: 'get',data: {viewCodeStr:code[0],linkageFilter:linkageFilter1}},//新增人数
  110. {url:urlNumber,reqType: 'get',data: {viewCodeStr:code[1],linkageFilter:linkageFilter1}},//门诊,住院人次
  111. {url:urlChart,reqType: 'get',data: {viewCode:code[2],linkageFilter:linkageFilter1+'eventType='+event_type}},//区县分布
  112. {url:urlChart,reqType: 'get',data: {viewCode:code[3],linkageFilter:linkageFilter1+'eventType='+event_type}},//性别分布
  113. {url:urlChart,reqType: 'get',data: {viewCode:code[4],linkageFilter:linkageFilter1+'eventType='+event_type,'limitCondition':5}},//疾病前五
  114. {url:urlChart,reqType: 'get',data: {viewCode:code[5],linkageFilter:linkageFilter3+'eventType='+event_type}},//老年人就诊趋势-月
  115. {url:urlChart,reqType: 'get',data: {viewCode:code[6],linkageFilter:'eventType='+event_type}},//老年人就诊趋势-年
  116. {url:urlChart,reqType: 'get',data: {viewCode:code[7],linkageFilter:linkageFilter2+'eventType='+event_type}},//老年人就诊趋势-月
  117. ]
  118. $(".div-mask-layer").show();
  119. httpRequest.getReqPromises(reqUrl).then(function(datas) {
  120. vm.alertData1 = datas[0].obj.VIEW_15_0001[0].HC_15_1006;
  121. vm.alertData2 = datas[1].obj.VIEW_15_0001[0].HC_15_1006;
  122. vm.alertData3 = datas[2].obj.VIEW_15_0002[0].HC_15_1003;
  123. vm.alertData4 = datas[2].obj.VIEW_15_0002[0].HC_15_1004;
  124. var chart1 = datas[3].obj.viewInfos[0].options[0].option;
  125. var chart2 = datas[4].obj.viewInfos[0].options[0].option;
  126. var chart3 = datas[5].obj.viewInfos[0].options[0].option;
  127. var chart4 = datas[6].obj.viewInfos[0].options[0].option;
  128. var chart5 = datas[7].obj.viewInfos[0].options[0].option;
  129. var chart6 = datas[8].obj.viewInfos[0].options[0].option;
  130. vm.qushiMonth = chart4;
  131. vm.qushiYear = chart5;
  132. vm.qushiSeason = chart6;
  133. vm.setAlertChart1(chart1);
  134. vm.setAlertChart3(chart2);
  135. vm.setAlertChart4(chart3);
  136. vm.setAlertChart5(chart4);
  137. $(".div-mask-layer").hide();
  138. })
  139. },
  140. setAlertChart1:function(data){
  141. var options = JSON.parse(data);
  142. options = quxianChart(options);
  143. // var options = this.bigData[t]['区县分布'];
  144. // options.series[0].label = {show: true,position: "right",color: '#b5e1fc'}
  145. this.alertChart1 = options;
  146. },
  147. setAlertChart2:function(data){
  148. var options = JSON.parse(data);
  149. options = nianlingChart(options);
  150. options.color = ["#6576e0","#03fa6c","#ff616f","#0fa5f2","#00e6f3"];
  151. options.legend.formatter = function(name) {
  152. var index = 0;
  153. var clientlabels = options.legend.data;
  154. var clientcounts = _.map(options.series[0].data,function(item,idx){
  155. return item.value;
  156. });
  157. clientlabels.forEach(function(value,i){
  158. if(value == name){
  159. index = i;
  160. }
  161. });
  162. return name + " " + clientcounts[index];
  163. }
  164. options.legend.left = '48%';
  165. options.legend.top = 0.044 * window.screen.width;//85;
  166. options.legend.itemWidth = 0.005 * window.screen.width;//10;
  167. options.legend.itemHeight = 0.005 * window.screen.width;//10;
  168. options.legend.itemGap = 0.0078 * window.screen.width;//15;
  169. options.series[0].center = ['25%','55%'];
  170. this.alertChart2 = options
  171. },
  172. setAlertChart3:function(data){
  173. var options = JSON.parse(data);
  174. options = xingbieChart(options);
  175. options.color = ["#00E7F3","#ff616f","#6576e0"];
  176. options.legend.formatter = function(name) {
  177. var index = 0;
  178. var clientlabels = options.legend.data;
  179. var clientcounts = _.map(options.series[0].data,function(item,idx){
  180. return item.value;
  181. });
  182. clientlabels.forEach(function(value,i){
  183. if(value == name){
  184. index = i;
  185. }
  186. });
  187. return name + " " + clientcounts[index];
  188. }
  189. options.legend.left = '48%';
  190. options.legend.top = 0.0625 * window.screen.width;//120
  191. options.legend.itemWidth = 0.005 * window.screen.width;//10;
  192. options.legend.itemHeight = 0.005 * window.screen.width;//10;
  193. options.legend.itemGap = 0.0078 * window.screen.width;//15;
  194. options.series[0].center = ['25%','55%'];
  195. this.alertChart3 = options
  196. },
  197. setAlertChart4:function(data){
  198. var options = JSON.parse(data);
  199. options = jibingTopChart(options);
  200. options.series[0].label = {show: true,position: "right",color: '#b5e1fc'};
  201. options.series[0].itemStyle.normal.color = '#FFF71A';
  202. this.alertChart4 = options
  203. },
  204. setAlertChart5:function(data){
  205. var options = JSON.parse(data);
  206. console.log(options)
  207. options = qushiChart(options);
  208. // var options = this.bigData[t]['区县分布'];
  209. // options.series[0].label = {show: true,position: "right",color: '#b5e1fc'}
  210. this.alertChart5 = options;
  211. },
  212. alertTitle:function(type){
  213. this.alertTime = 0;
  214. this.type = type;
  215. this.initData(type)
  216. },
  217. alertChart:function(time){
  218. var vm = this;
  219. this.alertTime = time;
  220. if(time == 0){
  221. vm.setAlertChart5(vm.qushiMonth);
  222. }else if(time == 1){
  223. vm.setAlertChart5(vm.qushiYear);
  224. }else if(time == 2){
  225. vm.setAlertChart5(vm.qushiSeason);
  226. }
  227. },
  228. closeAlertClick:function(){
  229. parent.layer.closeAll();
  230. },
  231. GetQueryString :function (name){
  232. var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
  233. var r = window.location.search.substr(1).match(reg);
  234. if(r!=null)return unescape(r[2]); return null;
  235. },
  236. chartArea:function(param){
  237. console.log(param);
  238. },
  239. clickBarItem:function(item){
  240. console.log(item)
  241. },
  242. formatDate: function() {
  243. //获取上个月第一天
  244. var firstdate = new Date(new Date().getFullYear(), new Date().getMonth() - 1, 1);
  245. //获取上个月最后一天
  246. var date = new Date();
  247. var day = new Date(date.getFullYear(), date.getMonth(), 0).getDate();
  248. var enddate = new Date(new Date().getFullYear(), new Date().getMonth() - 1, day);
  249. //格式化结果
  250. var year = date.getFullYear();
  251. debugger
  252. this.thirdJiDate = getThirdJiDate(year,lastMonth+1);
  253. this.firstDay = getLastMonthStartDate();
  254. this.firstMonth = firstdate.format("yyyy-MM");
  255. this.lastDay = getLastMonthEndDate();
  256. this.lastMonth = enddate.format("yyyy-MM");
  257. this.firstDayYear = getYearStartDate();
  258. this.lastDayYear = getYearEndDate();
  259. this.halfYearStartDate = getHalfYearStartDate();
  260. this.halfYearEndDate = getHalfYearEndDate();
  261. this.yesterdayDate = getYearEndDate();
  262. },
  263. getLastDay(year, month) {
  264. var new_year = year; //取当前的年份
  265. var new_month = month++; //取下一个月的第一天,方便计算(最后一天不固定)
  266. if (month > 12) {
  267. //如果当前大于12月,则年份转到下一年
  268. new_month -= 12; //月份减
  269. new_year++; //年份增
  270. }
  271. var new_date = new Date(new_year, new_month, 1); //取当年当月中的第一天
  272. return new Date(new_date.getTime() - 1000 * 60 * 60 * 24).getDate(); //获取当月最后一天日期
  273. },
  274. }
  275. });
  276. //数字格式化
  277. function toThousands(str) {
  278. if(!str)return
  279. str =parseInt(str);
  280. if(typeof(str) == 'number')str = str.toString()
  281. var newStr = "";
  282. var count = 0;
  283. if(str.indexOf(".") == -1) {
  284. for(var i = str.length - 1; i >= 0; i--) {
  285. if(count % 3 == 0 && count != 0) {
  286. newStr = str.charAt(i) + "," + newStr;
  287. } else {
  288. newStr = str.charAt(i) + newStr;
  289. }
  290. count++;
  291. }
  292. str = newStr;
  293. } else {
  294. for(var i = str.indexOf(".") - 1; i >= 0; i--) {
  295. if(count % 3 == 0 && count != 0) {
  296. newStr = str.charAt(i) + "," + newStr;
  297. } else {
  298. newStr = str.charAt(i) + newStr; //逐个字符相接起来
  299. }
  300. count++;
  301. }
  302. str = newStr + (str + "00").substr((str + "00").indexOf("."), 3);
  303. }
  304. return str;
  305. }