diff --git a/components/tabbar.vue b/components/tabbar.vue
index 8b7a3aa..8bd8a20 100644
--- a/components/tabbar.vue
+++ b/components/tabbar.vue
@@ -68,26 +68,31 @@
 </script>
 <style>
 	.tabbar_item{
-		width: 33.3333333%;
+		width: 50%;
 		height: 112rpx;
 		display: flex;
-		justify-content: center;
 		align-items: center;
 		margin-top: 10rpx;
 		text-align: center;
 	}
+	.tabbar_item:first-of-type{
+		justify-content: flex-start;
+	}
+	.tabbar_item:last-of-type{
+		justify-content: flex-end;
+	}
 	.tabbar_item_wrap{
 		position: fixed;
 		bottom: 0rpx;
 		left: 0rpx;
 		right: 0rpx;
-		width: 664rpx;
+		width: 404rpx;
 		height: 119.43925233644859rpx;
 		background-color: #ffffff;
 		display: flex;
 		box-sizing: border-box;
-		padding-left: 43rpx;
-		padding-right: 43rpx;
+		padding-left: 173rpx;
+		padding-right: 173rpx;
 		justify-content: space-between;
 		padding-bottom: constant(safe-area-inset-bottom);  
 		padding-bottom: env(safe-area-inset-bottom); 
@@ -97,12 +102,12 @@
 		box-shadow: 0rpx -2rpx 6rpx 0rpx rgba(181,181,181,0.13);
 	}
 	.tabbar_item01 image{
-		width: 50rpx;
-		height: 50rpx;
+		width: 60rpx;
+		height: 60rpx;
 	}
 	.tabbar_item02 image{
-		width: 50rpx;
-		height: 50rpx;
+		width: 60rpx;
+		height: 60rpx;
 	}
 	.tabbar_item05{
 		position: relative;
@@ -114,12 +119,12 @@
 		top: -50rpx;
 	}
 	.tabbar_item03 image{
-		width: 50rpx;
-		height: 50rpx;
+		width: 60rpx;
+		height: 60rpx;
 	}
 	.tabbar_item04 image{
-		width: 50rpx;
-		height: 50rpx;
+		width: 60rpx;
+		height: 60rpx;
 	}
 	.tabbarNone{
 		color: #888D9C;
diff --git a/pages/index/index.vue b/pages/index/index.vue
index da20ff7..b3fff46 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -82,9 +82,9 @@
 			</view>
 		</view>
 		
-		<view class="block visit-wrapper">
+		<view class="block visit-wrapper ">
 			<view class="header flex">
-				<view class="title-wrapper flex">
+				<view class="title-wrapper flex booklist">
 					<view class="title">
 						最近预约
 					</view>
@@ -131,10 +131,14 @@
 				</view>
 			</view>
 		</view>
+		
+		<tabbar current="1"></tabbar>
 	</view>
 </template>
 
 <script>
+	import tabbar from '@/components/tabbar.vue';
+
 	export default {
 		data() {
 			return {
@@ -146,6 +150,9 @@
 				title:'李静医生预约就诊'
 			});
 		},
+		components:{
+			tabbar:tabbar
+		},
 		methods: {
 		}
 	}
@@ -229,6 +236,9 @@
 				border-radius: 8rpx 0rpx 0rpx 8rpx;
 				background: linear-gradient( 98deg, #53C184 0%, #5CD378 100%);
 			}
