From 5edc21f860132a00fdc54a0d9e9db187357353be Mon Sep 17 00:00:00 2001
From: Gzx1999 <guozhengxin@kylinos.cn>
Date: Thu, 30 Nov 2023 14:05:53 +0800
Subject: [PATCH] request machine user info and display

---
 .../src/views/Cluster/MachineDetail/User.vue  | 155 +++++++++++-------
 1 file changed, 99 insertions(+), 56 deletions(-)

diff --git a/frontend/src/views/Cluster/MachineDetail/User.vue b/frontend/src/views/Cluster/MachineDetail/User.vue
index cfdf3f8..842f05e 100644
--- a/frontend/src/views/Cluster/MachineDetail/User.vue
+++ b/frontend/src/views/Cluster/MachineDetail/User.vue
@@ -1,75 +1,118 @@
 <template>
-    <div class="content">
-        <div class="users">
-            <div class="current">
-                当前用户： currentUser
-            </div>
-            <div class="search">
-                <el-autocomplete style="width:50%" class="inline-input" v-model="userName"
-                    placeholder="请输入用户名"></el-autocomplete>
-                <el-button plain type="primary">搜索</el-button>
-            </div>
-        </div>
-        <div class="info">
-            <p class="title">用户信息详情：</p>
-            <el-descriptions :column="3" border>
-                <el-descriptions-item label="用户名"> Username </el-descriptions-item>
-                <el-descriptions-item label="用户ID"> UserId </el-descriptions-item>
-                <el-descriptions-item label="用户组ID"> GroupId </el-descriptions-item>
-                <el-descriptions-item label="家目录"> HomeDir </el-descriptions-item>
-                <el-descriptions-item label="shell类型"> ShellType </el-descriptions-item>
-                <el-descriptions-item label="描述"> Description </el-descriptions-item>
-            </el-descriptions>
-        </div>
+  <div class="content">
+    <div class="users">
+      <div class="current">
+        当前用户： {{currentUser.Username}}
+      </div>
+      <div class="search">
+        <el-autocomplete style="width:50%" class="inline-input" v-model="userName" placeholder="请输入用户名"></el-autocomplete>
+        <el-button plain type="primary">搜索</el-button>
+      </div>
     </div>
+    <div class="info">
+      <p class="title">用户信息详情：</p>
+      <el-descriptions :column="3" border>
+        <el-descriptions-item label="用户名"> {{ userInfo.Username }} </el-descriptions-item>
+        <el-descriptions-item label="用户ID"> {{ userInfo.UserId }} </el-descriptions-item>
+        <el-descriptions-item label="用户组ID"> {{ userInfo.GroupId }} </el-descriptions-item>
+        <el-descriptions-item label="家目录"> {{ userInfo.HomeDir }} </el-descriptions-item>
+        <el-descriptions-item label="shell类型"> {{ userInfo.ShellType }} </el-descriptions-item>
+        <el-descriptions-item label="描述"> {{ userInfo.Description }} </el-descriptions-item>
+      </el-descriptions>
+    </div>
+  </div>
 </template>
 <script lang="ts" setup>
-import { ref } from "vue";
+import { ref, onMounted } from "vue";
+import { useRoute } from 'vue-router'
+import { ElMessage } from 'element-plus';
+
+import { getCurrentUser, getMachineAllUser } from "@/request/cluster";
+import { RespCodeOK } from "@/request/request";
+
+const route = useRoute()
+
+// 机器UUID
+const machineID = ref(route.params.uuid)
+
 
 const userName = ref("")
+const currentUser = ref<any>({})
+const userInfo = ref<any>({})
+
+onMounted(() => {
+  getMachineAllUser({ uuid: machineID.value }).then((resp: any) => {
+    if (resp.code === RespCodeOK) {
+      let users = resp.data.user_all
+
+      // 嵌套调用，避免两者请求不同步
+      getCurrentUser({ uuid: machineID.value }).then((resp: any) => {
+        if (resp.code === RespCodeOK) {
+          currentUser.value = resp.data.user_info
+
+          userInfo.value = users.filter((item:any) => item.Username === currentUser.value.Username)[0];
+        } else {
+          ElMessage.error("failed to get current machine user info: " + resp.msg)
+        }
+      }).catch((err: any) => {
+        ElMessage.error("failed to get current machine user info:" + err.msg)
+      })
+
+    } else {
+      ElMessage.error("failed to get machine users info: " + resp.msg)
+    }
+  }).catch((err: any) => {
+    ElMessage.error("failed to get machine users info:" + err.msg)
+  })
+})
 
 </script>
 <style lang="scss" scoped>
 .content {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+
+  .users {
     width: 100%;
-    height: 100%;
+    height: 20%;
     display: flex;
-    flex-direction: column;
+    justify-content: space-between;
+    align-items: center;
 
-    .users {
-      width: 100%;
-      height: 20%;
+    .current {
+      width: 20%;
+      height: 100%;
+      font-weight: bold;
+      color: rgb(92, 85, 85);
+      border: 1px solid rgb(236, 235, 255);
+      background: rgb(236, 235, 255);
+      border-radius: 10px;
       display: flex;
-      justify-content: space-between;
       align-items: center;
-      .current {
-        width: 20%;
+
+      svg {
+        width: 36%;
         height: 100%;
-        font-weight: bold;
-        color: rgb(92, 85, 85);
-        border: 1px solid rgb(236, 235, 255);
-        background: rgb(236, 235, 255);
-        border-radius: 10px;
-        display: flex;
-        align-items: center;
-        svg {
-          width: 36%;
-          height: 100%;
-        }
-      }
-      .search {
-        width: 70%;
       }
     }
-    .info {
-      width: 100%;
-      height: 80%;
-      display: flex;
-      flex-direction: column;
-      .title {
-        width: 30%;
-        margin: 2% 0;
-      }
+
+    .search {
+      width: 70%;
+    }
+  }
+
+  .info {
+    width: 100%;
+    height: 80%;
+    display: flex;
+    flex-direction: column;
+
+    .title {
+      width: 30%;
+      margin: 2% 0;
     }
- }
- </style>
\ No newline at end of file
+  }
+}
+</style>
\ No newline at end of file
-- 
Gitee