<template>
  <div ref="PR-workflow" class="PR-workflow-com">
    <dee-form
      ref="form"
      :form="form"
      label-width="110px"
      :form-data="propFormData"
      :rules="rules"
    />
  </div>
</template>

<script>
import { saveModel } from '@/api/workflow/config'
export default {
  name: 'TaskPr',
  components: { },
  props: {
    basicData: {
      type: Object,
      default: null
    }
  },
  data() {
    return {
      form: {
        seriousLevel: '',
        developPhase: '',
        secretLevel2: '',
        verifyConlusion: ''
      },
      rules: {
        seriousLevel: [
          { required: true, message: '请选择严重性等级', trigger: 'change' }
        ],
        developPhase: [
          { required: true, message: '请选择问题发现阶段', trigger: 'change' }
        ],
        secretLevel2: [
          { required: true, message: '请选择问题产生阶段', trigger: 'change' }
        ],
        verifyConlusion: [
          { required: true, message: '请输入问题验证结论', trigger: 'change' }
        ]
      },
      test: null,
      prOptions: [],
      problemOptions: []
    }
  },
  computed: {
    propFormData: function() {
      const _this = this
      return [
        {
          split: 3,
          data: [
            {
              key: 'seriousLevel',
              title: '严重性等级',
              width: 1,
              component: {
                name: 'el-select',
                options: _this.prOptions
              }
            },
            {
              key: 'developPhase',
              title: '问题发现阶段',
              width: 1,
              component: {
                name: 'el-select',
                options: _this.problemOptions
              }
            },
            {
              key: 'arisePhase',
              title: '问题产生阶段',
              width: 1,
              component: {
                name: 'el-select',
                options: _this.problemOptions
              }
            },
            {
              key: 'verifyConlusion',
              title: '问题验证结论',
              width: 3,
              component: {
                name: 'el-input',
                type: 'textarea'
              }
            }
          ]
        }
      ]
    }
  },
  watch: {
    basicData: {
      deep: true,
      handler: function(val) {
        this.getDetail()
      },
      immediate: true
    }
  },
  mounted() {
    this.getContextList()
    this.getDetail()
  },
  methods: {
    async getContextList() {
      const arr = this.$store.state.dictionaries && this.$store.state.dictionaries.seriousLevel ? this.$store.state.dictionaries.seriousLevel.default : await this.$utils.getDicListByCode('seriousLevel')
      const brr = this.$store.state.dictionaries && this.$store.state.dictionaries.developPhase ? this.$store.state.dictionaries.developPhase.default : await this.$utils.getDicListByCode('arisePhase')
      this.prOptions = arr
      this.problemOptions = brr
    },
    getDetail() {
      if (this.basicData.businessObject && this.basicData.businessObject.dynamicAttrs) {
        for (const key in this.form) {
          this.$set(this.form, key, this.basicData.businessObject.dynamicAttrs[key])
        }
      }
    },
    validate() {
      const _this = this
      return new Promise((resolve, reject) => {
        this.$refs['form'].$refs.form.validate().then((valid) => {
          if (valid) {
            const form = JSON.parse(JSON.stringify(this.form))
            const prForm = {
              id: _this.basicData.businessObject.id,
              dynamicAttrs: form
            }
            saveModel(_this.basicData.businessObject.subTypeName, prForm).then(res => {
              resolve(true)
            }).catch((res) => {
              resolve(false)
            })
          } else {
            resolve(false)
          }
        })
      })
    }
  }
}
</script>

<style lang="scss">
.PR-workflow-com{
  display:flex;
  justify-content: flex-start;
  flex-wrap:wrap;
  font-size: 13px;
  .dee-form2{
    width:100%;
    box-sizing: border-box;
  }
  .el-button{
    margin: 10px auto;
  }
}
</style>