
<template>
  <div>
    <el-dialog
      v-dialog-drag
      :close-on-press-escape="false"
      :close-on-click-modal="false"
      :visible.sync="dialogVisible"
      :title="title"
      width="620px"
      append-to-body
      @close="commonCancel"
    >
      <el-form ref="form" class="standard-form" :model="formState" :rules="rules" :inline="true" label-width="80px">
        <el-form-item label="专家姓名" prop="nickName">
          <el-input v-model="formState.nickName" placeholder="请输入专家姓名" :disabled="!!formState.nickName" maxlength="30" />
        </el-form-item>
        <el-form-item label="账号" prop="phonenumber">
          <el-input v-model="formState.phonenumber" placeholder="请输入账号" :disabled="!!formState.phonenumber" maxlength="11" />
        </el-form-item>
        <el-form-item label="账号状态" prop="status">
          <el-radio-group v-model="formState.status" style="width: 200px">
            <el-radio
              v-for="dict in dict.type[DictType.account_status]"
              :key="dict.value"
              :label="dict.value"
            >{{ dict.label }}</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="角色">
          <el-select v-model="formState.roleIds" multiple placeholder="请选择角色" filterable>
            <el-option
              v-for="item in roleOptions"
              :key="item.roleId"
              :label="item.roleName"
              :value="item.roleId"
            />
          </el-select>
        </el-form-item>
        <el-form-item style="width: 100%" label="备注">
          <el-input v-model="formState.remark" style="width: 490px" type="textarea" placeholder="请输入内容" show-word-limit maxlength="30" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="handleSubmit">确 定</el-button>
        <el-button @click="handleCancel">取 消</el-button>
      </div>
    </el-dialog>
    <resetPassword ref="copyDialogRef" />
  </div>

</template>
<script>
import regex from '@/utils/regex'
import DictType from '@/utils/dict/DictType'
import { accountManger, addExpertAccount, changeStatus } from '@/api/system/expert'
import { getUser } from '@/api/system/user'
import resetPassword from '@/views/system/expert/modules/resetPassword.vue'
const initForm = {
  nickName: '',
  phonenumber: '',
  status: '',
  remark: '',
  roleIds: '',
  userId: ''
}
export default {
  name: 'Accountialog',
  dicts: [DictType.account_status],
  components: {
    resetPassword
  },
  data() {
    return {
      DictType,
      dialogVisible: false,
      loading: false,
      disanledStatus: false,
      formState: Object.assign({}, initForm),
      rules: {
        nickName: { required: true, message: '用户名称不能为空', trigger: 'blur' },
        phonenumber: [
          { required: true, message: '手机号码不能为空', trigger: 'blur' },
          { pattern: regex.mobile, message: '请输入正确的手机号码', trigger: 'blur' }
        ],
        status: { required: true, message: '账户状态不能为空', trigger: 'blur' }
      },
      title: '',
      roleOptions: []
    }
  },
  created() {

  },
  methods: {
    getExpertInfo(userId) {
      getUser(userId).then(({ roles }) => {
        this.roleOptions = roles
      })
    },
    handleOpen(val) {
      const { nickName, phonenumber, status, userId, roleIds, id } = val
      this.formState.nickName = nickName
      this.formState.phonenumber = phonenumber
      this.formState.userId = userId
      this.formState.status = status
      this.formState.roleIds = roleIds
      this.formState.id = id
      this.disanledStatus = status
      this.getExpertInfo()
      this.title = status === '2' ? '添加账号' : '账号管理'
      this.dialogVisible = true
    },
    handleCancel() {
      this.$confirm('信息尚未保存，确认取消?', '提示', {
        confirmButtonText: '继续操作',
        cancelButtonText: '放弃保存',
        type: 'warning'
      }).then(() => {
      }).catch(() => {
        this.commonCancel()
      })
    },
    commonCancel() {
      this.dialogVisible = false
      this.$refs.form.clearValidate()
      this.formState = Object.assign({}, initForm)
    },
    handleSubmit() {
      this.$refs.form.validate(valid => {
        if (valid) {
          this.loading = true
          const params = {
            ...this.formState
          }
          const isAdd = this.disanledStatus === '2'
          const fn = isAdd ? addExpertAccount : changeStatus
          // 添加账号
          fn(params).then(res => {
            this.$modal.msgSuccess('保存成功')
            this.commonCancel()
            this.$emit('ok')
            if (isAdd) {
              this.$refs.copyDialogRef.handleOpen({
                userAccount: params.phonenumber,
                pwd: res.msg
              })
            }
          }).finally(() => {
            this.loading = false
          })
        }
      })
    }
  }
}
</script>
<style scoped lang="scss">

</style>
