patch: getAllUserCurrent

src/Manager/components/User.vue

@@ -55,7 +55,7 @@
               用户名：<a-input v-model:value="updateData.username" style="width: 180px" />
             </span>
           <span style="margin-left: 20px">
-              电话：<a-input v-model:value="updateData.phone" style="width: 180px" />
+              电话：<a-input v-model:value="updateData.phone" placeholder="Enter something..." style="width: 180px" />
             </span>
         </div>
         <div style="margin-bottom: 10px">
@@ -82,34 +82,7 @@
 
     <!--表格内容-->
     <div class="table">
-      <a-table
-          :columns="columns"
-          :data-source="states.data"
-          :loading="loading"
-          :pagination="pagination"
-          @change="handleTableChange"
-          :rowClassName="setRowClassName"
-      >
-        <template #bodyCell="{ column, record, index }">
-          <template v-if="column.key === 'user_state'">
-            <span>
-              <a-tag
-                  v-for="tag in record.role_state"
-                  :key="tag"
-                  :color="tag === 'loser' ? 'volcano' : tag.length > 5 ? 'geekblue' : 'green'"
-              >
-                {{ tag.toUpperCase() }}
-              </a-tag>
-            </span>
-          </template>
-          <template  v-else-if="column.dataIndex === 'user_action'">
-            <span style="margin-left: 10px">
-              <a-button class="button2" size="small" type="text" @click="showEditDiaLog(record, index)"><EditOutlined />修改</a-button>
-              <a-button class="button1" size="small" type="text" @click="showDeleteDiaLog(record, index)"><DeleteOutlined />删除</a-button>
-            </span>
-          </template>
-        </template>
-      </a-table>
+      <a-table :columns="columns" :dataSource="data"/>
     </div>
   </div>
 </template>
@@ -118,8 +91,6 @@
 import {computed, onMounted, reactive, ref} from 'vue';
 import {DeleteOutlined, EditOutlined, PlusOutlined, SearchOutlined} from '@ant-design/icons-vue';
 import {message} from "ant-design-vue";
-import {usePagination} from 'vue-request';
-import axios from 'axios';
 import requests from "@/public/request.js";
 
 const value1 = ref('');
@@ -128,7 +99,9 @@ const AddDiaLog = ref(false);
 const DeleteDiaLog = ref(false);
 const EditDiaLog = ref(false);
 const DeleteId = ref(0);
-let dataSource = []
+let dataSource = ref([]);
+let data = ref([]);
+const dataLoaded = ref(false);
 const token = "eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiIxNiIsImV4cCI6MTcwNjc4OTgwNH0.Cx4NOfPh3QXH-pYRCSHxpUjdeUxBZABVb5Z82gK8sfI"
 const requestBody = {
   "page": null,
@@ -400,19 +373,14 @@ const columns = [
   },
   {
     title: '用户状态',
-    dataIndex: 'user_state',
+    dataIndex: 'enabled',
     key: 'enabled',
   },
   {
     title: '更新时间',
     key: 'updatedAt',
     dataIndex: 'updatedAt'
-  },
-  {
-    title: '操作',
-    key:'user_action',
-    dataIndex: 'user_action',
-  },
+  }
 ];
 
 const rowSelection = {
@@ -425,56 +393,43 @@ const rowSelection = {
   }),
 };
 
-const queryData = params => {
-  return axios.get('https://randomuser.me/api?noinfo', {
-    params,
-  });
-};
-const {
-  run,
-  loading,
-  current,
-  pageSize,
-} = usePagination(queryData, {
-  formatResult: res => res.data.results,
-  pagination: {
-    currentKey: 'page',
-    pageSizeKey: 'results',
-  },
-});
-const pagination = computed(() => ({
-  total: 200,
-  current: current.value,
-  pageSize: pageSize.value,
-}));
-const handleTableChange = (pag, filters, sorter) => {
-  run({
-    results: pag.pageSize,
-    page: pag?.current,
-    sortField: sorter.field,
-    sortOrder: sorter.order,
-    ...filters,
-  });
-};
-
-
-requests.userAllCurrent(requestBody, token).then((res) => {
-  const getUserData = res.data.data.users
-  for (let i = 0; i < res.data.data.count; i++) {
-    dataSource[i] = {
-      id: i,
-      username: getUserData[i].user.username,
-      phone: getUserData[i].user.phone,
-      enabled: getUserData[i].user.enabled,
-      updatedAt: getUserData[i].user.updatedAt
+async function fetchData() {
+  try {
+    const queryData = await requests.userAllCurrent(
+        {
+          page: null,
+          limit: null,
+          search: null,
+          role: null
+        },
+        "eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiIxIiwiZXhwIjoxNzA2ODU0Nzk1fQ.A5kh3jSxbkvHmfEyp9MTp9--N0HdoiEREkKdPgcfXOk"
+    );
+    console.log(queryData.data); // 访问数据
+    dataSource.value = queryData.data.data;
+    dataLoaded.value = true;
+    for (let i = 0; i <= dataSource.value.count; i++) {
+      if (dataSource.value.users[i].user.updatedAt === null) {
+        dataSource.value.users[i].user.updatedAt = "null"
+      }
+      data.value.push({
+        username: dataSource.value.users[i].user.username,
+        nickname: dataSource.value.users[i].user.nickname,
+        phone: dataSource.value.users[i].user.phone,
+        enabled: dataSource.value.users[i].user.enabled,
+        updatedAt: dataSource.value.users[i].user.updatedAt,
+      });
     }
+    console.log(data.value);
+  } catch (error) {
+    console.error(error);
   }
-})
+}
 console.log(dataSource)
 
-
-
-
+// 组件挂载时调用 fetchData
+onMounted(() => {
+  fetchData();
+});
 </script>