【message】我的消息列表开发

Signed-off-by: liuhanqing <447067298@qq.com>

src/main/java/cn/stylefeng/guns/modular/message/controller/MessageViewController.java

@@ -11,6 +11,7 @@ import cn.stylefeng.roses.kernel.resource.api.annotation.GetResource;
 import lombok.extern.slf4j.Slf4j;
 import org.springframework.stereotype.Controller;
 import org.springframework.ui.Model;
+import org.springframework.web.bind.annotation.RequestMapping;
 
 import javax.annotation.Resource;
 import java.util.List;
@@ -47,4 +48,28 @@ public class MessageViewController {
         model.addAttribute("msgUnReadList", messageList);
         return "/modular/index/message.html";
     }
+
+    /**
+     * 我的消息界面
+     *
+     * @author liuhanqing
+     * @date 2021/1/12 20:22
+     */
+    @GetResource(name = "操作日志管理列表", path = "/view/message_list")
+    public String indexView() {
+        return "/modular/system/message/message_list.html";
+    }
+
+    /**
+     * 我的消息界面
+     *
+     * @author liuhanqing
+     * @date 2021/1/12 20:22
+     */
+    @GetResource(name = "操作日志管理列表", path = "/view/message_view")
+    public String view(Model model) {
+        model.addAttribute("openType", "view");
+        return "/modular/system/message/message_view.html";
+    }
+
 }

src/main/webapp/assets/modular/system/common/form.all.js

