💄 调整顶部样式

This commit is contained in:
BTMuli
2025-12-19 17:03:50 +08:00
parent d312409e09
commit 00c69d1763
16 changed files with 558 additions and 394 deletions

View File

@@ -1,5 +1,5 @@
<template>
<div class="achi-container" :title="getAchiTitle()" @click="selectAchi()">
<div :title="getAchiTitle()" class="achi-container" @click="selectAchi()">
<div class="achi-version">v{{ data.version }}</div>
<div class="achi-pre">
<div class="achi-pre-icon">
@@ -190,33 +190,16 @@ async function setAchiStat(stat: boolean): Promise<void> {
}
}
.achi-append-icon span {
position: absolute;
bottom: 0;
left: 0;
display: flex;
width: 100%;
height: 10px;
align-items: center;
justify-content: center;
background: #00000080;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
color: var(--tgc-white-1);
font-size: 8px;
}
.achi-append {
display: flex;
align-items: center;
justify-content: flex-end;
column-gap: 10px;
}
column-gap: 8px;
.achi-append :nth-last-child(2) {
margin-right: 10px;
color: var(--box-text-4);
font-size: small;
:first-child:not(:last-child) {
color: var(--box-text-4);
font-size: small;
}
}
.achi-append-icon {
@@ -226,10 +209,27 @@ async function setAchiStat(stat: boolean): Promise<void> {
border-radius: 4px;
background-image: url("/icon/bg/5-Star.webp");
background-size: cover;
}
.achi-append-icon img {
width: 40px;
height: 40px;
img {
width: 100%;
height: 100%;
flex-shrink: 0;
}
span {
position: absolute;
bottom: 0;
left: 0;
display: flex;
width: 100%;
height: 10px;
align-items: stretch;
justify-content: center;
background: #00000080;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
color: var(--tgc-white-1);
font-size: 8px;
}
}
</style>

View File

@@ -6,19 +6,19 @@
<img alt="icon" src="/source/UI/userAbyss.webp" />
<span>深境螺旋</span>
<v-select
density="compact"
variant="outlined"
v-model="uidCur"
:items="uidList"
:hide-details="true"
:items="uidList"
density="compact"
label="游戏UID"
variant="outlined"
/>
<v-btn :rounded="true" class="ua-btn" @click="toCombat()">
<img src="/source/UI/userCombat.webp" alt="combat" />
<v-btn :rounded="true" class="ua-btn" variant="elevated" @click="toCombat()">
<img alt="combat" src="/source/UI/userCombat.webp" />
<span>真境剧诗</span>
</v-btn>
<v-btn :rounded="true" class="ua-btn" @click="toChallenge()">
<img src="/source/UI/userChallenge.webp" alt="challenge" />
<v-btn :rounded="true" class="ua-btn" variant="elevated" @click="toChallenge()">
<img alt="challenge" src="/source/UI/userChallenge.webp" />
<span>幽境危战</span>
</v-btn>
</div>
@@ -26,21 +26,33 @@
<template #append>
<div class="uat-acts">
<v-btn
class="ua-btn"
@click="shareAbyss()"
:disabled="localAbyss.length === 0"
class="ua-btn"
prepend-icon="mdi-share"
variant="elevated"
@click="shareAbyss()"
>
分享
</v-btn>
<v-btn class="ua-btn" @click="refreshAbyss()" prepend-icon="mdi-refresh">刷新</v-btn>
<v-btn class="ua-btn" @click="tryReadAbyss()" prepend-icon="mdi-download">导入</v-btn>
<v-btn class="ua-btn" @click="deleteAbyss()" prepend-icon="mdi-delete">删除</v-btn>
<v-btn class="ua-btn" prepend-icon="mdi-refresh" variant="elevated" @click="refreshAbyss()">
刷新
</v-btn>
<v-btn
class="ua-btn"
prepend-icon="mdi-download"
variant="elevated"
@click="tryReadAbyss()"
>
导入
</v-btn>
<v-btn class="ua-btn" prepend-icon="mdi-delete" variant="elevated" @click="deleteAbyss()">
删除
</v-btn>
</div>
</template>
</v-app-bar>
<div class="ua-box">
<v-tabs v-model="userTab" direction="vertical" class="ua-tabs-box" center-active>
<v-tabs v-model="userTab" center-active class="ua-tabs-box" direction="vertical">
<v-tab v-for="item in localAbyss" :key="item.id" :value="item.id">{{ item.id }}</v-tab>
</v-tabs>
<v-window v-model="userTab" class="ua-window">
@@ -64,20 +76,20 @@
</div>
<TSubLine>统计周期 {{ item.startTime }} ~ {{ item.endTime }}</TSubLine>
<div class="uaw-o-box">
<TuaOverview title="战斗次数" :val-text="item.totalBattleTimes" />
<TuaOverview title="获得渊星" :val-text="item.totalStar" />
<TuaOverview :val-text="item.totalBattleTimes" title="战斗次数" />
<TuaOverview :val-text="item.totalStar" title="获得渊星" />
<TuaOverview
title="最深抵达"
:val-text="
item.skippedFloor !== '' ? `${item.maxFloor}(${item.skippedFloor})` : item.maxFloor
"
title="最深抵达"
/>
<TuaOverview title="最多击破" :val-icons="item.defeatRank" />
<TuaOverview title="最多承伤" :val-icons="item.takeDamageRank" />
<TuaOverview title="最强一击" :val-icons="item.damageRank" />
<TuaOverview title="元素战技" :val-icons="item.normalSkillRank" />
<TuaOverview title="出战次数" :val-icons="item.revealRank" :multi4="true" />
<TuaOverview title="元素爆发" :val-icons="item.energySkillRank" />
<TuaOverview :val-icons="item.defeatRank" title="最多击破" />
<TuaOverview :val-icons="item.takeDamageRank" title="最多承伤" />
<TuaOverview :val-icons="item.damageRank" title="最强一击" />
<TuaOverview :val-icons="item.normalSkillRank" title="元素战技" />
<TuaOverview :multi4="true" :val-icons="item.revealRank" title="出战次数" />
<TuaOverview :val-icons="item.energySkillRank" title="元素爆发" />
</div>
<div class="uaw-d-box">
<TuaDetail v-for="floor in item.floors" :key="floor.id" :floor />
@@ -86,7 +98,7 @@
</v-window-item>
</v-window>
<div v-show="localAbyss.length === 0" class="user-empty">
<img src="/source/UI/empty.webp" alt="empty" />
<img alt="empty" src="/source/UI/empty.webp" />
<span>暂无数据请尝试刷新</span>
</div>
</div>
@@ -128,7 +140,6 @@ onMounted(async () => {
else if (uidList.value.length > 0) uidCur.value = uidList.value[0];
else uidCur.value = "";
await showLoading.update(`正在加载${uidCur.value}的深渊数据`);
await loadAbyss();
await showLoading.end();
showSnackbar.success(`已加载${uidCur.value}${localAbyss.value.length}条深渊数据`);
});
@@ -295,7 +306,7 @@ async function tryReadAbyss(): Promise<void> {
display: flex;
align-items: center;
justify-content: center;
margin-left: 8px;
margin-left: 12px;
gap: 8px;
img {
@@ -314,11 +325,11 @@ async function tryReadAbyss(): Promise<void> {
}
.uat-acts {
position: relative;
display: flex;
align-items: center;
justify-content: center;
padding: 8px;
margin-left: 8px;
margin-right: 12px;
gap: 8px;
}
@@ -335,10 +346,6 @@ async function tryReadAbyss(): Promise<void> {
}
}
.dark .ua-btn {
border: 1px solid var(--common-shadow-2);
}
.ua-box {
display: flex;
height: calc(100vh - 96px);

View File

@@ -14,11 +14,11 @@
variant="outlined"
@update:model-value="switchUid"
/>
<v-btn :rounded="true" class="ucp-btn" @click="toAbyss()">
<v-btn class="ucp-btn" rounded variant="elevated" @click="toAbyss()">
<img alt="abyss" src="/source/UI/userAbyss.webp" />
<span>深境螺旋</span>
</v-btn>
<v-btn :rounded="true" class="ucp-btn" @click="toCombat()">
<v-btn class="ucp-btn" rounded variant="elevated" @click="toCombat()">
<img alt="abyss" src="/source/UI/userCombat.webp" />
<span>真境剧诗</span>
</v-btn>
@@ -45,15 +45,33 @@
:disabled="localChallenge.length === 0"
class="ucp-btn"
prepend-icon="mdi-share"
variant="elevated"
@click="shareChallenge()"
>
分享
</v-btn>
<v-btn class="ucp-btn" prepend-icon="mdi-refresh" @click="refreshChallenge()">刷新</v-btn>
<v-btn class="ucp-btn" prepend-icon="mdi-download" @click="tryReadChallenge()">
<v-btn
class="ucp-btn"
prepend-icon="mdi-refresh"
variant="elevated"
@click="refreshChallenge()"
>刷新
</v-btn>
<v-btn
class="ucp-btn"
prepend-icon="mdi-download"
variant="elevated"
@click="tryReadChallenge()"
>
导入
</v-btn>
<v-btn class="ucp-btn" prepend-icon="mdi-delete" @click="deleteChallenge()">删除</v-btn>
<v-btn
class="ucp-btn"
prepend-icon="mdi-delete"
variant="elevated"
@click="deleteChallenge()"
>删除
</v-btn>
</div>
<div class="pop-list">
<TucPopItem v-for="avatar in popList" :key="avatar.avatar_id" :avatar />
@@ -393,7 +411,7 @@ async function tryReadChallenge(): Promise<void> {
box-sizing: border-box;
align-items: center;
justify-content: center;
padding: 8px;
margin-left: 12px;
column-gap: 8px;
img {
@@ -424,16 +442,12 @@ async function tryReadChallenge(): Promise<void> {
}
}
.dark .ucp-btn {
border: 1px solid var(--common-shadow-2);
}
.ucp-top-append {
position: relative;
width: fit-content;
height: 100%;
height: 40px;
box-sizing: border-box;
padding: 8px;
margin-right: 12px;
}
.ucp-top-extension {
@@ -443,7 +457,8 @@ async function tryReadChallenge(): Promise<void> {
box-sizing: border-box;
align-items: center;
justify-content: space-between;
padding: 0 8px;
padding: 0 16px;
margin-bottom: 4px;
}
.act-list {

View File

@@ -5,35 +5,38 @@
<div class="uc-top-title">
<img alt="icon" src="/source/UI/userAvatar.webp" />
<span>我的角色</span>
<v-btn class="uc-top-btn" @click="showSelect = true">筛选角色</v-btn>
<v-btn class="uc-top-btn" @click="resetSelect = true">重置筛选</v-btn>
<v-btn class="uc-top-btn" variant="elevated" @click="showSelect = true">筛选角色</v-btn>
<v-btn class="uc-top-btn" variant="elevated" @click="resetSelect = true">重置筛选</v-btn>
</div>
</template>
<template #append>
<div class="uc-top-btns">
<v-btn
v-model:loading="loadData"
class="uc-top-btn"
prepend-icon="mdi-refresh"
variant="elevated"
@click="refresh()"
v-model:loading="loadData"
>
刷新
</v-btn>
<v-btn
v-model:loading="loadShare"
:disabled="enableShare"
class="uc-top-btn"
prepend-icon="mdi-share"
:disabled="enableShare"
variant="elevated"
@click="share()"
v-model:loading="loadShare"
>
分享
</v-btn>
<v-btn
v-model:loading="loadDel"
:disabled="uidCur === undefined"
class="uc-top-btn"
prepend-icon="mdi-delete"
variant="elevated"
@click="deleteUid()"
:disabled="uidCur === undefined"
v-model:loading="loadDel"
>
删除
</v-btn>
@@ -43,23 +46,23 @@
<div class="uc-select">
<v-select
v-model="showMode"
:items="modeList"
label="详情视图模式"
:hide-details="true"
item-title="label"
item-value="value"
variant="outlined"
:items="modeList"
class="uc-select-btn"
density="compact"
item-title="label"
item-value="value"
label="详情视图模式"
variant="outlined"
/>
<v-select
v-model="uidCur"
:items="uidList"
label="当前UID"
:hide-details="true"
variant="outlined"
:items="uidList"
class="uc-select-btn"
density="compact"
label="当前UID"
variant="outlined"
/>
</div>
</template>
@@ -69,10 +72,10 @@
<div class="uc-box-title">
<span class="uc-box-uid">UID{{ uidCur }}</span>
<span
class="uc-ov-item"
v-for="(item, index) in roleOverview"
:key="index"
:title="`${item.label}${item.cnt}`"
class="uc-ov-item"
>
<img :src="`/icon/element/${item.label}.webp`" alt="element" />
<span>{{ item.cnt }}</span>
@@ -84,7 +87,7 @@
<span>更新于 {{ getUpdateTime() }}</span>
</div>
</div>
<div class="uc-grid" v-if="!isEmpty">
<div v-if="!isEmpty" class="uc-grid">
<TuaAvatarBox
v-for="(role, index) in selectedList"
:key="index"
@@ -92,20 +95,20 @@
@click="selectRole(role)"
/>
</div>
<div class="uc-empty" v-else>
<img src="/source/UI/empty.webp" alt="empty" />
<div v-else class="uc-empty">
<img alt="empty" src="/source/UI/empty.webp" />
</div>
</div>
<TuaDetailOverlay
v-if="dataVal"
v-model="showOverlay"
v-model:mode="showMode"
:avatar="dataVal"
:avatars="selectedList"
v-model:mode="showMode"
@to-next="handleSwitch"
@to-avatar="selectRole"
/>
<TwoSelectC v-model="showSelect" @select-c="handleSelect" v-model:reset="resetSelect" />
<TwoSelectC v-model="showSelect" v-model:reset="resetSelect" @select-c="handleSelect" />
</template>
<script lang="ts" setup>
import showDialog from "@comp/func/dialog.js";
@@ -430,8 +433,7 @@ function handleSwitch(next: boolean): void {
display: flex;
align-items: center;
justify-content: center;
padding: 8px;
margin-left: 8px;
margin-left: 12px;
gap: 8px;
img {
@@ -450,8 +452,8 @@ function handleSwitch(next: boolean): void {
display: flex;
align-items: center;
justify-content: flex-start;
margin-bottom: 4px;
margin-left: 16px;
gap: 8px;
}
.uc-select-btn {
@@ -522,21 +524,16 @@ function handleSwitch(next: boolean): void {
.uc-top-btns {
display: flex;
align-content: center;
margin-right: 16px;
margin-right: 12px;
column-gap: 8px;
}
.uc-top-btn {
border-radius: 5px;
background: var(--tgc-btn-1);
color: var(--btn-text);
font-family: var(--font-text);
}
.dark .uc-top-btn {
border: 1px solid var(--common-shadow-2);
}
.uc-grid {
display: grid;
gap: 8px;

View File

@@ -13,11 +13,11 @@
label="游戏UID"
variant="outlined"
/>
<v-btn :rounded="true" class="uc-btn" @click="toAbyss()">
<v-btn class="uc-btn" rounded variant="elevated" @click="toAbyss()">
<img alt="abyss" src="/source/UI/userAbyss.webp" />
<span>深境螺旋</span>
</v-btn>
<v-btn :rounded="true" class="uc-btn" @click="toChallenge()">
<v-btn class="uc-btn" rounded variant="elevated" @click="toChallenge()">
<img alt="challenge" src="/source/UI/userChallenge.webp" />
<span>幽境危战</span>
</v-btn>
@@ -27,20 +27,30 @@
<div class="uct-right">
<v-btn
:disabled="localCombat.length === 0"
:rounded="true"
class="uc-btn"
prepend-icon="mdi-share"
variant="elevated"
@click="shareCombat()"
>
分享
</v-btn>
<v-btn :rounded="true" class="uc-btn" prepend-icon="mdi-refresh" @click="refreshCombat()">
<v-btn
class="uc-btn"
prepend-icon="mdi-refresh"
variant="elevated"
@click="refreshCombat()"
>
刷新
</v-btn>
<v-btn :rounded="true" class="uc-btn" prepend-icon="mdi-download" @click="tryReadCombat()">
<v-btn
class="uc-btn"
prepend-icon="mdi-download"
variant="elevated"
@click="tryReadCombat()"
>
导入
</v-btn>
<v-btn :rounded="true" class="uc-btn" prepend-icon="mdi-delete" @click="deleteCombat()">
<v-btn class="uc-btn" prepend-icon="mdi-delete" variant="elevated" @click="deleteCombat()">
删除
</v-btn>
</div>
@@ -324,10 +334,6 @@ async function tryReadCombat(): Promise<void> {
}
}
.dark .uc-btn {
border: 1px solid var(--common-shadow-2);
}
.uc-box {
display: flex;
height: calc(100vh - 96px);

View File

@@ -24,25 +24,64 @@
</template>
<template #extension>
<div class="gacha-top-btns">
<v-btn class="gacha-top-btn" prepend-icon="mdi-refresh" @click="confirmRefresh(false)">
<v-btn
class="gacha-top-btn"
prepend-icon="mdi-refresh"
variant="elevated"
@click="confirmRefresh(false)"
>
增量刷新
</v-btn>
<v-btn class="gacha-top-btn" prepend-icon="mdi-refresh" @click="confirmRefresh(true)">
<v-btn
class="gacha-top-btn"
prepend-icon="mdi-refresh"
variant="elevated"
@click="confirmRefresh(true)"
>
全量刷新
</v-btn>
<v-btn class="gacha-top-btn" prepend-icon="mdi-import" @click="importUigf()">导入</v-btn>
<v-btn class="gacha-top-btn" prepend-icon="mdi-import" @click="importUigf4()">
<v-btn
class="gacha-top-btn"
prepend-icon="mdi-import"
variant="elevated"
@click="importUigf()"
>导入</v-btn
>
<v-btn
class="gacha-top-btn"
prepend-icon="mdi-import"
variant="elevated"
@click="importUigf4()"
>
导入(v4)
</v-btn>
<v-btn class="gacha-top-btn" prepend-icon="mdi-export" @click="exportUigf()">导出</v-btn>
<v-btn class="gacha-top-btn" prepend-icon="mdi-export" @click="exportUigf4()">
<v-btn
class="gacha-top-btn"
prepend-icon="mdi-export"
variant="elevated"
@click="exportUigf()"
>导出</v-btn
>
<v-btn
class="gacha-top-btn"
prepend-icon="mdi-export"
variant="elevated"
@click="exportUigf4()"
>
导出(v4)
</v-btn>
<v-btn class="gacha-top-btn" prepend-icon="mdi-delete" @click="deleteGacha()">删除</v-btn>
<v-btn
class="gacha-top-btn"
prepend-icon="mdi-delete"
variant="elevated"
@click="deleteGacha()"
>删除</v-btn
>
<v-btn
class="gacha-top-btn"
prepend-icon="mdi-database-check"
title="检测并补充遗漏的itemId"
variant="elevated"
@click="checkData()"
>
检测数据
@@ -480,20 +519,16 @@ async function checkData(): Promise<void> {
.gacha-top-btns {
display: flex;
margin-bottom: 4px;
margin-left: 16px;
column-gap: 8px;
}
.gacha-top-btn {
border-radius: 5px;
background: var(--tgc-btn-1);
color: var(--btn-text);
}
.dark .gacha-top-btn {
border: 1px solid var(--common-shadow-2);
}
.gacha-container {
display: flex;
height: calc(100vh - 144px);

View File

@@ -1,4 +1,4 @@
<!-- 千星奇域祈愿记录页面 TODO处理活动卡池次数共享 -->
variantelevated<!-- 千星奇域祈愿记录页面 TODO处理活动卡池次数共享 -->
<template>
<v-app-bar>
<template #prepend>
@@ -18,13 +18,30 @@
</template>
<template #extension>
<div class="gb-top-btns">
<v-btn class="gb-top-btn" prepend-icon="mdi-refresh" @click="confirmRefresh(false)">
<v-btn
class="gb-top-btn"
prepend-icon="mdi-refresh"
variant="elevated"
@click="confirmRefresh(false)"
>
增量刷新
</v-btn>
<v-btn class="gb-top-btn" prepend-icon="mdi-refresh" @click="confirmRefresh(true)">
<v-btn
class="gb-top-btn"
prepend-icon="mdi-refresh"
variant="elevated"
@click="confirmRefresh(true)"
>
全量刷新
</v-btn>
<v-btn class="gb-top-btn" prepend-icon="mdi-delete" @click="deleteGacha()">删除</v-btn>
<v-btn
class="gb-top-btn"
prepend-icon="mdi-delete"
variant="elevated"
@click="deleteGacha()"
>
删除
</v-btn>
</div>
</template>
</v-app-bar>
@@ -303,20 +320,16 @@ async function deleteGacha(): Promise<void> {
.gb-top-btns {
display: flex;
margin-bottom: 4px;
margin-left: 16px;
column-gap: 8px;
}
.gb-top-btn {
border-radius: 4px;
background: var(--tgc-btn-1);
color: var(--btn-text);
}
.dark .gb-top-btn {
border: 1px solid var(--common-shadow-2);
}
.gb-container {
display: flex;
height: calc(100vh - 144px);

View File

@@ -5,38 +5,46 @@
<img alt="icon" src="/source/UI/userRecord.webp" />
<span>原神战绩</span>
<v-select
density="compact"
variant="outlined"
v-model="uidCur"
:items="uidList"
:hide-details="true"
:items="uidList"
density="compact"
label="游戏UID"
variant="outlined"
/>
</div>
</template>
<template #append>
<div class="ur-top-btns">
<v-btn prepend-icon="mdi-refresh" class="ur-top-btn" @click="refreshRecord()">更新</v-btn>
<v-btn
prepend-icon="mdi-share"
class="ur-top-btn"
@click="shareRecord()"
prepend-icon="mdi-refresh"
variant="elevated"
@click="refreshRecord()"
>更新</v-btn
>
<v-btn
:disabled="recordData === undefined"
class="ur-top-btn"
prepend-icon="mdi-share"
variant="elevated"
@click="shareRecord()"
>
分享
</v-btn>
<v-btn
prepend-icon="mdi-delete"
class="ur-top-btn"
@click="deleteRecord()"
:disabled="recordData === undefined"
class="ur-top-btn"
prepend-icon="mdi-delete"
variant="elevated"
@click="deleteRecord()"
>
删除
</v-btn>
</div>
</template>
</v-app-bar>
<div class="ur-box" v-if="recordData">
<div v-if="recordData" class="ur-box">
<div class="ur-box-title">
<TurRoleInfo :role="recordData.role" :uid="uidCur ?? 0" />
<span class="sign">TeyvatGuide v{{ version }} | {{ recordData.updated }}</span>
@@ -58,7 +66,7 @@
<TurHomeGrid :model-value="recordData.homes" />
</PhCompCard>
</div>
<div class="ur-empty" v-else>
<div v-else class="ur-empty">
<img alt="empty" src="/source/UI/empty.webp" />
<span>DATA NOT FOUND</span>
</div>
@@ -207,8 +215,7 @@ async function deleteRecord(): Promise<void> {
display: flex;
align-items: center;
justify-content: center;
padding: 8px;
margin-left: 8px;
margin-left: 12px;
gap: 8px;
img {
@@ -226,7 +233,7 @@ async function deleteRecord(): Promise<void> {
.ur-top-btns {
position: relative;
display: flex;
margin-right: 16px;
margin-right: 12px;
gap: 8px;
}
@@ -237,10 +244,6 @@ async function deleteRecord(): Promise<void> {
font-family: var(--font-text);
}
.dark .ur-top-btn {
border: 1px solid var(--common-shadow-2);
}
.ur-box {
@include github-styles.github-card-shadow;

View File

@@ -46,15 +46,15 @@
</div>
</template>
</v-select>
<v-btn :loading="runAll" class="run-all-btn" variant="elevated" @click="tryExecAll()"
>一键执行</v-btn
>
<v-btn :loading="runAll" class="run-all-btn" variant="elevated" @click="tryExecAll()">
一键执行
</v-btn>
</div>
</template>
<template #append>
<span class="top-hint" title="点击验证" @click="tryCkVerify()">
需要验证码登录/游戏扫码登录所需cookie
</span>
<v-btn class="us-test-btn" title="点击验证" variant="elevated" @click="tryCkVerify()">
打卡测试
</v-btn>
</template>
</v-app-bar>
<div class="us-page-container">
@@ -180,8 +180,8 @@ async function tryExecAll(): Promise<void> {
display: flex;
align-items: center;
justify-content: center;
padding: 10px;
gap: 10px;
margin-left: 12px;
column-gap: 8px;
img {
width: 32px;
@@ -298,12 +298,13 @@ async function tryExecAll(): Promise<void> {
row-gap: 8px;
}
.run-all-btn {
.run-all-btn,
.us-test-btn {
background: var(--tgc-btn-1);
color: var(--btn-text);
}
.dark .run-all-btn {
border: 1px solid var(--common-shadow-1);
.us-test-btn {
margin-right: 12px;
}
</style>

View File

@@ -31,10 +31,18 @@
</template>
<template #extension>
<div class="top-extension">
<v-btn class="top-btn" prepend-icon="mdi-import" @click="importJson()">导入</v-btn>
<v-btn class="top-btn" prepend-icon="mdi-export" @click="exportJson()">导出</v-btn>
<v-btn class="top-btn" prepend-icon="mdi-plus" @click="createUid()">新建存档</v-btn>
<v-btn class="top-btn" prepend-icon="mdi-delete" @click="deleteUid()">删除存档</v-btn>
<v-btn class="top-btn" prepend-icon="mdi-import" variant="elevated" @click="importJson()"
>导入</v-btn
>
<v-btn class="top-btn" prepend-icon="mdi-export" variantelevated @click="exportJson()"
>导出</v-btn
>
<v-btn class="top-btn" prepend-icon="mdi-plus" variant="elevated" @click="createUid()"
>新建存档</v-btn
>
<v-btn class="top-btn" prepend-icon="mdi-delete" variant="elevated" @click="deleteUid()"
>删除存档</v-btn
>
<div class="top-switch" @click="switchHideFin">
<v-icon v-if="hideFin" color="var(--tgc-od-green)">
mdi-checkbox-marked-circle-outline
@@ -47,6 +55,7 @@
class="top-link top-btn"
prepend-icon="mdi-import"
title="通过Yae导入"
variant="elevated"
@click="toYae()"
>
YAE
@@ -377,7 +386,6 @@ async function toYae(): Promise<void> {
height: 50px;
align-items: center;
justify-content: center;
padding: 10px;
margin: 0 10px;
color: var(--box-text-1);
}
@@ -387,14 +395,13 @@ async function toYae(): Promise<void> {
display: flex;
align-items: center;
justify-content: center;
padding: 8px;
margin-left: 8px;
margin-bottom: 4px;
margin-left: 16px;
column-gap: 8px;
}
.top-btn {
height: 40px;
border: 1px solid var(--common-shadow-2);
background: var(--tgc-btn-1);
color: var(--btn-text);
font-family: var(--font-title);
@@ -412,6 +419,7 @@ async function toYae(): Promise<void> {
.top-link {
margin-right: 16px;
margin-bottom: 4px;
margin-left: auto;
}

View File

@@ -1,42 +1,57 @@
<!-- 公告页面 -->
<template>
<v-app-bar>
<template #prepend>
<v-tabs v-model="tab" align-tabs="start" class="anno-tab">
<v-tab v-for="(tab, index) in tabList" :key="index" :value="tab.value">
{{ tab.text }}
</v-tab>
</v-tabs>
<div class="anno-selects">
<v-select
class="anno-select"
:items="serverList"
v-model="server"
item-title="text"
item-value="value"
label="服务器"
width="200px"
density="compact"
:disabled="isReq"
/>
<v-select
class="anno-select"
:items="langList"
v-model="lang"
item-title="text"
item-value="value"
label="语言"
width="200px"
density="compact"
:disabled="isReq"
/>
<div class="pa-prepend">
<v-tabs v-model="tab" align-tabs="start" class="pa-tabs">
<v-tab v-for="(tab, index) in tabList" :key="index" :value="tab.value">
{{ tab.text }}
</v-tab>
</v-tabs>
<div class="pa-selects">
<v-select
v-model="server"
:disabled="isReq"
:items="serverList"
class="anno-select"
density="compact"
item-title="text"
item-value="value"
label="服务器"
width="200px"
/>
<v-select
v-model="lang"
:disabled="isReq"
:items="langList"
class="anno-select"
density="compact"
item-title="text"
item-value="value"
label="语言"
width="200px"
/>
</div>
</div>
</template>
<template #append>
<div class="anno-top-append">
<v-btn class="anno-switch-btn" @click="switchNews" prepend-icon="mdi-bullhorn">
<v-btn
class="anno-btn"
prepend-icon="mdi-bullhorn"
rounded
variant="elevated"
@click="switchNews"
>
切换米游社咨讯
</v-btn>
<v-btn class="anno-switch-btn" v-if="isLogin" @click="showIframe()">
<v-btn
v-if="isLogin"
class="anno-btn"
size="small"
variant="elevated"
@click="showIframe()"
>
<v-icon>mdi-web</v-icon>
</v-btn>
</div>
@@ -57,7 +72,7 @@ import showSnackbar from "@comp/func/snackbar.js";
import TaCard from "@comp/pageAnno/ta-card.vue";
import TaoIframe from "@comp/pageAnno/tao-iframe.vue";
import { AnnoLangEnum, AnnoTypeEnum, getAnnoLangDesc, getAnnoTypeDesc } from "@enum/anno.js";
import { getGameServerDesc, GameServerEnum } from "@enum/game.js";
import { GameServerEnum, getGameServerDesc } from "@enum/game.js";
import hk4eReq from "@req/hk4eReq.js";
import useAppStore from "@store/app.js";
import TGLogger from "@utils/TGLogger.js";
@@ -216,24 +231,34 @@ async function switchNews(): Promise<void> {
await router.push("/news/2");
}
</script>
<style lang="scss" scoped>
.pa-prepend {
position: relative;
display: flex;
align-items: center;
justify-content: center;
margin-left: 12px;
column-gap: 8px;
}
<style lang="css" scoped>
.anno-tab {
.pa-tabs {
margin-bottom: 8px;
color: var(--common-text-title);
font-family: var(--font-title);
}
.anno-selects {
.pa-selects {
position: relative;
display: flex;
align-items: center;
justify-content: center;
padding-top: 25px;
margin: 0 10px;
gap: 10px;
margin: 0 8px;
column-gap: 8px;
}
.anno-select {
width: 150px;
height: 40px;
color: var(--common-text-title);
font-family: var(--font-title);
}
@@ -242,21 +267,17 @@ async function switchNews(): Promise<void> {
display: flex;
align-items: center;
justify-content: center;
margin-right: 16px;
margin-right: 12px;
column-gap: 8px;
}
.anno-switch-btn {
.anno-btn {
height: 40px;
background: var(--tgc-btn-1);
color: var(--btn-text);
font-family: var(--font-title);
}
.dark .anno-switch-btn {
border: 1px solid var(--common-shadow-2);
}
.anno-grid {
display: grid;
font-family: var(--font-title);

View File

@@ -53,19 +53,30 @@
</template>
<template #append>
<div class="pbm-nav-extension">
<v-btn class="pbm-ne-btn" prepend-icon="mdi-import" @click="tryCallYae()">导入</v-btn>
<v-btn class="pbm-ne-btn" prepend-icon="mdi-plus" @click="createUid()">新建存档</v-btn>
<v-btn class="pbm-ne-btn" prepend-icon="mdi-delete" @click="deleteUid()">删除存档</v-btn>
<v-btn
class="pbm-ne-btn"
prepend-icon="mdi-import"
variant="elevated"
@click="tryCallYae()"
>
导入
</v-btn>
<v-btn class="pbm-ne-btn" prepend-icon="mdi-plus" variant="elevated" @click="createUid()">
新建存档
</v-btn>
<v-btn class="pbm-ne-btn" prepend-icon="mdi-delete" variant="elevated" @click="deleteUid()">
删除存档
</v-btn>
</div>
</template>
</v-app-bar>
<div class="pbm-container">
<template v-for="material in materialShow" :key="`${curUid}-${material.info.id}`">
<PbMaterialItem
:cur="curMaterial"
:info="material.info"
:tb="material.tb"
@select="handleSelect"
:cur="curMaterial"
/>
</template>
</div>
@@ -380,13 +391,12 @@ function switchMaterial(isNext: boolean): void {
display: flex;
align-items: center;
justify-content: center;
margin-right: 16px;
margin-right: 12px;
column-gap: 8px;
}
.pbm-ne-btn {
height: 40px;
border: 1px solid var(--common-shadow-2);
background: var(--tgc-btn-1);
color: var(--btn-text);
font-family: var(--font-title);

View File

@@ -2,88 +2,102 @@
<v-app-bar>
<div class="pc-top">
<div class="pc-title">
<img src="/source/UI/posts.webp" alt="posts" />
<img alt="posts" src="/source/UI/posts.webp" />
<span>收藏</span>
</div>
<v-select
:hide-details="true"
density="compact"
v-model="curSelect"
class="pc-select"
:items="collections"
:clearable="curSelect !== '未分类'"
variant="outlined"
:hide-details="true"
:items="collections"
class="pc-select"
density="compact"
label="合集"
variant="outlined"
>
<template v-slot:item="{ props, item }">
<v-list-item v-bind="props" :title="item.raw.title" :subtitle="item.raw.desc" />
<v-list-item :subtitle="item.raw.desc" :title="item.raw.title" v-bind="props" />
</template>
</v-select>
</div>
<template #append>
<v-pagination class="pc-page" v-model="page" :total-visible="view" :length="length" />
</template>
<template #extension>
<div class="pc-btns">
<v-btn
<div class="pc-extension">
<div class="pc-btns">
<v-btn
:title="sortId ? '按更新时间排序' : '按帖子ID排序'"
class="pc-btn"
icon="mdi-sort"
size="small"
variant="elevated"
@click="sortPost(!sortId)"
/>
<v-btn
:disabled="selectedMode"
class="pc-btn"
icon="mdi-refresh"
size="small"
title="获取用户收藏"
variant="elevated"
@click="freshUser()"
/>
<v-btn
:disabled="selectedMode"
class="pc-btn"
icon="mdi-import"
size="small"
title="导入其他用户收藏"
variant="elevated"
@click="freshOther"
/>
<v-btn
:icon="selectedMode ? 'mdi-folder-move' : 'mdi-pencil'"
class="pc-btn"
size="small"
title="编辑收藏"
variant="elevated"
@click="toSelect()"
/>
<v-btn
:disabled="selectedMode"
class="pc-btn"
icon="mdi-plus"
size="small"
title="新建分类"
variant="elevated"
@click="addCollect"
/>
<v-btn
:disabled="selectedMode || curSelect === '未分类'"
class="pc-btn"
icon="mdi-information"
size="small"
title="编辑分类"
variant="elevated"
@click="toEdit()"
/>
<v-btn
:title="selectedMode ? '删除帖子分类' : '清空合集'"
class="pc-btn"
icon="mdi-delete"
size="small"
variant="elevated"
@click="deleteOper(false)"
/>
<v-btn
:title="selectedMode ? '删除帖子' : '删除合集'"
class="pc-btn"
icon="mdi-delete-forever"
size="small"
variant="elevated"
@click="deleteOper(true)"
/>
</div>
<v-pagination
v-model="page"
:length="length"
:total-visible="view"
size="small"
class="pc-btn"
icon="mdi-sort"
@click="sortPost(!sortId)"
:title="sortId ? '按更新时间排序' : '按帖子ID排序'"
/>
<v-btn
:disabled="selectedMode"
size="small"
class="pc-btn"
icon="mdi-refresh"
title="获取用户收藏"
@click="freshUser()"
/>
<v-btn
:disabled="selectedMode"
size="small"
class="pc-btn"
icon="mdi-import"
@click="freshOther"
title="导入其他用户收藏"
/>
<v-btn
size="small"
class="pc-btn"
:icon="selectedMode ? 'mdi-folder-move' : 'mdi-pencil'"
@click="toSelect()"
title="编辑收藏"
/>
<v-btn
:disabled="selectedMode"
size="small"
class="pc-btn"
icon="mdi-plus"
@click="addCollect"
title="新建分类"
/>
<v-btn
:disabled="selectedMode || curSelect === '未分类'"
size="small"
class="pc-btn"
icon="mdi-information"
@click="toEdit()"
title="编辑分类"
/>
<v-btn
size="small"
class="pc-btn"
icon="mdi-delete"
@click="deleteOper(false)"
:title="selectedMode ? '删除帖子分类' : '清空合集'"
/>
<v-btn
size="small"
class="pc-btn"
icon="mdi-delete-forever"
@click="deleteOper(true)"
:title="selectedMode ? '删除帖子' : '删除合集'"
variant="elevated"
/>
</div>
</template>
@@ -91,15 +105,15 @@
<div class="pc-posts">
<div v-for="item in curPosts" :key="item.post.post_id">
<TPostCard
@onSelected="handleSelected"
:model-value="item"
:select-mode="selectedMode"
:user-click="true"
@onSelected="handleSelected"
@onUserClick="handleUserClick"
/>
</div>
</div>
<ToCollectPost @submit="load" :post="selectedPost" v-model="showCollect" />
<ToCollectPost v-model="showCollect" :post="selectedPost" @submit="load" />
<VpOverlayUser v-model="showUser" :gid="curGid" :uid="curUid" />
</template>
<script lang="ts" setup>
@@ -405,6 +419,7 @@ function handleUserClick(user: TGApp.BBS.Post.User, gid: number): void {
</script>
<style lang="css" scoped>
.pc-top {
position: relative;
display: flex;
margin-left: 12px;
gap: 8px;
@@ -432,11 +447,21 @@ function handleUserClick(user: TGApp.BBS.Post.User, gid: number): void {
min-width: 150px;
}
.pc-extension {
position: relative;
display: flex;
width: 100%;
box-sizing: border-box;
align-items: center;
justify-content: space-between;
padding: 0 16px;
margin-bottom: 4px;
}
.pc-btns {
display: flex;
align-items: center;
justify-content: center;
margin-left: 16px;
gap: 8px;
}
@@ -447,14 +472,10 @@ function handleUserClick(user: TGApp.BBS.Post.User, gid: number): void {
font-family: var(--font-title);
}
.dark .pc-btn {
border: 1px solid var(--common-shadow-2);
}
.pc-posts {
display: grid;
grid-auto-rows: auto;
grid-gap: 8px;
gap: 8px;
grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
}
</style>

View File

@@ -2,28 +2,28 @@
<v-app-bar>
<template #prepend>
<div class="posts-top">
<img src="/source/UI/posts.webp" alt="posts" />
<img alt="posts" src="/source/UI/posts.webp" />
<span>帖子</span>
</div>
</template>
<div class="posts-switch">
<v-select
v-model="curGid"
class="post-switch-item"
:disabled="isReq"
:items="sortGameList"
class="post-switch-item"
item-title="text"
item-value="gid"
variant="outlined"
label="分区"
:disabled="isReq"
variant="outlined"
>
<template #selection="{ item }">
<div class="select-item main">
<TMiImg
v-if="item.raw.icon"
:src="item.raw.icon"
:ori="true"
:alt="item.raw.text"
:ori="true"
:src="item.raw.icon"
:title="item.raw.text"
class="icon"
/>
@@ -32,16 +32,16 @@
</template>
<template #item="{ props, item }">
<div
v-bind="props"
class="select-item sub"
:class="{ selected: item.raw.gid === curGid }"
class="select-item sub"
v-bind="props"
>
<TMiImg
v-if="item.raw.icon"
:src="item.raw.icon"
:alt="item.raw.text"
class="icon"
:ori="true"
:src="item.raw.icon"
class="icon"
/>
<span>{{ item.raw.text }}</span>
</div>
@@ -49,19 +49,19 @@
</v-select>
<v-select
v-model="selectedForum"
class="post-switch-item"
:items="curForums"
item-title="text"
variant="outlined"
label="版块"
:disabled="isReq"
:items="curForums"
class="post-switch-item"
item-title="text"
label="版块"
variant="outlined"
>
<template #selection="{ item }">
<div class="select-item main">
<TMiImg
:src="item.raw.icon"
:alt="item.raw.text"
:ori="true"
:src="item.raw.icon"
:title="item.raw.text"
class="icon"
/>
@@ -70,38 +70,44 @@
</template>
<template #item="{ props, item }">
<div
v-bind="props"
class="select-item sub"
@click="selectedForum = item.raw"
:class="{ selected: item.raw.value === selectedForum?.value }"
class="select-item sub"
v-bind="props"
@click="selectedForum = item.raw"
>
<TMiImg :src="item.raw.icon" :alt="item.raw.text" :ori="true" class="icon" />
<TMiImg :alt="item.raw.text" :ori="true" :src="item.raw.icon" class="icon" />
<span>{{ item.raw.text }}</span>
</div>
</template>
</v-select>
<v-select
v-model="curSortType"
class="post-switch-item"
:disabled="isReq"
:items="sortOrderList"
class="post-switch-item"
item-title="text"
item-value="value"
variant="outlined"
label="排序"
:disabled="isReq"
variant="outlined"
/>
<v-text-field
v-model="search"
class="post-switch-item"
:hide-details="true"
:single-line="true"
append-inner-icon="mdi-magnify"
class="post-switch-item"
label="请输入帖子 ID 或搜索词"
variant="outlined"
:single-line="true"
:hide-details="true"
@click:append="searchPost"
@keyup.enter="searchPost"
/>
<v-btn :rounded="true" class="post-forum-btn" @click="freshPostData()" :loading="isReq">
<v-btn
:loading="isReq"
:rounded="true"
class="post-forum-btn"
variant="elevated"
@click="freshPostData()"
>
<v-icon>mdi-refresh</v-icon>
<span>刷新</span>
</v-btn>
@@ -115,10 +121,10 @@
<TPostCard :model-value="post" :user-click="true" @onUserClick="handleUserClick" />
</div>
</div>
<VpOverlaySearch :gid="curGid.toString()" v-model="showSearch" :keyword="search" />
<VpOverlaySearch v-model="showSearch" :gid="curGid.toString()" :keyword="search" />
<VpOverlayUser v-model="showUser" :gid="curGid" :uid="curUid" />
</template>
<script setup lang="ts">
<script lang="ts" setup>
import TGameNav from "@comp/app/t-gameNav.vue";
import TMiImg from "@comp/app/t-mi-img.vue";
import TPostCard from "@comp/app/t-postcard.vue";
@@ -395,15 +401,11 @@ function handleUserClick(user: TGApp.BBS.Post.User, gid: number): void {
font-family: var(--font-title);
}
.dark .post-forum-btn {
border: 1px solid var(--common-shadow-2);
}
.posts-grid {
display: grid;
font-family: var(--font-title);
grid-auto-rows: auto;
grid-gap: 8px;
gap: 8px;
grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
}

View File

@@ -1,13 +1,13 @@
<template>
<v-app-bar density="compact">
<v-app-bar>
<template #prepend>
<v-tabs v-model="tab" align-tabs="start" class="news-tab">
<v-tabs v-model="tab" align-tabs="center" class="news-tab">
<v-tab
v-for="(value, index) in tabValues"
:key="index"
:disabled="loading"
:value="value"
@click="firstLoad(value)"
:disabled="loading"
>
{{ rawData[value].name }}
</v-tab>
@@ -16,28 +16,36 @@
<template #title>
<v-text-field
v-model="search"
class="news-search"
append-icon="mdi-magnify"
label="请输入帖子 ID 或搜索词"
:single-line="true"
:hide-details="true"
:single-line="true"
append-icon="mdi-magnify"
class="news-search"
density="compact"
label="请输入帖子 ID 或搜索词"
@keydown.enter="searchPost()"
@click:append="searchPost()"
/>
</template>
<template #append>
<v-btn
class="post-news-btn"
:loading="loading"
@click="firstLoad(tab, true)"
icon="mdi-refresh"
/>
<v-btn class="post-news-btn" @click="handleList()" icon="mdi-view-list" />
<v-btn
class="post-news-btn"
@click="switchAnno"
size="small"
variant="elevated"
@click="firstLoad(tab, true)"
>
<v-icon>mdi-refresh</v-icon>
</v-btn>
<v-btn class="post-news-btn" size="small" variant="elevated" @click="handleList()">
<v-icon>mdi-view-list</v-icon>
</v-btn>
<v-btn
v-if="gid === '2'"
class="post-news-btn"
prepend-icon="mdi-bullhorn"
rounded
variant="elevated"
@click="switchAnno"
>
切换游戏内公告
</v-btn>
@@ -53,7 +61,7 @@
</v-window-item>
</v-window>
<ToChannel v-model="showList" :gid="gid" />
<VpOverlaySearch :gid="gid" v-model="showSearch" :keyword="search" />
<VpOverlaySearch v-model="showSearch" :gid="gid" :keyword="search" />
</template>
<script lang="ts" setup>
import TPostCard from "@comp/app/t-postcard.vue";
@@ -198,20 +206,23 @@ async function searchPost(): Promise<void> {
</script>
<style lang="scss" scoped>
.news-tab {
margin-bottom: 10px;
margin-bottom: 8px;
color: var(--common-text-title);
font-family: var(--font-title);
&:first-child {
margin-left: 12px;
}
}
.post-news-btn {
height: 40px;
border-radius: 3px;
background: var(--tgc-btn-1);
color: var(--btn-text);
font-family: var(--font-title);
&:last-child {
margin-right: 16px;
margin-right: 12px;
}
}
@@ -219,20 +230,16 @@ async function searchPost(): Promise<void> {
margin-left: 8px;
}
.dark .post-news-btn {
border: 1px solid var(--common-shadow-2);
}
.news-search {
margin: 0 10px;
margin: 0 16px;
color: var(--box-text-1);
}
.news-grid {
display: grid;
font-family: var(--font-title);
gap: 8px;
grid-auto-rows: auto;
grid-gap: 8px;
grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
}
</style>

View File

@@ -1,34 +1,40 @@
<!-- 话题页面 -->
<template>
<v-app-bar>
<template #prepend>
<div class="post-topic-top" v-if="topicInfo" :class="sidebar.collapse ? 'wide' : 'thin'">
<TMiImg :src="topicInfo.topic.cover" alt="cover" :ori="true" />
<div v-if="topicInfo" :class="sidebar.collapse ? 'wide' : 'thin'" class="post-topic-top">
<TMiImg :ori="true" :src="topicInfo.topic.cover" alt="cover" />
<div class="post-topic-info">
<span>{{ curTopic }}-{{ topicInfo.topic.name }}</span>
<span :title="topicInfo.topic.desc">{{ topicInfo.topic.desc }}</span>
<span class="post-topic-title">{{ topicInfo.topic.name }}</span>
<span :title="topicInfo.topic.desc" class="post-topic-desc">{{
topicInfo.topic.desc
}}</span>
</div>
<div :title="`话题ID${topicInfo.topic.id}`" class="post-topic-id">
{{ topicInfo.topic.id }}
</div>
</div>
</template>
<template #extension>
<TGameNav :model-value="curGid" v-if="curGid !== 0" style="margin-left: 8px" />
<TGameNav v-if="curGid !== 0" :model-value="curGid" style="margin-left: 8px" />
</template>
<div class="post-topic-switch">
<v-select
v-model="curGame"
class="post-switch-item"
:items="getGameList(topicInfo?.game_info_list)"
item-title="name"
:item-value="(item) => item"
variant="outlined"
label="分区"
:disabled="isReq"
:item-value="(item) => item"
:items="getGameList(topicInfo?.game_info_list)"
class="post-switch-item"
item-title="name"
label="分区"
variant="outlined"
>
<template #selection="{ item }">
<div class="select-item main">
<img
v-if="item.raw.icon"
:src="item.raw.icon"
:alt="item.raw.name"
:src="item.raw.icon"
:title="item.raw.name"
class="icon"
/>
@@ -36,11 +42,11 @@
</div>
</template>
<template #item="{ props, item }">
<div v-bind="props" class="select-item sub" :class="{ selected: item.raw.id === curGid }">
<div :class="{ selected: item.raw.id === curGid }" class="select-item sub" v-bind="props">
<img
v-if="item.raw.icon"
:src="item.raw.icon"
:alt="item.raw.name"
:src="item.raw.icon"
:title="item.raw.name"
class="icon"
/>
@@ -50,30 +56,32 @@
</v-select>
<v-select
v-model="curSortType"
class="post-switch-item"
:disabled="isReq"
:items="sortList"
class="post-switch-item"
item-title="text"
item-value="value"
variant="outlined"
label="排序"
:disabled="isReq"
variant="outlined"
/>
<v-text-field
v-model="search"
class="post-switch-item"
:hide-details="true"
:single-line="true"
append-inner-icon="mdi-magnify"
class="post-switch-item"
label="请输入帖子 ID 或搜索词"
variant="outlined"
:single-line="true"
:hide-details="true"
@click:append="searchPost"
@keyup.enter="searchPost"
/>
<v-btn
:loading="isReq"
class="post-topic-btn"
@click="freshPostData()"
prepend-icon="mdi-refresh"
rounded
variant="elevated"
@click="freshPostData()"
>
刷新
</v-btn>
@@ -84,7 +92,7 @@
<TPostCard :model-value="post" :user-click="true" @onUserClick="handleUserClick" />
</div>
</div>
<VpOverlaySearch :gid="curGid.toString()" v-model="showSearch" :keyword="search" />
<VpOverlaySearch v-model="showSearch" :gid="curGid.toString()" :keyword="search" />
<VpOverlayUser v-model="showUser" :gid="curGid" :uid="curUid" />
</template>
<script lang="ts" setup>
@@ -295,6 +303,7 @@ function handleUserClick(user: TGApp.BBS.Post.User, gid: number): void {
display: flex;
overflow: hidden;
max-width: 100%;
height: 48px;
box-sizing: border-box;
align-items: center;
justify-content: flex-start;
@@ -305,8 +314,9 @@ function handleUserClick(user: TGApp.BBS.Post.User, gid: number): void {
gap: 4px;
img {
width: 50px;
height: 50px;
height: 100%;
flex-shrink: 0;
aspect-ratio: 1;
}
&.wide {
@@ -331,21 +341,33 @@ function handleUserClick(user: TGApp.BBS.Post.User, gid: number): void {
flex-direction: column;
align-items: flex-start;
justify-content: center;
}
:first-child {
color: var(--common-text-title);
font-family: var(--font-title);
font-size: 18px;
}
.post-topic-title {
color: var(--common-text-title);
font-family: var(--font-title);
font-size: 18px;
line-height: 20px;
}
:last-child {
overflow: hidden;
max-width: 100%;
max-lines: 1;
text-overflow: ellipsis;
white-space: nowrap;
word-break: break-all;
}
.post-topic-desc {
overflow: hidden;
max-width: 100%;
font-size: 12px;
line-height: 16px;
max-lines: 1;
text-overflow: ellipsis;
white-space: nowrap;
word-break: break-all;
}
.post-topic-id {
position: absolute;
z-index: 1;
top: 2px;
right: 2px;
color: var(--tgc-od-red);
font-size: 8px;
}
.post-topic-switch {
@@ -368,10 +390,6 @@ function handleUserClick(user: TGApp.BBS.Post.User, gid: number): void {
font-family: var(--font-title);
}
.dark .post-topic-btn {
border: 1px solid var(--common-shadow-2);
}
.post-topic-grid {
display: grid;
font-family: var(--font-title);