You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
422 lines
10 KiB
422 lines
10 KiB
<template>
|
|
<view class="wrap">
|
|
<view class="stabar"></view>
|
|
<view class="mainwrap">
|
|
<view class="perinfo"> <span class="type-name"><img :src="avatar"></img></span>
|
|
<view class="dycd"> <span class="myname" @click="checkMyInfo()">{{name}}</span>
|
|
<view class="myitem"> <span @click="showMedal()">勋章：{{medalNum}}<i
|
|
:style="{'background-color':active == 0 ?'red':'none'}"></i></span>
|
|
<span>挑战历史：{{challengeNum}}</span>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="banbox_sec">
|
|
<swiper style="height: 100%;" :indicator-dots="false" :autoplay="true" :interval="3000" :duration="1000"
|
|
:circular="true">
|
|
<swiper-item v-for="(item, i) in swiperList" :key="i">
|
|
<navigator style="height: 100%;" class="swiper-item">
|
|
<img :src="item.uploadPath"></img>
|
|
</navigator>
|
|
</swiper-item>
|
|
</swiper>
|
|
</view>
|
|
<view class="mset">
|
|
<ul>
|
|
<li v-for="(item,i) in functionList" :key="i">
|
|
<span @click="navClickHandler(item)"
|
|
:style="'background-image:url('+item.uploadPath+');'">{{item.name}}</span>
|
|
</li>
|
|
<li>
|
|
<span @click="getUserInfoByWX()">测试</span>
|
|
</li>
|
|
</ul>
|
|
</view>
|
|
</view>
|
|
<view class="footbox">
|
|
<tabbar :page="page"></tabbar>
|
|
</view>
|
|
|
|
<view>
|
|
<!-- 普通弹窗 -->
|
|
<uni-popup ref="popup" background-color="#fff" @change="change">
|
|
<view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }"><text
|
|
class="text">popup 内容</text></view>
|
|
</uni-popup>
|
|
</view>
|
|
</view>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
import tabbar from "@/components/tabbar/tabbar.vue";
|
|
import {
|
|
mapState,
|
|
mapMutations
|
|
} from 'vuex'
|
|
export default {
|
|
data() {
|
|
return {
|
|
active: 1,
|
|
medalNum: 0,
|
|
challengeNum: 0,
|
|
page: "",
|
|
name: "",
|
|
avatar: uni.$http.baseUrl + "/profile//2024/01/18/6147d64a3b94d7b3d3cc35aaf8cbfe06.png",
|
|
//轮播图数据列表
|
|
swiperList: [],
|
|
//主页功能列表
|
|
functionList: []
|
|
};
|
|
},
|
|
onLoad() {
|
|
this.name = this.userName;
|
|
this.avatar = this.avatarUrl;
|
|
this.getSwiperList()
|
|
this.getFunctionList()
|
|
this.getMyMedalList()
|
|
this.getChallengeTotal()
|
|
this.getStatus()
|
|
this.page = "my"
|
|
},
|
|
onShow() {
|
|
this.name = this.userName;
|
|
this.avatar = this.avatarUrl;
|
|
this.getSwiperList()
|
|
this.getFunctionList()
|
|
this.getMyMedalList()
|
|
this.getChallengeTotal()
|
|
this.getStatus()
|
|
this.checkLogin();
|
|
},
|
|
onPullDownRefresh() {
|
|
this.name = this.userName;
|
|
this.avatar = this.avatarUrl;
|
|
this.getSwiperList()
|
|
this.getFunctionList()
|
|
this.getMyMedalList()
|
|
this.getChallengeTotal()
|
|
this.getStatus()
|
|
},
|
|
computed: {
|
|
...mapState('m_user', ['token', 'userinfo', 'userId', 'userName', 'avatarUrl'])
|
|
},
|
|
methods: {
|
|
...mapMutations('m_user', ['updateAddress', 'updateUserInfo', 'updateToken', , 'updateUserName',
|
|
'updateUserId', 'updateAvatarUrl', 'updateRedirectInfo'
|
|
]),
|
|
async logout() {
|
|
const [err, succ] = await uni.showModal({
|
|
title: '提示',
|
|
content: '确认退出登录吗？'
|
|
}).catch(err => err)
|
|
|
|
if (succ && succ.confirm) {
|
|
this.updateAddress({})
|
|
this.updateUserInfo({})
|
|
this.updateToken('')
|
|
}
|
|
},
|
|
async getMyMedalList() {
|
|
|
|
const {
|
|
data: res
|
|
} = await uni.$http.post('/small/wechat/showMyMedal', {
|
|
guid: this.userId
|
|
})
|
|
if (!res.success) return uni.$showMsg()
|
|
this.medalNum = res.data.length;
|
|
|
|
// uni.$showMsg('数据请求成功！')
|
|
},
|
|
async getStatus() {
|
|
|
|
const {
|
|
data: res
|
|
} = await uni.$http.post('/small/wechat/getActiveStatus', {
|
|
guid: this.userId
|
|
})
|
|
if (!res.success) return uni.$showMsg()
|
|
if (res.data != null) {
|
|
this.active = res.data.active;
|
|
}
|
|
// uni.$showMsg('数据请求成功！')
|
|
},
|
|
async getChallengeTotal() {
|
|
|
|
const {
|
|
data: res
|
|
} = await uni.$http.post('/small/questionFre/listAll', {
|
|
userId: this.userId
|
|
})
|
|
if (!res.success) return uni.$showMsg()
|
|
this.challengeNum = res.data.length;
|
|
|
|
// uni.$showMsg('数据请求成功！')
|
|
},
|
|
async getSwiperList() {
|
|
|
|
const {
|
|
data: res
|
|
} = await uni.$http.post('/small/customImage/listAll', {
|
|
page: "my"
|
|
})
|
|
if (!res.success) return uni.$showMsg()
|
|
|
|
res.data.forEach(item => {
|
|
item.uploadPath = uni.$http.baseUrl + item.uploadPath
|
|
})
|
|
this.swiperList = res.data
|
|
// uni.$showMsg('数据请求成功！')
|
|
},
|
|
async getFunctionList() {
|
|
|
|
const {
|
|
data: res
|
|
} = await uni.$http.post('/small/project/home/listAll')
|
|
if (!res.success) return uni.$showMsg()
|
|
|
|
res.data.forEach(item => {
|
|
item.uploadPath = uni.$http.baseUrl + item.uploadPath
|
|
})
|
|
this.functionList = res.data;
|
|
// uni.$showMsg('数据请求成功！')
|
|
},
|
|
async showMedal() {
|
|
if (this.active == 0) {
|
|
const {
|
|
data: res
|
|
} = await uni.$http.post('/small/wechat/editActiveStatus', {
|
|
guid: this.userId,
|
|
active: 1
|
|
})
|
|
if (!res.success) return uni.$showMsg()
|
|
this.active = 1;
|
|
}
|
|
uni.navigateTo({
|
|
url: '/subpkg/medal/medal?medalNum=' + this.medalNum + '&avatarUrl=' + this.avatar +
|
|
'&name=' + this.name
|
|
})
|
|
},
|
|
navClickHandler(item) {
|
|
if (item !== "") {
|
|
uni.navigateTo({
|
|
url: item.pagePath
|
|
})
|
|
}
|
|
},
|
|
checkMyInfo() {
|
|
uni.navigateTo({
|
|
url: '/subpkg/userInfo/userInfo?avatarUrl=' + this.avatar + '&name=' + this.name
|
|
})
|
|
},
|
|
checkLogin() {
|
|
// if(this.token === "") {
|
|
this.getUserInfoByWX();
|
|
// }
|
|
},
|
|
toggle(type) {
|
|
this.type = type
|
|
// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
|
|
this.$refs.popup.open(type)
|
|
},
|
|
getUserInfoByWX() {
|
|
console.log("================== getUserInfoByWX ==================")
|
|
let that = this;
|
|
this.toggle('bottom');
|
|
// uni.openSetting({
|
|
// success(res) {
|
|
// console.log(res.authSetting);
|
|
// },
|
|
// fail(err) {
|
|
// console.log(err);
|
|
// }
|
|
// });
|
|
// 直接拉起授权窗口
|
|
uni.getUserInfo({
|
|
provider: 'weixin',
|
|
success: function(infoRes) {
|
|
console.log('用户昵称为：' + infoRes.userInfo.nickName);
|
|
that.getToken(infoRes);
|
|
},
|
|
fail(error) {
|
|
console.log('失败', error);
|
|
uni.switchTab({
|
|
url: '/pages/index/index'
|
|
})
|
|
}
|
|
});
|
|
},
|
|
getUserInfoByWX2ShowModal() {
|
|
let that = this;
|
|
uni.getSetting({
|
|
success(res) {
|
|
// 判断个球. 登录页直接拉起授权窗口
|
|
uni.showModal({
|
|
title: '授权提示',
|
|
content: '因您首次进入!我们需要获取您的基础信息，请确认授权',
|
|
success: function(res) {
|
|
if (res.confirm) {
|
|
// 用户点击确定，继续授权
|
|
uni.getUserInfo({
|
|
provider: 'weixin',
|
|
success: function(infoRes) {
|
|
console.log('用户昵称为：' + infoRes.userInfo
|
|
.nickName);
|
|
that.getToken(infoRes);
|
|
},
|
|
fail(error) {
|
|
console.log('失败', error);
|
|
uni.switchTab({
|
|
url: '/pages/index/index'
|
|
})
|
|
}
|
|
});
|
|
} else if (res.cancel) {
|
|
// 用户点击取消
|
|
console.log('用户拒绝授权');
|
|
uni.switchTab({
|
|
url: '/pages/index/index'
|
|
})
|
|
}
|
|
}
|
|
});
|
|
}
|
|
});
|
|
},
|
|
async getToken(info) {
|
|
// 获取 code 对应的值
|
|
const [err, res] = await uni.login().catch(err => err)
|
|
if (err || res.errMsg !== 'login:ok') return uni.$showMsg('登录失败！')
|
|
|
|
// 准备参数
|
|
const query = {
|
|
code: res.code,
|
|
encryptedData: info.encryptedData,
|
|
iv: info.iv,
|
|
rawData: info.rawData,
|
|
signature: info.signature
|
|
}
|
|
|
|
|
|
const {
|
|
data: loginResult
|
|
} = await uni.$http.post('/small/wechat/login', query)
|
|
if (loginResult.token === "") return uni.$showMsg('登录失败！')
|
|
|
|
// 直接把 token 保存到 vuex 中
|
|
this.updateToken(loginResult.token)
|
|
this.updateUserName(loginResult.userName)
|
|
this.updateUserId(loginResult.userId)
|
|
if (loginResult.avatarUrl != null && loginResult.avatarUrl.indexOf('http') == -1) {
|
|
loginResult.avatarUrl = uni.$http.baseUrl + loginResult.avatarUrl
|
|
}
|
|
this.name = loginResult.userName;
|
|
this.avatar = loginResult.avatarUrl;
|
|
this.updateAvatarUrl(loginResult.avatarUrl)
|
|
uni.switchTab({
|
|
url: '/pages/my/my'
|
|
})
|
|
//this.navigateBack()
|
|
},
|
|
},
|
|
components: {
|
|
tabbar
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
@import url("@/static/base_css.css");
|
|
|
|
// .my-userinfo-container {
|
|
// height: 100%;
|
|
// background-color: #F4F4F4;
|
|
|
|
// .top-box {
|
|
// height: 400rpx;
|
|
// background-color: #aba9d0;
|
|
// display: flex;
|
|
// justify-content: center;
|
|
// align-items: center;
|
|
// flex-direction: column;
|
|
|
|
// .avatar {
|
|
// width: 90px;
|
|
// height: 90px;
|
|
// border-radius: 45px;
|
|
// border: 2px solid #FFF;
|
|
// box-shadow: 0 1px 5px black;
|
|
// }
|
|
|
|
// .nickname {
|
|
// font-size: 16px;
|
|
// color: black;
|
|
// font-family: Georgia, 'Times New Roman', Times, serif;
|
|
// margin-top: 10px;
|
|
// }
|
|
// }
|
|
// }
|
|
|
|
// .panel-list {
|
|
// padding: 0 10px;
|
|
// position: relative;
|
|
// top: -10px;
|
|
|
|
// .panel {
|
|
// background-color: white;
|
|
// border-radius: 3px;
|
|
// margin-bottom: 8px;
|
|
|
|
// .panel-title {
|
|
// line-height: 45px;
|
|
// padding-left: 10px;
|
|
// font-size: 15px;
|
|
// border-bottom: 1px solid #F4F4F4;
|
|
// }
|
|
|
|
// .panel-body {
|
|
// display: flex;
|
|
// justify-content: space-around;
|
|
|
|
// .panel-item {
|
|
// display: flex;
|
|
// flex-direction: column;
|
|
// align-items: center;
|
|
// justify-content: space-around;
|
|
// padding: 10px 0;
|
|
// font-size: 13px;
|
|
|
|
// .icon {
|
|
// width: 35px;
|
|
// height: 35px;
|
|
// }
|
|
// }
|
|
// }
|
|
// }
|
|
// }
|
|
|
|
// .function-img {
|
|
// width: 30px;
|
|
// height: 30px;
|
|
// }
|
|
|
|
// .panel-list-item {
|
|
// display: flex;
|
|
// justify-content: space-between;
|
|
// align-items: center;
|
|
// font-size: 15px;
|
|
// padding: 0 10px;
|
|
// line-height: 45px;
|
|
// }
|
|
|
|
// swiper {
|
|
// height: 230rpx;
|
|
|
|
// .swiper-item,
|
|
// image {
|
|
// width: 100%;
|
|
// height: 100%;
|
|
// border-radius: 4px;
|
|
// }
|
|
// }
|
|
</style>
|