fix: 投票模块采用clientOnly

This commit is contained in:
tim
2025-08-31 01:19:48 +08:00
parent ac4f1064e7
commit 6e1a7c773c

View File

@@ -171,71 +171,81 @@
</div> </div>
</div> </div>
</div> </div>
<div v-if="poll" class="post-poll-container"> <ClientOnly>
<div class="poll-top-container"> <div v-if="poll" class="post-poll-container">
<div class="poll-options-container"> <div class="poll-top-container">
<div v-if="showPollResult || pollEnded"> <div class="poll-options-container">
<div v-for="(opt, idx) in poll.options" :key="idx" class="poll-option-result"> <div v-if="showPollResult || pollEnded || hasVoted">
<div class="poll-option-info-container"> <div v-for="(opt, idx) in poll.options" :key="idx" class="poll-option-result">
<div class="poll-option-text">{{ opt }}</div> <div class="poll-option-info-container">
<div class="poll-option-progress-info"> <div class="poll-option-text">{{ opt }}</div>
{{ pollPercentages[idx] }}% ({{ pollVotes[idx] || 0 }}人已投票) <div class="poll-option-progress-info">
{{ pollPercentages[idx] }}% ({{ pollVotes[idx] || 0 }}人已投票)
</div>
</div>
<div class="poll-option-progress">
<div
class="poll-option-progress-bar"
:style="{ width: pollPercentages[idx] + '%' }"
></div>
</div>
<div class="poll-participants">
<BaseImage
v-for="p in pollOptionParticipants[idx] || []"
:key="p.id"
class="poll-participant-avatar"
:src="p.avatar"
alt="avatar"
@click="gotoUser(p.id)"
/>
</div> </div>
</div> </div>
<div class="poll-option-progress"> </div>
<div <div v-else>
class="poll-option-progress-bar" <div
:style="{ width: pollPercentages[idx] + '%' }" v-for="(opt, idx) in poll.options"
></div> :key="idx"
</div> class="poll-option"
<div class="poll-participants"> @click="voteOption(idx)"
<BaseImage >
v-for="p in pollOptionParticipants[idx] || []" <input
:key="p.id" type="radio"
class="poll-participant-avatar" :checked="true"
:src="p.avatar" name="poll-option"
alt="avatar" class="poll-option-input"
@click="gotoUser(p.id)"
/> />
<span class="poll-option-text">{{ opt }}</span>
</div> </div>
</div> </div>
</div> </div>
<div v-else> <div class="poll-info">
<div <div class="total-votes">{{ pollParticipants.length }}</div>
v-for="(opt, idx) in poll.options" <div class="total-votes-title">投票人</div>
:key="idx"
class="poll-option"
@click="voteOption(idx)"
>
<input type="radio" :checked="true" name="poll-option" class="poll-option-input" />
<span class="poll-option-text">{{ opt }}</span>
</div>
</div> </div>
</div> </div>
<div class="poll-info"> <div class="poll-bottom-container">
<div class="total-votes">{{ pollParticipants.length }}</div> <div
<div class="total-votes-title">投票人</div> v-if="showPollResult && !pollEnded && !hasVoted"
class="poll-option-button"
@click="showPollResult = false"
>
<i class="fas fa-chevron-left"></i> 投票
</div>
<div
v-else-if="!pollEnded && !hasVoted"
class="poll-option-button"
@click="showPollResult = true"
>
<i class="fas fa-chart-bar"></i> 结果
</div>
<div class="poll-left-time">
<div class="poll-left-time-title">离结束还有</div>
<div class="poll-left-time-value">{{ countdown }}</div>
</div>
</div> </div>
</div> </div>
<div class="poll-bottom-container"> </ClientOnly>
<div
v-if="showPollResult && !pollEnded"
class="poll-option-button"
@click="showPollResult = false"
>
<i class="fas fa-chevron-left"></i> 投票
</div>
<div v-else-if="!pollEnded" class="poll-option-button" @click="showPollResult = true">
<i class="fas fa-chart-bar"></i> 结果
</div>
<div class="poll-left-time">
<div class="poll-left-time-title">离结束还有</div>
<div class="poll-left-time-value">{{ countdown }}</div>
</div>
</div>
</div>
<div v-if="closed" class="post-close-container">该帖子已关闭内容仅供阅读无法进行互动</div> <div v-if="closed" class="post-close-container">该帖子已关闭内容仅供阅读无法进行互动</div>
<ClientOnly> <ClientOnly>