Răsfoiți Sursa

feat(apiUsers): 添加发放道具功能并优化用户列表展示

- 在 apiUsers API 中添加 sendRewardToos 方法,用于发送道具
- 在用户列表页面添加发放道具按钮和相关对话框
- 优化用户列表展示,添加积分数、门票数、比赛数等列- 在用户详情对话框中添加积分数、门票数、比赛数等信息
- 新增 GrantForm 接口,用于定义发放道具表单数据结构
fugui001 5 luni în urmă
părinte
comite
53085fe413

+ 13 - 1
src/api/system/business/apiUsers/index.ts

@@ -1,6 +1,6 @@
 import request from '@/utils/request';
 import { AxiosPromise } from 'axios';
-import { UserVO, UserForm, UserQuery } from '@/api/system/business/apiUsers/types';
+import { UserVO, UserForm, UserQuery, GrantForm } from '@/api/system/business/apiUsers/types';
 
 /**
  * 查询【请填写功能名称】列表
@@ -61,3 +61,15 @@ export const delUser = (id: string | number | Array<string | number>) => {
     method: 'delete'
   });
 };
+
+/**
+ * 发送道具
+ * @param data
+ */
+export const sendRewardToos = (data: GrantForm) => {
+  return request({
+    url: '/business/user/sendRewardToos',
+    method: 'post',
+    data: data
+  });
+};

+ 21 - 0
src/api/system/business/apiUsers/types.ts

