|
|
@@ -1,121 +1,112 @@
|
|
|
(function () {
|
|
|
var page = {
|
|
|
init: function ($page) {
|
|
|
- //扇形图数据
|
|
|
- chartMap = {};
|
|
|
- chartMap['chart-bingtu'] = echarts.init(document.getElementById('chart-bingtu'));
|
|
|
- var data = [{"name":"测试11","value":"9000.00"},{"name":"测试22","value":"100900.00"},{"name":"测试33","value":"0.00"}];
|
|
|
- var data2 = [{"name":"9000.00","value":"9000.00"},{"name":"100900.00","value":"100900.00"},{"name":"0.00","value":"0.00"}];
|
|
|
- //renlian.httpget("", { type: 'chart', id: _item.F_Id }, function(data) {
|
|
|
- //var type = $('#' + data.Id).attr('data-desktop');
|
|
|
- var legendData = [];
|
|
|
- $.each(data, function (_index, _item) {
|
|
|
- legendData.push(_item.name + _item.value);
|
|
|
- var data3 = {};
|
|
|
- data3.name = _item.name + _item.value;
|
|
|
- data3.value = _item.value;
|
|
|
- data2.push(data3);
|
|
|
- });
|
|
|
- console.log(data2);
|
|
|
- console.log(legendData);
|
|
|
- var xData = [];
|
|
|
- for(let i = 0;i < 5; ++i){
|
|
|
- var time = new Date(new Date() - 24*60*60*1000*i);
|
|
|
- var date = time.Format("yy-MM-dd");
|
|
|
- xData.unshift(date);
|
|
|
- }
|
|
|
- // var option = {};
|
|
|
- // option.tooltip = {
|
|
|
- // trigger: 'item',
|
|
|
- // formatter: "{a} <br/>{b}: {c} ({d}%)"
|
|
|
- // };
|
|
|
- // option.legend = {
|
|
|
- // orient: 'vertical',
|
|
|
- // left: 'right',
|
|
|
- // data: legendData
|
|
|
- // };
|
|
|
- // option.series = [{
|
|
|
- // name: '占比',
|
|
|
- // type: 'pie',
|
|
|
- // radius : '55%',
|
|
|
- // center: ['40%', '60%'],
|
|
|
- // itemStyle: {
|
|
|
- // emphasis: {
|
|
|
- // shadowBlur: 10,
|
|
|
- // shadowOffsetX: 0,
|
|
|
- // shadowColor: 'rgba(0, 0, 0, 0.5)'
|
|
|
- // }
|
|
|
- // },
|
|
|
- // data: data2
|
|
|
- // }];
|
|
|
+ var gpsNumber = renlian.storage.get('userinfo').baseinfo.gpsNumber;
|
|
|
+ renlian.httpget(config.webapi+"?s=api/get_driving_data", {gpsNumber:gpsNumber}, function (res) {
|
|
|
+ var sData = [];
|
|
|
+ var drivingdata = null;
|
|
|
+ if(res.success){
|
|
|
+ var respData = res.data;
|
|
|
+ var days5Dist = 0;
|
|
|
+ var day5Time = 0;
|
|
|
+ console.log(respData);
|
|
|
|
|
|
- var option1 = {
|
|
|
- title:{
|
|
|
- text: '近期行驶里程',
|
|
|
- x:'center',
|
|
|
- },
|
|
|
- color: ['#3398DB'],
|
|
|
- tooltip : {
|
|
|
- trigger: 'axis',
|
|
|
- axisPointer : { // 坐标轴指示器，坐标轴触发有效
|
|
|
- type : 'shadow' // 默认为直线，可选为：'line' | 'shadow'
|
|
|
- }
|
|
|
- },
|
|
|
- grid: {
|
|
|
- left: '3%',
|
|
|
- right: '4%',
|
|
|
- bottom: '3%',
|
|
|
- containLabel: true
|
|
|
- },
|
|
|
- xAxis : [
|
|
|
- {
|
|
|
- type : 'category',
|
|
|
- data : xData,
|
|
|
- axisTick: {
|
|
|
- alignWithLabel: true
|
|
|
- },
|
|
|
- }
|
|
|
- ],
|
|
|
- yAxis : [
|
|
|
- {
|
|
|
- name: '里程/公里',
|
|
|
- type : 'value'
|
|
|
+ respData.forEach(v => {
|
|
|
+ sData.push(v.totalDist);
|
|
|
+ days5Dist += v.totalDist;
|
|
|
+ day5Time += v.totalTime;
|
|
|
+ });
|
|
|
+ var averageSpeed = (days5Dist / day5Time).toFixed(2);
|
|
|
+ if(day5Time == 0){
|
|
|
+ averageSpeed = 0.00;
|
|
|
}
|
|
|
- ],
|
|
|
- series : [
|
|
|
- {
|
|
|
- name:'行驶里程',
|
|
|
- type:'bar',
|
|
|
- barWidth: '50%',
|
|
|
- data:[10, 52, 50, 34, 40, 30, 20]
|
|
|
+
|
|
|
+ drivingdata = [{name:'里程总计', value: days5Dist.toFixed(2) + 'km'}, {name:'累计时长', value: days5Dist.toFixed(2) + '小时'}, {name:'平均速度', value: averageSpeed + 'km/h'}]
|
|
|
+ //直方
|
|
|
+ chartMap = {};
|
|
|
+ chartMap['drive-data-bar'] = echarts.init(document.getElementById('drive-data-bar'));
|
|
|
+ var xData = [];
|
|
|
+ for(let i = 0;i < 5; ++i){
|
|
|
+ var time = new Date(new Date() - 24*60*60*1000*i);
|
|
|
+ var date = time.Format("MM-dd");
|
|
|
+ xData.unshift(date);
|
|
|
}
|
|
|
- ]
|
|
|
- };
|
|
|
-
|
|
|
- //option.color = ['#df4d4b', '#304552', '#52bbc8', 'rgb(224,134,105)', '#8dd5b4', '#5eb57d', '#d78d2f'];
|
|
|
- chartMap['chart-bingtu'].setOption(option1);
|
|
|
-
|
|
|
- //列表数据
|
|
|
- //renlian.httpget(config.webapi + "renlian/adms/desktop/data", { type: 'Target', id: _item.F_Id }, function(data){});
|
|
|
- var drivingdata = '[{"name":"里程总计","value":"236.00km"},{"name":"累计时长","value":"0天24时00分"},{"name":"平均速度", "value":"9.83km/h"}]';
|
|
|
- data = JSON.parse(drivingdata);
|
|
|
- var _itemHtml = ''
|
|
|
- $.each(data, function (_index, _item) {
|
|
|
- if(_index == 2){
|
|
|
- _itemHtml += '\
|
|
|
- <div style="flex: 0 0 100%;height:120px;padding-top: 40px;" class="targetItem">\
|
|
|
- <div class="number">'+ _item.value + '</div>\
|
|
|
- <div class="name">'+ _item.name +'</div>\
|
|
|
- </div>';
|
|
|
+
|
|
|
+ var option1 = {
|
|
|
+ title:{
|
|
|
+ text: '近期行驶里程',
|
|
|
+ x:'center',
|
|
|
+ },
|
|
|
+ color: ['#3398DB'],
|
|
|
+ tooltip : {
|
|
|
+ trigger: 'axis',
|
|
|
+ axisPointer : { // 坐标轴指示器，坐标轴触发有效
|
|
|
+ type : 'shadow' // 默认为直线，可选为：'line' | 'shadow'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ grid: {
|
|
|
+ left: '3%',
|
|
|
+ right: '4%',
|
|
|
+ bottom: '3%',
|
|
|
+ containLabel: true
|
|
|
+ },
|
|
|
+ xAxis : [
|
|
|
+ {
|
|
|
+ type : 'category',
|
|
|
+ data : xData,
|
|
|
+ axisTick: {
|
|
|
+ alignWithLabel: true
|
|
|
+ },
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ yAxis : [
|
|
|
+ {
|
|
|
+ name: '里程/公里',
|
|
|
+ type : 'value'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ series : [
|
|
|
+ {
|
|
|
+ name:'行驶里程',
|
|
|
+ type:'bar',
|
|
|
+ barWidth: '50%',
|
|
|
+ data:sData
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+
|
|
|
+ chartMap['drive-data-bar'].setOption(option1);
|
|
|
+
|
|
|
+ //列表数据
|
|
|
+ //renlian.httpget(config.webapi + "renlian/adms/desktop/data", { type: 'Target', id: _item.F_Id }, function(data){});
|
|
|
+ // var drivingdata = '[{"name":"里程总计","value":"236.00km"},{"name":"累计时长","value":"1天00时00分"},{"name":"平均速度", "value":"9.83km/h"}]';
|
|
|
+ // data = JSON.parse(drivingdata);
|
|
|
+ var _itemHtml = ''
|
|
|
+ $.each(drivingdata, function (_index, _item) {
|
|
|
+ if(_index == 2){
|
|
|
+ _itemHtml += '\
|
|
|
+ <div style="flex: 0 0 100%;height:120px;padding-top: 40px;" class="targetItem">\
|
|
|
+ <div class="number">'+ _item.value + '</div>\
|
|
|
+ <div class="name">'+ _item.name +'</div>\
|
|
|
+ </div>';
|
|
|
+ }else{
|
|
|
+ _itemHtml += '\
|
|
|
+ <div style="flex: 0 0 50%;height:120px;padding-top: 40px;" class="targetItem">\
|
|
|
+ <div class="number">'+ _item.value + '</div>\
|
|
|
+ <div class="name">'+ _item.name +'</div>\
|
|
|
+ </div>';
|
|
|
+ }
|
|
|
+ $page.find('#driving-data').html(_itemHtml);
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
}else{
|
|
|
- _itemHtml += '\
|
|
|
- <div style="flex: 0 0 50%;height:120px;padding-top: 40px;" class="targetItem">\
|
|
|
- <div class="number">'+ _item.value + '</div>\
|
|
|
- <div class="name">'+ _item.name +'</div>\
|
|
|
- </div>';
|
|
|
+
|
|
|
}
|
|
|
- $page.find('#driving-data').html(_itemHtml);
|
|
|
- });
|
|
|
+ });
|
|
|
+
|
|
|
}
|
|
|
};
|
|
|
return page;
|
git
