| | |
| | | <!-- 我的 --> |
| | | <template> |
| | | <view class="page-wrap"> |
| | | |
| | | <view class="flex items-center pb-30rpx pl-30rpx pr-20rpx"> |
| | | <view class="mr-20rpx"> |
| | | <u-avatar :src="user.avatar" size="70" /> |
| | | </view> |
| | | <view class="flex-1"> |
| | | <view class="userName">{{ userStore?.userInfo?.nick_name }}</view> |
| | | <view class="departs"> |
| | | <img src="/src/static/images/user/mobile.svg" alt="" /> |
| | | <span>{{user.deptName}}</span> |
| | | </view> |
| | | </view> |
| | | <view class="rightLogo"> |
| | | <img src="/src/static/images/user/logo2.svg" alt="" /> |
| | | </view> |
| | | </view> |
| | | <view class="personalInformation"> |
| | | <div class="message"> |
| | | <div class="messagebox">个人信息</div> |
| | | <div class="editInfo" @click="handelEdit(1)">点击编辑 |
| | | <img src="/src/static/images/user/rightBtn.svg" alt="" /></div> |
| | | </div> |
| | | <div class="passwordBox"> |
| | | <div class="messagebox">修改密码</div> |
| | | <div class="editInfo" @click="handelEdit(2)">点击编辑 <img src="/src/static/images/user/rightBtn.svg" alt="" /></div> |
| | | </div> |
| | | </view> |
| | | <view class="page-wrap"> |
| | | |
| | | <view class="mt-20rpx"> |
| | | <div class="goOutStyle" @click="logOut">退出登录</div> |
| | | </view> |
| | | <div class="bottomLogo"><img src="/src/static/images/user/logo1.svg" alt="" /></div> |
| | | </view> |
| | | <view class="flex items-center pb-30rpx pl-30rpx pr-20rpx"> |
| | | <view class="mr-20rpx"> |
| | | <u-avatar :src="user.avatar" size="70" /> |
| | | </view> |
| | | <view class="flex-1"> |
| | | <view class="userName">{{ userStore?.userInfo?.nick_name }}</view> |
| | | <view class="departs"> |
| | | <img src="/src/static/images/user/mobile.svg" alt="" /> |
| | | <span>{{user.deptName}}</span> |
| | | </view> |
| | | </view> |
| | | <view class="rightLogo"> |
| | | <img src="/src/static/images/user/logo2.png" alt="" /> |
| | | </view> |
| | | </view> |
| | | <view class="personalInformation"> |
| | | <div class="message"> |
| | | <div class="messagebox">个人信息</div> |
| | | <div class="editInfo" @click="handelEdit(1)">点击编辑 |
| | | <img src="/src/static/images/user/rightBtn.svg" alt="" /> |
| | | </div> |
| | | </div> |
| | | <div class="passwordBox"> |
| | | <div class="messagebox">修改密码</div> |
| | | <div class="editInfo" @click="handelEdit(2)">点击编辑 <img src="/src/static/images/user/rightBtn.svg" alt="" /> |
| | | </div> |
| | | </div> |
| | | </view> |
| | | |
| | | <view class="mt-20rpx"> |
| | | <div class="goOutStyle" @click="logOut">退出登录</div> |
| | | </view> |
| | | <div class="bottomLogo"><img src="/src/static/images/user/logo1.png" alt="" /></div> |
| | | </view> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { |
| | | getUserInfo, |
| | | updateInfo, |
| | | updatePassword |
| | | } from '@/api/user/index.js'; |
| | | import { |
| | | useClipboard |
| | | } from "@/hooks"; |
| | | import { |
| | | useUserStore |
| | | } from "@/store/index.js"; |
| | | import { |
| | | onShow |
| | | } from "@dcloudio/uni-app"; |
| | | import { |
| | | getDeviceRegionApi |
| | | } from "@/api/map.js"; |
| | | import { |
| | | getUserInfo, |
| | | updateInfo, |
| | | updatePassword |
| | | } from '@/api/user/index.js'; |
| | | import { |
| | | useClipboard |
| | | } from "@/hooks"; |
| | | import { |
| | | useUserStore |
| | | } from "@/store/index.js"; |
| | | import { |
| | | onShow |
| | | } from "@dcloudio/uni-app"; |
| | | import { |
| | | getDeviceRegionApi |
| | | } from "@/api/map.js"; |
| | | |
| | | const { |
| | | setClipboardData, |
| | | getClipboardData |
| | | } = useClipboard(); |
| | | const userStore = useUserStore(); |
| | | const user = ref('') |
| | | const getUserInfoData = () => { |
| | | getUserInfo().then(res => { |
| | | user.value = res.data.data; |
| | | }); |
| | | }; |
| | | const { |
| | | setClipboardData, |
| | | getClipboardData |
| | | } = useClipboard(); |
| | | const userStore = useUserStore(); |
| | | const user = ref('') |
| | | const getUserInfoData = () => { |
| | | getUserInfo().then(res => { |
| | | user.value = res.data.data; |
| | | }); |
| | | }; |
| | | |
| | | function logOut() { |
| | | userStore.setUserInfo(null) |
| | | uni.redirectTo({ |
| | | url: '/pages/login/index' |
| | | }) |
| | | } |
| | | function logOut() { |
| | | userStore.setUserInfo(null) |
| | | uni.redirectTo({ |
| | | url: '/pages/login/index' |
| | | }) |
| | | } |
| | | |
| | | function getDeviceRegion() { |
| | | getDeviceRegionApi().then(res => { |
| | | // console.log(res.data.data, '用户设备') |
| | | }) |
| | | } |
| | | const handelEdit=(val)=>{ |
| | | function getDeviceRegion() { |
| | | getDeviceRegionApi().then(res => { |
| | | // console.log(res.data.data, '用户设备') |
| | | }) |
| | | } |
| | | const handelEdit = (val) => { |
| | | |
| | | if(val === 1){ |
| | | uni.navigateTo({ |
| | | url: `/subPackages/userDetail/infos/index` |
| | | }); |
| | | }else { |
| | | uni.navigateTo({ |
| | | url: `/subPackages/userDetail/password/index` |
| | | }); |
| | | } |
| | | if (val === 1) { |
| | | uni.navigateTo({ |
| | | url: `/subPackages/userDetail/infos/index` |
| | | }); |
| | | } else { |
| | | uni.navigateTo({ |
| | | url: `/subPackages/userDetail/password/index` |
| | | }); |
| | | } |
| | | |
| | | } |
| | | // 登录鉴权,微信小程序端点击tabbar的底层逻辑不触发uni.switchTab,需要在页面onShow生命周期中校验权限 |
| | | onShow(async () => { |
| | | getDeviceRegion() |
| | | getUserInfoData() |
| | | uni.setTabBarItem({ |
| | | index: 2, // Tab 的索引(从0开始) |
| | | visible: false, |
| | | }) |
| | | uni.setTabBarItem({ |
| | | index: 3, // Tab |
| | | visible: true, |
| | | }); |
| | | }); |
| | | } |
| | | // 登录鉴权,微信小程序端点击tabbar的底层逻辑不触发uni.switchTab,需要在页面onShow生命周期中校验权限 |
| | | onShow(async () => { |
| | | getDeviceRegion() |
| | | getUserInfoData() |
| | | uni.setTabBarItem({ |
| | | index: 2, // Tab 的索引(从0开始) |
| | | visible: false, |
| | | }) |
| | | uni.setTabBarItem({ |
| | | index: 3, // Tab |
| | | visible: true, |
| | | }); |
| | | }); |
| | | </script> |
| | | <style scoped lang="scss"> |
| | | .page-wrap { |
| | | width: 100%; |
| | | height: 100%; |
| | | |
| | | padding-top: 88rpx; |
| | | } |
| | | .page-wrap { |
| | | width: 100%; |
| | | height: 100%; |
| | | |
| | | .userName { |
| | | font-family: "Source Han Sans CN"; |
| | | font-weight: 500; |
| | | font-size: 36rpx; |
| | | color: #000000; |
| | | padding-top: 88rpx; |
| | | } |
| | | |
| | | } |
| | | .userName { |
| | | font-weight: 700; |
| | | font-size: 36rpx; |
| | | color: #000000; |
| | | |
| | | .departs { |
| | | display: flex; |
| | | align-items: center; |
| | | margin-top: 22rpx; |
| | | } |
| | | |
| | | span { |
| | | font-family: "Source Han Sans CN"; |
| | | font-weight: 400; |
| | | font-size: 28rpx; |
| | | color: rgba(0, 0, 0, 0.6); |
| | | margin-left: 6rpx; |
| | | } |
| | | } |
| | | .departs { |
| | | display: flex; |
| | | align-items: center; |
| | | margin-top: 22rpx; |
| | | |
| | | .rightLogo { |
| | | width: 200rpx; |
| | | height: 80rpx; |
| | | } |
| | | .bottomLogo { |
| | | position: absolute; |
| | | bottom:50rpx; |
| | | left: 0; |
| | | right: 0; |
| | | margin: 0 auto; |
| | | text-align: center; |
| | | } |
| | | .goOutStyle { |
| | | width: 590rpx; |
| | | height: 76rpx; |
| | | background: #1D6FE9; |
| | | border-radius: 40rpx; |
| | | font-family: "Source Han Sans CN"; |
| | | font-weight: 400; |
| | | font-size: 28rpx; |
| | | color: #FFFFFF; |
| | | text-align: center; |
| | | line-height: 76rpx; |
| | | margin: auto; |
| | | margin-top: 114rpx; |
| | | } |
| | | span { |
| | | font-family: "Source Han Sans CN"; |
| | | font-weight: 400; |
| | | font-size: 28rpx; |
| | | color: rgba(0, 0, 0, 0.6); |
| | | margin-left: 6rpx; |
| | | } |
| | | } |
| | | |
| | | .personalInformation { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | padding: 0 24rpx; |
| | | .rightLogo { |
| | | width: 200rpx; |
| | | height: 80rpx; |
| | | |
| | | .message, |
| | | .passwordBox { |
| | | width: 340rpx; |
| | | height:160rpx; |
| | | .messagebox{ |
| | | padding: 20rpx 24rpx; |
| | | font-family: "Source Han Sans CN"; |
| | | font-weight: 500; |
| | | font-size: 28rpx; |
| | | color: #000000; |
| | | } |
| | | .editInfo { |
| | | padding: 20rpx 24rpx; |
| | | color: rgba(0, 0, 0, 0.5); |
| | | font-family: "Source Han Sans CN"; |
| | | font-weight: 400; |
| | | font-size: 24rpx; |
| | | display: flex; |
| | | align-items: center; |
| | | img{ |
| | | width: 28rpx; |
| | | height: 28rpx; |
| | | } |
| | | } |
| | | } |
| | | img { |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | } |
| | | |
| | | .message { |
| | | background: url('/src/static/images/user/info.svg') no-repeat center; |
| | | background-size: 100% 100%; |
| | | .bottomLogo { |
| | | position: absolute; |
| | | bottom: 50rpx; |
| | | left: 0; |
| | | right: 0; |
| | | margin: 0 auto; |
| | | text-align: center; |
| | | |
| | | } |
| | | img { |
| | | width: 128rpx; |
| | | height: 52rpx; |
| | | } |
| | | } |
| | | |
| | | .passwordBox { |
| | | background: url('/src/static/images/user/password.svg') no-repeat center; |
| | | background-size: 100% 100%; |
| | | .goOutStyle { |
| | | width: 590rpx; |
| | | height: 76rpx; |
| | | background: #1D6FE9; |
| | | border-radius: 40rpx; |
| | | font-family: "Source Han Sans CN"; |
| | | font-weight: 400; |
| | | font-size: 28rpx; |
| | | color: #FFFFFF; |
| | | text-align: center; |
| | | line-height: 76rpx; |
| | | margin: auto; |
| | | margin-top: 114rpx; |
| | | } |
| | | |
| | | } |
| | | } |
| | | .personalInformation { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | padding: 0 24rpx; |
| | | |
| | | .message, |
| | | .passwordBox { |
| | | width: 340rpx; |
| | | height: 160rpx; |
| | | |
| | | .messagebox { |
| | | padding: 20rpx 24rpx; |
| | | font-family: "Source Han Sans CN"; |
| | | font-weight: 500; |
| | | font-size: 28rpx; |
| | | color: #000000; |
| | | } |
| | | |
| | | .editInfo { |
| | | padding: 20rpx 24rpx; |
| | | color: rgba(0, 0, 0, 0.5); |
| | | font-family: "Source Han Sans CN"; |
| | | font-weight: 400; |
| | | font-size: 24rpx; |
| | | display: flex; |
| | | align-items: center; |
| | | |
| | | img { |
| | | width: 28rpx; |
| | | height: 28rpx; |
| | | } |
| | | } |
| | | } |
| | | |
| | | .message { |
| | | background: url('/src/static/images/user/info.png') no-repeat center; |
| | | background-size: 100% 100%; |
| | | |
| | | } |
| | | |
| | | .passwordBox { |
| | | background: url('/src/static/images/user/password.png') no-repeat center; |
| | | background-size: 100% 100%; |
| | | |
| | | } |
| | | } |
| | | </style> |