@@ -0,0 +1,392 @@
+var form = {};
+form.type = {};
+form.formSelects = null;
+formPriv = {};
+
+var map = new Map();
+// var $ = layui.jquery
+
+formPriv.initType = function () {
+    map.put("1", "textinput");
+    map.put("2", "textinput");
+    map.put("3", "textinput");
+    map.put("4", "radio");
+    map.put("5", "checkbox");
+    map.put("6", "select");
+    map.put("7", "userSelect");
+    map.put("8", "attach");
+    map.put("9", "editor");
+    map.put("10", "autoRow");
+    map.put("11", "autoRow-Column");
+    map.put("12", "suggest");
+    map.put("13", "button");
+    map.put("14", "container");
+    map.put("-1", "textinput");
+}
+
+formPriv.doView = function (){
+    var jqueryForm = "form";
+    var formObj = layui.jquery(jqueryForm);
+    if (formObj.length == 0) {
+        Feng.error("没有找到对应的表单")
+        return;
+    }
+    formObj = layui.jquery(formObj[0]);
+    formObj.find("[viewForm]").each(function () {
+        var item = layui.jquery(this);
+        var itemType = layui.jquery(this).attr("viewForm");
+        formPriv.type[itemType].read(item);
+    });
+    layui.jquery("#closeBtn").html(" 关闭 ")
+    return;
+}
+
+
+//各个组件的状态判断
+formPriv.type = {};
+formPriv.type["hidden"] = {
+    hide: function (obj) {
+    },
+    read: function (obj) {
+    }
+}
+formPriv.type["textinput"] = {
+    hide: function (obj) {
+    	formPriv.removeStar(obj);
+        obj.remove();
+    },
+    read: function (obj) {
+    	formPriv.removeStar(obj);
+        if (obj.is('input') || obj.is('textarea')) {
+          /*  var label = obj.val();
+            label = label.replace(/\r\n/g, "<BR>");
+            label = label.replace(/\n/g, "<BR>");
+
+            var ip = layui.jquery("<input type='text' readonly/>").addClass("layui-input layui-disabled").attr("value", obj.attr("name")).val( label );
+            obj.parent().html(ip)*/
+            // obj.attr("readonly", "readonly");
+            var label = obj.val();
+            var style = obj.attr("style");
+            label = label.replace(/\r\n/g, "<BR>");
+            label = label.replace(/\n/g, "<BR>");
+            if(!label){
+                label = "&nbsp;"
+            }
+            if(obj.is('input')){
+                label = "<span class='form-read-input layui-empty-item layui-input' style='"+style+"'>"+label+"</span>";
+            }else{
+                label = "<span class='form-read-input layui-empty-item layui-textarea ' style='"+style+"'>"+label+"</span>"; //layui-disabled
+            }
+
+            obj.parent().html(label);
+        } else {
+            var label = obj.find('input').val();
+            var style = obj.find('input').attr("style");
+           /* var ip = layui.jquery("<input type='text' readonly/>").addClass("layui-input layui-disabled").attr("value", obj.attr("name")).val( label );
+            obj.html(ip);*/
+            // label.attr("readonly", "readonly");
+            if(!label){
+                label = "&nbsp;"
+            }
+            label = "<span class='form-read-input layui-empty-item layui-input' style='"+style+"'>"+label+"</span>";
+            obj.html(label);
+        }
+
+    }
+}
+
+formPriv.type["input-url"] = {
+    hide: function (obj) {
+        formPriv.removeStar(obj);
+        obj.remove();
+    },
+    read: function (obj) {
+        formPriv.removeStar(obj);
+        if (obj.is('input') || obj.is('textarea')) {
+            var label = obj.val();
+            if(!label){
+                label = "&nbsp;"
+            }else{
+                label = "<a href='"+label+"' target='_blank' class='form-read-a'>"+label+"</a>";
+            }
+            if(obj.is('input')){
+                label = "<span class='form-read-input layui-empty-item layui-input'>"+label+"</span>";
+            }else{
+                label = "<span class='form-read-input layui-empty-item layui-textarea '>"+label+"</span>"; //layui-disabled
+            }
+
+            obj.parent().html(label);
+        } else {
+            var label = obj.find('input').val();
+            if(!label){
+                label = "&nbsp;"
+            }else{
+                label = "<a href='"+label+"' target='_blank'>"+label+"</a>";
+            }
+            label = "<span class='form-read-input layui-empty-item layui-input'>"+label+"</span>";
+            obj.html(label);
+        }
+
+    }
+}
+
+formPriv.type["radio"] = {
+    hide: function (obj) {
+        obj.remove();
+    },
+    read: function (obj) {
+    	formPriv.removeStar(obj);
+        var checkedLabel = "";
+        var checkEle = obj.find("input:radio:checked");
+        if (checkEle.length == 1) {
+            checkedLabel = checkEle.attr("label");
+            if(checkedLabel==undefined){
+                checkedLabel = checkEle.attr("title");
+            }
+        }
+        checkedLabel = "<span class='form-read-input layui-empty-item layui-input'>"+checkedLabel+"</span>";
+        obj.html(checkedLabel);
+    }
+}
+
+formPriv.type["xm-select"] = {
+    hide: function (obj) {
+        obj.remove();
+    },
+    read: function (obj) {
+        var xm_select =  obj.attr("xm-ele-id");
+        obj.find("input.xm-input[placeholder='请选择']").removeAttr('placeholder')
+        form.formSelects.disabled(xm_select)
+    	/*formPriv.removeStar(obj);
+        var label = "";
+        var xm_select =  obj.find("dd.xm-select-this");
+        debugger
+        layui.jquery.each(xm_select, function (i, xm_span) {
+            debugger
+            var span = layui.jquery(xm_span).find("span").attr("name")
+            label += span + "，";
+        })
+        if (label.length > 0) {
+            label = label.substring(0, label.length - 1);
+        }
+        if(!label){
+            label = "&nbsp;"
+        }
+        label = "<span class='form-read-input layui-empty-item'>"+label+"</span>";
+        obj.html(label);*/
+    }
+}
+
+
+formPriv.type["tags-input"] = {
+    hide: function (obj) {
+        obj.remove();
+    },
+    read: function (obj) {
+        obj.find("#tags_tagsinput").find("span.tag").find("a").remove();
+        obj.find("#tags_tagsinput").find("#tags_addTag").remove();
+    }
+}
+
+formPriv.type["user-head"] = {
+    hide: function (obj) {
+        obj.remove();
+    },
+    read: function (obj) {
+        obj.addClass("user-info-head-no-hover").removeClass("user-info-head")
+        var img = obj.find("img").attr("src");
+        obj.unbind("click");
+        obj.bind("click",function(){
+            var imgData = {
+                "alt": "头像",
+                "src": img, //原图地址
+                "thumb": img //缩略图地址
+            }
+            var json = {
+                photos: {
+                    title: "头像",
+                    data: [imgData]
+                }
+                ,zIndex:99999999
+                ,anim: 5 //0-6的选择，指定弹出图片动画类型，默认随机（请注意，3.0之前的版本用shift参数）
+                ,shade: .1
+                ,closeBtn: true
+            }
+            top.indexModule.photos(JSON.stringify(json));
+        });
+
+    }
+}
+
+formPriv.type["checkbox"] = {
+    hide: function (obj) {
+        obj.remove();
+    },
+    read: function (obj) {
+    	formPriv.removeStar(obj);
+        var checkedLabel = "";
+        var checkboxs =  obj.find("input[type=checkbox]");
+        layui.jquery.each(checkboxs, function (i, checkbox) {
+            if(layui.jquery(checkbox).is(":checked")){
+                checkedLabel += layui.jquery(checkbox).attr("title") + "，";
+            }
+        })
+        if (checkedLabel.length > 0) {
+            checkedLabel = checkedLabel.substring(0, checkedLabel.length - 1);
+        }
+        checkedLabel = "<span class='form-read-input layui-empty-item layui-input'>"+checkedLabel+"</span>";
+        obj.html(checkedLabel);
+    }
+}
+
+formPriv.type["attach"] = {
+    hide: function (obj) {
+        obj.remove();
+    },
+    read: function (obj) {
+    	formPriv.removeStar(obj);
+        if (obj.is('button')) {
+            obj.remove();
+        } else {
+            var button = obj.find('button');
+            obj.find('a').first().remove();
+            layui.jquery(button).remove();
+        }
+    }
+}
+
+formPriv.type["select"] = {
+    hide: function (obj) {
+        obj.remove();
+    },
+    read: function (obj) {
+    	formPriv.removeStar(obj);
+        var selectLabel = "";
+        obj.find("select:not(.noneWorkflow) option:checked").each(function (index, item) {
+            if (layui.jquery(item).val() == null || layui.jquery(item).val().length == 0) {
+                selectLabel = "";
+            } else {
+                selectLabel = layui.jquery(item).html();
+            }
+        });
+        if(!selectLabel){
+            selectLabel = "&nbsp;"
+        }
+        selectLabel = "<span class='form-read-input layui-empty-item layui-input'>"+selectLabel+"</span>";
+        obj.html(selectLabel);
+
+    }
+}
+
+formPriv.type["button"] = {
+    hide: function (obj) {
+        obj.remove();
+    },
+    read: function (obj) {
+        //暂时没有添加只读操作
+        obj.hide();
+    }
+}
+
+//人员选择框
+formPriv.type["userSelect"] = {
+    hide: function (obj) {
+        obj.remove();
+    },
+    read: function (obj) {
+		 formPriv.removeStar(obj);
+
+        if (obj.is('input') || obj.is('textarea')) {
+            obj.unbind("click"); //移除click事件
+            var label = obj.val();
+            label = label.replace(/\r\n/g, "<BR>");
+            label = label.replace(/\n/g, "<BR>");
+            if(!label){
+                label = "&nbsp;"
+            }
+            label = "<span class='form-read-input layui-empty-item layui-input'>"+label+"</span>";
+            obj.parent().html(label);
+        } else {
+            obj.find('input').unbind("click"); //移除click事件
+            var label = obj.find('input').val();
+            if(!label){
+                label = "&nbsp;"
+            }
+            label = "<span class='form-read-input layui-empty-item layui-input'>"+label+"</span>";
+            obj.html(label);
+        }
+    }
+}
+formPriv.type["suggest"]={
+    hide:function(obj){
+        obj.hide();
+    },
+    read:function(obj){
+        formPriv.removeStar(obj);
+        if (obj.is('input') || obj.is('textarea')) {
+            obj.addClass("layui-disabled").attr("readonly", "readonly").removeAttr("name").removeAttr("lay-verify").removeAttr("placeholder");
+        } else {
+            var label = obj.find('input');
+            if(label==null||label.length==0){
+                label = obj.find('textarea');
+            }
+            label.addClass("layui-disabled").attr("readonly", "readonly").removeAttr("name").removeAttr("lay-verify").removeAttr("placeholder");
+        }
+    }
+}
+formPriv.type["container"]={
+    hide:function(obj){
+        obj.remove();
+        // obj.hide();
+    },
+    read:function(obj){
+    }
+}
+
+
+formPriv.removeStar = function(obj){
+	if(obj.length>0){
+		if(obj.is('div')&&obj.hasClass('workflow-form-item')){
+			var star = layui.jquery(obj).prev();
+			if(star){
+				if(layui.jquery(star).find('span').hasClass('required')){
+					layui.jquery(star).find('span').remove();
+				}
+			}
+
+		}else{
+			obj = obj.parent();
+			formPriv.removeStar(obj);
+		}
+	}
+}
+
+
+
+function Map() {
+    this.container = new Object();
+}
+
+Map.prototype.put = function (key, value) {
+    this.container[key] = value;
+}
+
+Map.prototype.get = function (key) {
+    return this.container[key];
+}
+
+Map.prototype.remove = function (key) {
+    delete this.container[key];
+}
+
+
+layui.use(['form', 'admin', 'ax', 'formSelects'], function () {
+    var $ = layui.jquery;
+    form.formSelects = layui.formSelects;
+    // var $ax = layui.ax;
+   /* var openType = $("#formOpenType_").val();
+    if(openType == "view"){
+        formPriv.doView()
+    }*/
+
+});

