[色子游戏]玩家钱包流水记录-优化样式

saiadmin-artd/src/components/sai/sa-search-bar/index.vue

@@ -14,12 +14,6 @@
         <ElCol :xs="24" :sm="24" :md="6" :lg="6" :xl="6" class="action-column">
           <div class="action-buttons-wrapper" :style="actionButtonsStyle">
             <div class="form-buttons">
-              <ElButton v-if="showReset" class="reset-button" @click="handleReset" v-ripple>
-                <template #icon>
-                  <ArtSvgIcon icon="ri:reset-right-line" />
-                </template>
-                {{ t('table.searchBar.reset') }}
-              </ElButton>
               <ElButton
                 v-if="showSearch"
                 type="primary"
@@ -33,6 +27,12 @@
                 </template>
                 {{ t('table.searchBar.search') }}
               </ElButton>
+              <ElButton v-if="showReset" class="reset-button" @click="handleReset" v-ripple>
+                <template #icon>
+                  <ArtSvgIcon icon="ri:reset-right-line" />
+                </template>
+                {{ t('table.searchBar.reset') }}
+              </ElButton>
             </div>
             <div v-if="showExpand" class="filter-toggle" @click="toggleExpand">
               <span>{{ expandToggleText }}</span>

saiadmin-artd/src/views/plugin/dice/api/player_wallet_record/index.ts

@@ -61,5 +61,24 @@ export default {
       url: '/dice/player_wallet_record/DicePlayerWalletRecord/destroy',
       data: params
     })
+  },
+
+  /**
+   * 获取玩家选项（id、username）用于下拉
+   */
+  getPlayerOptions() {
+    return request.get<{ id: number; username: string }[]>({
+      url: '/dice/player_wallet_record/DicePlayerWalletRecord/getPlayerOptions'
+    })
+  },
+
+  /**
+   * 获取指定玩家当前平台币（钱包操作前）
+   */
+  getPlayerWalletBefore(playerId: number | string) {
+    return request.get<{ wallet_before: number }>({
+      url: '/dice/player_wallet_record/DicePlayerWalletRecord/getPlayerWalletBefore',
+      params: { player_id: playerId }
+    })
   }
 }

saiadmin-artd/src/views/plugin/dice/player_wallet_record/index/index.vue

@@ -8,7 +8,11 @@
       <ArtTableHeader v-model:columns="columnChecks" :loading="loading" @refresh="refreshData">
         <template #left>
           <ElSpace wrap>
-            <ElButton v-permission="'dice:player_wallet_record:index:save'" @click="showDialog('add')" v-ripple>
+            <ElButton
+              v-permission="'dice:player_wallet_record:index:save'"
+              @click="showDialog('add')"
+              v-ripple
+            >
               <template #icon>
                 <ArtSvgIcon icon="ri:add-fill" />
               </template>
@@ -77,10 +81,12 @@
   import TableSearch from './modules/table-search.vue'
   import EditDialog from './modules/edit-dialog.vue'
 
-
   // 搜索表单
   const searchForm = ref({
     type: undefined,
+    username: undefined,
+    coin_min: undefined,
+    coin_max: undefined
   })
 
   // 搜索处理
@@ -89,6 +95,16 @@
     getData()
   }
 
