menduner/src/components/Enterprise/info.vue

<template>
  <div class="info-box">
    <h4 class="mb-3">{{ $t('enterprise.companyInfo') }}</h4>
    <div style="height: 50px; line-height: 50px;">
      <v-img class="float-left" :src="props.info.enterprise.logoUrl || 'https://minio.citupro.com/dev/menduner/company-avatar.png'" :width="45" height="45"></v-img>
      <div class="ml-3 float-left">
        <p class="enterprise-name cursor-pointer" @click="handleEnterprise(0)">{{ formatName(props.info.enterprise.anotherName || props.info.enterprise.name) }}</p>
        <!-- <v-icon :color="statusInfo.color" size="20">{{ statusInfo.mdi }}</v-icon>
        <span :style="{'color': statusInfo.color,'font-size': '14px'}">{{ statusInfo.label }}</span> -->
      </div>
    </div>
    <div class="mt-3 border-bottom-dashed" style="font-size: 14px;">
      <div v-for="val in list" :key="val.icon" class="d-flex my-2">
        <v-icon size="20" color="var(--color-666)">{{ val.icon }}</v-icon>
        <div class="info-address ml-4">{{ obj[val.label] || '暂无' }}</div>
      </div>
    </div>
    <div style="font-size: 12px;height: 50px; line-height: 50px">
      <span class="float-right more-position" @click="handleEnterprise(1)">{{ $t('position.allBtn') }}<v-icon>mdi-chevron-right</v-icon></span>
    </div>
  </div>
</template>

<script setup>
defineOptions({ name: 'enterprise-info' })
import { ref } from 'vue'
import { dealDictObjData } from '@/utils/position'
import { formatName } from '@/utils/getText'
// import { getEnterpriseAuthDetails } from '@/api/position'

const props = defineProps({
  info: {
    type: Object,
    default: () => {}
  }
})

const list = [
  { icon: 'mdi-account-multiple', label: 'scaleName' },
  { icon: 'mdi-family-tree', label: 'industryName' }
]
// const statusList = [
//   { label: '未认证', color: '#fb8c00', value: null, mdi: 'mdi-shield-remove' },
//   { label: '审核中', color: '#fb8c00', value: '0', mdi: 'mdi-shield-half-full' },
//   { label: '已认证', color: 'var(--v-primary-base)', value: '1', mdi: 'mdi-shield-check' },
//   { label: '已驳回', color: '#fe574a', value: '2', mdi: 'mdi-shield-off' }
// ]

const obj = ref({})
// const authInfo = ref({})
const getData = async () => {
  const prise = props.info.enterprise
  obj.value = dealDictObjData({}, prise)
  // 企业实名认证信息
  // authInfo.value = await getEnterpriseAuthDetails(props.info.enterprise.id)
}
getData()

// const statusInfo = computed(() => {
//   const obj = (authInfo.value && Object.keys(authInfo.value).length) ? statusList.find(e => e.value === authInfo.value.status) : statusList[0]
//   return obj
// })

const handleEnterprise = (val) => {
  const key = val ? 'recruitmentPositions' : 'briefIntroduction'
  window.open(`/recruit/personal/company/details/${props.info.enterprise.id}?key=${key}`)
}
</script>

<style lang="scss" scoped>
.info-box {
  height: 230px;
  background-color: var(--color-f3);
  border-radius: 8px;
  padding: 20px 15px;
}
.enterprise-name {
  width: 165px;
  font-weight: 500;
  max-width: 165px;
  vertical-align: middle;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  &:hover {
    color: var(--v-primary-base);
  }
}
.info-address {
  width: 185px;
  font-weight: 500;
  max-width: 185px;
  vertical-align: middle;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  &:hover {
    color: var(--v-primary-base);
  }
}
.more-position {
  color: var(--v-primary-base);
  cursor: pointer;
}
</style>