feat: 整理测试页面UI，增加自动连接管理

src/index.css

@@ -11,31 +11,68 @@ button {
   outline: none;
   border: 1px solid #ccc;
 }
+#root
+{
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
 button:hover
 {
   cursor: pointer;
   border: solid 1px #999;
 }
-.result-container {
+.btn-container {
   display: flex;
   flex-direction: row;
+  gap: 16px;
+  padding: 16px;
+  align-items: center;
+  flex-wrap: wrap;
+  /* 移除高度限制，保持自适应 */
+}
+
+/* 让#root成为flex容器，纵向排列，撑满body */
+#root {
   width: 100%;
   height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+/* result-container占据剩余空间 */
+.result-container {
+  display: flex;
+  flex-direction: row;
+  flex: 1 1 0%; /* 占据剩余空间 */
+  width: 100%;
+  min-height: 0; /* 防止溢出 */
   padding: 20px;
   box-sizing: border-box;
 }
+
+.list-container, .log-container {
+  height: 100%;
+}
+
 .list-container {
   width: 50%;
-  height: 100%;
+  overflow: scroll;
 }
+
 .log-container {
   width: 50%;
-  height: 100%;
+  display: flex;
+  flex-direction: column;
 }
+
 .log-container textarea {
   width: 100%;
   height: 100%;
-  min-height: 800px;
+  min-height: 0;
   border: solid 1px #ccc;
   border-radius: 5px;
   outline: none;