<!-- 驳回原因用户姓名输入 -->
<template>
  <a-form
    ref="form"
    v-bind="formItemLayout"
    :form="form"
  >
    <a-form-item :label="item.title" >
      <!-- textarea -->
      <a-textarea
        v-if="item.type === 'textarea'"
        :rows="6"
        v-decorator="[
          item.key,
          {
            rules: [
              { required: true, message: `请输入${item.title}!`, type: 'string' },
            ]
          }
        ]"
        :placeholder="`请输入${item.title}!`" >
      </a-textarea>
      <!-- text number mobile  region-->
      <a-input
        v-if="item.type === 'password' || item.type === 'text' || item.type === 'number' || item.type == 'mobile' || item.type == 'region'"
        v-decorator="[
          item.key,
          {
            rules: [
              { required: true, message: `请输入${item.title}!`, type:'string'},
            ]
          }
        ]"
        :placeholder="`请输入${item.title}!`" >
      </a-input>
      <!-- price -->
      <a-input
        v-if="item.type === 'price'"
        prefix="￥"
        suffix="RMB"
        v-decorator="[
          item.key,
          {
            rules: [
              { required: true, message: `请输入${item.title}!`, type: 'string' },
            ]
          }
        ]"
        :placeholder="`请输入${item.title}!`" >
      </a-input>
      <!-- day -->
      <a-input
        v-if="item.type === 'day'"
        suffix="天"
        v-decorator="[
          item.key,
          {
            rules: [
              { required: true, message: `请输入${item.title}!`, type: 'string' },
            ]
          }
        ]"
        :placeholder="`请输入${item.title}!`" >
      </a-input>
      <!-- password -->
      <!-- <a-input
        v-if="item.type === 'password'"
        v-decorator="[
          item.key,
          {
            rules: [
              { required: true, message: `请输入${item.title}!`, type: item.type },
            ]
          }
        ]"
        :placeholder="`请输入${item.title}!`" >
        <a-icon slot="prefix" type="lock" style="color:rgba(0,0,0,.25)" />
      </a-input> -->
      <!-- select -->
      <a-select
        v-if="item.type == 'select'"
        v-decorator="[
          item.key,
          {
            rules: [
              { required: true, message: `请选择${item.title}!`, type: 'number' },
            ]
          }
        ]"
        :placeholder="`请选择${item.title}!`"
      >
        <a-select-option v-for="(it,idx) in item.options" :key="idx" :value="idx">
          {{ it }}
        </a-select-option>
      </a-select>
      <!-- radio -->
      <a-radio-group
        v-if="item.type == 'radio'"
        v-decorator="[
          item.key,
          {
            rules: [
              { required: true, message: `请选择${item.title}!`, type: 'number' },
            ]
          }
        ]"
        :placeholder="`请选择${item.title}!`"
      >
        <a-radio v-for="(it, idx) in item.options" :key="idx" :value="idx">
          {{ it }}
        </a-radio>
      </a-radio-group>
      <!-- checkbox  一致没用上所以没办法测试-->
      <a-checkbox-group
        v-if="item.type == 'checkbox'"
        v-decorator="[
          item.key,
          {
            rules: [
              { required: true, message: `请选择${item.title}!`, type: 'array' },
            ]
          }
        ]"
        :placeholder="`请选择${item.title}!`"
      >
        <a-checkbox v-for="(it, idx) in item.options" :key="idx" :value="idx">
          {{ it }}
        </a-checkbox>
      </a-checkbox-group>
      <!-- date -->
      <a-date-picker
        v-if="item.type == 'date'"
        v-decorator="[
          item.key,
          {
            rules: [
              { required: true, message: `请选择${item.title}!`},
            ]
          }
        ]"
        :placeholder="`请选择${item.title}!`"
        style="width: 100%">
      </a-date-picker>

    </a-form-item>

    <!--  const TYPE_TEXT     = 'text';*
          const TYPE_NUMBER   = 'number';*
          const TYPE_MOBILE   = 'mobile';*
          const TYPE_PRICE    = 'price';*
          const TYPE_TEXTAREA = 'textarea';*
          const TYPE_PASSWORD = 'password';*
          const TYPE_DAY      = 'day';*
          const TYPE_SELECT   = 'select';*
          const TYPE_RADIO    = 'radio';*
          const TYPE_CHECKBOX = 'checkbox';*
          const TYPE_DATE     = 'date';
          const TYPE_REGION   = 'region';与 text 一致
    -->

  </a-form>
</template>

<script>
import { updateOrderInfo } from '@/api/order'
export default {
  name: 'EditOrderInfo',
  props: {
    item: {
      type: Object,
      default: () => {
          return {}
        }
    }
  },
  data: () => ({
    formItemLayout: {
      labelCol: { span: 6 },
      wrapperCol: { span: 14 }
    },
    loading: false
  }),
  beforeCreate () {
    this.form = this.$form.createForm(this)
  },
  methods: {
    onOk () {
      return new Promise(resolve => {
        this.form.validateFields((errors, values) => {
          if (!errors) {
            const params = {
              item_id: this.item.id.item_id,
              type: this.item.actionType === 'user' ? 1 : 2,
              params: {
                key: Object.keys(values)[0],
                value: this.item.type === 'date' ? values[Object.keys(values)[0]].format('YYYY-MM-DD') : values[Object.keys(values)[0]]
              }
            }
            updateOrderInfo(this.item.id.order_id, params).then((res) => {
              this.$notification.success({
                message: '成功',
                description: '修改成功'
              })
              resolve(true)
            }).catch((err) => {
              this.$notification.error({
                message: '失败',
                description: err.message
              })
              resolve(false)
            })
          }
        })
      })
    }
  }
}
</script>

<style scoped>

</style>
