search.vue 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. <template>
  2. <view>
  3. <Navbar :showLogo="true" />
  4. <layout-page>
  5. <view :style="{'padding-top': navbarHeight + 'px'}">
  6. <view class="commonBackground"></view>
  7. <view class="box defaultBgc">
  8. <!-- <SwiperAd v-if="swiperAdList?.length" margin="0 10px 10px 10px" :list="swiperAdList" imgUrlKey="img" :strType="false" /> -->
  9. <view>
  10. <uni-segmented-control
  11. :current="current"
  12. :values="tabList"
  13. @clickItem="changeControl"
  14. styleType="text"
  15. activeColor="#00B760"
  16. ></uni-segmented-control>
  17. </view>
  18. <!-- 职位推荐 -->
  19. <RecommendPage v-if="current === 0" :jobList="jobList" :navbarHeight="navbarHeight" />
  20. <!-- 条件筛选 -->
  21. <ConditionPage v-else :navbarHeight="navbarHeight" />
  22. </view>
  23. </view>
  24. </layout-page>
  25. </view>
  26. </template>
  27. <script setup>
  28. import { ref, watch, onMounted } from 'vue'
  29. import { onShow } from '@dcloudio/uni-app'
  30. import layoutPage from '@/layout'
  31. import Navbar from '@/components/Navbar'
  32. // import SwiperAd from '@/components/SwiperAd'
  33. import { getAccessToken } from '@/utils/request'
  34. import { showAuthModal } from '@/hooks/useModal'
  35. import { getJobAdvertised } from '@/api/search'
  36. import { userStore } from '@/store/user'
  37. import { formatName } from '@/utils/getText'
  38. import RecommendPage from './components/recommend.vue'
  39. import ConditionPage from './components/condition.vue'
  40. import { getWebContent } from '@/api/common'
  41. const navbarHeight = ref(0)
  42. onMounted(async () => {
  43. try {
  44. const res = await new Promise((resolve, reject) => {
  45. uni.getStorage({
  46. key: 'navbarHeight',
  47. success: (result) => resolve(result),
  48. fail: (err) => reject(err)
  49. })
  50. })
  51. navbarHeight.value = res.data
  52. console.log(navbarHeight.value, '职位列表-导航栏高度')
  53. } catch (error) {
  54. console.error('读取本地缓存出错:', error)
  55. }
  56. })
  57. const current = ref(0)
  58. const tabList = ['人才推荐', '条件筛选']
  59. const useUserStore = userStore()
  60. // 获取轮播图
  61. const swiperAdList = ref([])
  62. const getSystemWebContent = async () => {
  63. const { data } = await getWebContent()
  64. swiperAdList.value = data?.appHomeCarousel || []
  65. }
  66. // 职位列表
  67. const jobList = ref([])
  68. const getJobList = async () => {
  69. if (!useUserStore.refreshToken || uni.getStorageSync('isPersonalToken')) {
  70. return
  71. }
  72. const { data } = await getJobAdvertised({ status: 0, exTime: 0 })
  73. if (data.length) {
  74. jobList.value = data.map(e => {
  75. return { text: `${formatName(e.name)}_${e.areaName ? e.area?.str : '全国'}`, value: e.id }
  76. })
  77. }
  78. }
  79. watch(() => useUserStore.refreshToken, () => {
  80. getJobList()
  81. }, { immediate: true })
  82. onShow(() => {
  83. // getSystemWebContent()
  84. // 设置自定义tabbar选中值
  85. const currentPage = getCurrentPages()[0] // 获取当前页面实例
  86. const currentTabBar = currentPage?.getTabBar?.()
  87. // 设置当前tab页的下标index
  88. currentTabBar?.setData({ selected: 0 })
  89. if (!getAccessToken()) return showAuthModal()
  90. else getJobList()
  91. })
  92. const changeControl = (e) =>{
  93. current.value = e.currentIndex
  94. }
  95. </script>
  96. <style scoped lang="scss">
  97. :deep {
  98. .uni-select__selector-item {
  99. display: block !important;
  100. text-align: left !important;
  101. max-width: 100% !important;
  102. white-space: nowrap !important;
  103. text-overflow: ellipsis !important;
  104. overflow: hidden !important;
  105. }
  106. .uni-select {
  107. background-color: #fff !important;
  108. }
  109. }
  110. // .stick {
  111. // z-index: 1;
  112. // position: sticky;
  113. // background-color: #fff;
  114. // }
  115. </style>