天天看点

nodejs开发个人博客实践15

后台内容添加和展示

一、添加入口

nodejs开发个人博客实践15

二、添加访问接口

// 分类管理首页
router.get('/content',function(req,res,next){
    var page=Number(req.query.page||1);
    var limit=10;
    var totalpages=0;
    Content.count().then(function(count){
        totalpages=Math.ceil(count/limit);
        page=Math.min(page,totalpages);
        page=Math.max(page,1);
        var skip=(page-1)*limit;
        // 降序排序
        Content.find().sort({_id:-1}).limit(limit).skip(skip).then(function(contents){
            console.log("文章内容:        "+contents);
            res.render('admin/content.html',{
                userInfo:req.userInfo,
                contents:contents,
                page:page,
                limit:limit,
                count:count,
                totalpages:totalpages,
            });
        })
    })  
});           

三、添加内容页面

{% extends 'moban.html' %}

{% block main %}
<!--面包屑导航-->
<br>
<ul class="breadcrumb">
        <li><a href="/admin" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow" >管理首页</a></li>
        <li><span>内容管理</span></li>
</ul>
<!-- 操作列表 -->
<hr>
<button type="button" class="btn btn-info">编辑</button>
<button type="button" class="btn btn-primary" onclick='window.open("/admin/content/add")'>添加</button>
<button type="button" class="btn btn-danger">删除</button>
<button type="button" class="btn btn-danger">批量删除</button>

<!--表格内容-->
<h1>内容管理</h1>
<table class="table table-striped table-hover table-responsive">

    
    <thead>
      <tr>
        <th>ID</th>
        <th>标题</th> 
        <th>分类</th>
        <th>简介</th>
        <th>内容</th>
      </tr>
    </thead>
    <tbody>
        {% for content in contents %}
      <tr>
        <td>{{content._id.toString()}}</td>
        <td>{{content.title}}</td>
        <td>{{content.category.id.toString()}}</td>
        <td>{{content.description}}</td>
        <td>{{content.content.slice(0,30)+"........"}}</td>
      </tr>
       {% endfor %}
    </tbody>
</table>
  <!-- 分页 -->
  <br>
  <br>
  <ul class="pager">
        <li id="frontpage"><a href="/admin/content?page={{page-1}}" target="_blank" rel="external nofollow" >上一页</a></li>
        <li>      第{{page}}页,共{{totalpages}}页;每页显示{{limit}}条数据,共{{count}}条数据     </li>
        <li id="nextpage"><a href="/admin/content/?page={{page+1}}" target="_blank" rel="external nofollow" >下一页</a></li>
 </ul>

{% endblock %}           

四 、添加内容添加访问接口

// 内容添加
router.get('/content/add',function(req,res,next){
    Category.find().then(function(categories){
        res.render('admin/content_add.html',{categories:categories});
    })
});           

五、添加内容添加页面

{% extends 'moban.html' %}

{% block main %}
<!--面包屑导航-->
<br>
<ul class="breadcrumb">
        <li><a href="/admin" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow" >管理首页</a></li>
        <li><a href="/admin/content" target="_blank" rel="external nofollow" >内容管理</a></li>
        <li><span>内容添加</span></li>
</ul>
<!--表格内容-->
<br>
<h1>内容添加</h1>
<hr>
<div class="container">
    <div class="row clearfix">
      <div class="col-md-12 column">
        <form class="form-horizontal" role="form" method="POST" action="/admin/content/add">
          <div class="form-group">
             <label for="inputEmail3" class="col-sm-2 control-label">标题</label>
            <div class="col-sm-10">
              <input type="text" class="form-control" name="title" id="inputEmail3" />
            </div>
          </div>
          <div class="form-group">
             <label for="inputPassword3" class="col-sm-2 control-label">简介</label>
            <div class="col-sm-10">
                <textarea class="form-control" name="description" rows="3"></textarea>
            </div>
          </div>
          <div class="form-group">
              <label for="inputPassword3" class="col-sm-2 control-label">内容</label>
             <div class="col-sm-10">
                 <textarea class="form-control" name="content" rows="7"></textarea>
             </div>
           </div>
           <div class="form-group">
              <label for="inputPassword3" class="col-sm-2 control-label">选择分类</label>
             <div class="col-sm-10">
              
              <select class="form-control" name="category">
                  {% for category in categories %}
                <option value="{{category._id.toString()}}">{{category.categoryName}}</option>
                  {% endfor %}
              </select>
              
           </div>
           </div>
          <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
               <button type="submit" class="btn btn-default">提交</button>
            </div>
          </div>
        </form>
        {% if msg %}
        <div class="alert alert-warning">
          <a href="#" target="_blank" rel="external nofollow"  class="close" data-dismiss="alert">
            &times;
          </a>
          <strong>结果:</strong>{{msg}}
        </div>
        {% endif  %}
      </div>
    </div>
  </div>
  <!-- 分页 -->
  <br>
  <br>
  <!-- 通过包含来使用模板 -->
  {% include 'page.html' %}

{% endblock %}           

六、添加内容提交接口

// 内容提交
router.post('/content/add',function(req,res,next){
    if(req.body.title==""||req.body.description==""||req.body.category=="")
    {
       var msg="必须输入!"
        res.render('admin/content_add.html',{msg:msg});
    }
    else
    {
        new Content({
            title:req.body.title,
            description:req.body.description,
            content:req.body.content,
            category:req.body.category
        }).save().then(function(re){
           var msg="内容提交成功";
           
            
            res.render('admin/content_add.html',{msg:msg});   
        })
    }
});           

七、添加数据模型

///shemas/content.js
var mongoose=require('mongoose');
module.exports= new  mongoose.Schema({
   title:String,
//    分类的ID-关联字符
category:
{
    // 类型
    type:mongoose.Schema.Types.ObjectId,
    // 引用
    ref:"centent"
},
description:
{
    type:String ,
    default:''
},
content:
{
    type:String ,
    default:''
}
})           
///modules/Conten.js
var mongoose=require('mongoose');
var contentSchema=require('../schemas/content');
module.exports= mongoose.model('Content',contentSchema);           

七、结果

nodejs开发个人博客实践15
nodejs开发个人博客实践15

继续阅读