my.vue 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148
  1. <template>
  2. <layout-page>
  3. <view class="ss-p-b-30">
  4. <view class="text-center" @tap="handleTap">
  5. <img :src="getUserAvatar(baseInfo?.avatar, baseInfo?.sex)" alt="" class="img-box">
  6. <view v-if="!useUserStore.isLogin" class="font-weight-bold font-size-20">点击登录</view>
  7. <view v-else class="font-weight-bold font-size-20">{{ baseInfo?.name || userInfo?.phone }}</view>
  8. </view>
  9. <view class="d-flex" style="margin-top: 80rpx;">
  10. <view v-for="(item, index) in itemList" :key="index" @tap="handleToLink(item)" class="parent">
  11. <view class="d-flex justify-space-between">
  12. <view>
  13. <view class="colors">
  14. <span>查看更多</span>
  15. <uni-icons color="#c8c5c4" type="right" size="15" class="ml"/>
  16. </view>
  17. <view class="size-16">{{ item.title }}</view>
  18. </view>
  19. <view>
  20. <uni-icons color="#00897B" :type="item.icon" size="45"/>
  21. </view>
  22. </view>
  23. </view>
  24. </view>
  25. <view style="height: 10rpx; background-color: #f8f8fa;"></view>
  26. <view class="card">
  27. <uni-list>
  28. <uni-list-item v-for="item in list" :clickable="true" :key="item.title" :title="item.title" showArrow :rightText="item.rightTex || ''" @click="handleToLink(item)"></uni-list-item>
  29. </uni-list>
  30. </view>
  31. <button v-if="useUserStore.isLogin" class="send-button" @tap="handleLogout">退出登录</button>
  32. <uni-popup ref="popup" type="dialog">
  33. <uni-popup-dialog type="warn" cancelText="取消" confirmText="确定" title="系统提示" content="确认退出账号?" @confirm="handleLogoutConfirm"
  34. @close="handleLogoutClose"></uni-popup-dialog>
  35. </uni-popup>
  36. </view>
  37. </layout-page>
  38. </template>
  39. <script setup>
  40. import { ref, computed } from 'vue'
  41. import { userStore } from '@/store/user'
  42. import { getUserAvatar } from '@/utils/avatar'
  43. import { getAccessToken } from '@/utils/request'
  44. import layoutPage from '@/layout'
  45. import { showAuthModal } from '@/hooks/useModal'
  46. const useUserStore = userStore()
  47. const baseInfo = computed(() => useUserStore?.baseInfo)
  48. const userInfo = computed(() => useUserStore?.userInfo)
  49. const popup = ref()
  50. const itemList = [
  51. { title: "面试管理", path: "/pagesA/interview/index", icon: "list" },
  52. { title:'谁看过我', path:'/pagesA/seenMe/index', icon:'staff' }
  53. ]
  54. const list = [
  55. { title: '附件简历', path: '/pagesA/resume/index' },
  56. { title: '我的收藏', path: '/pagesA/collect/index' },
  57. { title: '前往门墩儿甄选商城', appId: 'wx6decdf12f9e7a061' },
  58. { title: '切换为招聘者', rightTex: '我要招人' }
  59. ]
  60. // 列表跳转
  61. const handleToLink = (item) => {
  62. if (item.appId) {
  63. uni.navigateToMiniProgram({
  64. appId: item.appId,
  65. // extraData: {} // 要传递的数据
  66. })
  67. return
  68. }
  69. if (!item.path) return
  70. if (!getAccessToken()) {
  71. uni.showToast({
  72. title: '请先登录',
  73. icon: 'none'
  74. })
  75. showAuthModal()
  76. return
  77. }
  78. uni.navigateTo({
  79. url: item.path
  80. })
  81. }
  82. // 登录
  83. const handleTap = () => {
  84. if (!useUserStore.isLogin) {
  85. showAuthModal()
  86. return
  87. }
  88. // uni.navigateTo({
  89. // url: '/pagesA/info/index'
  90. // })
  91. }
  92. // 退出登录
  93. const handleLogout = () => {
  94. popup.value.open()
  95. }
  96. const handleLogoutClose = () => {
  97. popup.value.close()
  98. }
  99. const handleLogoutConfirm = () => {
  100. useUserStore.handleLogout()
  101. }
  102. </script>
  103. <style scoped lang="scss">
  104. .img-box {
  105. width: 150rpx;
  106. height: 150rpx;
  107. border: 2rpx solid #ccc;
  108. border-radius: 50%;
  109. }
  110. ::v-deep .uni-list-item{
  111. height: 140rpx !important;
  112. line-height: 140rpx !important;
  113. }
  114. ::v-deep .uni-list-item__content-title{
  115. font-size: 32rpx !important;
  116. font-weight: 500;
  117. }
  118. .colors{
  119. font-size: 24rpx;
  120. color: #606266;
  121. }
  122. .size-16{
  123. color: #3f424f;
  124. font-size: 32rpx;
  125. margin: 13rpx 0 5rpx 0;
  126. }
  127. .parent{
  128. width: 50%;
  129. border: 1px solid #f4f4f4;
  130. border-radius: 10rpx;
  131. margin: 0 30rpx 20rpx 30rpx;
  132. padding: 20rpx;
  133. }
  134. .parent:first-child{
  135. margin: 0 0 20rpx 30rpx;
  136. }
  137. </style>