feat:完成登录页面+各种细节

This commit is contained in:
橙子
2023-03-21 23:05:42 +08:00
parent 418f4a4785
commit 4b856c4905
22 changed files with 430 additions and 189 deletions

View File

@@ -43,17 +43,24 @@ const rules = ref({
/** 提交按钮 */
function submit() {
pwdRef.value.validate(valid => {
pwdRef.value.validate(async valid => {
if (valid) {
updateUserPwd(user.oldPassword, user.newPassword).then(response => {
alert("修改成功");
});
const response=await updateUserPwd(user.oldPassword, user.newPassword)
if(response.status==200)
{
ElMessage({
type: "success",
message: "更新密码成功",
});
}
}
});
};
/** 关闭按钮 */
function close() {
alert("关闭")
// proxy.$tab.closePage();
};
</script>

View File

@@ -98,7 +98,7 @@ function changeScale(num) {
/** 上传预处理 */
function beforeUpload(file) {
if (file.type.indexOf("image/") == -1) {
alert("文件格式错误,请上传图片类型,如JPGPNG后缀的文件。");
ElMessage.error("文件格式错误,请上传图片类型,如JPGPNG后缀的文件。")
} else {
const reader = new FileReader();
reader.readAsDataURL(file);
@@ -117,8 +117,15 @@ async function uploadImg() {
open.value = false;
options.img = import.meta.env.VITE_APP_BASEAPI + "/file/" + response.data[0].id;
userStore.icon = options.img;
await updateUserIcon(response.data[0].id);
alert("上传成功")
const iconResponse= await updateUserIcon(response.data[0].id);
if(iconResponse.status==200)
{
ElMessage({
type: "success",
message: "头像更新成功",
});
}
});
};
/** 实时预览 */

View File

@@ -1,42 +1,42 @@
<template>
<el-form ref="userRef" :model="user" :rules="rules" label-width="80px">
<el-form ref="userRef" :model="user" :rules="rules" label-width="80px">
<el-form-item label="账号" prop="userName">
<el-input v-model="user.userName" disabled />
</el-form-item>
<el-form-item label="用户昵称" prop="nick">
<el-input v-model="user.nick" maxlength="30" />
</el-form-item>
<el-form-item label="手机号码" prop="phone">
<el-input v-model="user.phone" maxlength="11" />
</el-form-item>
<el-form-item label="邮箱" prop="email">
<el-input v-model="user.email" maxlength="50" />
</el-form-item>
<el-form-item label="性别">
<el-radio-group v-model="user.sex">
<el-radio :label="0"></el-radio>
<el-radio :label="1"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item>
<el-input v-model="user.userName" disabled />
</el-form-item>
<el-form-item label="用户昵称" prop="nick">
<el-input v-model="user.nick" maxlength="30" />
</el-form-item>
<el-form-item label="手机号码" prop="phone">
<el-input v-model="user.phone" maxlength="11" />
</el-form-item>
<el-form-item label="邮箱" prop="email">
<el-input v-model="user.email" maxlength="50" />
</el-form-item>
<el-form-item label="性别">
<el-radio-group v-model="user.sex">
<el-radio :label="0"></el-radio>
<el-radio :label="1"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submit">保存</el-button>
<el-button type="danger" @click="close">关闭</el-button>
</el-form-item>
</el-form>
</el-form-item>
</el-form>
</template>
<script setup>
import { updateUserProfile } from "@/apis/userApi";
import useUserStore from "@/stores/user"
import { ref } from "vue";
const userStore=useUserStore();
const userStore = useUserStore();
const props = defineProps({
user: {
type: Object
}
});
const userRef=ref(null);
const userRef = ref(null);
const rules = ref({
nick: [{ required: true, message: "用户昵称不能为空", trigger: "blur" }],
@@ -46,18 +46,21 @@ const rules = ref({
/** 提交按钮 */
function submit() {
userRef.value.validate(valid => {
userRef.value.validate(async valid => {
if (valid) {
updateUserProfile(props.user).then(response => {
userStore.name=props.user.nick
alert("修改成功");
});
const response = await updateUserProfile(props.user);
if (response.status == 200) {
ElMessage({
type: "success",
message: "用户信息修改成功",
});
}
}
});
});
};
/** 关闭按钮 */
function close() {
alert("关闭")
proxy.$tab.closePage();
// proxy.$tab.closePage();
};
</script>