新增上下限提示 优化菜单栏
This commit is contained in:
@@ -115,7 +115,18 @@
|
||||
<label class="flex items-center gap-2 border-l border-gray-200 pl-4 ml-2 cursor-pointer">
|
||||
<input type="checkbox" v-model="gateEnabled" class="w-4 h-4" />
|
||||
<span class="text-gray-700 font-medium whitespace-nowrap">上下限模式</span>
|
||||
<span class="relative inline-flex items-center group">
|
||||
<span
|
||||
class="inline-flex h-5 w-5 items-center justify-center rounded-full border border-gray-300 bg-gray-50 text-xs font-semibold text-gray-500">?</span>
|
||||
<span
|
||||
class="pointer-events-none absolute left-1/2 top-full z-50 mt-2 hidden w-72 -translate-x-1/2 rounded-lg border border-gray-200 bg-white px-3 py-2 text-xs leading-5 text-gray-600 shadow-xl group-hover:block">
|
||||
{{ hostListGateHelpText }}
|
||||
</span>
|
||||
</span>
|
||||
</label>
|
||||
<span v-if="gateEnabled" class="text-xs font-medium text-red-500 whitespace-nowrap">
|
||||
该模式会大幅影响采集主播的速度
|
||||
</span>
|
||||
|
||||
<!-- 接收上下限 - 紧凑布局 -->
|
||||
<div class="flex items-center gap-2 border-l border-gray-200 pl-4 ml-2">
|
||||
@@ -334,6 +345,7 @@ const minCount = ref(5)
|
||||
const maxCount = ref()
|
||||
const selectedLevels = ref(new Set())
|
||||
const showLevelDropdown = ref(false)
|
||||
const hostListGateHelpText = '从 TK 工作台采集到的主播会进入主播库。开启上下限模式后,到达接收上限时采集会暂停;只有当主播库数量低于主播下限时,采集才会继续查验主播并重新进入主播库。'
|
||||
|
||||
const resolveRestrictedMaxAnchorCount = (fallbackValue = 9999999) => {
|
||||
const permissions = getPermissions()
|
||||
|
||||
@@ -11,65 +11,74 @@
|
||||
<div class="flex-1 flex flex-col w-full px-2" style="gap: 2vh;">
|
||||
<button @click="currentView = 'tk'"
|
||||
class="w-full rounded-xl flex items-center gap-2 px-3 py-2.5 transition-all duration-200" style="height: 6vh;"
|
||||
:class="currentView === 'tk' ? 'bg-white text-blue-600 shadow shadow-blue-900/20' : 'text-slate-400 hover:bg-[rgba(21,96,250,0.06)]'">
|
||||
:class="currentView === 'tk' ? 'bg-white text-blue-600 shadow shadow-blue-900/20' : 'text-slate-400 hover:bg-[rgba(21,96,250,0.06)]'"
|
||||
title="TK 工作台">
|
||||
<img :src="currentView === 'tk' ? nav11 : nav1" class="w-9 h-9 object-contain flex-shrink-0" />
|
||||
<span class="text-base font-medium truncate">TK 工作台</span>
|
||||
<span class="menu-label">TK 工作台</span>
|
||||
</button>
|
||||
|
||||
<button @click="currentView = 'hosts'"
|
||||
class="w-full rounded-xl flex items-center gap-2 px-3 py-2.5 transition-all duration-200" style="height: 6vh;"
|
||||
:class="currentView === 'hosts' ? 'bg-white text-blue-600 shadow shadow-blue-900/20' : 'text-slate-400 hover:bg-[rgba(21,96,250,0.06)]'">
|
||||
:class="currentView === 'hosts' ? 'bg-white text-blue-600 shadow shadow-blue-900/20' : 'text-slate-400 hover:bg-[rgba(21,96,250,0.06)]'"
|
||||
title="主播列表">
|
||||
<img :src="currentView === 'hosts' ? nav22 : nav2" class="w-9 h-9 object-contain flex-shrink-0" />
|
||||
<span class="text-base font-medium truncate">主播列表</span>
|
||||
<span class="menu-label">主播列表</span>
|
||||
</button>
|
||||
|
||||
<button @click="currentView = 'auto_dm'"
|
||||
class="w-full rounded-xl flex items-center gap-2 px-3 py-2.5 transition-all duration-200" style="height: 6vh;"
|
||||
:class="currentView === 'auto_dm' ? 'bg-white text-blue-600 shadow shadow-blue-900/20' : 'text-slate-400 hover:bg-[rgba(21,96,250,0.06)]'">
|
||||
:class="currentView === 'auto_dm' ? 'bg-white text-blue-600 shadow shadow-blue-900/20' : 'text-slate-400 hover:bg-[rgba(21,96,250,0.06)]'"
|
||||
title="自动私信(即时消息)">
|
||||
<img :src="currentView === 'auto_dm' ? nav33 : nav3" class="w-9 h-9 object-contain flex-shrink-0" />
|
||||
<span class="text-base font-medium truncate">自动私信(即时消息)</span>
|
||||
<span class="menu-label">自动私信(即时消息)</span>
|
||||
</button>
|
||||
|
||||
<button @click="currentView = 'auto_dm_tk'"
|
||||
class="w-full rounded-xl flex items-center gap-2 px-3 py-2.5 transition-all duration-200" style="height: 6vh;"
|
||||
:class="currentView === 'auto_dm_tk' ? 'bg-white text-blue-600 shadow shadow-blue-900/20' : 'text-slate-400 hover:bg-[rgba(21,96,250,0.06)]'">
|
||||
:class="currentView === 'auto_dm_tk' ? 'bg-white text-blue-600 shadow shadow-blue-900/20' : 'text-slate-400 hover:bg-[rgba(21,96,250,0.06)]'"
|
||||
title="自动私信TK版">
|
||||
<img :src="currentView === 'auto_dm_tk' ? nav33 : nav3" class="w-9 h-9 object-contain flex-shrink-0" />
|
||||
<span class="text-base font-medium truncate">自动私信TK版</span>
|
||||
<span class="menu-label">自动私信TK版</span>
|
||||
</button>
|
||||
|
||||
<button @click="currentView = 'FanWorkbench'"
|
||||
class="w-full rounded-xl flex items-center gap-2 px-3 py-2.5 transition-all duration-200" style="height: 6vh;"
|
||||
:class="currentView === 'FanWorkbench' ? 'bg-white text-blue-600 shadow shadow-blue-900/20' : 'text-slate-400 hover:bg-[rgba(21,96,250,0.06)]'">
|
||||
:class="currentView === 'FanWorkbench' ? 'bg-white text-blue-600 shadow shadow-blue-900/20' : 'text-slate-400 hover:bg-[rgba(21,96,250,0.06)]'"
|
||||
title="大哥工作台">
|
||||
<img :src="currentView === 'FanWorkbench' ? nav44 : nav4" class="w-9 h-9 object-contain flex-shrink-0" />
|
||||
<span class="text-base font-medium truncate">大哥工作台</span>
|
||||
<span class="menu-label">大哥工作台</span>
|
||||
</button>
|
||||
|
||||
<button @click="currentView = 'pk_mini'"
|
||||
class="w-full rounded-xl flex items-center gap-2 px-3 py-2.5 transition-all duration-200" style="height: 6vh;"
|
||||
:class="currentView === 'pk_mini' ? 'bg-white text-blue-600 shadow shadow-blue-900/20' : 'text-slate-400 hover:bg-[rgba(21,96,250,0.06)]'">
|
||||
:class="currentView === 'pk_mini' ? 'bg-white text-blue-600 shadow shadow-blue-900/20' : 'text-slate-400 hover:bg-[rgba(21,96,250,0.06)]'"
|
||||
title="PK 工作台">
|
||||
<img :src="currentView === 'pk_mini' ? nav55 : nav5" class="w-9 h-9 object-contain flex-shrink-0" />
|
||||
<span class="text-base font-medium truncate">PK 工作台</span>
|
||||
<span class="menu-label">PK 工作台</span>
|
||||
</button>
|
||||
|
||||
<button @click="currentView = 'shop'"
|
||||
class="w-full rounded-xl flex items-center gap-2 px-3 py-2.5 transition-all duration-200" style="height: 6vh;"
|
||||
:class="currentView === 'shop' ? 'bg-white text-blue-600 shadow shadow-blue-900/20' : 'text-slate-400 hover:bg-[rgba(21,96,250,0.06)]'">
|
||||
:class="currentView === 'shop' ? 'bg-white text-blue-600 shadow shadow-blue-900/20' : 'text-slate-400 hover:bg-[rgba(21,96,250,0.06)]'"
|
||||
title="TK商店">
|
||||
<img :src="currentView === 'shop' ? nav66 : nav6" class="w-9 h-9 object-contain flex-shrink-0" />
|
||||
<span class="text-base font-medium truncate">TK商店</span>
|
||||
<span class="menu-label">TK商店</span>
|
||||
</button>
|
||||
|
||||
<button
|
||||
class="w-full rounded-xl flex items-center gap-2 px-3 py-2.5 transition-all duration-200 text-slate-400 hover:bg-[rgba(21,96,250,0.06)]"
|
||||
style="height: 6vh;">
|
||||
<span class="text-base font-medium truncate">敬请期待...</span>
|
||||
style="height: 6vh;"
|
||||
title="敬请期待">
|
||||
<span class="menu-label">敬请期待...</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="mt-auto w-full px-2">
|
||||
<button @click="$emit('logout')"
|
||||
class="w-full rounded-xl flex items-center gap-2 px-3 py-2.5 text-slate-400 bg-white shadow shadow-blue-900/20 transition-all">
|
||||
class="w-full rounded-xl flex items-center gap-2 px-3 py-2.5 text-slate-400 bg-white shadow shadow-blue-900/20 transition-all"
|
||||
title="退出登录">
|
||||
<img :src="backIcon" class="w-9 h-9 object-contain flex-shrink-0" />
|
||||
<span class="text-base font-medium" style="color: #ED4949;">退出登录</span>
|
||||
<span class="menu-label" style="color: #ED4949;">退出登录</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -308,4 +317,18 @@ watch(autoDmMode, async (newVal) => {
|
||||
.yolo-logo {
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.menu-label {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-align: left;
|
||||
font-size: 1rem;
|
||||
font-weight: 500;
|
||||
line-height: 1.2;
|
||||
word-break: break-word;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user