Pārlūkot izejas kodu

招聘会样式修改

lifanagju_citu 2 mēneši atpakaļ
vecāks
revīzija
435b8f61f5

+ 13 - 0
api/jobFair.js

@@ -13,6 +13,19 @@ export const getJobFairList = (params) => {
   })
 }
 
+// 获得招聘会-招聘会详情
+export const getJobFair = (id) => {
+  return request({
+    url: '/app-api/menduner/system/job-fair/get',
+    method: 'GET',
+    params: { id },
+    custom: {
+      showLoading: false,
+      auth: false
+    }
+  })
+}
+
 // 招聘会企业分页查询
 export const getJobFairEnterprisePage = (params) => {
   return request({

+ 6 - 0
pages.json

@@ -319,6 +319,12 @@
 						"navigationBarTitleText": "招聘会/职位"
 					}
 				},
+				{
+					"path": "jobFair/enterprisesClassification",
+					"style": {
+						"navigationBarTitleText": "招聘会/企业"
+					}
+				},
 				{
 					"path": "jobFair/positionClassification",
 					"style": {

+ 258 - 0
pagesB/jobFair/enterprisesClassification.vue

@@ -0,0 +1,258 @@
+<!-- 招聘会/企业详情 -->
+<template>
+  <view class="box">
+    <scroll-view class="scrollBox" :scroll-y="true" :scroll-top="scrollTop" @scrolltolower="loadingMore" @scroll="onScroll" style="position:relative;">
+      <view>
+        <!-- 轮播图 -->
+        <SwiperAd v-if="swiperAdList.length" :list="swiperAdList" imgUrlKey="img" margin="0" borderRadius="0" :strType="false" @click="handleToDetails"></SwiperAd>
+        <view class="stick">
+          <!-- tab页签 -->
+          <scroll-view v-if="tabList?.length" scroll-x="true" class="scroll-container">
+            <view
+              class="scroll-item"
+              :style="`margin-left: ${index ? '24px' : ''};`"
+              v-for="(val, index) in tabList" :key="val.key"
+              @tap="handClickTab(index)"
+            >
+              <view>
+                <view class="text">{{ val.title }}</view>
+                <view v-if="index === tabIndex" class="choose" style="background-color: #fff;"></view>
+                <view v-else class="choose" style="background-color: #ffffff00;"></view>
+              </view>
+            </view>
+          </scroll-view>
+        </view>
+        <view v-if="listData?.length" class="listDataBox">
+          <uni-card v-for="val in listData" :key="val.id" @click="toDetail(val)" :is-shadow="true" :border='false' shadow="0px 0px 3px 1px rgba(0,0,0,0.1)">
+            <view class="d-flex align-center ss-m-30" @click="null">
+              <image class="enterAvatar" :src="val.logoUrl ? val.logoUrl : 'https://minio.citupro.com/dev/menduner/company-avatar.png'"></image>
+              <view class="ss-m-l-20" style="flex: 1;">
+                <view class="font-size-16 enterpriseName">{{ formatName(val.anotherName || val.name) }}</view>
+                <view class="ss-m-t-5">
+                  <span class="color-999">{{ val?.industryName || '' }}</span>
+                  <span class="divider tag-gap1" v-if="val?.industryName && val?.scaleName"> | </span>
+                  <span class="color-999">{{ val?.scaleName || '' }}</span>
+                </view>
+                <view class="ss-m-t-10" style="overflow: hidden;height: 48px;">
+                  <uni-tag 
+                    v-for="(tag,i) in val?.welfareList || []"
+                    :key="i"
+                    class="ss-m-r-5"
+                    :text="tag"
+                    inverted="false"
+                    size="mini"
+                    custom-style="background-color: #ececec; color: #666; border-color: #ececec; display: inline-block;"
+                  />
+                </view>
+              </view>
+            </view>
+            <view class="jobCount">{{ val.jobCount }}个在线职位招聘中</view>
+          </uni-card>
+          <uni-load-more :status="more" />
+        </view>
+        <view v-else class="nodata-img-parent white-bgc ss-m-30">
+          <image src="https://minio.citupro.com/dev/static/nodata.png" mode="widthFix" style="width: 100vw;height: 100vh;"></image>
+        </view>
+      </view>
+    </scroll-view>
+  </view>
+</template>
+
+<script setup>
+import { onLoad } from '@dcloudio/uni-app'
+import { ref, reactive } from 'vue'
+import { dealDictArrayData } from '@/utils/position'
+import { getJobFairEnterprisePage, getJobFair } from '@/api/jobFair'
+import { getWebContent } from '@/api/common'
+import SwiperAd from '@/components/SwiperAd'
+import { formatName } from '@/utils/getText'
+
+const more = ref('more')
+const listData = ref([])
+const query = reactive({
+  pageSize: 20, 
+  pageNo: 1,
+  jobFairId: undefined,
+})
+
+const entName = ref('')
+
+onLoad(async (options) => {
+  entName.value = options.entName
+  if (options?.jobFairId) {
+    query.jobFairId = options.jobFairId
+    getJobFairDetail()
+	}
+})
+
+// 获取轮播图
+const swiperAdList = ref([])
+const getSystemWebContent = async () => {
+  const { data } = await getWebContent()
+  swiperAdList.value = data?.appHomeCarousel || []
+}
+getSystemWebContent()
+
+// 招聘会详情
+const tabIndex = ref(-1)
+const tabList = ref([])
+const getJobFairDetail = async () => {
+  if (!query.jobFairId) return
+  const { data } = await getJobFair(query.jobFairId)
+  if (data?.tag?.length) {
+    tabList.value = data.tag
+    tabIndex.value = 0
+  }
+  getData()
+}
+getJobFairDetail()
+
+// 切换类型
+const handClickTab = (index) => {
+  tabIndex.value = index
+  query.pageNo = 1
+  listData.value = []
+  getData()
+}
+
+const getData = async () => {
+  if (!query.jobFairId) return
+  try {
+    const params = { ...query }
+    const positionIdValue = tabIndex.value !== -1 ? tabList.value[tabIndex.value]?.value : []
+    positionIdValue?.length && positionIdValue.forEach((value, index) => {
+      params[`industryId[${index}]`] = value
+    })
+    const res = await getJobFairEnterprisePage(params)
+    const list = res?.data?.list || []
+    listData.value = listData.value.concat(dealDictArrayData([], list))
+    if (listData.value?.length === +res?.data?.total) {
+      more.value = 'noMore'
+      return
+    }
+  } catch (error) {
+    query.pageNo--
+    more.value = 'more'
+  }
+}
+
+const scrollTop = ref(0)
+const old = ref({
+  scrollTop: 0
+})
+const onScroll = (e) =>{
+  old.value.scrollTop = e.detail.scrollTop
+}
+
+// 加载更多
+const loadingMore = () => {
+  more.value = 'loading'
+  query.pageNo++
+  getData()
+}
+
+const toDetail = (item) =>{
+  // if (!item?.id || !(item?.jobFairId ?? query.jobFairId)) return
+  // const url = `/pagesB/jobFair/positions?jobFairId=${query.jobFairId || item.jobFairId}&enterpriseId=${item.id}&entName=${item.anotherName}`
+  // uni.navigateTo({ url })
+}
+// const goBack = () => {
+// 	uni.navigateTo({
+// 		url: '/pagesB/jobFair/index'
+// 	})
+// }
+
+</script>
+
+<style scoped lang="scss">
+.stick {
+  z-index: 1;
+  position: sticky;
+  top: 0;
+  background-color: #5985dc;
+}
+.box {
+  height: 100vh;
+  overflow: hidden;
+  // padding-bottom: 120rpx;
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  background-color: #5985dc;
+}
+.listDataBox {
+  // padding: 1px 0 120rpx;
+  padding-bottom: 120rpx;
+  margin: 0 5rpx;
+  .enterpriseName {
+    color: #404040;
+    font-weight: 700;
+  }
+  .enterAvatar {
+    width: 60px;
+    height: 60px;
+    // border-radius: 50%;
+    margin: auto;
+  }
+  .jobCount {
+    height: 40px;
+    line-height: 40px;
+    color: #5985dc;
+    text-align: center;
+    font-size: 15px;
+    // background: linear-gradient(to right, #12ebb0, #7ec04c);
+    background: #F5F5F5;
+  }
+}
+.scrollBox{
+  flex: 1;
+  height: 0 !important;
+  padding-bottom: 24rpx;
+  box-sizing: border-box;
+}
+
+:deep(.uni-load-more__text) {
+  color: #fff !important;
+}
+
+:deep(.uni-card) {
+  padding: 0 !important;
+  .uni-card__content {
+    padding: 0 !important;
+  }
+}
+
+.scroll-container {
+  width: calc(100vw - 20px);
+  padding: 0 20rpx;
+  white-space: nowrap; /* 确保子元素在一行内排列 */
+  .scroll-item {
+    display: inline-block; /* 子元素内联块显示 */
+    color: #fff;
+    font-size: 17px;
+    font-weight: 500;
+    .text {
+      padding: 20px 2px 0;
+    }
+    .choose {
+      width: 28px;
+      height: 2px;
+      border-radius: 8px;
+      margin: 8px auto;
+    }
+  }
+}
+
+.titleBox {
+  text-align: center;
+  padding: 0 20rpx 15px;
+  .title {
+    font-size: 20px;
+    font-weight: 600;
+    margin-bottom: 12px;
+  }
+  .entName {
+    color: #fff;
+  }
+}
+</style>

+ 10 - 6
pagesB/jobFair/index.vue

@@ -32,12 +32,16 @@ const handleToJobFairEnterprises = (val) => {
   if (!val?.id) {
     uni.showToast({ title: '进去招聘会失败!', icon: 'none' })
   }
-	let text = val.title ? val.title.replace(/<[^>]+>/g, ' ') : '' // 去掉所有 HTML 标签
-	text = text ? text.replace(/\s+/g, ' ').trim() : '' // 去掉多余的空格
-	uni.navigateTo({
-		url: `/pagesB/jobFair/enterprises?jobFairId=${val.id}&jobFairName=${text}`
-		// url: `/pagesB/jobFair/positionClassification?jobFairId=${val.id}&jobFairName=${text}`
-	})
+  let url = `/pagesB/jobFair/${Number(val?.category) ? 'positionClassification': 'enterprisesClassification'}?jobFairId=${val.id}`
+  // const tagData = val?.tag?.length ? JSON.stringify(val.tag) : null
+  // if (tagData) url = url + `&tagData=${tagData}`
+  console.log('url:', url)
+	uni.navigateTo({url})
+	// let text = val.title ? val.title.replace(/<[^>]+>/g, ' ') : '' // 去掉所有 HTML 标签
+	// text = text ? text.replace(/\s+/g, ' ').trim() : '' // 去掉多余的空格
+	// uni.navigateTo({
+	// 	url: `/pagesB/jobFair/enterprises?jobFairId=${val.id}&jobFairName=${text}`
+	// })
 }
 
 </script>

+ 33 - 13
pagesB/jobFair/positionClassification.vue

@@ -15,8 +15,8 @@
               @tap="handClickTab(index)"
             >
               <view>
-                <view class="text">{{ val }}</view>
-                <view v-if="index === tab" class="choose" style="background-color: #fff;"></view>
+                <view class="text">{{ val.title }}</view>
+                <view v-if="index === tabIndex" class="choose" style="background-color: #fff;"></view>
                 <view v-else class="choose" style="background-color: #ffffff00;"></view>
               </view>
             </view>
@@ -33,7 +33,7 @@
           ></PositionList>
           <uni-load-more :status="more" />
         </view>
-        <view v-else class="nodata-img-parent">
+        <view v-else class="nodata-img-parent white-bgc ss-m-30">
           <image src="https://minio.citupro.com/dev/static/nodata.png" mode="widthFix" style="width: 100vw;height: 100vh;"></image>
         </view>
       </view>
@@ -45,7 +45,7 @@
 import { onLoad } from '@dcloudio/uni-app'
 import { ref, reactive } from 'vue'
 import { dealDictObjData } from '@/utils/position'
-import { getJobFairEntJobPage } from '@/api/jobFair'
+import { getJobFairEntJobPage, getJobFair } from '@/api/jobFair'
 import PositionList from '@/components/PositionList'
 import { getWebContent } from '@/api/common'
 import SwiperAd from '@/components/SwiperAd'
@@ -56,23 +56,16 @@ const query = reactive({
   pageSize: 20, 
   pageNo: 1,
   jobFairId: undefined,
-  enterpriseId: undefined,
 })
 
 const entName = ref('')
 
-const tab = ref(0)
-const tabList = ref(['餐饮招聘', '美业招聘', '酒店高层', '酒店中层', '酒店基层', '餐饮招聘', '美业招聘', '酒店高层', '酒店中层', '酒店基层1'])
-const handClickTab = (index) => {
-  tab.value = index
-}
-
 onLoad(async (options) => {
   entName.value = options.entName
   if (options?.jobFairId) {
     query.jobFairId = options.jobFairId
     query.enterpriseId = options.enterpriseId
-    getData()
+    getJobFairDetail()
 	}
 })
 
@@ -84,13 +77,40 @@ const getSystemWebContent = async () => {
 }
 getSystemWebContent()
 
+// 招聘会详情
+const tabIndex = ref(-1)
+const tabList = ref([])
+const getJobFairDetail = async () => {
+  if (!query.jobFairId) return
+  const { data } = await getJobFair(query.jobFairId)
+  if (data?.tag?.length) {
+    tabList.value = data.tag
+    tabIndex.value = 0
+  }
+  getData()
+}
+getJobFairDetail()
+
+// 切换类型
+const handClickTab = (index) => {
+  tabIndex.value = index
+  query.pageNo = 1
+  listData.value = []
+  getData()
+}
+
 const getData = async () => {
   if (!query.jobFairId) {
     uni.showToast({ title: '获取企业岗位失败,请重试!', icon: 'none', duration: 2000 })
     return
   }
   try {
-    const res = await getJobFairEntJobPage(query)
+    const params = { ...query }
+    const positionIdValue = tabIndex.value !== -1 ? tabList.value[tabIndex.value]?.value : []
+    positionIdValue?.length && positionIdValue.forEach((value, index) => {
+      params[`positionId[${index}]`] = value
+    })
+    const res = await getJobFairEntJobPage(params)
     const list = res?.data?.list || []
     list.forEach(e => {
       e.job = dealDictObjData({}, e)