<template>
  <div class="default-width">
    <div style="background-color: #fff; position: sticky;">
      <buttons :current="0"></buttons>
    </div>
    <div class="d-flex recommend-content">
      <div class="mt-3">
        <PositionList v-if="items.length" :items="items"></PositionList>
      </div>
      <div style="flex: 1;" class="ml-3">right-details</div>
    </div>
  </div>
</template>

<script setup>
defineOptions({ name: 'personalPositionRecommend'})
import buttons from '@/views/recruit/personal/components/buttons.vue'
import { ref, reactive } from 'vue'
import { getJobAdvertisedSearch } from '@/api/position'
import { dealDictObjData } from '@/utils/position'
import PositionList from './components/item'

const query = reactive({
  pageNum: 1,
  pageSize: 10
})
const items = ref([])

const getData = async () => {
  const { list } = await getJobAdvertisedSearch(query)
  if (!list.length) return
  items.value = list.map(e => {
    e.job = { ...e.job, ...dealDictObjData({}, e.job) }
    e.enterprise = { ...e.enterprise, ...dealDictObjData({}, e.enterprise) }
    return e
  })
  if (items.value.length) {
    items.value[0].active = true
  }
}
getData()
</script>

<style scoped lang="scss">
.recommend-content {
  height: calc(100vh - 100px);
  overflow-y: auto;
}
::-webkit-scrollbar {
  width: 0;
  height: 0;
}
</style>
