<!--
 * @Descripttion:
 * @version:
 * @Author: Tanlei
 * @Date: 2022-02-28 14:55:21
 * @LastEditors:
 * @LastEditTime: 2022-02-28 14:56:49
-->
<template>
  <div>
    <avue-form ref="form" class="preview-form" :option="option" v-model="form" @submit="handlePreviewSubmit">
    </avue-form>
    <div class="but-box">
      <a-button v-if="isBack" class="closeBtn" type="add" @click="onBack">
        上一步
      </a-button>

      <a-button class="closeBtn" type="add" @click="onVerify">
        唯一性校验
      </a-button>

      <a-button class="closeBtn" type="add" @click="onSave">
        仅保存
      </a-button>

      <a-button class="submitBtn" type="add" @click="onSubmit">
        提交审批
      </a-button>
    </div>
  </div>

</template>

<script type="text/ecmascript-6">
import { getFormModel } from '@/api/model/genenrteTable'
import { getAttrByModelId, uniquenessCheck, addMasterData, editMasterData, mdDataBatchSub } from '@/api/masterDataManger/addingMasterData'
import { validateEmail, validateIdCard, validatePhone, validatePostalCode, validateCustom } from '@/core/vaildateRules'

export default {
  props: {
    modelId: {
      type: String,
      default: ''
    },
    selectedRows: {
      type: Object,
      default() {
        return {}
      }
    },
    isBack: {
      type: Boolean,
      default() {
        return false
      }
    },
    recordId: {
      type: String,
      default() {
        return ''
      }
    },
    id: {
      type: String,
      default() {
        return ''
      }
    },
    ischange: {
      type: String,
      default() {
        return ''
      }
    },
    modelCode: {
      type: String,
      default() {
        return ''
      }
    },
    addChange: {
      type: String,
      default() {
        return ''
      }
    }
  },
  data() {
    return {
      form: {},
      option: {
        emptyBtn: false,
        menuBtn: false,
        submitBtn: false
      },
      showState: true
    }
  },
  mounted() {
    this.getFormModel()
  },
  created() {
    if (this.selectedRows.logJson) {
      this.form = JSON.parse(JSON.parse(JSON.stringify(this.selectedRows.logJson)))
    } else if (this.changeType === 'change') {
      this.form = JSON.parse(JSON.stringify(this.selectedRows))
    }
    this.getAllAttrByModelId()
    this.addReset()
  },
  methods: {
    getFormModel() {
      getFormModel({ modelId: this.modelId }).then((res) => {
        if (res.code === 200) {
          const { data } = res
          data.emptyBtn = false
          data.menuBtn = false
          data.submitBtn = false
          data.column.forEach(item => {
            if (['input', 'textarea'].includes(item.type)) {
              this.form[item.prop] = item.value
              if (item.isValidationType === 'email') item.rules.push({ validator: validateEmail, trigger: 'blur', label: item.label })
              if (item.isValidationType === 'IdCard') item.rules.push({ validator: validateIdCard, trigger: 'blur', label: item.label })
              if (item.isValidationType === 'phone') item.rules.push({ validator: validatePhone, trigger: 'blur', label: item.label })
              if (item.isValidationType === 'postalCode') item.rules.push({ validator: validatePostalCode, trigger: 'blur', label: item.label })
              if (item.isValidationType === 'custom') item.rules.push({ validator: validateCustom, trigger: 'blur', pattern: new RegExp(item.pattern), label: item.label })
            }
          })
          this.option = data
        }
      })
    },
    handlePreviewSubmit(form) {
      console.log('this.form', form)
    },

    // 判断字符串的长度
    judgeLength(data) {
      const arr = data.split('')
      if (arr.length > 8) {
        return 24
      } else {
        return 12
      }
    },
    handleChange(value) {
      console.log(`selected ${value}`)
    },
    // 生成验证规则
    getRules(data) {
      const obj = {}
      data.forEach(item => {
        if (item.ifRequired === '0') {
         obj[item.attrCode] = { required: true, message: '此内容为必填项', trigger: 'blur' }
        }
      })
      this.rules = obj
    },
    // 判断表单模型
    judgeFrom(data) {
      if (data.codingIstrue === '0') {
        return '1'
      } else {
        if (data.ctrlsType === '0') {
          return 'text'
        } else if (data.ctrlsType === '1') {
          return 'down'
        } else if (data.ctrlsType === '2') {
          return 'date'
        } else if (data.ctrlsType === '3') {
          return 'time'
        }
      }
    },
    // 获取模型所有属性接口
    getAllAttrByModelId() {
      getAttrByModelId({ modelId: this.modelId }).then(res => {
        // this.dataProcessing(res.data)
        this.getRules(res.data)
        console.log('res.data', res.data)
      })
    },
    // 上一步
    onBack() {
      this.$emit('onBack')
    },
    // 唯一性校验
    onVerify(e) {
      this.$refs.form.validate((valid) => {
        if (valid) {
          if (this.ischange === 'add') {
            const data = {
              logJson: JSON.stringify(this.form),
              modelId: this.modelId
            }
            uniquenessCheck(data).then((res) => {
              this.$notification.open({
                message: res.msg,
                description: '可以使用',
                icon: <a-icon type="smile" style="color: #108ee9" />
              })
              // this.$parent.getAddList()
            })
          } else {
            const data = {
              id: this.id ? this.id : '123456',
              recordId: this.recordId,
              logJson: JSON.stringify(this.form),
              modelId: this.modelId
            }
            uniquenessCheck(data).then((res) => {
              this.$notification.open({
                message: res.msg,
                description: '可以使用',
                icon: <a-icon type="smile" style="color: #108ee9" />
              })
              // this.$parent.getAddList()
            })
          }
        }
      })
    },
    // 仅保存
    onSave() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          if (this.ischange === 'add') {
            const data = {
              logJson: JSON.stringify(this.form),
              modelId: this.modelId,
              modelCode: this.modelCode,
              operationType: '0',
              processStatus: '0'
            }
            // console.log('仅保存', this.form)

            addMasterData(data).then((res) => {
              this.$emit('getAddList')
            })
          } else if (this.changeType === 'change') {
            const data = {
              logJson: JSON.stringify(this.form),
              modelId: this.modelId,
              modelCode: this.modelCode,
              operationType: '1',
              processStatus: '0',
              recordId: this.recordId
            }
            addMasterData(data).then((res) => {
              if (res.code === 200) {
                this.$emit('onClose')
                this.$emit('getChangeList')
              }
            })
          } else if (this.addChange === 'addchange') {
            console.log(`3333`, this.form)
            const data = {
              id: this.id,
              logJson: JSON.stringify(this.form),
              modelId: this.modelId
            }
            editMasterData(data).then((res) => {
              this.$emit('getAddList')
              this.$emit('getChangeList')
              this.$emit('clearSelectedRows')
            })
          } else {
            const data = {
              id: this.id,
              logJson: JSON.stringify(this.form),
              modelId: this.modelId
            }
            editMasterData(data).then((res) => {
              this.$emit('getAddList')
              this.$emit('getChangeList')
              this.$emit('clearSelectedRows')
            })
          }
          this.$emit('getAddList')
          this.$emit('clearSelectedRows')
          this.showState = false
          this.$emit('getShowState', this.showState)
          this.$emit('getShowAdd', this.showState)
        } else {
          return false
        }
      })
    },
    // 提交审批
    onSubmit(e) {
      this.$refs.form.validate((valid) => {
        if (valid) {
          // const testArry = this.dataTemplate
          // const objs = Object.keys(this.mindData)
          //     testArry.map(item1 => {
          //     return objs.forEach(item2 => {
          //     if (item1.attr_code === item2) {
          //         item1.value = this.mindData[item2]
          //     }
          //   })
          //  })
          if (this.ischange === 'add') {
            const data = []
            data.push({
              logJson: JSON.stringify(this.form),
              modelId: this.modelId,
              modelCode: this.modelCode,
              operationType: '0'
            })
            mdDataBatchSub(data).then((res) => {
              this.$emit('getAddList')
              this.$emit('clearSelectedRows')
            })
          } else if (this.changeType === 'change') {
            const data = []
            data.push({
              logJson: JSON.stringify(this.form),
              modelId: this.modelId,
              modelCode: this.modelCode,
              operationType: '1',
              recordId: this.recordId,
              id: this.id ? this.id : '123456'
            })
            mdDataBatchSub(data).then((res) => {
              this.$emit('getChangeList')
              this.$emit('onClose')
            })
          } else if (this.addChange === 'addchange') {
            const data = []
            data.push({
              id: this.id,
              logJson: JSON.stringify(this.form),
              modelId: this.modelId,
              operationType: '0',
              modelCode: this.modelCode,
              recordId: this.recordId
            })
            mdDataBatchSub(data).then((res) => {
              this.$emit('getAddList')
              this.$emit('clearSelectedRows')
            })
          } else {
            const data = []
            data.push({
              id: this.id,
              logJson: JSON.stringify(this.form),
              modelId: this.modelId,
              operationType: '1',
              modelCode: this.modelCode,
              recordId: this.recordId
            })
            mdDataBatchSub(data).then((res) => {
              this.$emit('clearSelectedRows')
              this.$emit('getShowAdd', false)
              this.$emit('getChangeList')
            })
          }
          this.$emit('clearSelectedRows')
          this.showState = false
          this.$emit('getShowState', this.showState)
        } else {
          return false
        }
      })
    },
    // 新增重置
    addReset() {
      if (this.ischange === 'add') {
       this.form = {}
      }
    }
  }
}
</script>

<style scoped>
.preview-form {
  height: 100%;
  overflow: auto;
}
.but-box {
}
.but-box{
  width: 80%;
  display: flex;
  justify-content: center;
  text-align: center;
  margin: 20px auto;
}
.submitBtn, .closeBtn{
  width: 18%;
  margin: 0 10px;
}
</style>
