home.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233
  1. toastr.options = {
  2. "closeButton": true,
  3. "positionClass": "toast-top-center",
  4. "preventDuplicates": true
  5. }
  6. new Vue({
  7. el: '#main',
  8. data: {
  9. type:0,//0:高血压 1:糖尿病 2:孕产妇 3:65岁以上老年人人数
  10. jsonUrl:"../../../dataJson/jumingHealthJson/高血压人群.json",
  11. jsonData:null,
  12. city: '上饶市',
  13. town: [],
  14. cityVal:"0",
  15. diseaseData:[],
  16. mapData:null,
  17. zhongDianData:[],
  18. gaoFaData:null,
  19. siWangData:[],
  20. skipShow:0,
  21. lineHeightIndex:null,
  22. reqUrl:[],
  23. isClickMap:true
  24. },
  25. mounted: function() {
  26. this.bindEvents();
  27. this.initData();
  28. },
  29. methods: {
  30. initData:function(){
  31. var vm = this,townStr="",viewMapJsonGXY = null,viewMapJsonTNB = null,viewMapJsonYCF = null,viewMapJsonGL = null,zhongDianViewCodeMonth="",zhongDianViewCodeJi="",zhongDianViewCodeYear="";
  32. $(".div-mask-layer").show();
  33. var currentDate = new Date();
  34. //封装参数
  35. vm.cityVal!="0"?townStr = "town="+vm.cityVal+";":townStr = "";//vm.cityVal=0 查询整个市
  36. var diseaseLinkAgeFliter = "quotaDate >= '" + getLastMonthStartDate() + "' and quotaDate <= '" + getLastMonthEndDate() + "';";//疾病列表参数(上个月数据)
  37. var zhongDianLinkageFilter = "quotaDate >= '" + getLastYearMonthArray()[12] + "' and quotaDate <= '" + getLastMonthEndDate() + "';";//重点人群参数(过去12个月数据)
  38. var zhongDianLinkageFilterJi = "quotaDate >= '" + getThirdJiDate(currentDate.getFullYear(),(currentDate.getMonth()+1)) + "' and quotaDate <= '" + getLastMonthEndDate() + "';";
  39. var gaoFaLinkageFilterMonth = "quotaDate >= '" + getMonthStartDate() + "' and quotaDate <= '" + getMonthEndDate() + "';";//高发疾病参数(本月数据)
  40. var gaoFaLinkageFilterJi = "quotaDate >= '" + getQuarterStartDate() + "' and quotaDate <= '" + getQuarterEndDate() + "';";//高发疾病参数(本季数据)
  41. var gaoFaLinkageFilterYear = "quotaDate >= '" + getYearStartDate() + "' and quotaDate <= '" + getYearEndDate() + "';";//高发疾病参数(本年数据)
  42. viewMapJsonGXY = {VIEW_13_0013:townStr,VIEW_13_0036:townStr+diseaseLinkAgeFliter,VIEW_13_0037:townStr+diseaseLinkAgeFliter};//高血压
  43. viewMapJsonTNB = {VIEW_13_0026:townStr,VIEW_13_0034:townStr+diseaseLinkAgeFliter,VIEW_13_0027:townStr+diseaseLinkAgeFliter};//糖尿病
  44. viewMapJsonYCF = {VIEW_16_0009:townStr,VIEW_16_0010:townStr+diseaseLinkAgeFliter,VIEW_16_0011:townStr+diseaseLinkAgeFliter};//孕产妇
  45. viewMapJsonGL = {VIEW_15_0001:townStr,VIEW_15_0011:townStr+diseaseLinkAgeFliter,VIEW_15_0008:townStr+diseaseLinkAgeFliter};//65岁以上
  46. if(vm.type==0){//高血压
  47. zhongDianViewCodeMonth = "VIEW_13_0017";//重点人群+按月
  48. zhongDianViewCodeJi = "VIEW_13_0045";//重点人群+按季度
  49. zhongDianViewCodeYear = "VIEW_13_0022";//重点人群+按年
  50. }else if(vm.type==1){//糖尿病
  51. zhongDianViewCodeMonth = "VIEW_13_0028";//重点人群+按月
  52. zhongDianViewCodeJi = "VIEW_13_0046";//重点人群+按季度
  53. zhongDianViewCodeYear = "VIEW_13_0029";//重点人群+按年
  54. }else if(vm.type==2){//孕产妇
  55. zhongDianViewCodeMonth = "VIEW_16_0004";//重点人群+按月
  56. zhongDianViewCodeJi = "VIEW_16_0012";//重点人群+按季度
  57. zhongDianViewCodeYear = "VIEW_16_0005";//重点人群+按年
  58. }else if(vm.type==3){//65岁以上
  59. zhongDianViewCodeMonth = "VIEW_15_0009";//重点人群+按月
  60. zhongDianViewCodeJi = "VIEW_15_0012";//重点人群+按季度
  61. zhongDianViewCodeYear = "VIEW_15_0010";//重点人群+按年
  62. }
  63. //整理请求参数集合(初始化加载所有)
  64. var reqUrl = [
  65. {url: bigDataAPI.getCityArea,reqType: 'get',data: {}},
  66. {url:bigDataAPI.getMapJingWeiDuInfo,reqType: 'get',data:{}},//上饶地图经纬度数据
  67. {url:bigDataAPI.getMoreNoChartTemplateData,reqType: 'get',data:{viewMapJson:JSON.stringify(viewMapJsonGXY)}},//高血压疾病数据+地图
  68. {url:bigDataAPI.getMoreNoChartTemplateData,reqType: 'get',data:{viewMapJson:JSON.stringify(viewMapJsonTNB)}},//糖尿病疾病数据+地图
  69. {url:bigDataAPI.getMoreNoChartTemplateData,reqType: 'get',data:{viewMapJson:JSON.stringify(viewMapJsonYCF)}},//孕产妇疾病数据+地图
  70. {url:bigDataAPI.getMoreNoChartTemplateData,reqType: 'get',data:{viewMapJson:JSON.stringify(viewMapJsonGL)}},//65岁以上疾病数据+地图
  71. {url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: zhongDianViewCodeMonth,linkageFilter:zhongDianLinkageFilter+townStr}},//重点人群+按月
  72. {url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: zhongDianViewCodeJi,linkageFilter:zhongDianLinkageFilterJi+townStr}},//重点人群+按季度
  73. {url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: zhongDianViewCodeYear,linkageFilter:townStr}},//重点人群+按年
  74. {url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: "VIEW_13_0007",linkageFilter:gaoFaLinkageFilterMonth+townStr,limitCondition:10}},//高发疾病排行----筛选条件:全部+本月
  75. {url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: "VIEW_13_0007",linkageFilter:gaoFaLinkageFilterYear+townStr,limitCondition:10}},//高发疾病排行----筛选条件:全部+本年
  76. {url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: "VIEW_13_0007",linkageFilter:gaoFaLinkageFilterJi+townStr,limitCondition:10}},//高发疾病排行----筛选条件:全部+本季度
  77. {url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: "VIEW_13_0008",linkageFilter:townStr}},//死亡原因
  78. ];
  79. if(!vm.isClickMap){//点击疾病类型,则本月高发和死亡原因数据不变,不用重新请求
  80. reqUrl = [
  81. {url: bigDataAPI.getCityArea,reqType: 'get',data: {}},
  82. {url:bigDataAPI.getMapJingWeiDuInfo,reqType: 'get',data:{}},//上饶地图经纬度数据
  83. {url:bigDataAPI.getMoreNoChartTemplateData,reqType: 'get',data:{viewMapJson:JSON.stringify(viewMapJsonGXY)}},//高血压疾病数据+地图
  84. {url:bigDataAPI.getMoreNoChartTemplateData,reqType: 'get',data:{viewMapJson:JSON.stringify(viewMapJsonTNB)}},//糖尿病疾病数据+地图
  85. {url:bigDataAPI.getMoreNoChartTemplateData,reqType: 'get',data:{viewMapJson:JSON.stringify(viewMapJsonYCF)}},//孕产妇疾病数据+地图
  86. {url:bigDataAPI.getMoreNoChartTemplateData,reqType: 'get',data:{viewMapJson:JSON.stringify(viewMapJsonGL)}},//65岁以上疾病数据+地图
  87. {url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: zhongDianViewCodeMonth,linkageFilter:zhongDianLinkageFilter+townStr}},//重点人群+按月
  88. {url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: zhongDianViewCodeJi,linkageFilter:zhongDianLinkageFilter+townStr}},//重点人群+按季度
  89. {url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: zhongDianViewCodeYear,linkageFilter:townStr}},//重点人群+按年
  90. ];
  91. }
  92. httpRequest.getReqPromises(reqUrl).then(function(datas) {
  93. vm.town = [{"name": "上饶市","id": "0"}].concat(datas[0]);
  94. echarts.registerMap('上饶',datas[1]);
  95. vm.diseaseData.push(datas[2]);
  96. vm.diseaseData.push(datas[3]);
  97. vm.diseaseData.push(datas[4]);
  98. vm.diseaseData.push(datas[5]);
  99. if(vm.type==0){//高血压
  100. vm.setMapData(datas[2]);
  101. }else if(vm.type==1){//糖尿病
  102. vm.setMapData(datas[3]);
  103. }else if(vm.type==2){//孕产妇
  104. vm.setMapData(datas[4]);
  105. }else if(vm.type==3){//65岁以上
  106. vm.setMapData(datas[5]);
  107. }
  108. vm.zhongDianData = [datas[6],datas[7],datas[8]];//重点人群+按月、重点人群+按季度、重点人群+按年
  109. if(vm.isClickMap){//点击地图,则高发和死亡原因数据重新加载
  110. vm.gaoFaData = [datas[9],datas[10],datas[11]];//高发疾病排行----筛选条件:本月(默认)、本年、本季度
  111. vm.siWangData = datas[12];//死亡原因
  112. }
  113. $(".div-mask-layer").hide();
  114. vm.isClickMap = false;
  115. })
  116. },
  117. setMapData: function(data) {
  118. var optionData = [],vm=this;
  119. if(vm.type==0){//高血压
  120. data = data.successFlg?data.detailModelList&&data.detailModelList[1].VIEW_13_0036 || []:[];
  121. _.map(data, function(item) {
  122. if(item.firstColumn != "合计") {
  123. optionData.push({
  124. name: item.townName,
  125. value: parseInt(item.HC_13_0021)
  126. })
  127. }
  128. })
  129. }else if(vm.type==1){//糖尿病
  130. data = data.successFlg?data.detailModelList&&data.detailModelList[1].VIEW_13_0034 || []:[];
  131. _.map(data, function(item) {
  132. if(item.firstColumn != "合计") {
  133. optionData.push({
  134. name: item.townName,
  135. value: parseInt(item.HC_13_0017)
  136. })
  137. }
  138. })
  139. }else if(vm.type==2){//孕产妇
  140. data = data.successFlg?data.detailModelList&&data.detailModelList[1].VIEW_16_0010 || []:[];
  141. _.map(data, function(item) {
  142. if(item.firstColumn != "合计") {
  143. optionData.push({
  144. name: item.townName,
  145. value: parseInt(item.HC_13_0033)
  146. })
  147. }
  148. })
  149. }else if(vm.type==3){//65岁以上
  150. data = data.successFlg?data.detailModelList&&data.detailModelList[1].VIEW_15_0011 || []:[];
  151. _.map(data, function(item) {
  152. if(item.firstColumn != "合计") {
  153. optionData.push({
  154. name: item.townName,
  155. value: parseInt(item.HC_15_1006)
  156. })
  157. }
  158. })
  159. }
  160. var options = optionData;
  161. this.mapData = {
  162. data: options,
  163. index: this.lineHeightIndex
  164. };
  165. },
  166. bindEvents:function(){
  167. var vm = this;
  168. EventBus.$on("refresh-json-data", function(arg) {
  169. vm.isClickMap = false;
  170. vm.type = arg.type;//0:高血压 1:糖尿病 2:孕产妇 3:65岁以上老年人人数
  171. vm.initData();
  172. });
  173. },
  174. setCity(item){
  175. this.city = item.name;
  176. },
  177. clickMap:function(res){
  178. this.city = res.name;
  179. },
  180. skipClick:function(){
  181. console.log(222)
  182. this.skipShow == 0 ? this.skipShow = 1 : this.skipShow = 0
  183. }
  184. },
  185. watch:{
  186. city:function(value){
  187. var vm =this;
  188. vm.lineHeightIndex =value;
  189. this.town.map(function(v,i){
  190. if(v.name == value) {
  191. vm.cityVal = v.id;
  192. }
  193. })
  194. vm.isClickMap = true;
  195. vm.initData();
  196. }
  197. }
  198. });
  199. //数字格式化
  200. function toThousands(str) {
  201. if(!str)return
  202. str =parseInt(str);
  203. if(typeof(str) == 'number')str = str.toString()
  204. var newStr = "";
  205. var count = 0;
  206. if(str.indexOf(".") == -1) {
  207. for(var i = str.length - 1; i >= 0; i--) {
  208. if(count % 3 == 0 && count != 0) {
  209. newStr = str.charAt(i) + "," + newStr;
  210. } else {
  211. newStr = str.charAt(i) + newStr;
  212. }
  213. count++;
  214. }
  215. str = newStr;
  216. } else {
  217. for(var i = str.indexOf(".") - 1; i >= 0; i--) {
  218. if(count % 3 == 0 && count != 0) {
  219. newStr = str.charAt(i) + "," + newStr;
  220. } else {
  221. newStr = str.charAt(i) + newStr; //逐个字符相接起来
  222. }
  223. count++;
  224. }
  225. str = newStr + (str + "00").substr((str + "00").indexOf("."), 3);
  226. }
  227. return str;
  228. }