<template>
  <div>
    <div class="defaultLink" @click="handleShow">
      <slot></slot>
    </div>
    <m-dialog :title="title" :visible.sync="show" widthType="1">
      <MGraph v-if="show" :to-api="toApi" :query="{ id }" :meta="false" style="height: calc( 90vh - 150px)"></MGraph>
    </m-dialog>
  </div>
</template>

<script>
import MDialog from '@/components/Dialog'
import MGraph from './mGraph.vue'
import { api } from '@/api/dataGovernance'
export default {
  name: 'm-graph-drill',
  components: {
    MDialog,
    MGraph
  },
  props: {
    toApi: {
      type: Function,
      default: api.dataLabelGraph
    },
    title: {
      type: String,
      default: '明细'
    },
    id: {
      type: Number,
      default: -1
    }
  },
  data () {
    return {
      api,
      show: false
    }
  },
  methods: {
    handleShow () {
      this.show = true
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
