xwl2023/Yi.Framework
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 新增个人页面跳转功能

Browse Source
This commit is contained in:
陈淳
2024-01-17 16:31:01 +08:00
parent 0d5c196f39
commit 98a4a2158a
17 changed files with 139 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
Yi.Bbs.Vue3/src/views/profile/Index.vue
View File

@@ -71,7 +71,7 @@
<div class="div-top-user">
<div class="user-icon text-center">
<userAvatar :user="state.user" />
<userAvatar :user="state.user" :isDisable="!iSCurrentUserLogin"/>
</div>
<div class="user-info">
<div class="user-nick">
@@ -102,12 +102,12 @@
<el-tabs v-model="activeTab" class="user-edit-tab">
<el-tab-pane label="基本资料" name="userinfo">
<userInfo :user="state.user" />
<userInfo :user="state.user" :isDisable="!iSCurrentUserLogin" />
</el-tab-pane>
<el-tab-pane label="修改密码" name="resetPwd">
<el-tab-pane v-if="iSCurrentUserLogin" label="修改密码" name="resetPwd">
<resetPwd />
</el-tab-pane>
<el-tab-pane label="第三方快捷登录" name="accountSetting">
<el-tab-pane v-if="iSCurrentUserLogin" label="第三方快捷登录" name="accountSetting">
<accountSet />
</el-tab-pane>
</el-tabs>
@@ -152,7 +152,10 @@
<DisscussCard :discuss="item" />
</div>
<div class="pagination">
</div>
<el-empty v-if="discussList.length == 0" description="空空如也" />
<div v-else class="pagination">
<el-pagination
v-model:current-page="query.skipCount"
v-model:page-size="query.maxResultCount"
@@ -171,7 +174,6 @@
}
"
/>
</div>
</div>
</el-col>
</el-row>
@@ -183,12 +185,15 @@ import userAvatar from "./UserAvatar.vue";
import userInfo from "./UserInfo.vue";
import resetPwd from "./ResetPwd.vue";
import accountSet from "./AccountSetting.vue";
import { getUserProfile } from "@/apis/userApi.js";
import { getBbsUserProfile } from "@/apis/userApi.js";
import { onMounted, ref, reactive } from "vue";
import { getList } from "@/apis/discussApi.js";
import { useRoute } from "vue-router";
import useAuths from "@/hooks/useAuths";
const { isLogin } = useAuths();
import useUserStore from "@/stores/user";
const route = useRoute();
const userStore=useUserStore();
const activeTab = ref("userinfo");
const state = reactive({
user: {},
@@ -198,22 +203,19 @@ const state = reactive({
postGroup: {},
});
const discussList= ref([]);
const iSCurrentUserLogin=ref(false);
const discussList= ref([]);
const discussTotal=ref(0);
const query = reactive({
skipCount: 1,
maxResultCount: 10,
userId:route.params.userId
userName:route.params.userName
});
function getUser() {
getUserProfile().then((response) => {
getBbsUserProfile(query.userName).then((response) => {
const res = response.data;
state.user = res.user;
state.dept = res.dept;
state.roles = res.roles;
state.roleGroup = res.roleGroup;
state.postGroup = res.postGroup;
state.user = res;
});
}
@@ -226,6 +228,11 @@ const getDiscuss=async ()=>
}
onMounted(() => {
//效验，是否登录用户等于当前的userInfo
if(userStore.userName ==query.userName&&isLogin)
{
iSCurrentUserLogin.value=true;
}
getUser();
getDiscuss();
});
@@ -348,11 +355,9 @@ width: 80%;
background-color: #FFFFFF;
}
&-right {
height: 1000px;
background-color: #f0f2f5;
padding-left: 20px;
&-content {
height: 100%;
width: 100%;
background-color: #FFFFFF;
}

18
Yi.Bbs.Vue3/src/views/profile/UserAvatar.vue
View File

@@ -31,7 +31,7 @@
</el-col>
</el-row>
<br />
<el-row>
<el-row v-show="!isDisable">
<el-col :lg="{ span: 1, offset: 2 }" :md="2">
<el-upload
action="#"
@@ -53,7 +53,7 @@
</el-button>
</el-col>
</el-row>
<el-row style="margin-top: 10px">
<el-row style="margin-top: 10px" v-show="!isDisable">
<el-col :lg="{ span: 1, offset: 2 }" :md="2">
<el-button icon="Plus" @click="changeScale(1)"></el-button>
</el-col>
@@ -108,8 +108,18 @@ import { getIconList } from "@/apis/settingApi";
import useUserStore from "@/stores/user";
import axios from "axios";
const userStore = useUserStore();
const props = defineProps({
user: {
type: Object,
default:{icon:"/acquiesce.png"}
},
isDisable:{
type:Boolean,
default:true
}
});
const userStore=useUserStore();
const cropper = ref(null);
const open = ref(false);
@@ -118,7 +128,7 @@ const title = ref("修改头像");
//图片裁剪数据
const options = reactive({
img: userStore.icon, // 裁剪图片的地址
img: props.user.icon, // 裁剪图片的地址
autoCrop: true, // 是否默认生成截图框
autoCropWidth: 200, // 默认生成截图框宽度
autoCropHeight: 200, // 默认生成截图框高度

14
Yi.Bbs.Vue3/src/views/profile/UserInfo.vue
View File

@@ -4,21 +4,21 @@
<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-input v-model="user.nick" maxlength="30" :disabled="isDisable"/>
</el-form-item>
<el-form-item label="手机号码" prop="phone">
<el-input v-model="user.phone" maxlength="11" />
<el-input v-model="user.phone" maxlength="11" :disabled="isDisable" />
</el-form-item>
<el-form-item label="邮箱" prop="email">
<el-input v-model="user.email" maxlength="50" />
<el-input v-model="user.email" maxlength="50" :disabled="isDisable" />
</el-form-item>
<el-form-item label="性别">
<el-radio-group v-model="user.sex">
<el-radio-group v-model="user.sex" :disabled="isDisable">
<el-radio :label="'Male'">男</el-radio>
<el-radio :label="'Woman'">女</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item>
<el-form-item v-show="!isDisable">
<el-button type="primary" @click="submit">保存</el-button>
<el-button type="danger" @click="close">关闭</el-button>
</el-form-item>
@@ -36,6 +36,10 @@ const props = defineProps({
user: {
type: Object,
},
isDisable:{
type:Boolean,
default:true
}
});
const userRef = ref(null);