talk
/
talk_appAmin
8
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

增加页面样式

main
ggy 2024-05-06 16:11:42 +08:00
parent bd53f1f1bd
commit 6461cb3097
10 changed files with 315 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
api/login.js
View File

@ -37,7 +37,14 @@ export function getInfo() {
'method': 'get'
})
}
//获取最详细的用户数据
export function getUserInfo() {
return request({
'url': '/system/userinfo/getInfo',
'method': 'get'
})
}
// 退出方法
export function logout() {
return request({

9
pages.json
View File

@ -50,7 +50,14 @@
"style": {
"navigationBarTitleText": "编辑资料"
}
}, {
},
{
"path": "pages/mine/info/userInfo",
"style": {
"navigationBarTitleText": "编辑资料"
}
},
{
"path": "pages/mine/pwd/index",
"style": {
"navigationBarTitleText": "修改密码"

12
pages/loginInfo/login.vue
View File

@ -31,9 +31,9 @@
<view v-if=" type == 'mp-weixin' " class="icon"><up-icon size="40" name="weixin-fill" color="rgb(83,194,64)" @click="wxLogin"></up-icon></view>
微信
</view>
<button open-type="getPhoneNumber" class="wxphoneLogin" @getphonenumber="getPhoneNumber" style="border: none;background: none;">
<view class="QQ item">
<view class="icon"><up-icon size="40" name="phone-fill" color="rgb(17,183,233)"></up-icon></view>
<button open-type="getPhoneNumber" class="wxphoneLogin" @getphonenumber="getPhoneNumber" style="border: none;background: none; color: white;">
<view class="QQ item" >
<view class="icon"><up-icon size="40" name="phone-fill" color="rgb(17,183,233)" ></up-icon></view>
微信手机号快捷登录
</view>
</button>
@ -48,7 +48,7 @@
</view>
</template>
<script setup>
<script setup >
import { useStore } from 'vuex'
import { useRouter } from 'vue-router'
import { ref, getCurrentInstance } from 'vue';
@ -83,12 +83,14 @@ const wxLoginInto = async (code) => {
const loginSuccess = async () => {
try {
await store.dispatch('GetInfo')
proxy.$tab.reLaunch('/pages/index');
await store.dispatch('GetUserInfo');
} catch (error) {
console.log("获取用户信息失败", error)
}
}
const getPhoneNumber = async (e) => {
console.log(e)
if (e.detail.errMsg != "getPhoneNumber:ok") {

8
pages/mine/index.vue
View File

@ -80,10 +80,10 @@
<view class="menu-list">
<view class="list-cell list-cell-arrow" @click="handleToEditInfo">
<view class="list-cell list-cell-arrow" @click="handleToUserInfo">
<view class="menu-item-box">
<view class="iconfont icon-user menu-icon"></view>
<view>账号设计</view>
<view>账号设置</view>
</view>
</view>
<view class="list-cell list-cell-arrow" @click="handleToInfo">
@ -160,6 +160,10 @@ const { proxy } = getCurrentInstance();
const version = ref(getApp().globalData.config.appInfo.version)
const avatar = ref(proxy.$store.state.user.avatar)
const handleToUserInfo = ()=> {
proxy.$tab.navigateTo('/pages/mine/info/userInfo')
}
function windowHeight() {
return uni.getSystemInfoSync().windowHeight - 50
}

68
pages/mine/info/index.vue
View File

@ -1,44 +1,50 @@
<template>
<view class="container">
<view>
<image v-if="avatar" @click="handleToAvatar" :src="avatar" mode="widthFix">
</image>
</view>
<uni-list>
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'person-filled'}" title="昵称" :rightText="user.nickName" />
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'phone-filled'}" title="手机号码" :rightText="user.phonenumber" />
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'email-filled'}" title="邮箱" :rightText="user.email" />
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'auth-filled'}" title="岗位" :rightText="postGroup" />
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'staff-filled'}" title="角色" :rightText="roleGroup" />
<uni-list-item showExtraIcon="true" :extraIcon="{type: 'calendar-filled'}" title="创建日期" :rightText="user.createTime" />
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'person-filled' }" title="昵称" :rightText="user.nickName" />
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'phone-filled' }" title="手机号码"
:rightText="user.phonenumber" />
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'email-filled' }" title="邮箱" :rightText="user.email" />
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'auth-filled' }" title="岗位" :rightText="postGroup" />
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'staff-filled' }" title="角色" :rightText="roleGroup" />
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'calendar-filled' }" title="创建日期"
:rightText="user.createTime" />
</uni-list>
</view>
</template>
<script>
import { getUserProfile } from "@/api/system/user"
<script setup>
import { getUserProfile } from "@/api/system/user"
export default {
data() {
return {
user: {},
roleGroup: "",
postGroup: ""
}
},
onLoad() {
this.getUser()
},
methods: {
getUser() {
getUserProfile().then(response => {
this.user = response.data
this.roleGroup = response.roleGroup
this.postGroup = response.postGroup
})
}
import { ref, getCurrentInstance } from 'vue';
const { proxy } = getCurrentInstance();
const avatar = ref(proxy.$store.state.user.avatar)
const user = ref({})
const roleGroup = ref("");
const postGroup = ref("");
const getUser = () => {
getUserProfile().then(response => {
this.user = response.data
this.roleGroup = response.roleGroup
this.postGroup = response.postGroup
})
}
function handleToAvatar() {
proxy.$tab.navigateTo('/pages/mine/avatar/index')
}
}
getUser();
</script>
<style lang="scss">
page {
background-color: #ffffff;
}
page {
background-color: #ffffff;
}
</style>

131
pages/mine/info/userInfo.vue Normal file
View File

@ -0,0 +1,131 @@
<template>
<view class="container">
<view style="display: flex; justify-content: center; position: relative;">
<up-avatar v-if="avatar" :src="avatar" @click="handleToAvatar" size="150"></up-avatar>
<up-avatar v-else :src="avatar2" @click="handleToAvatar" size="150"></up-avatar>
<view
style="position: absolute; bottom: 0rpx; right: 220rpx; background-color: #bdbdbdd0; padding: 5px 5px 5px 5px; border-radius: 100px;">
<view class="iconfont icon-zhaoxiangji icon" style="font-size: 50rpx; color: white; "></view>
</view>
</view>
<view>
<!-- <up-list enableFlex=true>
<up-list-item >
<view style="display: flex; justify-content: space-between; width: 95%; border-bottom: 1px solid #000; ">
<span>昵称</span>
<view style="flex-basis: 40%; justify-content: flex-end;margin: 1%; "><up-input placeholder="请输入昵称" border="surround" v-model="nickName"></up-input></view>
</view>
</up-list-item>
<up-list-item >
<view style="display: flex; justify-content: space-between; width: 95%; border-bottom: 1px solid #000; ">
<span>ID</span>
<view style="flex-basis: 40%; justify-content: flex-end; margin: 1%;"><up-input placeholder="请输入ID" border="surround" v-model="ID"></up-input></view>
</view>
</up-list-item>
<up-list-item >
<view style="display: flex; justify-content: space-between; width: 95%; border-bottom: 1px solid #000; ">
<span>简介</span>
<view style="flex-basis: 40%; justify-content: flex-end; margin: 1%; "><up-input placeholder="请输入简介" border="surround" v-model="remark"></up-input></view>
</view>
</up-list-item>
</up-list> -->
</view>
<uni-list>
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'person-filled' }" title="昵称"
:rightText="user.nickName" />
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'phone-filled' }" title="ID"
:rightText="user.phonenumber" />
<!-- <uni-list-item showExtraIcon="true" :extraIcon="{ type: 'email-filled' }" title="邮箱"
:rightText="user.email" /> -->
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'auth-filled' }" title="简介"
:rightText="remark" />
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'auth-filled' }" title="性别"
:rightText="sex" />
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'auth-filled' }" title="职称"
:rightText="postGroup" />
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'auth-filled' }" title="院校"
:rightText="infoSchool" />
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'auth-filled' }" title="院系"
:rightText="infoDepartment" />
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'auth-filled' }" title="年级"
:rightText="infoGrade" />
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'auth-filled' }" title="岗位"
:rightText="postGroup" />
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'staff-filled' }" title="角色"
:rightText="roleGroup" />
<uni-list-item showExtraIcon="true" :extraIcon="{ type: 'calendar-filled' }" title="创建日期"
:rightText="user.createTime" />
</uni-list>
<view v-for="(item,index) in imgList" :key="index">
<img :src="baseUrl+item"/>
</view>
</view>
</template>
<script setup>
import config from "@/config";
const baseUrl = config.baseUrl;
import { getUserProfile } from "@/api/system/user"
import defaultAvatar from "@/static/images/profile.jpg";
import { ref, getCurrentInstance } from 'vue';
const { proxy } = getCurrentInstance();
const avatar = ref(proxy.$store.state.user.avatar)
const avatar2 = ref(defaultAvatar);
const user = ref({})
const roleGroup = ref("");
const postGroup = ref("");
const fruits = ref([])
const imgList = ref([])
const nickName = ref(proxy.$store.state.user.nickName)
const ID = ref(proxy.$store.state.user.name)
const sex = ref(proxy.$store.state.user.sex)
const birthday = ref(proxy.$store.state.userInfo.birthday) /** 生日 */
const infoSchool = ref(proxy.$store.state.userInfo.infoSchool) /** 实名信息学校 */
const infoDepartment = ref(proxy.$store.state.userInfo.infoDepartment) /** 实名信息系别 */
const infoGrade = ref(proxy.$store.state.userInfo.infoGrade) /** 实名信息年级 */
const infoCode = ref(proxy.$store.state.userInfo.infoCode) /** 实名信息学号 */
const infoDocument = ref(proxy.$store.state.userInfo.infoDocument) /** 实名信息证件图片 */
const remark = ref(proxy.$store.state.userInfo.remark) /** 简介 */
const imgInfo = () => {
console.log('infoDocument.value:', infoDocument.value);
imgList.value = infoDocument.value.split(",");
console.log('imgList.value:', imgList.value);
}
const getUser = () => {
getUserProfile().then(response => {
user.value = response.data
roleGroup.value = response.roleGroup
fruits.value = response.postGroup.split(",");
console.log("信息：",fruits.value[0]);
postGroup.value = fruits.value[0]
})
imgInfo();
}
function handleToAvatar() {
proxy.$tab.navigateTo('/pages/mine/avatar/index')
}
getUser();
</script>
<style lang="scss">
page {
background-color: #ffffffd0;
}
</style>

