Commit 5c6211f3 authored by 华国豪's avatar 华国豪 🙄

新增收客人头数

parent 9d0ad942
...@@ -467,19 +467,19 @@ ...@@ -467,19 +467,19 @@
<div class="item"> <div class="item">
<div>30日平均</div> <div>30日平均</div>
<div> <div>
{{day_line_statics[0].OrderPercent*100}}<span class="sub">%</span><img src="../../assets/img/viitto/lvsedian.png" alt=""> {{Math.round(day_line_statics[0].OrderPercent*10000) / 100}}<span class="sub">%</span><img src="../../assets/img/viitto/lvsedian.png" alt="">
</div> </div>
</div> </div>
<div class="item"> <div class="item">
<div>60日平均</div> <div>60日平均</div>
<div> <div>
{{day_line_statics[1].OrderPercent*100}}<span class="sub">%</span><img src="../../assets/img/viitto/hongsedian.png" alt=""> {{Math.round(day_line_statics[1].OrderPercent*10000) / 100}}<span class="sub">%</span><img src="../../assets/img/viitto/hongsedian.png" alt="">
</div> </div>
</div> </div>
<div class="item"> <div class="item">
<div>90日平均</div> <div>90日平均</div>
<div> <div>
{{day_line_statics[1].OrderPercent*100}}<span class="sub">%</span><img src="../../assets/img/viitto/hongsedian.png" alt=""> {{Math.round(day_line_statics[2].OrderPercent*10000) / 100}}<span class="sub">%</span><img src="../../assets/img/viitto/hongsedian.png" alt="">
</div> </div>
</div> </div>
</div> </div>
......
...@@ -114,17 +114,22 @@ export default { ...@@ -114,17 +114,22 @@ export default {
left: 80, left: 80,
right: 10, right: 10,
top: '5%', top: '5%',
height: '24%' height: '16%'
}, { }, {
left: 80, left: 80,
right: 10, right: 10,
top: '37%', top: '28%',
height: '24%' height: '16%'
}, { }, {
left: 80, left: 80,
right: 10, right: 10,
top: '68%', top: '51%',
height: '24%' height: '16%'
}, {
left: 80,
right: 10,
top: '74%',
height: '16%'
} }
], ],
xAxis : [ xAxis : [
...@@ -150,6 +155,14 @@ export default { ...@@ -150,6 +155,14 @@ export default {
boundaryGap : false, boundaryGap : false,
data: _this.dateList, data: _this.dateList,
position: 'bottom', position: 'bottom',
"show": false,
},
{
gridIndex: 3,
type : 'category',
boundaryGap : false,
data: _this.dateList,
position: 'bottom',
"show": true, "show": true,
axisLabel: { axisLabel: {
color: '#fff', color: '#fff',
...@@ -199,6 +212,26 @@ export default { ...@@ -199,6 +212,26 @@ export default {
}, },
{ {
gridIndex: 2, gridIndex: 2,
name : '收客人头数 '+ _this.day_total_guestprice.OrderCount,
type : 'value',
inverse: false,
splitLine: {
lineStyle: {
color: '#30374E',
type: 'dashed'
}
},
nameTextStyle: {
color: '#ffffff',
padding: [0, 0, 0, 80],
fontSize: 18
},
axisLabel: {
color: '#32ff7e',
}
},
{
gridIndex: 3,
name : '产品点击 '+ _this.day_total_guestprice.ClickCount, name : '产品点击 '+ _this.day_total_guestprice.ClickCount,
type : 'value', type : 'value',
inverse: false, inverse: false,
...@@ -282,8 +315,9 @@ export default { ...@@ -282,8 +315,9 @@ export default {
} }
}, },
}, },
,
{ {
name:'产品点击', name:'收客人头数',
type:'line', type:'line',
xAxisIndex: 2, xAxisIndex: 2,
yAxisIndex: 2, yAxisIndex: 2,
...@@ -291,6 +325,37 @@ export default { ...@@ -291,6 +325,37 @@ export default {
hoverAnimation: true, hoverAnimation: true,
smooth: true, smooth: true,
showSymbol: false, showSymbol: false,
data: _this.guestnumList,
itemStyle: {
borderWidth: 2,
color: '#3FD2F3',
shadowBlur: 5,
shadowColor: 'rgba(255,250,0,1)'
},
lineStyle: {
color: "#32ff7e",
shadowBlur: 5,
width: 3,
shadowColor: "#3ae374"
},
areaStyle: {
normal: {
color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: "rgba(50, 255, 126,1)" },
{ offset: .8, color: "rgba(50, 255, 126,0)" }
])
}
},
},
{
name:'产品点击',
type:'line',
xAxisIndex: 3,
yAxisIndex: 3,
symbolSize: 2,
hoverAnimation: true,
smooth: true,
showSymbol: false,
data: _this.clickcountList, data: _this.clickcountList,
itemStyle: { itemStyle: {
borderWidth: 2, borderWidth: 2,
......
...@@ -54,7 +54,18 @@ export default { ...@@ -54,7 +54,18 @@ export default {
},mounted() { },mounted() {
let data = this.lineChartKData.map(function (item) { let data = this.lineChartKData.map(function (item) {
return [+item.StartPrice, +item.EndPrice, +item.MinPrice, +item.MaxPrice, +item.ClickCount, +item.FiveAvg, +item.TenAvg, +item.ThirtyAvg, +item.NinetyAvg, +item.ThirtyMonthAvg]; return [
+item.StartPrice,
+item.EndPrice,
+item.MinPrice,
+item.MaxPrice,
+item.ClickCount,
+item.FiveAvg,
+item.TenAvg,
+item.ThirtyAvg,
+item.NinetyAvg,
+item.ThirtyMonthAvg
];
}); });
var dates = this.lineChartKData.map(function (item) { var dates = this.lineChartKData.map(function (item) {
return item.CreateDate; return item.CreateDate;
...@@ -109,42 +120,81 @@ export default { ...@@ -109,42 +120,81 @@ export default {
opacity: 1 opacity: 1
} }
}, },
formatter: function (params) {
if (typeof(params[0].value) !== "object") {// 防止放上去提示undefined
var res = "成交单价"
res += '<br/> 5日平均: ' + params[0].value
res += '<br/> 10日平均: ' + params[1].value
res += '<br/> 30日平均: ' + params[2].value
res += '<br/> 90日平均: ' + params[3].value
res += '<br/> 180日平均: ' + params[4].value
// res += '<br/> 点击: ' + params[5].value
return res
} else {
var res = "成交单价"
res += '<br/> 开始值: ' + params[0].value[1]
res += '<br/> 结束值: ' + params[0].value[2]
res += '<br/> 最低值: ' + params[0].value[3]
res += '<br/> 最高值: ' + params[0].value[4]
res += '<br/> 5日平均: ' + params[0].value[6]
res += '<br/> 10日平均: ' + params[0].value[7]
res += '<br/> 30日平均: ' + params[0].value[8]
res += '<br/> 90日平均: ' + params[0].value[9]
res += '<br/> 180日平均: ' + params[0].value[10]
// res += '<br/> 点击: ' + params[0].value[5]
return res
}
},
}, },
xAxis: { xAxis: {
type: 'category', type: 'category',
data: _this.dates, data: _this.dates,
axisLine: { lineStyle: { color: '#8392A5' } } axisLine: { lineStyle: { color: '#8392A5' } },
splitLine: {
show: true,
lineStyle: {
type: 'dashed',
color: '#4a4a4a'
}
}
}, },
yAxis: [{ yAxis: [{
scale: true, scale: true,
axisLine: { lineStyle: { color: '#8392A5' } }, axisLine: { lineStyle: { color: '#8392A5' } },
splitLine: { show: false } splitLine: {
}, show: true,
{
name : '产品点击',
type : 'value',
position: 'right',
splitLine: {
show: false,
lineStyle: { lineStyle: {
color: '#30374E', type: 'dashed',
type: 'dashed' color: '#4a4a4a'
} }
}, }
nameTextStyle: { },
color: '#ffffff', // {
padding: [0, 60, 0, 0], // name : '产品点击',
fontSize: 18 // type : 'value',
}, // position: 'right',
axisLabel: { // splitLine: {
color: '#12BBFF', // show: false,
}, // lineStyle: {
} // color: '#30374E',
// type: 'dashed'
// }
// },
// nameTextStyle: {
// color: '#ffffff',
// padding: [0, 60, 0, 0],
// fontSize: 18
// },
// axisLabel: {
// color: '#12BBFF',
// },
// }
], ],
grid: { grid: {
bottom: 80, bottom: 80,
left: 70, left: 70,
right: 70, right: 10,
}, },
dataZoom: [{ dataZoom: [{
textStyle: { textStyle: {
...@@ -180,12 +230,12 @@ export default { ...@@ -180,12 +230,12 @@ export default {
name: '成交单价', name: '成交单价',
data: _this.dataList, data: _this.dataList,
itemStyle: { itemStyle: {
normal: { normal: {
color: '#FD1050', color: '#FD1050',
color0: '#0CF49B', color0: '#0CF49B',
borderColor: '#FD1050', borderColor: '#FD1050',
borderColor0: '#0CF49B' borderColor0: '#0CF49B'
} }
} }
}, },
{ {
...@@ -197,7 +247,7 @@ export default { ...@@ -197,7 +247,7 @@ export default {
showSymbol: false, showSymbol: false,
z: 3, z: 3,
lineStyle: { lineStyle: {
width: 3, width: 1,
} }
}, },
{ {
...@@ -209,7 +259,7 @@ export default { ...@@ -209,7 +259,7 @@ export default {
showSymbol: false, showSymbol: false,
z: 3, z: 3,
lineStyle: { lineStyle: {
width: 3, width: 1,
} }
}, },
{ {
...@@ -221,7 +271,7 @@ export default { ...@@ -221,7 +271,7 @@ export default {
showSymbol: false, showSymbol: false,
z: 3, z: 3,
lineStyle: { lineStyle: {
width: 3, width: 1,
} }
}, },
{ {
...@@ -233,7 +283,7 @@ export default { ...@@ -233,7 +283,7 @@ export default {
showSymbol: false, showSymbol: false,
z: 3, z: 3,
lineStyle: { lineStyle: {
width: 3, width: 1,
} }
}, },
{ {
...@@ -245,20 +295,20 @@ export default { ...@@ -245,20 +295,20 @@ export default {
showSymbol: false, showSymbol: false,
z: 3, z: 3,
lineStyle: { lineStyle: {
width: 3, width: 1,
}
},
{
name: '产品点击',
type: 'line',
data: calculateMA(4, _this.dataList),
smooth: true,
yAxisIndex: 1,
showSymbol: false,
lineStyle: {
width: 3,
} }
}, },
// {
// name: '产品点击',
// type: 'line',
// data: calculateMA(4, _this.dataList),
// smooth: true,
// yAxisIndex: 1,
// showSymbol: false,
// lineStyle: {
// width: 3,
// }
// },
] ]
} }
_this.myChart.setOption(option); _this.myChart.setOption(option);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment