CreateUserDialog.vue 9.58 KB
<template>
  <!--创建对话框-->
  <el-dialog
    @close="close"
    @opened="createUser"
    v-dialogDrag
    :title="$t('Security.createUser')"
    style="font-size: 10px; " width='500px'
    :visible.sync="createUserVisible">
    <el-form ref="form" :model="form" :inline="true" :label-position="localPosition">
      <el-form-item prop="userName" style="margin-bottom: -10px;" :label="'*'+$t('Security.userName') + ':'" :label-width="formLabelWidth">
        <el-input type="text" size='mini' :placeholder="$t('common.placeholder')"
                  v-model="form.userName"
                  v-on:blur="userNameCheck"
                  autocomplete="off"
                  style="width:200px"></el-input>
      </el-form-item>
      <el-form-item prop="password" style="margin-bottom: -10px;" :label="'*'+$t('Security.password') + ':'" :label-width="formLabelWidth">
        <el-input type="text" size='mini' :placeholder="$t('common.placeholder')"
                  v-model="form.password"
                  :disabled="true"
                  autocomplete="off"
                  style="width:200px"></el-input>
      </el-form-item>
      <el-form-item prop="usergroupKey" style="margin-bottom: -10px;" :label="'*'+$t('Security.userGroup') + ':'" :label-width="formLabelWidth">
        <el-select v-model="form.usergroupKey" size="mini" style="width: 200px" :placeholder="$t('common.placeholder')">
          <el-option
            v-for="item in userGroupList"
            :key="item.usergroupKey"
            :label="item.usergroupName"
            :value="item.usergroupKey">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item prop="phone" style="margin-bottom: -10px;" :label="$t('Security.telephone') + ':'" :label-width="formLabelWidth">
        <el-input type="text" size='mini' :placeholder="$t('common.placeholder')"
                  v-model="form.phone"
                  v-on:blur="phoneCheck"
                  autocomplete="off"
                  style="width:200px"></el-input>
      </el-form-item>
      <el-form-item prop="address" style="margin-bottom: -10px;" :label="$t('Security.address') + ':'" :label-width="formLabelWidth">
        <el-input type="text" size='mini' :placeholder="$t('common.placeholder')"
                  v-model="form.address"
                  v-on:blur="addressCheck"
                  autocomplete="off"
                  style="width:200px"></el-input>
      </el-form-item>
      <el-form-item prop="enable" style="margin-bottom: -10px;" :label="$t('Security.lockedOption') + ':'" :label-width="formLabelWidth">
        <el-checkbox v-model="form.enableChecked"
                     style="width:200px; padding-right: 150px"
                     @change="checkboxChange">{{$t('Security.locked')}}</el-checkbox>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button size='mini' type="primary" icon='el-icon-circle-check' @click="createUserConfiguration">{{$t("common.ok")}}</el-button>
      <el-button size='mini' icon='el-icon-circle-close' @click="close">{{$t("common.cancel")}}</el-button>
    </div>
  </el-dialog>

</template>