src/main/webapp/assets/modular/system/message/message_list.js

@@ -0,0 +1,142 @@
+layui.use(['table', 'form', 'func', 'HttpRequest', 'util'], function () {
+    var $ = layui.$;
+    var table = layui.table;
+    var form = layui.form;
+    var func = layui.func;
+    var HttpRequest = layui.HttpRequest;
+    var util = layui.util;
+
+    // 系统消息管理
+    var Message = {
+        tableId: "messageTable"
+    };
+
+    // 初始化表格的列
+    Message.initColumn = function () {
+        return [[
+            {type: 'checkbox'},
+            {field: 'messageId', hide: true, title: '主键id'},
+            {field: 'messageTitle', sort: true, title: '消息标题'},
+            // {field: 'messageType', sort: true, title: '消息类型'},
+            // {field: 'priorityLevelValue', sort: true, title: '优先级'},
+            {field: 'priorityLevel', sort: true, title: '优先级', templet: function (d) {
+                    if (d.priorityLevel === "high") {
+                        return "高";
+                    } else if (d.priorityLevel === "middle") {
+                        return "中";
+                    } else {
+                        return "低";
+                    }
+                }},
+            {field: 'readFlag', sort: true, title: '阅读状态', templet: function (d) {
+                    if (d.readFlag === 0) {
+                        return "未读";
+                    } else {
+                        return "已读";
+                    }
+                }},
+            {field: 'messageSendTime', sort: true, title: '收到时间'},
+            {align: 'center', toolbar: '#tableBar', title: '操作'}
+        ]];
+    };
+
+    // 点击查询按钮
+    Message.search = function () {
+        var queryData = {};
+        queryData['messageTitle'] = $("#messageTitle").val();
+        //queryData['messageCode'] = $("#messageCode").val();
+        table.reload(Message.tableId, {
+            where: queryData,
+            page: {curr: 1}
+        });
+    };
+    /**
+     * 点击查看
+     *
+     * @param data 点击按钮时候的行数据
+     */
+    Message.openViewDlg = function (data) {
+        func.open({
+            title: '查看消息',
+            // height: 900,
+            content: Feng.ctxPath + '/view/message_view?messageId=' + data.messageId,
+            tableId: Message.tableId
+        });
+    };
+
+
+    // 导出excel按钮
+    Message.exportExcel = function () {
+        var checkRows = table.checkStatus(Message.tableId);
+        if (checkRows.data.length === 0) {
+            Feng.error("请选择要导出的数据");
+        } else {
+            table.exportFile(tableResult.config.id, checkRows.data, 'xls');
+        }
+    };
+
+    // 点击删除
+    Message.delete = function (data) {
+        var operation = function () {
+            var httpRequest = new HttpRequest(Feng.ctxPath + "/sysMessage/delete", 'post', function (data) {
+                Feng.success("删除成功!");
+                table.reload(Message.tableId);
+            }, function (data) {
+                Feng.error("删除失败!" + data.message + "!");
+            });
+            httpRequest.set(data);
+            httpRequest.start(true);
+        };
+        Feng.confirm("是否删除?", operation);
+    };
+
+    // 标记为已读状态
+    Message.allReadFlag = function () {
+        var httpRequest = new HttpRequest(Feng.ctxPath + "/sysMessage/allMessageReadFlag", 'get', function (data) {
+            table.reload(Message.tableId);
+            Feng.success("标记已读成功!");
+        }, function (data) {
+            table.reload(Message.tableId);
+            Feng.error("标记已读失败!" + data.responseJSON.message);
+        });
+        httpRequest.start();
+    };
+
+    // 渲染表格
+    var tableResult = table.render({
+        elem: '#' + Message.tableId,
+        url: Feng.ctxPath + '/sysMessage/page',
+        page: true,
+        request: {pageName: 'pageNo', limitName: 'pageSize'}, //自定义分页参数
+        height: "full-158",
+        cellMinWidth: 100,
+        cols: Message.initColumn(),
+        parseData: Feng.parseData
+    });
+
+    // 搜索按钮点击事件
+    $('#btnSearch').click(function () {
+        Message.search();
+    });
+
+    // 全部已读点击事件
+    $('#allReadFlag').click(function () {
+        Message.allReadFlag();
+    });
+
+    // 导出excel
+    $('#btnExp').click(function () {
+        Message.exportExcel();
+    });
+
+    // 工具条点击事件
+    table.on('tool(' + Message.tableId + ')', function (obj) {
+        var data = obj.data;
+        var event = obj.event;
+        if (event === 'view') {
+            Message.openViewDlg(data);
+        } else if (event === 'delete') {
+            Message.delete(data);
+        }
+    });
+});

