From e5b2ac9f8bc826085bf81739b040a7e8fd48ee88 Mon Sep 17 00:00:00 2001
From: "Bob.Song" <bob.song@ingcreations.com>
Date: Wed, 8 Apr 2026 17:54:37 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env.development               |   2 +-
 .env.production                |   2 +-
 src/router/modules/activity.ts |   6 +-
 src/router/modules/user.ts     |   8 ++
 src/views/user/hook.tsx        |  71 ++++++++-----
 src/views/user/index.vue       |  50 ++++++++-
 src/views/user/online.vue      | 186 +++++++++++++++++++++++++++++++++
 7 files changed, 291 insertions(+), 34 deletions(-)
 create mode 100644 src/views/user/online.vue

diff --git a/.env.development b/.env.development
index df09456..17beab5 100644
--- a/.env.development
+++ b/.env.development
@@ -7,4 +7,4 @@ VITE_PUBLIC_PATH = /
 # 开发环境路由历史模式（Hash模式传"hash"、HTML5模式传"h5"、Hash模式带base参数传"hash,base参数"、HTML5模式带base参数传"h5,base参数"）
 VITE_ROUTER_HISTORY = "hash"
 
-VITE_API_BASE_URL = http://127.0.0.1:6052/api/
+VITE_API_BASE_URL = http://127.0.0.1:6052/apiBobSongAbc1234561234334/
diff --git a/.env.production b/.env.production
index f1b9515..2d1e967 100644
--- a/.env.production
+++ b/.env.production
@@ -12,4 +12,4 @@ VITE_CDN = false
 # 压缩时删除原始文件的配置：gzip-clear、brotli-clear、both-clear（同时开启 gzip 与 brotli 压缩）、none（不开启压缩，默认）
 VITE_COMPRESSION = "none"
 
-VITE_API_BASE_URL = http://127.0.0.1:6052/api/
+VITE_API_BASE_URL = http://127.0.0.1:6052/apiBobSongAbc1234561234334/
diff --git a/src/router/modules/activity.ts b/src/router/modules/activity.ts
index 9d0df75..c7897aa 100644
--- a/src/router/modules/activity.ts
+++ b/src/router/modules/activity.ts
@@ -13,15 +13,15 @@ export default {
       name: "活动列表",
       component: () => import("@/views/user/index.vue"),
       meta: {
-        title: "玩家列表"
+        title: "活动列表"
       }
     },
     {
       path: "/activity/404",
-      name: "风险玩家",
+      name: "风险玩家1",
       component: () => import("@/views/user/index.vue"),
       meta: {
-        title: "风险玩家"
+        title: "风险玩家1"
       }
     }
   ]
diff --git a/src/router/modules/user.ts b/src/router/modules/user.ts
index 519c50c..4e021d3 100644
--- a/src/router/modules/user.ts
+++ b/src/router/modules/user.ts
@@ -16,6 +16,14 @@ export default {
         title: "玩家列表"
       }
     },
