<template>
  <div  class="go-content-box">
      <n-button class="content"  @click="handleClick" v-bind={...attribute}>{{dataset}}</n-button>
  </div>
</template>
<script setup lang="ts">
import { PropType, toRefs } from 'vue'
import { CreateComponentType } from '@/packages/index.d'
import {option as configOption} from './config'


const props = defineProps({
  chartConfig: {
    type: Object as PropType<CreateComponentType>,
    required: true
  }
})

//修改默认宽高距离位置
props.chartConfig.attr.w = 100
props.chartConfig.attr.h = 50
props.chartConfig.attr.x = 200
props.chartConfig.attr.y = 200

const { dataset,attribute }= toRefs(props.chartConfig.option) as unknown as typeof configOption

const { w, h } = toRefs(props.chartConfig.attr)

const handleClick=()=>{
  attribute.loading=true
  window['$message'].success('您点击了按钮')
  attribute.loading=false
}



</script>

<style lang="scss" scoped>
.go-content-box{
  display: flex;
  align-items: center;
  justify-content: center;
  .content{
    width:v-bind('w + "px"');
    height:v-bind('h + "px"');
  }
}
</style>