@@ -239,6 +239,21 @@ export interface UserForm extends BaseEntity {
    * 积分
    */
   score?: string;
+
+  /**
+   * 积分数
+   */
+  pointsQuantity?: number;
+
+  /**
+   * 门票数
+   */
+  itemsQuantity?: number;
+
+  /**
+   * 参赛数
+   */
+  tournamentCount?: number;
 }
 
 export interface UserQuery extends PageQuery {
@@ -347,3 +362,9 @@ export interface UserQuery extends PageQuery {
    */
   params?: any;
 }
+export interface GrantForm extends BaseEntity {
+  itemId?: number;
+  quantity?: number;
+  phone?: string;
+  userId?: number;
+}

+ 131 - 13
src/views/system/business/apiUsers/index.vue

@@ -76,15 +76,15 @@
           </template>
         </el-table-column>
 
-        <el-table-column label="积分数" align="center" prop="" />
-        <el-table-column label="门票数" align="center" prop="" />
-        <el-table-column label="比赛数" align="center" prop="" />
+        <el-table-column label="积分数" align="center" prop="pointsQuantity" />
+        <el-table-column label="门票数" align="center" prop="itemsQuantity" />
+        <el-table-column label="比赛数" align="center" prop="tournamentCount" />
         <el-table-column label="账号状态" align="center" prop="statusText" />
 
         <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
           <template #default="scope">
             <el-tooltip content="查看" placement="top">
-              <el-button link type="primary" icon="View" @click="handleUpdate(scope.row)" v-hasPermi="['business:user:edit']"></el-button>
+              <el-button link type="primary" icon="View" @click="handleUpdate(scope.row)" v-hasPermi="['business:user:edit']">查看</el-button>
             </el-tooltip>
 
             <!-- 禁用/启用 按钮 -->
@@ -95,15 +95,22 @@
                 :icon="scope.row.status === 1 ? 'Lock' : 'Unlock'"
                 @click="toggleStatus(scope.row)"
                 v-hasPermi="['business:user:edit']"
-              ></el-button>
+              >
+                {{ scope.row.status === 1 ? '禁用' : '启用' }}
+              </el-button>
             </el-tooltip>
 
             <el-tooltip content="删除" placement="top">
-              <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['business:user:remove']"></el-button>
+              <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['business:user:remove']">删除</el-button>
             </el-tooltip>
 
-            <el-tooltip content="编辑" placement="top">
+            <!--            <el-tooltip content="编辑" placement="top">
               <el-button link type="primary" icon="Edit" @click="handleEdit(scope.row)" v-hasPermi="['business:user:edit']"></el-button>
+            </el-tooltip>-->
+            <el-tooltip content="发放道具" placement="top">
+              <el-button link type="primary" icon="Tools" @click="openGrantDialog(scope.row)" v-hasPermi="['business:user:remove']"
+                >发放道具</el-button
+              >
             </el-tooltip>
           </template>
         </el-table-column>
@@ -115,9 +122,11 @@
     <!-- 查看用户详情对话框 -->
     <el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
       <el-form ref="userFormRef" :model="form" :rules="rules" label-width="80px">
+<!--
         <el-form-item label="用户ID" prop="id">
           <el-input v-model="form.id" disabled />
         </el-form-item>
+-->
 
         <el-form-item label="登录名称" prop="loginName">
           <el-input v-model="form.loginName" disabled />
@@ -138,13 +147,13 @@
         </el-form-item>
 
         <el-form-item label="积分数" prop="email">
-          <el-input v-model="form.email" disabled />
+          <el-input v-model="form.pointsQuantity" disabled />
         </el-form-item>
         <el-form-item label="门票数" prop="nickName">
-          <el-input v-model="form.nickName" disabled />
+          <el-input v-model="form.itemsQuantity" disabled />
         </el-form-item>
-        <el-form-item label="比赛记录" prop="remark">
-          <el-input v-model="form.remark" disabled />
+        <el-form-item label="比赛" prop="remark">
+          <el-input v-model="form.tournamentCount" disabled />
         </el-form-item>
       </el-form>
       <template #footer>
@@ -182,13 +191,48 @@
         </div>
       </template>
     </el-dialog>
+
+    <!-- 发放道具弹窗 -->
+    <el-dialog v-model="grantDialogVisible" title="发放道具" width="400px">
+      <div class="dialog-content">
+        <!-- 左侧内容 -->
+        <div class="left-content">
+          <el-form :model="grantForm" ref="grantFormRef">
+            <el-input v-model="grantForm.userId" disabled v-show="false" />
+            <el-form-item label="手机号" prop="id">
+              <el-input v-model="grantForm.phone" disabled />
+            </el-form-item>
+            <el-form-item label="道具类型" prop="itemId">
+              <!-- 道具选择 -->
+              <el-select v-model="grantForm.itemId" placeholder="请选择道具" style="width: 120px; margin-right: 8px">
+                <el-option v-for="item in itemOptions" :key="item.id" :label="item.label" :value="item.id" />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="数量" prop="quantity">
+              <el-input-number v-model="grantForm.quantity" :min="1" :max="999999" />
+            </el-form-item>
+          </el-form>
+        </div>
+
+        <!-- 右侧内容 -->
+        <div class="right-content">
+          <!-- 这里可以放置其他内容或留空 -->
+        </div>
+      </div>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="grantDialogVisible = false">取消</el-button>
+          <el-button type="primary" @click="submitGrantForm">确认</el-button>
+        </span>
+      </template>
+    </el-dialog>
   </div>
 </template>
 
 <script setup name="User" lang="ts">
-import { listUser, getUser, delUser, addUser, updateUser } from '@/api/system/business/apiUsers';
+import { listUser, getUser, delUser, addUser, updateUser, sendRewardToos } from '@/api/system/business/apiUsers';
 import { UserVO, UserQuery, UserForm } from '@/api/system/business/apiUsers/types';
-
+import { selectItemsSelList } from '@/api/system/business/items';
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 
 const userList = ref<UserVO[]>([]);
@@ -437,5 +481,79 @@ const handlePhoneInput = (value: string) => {
 };
 onMounted(() => {
   getList();
+  loadItemOptions();
+});
+
+// 下拉选项数据 selectBlingStructuresInfo
+const itemOptions = ref<{ id: number; label: string }[]>([]);
+
+// 加载报名条件选项
+const loadItemOptions = async () => {
+  try {
+    const res = await selectItemsSelList();
+    if (res.code === 200) {
+      // 使用 unknown 中间类型进行类型转换
+      const data = res.data as unknown as { id: number; name: string }[];
+      const list = [];
+      for (let i = 0; i < data.length; i++) {
+        const item = data[i];
+        list.push({
+          id: item.id,
+          label: item.name
+        });
+      }
+      itemOptions.value = list;
+    } else {
+      alert('加载失败:' + res.msg);
+    }
+  } catch (error) {
+    console.error('请求出错:', error);
+  }
+};
+
+// 弹窗是否显示
+const grantDialogVisible = ref(false);
+// 表单数据
+const grantForm = ref({
+  itemId: null,
+  quantity: 1,
+  phone: null,
+  userId: null
 });
+
+// 表单校验规则
+const grantRules = {
+  itemId: [{ required: true, message: '请选择道具类型', trigger: 'change' }],
+  quantity: [
+    { required: true, message: '请输入数量', trigger: 'blur' },
+    { type: 'number', min: 1, message: '数量必须大于0', trigger: 'blur' }
+  ]
+};
+const currentUser = ref(null);
+// 打开弹窗
+const openGrantDialog = (row) => {
+  currentUser.value = row;
+  grantForm.value.phone = row.phone;
+  grantForm.value.userId = row.id;
+  grantForm.value.itemId = null;
+  grantForm.value.quantity = 1;
+  grantDialogVisible.value = true;
+};
+
+const submitGrantForm = async () => {
+  try {
+    if (grantForm.value.itemId == null) {
+      return proxy?.$modal.msgWarning('请选择对应道具');
+    }
+    if (grantForm.value.quantity == null) {
+      return proxy?.$modal.msgWarning('请选择对应道具数量');
+    }
+    await sendRewardToos(grantForm.value); // 调用更新接口
+    proxy?.$modal.msgSuccess('操作成功');
+    grantDialogVisible.value = false;
+    getList(); // 刷新列表
+  } catch (error) {
+    console.error(error);
+  }
+};
 </script>