国学小程序项目
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.
 
 
 
 
sinology-applet/src/pages/me/index.vue

100 lines
3.0 KiB

<template>
<view class="container">
<view class="p15">
<!-- 用户信息 -->
<view class="user-info" @tap="next('/pages/me/userInfo')">
<view class="fl1 flex ai-c">
<u-avatar size="48"></u-avatar>
<view class="ml10 fs16 fw600">
<view>{{ isLogin ? userInfo?.userName : '点击登陆' }}</view>
<view class="fs12 cor-999">{{ isLogin ? userInfo?.phone : '未登录' }}</view>
</view>
</view>
<u-icon name="arrow-right" size="16"></u-icon>
</view>
<!-- cells 列表 -->
<u-cell-group :customStyle="{ 'background-color': '#fff', 'margin-top': '10px', 'border-radius': '8px' }">
<u-cell icon="thumb-up" size="large" title="我的点赞" isLink @tap="next('/pages/me/good')"></u-cell>
<u-cell icon="heart" size="large" title="我的收藏" isLink @tap="next('/pages/me/like')"></u-cell>
<!-- <button open-type="share" class="share">
<u-cell icon="share" title="分享" size="large" isLink></u-cell>
</button> -->
<!-- <u-cell v-if="isLogin" icon="thumb-up" size="large" title="我的关注" isLink @tap="next('/pages/me/look')"></u-cell> -->
<u-cell icon="level" size="large" title="当前版本" :value="version"></u-cell>
<u-cell icon="phone" size="large" title="联系我们" :value="contactInfo.configDesc" isLink @tap="makePhone"></u-cell>
</u-cell-group>
<!-- 退出登陆 -->
<u-button v-if="isLogin" plain :customStyle="{ 'margin-top': '20px' }" @tap="logout">退出登录</u-button>
</view>
</view>
</template>
<script>
import { getSysConfig } from '@/jtools/api/index';
import { mapState, mapActions } from 'pinia'; //引入映射函数
import useUserStore from '@/jtools/store/user'; //引入store
export default {
computed: {
...mapState(useUserStore, ['userInfo', 'isLogin'])
},
data() {
return {
version: uni.getAppBaseInfo().appVersion,
contactInfo: {
configValue: '18056811878',
configDesc: '周老师'
}
};
},
onLoad() {
getSysConfig({ configKey: 'AppletContact', driverTypeId: -1 }).then(res => {
this.contactInfo = res.data;
});
},
methods: {
...mapActions(useUserStore, ['logout']),
next(url) {
if (this.isLogin) {
uni.navigateTo({
url: url
});
} else {
uni.navigateTo({
url: '/pages/me/login'
});
}
},
makePhone() {
uni.makePhoneCall({
phoneNumber: this.contactInfo.configValue
});
},
}
};
</script>
<style lang="scss" scoped>
.container {
width: 100vw;
height: 100vh;
background: linear-gradient(180deg, rgb(242, 242, 242), #fff); // 线性渐变
.user-info {
display: flex;
align-items: center;
justify-content: space-between;
background-color: #fff;
border-radius: 8px;
padding: 15px;
}
.share {
background-color: #fff;
width: 100%;
padding: 0;
text-align: left;
border: 0;
}
}
</style>