mashangyoujiu/Application/Retail/View/Discount/promotionSummary.html

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>商品促销汇总</title>
    <link rel="stylesheet" href="__PUBLIC__/bootstrap/css/bootstrap.css">
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/layui/css/layui.css"/>
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/Retail/css/goodsList.css"/>
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/Retail/css/myscroll.css"/>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        body {
            padding: 10px 15px;
        }

        .Promotion, blockquote {
            box-sizing: border-box;
            /*margin: 0;*/
            padding: 0;
            padding-left: 15px;
            border-left: 2px solid #3D4357;
            font-size: 14px;
        }

        table {
            border: 1px solid #f1f1f1;
            margin-top: 40px;
        }

        .Preservation,.export {
            background: #3E4C72;
            color: #fff;
        }
        .Preservation{
          margin-top: -15px;
        }
        .del{
            color: #E44849;
        }
        .see{
            color:#5A76C9;
        }
        .alertModal {
            position: absolute;
            top: 0;
            right: 0;
            width: 34px;
            height: 34px;
            line-height: 34px;
            text-align: center;
            border-left: 1px solid #f1f1f1;
        }
    </style>
</head>
<body>
<blockquote>
    <p>商品促销汇总</p>
</blockquote>
<form action="#" class="form-inline PromotionForm">
    <div class="form-group" style="margin-bottom: 15px">
        <div class="col-md-12 col-sm-12">
            <div class="form-group has-feedback" id='datetimepicker1'>
                <label for="" >&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;日期</label>
                <input type="text" class="form-control test-item" placeholder="2018-5-12">
                <span class="glyphicon glyphicon-calendar form-control-feedback"></span>
            </div>
            <div class="form-group has-feedback">
                <label for="">&nbsp;&nbsp;至&nbsp;&nbsp;</label>
                <input type="text" class="form-control test-item" placeholder="2018-5-12">
                <span class="glyphicon glyphicon-calendar form-control-feedback"></span>
            </div>
            <div class="form-group has-feedback" style="margin-left: 20px;">
                <label for="">货号:</label>
                <input type="text" class="form-control " placeholder="">
                <span class="glyphicon glyphicon-option-horizontal sr-only" ></span>
            </div>
        </div>
    </div>
    <button type="button" class="btn btn-default Preservation">查询</button>
    <div class="form-group" >
        <div class="col-md-12 col-sm-12 ">
            <div class="form-group">
                <label for="">单据状态:</label>
                <select name="" id="" class="form-control" style="width: 195px;">
                    <option value="">所有分类</option>
                    <option value="">分类1</option>
                    <option value="">分类2</option>
                </select>
                <span></span>
            </div>
            <div class="form-group">
                <label for="">业务单号:</label>
                <select name="" id="" class="form-control" style="width: 165px;">
                    <option value="">直接特价</option>
                    <option value="">直接折扣</option>
                </select>
            </div>
            <div class="form-group has-feedback" style="margin-left: 20px;">
                <label for="">门店:</label>
                <input type="text" class="form-control "  >
                <span class="glyphicon glyphicon-option-horizontal alertModal" data-toggle="modal" data-target=".myModal"></span>
            </div>
        </div>
    </div>
    <button type="button" class="btn btn-default export" >导出</button>
</form>

<table class="table table-hover tableBox">
    <tr style="background: #F2F1F1">
        <th>序号</th>
        <th>货号</th>
        <th>品名</th>
        <th>数量</th>
        <th>原价</th>
        <th>售价</th>
        <th>销售金额</th>
        <th>让利金额</th>
        <th>类别</th>
    </tr>
    <tr>
        <td>1001</td>
        <td>111</td>
        <td>名称</td>
        <td>直接特价</td>
        <td>已开启</td>
        <td>2018-02-15</td>
        <td>2018-02-16</td>
        <td>姓名</td>
        <td>2018-02-16</td>
    </tr>
    <tr>
        <td>1001</td>
        <td>111</td>
        <td>名称</td>
        <td>1</td>
        <td>1</td>
        <td>3</td>
        <td>4</td>
        <td>10.0</td>
        <td>分类1</td>
    </tr>
</table>
<!--弹出层-->
<div class="modal fade myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">门店管理</h4>
            </div>
            <div class="modal-body" style="height:300px;overflow:auto; ">
                <form action="" class="form-inline">
                    <div class="form-group">
                        <label for="" class=" control-label">过滤</label>
                        <input type="text" class="form-control">
                        <button type="button" class="btn btn-default">查询</button>
                    </div>
                </form>
                <table class="table table-hover">
                    <tr>
                        <th>类别编码</th>
                        <th>会员类型</th>
                    </tr>
                    <tr>
                        <td>001</td>
                        <td>会员类型</td>
                    </tr>
                </table>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary btnConfirm" style="background: #232B42">确认</button>
            </div>
        </div>
    </div>
</div>
</body>
<script src="__PUBLIC__/jquery/js/jquery.min.js"></script>
<script src="__PUBLIC__/bootstrap/js/bootstrap.js"></script>
<script src="__PUBLIC__/retail/discount/js/center.js"></script>
<script src="__PUBLIC__/retail/discount/laydate/laydate.js"></script>
<script>
    // 日期
    lay('.test-item').each(function () {
        laydate.render({
            elem: this,
            trigger: 'click'
        });
    });

    //  删除
    $(".tableBox").on("click",'.del', function () {
        $(this).parents('tr').remove();
    })

</script>
</html>