Browse Source

招聘就业功能

Rockery 3 years ago
parent
commit
0561335ddc

+ 6 - 0
h5_web/pages.json

@@ -127,6 +127,12 @@
         "backgroundColor": "#2A322B",
         "navigationBarBackgroundColor": "#2A322B"
       }
+    }, {
+      "path": "pages/recruitment/recruitment",
+      "style": {
+        "navigationStyle": "custom",
+        "navigationBarTitleText": "招聘就业"
+      }
     }
   ],
   "globalStyle": {

+ 8 - 6
h5_web/pages/index/index.vue

@@ -1,5 +1,5 @@
 <template>
-	<view class="index content">
+	<view class="index">
     <view class="index-header">
       <view class="index-header-container">
         <view class="index-header-left"></view>
@@ -36,7 +36,7 @@
 					<image class="service-item-img" src="../../static/img/index-service-01.png" mode="aspectFill"></image>
 					<view class="service-item-text">政策资讯</view>
 				</view>
-				<view class="service-item" @click="openPage('pages/inbuild/inbuild','招聘就业')" >
+				<view class="service-item" @click="openPage('pages/recruitment/recruitment','招聘就业')" >
 					<image class="service-item-img" src="../../static/img/index-service-02.png" mode="aspectFill"></image>
 					<view class="service-item-text">招聘就业</view>
 				</view>
@@ -137,7 +137,8 @@
 				}
 				this.$u.api.getIndexNewsList(params)
 				.then(res=>{
-					if(res.code==200){
+          if(!res) return;
+					if(res?.code==200){
 						this.newsList = res.rows;
 					}else{
 						uni.showToast({
@@ -151,11 +152,12 @@
 			getBannerList(){
 				this.$u.api.getIndexBannerList()
 				.then(res=>{
-					this.bannerList = res.data;
+          if(!res) return;
+					this.bannerList = res?.data || [];
           this.bannerList = [];
           this.bannerList.push(
             {
-              bannerUrl: 'https://shadow.elemecdn.com/app/element/hamburger.9cf7b091-55e9-11e9-a976-7f4d0b07eef6.png',
+              bannerUrl: 'https://img.xiaopiu.com/userImages/img3072177d2e954f8.jpg',
               content: '<p>代码固定测试内容999998</p>',
               id: "999998",
               name: "代码固定测试999998"
@@ -163,7 +165,7 @@
           );
           this.bannerList.push(
             {
-              bannerUrl: 'https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg',
+              bannerUrl: 'https://img.xiaopiu.com/userImages/img14661769874c088.jpg',
               content: '<p>代码固定测试内容999999</p>',
               id: "999999",
               name: "代码固定测试999999"

+ 9 - 2
h5_web/pages/phoneLogin/phoneLogin.vue

@@ -7,7 +7,7 @@
     </view>
 		<view class="phonelogin-content">
 			<!-- <input class="u-border-bottom" type="number" maxlength="11" v-model="tel" placeholder="请输入手机号" /> -->
-      <u-input class="u-border-bottom phonelogin-content-input" v-model="tel" :type="number" maxlength="11" placeholder="请输入手机号" />
+      <u-input class="u-border-bottom phonelogin-content-input" v-model="tel" type="number" maxlength="11" placeholder="请输入手机号" />
 			<view class="u-text-center u-type-error u-m-t-20" v-if="telError">手机号输入错误</view>
 			<button @tap="submit" :style="[inputStyle]" class="phonelogin-content-getcaptcha">获取验证码</button>
 			<u-message-input v-if="show" :focus="true" :value="messageCode" @change="change" @finish="finish" mode="bottomLine" :maxlength="codelength" class="phonelogin-content-messageinput"></u-message-input>
@@ -264,7 +264,14 @@ export default {
 				url: "/pages/inbuild/inbuild",
 				// url: "/pages/privacyPolicy/privacyPolicy?termsType=" + flag,
 			})
-		}
+		},
+    // tabbar 返回
+    customBack() {
+      this.$u.route({
+        type: 'switchTab',
+        url: 'pages/index/index'
+      });
+    }
 	}
 };
 </script>

+ 234 - 0
h5_web/pages/recruitment/recruitment.vue

@@ -0,0 +1,234 @@
+<!-- 
+ * @title 招聘就业 
+ * @author Rockery(1113269755@qq.com)
+-->
+
+<template>
+	<view class="recruitment">
+    <u-navbar title-color="#FFFFFF" :bpay-bottom="false" back-icon-color="#FFFFFF" :background="{background: '#3D5D4C' }" title="招聘就业" class="recruitment-unavbar" />
+    
+    <!-- ###################################-- 轮播图 -- ################################### -->
+    <view class="recruitment-banner">
+      <u-swiper
+        :list="bannerList"
+        name="bannerUrl"
+        border-radius="0"
+        mode="round"
+        height="440"
+        img-mode="scaleToFill"
+        @click="swiperClick"
+      ></u-swiper>
+    </view>
+    
+    <!-- ###################################-- 请输入您关键词 -- ################################### -->
+    <view class="recruitment-usearch">
+       <u-search placeholder="请输入您关键词" v-model="headerTopKeyword" :show-action="false" bg-color="#FFFFFF"></u-search>
+    </view>
+    
+    <!-- ###################################-- 企业推荐 -- ################################### -->
+    <view class="u-card-wrap recruitment-recommend">
+    	<u-card :show-foot="false" class="recruitment-recommend-card">
+       <view slot="head">
+         <view class="recommend-card-head">
+            <view class="recommend-card-head-title">{{recommendConfigData.title}}</view>
+            <view class="recommend-card-head-subtitle" @tap="recommendCardMoreClick">
+              {{recommendConfigData.titlemore}}
+              <u-icon name="arrow-right" color="#A3A3A3" size="28"></u-icon>
+            </view>
+         </view>
+        </view>
+    		<view slot="body">
+          <view class="recommend-card-body">
+            <swiper
+            v-if="recommendListData&&recommendListData.length>0"
+            class="recommend-card-content" 
+            :display-multiple-items="5"
+            >
+              <swiper-item v-for="(item,index) in recommendListData" :key="index">
+                <view class="swiper-item" @tap="tapRecommendSwiperItem(item)" :data-id="item.id" :data-index="index">
+                  <image class="img" :src="item.img" mode="aspectFill"></image>
+                  <view class="subject">{{item.subject}}</view>
+                  <view class="post u-text-center">
+                    岗位
+                    <text class="postlink">{{item.postNumber}}</text>个
+                  </view>
+                </view>
+              </swiper-item>
+              <swiper-item v-if="recommendConfigData.listmore">
+                <view class="swiper-item lookmore" @tap="recommendCardMoreClick">
+                  <view class="moretext">查看更多</view>
+                </view>
+              </swiper-item>
+            </swiper>
+          </view>
+    		</view>
+    	</u-card>
+    </view>
+    
+    <view class="recruitment-dataarea">
+    	<u-tabs bg-color="transparent" :list="dataAreaTabsList" @change="dataAreaTabsChange" :current="dataAreaTabsCurrent" />
+      <view class="recruitment-dataarea-card">
+        <view class="">
+          djkhdsjkhsd
+        </view>
+        <view class="">
+          sjhjshs
+        </view>
+      </view>
+    </view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+        headerTopKeyword: '',
+				paginationConfig:{
+					  pageNo: 1,
+					  pageSize: 10
+				},
+				bannerList: [],
+        recommendListData:[
+        	{
+        		id:1,
+        		img:"https://img.xiaopiu.com/userImages/img88517697eccbd8.jpg",
+        		subject:"顺丰快递",
+            postNumber: 10
+        	},
+        	{
+        		id:2,
+        		img:"https://img.xiaopiu.com/userImages/img88317697ec8588.jpg",
+        		subject:"中国平安",
+            postNumber: 14
+        	},
+        	{
+        		id:3,
+        		img:"https://img.xiaopiu.com/userImages/img205717698ca4710.png",
+        		subject:"保利贵州",
+            postNumber: 8
+        	},
+        	{
+        		id:4,
+        		img:"https://img.xiaopiu.com/userImages/img87917697ec0c70.png",
+        		subject:"海大装饰",
+            postNumber: 18
+        	},
+        	{
+        		id:5,
+        		img:"https://img.xiaopiu.com/userImages/img87717697ebe178.jpg",
+        		subject:"永辉超市",
+            postNumber: 10
+        	},
+        	{
+        		id:5,
+        		img:"https://cube.elemecdn.com/6/94/4d3ea53c084bad6931a56d5158a48jpeg.jpeg",
+        		subject:"研发测试岗位",
+            postNumber: 99
+        	}
+        ],
+        recommendConfigData:{
+        	title:'企业推荐',
+        	titlemore:'更多',
+        	listmore: false
+        },
+        dataAreaTabsCurrent: 0,
+        dataAreaTabsList: [
+          {
+            name: '最新'
+          }, 
+          // {
+          //   name:  '附近',
+          //   count: 7
+          // }, {
+          //   name: '筛选'
+          // }
+        ]
+			}
+		},
+		onLoad() {
+			// console.log(this.$u.config.v);
+			
+		},
+		onShow() {
+			this.getBannerList();
+		},
+		methods: {
+			/**
+				 * 打开新页面
+				 * @param {String} path 跳转路径
+				 * */
+			openPage(path,msg) {
+			  this.$u.route({
+			    url: path,
+				params:{
+					msg:msg
+				}
+			  })
+			},
+			getBannerList(){
+				this.$u.api.getIndexBannerList()
+				.then(res=>{
+					this.bannerList = res.data;
+          this.bannerList = [];
+          this.bannerList.push(
+            {
+              bannerUrl: 'https://img.xiaopiu.com/userImages/img146217698746a98.jpg',
+              content: '<p>代码固定测试内容999997</p>',
+              id: "999997",
+              name: "代码固定测试999997"
+            }
+          );
+          this.bannerList.push(
+            {
+              bannerUrl: 'https://img.xiaopiu.com/userImages/img14641769874a530.png',
+              content: '<p>代码固定测试内容999998</p>',
+              id: "999998",
+              name: "代码固定测试999998"
+            }
+          );
+          this.bannerList.push(
+            {
+              bannerUrl: 'https://img.xiaopiu.com/userImages/img14661769874c088.jpg',
+              content: '<p>代码固定测试内容999999</p>',
+              id: "999999",
+              name: "代码固定测试999999"
+            }
+          );
+					console.log('bannerList',JSON.parse(JSON.stringify(res)));
+				})
+			},
+			// 轮播图点击
+			swiperClick (index) {
+				// console.log('swiperClick',index);
+				if(this.bannerList[index].jumpUrl){
+					let url = this.bannerList[index].jumpUrl.split('#')[1];
+					this.$u.route({
+						url: url,
+					});
+				}else{
+					this.$u.route({
+						url: 'pages/bannerDetails/bannerDetails',
+						params: {
+						  id: this.bannerList[index].id
+						}
+					})
+				}
+			},
+      recommendCardMoreClick(index) {
+        console.log("recommendCardMoreClick: ",index);
+      },
+      tapRecommendSwiperItem(param){
+        console.log("tapRecommendSwiperItem: ",param);
+      },
+      dataAreaTabsChange(index) {
+        console.log("dataAreaTabsChange: ",index);
+      	this.dataAreaTabsCurrent = index;
+      }
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+  @import './scss/recruitment.scss';
+</style>

+ 104 - 0
h5_web/pages/recruitment/scss/recruitment.scss

@@ -0,0 +1,104 @@
+page{background-color: #f2f2f2;}
+.recruitment{
+  &-unavbar{
+    ::v-deep .u-border-bottom:after {
+      border-bottom-width: 0 !important;
+    }
+  }
+  
+  &-usearch{
+    margin: 20rpx 30rpx;
+  }
+  
+  &-recommend{
+    &-card{
+      .recommend-card-head{
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: space-between;
+        
+        &-title{
+          font-size: 36rpx;
+          font-family: PingFangSC-Regular, PingFang SC;
+          font-weight: bold;
+          color: #000000;
+          line-height: 50rpx;
+          letter-spacing: 1px;
+        }
+        
+        &-subtitle{
+          font-size: 28rpx;
+          font-family: PingFangSC-Regular, PingFang SC;
+          font-weight: 400;
+          color: #A3A3A3;
+          line-height: 50rpx;
+          letter-spacing: 1px;
+        }
+      }
+      
+      .recommend-card-body{
+        .recommend-card-content{
+          .swiper-item{
+          	height: 101rpx;
+          	margin-right: 14rpx;
+            text-align: center;
+            
+            .img{
+            	width: 94rpx;
+            	height: 94rpx;
+              border-radius: 10rpx;
+            }
+            
+            .subject{
+              width: 100%;
+              text-align: center;
+              font-size: 24rpx;
+              font-family: PingFangSC-Regular, PingFang SC;
+              font-weight: bold;
+              color: #000000;
+              line-height: 33rpx;
+              letter-spacing: 1px;
+            }
+            
+            .post{
+              width: 100%;
+              font-size: 22rpx;
+              font-family: PingFangSC-Regular, PingFang SC;
+              font-weight: 400;
+              color: #6F6F6F;
+              line-height: 30rpx;
+              letter-spacing: 1px;
+              
+              .postlink{
+                color: $u-type-warning;
+              }
+            }
+          }
+          
+          .lookmore{
+          	background-color: #e2e2e2;
+          	text-align: center;
+          	line-height: 101rpx;
+            border-radius: 10rpx;
+            
+            .moretext{
+            	color: #777;
+            	font-size: 28rpx;
+            }
+          }
+        }
+      }
+    }
+  }
+  
+  &-dataarea{
+    padding: 0 30rpx;
+    
+    &-card{
+      margin-top: 20rpx;
+      width: 100%;
+      background-color: #FFFFFF;
+      border-radius: 10px;
+    }
+  }
+}