主页

App.vue

@@ -20,4 +20,9 @@
 
 <style>
 	/*每个页面公共css */
+	html,body{
+		margin: 0;
+		padding: 0;
+		font-family: 'PingFang Regular';
+	}
 </style>

assets/font/font.css

@@ -3,25 +3,21 @@
 	@font-face {
 	
 	    font-family: 'PingFang Regular';
-	
+	     src: url('PingFang Regular.ttf');
 		font-display:swap;
-		/* src: url('https://xpgj.xiaoxinda.com/prod/font/PingFang-Regular.woff2') format('woff2'),
-		     url('https://xpgj.xiaoxinda.com/prod/font/PingFang-Regular.woff') format('woff');
-	   */ font-weight: normal;
-	
+		font-weight: normal;
 	    font-style: normal;  
 	
 	  }
 	  
-	  @font-face {
-	  
-	      font-family: 'Alibaba-PuHuiTi-Regular';
-		/*  src:url('https://xpgj.xiaoxinda.com/prod/font/Alibaba-PuHuiTi-Regular.woff') format('woff'),
-		  url('https://xpgj.xiaoxinda.com/prod/font/Alibaba-PuHuiTi-Regular.woff2') format('woff2');
-	    */
-		  font-display:swap;
-	      font-weight: normal;
-	  
-	      font-style: normal;
-	  
-	    }
+	 @font-face {
+	 
+	     font-family: 'PingFang Medium';
+	 src: url('PingFang Medium.ttf');
+	 	font-display:swap;
+	 	font-weight: normal;
+	     font-style: normal;  
+	 
+	   }
+	   
+	  

components/Tabbar.vue

@@ -0,0 +1,123 @@
+<template >
+	<view>
+		<u-tabbar v-model="myCurrent" 	 :list="tabbarList" 
+		:before-switch="beforeSwitch" active-color="#2795FD" inactive-color="#B3BED1"  ></u-tabbar>
+		
+	</view>
+</template>
+
+<script>
+	
+    var img1=require('@/components/home-3-line.png')
+	var img2=require('@/components/home-3-fill.png')
+	var img3=require('@/components/todo-line.png')
+	var img4=require('@/components/todo-fill.png')
+	var img5=require('@/components/add-circle-line.png')
+	var img6=require('@/components/add-circle-fill.png')
+	var img7=require('@/components/user-search-line.png')
+	var img8=require('@/components/user-search-fill.png')
+	var img9=require('@/components/user-4-line.png')
+	var img10=require('@/components/user-4-fill.png')
+	
+ 	export default {
+		name:"tabbarJob",
+		props:{
+			current: 0,
+			elderStatus: false
+		},
+		data() {
+			return {
+				activeColor:"#1F4A99",
+				oldindex:this.current,
+				 myCurrent:this.current,
+				 tabbarList: [
+					 {
+					 
+				 		iconPath: img1,
+				 		selectedIconPath: img2,
+				 		text: '主页 ',
+						pagePath2:"/",
+						login:false,
+				 	},
+					{
+					 
+						iconPath: img3,
+						selectedIconPath: img4,
+						text: '招工 ',
+						pagePath2:"/pages/jobInformation/jobInformation",
+						login:false,
+					},
+					{
+					 
+						iconPath: img5,
+						selectedIconPath: img6,
+						text: '发布 ',
+						pagePath2:"/pages/issue/issue",
+						login:false,
+					},
+					{
+					 
+						iconPath: img7,
+						selectedIconPath: img8,
+						text: '找人 ',
+						pagePath2:"/pages/choreInformation/choreInformation",
+						login:false,
+					},
+					
+				 	{
+				 		iconPath:img9,
+				 		selectedIconPath: img10,
+				 		text: '我的',
+						login:true,
+						pagePath2:"/pages/mine/mine",
+				 	}
+			 ],
+			};
+			
+		},methods:{
+			setcount(c){
+				//this.myCurrent=c
+			},
+			beforeSwitch(index){
+			
+				var bl=false
+				
+				if(index==this.current){
+					
+					return false
+				}
+				//this.myCurrent=index
+				var url =this.tabbarList[index].pagePath2;
+				
+				if(this.tabbarList[index].login){
+					var userInfo=this.carhelp.getPersonInfo()
+					if(userInfo){
+						
+					}else{
+						url="/pages/login/index"
+						bl=true	
+					}
+					
+				}
+				uni.navigateTo({
+					url: url
+				})
+			
+				
+				
+			},
+			
+		},
+		mounted(){
+			
+		},destroyed(){
+			
+		}
+		
+		
+	}
+</script>
+
+<style>
+	 
+</style>