+			&.booklist .title{
+				margin-bottom: 0rpx;
+			}
 			img{
 				width: 48rpx;
 				height: 42rpx;
diff --git a/static/images/frontend/tabbar_index.svg b/static/images/frontend/tabbar_index.svg
new file mode 100644
index 0000000..9a1f0fa
--- /dev/null
+++ b/static/images/frontend/tabbar_index.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg version="1.1" width="60px" height="60px" viewBox="0 0 60.0 60.0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><clipPath id="i0"><path d="M2248,0 L2248,2863 L0,2863 L0,0 L2248,0 Z"></path></clipPath><clipPath id="i1"><path d="M38,0 C41.3137085,-6.08718376e-16 44,2.6862915 44,6 L44,32 C44,35.3137085 41.3137085,38 38,38 L6,38 C2.6862915,38 2.02906125e-16,35.3137085 0,32 L0,6 C-4.05812251e-16,2.6862915 2.6862915,4.05812251e-16 6,0 L38,0 Z"></path></clipPath><clipPath id="i2"><path d="M22.6713213,0.667361779 C23.5703441,1.54952135 23.5651323,2.9757217 22.6582919,3.85279679 L10.7104092,15.4022232 C10.2782631,15.8211979 9.69360015,16.056118 9.08435058,16.0555815 L9.01138641,16.0555815 C8.37787842,16.035458 7.78061488,15.7624978 7.35926915,15.3005333 L0.584024849,7.87208868 C-0.262880689,6.94162642 -0.179493067,5.51796832 0.774252862,4.69173817 C1.72799879,3.86550802 3.18728218,3.94685991 4.03418771,4.87732217 L9.18858511,10.5287364 L19.4061747,0.652108299 C20.3130151,-0.222424536 21.7749043,-0.217340043 22.6713213,0.667361779 Z"></path></clipPath><clipPath id="i3"><path d="M2.5,0 C3.87979684,0 5,0.975024998 5,2.17600037 L5,7.5889855 C5,8.79241686 3.87979684,9.76744186 2.5,9.76744186 C1.12020316,9.76744186 0,8.79241686 0,7.59144149 L0,2.17600037 C0,0.975024998 1.12020316,0 2.5,0 Z"></path></clipPath><clipPath id="i4"><path d="M9,-4 L9,13.7674419 L-4,13.7674419 L-4,-4 L9,-4 Z M2.5,0 C1.12020316,0 0,0.975024998 0,2.17600037 L0,7.59144149 C0,8.79241686 1.12020316,9.76744186 2.5,9.76744186 C3.87979684,9.76744186 5,8.79241686 5,7.5889855 L5,2.17600037 C5,0.975024998 3.87979684,0 2.5,0 Z"></path></clipPath><clipPath id="i5"><path d="M2.5,0 C3.87979684,0 5,0.975024998 5,2.17600037 L5,7.5889855 C5,8.79241686 3.87979684,9.76744186 2.5,9.76744186 C1.12020316,9.76744186 0,8.79241686 0,7.59144149 L0,2.17600037 C0,0.975024998 1.12020316,0 2.5,0 Z"></path></clipPath><clipPath id="i6"><path d="M9,-4 L9,13.7674419 L-4,13.7674419 L-4,-4 L9,-4 Z M2.5,0 C1.12020316,0 0,0.975024998 0,2.17600037 L0,7.59144149 C0,8.79241686 1.12020316,9.76744186 2.5,9.76744186 C3.87979684,9.76744186 5,8.79241686 5,7.5889855 L5,2.17600037 C5,0.975024998 3.87979684,0 2.5,0 Z"></path></clipPath></defs><g transform="translate(-247.0 -305.0)"><g clip-path="url(#i0)"><g transform="translate(247.0 305.0)"><g transform="translate(8.0 13.0)"><g clip-path="url(#i1)"><path d="M6,0 L38,0 C41.3137085,-6.08718376e-16 44,2.6862915 44,6 L44,32 C44,35.3137085 41.3137085,38 38,38 L6,38 C2.6862915,38 2.02906125e-16,35.3137085 0,32 L0,6 C-4.05812251e-16,2.6862915 2.6862915,4.05812251e-16 6,0 Z" stroke="#AEB0B8" stroke-width="8.88" fill="none" stroke-miterlimit="5"></path></g></g><g transform="translate(18.837473522810157 25.261002119606424)"><g clip-path="url(#i2)"><polygon points="1.99569215e-16,4.41194494e-16 23.3420226,4.41194494e-16 23.3420226,16.0555824 1.99569215e-16,16.0555824 1.99569215e-16,4.41194494e-16" stroke="none" fill="#AEB0B8"></polygon></g></g><g transform="translate(18.0 8.999999999999998)"><g clip-path="url(#i3)"><polygon points="0,0 5,0 5,9.76744186 0,9.76744186 0,0" stroke="none" fill="#AEB0B8"></polygon></g><g clip-path="url(#i4)"><path d="M2.5,9.76744186 C1.12020316,9.76744186 0,8.79241686 0,7.59144149 L0,2.17600037 C0,0.975024998 1.12020316,0 2.5,0 C3.87979684,0 5,0.975024998 5,2.17600037 L5,7.5889855 C5,8.79241686 3.87979684,9.76744186 2.5,9.76744186 Z" stroke="#FFFFFF" stroke-width="6" fill="none" stroke-miterlimit="5"></path></g><g transform="translate(19.0 0.0)"><g clip-path="url(#i5)"><polygon points="0,0 5,0 5,9.76744186 0,9.76744186 0,0" stroke="none" fill="#AEB0B8"></polygon></g><g clip-path="url(#i6)"><path d="M2.5,9.76744186 C1.12020316,9.76744186 0,8.79241686 0,7.59144149 L0,2.17600037 C0,0.975024998 1.12020316,0 2.5,0 C3.87979684,0 5,0.975024998 5,2.17600037 L5,7.5889855 C5,8.79241686 3.87979684,9.76744186 2.5,9.76744186 Z" stroke="#FFFFFF" stroke-width="6" fill="none" stroke-miterlimit="5"></path></g></g></g></g></g></g></svg>
\ No newline at end of file
diff --git a/static/images/frontend/tabbar_index_active.svg b/static/images/frontend/tabbar_index_active.svg
new file mode 100644
index 0000000..feb7af8
--- /dev/null
+++ b/static/images/frontend/tabbar_index_active.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg version="1.1" width="60px" height="61px" viewBox="0 0 60.0 61.0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><clipPath id="i0"><path d="M2248,0 L2248,2863 L0,2863 L0,0 L2248,0 Z"></path></clipPath><clipPath id="i1"><path d="M38,0 C41.3137085,-1.4968968e-15 44,2.6862915 44,6 L44,32.179669 C44,35.4933775 41.3137085,38.179669 38,38.179669 L6,38.179669 C2.6862915,38.179669 5.05188001e-17,35.4933775 0,32.179669 L0,6 C-1.29399067e-15,2.6862915 2.6862915,-4.82366169e-16 6,0 L38,0 Z"></path></clipPath><clipPath id="i2"><path d="M22.6713213,0.670517153 C23.5703441,1.5568477 23.5651323,2.98979131 22.6582919,3.87101332 L10.7104092,15.4750469 C10.2782631,15.8960026 9.69360015,16.1320335 9.08435058,16.1314944 L9.01138641,16.1314944 C8.37787842,16.1112758 7.78061488,15.837025 7.35926915,15.3728762 L0.584024849,7.90930896 C-0.262880689,6.97444735 -0.179493067,5.544058 0.774252862,4.71392133 C1.72799879,3.88378465 3.18728218,3.96552119 4.03418771,4.9003828 L9.18858511,10.5785177 L19.4061747,0.655191553 C20.3130151,-0.223476189 21.7749043,-0.218367655 22.6713213,0.670517153 Z"></path></clipPath><clipPath id="i3"><path d="M2.5,0 C3.87979684,0 5,0.979635046 5,2.18628879 L5,7.62486723 C5,8.83398857 3.87979684,9.81362362 2.5,9.81362362 C1.12020316,9.81362362 0,8.83398857 0,7.62733483 L0,2.18628879 C0,0.979635046 1.12020316,0 2.5,0 Z"></path></clipPath><clipPath id="i4"><path d="M9,-4 L9,13.8136236 L-4,13.8136236 L-4,-4 L9,-4 Z M2.5,0 C1.12020316,0 0,0.979635046 0,2.18628879 L0,7.62733483 C0,8.83398857 1.12020316,9.81362362 2.5,9.81362362 C3.87979684,9.81362362 5,8.83398857 5,7.62486723 L5,2.18628879 C5,0.979635046 3.87979684,0 2.5,0 Z"></path></clipPath><clipPath id="i5"><path d="M2.5,0 C3.87979684,0 5,0.979635046 5,2.18628879 L5,7.62486723 C5,8.83398857 3.87979684,9.81362362 2.5,9.81362362 C1.12020316,9.81362362 0,8.83398857 0,7.62733483 L0,2.18628879 C0,0.979635046 1.12020316,0 2.5,0 Z"></path></clipPath><clipPath id="i6"><path d="M9,-4 L9,13.8136236 L-4,13.8136236 L-4,-4 L9,-4 Z M2.5,0 C1.12020316,0 0,0.979635046 0,2.18628879 L0,7.62733483 C0,8.83398857 1.12020316,9.81362362 2.5,9.81362362 C3.87979684,9.81362362 5,8.83398857 5,7.62486723 L5,2.18628879 C5,0.979635046 3.87979684,0 2.5,0 Z"></path></clipPath></defs><g transform="translate(-133.0 -305.0)"><g clip-path="url(#i0)"><g transform="translate(133.0 305.0)"><g transform="translate(8.0 13.061465721040193)"><g clip-path="url(#i1)"><polygon points="0,0 44,0 44,38.179669 0,38.179669 0,0" stroke="none" fill="#5AD079"></polygon></g></g><g transform="translate(18.837473522810157 25.380439481874063)"><g clip-path="url(#i2)"><polygon points="1.99569215e-16,4.77457014e-16 23.3420226,4.77457014e-16 23.3420226,16.1314953 1.99569215e-16,16.1314953 1.99569215e-16,4.77457014e-16" stroke="none" fill="#FFFFFF"></polygon></g></g><g transform="translate(18.0 9.042553191489361)"><g clip-path="url(#i3)"><polygon points="0,0 5,0 5,9.81362362 0,9.81362362 0,0" stroke="none" fill="#5AD079"></polygon></g><g clip-path="url(#i4)"><path d="M2.5,9.81362362 C1.12020316,9.81362362 0,8.83398857 0,7.62733483 L0,2.18628879 C0,0.979635046 1.12020316,0 2.5,0 C3.87979684,0 5,0.979635046 5,2.18628879 L5,7.62486723 C5,8.83398857 3.87979684,9.81362362 2.5,9.81362362 Z" stroke="#FFFFFF" stroke-width="6" fill="none" stroke-miterlimit="5"></path></g><g transform="translate(19.0 0.0)"><g clip-path="url(#i5)"><polygon points="0,0 5,0 5,9.81362362 0,9.81362362 0,0" stroke="none" fill="#5AD079"></polygon></g><g clip-path="url(#i6)"><path d="M2.5,9.81362362 C1.12020316,9.81362362 0,8.83398857 0,7.62733483 L0,2.18628879 C0,0.979635046 1.12020316,0 2.5,0 C3.87979684,0 5,0.979635046 5,2.18628879 L5,7.62486723 C5,8.83398857 3.87979684,9.81362362 2.5,9.81362362 Z" stroke="#FFFFFF" stroke-width="6" fill="none" stroke-miterlimit="5"></path></g></g></g></g></g></g></svg>
\ No newline at end of file
diff --git a/static/images/frontend/tabbar_user.svg b/static/images/frontend/tabbar_user.svg
new file mode 100644
index 0000000..b44ff71
--- /dev/null
+++ b/static/images/frontend/tabbar_user.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg version="1.1" width="60px" height="60px" viewBox="0 0 60.0 60.0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><clipPath id="i0"><path d="M2248,0 L2248,2863 L0,2863 L0,0 L2248,0 Z"></path></clipPath></defs><g transform="translate(-247.0 -419.0)"><g clip-path="url(#i0)"><g transform="translate(247.0 419.0)"><g transform="translate(7.777777777777779 7.777777777777779)"><g transform="translate(10.0 2.2222222222222214)"><path d="M12.2222222,24.4444444 C18.9723692,24.4444444 24.4444444,18.9723692 24.4444444,12.2222222 C24.4444444,5.47207528 18.9723692,0 12.2222222,0 C5.47207528,0 0,5.47207528 0,12.2222222 C0,18.9723692 5.47207528,24.4444444 12.2222222,24.4444444 Z" stroke="#AEB0B7" stroke-width="4.44444444" fill="none" stroke-linecap="round" stroke-linejoin="round"></path></g><g transform="translate(2.2222222222222214 33.33333333333334)"><path d="M0,8.88888889 C4.91318773,3.43333902 12.053153,0 20,0 C27.946847,0 35.0868123,3.43333902 40,8.88888889" stroke="#AEB0B7" stroke-width="4.44444444" fill="none" stroke-linecap="round" stroke-linejoin="round"></path></g></g></g></g></g></svg>
\ No newline at end of file
diff --git a/static/images/frontend/tabbar_user_active.svg b/static/images/frontend/tabbar_user_active.svg
new file mode 100644
index 0000000..8bd5327
--- /dev/null
+++ b/static/images/frontend/tabbar_user_active.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg version="1.1" width="60px" height="60px" viewBox="0 0 60.0 60.0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><clipPath id="i0"><path d="M2248,0 L2248,2863 L0,2863 L0,0 L2248,0 Z"></path></clipPath><clipPath id="i1"><path d="M11.1111111,0 C17.2476083,0 22.2222222,4.97461389 22.2222222,11.1111111 C22.2222222,17.2476083 17.2476083,22.2222222 11.1111111,22.2222222 C4.97461389,22.2222222 0,17.2476083 0,11.1111111 C0,4.97461389 4.97461389,0 11.1111111,0 Z"></path></clipPath></defs><g transform="translate(-133.0 -419.0)"><g clip-path="url(#i0)"><g transform="translate(133.0 419.0)"><g transform="translate(7.777777777777779 7.777777777777779)"><g transform="translate(11.11111111111111 3.333333333333332)"><g clip-path="url(#i1)"><polygon points="0,0 22.2222222,0 22.2222222,22.2222222 0,22.2222222 0,0" stroke="none" fill="#5AD079"></polygon></g></g><g transform="translate(10.0 2.2222222222222214)"><path d="M12.2222222,24.4444444 C18.9723692,24.4444444 24.4444444,18.9723692 24.4444444,12.2222222 C24.4444444,5.47207528 18.9723692,0 12.2222222,0 C5.47207528,0 0,5.47207528 0,12.2222222 C0,18.9723692 5.47207528,24.4444444 12.2222222,24.4444444 Z" stroke="#5AD079" stroke-width="4.44444444" fill="none" stroke-linecap="round" stroke-linejoin="round"></path></g><g transform="translate(2.2222222222222214 33.33333333333334)"><path d="M0,8.88888889 C4.91318773,3.43333902 12.053153,0 20,0 C27.946847,0 35.0868123,3.43333902 40,8.88888889" stroke="#5AD079" stroke-width="4.44444444" fill="none" stroke-linecap="round" stroke-linejoin="round"></path></g></g></g></g></g></svg>
\ No newline at end of file