From 67d72f9d35415b7af608cbcf5956e4969cc03c83 Mon Sep 17 00:00:00 2001
From: zjf <1799650030@qq.com>
Date: Tue, 12 Aug 2025 20:37:54 +0800
Subject: [PATCH] =?UTF-8?q?=E7=BB=BC=E5=90=88=E6=9C=8D=E5=8A=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/integrated/dp/index.vue     | 10 ++++++-
 src/views/integrated/notice/form.vue  | 42 ++++++++++++++++++++++++++-
 src/views/integrated/notice/index.vue | 24 +++++++++++++++
 3 files changed, 74 insertions(+), 2 deletions(-)

diff --git a/src/views/integrated/dp/index.vue b/src/views/integrated/dp/index.vue
index f606463..5c1b6ba 100644
--- a/src/views/integrated/dp/index.vue
+++ b/src/views/integrated/dp/index.vue
@@ -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();
diff --git a/src/views/integrated/notice/form.vue b/src/views/integrated/notice/form.vue
index 1920446..01982e5 100644
--- a/src/views/integrated/notice/form.vue
+++ b/src/views/integrated/notice/form.vue
@@ -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>
diff --git a/src/views/integrated/notice/index.vue b/src/views/integrated/notice/index.vue
index ac7820c..f897dfa 100644
--- a/src/views/integrated/notice/index.vue
+++ b/src/views/integrated/notice/index.vue
@@ -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>