alert4.js 16 KB

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