<template>
  <div>
    <div
      v-for="(item, index) in dataList" :key="'educationExp' + index"
      :class="[' mx-n2', {'mt-5': index }]"
    >
      <div class="educExpItem">
        <div class="level1 d-flex align-center justify-space-between">
          <div>
            <span style="font-size: 16px;">{{ item.schoolName }}</span>
            <span class="color6 font15 ml-5">
              <span>{{ timesTampChange(item.startTime, 'Y-M-D') }}</span>
              <span class="mx-1">至</span>
              <span>{{ timesTampChange(item.endTime, 'Y-M-D') }}</span>
            </span>
          </div>
          <div v-if="item.active">
            <v-btn  variant="text" color="primary" prepend-icon="mdi-square-edit-outline" @click="handle(item)">{{ $t('common.edit') }}</v-btn>
            <v-btn  variant="text" color="primary" prepend-icon="mdi-trash-can-outline" @click="handleDelete(item)">{{ $t('common.delete') }}</v-btn>
          </div>
        </div>
        <div class="level2 my-2">
          <span class="color6 font15">{{ item.major }}</span>
          <span class="septal-line"  v-if="item.educationSystemType"></span>
          <span class="color6 font15">{{ getText(item.educationSystemType, dictItemsObj.educationSystemType) }}</span>
        </div>
        <div class="level3">
          <span class="color6 font15">在校经历：{{ item.content }}</span>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup>
defineOptions({name: 'enterprise-talentPool-details-educationExp'})
import { reactive, ref  } from 'vue'
import { timesTampChange } from '@/utils/date'
import { getText } from '@/utils/getText'
import { getDict } from '@/hooks/web/useDictionaries'

const props = defineProps({
  data: Array
})

const dataList = ref([])
if (props.data?.length) dataList.value = props.data

// 获取字典内容
const dictList = [
  { type: 'menduner_education_system_type', key: 'educationSystemType' }
]
const dictItemsObj = reactive({})
const getDictData = async (obj) => {
  const { data } = await getDict(obj.type)
  dictItemsObj[obj.key] = data || []
}
const getOptions = () => {
  dictList.forEach(obj =>  getDictData(obj))
}
getOptions()
</script>
<style lang="scss" scoped>
</style>
