|
@@ -137,7 +137,16 @@ const initLineChart = (dataList: Array<any>) => {
|
|
|
textStyle: { fontSize: 15, color: state.charts.color }
|
|
textStyle: { fontSize: 15, color: state.charts.color }
|
|
|
},
|
|
},
|
|
|
grid: { top: 70, right: 80, bottom: 30, left: 60 },
|
|
grid: { top: 70, right: 80, bottom: 30, left: 60 },
|
|
|
- tooltip: { trigger: "axis" },
|
|
|
|
|
|
|
+ tooltip: {
|
|
|
|
|
+ trigger: "axis",
|
|
|
|
|
+ formatter: (params: any) => {
|
|
|
|
|
+ const bar = params.find((p: any) => p.seriesName === "洗车量");
|
|
|
|
|
+ const line = params.find((p: any) => p.seriesName === "总金额");
|
|
|
|
|
+ const barVal = bar ? `${bar.value} 次` : "";
|
|
|
|
|
+ const lineVal = line ? `¥${line.value}` : "";
|
|
|
|
|
+ return `${params[0].axisValue}<br/>${barVal}<br/>${lineVal}`;
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
legend: { data: ["洗车量", "总金额"], right: 10, top: 5 },
|
|
legend: { data: ["洗车量", "总金额"], right: 10, top: 5 },
|
|
|
xAxis: {
|
|
xAxis: {
|
|
|
data: dataList.map(k => k.startTime),
|
|
data: dataList.map(k => k.startTime),
|
|
@@ -146,9 +155,17 @@ const initLineChart = (dataList: Array<any>) => {
|
|
|
yAxis: [
|
|
yAxis: [
|
|
|
{
|
|
{
|
|
|
type: "value",
|
|
type: "value",
|
|
|
- name: "费用/元 洗车量/次",
|
|
|
|
|
|
|
+ name: "洗车量/次",
|
|
|
position: "left",
|
|
position: "left",
|
|
|
|
|
+ axisLabel: { color: "#68a7a0" },
|
|
|
splitLine: { show: true, lineStyle: { type: "dashed", color: "#f0f0f0" } }
|
|
splitLine: { show: true, lineStyle: { type: "dashed", color: "#f0f0f0" } }
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ type: "value",
|
|
|
|
|
+ name: "费用/元",
|
|
|
|
|
+ position: "right",
|
|
|
|
|
+ axisLabel: { color: "#409EFF" },
|
|
|
|
|
+ splitLine: { show: false }
|
|
|
}
|
|
}
|
|
|
],
|
|
],
|
|
|
series: [
|
|
series: [
|
|
@@ -156,7 +173,7 @@ const initLineChart = (dataList: Array<any>) => {
|
|
|
name: "洗车量",
|
|
name: "洗车量",
|
|
|
type: "bar",
|
|
type: "bar",
|
|
|
barWidth: 10,
|
|
barWidth: 10,
|
|
|
- smooth: true,
|
|
|
|
|
|
|
+ yAxisIndex: 0,
|
|
|
data: dataList.map(k => k.totalOrders),
|
|
data: dataList.map(k => k.totalOrders),
|
|
|
itemStyle: {
|
|
itemStyle: {
|
|
|
color: "#68a7a0",
|
|
color: "#68a7a0",
|
|
@@ -170,7 +187,8 @@ const initLineChart = (dataList: Array<any>) => {
|
|
|
symbolSize: 6,
|
|
symbolSize: 6,
|
|
|
symbol: "circle",
|
|
symbol: "circle",
|
|
|
smooth: true,
|
|
smooth: true,
|
|
|
- data: dataList.map(k => fmtMoney(k.totalAmount)),
|
|
|
|
|
|
|
+ yAxisIndex: 1,
|
|
|
|
|
+ data: dataList.map(k => (k.totalAmount / 100).toFixed(2)),
|
|
|
lineStyle: { color: "#409EFF" },
|
|
lineStyle: { color: "#409EFF" },
|
|
|
itemStyle: { color: "#409EFF", borderColor: "#409EFF" }
|
|
itemStyle: { color: "#409EFF", borderColor: "#409EFF" }
|
|
|
}
|
|
}
|