main.js

@@ -1,7 +1,7 @@
 import App from './App'
 import Vue from 'vue'
 import getOpenId from './apis/utils/init.js'
-
+import './assets/font/font.css'
 
 
 getOpenId.init()

pages.json

@@ -3,10 +3,49 @@
 		{
 			"path": "pages/index/index",
 			"style": {
-				"navigationBarTitleText": "uni-app"
+				"navigationBarTitleText": "荆开零工驿站",
+				// "navigationBarBackgroundColor": "#2795FD",
+				"navigationBarTextStyle": "white",
+				"navigationStyle": "custom"
 			}
 		}
-	],
+	    ,{
+            "path" : "pages/mine/mine",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "",
+                "enablePullDownRefresh": false
+            }
+            
+        }
+        ,{
+            "path" : "pages/jobInformation/jobInformation",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "",
+                "enablePullDownRefresh": false
+            }
+            
+        }
+        ,{
+            "path" : "pages/issue/issue",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "",
+                "enablePullDownRefresh": false
+            }
+            
+        }
+        ,{
+            "path" : "pages/choreInformation/choreInformation",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "",
+                "enablePullDownRefresh": false
+            }
+            
+        }
+    ],
 	"globalStyle": {
 		"navigationBarTextStyle": "black",
 		"navigationBarTitleText": "uni-app",
@@ -14,4 +53,4 @@
 		"backgroundColor": "#F8F8F8"
 	},
 	"uniIdRouter": {}
-}
+}

pages/choreInformation/choreInformation.vue