src/main/webapp/assets/modular/system/message/message_view.js

@@ -0,0 +1,50 @@
+/**
+ * 详情对话框
+ */
+var MessageInfoDlg = {};
+
+layui.use(['form', 'admin', 'HttpRequest', 'laydate'], function () {
+    var $ = layui.jquery;
+    var HttpRequest = layui.HttpRequest;
+    var form = layui.form;
+    var laydate = layui.laydate;
+    lay('input.date-input').each(function(){
+        laydate.render({
+            elem: this
+            ,trigger: 'click'
+        });
+    });
+
+    //获取详情信息，填充表单
+    var HttpRequest = new HttpRequest(Feng.ctxPath + "/sysMessage/detail?messageId=" + Feng.getUrlParam("messageId"), 'get');
+    var result = HttpRequest.start();
+    form.val('messageForm', result.data);
+
+  /*  //表单提交事件
+    form.on('submit(btnSubmit)', function (data) {
+        var HttpRequest = new HttpRequest(Feng.ctxPath + "/sysMessage/editItem", 'post', function (data) {
+            Feng.success("更新成功！");
+
+            //传给上个页面，刷新table用
+            admin.putTempData('formOk', true);
+
+            //关掉对话框
+            admin.closeThisDialog();
+
+        }, function (data) {
+            Feng.error("更新失败！" + data.responseJSON.message)
+        });
+        data.field.fileIds = MessageInfoDlg.layUploader.getUploadFileIds().join(",");  //获取上传附件ID 暂时注释掉
+        HttpRequest.set(data.field);
+        HttpRequest.start();
+
+        return false;
+    });*/
+
+
+    //查看模式
+    var openType = $("#formOpenType_").val();
+    if(openType == "view"){
+        formPriv.doView()
+    }
+});

