menduner/src/views/recruit/personal/PersonalCenter/jobFeedback/components/interested.vue

<template>
  <div>
    <v-divider></v-divider>
    <v-tabs v-model="tabVal" align-tabs="start" color="primary" bg-color="#fff" @update:modelValue="tabChange">
      <v-tab :value="0">{{  favoriteCount > 0 ? `${$t('position.positionCollection')}(${favoriteCount})` : $t('position.positionCollection') }}</v-tab>
      <v-tab :value="1">{{ subscribeCount > 0 ? `${$t('position.companyCollection')}(${subscribeCount})` : $t('position.companyCollection') }}</v-tab>
    </v-tabs>
    <div class="mt-3">
      <component :is="tabVal === 0 ? positionCollection : companyCollection" @cancelCollect="val => val ? getSubscribeCount() : getFavoriteCount()"></component>
    </div>
  </div>
</template>

<script setup>
// 感兴趣
defineOptions({ name: 'position-interested' })
import { ref } from 'vue'
import { getPersonJobFavoriteCount, getPersonEnterpriseSubscribeCount } from '@/api/position'
import positionCollection from './positionCollection.vue'
import companyCollection from './companyCollection.vue'

const tabVal = ref(0)


// 获取用户收藏职位数量
const favoriteCount = ref(0)
const getFavoriteCount = async () => {
  const data = await getPersonJobFavoriteCount()
  if (data && data > 0) favoriteCount.value = data
}
getFavoriteCount()

// 获取用户关注企业数量
const subscribeCount = ref(0)
const getSubscribeCount = async () => {
  const data = await getPersonEnterpriseSubscribeCount()
  if (data && data > 0) subscribeCount.value = data
}
getSubscribeCount()

const tabChange = () => {
  if (tabVal.value === 0) getFavoriteCount()
  else getSubscribeCount()
}
</script>

<style scoped lang="scss">
</style>