mirror of
https://github.com/BTMuli/TeyvatGuide.git
synced 2026-03-26 05:39:45 +08:00
💄 调整顶部样式
This commit is contained in:
@@ -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>
|
||||
|
||||
@@ -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);
|
||||
|
||||
@@ -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 {
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -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);
|
||||
|
||||
@@ -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);
|
||||
|
||||
@@ -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);
|
||||
|
||||
@@ -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;
|
||||
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
|
||||
@@ -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);
|
||||
|
||||
@@ -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);
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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));
|
||||
}
|
||||
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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);
|
||||
|
||||
Reference in New Issue
Block a user