egg(95上)--egg之购物车列表

router.js

    router.get('/addCartSuccess', initMiddleware, controller.default.cart.addCartSuccess);

controller.js

app/controller/default/cart.js

    async addCartSuccess() {
        var goods_id = this.ctx.request.query.goods_id;
        var color_id = this.ctx.request.query.color_id;
        var goodsResult = await this.ctx.model.Goods.find({ "_id": goods_id });
        var colorResult = await this.ctx.model.GoodsColor.find({ "_id": color_id });
        if (goodsResult.length == 0 || colorResult.length == 0) {
            this.ctx.status = 404;
            this.ctx.body = '错误404'; //404
        } else {


            var title = goodsResult[0].title + '--' + goodsResult[0].goods_version + "--" + colorResult[0].color_name;

            await this.ctx.render('default/add_cart_success.html', {

                title: title,

                goods_id: goods_id

            });
        }
    }

view

app/view/default/add_cart_success.html

<% include  ./public/header.html%>
    <!--end header -->


    <!-- start banner_x -->
    <% include  ./public/banner.html%>
        <!-- end banner_x -->

        <style>
            .buy-succ-box {
                margin-bottom: 26px;
                padding: 40px 0 40px 0;
                height: 68px;
                border-bottom: 1px solid #e0e0e0;
            }
            
            .buy-succ-box .goods-content {
                float: left;
            }
            
            .buy-succ-box .actions {
                float: right;
            }
            
            .buy-succ-box .goods-img {
                float: left;
                width: 64px;
                height: 64px;
            }
            
            .buy-succ-box .goods-info {
                float: left;
                margin-left: 20px;
            }
            
            .buy-succ-box .goods-info h3 {
                margin: 0;
                color: #424242;
                font-size: 24px;
                font-weight: normal;
                margin-top: 3px;
            }
            
            .buy-succ-box .goods-info .name,
            .buy-succ-box .goods-info .price {
                margin-right: 15px;
                font-size: 14px;
                color: #757575;
            }
            
            .buy-succ-box .actions .btn {
                width: 180px;
                margin-left: 12px;
                margin-top: 5px;
            }
            
            .btn-line-gray {
                border-color: #b0b0b0;
                background: #fff;
                color: #757575;
            }
            
            .btn {
                display: inline-block;
                *zoom: 1;
                *display: inline;
                width: 158px;
                height: 38px;
                padding: 0;
                margin: 0;
                border: 1px solid #b0b0b0;
                font-size: 14px;
                line-height: 38px;
                text-align: center;
                color: #b0b0b0;
                cursor: pointer;
                -webkit-transition: all .4s;
                transition: all .4s;
            }
            
            .btn-primary {
                background: #ff6700;
                border-color: #ff6700;
                color: #fff;
            }
            
            .xm-recommend-title {
                text-align: center;
                padding: 20px 0px;
                background-color: #f5f5f5;
                margin-bottom: 10px;
            }
            
            .xm-recommend-title span {
                position: static;
                margin-bottom: 20px;
                width: 100%;
                height: auto;
                font-size: 28px;
            }
        </style>

        <div class="container">

            <div class="buy-succ-box clearfix">
                <div class="goods-content" id="J_goodsBox">
                    <div class="goods-img"> <img src="/public/default/image/success.png" width="64" height="64"> </div>
                    <div class="goods-info">
                        <h3>已成功加入购物车！</h3> <span class="name"><%=title%> </span> </div>
                </div>

                <div class="actions J_actBox">
                    <a href="/pinfo?id=<%=goods_id%>" class="btn btn-line-gray J_goBack">返回上一级</a>
                    <a href="/cart" class="btn btn-primary">去购物车结算</a>
                </div>
            </div>

            <h2 class="xm-recommend-title"><span>买购物车中商品的人还买了</span></h2>

            <div class="danpin center">

                <div class="main center">
                    <div class="mingxing fl mb20" style="border:2px solid #fff;width:230px;cursor:pointer;" onmouseout="this.style.border='2px solid #fff'" onmousemove="this.style.border='2px solid red'">
                        <div class="sub_mingxing">
                            <a href="./xiangqing.html" target="_blank"><img src="/public/default/image/liebiao_xiaomi6.jpg" alt=""></a>
                        </div>
                        <div class="pinpai"><a href="./xiangqing.html" target="_blank">小米6</a></div>
                        <div class="youhui">5.16早10点开售</div>
                        <div class="jiage">2499.00元</div>
                    </div>
                    <div class="mingxing fl mb20" style="border:2px solid #fff;width:230px;cursor:pointer;" onmouseout="this.style.border='2px solid #fff'" onmousemove="this.style.border='2px solid red'">
                        <div class="sub_mingxing">
                            <a href=""><img src="/public/default/image/liebiao_xiaomi5c.jpg" alt=""></a>
                        </div>
                        <div class="pinpai"><a href="">小米手机5c</a></div>
                        <div class="youhui">搭载澎湃S1 八核高性能处理器</div>
                        <div class="jiage">1499.00元</div>
                    </div>
                    <div class="mingxing fl mb20" style="border:2px solid #fff;width:230px;cursor:pointer;" onmouseout="this.style.border='2px solid #fff'" onmousemove="this.style.border='2px solid red'">
                        <div class="sub_mingxing">
                            <a href=""><img src="/public/default/image/liebiao_xiaomint2.jpg" alt=""></a>
                        </div>
                        <div class="pinpai"><a href="">小米Note 2</a></div>
                        <div class="youhui">5月9日-20日 小米Note 2 享花呗12期分期免息</div>
                        <div class="jiage">2799.00元</div>
                    </div>
                    <div class="mingxing fl mb20" style="border:2px solid #fff;width:230px;cursor:pointer;" onmouseout="this.style.border='2px solid #fff'" onmousemove="this.style.border='2px solid red'">
                        <div class="sub_mingxing">
                            <a href=""><img src="/public/default/image/liebiao_xiaomimix.jpg" alt=""></a>
                        </div>
                        <div class="pinpai"><a href="">小米MIX</a></div>
                        <div class="youhui">5月9日-20日小米MIX 享花呗12期分期免息</div>
                        <div class="jiage">3499.00元</div>
                    </div>
                    <div class="mingxing fl mb20" style="border:2px solid #fff;width:230px;cursor:pointer;" onmouseout="this.style.border='2px solid #fff'" onmousemove="this.style.border='2px solid red'">
                        <div class="sub_mingxing">
                            <a href=""><img src="/public/default/image/liebiao_xiaomi5s.jpg" alt=""></a>
                        </div>
                        <div class="pinpai"><a href="">小米5s</a></div>
                        <div class="youhui">“暗夜之眼”超感光相机 / 无孔式超声波</div>
                        <div class="jiage">1999.00元</div>
                    </div>

                    <div class="clear"></div>
                </div>
                <div class="main center mb20">
                    <div class="mingxing fl mb20" style="border:2px solid #fff;width:230px;cursor:pointer;" onmouseout="this.style.border='2px solid #fff'" onmousemove="this.style.border='2px solid red'">
                        <div class="sub_mingxing">
                            <a href=""><img src="/public/default/image/liebiao_xiaomi5.jpg" alt=""></a>
                        </div>
                        <div class="pinpai"><a href="">小米手机5</a></div>
                        <div class="youhui">骁龙820处理器 / UFS 2.0 闪存</div>
                        <div class="jiage">1799.00元</div>
                    </div>
                    <div class="mingxing fl mb20" style="border:2px solid #fff;width:230px;cursor:pointer;" onmouseout="this.style.border='2px solid #fff'" onmousemove="this.style.border='2px solid red'">
                        <div class="sub_mingxing">
                            <a href=""><img src="/public/default/image/liebiao_hongmin4.jpg" alt=""></a>
                        </div>
                        <div class="pinpai"><a href="">红米Note 4</a></div>
                        <div class="youhui">十核旗舰处理器 / 全金属一体化机身 </div>
                        <div class="jiage">1399.00元</div>
                    </div>
                    <div class="mingxing fl mb20" style="border:2px solid #fff;width:230px;cursor:pointer;" onmouseout="this.style.border='2px solid #fff'" onmousemove="this.style.border='2px solid red'">
                        <div class="sub_mingxing">
                            <a href=""><img src="/public/default/image/pinpai3.png" alt=""></a>
                        </div>
                        <div class="pinpai"><a href="">小米手机5 64GB</a></div>
                        <div class="youhui">5月9日-10日，下单立减100元</div>
                        <div class="jiage">1799元</div>
                    </div>
                    <div class="mingxing fl mb20" style="border:2px solid #fff;width:230px;cursor:pointer;" onmouseout="this.style.border='2px solid #fff'" onmousemove="this.style.border='2px solid red'">
                        <div class="sub_mingxing">
                            <a href=""><img src="/public/default/image/liebiao_hongmin42.jpg" alt=""></a>
                        </div>
                        <div class="pinpai"><a href="">红米4</a></div>
                        <div class="youhui">2.5D 玻璃，金属一体化机身</div>
                        <div class="jiage">999.00元</div>
                    </div>
                    <div class="mingxing fl mb20" style="border:2px solid #fff;width:230px;cursor:pointer;" onmouseout="this.style.border='2px solid #fff'" onmousemove="this.style.border='2px solid red'">
                        <div class="sub_mingxing">
                            <a href=""><img src="/public/default/image/liebiao_hongmin4x.jpg" alt=""></a>
                        </div>
                        <div class="pinpai"><a href="">红米Note 4X 全网通版</a></div>
                        <div class="youhui">多彩金属 / 4100mAh 超长续航</div>
                        <div class="jiage">1299.00元</div>
                    </div>

                    <div class="clear"></div>
                </div>
            </div>



        </div>




        <footer class="mt20 center">
            <div class="mt20">小米商城|MIUI|米聊|多看书城|小米路由器|视频电话|小米天猫店|小米淘宝直营店|小米网盟|小米移动|隐私政策|Select Region</div>
            <div>©mi.com 京ICP证110507号 京ICP备10046444号 京公网安备11010802020134号 京网文[2014]0059-0009号</div>
            <div>违法和不良信息举报电话：185-0130-1238，本网站所列数据，除特殊说明，所有数据均出自我司实验室测试</div>

        </footer>

        <!-- end danpin -->


        </body>

        </html>

效果