src/main/webapp/pages/modular/system/common/viewHide.html

@@ -0,0 +1,25 @@
+<input type="hidden" id="formOpenType_" value="${openType!}">
+<style type="text/css">
+    .form-read-input{
+        padding: 9px 15px;
+        line-height: 1.3;
+        display: block;
+        border-width: 1px;
+        border-style: solid;
+        background-color: #fff;
+        border-radius: 2px;
+        border-color: #e6e6e6;
+    }
+    .form-read-a{
+        color: #01AAED;
+	    text-decoration: underline;
+    }
+    .form-read-a:hover{
+        color: #ff0000;
+    }
+</style>
+<script type="text/javascript" src="${ctxPath}/assets/modular/system/common/form.all.js?v=${constants.getReleaseVersion()}"></script>
+
+<script type="text/javascript">
+
+</script>

src/main/webapp/pages/modular/system/message/message_list.html

@@ -0,0 +1,36 @@
+@layout("/layout/_container.html",{js:["/assets/modular/system/message/message_list.js"]}){
+
+<div class="layui-body-header">
+    <span class="layui-body-header-title">我的消息</span>
+</div>
+
+<div class="layui-fluid">
+    <div class="layui-row layui-col-space15">
+        <div class="layui-col-sm12 layui-col-md12 layui-col-lg12">
+            <div class="layui-card">
+                <div class="layui-card-body">
+                    <div class="layui-form toolbar">
+                        <div class="layui-form-item">
+                            <div class="layui-inline">
+                                <input id="messageTitle" class="layui-input" type="text" placeholder="消息标题"/>
+                            </div>
+                            <div class="layui-inline">
+                                <button id="btnSearch" class="layui-btn icon-btn"><i class="layui-icon">&#xe615;</i>搜索</button>
+                                <button id="allReadFlag" class="layui-btn icon-btn"><i class="layui-icon">&#x1005;</i>全部已读</button>
+                                <button id="btnExp" class="layui-btn icon-btn"><i class="layui-icon">&#xe67d;</i>导出</button>
+                            </div>
+                        </div>
+                    </div>
+                    <table class="layui-table" id="messageTable" lay-filter="messageTable"></table>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<script type="text/html" id="tableBar">
+    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="view">查看</a>
+    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete">删除</a>
+</script>
+
+@}

