功能:送花/礼物系统完整开发
- 新增 Gift 模型和 gifts 数据表(7种默认花卉,各有图片/金币/魅力配置) - 7张花卉图片生成并存放于 public/images/gifts/ - 名片弹窗新增送礼物 UI:图片选择列表、金币/魅力标注、数量选择 - sendFlower 控制器方法:按 gift_id 查找礼物、扣金币、加魅力、广播消息 - 聊天消息渲染支持显示礼物图片(含弹跳动画效果) - 后台可在 gifts 表中管理花卉类型(名称、图标、图片、金币、魅力、排序、启禁用)
@@ -17,8 +17,10 @@ use App\Events\UserLeft;
|
||||
use App\Http\Requests\SendMessageRequest;
|
||||
use App\Jobs\SaveMessageJob;
|
||||
use App\Models\Autoact;
|
||||
use App\Models\Gift;
|
||||
use App\Models\Room;
|
||||
use App\Models\Sysparam;
|
||||
use App\Models\User;
|
||||
use App\Services\ChatStateService;
|
||||
use App\Services\MessageFilterService;
|
||||
use App\Services\VipService;
|
||||
@@ -433,6 +435,99 @@ class ChatController extends Controller
|
||||
]);
|
||||
}
|
||||
|
||||
/**
|
||||
* 送花/礼物:消耗金币给目标用户增加魅力值
|
||||
*
|
||||
* 根据 gift_id 查找 gifts 表中的礼物类型,读取对应的金币消耗和魅力增量。
|
||||
* 送花成功后在聊天室广播带图片的消息。
|
||||
*/
|
||||
public function sendFlower(Request $request): JsonResponse
|
||||
{
|
||||
$request->validate([
|
||||
'to_user' => 'required|string',
|
||||
'room_id' => 'required|integer',
|
||||
'gift_id' => 'required|integer',
|
||||
'count' => 'sometimes|integer|min:1|max:99',
|
||||
]);
|
||||
|
||||
$user = Auth::user();
|
||||
if (! $user) {
|
||||
return response()->json(['status' => 'error', 'message' => '请先登录'], 401);
|
||||
}
|
||||
|
||||
$toUsername = $request->input('to_user');
|
||||
$roomId = $request->input('room_id');
|
||||
$giftId = $request->integer('gift_id');
|
||||
$count = $request->integer('count', 1);
|
||||
|
||||
// 不能给自己送花
|
||||
if ($toUsername === $user->username) {
|
||||
return response()->json(['status' => 'error', 'message' => '不能给自己送花哦~']);
|
||||
}
|
||||
|
||||
// 查找礼物类型
|
||||
$gift = Gift::where('id', $giftId)->where('is_active', true)->first();
|
||||
if (! $gift) {
|
||||
return response()->json(['status' => 'error', 'message' => '礼物不存在或已下架']);
|
||||
}
|
||||
|
||||
// 查找目标用户
|
||||
$toUser = User::where('username', $toUsername)->first();
|
||||
if (! $toUser) {
|
||||
return response()->json(['status' => 'error', 'message' => '用户不存在']);
|
||||
}
|
||||
|
||||
$totalCost = $gift->cost * $count;
|
||||
$totalCharm = $gift->charm * $count;
|
||||
|
||||
// 检查金币余额
|
||||
if (($user->jjb ?? 0) < $totalCost) {
|
||||
return response()->json([
|
||||
'status' => 'error',
|
||||
'message' => "金币不足!送 {$count} 份【{$gift->name}】需要 {$totalCost} 金币,您当前有 ".($user->jjb ?? 0).' 枚。',
|
||||
]);
|
||||
}
|
||||
|
||||
// 扣除金币、增加对方魅力
|
||||
$user->jjb = ($user->jjb ?? 0) - $totalCost;
|
||||
$user->save();
|
||||
|
||||
$toUser->meili = ($toUser->meili ?? 0) + $totalCharm;
|
||||
$toUser->save();
|
||||
|
||||
// 构建礼物图片 URL
|
||||
$giftImageUrl = $gift->image ? "/images/gifts/{$gift->image}" : '';
|
||||
|
||||
// 广播送花消息(含图片标记,前端识别后渲染图片)
|
||||
$countText = $count > 1 ? " {$count} 份" : '';
|
||||
$sysMsg = [
|
||||
'id' => $this->chatState->nextMessageId($roomId),
|
||||
'room_id' => $roomId,
|
||||
'from_user' => '系统传音',
|
||||
'to_user' => '大家',
|
||||
'content' => "{$gift->emoji} {$user->username} 向 {$toUsername} 送出了{$countText}【{$gift->name}】!魅力 +{$totalCharm}!",
|
||||
'is_secret' => false,
|
||||
'font_color' => '#e91e8f',
|
||||
'action' => '',
|
||||
'sent_at' => now()->toDateTimeString(),
|
||||
'gift_image' => $giftImageUrl,
|
||||
'gift_name' => $gift->name,
|
||||
];
|
||||
|
||||
$this->chatState->pushMessage($roomId, $sysMsg);
|
||||
broadcast(new MessageSent($roomId, $sysMsg));
|
||||
SaveMessageJob::dispatch($sysMsg);
|
||||
|
||||
return response()->json([
|
||||
'status' => 'success',
|
||||
'message' => "送花成功!花费 {$totalCost} 金币,{$toUsername} 魅力 +{$totalCharm}",
|
||||
'data' => [
|
||||
'my_jjb' => $user->jjb,
|
||||
'target_charm' => $toUser->meili,
|
||||
],
|
||||
]);
|
||||
}
|
||||
|
||||
/**
|
||||
* 解析奖励数值配置(支持固定值或范围格式)
|
||||
*
|
||||
|
||||
53
app/Models/Gift.php
Normal file
@@ -0,0 +1,53 @@
|
||||
<?php
|
||||
|
||||
/**
|
||||
* 文件功能:礼物/鲜花模型
|
||||
* 存储各种礼物的名称、图标、金币消耗、魅力增量等信息。
|
||||
* 后台可完整 CRUD 管理,前端名片弹窗中展示可送的礼物列表。
|
||||
*
|
||||
* @author ChatRoom Laravel
|
||||
*
|
||||
* @version 1.0.0
|
||||
*/
|
||||
|
||||
namespace App\Models;
|
||||
|
||||
use Illuminate\Database\Eloquent\Model;
|
||||
|
||||
class Gift extends Model
|
||||
{
|
||||
/** @var string 表名 */
|
||||
protected $table = 'gifts';
|
||||
|
||||
/** @var array 可批量赋值字段 */
|
||||
protected $fillable = [
|
||||
'name',
|
||||
'emoji',
|
||||
'image',
|
||||
'cost',
|
||||
'charm',
|
||||
'sort_order',
|
||||
'is_active',
|
||||
];
|
||||
|
||||
/** @var array 类型转换 */
|
||||
protected $casts = [
|
||||
'cost' => 'integer',
|
||||
'charm' => 'integer',
|
||||
'sort_order' => 'integer',
|
||||
'is_active' => 'boolean',
|
||||
];
|
||||
|
||||
/**
|
||||
* 获取所有启用的礼物列表(按排序字段排列)
|
||||
*
|
||||
* @return \Illuminate\Database\Eloquent\Collection
|
||||
*/
|
||||
public static function activeList()
|
||||
{
|
||||
return static::where('is_active', true)
|
||||
->orderBy('sort_order')
|
||||
->orderBy('cost')
|
||||
->get();
|
||||
}
|
||||
}
|
||||
57
database/migrations/2026_02_27_005300_create_gifts_table.php
Normal file
@@ -0,0 +1,57 @@
|
||||
<?php
|
||||
|
||||
/**
|
||||
* 文件功能:创建 gifts 礼物表并填充默认鲜花数据
|
||||
*
|
||||
* 礼物系统支持后台管理多种花/礼物类型,每种有不同的金币消耗和魅力增量。
|
||||
* 图片存放在 public/images/gifts/ 目录下。
|
||||
*
|
||||
* @author ChatRoom Laravel
|
||||
*
|
||||
* @version 1.0.0
|
||||
*/
|
||||
|
||||
use Illuminate\Database\Migrations\Migration;
|
||||
use Illuminate\Database\Schema\Blueprint;
|
||||
use Illuminate\Support\Facades\DB;
|
||||
use Illuminate\Support\Facades\Schema;
|
||||
|
||||
return new class extends Migration
|
||||
{
|
||||
/**
|
||||
* 创建 gifts 表并填充默认礼物数据
|
||||
*/
|
||||
public function up(): void
|
||||
{
|
||||
Schema::create('gifts', function (Blueprint $table) {
|
||||
$table->id();
|
||||
$table->string('name', 50)->comment('礼物名称');
|
||||
$table->string('emoji', 10)->comment('显示图标/emoji');
|
||||
$table->string('image', 100)->nullable()->comment('礼物图片路径(相对 /images/gifts/)');
|
||||
$table->unsignedInteger('cost')->default(0)->comment('消耗金币数');
|
||||
$table->unsignedInteger('charm')->default(1)->comment('增加魅力值');
|
||||
$table->unsignedTinyInteger('sort_order')->default(0)->comment('排序(越小越靠前)');
|
||||
$table->boolean('is_active')->default(true)->comment('是否启用');
|
||||
$table->timestamps();
|
||||
});
|
||||
|
||||
// 填充默认鲜花数据(图片文件名与 sort_order 对应)
|
||||
DB::table('gifts')->insert([
|
||||
['name' => '小雏菊', 'emoji' => '🌼', 'image' => 'daisy.png', 'cost' => 5, 'charm' => 1, 'sort_order' => 1, 'is_active' => true, 'created_at' => now(), 'updated_at' => now()],
|
||||
['name' => '玫瑰花', 'emoji' => '🌹', 'image' => 'rose.png', 'cost' => 10, 'charm' => 2, 'sort_order' => 2, 'is_active' => true, 'created_at' => now(), 'updated_at' => now()],
|
||||
['name' => '向日葵', 'emoji' => '🌻', 'image' => 'sunflower.png', 'cost' => 20, 'charm' => 5, 'sort_order' => 3, 'is_active' => true, 'created_at' => now(), 'updated_at' => now()],
|
||||
['name' => '樱花束', 'emoji' => '🌸', 'image' => 'sakura.png', 'cost' => 50, 'charm' => 12, 'sort_order' => 4, 'is_active' => true, 'created_at' => now(), 'updated_at' => now()],
|
||||
['name' => '满天星', 'emoji' => '💐', 'image' => 'bouquet.png', 'cost' => 100, 'charm' => 30, 'sort_order' => 5, 'is_active' => true, 'created_at' => now(), 'updated_at' => now()],
|
||||
['name' => '蓝色妖姬', 'emoji' => '🪻', 'image' => 'bluerose.png', 'cost' => 200, 'charm' => 66, 'sort_order' => 6, 'is_active' => true, 'created_at' => now(), 'updated_at' => now()],
|
||||
['name' => '钻石花冠', 'emoji' => '👑', 'image' => 'crown.png', 'cost' => 520, 'charm' => 188, 'sort_order' => 7, 'is_active' => true, 'created_at' => now(), 'updated_at' => now()],
|
||||
]);
|
||||
}
|
||||
|
||||
/**
|
||||
* 回滚:删除 gifts 表
|
||||
*/
|
||||
public function down(): void
|
||||
{
|
||||
Schema::dropIfExists('gifts');
|
||||
}
|
||||
};
|
||||
@@ -628,4 +628,25 @@ a:hover {
|
||||
.avatar-option.selected {
|
||||
border-color: #336699;
|
||||
box-shadow: 0 0 6px rgba(51, 102, 153, 0.5);
|
||||
}
|
||||
|
||||
/* 送花礼物弹跳动画 */
|
||||
@keyframes giftBounce {
|
||||
0% {
|
||||
transform: scale(0.3) rotate(-15deg);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: scale(1.3) rotate(5deg);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
70% {
|
||||
transform: scale(0.9) rotate(-3deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(1) rotate(0deg);
|
||||
}
|
||||
}
|
||||
BIN
public/images/gifts/bluerose.png
Normal file
|
After Width: | Height: | Size: 48 KiB |
BIN
public/images/gifts/bouquet.png
Normal file
|
After Width: | Height: | Size: 38 KiB |
BIN
public/images/gifts/crown.png
Normal file
|
After Width: | Height: | Size: 70 KiB |
BIN
public/images/gifts/daisy.png
Normal file
|
After Width: | Height: | Size: 62 KiB |
BIN
public/images/gifts/rose.png
Normal file
|
After Width: | Height: | Size: 47 KiB |
BIN
public/images/gifts/sakura.png
Normal file
|
After Width: | Height: | Size: 89 KiB |
BIN
public/images/gifts/sunflower.png
Normal file
|
After Width: | Height: | Size: 65 KiB |
@@ -240,7 +240,14 @@
|
||||
// 管理员公告/系统传音:大字醒目样式
|
||||
div.style.cssText =
|
||||
'background: linear-gradient(135deg, #fef2f2, #fff1f2); border: 2px solid #ef4444; border-radius: 6px; padding: 8px 12px; margin: 4px 0; box-shadow: 0 2px 4px rgba(239,68,68,0.15);';
|
||||
html = `<div style="font-size: 14px; font-weight: bold; color: #dc2626;">${msg.content}</div>`;
|
||||
// 如果是送花消息,显示礼物图片
|
||||
let giftHtml = '';
|
||||
if (msg.gift_image) {
|
||||
giftHtml =
|
||||
`<img src="${msg.gift_image}" alt="${msg.gift_name || ''}" style="display:inline-block;width:40px;height:40px;vertical-align:middle;margin-left:6px;animation:giftBounce 0.6s ease-in-out;">`;
|
||||
}
|
||||
html =
|
||||
`<div style="font-size: 14px; font-weight: bold; color: #dc2626;">${msg.content}${giftHtml}</div>`;
|
||||
} else {
|
||||
// 其他系统用户(钓鱼播报、AI小助手等):普通样式
|
||||
html =
|
||||
|
||||
@@ -62,6 +62,7 @@
|
||||
</script>
|
||||
|
||||
{{-- ═══════════ 用户名片弹窗 (Alpine.js) ═══════════ --}}
|
||||
@php $gifts = \App\Models\Gift::activeList(); @endphp
|
||||
<div id="user-modal-container" x-data="{
|
||||
showUserModal: false,
|
||||
userInfo: {},
|
||||
@@ -71,6 +72,10 @@
|
||||
whisperList: [],
|
||||
showAnnounce: false,
|
||||
announceText: '',
|
||||
gifts: {{ Js::from($gifts) }},
|
||||
selectedGiftId: {{ $gifts->first()?->id ?? 0 }},
|
||||
giftCount: 1,
|
||||
sendingGift: false,
|
||||
|
||||
async fetchUser(username) {
|
||||
try {
|
||||
@@ -227,8 +232,20 @@
|
||||
alert(data.message);
|
||||
}
|
||||
} catch (e) { alert('网络异常'); }
|
||||
}
|
||||
}">
|
||||
},
|
||||
|
||||
async sendGift() {
|
||||
if (this.sendingGift || !this.selectedGiftId) return;
|
||||
this.sendingGift = true;
|
||||
try {
|
||||
const res = await fetch('/gift/flower', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content'), 'Content-Type'
|
||||
: 'application/json' , 'Accept' : 'application/json' }, body: JSON.stringify({ to_user: this.userInfo.username,
|
||||
room_id: window.chatContext.roomId, gift_id: this.selectedGiftId, count: this.giftCount }) }); const data=await
|
||||
res.json(); alert(data.message); if (data.status === 'success') { this.showUserModal=false; this.giftCount=1; } }
|
||||
catch (e) { alert('网络异常'); } this.sendingGift=false; } }">
|
||||
<div x-show="showUserModal" style="display: none;" class="modal-overlay" x-on:click.self="showUserModal = false">
|
||||
<div class="modal-card" x-transition>
|
||||
{{-- 弹窗头部 --}}
|
||||
@@ -273,6 +290,39 @@
|
||||
</a>
|
||||
</div>
|
||||
|
||||
{{-- 送花/礼物互动区 --}}
|
||||
<div style="padding: 0 16px 12px;" x-show="userInfo.username !== window.chatContext.username">
|
||||
<div style="font-size: 11px; color: #e91e8f; margin-bottom: 6px; font-weight: bold;">🎁 送礼物</div>
|
||||
{{-- 礼物选择列表 --}}
|
||||
<div style="display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 8px;">
|
||||
<template x-for="g in gifts" :key="g.id">
|
||||
<div x-on:click="selectedGiftId = g.id"
|
||||
:style="selectedGiftId === g.id ? 'border: 2px solid #e91e63; background: #fce4ec;' :
|
||||
'border: 2px solid #eee; background: #fafafa;'"
|
||||
style="width: 68px; padding: 4px 2px; border-radius: 6px; text-align: center; cursor: pointer; transition: all 0.15s;">
|
||||
<img :src="'/images/gifts/' + g.image"
|
||||
style="width: 36px; height: 36px; object-fit: contain;" :alt="g.name">
|
||||
<div style="font-size: 10px; color: #333; margin-top: 2px;" x-text="g.name"></div>
|
||||
<div style="font-size: 9px; color: #e91e63;" x-text="g.cost + '💰 +' + g.charm + '✨'"></div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
{{-- 数量 + 送出按钮 --}}
|
||||
<div style="display: flex; gap: 6px; align-items: center;">
|
||||
<select x-model.number="giftCount"
|
||||
style="width: 60px; padding: 3px; border: 1px solid #f0a0c0; border-radius: 4px; font-size: 12px;">
|
||||
<option value="1">×1</option>
|
||||
<option value="5">×5</option>
|
||||
<option value="10">×10</option>
|
||||
<option value="99">×99</option>
|
||||
</select>
|
||||
<button x-on:click="sendGift()" :disabled="sendingGift"
|
||||
style="flex: 1; padding: 6px 10px; background: linear-gradient(135deg, #ff6b9d, #e91e63); color: #fff; border: none; border-radius: 6px; font-size: 12px; font-weight: bold; cursor: pointer; transition: opacity 0.15s;"
|
||||
:style="sendingGift ? 'opacity: 0.5; cursor: not-allowed;' : ''"
|
||||
x-text="sendingGift ? '送出中...' : '送出 💝'"></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- 特权操作(各按钮按等级独立显示) --}}
|
||||
@if ($myLevel >= $levelWarn || $room->master == Auth::user()->username)
|
||||
<div style="padding: 0 16px 12px;"
|
||||
|
||||
@@ -86,6 +86,9 @@ Route::middleware(['chat.auth'])->group(function () {
|
||||
Route::post('/chatbot/chat', [ChatBotController::class, 'chat'])->name('chatbot.chat');
|
||||
Route::post('/chatbot/clear', [ChatBotController::class, 'clearContext'])->name('chatbot.clear');
|
||||
|
||||
// ---- 送花/礼物互动 ----
|
||||
Route::post('/gift/flower', [ChatController::class, 'sendFlower'])->name('gift.flower');
|
||||
|
||||
// ---- 管理员命令(聊天室内实时操作)----
|
||||
Route::post('/command/warn', [AdminCommandController::class, 'warn'])->name('command.warn');
|
||||
Route::post('/command/kick', [AdminCommandController::class, 'kick'])->name('command.kick');
|
||||
|
||||