@@ -0,0 +1,28 @@
+<template>
+	<view>
+		零工信息
+		<tabbar  ref="mytabbar"
+		:current="3"></tabbar>
+	</view>
+</template>
+
+<script>
+	import tabbar from "../../components/Tabbar.vue"
+	export default {
+		components: {
+			tabbar
+		},
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style>
+
+</style>

pages/index/index.vue

@@ -1,53 +1,347 @@
 <template>
-	<view class="content">
-		<image class="logo" src="/static/logo.png"></image>
-		<view class="text-area">
-			<text class="title">{{title}}</text>
-			123
+	<view>
+		<u-navbar back-text="荆开零工驿站" :background="background" :back-text-style="backColor"></u-navbar>
+
+
+
+		<!-- 头部 -->
+		<view class="top">
+			<!-- 搜索框 -->
+			<view class="search">
+				<u-search placeholder="请输入找工关键字" v-model="keyword" :show-action="false"></u-search>
+			</view>
+
 		</view>
+		<!-- 幻灯片 -->
+		<view class="swiper">
+			<u-swiper :list="list"></u-swiper>
+
+		</view>
+		<!-- 功能区 -->
+		<view class="function">
+			<view class="function-item">
+				<view class="icon-box">
+
+					<view class="icon">
+						<img src="../../assets/img/projectGird1.png" alt="">
+
+					</view>
+
+				</view>
+				<view class="item-text">
+					共享用工
+				</view>
+			</view>
+			<view class="function-item">
+				<view class="icon-box icon-box2">
+
+					<view class="icon">
+						<img src="../../assets/img/riFill-heart-2-fill@1x.png" alt="">
+					</view>
+
+				</view>
+				<view class="item-text">
+					爱心服务
+				</view>
+			</view>
+			<view class="function-item">
+				<view class="icon-box icon-box3">
+
+					<view class="icon">
+						<img src="../../assets/img/riFill-contacts-book-2-fill@1x.png" alt="">
+					</view>
+
+				</view>
+				<view class="item-text">
+					零工信息
+				</view>
+			</view>
+			<view class="function-item">
+				<view class="icon-box icon-box4">
+
+					<view class="icon">
+						<img src="../../assets/img/riFill-newspaper-fill@1x.png" alt="">
+					</view>
+
+				</view>
+				<view class="item-text">
+					政策发布
+				</view>
+			</view>
+
+
+		</view>
+		
+		<!-- 标签 -->
+		<view class="tabs">
+			<view class="title">
+				<u-tabs bg-color="#F0F0F2" :list="tabList" :is-scroll="false" :current="current" @change="change"></u-tabs>
+			   <view class="more">
+			   	更多
+				<u-icon name="arrow-right"></u-icon>
+			   </view>
+			
+			</view>
+			<!-- 卡片 -->
+			<view class="classify-card">
+				<view class="item" v-for="item in 3">
+					<view class="content-1">
+						<!-- 职位 -->
+						<view class="position">
+							摄影助理
+						</view>
+						<!-- 薪水 -->
+						<view class="salary">
+							200元/天
+						</view>
+					</view>
+					<view class="content-2">
+						<!-- 标签 -->
+						<view class="tag">
+							<view class="tag-item">
+								个人
+							</view>
+							<view class="tag-item">
+								日结
+							</view>
+						</view>
+						<!-- 日期 -->
+						<view class="date">
+							2023-06-01
+						</view>
+					</view>
+					<view class="content-3">
+						<view class="issuer">
+							李先生
+						</view>
+						 <view class="address">
+						 	锦佳酒店
+						 </view>
+					</view>
+				</view>
+				
+			</view>
+			
+		</view>
+		<tabbar  ref="mytabbar"
+		:current="0"></tabbar>
 	</view>
+
+
+
 </template>
 
 <script>
+	import tabbar from "../../components/Tabbar.vue"
 	export default {
+		components: {
+			tabbar
+		},
 		data() {
 			return {
-				title: 'Hello'
+				keyword: '',
+				// 导航栏背景
+				background: {
+					backgroundColor: '#2795FD',
+				},
+				backColor: {
+					color: '#ffffff'
+				},
+				list: [{
+						image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
+					},
+					{
+						image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
+					},
+					{
+						image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
+					}
+				],
+					tabList: [{
+									name: '最新'
+								}, {
+									name: '日结'
+								}, {
+									name: '周结',
+									
+								},{
+									name:'月结'
+								}],
+								
+             current:0
 			}
 		},
 		onLoad() {
 
 		},
 		methods: {
-
+        change(index) {
+        				this.current = index;
+        			}
 		}
 	}
 </script>
-
 <style>
-	.content {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
+	page {
+		background: #F0F0F2;
+		padding-bottom: 50px;
+	}
+</style>
+<style scoped lang="scss">
+	/deep/.u-navbar {
+		.u-icon--right {
+			display: none !important;
+		}
 	}
 
-	.logo {
-		height: 200rpx;
-		width: 200rpx;
-		margin-top: 200rpx;
-		margin-left: auto;
-		margin-right: auto;
-		margin-bottom: 50rpx;
+	// 头部
+	.top {
+ 
+		// 搜索框
+		.search {
+			background-color: rgba(39, 149, 253, 1);
+			padding: 16rpx 32rpx;
+
+		}
+
 	}
 
-	.text-area {
+	// 功能区
+	.function {
+		background-color: #fff;
+		padding: 32rpx 46rpx;
 		display: flex;
-		justify-content: center;
+		justify-content: space-between;
+
+		.function-item {
+			display: flex;
+			flex-direction: column;
+			justify-content: center;
+			align-items: center;
+
+			.icon-box {
+				width: 96rpx;
+				height: 96rpx;
+				background-color: rgba(240, 233, 255, 1);
+				text-align: center;
+				border-radius: 999px;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+			}
+
+			.icon-box2 {
+				background-color: rgba(255, 234, 230, 1);
+			}
+
+			.icon-box3 {
+				background-color: rgba(227, 246, 255, 1);
+			}
+
+			.icon-box4 {
+				background-color: rgba(221, 247, 238, 1);
+			}
+
+			.icon {
+				width: 48rpx;
+				height: 48rpx;
+
+				img {
+					width: 48rpx;
+					height: 48rpx;
+				}
+			}
+
+			.item-text {
+				color: rgba(51, 51, 51, 1);
+				margin-top: 8rpx;
+				font-family: 'PingFang Medium';
+			}
+		}
 	}
 
-	.title {
-		font-size: 36rpx;
-		color: #8f8f94;
+// 标签
+.tabs{
+	margin-top: 32rpx;
+	.title{
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		padding: 0rpx 24rpx;
+		/deep/.u-tabs{
+			width: 400rpx;
+		}
+		.more{
+			color: rgba(119, 119, 119, 1);
+		}
 	}
-</style>
+	.classify-card{
+		background-color: #fff;
+		.item{
+			padding: 24rpx 0;
+			margin: 0 32rpx;
+			border-bottom: 1px solid #F0F0F2;
+			.content-1{
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				// 职位
+				.position{
+					color: rgba(16, 16, 16, 1);
+					font-size: 36rpx;
+					font-family: 'PingFang Medium';
+				}
+				// 薪水
+				.salary{
+					color: rgba(255, 61, 0, 1);
+					font-size: 32rpx;
+					font-family: 'PingFang Medium';
+				}
+			}
+		
+		    .content-2{
+				margin-top: 12rpx;
+				display: flex;
+				justify-content: space-between;
+				// 标签
+				.tag{
+					display: flex;
+					.tag-item{
+						width: 64rpx;
+						height: 36rpx;
+						line-height: 36rpx;
+						border-radius: 8rpx;
+						background-color: rgba(241, 241, 247, 1);
+						color: rgba(129, 127, 153, 1);
+						font-size: 24rpx;
+						text-align: center;
+						margin-right: 12rpx;
+					}
+				}
+				// 日期
+				.date{
+					color: rgba(153, 153, 153, 1);
+					font-size: 24rpx;
+				}
+			}
+		
+		    .content-3{
+				margin-top: 20rpx;
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				.issuer{
+					color: rgba(51, 51, 51, 1);
+					font-size: 24rpx;
+				}
+				.address{
+					color: rgba(51, 51, 51, 1);
+					font-size: 24rpx;
+				}
+			}
+		
+		}
+	}
+}
+
+</style>

pages/issue/issue.vue

@@ -0,0 +1,28 @@
+<template>
+	<view>
+		发布
+		<tabbar  ref="mytabbar"
+		:current="2"></tabbar>
+	</view>
+</template>
+
+<script>
+	import tabbar from "../../components/Tabbar.vue"
+	export default {
+		components: {
+			tabbar
+		},
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style>
+
+</style>

pages/jobInformation/jobInformation.vue

@@ -0,0 +1,28 @@
+<template>
+	<view>
+		用工信息
+		<tabbar  ref="mytabbar"
+		:current="1"></tabbar>
+	</view>
+</template>
+
+<script>
+	import tabbar from "../../components/Tabbar.vue"
+	export default {
+		components: {
+			tabbar
+		},
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style>
+
+</style>

pages/mine/mine.vue

@@ -0,0 +1,28 @@
+<template>
+	<view>
+		mine
+		<tabbar  ref="mytabbar"
+		:current="4"></tabbar>
+	</view>
+</template>
+
+<script>
+	import tabbar from "../../components/Tabbar.vue"
+	export default {
+		components: {
+			tabbar
+		},
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style>
+
+</style>