diff --git a/src/views/graphite/index.vue b/src/views/graphite/index.vue
index d72d81e..78fbee3 100644
--- a/src/views/graphite/index.vue
+++ b/src/views/graphite/index.vue
@@ -60,29 +60,28 @@
 			</div>
 		</van-overlay>
 		<!--选择工艺-->
-		<OverlayModal :visible="craftVisible">
-			<CraftList @changeVisible="changeVisible" @selectedCraft="onHandleSelectedCraft"></CraftList>
-		</OverlayModal>
+		<van-overlay v-if="craftVisible" :show="true">
+			<div class="flex justify-center items-center h-full">
+				<CraftList @changeVisible="changeVisible" @selectedCraft="onHandleSelectedCraft"></CraftList>
+			</div>
+		</van-overlay>
 
 		<!--实验名称-->
-		<OverlayModal :visible="taskNameVisible">
-			<div class="task_name">
-				<div class="task_title">开始新实验</div>
-				<div class="task_name_content">
-					<div class="mt-3">实验名称：</div>
-					<div class="task_auto">
-						<input v-model="taskName" placeholder="实验名称" class="task_input" />
-						<div v-if="!taskName" style="color: red; font-size: 1rem">请输入实验名称</div>
+		<van-overlay v-if="taskNameVisible" :show="true">
+			<div class="flex justify-center items-center h-full">
+				<div class="w-[440px] bg-white px-5 py-[30px] rounded-lg text-text">
+					<div class="text-xl font-medium">开始新实验</div>
+					<div class="text-xl flex items-center h-16">
+						<div class="min-w-[100px] text-right">实验名称</div>
+						<el-input v-model.trim="taskName" class="ml-5" style="width: 200px" placeholder="请输入实验名称" />
 					</div>
+					<footer class="mt-4 flex justify-center items-center text-sm font-medium gap-x-8">
+						<button class="btn-dark px-10 py-2 text-xl" @click="onSave">保存</button>
+						<button class="btn-light px-10 py-2 text-xl" @click="onCancel">取消</button>
+					</footer>
 				</div>
-
-				<br />
-				<footer class="task_button">
-					<button class="btn-dark px-2 py-1 min-w-20" @click="onSave">保存</button>
-					<button class="cancel_btn" @click="onCancel">取消</button>
-				</footer>
 			</div>
-		</OverlayModal>
+		</van-overlay>
 	</div>
 </template>
 <script lang="ts" setup>
@@ -120,18 +119,18 @@ watch(
         if(item.id == newVal?.heatId){
           item.craftInfo.status = newVal?.status
           if(newVal?.status == 3){//停止执行
-            item.executing_craft = false;
-            craftName.value = "选择工艺";
-            exeCraftName.value = "执行工艺";
+						item.executing_craft = false;
+						craftName.value = "选择工艺";
+						exeCraftName.value = "执行工艺";
           }else if(item.executing_craft){//正在执行
-            if (newVal?.status == 1 && item.isSelect) {
-              craftName.value = "暂停工艺";
-              exeCraftName.value = "停止工艺";
-            }
-          }
-        }
-      });
-    }
+						if (newVal?.status == 1 && item.isSelect) {
+							craftName.value = "暂停工艺";
+							exeCraftName.value = "停止工艺";
+						}
+					}
+				}
+			});
+		}
 	}
 );
 
@@ -140,7 +139,7 @@ watch(()=>statusStore.status,(newVal)=>{
     console.log('newVal------status---', newVal)
     heatAearStatusList.value = newVal.heatArea
     updateHeatList()
-  }
+		}
 })
 
 const heatAearStatusList = ref(statusStore.status?.heatArea || []);
