diff --git a/src/views/home/chatTest.vue b/src/views/home/chatTest.vue
index dfca0b0d..f5441472 100644
--- a/src/views/home/chatTest.vue
+++ b/src/views/home/chatTest.vue
@@ -1,14 +1,61 @@
 <template>
-	<el-card style="padding:0;width: 99%;height: 99%;border-radius: 0.375rem;margin: 0.5vh auto 0;box-shadow: 0 4px 6px -1px rgba(0, 0, 0 ,.1), 0 2px 4px -2px rgba(0, 0, 0 ,.1);">
-		<el-container>
-			<el-side style=" max-width: 260px;width: 260px;border-right: 1px solid #ddd;box-sizing: border-box;">
+	<div style="padding:0;width: 99%;height: 99%;border-radius: 0.375rem;margin: 0.5vh auto 0;box-shadow: 0 4px 6px -1px rgba(0, 0, 0 ,.1), 0 2px 4px -2px rgba(0, 0, 0 ,.1);">
+		<div style="width: 100%;height: 100%;position: relative;    background: #fff;border-radius: 6px;">
+			<div style=" max-width: 260px;width: 260px;border-right: 1px solid rgb(229, 231, 235);box-sizing: border-box;height: 100%;position: absolute;left: 0;top: 0;">
+				<main style="display: flex;flex-direction: column;min-height: 0;flex:1 1 0%">
+					<el-button type="line"  style="margin: 1rem;">新建聊天</el-button>
+					<div style="padding-bottom: 1rem;overflow: hidden;flex: 1 1 0%;min-height: 0px;">
+						<div style="overflow: hidden; position: relative;z-index: auto;height: 100%;width: 100%;padding: 0 1rem;"></div>
+					</div>
+				</main>
+				<footer style="padding: 1rem;border-top: 1px solid rgb(229, 231, 235);">
+					<div style="align-items: center;display: flex;">
+						<img style="width: 2.5rem;height: 2.5rem;border-radius: 50%;flex-shrink: 0;" src="img/icon_nbyg.png" alt="">
+						<div style="font-weight: 700;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;flex: 1 1 0%;min-width: 0px;margin-left: 0.5rem;"> {{ userName }}</div>
+					</div>
+				</footer>
+			</div>
+			<div style="padding-left: 260px;height: 100%;box-sizing: border-box;position: relative;z-index: auto;">
 				<el-container>
+					<el-main>
+						<div>
+							<div class="right_layout_myselfChat">
+								<div id="datatime" style="flex:2;font-size:13px;color:lightgray"></div>
+								<div style="flex:1">
+									<div class="user_icons" style="width:40px;height:40px;"></div>
+								</div>
+							</div>
+							<div class="myself_chat">
+								前端有哪些性能优化？
+							</div>
+							
+						</div>
+					</el-main>
+					<el-footer style="padding: 1rem;height: 5rem;text-align: left;border-top: 1px solid rgb(229, 231, 235);">
+						<div style="display: flex;align-items: center;justify-content: space-between;">
+							<div style="width: 100%;height:100%;padding: 0 0.5rem;">
+								<el-input class="search_input" placeholder="来说点什么吧..."></el-input>
+							</div>
+							<el-button icon="el-icon-promotion" size="success"></el-button>
+						</div>
+					</el-footer>
+				</el-container>
+			</div>
+		</div>
+		
+		<!-- <el-container>
+			<el-side style=" max-width: 260px;width: 260px;border-right: 1px solid #ddd;box-sizing: border-box;">
+				<div class="common-layout">
+					<el-container>
+					<el-header style="padding:0 6px 0 0;"></el-header>
 					<el-main style="padding:0 6px 0 0;">
 						<div style="display: flex;flex-direction: column;height: 100%;">
 							<el-button type="line"  style="margin: 1rem;">新建聊天</el-button>
-							<div class="new_chat new_chat_text">
-								<div class="false_img" style="border:1px solid rgb(75, 158, 95);border-radius:20% 20% 0 20%;color:rgb(75,158,95);">...</div>
-								<div style="flex:8;color:rgb(75,158,95);">前端有哪些性能优化？</div>
+							<div class="chat_list">
+								<div class="chat_list_item" v-for="(item,index) in 10" :key="index">
+									<div class="chat_list_item_icon" style="border:1px solid rgb(75, 158, 95);border-radius:20% 20% 0 20%;color:rgb(75,158,95);">...</div>
+									<div class="chat_list_item_text" style="flex:8;color:rgb(75,158,95);">前端有哪些性能优化？</div>
+								</div>
 							</div>
 						</div>
 					</el-main>
@@ -19,6 +66,7 @@
 						</div>
 					</el-footer>
 				</el-container>
+				</div>
 			</el-side>
 			<el-main>
 				<el-container>
@@ -27,7 +75,7 @@
 							<div class="right_layout_myselfChat">
 								<div id="datatime" style="flex:2;font-size:13px;color:lightgray"></div>
 								<div style="flex:1">
-									<div class="flase_img_son" style="width:40px;height:40px;"></div>
+									<div class="user_icons" style="width:40px;height:40px;"></div>
 								</div>
 							</div>
 							<div class="myself_chat">
@@ -44,8 +92,8 @@
 					</el-footer>
 				</el-container>
 			</el-main>
-		</el-container>
-	</el-card>
+		</el-container> -->
+	</div>
 </template>
 <script>
 // import xSelects from "@/components/xtSelect/index2.vue";
@@ -67,20 +115,12 @@ export default {
 };
 </script>
 <style scoped>
-.left_layout {
-				flex: 1;
-				border-right: 1px solid lightgray;
-			}
 
 			.right_layout {
 				flex: 6;
 			}
 
-			.father_icon {
-				position: relative;
-			}
-
-			.son_icon {
+			.icons {
 				background-color: white;
 				z-index: 99;
 				position: absolute;
@@ -92,49 +132,22 @@ export default {
 				color: gray;
 			}
 
-			.son_icon_display {
+			.icons_display {
 				top: 48vh;
 				right: -15px;
 			}
 
-			.son_icon_hideen {
+			.icons_hideen {
 				top: 48vh;
 				left: 10px;
 				display: none;
 			}
-
-			.new_chat {
-				cursor: pointer;
-				border: 1px solid lightgray;
-				padding: 10px 20px;
-				margin: 20px 10px;
-				text-align: center;
-			}
-
 			.new_chat_text {
-				border: 1px solid rgb(75,158,95);
+				border: 1px solid #4b9e5f;
 				display: flex;
 			}
 
-			.left_person {
-				width: 100%;
-				padding: 1vh 20px;
-				/* margin:20px 10px; */
-				position: absolute;
-				top: 90vh;
-				border-top: 1px solid lightgray;
-			}
-
-			.false_img {
-				/* background:linear-gradient(-135deg,#0c80cc,#009dff); */
-				flex: 1;
-			}
-
-			.false_img_right {
-				flex: 3;
-			}
-
-			.flase_img_son {
+			.user_icons {
 				width: 50px;
 				height: 50px;
 				background: linear-gradient(-135deg, #0000cc, #009dff);
@@ -165,11 +178,10 @@ export default {
 				border-radius: 1px;
 				color:white;
 			}
-			.ipt{
-				width:85vh;
-				margin:10px 20px;
-				padding:10px 20px;
-				border:1px solid lightgray;
+			.search_input{
+				width: 100%;
+				padding:0.5rem 1rem;
+				/* border:1px solid lightgray; */
 			}
 			.right_layout_myselfChat{
 				width:200px;