<script>
  import UserService from '../../../domain/services/UserService'
  import legitimacyCheck from "../../../utils/legitimacyCheck";
  import UserGroupService from '../../../domain/services/UserGroupService'
  import HelperUtil from "../../../utils/HelperUtil";

  export default {
    props: ['command'],

    mounted(){
      this.createUserVisible = true
    },

    data: function () {
      return {
        userGroupList:[],
        createUserVisible: false,
        formLabelWidth: '120px',
        localPosition: 'right',

        form: {
          userName: '',
          userKey: "",
          usergroupName: "",
          usergroupKey: "",
          editFlag: 0,
          password: "123456",
          phone: "",
          address: "",
          modifyTime: "",
          delFlag: 0,
          lockFlag: 0,
          enableChecked: false,
        },

      }
    },
    methods: {
      close() {
        this.command.done();
      },

      /***
       * @Description  : 点击锁定checkbox
       * @author       : zf
       * @date         : 2019/05/17 15:37
       */
      checkboxChange: function () {
        if(this.form.enableChecked){
          this.form.lockFlag = 1;
        }
        else{
          this.form.lockFlag = 0;
        }
      },

      //------------------------------------创建开始-------------------------------------------------------------------

      /***
       * @Description  : 获取全部用户组
       * @author       : zf
       * @date         : 2019/03/13 16:00
       */
      getAllUserGroups: function () {
        let _this = this;
        UserGroupService.getAllUserGroups().then(result => {
          //成功
          _this.userGroupList = Object.values(result)
          _this.form.usergroupKey = _this.userGroupList[0].usergroupKey
        }).catch(err => {
          //失败
          _this.InfoTip.errorTip(_this,err)
        })
      },

      createUser() {
        this.getAllUserGroups()
      },

      /***
       * @Description  : 创建新用户选项
       * @author       : zf
       * @date         : 2019/03/13 11:13
       */
      createUserConfiguration: function () {
        let _this = this;
        if(!(this.phoneCheck() && this.userNameCheck() && this.userGroupCheck() && this.addressCheck()))
        {
          return false
        }
        else{
          let newUser = {};
          newUser["userKey"] = "";
          newUser["userName"] = this.form.userName;
          newUser["usergroupKey"] = this.form.usergroupKey;
          newUser["editFlag"] = 0;
          newUser["password"] = this.form.password;
          newUser["phone"] = this.form.phone;
          newUser["address"] = this.form.address;
          newUser["modifyTime"] = "";
          newUser["delFlag"] = 0;
          if (this.form.enableChecked === true) {
            this.form.lockFlag = 1
          }
          else {
            this.form.lockFlag = 0
          }
          newUser["lockFlag"] = this.form.lockFlag;

          let loadingInstance = _this.Loading.openLoading();
          UserService.addUser(newUser).then(result => {
            //成功
            _this.Loading.closeLoading(loadingInstance);
            _this.InfoTip.successTip(_this,HelperUtil.getStatusCodeObjectByCode(_this.successCode.ADD_CODE));
            _this.close();
          }).catch(err => {
            //失败
            _this.Loading.closeLoading(loadingInstance);
            _this.InfoTip.errorTip(_this, err);
          })
        }
      },

      //------------------------------------验证开始-------------------------------------------------------------------
      /**
       * @Description  :用户名称校验: 不能为空
       * @author       :
       * @param        :
       * @return       :
       * @exception    :
       * @date         :
       */
      userNameCheck: function () {
        let userCheck = legitimacyCheck();
        if (!userCheck.textNullCheck(this.form.userName)) {
          this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.TEXT_NULL_CODE),this.$t('Security.userName'));
          return false
        }
        else{
          if(this.textLengthCheck(this.form.userName)){
            return true
          }
          else{
            this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.LENGTH_CODE),this.$t('Security.userName'));
            return false
          }
        }
      },

      /**
       * @Description  :用户组名称校验: 不能为空
       * @author       :
       * @param        :
       * @return       :
       * @exception    :
       * @date         :
       */
      userGroupCheck: function () {
        let userCheck = legitimacyCheck();
        if (!userCheck.textNullCheck(this.form.usergroupKey)) {
          this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.TEXT_NULL_CODE),this.$t('Security.userGroup'));
          return false
        }
        else{
          return true
        }
      },

      /**
       * @Description  :文本框所输入的字符长度校验: 控制在20之内
       * @author       : bjh
       * @param        :
       * @return       :
       * @exception    :
       * @date         : 2019/1/15 16:09
       */
      textLengthCheck: function (text) {
        let userCheck = legitimacyCheck();
        if (!userCheck.textLengthCheck(text)) {
          return false
        }
        return true
      },

      /***
       * @Description  : 检验电话号码合法性
       * @author       : zf
       * @date         : 2019/03/18 14:29
       */
      phoneCheck: function () {
        let userCheck = legitimacyCheck();
        if (!userCheck.phoneNumberCheck(this.form.phone)) {
          this.InfoTip.warningTip(this,HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.PHONE_CODE));
          return false
        }
        return true
      },

      /***
       * @Description  : 检验地址合法性
       * @author       : zf
       * @date         : 2019/03/18 14:29
       */
      addressCheck: function () {
        let userCheck = legitimacyCheck();
        if (!userCheck.textLengthCheck(this.form.address)) {
          this.InfoTip.warningTip(this, HelperUtil.getCheckStatusCodeObjectByCode(this.successCode.LENGTH_CODE),this.$t('Security.address'));
          return false
        }
        return true
      },
      //------------------------------------验证结束-------------------------------------------------------------------
    },


    created() {
    },
  }
</script>