<template>
  <div>
    <headCarousel></headCarousel>
    <div class="stickyBox py-5">
      <headSearch text="职位类型" @handleSearch="handleSearch"></headSearch>
    </div>
    <hotJobs></hotJobs>
    <div class="default-width">
      <!-- <jobTypeCard class="mb-5" page @handleJobClick="handleJobClick" isSingle></jobTypeCard> -->
      <homeJobTypeCard></homeJobTypeCard>
      <advertisementPage class="my-3"></advertisementPage>
      <hotPromotedPositions></hotPromotedPositions>
      <PopularEnterprises class="mt-10"></PopularEnterprises>
    </div>
  </div>
  <!-- 快速填写简易人才信息-弹窗 -->
  <simplePage v-if="showSimplePage" :closeable="true" closeText="暂时跳过" @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 jobTypeCard from '@/components/jobTypeCard'
import homeJobTypeCard from './components/homeJobTypeCard'
import hotPromotedPositions from './components/hotPromotedPositions.vue'
import PopularEnterprises from './components/popularEnterprises.vue'
import advertisementPage from './components/advertisement.vue'
import { useRouter } from 'vue-router'
import { nextTick, ref } from 'vue'
import { useUserStore } from '@/store/user'

const store = useUserStore()
const updateBaseInfo = async () => {
  await store.getUserBaseInfos()
}
updateBaseInfo()

const router = useRouter()
const simple = localStorage.getItem('simpleCompleteDialogHaveBeenShow')
const showSimplePage = ref(simple? false : true) // 只提示一次
nextTick(() => {
  localStorage.setItem('simpleCompleteDialogHaveBeenShow', true)
})

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

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

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