+    {
+      path: "/user/online",
+      name: "在线玩家",
+      component: () => import("@/views/user/online.vue"),
+      meta: {
+        title: "在线玩家"
+      }
+    },
     {
       path: "/user/dangerous",
       name: "风险玩家",
diff --git a/src/views/user/hook.tsx b/src/views/user/hook.tsx
index 3b73f3a..c265b49 100644
--- a/src/views/user/hook.tsx
+++ b/src/views/user/hook.tsx
@@ -11,8 +11,9 @@ import { getUserListApi } from "@/api/user";
 
 export function useRole(tableRef: Ref) {
   const form = reactive({
-    module: "",
-    requestTime: ""
+    username: "",
+    phone: "",
+    status: ""
   });
   const dataList = ref([]);
   const loading = ref(true);
@@ -29,55 +30,69 @@ export function useRole(tableRef: Ref) {
   const columns: TableColumnList = [
     {
       label: "ID",
-      prop: "id"
-    },
-    {
-      label: "用户头像",
-      prop: "avatar",
-      cellRenderer: ({ row }) => (
-        <el-image
-          fit="cover"
-          preview-teleported={true}
-          src={row.avatar || userAvatar}
-          preview-src-list={Array.of(row.avatar || userAvatar)}
-          class="size-6 rounded-full align-middle"
-        />
-      ),
-      width: 90
+      prop: "id",
+      width: 240
     },
     {
       label: "昵称",
-      prop: "nickName"
-    },
-    {
-      label: "国家",
-      prop: "country",
-      minWidth: 100
+      prop: "nickName",
+      cellRenderer: ({ row }) => (
+        <div style="">
+          <el-image
+            fit="cover"
+            preview-teleported={true}
+            src={row.avatar || userAvatar}
+            preview-src-list={Array.of(row.avatar || userAvatar)}
+            class="size-6 rounded-full align-middle"
+          />
+          <span>{row.nickName}</span>
+        </div>
+      )
     },
     {
       label: "等级",
       prop: "level",
-      minWidth: 90
+      width: 80
+    },
+    {
+      label: "国家",
+      prop: "country",
+      width: 80
     },
     {
       label: "上星",
       prop: "star",
-      minWidth: 90
+      width: 80
     },
     {
       label: "高光",
       prop: "highlight",
-      minWidth: 90
+      width: 80
     },
     {
       label: "VIP",
       prop: "vip",
-      minWidth: 90
+      width: 80
+    },
+    {
+      label: "状态",
+      prop: "status",
+      minWidth: 120,
+      cellRenderer: ({ row, props }) => (
+        <el-tag
+          size={props.size}
+          type={row.status === 1 ? "danger" : null}
+          effect="plain"
+        >
+          {row.status === 1 ? "封禁" : "正常"}
+        </el-tag>
+      )
     },
     {
       label: "操作",
       fixed: "right",
-      slot: "operation"
+      slot: "operation",
+      width: 220
     }
   ];
 
diff --git a/src/views/user/index.vue b/src/views/user/index.vue
index fc67e26..6639fcc 100644
--- a/src/views/user/index.vue
+++ b/src/views/user/index.vue
@@ -41,7 +41,7 @@ const {
 
 <template>
   <div class="main">
-    <el-form
+    <!-- <el-form
       ref="formRef"
       :inline="true"
       :model="form"
@@ -78,6 +78,54 @@ const {
           重置
         </el-button>
       </el-form-item>
+    </el-form> -->
+
+    <el-form
+      ref="formRef"
+      :inline="true"
+      :model="form"
+      class="search-form bg-bg_color w-full pl-8 pt-3 overflow-auto"
+    >
+      <el-form-item label="用户名称：" prop="username">
+        <el-input
+          v-model="form.username"
+          placeholder="请输入用户名称"
+          clearable
+          class="w-45!"
+        />
+      </el-form-item>
+      <el-form-item label="手机号码：" prop="phone">
+        <el-input
+          v-model="form.phone"
+          placeholder="请输入手机号码"
+          clearable
+          class="w-45!"
+        />
+      </el-form-item>
+      <el-form-item label="状态：" prop="status">
+        <el-select
+          v-model="form.status"
+          placeholder="请选择"
+          clearable
+          class="w-45!"
+        >
+          <el-option label="已开启" value="1" />
+          <el-option label="已关闭" value="0" />
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button
+          type="primary"
+          :icon="useRenderIcon('ri/search-line')"
+          :loading="loading"
+          @click="onSearch"
+        >
+          搜索
+        </el-button>
+        <el-button :icon="useRenderIcon(Refresh)" @click="resetForm(formRef)">
+          重置
+        </el-button>
+      </el-form-item>
     </el-form>
 
     <PureTableBar title="玩家列表" :columns="columns" @refresh="onSearch">
diff --git a/src/views/user/online.vue b/src/views/user/online.vue
new file mode 100644
index 0000000..fc67e26
--- /dev/null
+++ b/src/views/user/online.vue
@@ -0,0 +1,186 @@
+<script setup lang="ts">
+import { ref } from "vue";
+import { useRole } from "./hook";
+import { getPickerShortcuts } from "./utils";
+import { PureTableBar } from "@/components/RePureTableBar";
+import { useRenderIcon } from "@/components/ReIcon/src/hooks";
+
+import View from "~icons/ep/view";
+import Delete from "~icons/ep/delete";
+import Refresh from "~icons/ep/refresh";
+
+import Plane from "~icons/ri/plane-line";
+
+defineOptions({
+  name: "SystemLog"
+});
+
+const formRef = ref();
+const tableRef = ref();
+
+const {
+  form,
+  loading,
+  columns,
+  dataList,
+  pagination,
+  selectedNum,
+  onSearch,
+  onDetail,
+  clearAll,
+  resetForm,
+  onbatchDel,
+  handleSizeChange,
+  onSelectionCancel,
+  handleCellDblclick,
+  handleCurrentChange,
+  handleSelectionChange,
+  handleOffline
+} = useRole(tableRef);
+</script>
+
+<template>
+  <div class="main">
+    <el-form
+      ref="formRef"
+      :inline="true"
+      :model="form"
+      class="search-form bg-bg_color w-full pl-8 pt-3 overflow-auto"
+    >
+      <el-form-item label="所属模块" prop="module">
+        <el-input
+          v-model="form.module"
+          placeholder="请输入所属模块"
+          clearable
+          class="w-42.5!"
+        />
+      </el-form-item>
+      <el-form-item label="请求时间" prop="requestTime">
+        <el-date-picker
+          v-model="form.requestTime"
+          :shortcuts="getPickerShortcuts()"
+          type="datetimerange"
+          range-separator="至"
+          start-placeholder="开始日期时间"
+          end-placeholder="结束日期时间"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button
+          type="primary"
+          :icon="useRenderIcon('ri:search-line')"
+          :loading="loading"
+          @click="onSearch"
+        >
+          搜索
+        </el-button>
+        <el-button :icon="useRenderIcon(Refresh)" @click="resetForm(formRef)">
+          重置
+        </el-button>
+      </el-form-item>
+    </el-form>
+
+    <PureTableBar title="玩家列表" :columns="columns" @refresh="onSearch">
+      <template v-slot="{ size, dynamicColumns }">
+        <div
+          v-if="selectedNum > 0"
+          v-motion-fade
+          class="bg-(--el-fill-color-light) w-full h-11.5 mb-2 pl-4 flex items-center"
+        >
+          <div class="flex-auto">
+            <span
+              style="font-size: var(--el-font-size-base)"
+              class="text-[rgba(42,46,54,0.5)] dark:text-[rgba(220,220,242,0.5)]"
+            >
+              已选 {{ selectedNum }} 项
+            </span>
+            <el-button type="primary" text @click="onSelectionCancel">
+              取消选择
+            </el-button>
+          </div>
+          <el-popconfirm title="是否确认删除?" @confirm="onbatchDel">
+            <template #reference>
+              <el-button type="danger" text class="mr-1!"> 批量删除 </el-button>
+            </template>
+          </el-popconfirm>
+        </div>
+        <pure-table
+          ref="tableRef"
+          row-key="id"
+          align-whole="center"
+          table-layout="auto"
+          :loading="loading"
+          :size="size"
+          adaptive
+          :adaptiveConfig="{ offsetBottom: 108 }"
+          :data="dataList"
+          :columns="dynamicColumns"
+          :pagination="{ ...pagination, size }"
+          :header-cell-style="{
+            background: 'var(--el-fill-color-light)',
+            color: 'var(--el-text-color-primary)'
+          }"
+          @selection-change="handleSelectionChange"
+          @page-size-change="handleSizeChange"
+          @page-current-change="handleCurrentChange"
+          @cell-dblclick="handleCellDblclick"
+        >
+          <template #operation="{ row }">
+            <el-popconfirm
+              :title="`是否强制下线${row.username}`"
+              @confirm="handleOffline(row)"
+            >
+              <template #reference>
+                <el-button
+                  class="reset-margin"
+                  link
+                  type="primary"
+                  :size="size"
+                  :icon="useRenderIcon(Plane)"
+                >
+                  强退
+                </el-button>
+              </template>
+            </el-popconfirm>
+            <el-button
+              class="reset-margin outline-hidden!"
+              link
+              type="primary"
+              :size="size"
+              :icon="useRenderIcon(Delete)"
+              @click="onDetail(row)"
+            >
+              封号
+            </el-button>
+            <el-button
+              class="reset-margin outline-hidden!"
+              link
+              type="primary"
+              :size="size"
+              :icon="useRenderIcon(View)"
+              @click="onDetail(row)"
+            >
+              详情
+            </el-button>
+          </template>
+        </pure-table>
+      </template>
+    </PureTableBar>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+:deep(.el-dropdown-menu__item i) {
+  margin: 0;
+}
+
+.main-content {
+  margin: 24px 24px 0 !important;
+}
+
+.search-form {
+  :deep(.el-form-item) {
+    margin-bottom: 12px;
+  }
+}
+</style>