menduner/src/views/recruit/company/components/companyItem.vue

<template>
  <div class="company-box">
    <div class="sub-li" v-for="item in list" :key="item.id" @mouseenter="item.active = true" @mouseleave="item.active = false">
      <div class="company-info-top" @click="handleClickEnterprise(item)">
        <div class="float-left">
          <v-img :src="item.logoUrl" :alt="item.anotherName" :width="40" style="height: 40px;border-radius: 4px;"/>
        </div>
        <div class="company-info">
          <h3 :class="{'default-active': item.active }">{{ item.anotherName }}</h3>
          <p>{{ item.financingName }}<span class="mx-2">|</span>{{ item.industryName }}</p>
        </div>
      </div>
      <div class="company-info-bottom">
        <v-chip class="mr-2" color="primary" size="x-small" label v-for="(k, i) in welfareList" :key="i">{{ k }}</v-chip>
      </div>
    </div>
  </div>
</template>

<script setup>
defineOptions({ name: 'company-item'})
defineProps({
  list: Array
})

const welfareList = ['双休', '五险一金', '零食下午茶', '年终奖']

const handleClickEnterprise = (item) => {
  window.open(`/enterprise/details/${item.id}?key=briefIntroduction`)
}
</script>

<style scoped lang="scss">
@import url('@/styles/recruit/company.scss');
</style>