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.
414 lines
13 KiB
414 lines
13 KiB
<template> |
|
<view class="body-background"> |
|
<image class="img" mode="widthFix" :src="staticImage.bodyBackground"/> |
|
</view> |
|
|
|
<view class="app-wallpaper"> |
|
<u-row :custom-style="{padding:'26rpx'}"> |
|
<u-col :span="12"> |
|
<view class="user-container row"> |
|
<view class="user-avatar"> |
|
<button open-type="chooseAvatar" @chooseavatar="uploadAvatar" class="avatarBtn" v-if="userInfo" |
|
style="background:transparent;"> |
|
<view class="avatar-container"> |
|
<u-avatar :src="userInfo.avatar" size="160" :default-url="staticImage.defaultAvatar"></u-avatar> |
|
</view> |
|
<view class="edit-icon"> |
|
<u-image :src="staticImage.editIcon" width="48" height="48" mode="widthFix"></u-image> |
|
</view> |
|
</button> |
|
<view class="avatar-container" v-else> |
|
<u-avatar :src="userInfo.avatar" size="160" :default-url="staticImage.defaultAvatar"></u-avatar> |
|
</view> |
|
</view> |
|
<view class="user-content col " :class="{name_center:(!(userInfo?.fxx?.number))}"> |
|
|
|
|
|
<view class="user-content-top row col"> |
|
<view class="top-left"> |
|
<view class="user-nickname-group row"> |
|
<view class="user-nickname" v-if="userInfo"> |
|
{{ userInfo.nickname }} |
|
</view> |
|
<view class="user-nickname" @click="navTo('/pages/Login/index')" v-else> |
|
登录 |
|
</view> |
|
|
|
</view> |
|
<view class="user-icon-group row" v-if="userInfo?.fxx?.number"> |
|
<u-image :src="staticImage.userFxx" :lazy-load="true" width="48" height="48" mode="widthFix"></u-image> |
|
<view class="user-icon-title"> |
|
丰行侠 |
|
</view> |
|
<u-rate |
|
readonly |
|
:count="userInfo.fxx.rank" |
|
v-model="userInfo.fxx.rank" |
|
size="30" |
|
activeColor="#FF9545" |
|
></u-rate> |
|
</view> |
|
</view> |
|
<view class="top-right"> |
|
<view class="user-edit" @click="navTo('/pages/User/edit',true)" v-if="userInfo"> |
|
编辑资料 |
|
</view> |
|
<view class="user-edit" @click="logoutShow = true" v-if="userInfo"> |
|
退出登录 |
|
</view> |
|
</view> |
|
</view> |
|
|
|
<view class="user-content-bottom"> |
|
<view class="user-id row" v-if="userInfo?.fxx?.number"> |
|
<view class="user-id-content"> |
|
专属ID：{{ userInfo.fxx.number }} |
|
</view> |
|
<u-text prefix-icon="file-text" |
|
text="复制" |
|
@click="copyId(userInfo.fxx.number)" |
|
size="28" |
|
icon-style="font-size:28rpx" |
|
color="#AA4900"></u-text> |
|
</view> |
|
</view> |
|
</view> |
|
|
|
</view> |
|
</u-col> |
|
</u-row> |
|
<view class="user-card border-box" :style="{backgroundImage:'url('+staticImage.userCard+')'}"> |
|
<view class="user-card-content-container border-box"> |
|
<view class="card-container"> |
|
<view class="card-title">我的暖新币</view> |
|
<view class="card-desc">暖新币余额</view> |
|
<view class="card-price"> |
|
<u-text mode="price" size="72" color="#fff" :text="userInfo.coin_number"></u-text> |
|
</view> |
|
<view class="card-ext row">累计 |
|
<u-text mode="price" size="28" color="#fff" :text="userInfo.get_coin_number"></u-text> |
|
|
|
| 已兑换 |
|
<u-text mode="price" size="28" color="#fff" |
|
:text="(userInfo.get_coin_number - userInfo.coin_number)"></u-text> |
|
</view> |
|
<view class="card-hr"></view> |
|
<view class="card-btn-group row"> |
|
<view class="card-btn col" @click="navTo('/pages/Cron/detail',true)">暖新币明细</view> |
|
<view class="card-hhr"></view> |
|
<view class="card-btn col" @click="navTo('/pages/Cron/rule')">兑换制度</view> |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
<u-cell-group :border="false" custom-style="margin-bottom:26rpx;"> |
|
<u-cell |
|
:border="false" |
|
:rightIconStyle="{fontSize:'28rpx'}" |
|
:isLink="true" |
|
title="我的兑换订单" |
|
@click="navTo('/pages/User/order',true)" |
|
> |
|
<template #icon> |
|
<view class="cell-icon" :style="{marginRight:'56rpx'}"> |
|
<u-image :src="staticImage.userOrder" :lazy-load="true" width="48" height="48" mode="widthFix"></u-image> |
|
</view> |
|
</template> |
|
</u-cell> |
|
|
|
<u-cell |
|
:border="false" |
|
:rightIconStyle="{fontSize:'28rpx'}" |
|
:isLink="true" |
|
title="我的活动报名" |
|
custom-style="display:none;" |
|
> |
|
<template #icon> |
|
<view class="cell-icon" :style="{marginRight:'56rpx'}"> |
|
<u-image :src="staticImage.userActivity" :lazy-load="true" width="48" height="48" mode="widthFix"></u-image> |
|
</view> |
|
</template> |
|
</u-cell> |
|
|
|
<u-cell |
|
:border="false" |
|
:rightIconStyle="{fontSize:'28rpx'}" |
|
:isLink="true" |
|
title="我的留言" |
|
custom-style="display:none;" |
|
> |
|
<template #icon> |
|
<view class="cell-icon" :style="{marginRight:'56rpx'}"> |
|
<u-image :src="staticImage.userMessage" :lazy-load="true" width="48" height="48" mode="widthFix"></u-image> |
|
</view> |
|
</template> |
|
</u-cell> |
|
|
|
<u-cell |
|
:border="false" |
|
:rightIconStyle="{fontSize:'28rpx'}" |
|
:isLink="true" |
|
title="我的线索" |
|
@click="navTo('/pages/Line/user',true)" |
|
> |
|
<template #icon> |
|
<view class="cell-icon" :style="{marginRight:'56rpx'}"> |
|
<u-image :src="staticImage.userLine" :lazy-load="true" width="48" height="48" mode="widthFix"></u-image> |
|
</view> |
|
</template> |
|
</u-cell> |
|
|
|
<u-cell |
|
:border="false" |
|
:rightIconStyle="{fontSize:'28rpx'}" |
|
:isLink="true" |
|
title="地址管理" |
|
@click="navTo('/pages/Address/index',true)" |
|
> |
|
<template #icon> |
|
<view class="cell-icon" :style="{marginRight:'56rpx'}"> |
|
<u-image :src="staticImage.userAddr" :lazy-load="true" width="48" height="48" mode="widthFix"></u-image> |
|
</view> |
|
</template> |
|
</u-cell> |
|
|
|
<!-- <u-cell--> |
|
<!-- :border="false"--> |
|
<!-- :rightIconStyle="{fontSize:'28rpx'}"--> |
|
<!-- :isLink="true"--> |
|
<!-- title="我的关注"--> |
|
<!-- >--> |
|
<!-- <template #icon>--> |
|
<!-- <view class="cell-icon" :style="{marginRight:'56rpx'}">--> |
|
<!-- <u-image :src="staticImage.userFollow" :lazy-load="true" width="48" height="48" mode="widthFix"></u-image>--> |
|
<!-- </view>--> |
|
<!-- </template>--> |
|
<!-- </u-cell>--> |
|
|
|
</u-cell-group> |
|
<u-gap height="8" bgColor="#F5F5F6"></u-gap> |
|
<u-cell-group :border="false" custom-style="margin-top:26rpx;"> |
|
<u-cell |
|
:border="false" |
|
:rightIconStyle="{fontSize:'28rpx'}" |
|
:isLink="true" |
|
title="党员报到码" |
|
@click="navTo('/pages/Report/qrcode')" |
|
> |
|
<template #icon> |
|
<view class="cell-icon" :style="{marginRight:'56rpx'}"> |
|
<u-image :src="staticImage.userQrcode" :lazy-load="true" width="48" height="48" mode="widthFix"></u-image> |
|
</view> |
|
</template> |
|
</u-cell> |
|
|
|
<u-cell |
|
:border="false" |
|
:rightIconStyle="{fontSize:'28rpx'}" |
|
:isLink="true" |
|
title="意见箱/意见栏" |
|
@click="navTo('/pages/Feed/index',true)" |
|
> |
|
<template #icon> |
|
<view class="cell-icon" :style="{marginRight:'56rpx'}"> |
|
<u-image :src="staticImage.userFeed" :lazy-load="true" width="48" height="48" mode="widthFix"></u-image> |
|
</view> |
|
</template> |
|
</u-cell> |
|
<u-cell |
|
:border="false" |
|
:rightIconStyle="{fontSize:'28rpx'}" |
|
:isLink="true" |
|
title="街道联系方式" |
|
@click="navTo('/pages/Street/index')" |
|
> |
|
<template #icon> |
|
<view class="cell-icon" :style="{marginRight:'56rpx'}"> |
|
<u-image :src="staticImage.userPhone" :lazy-load="true" width="48" height="48" mode="widthFix"></u-image> |
|
</view> |
|
</template> |
|
</u-cell> |
|
|
|
</u-cell-group> |
|
<!-- <view class="button" style="margin:30rpx 0;padding:26rpx;" v-if="userInfo">--> |
|
<!-- <u-button--> |
|
<!-- :plain="true"--> |
|
<!-- type="warning"--> |
|
<!-- size="large"--> |
|
<!-- text="退出登录"--> |
|
<!-- shape="circle"--> |
|
<!-- @click="logout()"></u-button>--> |
|
<!-- </view>--> |
|
</view> |
|
<u-modal :show="logoutShow" content="是否退出登录" @confirm="logout" @cancel="this.logoutShow = false;" |
|
:closeOnClickOverlay="true" showCancelButton></u-modal> |
|
</template> |
|
|
|
<script> |
|
import { |
|
imghost |
|
} from '@/config/host.js' |
|
import HeaderNav from '@/components/HeaderNav/Index.vue'; |
|
import FooterNav from '@/components/FooterNav/Index.vue'; |
|
import RightNav from '@/components/RightNav/Index.vue'; |
|
import api from '@/utils/functions.js'; |
|
import {appletLogin, avatarUpload} from "@/api/user"; |
|
|
|
export default { |
|
components: { |
|
HeaderNav, |
|
FooterNav, |
|
RightNav |
|
}, |
|
data() { |
|
return { |
|
title: 'Hello', |
|
loading: true, |
|
logoutShow:false, |
|
staticImage: { |
|
userOrder: imghost + '/user-order.png', |
|
userActivity: imghost + '/user-activity.png', |
|
userMessage: imghost + '/user-message.png', |
|
userLine: imghost + '/user-line.png', |
|
userAddr: imghost + '/user-addr.png', |
|
userFollow: imghost + '/user-follow.png', |
|
userQrcode: imghost + '/user-qrcode.png', |
|
userFeed: imghost + '/user-feed.png', |
|
userPhone: imghost + '/user-phone.png', |
|
bodyBackground: imghost + '/user-bg.png', |
|
userFxx: imghost + '/user-fxx.png', |
|
userCard: imghost + '/user-card.png', |
|
editIcon:imghost + '/edit-icon.png', |
|
defaultAvatar:imghost + '/default-avatar.png', |
|
}, |
|
starCount: 10, |
|
starValue: 10, |
|
user: { |
|
avatar: imghost + '/banner.png', |
|
nickname: '清晨的风', |
|
coupons: 221, |
|
id: 88685 |
|
}, |
|
isTop: false, |
|
pagePadding: 100, |
|
is_login: false, |
|
userInfo: {}, |
|
userExtends: {}, |
|
} |
|
}, |
|
onLoad() { |
|
|
|
}, |
|
onReady() { |
|
|
|
}, |
|
mounted() { |
|
this.userInfo = uni.getStorageSync('user'); |
|
if (this.userInfo) { |
|
console.log('true') |
|
this.is_login = true; |
|
} else { |
|
console.log('false') |
|
this.is_login = false; |
|
} |
|
}, |
|
methods: { |
|
uploadAvatar(e) { |
|
api.uploadOssFile(e.detail.avatarUrl).then(res => { |
|
console.log('res', res) |
|
this.userInfo.avatar = res.show_path |
|
avatarUpload({ |
|
url: res.show_path |
|
}).then(res => { |
|
if (res.code === 200) { |
|
uni.$u.toast('修改成功') |
|
} else { |
|
uni.$u.toast(res.msg) |
|
} |
|
}).catch(err => { |
|
uni.$u.toast('服务器开小差了') |
|
}) |
|
}) |
|
|
|
// console.log(res,'--------'); |
|
|
|
}, |
|
copyId(idcard) { |
|
uni.setClipboardData({ |
|
data: idcard, |
|
success: function () { |
|
//调用方法成功 |
|
} |
|
}) |
|
}, |
|
navTo(url, token = false) { |
|
if (token) { |
|
if (uni.getStorageSync('token')) { |
|
wx.navigateTo({ |
|
url: url |
|
}) |
|
} else { |
|
wx.navigateTo({ |
|
url: '/pages/Login/index' |
|
}) |
|
} |
|
} else { |
|
wx.navigateTo({ |
|
url: url |
|
}) |
|
} |
|
}, |
|
userDetail() { |
|
wx.navigateTo({ |
|
url: '/pages/UserDetail/index' |
|
}) |
|
}, |
|
orderPage() { |
|
this.$store.commit('footCheck', 'order'); |
|
this.$store.commit('title', '订单'); |
|
}, |
|
userCouponsPage() { |
|
wx.navigateTo({ |
|
url: '/pages/UserCoupons/index' |
|
}) |
|
}, |
|
updateUserInfo() { |
|
|
|
}, |
|
logout() { |
|
uni.removeStorage({key:'user'}); |
|
uni.removeStorage({key:'token'}); |
|
uni.removeStorage({key:'address'}); |
|
uni.removeStorage({key:'detailInfo'}); |
|
uni.removeStorage({key:'shopMore'}); |
|
this.navTo('/pages/Index/index') |
|
} |
|
}, |
|
onPageScroll(res) { |
|
if (res.scrollTop <= 20) { |
|
uni.$emit('isTop', true); |
|
} else { |
|
uni.$emit('isTop', false); |
|
} |
|
|
|
}, |
|
created() { |
|
}, |
|
watch: { |
|
"$store.state.userInfo": { |
|
handler(newVal, oldVal) { |
|
this.userInfo = newVal; |
|
} |
|
}, |
|
"$store.state.userExtends": { |
|
handler(newVal, oldVal) { |
|
this.userExtends = newVal; |
|
} |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style lang="scss"> |
|
@import './components/index.scss'; |
|
</style> |