<!--
 * @Author: 曹捷
 * @Date: 2021-08-31 15:21:35
 * @LastEditors: 曹捷
 * @LastEditTime: 2021-08-31 16:51:51
 * @Description: header 区域
-->
<template>
  <div class="form-panel-head h100">
    <div @click="$router.go(-1)">
      <i class="iconfont icon-direction-left"></i>
    </div>
    <a-radio-group v-model:value="selectData" @change="changeType" button-style="solid">
      <a-radio-button value="form">表单生成</a-radio-button>
      <a-radio-button value="table">列表生成</a-radio-button>
    </a-radio-group>
    <div class="menu-right flex-c">
      <a-button type="link" block class="m-r-10" @click="$emit('rule')">
        <i class="iconfont icon-upload2 p-r-5"></i>
        导入规则
      </a-button>
      <a-button type="link" block class="m-r-10" @click="$emit('download')">
        <i class="iconfont icon-download p-r-5"></i>
        导出Vue文件
      </a-button>
    </div>
  </div>
</template>

<script  >
export default {
  props: {
    selectKey: {
      type: String
    }
  },
  setup (props, context) {
    let _data = reactive({
      selectData: props.selectKey,
    })
    let _methods = {
      changeType (value) {
        context.emit('update:selectKey', value.target.value)
      }
    }
    return {
      ...toRefs(_data),
      ..._methods
    }
  }
}
</script>

<style lang="less">
.form-panel-head {
  padding: 0 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
</style>