用户管理

components.d.ts

@@ -8,12 +8,18 @@ export {}
 declare module 'vue' {
   export interface GlobalComponents {
     ElButton: typeof import('element-plus/es')['ElButton']
+    ElCol: typeof import('element-plus/es')['ElCol']
     ElDropdown: typeof import('element-plus/es')['ElDropdown']
     ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
     ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
     ElFooter: typeof import('element-plus/es')['ElFooter']
     ElHeader: typeof import('element-plus/es')['ElHeader']
+    ElIcon: typeof import('element-plus/es')['ElIcon']
+    ElInput: typeof import('element-plus/es')['ElInput']
     ElPopover: typeof import('element-plus/es')['ElPopover']
+    ElRow: typeof import('element-plus/es')['ElRow']
+    ElTable: typeof import('element-plus/es')['ElTable']
+    ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
     ErrorModal: typeof import('./src/components/dialogs/ErrorModal.vue')['default']
     Keyboard: typeof import('./src/components/Keyboard.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
@@ -21,4 +27,7 @@ declare module 'vue' {
     SimpleKeyboard: typeof import('./src/components/SimpleKeyboard.vue')['default']
     StackInfoModal: typeof import('./src/components/dialogs/StackInfoModal.vue')['default']
   }
+  export interface ComponentCustomProperties {
+    vLoading: typeof import('element-plus/es')['ElLoadingDirective']
+  }
 }

src/pages/Index/Regular/Emergency.vue

@@ -2,7 +2,7 @@
   <div id="add-emergency-container">
     <!-- 添加急诊 -->
     <div class="page-header">
-      <img class="page-header-icon" src="@/assets/Index/left.svg" @click="goBack"></img>
+      <img class="page-header-icon" src="@/assets/Index/left.svg" @click="goBack"/>
       <div class="page-header-title">添加急诊</div>
     </div>
 

src/pages/Index/Regular/Running.vue

@@ -72,6 +72,8 @@ border-radius: 5px;
   index+1
 }}
 <div>空</div>
+<div :style="`margin-top:101px;background-color:${currentIndex == index?'red':'rgb(149, 149, 149)'}`" class="quan">{{ index +1 }}</div>
+
 </div>
      <div v-for="(item, index) in incubationPlates" :key="item.sampleId" class="rectangular-item"
         :style="[getRotationStyle(item, index), getItemStyle(item)]"
@@ -94,7 +96,7 @@ border-radius: 5px;
           </div>
           <span class="time">{{ getRemainingTime(item) }}</span>
         </template>
-        <div  :style="`margin-top:${item.pos=='EMERGENCY'?'35px':'70px'};background-color:${currentIndex == index?'red':'rgb(149, 149, 149)'}`" class="quan">{{ index +1 }}</div>
+        <div :style="`margin-top:${item.pos=='EMERGENCY'?'35px':'70px'};background-color:${currentIndex == index?'red':'rgb(149, 149, 149)'}`" class="quan">{{ index +1 }}</div>
       </div> 
     </div>
     <div class="consumables-container">

src/pages/Index/Settings/Users.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="user-management">
     <div class="user-table" :key="refreshKey">
-      <el-table :data="tableData" header-cell-class-name="table-header" row-class-name="table-row">
-        <el-table-column type="selection" width="80" />
+      <el-table :data="tableData" header-cell-class-name="table-header" row-class-name="table-row" @selection-change="handleSelectionChange" >
+        <el-table-column type="selection" width="80"/>
         <el-table-column label="用户" property="account" min-width="200" />
         <el-table-column label="权限" property="usrRole" min-width="200" />
       </el-table>
@@ -19,7 +19,7 @@
       :message="deleteUserMessage" description="您正在删除用户，请谨慎操作" confirm-text="确认删除" cancel-text="取消删除"
       @confirm="handleConfirmDelete" @cancel="handleCancelDelete" />
 
-    <DelMessage v-if="delMessageShowModal" v-model:visible="delMessageShowModal" icon="/src/assets/OK.svg"
+    <DelMessage v-if="delMessageShowModal"  v-model="delMessageShowModal" icon="/src/assets/OK.svg"
       message="已成功删除用户" :username="selectedUsers[0]?.account" @confirm="handleConfirmMsgDelete" />
 
     <DelWarn v-if="updatePinModal" :visible="updatePinModal" icon="/src/assets/update-pin-icon.svg" title="PIN码更新"
@@ -51,29 +51,16 @@
 <script setup lang="ts">
 import type { User } from '../../../types/Index'
 import { DelWarn, DelMessage, AddUserModal, EnterPinModal } from '../components'
-import { ref, onMounted, computed } from 'vue'
+import { ref, onMounted, computed, nextTick } from 'vue'
 import {
   getUserList,
   deleteUser,
   userRegister,
   changeUserPassword,
 } from '../../../services/Index/index'
