Redesign the page of NoticeView.vue

2026-04-05 06:51:23 +08:00 · 2023-05-17 03:47:51 +08:00
parent 739971d14b
commit 5afd8ff4e3
11 changed files with 341 additions and 163 deletions
--- a/Pinnacle/src/main/java/com/cfive/pinnacle/controller/NoticeTypeController.java
+++ b/Pinnacle/src/main/java/com/cfive/pinnacle/controller/NoticeTypeController.java
@@ -4,6 +4,8 @@ import com.cfive.pinnacle.entity.NoticeType;
 import com.cfive.pinnacle.entity.common.ResponseCode;
 import com.cfive.pinnacle.entity.common.ResponseResult;
 import com.cfive.pinnacle.service.INoticeTypeService;
+import org.slf4j.Logger;
+import org.slf4j.LoggerFactory;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.util.StringUtils;
 import org.springframework.web.bind.annotation.*;
@@ -22,6 +24,8 @@ import java.util.List;
@RequestMapping("/noticeType")
@CrossOrigin
 public class NoticeTypeController {
+    private final Logger LOGGER = LoggerFactory.getLogger(getClass());
+
    @Autowired
    INoticeTypeService noticeTypeService;

@@ -41,11 +45,10 @@ public class NoticeTypeController {
        return ResponseResult.build(code, msg, selectTypeList);
    }

-    @PutMapping
+    @GetMapping("/update")
    public ResponseResult updateTypeEnableById(String typeId,Boolean enable){
-        System.out.println(typeId+'\t'+enable);
        Long tid=null;
-        Integer isEnable=null;
+        Integer isEnable = null;
        if (StringUtils.hasText(typeId)&&null!=enable){
            tid = Long.parseLong(typeId);
            isEnable = (enable == true ? 1 : 0);
--- a/Pinnacle/src/main/java/com/cfive/pinnacle/service/impl/NoticeServiceImpl.java
+++ b/Pinnacle/src/main/java/com/cfive/pinnacle/service/impl/NoticeServiceImpl.java
@@ -99,11 +99,14 @@ public class NoticeServiceImpl extends ServiceImpl<NoticeMapper, Notice> impleme
    @Override
    public Boolean updateNotice(Notice notice) {
        noticeMapper.update(null, new UpdateWrapper<Notice>().eq("id", notice.getId()).set("old", 1)); //修改原始数据
+        LambdaQueryWrapper<NoticeReceive> lqw = new LambdaQueryWrapper<>();
+        lqw.eq(NoticeReceive::getNoticeId, notice.getId());
+        noticeReceiveMapper.delete(lqw);
        notice.setOriginId(notice.getId());
        notice.setId(null); //清除id，使新插入的数据id重新生成
        notice.setModifyTime(null);
        notice.setOld(0);
-        return noticeMapper.insert(notice) > 0;
+        return this.addNotice(notice);
    }

    @Override
--- a/Pinnacle/src/main/resources/mapper/NoticeReceiveMapper.xml
+++ b/Pinnacle/src/main/resources/mapper/NoticeReceiveMapper.xml
@@ -31,7 +31,9 @@
                and notice_receive.already_read=#{readStatus}
            </if>
            and notice_receive.user_id=#{userId}
+            and notice_receive.deleted=0
        </where>
+        order by n.send_time desc
    </select>
    <resultMap id="selectAllMap" type="notice" autoMapping="true">
        <id property="id" column="nid"/>
--- a/ui/src/components/notice/CommitForm.vue
+++ b/ui/src/components/notice/CommitForm.vue
@@ -112,7 +112,7 @@ export default {
            rules: {
                title: [
                    { required: true, message: '请输入公告标题', trigger: 'blur' },
-                    { min: 2, max: 50, message: '长度在 2 到 50 个字符', trigger: 'blur' }
+                    { min: 2, max: 20, message: '长度在 2 到 20 个字符', trigger: 'blur' }
                ],
                typeId: [
                    { required: true, message: '请选择公告类型', trigger: 'change' }
@@ -137,7 +137,7 @@ export default {
        submitForm() {
            this.addData.top=this.addData.top?1:0;
            const receiveId=[]
-            if (this.addData.receivers!==[]){
+            if (this.addData.receivers.length!=null){
                for (let i = 0; i < this.addData.receivers.length; i++) {
                    receiveId.push(this.addData.receivers[i][1])
                }
--- a/ui/src/components/notice/NoticeManageTable.vue
+++ b/ui/src/components/notice/NoticeManageTable.vue
@@ -1,10 +1,5 @@
 <template>
-    <el-button
-        size="large"
-        @click="clearFilter"
-        style="background-color: rgba(71, 138, 173, 0.85); color: white"
-        >清除筛选条件
-    </el-button>
+    <el-button size="large" @click="clearFilter" type="primary">清除筛选条件 </el-button>
    <el-table
        v-loading="loading"
        element-loading-text="加载中..."
@@ -13,22 +8,24 @@
        border
        highlight-current-row
        @selection-change="handleSelectionChange"
+        style="font-size: 18px"
        :header-cell-style="{
            background: 'darksalmon',
            'text-align': 'center',
            color: '#fff',
            'font-size': '20px'
        }"
-        ><el-table-column type="selection" width="55" />
-        <el-table-column type="index" label="序号" width="70" />
+        ><el-table-column type="selection" width="55" align="center" />
+        <el-table-column type="index" label="序号" width="70" align="center" />
        <el-table-column
            prop="title"
            label="公告标题"
-            width="180"
+            width="200"
            :formatter="formatter"
            show-overflow-tooltip
+            align="center"
        />
-        <el-table-column prop="noticeType.name" label="公告类别" width="150">
+        <el-table-column prop="noticeType.name" label="公告类别" width="160" align="center">
            <template #default="scope">
                <el-tag
                    size="default"
@@ -39,27 +36,30 @@
                </el-tag>
            </template>
        </el-table-column>
-        <el-table-column prop="priority" label="优先级" width="100" />
+        <el-table-column prop="priority" label="优先级" width="100" align="center" />
        <el-table-column
            prop="createTime"
            label="创建时间"
            sortable
-            width="180"
+            width="220"
            :formatter="formatDate"
+            align="center"
        />
        <el-table-column
            prop="sendTime"
            label="生效时间"
            sortable
-            width="180"
+            width="220"
            :formatter="formatDate"
+            align="center"
        />
        <el-table-column
            prop="endTime"
            label="失效时间"
            sortable
-            width="180"
+            width="220"
            :formatter="formatDate"
+            align="center"
        />
        <el-table-column
            prop="sender.username"
@@ -69,6 +69,7 @@
            :filters="filterSenderName"
            :filter-method="filterTag"
            filter-placement="bottom-end"
+            align="center"
        >
            <template #default="scope">
                <el-tag
@@ -78,7 +79,7 @@
                </el-tag>
            </template>
        </el-table-column>
-        <el-table-column label="操作" width="200">
+        <el-table-column label="操作" min-width="200px" align="center">
            <template #default="scope">
                <el-button size="small" color="#626aef" @click="handleShow(scope.$index, scope.row)"
                    >查看
@@ -235,6 +236,9 @@ export default {
 </script>

 <style scoped>
+.el-table {
+    margin-top: 10px;
+}
 .pagination {
    margin: 30px 400px;
 }
--- a/ui/src/components/notice/NoticeShowDialog.vue
+++ b/ui/src/components/notice/NoticeShowDialog.vue
@@ -1,19 +1,21 @@
 <template>
    <el-descriptions direction="vertical" :column="3" border>
        <template #title>{{ this.noticeShowData.title }}</template>
-        <el-descriptions-item label="发布人"
+        <el-descriptions-item label="发布人" width="120"
            ><el-tag size="large" type="success">{{
                this.noticeShowData.sender.username
            }}</el-tag></el-descriptions-item
        >
-        <el-descriptions-item label="生效时间">{{
+        <el-descriptions-item label="生效时间" width="180">{{
            formatDate(this.noticeShowData.sendTime)
        }}</el-descriptions-item>
-        <el-descriptions-item label="优先级" :span="12">{{
-            this.noticeShowData.priority
-        }}</el-descriptions-item>
-        <el-descriptions-item label="公告类型">
-            <el-tag size="large">{{ this.noticeShowData.noticeType.name }}</el-tag>
+        <el-descriptions-item label="公告类型"
+            ><el-tag size="large">{{
+                this.noticeShowData.noticeType.name
+            }}</el-tag></el-descriptions-item
+        >
+        <el-descriptions-item label="优先级"
+            >{{ this.noticeShowData.priority }}
        </el-descriptions-item>
        <el-descriptions-item label="失效时间">{{
            formatDate(this.noticeShowData.endTime)
--- a/ui/src/components/notice/NoticeTypeTable.vue
+++ b/ui/src/components/notice/NoticeTypeTable.vue
@@ -22,7 +22,7 @@
            <template #default="scope">
                <el-switch
                    v-model="scope.row.enable"
-                    style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
+                    style="--el-switch-on-color: #13ce66; --el-switch-off-color: #afb2b8"
                    active-text="启用"
                    inactive-text="禁用"
                    @change="switchChang(scope.row.id, scope.row.enable)"
@@ -100,9 +100,10 @@ export default {
            this.multipleSelection = val
        },
        switchChang(id, value) {
-            if (!noticeStore.updateNoticeTypeEnable(id, value)) {
+            noticeStore.updateNoticeTypeEnable(id, value)
+            setTimeout(() => {
                noticeStore.selectNoticeType()
-            }
+            }, 800)
        },
        handleEdit(index, row) {
            noticeStore.$patch((state) => {
--- a/ui/src/components/notice/NoticeViewTable.vue
+++ b/ui/src/components/notice/NoticeViewTable.vue
@@ -1,103 +1,189 @@
 <template>
-    <el-table
-        v-loading="this.loading"
-        element-loading-text="加载中..."
-        ref="tableRef"
-        :data="this.selectData"
-        style="width: 100%"
-        border
-        highlight-current-row
-        :header-cell-style="{
-            background: 'darksalmon',
-            'text-align': 'center',
-            color: '#fff',
-            'font-size': '20px'
-        }"
-    >
-        <el-table-column
-            prop="title"
-            label="公告标题"
-            width="180"
-            :formatter="formatter"
-            show-overflow-tooltip
-        />
-        <el-table-column prop="noticeType.name" label="公告类别" width="150">
-            <template #default="scope">
-                <el-tag
-                    size="default"
-                    :type="scope.row.noticeType.name === '通知公告' ? 'warning' : 'success'"
-                    disable-transitions
-                >
-                    {{ scope.row.noticeType.name }}
-                </el-tag>
+    <div class="myTimeline">
+        <el-timeline>
+            <el-timeline-item
+                v-for="notice in selectData"
+                :key="notice.id"
+                :timestamp="formatDate(notice.sendTime)"
+                placement="top"
+            >
+                <template #dot v-if="notice.isRead === 0">
+                    <el-badge is-dot class="item" />
+                </template>
+                <el-card @click="showNoticeDetail(notice)">
+                    <h4></h4>
+                    <p>Tom committed 2018/4/12 20:46</p>
+                </el-card>
+            </el-timeline-item>
+        </el-timeline>
+        <!--        查看会话框-->
+        <el-dialog v-model="dialogShowVisible" center>
+            <template #header>
+                <h2 style="color: red">公告详情</h2>
            </template>
-        </el-table-column>
-        <el-table-column prop="priority" label="优先级" width="100" />
-        <el-table-column prop="isRead" label="公告状态" width="180">
-            <template #default="scope">
-                <el-tag
-                    size="large"
-                    :type="scope.row.isRead === 0 ? 'danger' : 'success'"
-                    disable-transitions
-                >
-                    {{ scope.row.isRead === 0 ? '未读' : '已读' }}
-                </el-tag>
-            </template>
-        </el-table-column>
-        <el-table-column
-            prop="sendTime"
-            label="生效时间"
-            sortable
-            width="180"
-            :formatter="formatDate"
-        />
-        <el-table-column
-            prop="endTime"
-            label="失效时间"
-            sortable
-            width="180"
-            :formatter="formatDate"
-        />
-        <el-table-column
-            prop="sender.username"
-            label="发布人"
-            width="100"
-            column-key="senderName"
-            :filters="filterSenderName"
-            :filter-method="filterTag"
-            filter-placement="bottom-end"
-        >
-            <template #default="scope">
-                <el-tag
-                    :type="scope.row.sender.username === 'cyb' ? '' : 'success'"
-                    disable-transitions
-                    >{{ scope.row.sender.username }}
-                </el-tag>
-            </template>
-        </el-table-column>
-        <el-table-column label="操作" width="200">
-            <template #default="scope">
-                <el-button size="small" color="#626aef" @click="handleShow(scope.$index, scope.row)"
-                    >查看
-                </el-button>
-                <el-button size="small" type="danger" @click="modifyStatus(scope.row)"
-                    >标记为{{ scope.row.isRead === 0 ? '已读' : '未读' }}
-                </el-button>
-            </template>
-        </el-table-column>
-    </el-table>
-    <!--        查看会话框-->
-    <el-dialog v-model="dialogShowVisible" center>
-        <template #header>
-            <h2 style="color: red">查看公告</h2>
-        </template>
-        <notice-show-dialog />
-    </el-dialog>
+            <notice-show-dialog />
+        </el-dialog>
+        <!--        <el-collapse-->
+        <!--            @change="handleChange"-->
+        <!--            v-loading="this.loading"-->
+        <!--            element-loading-text="加载中..."-->
+        <!--        >-->
+        <!--            <el-collapse-item v-for="notice in selectData" :key="notice.id" :name="notice.id">-->
+        <!--                <template #title>-->
+        <!--                    <el-tag-->
+        <!--                        size="small"-->
+        <!--                        :type="-->
+        <!--                            notice.noticeType.name === '通知公告'-->
+        <!--                                ? 'warning'-->
+        <!--                                : notice.noticeType.name === '紧急公告'-->
+        <!--                                ? 'danger'-->
+        <!--                                : 'success'-->
+        <!--                        "-->
+        <!--                        disable-transitions-->
+        <!--                        style="margin-right: 30px"-->
+        <!--                    >-->
+        <!--                        {{ notice.noticeType.name }}-->
+        <!--                    </el-tag>-->
+        <!--                    <h3>{{ notice.title }}</h3>-->
+        <!--                </template>-->
+        <!--                <div>-->
+        <!--                    <el-card class="box-card" shadow="always">-->
+        <!--                        <template #header>-->
+        <!--                            <div class="card-header">-->
+        <!--                                <h4>优先级：</h4>-->
+        <!--                                <el-tag effect="light" size="large">{{ notice.priority }}</el-tag>-->
+        <!--                            </div>-->
+        <!--                            <div class="card-header">-->
+        <!--                                <h4>发布者：</h4>-->
+        <!--                                <el-tag effect="light" size="large">{{-->
+        <!--                                    notice.sender.username-->
+        <!--                                }}</el-tag>-->
+        <!--                            </div>-->
+        <!--                        </template>-->
+        <!--                        <h2 class="contentTitle">公告内容：</h2>-->
+        <!--                        <div class="content">-->
+        <!--                            {{ notice.content }}-->
+        <!--                        </div>-->
+        <!--                        <div class="date">-->
+        <!--                            <div class="sendTime">-->
+        <!--                                <h4>生效日期：</h4>-->
+        <!--                                <el-tag effect="plain" size="large" type="success">{{-->
+        <!--                                    formatDate(notice.sendTime)-->
+        <!--                                }}</el-tag>-->
+        <!--                            </div>-->
+        <!--                            <div class="endTime">-->
+        <!--                                <h4>失效日期：</h4>-->
+        <!--                                <el-tag effect="plain" size="large" type="info">{{-->
+        <!--                                    formatDate(notice.endTime)-->
+        <!--                                }}</el-tag>-->
+        <!--                            </div>-->
+        <!--                        </div>-->
+        <!--                    </el-card>-->
+        <!--                </div>-->
+        <!--            </el-collapse-item>-->
+        <!--        </el-collapse>-->
+    </div>
+    <!--    <el-table-->
+    <!--        v-loading="this.loading"-->
+    <!--        element-loading-text="加载中..."-->
+    <!--        ref="tableRef"-->
+    <!--        :data="this.selectData"-->
+    <!--        style="font-size: 18px"-->
+    <!--        border-->
+    <!--        highlight-current-row-->
+    <!--        :header-cell-style="{-->
+    <!--            background: 'darksalmon',-->
+    <!--            'text-align': 'center',-->
+    <!--            color: '#fff',-->
+    <!--            'font-size': '20px'-->
+    <!--        }"-->
+    <!--    >-->
+    <!--        <el-table-column-->
+    <!--            prop="title"-->
+    <!--            label="公告标题"-->
+    <!--            width="230"-->
+    <!--            :formatter="formatter"-->
+    <!--            show-overflow-tooltip-->
+    <!--            align="center"-->
+    <!--        />-->
+    <!--        <el-table-column prop="noticeType.name" label="公告类别" width="180" align="center">-->
+    <!--            <template #default="scope">-->
+    <!--                <el-tag-->
+    <!--                    size="default"-->
+    <!--                    :type="scope.row.noticeType.name === '通知公告' ? 'warning' : 'success'"-->
+    <!--                    disable-transitions-->
+    <!--                >-->
+    <!--                    {{ scope.row.noticeType.name }}-->
+    <!--                </el-tag>-->
+    <!--            </template>-->
+    <!--        </el-table-column>-->
+    <!--        <el-table-column prop="priority" label="优先级" width="100" align="center" />-->
+    <!--        <el-table-column prop="isRead" label="公告状态" width="180" align="center">-->
+    <!--            <template #default="scope">-->
+    <!--                <el-tag-->
+    <!--                    size="large"-->
+    <!--                    :type="scope.row.isRead === 0 ? 'danger' : 'success'"-->
+    <!--                    disable-transitions-->
+    <!--                >-->
+    <!--                    {{ scope.row.isRead === 0 ? '未读' : '已读' }}-->
+    <!--                </el-tag>-->
+    <!--            </template>-->
+    <!--        </el-table-column>-->
+    <!--        <el-table-column-->
+    <!--            prop="sendTime"-->
+    <!--            label="生效时间"-->
+    <!--            sortable-->
+    <!--            width="250"-->
+    <!--            :formatter="formatDate"-->
+    <!--            align="center"-->
+    <!--        />-->
+    <!--        <el-table-column-->
+    <!--            prop="endTime"-->
+    <!--            label="失效时间"-->
+    <!--            sortable-->
+    <!--            width="250"-->
+    <!--            :formatter="formatDate"-->
+    <!--            align="center"-->
+    <!--        />-->
+    <!--        <el-table-column-->
+    <!--            prop="sender.username"-->
+    <!--            label="发布人"-->
+    <!--            width="130"-->
+    <!--            column-key="senderName"-->
+    <!--            :filters="filterSenderName"-->
+    <!--            :filter-method="filterTag"-->
+    <!--            filter-placement="bottom-end"-->
+    <!--            align="center"-->
+    <!--        >-->
+    <!--            <template #default="scope">-->
+    <!--                <el-tag-->
+    <!--                    :type="scope.row.sender.username === 'cyb' ? '' : 'success'"-->
+    <!--                    disable-transitions-->
+    <!--                    >{{ scope.row.sender.username }}-->
+    <!--                </el-tag>-->
+    <!--            </template>-->
+    <!--        </el-table-column>-->
+    <!--        <el-table-column label="操作" align="center">-->
+    <!--            <template #default="scope">-->
+    <!--                <el-button size="small" color="#626aef" @click="handleShow(scope.$index, scope.row)"-->
+    <!--                    >查看-->
+    <!--                </el-button>-->
+    <!--                <el-button size="small" type="danger" @click="modifyStatus(scope.row)"-->
+    <!--                    >标记为{{ scope.row.isRead === 0 ? '已读' : '未读' }}-->
+    <!--                </el-button>-->
+    <!--            </template>-->
+    <!--        </el-table-column>-->
+    <!--    </el-table>-->
+    <!--    &lt;!&ndash;        查看会话框&ndash;&gt;-->
+    <!--    <el-dialog v-model="dialogShowVisible" center>-->
+    <!--        <template #header>-->
+    <!--            <h2 style="color: red">查看公告</h2>-->
+    <!--        </template>-->
+    <!--        <notice-show-dialog />-->
+    <!--    </el-dialog>-->
 </template>

 <script lang="ts">
-// import {  storeToRefs } from 'pinia'
-// const { selectData, getLoading } = storeToRefs(noticeViewStore)
 import { mapState } from 'pinia'
 import { useNoticeStore } from '@/store/notice'
 const noticeStore = useNoticeStore()
@@ -110,24 +196,22 @@ export default {
    },
    props: [],
    methods: {
-        // ...mapActions(useNoticeStore, ['selectAllNoticeByUserId']),
-        clearFilter() {
-            this.$refs.tableRef.clearFilter(['senderName'])
-            this.$emit('clearFilter')
+        showNoticeDetail(data) {
+            noticeStore.$patch((state) => {
+                state.dialogShowVisible = true
+                state.noticeShowData = data
+            })
        },
-        formatter(row, column) {
-            return row.title
+        formatDate(date) {
+            if (date == null) return null
+            return new Date(date).toLocaleString()
        },
        filterTag(value, row) {
            return row.sender.username === value
        },
-        formatDate(row, column) {
-            // 获取单元格数据
-            const data = row[column.property]
-            if (data == null) return '暂无数据'
-            return new Date(data).toLocaleString()
+        modifyStatus(row) {
+            console.log(row)
        },
-        modifyStatus(row) {},
        handleShow(index, row) {
            noticeStore.$patch((state) => {
                state.dialogShowVisible = true
@@ -136,23 +220,7 @@ export default {
        }
    },
    mounted() {},
-    updated() {
-        this.$refs.tableRef.clearFilter(['senderName'])
-        this.filterSenderName = []
-        const nameArray = []
-        for (let i = 0; i < this.selectData.length; i++) {
-            nameArray.push(this.selectData[i].sender.username)
-        }
-        const newArr = nameArray.filter((item, i, arr) => {
-            return arr.indexOf(item) === i
-        })
-        for (let j = 0; j < newArr.length; j++) {
-            const senderName = { text: '', value: '' }
-            senderName.text = newArr[j]
-            senderName.value = newArr[j]
-            this.filterSenderName.push(senderName)
-        }
-    },
+    updated() {},
    computed: {
        ...mapState(useNoticeStore, [
            'selectData',
@@ -165,7 +233,67 @@ export default {
 </script>

 <style scoped>
-.el-table {
-    margin-top: 10px;
+.myTimeline {
+    margin-top: 20px;
+}
+.el-timeline {
+    --el-timeline-node-size-normal: 16px;
+    --el-timeline-node-size-large: 16px;
+}
+/deep/ .el-badge__content.is-dot {
+    height: 16px;
+    width: 16px;
+}
+/deep/ .el-timeline-item__timestamp.is-top {
+    font-size: 16px;
+    font-weight: 600;
+}
+.el-collapse {
+    --el-collapse-header-height: 68px;
+}
+/deep/ .el-collapse-item__header {
+    padding-left: 25px;
+    font-weight: 400;
+    border-bottom: 2px solid #dcdfe6;
+}
+.box-card {
+    font-size: 16px;
+}
+/deep/ .el-card__header {
+    border-bottom: 1px dashed #6bd4ff;
+}
+.card-header {
+    display: inline-block;
+    margin-right: 40px;
+}
+.el-tag {
+    font-size: 15px;
+}
+.contentTitle {
+    font-size: 20px;
+    font-weight: bold;
+}
+.content {
+    margin-top: 20px;
+    margin-left: 20px;
+    height: fit-content;
+}
+.date {
+    margin-top: 50px;
+}
+.sendTime {
+    display: inline-block;
+    margin-right: 25px;
+}
+.endTime {
+    display: inline-block;
+}
+h3 {
+    font-weight: 550;
+    font-size: 18px;
+}
+h4 {
+    font-weight: 500;
+    display: inline-block;
 }
 </style>
--- a/ui/src/pages/notice/NoticeManage.vue
+++ b/ui/src/pages/notice/NoticeManage.vue
@@ -6,8 +6,11 @@
        <el-main>
            <el-button
                size="large"
-                style="background-color: rgba(71, 138, 173, 0.85); color: white"
+                type="primary"
                @click="openAddNoticeDialog"
+                style="margin-right: 15px"
+                ><el-icon :size="SIZE_ICON_MD()" style="color: white; margin-right: 3px">
+                    <icon-pinnacle-add /> </el-icon
                >发布公告</el-button
            >
            <!-- 添加公告对话框-->
@@ -32,6 +35,7 @@ import 'element-plus/theme-chalk/el-message-box.css'
 import request from '@/services'
 import { useNoticeStore } from '@/store/notice'
 import { mapState } from 'pinia'
+import { SIZE_ICON_MD } from '@/constants/Common.constants'
 const noticeStore = useNoticeStore()

 export default {
@@ -40,6 +44,9 @@ export default {
        return {}
    },
    methods: {
+        SIZE_ICON_MD() {
+            return SIZE_ICON_MD
+        },
        selectByCond(currentPage, pageSize, search) {
            request
                .get('/notice/page', {
--- a/ui/src/pages/notice/NoticeView.vue
+++ b/ui/src/pages/notice/NoticeView.vue
@@ -21,6 +21,8 @@
 </template>

 <script lang="ts">
+import { useNoticeStore } from '@/store/notice'
+const noticeStore = useNoticeStore()
 export default {
    name: 'NoticeView',
    data() {
@@ -31,7 +33,9 @@ export default {
            console.log(key, keyPath)
        }
    },
-    mounted() {}
+    mounted() {
+        noticeStore.selectEnableNoticeType()
+    }
 }
 </script>

--- a/ui/src/store/notice.ts
+++ b/ui/src/store/notice.ts
@@ -16,7 +16,33 @@ export const useNoticeStore = defineStore('notice', {
    state: () => {
        return {
            total: 0,
-            selectData: [],
+            selectData: [
+                {
+                    content: '',
+                    createTime: '',
+                    endTime: '',
+                    id: '',
+                    modifyTime: '',
+                    priority: 0,
+                    receivers: [],
+                    sendTime: '',
+                    title: '',
+                    top: 0,
+                    isRead: 0,
+                    noticeType: {
+                        id: '',
+                        name: '',
+                        enable: 0
+                    },
+                    sender: {
+                        id: '',
+                        username: '',
+                        enable: 0
+                    },
+                    senderId: '',
+                    typeId: ''
+                }
+            ],
            loading: true,
            dialogShowVisible: false,
            dialogAddVisible: false,
@@ -152,7 +178,7 @@ export const useNoticeStore = defineStore('notice', {
        },
        async updateNoticeTypeEnable(typeId: string, enable: boolean) {
            await request
-                .put('/noticeType', {
+                .get('/noticeType/update', {
                    typeId,
                    enable
                })
@@ -162,13 +188,11 @@ export const useNoticeStore = defineStore('notice', {
                            message: '修改成功.',
                            type: 'success'
                        })
-                        return true
                    } else if (response.data.code === 20033) {
                        ElMessage({
                            message: response.data.msg,
                            type: 'error'
                        })
-                        return false
                    }
                })
        }