cnbugs/uni-halo
1
0
Fork 0
mirror of https://github.com/ialley-workshop-open/uni-halo.git synced 2026-06-12 13:19:31 +08:00
Code Issues Activity

fix: 修复投票状态显示问题

Browse Source
This commit is contained in:
小莫唐尼
2025-08-29 17:52:53 +08:00
parent a8bd121deb
commit 9ab013562d
5 changed files with 149 additions and 279 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/article-vote/article-vote.vue
+46 -82
View File
@@ -8,22 +8,11 @@
<view class="flex justify-between">
<view class="flex">
<tm-tags color="orange" style="min-width:40rpx;" :shadow="0" rounded size="s"
model="fill">{{ index+1 }}</tm-tags>
<tm-tags v-if="vote.spec.type==='single'" color="light-blue" :shadow="0" rounded size="s"
model="fill">单选</tm-tags>
<tm-tags v-else-if="vote.spec.type==='multiple'" color="light-blue" :shadow="0" rounded size="s"
model="fill">多选</tm-tags>
<tm-tags v-else-if="vote.spec.type==='pk'" color="light-blue" :shadow="0" rounded size="s"
model="fill">双选PK</tm-tags>
<tm-tags v-if="vote.spec._state=='已结束'" color="red" size="s" rounded :shadow="0"
model="fill">已结束</tm-tags>
<tm-tags v-else-if="vote.spec._state=='未开始'" color="orange" size="s" rounded :shadow="0"
model="fill">未开始</tm-tags>
<tm-tags v-else-if="vote.spec._state=='进行中'" color="green" size="s" rounded :shadow="0"
model="fill">进行中</tm-tags>
model="fill">{{ index + 1 }}</tm-tags>
<tm-tags color="light-blue" :shadow="0" rounded size="s"
model="fill">{{ vote.spec._uh_type }}</tm-tags>
<tm-tags :color="vote.spec._uh_state.color" size="s" rounded :shadow="0"
model="fill">{{vote.spec._uh_state.state}}</tm-tags>
</view>
<view class="flex-shrink">
<tm-button theme="light-blue" :shadow="0" dense size="s"
@@ -44,17 +33,17 @@
<!-- 单选 -->
<view v-if="vote.spec.type==='single'" class="single">
<view class="w-full flex flex-col uh-gap-8">
<template v-if="vote.spec.isVoted">
<template v-if="vote.spec.isVoted || vote.spec.hasEnded">
<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
class="is-voted-item" :class="[option.checked?'selected':'']" :style="{
'--percent': option.percent + '%'
'--percent': option._uh_percent + '%'
}">
<view class="is-voted-item-content flex w-full flex-between uh-gap-4">
<view class="text-align-left flex-1 text-break">
{{option.title }}
</view>
<view class="flex-shrink ">
{{option.percent }}%
{{option._uh_percent }}%
</view>
</view>
</view>
@@ -73,17 +62,17 @@
<!-- 多选 -->
<view v-else-if="vote.spec.type==='multiple'" class="multiple">
<view class="w-full flex flex-col uh-gap-8">
<template v-if="vote.spec.isVoted">
<template v-if="vote.spec.isVoted || vote.spec.hasEnded">
<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
class="is-voted-item" :class="[option.checked?'selected':'']" :style="{
'--percent': option.percent + '%'
'--percent': option._uh_percent + '%'
}">
<view class="is-voted-item-content flex w-full flex-between uh-gap-4">
<view class="text-align-left flex-1 text-break">
{{option.title }}
</view>
<view class="flex-shrink ">
{{option.percent }}%
{{option._uh_percent }}%
</view>
</view>
</view>
@@ -104,26 +93,26 @@
<view class="pk-container">
<view class="radio-item" v-for="(option,optionIndex) in vote.spec.options"
:key="optionIndex" :class="[optionIndex==0?'radio-left':'radio-right']"
:style="{width:option.percent + '%'}">
:style="{width:option._uh_percent + '%'}">
<view class="option-item"
:class="[optionIndex==0?'option-item-left':'option-item-right']">
{{option.percent }}%
{{option._uh_percent }}%
</view>
</view>
</view>
<view class="option-foot w-full flex flex-between uh-mt-12">
<view class="w-full flex flex-col uh-gap-8">
<template v-if="vote.spec.isVoted">
<template v-if="vote.spec.isVoted || vote.spec.hasEnded">
<view v-for="(option,optionIndex) in vote.spec.options" :key="optionIndex"
class="is-voted-item" :class="[option.checked?'selected':'']" :style="{
'--percent': option.percent + '%'
'--percent': option._uh_percent + '%'
}">
<view class="is-voted-item-content flex w-full flex-between uh-gap-4">
<view class="text-align-left flex-1 text-break">
{{option.title }}
</view>
<view class="flex-shrink ">
{{option.percent }}%
{{option._uh_percent }}%
</view>
</view>
</view>
@@ -162,12 +151,17 @@
</view>
<view v-if="submitForm.voteData.length!==0" class="box-border uh-mt-12 w-full uh-px-2">
<tm-button v-if="!vote.spec.canAnonymously" theme="red" :shadow="0" class="w-full" text :block="true"
:height="72" @click="handleSubmit()">不支持匿名投票(点击)</tm-button>
<tm-button v-else-if="fnCalcIsVoted()" theme="white" text :block="true" :height="72"
class="w-full">您已参与投票</tm-button>
<tm-button v-else theme="light-blue" class="w-full" :block="true" :height="72"
@click="handleSubmit()">提交投票</tm-button>
<tm-button v-if="fnCalcIsVoted()" theme="white" text :block="true" class="w-full">您已参与投票</tm-button>
<tm-button v-else-if="vote.spec._uh_state.state==='未开始'" theme="orange" text class="w-full" :height="72"
:block="true" @click="handleSubmitTip('投票未开始')">投票未开始</tm-button>
<tm-button v-else-if="vote.spec._uh_state.state==='已结束'" theme="red" text class="w-full" :height="72"
:block="true" @click="handleSubmitTip('投票已结束')">投票已结束</tm-button>
<tm-button v-else-if="!vote.spec.canAnonymously" theme="red" :shadow="0" class="w-full" :height="72"
text :block="true" @click="handleSubmit()">不支持匿名投票</tm-button>
<tm-button v-else-if="submitForm.voteData.length===0" theme="white" text class="w-full" :height="72"
:block="true" @click="handleSubmitTip('请选择选项')">提交投票（请选择选项）</tm-button>
<tm-button v-else theme="light-blue" class="w-full" :height="72" :block="true" :loading="submitLoading"
:disabled="submitLoading" @click="handleSubmit()">提交投票</tm-button>
</view>
</template>
</view>
@@ -177,15 +171,12 @@
import tmButton from '@/tm-vuetify/components/tm-button/tm-button.vue';
import tmTags from '@/tm-vuetify/components/tm-tags/tm-tags.vue';
import {
VOTE_TYPES,
calcVoteState,
calcVotePercent,
voteCacheUtil
} from '@/utils/vote.js'
const types = {
"pk": "双选PK",
"multiple": "多选",
"single": "单选"
}
export default {
name: "ArticleVote",
components: {
@@ -215,6 +206,7 @@
submitForm: {
voteData: []
},
submitLoading: false
}
},
created() {
@@ -227,28 +219,21 @@
this.$httpApi.v2
.getVoteDetail(this.voteId)
.then(res => {
this.pageTitle = "投票详情" + `（${types[res.vote.spec.type]}）`
this.pageTitle = "投票详情" + `（${VOTE_TYPES[res.vote.spec.type]}）`
const tempVoteRes = res;
tempVoteRes.vote.spec.isVoted = this.fnCalcIsVoted()
tempVoteRes.vote.spec.disabled = this.fnCalcIsVoted()
tempVoteRes.vote.spec._state = this.handleCalcVoteState(tempVoteRes.vote)
tempVoteRes.vote.spec._uh_state = calcVoteState(tempVoteRes.vote)
tempVoteRes.vote.spec._uh_type = VOTE_TYPES[tempVoteRes.vote.spec.type]
tempVoteRes.vote.spec.options.map((option, index) => {
option.value = option.id
option.label = option.title
option.isVoted = this.fnCalcIsVoted()
option.checked = this.fnCalcIsChecked(option)
if (tempVoteRes.vote.spec.type === 'single') {
option.percent = this.fnCalcPercent(option, tempVoteRes.vote.stats);
} else if (tempVoteRes.vote.spec.type === 'multiple') {
option.percent = this.fnCalcPercent(option, tempVoteRes.vote.stats);
} else if (tempVoteRes.vote.spec.type === 'pk') {
option.percent = this.fnCalcPercent(option, tempVoteRes.vote.stats);
}
option._uh_percent = calcVotePercent(tempVoteRes.vote, option);
option.dataStr = JSON.stringify(option)
return option
@@ -267,49 +252,23 @@
this.loadingText = "投票内容加载失败，点击重试"
})
},
fnCalcPercent(voteOption, stats) {
if (!this.fnCalcIsVoted()) return 0;
if (!stats?.voteDataList) return 0;
const option = stats.voteDataList.find(x => x.id == voteOption.id)
if (!option) return 0;
const percent = (option.voteCount / stats.voteCount) * 100
return Math.round(percent)
},
fnCalcIsVoted() {
return voteCacheUtil.has(this.voteId)
},
fnCalcIsChecked(option) {
const data = voteCacheUtil.get(this.voteId)
if (!data) return false;
const checked = data.selected.includes(option.id)
return checked
},
handleCalcVoteState(vote) {
if (vote.spec.timeLimit !== 'custom') {
return vote.spec.hasEnd ? "已结束" : "进行中"
}
const nowTime = new Date().getTime()
const startTime = new Date(vote.spec.startDate).getTime()
const endTime = new Date(vote.spec.endDate).getTime()
if (nowTime < startTime) {
return "未开始"
}
if (nowTime < endTime) {
return "进行中"
}
return vote.spec.hasEnd ? "已结束" : "进行中"
},
formatJsonStr(jsonStr) {
return jsonStr ? JSON.parse(jsonStr) : {}
},
handleSubmitTip() {
handleSubmitTip(text) {
uni.showToast({
icon: "none",
title: "请选择选项后继续"
title: text
})
},
handleSubmit() {
@@ -323,7 +282,7 @@
confirmText: "复制地址",
success: (res) => {
if (res.confirm) {
console.log("this.article",this.article)
console.log("this.article", this.article)
const articleUrl = this.$baseApiUrl + (this.article?.status?.permalink ?? "")
this.$utils.copyText(articleUrl, "原文地址复制成功")
}
@@ -335,7 +294,7 @@
uni.showLoading({
title: "正在保存..."
})
this.submitLoading = true
this.$httpApi.v2
.submitVote(this.voteId, this.submitForm, this.vote.spec.canAnonymously)
.then(res => {
@@ -357,14 +316,17 @@
icon: "none",
title: "提交失败，请重试"
})
}).finally(() => {
this.submitLoading = false
})
},
handleSelectSingleOption(option) {
if (this.vote.spec._state == '未开始') {
if (this.vote.spec._uh_state.state == '未开始') {
this.showToast(`投票未开始`)
return
}
if (this.vote.spec.hasEnded) return
if (this.vote.spec.disabled) return
this.vote.spec.options.map(item => {
if (option.id == item.id) {
@@ -377,10 +339,12 @@
},
handleSelectCheckboxOption(option) {
if (this.vote.spec._state == '未开始') {
if (this.vote.spec._uh_state.state == '未开始') {
this.showToast(`投票未开始`)
return
}
if (this.vote.spec.hasEnded) return
if (this.vote.spec.disabled) return
const checkedList = this.vote.spec.options.filter(x => x.checked && x.id != option.id)