<template>
  <PageWrapper dense contentFullHeight contentClass="flex">
    <StMetricList class="w-1/2 xl:w-1/2" @onClickRow1="clickMetricRow" />
    <MetricReportDataMonitor class="w-1/2 xl:w-1/2" :data="metricData" ref="refMetricReportList" />
  </PageWrapper>
</template>

<script lang="ts" setup>
  import { ref, nextTick } from 'vue';
  import StMetricList from './components/StMetricList.vue';
  import { PageWrapper } from '/@/components/Page';
  import MetricReportDataMonitor from './MetricReportDataMonitor.vue';
  const metricData = ref({});
  function clickMetricRow(metricObj) {
    nextTick(() => {
      metricData.value = metricObj;
    });
  }
</script>
