luobisheng
2022-12-07 8e367b87b978d20a30a6ca900d95c25c9eb82b0e
src/views/layout/components/Header/updatePassword/index.vue
@@ -2,116 +2,75 @@
    <div class="createUser">
        <main>
            <div class="mainContent">
                <el-form ref="user" label-width="140px" :rules="createCarRules" autoComplete="on" :model="car"
                <el-form ref="password" label-width="140px" :rules="passwordRules" autoComplete="on" :model="password"
                    label-position="right">
                    <!-- 车牌号 -->
                    <el-form-item class="optionItem" label="当前密码:" prop="carNumber">
                        <el-input v-model="car.carNumber" placeholder="请填写当前密码"></el-input>
                    <el-form-item class="optionItem" label="当前密码:" prop="oldPassword">
                        <el-input type="password" v-model="password.oldPassword" placeholder="请填写当前密码"></el-input>
                    </el-form-item>
                    <!-- 所属部门 -->
                    <el-form-item class="optionItems" label="新密码:" prop="depart">
                        <el-input v-model="car.depart" placeholder="请填写新密码"></el-input>
                    <el-form-item class="optionItems" label="新密码:" prop="newPassword">
                        <el-input type="password" v-model="password.newPassword" placeholder="请填写新密码"></el-input>
                    </el-form-item>
                    <!-- 所属大队 -->
                    <el-form-item class="optionItems" label="确定新密码:" prop="belong">
                        <el-input v-model="car.belong" placeholder="请二次填写新密码"></el-input>
                    <el-form-item class="optionItems" label="确定新密码:" prop="confirmPassword">
                        <el-input type="password" v-model="password.confirmPassword" placeholder="请再次填写新密码"></el-input>
                    </el-form-item>
                  <el-form-item class="optionItems">
                    <el-button type="primary" @click="onSubmit">提交</el-button>
                  </el-form-item>
                </el-form>
            </div>
        </main>
    </div>
</template>
<script>
import {validateCarNum,validatePhone,validateName} from '@/utils/validate'
import users from "@/api/users";
export default {
    data() {
        const checkCarNum = (rule, value, callback) => {
            if (value) {
                if(validateCarNum(value)){
                    callback()
                }else{
                    callback(new Error('请输入正确的密码'));
                }
            } else {
                callback(new Error('密码不能为空'));
            }
        }
        const checkName = (rule, value, callback) => {
            if (value) {
                if(validateName(value)){
                    callback()
                }else{
                    callback(new Error('请输入正确的密码'));
                }
            } else {
                callback(new Error('新密码不能为空'));
            }
        }
        const checkUser = (rule, value, callback) => {
            if (value) {
                if(validateName(value)){
                    callback()
                }else{
                    callback(new Error('请输入正确的密码'));
                }
            } else {
                callback(new Error('新密码不能为空'));
            }
        }
        const checkPhone = (rule, value, callback) => {
            if (value) {
                if(validatePhone(value)){
                    callback()
                }else{
                    callback(new Error('请输入正确的手机号'));
                }
            } else {
                callback(new Error('手机号码不能为空'));
            }
        }
        return {
            car: {
            updatePasswordParam:{
                newPassword:"",
                oldPassword:"",
                username:""
            },
            createCarRules: {
                carNumber: [
                    {
                        required: true, trigger:'blur', validator: checkCarNum
                    }
                ],
                contact: [
                    {
                        required: true,trigger:'blur', validator: checkPhone
                    }
                ],
                // id: 0,
                ownerName: [
                    {
                        required: true,trigger:'blur', validator: checkName
                    }
                ],
                vehicleUser: [
                    {
                        required: true,trigger:'blur', validator: checkUser
                    }
                ]
            },
            teamList: [
                {
                    label: '大队一',
                    value: 1,
                },
                {
                    label: '大队二',
                    value: 2,
                },
            ]
          password: {
            oldPassword: null,
            newPassword: null,
            confirmPassword: null
          },
          passwordRules: {
            newPassword: [{ required: true, trigger: 'blur', message: '密码不能为空' }],
            oldPassword: [{ required: true, trigger: 'blur', message: '新密码不能为空' }],
            confirmPassword: [{ required: true, trigger: 'blur', message: '新密码不能为空' }],
          },
        }
    },
    created() {
    },
    methods: {
      onSubmit() {
        this.$refs.password.validate(valid => {
          if (valid) {
           this.updatePasswordParam.oldPassword=this.password.oldPassword;
           this.updatePasswordParam.username=sessionStorage.getItem('name');
           this.updatePasswordParam.newPassword=this.password.newPassword;
            users.updatePassword(this.updatePasswordParam)
                .then(() => {
                  this.$message.success('修改密码成功, 即将重新登录');
                  this.logout();
                  location.reload();
                })
                .catch(err => this.$message.error(err))
          }
        })
      },
      logout() {
        users.logout()
            .then(() => {
              sessionStorage.clear();
            })
            .catch(err => this.$message.error(err))
      }
    },
    // props: ['info']
}
</script>
<style lang="scss" scoped>
@@ -120,7 +79,6 @@
    background-color: #09152f;
    main {
        // border: 1px solid #fff;
        text-align: left;
        padding: 0 55px;
        background-color: #09152f;