|
@@ -0,0 +1,108 @@
|
|
|
+<template>
|
|
|
+ <div class="default-width">
|
|
|
+ <buttons :current="3" style="position: sticky;" class="mx-4"></buttons>
|
|
|
+ <div class="px-4">
|
|
|
+ <!-- 搜索框 -->
|
|
|
+ <div class="white-bgc py-5">
|
|
|
+ <headSearch v-model="content" placeholder="搜索公司关键字" @handleSearch="handleSearch"></headSearch>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 参与招聘会企业列表 -->
|
|
|
+ <div class="mt-3">
|
|
|
+ <div class="content" v-if="list.length">
|
|
|
+ <v-card elevation="5" v-for="val in list" :key="val.id" class="cursor-pointer">
|
|
|
+ <div class="d-flex pa-4 pb-2">
|
|
|
+ <img :src="val.logoUrl" style="width: 80px; height: 80px; border-radius: 4px;" />
|
|
|
+ <div style="max-width: 455px;">
|
|
|
+ <h3 v-ellipse-tooltip class="enterprise-name ml-3">{{ formatName(val.name) }}</h3>
|
|
|
+ <p class="font-size-14 color-666 mt-1 mb-2 ml-3">{{ val.industryName }}</p>
|
|
|
+ <div class="flex-nowrap overflow-hidden pl-3" style="height: 35px;">
|
|
|
+ <v-hover v-slot="{ isHovering, props }" v-for="(job, index) in val.job" :key="index">
|
|
|
+ <v-chip v-bind="props" :class="isHovering ? 'elevation-5' : 'elevation-1'" class="mr-2 mb-4 display-inline-block" variant="flat" color="primary" size="small">{{ job.name }}</v-chip>
|
|
|
+ </v-hover>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="card-bottom">{{ val.jobNum }}个在线职位招聘中</div>
|
|
|
+ </v-card>
|
|
|
+ </div>
|
|
|
+ <Empty v-else class="" message="暂无数据"></Empty>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+defineOptions({ name: 'jobFairDetails' })
|
|
|
+import { ref } from 'vue'
|
|
|
+import { formatName } from '@/utils/getText'
|
|
|
+import buttons from '@/views/recruit/personal/components/buttons.vue'
|
|
|
+
|
|
|
+const content = ref('')
|
|
|
+const list = ref([
|
|
|
+ {
|
|
|
+ name: '厦门嘉逸希尔顿格芮精选酒店厦门嘉逸希尔顿格芮精选酒店',
|
|
|
+ id: 1,
|
|
|
+ industryName: '全服务中档酒店/4星级',
|
|
|
+ jobNum: 5,
|
|
|
+ logoUrl: 'https://minio.menduner.com/dev/enterprise/1872204532362121217/img/3e1ae92796fd6bc6bbbb38333dbab5ac886887b01d5bec19a90e6134e6c34b21.jpeg',
|
|
|
+ job: [
|
|
|
+ { name: 'Executive Chef 行政总厨' },
|
|
|
+ { name: 'Sales Manager 销售经理' },
|
|
|
+ { name: 'Trainee Chef Intern 实习厨师' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '厦门嘉逸希尔顿格芮精选酒店',
|
|
|
+ id: 2,
|
|
|
+ industryName: '酒店集团',
|
|
|
+ jobNum: 5,
|
|
|
+ logoUrl: 'https://www.mendunerhr.com/images/1570688031889_149244186519015424_mini.jpg',
|
|
|
+ job: [
|
|
|
+ { name: '行政总厨' },
|
|
|
+ { name: '销售经理' },
|
|
|
+ { name: '实习厨师' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '厦门嘉逸希尔顿格芮精选酒店',
|
|
|
+ id: 2,
|
|
|
+ industryName: '酒店集团',
|
|
|
+ jobNum: 5,
|
|
|
+ logoUrl: 'https://www.mendunerhr.com/images/1721650339000_782425998783287296_mini.jpg',
|
|
|
+ job: [
|
|
|
+ { name: '行政总厨' },
|
|
|
+ { name: '销售经理' },
|
|
|
+ { name: '实习厨师' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+])
|
|
|
+
|
|
|
+const handleSearch = (val) => {
|
|
|
+ console.log(val, 'handleSearch')
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+.content {
|
|
|
+ display: grid;
|
|
|
+ grid-template-columns: repeat(2, 1fr);
|
|
|
+ gap: 12px;
|
|
|
+ min-height: auto;
|
|
|
+}
|
|
|
+.card-bottom {
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ color: #fff;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 15px;
|
|
|
+ background: linear-gradient(to right, #12ebb0, #427daa);
|
|
|
+ &:hover {
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 700;
|
|
|
+ }
|
|
|
+}
|
|
|
+.enterprise-name:hover {
|
|
|
+ color: var(--v-primary-base);
|
|
|
+}
|
|
|
+</style>
|