zoukankan      html  css  js  c++  java
  • mvc和 Echarts报表展示 ajax前后台数据交互

    控制器:

    public ActionResult DataSummary()
    {
    shopno = ShopLogin.LoginUser.ShopNo;
    List<Result> vDataSummaryList = EffectListMap(true, shopno);
    View_DataSummary dataSummary = GetView_DataSummary(vDataSummaryList);
    return Json(dataSummary, JsonRequestBehavior.AllowGet);
    }

    处理数据:
    View_DataSummary GetView_DataSummary(List<Result> argDataSummaryList)
    {
    argDataSummaryList = argDataSummaryList.OrderBy(x => x.EffectTime).ToList();
    View_DataSummary dataSummary = new View_DataSummary();
    List<string> vDateTimeList = argDataSummaryList.Select(x => x.EffectTime.ToString("yyyy-MM-dd")).ToList();
    dataSummary.Categories = vDateTimeList;
    dataSummary.ProNum = argDataSummaryList.Select(x => x.proNum).ToList();
    dataSummary.Fee = argDataSummaryList.Select(x => x.Fee).ToList();
    return dataSummary;
    }

    处理一周的数据结果 如果有添加没有  默认为0

    public List<Result> EffectListMap(bool argIsAsc, int shopno)
    {
    List<Result> vList = new List<Result>();
    vList = BLL1.GetWeekFee_New(shopno); //获取销售数据

    var da = DateTime.Now.Date.AddDays(-6);

    for (DateTime currentDate = da; currentDate <= DateTime.Now.Date; currentDate = currentDate.AddDays(1))
    {
    var itemData = vList.FirstOrDefault(x => x.EffectTime == currentDate);
    Result dataSummary = new Result()
    {
    proNum = 0,
    Fee = 0,
    EffectTime = currentDate
    };
    if (itemData != null) //当天有数据
    {
    dataSummary.proNum = itemData.proNum;
    dataSummary.Fee = itemData.Fee;
    dataSummary.EffectTime = itemData.EffectTime;
    }
    else
    {
    vList.Add(dataSummary);
    }
    }
    if (argIsAsc)
    {
    return vList.OrderBy(x => x.EffectTime).ToList();
    }
    else
    {
    return vList.OrderByDescending(x => x.EffectTime).ToList();
    }

    }

    处理对象的实体:

    public class Result
    {
    public int proNum { get; set; }
    public decimal Fee { get; set; }
    public DateTime EffectTime { get; set; }
    }

    //返回的数据对象list

    public class View_DataSummary
    {
    public List<string> Categories { get; set; }
    public List<int> ProNum { get; set; }
    public List<decimal> Fee { get; set; }

    }

    前台数据展示:

    <script type="text/javascript">
    //页面加载完成后获取余额
    $(document).ready(function () {
    $.ajax({
    type: "POST",
    dataType: "json",
    url: "/ShopRecharge/GetMoney",
    success: function (data) {
    }
    });

    // 路径配置
    require.config({
    paths: {
    echarts: '/areas/cps/echarts/build/dist'
    }
    });
    require(
    [
    'echarts',
    'echarts/chart/line', // 按需加载所需图表,如需动态类型切换功能,别忘了同时加载相应图表
    'echarts/chart/bar'
    ],
    function (ec) {
    var myChart = ec.init(document.getElementById('main'));

    myChart.showLoading({
    text: '正在努力的读取数据中...' //loading话术
    });

    $.get("/Shop/HomePage/DataSummary", function (data) {
    myChart.hideLoading();
    option = {
    tooltip: {
    trigger: 'axis'
    },
    legend: {
    data: ['一周订单量', '一周订单佣金']
    },
    toolbox: {
    show: true,
    feature: {
    mark: { show: true },
    dataView: { show: true, readOnly: false },
    magicType: { show: true, type: ['line', 'bar', 'stack', 'tiled'] },
    restore: { show: true },
    saveAsImage: { show: true }
    }
    },
    calculable: true,
    xAxis: [
    {
    type: 'category',
    boundaryGap: false,
    data: data.Categories
    }
    ],
    yAxis: [
    {
    type: 'value'
    }
    ],
    series: [

    {
    name: '一周订单量',
    type: 'line',
    stack: '今天',
    data: data.ProNum
    },
    {
    name: '一周订单佣金',
    type: 'line',
    stack: '今天',
    data: data.Fee
    }
    ]
    };
    myChart.setOption(option);
    });
    }
    );

    });

    </script>

    html 代码:

    <div style="background-color: #FFF;">
    <div id="main" style="height: 400px; margin: 0 10px; padding-top: 30px;">
    </div>

  • 相关阅读:
    VIM文本替换命令
    VIM格式化代码(How to format code with VIM)
    字符串匹配的Boyer-Moore算法
    Java中数组的遍历
    UVa10723
    uva242,Stamps and Envelope Size
    UVa1630,Folding
    uva1629,Cake Slicing,记忆化搜索
    uva 10118,记忆化搜索
    uva10003
  • 原文地址:https://www.cnblogs.com/fu123/p/5146322.html
Copyright © 2011-2022 走看看