user

src/components/Setting/components/User.vue

@@ -3,9 +3,15 @@
     <div v-if="userFormVisible" class="add_user_form">
       <p class="title">添加新用户</p>
       <div class="form_wrap">
-        <input v-model="newUserUserName" type="text" class="username_form" />
+        <input
+          v-model="newUserUserName"
+          @focus="showAddPasswordKey"
+          type="text"
+          class="username_form"
+        />
         <input
           v-model="newUserPassword"
+          @focus="showAddMewPasswordKey"
           :type="showAddPassword ? 'text' : 'password'"
           class="password_form"
         />
@@ -14,8 +20,8 @@
           class="eye"
           @click="handleAddPasswordShow"
         />
-        <!-- <p class="username_tips">*用户名限制信息</p>
-        <p class="password_tips">*用户名限制信息</p> -->
+        <p class="username_tips">{{ `${addUserTips}` }}</p>
+        <!-- <p class="password_tips">*用户名限制信息</p> -->
       </div>
       <div class="btns">
         <div class="btn style-btn" @click="returnList">返回</div>
@@ -87,15 +93,15 @@
           <div class="operator_wrap">
             <div
               class="common_btn style-btn"
-              @click="showUserModal(`${item.uid} 用户删除`, item.uid, 1)"
-              v-if="item.permission_level == 3"
+              @click="showUserModal(`${item.uid} 用户删除`, item.id, 1)"
+              v-if="item.uid != 'admin'"
             >
               删除用户
             </div>
             <div
               class="common_btn mb style-btn"
               v-if="item.permission_level == 3"
-              @click="showUserModal(`${item.uid} 设置为管理员`, item.uid, 2)"
+              @click="showUserModal(`${item.uid} 设置为管理员`, item.id, 2)"
             >
               设为管理员
             </div>
@@ -122,6 +128,22 @@
         :input="updateUserNewPassword"
       />
     </div>
+
+    <div class="key_wrap" v-if="showkeyboard2">
+      <SimpleKeyboard
+        :hideKeyBoard="hideKeyBoard2"
+        @onChange="onChange2"
+        :input="newUserUserName"
+      />
+    </div>
+
+    <div class="key_wrap" v-if="showkeyboard3">
+      <SimpleKeyboard
+        :hideKeyBoard="hideKeyBoard3"
+        @onChange="onChange3"
+        :input="newUserPassword"
+      />
+    </div>
   </div>
 </template>
 
@@ -140,11 +162,29 @@ import {
   getAllUserJSON,
 } from '@/mock/command'
 
+const newUserUserName = ref('')
+const newUserPassword = ref('')
+const addUserTips = ref('')
+
 const showkeyboard = ref(false)
+const showkeyboard2 = ref(false)
+const showkeyboard3 = ref(false)
 const hideKeyBoard = () => {
   showkeyboard.value = false
 }
 
+const hideKeyBoard2 = () => {
+  showkeyboard2.value = false
+}
+const hideKeyBoard3 = () => {
+  showkeyboard3.value = false
+}
+
+const showAddPasswordKey = () => {
+  showkeyboard3.value = false
+  showkeyboard2.value = true
+}
+
 const showpasswordKey = () => {
   showkeyboard.value = true
 }
@@ -152,8 +192,18 @@ const onChange = a => {
   updateUserNewPassword.value = a
 }
 
-const newUserUserName = ref('')
-const newUserPassword = ref('')
+const onChange3 = a => {
+  newUserPassword.value = a
+}
+
+const onChange2 = a => {
+  newUserUserName.value = a
+}
+
+const showAddMewPasswordKey = () => {
+  showkeyboard2.value = false
+  showkeyboard3.value = true
+}
 
 const userStore = useUserStore()
 const webSocketStore = useWebSocketStore()
@@ -215,6 +265,8 @@ onMounted(() => {
 })
 
 const returnList = () => {
+  showkeyboard2.value = false
+  showkeyboard3.value = false
   userFormVisible.value = false
 }
 
@@ -253,11 +305,26 @@ const handleOk = () => {
 }
 
 const addNewUserFunc = () => {
+  if (newUserUserName.value == '') {
+    addUserTips.value = '用户名不能为空'
+    return
+  }
+  // addUserTips
+  const arr = userStore.allUserList.filter(
+    item => item.uid == newUserUserName.value,
+  )
+  if (arr?.length > 0) {
+    addUserTips.value = '该用户名已存在'
+    return
+  }
+  showkeyboard2.value = false
+  showkeyboard3.value = false
   webSocketStore.sendCommandMsg(
     addUserJson(newUserUserName.value, newUserPassword.value),
   )
   getAllUser()
   returnList()
+  addUserTips.value = ''
 }
 </script>
 
@@ -333,7 +400,6 @@ const addNewUserFunc = () => {
           color: #06518b;
         }
         .mb {
-          margin: 0 16px;
         }
       }
     }

src/components/dialogs/UserModal.vue

@@ -44,6 +44,7 @@ const props = defineProps({
 
 const ok = () => {
   props.handleOk()
+  props.hideUserModal()
 }
 
 const handleCancel = () => {