feat： user api

components/users/group/members.vue

@@ -99,6 +99,7 @@ const emit = defineEmits<{
 }>();
 const getUserList = async () => {
   const res = await listUsers();
+
   users.value = res.users.map((item: any) => {
     return {
       label: item.accessKey,

components/users/tabs/user.vue

@@ -43,172 +43,169 @@
 </template>
 
 <script setup lang="ts">
-import {
-  type DataTableColumns,
-  type DataTableInst,
-  type DataTableRowKey,
-  NButton,
-  NPopconfirm,
-  NSpace,
-} from 'naive-ui';
-import { Icon } from '#components';
-// import { newUser, userEdit } from '../components';
+import { type DataTableColumns, type DataTableInst, type DataTableRowKey, NButton, NPopconfirm, NSpace } from "naive-ui"
+import { Icon } from "#components"
 
-const { $api } = useNuxtApp();
-const { listUsers } = useUsers();
-const dialog = useDialog();
-const message = useMessage();
+const { $api } = useNuxtApp()
+const { listUsers } = useUsers()
+const dialog = useDialog()
+const message = useMessage()
 
 const searchForm = reactive({
-  accessKey: '',
-});
+  accessKey: "",
+})
 interface RowData {
-  accessKey: string;
+  accessKey: string
 }
 
 const columns: DataTableColumns<RowData> = [
   {
-    type: 'selection',
+    type: "selection",
   },
   {
-    title: '名称',
-    align: 'left',
-    key: 'accessKey',
+    title: "名称",
+    align: "left",
+    key: "accessKey",
     filter(value, row) {
-      return !!row.accessKey.includes(value.toString());
+      return !!row.accessKey.includes(value.toString())
     },
   },
   {
-    title: '操作',
-    key: 'actions',
-    align: 'center',
+    title: "操作",
+    key: "actions",
+    align: "center",
     width: 180,
     render: (row: any) => {
       return h(
         NSpace,
         {
-          justify: 'center',
+          justify: "center",
         },
         {
           default: () => [
             h(
               NButton,
               {
-                size: 'small',
+                size: "small",
                 secondary: true,
                 onClick: () => openEditItem(row),
               },
               {
-                default: () => '',
-                icon: () => h(Icon, { name: 'ri:edit-2-line' }),
+                default: () => "",
+                icon: () => h(Icon, { name: "ri:edit-2-line" }),
               }
             ),
             h(
               NPopconfirm,
               { onPositiveClick: () => deleteItem(row) },
               {
-                default: () => '确认删除',
+                default: () => "确认删除",
                 trigger: () =>
                   h(
                     NButton,
-                    { size: 'small', secondary: true },
+                    { size: "small", secondary: true },
                     {
-                      default: () => '',
-                      icon: () => h(Icon, { name: 'ri:delete-bin-5-line' }),
+                      default: () => "",
+                      icon: () => h(Icon, { name: "ri:delete-bin-5-line" }),
                     }
                   ),
               }
             ),
           ],
         }
-      );
+      )
     },
   },
-];
+]
 
 // 搜索过滤
-const tableRef = ref<DataTableInst>();
+const tableRef = ref<DataTableInst>()
 function filterName(value: string) {
   tableRef.value &&
     tableRef.value.filter({
       accessKey: [value],
-    });
+    })
 }
-const listData = ref<any[]>([]);
+const listData = ref<any[]>([])
 
 onMounted(() => {
-  getDataList();
-});
+  getDataList()
+})
+
 // 获取数据
 const getDataList = async () => {
   try {
-    const res = await listUsers();
-    listData.value = res.users || [];
+    const res = await listUsers()
+
+    listData.value = Object.entries(res).map(([username, info]) => ({
+      accessKey: username, // 添加用户名
+      ...(typeof info === "object" ? info : {}), // 展开用户信息
+    }))
   } catch (error) {
-    message.error('获取数据失败');
+    message.error("获取数据失败")
   }
-};
+}
 
 /** **********************************添加 */
-const newItemRef = ref();
+const newItemRef = ref()
 
 function addUserItem() {
-  newItemRef.value.openDialog();
+  newItemRef.value.openDialog()
 }
 
 /** **********************************添加到的分组 */
-const addToGroup = () => {};
+const addToGroup = () => {}
 
 /** **********************************修改 */
-const editItemRef = ref();
+const editItemRef = ref()
 function openEditItem(row: any) {
-  editItemRef.value.openDialog(row);
+  editItemRef.value.openDialog(row)
 }
 /** ***********************************删除 */
 async function deleteItem(row: any) {
   try {
-    const res = await $api.delete('/', {
+    const res = await $api.delete("/", {
       body: [row.accessKey],
-    });
-    message.success('删除成功');
-    getDataList();
+    })
+    message.success("删除成功")
+    getDataList()
   } catch (error) {
-    message.error('删除失败');
+    message.error("删除失败")
   }
 }
 
 /** ************************************批量删除 */
 function rowKey(row: any): string {
-  return row.accessKey;
+  return row.accessKey
 }
 
