Browse Source

一元捐后台管理项目—消息中心—消息列表页面。

hangb 8 years ago
parent
commit
cc300b24d7

+ 1 - 0
donate-console/src/main/java/com/uas/console/donate/WebAppConfiguration.java

@@ -67,6 +67,7 @@ public class WebAppConfiguration extends WebMvcConfigurerAdapter {
 		registry.addViewController("/bannerSetting").setViewName("bannerSetting");
 		registry.addViewController("/contentBoxSetting").setViewName("contentBoxSetting");
 		registry.addViewController("/editMessage").setViewName("editMessage");
+		registry.addViewController("/messageList").setViewName("messageList");
 		super.addViewControllers(registry);
 	}
 

+ 1 - 0
donate-console/src/main/webapp/WEB-INF/views/editMessage.html

@@ -122,6 +122,7 @@
             width: 140px;
             height: 30px;
             line-height: 30px;
+            list-style: none;
         }
         .content-setting .edit .chooseUser .choose-body .left ul li:hover,.content-setting .edit .chooseUser .choose-body .left ul li.active{
             background: #e5e5e5;

+ 670 - 0
donate-console/src/main/webapp/WEB-INF/views/messageList.html

@@ -0,0 +1,670 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <title>一元捐后台管理</title>
+    <meta name="keywords" content="">
+    <meta name="description" content="">
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="renderer" content="webkit">
+    <!--css begin-->
+    <link href="static/images/icon/u.png" rel="icon" type="image/x-icon" />
+    <link rel="stylesheet" href="static/css/base.css">
+    <link rel="stylesheet" href="static/css/common.css">
+    <link rel="stylesheet" href="static/css/AdminLTE.css">
+    <link rel="stylesheet" href="static/css/skins/_all-skins.css">
+    <link rel="stylesheet" href="static/lib/bootstrap/css/bootstrap.min.css">
+    <link rel="stylesheet" href="static/lib/font-awesome/css/font-awesome.min.css">
+    <style>
+        body{
+            font-family: "Microsoft Yahei", "微软雅黑";
+            box-sizing: border-box;
+        }
+       .clearfix {
+           clear: both;
+       }
+        .skin-blue .content-wrapper .content-header{
+            margin-left: 7px;
+            padding-top: 22px;
+        }
+        .skin-blue .content-wrapper .content-header .content-row {
+            margin-top: 20px;
+            margin-bottom: -10px;
+        }
+        .content-header .form-horizontal{
+            float: right;
+        }
+        .content .boxes {
+            position: relative;
+            margin-top: 4px;
+            border-radius: 3px;
+            background: #ffffff;
+            margin-bottom: 20px;
+            width: 100%;
+            height: 700px;
+            border: 1px solid #dcdcdc;
+            box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
+        }
+        .content .boxes-body table{
+            width: 100%;
+            max-width: 100%;
+        }
+        .content .boxes-body table tr{
+            text-align: center;
+            vertical-align: middle ;
+        }
+        .content .boxes-body table tr td:nth-child(2){
+            text-align: left;
+        }
+        .content .boxes-body table thead{
+            height: 40px;
+            line-height: 40px;
+            text-align: center;
+        }
+        .content .boxes-body table thead tr{
+            border-bottom: 1px solid #dcdcdc;
+        }
+        .content .boxes-body table thead tr td{
+            font-size: 14px;
+            color: #8c8c8c;
+            font-weight: bold;
+        }
+        .content .boxes-body table tbody{
+            height: 655px;
+        }
+        .content .boxes-body table tbody tr{
+            height: 60px;
+            vertical-align: baseline;
+            cursor: pointer;
+        }
+        .content .boxes-body table tbody tr:nth-child(even){
+            background: #f7f7f7;
+        }
+        .content .boxes-body table tbody tr:hover{
+            background: #f1f5ff;
+        }
+        .content .boxes-body table tbody tr td{
+            padding-top: 6px;
+            font-size: 14px;
+            color: #323232;
+        }
+        .content .boxes-body table tbody tr td div.name{
+            position: relative;
+            width: 220px;
+        }
+        .content .boxes-body table tbody tr td div.name p {
+            font-size: 14px;
+            font-weight: bold;
+            color: #323232;
+        }
+        .content .boxes-body table tbody tr td div.name:hover p{
+            text-decoration: underline;
+        }
+        .content .boxes-body table tbody tr td div.name div.handle{
+            display: none;
+        }
+        .content .boxes-body table tbody tr:hover td div.name div.handle{
+            margin-top: 5px;
+            display: block;
+        }
+        .content .boxes-body table tbody tr td div.name div.set-time{
+            position: absolute;
+            top: 2px;
+            right: -45px;
+            width: 38px;
+            height: 16px;
+            line-height: 16px;
+            font-family: 'SimHei'!important;
+            font-size: 11px;
+            text-align: center;
+            color: #fff;
+            background: #3c8dbc;
+            border-radius: 10px;
+            display: none;
+        }
+        .content .boxes-body table tbody tr:hover td div.name div.set-time{
+            display: block;
+        }
+        .content .boxes-body table tbody tr td div.name span{
+            margin-right: 25px;
+            font-size: 14px;
+            color: #367bcf;
+            cursor: pointer;
+        }
+        .content .boxes-body table tbody tr td div.name span:last-child {
+            margin-right: 0;
+        }
+        /*右侧内容部分*/
+        .content-right{
+            margin-top: 50px;
+            position: absolute;
+            top: 0;
+            right: 0;
+            width: 905px;
+            height: 924px;
+            background: #fff;
+            z-index: 100;
+            box-shadow: -5px 2px 2px #f0f0f0;
+            -moz-box-shadow: -5px 2px 2px #f0f0f0;
+            -o-box-shadow: -5px 2px 2px #f0f0f0;
+            -webkit-box-shadow: -5px 2px 2px #f0f0f0 ;
+        }
+        .right-header{
+            padding: 0 25px;
+            width: 100%;
+            height: 64px;
+            line-height: 64px;
+        }
+        .right-header span{
+            margin-right: 17px;
+            font-size: 24px;
+            color: #333;
+        }
+        .right-header a{
+            font-size: 14px;
+            color: #1a6eb5;
+        }
+        .right-header .close{
+            font-size: 40px;
+        }
+        .right-nav{
+            margin-bottom: 14px;
+            width: 100%;
+            height: 34px;
+            line-height: 34px;
+            background: #e8f0f7;
+        }
+        .right-nav span{
+            margin-right: 50px;
+            padding-bottom: 5px;
+            font-size: 14px;
+            color: #333333;
+            cursor: pointer;
+        }
+        .right-nav span:first-child{
+            margin-left: -73px;
+        }
+        .right-nav span:hover,.right-nav span.active{
+            border-bottom: 2px solid #3c8dbc;
+        }
+        .content-right .right-list{
+            width: 100%;
+        }
+        .content-right .right-list table{
+            margin-top: 20px;
+            width: 100%;
+            table-layout: fixed ;
+        }
+
+        .content-right .right-list table thead{
+            width: 100%;
+            height: 40px;
+            line-height: 40px;
+            border: 1px solid #dcdcdc;
+        }
+        .content-right .right-list table thead tr{
+            border: 1px solid #dcdcdc;
+        }
+        .content-right .right-list table thead th{
+            font-size: 14px;
+            color: #8c8c8c;
+            text-align: center;
+        }
+        .content-right .right-list table thead th:nth-child(2){
+            text-align: left;
+        }
+        .content-right .right-list table tbody tr{
+            height: 60px;
+            cursor: pointer;
+        }
+        .content-right .right-list table tbody tr:nth-child(even){
+            background: #f7f7f7;
+        }
+        .content-right .right-list table tbody tr:hover{
+            background: #f1f5ff;
+        }
+        .content-right .right-list table tbody tr td{
+            font-size: 14px;
+            color: #333;
+            text-align: center;
+        }
+        .content-right .right-list table tbody tr td:nth-child(2) {
+            /*font-weight: bold;*/
+            text-align: left;
+        }
+        .content-right .right-list table tbody tr td:nth-child(3) {
+            padding-right: 20px;
+            text-align: right;
+        }
+
+        .right-list .list-message{
+            padding: 0 20px 0 25px;
+        }
+        .right-list .list-header{
+            position: relative;
+            width: 100%;
+            height: 43px;
+            text-align: left;
+            border-bottom: 1px solid #dcdcdc;
+        }
+        .right-list .list-header:first-child {
+            margin-top: -10px;
+        }
+        .right-list .list-header span{
+            margin-left: 15px;
+            font-size: 15px;
+            color: #000;
+        }
+        .right-list .list-header span:before {
+            content: '';
+            position: absolute;
+            top: 13px;
+            left: 0;
+            width: 4px;
+            height: 16px;
+            background: #626262;
+        }
+        .right-list .list-body{
+            margin-top: 17px;
+        }
+        .right-list .list-body .msg-list{
+            margin-bottom: 20px;
+            overflow: hidden;
+        }
+        .right-list .list-body .msg-list.msg-lists {
+            border-bottom: 1px solid #dcdcdc;
+        }
+        .right-list .list-body .msg-list span:first-child{
+            margin-right: 20px;
+            width: 70px;
+            font-family: 'SimHei'!important ;
+            font-size: 14px;
+            color: #8da8b8;
+        }
+        .right-list .list-body .msg-list span:last-child{
+            width: 240px;
+            font-size: 14px;
+            color: #323232;
+        }
+        /*信息详情*/
+        .right-list .list-body .msg-list span.count{
+            font-size: 14px;
+            font-weight: bold;
+            color: #3c8dbc;
+        }
+        .right-list .list-body .message-list .txt{
+            margin-bottom: 20px;
+        }
+        .right-list .list-body .message-list p{
+            font-size: 14px;
+            color: #323232;
+            line-height: 21px;
+            text-indent: 2em;
+        }
+        .right-list .list-body .message-list ul>li{
+            font-size: 14px;
+            color: #323232;
+            line-height: 21px;
+            list-style: none;
+        }
+        .right-list .list-body .message-list .photo{
+            position: relative;
+            width: 400px;
+            height: 220px;
+            line-height: 220px;
+            text-align: center;
+            font-size: 14px;
+            color: #878787;
+            background: #e5e5e5;
+        }
+        .right-list .list-body .message-list .photo input{
+            position: absolute ;
+            top: 0;
+            left: 0;
+            width: 400px;
+            height: 220px;
+            outline: none;
+            opacity: 0;
+        }
+        .right-list{
+            display: none
+        }
+        .show{
+            display: block;
+        }
+        .box-show{
+            display: none;
+        }
+        .content-right{
+            display: none;
+            height: 1500px;
+        }
+        .modal-footer {
+            padding: 10px;
+        }
+    </style>
+</head>
+<body class="skin-blue sidebar-mini  pace-done">
+    <div class="pace  pace-inactive">
+        <div class="pace-progress" data-progress-text="100%" data-progress="99" style="transform: translate3d(100%, 0px, 0px);">
+            <div class="pace-progress-inner"></div>
+        </div>
+        <div class="pace-activity"></div>
+    </div>
+    <div class="wrapper">
+        <!--顶部导航-->
+        <header class="main-header">
+            <!-- Logo -->
+            <a href="" class="logo" target="_blank">
+                <span class="logo-mini"><b>JP</b></span>
+                <span class="logo-lg"><b>一元捐后台系统</b></span>
+            </a>
+            <nav class="navbar navbar-static-top" role="navigation">
+                <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
+                    <span class="sr-only">开关</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span>
+                </a>
+                <div class="navbar-custom-menu" style="padding-right: 2rem">
+                    <ul class="nav navbar-nav">
+                        <li class="dropdown user user-menu">
+                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
+                                <span class="hidden-xs">超级管理员, 您好</span>
+                                <img src="static/images/avatar.jpg" class="user-image">
+                            </a>
+                            <ul class="dropdown-menu">
+                                <!-- User image -->
+                                <li class="user-header">
+                                    <img src="static/images/avatar.jpg" style="border-radius: 50%;">
+                                    <p>超级管理员 - 超级管理员</p>
+                                </li>
+                                <li class="user-footer">
+                                    <div class="pull-left">
+                                        <a href="" class="btn btn-default btn-flat">资料</a>
+                                    </div>
+                                    <div class="pull-right">
+                                        <a href="" class="btn btn-default btn-flat">退出</a>
+                                    </div>
+                                </li>
+                            </ul>
+                        </li>
+                    </ul>
+                </div>
+            </nav>
+        </header>
+        <!--左侧边栏-->
+        <aside class="main-sidebar">
+            <section class="sidebar">
+                <ul class="sidebar-menu">
+                    <li class="jpress_block"></li>
+                    <li class="treeview active" id="dashboard">
+                        <a href="">
+                            <i class="fa fa-home"></i>
+                            <span>一元捐首页</span>
+                        </a>
+                    </li>
+                    <li class="jpress_block"></li>
+                    <li class="treeview" id="systems">
+                        <a href="#">
+                            <i class="fa fa-file-text-o"></i><span>项目中心</span>
+                            <i class="fa fa-angle-left pull-right"></i>
+                        </a>
+                        <ul class="treeview-menu">
+                            <li id=""><a href="">项目列表</a></li>
+                            <li id=""><a href="">发起项目</a></li>
+                            <li id=""><a href="">捐款明细</a></li>
+                            <li id=""><a href="">项目财务披露</a></li>
+                            <li id=""><a href="">项目报告填写</a></li>
+                            <li id=""><a href="">项目结项管理</a></li>
+                        </ul>
+                    </li>
+                    <li class="treeview" id="schemes">
+                        <a href="#">
+                            <i class="fa fa-file-text-o"></i><span>用户中心</span>
+                            <i class="fa fa-angle-left pull-right"></i>
+                        </a>
+                        <ul class="treeview-menu">
+                            <li id=""><a href="">机构列表</a></li>
+                            <li id=""><a href="">用户列表</a></li>
+                            <li id=""><a href="">权限设置</a></li>
+                        </ul>
+                    </li>
+                    <li class="treeview" id="customers">
+                        <a href="#"><i class="fa fa-file-text-o"></i><span>活动中心</span>
+                            <i class="fa fa-angle-left pull-right"></i>
+                        </a>
+                        <!--<ul class="treeview-menu">-->
+                            <!--<li id=""><a href=""></a></li>-->
+                            <!--<li id=""><a href=""></a></li>-->
+                            <!--<li id=""><a href=""></a></li>-->
+                            <!--<li id=""><a href=""></a></li>-->
+                            <!--<li id=""><a href=""></a></li>-->
+                        <!--</ul>-->
+                    </li>
+                    <li class="treeview" id="customers">
+                        <a href="#"><i class="fa fa-file-text-o"></i><span>消息中心</span>
+                            <i class="fa fa-angle-left pull-right"></i>
+                        </a>
+                        <!--<ul class="treeview-menu">-->
+                            <!--<li id=""><a href=""></a></li>-->
+                            <!--<li id=""><a href=""></a></li>-->
+                            <!--<li id=""><a href=""></a></li>-->
+                            <!--<li id=""><a href=""></a></li>-->
+                            <!--<li id=""><a href=""></a></li>-->
+                        <!--</ul>-->
+                    </li>
+                    <li class="treeview" id="customers">
+                        <a href="#"><i class="fa fa-file-text-o"></i><span>前台管理</span>
+                            <i class="fa fa-angle-left pull-right"></i>
+                        </a>
+                        <!--<ul class="treeview-menu">-->
+                            <!--<li id=""><a href=""></a></li>-->
+                            <!--<li id=""><a href=""></a></li>-->
+                            <!--<li id=""><a href=""></a></li>-->
+                            <!--<li id=""><a href=""></a></li>-->
+                            <!--<li id=""><a href=""></a></li>-->
+                        <!--</ul>-->
+                    </li>
+                    <li class="jpress_block"></li>
+                </ul>
+            </section>
+            <!-- /.sidebar -->
+        </aside>
+        <!--主体内容-->
+        <div class="content-wrapper" style="min-height: 924px;; z-index: 50;">
+            <section class="content-header clearfix">
+                <h1>消息列表</h1>
+                <div class="row content-row clearfix">
+                    <div class="jp-left">
+                        <select class="form-control input-sm jp-width120" name="action">
+                            <option value="">全部时段</option>
+                            <option value="delete">最近6小时</option>
+                            <option value="delete">最近24小时</option>
+                            <option value="delete">最近3天</option>
+                            <option value="delete">最近7天</option>
+                        </select>
+                    </div>
+                    <form class="form-horizontal" method="POST" action="">
+                        <div class="input-group input-group-sm">
+                            <input id="post-search-input" class="form-control" type="search" value="" name="" placeholder="请输入关键词">&nbsp;&nbsp;
+                            <input id="search-submit" class="btn btn-default btn-sm" type="submit" value="搜索">
+                        </div>
+                    </form>
+                </div>
+            </section>
+            <!-- Main content -->
+            <section class="content">
+                <div class="box-show show">
+                    <div class="boxes">
+                    <div class="boxes-body">
+                        <form action="" method="" id="form">
+                            <input type="hidden" name="" value="">
+                            <table class="" style="word-break:break-all">
+                                <thead>
+                                <tr>
+                                    <td width="45"></td>
+                                    <td width="300">消息主题</td>
+                                    <td width="100">发布时间</td>
+                                    <td width="160">接收对象</td>
+                                    <td width="90">阅读情况</td>
+                                    <td width="90">发送人</td>
+                                    <td width="500"></td>
+                                </tr>
+                                </thead>
+                                <tbody>
+                                <tr>
+                                    <td><input type="checkbox"></td>
+                                    <td>
+                                        <div class="name">
+                                            <p>活动通知:优软一元捐感恩回馈038</p>
+                                            <div class="handle"><span>删除</span></div>
+                                            <div class="set-time">定时</div>
+                                        </div>
+                                    </td>
+                                    <td>2017-08-20 <br/>14:38:11</td>
+                                    <td>所有用户(12314人)</td>
+                                    <td>11640</td>
+                                    <td>管理员01</td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td><input type="checkbox"></td>
+                                    <td>
+                                        <div class="name">
+                                            <p>活动通知:优软一元捐感恩回馈038</p>
+                                            <div class="handle"><span>删除</span></div>
+                                            <div class="set-time">定时</div>
+                                        </div>
+                                    </td>
+                                    <td>2017-08-20 <br/>14:38:11</td>
+                                    <td>所有用户(12314人)</td>
+                                    <td>11640</td>
+                                    <td>管理员01</td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td><input type="checkbox"></td>
+                                    <td>
+                                        <div class="name">
+                                            <p>活动通知:优软一元捐感恩回馈038</p>
+                                            <div class="handle"><span>删除</span></div>
+                                            <div class="set-time">定时</div>
+                                        </div>
+                                    </td>
+                                    <td>2017-08-20 <br/>14:38:11</td>
+                                    <td>所有用户(12314人)</td>
+                                    <td>11640</td>
+                                    <td>管理员01</td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td><input type="checkbox"></td>
+                                    <td>
+                                        <div class="name">
+                                            <p>活动通知:优软一元捐感恩回馈038</p>
+                                            <div class="handle"><span>删除</span></div>
+                                            <div class="set-time">定时</div>
+                                        </div>
+                                    </td>
+                                    <td>2017-08-20 <br/>14:38:11</td>
+                                    <td>所有用户(12314人)</td>
+                                    <td>11640</td>
+                                    <td>管理员01</td>
+                                    <td></td>
+                                </tr>
+                                <tr>
+                                    <td><input type="checkbox"></td>
+                                    <td>
+                                        <div class="name">
+                                            <p>活动通知:优软一元捐感恩回馈038</p>
+                                            <div class="handle"><span>删除</span></div>
+                                            <div class="set-time">定时</div>
+                                        </div>
+                                    </td>
+                                    <td>2017-08-20 <br/>14:38:11</td>
+                                    <td>所有用户(12314人)</td>
+                                    <td>11640</td>
+                                    <td>管理员01</td>
+                                    <td></td>
+                                </tr>
+                                </tbody>
+                            </table>
+                        </form>
+                    </div>
+                </div>
+                </div>
+            </section>
+        </div>
+        <!--右侧内容部分-->
+        <aside class="content-right show">
+            <div class="right-header clearfix">
+                <div class="fl"><span>活动通知:优软一元捐感恩回馈038</span></div>
+                <div class="fr close">&times;</div>
+            </div>
+            <div class="right-nav"><span style="margin-left: -334px;" class="active">信息详情</span></div>
+            <!--信息详情-->
+            <div class="right-list show">
+                <div class="list-message">
+                    <div class="list-body clearfix">
+                        <div class="msg-list fl">
+                            <span class="fl">发送时间</span>
+                            <span class="fl">2017-09-20 10:30:44</span>
+                        </div>
+                        <div class="msg-list fl">
+                            <span class="fl">发送人</span>
+                            <span class="fl">管路员01</span>
+                        </div>
+                        <div class="msg-list fl">
+                            <span class="fl">接收对象</span>
+                            <span class="fl count">所用用户</span>
+                        </div>
+                    </div>
+                </div>
+                <div class="list-message">
+                    <div class="list-header">
+                        <span>具体内容</span>
+                    </div>
+                    <div class="list-body">
+                        <div class="message-list">
+                            <div class="txt">
+                                <p>ORACLE ERP基本模块(销售、计划、采购、仓库和财务)的软件和实施费用逾400万元,其中,服务器的费用便超过80万元。
+                                    ORACLE ERP项目花费一年半的时间,派遣十人的顾问团队,天派电子自身招募十人IT专职于ERP实施。
+                                </p>
+                                <p>
+                                    08年受金融危机的影响,天派电子经营状况迅速恶化,截止09年底,ORALCE已上线数月,项目付出300+万元,预效实现甚微,项
+                                    目需追加投入近百万元。结合ORACLE的实施效果和后期的支出费用,天派电子决定放弃ORACLE,重新寻找见效快,功能合适、价格可
+                                    承受的ERP软件。
+                                </p>
+                                <p>
+                                    鉴于经验教训,天派电子对新系统的选型也更为慎重,同时,选型的标准也集合了两个系统的优点,尤其是ORACLE的管理理念,其
+                                    主要的选型标准包括:
+                                </p>
+                                <ul>
+                                    <li>基于互联网技术架构下的B/S产品;</li>
+                                    <li>提供管理独立需求的计划模式,以实现预测和计划的对冲管理和生产计划的平滑化;</li>
+                                    <li>提供精确的量化和时程化的MRP技术,包括能对已经下达的采购订单、生产订单提供提前、延后甚至取消的计划建议;</li>
+                                    <li>支持多公司、多工厂的运作模式;</li>
+                                    <li>支持强大的自定义的工作流。</li>
+                                </ul>
+                            </div>
+                            <div class="photo">
+                                配图
+                                <input type="file">
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </aside>
+    </div>
+<!--js begin-->
+<script src="static/lib/jquery/jquery.min.js"></script>
+<script src="static/lib/bootstrap/js/bootstrap.min.js"></script>
+<script>
+    $('.right-nav').on('click', 'span', function () {
+        var index = $(this).index();
+        $(this).addClass('active').siblings().removeClass('active');
+        $('.right-list').eq(index).addClass('show').siblings().removeClass('show');
+    });
+</script>
+</body>
+</html>