src/main/webapp/pages/modular/system/message/message_view.html

@@ -0,0 +1,52 @@
+@layout("/layout/_form.html",{js:["/assets/modular/system/message/message_view.js"]}){
+
+<form class="layui-form" id="messageForm" lay-filter="messageForm">
+    <div class="layui-fluid" style="padding-bottom: 75px;">
+        <div class="layui-card">
+            <div class="layui-card-header">基本信息</div>
+            <div class="layui-card-body">
+                <div class="layui-form-item layui-row">
+                    <input name="messageId" type="hidden"/>
+                    <div class="layui-inline layui-col-md12">
+                        <label class="layui-form-label">消息标题</label>
+                        <div class="layui-input-block">
+                            <input id="messageTitle" name="messageTitle" placeholder="请输入消息标题" type="text" class="layui-input" lay-verify="" required viewForm="textinput"/>
+                        </div>
+                    </div>
+                    <div class="layui-inline layui-col-md12">
+                        <label class="layui-form-label">优先级</label>
+                        <div class="layui-input-block">
+                            <input id="priorityLevel" name="priorityLevel" placeholder="请输入优先级" type="text" class="layui-input" lay-verify="" required viewForm="textinput"/>
+                        </div>
+                    </div>
+                    <div class="layui-inline layui-col-md12">
+                        <label class="layui-form-label">收到时间</label>
+                        <div class="layui-input-block">
+                            <input id="messageSendTime" name="messageSendTime" placeholder="请输入收到时间" type="text" class="layui-input date-icon date-input" autocomplete="off" viewForm="textinput"/>
+                        </div>
+                    </div>
+                    <!--<div class="layui-inline layui-col-md12">
+                        <label class="layui-form-label">阅读状态</label>
+                        <div class="layui-input-block">
+                            <input id="readFlag" name="readFlag"  placeholder="请输入阅读状态" type="text" class="layui-input" lay-verify="" required viewForm="textinput"/>
+                        </div>
+                    </div>-->
+                    <div class="layui-inline layui-col-md12">
+                        <label class="layui-form-label">消息内容</label>
+                        <div class="layui-input-block">
+                            <textarea id="messageContent" name="messageContent" placeholder="请输入消息内容" type="text" class="layui-textarea" viewForm='textinput'></textarea>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="form-group-bottom text-center">
+        <button class="layui-btn" lay-filter="btnSubmit" lay-submit viewForm="button">&emsp;提交&emsp;</button>
+        <button type="reset" class="layui-btn layui-btn-primary" ew-event="closeDialog" id="closeBtn">&emsp;取消&emsp;</button>
+    </div>
+
+</form>
+
+@}
+@include("/modular/system/common/viewHide.html"){}