Merge branch 'master' of https://gitea.zianxin.com/zax/biz-pc-cloud
This commit is contained in:
commit
8a99b52922
3 files changed
+74
-2
No files matched your search
@@ -148,7 +148,15 @@ function hasValidDescription(desc: string | undefined | null) {
|
||||
|
||||
onMounted(async () => {
|
||||
const res = await getScreenNoticeList();
|
||||
noticeList.value = Array.isArray(res.data) ? res.data : [];
|
||||
// 过滤掉已过期的公告
|
||||
const now = new Date();
|
||||
noticeList.value = Array.isArray(res.data)
|
||||
? res.data.filter((notice: any) => {
|
||||
if (!notice.expireTime) return true; // 没有过期时间的公告始终显示
|
||||
const expireDate = new Date(notice.expireTime);
|
||||
return expireDate > now; // 只显示未过期的公告
|
||||
})
|
||||
: [];
|
||||
|
||||
// 获取失物招领数据
|
||||
const lostRes = await getScreenLostAndFoundList();
|
||||
|
||||
@@ -33,6 +33,21 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12" class="mb20">
|
||||
<el-form-item label="过期时间" prop="expireTime">
|
||||
<el-date-picker
|
||||
v-model="form.expireTime"
|
||||
type="datetime"
|
||||
placeholder="请选择过期时间"
|
||||
format="YYYY-MM-DD HH:mm:ss"
|
||||
value-format="YYYY-MM-DD HH:mm:ss"
|
||||
:disabled-date="disabledDate"
|
||||
:disabled-time="disabledTime"
|
||||
clearable
|
||||
/>
|
||||
<div class="form-tip">设置过期时间后,公告将在到期后自动隐藏</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24" class="mb20">
|
||||
<el-form-item label="公告详情" prop="description">
|
||||
@@ -76,10 +91,26 @@ const form = reactive({
|
||||
picUrl: '',
|
||||
isTop: '',
|
||||
viewCount: '',
|
||||
expireTime: '',
|
||||
});
|
||||
|
||||
// 定义校验规则
|
||||
const dataRules = ref({})
|
||||
const dataRules = ref({
|
||||
title: [{ required: true, message: '公告标题不能为空', trigger: 'blur' }],
|
||||
isTop: [{ required: true, message: '请选择是否置顶', trigger: 'change' }],
|
||||
status: [{ required: true, message: '请选择发布状态', trigger: 'change' }],
|
||||
expireTime: [{ required: true, message: '请选择过期时间', trigger: 'change' }],
|
||||
})
|
||||
|
||||
// 禁用过去的日期
|
||||
const disabledDate = (time: Date) => {
|
||||
return time.getTime() < Date.now() - 8.64e7; // 禁用今天之前的日期
|
||||
}
|
||||
|
||||
// 禁用时间(可选,这里不做限制)
|
||||
const disabledTime = () => {
|
||||
return {}
|
||||
}
|
||||
|
||||
// 打开弹窗
|
||||
const openDialog = (id: string) => {
|
||||
@@ -134,3 +165,12 @@ defineExpose({
|
||||
openDialog
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.form-tip {
|
||||
font-size: 12px;
|
||||
color: #909399;
|
||||
margin-top: 4px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
</style>
|
||||
@@ -48,6 +48,15 @@
|
||||
<dict-tag :options="is_top" :value="scope.row.isTop"></dict-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="expireTime" label="过期时间" show-overflow-tooltip>
|
||||
<template #default="scope">
|
||||
<span v-if="scope.row.expireTime" :class="{ 'expired': isExpired(scope.row.expireTime) }">
|
||||
{{ scope.row.expireTime }}
|
||||
<el-tag v-if="isExpired(scope.row.expireTime)" type="danger" size="small">已过期</el-tag>
|
||||
</span>
|
||||
<span v-else>-</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="viewCount" label="浏览次数" show-overflow-tooltip/>
|
||||
<el-table-column label="操作" width="150">
|
||||
<template #default="scope">
|
||||
@@ -121,6 +130,14 @@ const selectionChangHandle = (objs: { id: string }[]) => {
|
||||
multiple.value = !objs.length;
|
||||
};
|
||||
|
||||
// 判断公告是否已过期
|
||||
const isExpired = (expireTime: string) => {
|
||||
if (!expireTime) return false;
|
||||
const expireDate = new Date(expireTime);
|
||||
const now = new Date();
|
||||
return expireDate < now;
|
||||
};
|
||||
|
||||
// 删除操作
|
||||
const handleDelete = async (ids: string[]) => {
|
||||
try {
|
||||
@@ -138,3 +155,10 @@ const handleDelete = async (ids: string[]) => {
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.expired {
|
||||
color: #f56c6c;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
</style>
|
||||
Reference in new issue
Block a user