<template>
  <div>
    <navBar @click="handleClickNav"></navBar>
    <div class="white-bgc">
      <service v-if="query.type === 'service' || query.type === 'industry'" :id="query.key" :type="query.type" class="content-box"></service>
      <consultant v-if="query.type === 'consultant'" :id="query.key" class="content-box"></consultant>
      <ArticleDrill v-if="query.type === 'article'" :id="query.key"></ArticleDrill>
    </div>
  </div>
</template>

<script setup>
defineOptions({ name: 'headhuntingDetails' })
import { useRouter } from 'vue-router'
import navBar from './components/nav.vue'
import service from './drill/service.vue'
import consultant from './drill/consultant.vue'
import ArticleDrill from './drill/article.vue'

const router = useRouter()
const query = router.currentRoute.value.query

const handleClickNav = (path) => {
  if (!path) return
  router.push(path)
}
</script>

<style scoped lang="scss">
.content-box {
  width: 1000px;
  max-width: 1000px;
  min-width: 1000px;
  margin: 0 auto;
}
</style>
