<template>
  <div v-if="interestList.length">
    <div
      :class="['position-item', 'mb-1']" 
      v-for="(k, i) in interestList" 
      :key="'jobIntention' + i"
    >
      <div class="d-flex">
        <div>{{ k.position }}</div>
        <div class="line">|</div>
        <div>{{k.payFrom}}-{{k.payTo}}</div>
        <div class="line">|</div>
        <div class="grey-text text-box">{{ k.industry?.map(e => e.nameCn).join('、') }}</div>
        <div class="line">|</div>
        <div class="grey-text">{{ k.jobTypeName }}</div>
        <div class="line" v-if="k.jobTypeName && k.workArea">|</div>
        <div class="grey-text">{{ k.workArea }}</div>
      </div>
    </div>
  </div>
</template>

<script setup>
import { ref } from 'vue'
import { dealJobData } from './dict'
defineOptions({name: 'enterprise-talentPool-details-jobIntention'})

const props = defineProps({
  data: {
    type: Array,
    default: () => []
  }
})

// 获取求职意向
const interestList = ref([])
if (props.data?.length) interestList.value = dealJobData(props.data)

</script>
<style lang="scss" scoped>
.position-item {
  display: flex;
  justify-content: space-between;
  border-radius: 6px;
  font-size: 15px;
  span {
    font-size: 15px;
  }
  .grey-text {
    color: var(--color-999);
  }
  .line {
    color: #e0e0e0;
    margin: 0 10px;
  }
}
</style>
