|
|
@@ -2,20 +2,32 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
<!-- 轮播 -->
|
|
|
- <v-carousel :show-arrows="cursor.length > 1 ? 'hover' : false" cycle :hide-delimiters="true" style="height: 500px;">
|
|
|
- <v-carousel-item v-for="(k, i) in cursor" :key="i">
|
|
|
+ <v-carousel v-if="jobFair?.pcHeadImg && jobFair?.pcHeadImg.length > 0" cycle :hide-delimiters="true" style="height: 500px;">
|
|
|
+ <v-carousel-item v-for="(k, i) in jobFair?.pcHeadImg" :key="i">
|
|
|
<img :src="k" :lazy-src="k" style="width: 100%; height:100%;">
|
|
|
</v-carousel-item>
|
|
|
</v-carousel>
|
|
|
- <!-- 企业列表 -->
|
|
|
- <div style="background-color: #7ec04c">
|
|
|
+
|
|
|
+ <div :style="`background-color: ${jobFair.backgroundColour}; min-height: calc(100vh - 500px);`">
|
|
|
<div class="default-width">
|
|
|
- <Empty v-if="!items.length && !query.keyword" :message="loadingType === 1 ? loadingText[loadingType] : '该招聘会暂无企业参与，前往其他招聘会看看吧~'" class="mt-3 py-15"></Empty>
|
|
|
- <template v-else>
|
|
|
- <div class="d-flex justify-space-between mt-3">
|
|
|
- <EntCard :list="leftData" @selectChange="selectChange" />
|
|
|
- <EntCard :list="rightData" @selectChange="selectChange" />
|
|
|
+ <!-- 类别展示 -->
|
|
|
+ <div class="d-flex align-center" v-if="jobFair?.tag && jobFair.tag.length">
|
|
|
+ <div
|
|
|
+ v-for="(val, index) in jobFair.tag"
|
|
|
+ :key="index"
|
|
|
+ class="tag-item"
|
|
|
+ :class="{'tag-active': index === tab}"
|
|
|
+ :style="{'width': `calc(100% / ${jobFair.tag.length} )`}"
|
|
|
+ @click.stop="handleTabClick(index)"
|
|
|
+ >
|
|
|
+ {{ val.title }}
|
|
|
</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div v-if="!items.length" class="emptyText">{{ loadingType === 1 ? loadingText[loadingType] : '暂无数据，去看看其他吧~' }}</div>
|
|
|
+ <template v-else>
|
|
|
+ <EntCard v-if="jobFair?.category === '0'" :list="items" class="mt-5" />
|
|
|
+ <JobCard v-if="jobFair?.category === '1'" :list="items" class="mt-5" />
|
|
|
<div :class="['loading', {'defaultLink-i': !loadingType}]" @click="handleChangePage">{{ loadingText[loadingType] }}</div>
|
|
|
</template>
|
|
|
</div>
|
|
|
@@ -26,69 +38,73 @@
|
|
|
<script setup>
|
|
|
defineOptions({name: 'jobFair-enterprises'})
|
|
|
import { ref, reactive } from 'vue'
|
|
|
-import { getJobFairEnterprisePage, getJobFair } from '@/api/recruit/personal/jobFair'
|
|
|
+import { getJobFairEnterprisePage, getJobFair, getJobFairEntJobPage } from '@/api/recruit/personal/jobFair'
|
|
|
import EntCard from './components/entCard1.vue'
|
|
|
-import { useRoute, useRouter } from 'vue-router'; const route = useRoute(); const router = useRouter()
|
|
|
-import { dealDictArrayData } from '@/utils/position'
|
|
|
-
|
|
|
-const cursor = ref([
|
|
|
- // "https://menduner.citupro.com:3443/dev/9de969f4723dd8819794fcd2d91b47a2f2b6f16993908712a53ee6a21f6735f1.jpg",
|
|
|
- "https://menduner.citupro.com:3443/dev/b263663417d6f0d8a5822ca4c1f607503d661c7e17269e7f60cf32f9eed91d77.jpg"
|
|
|
-])
|
|
|
-
|
|
|
-// const handleClick = (item) => {
|
|
|
-// if (!item.path || item.disabled) return
|
|
|
-// router.push(item.path)
|
|
|
-// }
|
|
|
-
|
|
|
-// 招聘会详情-面包屑标题设置
|
|
|
-const getJobFairDetail = async () => {
|
|
|
- const data = await getJobFair(route?.params?.id)
|
|
|
- if (!data) return
|
|
|
- // breadcrumbs.value[breadcrumbs.value.length - 1].text = data.title.replace(/<\/?p[^>]*>/gi, '')
|
|
|
- document.title = data.title.replace(/<\/?p[^>]*>/gi, '')
|
|
|
-}
|
|
|
-getJobFairDetail()
|
|
|
-
|
|
|
-const selectChange = (val) => {
|
|
|
- // enterpriseId.value = val.id
|
|
|
- // enterpriseName.value = formatName(val.anotherName || val.name)
|
|
|
-}
|
|
|
+import JobCard from './components/jobCard1.vue'
|
|
|
+import { useRoute } from 'vue-router'; const route = useRoute();
|
|
|
+import { dealDictArrayData, dealDictObjData } from '@/utils/position'
|
|
|
|
|
|
+const tab = ref(0)
|
|
|
const query = reactive({
|
|
|
pageNo: 1,
|
|
|
- pageSize: 10,
|
|
|
- jobFairId: route.params.id,
|
|
|
- keyword: ''
|
|
|
+ pageSize: 20,
|
|
|
+ jobFairId: route.params.id
|
|
|
})
|
|
|
|
|
|
const items = ref([])
|
|
|
-const leftData = ref([])
|
|
|
-const rightData = ref([])
|
|
|
const loadingText = ['加载更多', '加载中...', '没有更多数据了']
|
|
|
const loadingType = ref(0)
|
|
|
|
|
|
// 参与招聘会的企业
|
|
|
const getList = async () => {
|
|
|
loadingType.value = 1
|
|
|
+
|
|
|
+ // 有类别的添加筛选条件
|
|
|
+ if (jobFair.value?.tag && jobFair.value?.tag.length) {
|
|
|
+ const key = jobFair.value.tag[tab.value].key
|
|
|
+ const value = jobFair.value.tag[tab.value].value
|
|
|
+ query[key] = value
|
|
|
+ }
|
|
|
+
|
|
|
try {
|
|
|
- const result = await getJobFairEnterprisePage(query)
|
|
|
+ const result = jobFair.value?.category === '0' ? await getJobFairEnterprisePage(query) : await getJobFairEntJobPage(query)
|
|
|
const list = result?.list || []
|
|
|
- if (list.length) {
|
|
|
- items.value = items.value.concat(dealDictArrayData([], list))
|
|
|
+ if (list.length) {
|
|
|
+ if (jobFair.value?.category === '1') {
|
|
|
+ items.value.push(...list.map(e => {
|
|
|
+ e.enterprise = dealDictObjData({}, e.enterprise)
|
|
|
+ e = dealDictObjData({}, e)
|
|
|
+ return e
|
|
|
+ }))
|
|
|
+ }
|
|
|
+ else items.value = items.value.concat(dealDictArrayData([], list))
|
|
|
+
|
|
|
loadingType.value = items.value.length === result.total ? 2 : 0
|
|
|
- // 分为两列数据
|
|
|
- leftData.value = []; rightData.value = []
|
|
|
- items.value.forEach((e, index) => {
|
|
|
- if (index % 2) rightData.value.push(e)
|
|
|
- else leftData.value.push(e)
|
|
|
- })
|
|
|
} else {
|
|
|
loadingType.value = 2
|
|
|
}
|
|
|
} catch {}
|
|
|
}
|
|
|
-getList()
|
|
|
+
|
|
|
+// 招聘会详情
|
|
|
+const jobFair = ref([])
|
|
|
+const getJobFairDetail = async () => {
|
|
|
+ const data = await getJobFair(route?.params?.id)
|
|
|
+ if (!data) return
|
|
|
+ jobFair.value = data
|
|
|
+ document.title = data.title.replace(/<\/?p[^>]*>/gi, '')
|
|
|
+ getList()
|
|
|
+}
|
|
|
+getJobFairDetail()
|
|
|
+
|
|
|
+
|
|
|
+// tab项点击
|
|
|
+const handleTabClick = (index) => {
|
|
|
+ items.value = []
|
|
|
+ query.pageNo = 1
|
|
|
+ tab.value = index
|
|
|
+ getList()
|
|
|
+}
|
|
|
|
|
|
const handleChangePage = () => {
|
|
|
if (loadingType.value) return // 没有更多数据了
|
|
|
@@ -99,35 +115,43 @@ const handleChangePage = () => {
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
-.position-details {
|
|
|
- position: sticky;
|
|
|
- top: 62px;
|
|
|
- border-radius: 12px;
|
|
|
- // background-color: #fff;
|
|
|
- margin-top: 12px;
|
|
|
- height: calc(100vh - 127px);
|
|
|
- widows: 100%;
|
|
|
- overflow: hidden;
|
|
|
- .position-content {
|
|
|
- height: 100%;
|
|
|
- width: 100%;
|
|
|
- padding-right: 4px;
|
|
|
- overflow-y: auto;
|
|
|
+.tag-item {
|
|
|
+ color: #fff;
|
|
|
+ font-weight: 700;
|
|
|
+ font-size: 24px;
|
|
|
+ text-align: center;
|
|
|
+ height: 74px;
|
|
|
+ line-height: 74px;
|
|
|
+ opacity: .8;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+.tag-active {
|
|
|
+ opacity: 1;
|
|
|
+ position: relative;
|
|
|
+ &::before {
|
|
|
+ display: block;
|
|
|
+ content: '';
|
|
|
+ width: 34px;
|
|
|
+ height: 4px;
|
|
|
+ background-color: #fff;
|
|
|
+ position: absolute;
|
|
|
+ top: 62px;
|
|
|
+ left: 50%;
|
|
|
+ border-radius: 2px;
|
|
|
+ transform: translateX(-50%);
|
|
|
}
|
|
|
}
|
|
|
+.emptyText {
|
|
|
+ color: #fff;
|
|
|
+ height: calc(100vh - 574px);
|
|
|
+ line-height: calc(100vh - 574px);
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
.loading {
|
|
|
margin-top: 8px;
|
|
|
text-align: center;
|
|
|
font-size: 13px;
|
|
|
- color: gray;
|
|
|
-}
|
|
|
-.breadcrumbsText {
|
|
|
- color: var(--color-999);
|
|
|
- font-size: 15px;
|
|
|
- &.active {
|
|
|
- color: var(--v-primary-base);
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
+ color: #fff;
|
|
|
}
|
|
|
::-webkit-scrollbar {
|
|
|
width: 0;
|
Xiao_123