职位&企业搜索：默认数据展示

components.d.ts

@@ -53,7 +53,7 @@ declare module 'vue' {
     LongCompany: typeof import('./src/components/Position/longCompany.vue')['default']
     LongStrip: typeof import('./src/components/Position/longStrip.vue')['default']
     NestedListGroup: typeof import('./src/components/FormUI/nestedListGroup/index.vue')['default']
-    Pay: typeof import('./src/components/personalRecharge/pay.vue')['default']
+    Pay: typeof import('./src/components/pay/index.vue')['default']
     PersonalRecharge: typeof import('./src/components/personalRecharge/index.vue')['default']
     PreviewImage: typeof import('./src/components/PreviewImg/previewImage.vue')['default']
     PreviewImg: typeof import('./src/components/PreviewImg/index.vue')['default']

src/styles/recruit/position/index.css

@@ -1,6 +1,6 @@
 .banner {
   background-color: #fff;
-  padding: 18px 0 20px;
+  padding: 0 0 20px;
 }
 
 .banner-title {

src/styles/recruit/position/index.min.css

@@ -1 +1 @@
-.banner{background-color:#fff;padding:18px 0 20px}.banner-title{line-height:40px;font-size:28px;font-weight:600}.banner-title h1{display:inline-block;color:#0E100F;font-size:28px;margin-right:30px;margin-top:1px;vertical-align:middle}.button-item{min-width:110px;height:36px}.salary{min-width:100px;color:var(--v-primary-base);line-height:41px;font-weight:600;height:auto;display:inline-block;vertical-align:sub}.refresh-time{color:var(--color-666);font-size:14px;text-align:right;line-height:32px}.banner-tags span{font-weight:600}.radius{border-radius:8px}.content-left{width:810px;padding:20px 20px}.content-right{flex:1;padding:20px 20px 20px 0}.label-text{color:#7f7a7a;font-weight:600}.value-text{color:#000;font-weight:400}.requirement{white-space:pre-wrap;word-break:break-all;line-height:28px;color:var(--color-333);font-size:15px;text-align:justify;letter-spacing:0}.contact{height:60px;line-height:60px}.contact-name{font-size:20px;font-weight:500;color:var(--color-222);line-height:28px}.contact-info{font-size:15px;color:var(--color-666);line-height:21px;margin-top:8px}
+.banner{background-color:#fff;padding:0 0 20px}.banner-title{line-height:40px;font-size:28px;font-weight:600}.banner-title h1{display:inline-block;color:#0E100F;font-size:28px;margin-top:1px;vertical-align:middle}.button-item{min-width:110px;height:36px}.salary{min-width:100px;color:var(--v-primary-base);line-height:41px;font-weight:600;height:auto;display:inline-block;vertical-align:sub}.refresh-time{color:var(--color-666);font-size:14px;text-align:right;line-height:32px}.banner-tags span{font-weight:600}.radius{border-radius:8px}.content-left{width:810px;padding:20px 20px}.content-right{flex:1;padding:20px 20px 20px 0}.label-text{color:#7f7a7a;font-weight:600}.value-text{color:#000;font-weight:400}.requirement{white-space:pre-wrap;word-break:break-all;line-height:28px;color:var(--color-333);font-size:15px;text-align:justify;letter-spacing:0}.contact{height:60px;line-height:60px}.contact-name{font-size:20px;font-weight:500;color:var(--color-222);line-height:28px}.contact-info{font-size:15px;color:var(--color-666);line-height:21px;margin-top:8px}

src/styles/recruit/position/index.scss

@@ -1,6 +1,6 @@
 .banner {
   background-color: #fff;
-  padding: 18px 0 20px;
+  padding: 0 0 20px;
 }
 .banner-title {
   line-height: 40px;

src/views/recruit/personal/company/index.vue

@@ -14,13 +14,13 @@
       <div v-if="items.length" class="mx-4">
         <companyItem class="mt-3" :list="items"></companyItem>
         <CtPagination
-          v-if="total > 0"
+          v-if="noParams ? false : total > 0"
           :total="total"
           :page="pages.pageNo"
           :limit="pages.pageSize"
           @handleChange="handleChangePage"
         ></CtPagination>
-        <!-- <div class="text-center color-primary mt-5" v-if="noParams">输入筛选条件查看更多优选企业</div> -->
+        <div class="text-center color-primary mt-5" v-if="noParams">输入筛选条件查看更多优选企业</div>
       </div>
       <Empty v-else class="mt-3 mx-4" :message="noParams? '请输入或选择对应的条件查找公司' : '没有对应的公司，请更换搜索条件后再试'"></Empty>
     </div>
@@ -77,7 +77,6 @@ const handleSearch = async (val, key) => {
   pages.value.pageNo = 1
   query.value[key] = val
   dealRouteQuery(query.value)
-  // await getCompanyData()
 }
 
 const inputChange = async({ idName: key, values }) => { // areaIds
@@ -89,7 +88,6 @@ const inputChange = async({ idName: key, values }) => { // areaIds
   }
   pages.value.pageNo = 1
   dealRouteQuery(query.value)
-  // await getCompanyData()
 }
 
 const getDataFun = async (params) => {
@@ -119,7 +117,7 @@ const getCompanyData = async () => {
   if (noParams.value === true) {
     items.value = []
     total.value = 0
-    // getDataFun(pages.value) // 没有筛选条件则展示最新企业列表
+    getDataFun(pages.value) // 没有筛选条件则展示最新企业列表
     return
   }
   const params = { ...query.value, ...pages.value }

src/views/recruit/personal/companyDetail/index.vue

@@ -1,31 +1,33 @@
 <template>
   <div class="default-width banner px-6">
     <div v-if="Object.keys(info).length && info.enterprise && Object.keys(info.enterprise).length > 0">
-      <div class="banner-title pt-3" v-if="Object.keys(info).length">
-        <div class="float-left d-flex align-center">
-          <v-img width="60" height="60" :src="info.enterprise.logoUrl || 'https://minio.citupro.com/dev/menduner/company-avatar.png'" contain rounded></v-img>
-          <div class="ml-4">
-            <div class="contact-name">{{ formatName(info.enterprise.anotherName || info.enterprise.name) }}</div>
-            <div class="contact-info">
-              {{ info.scaleName }}
-              <span v-if="info.industryName && info.scaleName">·</span> 
-              {{ info.industryName }}
+      <div class="sticky">
+        <div class="banner-title pt-3" v-if="Object.keys(info).length">
+          <div class="float-left d-flex align-center">
+            <v-img width="60" height="60" :src="info.enterprise.logoUrl || 'https://minio.citupro.com/dev/menduner/company-avatar.png'" contain rounded></v-img>
+            <div class="ml-4">
+              <div class="contact-name">{{ formatName(info.enterprise.anotherName || info.enterprise.name) }}</div>
+              <div class="contact-info">
+                {{ info.scaleName }}
+                <span v-if="info.industryName && info.scaleName">·</span> 
+                {{ info.industryName }}
+              </div>
             </div>
           </div>
+          <div class="float-right d-flex">
+            <v-btn color="primary" variant="text" size="large" @click.stop="handleReturn" prepend-icon="mdi-chevron-triple-left">返回上一页</v-btn>
+          </div>
         </div>
-        <div class="float-right d-flex">
-          <v-btn color="primary" variant="text" size="large" @click.stop="handleReturn" prepend-icon="mdi-chevron-triple-left">返回上一页</v-btn>
+        <div class="text-end mb-3">
+          <v-tooltip location="bottom">
+            <template v-slot:activator="{ props }">
+              <v-icon v-bind="props" class="ml-5 mr-2" size="25" :color="isCollection ? 'error' : ''" @click.stop="handleFollow">{{ isCollection ? 'mdi-heart' : 'mdi-heart-outline' }}</v-icon>
+            </template>
+            <span>关注该企业</span>
+          </v-tooltip>
         </div>
+        <v-divider></v-divider>
       </div>
-      <div class="text-end mb-3">
-        <v-tooltip location="bottom">
-          <template v-slot:activator="{ props }">
-            <v-icon v-bind="props" class="ml-5 mr-2" size="25" :color="isCollection ? 'error' : ''" @click.stop="handleFollow">{{ isCollection ? 'mdi-heart' : 'mdi-heart-outline' }}</v-icon>
-          </template>
-          <span>关注该企业</span>
-        </v-tooltip>
-      </div>
-      <v-divider></v-divider>
       <div class="mt-3">
         <v-tabs v-model="tab" align-tabs="start" color="primary" bg-color="#f3f3f3" @update:model-value="handleTabClick">
           <v-tab :value="1">公司简介</v-tab>
@@ -172,6 +174,12 @@ const loginClose = () => {
   padding: 0 0 20px;
   min-height: 60vh;
 }
+.sticky {
+  position: sticky;
+  top: 50px;
+  background-color: #fff;
+  z-index: 1;
+}
 .banner-title {
   display: flex;
   align-items: center;

src/views/recruit/personal/position/components/details.vue

@@ -1,51 +1,53 @@
 <template>
   <div style="position: relative;">
     <div class="banner px-6" id="share" :class="{'default-width': defaultWidth}">
-      <div class="banner-title d-flex justify-space-between align-center">
-        <div class="d-flex align-center justify-between">
-          <svg-icon v-if="info?.hire" class="mr-5" name="pin" size="50"></svg-icon>
-          <svg-icon v-if="jobFairId" name="jobFair" class="mr-1" size="35"></svg-icon>
-          <h1>{{ formatName(info.name) }}</h1>
+      <div class="sticky">
+        <div class="banner-title d-flex justify-space-between align-center pt-5">
+          <div class="d-flex align-center justify-between">
+            <svg-icon v-if="info?.hire" class="mr-5" name="pin" size="50"></svg-icon>
+            <svg-icon v-if="jobFairId" name="jobFair" class="mr-1" size="35"></svg-icon>
+            <h1>{{ formatName(info.name) }}</h1>
+          </div>
+          <v-btn v-if="showContentRight && !jobFairId" color="primary" variant="text" size="large" @click.stop="handleReturn" prepend-icon="mdi-chevron-triple-left">返回上一页</v-btn>
         </div>
-        <v-btn v-if="showContentRight && !jobFairId" color="primary" variant="text" size="large" @click.stop="handleReturn" prepend-icon="mdi-chevron-triple-left">返回上一页</v-btn>
-      </div>
-      <div class="d-flex mt-1 justify-space-between align-center">
-        <div class="banner-tags">
-          <span v-for="k in desc" :key="k.mdi">
-            <span v-if="positionInfo[k.value] || k.value === 'areaName'" class="mr-10">
-              <v-icon color="var(--color-666)" size="20">{{ k.mdi }}</v-icon>
-              <span class="ml-1">
-                {{ k.value === 'areaName' ? !positionInfo.areaId ? '全国' : positionInfo.area?.str : positionInfo[k.value] }}
+        <div class="d-flex mt-1 justify-space-between align-center">
+          <div class="banner-tags">
+            <span v-for="k in desc" :key="k.mdi">
+              <span v-if="positionInfo[k.value] || k.value === 'areaName'" class="mr-10">
+                <v-icon color="var(--color-666)" size="20">{{ k.mdi }}</v-icon>
+                <span class="ml-1">
+                  {{ k.value === 'areaName' ? !positionInfo.areaId ? '全国' : positionInfo.area?.str : positionInfo[k.value] }}
+                </span>
               </span>
             </span>
-          </span>
+          </div>
+          <div>
+            <span v-if="!info.payFrom && !info.payTo" class="salary font-size-20 text-end">面议</span>
+            <span v-else class="salary font-size-20">{{ info.payFrom ? info.payFrom + '-' : ''}}{{ info.payTo }}{{ positionInfo.payName ? '/' + positionInfo.payName : '' }}</span>
+          </div>
         </div>
-        <div>
-          <span v-if="!info.payFrom && !info.payTo" class="salary font-size-20 text-end">面议</span>
-          <span v-else class="salary font-size-20">{{ info.payFrom ? info.payFrom + '-' : ''}}{{ info.payTo }}{{ positionInfo.payName ? '/' + positionInfo.payName : '' }}</span>
+        <div class="refresh-time text-end">{{ timesTampChange(info.refreshTime || info.updateTime) }} {{ $t('common.refresh') }} <v-icon color="primary" size="20">mdi-circle-medium</v-icon></div>
+        <div class="banner-tools my-4">
+          <v-chip size="small" label v-for="(k, i) in info.tagList" :key="i" class="mr-1" color="primary">{{ k }}</v-chip>
         </div>
-      </div>
-      <div class="refresh-time text-end">{{ timesTampChange(info.refreshTime || info.updateTime) }} {{ $t('common.refresh') }} <v-icon color="primary" size="20">mdi-circle-medium</v-icon></div>
-      <div class="banner-tools my-4">
-        <v-chip size="small" label v-for="(k, i) in info.tagList" :key="i" class="mr-1" color="primary">{{ k }}</v-chip>
-      </div>
-      <div class="d-flex justify-space-between mb-5">
-        <div>
+        <div class="d-flex justify-space-between mb-5">
           <div>
-            <v-chip v-if="info.hire && info.hirePrice && info.hirePrice > 0" label color="primary">赏金：{{ commissionCalculation(info.hirePrice / 100, 1) }}元</v-chip>
-            <v-chip v-if="info.hire && info.hirePoint && info.hirePoint > 0" label color="primary" class="ml-1">积分：{{ commissionCalculation(info.hirePoint / 100, 1) }}点</v-chip>
+            <div>
+              <v-chip v-if="info.hire && info.hirePrice && info.hirePrice > 0" label color="primary">赏金：{{ commissionCalculation(info.hirePrice / 100, 1) }}元</v-chip>
+              <v-chip v-if="info.hire && info.hirePoint && info.hirePoint > 0" label color="primary" class="ml-1">积分：{{ commissionCalculation(info.hirePoint / 100, 1) }}点</v-chip>
+            </div>
+            <div v-if="info?.hire" class="font-size-14 mt-3 color-error">推荐好友入职成功即可获得赏金</div>
+          </div>
+          <div class="banner-tools-btns" v-if="props.showOperateBtn">
+            <v-btn v-if="info?.hire" class="radius mr-2 button-item" variant="outlined" color="error" prepend-icon="mdi-share-outline" @click="handleShare">我要赏金</v-btn>
+            <v-btn v-else class="radius mr-2 button-item" variant="outlined" color="error" prepend-icon="mdi-share-outline" @click="handleShare">{{ $t('position.rewardsShared') }}</v-btn>
+            <v-btn class="button-item radius" color="warning" variant="outlined" :prepend-icon="isCollection ? 'mdi-heart' : 'mdi-heart-outline'" @click="handleCollection">{{ isCollection ? $t('position.cancelFavorite') : $t('position.collection') }}</v-btn>
+            <v-btn class="button-item mx-2 radius" color="success" variant="outlined" @click="toDetails(info)">{{ $t('position.communicate') }}</v-btn>
+            <v-btn class="button-item radius" :disabled="delivery" color="primary" variant="outlined" @click="handleDelivery">{{ delivery ? $t('position.delivered') : $t('position.submitResume') }}</v-btn>
           </div>
-          <div v-if="info?.hire" class="font-size-14 mt-3 color-error">推荐好友入职成功即可获得赏金</div>
-        </div>
-        <div class="banner-tools-btns" v-if="props.showOperateBtn">
-          <v-btn v-if="info?.hire" class="radius mr-2 button-item" variant="outlined" color="error" prepend-icon="mdi-share-outline" @click="handleShare">我要赏金</v-btn>
-          <v-btn v-else class="radius mr-2 button-item" variant="outlined" color="error" prepend-icon="mdi-share-outline" @click="handleShare">{{ $t('position.rewardsShared') }}</v-btn>
-          <v-btn class="button-item radius" color="warning" variant="outlined" :prepend-icon="isCollection ? 'mdi-heart' : 'mdi-heart-outline'" @click="handleCollection">{{ isCollection ? $t('position.cancelFavorite') : $t('position.collection') }}</v-btn>
-          <v-btn class="button-item mx-2 radius" color="success" variant="outlined" @click="toDetails(info)">{{ $t('position.communicate') }}</v-btn>
-          <v-btn class="button-item radius" :disabled="delivery" color="primary" variant="outlined" @click="handleDelivery">{{ delivery ? $t('position.delivered') : $t('position.submitResume') }}</v-btn>
         </div>
+        <v-divider></v-divider>
       </div>
-      <v-divider></v-divider>
       <div class="d-flex">
           <div class="content-left">
             <div v-if="Object.keys(info).length">
@@ -549,5 +551,12 @@ const toDetails = async (info) => {
 </script>
 
 <style lang="scss" scoped>
+.sticky {
+  position: sticky;
+  top: 50px;
+  background-color: #fff;
+  z-index: 1;
+}
+
 @import '@/styles/recruit/position/index.scss'
 </style>

src/views/recruit/personal/position/index.vue

@@ -17,15 +17,15 @@
     </div>
       <div class="mt-3 mx-4">
         <Empty v-if="!items?.length" :message="noParams? '请输入或选择对应的条件查找职位' : '没有相关的职位，请更换搜索条件后再试'"></Empty>
-        <PositionLongStrip v-else :items="items"></PositionLongStrip>
+        <PositionLongStrip v-else :items="items" />
         <CtPagination
-          v-if="total > 0"
+          v-if="noParams ? false : total > 0"
           :total="total"
           :page="pageInfo.pageNo"
           :limit="pageInfo.pageSize"
           @handleChange="handleChangePage"
         ></CtPagination>
-        <!-- <div class="text-center color-primary mt-5" v-if="noParams && items.length">输入筛选条件查看更多优选职位</div> -->
+        <div class="text-center color-primary mt-5" v-if="noParams && items.length">输入筛选条件查看更多优选职位</div>
       </div>
     </div>
   </div>
@@ -98,7 +98,7 @@ const getData = async () => {
     noParams.value = true
     items.value = []
     total.value = 0
-    // getDataFun(pageInfo) // 没有筛选条件则展示最新职位列表
+    getDataFun(pageInfo) // 没有筛选条件则展示最新职位列表
     return
   }
   pageReqVO = { ...pageReqVO, ...routerParams }
@@ -123,7 +123,6 @@ const updateRouter = () => {
   if (query?.content && query.content.includes('%')) query.content = decodeURIComponent(query.content)
   router.push({ path: route.path, query })
   pageInfo.pageNo = 1
-  // getData()
 }
 
 // 参数改变