+  // 类型展示：0=充值 1=提现 2=购买抽奖次数
+  const typeFormatter = (row: Record<string, unknown>) =>
+    row.type === 0 ? '充值' : row.type === 1 ? '提现' : row.type === 2 ? '购买抽奖次数' : '-'
+
+  // 用户列展示为 dicePlayer.username（兼容 dice_player）
+  const usernameFormatter = (row: Record<string, any>) => {
+    const player = row.dicePlayer ?? row.dice_player
+    return player?.username ?? row.player_id ?? '-'
+  }
+
   // 表格配置
   const {
     columns,
@@ -108,11 +124,18 @@
       apiFn: api.list,
       columnsFactory: () => [
         { type: 'selection' },
-        { prop: 'player_id', label: '用户id' },
+        { prop: 'id', label: 'ID', width: 80 },
-        { prop: 'coin', label: '平台币变化' },
+        { prop: 'player_id', label: '用户', width: 120, formatter: usernameFormatter },
-        { prop: 'type', label: '类型' },
+        { prop: 'coin', label: '平台币变化', width: 110 },
-        { prop: 'wallet_before', label: '钱包操作前' },
+        { prop: 'type', label: '类型', width: 120, formatter: typeFormatter },
-        { prop: 'wallet_after', label: '钱包操作后' },
+        { prop: 'wallet_before', label: '钱包操作前', width: 110 },
+        { prop: 'wallet_after', label: '钱包操作后', width: 110 },
+        {
+          prop: 'remark',
+          label: '备注',
+          width: 100,
+          showOverflowTooltip: true
+        },
         { prop: 'total_draw_count', label: '总抽奖次数' },
         { prop: 'paid_draw_count', label: '购买抽奖次数' },
         { prop: 'free_draw_count', label: '赠送抽奖次数' },
@@ -132,5 +155,4 @@
     handleSelectionChange,
     selectedRows
   } = useSaiAdmin()
-
 </script>

saiadmin-artd/src/views/plugin/dice/player_wallet_record/index/modules/edit-dialog.vue

@@ -8,29 +8,67 @@
     @close="handleClose"
   >
     <el-form ref="formRef" :model="formData" :rules="rules" label-width="120px">
-      <el-form-item label="用户id" prop="player_id">
+      <el-form-item label="用户" prop="player_id">
-        <el-cascader v-model="formData.player_id" :options="[]" placeholder="请选择用户id" allow-clear />
+        <el-select
-      </el-form-item>
+          v-model="formData.player_id"
-      <el-form-item label="平台币变化" prop="coin">
+          placeholder="请选择用户（显示用户名）"
-        <el-input-number v-model="formData.coin" placeholder="请输入平台币变化" />
+          clearable
+          filterable
+          style="width: 100%"
+          :disabled="dialogType === 'edit'"
+          @change="onPlayerChange"
+        >
+          <el-option
+            v-for="item in playerOptions"
+            :key="item.id"
+            :label="item.username"
+            :value="item.id"
+          />
+        </el-select>
       </el-form-item>
       <el-form-item label="类型" prop="type">
-        <el-select v-model="formData.type" :options="[]" placeholder="请选择类型" clearable />
+        <el-select v-model="formData.type" placeholder="请选择类型" clearable style="width: 100%">
+          <el-option label="充值" :value="0" />
+          <el-option label="提现" :value="1" />
+          <el-option label="购买抽奖次数" :value="2" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="平台币变化" prop="coin">
+        <el-input-number
+          v-model="formData.coin"
+          placeholder="正数增加、负数减少"
+          :precision="2"
+          style="width: 100%"
+          @change="onCoinChange"
+        />
       </el-form-item>
       <el-form-item label="钱包操作前" prop="wallet_before">
-        <el-input-number v-model="formData.wallet_before" placeholder="请输入钱包操作前" />
+        <el-input-number
+          v-model="formData.wallet_before"
+          placeholder="选择用户后自动带出当前平台币"
+          :precision="2"
+          disabled
+          style="width: 100%"
+        />
       </el-form-item>
       <el-form-item label="钱包操作后" prop="wallet_after">
-        <el-input-number v-model="formData.wallet_after" placeholder="请输入钱包操作后" />
+        <el-input-number
+          v-model="formData.wallet_after"
+          placeholder="根据平台币变化自动计算"
+          :precision="2"
+          disabled
+          style="width: 100%"
+        />
       </el-form-item>
-      <el-form-item label="总抽奖次数" prop="total_draw_count">
+      <el-form-item label="备注" prop="remark">
-        <el-input-number v-model="formData.total_draw_count" placeholder="请输入总抽奖次数" />
+        <el-input
-      </el-form-item>
+          v-model="formData.remark"
-      <el-form-item label="购买抽奖次数" prop="paid_draw_count">
+          type="textarea"
-        <el-input-number v-model="formData.paid_draw_count" placeholder="请输入购买抽奖次数" />
+          :rows="2"
-      </el-form-item>
+          placeholder="选填"
-      <el-form-item label="赠送抽奖次数" prop="free_draw_count">
+          maxlength="500"
-        <el-input-number v-model="formData.free_draw_count" placeholder="请输入赠送抽奖次数" />
+          show-word-limit
+        />
       </el-form-item>
     </el-form>
     <template #footer>
@@ -66,104 +104,120 @@
 
   const formRef = ref<FormInstance>()
 
-  /**
+  /** 玩家下拉选项（id、username） */
-   * 弹窗显示状态双向绑定
+  const playerOptions = ref<{ id: number; username: string }[]>([])
-   */
+
   const visible = computed({
     get: () => props.modelValue,
     set: (value) => emit('update:modelValue', value)
   })
 
-  /**
-   * 表单验证规则
-   */
   const rules = reactive<FormRules>({
-    player_id: [{ required: true, message: '用户id必需填写', trigger: 'blur' }],
+    player_id: [{ required: true, message: '请选择用户', trigger: 'change' }],
-    coin: [{ required: true, message: '平台币变化必需填写', trigger: 'blur' }],
+    coin: [{ required: true, message: '平台币变化必填', trigger: 'blur' }],
-    type: [{ required: true, message: '类型必需填写', trigger: 'blur' }],
+    type: [{ required: true, message: '请选择类型', trigger: 'change' }]
-    total_draw_count: [{ required: true, message: '总抽奖次数必需填写', trigger: 'blur' }],
-    paid_draw_count: [{ required: true, message: '购买抽奖次数必需填写', trigger: 'blur' }],
-    free_draw_count: [{ required: true, message: '赠送抽奖次数必需填写', trigger: 'blur' }],
   })
 
-  /**
-   * 初始数据
-   */
   const initialFormData = {
-    id: null,
+    id: null as number | null,
-    player_id: null,
+    player_id: null as number | null,
-    coin: '0.00',
+    coin: 0 as number,
-    type: null,
+    type: null as number | null,
-    wallet_before: '',
+    wallet_before: 0 as number,
-    wallet_after: '',
+    wallet_after: 0 as number,
-    total_draw_count: null,
+    remark: '' as string
-    paid_draw_count: null,
-    free_draw_count: null,
   }
 
-  /**
-   * 表单数据
-   */
   const formData = reactive({ ...initialFormData })
 
-  /**
+  /** 选择用户后拉取当前平台币作为钱包操作前 */
-   * 监听弹窗打开，初始化表单数据
+  async function onPlayerChange(playerId: number | null) {
-   */
+    if (playerId == null) {
+      formData.wallet_before = 0
+      calcWalletAfter()
+      return
+    }
+    try {
+      const res = await api.getPlayerWalletBefore(playerId)
+      const before = res?.wallet_before ?? 0
+      formData.wallet_before = Number(before)
+      calcWalletAfter()
+    } catch {
+      formData.wallet_before = 0
+      calcWalletAfter()
+    }
+  }
+
+  /** 平台币变化时重算钱包操作后 */
+  function onCoinChange() {
+    calcWalletAfter()
+  }
+
+  /** 钱包操作后 = 钱包操作前 + 平台币变化 */
+  function calcWalletAfter() {
+    const before = Number(formData.wallet_before) || 0
+    const coin = Number(formData.coin) || 0
+    formData.wallet_after = Math.round((before + coin) * 100) / 100
+  }
+
   watch(
     () => props.modelValue,
-    (newVal) => {
+    async (open) => {
-      if (newVal) {
+      if (open) {
         initPage()
+        try {
+          const list = await api.getPlayerOptions()
+          playerOptions.value = Array.isArray(list) ? list : []
+        } catch {
+          playerOptions.value = []
+        }
       }
     }
   )
 
-  /**
-   * 初始化页面数据
-   */
   const initPage = async () => {
-    // 先重置为初始值
     Object.assign(formData, initialFormData)
-    // 如果有数据，则填充数据
     if (props.data) {
       await nextTick()
       initForm()
     }
   }
 
-  /**
+  const numKeys = ['id', 'player_id', 'coin', 'type', 'wallet_before', 'wallet_after']
-   * 初始化表单数据
+
-   */
   const initForm = () => {
-    if (props.data) {
+    if (!props.data) return
-      for (const key in formData) {
+    for (const key of Object.keys(formData)) {
-        if (props.data[key] != null && props.data[key] != undefined) {
+      if (!(key in props.data)) continue
-          ;(formData as any)[key] = props.data[key]
+      const val = props.data[key]
+      if (numKeys.includes(key)) {
+        if (key === 'id' || key === 'player_id' || key === 'type') {
+          ;(formData as any)[key] = val != null && val !== '' ? Number(val) : null
+        } else {
+          ;(formData as any)[key] = val != null && val !== '' ? Number(val) : 0
         }
+      } else {
+        ;(formData as any)[key] = val ?? ''
       }
     }
   }
 
-  /**
-   * 关闭弹窗并重置表单
-   */
   const handleClose = () => {
     visible.value = false
     formRef.value?.resetFields()
   }
 
-  /**
-   * 提交表单
-   */
   const handleSubmit = async () => {
     if (!formRef.value) return
     try {
       await formRef.value.validate()
+      calcWalletAfter()
+      const payload = { ...formData }
       if (props.dialogType === 'add') {
-        await api.save(formData)
+        await api.save(payload)
         ElMessage.success('新增成功')
       } else {
-        await api.update(formData)
+        await api.update(payload)
         ElMessage.success('修改成功')
       }
       emit('success')

saiadmin-artd/src/views/plugin/dice/player_wallet_record/index/modules/table-search.vue

@@ -8,9 +8,39 @@
     @search="handleSearch"
     @expand="handleExpand"
   >
-    <el-col v-bind="setSpan(6)">
+    <el-col v-bind="setSpan(5)">
       <el-form-item label="类型" prop="type">
-        <el-select v-model="formData.type" :options="[]" placeholder="请选择类型" clearable />
+        <el-select v-model="formData.type" placeholder="全部" clearable style="width: 100%">
+          <el-option label="充值" :value="0" />
+          <el-option label="提现" :value="1" />
+          <el-option label="购买抽奖次数" :value="2" />
+        </el-select>
+      </el-form-item>
+    </el-col>
+    <el-col v-bind="setSpan(5)">
+      <el-form-item label="用户(用户名)" prop="username">
+        <el-input v-model="formData.username" placeholder="按用户名搜索" clearable />
+      </el-form-item>
+    </el-col>
+    <el-col v-bind="setSpan(8)">
+      <el-form-item label="平台币" prop="coin_min">
+        <div class="coin-range-wrap">
+          <el-input-number
+            v-model="formData.coin_min"
+            placeholder="最小"
+            :precision="2"
+            controls-position="right"
+            class="coin-range-input"
+          />
+          <span class="coin-range-sep">至</span>
+          <el-input-number
+            v-model="formData.coin_max"
+            placeholder="最大"
+            :precision="2"
+            controls-position="right"
+            class="coin-range-input"
+          />
+        </div>
       </el-form-item>
     </el-col>
   </sa-search-bar>
@@ -65,3 +95,22 @@
     }
   }
 </script>
+
+<style lang="scss" scoped>
+  .coin-range-wrap {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    min-width: 0; /* 允许在栅格内收缩，避免挤压右侧按钮 */
+  }
+
+  .coin-range-input {
+    flex: 1;
+    min-width: 0; /* 数字框可收缩 */
+  }
+
+  .coin-range-sep {
+    color: var(--el-text-color-secondary);
+    flex-shrink: 0;
+  }
+</style>

server/app/dice/controller/player_wallet_record/DicePlayerWalletRecordController.php

@@ -9,6 +9,7 @@ namespace app\dice\controller\player_wallet_record;
 use plugin\saiadmin\basic\BaseController;
 use app\dice\logic\player_wallet_record\DicePlayerWalletRecordLogic;
 use app\dice\validate\player_wallet_record\DicePlayerWalletRecordValidate;
+use app\dice\model\player\DicePlayer;
 use plugin\saiadmin\service\Permission;
 use support\Request;
 use support\Response;
@@ -38,6 +39,9 @@ class DicePlayerWalletRecordController extends BaseController
     {
         $where = $request->more([
             ['type', ''],
+            ['username', ''],
+            ['coin_min', ''],
+            ['coin_max', ''],
         ]);
         $query = $this->logic->search($where);
         $query->with([
@@ -47,6 +51,41 @@ class DicePlayerWalletRecordController extends BaseController
         return $this->success($data);
     }
 
+    /**
+     * 获取玩家选项（id、username）用于下拉
+     * @param Request $request
+     * @return Response
+     */
+    #[Permission('玩家钱包流水列表', 'dice:player_wallet_record:index:index')]
+    public function getPlayerOptions(Request $request): Response
+    {
+        $list = DicePlayer::field('id,username')->select();
+        $data = $list->map(function ($item) {
+            return ['id' => $item['id'], 'username' => $item['username'] ?? ''];
+        })->toArray();
+        return $this->success($data);
+    }
+
+    /**
+     * 获取指定玩家当前平台币（用于钱包操作前）
+     * 类型 0=充值 1=提现 2=购买抽奖次数，操作前均为当前平台币
+     * @param Request $request
+     * @return Response
+     */
+    #[Permission('玩家钱包流水读取', 'dice:player_wallet_record:index:read')]
+    public function getPlayerWalletBefore(Request $request): Response
+    {
+        $playerId = $request->input('player_id');
+        if ($playerId === null || $playerId === '') {
+            return $this->fail('缺少 player_id');
+        }
+        $player = DicePlayer::field('coin')->where('id', $playerId)->find();
+        if (!$player) {
+            return $this->fail('玩家不存在');
+        }
+        return $this->success(['wallet_before' => (float) $player['coin']]);
+    }
+
     /**
      * 读取数据
      * @param Request $request

server/app/dice/logic/player_wallet_record/DicePlayerWalletRecordLogic.php

@@ -24,4 +24,15 @@ class DicePlayerWalletRecordLogic extends BaseLogic
         $this->model = new DicePlayerWalletRecord();
     }
 
+    /**
+     * 添加数据（补全抽奖次数字段默认值）
+     */
+    public function add(array $data): mixed
+    {
+        $data['total_draw_count'] = $data['total_draw_count'] ?? 0;
+        $data['paid_draw_count'] = $data['paid_draw_count'] ?? 0;
+        $data['free_draw_count'] = $data['free_draw_count'] ?? 0;
+        return parent::add($data);
+    }
+
 }

server/app/dice/model/player_wallet_record/DicePlayerWalletRecord.php

@@ -17,12 +17,13 @@ use plugin\saiadmin\basic\think\BaseModel;
  * @property  $id ID
  * @property  $player_id 用户id
  * @property  $coin 平台币变化
- * @property  $type 类型
+ * @property  $type 类型:0=充值 1=提现 2=购买抽奖次数
  * @property  $wallet_before 钱包操作前
  * @property  $wallet_after 钱包操作后
  * @property  $total_draw_count 总抽奖次数
  * @property  $paid_draw_count 购买抽奖次数
  * @property  $free_draw_count 赠送抽奖次数
+ * @property  $remark 备注
  * @property  $create_time 创建时间
  * @property  $update_time 修改时间
  */
@@ -48,4 +49,49 @@ class DicePlayerWalletRecord extends BaseModel
         return $this->belongsTo(DicePlayer::class, 'player_id', 'id');
     }
 
+    /**
+     * 类型 搜索
+     */
+    public function searchTypeAttr($query, $value)
+    {
+        if ($value !== '' && $value !== null) {
+            $query->where('type', '=', $value);
+        }
+    }
+
+    /**
+     * 按关联玩家用户名搜索（dicePlayer.username）
+     */
+    public function searchUsernameAttr($query, $value)
+    {
+        if ($value === '' || $value === null) {
+            return;
+        }
+        $playerIds = DicePlayer::where('username', 'like', '%' . $value . '%')->column('id');
+        if (!empty($playerIds)) {
+            $query->whereIn('player_id', $playerIds);
+        } else {
+            $query->whereRaw('1=0');
+        }
+    }
+
+    /**
+     * 平台币下限 搜索（withSearch 用 Str::studly 故方法名为 searchCoinMinAttr）
+     */
+    public function searchCoinMinAttr($query, $value)
+    {
+        if ($value !== '' && $value !== null) {
+            $query->where('coin', '>=', $value);
+        }
+    }
+
+    /**
+     * 平台币上限 搜索（withSearch 用 Str::studly 故方法名为 searchCoinMaxAttr）
+     */
+    public function searchCoinMaxAttr($query, $value)
+    {
+        if ($value !== '' && $value !== null) {
+            $query->where('coin', '<=', $value);
+        }
+    }
 }

server/app/dice/validate/player_wallet_record/DicePlayerWalletRecordValidate.php

@@ -16,47 +16,31 @@ class DicePlayerWalletRecordValidate extends BaseValidate
     /**
      * 定义验证规则
      */
-    protected $rule =   [
+    protected $rule = [
         'player_id' => 'require',
         'coin' => 'require',
         'type' => 'require',
-        'total_draw_count' => 'require',
+        'wallet_before' => 'require',
-        'paid_draw_count' => 'require',
+        'wallet_after' => 'require',
-        'free_draw_count' => 'require',
     ];
 
     /**
      * 定义错误信息
      */
-    protected $message  =   [
+    protected $message = [
-        'player_id' => '用户id必须填写',
+        'player_id' => '用户必须选择',
         'coin' => '平台币变化必须填写',
         'type' => '类型必须填写',
-        'total_draw_count' => '总抽奖次数必须填写',
+        'wallet_before' => '钱包操作前不能为空',
-        'paid_draw_count' => '购买抽奖次数必须填写',
+        'wallet_after' => '钱包操作后不能为空',
-        'free_draw_count' => '赠送抽奖次数必须填写',
     ];
 
     /**
      * 定义场景
      */
     protected $scene = [
-        'save' => [
+        'save' => ['player_id', 'coin', 'type', 'wallet_before', 'wallet_after'],
-            'player_id',
+        'update' => ['player_id', 'coin', 'type', 'wallet_before', 'wallet_after'],
-            'coin',
-            'type',
-            'total_draw_count',
-            'paid_draw_count',
-            'free_draw_count',
-        ],
-        'update' => [
-            'player_id',
-            'coin',
-            'type',
-            'total_draw_count',
-            'paid_draw_count',
-            'free_draw_count',
-        ],
     ];
 
 }