后台管理修改密码
This commit is contained in:
parent
9a8f3d050c
commit
d3fb7827f1
@ -29,7 +29,6 @@ export function getOrderDetail(params) {
|
||||
* @returns
|
||||
*/
|
||||
export function deliverOrder(params) {
|
||||
console.log("params", params)
|
||||
return send_request({
|
||||
url: '/shop/order/manage/deliverOrder',
|
||||
method: 'POST',
|
||||
|
||||
@ -24,6 +24,24 @@ export function userLogout() {
|
||||
return null;
|
||||
};
|
||||
|
||||
/**
|
||||
* 修改密码
|
||||
* @returns
|
||||
*/
|
||||
export function updatePwd({ oldpwd, newpwd }) {
|
||||
let userId = localStorage.getItem("ms_user_id")
|
||||
return send_request({
|
||||
url: '/user/updatePwd',
|
||||
method: 'POST',
|
||||
useQS: true,
|
||||
params: {
|
||||
"userId": userId,
|
||||
"oldpwd": oldpwd,
|
||||
"newpwd": newpwd,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 获取用户列表
|
||||
* @returns
|
||||
|
||||
@ -1,67 +1,63 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-card shadow="hover">
|
||||
<template #header>
|
||||
<div class="clearfix">
|
||||
<span>基础信息</span>
|
||||
</div>
|
||||
</template>
|
||||
<div class="info">
|
||||
<div class="info-image" @click="showDialog">
|
||||
<el-avatar :size="100" :src="avatarImg" />
|
||||
<span class="info-edit">
|
||||
<i class="el-icon-lx-camerafill"></i>
|
||||
</span>
|
||||
</div>
|
||||
<div class="info-name">{{ name }}</div>
|
||||
<!-- <div class="info-desc">不可能！我的代码怎么可能会有bug！</div> -->
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-card shadow="hover">
|
||||
<template #header>
|
||||
<div class="clearfix">
|
||||
<span>账户编辑</span>
|
||||
</div>
|
||||
</template>
|
||||
<el-form label-width="90px">
|
||||
<el-form-item label="用户名："> {{ name }} </el-form-item>
|
||||
<el-form-item label="旧密码：">
|
||||
<el-input type="password" v-model="form.old"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="新密码：">
|
||||
<el-input type="password" v-model="form.new"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="确认密码：">
|
||||
<el-input type="password" v-model="form.new1"></el-input>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="个人简介：">
|
||||
<el-input v-model="form.desc"></el-input>
|
||||
</el-form-item> -->
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="onSubmit">保存</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-dialog title="裁剪图片" v-model="dialogVisible" width="600px">
|
||||
<vue-cropper ref="cropper" :src="imgSrc" :ready="cropImage" :zoom="cropImage" :cropmove="cropImage"
|
||||
style="width: 100%; height: 400px"></vue-cropper>
|
||||
<div>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-card shadow="hover">
|
||||
<template #header>
|
||||
<div class="clearfix">
|
||||
<span>基础信息</span>
|
||||
</div>
|
||||
</template>
|
||||
<div class="info">
|
||||
<div class="info-image" @click="showDialog">
|
||||
<el-avatar :size="100" :src="avatarImg" />
|
||||
<span class="info-edit">
|
||||
<i class="el-icon-lx-camerafill"></i>
|
||||
</span>
|
||||
</div>
|
||||
<div class="info-name">{{ name }}</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-card shadow="hover">
|
||||
<template #header>
|
||||
<div class="clearfix">
|
||||
<span>账户编辑</span>
|
||||
</div>
|
||||
</template>
|
||||
<el-form label-width="90px">
|
||||
<el-form-item label="用户名："> {{ name }} </el-form-item>
|
||||
<el-form-item label="旧密码：">
|
||||
<el-input type="password" v-model="form.old"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="新密码：">
|
||||
<el-input type="password" v-model="form.new"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="确认密码：">
|
||||
<el-input type="password" v-model="form.new1"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="onSubmit">保存</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-dialog title="裁剪图片" v-model="dialogVisible" width="600px">
|
||||
<vue-cropper ref="cropper" :src="imgSrc" :ready="cropImage" :zoom="cropImage" :cropmove="cropImage"
|
||||
style="width: 100%; height: 400px"></vue-cropper>
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button class="crop-demo-btn" type="primary">选择图片
|
||||
<input class="crop-input" type="file" name="image" accept="image/*" @change="setImage" />
|
||||
</el-button>
|
||||
<el-button type="primary" @click="saveAvatar">上传并保存</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button class="crop-demo-btn" type="primary">选择图片
|
||||
<input class="crop-input" type="file" name="image" accept="image/*" @change="setImage" />
|
||||
</el-button>
|
||||
<el-button type="primary" @click="saveAvatar">上传并保存</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="user">
|
||||
@ -70,65 +66,52 @@ import VueCropper from 'vue-cropperjs';
|
||||
import 'cropperjs/dist/cropper.css';
|
||||
import avatar from '../assets/img/img.jpg';
|
||||
import { ElMessage, ElMessageBox, ElLoading } from 'element-plus';
|
||||
import send_request from '../utils/send_request';
|
||||
import * as userApi from '../api/user';
|
||||
|
||||
const name = localStorage.getItem('ms_username');
|
||||
const user_id = localStorage.getItem('ms_user_id');
|
||||
const form = reactive({
|
||||
user_id: user_id,
|
||||
old: '',
|
||||
new: '',
|
||||
new1: '',
|
||||
desc: ''
|
||||
user_id: user_id,
|
||||
old: '',
|
||||
new: '',
|
||||
new1: '',
|
||||
desc: ''
|
||||
});
|
||||
const onSubmit = async () => {
|
||||
if (form.old == '' || form.new == '' || form.new1 == '') {
|
||||
// 弹窗
|
||||
ElMessageBox.confirm('输入为空，请检查', '提示', {
|
||||
type: 'warning'
|
||||
})
|
||||
return
|
||||
} else if (form.new != form.new1) {
|
||||
// 弹窗
|
||||
ElMessageBox.confirm('新密码2次输入的不相同', '提示', {
|
||||
type: 'warning'
|
||||
})
|
||||
return
|
||||
} else if (form.new == form.old) {
|
||||
// 弹窗
|
||||
ElMessageBox.confirm('新、旧密码相同', '提示', {
|
||||
type: 'warning'
|
||||
})
|
||||
return
|
||||
}
|
||||
if (form.old == '' || form.new == '' || form.new1 == '') {
|
||||
// 弹窗
|
||||
ElMessageBox.confirm('输入为空，请检查', '提示', {
|
||||
type: 'warning'
|
||||
})
|
||||
return
|
||||
} else if (form.new != form.new1) {
|
||||
// 弹窗
|
||||
ElMessageBox.confirm('新密码2次输入的不相同', '提示', {
|
||||
type: 'warning'
|
||||
})
|
||||
return
|
||||
} else if (form.new == form.old) {
|
||||
// 弹窗
|
||||
ElMessageBox.confirm('新、旧密码相同', '提示', {
|
||||
type: 'warning'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
ElMessageBox.confirm('确认要修改密码吗？', '提示', {
|
||||
type: 'warning'
|
||||
})
|
||||
.then(async () => {
|
||||
console.log("send_request v1/user/alterPSW")
|
||||
|
||||
const loading = ElLoading.service({
|
||||
lock: true,
|
||||
text: '请稍候',
|
||||
background: 'rgba(0, 0, 0, 0.7)',
|
||||
});
|
||||
// await send_request('v1/user/alterPSW', "POST", {
|
||||
// "userId": form.user_id,
|
||||
// "oldPSW": form.old,
|
||||
// "newPSW": form.new
|
||||
// }, (data: any) => {
|
||||
// console.log(data);
|
||||
// ElMessage.success('删除成功');
|
||||
// // tableData.value.splice(index, 1);
|
||||
// })
|
||||
loading.close();
|
||||
|
||||
})
|
||||
.catch(() => {
|
||||
ElMessage.success('删除失败');
|
||||
});
|
||||
return;
|
||||
ElMessageBox.confirm('确认要修改密码吗？', '提示', {
|
||||
type: 'warning'
|
||||
}).then(async () => {
|
||||
userApi.updatePwd({
|
||||
oldpwd: form.old,
|
||||
newpwd: form.new,
|
||||
}).then((data) => {
|
||||
data && ElMessage.success(data);
|
||||
})
|
||||
}).catch((err) => {
|
||||
ElMessage.success('删除失败');
|
||||
console.log("err", err)
|
||||
});
|
||||
return;
|
||||
|
||||
};
|
||||
|
||||
@ -139,92 +122,92 @@ const dialogVisible = ref(false);
|
||||
const cropper: any = ref();
|
||||
|
||||
const showDialog = () => {
|
||||
dialogVisible.value = true;
|
||||
imgSrc.value = avatarImg.value;
|
||||
dialogVisible.value = true;
|
||||
imgSrc.value = avatarImg.value;
|
||||
};
|
||||
|
||||
const setImage = (e: any) => {
|
||||
const file = e.target.files[0];
|
||||
if (!file.type.includes('image/')) {
|
||||
return;
|
||||
}
|
||||
const reader = new FileReader();
|
||||
reader.onload = (event: any) => {
|
||||
dialogVisible.value = true;
|
||||
imgSrc.value = event.target.result;
|
||||
cropper.value && cropper.value.replace(event.target.result);
|
||||
};
|
||||
reader.readAsDataURL(file);
|
||||
const file = e.target.files[0];
|
||||
if (!file.type.includes('image/')) {
|
||||
return;
|
||||
}
|
||||
const reader = new FileReader();
|
||||
reader.onload = (event: any) => {
|
||||
dialogVisible.value = true;
|
||||
imgSrc.value = event.target.result;
|
||||
cropper.value && cropper.value.replace(event.target.result);
|
||||
};
|
||||
reader.readAsDataURL(file);
|
||||
};
|
||||
|
||||
const cropImage = () => {
|
||||
cropImg.value = cropper.value.getCroppedCanvas().toDataURL();
|
||||
cropImg.value = cropper.value.getCroppedCanvas().toDataURL();
|
||||
};
|
||||
|
||||
const saveAvatar = () => {
|
||||
avatarImg.value = cropImg.value;
|
||||
dialogVisible.value = false;
|
||||
avatarImg.value = cropImg.value;
|
||||
dialogVisible.value = false;
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.info {
|
||||
text-align: center;
|
||||
padding: 35px 0;
|
||||
text-align: center;
|
||||
padding: 35px 0;
|
||||
}
|
||||
|
||||
.info-image {
|
||||
position: relative;
|
||||
margin: auto;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background: #f8f8f8;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 50px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
margin: auto;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background: #f8f8f8;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 50px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.info-edit {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease;
|
||||
}
|
||||
|
||||
.info-edit i {
|
||||
color: #eee;
|
||||
font-size: 25px;
|
||||
color: #eee;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.info-image:hover .info-edit {
|
||||
opacity: 1;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.info-name {
|
||||
margin: 15px 0 10px;
|
||||
font-size: 24px;
|
||||
font-weight: 500;
|
||||
color: #262626;
|
||||
margin: 15px 0 10px;
|
||||
font-size: 24px;
|
||||
font-weight: 500;
|
||||
color: #262626;
|
||||
}
|
||||
|
||||
.crop-demo-btn {
|
||||
position: relative;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.crop-input {
|
||||
position: absolute;
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
left: 0;
|
||||
top: 0;
|
||||
opacity: 0;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
left: 0;
|
||||
top: 0;
|
||||
opacity: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user