<template>
  <view class="admin-page-container">
    <text class="placeholder-title">Marketing Statistics</text>
    <view class="chart-box">
      <EChartsView :option="chartOption" class="chart-view" />
    </view>
  </view>
</template>

<script setup lang="uts">
import { ref } from 'vue'
import EChartsView from '@/uni_modules/charts/EChartsView.uvue'

const chartOption = ref({
  title: { text: 'Marketing Statistics Demo' },
  tooltip: {},
  xAxis: { data: ['A', 'B', 'C', 'D'] },
  yAxis: {},
  series: [{ type: 'bar', data: [5, 20, 36, 10] }]
})
</script>

<style scoped>
.admin-page-container { padding: 20px; }
.placeholder-title { font-size: 24px; font-weight: bold; margin-bottom: 20px; }
.chart-box { height: 300px; background: #fff; border: 1px solid #eee; }
.chart-view { width: 100%; height: 100%; }
</style>
