{% load i18n %}

{% ifequal obj 'Award' %}
<style>
  
    #tb tbody td img{
        height:30px;
        cursor:pointer;
    }
    
</style>
{% endifequal %}
<style> 
    .word-wrap{
        width: 100%;white-space: normal;word-wrap: break-word;word-break: break-all;
    }
</style>



<script type="text/javascript">
    $(document).ready(function(){    
        var page_length=10;
       


        var table=$('#tb').DataTable({
            dom: 'Bfrtip',
            autoWidth: true,
            pageLength: page_length,
            buttons: [{extend:'excelHtml5',text: '导出到Excel'}],   
            language:lng,          
            data:{{data|safe}}
        });     
        table.columns().every( function () {                        
            var that = this;             
            $('input', this.footer() ).on( 'keyup change clear', function () {
                if ( that.search() !== this.value ) {
                    that.search( this.value ).draw();
                }
            });
        });    


    //$('#data-content').on("click", ".btn-obj-add", function () {
         
    //});  
    $(".btn-obj-add").click(function () { 
        event.preventDefault();
        $.RefreshContent($(this).attr('href'));        
    })

        $('#tb').on("click","td a",function(event){
            event.preventDefault();    

            //$.RefreshContent($(this).attr('href'));       
            event.preventDefault();
            $.OpenDlg($(this).attr('href'),'垛标明细：',1000,700);
        });   
    });
   
</script>



<ol class="breadcrumb">
        <li>{{subtt.0}}</li>
        <li>{{subtt.1}}</li>     
</ol>



{% if perms.company.sys_admin %}
    {% if show_add %}
    <div class="title_right">
        <div class="pull-right">
            <span class='input-group'> 
                <button type="button" class='btn btn-obj-add l-a create-btn' href='{{murl}}'>
                    <span class='glyphicon glyphicon-plus' style='padding-right:5px;'></span>{% trans '新建' %}
                </button>
            </span>
        </div>
    </div>
    {% endif %}
    
    {% if  murl == '/list/edit/member/' %}
    <div class="title_right">
        <div class="pull-right">
            <span class='input-group'>
                    <a type="button" class='btn btn-obj-add l-a create-btn' href='/sms_send/details/'>
                    <span class='glyphicon glyphicon-plus' style='padding-right:15px;'></span>{% trans '发送短信' %}</a>
            </span>
        </div>
    </div>
    {% endif %}
{% else %}
    {% if show_add %}
        <div class="title_right">
        <div class="pull-right">
            <span class='input-group'>
                <a type="button" class='btn btn-obj-add l-a create-btn' href='{{murl}}'>
                    <span class='glyphicon glyphicon-plus' style='padding-right:5px;'></span>{% trans '新建' %}
                </a>
            </span>
        </div>
        </div>        
    {% endif %}
{% endif%}



{% if dt %}
    <form role="form"  class="form-inline" style="margin-top:0px;padding-left:10px;">
        <div class="col-sm-2 input-group">
            <span class="input-group-addon">{% trans "开始日期"%}</span>
            <input class="datepicker form-control" id="dt_fr" />
        </div>
        <div class="col-sm-2 input-group">
            <span class="input-group-addon">{% trans "结束日期"%}</span>
            <input class="datepicker form-control" id="dt_to" />
        </div>    
        <div  class="col-sm-2 input-group">
            <span class='input-group-btn'>
                <a type="button" class='btn btn-primary btn-qry'>
                    <span class='glyphicon glyphicon-search' style='padding-right:5px;'></span>{% trans '查找' %}
                </a>
            </span>        
        </div>
    </form>
    <div class="clearfix"></div>
{% endif %}

{% if btn_name %}
        <div class="title_right">
        <div class="pull-right">
            <span class='input-group'>
                <a type="button" class='btn btn-obj-add l-a create-btn' href='{{btn_url}}'>
                    <span class='glyphicon glyphicon-search' style='padding-right:5px;'></span>{% trans btn_name %}
                </a>
            </span>
        </div>
        </div>
{% endif %}



<div class="col-md-12 col-sm-12 col-xs-12">
    <div class="x_panel">
        <div  class="table-responsive">
            <table id='tb'  class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%">
            <thead>
                {% for c in clmns %}
                    <th>{{c}}</th>
                {% endfor %}
            </thead>
            <tbody></tbody>
            <tfoot>
                {% for c in clmns %}
                    <th><input type="text" placeholder="{{c}}"></th>            
                {% endfor %}            
            </tfoot>
            </table>
        </div>
    </div>
</div>

