update

liujie

2026-09-09 39f6fca28e3f78abe48f08e474ec011abb990b36

 frontend/src/views/MiniUsersView.vue

@@ -45,7 +45,7 @@

const changeStatus = async (user) => {
  const nextStatus = user.status === 1 ? 0 : 1
  const action = nextStatus === 1 ? '启用' : '停用'
  const action = nextStatus === 1 ? '启用' : '禁用'
  try {
    await ElMessageBox.confirm(`确认${action}游客“${displayName(user)}”吗？`, `${action}游客`, {
      type: 'warning', confirmButtonText: `确认${action}`, cancelButtonText: '取消',
@@ -70,28 +70,28 @@
      <div>
        <span class="eyebrow">VISITOR MANAGEMENT</span>
        <h1>游客列表</h1>
        <p>查询游客资料、注册时间及账号状态，支持停用异常账号。</p>
        <p>查询游客资料、注册时间及账号状态，支持禁用异常账号。</p>
      </div>
      <div class="heading-stat"><strong>{{ total }}</strong><span>筛选结果</span></div>
    </header>

    <el-card class="filter-card" shadow="never">
      <el-form inline @submit.prevent="search">
      <el-form class="query-form" label-position="left" @submit.prevent="search">
        <el-form-item label="关键词">
          <el-input v-model="query.keyword" clearable placeholder="用户ID / 用户名 / 昵称 / 手机号" style="width: 280px" @keyup.enter="search" />
          <el-input v-model="query.keyword" clearable placeholder="游客编号 / 游客昵称 / 手机号" @keyup.enter="search" />
        </el-form-item>
        <el-form-item label="账号状态">
          <el-select v-model="query.status" clearable placeholder="全部状态" style="width: 140px">
            <el-option label="正常" :value="1" /><el-option label="已停用" :value="0" />
          <el-select v-model="query.status" clearable placeholder="全部状态">
            <el-option label="启用" :value="1" /><el-option label="禁用" :value="0" />
          </el-select>
        </el-form-item>
        <el-form-item label="注册时间">
          <el-date-picker v-model="dateRange" type="daterange" value-format="YYYY-MM-DD" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" />
        </el-form-item>
        <el-form-item>
        <div class="query-actions">
          <el-button type="primary" :icon="Search" @click="search">查询</el-button>
          <el-button :icon="Refresh" @click="reset">重置</el-button>
        </el-form-item>
        </div>
      </el-form>
    </el-card>

@@ -101,32 +101,27 @@
        <el-button :icon="Refresh" circle title="刷新" @click="loadUsers" />
      </div>

      <el-table v-loading="loading" :data="records" row-key="id">
        <el-table-column label="游客" min-width="230">
          <template #default="{ row }">
            <div class="visitor-cell">
              <el-avatar :size="42" :src="row.avatar">{{ displayName(row).slice(0, 1) }}</el-avatar>
              <div><strong>{{ displayName(row) }}</strong><span>@{{ row.username || '-' }}</span></div>
            </div>
          </template>
      <el-table v-loading="loading" :data="records" border row-key="id">
        <el-table-column prop="id" label="游客编号" width="120" align="center" />
        <el-table-column label="游客昵称" min-width="150" align="center">
          <template #default="{ row }">{{ row.nickname || '' }}</template>
        </el-table-column>
        <el-table-column prop="id" label="用户ID" width="100" />
        <el-table-column prop="mobile" label="手机号" min-width="150">
        <el-table-column prop="mobile" label="手机号" min-width="150" align="center">
          <template #default="{ row }">{{ row.mobile || '-' }}</template>
        </el-table-column>
        <el-table-column prop="orderCount" label="订单数" width="100" align="center" />
        <el-table-column label="注册时间" min-width="175">
        <el-table-column label="注册时间" min-width="175" align="center">
          <template #default="{ row }">{{ formatDateTime(row.createdAt) }}</template>
        </el-table-column>
        <el-table-column prop="orderCount" label="下单数" width="100" align="center" />
        <el-table-column label="状态" width="100" align="center">
          <template #default="{ row }">
            <el-tag :type="row.status === 1 ? 'success' : 'danger'" effect="light">{{ row.status === 1 ? '正常' : '已停用' }}</el-tag>
            <el-tag :type="row.status === 1 ? 'success' : 'danger'" effect="light">{{ row.status === 1 ? '启用' : '禁用' }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="操作" width="170" fixed="right" align="center">
          <template #default="{ row }">
            <el-button link type="primary" :icon="View" @click="openDetail(row)">详情</el-button>
            <el-button link :type="row.status === 1 ? 'danger' : 'success'" @click="changeStatus(row)">{{ row.status === 1 ? '停用' : '启用' }}</el-button>
            <el-button link :type="row.status === 1 ? 'danger' : 'success'" @click="changeStatus(row)">{{ row.status === 1 ? '禁用' : '启用' }}</el-button>
            <el-button link type="primary" :icon="View" @click="openDetail(row)">查看</el-button>
          </template>
        </el-table-column>
        <template #empty><el-empty description="暂无符合条件的游客" /></template>
@@ -164,10 +159,6 @@
.table-title { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; }
.table-title h2 { margin: 0 0 5px; color: #102a43; font-size: 18px; }
.table-title span { color: #829ab1; font-size: 12px; }
.visitor-cell { display: flex; align-items: center; gap: 12px; }
.visitor-cell > div { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.visitor-cell strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.visitor-cell span { color: #829ab1; font-size: 12px; }
.pagination-row { display: flex; justify-content: space-between; align-items: center; padding-top: 20px; }
.pagination-row > span { color: #829ab1; font-size: 13px; }
</style>