<template>
  <el-dialog
    :title="$t1('修改密码')"
    :append-to-body="true"
    :modal-append-to-body="falseValue"
    :close-on-click-modal="falseValue"
    :visible.sync="showDialog"
    :modal="falseValue"
    custom-class="dialog-style list-dialog dialog-checkbox pd_8"
    width="300px"
    @close="dialogClose"
    v-el-drag-dialog
    v-el-dialog-center
    :show-close="!modifyMust"
  >
    <div class="cont">
      <el-form ref="editForm" :model="formData" label-width="102px">
        <el-form-item prop="password" :rules="passRules" :label="$t1('密 码')">
          <el-input
            size="small"
            type="password"
            v-model="formData.password"
            show-password
            maxlength="255"
            autocomplete="off"
            auto-complete="new-password"
            clearable
          />
        </el-form-item>
        <el-form-item prop="rePassword" :rules="pass2Rules" :label="$t1('确认密码')">
          <el-input
            size="small"
            type="password"
            v-model="formData.rePassword"
            show-password
            maxlength="255"
            autocomplete="off"
            auto-complete="new-password"
            lay-verify="confirmPass"
            clearable
          />
        </el-form-item>
        <el-form-item label-width="0" style="padding: 5px">
          <div class="tips_1" style="white-space: pre-wrap; line-height: 20px">
            {{ $t1(tip) }}
          </div>
        </el-form-item>
      </el-form>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button
        type="primary"
        plain
        class="button-sty"
        @click="dialogClose"
        v-if="!modifyMust"
      >
        <i class="el-icon-close el-icon"></i>
        {{ $t1("取 消") }}
      </el-button>
      <el-button type="primary" @click="saveData" class="button-sty">
        <i class="el-icon-check el-icon"></i>
        {{ $t1("确 定") }}
      </el-button>
    </span>
  </el-dialog>
</template>

<script>
import { getParameterVauleByCode } from "@base/api/user";

export default {
  components: {},
  created() {},
  mounted() {},
  data() {
    var validatePass = (rule, value, callback) => {
      const isPassRequired = true;
      if (isPassRequired && (value == "" || value == undefined)) {
        callback(new Error(this.$t1("密码不能为空")));
      } else {
        callback();
      }
      this.$refs.editForm.validateField("rePassword");
    };
    var validatePass2 = (rule, value, callback) => {
      const isPassRequired = true;
      const rePassword = value != undefined ? value : "";
      const password = this.formData.password != undefined ? this.formData.password : "";

      if (isPassRequired && rePassword == "") {
        callback(new Error(this.$t1("确认密码不能为空")));
      } else if (rePassword != password) {
        callback(new Error(this.$t1("两次输入密码不一致!")));
      } else {
        callback();
      }
    };
    return {
      showDialog: false,
      falseValue: false,
      modifyMust: false,
      user: {},
      formData: { password: null, rePassword: null },
      passRules: [{ validator: validatePass, trigger: "blur", required: true }],
      pass2Rules: [{ validator: validatePass2, trigger: "blur", required: true }],
      tip: `密码规则:
1、密码必须是8~20位，包含英文大写、英文小写、数字、特殊字符中的3种组合，字符例如:!@#$%^&0，不能包含空格和中文字符;
2、密码有效期为90天，且不允许与前3次的密码相同
3、密码不允许包含登录账号、hisense、admin、连续字母、连续键盘键等弱密码信息，例如:qwer1234!@、admin1234@#等`,
    };
  },
  methods: {
    getData() {
      this.$http({
        url: USER_PREFIX + `/user/currentUser`,
        method: `post`,
        data: {
          id: this.dataId,
        },
        success: (res) => {
          var user = res.objx || {};
          this.user = res.objx || {};
        },
      });
    },
    saveData() {
      this.$refs.editForm.validate((valid) => {
        if (valid) {
          this.$baseConfirm(this.$t1("您确定要修改密码吗？")).then(() => {
            let resData = { ...this.user, ...this.formData };
            var url = USER_PREFIX + "/user/updateUserInfo";
            this.$http({
              url: url,
              method: `post`,
              data: resData,
              isLoading: true,
              success: (res) => {
                this.$message({
                  message: res.content,
                  type: "success",
                  duration: 2000,
                });
                this.dialogClose();
              },
            });
          });
        } else {
          let password = this.formData.password;
          let rePassword = this.formData.rePassword;
          if (!password || !rePassword) {
            this.$message({
              message: this.$t1("密码/确认密码不能为空"),
              type: "error",
              duration: 2000,
            });
            return;
          }
          if (password !== rePassword) {
            this.$message({
              message: this.$t1("两次输入密码不一致"),
              type: "error",
              duration: 2000,
            });
          }
        }
      });
    },
    dialogClose() {
      this.showDialog = false;
    },
    resetForm() {
      this.formData.password = null;
      this.formData.rePassword = null;
    },
    init() {
      getParameterVauleByCode({
        data: { code: "checkPasswordModify" },
        success: (res0) => {
          if (res0.objx && res0.objx.value) {
            this.$http({
              url: USER_PREFIX + `/user/checkPasswordModifyDate`,
              method: `post`,
              data: {},
              success: (res) => {
                let flag = 0; //0 不提示；1 提示但不强制修改，即弹框它可以点x关掉；2 提示且强制修改，即他不能关掉这个弹框，要输入密码，点确定才能关掉
                if (res.objx) {
                  flag = res.objx.flag || 0;
                }
                if (flag == 1 || flag == 2) {
                  this.getData();
                  this.resetForm();
                  this.modifyMust = flag == 2;
                  this.showDialog = true;
                }
              },
            });
          }
        },
      });
    },
  },
};
</script>