-const tableData = ref<User[]>([
-  {
-    id: 1,
-    account: '管理员',
-    password: '0000',
-    usrRole: 'Admin',
-    isBuiltInUser: true,
-  },
-  {
-    id: 2,
-    account: '操作员01',
-    password: '0000',
-    usrRole: 'Usr',
-    isBuiltInUser: false,
-  },
-])
+import { ElMessage } from 'element-plus'
+
+const tableData = ref<User[]>()
 // 创建 `newUser` 对象存储用户名和 PIN 码
 const newUser = ref({
   account: '',
@@ -106,6 +93,19 @@ const tips = ref('')
 // 模拟用户数据
 const selectedUsers = ref<User[]>([])
 const refreshKey = ref(0)
+
+// 处理选择变化
+const handleSelectionChange = (val: User[]) => {
+  selectedUsers.value = val;
+  // 只有当有选中用户时才更新 tempUser
+  if (val && val.length > 0) {
+    tempUser.value = val[0];
+  } else {
+    // 当没有选中用户时，重置 tempUser
+    tempUser.value = { id: 0, password: '' };
+  }
+}
+
 // 获取用户列表
 const fetchUserList = async () => {
   const response = await getUserList()
@@ -114,44 +114,33 @@ const fetchUserList = async () => {
     tableData.value = response.data
   } else {
     console.log('获取用户列表失败')
+    ElMessage.error('获取用户列表失败')
   }
 }
-// 处理选择变化
-// const handleSelectionChange = (val: User[]) => {
-//   selectedUsers.value = val
-//   console.log('选中的用户', val)
-//   // 只有当有选中用户时才更新 tempUser
-//   if (val && val.length > 0) {
-//     tempUser.value.id = val[0].id
-//     tempUser.value.password = val[0].password
-//   } else {
-//     // 当没有选中用户时，重置 tempUser
-//     tempUser.value.id = 0
-//     tempUser.value.password = ''
-//   }
-// }
+
 // 新增用户
 const addUser = async () => {
   insertUserShowModal.value = true
 }
+
 // 修改用户权限 (模拟 PIN 码修改功能)
 const modifyPin = async () => {
   if (selectedUsers.value.length === 0) {
-    //通知用户没有选择用户，不使用控制台打印
-    isChecked.value = true
+    ElMessage.warning('请选择一个用户')
     return
   }
   updatePinModal.value = true
 }
+
 // 删除用户
 const deleteSelectedUsers = () => {
   if (selectedUsers.value.length === 0) {
-    //通知用户没有选择用户，不使用控制台打印
-    isChecked.value = true
-    return
+    ElMessage.warning('请选择至少一个用户');
+    return;
   }
-  delShowModal.value = true
+  delShowModal.value = true;
 }
+
 // 在组件挂载时调用获取用户列表
 onMounted(() => {
   fetchUserList()
@@ -160,43 +149,49 @@ onMounted(() => {
 const handleConfirmDelete = async () => {
   try {
     const ids = selectedUsers.value.map((user) => user.id)
-    for (const id of ids) {
-      const response = await deleteUser({ id })
-      if (!response || !response.success) {
-        console.log('删除用户失败')
-        return
-      }
+    const deletePromises = ids.map((id) => deleteUser({ id }))
+    const results = await Promise.allSettled(deletePromises)
+
+    const allSuccess = results.every((result) => result.status === 'fulfilled')
+    if (allSuccess) {
+      delShowModal.value = false
+      selectedUsers.value = []
+      delMessageShowModal.value = true
+      ElMessage.success('删除用户成功')
+      fetchUserList()
+    } else {
+      const failedIds = results
+     .filter((result) => result.status === 'rejected')
+     .map((_, index) => ids[index])
+      ElMessage.error(`删除用户失败，ID: ${failedIds.join(', ')}`)
     }
-
-    delShowModal.value = false
-    // 在显示成功消息之前先保存要显示的用户名
-    // const deletedUsername = selectedUsers.value[0]?.account
-    // 清空选中的用户
-    selectedUsers.value = []
-    delMessageShowModal.value = true
   } catch (error) {
     console.error('删除用户时发生错误:', error)
+    ElMessage.error('删除用户时发生错误')
   }
 }
 
 const handleCancelDelete = () => {
   delShowModal.value = false
 }
+
 const handleConfirmMsg = () => {
   confirmInsert.value = false
   isChecked.value = false
   updatePinMsgModal.value = false
   fetchUserList()
 }
+
 const handleConfirmMsgDelete = () => {
   delMessageShowModal.value = false
   fetchUserList()
 }
+
 //更新PIN
 //定义请求
 const handleUpdatePin = async () => {
-  if (selectedUsers.value.length !== 1) {
-    console.log('请选择一个用户来修改PIN码')
+  if (selectedUsers.value.length!== 1) {
+    ElMessage.warning('请选择一个用户来修改PIN码')
     return
   }
 
@@ -207,15 +202,19 @@ const handleUpdatePin = async () => {
   })
 
   if (response && response.success) {
+    ElMessage.success('PIN码更新成功')
+    fetchUserList()
   } else {
-    console.log('修改用户权限失败')
+    ElMessage.error('修改用户权限失败')
   }
 }
+
 //确认更新pin，打开输入框
 const handleConfirmUpdatePin = () => {
   updatePinModal.value = false
   enterPinModal.value = true
 }
+
 //输入pin，确认，发送请求
 const updatePinConfirm = (val: string) => {
   enterPinModal.value = false
@@ -226,14 +225,17 @@ const updatePinConfirm = (val: string) => {
     updatePinMsgModal.value = true
   })
 }
+
 //取消
 const closeEnterPinModal = () => {
   enterPinModal.value = false
 }
+
 //取消
 const handleCancelUpdatePin = () => {
   updatePinModal.value = false
 }
+
 //添加用户
 const handleConfirmInsert = (val: string) => {
   const user = tableData.value.find((item) => item.account == val)
@@ -250,14 +252,17 @@ const handleConfirmInsert = (val: string) => {
     currentStep.value = 'pin'
   }
 }
+
 const handleCancelInsert = () => {
   insertUserShowModal.value = false
 }
+
 // 重置 `alreadyExist` 状态
 const resetAlreadyExist = () => {
   isExist.value = false
   placeholder.value = '请输入用户名'
 }
+
 const handlePinConfirm = (pin: string) => {
   // 处理 PIN 码确认逻辑
   registerLoading.value = true
@@ -266,21 +271,29 @@ const handlePinConfirm = (pin: string) => {
     confirmInsert.value = true
     registerLoading.value = false
     isPinModalVisible.value = false
+  }).catch((error) => {
+    ElMessage.error('添加用户失败:' + error.message)
+    registerLoading.value = false
   })
 }
+
 const closeModal = () => {
   isPinModalVisible.value = false
 }
+
 //添加用户的api
 const handleAddUser = async () => {
   const res = await userRegister(newUser.value)
   if (res && res.success) {
     fetchUserList()
+  } else {
+    throw new Error('添加用户失败')
   }
 }
+
 // 选中用户的 `account` 信息，用于显示在 `Warning` 组件中
 const selectedUserAccount = computed(() => {
-  return selectedUsers.value.length > 0 ? selectedUsers.value[0].account : ''
+  return selectedUsers.value.length > 0? selectedUsers.value[0].account : ''
 })
 
 // 动态生成的 message 内容
@@ -291,6 +304,7 @@ const deleteUserMessage = computed(
   () => `是否删除 <strong>${selectedUserAccount.value}</strong> 用户`,
 )
 </script>
+
 <style scoped lang="less">
 .user-management {
   width: 100%;
@@ -301,7 +315,7 @@ const deleteUserMessage = computed(
   display: flex;
   flex-direction: column;
 
-  .user-table {
+ .user-table {
     flex: 1;
     background-color: #fff;
     border-radius: 12px;
@@ -325,7 +339,7 @@ const deleteUserMessage = computed(
         display: none;
       }
 
-      .el-table__header {
+     .el-table__header {
         th {
           background-color: #f5f7fa;
           border: none;
@@ -340,7 +354,7 @@ const deleteUserMessage = computed(
         }
       }
 
-      .el-table__body {
+     .el-table__body {
         td {
           border: none;
           height: 60px;
@@ -364,10 +378,10 @@ const deleteUserMessage = computed(
       }
 
       // 放大多选框
-      .el-checkbox {
+     .el-checkbox {
         transform: scale(1.5);
 
-        .el-checkbox__inner {
+       .el-checkbox__inner {
           border-color: #dcdfe6;
           transition: all 0.3s;
 
@@ -378,13 +392,13 @@ const deleteUserMessage = computed(
       }
     }
 
-    .table-footer {
+   .table-footer {
       margin-top: 24px;
       display: flex;
       justify-content: center;
       gap: 20px;
 
-      .el-button {
+     .el-button {
         min-width: 160px;
         height: 56px;
         border-radius: 8px;
@@ -422,22 +436,22 @@ const deleteUserMessage = computed(
 
 // 添加响应式设计
 @media screen and (max-width: 768px) {
-  .user-management {
+ .user-management {
     padding: 10px;
 
-    .user-table {
+   .user-table {
       padding: 16px;
 
-      .table-footer {
+     .table-footer {
         flex-direction: column;
         align-items: stretch;
         gap: 12px;
 
-        .el-button {
+       .el-button {
           width: 100%;
         }
       }
     }
   }
 }
-</style>
+</style>

src/pages/Index/components/Setting/DelWarn.vue

@@ -14,11 +14,10 @@
         </div>
         <!-- 操作按钮 -->
         <div class="del-warn-footer">
-          <el-button type="danger" @click="confirmDelete">{{
-            confirmText
-          }}</el-button>
           <el-button type="primary" @click="cancelDelete">{{
             cancelText
+          }}</el-button>     <el-button type="danger" @click="confirmDelete">{{
+            confirmText
           }}</el-button>
         </div>
       </div>