@@ -152,49 +151,49 @@ const emptyColor = "#FFFFFF";
 const taskName = ref("");
 let deviceData = <any>{}
 onMounted(() => {
-  //6个加热区数据
+	//6个加热区数据
   initHeatList()
-  //设备16个试管的基础数据
-  tubeBaseConfig();
-  //连接socket
-  const wsClient = createWebSocket(sharedWsUrl);
+	//设备16个试管的基础数据
+	tubeBaseConfig();
+	//连接socket
+	const wsClient = createWebSocket(sharedWsUrl);
   const subscription = wsClient.dataOb.subscribe((data) => {
-    if (data.type === "cmd") {
-      const cmdInfo = getTxnRecord(data.data.commandId, "task");
-      if (cmdInfo) {
-		if (
-			cmdInfo.command === "openDoor" ||
-			cmdInfo.command === "closeDoor" ||
-			cmdInfo.command === "startShakeUp" ||
-			cmdInfo.command === "injectFluid" ||
-			cmdInfo.command === "moveToActionArea" ||
-			cmdInfo.command === "moveToHeatArea"
-		) {
-			setOnGoingStatus("idle");
-		}
+		if (data.type === "cmd") {
+			const cmdInfo = getTxnRecord(data.data.commandId, "task");
+			if (cmdInfo) {
+				if (
+					cmdInfo.command === "openDoor" ||
+					cmdInfo.command === "closeDoor" ||
+					cmdInfo.command === "startShakeUp" ||
+					cmdInfo.command === "injectFluid" ||
+					cmdInfo.command === "moveToActionArea" ||
+					cmdInfo.command === "moveToHeatArea"
+				) {
+					setOnGoingStatus("idle");
+				}
         const command:any = cmdInfo.command;
-        //@ts-ignore
-        const cmdName = CmdDescMap[command];
+				//@ts-ignore
+				const cmdName = CmdDescMap[command];
         const result = data.data.success
           ? "执行完毕"
           : `执行失败 ${data.data.message}`;
-        ElMessage({
-          message: `${cmdName} ${result}`,
-          type: data.data.success ? "success" : "error",
-        });
-      }
+				ElMessage({
+					message: `${cmdName} ${result}`,
+					type: data.data.success ? "success" : "error",
+				});
+			}
     }else if(data.type === "status"){
-      let allStatusData = data.data;
-      if (!R.equals(allStatusData, deviceData)) {
-        deviceData = allStatusData;
-      }
-    }
-  });
-  wsClient.connect();
+			let allStatusData = data.data;
+			if (!R.equals(allStatusData, deviceData)) {
+				deviceData = allStatusData;
+			}
+		}
+	});
+	wsClient.connect();
   getIngTask().then((res:any) => {
     if(!res.success) return;
-    taskId.value = res.data?.id;
-  });
+		taskId.value = res.data?.id;
+	});
 	onUnmounted(() => {
 		subscription.unsubscribe();
 	});
@@ -216,7 +215,7 @@ const onSelectedTray = (heatAreaItem: any, type: string) => {
 			heatAreaItem.isSelect = true;
 			selectedTrayList.value.push(heatAreaItem);
 		}
-    onHeadleCraft(heatAreaItem);
+		onHeadleCraft(heatAreaItem);
 	} else {
 		heatAreaItem.isSelect = true;
 	}
@@ -224,37 +223,37 @@ const onSelectedTray = (heatAreaItem: any, type: string) => {
 
 const initHeatList = () => {
   heatList.value = settingStore.heatAreaConfig.map((item:any) => {
-    //添加一个字段，默认为未选中
-    item.isSelect = false;
+		//添加一个字段，默认为未选中
+		item.isSelect = false;
     heatAearStatusList.value.forEach((areaItem:any) => {
       if(areaItem.hardwareId == item.hardwareId){
-        item = {
+				item = {
           ...item, 
           heatAearStatus:areaItem
         }
-      }
+			}
     })
-    return item;
-  });
+		return item;
+	});
 }
 
 const updateHeatList = () => {
-  const selectedIds = selectedTrayList.value.map((item: any) => item.id);
+	const selectedIds = selectedTrayList.value.map((item: any) => item.id);
   heatList.value = heatList.value.map((item:any) => {
-    //添加一个字段，默认为未选中
+		//添加一个字段，默认为未选中
     heatAearStatusList.value.forEach((areaItem:any) => {
       if(areaItem.hardwareId == item.hardwareId){
-        item = {
+				item = {
           ...item, 
           heatAearStatus:areaItem
         }
-      }
+			}
     })
     if(selectedIds.includes(item.id)){
-      item.isSelect = true;
-    }
-    return item;
-  });
+			item.isSelect = true;
+		}
+		return item;
+	});
   console.log('heatList.value---', heatList.value)
 }
 
