MusicShop/Views/Home/Cart.cshtml

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

@{
    ViewBag.Title = "购物车";
    Layout = "~/Views/Shared/_IndexLayout.cshtml";
}

    <div class="layui-row" >
        <div id="hhh">
            <div class="layui-col-md9 layui-col-md-offset2 layui-row">
                <div class="layui-col-md3">
                    <h2 style="font-weight:bold;color:#FF5722;">购物车</h2>
                </div>
                <div class="layui-col-md3 layui-col-md-offset5">
                    <a class="layui-btn layui-btn-danger" href="@Url.Content("ClearCart")">清空购物车</a>
                    @Ajax.ActionLink("结算", "OrderItem", null, new AjaxOptions() { UpdateTargetId = "hhh", HttpMethod = "post" }, new { @class = "layui-btn layui-btn-normal" })
                </div>
                <div class="layui-col-md10" id="cart-container">
                    <table class="layui-table">
                        <tr style="font-weight:bold;">
                            <td>专辑</td>
                            <td>歌手</td>
                            <td>单价</td>
                            <td>数量</td>
                            <td>小计</td>
                            <td>操作</td>
                        </tr>
                        <tr v-for="temp in cartData" :key="temp.cartId">
                            <td>
                                {{temp.ablumName}}
                            </td>
                            <td>
                                {{temp.ablumArtist}}
                            </td>
                            <td>
                                ￥{{temp.ablumPrice}}
                            </td>
                            <td>
                                {{temp.ablumCount}}
                            </td>
                            <td>
                                ￥{{temp.totalPrice}}
                            </td>
                            <td>
                                <a class="layui-btn layui-btn-danger" :href="temp.delUrl">
                                    <i class="layui-icon layui-icon-delete"></i>删除
                                </a>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="6" style="font-weight:bold; font-size:20px; text-align:right;">合计:￥{{allPrice}}</td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <script>
        layui.use('table', function () {
            var table = layui.table;
        });