9
static/font/iconfont.css
View File

@ -1,17 +1,20 @@
@font-face {
font-family: "iconfont";
src: url('@/static/font/iconfont.ttf') format('truetype');
font-family: "iconfont"; /* Project id 4533699 */
src:url('iconfont.ttf?t=1714975199159') format('truetype');
}
.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
display: inline-block;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-zhaoxiangji:before {
content: "\e601";
}
.icon-lishixinxi:before {
content: "\e67d";
}

BIN
static/font/iconfont.ttf
View File

Binary file not shown.

3
store/index.js
View File

@ -1,10 +1,11 @@
import { createStore } from "vuex";
import user from '@/store/modules/user'
import userInfo from '@/store/modules/userInfo'
import getters from './getters'
const store = createStore({
modules: {
user
user,userInfo
},
getters
});

111
store/modules/userInfo.js Normal file
View File

@ -0,0 +1,111 @@
import config from "@/config";
import storage from "@/utils/storage";
import constant from "@/utils/constant";
import { getUserInfo } from "@/api/login";
import { getToken, setToken, removeToken } from "@/utils/auth";
import defaultAvatar from "@/static/images/profile.jpg";
import { ref } from 'vue';
const baseUrl = config.baseUrl;
const user = {
state: {
birthday: storage.get(constant.birthday) /** 生日 */,
doingsStatus: storage.get(constant.doingsStatus) /** 活动发布权限(0没有，1有) */,
infoName: storage.get(constant.infoName) /** 实名信息名字 */,
infoSchool: storage.get(constant.infoSchool) /** 实名信息学校 */,
infoDepartment: storage.get(constant.infoDepartment) /** 实名信息系别 */,
infoGrade: storage.get(constant.infoGrade) /** 实名信息年级 */,
infoCode: storage.get(constant.infoCode) /** 实名信息学号 */,
infoDocument: storage.get(constant.infoDocument) /** 实名信息证件图片 */,
auditInfo: storage.get(constant.auditInfo) /** 审核状态（0已通过学生证，1通过身份证，2都通过，3审核中） */,
infoRank: storage.get(constant.infoRank) /** 用户等级 */,
infoCoin: storage.get(constant.infoCoin) /** 虚拟币数量 */,
infoActive: storage.get(constant.infoActive) /** 活跃度 */,
remark: storage.get(constant.remark) /** 简介 */,
},
mutations: {
SET_BIRTHDAY: (state, birthday) => {
state.birthday = birthday;
},
SET_doingsStatus: (state, doingsStatus) => {
state.doingsStatus = doingsStatus;
},
SET_infoName: (state, infoName) => {
state.infoName = infoName;
},
SET_infoSchool: (state, infoSchool) => {
state.infoSchool = infoSchool;
},
SET_infoDepartment: (state, infoDepartment) => {
state.infoDepartment = infoDepartment;
},
SET_infoGrade: (state, infoGrade) => {
state.infoGrade = infoGrade;
},
SET_infoCode: (state, infoCode) => {
state.infoCode = infoCode;
},
SET_infoDocument: (state, infoDocument) => {
state.infoDocument = infoDocument;
},
SET_auditInfo: (state, auditInfo) => {
state.auditInfo = auditInfo;
},
SET_infoRank: (state, infoRank) => {
state.infoRank = infoRank;
},
SET_infoCoin: (state, infoCoin) => {
state.infoCoin = infoCoin;
},
SET_infoActive: (state, infoActive) => {
state.infoActive = infoActive;
},
SET_remark: (state, remark) => {
state.remark = remark;
},
},
actions: {
// 获取用户信息
GetUserInfo({ commit, state }) {
return new Promise((resolve, reject) => {
getUserInfo()
.then((res) => {
const userInfo = res.data;
console.log("res：", res);
const infoDocument = ref([]);
infoDocument =
userInfo == null ||
userInfo.infoDocument == "" ||
userInfo.infoDocument == null
? defaultAvatar
: userInfo.infoDocument;
if (userInfo) {
commit("SET_BIRTHDAY", userInfo.birthday);
commit("SET_doingsStatus", userInfo.doingsStatus);
commit("SET_infoName", userInfo.infoName);
commit("SET_infoSchool", userInfo.infoSchool);
commit("SET_infoDepartment", userInfo.infoDepartment);
commit("SET_infoGrade", userInfo.infoGrade);
commit("SET_infoCode", userInfo.infoCode);
commit("SET_infoDocument", userInfo.infoDocument);
commit("SET_auditInfo", userInfo.auditInfo);
commit("SET_infoRank", userInfo.infoRank);
commit("SET_infoCoin", userInfo.infoCoin);
commit("SET_infoActive", userInfo.infoActive);
commit("SET_remark", userInfo.remark);
}
resolve(res);
})
.catch((error) => {
reject(error);
});
});
},
},
};
export default user;