"use strict";

new Vue({
  el: '#all',
  data: function data() {
    return {};
  },
  mounted: function mounted() {
    //班级运行情况
    this.getData();
    this.changeWindow();
  },
  methods: {
    // 请求数据
    request: function request(_ref) {
      var type = _ref.type,
          url = _ref.url,
          _ref$data = _ref.data,
          data = _ref$data === void 0 ? {} : _ref$data,
          _ref$headers = _ref.headers,
          headers = _ref$headers === void 0 ? {} : _ref$headers;
      return new Promise(function (resolve) {
        $.ajax({
          type: type,
          url: url,
          data: data,
          headers: headers,
          success: function success(data) {
            resolve(data);
          }
        });
      });
    },
    changeWindow: function changeWindow() {
      window.onresize = function () {
        setTimeout(function () {
          window.location.reload();
        }, 200);
      };
    },
    getData: function getData() {
      return regeneratorRuntime.async(function getData$(_context) {
        while (1) {
          switch (_context.prev = _context.next) {
            case 0:
              // let {data} = await this.request({
              //     type: "GET",
              //     data:{
              //         userid:window.phone,
              //         days:this.days,
              //     },
              //     url: `${window.url}/api/admin/healthinfo/getnewbloodpressure`,
              // })
              // console.log(data,"xieya");
              this.Charts1();
              this.charts2();
              this.charts3();
              this.charts4();
              this.charts5();

            case 5:
            case "end":
              return _context.stop();
          }
        }
      }, null, this);
    },
    Charts1: function Charts1() {
      var chartDom = document.getElementById('echarts1');
      var myChart = echarts.init(chartDom);
      var option;
      option = {
        color: ['#02dcfd', "#f96e00", "#0178e9", "rgb(255, 230, 88)", "#ff01ff", "#f9ad12"],
        tooltip: {
          trigger: 'axis'
        },
        legend: {
          // data: ['移动能力重度障碍', '握力测量平均值', '中重度失能',"中重度抑郁","营养不良","尿失禁状况"],
          data: ["移动能力重度障碍", '中重度失能', "中重度抑郁", "营养不良"],
          y: "bottom",
          textStyle: {
            color: '#5380b4'
          }
        },
        grid: {
          left: '1%',
          right: '1%',
          bottom: '10%',
          containLabel: true
        },
        xAxis: {
          type: 'category',
          // boundaryGap:false,
          axisLabel: {
            textStyle: {
              color: '#fff'
            }
          },
          splitLine: {
            show: true,
            lineStyle: {
              color: ['#151d3d']
            }
          },
          data: ["60以下", "60-70岁", "70-80岁", "80-90岁", "90岁以上"]
        },
        yAxis: {
          show: true,
          type: 'value',
          axisLabel: {
            formatter: "{value}%",
            color: '#fff'
          },
          splitLine: {
            lineStyle: {
              color: ['#151d3d']
            }
          }
        },
        series: [{
          name: '移动能力重度障碍',
          smooth: true,
          type: 'line',
          symbolSize: 1,
          data: [2, 5, 25, 60, 85]
        }, // {
        //     name: '握力测量平均值',
        //     smooth:true,
        //     type: 'line',
        //     symbolSize: 1,
        //     data: [72,56,21,33,11],
        // },
        {
          name: '中重度失能',
          smooth: true,
          type: 'line',
          symbolSize: 1,
          data: [1, 6, 20, 54, 90]
        }, {
          name: '中重度抑郁',
          smooth: true,
          type: 'line',
          symbolSize: 1,
          data: [4, 7, 30, 49, 55]
        }, {
          name: '营养不良',
          smooth: true,
          type: 'line',
          symbolSize: 1,
          data: [3, 6, 28, 40, 79]
        } // {
        //     name: '尿失禁状况',
        //     smooth:true,
        //     type: 'line',
        //     symbolSize: 1,
        //     data: [8,12,14,26,91],
        // }
        ]
      };
      option && myChart.setOption(option);
    },
    charts2: function charts2() {
      var chartDom = document.getElementById('echarts2');
      var myChart = echarts.init(chartDom);
      var option;
      option = {
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'shadow'
          },
          formatter: function formatter(params) {
            return params[0].name + "：" + params[0].value + "人";
          }
        },
        legend: {
          show: true // data: ['2021年']

        },
        grid: {
          left: '3%',
          right: '4%',
          bottom: '3%',
          containLabel: true
        },
        xAxis: {
          show: false
        },
        yAxis: {
          type: 'category',
          data: ['医护人数', '老人干预人数', '咨询回复人数', '上门随访人数', '健康评估人数'],
          axisLabel: {
            color: '#03d1f3'
          },
          splitLine: {
            lineStyle: {
              color: ['rgba(0,0,0,1)']
            }
          }
        },
        series: [{
          // name: '2021年',
          type: 'bar',
          barWidth: 15,
          data: [601, 15634, 30212, 23432, 16411],
          //顶部数字展示pzr
          itemStyle: {
            emphasis: {
              barBorderRadius: [100, 100, 100, 100],
              label: {
                show: true,
                position: "right",
                color: "#fff"
              }
            },
            normal: {
              //柱形图圆角，初始化效果
              barBorderRadius: [100, 100, 100, 100],
              // color:new echarts.graphic.LinearGradient(
              //     0, 0, 1, 0,
              //     [
              //         {offset: 0, color: '#011135'},
              //         {offset: 0.5, color: '#01367b'},
              //         {offset: 1, color: '#0178e9'}
              //     ]
              // ),
              color: function color(params) {
                var colorList1 = new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                  offset: 0,
                  color: '#011135'
                }, {
                  offset: 0.5,
                  color: '#01367b'
                }, {
                  offset: 1,
                  color: '#0178e9'
                }]);
                var colorList2 = new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                  offset: 0,
                  color: '#051130'
                }, {
                  offset: 0.5,
                  color: '#734a1a'
                }, {
                  offset: 1,
                  color: '#f96e00'
                }]);
                var colorList3 = new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                  offset: 0,
                  color: '#031133'
                }, {
                  offset: 0.5,
                  color: '#2a7262'
                }, {
                  offset: 1,
                  color: '#45e190'
                }]);
                var colorList = [colorList1, colorList2, colorList3];
                return colorList[params.dataIndex % colorList.length];
              },
              label: {
                show: true,
                position: "right",
                color: "#fff"
              }
            }
          }
        }]
      };
      option && myChart.setOption(option);
    },
    charts3: function charts3() {
      var chartDom = document.getElementById('echarts3');
      var myChart = echarts.init(chartDom);
      var option;
      option = {
        tooltip: {
          trigger: 'item',
          formatter: function formatter(params) {
            return params.data.name + "：" + params.data.value + "人";
          }
        },
        series: [{
          type: 'pie',
          radius: ['40%', '50%'],
          avoidLabelOverlap: false,
          label: {
            show: true
          },
          itemStyle: {
            normal: {
              label: {
                show: true,
                textStyle: {
                  color: '#00affd',
                  fontSize: "14"
                },
                formatter: function formatter(val) {
                  //让series 中的文字进行换行
                  return val.name + "\n" + val.percent + "%";
                }
              },
              color: function color(params) {
                var colorList = ["#00f6fe", "#f36ff9", "#f8b019", "#fe6e82", "#08b16b"];
                return colorList[params.dataIndex % colorList.length];
              },
              labelLine: {
                // smooth: true,
                length: 30,
                length1: 10
              }
            },
            emphasis: {
              shadowBlur: 10,
              shadowOffsetX: 0,
              shadowColor: 'rgba(0, 0, 0, 0.5)',
              textColor: '#000'
            }
          },
          data: [{
            value: 751,
            name: '60岁以下'
          }, {
            value: 8743,
            name: '60-70岁'
          }, {
            value: 4835,
            name: '70-80岁'
          }, {
            value: 1162,
            name: '80-90岁'
          }, {
            value: 920,
            name: '90岁以上'
          }]
        }]
      };
      option && myChart.setOption(option);
    },
    charts4: function charts4() {
      var chartDom = document.getElementById('echarts4');
      var myChart = echarts.init(chartDom);
      var option;
      var dataAxis = ['建档', '血压', '血糖', '身高', '体重', '体脂', '心电', '心率', '体温', '其他'];
      var data = [16411, 8402, 8301, 9432, 12243, 6400, 3632, 6732, 9223, 11032]; // var yMax = 10000;
      // var dataShadow = [];
      // for (var i = 0; i < data.length; i++) {
      //     dataShadow.push(yMax);
      // }

      option = {
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'shadow'
          }
        },
        xAxis: {
          data: dataAxis,
          axisLabel: {
            // inside: true,
            textStyle: {
              color: '#fff'
            }
          },
          axisTick: {
            show: false
          },
          axisLine: {
            show: false
          },
          z: 10
        },
        yAxis: {
          type: 'value',
          max: 20000,
          axisLine: {
            show: false
          },
          axisTick: {
            show: false
          },
          axisLabel: {
            formatter: "{value}人",
            color: '#fff'
          },
          splitLine: {
            lineStyle: {
              color: ['#151d3d']
            }
          }
        },
        // dataZoom: [
        //     {
        //         type: 'inside'
        //     }
        // ],
        series: [{
          type: 'bar',
          showBackground: true,
          stack: '总量',
          barWidth: 30,
          itemStyle: {
            normal: {
              barBorderRadius: [12, 12, 12, 12],
              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                offset: 0,
                color: '#1bc6f5'
              }, {
                offset: 0.5,
                color: '#1dadee'
              }, {
                offset: 1,
                color: '#207ce2'
              }]),
              label: {
                show: true,
                position: [-1, 0],
                color: "#fff",
                formatter: "{Circle|}",
                rich: {
                  Circle: {
                    height: 19,
                    backgroundColor: {
                      image: 'src/images/circle1.png'
                    }
                  }
                }
              }
            }
          },
          emphasis: {
            itemStyle: {
              barBorderRadius: [12, 12, 12, 12],
              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                offset: 0,
                color: '#1bc6f5'
              }, {
                offset: 0.5,
                color: '#1dadee'
              }, {
                offset: 1,
                color: '#207ce2'
              }])
            }
          },
          data: data
        }]
      }; // Enable data zoom when user click bar.
      // var zoomSize = 4;
      // myChart.on('click', function (params) {
      //     console.log(dataAxis[Math.max(params.dataIndex - zoomSize / 2, 0)]);
      //     myChart.dispatchAction({
      //         type: 'dataZoom',
      //         startValue: dataAxis[Math.max(params.dataIndex - zoomSize / 2, 0)],
      //         endValue: dataAxis[Math.min(params.dataIndex + zoomSize / 2, data.length - 1)]
      //     });
      // });

      option && myChart.setOption(option);
    },
    charts5: function charts5() {
      var chartDom = document.getElementById('echarts5');
      var myChart = echarts.init(chartDom);
      var option;
      var weatherIcons = {
        'bmi': 'src/images/yinjing_01.png',
        'sleep': 'src/images/yinjing_02.png',
        'xieya': 'src/images/yinjing_03.png',
        'fat': 'src/images/yinjing_04.png',
        'temperature': 'src/images/yinjing_05.png',
        'xietang': 'src/images/yinjing_06.png',
        'xinliu': 'src/images/yinjing_07.png'
      };
      option = {
        tooltip: {
          trigger: 'item',
          // formatter: '{a} <br/>{b} : {c}',
          formatter: function formatter(params) {
            return params.data.name.split(" ")[0] + "：" + params.data.value + "次";
          }
        },
        series: [{
          type: 'pie',
          radius: '42%',
          center: ['50%', '50%'],
          selectedMode: 'single',
          data: [{
            value: 5832,
            name: 'BMI',
            label: {
              formatter: function formatter(val) {
                var str = "{Img|}" + "-" + val.name + "-" + val.percent + "%";
                str = str.split("-").join("\n");
                return str;
              },
              rich: {
                Img: {
                  height: 40,
                  align: 'left',
                  backgroundColor: {
                    image: weatherIcons.bmi
                  }
                },
                value: {
                  width: 14,
                  align: 'left'
                }
              }
            }
          }, {
            value: 11322,
            name: '睡眠',
            label: {
              formatter: function formatter(val) {
                var str = "{Img|}" + "-" + val.name + "-" + val.percent + "%";
                str = str.split("-").join("\n");
                return str;
              },
              rich: {
                Img: {
                  height: 40,
                  align: 'left',
                  backgroundColor: {
                    image: weatherIcons.sleep
                  }
                },
                value: {
                  width: 14,
                  align: 'left'
                }
              }
            }
          }, {
            value: 4367,
            name: '体脂',
            label: {
              formatter: function formatter(val) {
                var str = "{Img|}" + "-" + val.name + "-" + val.percent + "%";
                str = str.split("-").join("\n");
                return str;
              },
              rich: {
                Img: {
                  height: 40,
                  align: 'left',
                  backgroundColor: {
                    image: weatherIcons.fat
                  }
                },
                value: {
                  width: 14,
                  align: 'left'
                }
              }
            }
          }, {
            value: 2722,
            name: '血压',
            label: {
              formatter: function formatter(val) {
                var str = "{Img|}" + "-" + val.name + "-" + val.percent + "%";
                str = str.split("-").join("\n");
                return str;
              },
              rich: {
                Img: {
                  height: 40,
                  align: 'left',
                  backgroundColor: {
                    image: weatherIcons.xieya
                  }
                },
                value: {
                  width: 14,
                  align: 'left'
                }
              }
            }
          }, {
            value: 3760,
            name: '血糖',
            label: {
              formatter: function formatter(val) {
                var str = "{Img|}" + "-" + val.name + "-" + val.percent + "%";
                str = str.split("-").join("\n");
                return str;
              },
              rich: {
                Img: {
                  height: 40,
                  align: 'left',
                  backgroundColor: {
                    image: weatherIcons.xietang
                  }
                },
                value: {
                  width: 14,
                  align: 'left'
                }
              }
            }
          }, {
            value: 7128,
            name: '体温',
            label: {
              formatter: function formatter(val) {
                var str = "{Img|}" + "-" + val.name + "-" + val.percent + "%";
                str = str.split("-").join("\n");
                return str;
              },
              rich: {
                Img: {
                  height: 40,
                  align: 'left',
                  backgroundColor: {
                    image: weatherIcons.temperature
                  }
                },
                value: {
                  width: 14,
                  align: 'left'
                }
              }
            }
          }, {
            value: 8620,
            name: '心率',
            label: {
              formatter: function formatter(val) {
                var str = "{Img|}" + "-" + val.name + "-" + val.percent + "%";
                str = str.split("-").join("\n");
                return str;
              },
              rich: {
                Img: {
                  height: 40,
                  align: 'left',
                  backgroundColor: {
                    image: weatherIcons.xinliu
                  }
                },
                value: {
                  width: 14,
                  align: 'left'
                }
              }
            }
          }],
          itemStyle: {
            normal: {
              color: function color(params) {
                var colorList = ["#59adff", "#258aed", "#006fdd", "#74f3fd", "#1368bd", "#267afe", "#0067cd"];
                return colorList[params.dataIndex % colorList.length];
              },
              labelLine: {
                // smooth: true,
                length: 20,
                length1: 10
              },
              label: {
                textStyle: {
                  color: '#00affd',
                  fontSize: "14"
                }
              }
            },
            emphasis: {
              shadowBlur: 10,
              shadowOffsetX: 0,
              shadowColor: 'rgba(0, 0, 0, 0.5)',
              textColor: '#000'
            }
          },
          emphasis: {
            itemStyle: {
              shadowBlur: 10,
              shadowOffsetX: 0,
              shadowColor: 'rgba(0, 0, 0, 0.5)'
            }
          }
        }]
      };
      option && myChart.setOption(option);
    }
  }
});