使用nuxt,express,mysql,nginx创建个人博客系列-09

134
2020-01-24 18:37
5 个月前

增加dashboard.html

目录:server/admin/views/dashboard.html 说明:这个页面没内容

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <% include header.ejs%>
    <title>dashboard</title>
</head>

<body>
    <% include nav.ejs%>
    <div>dashboard</div>
</body>

</html>

增加categorys路由和categorys.html

添加一条/categorys的路由规则,修改server/admin/routers/index.js

import categorys from './categorys'
router.use('/categorys', checkNoLogin,categorys)

创建categorys路由文件 目录:server/admin/routers/categorys.js

import {
  Router
} from 'express'
const router = Router()
import config from '../../config' 
import mysql from '../../libs/mysql'
import util from '../../util'
router.get('/',async (req,res,next)=>{
  let myConnect = await mysql.getConnect(); //获取数据库链接
  let sql = `select * from category`;
  let result = await mysql.query(myConnect,sql); //查找所有的分类
  await mysql.release(myConnect);
  res.render('categorys', {
    'module_dir': config.admin.route, //配置的后台路由
    list:result //返回给页面渲染
  })
})

目录:server/admin/views/categorys.html
说明:显示所有的分类

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <% include header.ejs%>
    <title>categorys</title>
</head>

<body>
  <% include nav.ejs%>
    <div class="container mt-3">
      <div class="container-fluid">
        <div class="row">
          <div class="col-12">
            <a class="btn btn-primary btn-outline-dark btn-block" href="<%= module_dir%>/categorys/0" role="button">创建分类</a>
          </div>
        </div>
        <div class="row">
            <%if(list.length){%>
              <div class="col-12 bd-content mt-3">
                  <div class="bd-example">
                    <table class="table table-dark">
                      <thead>
                        <tr>
                          <th scope="col">id</th>
                          <th scope="col">name</th>
                          <th scope="col">修改时间</th>
                        </tr>
                      </thead>
                      <tbody>
                        <%for(i in list){%>
                          <tr>
                              <th scope="row"><a href="<%= module_dir%>/categorys/<%= list[i]['id']%>"><%= list[i]['id']%></a></th>
                              <td><%= list[i]['name']%></td>
                              <td><%= list[i]['updated_at']%></td>
                          </tr>
                        <%}%>
                      </tbody>
                    </table>
                  </div>
                </div>
            <%}%>
        </div>
      </div>
    </div>
</body>
<script>
</script>

</html>

登陆查看categorys.html,这个是我已经添加的分类
categorys


上一篇-使用nuxt,express,mysql,nginx创建个人博客系列-08
下一篇-使用nuxt,express,mysql,nginx创建个人博客系列-10