<template>
  <el-card shadow="hover" v-loading="loading">
    <template #header>
      <span>进行中节点停留统计</span>
      <span class="sub-title">点击柱形可下钻明细</span>
    </template>
    <v-chart
      v-if="option"
      :option="option"
      autoresize
      style="height: 320px"
      @click="onChartClick"
    />
    <el-empty v-else description="暂无数据" />
  </el-card>
</template>

<script setup lang="ts">
import VChart from 'vue-echarts'

const props = defineProps<{
  option: any
  loading: boolean
}>()

const emit = defineEmits<{
  nodeClick: [params: any]
}>()

function onChartClick(params: any) {
  emit('nodeClick', params)
}
</script>

<style scoped>
.sub-title {
  margin-left: 8px;
  font-size: 12px;
  color: #909399;
  font-weight: normal;
}
</style>
