diff --git a/components/navbar.vue b/components/navbar.vue
new file mode 100644
index 0000000..f53a6fe
--- /dev/null
+++ b/components/navbar.vue
@@ -0,0 +1,171 @@
+<template>
+	<view class="navbar" :style="{height:statusBarHeight+navBareight +'px'}"> <!-- 如若不写 高度始终为44 没有找到原因 -->
+		<view class="narbar-flexd">
+			<view :style="{height:statusBarHeight+'px',background:''}"></view>
+			<view :class="isCenter?'narbar-content':'isCenter'" :style="{height:navBareight+'px'}" >
+				
+				<!-- 左侧返回按钮 -->
+				<view class="left" @click="onBack" v-if="back&&toIndex" :style="[{color},{paddingTop}]">
+					<u-icon name="arrow-left" size="20"></u-icon>
+					<!-- <uni-icons type="arrowleft" size="25" :color='color' ></uni-icons> -->
+					<!-- <u--image :showLoading="true" src="https://bsl-lj-rent.oss-cn-shanghai.aliyuncs.com/idn-mac/indexs/lianxi.png" width="60rpx" height="71rpx" @click="click"></u--image> -->
+				</view>
+				<!-- 不去扫码返回按钮 -->
+				<view class="left" @click="onBackIndex" v-if="back&&!toIndex" :style="[{color},{paddingTop}]">
+					<u-icon name="arrow-left" size="20"></u-icon>
+					<!-- <uni-icons type="arrowleft" size="25" :color='color' ></uni-icons> -->
+					<!-- <u--image :showLoading="true" src="https://bsl-lj-rent.oss-cn-shanghai.aliyuncs.com/idn-mac/indexs/lianxi.png" width="60rpx" height="71rpx" @click="click"></u--image> -->
+				</view>
+				<view class="title">
+					{{title}}
+				</view>
+			</view>
+		</view>
+		<view class="navHeight" :style="{height:statusBarHeight+navBareight +'px'}"></view>
+	</view>
+</template>
+ 
+<script>
+	export default {
+		data() {
+			return {
+				statusBarHeight:20,
+				navBareight: 45,
+				windowWidth: 375,
+			};
+		},
+		props:{
+			title:{ // 标题文字(默认为空)
+				type:String,
+				default:'#fff'
+			},
+			toIndex:{
+				type:Boolean,
+				default:true
+			},
+			color:{ // 标题和返回按钮颜色(默认白色)
+				type:String,
+				default:'#222'
+			},
+		    //建议使用background  因为使用backgroundColor，会导致不识别渐变颜色
+			background:{ // 背景颜色(不传值默认透明)
+				type:String,
+				default:'transparent'
+			},
+			back:{ // 是否显示返回按钮(不传值默认不显示)
+				type:Boolean,
+				default:false
+			},
+			isCenter:{//是否中间
+				type:Boolean,
+				default:true
+			}
+		},
+		
+		created() {
+			//获取手机系统信息 -- 状态栏高度
+			let {
+				statusBarHeight,
+				windowWidth
+			} = uni.getSystemInfoSync()
+			this.statusBarHeight = statusBarHeight
+			this.windowWidth = windowWidth
+			//去除
+			//#ifndef H5 || MP-ALIPAY ||APP-PLUS
+			//获取小程序胶囊的高度
+			let {
+				top,
+				bottom,
+				left
+			} = uni.getMenuButtonBoundingClientRect()
+			//高度 =（胶囊底部高低-状态栏高度）+（胶囊顶部高度-状态栏内的高度）
+			this.navBareight = (bottom - statusBarHeight) + (top - statusBarHeight)
+			this.windowWidth = left
+			//#endif
+		},
+		
+		methods: {
+			// 左侧返回按钮调用
+			onBack() {
+				this.$emit("onBack");
+				uni.navigateBack({
+						delta:1,//返回层数，2则上上页
+			    })
+				
+			},
+			onBackIndex(){
+				uni.switchTab({
+					url:'/pages/index/index'
+				})
+			}
+		}
+		
+	}
+</script>
+ 
+<style lang="scss">
+	.navbar {
+		background-color: #19B459;
+		// background-image: url('https://bsl-lj-rent.oss-cn-shanghai.aliyuncs.com/idn-mac/index/90.png') !important;
+		// background-size: 100% 100% !important;
+		.narbar-flexd {
+			// background-image: url('https://bsl-lj-rent.oss-cn-shanghai.aliyuncs.com/idn-mac/index/90.png') !important;
+			background-size: 100% 100% !important;
+			position: fixed;
+			top: 0;
+			left: 0;
+			z-index: 99;
+			width: 100%;
+			// padding-bottom: 10rpx;
+			.narbar-content {
+				// height: 45px;
+				padding: 0 24upx;
+				// margin-bottom: 10px;
+				display: flex;
+				box-sizing: border-box;
+				justify-content:center;
+				align-items: center;
+				background-color: #19B459;
+				
+				.left{
+					position: absolute;
+					left: 5%;
+					font-weight: 600;
+				}
+				.title{
+					font-size: 36rpx;
+					font-family: PingFang SC;
+					font-weight: 500;
+					color: #ffffff;
+				}
+				
+			}
+			.isCenter{
+				// height: 45px;
+				padding: 0 24upx;
+				// margin-bottom: 10px;
+				display: flex;
+				box-sizing: border-box;
+				justify-content:flex-start;
+				align-items: center;
+				.left{
+					position: absolute;
+					left: 5%;
+					font-weight: 600;
+				}
+				.title{
+					font-size: 36rpx;
+					font-family: PingFang SC;
+					font-weight: 500;
+					color: #222222;
+				}
+				
+			}
+ 
+			
+		}
+		.navHeight {
+			height: 60px;
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/components/page/banner/index.vue b/components/page/banner/index.vue
index 80000bc..379c325 100644
--- a/components/page/banner/index.vue
+++ b/components/page/banner/index.vue
@@ -14,11 +14,12 @@
   </view> -->
   <!-- 新的 -->
   <view class="outerContainer">
+	  <image src="../../../static/indexBg.png" mode="widthFix" class="indexBg"></image>
 		<view class="diy-banner">
 		  <!-- 图片轮播 -->
 		  <swiper class="swiper-box" :autoplay="autoplay" :duration="duration" :circular="true" :interval="itemStyle.interval * 1000" @change="_bindChange">
 		    <swiper-item v-for="(dataItem, index) in dataList" :key="index">
-		      <image mode="widthFix" class="slide-image" :src="dataItem.imgUrl" @click="onLink(dataItem.link)"/>
+		      <image mode="aspectFill" class="slide-image" :src="dataItem.imgUrl" @click="onLink(dataItem.link)"/>
 		    </swiper-item>
 		  </swiper>
 		  <!-- 指示点 -->
@@ -106,9 +107,20 @@
 
 <style lang="scss" scoped>
 	.outerContainer{
-		background: #19B459;
-		padding:0 24rpx;
+		// background: #19B459;
+		// padding:0 24rpx;
 		padding-top: 26rpx;
+		position: relative;
+		.indexBg{
+			
+			width:100%;
+			height:auto;
+			position: absolute;
+			top:0;
+			left:0;
+			z-index:1;
+			
+		}
 	}
   .diy-banner {
 	position: relative;
@@ -116,12 +128,14 @@
 	background: #E3E5E7;
 	border-radius: 20rpx;
 	overflow: hidden;
-	margin-top: 26rpx;
-
+	
+	position: relative;
+	z-index:2;
+	margin:0 24rpx;
+	// padding-top: 26rpx;
     // swiper组件
     .swiper-box {
       height: 100%;
-
       .slide-image {
         width: 100%;
         height: 100%;
diff --git a/pages.json b/pages.json
index 7e9467c..22b69f9 100644
--- a/pages.json
+++ b/pages.json
@@ -36,7 +36,8 @@
         {
             "path" : "pages/index/index",
             "style" : {
-                "enablePullDownRefresh" : true
+                "enablePullDownRefresh" : true,
+				"navigationStyle": "custom"
             }
         },
         {
diff --git a/pages/index/index.vue b/pages/index/index.vue
index 834d619..2c6304c 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -1,5 +1,6 @@
 <template>
   <view class="container">
+	  <navbar title="首页" :isCenter="true"></navbar>
     <!-- 店铺页面组件 -->
     <Page :items="items" />
   </view>
@@ -9,12 +10,14 @@
   import { setCartTabBadge } from '@/core/app'
   import * as Api from '@/api/page'
   import Page from '@/components/page'
+  import navbar from '@/components/navbar.vue'
 
   const App = getApp()
 
   export default {
     components: {
-      Page
+      Page,
+	  navbar
     },
     data() {
       return {
diff --git a/static/indexBg.png b/static/indexBg.png
new file mode 100644
index 0000000..51785af
Binary files /dev/null and b/static/indexBg.png differ