import { compactMoneyAxis, moneyMajor } from "../../utils/format.js"; import { niceAxis } from "./createMetricTrendOption.js"; export function createReportRevenueOption(series) { const labels = series.map((item) => item.label); const channelValues = series.map((item) => moneyMajor(item.google) + moneyMajor(item.mifapay) + moneyMajor(item.coin_seller)); const totalValues = series.map((item) => moneyMajor(item.lineTotal ?? item.total)); const channelAxis = niceAxis(channelValues); const totalAxis = niceAxis(totalValues); return { animationDuration: 520, color: ["#1688d9", "#18a389", "#6377e8", "#172033"], grid: { bottom: 30, left: 54, right: 54, top: 42 }, legend: [ { data: ["Google", "MifaPay", "币商"], icon: "roundRect", itemGap: 16, itemHeight: 8, itemWidth: 12, left: 18, textStyle: { color: "#5f6f86", fontSize: 12 }, top: 0 }, { data: ["总计 (USD)"], itemGap: 8, itemHeight: 8, itemWidth: 18, right: 18, textStyle: { color: "#172033", fontSize: 12 }, top: 0 } ], tooltip: { backgroundColor: "#ffffff", borderColor: "#d8e2ed", extraCssText: "box-shadow: 0 14px 34px rgba(15, 23, 42, .14);", textStyle: { color: "#172033" }, trigger: "axis" }, xAxis: { axisLabel: { color: "#6b7a90", margin: 10 }, axisLine: { lineStyle: { color: "#dbe5ef" } }, axisTick: { show: false }, boundaryGap: true, data: labels, type: "category" }, yAxis: [ { axisLabel: { color: "#6b7a90", formatter: compactMoneyAxis }, axisTick: { show: false }, interval: channelAxis.interval, max: channelAxis.max, min: 0, splitLine: { lineStyle: { color: "rgba(104, 123, 148, 0.16)", type: "dashed" } }, type: "value" }, { axisLabel: { color: "#6b7a90", formatter: compactMoneyAxis }, axisTick: { show: false }, interval: totalAxis.interval, max: totalAxis.max, min: 0, splitLine: { show: false }, type: "value" } ], series: [ { barGap: "-100%", barWidth: 26, data: series.map((item) => moneyMajor(item.google)), emphasis: { focus: "series" }, name: "Google", stack: "recharge", type: "bar" }, { barWidth: 26, data: series.map((item) => moneyMajor(item.mifapay)), emphasis: { focus: "series" }, name: "MifaPay", stack: "recharge", type: "bar" }, { barWidth: 26, data: series.map((item) => moneyMajor(item.coin_seller)), emphasis: { focus: "series" }, name: "币商", stack: "recharge", type: "bar" }, { data: series.map((item) => moneyMajor(item.lineTotal ?? item.total)), lineStyle: { color: "#172033", shadowBlur: 8, shadowColor: "rgba(23, 32, 51, .14)", width: 3 }, name: "总计 (USD)", smooth: 0.42, symbol: "circle", symbolSize: 7, itemStyle: { borderColor: "#ffffff", borderWidth: 2, color: "#172033" }, type: "line", yAxisIndex: 1, z: 4 } ] }; }