| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193 |
- var token = $.cookie("token");
- var seriesData = []; //柱形图数据
- var date; //初始日期
- var arrNum = [];
- var myChart;
- var aa = true;
- //日期
- laydate.render({
- elem: "#chooseTime",
- format: "yyyy-MM",
- type: "month",
- theme: "#00a1cb",
- // value: new Date()
- });
- //tab切换
- $(".hu-tab li").click(function () {
- $(this).addClass("active").siblings().removeClass("active");
- var index = $(this).index();
- $(".hu-content >div").eq(index).show().siblings().hide();
- });
- $(document).ready(function () {
- //柱形图
- // 基于准备好的dom,初始化echarts实例
- myChart = echarts.init(document.getElementById("huData"));
- option = {
- color: ["#1ab394"],
- tooltip: {
- trigger: "axis",
- axisPointer: {
- // 坐标轴指示器,坐标轴触发有效
- type: "line", // 默认为直线,可选为:'line' | 'shadow'
- },
- },
- toolbox: {
- show: true,
- },
- calculable: true,
- xAxis: [
- {
- type: "category",
- name: "月份",
- splitLine: {
- show: false,
- }, //去除网格线
- data: [
- "1月",
- "2月",
- "3月",
- "4月",
- "5月",
- "6月",
- "7月",
- "8月",
- "9月",
- "10月",
- "11月",
- "12月",
- ],
- axisTick: {
- alignWithLabel: true,
- },
- },
- ],
- yAxis: [
- {
- type: "value",
- name: "通话量",
- nameLocation: "end",
- splitLine: {
- show: false,
- }, //去除网格线
- },
- ],
- series: [
- {
- name: "通话量",
- type: "bar",
- barWidth: "30%", //图形宽度
- data: arrNum,
- itemStyle: {
- normal: {
- label: {
- show: true,
- textStyle: {
- color: "#800080", //顶部数据颜色
- },
- },
- },
- },
- label: {
- normal: {
- show: true,
- position: "top", //顶部数据显示位置
- },
- },
- },
- ],
- };
- // 使用刚指定的配置项和数据显示图表。
- tu(date);
- myChart.setOption(option);
- // myChart.on('click', function(params) {
- // console.log(params);
- // if(params.componentType === 'series') {
- // if(params.dataIndex) {
- // console.log(params.data)
- // var month = params.name;
- // console.log(month);
- // }
- // }
- // });
- });
- Ajax(date);
- //搜索事件
- $(".sear").click(function () {
- $(".huTable tbody").html("");
- date = $("#chooseTime").val();
- Ajax(date);
- tu(date);
- myChart.setOption(option);
- });
- function Ajax(date) {
- $(".huTable tbody").html("");
- $.ajax({
- type: "get",
- url: huayi.config.callcenter_url + "TotalCall/GetDataList",
- async: true,
- dataType: "json",
- data: {
- token: token,
- years: date,
- },
- success: function (data) {
- var con = data.data;
- if (con == null) {
- // $(".huTable tbody").html('');
- $('<tr><td colspan="3">暂无数据</td></tr>').appendTo(
- ".huTable tbody"
- );
- } else {
- for (var i = 0; i < con.length; i++) {
- $(
- "<tr><td>" +
- con[i].月份 +
- "</td><td>" +
- con[i].日期 +
- "</td><td>" +
- con[i].总数 +
- "</td></tr>"
- ).appendTo(".huTable tbody");
- }
- }
- },
- });
- }
- function tu(date) {
- var arr = [];
- $.ajax({
- type: "get",
- url: huayi.config.callcenter_url + "TotalCall/GetChartData",
- async: false,
- dataType: "json",
- data: {
- token: token,
- years: date,
- },
- success: function (data) {
- //console.log(data.data)
- arr = data.data;
- console.log(arr);
- },
- });
- arrNum = arr;
- console.log(arrNum);
- option.series[0].data = arrNum;
- }
- //导出
- $(".export").click(function () {
- dcexcel(this);
- });
- function dcexcel(obj) {
- var url =
- huayi.config.callcenter_url +
- "TotalCall/ExptList?token=" +
- $.cookie("token");
- url += "&years=" + $("#chooseTime").val();
- obj.href = url;
- }
|