@@ -263,13 +262,13 @@ let hasCraftInfo = ref(false);
 const onHeadleCraft = (areaItem: any) => {
 	if (areaItem.executing_craft && areaItem.isSelect) {
 		hasCraftInfo.value = true;
-    craftName.value = "暂停工艺";
-    exeCraftName.value = "停止工艺";
+		craftName.value = "暂停工艺";
+		exeCraftName.value = "停止工艺";
 	}else{
-    hasCraftInfo.value = false;
-    craftName.value = "选择工艺";
-    exeCraftName.value = "执行工艺";
-  }
+		hasCraftInfo.value = false;
+		craftName.value = "选择工艺";
+		exeCraftName.value = "执行工艺";
+	}
 };
 
 //设置加热区温度
@@ -345,9 +344,9 @@ const onAddLiquid = () => {
 	//检查加液区是否有托盘。
 	const liquidArea = statusStore.status?.liquidArea;
 	if (liquidArea.liquidTray) {
-    liquidVisible.value = true;
+		liquidVisible.value = true;
 	} else {
-    ElMessage.error("加液区未检测到托盘，无法进行加液操作");
+		ElMessage.error("加液区未检测到托盘，无法进行加液操作");
 	}
 };
 
@@ -379,25 +378,25 @@ const changeVisible = () => {
 
 //选择工艺
 const onChooseCaft = () => {
-  //判断是选择工艺还是暂停工艺
+	//判断是选择工艺还是暂停工艺
   let isPause = false
   selectedTrayList.value.forEach((item:any) => {
-    //有工艺且正在执行可操作【暂停】
+		//有工艺且正在执行可操作【暂停】
     if(item.craftInfo && item.craftInfo.status == 1){
       craftPause({heatId:item.id}).then(res => {
         ElMessage.success('暂停指令已发送')
       })
-      isPause = true;
-    }
+			isPause = true;
+		}
   })
   if(!isPause){
-    //1、是否选择了加热区
-    if (!selectedTrayList.value.length) {
-      ElMessage.error("请选择目标加热区");
-      return;
-    }
-    craftVisible.value = true;
-  }
+		//1、是否选择了加热区
+		if (!selectedTrayList.value.length) {
+			ElMessage.error("请选择目标加热区");
+			return;
+		}
+		craftVisible.value = true;
+	}
 	
 };
 
@@ -430,11 +429,11 @@ const onMoveToHeat = () => {
 		return;
 	}
   
-  //3、判断加液区有没有托盘
+	//3、判断加液区有没有托盘
   if(!deviceData.liquidArea.liquidTray){
-    ElMessage.error("加液区没有托盘");
-    return;
-  }
+		ElMessage.error("加液区没有托盘");
+		return;
+	}
 	let selectedDataItem = selectedTrayList.value[0];
 	//2、判断选择的加热区是否已经有了试管架, 加热区是否有试管是通过设备上报的数据获取的
 	let hardwareId = selectedDataItem.hardwareId;
@@ -479,7 +478,7 @@ const onMoveToHeat = () => {
 	// 	item.color = "";
 	// 	item.default = "";
 	// });
-  // console.log('list--222-', list)
+	// console.log('list--222-', list)
 	// heatList.value = [...list];
 };
 
@@ -497,11 +496,11 @@ const onMoveToOperationArea = () => {
 		ElMessage.error("只能选择一个加热区");
 		return false;
 	}
-  //3、判断加液区有没有托盘
+	//3、判断加液区有没有托盘
   if(deviceData && deviceData.liquidArea.liquidTray){
-    ElMessage.error("加液区已存在托盘");
-    return;
-  }
+		ElMessage.error("加液区已存在托盘");
+		return;
+	}
 
 	let selectedDataItem = selectedTrayList.value[0];
   console.log('selectedDataItem----', selectedDataItem)
@@ -568,7 +567,10 @@ const onMoveToSpecial = () => {
 const taskNameVisible = ref(false);
 const taskId = ref();
 const onSave = () => {
-	if (!taskName.value) return;
+	if (!taskName.value) { 
+		ElMessage.error('请输入实验名称');
+		return; 
+	}
 	const params = {
 		name: taskName.value,
 	};