feat:完成登录页面+各种细节
This commit is contained in:
BIN
Yi.BBS.Vue3/src/assets/login_images/QQ.png
Normal file
BIN
Yi.BBS.Vue3/src/assets/login_images/QQ.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.5 KiB |
BIN
Yi.BBS.Vue3/src/assets/login_images/WeChat.png
Normal file
BIN
Yi.BBS.Vue3/src/assets/login_images/WeChat.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.4 KiB |
BIN
Yi.BBS.Vue3/src/assets/login_images/login_bg_phone.png
Normal file
BIN
Yi.BBS.Vue3/src/assets/login_images/login_bg_phone.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 244 KiB |
BIN
Yi.BBS.Vue3/src/assets/login_images/login_two.jpg
Normal file
BIN
Yi.BBS.Vue3/src/assets/login_images/login_two.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 180 KiB |
206
Yi.BBS.Vue3/src/assets/styles/login.scss
Normal file
206
Yi.BBS.Vue3/src/assets/styles/login.scss
Normal file
@@ -0,0 +1,206 @@
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
/*公共CSS*/
|
||||
.box {
|
||||
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background-color: rgb(29, 67, 89);
|
||||
.content {
|
||||
box-shadow: 0px 1px 6px #3B4859;
|
||||
.login-wrapper {
|
||||
|
||||
h1 {
|
||||
text-align: center;
|
||||
}
|
||||
.login-form {
|
||||
.form-item {
|
||||
margin: 20px 0;
|
||||
span {
|
||||
display: block;
|
||||
margin: 5px 20px;
|
||||
font-weight: 100;
|
||||
}
|
||||
.input-item {
|
||||
width: 100%;
|
||||
border-radius: 40px;
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
font-size: 20px;
|
||||
font-weight: 200;
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
.login-btn {
|
||||
width: 100%;
|
||||
border-radius: 40px;
|
||||
color: #fff;
|
||||
border: 0;
|
||||
font-weight: 100;
|
||||
margin-top: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.divider {
|
||||
width: 100%;
|
||||
margin: 20px 0;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
span:nth-child(1) {
|
||||
flex: 1;
|
||||
}
|
||||
span:nth-child(3) {
|
||||
flex: 1;
|
||||
}
|
||||
.line {
|
||||
display: inline-block;
|
||||
max-width: 30%;
|
||||
width: 30%;
|
||||
}
|
||||
.divider-text {
|
||||
vertical-align: middle;
|
||||
margin: 0px 20px;
|
||||
line-height: 0px;
|
||||
display: inline-block;
|
||||
width: 100px;
|
||||
}
|
||||
}
|
||||
.other-login-wrapper {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.other-login-item {
|
||||
border: 1px solid rgb(214, 222, 228);
|
||||
padding: 10px;
|
||||
margin: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/*一般大于手机的尺寸CSS*/
|
||||
@media (min-width: 767px) {
|
||||
.box {
|
||||
background-color: #F0F2F5;
|
||||
.content {
|
||||
width: 85vw;
|
||||
height: 90vh;
|
||||
background: url("@/assets/login_images/login_two.jpg") no-repeat;
|
||||
background-size: 90% 100%;
|
||||
position: absolute;
|
||||
right: 15%;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
border-radius: 20px;
|
||||
background-color: #fff;
|
||||
.login-wrapper {
|
||||
width: 25vw;
|
||||
position: absolute;
|
||||
right: 15%;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
h1 {
|
||||
text-align: center;
|
||||
font-size: 45px;
|
||||
color: rgb(81, 100, 115);
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
.login-form {
|
||||
margin: 10px 0;
|
||||
.form-item {
|
||||
span {
|
||||
color: rgb(81, 100, 115);
|
||||
}
|
||||
.input-item {
|
||||
height: 60px;
|
||||
border: 1px solid rgb(214, 222, 228);
|
||||
}
|
||||
}
|
||||
.login-btn {
|
||||
height: 50px;
|
||||
background-color: rgb(59, 72, 89);
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
.divider {
|
||||
.line {
|
||||
border-bottom: 1px solid rgb(214, 222, 228);
|
||||
}
|
||||
}
|
||||
.other-login-item {
|
||||
border-radius: 20px;
|
||||
img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/*手机端CSS*/
|
||||
@media (max-width: 768px) {
|
||||
.box {
|
||||
.content {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background: url("@/assets/login_images/login_bg_phone.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: center;
|
||||
.login-wrapper {
|
||||
width: 70%;
|
||||
height: 60%;
|
||||
padding-top: 15%;
|
||||
h1 {
|
||||
font-size: 30px;
|
||||
color: #fff;
|
||||
}
|
||||
.login-form {
|
||||
.form-item {
|
||||
margin: 10px 0;
|
||||
span {
|
||||
color: rgb(113, 129, 141);
|
||||
}
|
||||
.input-item {
|
||||
height: 30px;
|
||||
border: 1px solid rgb(113, 129, 141);
|
||||
background-color: transparent;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.login-btn {
|
||||
height: 40px;
|
||||
background-color: rgb(235, 95, 93);
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
.divider {
|
||||
.line {
|
||||
border-bottom: 1px solid #fff;
|
||||
}
|
||||
.divider-text {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.other-login-item {
|
||||
border-radius: 15px;
|
||||
img {
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -55,12 +55,18 @@ const agree=async ()=>{
|
||||
if(res.isArgee)
|
||||
{
|
||||
agreeNum.value+=1;
|
||||
alert(res.message)
|
||||
ElMessage({
|
||||
message: res.message,
|
||||
type: 'success',
|
||||
})
|
||||
}
|
||||
else
|
||||
{
|
||||
agreeNum.value-=1;
|
||||
alert(res.message)
|
||||
ElMessage({
|
||||
message: res.message,
|
||||
type: 'warning',
|
||||
})
|
||||
}
|
||||
}
|
||||
onMounted(()=>{
|
||||
|
||||
@@ -33,8 +33,8 @@
|
||||
|
||||
<el-menu-item index="5">
|
||||
<div style="width: 350px;">
|
||||
<el-input style="width: 300px;" placeholder="全站搜索" clearable prefix-icon="Search" />
|
||||
<el-button type="primary" plain>搜索</el-button>
|
||||
<el-input style="width: 300px;" v-model="searchText" placeholder="全站搜索" clearable prefix-icon="Search" />
|
||||
<el-button type="primary" plain @click="search">搜索</el-button>
|
||||
</div>
|
||||
</el-menu-item>
|
||||
|
||||
@@ -59,19 +59,40 @@ import useUserStore from '@/stores/user.js'
|
||||
const router = useRouter()
|
||||
const userStore =useUserStore();
|
||||
const activeIndex = ref('1')
|
||||
const searchText=ref('')
|
||||
const handleSelect = (key, keyPath) => {
|
||||
console.log(key, keyPath)
|
||||
}
|
||||
const logout=async ()=>{
|
||||
await userStore.logOut();
|
||||
router.push("/login");
|
||||
const logout= async()=>{
|
||||
ElMessageBox.confirm(`确定登出系统吗?`, "警告", {
|
||||
confirmButtonText: "确认",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
}).then( async() => {
|
||||
//异步
|
||||
await userStore.logOut();
|
||||
//删除成功后,跳转到主页
|
||||
router.push("/login");
|
||||
ElMessage({
|
||||
type: "success",
|
||||
message: "登出成功",
|
||||
});
|
||||
});
|
||||
|
||||
}
|
||||
const enterIndex=()=>{
|
||||
router.push("/index");
|
||||
};
|
||||
const enterProfile=()=>{
|
||||
router.push("/profile");}
|
||||
|
||||
const search=()=>{
|
||||
var routerPer = { path: `/discuss`,query:{q:searchText.value} };
|
||||
searchText.value='';
|
||||
router.push(routerPer)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
.logo{
|
||||
|
||||
@@ -1,53 +1,8 @@
|
||||
<template>
|
||||
<div class="body-div" id="body">
|
||||
|
||||
<div class="left">
|
||||
<video class="videoBG" autoplay playsinline loop disablepictureinpicture poster="/loginBg.png">
|
||||
<!-- <source src="/loginBg.mp4" type="video/mp4"> -->
|
||||
</video>
|
||||
</div>
|
||||
|
||||
<div class="right">
|
||||
<div class="right-div">
|
||||
<RouterView />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="box">
|
||||
<div class="content">
|
||||
<RouterView/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onMounted } from 'vue';
|
||||
|
||||
</script>
|
||||
<style scoped>
|
||||
.left
|
||||
{
|
||||
|
||||
background-color: #010413;
|
||||
}
|
||||
.right
|
||||
{
|
||||
|
||||
}
|
||||
.right-div
|
||||
{
|
||||
margin-top: 60%;
|
||||
padding: 2rem;
|
||||
}
|
||||
.body-div
|
||||
{
|
||||
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
height: 930px;
|
||||
}
|
||||
.videoBG
|
||||
{
|
||||
|
||||
width:100% ;
|
||||
}
|
||||
|
||||
</style>
|
||||
<style src="@/assets/styles/login.scss" scoped></style>
|
||||
@@ -51,7 +51,7 @@ const router = createRouter({
|
||||
},
|
||||
{
|
||||
name:'discuss',
|
||||
path: '/discuss/:plateId',
|
||||
path: '/discuss/:plateId?',
|
||||
component: () => import('../views/Discuss.vue')
|
||||
},
|
||||
{
|
||||
|
||||
@@ -35,6 +35,19 @@ myaxios.interceptors.response.use(function (response) {
|
||||
|
||||
return response;
|
||||
}, function (error) {
|
||||
const response=error.response.data;
|
||||
//业务异常+应用异常,统一处理
|
||||
switch(response.code)
|
||||
{
|
||||
|
||||
case 403:
|
||||
ElMessage.error(response.message)
|
||||
break;
|
||||
case 500:
|
||||
ElMessage.error(response.message)
|
||||
break;
|
||||
}
|
||||
|
||||
return Promise.reject(error);
|
||||
});
|
||||
export default myaxios
|
||||
@@ -114,6 +114,12 @@ const handleClick =async (tab, event) => {
|
||||
}
|
||||
|
||||
onMounted(async()=>{
|
||||
|
||||
if(route.query.q !=undefined)
|
||||
{
|
||||
query.title=route.query.q??''
|
||||
router.push("/discuss")
|
||||
}
|
||||
await loadDiscussList();
|
||||
})
|
||||
|
||||
|
||||
@@ -1,13 +1,7 @@
|
||||
<template>
|
||||
<div style="width: 100%">
|
||||
<div class="body-div">
|
||||
<el-form
|
||||
label-width="120px"
|
||||
:model="editForm"
|
||||
label-position="left"
|
||||
:rules="rules"
|
||||
ref="ruleFormRef"
|
||||
>
|
||||
<el-form label-width="120px" :model="editForm" label-position="left" :rules="rules" ref="ruleFormRef">
|
||||
<el-form-item label="分类:">
|
||||
<el-radio-group v-model="radio">
|
||||
<el-radio-button label="discuss">主题</el-radio-button>
|
||||
@@ -16,11 +10,7 @@
|
||||
<el-radio-button label="orther">其他</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
v-if="route.query.artType == 'article'"
|
||||
label="子文章名称:"
|
||||
prop="name"
|
||||
>
|
||||
<el-form-item v-if="route.query.artType == 'article'" label="子文章名称:" prop="name">
|
||||
<el-input placeholder="请输入" v-model="editForm.name" />
|
||||
</el-form-item>
|
||||
<el-form-item v-else label="标题:" prop="title">
|
||||
@@ -30,11 +20,7 @@
|
||||
<el-input placeholder="请输入" v-model="editForm.introduction" />
|
||||
</el-form-item>
|
||||
<el-form-item label="内容:" prop="content">
|
||||
<MavonEdit
|
||||
height="30rem"
|
||||
v-model="editForm.content"
|
||||
:codeStyle="codeStyle"
|
||||
/>
|
||||
<MavonEdit height="30rem" v-model="editForm.content" :codeStyle="codeStyle" />
|
||||
</el-form-item>
|
||||
<el-form-item label="封面:">
|
||||
<el-input placeholder="请输入" />
|
||||
@@ -43,13 +29,7 @@
|
||||
<el-input placeholder="请输入" v-model="editForm.types" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button
|
||||
@click="submit(ruleFormRef)"
|
||||
class="submit-btn"
|
||||
type="primary"
|
||||
>提交</el-button
|
||||
></el-form-item
|
||||
>
|
||||
<el-button @click="submit(ruleFormRef)" class="submit-btn" type="primary">提交</el-button></el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
@@ -89,11 +69,11 @@ const editForm = reactive({
|
||||
//组装主题内容: 需要更新主题信息
|
||||
const discuss = {
|
||||
|
||||
};
|
||||
};
|
||||
|
||||
//组装文章内容:需要添加的文章信息
|
||||
const article = {
|
||||
};
|
||||
};
|
||||
|
||||
//定义效验规则
|
||||
const ruleFormRef = ref(null);
|
||||
@@ -119,45 +99,62 @@ const submit = async (formEl) => {
|
||||
if (route.query.artType == "discuss") {
|
||||
|
||||
|
||||
discuss.title=editForm.title;
|
||||
discuss.types= editForm.types;
|
||||
discuss.introduction= editForm.introduction;
|
||||
discuss.content= editForm.content;
|
||||
discuss.plateId= discuss.plateId??route.query.plateId
|
||||
discuss.title = editForm.title;
|
||||
discuss.types = editForm.types;
|
||||
discuss.introduction = editForm.introduction;
|
||||
discuss.content = editForm.content;
|
||||
discuss.plateId = discuss.plateId ?? route.query.plateId
|
||||
|
||||
//主题创建
|
||||
if (route.query.operType == "create") {
|
||||
const response= await discussAdd(discuss);
|
||||
var routerPer = { path: `/article/${response.data.id}` };
|
||||
router.push(routerPer);
|
||||
const response = await discussAdd(discuss);
|
||||
|
||||
ElMessage({
|
||||
message: `[${discuss.title}]主题创建成功!`,
|
||||
type: 'success',
|
||||
})
|
||||
var routerPer = { path: `/article/${response.data.id}` };
|
||||
router.push(routerPer);
|
||||
}
|
||||
//主题更新
|
||||
else if (route.query.operType == "update") {
|
||||
await discussUpdate(route.query.discussId, discuss);
|
||||
|
||||
ElMessage({
|
||||
message: `[${discuss.title}]主题更新成功!`,
|
||||
type: 'success',
|
||||
})
|
||||
var routerPer = { path: `/article/${route.query.discussId}` };
|
||||
router.push(routerPer);
|
||||
router.push(routerPer);
|
||||
}
|
||||
}
|
||||
|
||||
//artcle文章处理
|
||||
else if (route.query.artType == "article") {
|
||||
//组装文章内容:需要添加的文章信息
|
||||
article.content= editForm.content;
|
||||
article.name= editForm.name;
|
||||
article.discussId=route.query.discussId;
|
||||
article.parentId=route.query.parentArticleId
|
||||
//组装文章内容:需要添加的文章信息
|
||||
article.content = editForm.content;
|
||||
article.name = editForm.name;
|
||||
article.discussId = route.query.discussId;
|
||||
article.parentId = route.query.parentArticleId
|
||||
//文章创建
|
||||
if (route.query.operType == "create") {
|
||||
const response= await articleAdd(article);
|
||||
const response = await articleAdd(article);
|
||||
ElMessage({
|
||||
message: `[${article.name}]文章创建成功!`,
|
||||
type: 'success',
|
||||
})
|
||||
var routerPer = { path: `/article/${route.query.discussId}/${response.data.id}` };
|
||||
router.push(routerPer);
|
||||
router.push(routerPer);
|
||||
}
|
||||
//文章更新
|
||||
else if (route.query.operType == "update") {
|
||||
await articleUpdate(route.query.articleId, article);
|
||||
|
||||
ElMessage({
|
||||
message: `[${article.name}]文章更新成功!`,
|
||||
type: 'success',
|
||||
})
|
||||
var routerPer = { path: `/article/${route.query.discussId}/${route.query.articleId}` };
|
||||
router.push(routerPer);
|
||||
router.push(routerPer);
|
||||
}
|
||||
}
|
||||
//添加成功后跳转到该页面
|
||||
@@ -186,17 +183,17 @@ onMounted(async () => {
|
||||
//加载主题
|
||||
const loadDiscuss = async () => {
|
||||
const response = await discussGet(route.query.discussId);
|
||||
const res=response.data
|
||||
const res = response.data
|
||||
editForm.content = res.content;
|
||||
editForm.title = res.title;
|
||||
editForm.types = res.types;
|
||||
editForm.introduction = res.introduction;
|
||||
discuss.plateId=res.plateId;
|
||||
discuss.plateId = res.plateId;
|
||||
};
|
||||
//加载文章
|
||||
const loadArticle = async () => {
|
||||
const response = await articleGet(route.query.articleId);
|
||||
const res=response.data
|
||||
const res = response.data
|
||||
editForm.content = res.content;
|
||||
editForm.name = res.name;
|
||||
editForm.discussId = res.discussId;
|
||||
|
||||
@@ -1,55 +1,74 @@
|
||||
<template>
|
||||
<h2> 登录-欢迎</h2>
|
||||
<div class="login-wrapper">
|
||||
<h1>意社区-登录</h1>
|
||||
<div class="login-form">
|
||||
<div class="username form-item">
|
||||
<span>使用邮箱或者手机号</span>
|
||||
<input type="text" class="input-item" v-model="loginForm.userName">
|
||||
</div>
|
||||
<div class="password form-item">
|
||||
<span>密码</span>
|
||||
<input type="password" class="input-item" v-model="loginForm.password">
|
||||
</div>
|
||||
<button class="login-btn" @click="login">登 录</button>
|
||||
<button class="login-btn" @click="guestlogin">游客临时登录</button>
|
||||
</div>
|
||||
<div class="divider">
|
||||
<span class="line"></span>
|
||||
<span class="divider-text">其他方式登录</span>
|
||||
<span class="line"></span>
|
||||
</div>
|
||||
<div class="other-login-wrapper">
|
||||
<div class="other-login-item">
|
||||
<img src="@/assets/login_images/QQ.png" alt="">
|
||||
</div>
|
||||
<div class="other-login-item">
|
||||
<img src="@/assets/login_images/WeChat.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <h2> 登录-欢迎</h2>
|
||||
<el-input v-model="loginForm.userName" placeholder="用户名" />
|
||||
<el-input v-model="loginForm.password" placeholder="密码" show-password />
|
||||
<el-button class="login-btn" type="primary" @click="login" >登录</el-button>
|
||||
<el-button class="login-btn" type="primary" @click="login">登录</el-button>
|
||||
<br>
|
||||
<el-button class="login-btn" type="primary" @click="guestlogin" >游客临时登录</el-button>
|
||||
<el-button class="login-btn" type="primary" @click="guestlogin">游客临时登录</el-button> -->
|
||||
</template>
|
||||
<script setup>
|
||||
import { reactive } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { useRouter, useRoute } from 'vue-router';
|
||||
import useUserStore from '@/stores/user.js'
|
||||
const userStore=useUserStore();
|
||||
const router=useRouter();
|
||||
const loginForm=reactive({
|
||||
userName:"",
|
||||
password:"",
|
||||
uuid:"",
|
||||
code:""
|
||||
const userStore = useUserStore();
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const loginForm = reactive({
|
||||
userName: "",
|
||||
password: "",
|
||||
uuid: "",
|
||||
code: ""
|
||||
})
|
||||
const guestlogin=async ()=>{
|
||||
loginForm.userName="guest";
|
||||
loginForm.password="123456"
|
||||
const guestlogin = async () => {
|
||||
loginForm.userName = "guest";
|
||||
loginForm.password = "123456"
|
||||
await userStore.login(loginForm);
|
||||
router.push("/index")
|
||||
}
|
||||
const login=async ()=>{
|
||||
const response= await userStore.login(loginForm);
|
||||
console.log(response);
|
||||
if( response.status==200)
|
||||
{
|
||||
router.push("/index")
|
||||
}
|
||||
else
|
||||
{
|
||||
alert("登录失败")
|
||||
}
|
||||
const redirect = route.query?.redirect ?? '/index'
|
||||
router.push(redirect)
|
||||
}
|
||||
const login = async () => {
|
||||
const response = await userStore.login(loginForm).catch((e) => {
|
||||
loginForm.password = "";
|
||||
});
|
||||
if (response!=undefined) {
|
||||
ElMessage({
|
||||
message: `您好${loginForm.userName},登录成功!`,
|
||||
type: 'success',
|
||||
})
|
||||
|
||||
const redirect = route.query?.redirect ?? '/index'
|
||||
router.push(redirect)
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
h2{
|
||||
text-align: center;
|
||||
}
|
||||
.el-input
|
||||
{
|
||||
margin:0rem 0 0.5rem 0;
|
||||
|
||||
}
|
||||
.login-btn
|
||||
{
|
||||
width: 100%;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
</style>
|
||||
<style src="@/assets/styles/login.scss" scoped></style>
|
||||
|
||||
@@ -30,7 +30,7 @@
|
||||
import errImage from "@/assets/401_images/401.gif";
|
||||
import { useRouter } from "vue-router";
|
||||
|
||||
// let { proxy } = getCurrentInstance();
|
||||
let { proxy } = getCurrentInstance();
|
||||
const router=useRouter();
|
||||
|
||||
const errGif = ref(errImage + "?" + +new Date());
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -98,7 +98,7 @@ function changeScale(num) {
|
||||
/** 上传预处理 */
|
||||
function beforeUpload(file) {
|
||||
if (file.type.indexOf("image/") == -1) {
|
||||
alert("文件格式错误,请上传图片类型,如:JPG,PNG后缀的文件。");
|
||||
ElMessage.error("文件格式错误,请上传图片类型,如:JPG,PNG后缀的文件。")
|
||||
} 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: "头像更新成功",
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
};
|
||||
/** 实时预览 */
|
||||
|
||||
@@ -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>
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 9.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
@@ -70,7 +70,8 @@ namespace Yi.BBS.Application.Forum
|
||||
.WhereIF(input.PlateId is not null, x => x.PlateId == input.PlateId)
|
||||
.Where(x=>x.IsTop==input.IsTop)
|
||||
.OrderByIF(input.Type==QueryDiscussTypeEnum.New, x =>x.CreationTime,OrderByType.Desc )
|
||||
.OrderByIF(input.Type == QueryDiscussTypeEnum.Host, x => x.SeeNum, OrderByType.Desc)
|
||||
.OrderByIF(input.Type == QueryDiscussTypeEnum.Host, x => x.SeeNum, OrderByType.Desc)
|
||||
.OrderByIF(input.Type == QueryDiscussTypeEnum.Suggest, x => x.AgreeNum, OrderByType.Desc)
|
||||
.LeftJoin<UserEntity>((discuss, user) => discuss.CreatorId==user.Id)
|
||||
.Select((discuss,user) =>new DiscussGetListOutputDto {
|
||||
User=new UserGetListOutputDto() { UserName=user.UserName,Nick=user.Nick, Icon = user.Icon }
|
||||
|
||||
Binary file not shown.
Reference in New Issue
Block a user