<template>
  <div>
    <!-- 弹窗 -->
    <a-modal
      v-model="isShow"
      @cancle="isShow=false"
      :footer="null"
      :centered="true"
      title="修改用户身份">
      <a-form id="components-form-demo-validate-other" ref="form" :form="form" @submit="handleSubmit">
        <a-form-item label="用户身份" :label-col="{ span: 7 }" :wrapper-col="{ span: 12 }">
          <v-select
            code="CUSTOMER_ROLE"
            allowClear
            placeholder="请选择用户身份"
            id="releaseRecordList-customerRole"
            v-decorator="[
              'formData.customerRole',
              { initialValue: formData.customerRole, rules: [{ required: true, message: '请选择用户身份!' }] }
            ]"></v-select>
        </a-form-item>
        <a-form-item :wrapper-col="{ span: 12, offset: 6}" style="text-align: center;">
          <a-button type="primary" html-type="submit" id="editUserPhoneModal-submit" style="margin-right: 15px">保存</a-button>
          <a-button @click="isShow=false" style="margin-left: 15px" id="editUserPhoneModal-close">取消</a-button>
        </a-form-item>
      </a-form>
    </a-modal>
  </div>
</template>

<script>
import { updateRole } from '@/api/userInfo.js'
import { VSelect } from '@/components'
export default {
  name: 'EditUseridentityModal',
  components: { VSelect },
  props: {
    openUseridentityMoadl: {
      type: Boolean,
      default: false
    },
    userId: {
      type: String,
      default: ''
    },
    customerRoleDictValue: {
      type: Object,
      default: function () {
        return {}
      }
    }
  },
  data () {
    return {
      isShow: this.openUseridentityMoadl,
      form: this.$form.createForm(this, { name: 'editUseridentityModal' }),
      formData: {
        customerRole: '' // 用户身份
      }
    }
  },
  methods: {
    // 点击保存;
    handleSubmit (e) {
      e.preventDefault()
      const _this = this
      this.form.validateFields((err, values) => {
        if (!err) {
          const formData = Object.assign({}, { id: this.userId }, this.formData, values.formData)
          updateRole(formData).then(res => {
            console.log(res, 'rrrrrrrrr')
            if (res.status == 200) {
              _this.$message.success(res.message)
              // _this.$router.push({ path: `/userInfo/userManageList/list` })
              setTimeout(function () {
                _this.isShow = false
                location.reload()
              }, 300)
            }
          })
        }
      })
    }
  },
  watch: {
    openUseridentityMoadl (newValue, oldValue) {
      this.isShow = newValue
    },
    isShow (newValue, oldValue) {
      console.log(this.userId)
	  if (newValue) {
	      this.formData = Object.assign({}, this.customerRoleDictValue)
	      console.log(this.formData, 'this.formData')
	  } else {
        this.$emit('close')
	  }
      //    if (!newValue) {
      //      this.$emit('close')
      //    } else {
      // 	  this.form.resetFields()
	  // this.formData = Object.assign({}, this.customerRoleDictValue)
      //    }
    }

  }
}
</script>

<style>
</style>
