<script setup lang="ts">
/**
 * @Name: index.vue
 * @Description: 分析页
 * @Author: Cheney
 */
import { onBeforeUnmount, provide, ref } from 'vue';
import QueryCondition from './QueryCondition.vue';
import IndicatorOverview from './IndicatorOverview.vue';
import IndicatorChart from './IndicatorChart.vue';
import QuerySummary from './QuerySummary.vue';
import emitter from '/@/utils/emitter';

const filter = ref({
  // 初始化 QueryCondition组件的filter
  layerType: 'asin_view',
  searchTerm: '',
  reportType: 'MONTHLY',
  reportDate: '',
  variable: 'B00TEST0001',
  metric: 'Search_Query_Score',
});

provide('filter', filter);

emitter.on('QueryCondition-dateChange', (data: any) => {
  filter.value.reportDate = data;
});

onBeforeUnmount(() => {
  emitter.all.clear();
});
</script>

<template>
  <div class="py-2 px-2.5">
    <QueryCondition />
    <IndicatorOverview />
    <IndicatorChart />
    <QuerySummary />
  </div>
</template>

<style scoped></style>
