gaoshp
2024-06-13 fd7586c8d91473d2850af1e48b12f1a289e6b8d1
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
<!--
 * @Author: lzhe lzhe@example.com
 * @Date: 2024-03-26 10:28:33
 * @LastEditors: lzhe lzhe@example.com
 * @LastEditTime: 2024-05-08 18:22:48
 * @FilePath: /smart-web/src/views/master/person/main/index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
    <div class="newsmail-main">
        <el-tabs v-model="activeName" class="demo-tabs" @tab-change="handleClick">
            <el-tab-pane label="全部公告" name="A"></el-tab-pane>
            <el-tab-pane label="发布公告" name="B"></el-tab-pane>
            <el-tab-pane label="任免公告" name="C"></el-tab-pane>
            <el-tab-pane label="转发公告" name="D"></el-tab-pane>
            <el-tab-pane label="指示公告" name="E"></el-tab-pane>
            <el-tab-pane label="事务公告" name="F"></el-tab-pane>
        </el-tabs>
        <el-table ref="multipleTableRef" :data="tableData" border style="width: 100%" class="multipleTableRef">
            <el-table-column prop="categoryName" label="title">
                <template #default="scope">
                    <span class="spanDot" :style="{'background-color': scope.row.status != 1?'red':''}"></span>
                    <span>{{scope.row.categoryName}}</span>
                </template>
            </el-table-column>
            <el-table-column prop="businessName" label="content"></el-table-column>
            <el-table-column prop="notifyTime" label="date"></el-table-column>
            <el-table-column fixed="right" label="操作">
                <template #default="scope">
                    <el-button text type="primary" size="small" @click="table_view(scope.row, scope.$index)">查看更多&gt&gt</el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>
    <el-dialog title="详情" v-model="visible" :width="500" destroy-on-close>
        <el-row>
            <el-col :span="24" style="margin-bottom:12px;">
                <span style="font-weight: bold;">{{detailForm.businessName}}</span>
            </el-col>
            <el-col :span="24" style="margin-bottom:12px;font-size: 12px;color: #666;">
                <span>{{detailForm.notifyTime}}</span>
            </el-col>
            <el-col :span="24">
                <span v-html="detailForm.message"></span>
            </el-col>
        </el-row>
        <template #footer>
            <el-button @click="visible=false" >关闭</el-button>
        </template>
    </el-dialog>
</template>
<script>
    export default {
        name: "newmail",
        data(){
            return {
                tableData: [],
                activeName: "A",
                visible: false,
                detailForm: {
                    businessName: "",
                    notifyTime: "",
                    message: ""
                }
            }
        },
        created(){
            
        },
        mounted(){
            this.getcategoryList();
        },
        components: {
            
        },
        methods: {
            table_view(row) {
                this.$HTTP.get(`/api/blade-notify/notify-system/get/${row.id}`).then(res=> {
                    if(res.code == 200) {
                        this.detailForm = res.data;
                        this.visible = true;
                    }
                })
                
            },
            handleClick(TabPaneName) {
                this.getcategoryList();
            },
            getcategoryList() {
                if(this.activeName == "A") {
                    var url = `/api/blade-notify/notify-system/page?size=10&notifyType=2&current=1`;
                }else if(this.activeName == "B") {
                    var url = `/api/blade-notify/notify-system/page?size=10&notifyType=2&category=1&current=1`;
                }else if(this.activeName == "C") {
                    var url = `/api/blade-notify/notify-system/page?size=10&notifyType=2&category=5&current=1`;
                }else if(this.activeName == "D") {
                    var url = `/api/blade-notify/notify-system/page?size=10&notifyType=2&category=3&current=1`;
                }else if(this.activeName == "E") {
                    var url = `/api/blade-notify/notify-system/page?size=10&notifyType=2&category=4&current=1`;
                }else if(this.activeName == "F") {
                    var url = `/api/blade-notify/notify-system/page?size=10&notifyType=2&category=6&current=1`;
                }
                this.$HTTP.get(url).then(res=> {
                    if(res.code == 200) {
                        this.tableData = res.data.records;
                    }
                })
            }
        }
    }
</script>
 
<style scoped>
.newsmail-main {
    min-height: 100%;
    margin: 8px;
    padding:20px;
    background: #fff;
}
.multipleTableRef /deep/ .el-table__header-wrapper{
    display: none;
}
.spanDot {
    width: 6px;
    height: 6px;
    border-radius: 3px;
    display: inline-block;
    margin-right:12px;
    font-size: 14px;
}
</style>