egg(55)--轮播图查看,编辑,删除

router.js

  router.get('/admin/focus', controller.admin.focus.index);
  router.get('/admin/focus/edit', controller.admin.focus.edit);
  router.post('/admin/focus/doEdit', controller.admin.focus.doEdit);

查看

view

app/view/admin/focus/index.html

<table class="table table-bordered">
                    <thead>
                        <tr class="th">
                            <th>轮播图名称</th>
                            <th>分类</th>
                            <th>图片</th>
                            <th>跳转地址</th>
                            <th>状态</th>
                            <th class="text-center">操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        <% for(var i = 0;i<list.length;i++){%>
                        <tr>
                            <td>
                                <%= list[i].title %>
                            </td>
                            <td>
                                <%if(list[i].type==1){%>
                                网站
                                <%}else if(list[i].type==2){%>
                                App
                                <%}else if(list[i].type==3){%>
                                小程序
                                <%}else {%>
                                未知类型
                                <%}%>
                            </td>
                            <td>
                                <img style="max-width: 200px;height:auto;" class="pic" src=" <%= list[i].focus_img %>"
                                    alt="">
                            </td>
                            <td>
                                <%= list[i].link %>
                            </td>
                            <td class="text-center">
                                <%if(list[i].status==1){%>
                                <img src="/public/admin/images/yes.gif" onclick="app.changeStatus(this,'Focus','status','<%=list[i]._id%>')" />
                                <%}else{%>
                                <img src="/public/admin/images/no.gif" onclick="app.changeStatus(this,'Focus','status','<%=list[i]._id%>')" />
                                <%}%>
                            </td>
                            <td class="text-center">

                                <a href="/admin/focus/edit?id=<%= list[i]._id %>">修改</a>
                                <a href="/admin/delete?model=Focus&id=<%= list[i]._id %>">删除</a>
                            </td>
                        </tr>
                        <%}%>
                    </tbody>
                </table>

controller

app/controller/admin/focus.js

    async index() {
        var result = await this.ctx.model.Focus.find();
        await this.ctx.render('admin/focus/index',{
            list:result
        })
    }

编辑

view

app/view/admin/focus/edit.html

                        <form action="/admin/focus/doEdit?_csrf=<%=csrf%>" method="post" enctype="multipart/form-data">
                            <ul>
                                <input type="hidden" name="id" value="<%=list._id%>">
                                <li> 分　　类:
                                    <select name="type" id="type">
                                        <option <%if(list.type==1){%> selected
                                            <%}%> value="1">网站</option>
                                        <option <%if(list.type==2){%> selected
                                            <%}%> value="2">APP</option>
                                        <option <%if(list.type==3){%> selected
                                            <%}%> value="3">小程序</option>
                                    </select>
                                </li>
                                <li> 名　　称: <input type="text" name="title" value="<%=list.title%>" /></li>
                                <li> 跳转地址: <input type="text" name="link" value="<%=list.link%>" /></li>
                                <li> 轮 播 图: <input type="file" name="focus_img" />
                                    <br>
                                    　　　　 <img style="max-width: 200px;height:auto;" class="pic" src="<%=list.focus_img%>" />
                                </li>
                                <li> 排　　序: <input type="text" name="sort" value="<%=list.sort%>" /></li>
                                <li> 状　　态: <input type="radio" name="status" <%if(list.status==1){%> checked
                                    <%}%> value="1" id="a"/> <label for="a">显示</label> <input type="radio"
                                        <%if(list.status==0){%> checked
                                    <%}%> name="status" value="0" id="b"/><label for="b">隐藏</label> 　</li>
                                <li>
                                    <br />
                                    <button type="submit" class="btn btn-primary">提交</button>
                                </li>
                            </ul>
                        </form>

controller

app/controller/admin/focus.js

    async doEdit(){
        let parts = this.ctx.multipart({autoFields:true});
        let files = {};
        let stream;
        while((stream = await parts()) != null){
            if(!stream.filename){
                break;
            }
            let fieldname = stream.fieldname; //file表单的名字
            //上传图片的目录
            let dir = await this.service.tools.getUploadFile(stream.filename);
            let target = dir.uploadDir;
            let writeStream = fs.createWriteStream(target);

            await pump(stream,writeStream);
            files = Object.assign(files,{
                [fieldname]:dir.saveDir
            })
        }
        var id = parts.field.id;
        var updateResult = Object.assign(files,parts.field);
        console.log(updateResult)
        let result = await this.ctx.model.Focus.updateOne({"_id":id},updateResult)
        await this.success('/admin/focus','修改轮播图成功');
    }

是否有修改图片

1. 提交给后台的文件名files是否为空
2. 把文件名files和表单值parts.field合并成一个对象var updateResult = Object.assign(files,parts.field);
3. updateOne修改

没有修改图片

有修改图片

删除

调用公共方法

app/view/admin/focus/index.html

 <a href="/admin/delete?model=Focus&id=<%= list[i]._id %>">删除</a>