A1300399510/PC-Light-Forum
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 添加新图片资源及更新组件样式与功能

Browse Source 
style: 调整CSS样式及优化布局
refactor: 重构组件逻辑及API调用
fix: 修复路径引用及图片加载问题
docs: 更新注释及文档内容
This commit is contained in:
DESKTOP-RQ919RC\Pc
2025-11-05 19:10:43 +08:00
parent 07f4401f67
commit 3365e5ee0a
43 changed files with 782 additions and 365 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
component/item-vote/item-vote.js
View File

@@ -12,11 +12,62 @@ export const itemVote = defineComponent({
type: Object,
default: () => {},
},
page: {
type: String,
default: "",
},
},
setup(props) {
// 处理 截止时间
const handleDeadline = (dateTimeStamp = "") => {
if (typeof dateTimeStamp == "number") dateTimeStamp = dateTimeStamp ? dateTimeStamp * 1000 : null;
if (typeof dateTimeStamp == "string" && dateTimeStamp.match(/^\d{4}-\d{2}-\d{2}$/)) dateTimeStamp += " 23:59:59";
const timestamp = new Date(dateTimeStamp.replace(/-/g, "/")).getTime();
const now = Date.now();
const diffValue = timestamp - now;
if (diffValue < 0) return null;
const units = [
{
value: 24 * 60 * 60 * 1000,
unit: "天",
},
{
value: 60 * 60 * 1000,
unit: "小时",
},
{
value: 60 * 1000,
unit: "分钟",
},
{
value: 1000,
unit: "秒",
},
];
for (const { value, unit } of units) {
if (diffValue >= value) {
return {
num: Math.round(diffValue / value),
unit,
};
}
}
return {
num: 0,
unit: "秒",
};
};
let item = ref({ ...props.itemdata });
item.value['url'] = 'https://vote.gter.net/details/' + item.value.uniqid;
item.value["time"] = handleDeadline(item.value.data.deadline);
item.value["url"] = "/details/" + item.value.uniqid;
const option = item.value.data.option || [];
item.value["isvote"] = option.some((item) => item.selected == 1);
return { item };
},
@@ -25,5 +76,5 @@ export const itemVote = defineComponent({
itemHead,
},
template: `<div class="item-box item-vote"> <item-head :itemdata="item"></item-head> <a class="title" :href="item.url" target="_blank">{{ item.title }}</a> <a class="message one-line-display" v-if="item.content">{{ item.content }}</a> <a class="info flexacenter" target="_blank" :href="item.url"> <template v-if="item?.data.status == 1"> <div class="status">进行中</div> <div class="line"></div> <div class="num">{{ item?.time.num }}</div>{{ item.time.unit }}后结束 </template> <div v-else class="status end">已结束</div> <div class="line"></div> <div class="num">{{ item?.data?.votes }}</div>人参与 </a> <a class="list" :class="{ 'voted': !item.time || item.isvote }" target="_blank" :href="item.url"> <div class="list-item flexcenter " v-for="(item, index) in item?.data?.option" :key="index"> <div class="list-top flexacenter"> <img v-if="item.selected" class="list-tick" src="/img/vote-tick.svg"> <div v-else class="list-serial flexcenter">{{ index + 1 }}</div> <div class="list-text one-line-display flex1">{{ item.value }}</div> </div> <div class="list-bottom flexacenter"> <div class="list-length" :style="{ width: item.percentage + '%' }"></div>{{ item.count }} </div> </div> </a> <item-bottom :itemdata="item"></item-bottom></div>`,
template: `<div class="item-box item-vote"> <item-head :itemdata="item" :page="page"></item-head> <a class="title" :href="item.url" target="_blank">{{ item.title }}</a> <a class="message one-line-display" v-if="item.content">{{ item.content }}</a> <a class="info flexacenter" target="_blank" :href="item.url"> <template v-if="item?.data.status == 1"> <div class="status">进行中</div> <div class="line"></div> <div class="num">{{ item?.time.num }}</div>{{ item.time.unit }}后结束 </template> <div v-else class="status end">已结束</div> <div class="line"></div> <div class="num">{{ item?.data?.votes }}</div>人参与 </a> <a class="list" :class="{ 'voted': !item.time || item.isvote }" target="_blank" :href="item.url"> <div class="list-item flexcenter " v-for="(item, index) in item?.data?.option" :key="index"> <div class="list-top flexacenter"> <img v-if="item.selected" class="list-tick" src="/img/vote-tick.svg"> <div v-else class="list-serial flexcenter">{{ index + 1 }}</div> <div class="list-text one-line-display flex1">{{ item.value }}</div> </div> <div class="list-bottom flexacenter"> <div class="list-length" :style="{ width: item.percentage + '%' }"></div>{{ item.count }} </div> </div> </a> <item-bottom :itemdata="item" :page="page"></item-bottom></div>`,
});