🚧 save work

app.js

@@ -19,6 +19,8 @@ const app = express();
 
 app.locals.isLogged = false;
 app.locals.isAdmin = false;
+app.locals.message = '';
+app.locals.isErrorMessage = false;
 
 setTimeout(async () => {
   // TODO: Here we need an improvement! I have tried EventEmitter but it's not working. :(

config.js

@@ -1,4 +1,5 @@
 const config = {
+  allowRegister: true,
   port: process.env.PORT || 3000,
   database: 'data.db',
   href: 'https://github.com/',

middlewares/web_auth.js

@@ -0,0 +1,38 @@
+const config = require('../config');
+
+exports.userRequired = (req, res, next) => {
+  if (req.session.user) {
+    if (req.session.user.isBlocked) {
+      return res.render('message', {
+        isError: true,
+        message: '用户账户被禁用，请联系管理员',
+        link: '/feedback',
+      });
+    }
+  } else {
+    return res.render('message', {
+      isError: false,
+      message: '用户尚未登录，请登录',
+      link: '/login',
+    });
+  }
+  next();
+};
+
+exports.adminRequired = (req, res, next) => {
+  if (!req.session.user || !req.session.user.isAdmin) {
+    return res.render('message', {
+      isError: true,
+      message: '需要超级管理员权限',
+    });
+  }
+  next();
+};
+
+exports.allowRegister = (req, res, next) => {
+  if (!config.allowRegister) {
+    req.flash('message', '管理员未开放注册！');
+    return res.redirect('/');
+  }
+  next();
+};

public/main.css

@@ -70,7 +70,7 @@ code {
     box-shadow: 0 2px 3px rgba(26,26,26,.1);
 }
 
-.box article {
+.box .article {
     overflow-wrap: break-word;
     font-size: larger;
     word-break: break-word;
@@ -105,21 +105,21 @@ img {
     font-size: larger;
 }
 
-article a {
+.article a {
     color: #368CCB;
     text-decoration: none;
 }
 
-article a:hover {
+.article a:hover {
     color: #368CCB;
     text-decoration: none;
 }
 
-article h2,
+.article h2,
-article h3,
+.article h3,
-article h4,
+.article h4,
-article h5,
+.article h5,
-article h6 {
+.article h6 {
     font-weight: 700;
     line-height: 1.5;
     margin: 20px 0 15px;
@@ -127,54 +127,54 @@ article h6 {
     margin-block-end: 0.2em;
 }
 
-article h1 {
+.article h1 {
     font-size: 1.7em
 }
 
-article h2 {
+.article h2 {
     font-size: 1.6em
 }
 
-article h3 {
+.article h3 {
     font-size: 1.45em
 }
 
-article h4 {
+.article h4 {
     font-size: 1.25em;
 }
 
-article h5 {
+.article h5 {
     font-size: 1.1em;
 }
-article h6 {
+.article h6 {
     font-size: 1em;
     font-weight: bold
 }
 
 @media screen and (max-width: 960px) {
-    article h1 {
+    .article h1 {
         font-size: 1.5em
     }
 
-    article h2 {
+    .article h2 {
         font-size: 1.35em
     }
 
-    article h3 {
+    .article h3 {
         font-size: 1.3em
     }
 
-    article h4 {
+    .article h4 {
         font-size: 1.2em;
     }
 }
 
-article p {
+.article p {
     margin-top: 0;
     margin-bottom: 1.25rem;
 }
 
-article table {
+.article table {
     margin: auto;
     border-collapse: collapse;
     border-spacing: 0;
@@ -183,20 +183,20 @@ article table {
     min-width: 66%;
 }
 
-article table td,
+.article table td,
-article table th {
+.article table th {
     padding: 5px 8px;
     border: 1px solid #bbb;
 }
 
-article blockquote {
+.article blockquote {
     margin-left: 0;
     padding: 0 1em;
     font-size: smaller;
     border-left: 5px solid #ddd;
 }
 
-article pre {
+.article pre {
     overflow-x: auto;
     padding: 0;
     font-size: 16px;
@@ -204,18 +204,18 @@ article pre {
     margin-bottom: 12px;
 }
 
-article ol {
+.article ol {
     text-decoration: none;
     padding-inline-start: 40px;
     margin-bottom: 1.25rem;
 }
 
-article code {
+.article code {
     color: #bc9458;
     padding: .065em .4em;
 }
 
-article .copyright{
+.article .copyright{
     display: none;
 }
 

routers/index.js

@@ -2,17 +2,17 @@ const express = require('express');
 const router = express.Router();
 const { User } = require('../models');
 const { tokenStore } = require('../common/token');
+const { allowRegister } = require('../middlewares/web_auth');
+const config = require('../config');
 
 router.get('/', (req, res, next) => {
   res.render('index', {
-    message: '',
+    message: req.flash('message'),
   });
 });
 
 router.get('/login', (req, res, next) => {
-  res.render('login', {
+  res.render('login');
-    message: '',
-  });
 });
 
 router.post('/login', async (req, res, next) => {
@@ -21,10 +21,17 @@ router.post('/login', async (req, res, next) => {
     password: req.body.password,
   };
   let message = '';
+  res.locals.isErrorMessage = true;
   try {
     user = await User.findOne({ where: user });
     if (user) {
       req.session.user = user;
+      req.flash(
+        'message',
+        `欢迎${user.isAdmin ? '管理员' : '普通'}用户 ${
+          user.username
+        } 登陆系统！`
+      );
       return res.redirect('/');
     } else {
       message = '用户名或密码错误';
@@ -38,11 +45,17 @@ router.post('/login', async (req, res, next) => {
   });
 });
 
-router.get('/register', (req, res, next) => {
+router.get('/logout', (req, res, next) => {
+  req.session.user = undefined;
+  req.flash('message', '已退出登录');
+  res.redirect('/');
+});
+
+router.get('/register', allowRegister, (req, res, next) => {
   res.render('register');
 });
 
-router.post('/register', async (req, res, next) => {
+router.post('/register', allowRegister, async (req, res, next) => {
   let user = {
     username: req.body.username,
     password: req.body.password,

views/index.ejs

@@ -1,12 +1,15 @@
 <%- include('./partials/header') %>
-<div class="columns is-desktop">
+<div class="normal-container">
-    <div class="column">
+    <%- include('./partials/message') %>
-        <div class="page-card-list">
+    <article class="message is-light">
-
+        <div class="message-header">
+            <p>系统状况</p>
         </div>
-
+        <div class="message-body">
-    </div>
+            内存占用: <%= (process.memoryUsage().rss / (1024 *1024)).toFixed(2) %> MB
-    </div>
+        </div>
+    </article>
 </div>
 
+
 <%- include('./partials/footer') %>

views/login.ejs

@@ -3,13 +3,7 @@
 <div class="narrow-container">
     <div>
         <h2 class="title">用户登录</h2>
-        <% if(message) { %>
+        <%- include('./partials/message') %>
-            <article class="message is-danger">
-                <div class="message-body">
-                    <%= message %>
-                </div>
-            </article>
-        <% }%>
         <form action="/login" method="post">
             <div class="field">
                 <label class="label">用户名</label>

views/message.ejs

@@ -1,10 +1,3 @@
 <%- include('./partials/header') %>
-<article class="message is-danger">
+<%- include('./partials/message') %>
-    <div class="message-header">
-        <p><%= title %></p>
-    </div>
-    <div class="message-body">
-        <%= message %>
-    </div>
-</article>
 <%- include('./partials/footer') %>

views/partials/message.ejs

@@ -0,0 +1,12 @@
+<% if(message && message.length) { %>
+    <article id='message' class="message <%= isErrorMessage ? 'is-danger' : 'is-info'%>">
+        <div class="message-body">
+            <%= message %>
+        </div>
+        <script>
+            setTimeout(function (){
+              document.getElementById('message').style.display='none';
+            }, 5000)
+        </script>
+    </article>
+<% }%>

views/partials/nav.ejs

@@ -15,7 +15,7 @@
         <div id="mainNavbar" class="navbar-menu">
             <div class="navbar-start">
                 <a class="navbar-item" href="/"> 首页 </a>
-                <a class="navbar-item" href="/status"> 状态 </a>
+                <a class="navbar-item" target="_blank" href="https://github.com/songquanpeng/message-pusher"> 帮助 </a>
                 <a class="navbar-item" target="_blank" href="https://iamazing.cn/page/message-pusher"> 关于 </a>
             </div>
             <div class="navbar-end">

views/register.ejs

@@ -3,6 +3,7 @@
 <div class="narrow-container">
     <div>
         <h2 class="title">用户注册</h2>
+        <%- include('./partials/message') %>
         <form action="/register" method="post">
             <div class="field">
                 <label class="label">用户名</label>