-const checkedKeys = ref<DataTableRowKey[]>([]);
+const checkedKeys = ref<DataTableRowKey[]>([])
 function handleCheck(keys: DataTableRowKey[]) {
-  checkedKeys.value = keys;
-  return checkedKeys;
+  checkedKeys.value = keys
+  return checkedKeys
 }
 function deleteByList() {
   dialog.error({
-    title: '警告',
-    content: '你确定要删除所有选中的用户吗？',
-    positiveText: '确定',
-    negativeText: '取消',
+    title: "警告",
+    content: "你确定要删除所有选中的用户吗？",
+    positiveText: "确定",
+    negativeText: "取消",
     onPositiveClick: async () => {
       if (!checkedKeys.value.length) {
-        message.error('请至少选择一项');
-        return;
+        message.error("请至少选择一项")
+        return
       }
       try {
-        const res = await $api.delete('/', {
+        const res = await $api.delete("/", {
           body: checkedKeys.value,
-        });
-        message.success('删除成功');
-        getDataList();
+        })
+        message.success("删除成功")
+        getDataList()
       } catch (error) {
-        message.error('删除失败');
+        message.error("删除失败")
       }
     },
-  });
+  })
 }
 </script>
 

components/users/user/new.vue

@@ -25,12 +25,12 @@
             <n-form-item-grid-item :span="24" label="秘钥" path="secretKey">
               <n-input v-model:value="editForm.secretKey" type="password" />
             </n-form-item-grid-item>
-            <n-form-item-grid-item :span="24" label="分组" path="groups">
+            <!-- <n-form-item-grid-item :span="24" label="分组" path="groups">
               <n-select v-model:value="editForm.groups" filterable multiple :options="groupsList" />
             </n-form-item-grid-item>
             <n-form-item-grid-item :span="24" label="策略" path="policies">
               <n-select v-model:value="editForm.policies" filterable multiple :options="policiesList" />
-            </n-form-item-grid-item>
+            </n-form-item-grid-item> -->
           </n-grid>
         </n-form>
       </n-card>
@@ -45,104 +45,111 @@
 </template>
 
 <script setup lang="ts">
-import { type FormRules } from 'naive-ui';
-const { listPolicies } = usePolicies();
-const { listGroup } = useGroups();
-const message = useMessage();
-const { createUser } = useUsers();
-const visible = ref(false);
+import { type FormRules } from "naive-ui"
+const { listPolicies } = usePolicies()
+const { listGroup } = useGroups()
+const message = useMessage()
+const { createUser } = useUsers()
+const visible = ref(false)
 
 const editForm = reactive({
-  accessKey: '',
-  secretKey: '',
+  accessKey: "",
+  secretKey: "",
   groups: [],
   policies: [],
-});
+})
 
 const rules: FormRules = {
   accessKey: [
     {
       required: true,
-      message: '请输入用户名',
+      message: "请输入用户名",
     },
   ],
   secretKey: [
     {
       required: true,
-      message: '请输入秘钥',
+      message: "请输入秘钥",
     },
     // length>=8
     {
-      type: 'string',
+      type: "string",
       pattern: /^.{8,}$/,
-      message: '秘钥长度不能小于8位',
+      message: "秘钥长度不能小于8位",
     },
   ],
-};
+}
 
 function openDialog() {
-  getPoliciesList();
-  getGroupsList();
-  visible.value = true;
+  // 获取策略列表
+  // getPoliciesList()
+  // 获取分组列表
+  // getGroupsList()
+  visible.value = true
 }
 
 function closeModal() {
-  visible.value = false;
-  editForm.accessKey = '';
-  editForm.secretKey = '';
-  editForm.groups = [];
-  editForm.policies = [];
+  visible.value = false
+  editForm.accessKey = ""
+  editForm.secretKey = ""
+  editForm.groups = []
+  editForm.policies = []
 }
 
 defineExpose({
   openDialog,
-});
+})
 
-const newformRef = ref();
-const emit = defineEmits(['search']);
+const newformRef = ref()
+const emit = defineEmits(["search"])
 function submitForm(e: MouseEvent) {
-  e.preventDefault();
+  e.preventDefault()
   newformRef.value?.validate(async (errors: any) => {
     if (errors) {
-      return;
+      return
     }
 
     try {
-      const res = await createUser(editForm);
-      message.success('添加成功');
-      emit('search');
-      closeModal();
+      const res = await createUser({
+        accessKey: editForm.accessKey,
+        secretKey: editForm.secretKey,
+        policy: "",
+        status: "enabled",
+      })
+      message.success("添加成功")
+      emit("search")
+      closeModal()
     } catch (error) {
-      message.error('添加失败');
+      message.error("添加失败")
     }
-  });
+  })
 }
 
 // 获取策略列表
-const policiesList = ref([]);
+const policiesList = ref([])
 const getPoliciesList = async () => {
-  const res = await listPolicies();
+  const res = await listPolicies()
   policiesList.value =
     res.policies.map((item: any) => {
       return {
         label: item.name,
         value: item.name,
-      };
-    }) || [];
-};
+      }
+    }) || []
+}
 
 // 获取用户组列表
-const groupsList = ref([]);
+const groupsList = ref([])
 const getGroupsList = async () => {
-  const res = await listGroup();
+  const res = await listGroup()
   groupsList.value =
     res.groups.map((item: any) => {
       return {
         label: item,
         value: item,
-      };
-    }) || [];
-};
+      }
+    }) || []
+}
 </script>
 
 <style lang="scss" scoped></style>