DeleteDataAuthConfirmDialog.vue

<template>
  <!-- 删除数据用户对话框验证 -->
  <el-dialog
    @close="close"
    @opened="deleteDataAuthConfirmInit"
    v-dialogDrag
    :title="$t('login.authentication')"
    style="font-size: 10px;text-align: center" width='400px'
    :append-to-body='true'
    :visible.sync="DeleteDataAuthConfirmVisible">
    <el-form :model="form" inline="true">
      <p>验证用户身份</p>
      <el-form-item :label="$t('login.account')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-input size = 'mini' type="text" :placeholder="$t('common.placeholder')" v-model="form.account"  disabled="true" v-on:blur="accountCheck" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item :label="$t('login.password')" :label-width="formLabelWidth" style="margin-bottom: -10px;">
        <el-input size = 'mini' type="password" :placeholder="$t('common.placeholder')" v-model="form.password"  v-on:blur="passwordCheck" autocomplete="off"></el-input>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button class="btnstyle" size = 'mini' type="primary" @click="deleteDataAuthConfirm">{{$t('common.ok')+'删除'}} </el-button>
      <el-button class="btnstyle" size = 'mini' type="primary"  @click="close">{{$t('common.cancel')}}</el-button>
    </div>
  </el-dialog>
</template>

<script>
import legitimacyCheck from '@/utils/legitimacyCheck'
import HelperUtil from '@/utils/HelperUtil'
import UserService from '@/domain/services/UserService'
import md5 from 'js-md5'
import {USER_NAME} from '@/utils/constantCollection'

export default {
  props: ['command'],
  data: function () {
    return {
      DeleteDataAuthConfirmVisible: false,
      formLabelWidth: '120px',

      confirmFlag: this.command.target,

      form: {
        account: '',
        password: ''
      }
    }
  },
  methods: {
    // 关闭
    close () {
      this.command.done()
    },

    // 初始化
    deleteDataAuthConfirmInit () {
      this.form.account = window.sessionStorage.getItem(USER_NAME)
      this.form.password = ''
    },

    // 用户验证
    deleteDataAuthConfirm () {
      let _this = this
      if (!_this.passwordCheck()) {
        return
      }
      UserService.checkPwd(md5(this.form.password).toUpperCase()).then((result) => {
        _this.confirmFlag.confirm = true
        _this.close()
      }).catch((err) => {
        _this.confirmFlag.confirm = false
        _this.InfoTip.errorTip(_this, err)
      })
    },

    // 账号非空验证
    accountCheck: function () {
      let switchCheck = legitimacyCheck()
      if (!switchCheck.textNullCheck(this.form.account)) {
        // 输入不可为空
        this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.TEXT_NULL_CODE), this.$t('login.account'))
        return false
      }
      return true
    },

    // 密码非空验证
    passwordCheck: function () {
      let switchCheck = legitimacyCheck()
      if (!switchCheck.textNullCheck(this.form.password)) {
        // 输入不可为空
        this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.TEXT_NULL_CODE), this.$t('login.password'))
        return false
      }
      return true
    }
  },

  created () {
    console.log('删除数据用户验证界面')
  },
  mounted () {
    this.DeleteDataAuthConfirmVisible = true
  }
}
</script>
<style scoped>

.btnstyle {
  
  height: 36px;
  width: 106px;
}
</style>