lkddi/chatroom
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 4 Wiki Activity

feat: 任命/撤销通知系统 + 用户名片UI优化

Browse Source 
- 任命/撤销事件增加 type 字段区分类型
- 任命：全屏礼花 + 紫色弹窗 + 紫色系统消息
- 撤销：灰色弹窗 + 灰色系统消息，无礼花
- 消息分发：操作者/被操作者显示在私聊面板，其他人显示在公屏
- 系统消息加随机鼓励语（各5条轮换）
- ChatStateService 修复 Redis key 前缀扫描问题（getAllActiveRoomIds）
- 用户名片折叠优化：管理员视野、职务履历均可折叠
- 管理操作 + 职务操作合并为「🔧 管理操作」折叠区
- 悄悄话改为「🎁 送礼物」按钮，礼物面板内联展开
This commit is contained in:
流星
2026-02-28 23:44:38 +08:00
parent a599047cf0
commit 5f30220609
80 changed files with 8579 additions and 473 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/chat/partials/user-actions.blade.php
+329 -134
View File
@@ -89,6 +89,18 @@
giftCount: 1,
sendingGift: false,
// 任命相关
showAppointPanel: false,
appointPositions: [],
selectedPositionId: null,
appointRemark: '',
appointLoading: false,
// 折叠状态
showAdminView: false, // 管理员视野
showPositionHistory: false, // 职务履历
showAdminPanel: false, // 管理操作（管理操作+职务操作合并）
/** 获取用户资料 */
async fetchUser(username) {
try {
@@ -102,7 +114,6 @@
if (!res.ok) {
const errorData = await res.json().catch(() => ({}));
console.error('Failed to fetch user:', errorData.message || res.statusText);
// 如果是 404 或者 500 等错误，直接静默退出或提示
return;
}
@@ -113,12 +124,90 @@
this.isMuting = false;
this.showWhispers = false;
this.whisperList = [];
this.showAppointPanel = false;
this.selectedPositionId = null;
this.appointRemark = '';
// 有职务的操作人预加载可用职务列表
if (window.chatContext?.hasPosition) {
this._loadPositions();
}
}
} catch (e) {
console.error('Error fetching user:', e);
}
},
/** 加载可任命职务列表 */
async _loadPositions() {
if (!window.chatContext?.appointPositionsUrl) return;
try {
const res = await fetch(window.chatContext.appointPositionsUrl, {
headers: {
'Accept': 'application/json'
}
});
const data = await res.json();
if (data.status === 'success') {
this.appointPositions = data.positions;
if (this.appointPositions.length > 0) {
this.selectedPositionId = this.appointPositions[0].id;
}
}
} catch (e) {
/* 静默失败 */
}
},
/** 快速任命 */
async doAppoint() {
if (this.appointLoading || !this.selectedPositionId) return;
this.appointLoading = true;
try {
const res = await fetch(window.chatContext.appointUrl, {
method: 'POST',
headers: this._headers(),
body: JSON.stringify({
username: this.userInfo.username,
position_id: this.selectedPositionId,
remark: this.appointRemark.trim() || null,
room_id: window.chatContext.roomId ?? null,
})
});
const data = await res.json();
alert(data.message);
if (data.status === 'success') {
this.showUserModal = false;
}
} catch (e) {
alert('网络异常');
}
this.appointLoading = false;
},
/** 快速撤销 */
async doRevoke() {
if (!confirm('确定要撤销 ' + this.userInfo.username + ' 的职务吗？')) return;
this.appointLoading = true;
try {
const res = await fetch(window.chatContext.revokeUrl, {
method: 'POST',
headers: this._headers(),
body: JSON.stringify({
username: this.userInfo.username,
remark: '聊天室快速撤销',
room_id: window.chatContext.roomId ?? null,
})
});
const data = await res.json();
alert(data.message);
if (data.status === 'success') {
this.showUserModal = false;
}
} catch (e) {
alert('网络异常');
}
this.appointLoading = false;
},
/** 踢出用户 */
async kickUser() {
const reason = prompt('踢出原因（可留空）：', '违反聊天室规则');
@@ -324,7 +413,14 @@
:style="userInfo.sex === '男' ? 'color: blue' : (userInfo.sex === '女' ?
'color: deeppink' : '')"></span>
</h4>
<div style="font-size: 11px; color: #999; margin-top: 2px;">
{{-- 在职职务标签（有职务时才显示） --}}
<div x-show="userInfo.position_name"
style="display: inline-flex; align-items: center; gap: 3px; margin-top: 3px; padding: 2px 8px; background: #f3e8ff; border: 1px solid #d8b4fe; border-radius: 20px; font-size: 11px; color: #7c3aed; font-weight: bold;">
<span x-text="userInfo.position_icon" style="font-size: 13px;"></span>
<span
x-text="(userInfo.department_name ? userInfo.department_name + ' · ' : '') + userInfo.position_name"></span>
</div>
<div style="font-size: 11px; color: #999; margin-top: 4px;">
加入: <span x-text="userInfo.created_at"></span>
</div>
</div>
@@ -359,161 +455,260 @@
{{-- 管理员可见区域 (IP 与 归属地) --}}
<div x-show="userInfo.last_ip !== undefined"
style="margin-top: 8px; padding: 8px 10px; background: #fee2e2; border: 1px dashed #fca5a5; border-radius: 8px; font-size: 11px; color: #991b1b;">
<div style="font-weight: bold; margin-bottom: 4px; display: flex; align-items: center; gap: 4px;">
<span>🛡️</span> 管理员视野
style="margin-top: 8px; border-radius: 8px; overflow: hidden;">
{{-- 可点击标题 --}}
<div x-on:click="showAdminView = !showAdminView"
style="display: flex; align-items: center; justify-content: space-between; padding: 6px 10px;
background: #fee2e2; border: 1px dashed #fca5a5; border-radius: 8px;
cursor: pointer; font-size: 11px; color: #991b1b; font-weight: bold; user-select: none;">
<span>🛡️ 管理员视野</span>
<span x-text="showAdminView ? '▲' : '▼'" style="font-size: 10px; opacity: 0.6;"></span>
</div>
<div style="display: flex; flex-direction: column; gap: 3px;">
<div><span style="opacity: 0.8;">主要IP：</span><span x-text="userInfo.last_ip || '无'"></span>
</div>
<div><span style="opacity: 0.8;">本次IP：</span><span x-text="userInfo.login_ip || '无'"></span>
</div>
<div><span style="opacity: 0.8;">归属地：</span><span x-text="userInfo.location || '未知'"></span>
{{-- 折叠内容 --}}
<div x-show="showAdminView" x-transition
style="display: none; padding: 8px 10px; background: #fff5f5; border: 1px dashed #fca5a5;
border-top: none; border-radius: 0 0 8px 8px; font-size: 11px; color: #991b1b;">
<div style="display: flex; flex-direction: column; gap: 3px;">
<div><span style="opacity: 0.8;">主要IP：</span><span x-text="userInfo.last_ip || '无'"></span>
</div>
<div><span style="opacity: 0.8;">本次IP：</span><span x-text="userInfo.login_ip || '无'"></span>
</div>
<div><span style="opacity: 0.8;">归属地：</span><span x-text="userInfo.location || '未知'"></span>
</div>
</div>
</div>
</div>
<div class="profile-detail" x-text="userInfo.sign || '这家伙很懒，什么也没留下'" style="margin-top: 12px;"></div>
</div>
{{-- 普通操作按钮 --}}
<div class="modal-actions" x-show="userInfo.username !== window.chatContext.username">
<button class="btn-whisper"
x-on:click="document.getElementById('to_user').value = userInfo.username; document.getElementById('content').focus(); showUserModal = false;">
悄悄话
</button>
<a class="btn-mail"
:href="'{{ route('guestbook.index', ['tab' => 'outbox']) }}&to=' + encodeURIComponent(userInfo
.username)"
target="_blank">
写私信
</a>
</div>
{{-- 送花/礼物互动区 --}}
<div style="padding: 16px; margin: 0 16px 16px; background: #fff; border-radius: 12px; border: 1px solid #f1f5f9; box-shadow: 0 2px 8px rgba(0,0,0,0.02);"
x-show="userInfo.username !== window.chatContext.username" x-data="{ showGiftPanel: false }">
{{-- 初始状态：只显示一个主操作按钮 --}}
<button x-show="!showGiftPanel" x-on:click="showGiftPanel = true"
style="width: 100%; height: 44px; display: flex; align-items: center; justify-content: center; gap: 8px; background: linear-gradient(135deg, #fce4ec 0%, #fbcfe8 100%); color: #db2777; border: 1px dashed #f9a8d4; border-radius: 10px; font-size: 15px; font-weight: bold; cursor: pointer; transition: all 0.2s; box-shadow: 0 2px 4px rgba(219, 39, 119, 0.1);"
x-on:mousedown="$el.style.transform='scale(0.98)'" x-on:mouseup="$el.style.transform='scale(1)'"
x-on:mouseleave="$el.style.transform='scale(1)'">
<span style="font-size: 18px;">🎁</span>
<span>赠送礼物给 TA</span>
</button>
{{-- 展开状态：显示礼物面板 --}}
<div x-show="showGiftPanel" style="display: none;" x-transition>
<div
style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
<div style="display: flex; align-items: center; gap: 6px;">
<span style="font-size: 16px;">🎁</span>
<span style="font-size: 14px; color: #334155; font-weight: bold;">选择礼物</span>
</div>
<button x-on:click="showGiftPanel = false"
style="background: none; border: none; color: #94a3b8; cursor: pointer; font-size: 20px; line-height: 1; padding: 0 4px;">&times;</button>
{{-- 职务履历时间轴（有任职记录才显示，可折叠） --}}
<div x-show="userInfo.position_history && userInfo.position_history.length > 0"
style="display: none; margin-top: 10px; border-top: 1px solid #f0f0f0; padding-top: 8px;">
{{-- 可点击标题 --}}
<div x-on:click="showPositionHistory = !showPositionHistory"
style="display: flex; align-items: center; justify-content: space-between;
cursor: pointer; font-size: 11px; font-weight: bold; color: #7c3aed;
margin-bottom: 4px; user-select: none;">
<span>🎖️ 职务履历 <span style="font-weight: normal; font-size: 10px; color: #9ca3af;"
x-text="'（' + userInfo.position_history.length + ' 条）'"></span></span>
<span x-text="showPositionHistory ? '▲' : '▼'" style="font-size: 10px; opacity:0.5;"></span>
</div>
{{-- 礼物选择列表 --}}
<div
style="display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 16px; max-height: 200px; overflow-y: auto; padding-right: 4px;">
<template x-for="g in gifts" :key="g.id">
<div x-on:click="selectedGiftId = g.id"
:style="selectedGiftId === g.id ?
'border-color: #f43f5e; background: #fff1f2; box-shadow: 0 4px 12px rgba(244, 63, 94, 0.15); transform: translateY(-1px);' :
'border-color: #e2e8f0; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,0.03); transform: translateY(0);'"
style="border: 2px solid; padding: 10px 4px; border-radius: 10px; text-align: center; cursor: pointer; transition: all 0.2s ease; display: flex; flex-direction: column; align-items: center; justify-content: center;">
<img :src="'/images/gifts/' + g.image"
style="width: 44px; height: 44px; object-fit: contain; margin-bottom: 6px; transition: transform 0.2s ease;"
:style="selectedGiftId === g.id ? 'transform: scale(1.1);' : ''"
:alt="g.name">
<div style="font-size: 12px; color: #1e293b; font-weight: 600; margin-bottom: 4px; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;"
x-text="g.name"></div>
<div style="font-size: 10px; color: #e11d48; font-weight: 500; line-height: 1.3;">
<div x-text="g.cost + ' 💰'"></div>
<div x-text="'+' + g.charm + ' ✨'"></div>
{{-- 折叠内容 --}}
<div x-show="showPositionHistory" x-transition style="display: none;">
<template x-for="(h, idx) in userInfo.position_history" :key="idx">
<div style="display: flex; gap: 10px; margin-bottom: 8px; position: relative;">
{{-- 线 --}}
<div
style="display: flex; flex-direction: column; align-items: center; width: 18px; flex-shrink: 0;">
<div style="width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; margin-top: 2px;"
:style="h.is_active ? 'background: #7c3aed; box-shadow: 0 0 0 3px #ede9fe;' :
'background: #d1d5db;'">
</div>
<template x-if="idx < userInfo.position_history.length - 1">
<div style="width: 1px; flex: 1; background: #e5e7eb; margin-top: 2px;"></div>
</template>
</div>
{{-- 内容 --}}
<div style="flex: 1; font-size: 11px; padding-bottom: 4px;">
<div style="font-weight: bold; color: #374151;">
<span x-text="h.position_icon" style="margin-right: 2px;"></span>
<span
x-text="(h.department_name ? h.department_name + ' · ' : '') + h.position_name"></span>
<span x-show="h.is_active"
style="display: inline-block; margin-left: 4px; padding: 0 5px; background: #ede9fe; color: #7c3aed; border-radius: 10px; font-size: 10px;">在职中</span>
</div>
<div style="color: #9ca3af; font-size: 10px; margin-top: 2px;">
<span x-text="h.appointed_at"></span>
<span> – </span>
<span x-text="h.is_active ? '至今' : (h.revoked_at || '')"></span>
<span style="margin-left: 4px;" x-text="'(' + h.duration_days + ' 天)'"></span>
</div>
</div>
</div>
</template>
</div>
</div>
</div>
{{-- 数量 + 送出按钮 --}}
<div style="display: flex; gap: 12px; align-items: center;">
<div style="position: relative;">
<select x-model.number="giftCount"
style="appearance: none; width: 76px; height: 42px; padding: 0 24px 0 12px; border: 1px solid #cbd5e1; border-radius: 8px; font-size: 14px; font-weight: 500; color: #334155; background-color: #fff; cursor: pointer; outline: none; box-shadow: 0 1px 2px rgba(0,0,0,0.05); transition: border-color 0.2s ease;"
onfocus="this.style.borderColor='#f43f5e'" onblur="this.style.borderColor='#cbd5e1'">
<option value="1">1 个</option>
<option value="5">5 个</option>
<option value="10">10 个</option>
<option value="66">66 个</option>
<option value="99">99 个</option>
<option value="520">520 个</option>
</select>
<div
style="position: absolute; right: 10px; top: 50%; transform: translateY(-50%); pointer-events: none; color: #94a3b8; font-size: 10px;">
▼
{{-- 普通操作按鈕：写私信 + 送花 + 内联礼物面板 --}}
<div x-data="{ showGiftPanel: false }" x-show="userInfo.username !== window.chatContext.username">
<div class="modal-actions" style="margin-bottom: 0;">
{{-- 写私信 --}}
<a class="btn-mail"
:href="'{{ route('guestbook.index', ['tab' => 'outbox']) }}&to=' + encodeURIComponent(userInfo
.username)"
target="_blank">
写私信
</a>
{{-- 送花按鈕（与写私信并列） --}}
<button class="btn-whisper" x-on:click="showGiftPanel = !showGiftPanel">
🎁 送礼物
</button>
</div>
{{-- 内联礼物面板 --}}
<div x-show="showGiftPanel" x-transition
style="display: none;
padding: 12px 16px; background: #fff; border-top: 1px solid #f1f5f9;">
<div
style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;">
<span style="font-size: 13px; color: #334155; font-weight: bold;">🎁 选择礼物</span>
<button x-on:click="showGiftPanel = false"
style="background: none; border: none; color: #94a3b8; cursor: pointer; font-size: 18px; line-height: 1;">×</button>
</div>
{{-- 礼物选择列表 --}}
<div
style="display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-bottom: 12px; max-height: 180px; overflow-y: auto;">
<template x-for="g in gifts" :key="g.id">
<div x-on:click="selectedGiftId = g.id"
:style="selectedGiftId === g.id ?
'border-color: #f43f5e; background: #fff1f2; box-shadow: 0 4px 12px rgba(244,63,94,0.15);' :
'border-color: #e2e8f0; background: #fff;'"
style="border: 2px solid; padding: 8px 4px; border-radius: 8px; text-align: center; cursor: pointer; transition: all 0.15s;">
<img :src="'/images/gifts/' + g.image"
style="width: 36px; height: 36px; object-fit: contain; margin-bottom: 4px;"
:alt="g.name">
<div style="font-size: 11px; color: #1e293b; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;"
x-text="g.name"></div>
<div style="font-size: 10px; color: #e11d48;" x-text="g.cost + ' 💰'"></div>
</div>
</div>
</template>
</div>
{{-- 数量 + 送出 --}}
<div style="display: flex; gap: 8px; align-items: center;">
<select x-model.number="giftCount"
style="width: 70px; height: 36px; padding: 0 8px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 13px; color: #334155;">
<option value="1">1 个</option>
<option value="5">5 个</option>
<option value="10">10 个</option>
<option value="66">66 个</option>
<option value="99">99 个</option>
<option value="520">520 个</option>
</select>
<button x-on:click="sendGift(); showGiftPanel = false;" :disabled="sendingGift"
style="flex: 1; height: 42px; display: flex; align-items: center; justify-content: center; gap: 8px; background: linear-gradient(135deg, #f43f5e 0%, #be123c 100%); color: #fff; border: 1px solid #9f1239; border-radius: 8px; font-size: 16px; font-weight: 800; letter-spacing: 1px; cursor: pointer; transition: all 0.2s; box-shadow: 0 4px 12px rgba(225, 29, 72, 0.4), inset 0 1px 1px rgba(255, 255, 255, 0.3);"
x-on:mousedown="if(!sendingGift) { $el.style.transform='scale(0.96)'; $el.style.boxShadow='0 2px 6px rgba(225, 29, 72, 0.3)'; }"
x-on:mouseup="if(!sendingGift) { $el.style.transform='scale(1)'; $el.style.boxShadow='0 4px 12px rgba(225, 29, 72, 0.4), inset 0 1px 1px rgba(255, 255, 255, 0.3)'; }"
x-on:mouseleave="if(!sendingGift) { $el.style.transform='scale(1)'; $el.style.boxShadow='0 4px 12px rgba(225, 29, 72, 0.4), inset 0 1px 1px rgba(255, 255, 255, 0.3)'; }"
:style="sendingGift ?
'opacity: 0.7; cursor: not-allowed; transform: scale(1) !important; box-shadow: none;' :
''">
<span x-text="sendingGift ? '正在送出...' : '💝 确认赠送'"
style="text-shadow: 0 1px 2px rgba(0,0,0,0.3);"></span>
style="flex:1; height: 36px; background: linear-gradient(135deg,#f43f5e,#be123c); color:#fff;
border: none; border-radius: 6px; font-size: 14px; font-weight: bold; cursor: pointer;"
:style="sendingGift ? 'opacity:0.7; cursor:not-allowed;' : ''">
<span x-text="sendingGift ? '正在送出...' : '💝 确认赠送'"></span>
</button>
</div>
</div>
</div>
{{-- 特权操作（各按钮按等级独立显示） --}}
@if ($myLevel >= $levelWarn || $room->master == Auth::user()->username)
<div style="padding: 0 16px 12px;"
x-show="userInfo.username !== window.chatContext.username && userInfo.user_level < {{ $myLevel }}">
<div style="font-size: 11px; color: #c00; margin-bottom: 6px; font-weight: bold;">管理操作</div>
<div style="display: flex; gap: 6px; flex-wrap: wrap;">
@if ($myLevel >= $levelWarn)
<button
style="flex:1; padding: 5px; border-radius: 4px; font-size: 11px; background: #fef3c7; border: 1px solid #f59e0b; cursor: pointer;"
x-on:click="warnUser()">⚠️ 警告</button>
@endif
@if ($myLevel >= $levelKick)
<button
style="flex:1; padding: 5px; border-radius: 4px; font-size: 11px; background: #fee2e2; border: 1px solid #ef4444; cursor: pointer;"
x-on:click="kickUser()">🚫 踢出</button>
@endif
@if ($myLevel >= $levelMute)
<button
style="flex:1; padding: 5px; border-radius: 4px; font-size: 11px; background: #e0e7ff; border: 1px solid #6366f1; cursor: pointer;"
x-on:click="isMuting = !isMuting">🔇 禁言</button>
@endif
@if ($myLevel >= $levelFreeze)
<button
style="flex:1; padding: 5px; border-radius: 4px; font-size: 11px; background: #dbeafe; border: 1px solid #3b82f6; cursor: pointer;"
x-on:click="freezeUser()">🧊 冻结</button>
@endif
@if ($myLevel >= $superLevel)
<button
style="flex:1; padding: 5px; border-radius: 4px; font-size: 11px; background: #f3e8ff; border: 1px solid #a855f7; cursor: pointer;"
x-on:click="loadWhispers()">🔍 私信</button>
@endif
{{-- 管理操作 + 职务操作 合并折叠区 --}}
@if (
$myLevel >= $levelWarn ||
$room->master == Auth::user()->username ||
Auth::user()->activePosition ||
$myLevel >= $superLevel)
<div style="padding: 0 16px 12px;" x-show="userInfo.username !== window.chatContext.username">
{{-- 折叠标题 --}}
<div x-on:click="showAdminPanel = !showAdminPanel"
style="display: flex; align-items: center; justify-content: space-between;
padding: 6px 10px; background: #fef2f2; border: 1px solid #fecaca;
border-radius: 6px; cursor: pointer; user-select: none;">
<span style="font-size: 11px; color: #c00; font-weight: bold;">🔧 管理操作</span>
<span x-text="showAdminPanel ? '▲' : '▼'"
style="font-size: 10px; color: #c00; opacity: 0.6;"></span>
</div>
</div>
{{-- 禁言表单 --}}
<div x-show="isMuting" style="display: none; padding: 0 16px 12px;">
<div style="display: flex; gap: 6px; align-items: center;">
<input type="number" x-model="muteDuration" min="1" max="1440" placeholder="分钟"
style="width: 60px; padding: 4px; border: 1px solid #ccc; border-radius: 3px; font-size: 11px;">
<span style="font-size: 11px; color: #b86e00;">分钟</span>
<button x-on:click="muteUser()"
style="padding: 4px 12px; background: #6366f1; color: #fff; border: none; border-radius: 3px; font-size: 11px; cursor: pointer;">执行</button>
{{-- 折叠内容 --}}
<div x-show="showAdminPanel" x-transition style="display: none; margin-top: 6px;">
@if ($myLevel >= $levelWarn || $room->master == Auth::user()->username)
<div x-show="userInfo.user_level < {{ $myLevel }}">
<div style="font-size: 10px; color: #9ca3af; margin-bottom: 4px; padding-left: 2px;">
管理员操作</div>
<div style="display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px;">
@if ($myLevel >= $levelWarn)
<button
style="flex:1; padding: 5px; border-radius: 4px; font-size: 11px; background: #fef3c7; border: 1px solid #f59e0b; cursor: pointer;"
x-on:click="warnUser()">⚠️ 警告</button>
@endif
@if ($myLevel >= $levelKick)
<button
style="flex:1; padding: 5px; border-radius: 4px; font-size: 11px; background: #fee2e2; border: 1px solid #ef4444; cursor: pointer;"
x-on:click="kickUser()">🚫 踢出</button>
@endif
@if ($myLevel >= $levelMute)
<button
style="flex:1; padding: 5px; border-radius: 4px; font-size: 11px; background: #e0e7ff; border: 1px solid #6366f1; cursor: pointer;"
x-on:click="isMuting = !isMuting">🔇 禁言</button>
@endif
@if ($myLevel >= $levelFreeze)
<button
style="flex:1; padding: 5px; border-radius: 4px; font-size: 11px; background: #dbeafe; border: 1px solid #3b82f6; cursor: pointer;"
x-on:click="freezeUser()">🧊 冻结</button>
@endif
@if ($myLevel >= $superLevel)
<button
style="flex:1; padding: 5px; border-radius: 4px; font-size: 11px; background: #f3e8ff; border: 1px solid #a855f7; cursor: pointer;"
x-on:click="loadWhispers()">🔍 私信</button>
@endif
</div>
</div>
@endif
@if (Auth::user()->activePosition || $myLevel >= $superLevel)
<div>
<div style="font-size: 10px; color: #9ca3af; margin-bottom: 4px; padding-left: 2px;">
职务操作</div>
<div style="display: flex; gap: 6px; flex-wrap: wrap;">
<template x-if="!userInfo.position_name">
<button x-on:click="showAppointPanel = !showAppointPanel"
style="flex:1; padding: 5px; border-radius: 4px; font-size: 11px; background: #f3e8ff; border: 1px solid #a855f7; cursor: pointer;">✨
任命职务</button>
</template>
<template x-if="userInfo.position_name">
<button x-on:click="doRevoke()" :disabled="appointLoading"
style="flex:1; padding: 5px; border-radius: 4px; font-size: 11px; background: #fef9c3; border: 1px solid #eab308; cursor: pointer;">🔧
撤销职务</button>
</template>
</div>
<div x-show="showAppointPanel" x-transition
style="display:none; margin-top:8px; padding:10px; background:#faf5ff; border:1px solid #d8b4fe; border-radius:6px;">
<div style="font-size:11px; color:#7c3aed; margin-bottom:6px;">选择职务：</div>
<select x-model.number="selectedPositionId"
style="width:100%; padding:4px; border:1px solid #c4b5fd; border-radius:4px; font-size:11px; margin-bottom:6px;">
<template x-for="p in appointPositions" :key="p.id">
<option :value="p.id"
x-text="(p.icon?p.icon+' ':'')+p.department+' · '+p.name"></option>
</template>
</select>
<input type="text" x-model="appointRemark" placeholder="备注（如任命原因）"
style="width:100%; padding:4px; border:1px solid #c4b5fd; border-radius:4px; font-size:11px; box-sizing:border-box; margin-bottom:6px;">
<div style="display:flex; gap:6px;">
<button x-on:click="doAppoint()"
:disabled="appointLoading || !selectedPositionId"
style="flex:1; padding:5px; background:#7c3aed; color:#fff; border:none; border-radius:4px; font-size:11px; cursor:pointer;">
<span x-text="appointLoading?'处理中...':'✅ 确认任命'"></span>
</button>
<button x-on:click="showAppointPanel=false"
style="padding:5px 10px; background:#fff; border:1px solid #ccc; border-radius:4px; font-size:11px; cursor:pointer;">取消</button>
</div>
</div>
</div>
@endif
</div>{{-- /折叠内容 --}}
{{-- 禁言输入表单 --}}
<div x-show="isMuting" style="display:none; margin-top:6px;">
<div style="display:flex; gap:6px; align-items:center;">
<input type="number" x-model="muteDuration" min="1" max="1440"
placeholder="分钟"
style="width:60px; padding:4px; border:1px solid #ccc; border-radius:3px; font-size:11px;">
<span style="font-size:11px; color:#b86e00;">分钟</span>
<button x-on:click="muteUser()"
style="padding:4px 12px; background:#6366f1; color:#fff; border:none; border-radius:3px; font-size:11px; cursor:pointer;">执行</button>
</div>
</div>
</div>
@endif