<template>
  <!-- 修改节点配置-->
  <div align="center">
    <!-- 自定义表单对话框 -->
    <el-drawer :modal="false" :visible.sync="disp.updFlag" direction="rtl" title="节点配置" append-to-body size="60%">
      <div align="center">

        <span v-if="node.type === 'table'">
          <TableUpd :disp="disp" />
        </span>
        <span v-else-if="node.type === 'exportation'">
          <ExporUpd :disp="disp" :data="data" :node="node" />
        </span>

        <br><br>
        <el-button type="primary" @click="saveDisposition">确 定</el-button>
        <el-button @click="disp.updFlag = false">取 消</el-button>
      </div>
    </el-drawer>
  </div>
</template>

<script>
// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）,
// 例如：import 《组件名称》 from '《组件路径》,
import TableUpd from './type/tableUpd.vue'
import ExporUpd from './type/exporUpd.vue'
import {batchAddUpd} from "@/api/quest/disposition";

export default {
  // import引入的组件需要注入到对象中才能使用"
  name: 'type-table',
  components: {TableUpd, ExporUpd},
  props: {
    data: {},
    node: {},
    disp: {
      nodeCode: undefined,
      nodeType: undefined,
      findFlag: false,
      updFlag: false,
      formData: {
        db: {},
        fields: []
      }
    },

  },
  data() {
    // 这里存放数据"
    return {}
  },
  // 计算属性 类似于data概念",
  computed: {},
  // 方法集合",
  methods: {
    // 保存配置按钮
    saveDisposition() {
      const dispData = this.disp.formData
      const dispList = this.getMysqlDisp(dispData.db,dispData.fields)
      console.log(dispData)
      console.log(dispList)
      batchAddUpd(dispList, this.disp.nodeCode).then(res => {
        this.$message.success(res.msg)
        this.disp.updFlag = false
      })
    },
    /** 类型转换 vue -> mysql*/
    getMysqlDisp(db, fields) {
      const dispList = []
      dispList.push({
        nodeCode: this.disp.nodeCode,
        dispKey: 'db',
        dispLabel: '数据库',
        dispValue: db.dbName,
        dispType: 'string'
      },{
        nodeCode: this.disp.nodeCode,
        dispKey: 'table',
        dispLabel: db.tableComment,
        dispValue: db.tableName,
        dispType: 'string'
      })
      fields.forEach(field => {
        dispList.push({
          nodeCode: this.disp.nodeCode,
          dispKey: 'fields',
          dispLabel: field.fieldComment,
          dispValue: field.fieldName,
          dispType: field.fieldType
        })
      })
      return dispList;
    },

  }
}
</script>
<style scoped>

</style>
