  <!--
  @description: 重置密码
  @Modifier: qink/肖文龙
  @routerPath:
  @date: 2020-08-20 13:20:35
-->
<template>
  <el-dialog
    v-dialogDrag
    :visible.sync="dialog"
    :close-on-click-modal="false"
    title="重置密码"
    custom-class="el-dialog__body-p0"
    width="700px"
  >
    <div class="main mb10">
      <el-form
        ref="form"
        :rules="rules"
        :model="formData"
        :inline-message="true"
      >
        <table class="from_table">
          <tr>
            <td>
              <el-form-item label="供应商名称" prop="departName" />
            </td>
            <td>
              {{ formData.departName }}
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="用户名" prop="userName" />
            </td>
            <td>
              {{ formData.userName }}
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="姓名" prop="realName" />
            </td>
            <td>
              {{ formData.realName }}
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="联系方式" prop="mobilePhone" />
            </td>
            <td>
              {{ formData.mobilePhone }}
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="密码重置方式" prop="type" />
            </td>
            <td>
              <el-radio-group v-model="formData.type">
                <el-radio v-for="item in resetTypeList" :key="item.typecode" :label="item.typecode">
                  {{ item.typename }}
                </el-radio>
              </el-radio-group>
            </td>
          </tr>
          <!-- 直接指定密码 -->
          <template v-if="formData.type === '01'">
            <tr>
              <td>
                <el-form-item label="输入新密码" prop="password" />
              </td>
              <td>
                <el-input v-model="formData.password" type="text" placeholder="密码必须为数字,字母组合的8-16位(如:123456qw)" />
              </td>
            </tr>
            <tr v-if="formData.type === '01'">
              <td>
                <el-form-item label="确认新密码" prop="rePwd" />
              </td>
              <td>
                <el-input v-model="formData.rePwd" type="text" placeholder="需与密码内容一致" />
              </td>
            </tr>
          </template>
        </table>
      </el-form>
    </div>
    <!--底部操作按钮-->
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" @click="ensure('form')">提交</el-button>
      <el-button @click="dialog = false">取消</el-button>
    </span>
  </el-dialog>
</template>

<script>
/* api */
import { resetPasswodrForSupplier } from '@/api/common/user.js'
/* 校验 */
import { passWord } from '@/assets/js/validate'
export default {
  name: 'SupplierPassResetDialog',
  components: {
  },
  data() {
    return {
      dialog: false, // 弹窗打开状态
      formData: {
        id: '', // 供应商id
        type: '00', // 密码重置方式 00 随机密码 01 指定代码
        password: '', // 输入新密码
        rePwd: '' // 确认密码
      },
      // 重置密码类型-字典
      resetTypeList: [
        {
          typecode: '00',
          typename: '随机密码'
        }, {
          typecode: '01',
          typename: '指定密码'
        }
      ],
      // 校验输入内容
      rules: {
        type: [{ required: true, message: '请选择', trigger: 'change' }], // 密码重置方式
        password: [{ required: true, validator: passWord, trigger: 'blur' }], // 密码
        rePwd: [{ required: true, validator: this.rePwd, trigger: 'blur' }] // 确认密码
      }
    }
  },
  methods: {
    // 打开弹窗
    open(row) {
      this.dialog = true
      this.formData = {
        ...this.formData,
        ...row,
        type: '00', // 密码重置方式
        password: '', // 密码
        rePwd: ''// 确认密码
      }
    },
    // 提交
    ensure(formName) {
      // 校验输入内容
      this.$refs[formName].validate((valid, field) => {
        if (valid) { // 校验通过
          const data = {
            id: this.formData.id, // 供应商id
            type: this.formData.type, // 密码重置方式
            password: this.$Base64.encode(this.formData.password)// base64加密
          }
          resetPasswodrForSupplier(data).then(res => {
            this.dialog = false
          })
          this.$message({
            message: '重置成功',
            type: 'success'
          })
        }
      })
    },
    // 确认密码
    rePwd(rule, value, callback) {
      if (value === '') {
        callback(new Error('请再次输入密码'))
      } else if (value !== this.formData.password) {
        callback(new Error('两次输入密码不一致'))
      } else {
        callback()
      }
    }
  }
}
</script>

<style scoped lang="less">

</style>
