From dae69f88983b4191a8492a81d3c2a9c15e212b5b Mon Sep 17 00:00:00 2001
From: zhangjiming <zhangjiming@costrip.cn>
Date: Fri, 17 Jan 2025 20:53:44 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96tip=E6=8F=90=E7=A4=BA?=
 =?UTF-8?q?=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/Index/History.vue                        |  16 +-
 src/pages/Index/Index.vue                          |  27 +-
 src/pages/Index/Regular/Consumables.vue            |  18 +-
 src/pages/Index/Regular/Emergency.vue              |  10 +-
 src/pages/Index/Regular/TestTube.vue               |  57 +--
 src/pages/Index/Settings/Device.vue                |  14 +-
 src/pages/Index/TestTube/TubeUserId.vue            |  16 +-
 .../Index/components/Setting/UpdatePinModal.vue    | 555 +++++++++++----------
 src/pages/Index/utils/index.ts                     |  36 ++
 src/style.css                                      |   7 +-
 10 files changed, 390 insertions(+), 366 deletions(-)

diff --git a/src/pages/Index/History.vue b/src/pages/Index/History.vue
index a0e3e8c..1618c2d 100644
--- a/src/pages/Index/History.vue
+++ b/src/pages/Index/History.vue
@@ -134,10 +134,10 @@ import {
 } from '../../services/Index/index'
 import HistoryMessage from './components/History/HistoryMessage.vue' 
 import type { TableItem } from '../../types/Index'
-import { ElMessage } from 'element-plus'
 import WarnSvg from '@/assets/Index/History/warn.svg'
 import PrintSvg from '@/assets/Index/History/print.svg'
 import ErrorSvg from '@/assets/Warn.svg'
+import { eMessage } from './utils'
 // 添加表格引用
 const historyTableRef = ref()
 
@@ -356,16 +356,6 @@ const handleCancel = () => {
   showWarn.value = false
 }
 
-// 自定义 ElMessage 样式
-const showCustomMessage = (message: string, type: 'success' | 'error' = 'success') => {
-  ElMessage({
-    message,
-    type,
-    customClass: 'custom-message',
-    duration: 2000,
-  })
-}
-
 // 处理删除确认
 const handleConfirmDelete = async () => {
   try {
@@ -386,9 +376,9 @@ const handleConfirmDelete = async () => {
       historyTableRef.value.clearSelection()
     }
 
-    showCustomMessage('删除成功')
+    eMessage.success('删除成功')
   } catch (error) {
-    showCustomMessage('删除失败', 'error')
+    eMessage.error('删除失败')
   } finally {
     showModal.value = false
   }
diff --git a/src/pages/Index/Index.vue b/src/pages/Index/Index.vue
index 312c6db..bb47b0d 100644
--- a/src/pages/Index/Index.vue
+++ b/src/pages/Index/Index.vue
@@ -224,7 +224,7 @@
 <script setup lang="ts">
 import { useRouter } from 'vue-router'
 import { ref, onMounted } from 'vue'
-import { ElMessage, ElDialog } from 'element-plus'
+import { ElDialog } from 'element-plus'
 import { Time, InitWarn, LoadingModal } from './components/Consumables'
 import {
   startWork,
@@ -266,6 +266,7 @@ import { eventBus } from '../../eventBus'
 import { logout } from '@/services/Login/login'
 import { useRunningStore } from '@/store/modules/running'
 import { formatDate } from '@/utils/formDate'
+import { eMessage } from './utils'
 
 const selectedTab = ref(sessionStorage.getItem('selectedTab') || '常规')
 const lineWidth = ref(0)
@@ -503,11 +504,7 @@ const startTest = async () => {
       res &&
         res.data &&
         res.data.info &&
-        ElMessage({
-          message: res.data.info,
-          type: 'error',
-          duration: 2000,
-        })
+        eMessage.error(res.data.info)
     }
   } catch (error) {
     console.error('开始测试失败:', error)
@@ -525,11 +522,7 @@ const pauseTest = async () => {
     res &&
       res.data &&
       res.data.info &&
-      ElMessage({
-        message: res.data.info,
-        type: 'error',
-        duration: 2000,
-      })
+      eMessage.error(res.data.info)
   }
 }
 
@@ -544,11 +537,7 @@ const stopTest = async () => {
     res &&
       res.data &&
       res.data.info &&
-      ElMessage({
-        message: res.data.info,
-        type: 'error',
-        duration: 2000,
-      })
+      eMessage.error(res.data.info)
   }
 }
 //继续测试
