diff --git a/components/HomeNavCard/HomeNavCard.vue b/components/HomeNavCard/HomeNavCard.vue
new file mode 100644
index 0000000..fe81a30
--- /dev/null
+++ b/components/HomeNavCard/HomeNavCard.vue
@@ -0,0 +1,63 @@
+<template>
+	<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>
+</template>
+
+<script>
+	export default {
+		name:"HomeNavCard",
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+
+<style lang="scss">
+.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;
+	.grid-text {
+		font-size: 14px;
+	}
+}
+</style>
\ No newline at end of file
diff --git a/components/ShowShopList/ShowShopList.vue b/components/ShowShopList/ShowShopList.vue
index a090a45..f6e3f62 100644
--- a/components/ShowShopList/ShowShopList.vue
+++ b/components/ShowShopList/ShowShopList.vue
@@ -1,6 +1,9 @@
 <template>
 	<view>
-		
+		<ShowShopListItem 
+			v-for="item in shopInfoList"
+			:shopInfo="item"
+		></ShowShopListItem>
 	</view>
 </template>
 
@@ -11,6 +14,32 @@
 			return {
 				
 			};
+		},
+		props: {
+			shopInfoList: {
+				type: Array,
+				default() {
+					return [
+						{
+							imageUrl: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG41175510742.jpg',
+							title: '琴行铺面转让',
+							promotionNum: 23,
+							price: 5000,
+							date: '2023-11-02'
+						},
+						{
+							imageUrl: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG41175510742.jpg',
+							title: '琴行铺面转让',
+							promotionNum: 28,
+							price: 8000,
+							date: '2023-11-02'
+						}
+					]
+				}
+			}
+		},
+		computed: {
+			
 		}
 	}
 </script>
diff --git a/components/ShowShopListItem/ShowShopListItem.vue b/components/ShowShopListItem/ShowShopListItem.vue
index 456e06d..5b6d480 100644
--- a/components/ShowShopListItem/ShowShopListItem.vue
+++ b/components/ShowShopListItem/ShowShopListItem.vue
@@ -2,25 +2,51 @@
 	<view class="list-border">
 		<view class="list-container">
 			<view class="shop-list-img">
-				<u-image width="80px" height="80px" :src="imageUrl" border-radius='6px'></u-image>
+				<u-image width="80px" height="80px" :src="shopInfo.imageUrl" radius="8px"></u-image>
+			</view>
+			<view class="text-area">
+				<text>{{shopInfo.title}}</text>
+				<view class="pos-and-sqr">
+						<view>
+							<text>锦江区</text>
+						</view>
+						<view>
+							<text>200m2</text>
+						</view>
+					</view>
+				<view class="rent-and-date">
+					<text>租金：{{shopInfo.price}}元/月</text>
+					<text>发布日期：{{shopInfo.date}}</text>
+				</view>
 			</view>
 		</view>
-		<view class="list-ads">
-			
+		<view class="list-ads" style="font-size: 11px;">
+			<view>
+				<text>已将该店推给 </text> 
+				<text style="color:#ce3b3b;margin: 0 4px;"> {{shopInfo.promotionNum}} </text> 
+				<text> 位潜在客户</text>
+			</view>
+			<text style="color:#ce3b3b">我也要推广>></text>
 		</view>
 	</view>
-	
 </template>
 
 <script>
 	export default {
 		props: {
-			imageUrl: {
-				type: String,
+			shopInfo: {
+				type:Object,
 				default(){
-					return 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG41175510742.jpg'
+					return {
+						imageUrl: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG41175510742.jpg',
+						title: '琴行铺面转让',
+						promotionNum: 23,
+						price: 5000,
+						date: '2023-11-02'
+					}
 				}
-			}
+			},
+			
 			
 		},
 		data() {
@@ -37,15 +63,45 @@
 
 <style lang="scss" scoped>
 	.list-border {
-		padding: 10px;
-	}
-	.list-container {
-		height: 80px;
-		background-color: #fff;
-		background-color: #000;
 		margin: 10px;
-		.shop-list-img {
-			border-radius: $uni-border-radius-lg;
+		padding: 10px;
+		background-color: #fff;
+		border-radius: 7px;
+		.list-container {
+			display: flex;
+			height: 80px;
+			// background-color: #000;
+			margin-bottom: 5px;			
+			font-size: 12px;
+		}
+		.text-area {
+			margin-left: 10px;
+			display: flex;
+			flex-direction: column;
+			justify-content: space-between;
+			> text {
+				font-size: 14px;
+			}
+			.pos-and-sqr {
+				display: flex;
+				text {
+					margin-right: 6px;
+					color: #359867;
+				}
+			}
+			.rent-and-date {
+				text {
+					margin-right: 6px;
+					color: #CC3333;
+				}
+			}
+		}
+		.list-ads {
+			border-top: 1px solid #f7f7f7;
+			padding-top: 5px;
+			display: flex;
+			justify-content: space-between;
 		}
 	}
+	
 </style>
\ No newline at end of file
diff --git a/pages/index/index.vue b/pages/index/index.vue
index 22f624b..d626092 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -2,46 +2,12 @@
 	<view class="home-base-bg">
 		<InputAndSwiper></InputAndSwiper>
 		<TabBar :current-page="0"></TabBar>
-		<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>
+		<HomeNavCard></HomeNavCard>
 		<view class="news-box">
 			<u-notice-bar :text="newsTextLists" :bg-color="$uni-bg-color"></u-notice-bar>
 		</view>
-		<ShowShopListItem></ShowShopListItem>
+		
+		<ShowShopList></ShowShopList>
 	</view>
 </template>
 
@@ -74,17 +40,5 @@
 		background-color: $uni-bg-color-grey;
 		width: 100%;
 	}
-
-	.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;
-
-		.grid-text {
-			font-size: 14px;
-		}
-	}
+	
 </style>
\ No newline at end of file
diff --git a/static/shoplist/sy_icon_lbdw.png b/static/shoplist/sy_icon_lbdw.png
new file mode 100644
index 0000000..79f0c8f
Binary files /dev/null and b/static/shoplist/sy_icon_lbdw.png differ
diff --git a/static/shoplist/sy_icon_lbpm.png b/static/shoplist/sy_icon_lbpm.png
new file mode 100644
index 0000000..4f6dc47
Binary files /dev/null and b/static/shoplist/sy_icon_lbpm.png differ