<template>
  <div class="resume-box" style="position: relative; height: 100%;">
    <div class="resume-header">
      <div class="resume-title">屏蔽企业设置</div>
    </div>
    <div class="mt-5">
      <!-- 选择 -->
      <div class="d-flex align-center pb-5" style="border-bottom: 1px solid #dddddd;">
        <div style="color: #777;">选择企业： </div>
        <Autocomplete v-model="item.value" :item="item"></Autocomplete>
        <v-btn class="ml-3" color="primary" @click="null">确认屏蔽</v-btn>
      </div>
      <!-- 展示 -->
      <v-chip v-for="k in dataList" class="mt-3 mr-3" :key="k.id">
        <span class="cursor-pointer">{{ getText(k.skillId, skillList, 'nameCn', 'id') }}</span>
        <template v-slot:append>
          <v-icon class="ml-2" @click="handleDelete(k)">mdi-close-circle</v-icon>
        </template>
      </v-chip>
    </div>
  </div>
</template>

<script setup>
import { 
  savePersonResumeCv,
  getResumePersonSkill,
  enterpriseSearchByName,
} from '@/api/recruit/personal/resume'
import { getText } from '@/utils/getText'
import Snackbar from '@/plugins/snackbar'
import Confirm from '@/plugins/confirm'
import { ref } from 'vue'
defineOptions({name: 'resume-blockEnt'})


// 获取数据
const dataList = ref([])
const getData = async () => {
  const data = await getResumePersonSkill()
  dataList.value = data
}
getData()

// 删除 
const handleDelete = ({ id }) => {
  Confirm('系统提示', '是否确认删除此职业技能？').then(async () => {
    await savePersonResumeCv(id)
    getData()
    Snackbar.success('删除成功！')
  })
}



// 企业名称下拉列表
const enterpriseNameInput = ref('')
const getEnterpriseData = async (name) => {
  // const item = formItems.value.options.find(e => e.key === 'enterpriseId')
  // if (!item) return
  if (item.items?.length && (enterpriseNameInput.value === name)) return // 防抖
  item[item.itemTextName] = enterpriseNameInput.value = name
  if (name === null || name === '') { item.items = [] }
  else {
    const data = await enterpriseSearchByName({ name })
    item.items = data
  }
}
const item = {
  type: 'autocomplete',
  key: 'enterpriseId',
  value: null,
  default: null,
  label: '请输入企业名称搜索',
  outlined: true,
  clearable: true,
  hireDetails: true,
  itemTextName: 'enterpriseName',
  itemText: 'value',
  itemValue: 'key',
  width: '400',
  search: getEnterpriseData,
  items: []
}
</script>

<style lang="scss" scoped>

</style>