@@ -562,11 +551,7 @@ const continueTest = async () => {
     res &&
       res.data &&
       res.data.info &&
-      ElMessage({
-        message: res.data.info,
-        type: 'error',
-        duration: 2000,
-      })
+      eMessage.error(res.data.info)
   }
 }
 const handleConfirm = async () => {
diff --git a/src/pages/Index/Regular/Consumables.vue b/src/pages/Index/Regular/Consumables.vue
index a39f292..26a7203 100644
--- a/src/pages/Index/Regular/Consumables.vue
+++ b/src/pages/Index/Regular/Consumables.vue
@@ -128,8 +128,8 @@ import { useDeviceStore } from '@/store/index'
 import { eventBus } from '@/eventBus'
 import InitWarn from '../components/Consumables/Warn/InitWarn.vue'
 import { formatScanReports } from '@/utils/errorHandler'
-import { ElMessage } from 'element-plus'
 import { Subject, throttleTime } from 'rxjs'
+import { eMessage } from '../utils'
 
 const consumableStore = useConsumablesStore()
 const emergencyStore = useEmergencyStore()
@@ -137,7 +137,7 @@ const deviceStore = useDeviceStore()
 
 const errMsg$ = new Subject<string>()
 errMsg$.pipe(throttleTime(800)).subscribe((msg) => {
-  ElMessage.error(msg)
+  eMessage.error(msg)
 })
 // 扫描耗材中
 const isLoading = ref(false)
@@ -164,7 +164,7 @@ const emergencyInfo = ref(emergencyStore.$state.emergencyInfo)
 const handleConfirmScan = () => {
   showScanResults.value = false
   if (formattedReports.value.some((report) => report.isError)) {
-    ElMessage.warning('存在错误，请检查耗材')
+    eMessage.warning('存在错误，请检查耗材')
   }
 }
 const confirmWarn = () => {
@@ -181,7 +181,7 @@ onActivated(() => {
 
 const handleIsLoad = async () => {
   if (deviceStore.deviceState.workState === 'WORKING') {
-    ElMessage.error('设备正在运行中，不可操作耗材')
+    eMessage.error('设备正在运行中，不可操作耗材')
     return
   }
   const res = await getInitState()
@@ -211,17 +211,17 @@ const handleIsLoad = async () => {
       // 显示扫描结果弹窗
       showScanResults.value = true
     } else {
-      ElMessage.error(res.data.info)
+      res.data && res.data.info && eMessage.error(res.data.info)
     }
   } catch (error) {
     isLoading.value = false
-    ElMessage.error('加载耗材失败')
+    eMessage.error('加载耗材失败')
   }
 }
 
 const handleUnloadAll = async () => {
   if (deviceStore.deviceState.workState === 'WORKING') {
-    ElMessage.error('设备正在运行中，不可操作耗材')
+    eMessage.error('设备正在运行中，不可操作耗材')
     return
   }
   const res = await unloadAllConsumable()
@@ -232,14 +232,14 @@ const handleUnloadAll = async () => {
 
 const handleUnloadConsumable = async (index: number) => {
   if (deviceStore.deviceState.workState === 'WORKING') {
-    ElMessage.error('设备正在运行中，不可操作耗材')
+    eMessage.error('设备正在运行中，不可操作耗材')
     return
   }
   const res = await unloadConsumable({
     group: `CG${index + 1}` as ConsumableGroupNo,
   })
   if (!res.success && res.data.info) {
-    ElMessage.error(res.data.info)
+    eMessage.error(res.data.info)
   }
 }
 
diff --git a/src/pages/Index/Regular/Emergency.vue b/src/pages/Index/Regular/Emergency.vue
index 546f085..248c751 100644
--- a/src/pages/Index/Regular/Emergency.vue
+++ b/src/pages/Index/Regular/Emergency.vue
@@ -104,7 +104,7 @@ import {
 } from '@/store'
 import type { AddEmergencyInfo } from '@/types/Index'
 import type { BloodType, ReactionPlateGroup } from '@/websocket/socket'
-import { ElMessage } from 'element-plus'
+import { eMessage } from '../utils'
 
 defineOptions({
   name: 'EmergencyForm',
@@ -153,23 +153,23 @@ const goBack = () => {
 const confirmHandle = async () => {
   //设备运行状态不能添加急诊
   if (deviceStore.deviceState.workState === 'WORKING') {
-    ElMessage.error('设备正在运行，无法添加急诊')
+    eMessage.error('设备正在运行，无法添加急诊')
     return
   }
   const emergencyInfo = emergencyPosition.value
   if (emergencyInfo.projIds.length === 0) {
-    ElMessage.error('请选择项目')
+    eMessage.error('请选择项目')
     return
   }
   if (!emergencyInfo.bloodType) {
-    ElMessage.error('请选择血液类型')
+    eMessage.error('请选择血液类型')
     return
   }
   const res = await insertEmergency(emergencyPosition.value)
   if (res && res.success) {
     goBack()
   } else {
-    res && res.data && res.data.info && ElMessage.error(res.data.info)
+    res && res.data && res.data.info && eMessage.error(res.data.info)
   }
 }
 
diff --git a/src/pages/Index/Regular/TestTube.vue b/src/pages/Index/Regular/TestTube.vue
index aa192c8..e40b18c 100644
--- a/src/pages/Index/Regular/TestTube.vue
+++ b/src/pages/Index/Regular/TestTube.vue
@@ -94,8 +94,9 @@ import {
   useTestTubeStore,
   useSettingTestTubeStore,
 } from '../../../store'
-import { ElMessage, ElDialog } from 'element-plus'
+import { ElDialog } from 'element-plus'
 import { BloodType, ReactionPlateGroup, TestTubeRack } from '@/websocket/socket'
+import { eMessage } from '../utils'
 
 const router = useRouter()
 
@@ -177,10 +178,7 @@ const projIdCntMap = computed(() => {
 const handleChangeUser = async (index: number) => {
   const rack = testTubeStore.tubeRacks[index]
   if (rack.state !== 'INACTIVE') {
-    ElMessage({
-      message: '试管架处理激活状态，不可修改',
-      type: 'error',
-    })
+    eMessage.error('试管架处理激活状态，不可修改')
     return
   }
   testTubeStore.setTubeRack(rack)
@@ -201,15 +199,9 @@ const confirmDeleteTube = async () => {
   deleteRackDialogVisible.value = false
   const res = await deleteTube(confirmDeleteRackUuid!)
   if (res.success) {
-    ElMessage({
-      message: '删除成功',
-      type: 'success',
-    })
+    eMessage.success('删除成功')
   } else {
-    ElMessage({
-      message: '删除失败',
-      type: 'error',
-    })
+    eMessage.error('删除失败')
   }
 }
 
@@ -217,10 +209,7 @@ const confirmDeleteTube = async () => {
 const deleteTubeRack = async (idx: number) => {
   const rack = testTubeStore.tubeRacks[idx]
   if (rack.state !== 'INACTIVE') {
-    ElMessage({
-      message: '试管架处理激活状态，不可删除',
-      type: 'error',
-    })
+    eMessage.error('试管架处理激活状态，不可删除')
     return
   }
   confirmDeleteRackUuid = rack.uuid
@@ -238,10 +227,7 @@ const addTubeRack = async () => {
   if (response && response.success) {
     // do nothing
   } else {
-    ElMessage({
-      message: '试管架添加失败',
-      type: 'error',
-    })
+    eMessage.error('试管架添加失败')
   }
   loading.value = false
 }
@@ -250,17 +236,14 @@ const addTubeRack = async () => {
 const handleActivateChange = async (index: number) => {
   const rack = testTubeStore.tubeRacks[index]
   if (rack.state === 'LOCKED') {
-    ElMessage({
-      message: '试管已锁定，不能修改',
-      type: 'error',
-    })
+    eMessage.error('试管已锁定，不能修改')
     return
   }
   let destState = rack.state === 'INACTIVE' ? 'ACTIVE' : 'INACTIVE'
-  if (destState === 'ACTIVE' && !existValidProject(rack)) {
-    ElMessage.error('请为试管配置检测项目')
-    return
-  }
+  // if (destState === 'ACTIVE' && !existValidProject(rack)) {
+  //   eMessage.error('请为试管配置检测项目')
+  //   return
+  // }
   const res = await updateTubeActivationStatus({
     uuid: rack.uuid,
     active: destState === 'ACTIVE',
@@ -268,24 +251,18 @@ const handleActivateChange = async (index: number) => {
   if (res.success) {
     // do nothing
   } else {
-    ElMessage({
-      message: '更改激活状态失败',
-      type: 'error',
-    })
+    eMessage.error('更改激活状态失败')
   }
 }
 
 const updateTubeSettings = async (rackIdx: number, tubeIdx: number) => {
   if (!selectedBloodTypeKey.value) {
-    ElMessage.error('请选择血液类型')
+    eMessage.error('请选择血液类型')
     return
   }
   const rack = testTubeStore.tubeRacks[rackIdx]
   if (rack.state !== 'INACTIVE') {
-    ElMessage({
-      message: '试管架已激活，不能修改',
-      type: 'error',
-    })
+    eMessage.error('试管架已激活，不能修改')
     return
   }
   if (tubeIdx < rack.tubeSettings.length) {
@@ -303,11 +280,11 @@ const updateTubeSettings = async (rackIdx: number, tubeIdx: number) => {
       if (response.success) {
         // do nothing
       } else {
-        ElMessage.error('设置更新失败')
+        eMessage.error('设置更新失败')
       }
     } catch (error) {
       console.error('更新试管设置失败:', error)
-      ElMessage.error('设置更新失败')
+      eMessage.error('设置更新失败')
     }
   }
 }
diff --git a/src/pages/Index/Settings/Device.vue b/src/pages/Index/Settings/Device.vue
index 3a4ab52..f9b0710 100644
--- a/src/pages/Index/Settings/Device.vue
+++ b/src/pages/Index/Settings/Device.vue
@@ -57,7 +57,7 @@
 import { ref, computed, onMounted } from 'vue'
 import { format } from 'date-fns'
 import { getSystemSettings, setLanguage, setAutoPrint, setAutoLogout } from '../../../services/Index/settings/settings'
-import { ElMessage } from 'element-plus'
+import { eMessage } from '../utils';
 
 // 系统设置状态
 interface Settings {
@@ -125,7 +125,7 @@ const fetchSettings = async () => {
       console.log('Current language:', settings.value.language)
     }
   } catch (error) {
-    ElMessage.error('获取系统设置失败')
+    eMessage.error('获取系统设置失败')
   }
 }
 
@@ -147,10 +147,10 @@ const updateSetting = async (key: string, value: any) => {
 
     if (res?.success) {
       settings.value = { ...settings.value, [key]: value }
-      ElMessage.success('设置更新成功')
+      eMessage.success('设置更新成功')
     }
   } catch (error) {
-    ElMessage.error('设置更新失败')
+    eMessage.error('设置更新失败')
   }
 }
 
@@ -168,7 +168,7 @@ const handleLogoutTime = async (time: number) => {
       if (res?.success) {
         settings.value.autoLogout = false
         settings.value.logoutTime = 0
-        ElMessage.success('设置更新成功')
+        eMessage.success('设置更新成功')
       }
     } else {
       // 选择新时间
@@ -176,11 +176,11 @@ const handleLogoutTime = async (time: number) => {
       if (res?.success) {
         settings.value.autoLogout = true
         settings.value.logoutTime = time
-        ElMessage.success('设置更新成功')
+        eMessage.success('设置更新成功')
       }
     }
   } catch (error) {
-    ElMessage.error('设置更新失败')
+    eMessage.error('设置更新失败')
   }
 }
 
diff --git a/src/pages/Index/TestTube/TubeUserId.vue b/src/pages/Index/TestTube/TubeUserId.vue
index f99d387..87165d0 100644
--- a/src/pages/Index/TestTube/TubeUserId.vue
+++ b/src/pages/Index/TestTube/TubeUserId.vue
@@ -84,20 +84,20 @@
   </div>
 </template>
 
-<script setup>
-import { computed, onActivated, ref, watch } from 'vue'
+<script setup lang="ts">
+import { ref } from 'vue'
 import { useRouter } from 'vue-router'
 import * as R from 'ramda'
-import { useTestTubeStore, useConsumablesStore } from '../../../store'
+import { useTestTubeStore } from '../../../store'
 import { eventBus } from '../../../eventBus'
 import SimpleKeyboard from '../../../components/SimpleKeyboard.vue'
 import Tube from '../components/TestTube/Tube.vue'
 import { updateTubeConfig } from '../../../services'
-import { ElMessage } from 'element-plus'
+import { eMessage } from '../utils'
+import { TubeSetting } from '@/websocket/socket'
 
 const router = useRouter()
 
-const consumables = useConsumablesStore()
 const tubeStore = useTestTubeStore()
 
 defineOptions({
@@ -110,9 +110,9 @@ const tubeGroups = ref([
 
 const keyboardVisible = ref(false)
 const currentInputValue = ref('')
-const currentInput = ref({
+const currentInput = ref<{type: string; item?: TubeSetting}>({
   type: 'barcode',
-  item: null,
+  item: undefined,
 })
 
 const isFocused = (type, item) => {
@@ -144,7 +144,7 @@ const confirmChange = async () => {
     eventBus.emit('AppTubeSettingUpdateEvent');
     goBack()
   } else {
-    ElMessage.error('更新失败')
+    eMessage.error('更新失败')
   }
 }
 
diff --git a/src/pages/Index/components/Setting/UpdatePinModal.vue b/src/pages/Index/components/Setting/UpdatePinModal.vue
index c50c15a..860b4cf 100644
--- a/src/pages/Index/components/Setting/UpdatePinModal.vue
+++ b/src/pages/Index/components/Setting/UpdatePinModal.vue
@@ -1,290 +1,321 @@
 <template>
-    <teleport to="body">
-      <div v-if="visible" class="modal-overlay">
-        <div class="modal-container">
-          <div class="modal-header"></div>
-          <div class="modal-title">
-            <span class="title-text">请输入 PIN 码</span>
-          </div>
-          <div class="modal-body">
-            <div class="input-container">
-              <div>
-                <input :type="showoldpasswd?'text':'password'" v-model="oldpasswd" placeholder="输入旧PIN码" @focus="showKeyboard('oldpasswd')" class="pin-input" />
-                <el-icon class="pwd-view" @click="showoldpasswd = !showoldpasswd"><View /></el-icon>
-              </div>
-              <br/>
-              <div>
-                <input :type="showPassword?'text':'password'" v-model="password " placeholder="输入新PIN 码" @focus="showKeyboard('password')" class="pin-input" />
-                <el-icon class="pwd-view" @click="showPassword = !showPassword"><View /></el-icon>
-              </div>
-              <br/>
-              <div>
-                <input :type="showConfirmPassword?'text':'password'" v-model="confirmPassword " placeholder="输入确认新PIN 码" @focus="showKeyboard('confirmPassword')" class="pin-input" />
-                <el-icon class="pwd-view" @click="showConfirmPassword = !showConfirmPassword"><View /></el-icon>
-              </div>
+  <teleport to="body">
+    <div v-if="visible" class="modal-overlay">
+      <div class="modal-container">
+        <div class="modal-header"></div>
+        <div class="modal-title">
+          <span class="title-text">请输入 PIN 码</span>
+        </div>
+        <div class="modal-body">
+          <div class="input-container">
+            <div>
+              <input
+                :type="showoldpasswd ? 'text' : 'password'"
+                v-model="oldpasswd"
+                placeholder="输入旧PIN码"
+                @focus="showKeyboard('oldpasswd')"
+                class="pin-input"
+              />
+              <el-icon class="pwd-view" @click="showoldpasswd = !showoldpasswd"
+                ><View
+              /></el-icon>
+            </div>
+            <br />
+            <div>
+              <input
+                :type="showPassword ? 'text' : 'password'"
+                v-model="password"
+                placeholder="输入新PIN 码"
+                @focus="showKeyboard('password')"
+                class="pin-input"
+              />
+              <el-icon class="pwd-view" @click="showPassword = !showPassword"
+                ><View
+              /></el-icon>
+            </div>
+            <br />
+            <div>
+              <input
+                :type="showConfirmPassword ? 'text' : 'password'"
+                v-model="confirmPassword"
+                placeholder="输入确认新PIN 码"
+                @focus="showKeyboard('confirmPassword')"
+                class="pin-input"
+              />
+              <el-icon
+                class="pwd-view"
+                @click="showConfirmPassword = !showConfirmPassword"
+                ><View
+              /></el-icon>
             </div>
-          </div>
-          <div class="modal-footer">
-            <el-button @click="cancel">取消</el-button>
-            <el-button type="primary" @click="confirmPin" :loading="loading">确认</el-button>
           </div>
         </div>
+        <div class="modal-footer">
+          <el-button @click="cancel">取消</el-button>
+          <el-button type="primary" @click="confirmPin" :loading="loading"
+            >确认</el-button
+          >
+        </div>
+      </div>
 
+      <InitWarn
+        v-if="showErrorModal"
+        :visible="showErrorModal"
+        title="错误提示"
+        message="两次输入的密码不一致"
+        icon="/src/assets/Warn.svg"
+        confirmText="确认"
+        @confirm="showErrorModal = false"
+      />
+      <!-- 键盘 -->
+      <transition name="slide-up">
+        <div class="keyboard" v-if="keyboardVisible">
+          <SimpleKeyboard
+            :input="currentInputValue"
+            @onChange="handleKeyboardInput"
+            @onKeyPress="handleKeyPress"
+          />
+        </div>
+      </transition>
+    </div>
+  </teleport>
+</template>
 
-        <InitWarn
-          v-if="showErrorModal"
-          :visible="showErrorModal"
-          title="错误提示"
-          message="两次输入的密码不一致"
-          icon="/src/assets/Warn.svg"
-          confirmText="确认"
-          @confirm="showErrorModal = false"
-        />
-         <!-- 键盘 -->
-        <transition name="slide-up">
-          <div class="keyboard" v-if="keyboardVisible">
-            <SimpleKeyboard :input="currentInputValue" @onChange="handleKeyboardInput" @onKeyPress="handleKeyPress" />
-          </div>
-        </transition>
-      </div>
-    </teleport>
-  </template>
-  
-  <script setup lang="ts">
-  import { ref } from 'vue'
-  import {  InitWarn } from '../../components/Consumables'
-  import { ElMessage } from 'element-plus';
-  defineProps<{ visible: boolean; loading: boolean }>()
-  const emit = defineEmits<{
-    (e: 'confirm', pin: {oldpasswd:string, password:string}): void
-    (e: 'cancel'): void
-  }>()
-  
-  const showErrorModal = ref(false)
-  const showoldpasswd = ref(false)
-  const showPassword = ref(false)
-  const showConfirmPassword = ref(false)
-  const oldpasswd = ref('')
-  const password  = ref('')
-  const confirmPassword = ref('')
-  
-  const confirmPin = () => {
-    if(!oldpasswd.value){
-      ElMessage.error('请输入旧密码');
-      return;
-    }
-    if(!password.value){
-      ElMessage.error('请输入新密码');
-      return;
-    }
-    if(!confirmPassword.value){
-      ElMessage.error('请确认新密码');
-      return;
-    }
-    
-    if(password.value != confirmPassword.value){
-      // showErrorModal.value = true;
-      ElMessage.error('两次输入的密码不一致');
-      return;
-    }
-    const params = {
-      oldpasswd: oldpasswd.value,
-      password: password.value
-    }
-    emit('confirm', params)
+<script setup lang="ts">
+import { ref } from 'vue'
+import { InitWarn } from '../../components/Consumables'
+import { eMessage } from '../../utils'
+defineProps<{ visible: boolean; loading: boolean }>()
+const emit = defineEmits<{
+  (e: 'confirm', pin: { oldpasswd: string; password: string }): void
+  (e: 'cancel'): void
+}>()
+
+const showErrorModal = ref(false)
+const showoldpasswd = ref(false)
+const showPassword = ref(false)
+const showConfirmPassword = ref(false)
+const oldpasswd = ref('')
+const password = ref('')
+const confirmPassword = ref('')
+
+const confirmPin = () => {
+  if (!oldpasswd.value) {
+    eMessage.error('请输入旧密码')
+    return
+  }
+  if (!password.value) {
+    eMessage.error('请输入新密码')
+    return
+  }
+  if (!confirmPassword.value) {
+    eMessage.error('请确认新密码')
+    return
   }
 
-  // 键盘相关状态
-  const keyboardVisible = ref(false)
-  const currentInputValue = ref('')
-  const currentInputField = ref<'oldpasswd' | 'password' | 'confirmPassword' | ''>('')
-  
-  // 隐藏键盘
-  const hideKeyboard = () => {
-    keyboardVisible.value = false
-    currentInputField.value = ''
-    currentInputValue.value = ''
+  if (password.value != confirmPassword.value) {
+    // showErrorModal.value = true;
+    eMessage.error('两次输入的密码不一致')
+    return
   }
-  
-  // 显示键盘
-  const showKeyboard = (field:any) => {
-    // 清空当前输入值，避免累加
-    // currentInputValue.value = ''
-    if(field == 'oldpasswd'){
-      currentInputValue.value = oldpasswd.value
-    }
-    if(field == 'password'){
-      currentInputValue.value = password.value
-    }
-    if(field == 'confirmPassword'){
-      currentInputValue.value = confirmPassword.value
-    }
-    currentInputField.value = field
-    keyboardVisible.value = true
+  const params = {
+    oldpasswd: oldpasswd.value,
+    password: password.value,
   }
-  
-  // 处理键盘输入
-  const handleKeyboardInput = (value: string) => {
-    // 更新当前输入值
-    currentInputValue.value = value
-    // 更新对应字段的值
+  emit('confirm', params)
+}
 
-    if (currentInputField.value === 'oldpasswd') {
-      oldpasswd.value = value
-    } else if(currentInputField.value == 'password'){
-      password.value = value
-    }else if(currentInputField.value == 'confirmPassword'){
-      confirmPassword.value = value
-    }
+// 键盘相关状态
+const keyboardVisible = ref(false)
+const currentInputValue = ref('')
+const currentInputField = ref<
+  'oldpasswd' | 'password' | 'confirmPassword' | ''
+>('')
+
+// 隐藏键盘
+const hideKeyboard = () => {
+  keyboardVisible.value = false
+  currentInputField.value = ''
+  currentInputValue.value = ''
+}
+
+// 显示键盘
+const showKeyboard = (field: any) => {
+  // 清空当前输入值，避免累加
+  // currentInputValue.value = ''
+  if (field == 'oldpasswd') {
+    currentInputValue.value = oldpasswd.value
   }
-  
-  // 处理键盘按键
-  const handleKeyPress = (button: string) => {
-    if (button === '{enter}') {
-      hideKeyboard()
-    } else if (button === '{bksp}') {
-      // 处理退格键
-      const value = currentInputValue.value
-      if (value.length > 0) {
-        const newValue = value.slice(0, -1)
-        handleKeyboardInput(newValue)
-      }
-    }
+  if (field == 'password') {
+    currentInputValue.value = password.value
   }
-  
-  
-  const cancel = () => {
-    emit('cancel')
+  if (field == 'confirmPassword') {
+    currentInputValue.value = confirmPassword.value
   }
-  </script>
-  
-  <style scoped lang="less">
-  /* 样式与 AddUserModal 类似 */
-  .modal-overlay {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background-color: rgba(0, 0, 0, 0.5);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    z-index: 1000;
+  currentInputField.value = field
+  keyboardVisible.value = true
+}
+
+// 处理键盘输入
+const handleKeyboardInput = (value: string) => {
+  // 更新当前输入值
+  currentInputValue.value = value
+  // 更新对应字段的值
+
+  if (currentInputField.value === 'oldpasswd') {
+    oldpasswd.value = value
+  } else if (currentInputField.value == 'password') {
+    password.value = value
+  } else if (currentInputField.value == 'confirmPassword') {
+    confirmPassword.value = value
+  }
+}
+
+// 处理键盘按键
+const handleKeyPress = (button: string) => {
+  if (button === '{enter}') {
+    hideKeyboard()
+  } else if (button === '{bksp}') {
+    // 处理退格键
+    const value = currentInputValue.value
+    if (value.length > 0) {
+      const newValue = value.slice(0, -1)
+      handleKeyboardInput(newValue)
+    }
   }
-  
-  .modal-overlay {
-    position: fixed;
+}
+
+const cancel = () => {
+  emit('cancel')
+}
+</script>
+
+<style scoped lang="less">
+/* 样式与 AddUserModal 类似 */
+.modal-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  z-index: 1000;
+}
+
+.modal-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  z-index: 1000;
+}
+
+.modal-container {
+  background-color: #fff;
+  border-radius: 10px;
+  width: 833px;
+  height: 633px;
+  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  position: relative;
+
+  .modal-header {
+    background-color: #528dfe;
+    height: 8px;
+    position: absolute;
     top: 0;
     left: 0;
     width: 100%;
-    height: 100%;
-    background-color: rgba(0, 0, 0, 0.5);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    z-index: 1000;
   }
-  
-  .modal-container {
-    background-color: #fff;
-    border-radius: 10px;
-    width: 833px;
-    height: 633px;
-    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
-    overflow: hidden;
+
+  .modal-title {
+    text-align: center;
+    margin-top: 15px;
+    font-size: 32px;
+    color: #528dfe;
+    font-weight: bold;
+  }
+
+  .modal-body {
     display: flex;
-    flex-direction: column;
     justify-content: center;
-    position: relative;
-  
-    .modal-header {
-      background-color: #528dfe;
-      height: 8px;
-      position: absolute;
-      top: 0;
-      left: 0;
+    padding: 20px;
+
+    .input-container {
+      position: relative;
       width: 100%;
-    }
-  
-    .modal-title {
-      text-align: center;
-      margin-top: 15px;
-      font-size: 32px;
-      color: #528dfe;
-      font-weight: bold;
-    }
-  
-    .modal-body {
-      display: flex;
-      justify-content: center;
-      padding: 20px;
-  
-      .input-container {
-        position: relative;
+
+      .pin-input {
+        box-sizing: border-box;
         width: 100%;
-  
-        .pin-input {
-          box-sizing: border-box;
-          width: 100%;
-          font-size: 32px;
-          padding: 20px 80px;
-          color: #b0b0b0;
-          border: 1px solid #e0e0e0;
-          border-radius: 25px;
-          outline: none;
-  
-          &:focus {
-            border-color: #528dfe;
-            color: #528dfe;
-          }
-        }
-      }
-    }
-  
-    .modal-footer {
-      display: flex;
-      justify-content: space-around;
-      padding: 20px;
-      box-sizing: border-box;
-  
-      button {
-        width: 200px;
-        height: 80px;
         font-size: 32px;
-        border-radius: 30px;
+        padding: 20px 80px;
+        color: #b0b0b0;
+        border: 1px solid #e0e0e0;
+        border-radius: 25px;
+        outline: none;
+
+        &:focus {
+          border-color: #528dfe;
+          color: #528dfe;
+        }
       }
     }
   }
-  
-  .keyboard {
-    position: fixed;
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    height: 300px;
-    background-color: #f5f7fa;
-    border-top-left-radius: 16px;
-    border-top-right-radius: 16px;
-    box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.1);
-    z-index: 1000;
-  }
-  // 键盘动画
-  .slide-up-enter-active,
-  .slide-up-leave-active {
-    transition: transform 0.3s ease;
-  }
-  
-  .slide-up-enter-from,
-  .slide-up-leave-to {
-    transform: translateY(100%);
-  }
-  
-  .pwd-view{
-    font-size: 30px;
-    position: absolute;
-    margin-left: -40px;
-    margin-top: 16px;
+
+  .modal-footer {
+    display: flex;
+    justify-content: space-around;
+    padding: 20px;
+    box-sizing: border-box;
+
+    button {
+      width: 200px;
+      height: 80px;
+      font-size: 32px;
+      border-radius: 30px;
+    }
   }
-  </style>
-  
\ No newline at end of file
+}
+
+.keyboard {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 300px;
+  background-color: #f5f7fa;
+  border-top-left-radius: 16px;
+  border-top-right-radius: 16px;
+  box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.1);
+  z-index: 1000;
+}
+// 键盘动画
+.slide-up-enter-active,
+.slide-up-leave-active {
+  transition: transform 0.3s ease;
+}
+
+.slide-up-enter-from,
+.slide-up-leave-to {
+  transform: translateY(100%);
+}
+
+.pwd-view {
+  font-size: 30px;
+  position: absolute;
+  margin-left: -40px;
+  margin-top: 16px;
+}
+</style>
diff --git a/src/pages/Index/utils/index.ts b/src/pages/Index/utils/index.ts
index 508deba..7aa0225 100644
--- a/src/pages/Index/utils/index.ts
+++ b/src/pages/Index/utils/index.ts
@@ -1,6 +1,42 @@
+import { ElMessage } from 'element-plus'
 
 export function formatRemainTime(seconds: number) {
   const min = Math.floor(seconds / 60).toFixed()
   const sec = (seconds % 60).toFixed()
   return min.padStart(2, '0') + ':' + sec.padStart(2, '0')
 }
+
+export const eMessage = {
+  error: (msg: string) => {
+    ElMessage({
+      message: msg,
+      type: 'error',
+      customClass: 'ElMessageExtClass',
+      offset: 60,
+    })
+  },
+  warning: (msg: string) => {
+    ElMessage({
+      message: msg,
+      type: 'warning',
+      customClass: 'ElMessageExtClass',
+      offset: 60,
+    })
+  },
+  success: (msg: string) => {
+    ElMessage({
+      message: msg,
+      type: 'success',
+      customClass: 'ElMessageExtClass',
+      offset: 60,
+    })
+  },
+  info: (msg: string) => {
+    ElMessage({
+      message: msg,
+      type: 'info',
+      customClass: 'ElMessageExtClass',
+      offset: 60,
+    })
+  },
+}
diff --git a/src/style.css b/src/style.css
index ed4db57..dd59310 100644
--- a/src/style.css
+++ b/src/style.css
@@ -12,7 +12,12 @@
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
-
+.ElMessageExtClass {
+  font-size: 2.5rem;
+  .el-message__content {
+    font-size: 1.8rem;
+  }
+}
 a {
   font-weight: 500;
   color: #646cff;