<template>
  <div>
    <lineChartModel :tableData="tableData" :lineListData="lineListData" :totalProfit="totalProfit" title="收益" />
    <lineChartModel :tableData="tableData" :lineListData="lineListData" :totalProfit="totalProfit" :type="'ecpm'"
      title="ECPM趋势" />

    <userDataChart />
  </div>
</template>

<script setup>
import { ref, onBeforeMount } from 'vue'
import { getIndexProfit, getIndexHourReport } from '@/api/dashboard.js'
import lineChartModel from './lineChartModel.vue'
import userDataChart from './userDataChart.vue'

// 表格初始化数据
const tableData = ref([
  { platform: "穿山甲", today: "0.00", yesterday: "0.00", month: "0.00", ecpmToday: "0.00", ecpmYesterday: "0.00", ecpmMonth: "0.00" },
  { platform: "腾讯广告", today: "0.00", yesterday: "0.00", month: "0.00", ecpmToday: "0.00", ecpmYesterday: "0.00", ecpmMonth: "0.00" },
  { platform: "百度联盟", today: "0.00", yesterday: "0.00", month: "0.00", ecpmToday: "0.00", ecpmYesterday: "0.00", ecpmMonth: "0.00" },
  { platform: "快手", today: "0.00", yesterday: "0.00", month: "0.00", ecpmToday: "0.00", ecpmYesterday: "0.00", ecpmMonth: "0.00" },
  { platform: "Sigmob", today: "0.00", yesterday: "0.00", month: "0.00", ecpmToday: "0.00", ecpmYesterday: "0.00", ecpmMonth: "0.00" },
])
const totalProfit = ref({})
const getIndexProfitData = async () => {
  const res = await getIndexProfit()
  tableData.value = res.data

  const summary = res.data.reduce((acc, cur) => {
    acc.today += parseFloat(cur.today)
    acc.yesterday += parseFloat(cur.yesterday)
    acc.month += parseFloat(cur.month)
    acc.ecpmToday += parseFloat(cur.ecpmToday)
    acc.ecpmYesterday += parseFloat(cur.ecpmYesterday)
    acc.ecpmMonth += parseFloat(cur.ecpmMonth)
    return acc
  }, { today: 0, yesterday: 0, month: 0, ecpmToday: 0, ecpmYesterday: 0, ecpmMonth: 0 })

  // 格式化为两位小数字符串
  totalProfit.value = {
    today: summary.today.toFixed(2),
    yesterday: summary.yesterday.toFixed(2),
    month: summary.month.toFixed(2),
    ecpmToday: summary.ecpmToday.toFixed(2),
    ecpmYesterday: summary.ecpmYesterday.toFixed(2),
    ecpmMonth: summary.ecpmMonth.toFixed(2),
  }
}

const lineListData = ref({})
const getIndexHourReportData = async () => {
  const res = await getIndexHourReport()

  // 整理 lineListData
  lineListData.value = res.data.reduce((acc, item) => {
    const { channelName, estimatedRevenueList, estimatedRevenueEcpmList } = item;
    acc[channelName] = { estimatedRevenueList, estimatedRevenueEcpmList };
    return acc;
  }, {});
}

onBeforeMount(async () => {
  await getIndexProfitData()
  await getIndexHourReportData()
})

</script>

<style lang="scss" scoped></style>