diff --git a/pages/index/childComps/HomeHeader.vue b/pages/index/childComps/HomeHeader.vue
index e4b5465..6a3e041 100644
--- a/pages/index/childComps/HomeHeader.vue
+++ b/pages/index/childComps/HomeHeader.vue
@@ -27,21 +27,36 @@
 	export default{
 		name: "HomeHeader",
 		props: {
-			
+			hotSearchWord:{
+				type: String,
+				default() {
+					return '热门关键词'
+				}
+			},
+			headerBgList:{
+				type: Array,
+				default() {
+				    return ["https://alifei01.cfp.cn/creative/vcg/800/new/VCG41175510742.jpg","https://alifei01.cfp.cn/creative/vcg/800/new/VCG41175510742.jpg"]
+				}
+			},
+			position:{
+				type: String,
+				default() {
+					return '定位中'
+				}
+			}
 		},
 		data() {
 			return {
-				hotSearchWord:'热门关键词',
-				headerBgList:["https://alifei01.cfp.cn/creative/vcg/800/new/VCG41175510742.jpg"]
+				// hotSearchWord:'',
+				// headerBgList:[]
 			}
 		},
 		options: {
 			styleIsolation: 'shared' // 解除样式隔离
 		},
 		computed:{
-			position(){
-				return  '定位中...'
-			}
+			
 		}
 	}
 </script>
diff --git a/pages/index/index.vue b/pages/index/index.vue
index 5626c1d..e70bd26 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -1,18 +1,65 @@
 <template>
-	<home-header></home-header>
+	<view class="base-bg-color">
+		<home-header></home-header>
+		<view class="nav-card">
+			<u-grid :col="4">
+					<u-grid-item>
+						<u-icon name="photo" :size="30"></u-icon>
+						<view class="grid-text">图片</view>
+					</u-grid-item>
+					<u-grid-item>
+						<u-icon name="lock" :size="30"></u-icon>
+						<view class="grid-text">锁头</view>
+					</u-grid-item>
+					<u-grid-item>
+						<u-icon name="hourglass" :size="30"></u-icon>
+						<view class="grid-text">沙漏</view>
+					</u-grid-item>
+					<u-grid-item>
+						<u-icon name="hourglass" :size="30"></u-icon>
+						<view class="grid-text">沙漏</view>
+					</u-grid-item>
+					<u-grid-item>
+						<u-icon name="photo" :size="30"></u-icon>
+						<view class="grid-text">图片</view>
+					</u-grid-item>
+					<u-grid-item>
+						<u-icon name="lock" :size="30"></u-icon>
+						<view class="grid-text">锁头</view>
+					</u-grid-item>
+					<u-grid-item>
+						<u-icon name="hourglass" :size="30"></u-icon>
+						<view class="grid-text">沙漏</view>
+					</u-grid-item>
+					<u-grid-item>
+						<u-icon name="hourglass" :size="30"></u-icon>
+						<view class="grid-text">沙漏</view>
+					</u-grid-item>
+				</u-grid>
+		</view>
+		<view class="news-box">
+			<u-notice-bar
+				:text="newsTextLists"
+				:bg-color="$uni-bg-color"
+			></u-notice-bar>
+		</view>
+	</view>
 	
 </template>
 
 <script>
 	import HomeHeader from './childComps/HomeHeader.vue'
 	export default {
-		components:{
+		components: {
 			HomeHeader,
 		},
 		data() {
 			return {
-				hotSearchWord:'热门关键词',
-				headerBgList:["https://alifei01.cfp.cn/creative/vcg/800/new/VCG41175510742.jpg"]
+				newsTextLists: [
+					'寒雨连江夜入吴',
+					'平明送客楚山孤',
+					'洛阳亲友如相问',
+					'一片冰心在玉壶'],
 			}
 		},
 		onLoad() {
@@ -22,13 +69,34 @@
 			// 头部区域
 			//获取热点搜索词、背景URL
 			getHeaderAreaURL() {
-				
+				this.headerBgList = [];
+				this.hotSearchWord = ''
+			}
+		},
+		computed:{
+			newsText() {
+				// return "寒雨连江夜入吴 平明送客楚山孤 洛阳亲友如相问 一片冰心在玉壶"
+				return this.newsTextLists.join('')
 			}
 		}
 	}
 </script>
 
 <style lang="scss">
-	
+	.base-bg-color {
+		background-color: $u-bg-color;
+	}
+	.nav-card {
+		margin: 15px 7px;
+		padding: 10px 0;
+		background-color: $uni-bg-color;
+		
+		border-radius: $uni-border-radius-lg;
+		box-shadow: 0 3px 3px 0 $u-border-color;
+		// border: solid 2px black;
+		.grid-text {
+			font-size: 14px;
+		}
+	}
 	
 </style>
\ No newline at end of file