H5静态化

doum

2025-09-26 9057e04efad1b7d61c77a72e5c37a504d0aee935

 admin/src/components/system/user/ResetPwdWindow.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,119 @@
<template>
  <GlobalWindow
    :visible.sync="visible"
    :confirm-working="isWorking"
    width="576px"
    title="重置密码"
    @confirm="confirm"
  >
    <p class="tip" v-if="user != null">为用户 <em>{{user.realname}}</em> é‡ç½®å¯†ç </p>
    <el-form :model="form" ref="form" :rules="rules">
      <el-form-item label="新密码" prop="password" required>
        <el-input v-model="form.password" type="password" placeholder="请输入新密码" maxlength="30" show-password></el-input>
      </el-form-item>
    </el-form>
  </GlobalWindow>
</template>

<script>
import GlobalWindow from '@/components/common/GlobalWindow'
import { resetPwd } from '@/api/system/user'
export default {
  name: 'ResetPwdWindow',
  components: { GlobalWindow },
  data () {
    return {
      isWorking: false,
      visible: false,
      user: null,
      form: {
        password: ''
      },
      rules: {
        password: [
          { required: true, message: '请输入密码', trigger: 'blur' },
          { validator: this.validatePassword, trigger: 'blur' }
        ]
      }
    }
  },
  methods: {
    validatePassword (rule, value, callback) {
      if (!value) {
        callback(new Error('请输入密码'))
      } else {
        const lengthValid = /^.{6,20}$/.test(value)
        const hasLetter = /[a-zA-Z]/.test(value)
        const hasNumber = /[0-9]/.test(value)
        const hasSpecial = /[!@#$%^&*(),.?":{}|<>]/.test(value)

        const typesCount = [hasLetter, hasNumber, hasSpecial].filter(Boolean).length

        if (!lengthValid) {
          callback(new Error('密码长度需为6到20个字符'))
        } else if (typesCount < 2) {
          callback(new Error('密码需包含字母、数字及特殊字符中的至少两种'))
        } else {
          callback() // éªŒè¯é€šè¿‡
        }
      }
    },
    /**
     * æ‰“开窗口
     *
     * @param user ç›®æ ‡ç”¨æˆ·
     */
    open (user) {
      this.user = user
      this.visible = true
      this.$nextTick(() => {
        this.$refs.form.resetFields()
      })
    },
    /**
     * ç¡®è®¤é‡ç½®å¯†ç 
     */
    confirm () {
      if (this.isWorking) {
        return
      }
      this.$refs.form.validate((valid) => {
        if (!valid) {
          return
        }
        this.isWorking = true
        resetPwd({
          id: this.user.id,
          password: this.form.password
        })
          .then(() => {
            this.$tip.apiSuccess('密码重置成功')
            this.visible = false
            this.$emit('success')
          })
          .catch(e => {
            this.$tip.apiFailed(e)
          })
          .finally(() => {
            this.isWorking = false
          })
      })
    }
  }
}
</script>

<style scoped lang="scss">
@import "@/assets/style/variables.scss";
// è§’色配置
.global-window {
  .tip {
    margin-bottom: 12px;
    em {
      font-style: normal;
      color: $primary-color;
      font-weight: bold;
    }
  }
}
</style>