<style>
    .edit-box {
        position: fixed;
        top: 50%;
        left: 50%;
        margin-top: -250px;
        margin-left: -350px;
        width: 500px;
        height: 300px;
        border-radius: 7px;
        box-shadow: 1px 1px 7px #444;
        background: #fff;
        padding: 1.5rem;
        display: none;
        font-size: 1.6rem;
    }
    .showEditBox {
        padding: 0.3rem 1rem;
        border: 1px solid #d5d5d5;
        border-radius: 7px;
        cursor: pointer;
        font-weight: bold;
    }
    .showEditBox:hover {
        color: #5b80c3;
        border: 1px solid #5b80c3;
    }
    .showEditBox:active {
        background: #d5d5d5;
    }
    #edit-box-id {
        font-weight: bold;
    }
    .edit-box-1, .edit-box-2, .edit-box-3 {
        border-bottom: 1px solid #d5d5d5;
        padding: 1rem 0;
    }
    .closeEditBox {
        font-size: 1.2rem;
        font-weight: bold;
        border-radius: 7px;
        cursor: pointer;
        padding: 0.4rem 0.8rem;
        border: 1px solid #d5d5d5;
    }
    .closeEditBox:hover {
        background: #d5d5d5;
    }
    .edit-box-check-btn, .edit-box-send-btn {
        font-size: 1.2rem;
        font-weight: bold;
        border-radius: 7px;
        cursor: pointer;
        padding: 0.4rem 0.8rem;
        border: 1px solid #d5d5d5;
        width: 5rem;
        text-align: center;
    }
    
    .closeEditBox:hover {
        background: #d5d5d5;
    }
</style>

<script>
    var editBoxWid = "";
    function getEditBoxInfo(wid) {
        $.ajax({
            url: '/sales/promotioncode/redeem/status/',
            method:'GET',
            data: {
                id: wid
            },
            success: function(res) {
                console.log(res);
                $('#edit-box-check').text(res.check==null?'否':'是');
                $('#edit-box-check-time').text(res.check==null?'---':res.check);
                $('#edit-box-send').text(res.send==null?'否':'是');
                $('#edit-box-send-time').text(res.send==null?'---':res.send);
                $('#edit-box-send-number').text(res.delivery==null?'---':res.delivery);
                $('.edit-box-send-btn').hide();
                $('#edit-box-input').hide();
                $('#edit-box-input').val("");
                if(res.check) {
                    $('.edit-box-check-btn').hide();
                    $('.edit-box-send-btn').show();
                    $('#edit-box-input').show();
                    if(res.delivery) {
                        $('.edit-box-send-btn').hide();
                        $('#edit-box-input').hide();
                    }
                }else {
                    $('.edit-box-check-btn').show();
                    $('.edit-box-send-btn').hide();
                    $('#edit-box-input').hide();
                }
                
            }
        })
    }
    $('.showEditBox').click(function(e) {
        $('.edit-box').css('display', 'block');
        $('#edit-box-id').text(e.currentTarget.dataset.id);
        editBoxWid = e.currentTarget.dataset.wid;
        getEditBoxInfo(e.currentTarget.dataset.wid)
    })
    $('.edit-box-check-btn').click(function(e) {

        $.ajax({
            url: '/sales/promotioncode/redeem/status/set/',
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            },
            data: {
                id: editBoxWid,
                operation: '1'
            },
            success: function(res) {
                getEditBoxInfo(editBoxWid);
            }

        })
    })
    $('.edit-box-send-btn').click(function(e) {
        var sendNumber = $('#edit-box-input').val();
        $.ajax({
            url: '/sales/promotioncode/redeem/status/set/',
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            },
            data: {
                id: editBoxWid,
                number: sendNumber,
                operation: '2'
            },
            success: function(res) {
                getEditBoxInfo(editBoxWid);
            }

        })
    })
    $('.closeEditBox').click(function() {
        $('.edit-box').css('display', 'none');
    })
</script>
<div class="edit-box">
    <div style="display:flex;justify-content: flex-end;">
        <div class="closeEditBox">
            关闭
        </div>
    </div>
   <div class="edit-box-1">
       序号
        <span id="edit-box-id"></span>
   </div>
   <div class="edit-box-2">
      <div>是否已审核:  <span id="edit-box-check" style="font-weight:bold;"></span></div>
      <div>审核时间:    <span id="edit-box-check-time" style="font-weight:bold;"></span></div>
   </div>
   <div class="edit-box-3">
        <div>是否已发货:  <span id="edit-box-send" style="font-weight:bold;"></span> </div>
        <div>发货时间:    <span id="edit-box-send-time" style="font-weight:bold;"></span> </div>
        <div>发货单号:    <span id="edit-box-send-number" style="font-weight:bold;"></span> </div>
   </div>
   <div clas="edit-box-4">
        <div class="edit-box-check-btn">审核</div>
        <div style="display: flex;">
            <input id="edit-box-input" placeholder="输入发货单号" style="border:1px solid #d5d5d5;"/>
            <div class="edit-box-send-btn">发货</div>
        </div>
        
   </div>
</div>
