<template>
  <el-dialog
    v-bind="$attrs"
    :close-on-click-modal="false"
    :modal-append-to-body="false"
    append-to-body
    v-on="$listeners"
    @open="onOpen"
    @close="onClose"
    class="JNPF-dialog JNPF-dialog_center"
    title="预览"
    :width="formConf.generalWidth"
  >
    <parser :form-conf="formConf" :relation-conf="relationConf" @submit="sumbitForm" :key="key" ref="dynamicForm" />
    <div slot="footer">
      <el-button @click="close">{{ formConf.cancelButtonText || '取 消' }}</el-button>
      <el-button type="primary" @click="handelConfirm">{{ formConf.confirmButtonText || '确 定' }} </el-button>
    </div>
  </el-dialog>
</template>

<script>
import Parser from '@/components/Generator/parser/Parser'

export default {
  components: {
    Parser
  },
  props: ['formData', 'relationData'],
  data() {
    return {
      key: +new Date(),
      formConf: {},
      relationConf: []
    }
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  methods: {
    onOpen() {
      this.key = +new Date()
      this.formConf = this.formData
      this.relationConf = this.relationData
    },
    onClose() {},
    close(e) {
      this.$emit('update:visible', false)
    },
    handelConfirm() {
      this.$refs.dynamicForm && this.$refs.dynamicForm.submitForm()
    },
    fillFormData(form, data) {
      form.fields.forEach((item) => {
        const val = data[item.__vModel__]
        if (val) {
          item.__config__.defaultValue = val
        }
      })
    },
    sumbitForm(data) {
      console.log('sumbitForm提交数据：', data)
      // 输入查询字符和对象，返回匹配的键的值组成的对象
      function searchHostObject(query, object) {
        const result = {}
        for (const key in object) {
          if (!object.hasOwnProperty(key) || !key.includes(query)) {
            result[key] = object[key]
          }
        }
        return result
      }
      function searchAssistantObject(query, object) {
        let result = []
        for (const key in object) {
          if (object.hasOwnProperty(key) && key.includes(query)) {
            result = object[key]
          }
        }
        return result
      }
      //查询主表字段
      const HostObj = searchHostObject('tableField', data)
      //查询子表字段
      const AssistantArray = searchAssistantObject('tableField', data)
      console.log(HostObj)
      if (AssistantArray.length) {
        AssistantArray.forEach((i, k) => {
          Object.assign(i, HostObj)
        })
      }
      console.log(AssistantArray)
    }
  }
}
</script>
