消息通知：所有功能完成-补充读消息功能

lector
1 parent ab692199
Showing 3 changed files with 104 additions and 48 deletions
src/main/java/com/huaheng/pc/system/notice/controller/SysNoticeController.java
src/main/resources/templates/index.html
src/main/resources/templates/system/notice/mailbox.html
@@ -45,7 +45,8 @@ public class SysNoticeController extends BaseController {
         PageDomain pageDomain = TableSupport.buildPageRequest();
         Integer pageNum = pageDomain.getPageNum();
         Integer pageSize = pageDomain.getPageSize();
-        lambdaQueryWrapper.eq(StringUtils.isNotEmpty(status), SysNotice::getStatus, status);
+        lambdaQueryWrapper.eq(StringUtils.isNotEmpty(status), SysNotice::getStatus, status)
+                            .orderByAsc(SysNotice::getStatus);
         if (StringUtils.isNotNull(pageNum) && StringUtils.isNotNull(pageSize)) {
             Page<SysNotice> page = new Page(pageNum, pageSize);
             IPage<SysNotice> iPage = sysNoticeService.page(page, lambdaQueryWrapper);
@@ -296,11 +296,7 @@
             url:"system/notice/readAll",
             type:"get",
             success:function (response) {
-                if (response.code == 200){
                     location.reload()
-                }else {
-                    $.modal.alertError(response.msg)
-                }
             },
             error:function (response) {
                 $.modal.alertError("服务出错")
@@ -10,12 +10,12 @@
         <hr style="border-top:1px solid  #C2C2C2;">
         <div class="col-sm-8">
             <h3><strong>[[${user.loginName}]]</strong></h3>
-<!--            <p><i class="fa fa-user"></i> [[${user.userName}]] / [[${#strings.defaultString(roleGroup,'无角色')}]]-->
-<!--            <p><i class="fa fa-phone"></i> [[${user.phoneNumber}]]</p>-->
-<!--            <p><i class="fa fa-group"></i> [[${user.dept.deptName}]] / [[${#strings.defaultString(postGroup,'无岗位')}]]</p>-->
-<!--            <p><i class="fa fa-transgender"></i> 性别：[[${user.sex}]]</p>-->
-<!--            <p><i class="fa fa-envelope-o"></i> [[${user.email}]]</p>-->
-<!--            <p><i class="fa fa-calendar"></i> [[${#dates.format(user.createTime, 'yyyy-MM-dd HH:mm:ss')}]]</p>-->
+            <!--            <p><i class="fa fa-user"></i> [[${user.userName}]] / [[${#strings.defaultString(roleGroup,'无角色')}]]-->
+            <!--            <p><i class="fa fa-phone"></i> [[${user.phoneNumber}]]</p>-->
+            <!--            <p><i class="fa fa-group"></i> [[${user.dept.deptName}]] / [[${#strings.defaultString(postGroup,'无岗位')}]]</p>-->
+            <!--            <p><i class="fa fa-transgender"></i> 性别：[[${user.sex}]]</p>-->
+            <!--            <p><i class="fa fa-envelope-o"></i> [[${user.email}]]</p>-->
+            <!--            <p><i class="fa fa-calendar"></i> [[${#dates.format(user.createTime, 'yyyy-MM-dd HH:mm:ss')}]]</p>-->
         </div>
     </div>
 </div>
@@ -23,15 +23,25 @@
 <div class="col-sm-9" style="height: 100%">
     <div class="select-info">
         <ul id="myTab" class="nav nav-tabs">
-            <li class="active"><a href="#tabAll" data-toggle="tab">全部</a></li>
-            <li ><a href="#tabNotRead" data-toggle="tab">未读</a></li>
-            <li ><a href="#tabHavenRead" data-toggle="tab">已读</a></li>
+            <li id="tabAllTap" class="active"><a href="#tabAll" data-toggle="tab">全部</a></li>
+            <li id="tabNotReadTap"><a href="#tabNotRead" data-toggle="tab">未读</a></li>
+            <li id="tabHavenReadTap"><a href="#tabHavenRead" data-toggle="tab">已读</a></li>
         </ul>
         <div id="myTabContent" class="tab-content">
             <div class="tab-pane fade in active" id="tabAll">
+                <div class="btn-group hidden-xs" id="toolbar" role="group">
+                    <a class="btn btn-outline btn-success btn-rounded" onclick="readAll()">
+                        全部已读
+                    </a>
+                </div>
                 <table class="table-bordered" id="bootstrap-table" data-mobile-responsive="true"></table>
             </div>
             <div class="tab-pane fade" id="tabNotRead">
+                <div class="btn-group hidden-xs" id="toolbar1" role="group">
+                    <a class="btn btn-outline btn-success btn-rounded" onclick="readAll()">
+                        全部已读
+                    </a>
+                </div>
                 <table class="table-bordered" id="bootstrap-table1" data-mobile-responsive="true"></table>
             </div>
             <div class="tab-pane fade" id="tabHavenRead">
@@ -46,94 +56,108 @@
  
     var prefix = ctx + "system/notice"
  
-    $(function() {
+    $(function () {
         var options = {
             url: prefix + "/list",
-            method:"get",
+            method: "get",
             modalName: "消息表-全部",
-            sidePagination:"server",
+            sidePagination: "server",
             search: false,
             pageSize: 10,
+            onClickRow: function (row) {
+                if (row.status == 0) {
+                    readOne(row.id)
+                }
+            },
             columns: [
                 {
-                    field : 'content',
-                    title : '消息',
-                    width:80
-
+                    field: 'content',
+                    title: '消息',
+                    width: 80,
+                    formatter: function (value, row) {
+                        if (row.status == 0) {
+                            return value + "<span style='color:red'>*</span>"
+                        } else {
+                            return value
+                        }
+                    }
                 },
                 {
-                    field : 'created',
-                    title : '时间',
-                    width:20
+                    field: 'created',
+                    title: '时间',
+                    width: 20
                 }
-                ]
+            ]
         };
         $.table.init(options);
     });
  
     $("#bootstrap-table1").bootstrapTable({
         url: prefix + "/list",
-        method:"get",
+        method: "get",
+        toolbar: "#toolbar1",
         iconSize: "outline",
-        queryParams:{status:0},
+        queryParams: {status: 0},
         showRefresh: true, //刷新
         showToggle: true, //视图切换
         showColumns: true, //列选择
         modalName: "消息表-未读",
-        sidePagination:"server",
-        responseHandler:responseHandler,
+        sidePagination: "server",
+        onClickRow: function (row) {
+            readOne(row.id)
+        },
+        responseHandler: responseHandler,
         search: false,
         pageList: [10, 25, 50, 100],
         pageNumber: 1,
         pageSize: 10,
         columns: [
             {
-                field : 'content',
-                title : '消息',
-                width:80
+                field: 'content',
+                title: '消息',
+                width: 80
  
             },
             {
-                field : 'created',
-                title : '时间',
-                width:20
+                field: 'created',
+                title: '时间',
+                width: 20
             }
         ]
     })
     $("#bootstrap-table2").bootstrapTable({
         url: prefix + "/list",
-        method:"get",
+        method: "get",
         iconSize: "outline",
         showRefresh: true, //刷新
         showToggle: true, //视图切换
         showColumns: true, //列选择
         queryParams: function (params) {
-            console.log(params)
             return {
-                pageSize:       params.limit,
-                pageNum:        params.offset / params.limit + 1,
-                status:1
+                pageSize: params.limit,
+                pageNum: params.offset / params.limit + 1,
+                status: 1
             };
         },
         modalName: "消息表-已读",
         pagination: true,
-        sidePagination:"server",
-        responseHandler:responseHandler,
+        sidePagination: "server",
+        responseHandler: responseHandler,
         search: false,
         pageList: [10, 25, 50, 100],
         pageNumber: 1,
         pageSize: 10,
         columns: [
             {
-                field : 'content',
-                title : '消息',
-                width:80
+                field: 'content',
+                title: '消息',
+                width: 80
  
             },
             {
-                field : 'created',
-                title : '时间',
-                width:20
+                field: 'created',
+                title: '时间',
+                width: 20
             }
         ]
     })
@@ -147,6 +171,41 @@
         }
     }
  
+    function readOne(id) {
+        $.ajax({
+            url: prefix + "/readOne",
+            type: "get",
+            data: {id: id},
+            success: function (response) {
+                if (response.code == 200) {
+                    $("#bootstrap-table").bootstrapTable("refresh")
+                    $("#bootstrap-table1").bootstrapTable("refresh")
+                } else {
+                    $.modal.alertError(response.msg)
+                }
+            },
+            error: function (response) {
+                $.modal.alertError("服务出错")
+            }
+        })
+    }
+
+    function readAll() {
+        $.modal.confirm("是否已读所有消息？", function () {
+            $.ajax({
+                url: prefix + "/readAll",
+                type: "get",
+                success: function (response) {
+                    if ($("#tabNotReadTap".hasClass("active"))) {
+                        $("#bootstrap-table1").bootstrapTable("")
+                    }
+                },
+                error: function (response) {
+                    $.modal.alertError("服务出错")
+                }
+            })
+        })
+    }
  
 </script>
 </html>