menduner-uniapp/pages/index/search.vue

<template>
	<layout-page>
		<view >
      <view style="padding: 0 15px 0 15px;">
				<uni-segmented-control 
					:current="current"
					:values="tabList"
					@clickItem="changeControl"
					styleType="text"
					activeColor="#00B760"
				></uni-segmented-control>
			</view>

			<!-- 职位推荐 -->
			<RecommendPage v-if="current === 0" :jobList="jobList" />

			<!-- 条件筛选 -->
			<ConditionPage v-else />

    </view>
	</layout-page>
</template>

<script setup>
import layoutPage from '@/layout'
import { ref, watch } from 'vue'
import { onShow } from '@dcloudio/uni-app'
import { getAccessToken } from '@/utils/request'
import { showAuthModal } from '@/hooks/useModal'
import { getJobAdvertised } from '@/api/search'
import { userStore } from '@/store/user'
import { formatName } from '@/utils/getText'
import RecommendPage from './components/recommend.vue'
import ConditionPage from './components/condition.vue'

const current = ref(0)
const tabList = ['职位推荐', '条件筛选']
const useUserStore = userStore()

// 职位列表
const jobList = ref([])
const getJobList = async () => {
  const { data } = await getJobAdvertised({ status: 0 })
  if (data.length) {
    jobList.value = data.map(e => {
      return { text: `${formatName(e.name)}_${e.areaName ? e.area?.str : '全国'}`, value: e.id }
    })
  }
}

watch(() => useUserStore.refreshToken, () => {
	if (!useUserStore.refreshToken) return jobList.value = []
	getJobList()
}, { immediate: true })

onShow(() => {
	// 设置自定义tabbar选中值
  const currentPage = getCurrentPages()[0]  // 获取当前页面实例
  const currentTabBar = currentPage?.getTabBar?.()

  // 设置当前tab页的下标index
  currentTabBar?.setData({ selected: 0 })

	if (!getAccessToken()) return showAuthModal()

})

const changeControl = (e) =>{
  current.value = e.currentIndex
}
</script>

<style scoped lang="scss">

</style>