<template>
  <div>
    <headCarousel></headCarousel>
    <div class="stickyBox py-5">
      <headSearch @handleSearch="handleSearch"></headSearch>
    </div>
    <hotJobs></hotJobs>
    <div class="default-width">
      <homeJobTypeCard></homeJobTypeCard>
      <advertisementPage class="my-3"></advertisementPage>
      <hotPromotedPositions></hotPromotedPositions>
      <PopularEnterprises class="mt-10"></PopularEnterprises>
    </div>
  </div>
  <!-- 快速填写简易人才信息-弹窗 -->
  <simplePage v-if="showSimplePage" :closeable="true" closeText="暂时跳过" @close="handleInfoClose" @simpleInfoReady="handleUpdateInfo"></simplePage>
</template>

<script setup>
defineOptions({ name:'personal-index'})
import simplePage from '@/views/recruit/personal/shareJob/sendResume/simple.vue'
import headCarousel from './components/headCarousel.vue'
import headSearch from '@/components/headSearch'
import hotJobs from './components/hotJobs.vue'
import homeJobTypeCard from './components/homeJobTypeCard'
import hotPromotedPositions from './components/hotPromotedPositions.vue'
import PopularEnterprises from './components/popularEnterprises.vue'
import advertisementPage from './components/advertisement/index.vue'
import { useRouter } from 'vue-router'
import { nextTick, ref } from 'vue'
import { useUserStore } from '@/store/user'
import { getToken } from '@/utils/auth'

const store = useUserStore()

const router = useRouter()
const simple = ref(localStorage.getItem('simpleCompleteDialogHaveBeenShow'))
const showSimplePage = ref(false) // 只提示一次
if (!getToken()) showSimplePage.value = false
nextTick(() => {
  if (getToken()) {
    showSimplePage.value = simple.value && JSON.parse(simple.value) ? true : false
  }
})

const handleSearch = (val) => {
  if (val) router.push(`/recruit/personal/position?content=${val}`)
}

const handleInfoClose = () => {
  localStorage.setItem('simpleCompleteDialogHaveBeenShow', false)
}

// 更新用户基本信息
const handleUpdateInfo = async () => {
  handleInfoClose()
  await store.getUserBaseInfos(null)
}
</script>

<style lang="scss" scoped>
.stickyBox {
  position: sticky;
  top: 48px;
  z-index: 999;
  background-color: var(--default-bgc);
}
</style>