{% extends 'obj_form.html' %}
{% load i18n %}
{% load tj_filters %}
  
    <style>       
        #province,#city{
            padding-left:0px;
            margin-left:0px;
        }       

    </style>

    {% block js %}
        {{ block.super }}        
        

        {% if not can_edit %}
            $('#data-content input,#data-content .btn,#data-content select').attr("disabled",true);
        {% endif %}
        

        {% if form.instance.company %}
            $('#co').val('{{form.instance.company.id}}');
            $('#id_activityawards_activity-__prefix__-company').val('{{form.instance.company}}');   
        {% else %}
            $('#co').val('');
            $('#product_label,#agent_label,#award_label,#alter_label').attr("disabled","disabled"); 
        {% endif %}

        $('#co').change(function(){     
            var v=$('#co').val();            
            $('#id_company').val(v);
            if(v==''){
                $('#product_label,#agent_label,#award_label,#alter_label').attr("disabled",true);               
            }else{
                $('#product_label,#agent_label,#award_label,#alter_label').attr("disabled",false);
            }     
        });
      

        {% if form.instance.id %}
            $('#co').val('{{form.instance.company_id}}'); 
        {% endif %}


        $.datetimepicker.setLocale('zh');

        $('.datetimepicker').datetimepicker({
            i18n:{
                zh:{
                    months:['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月',],
                    dayOfWeek:["一", "二", "三", "四","五", "六", "日",]
                }
            },
            //timepicker:true,
            format:'Y-m-d H:i:s',        
        });

        $('#batch_label').autocomplete({
            source: function(request, response) {
                $.ajax({
                    url: '/obj/ajax/autocomplete/batch/',
                    dataType: "json",
                    data: {
                        term:   $("#batch_label").val() ,//搜索栏里的内容
                        company_id:  $('#id_company').val() ,//额外参数
                    },
                    success: function(data) {
                        response(data);
                    }
                });
            },
            select: function (event, ui) {
                $("#batch_id").val(ui.item.value);
                $("#batch_label").val(ui.item.label);
                return false;
            }
        });
        $('#product_label').autocomplete({
            source: function(request, response) {
                $.ajax({
                    url: '/obj/ajax/autocomplete/product/',
                    dataType: "json",
                    data: {
                        term:   $("#product_label").val() ,//搜索栏里的内容
                        company_id:  $('#id_company').val() ,//额外参数
                    },
                    success: function(data) {
                        response(data);
                    }
                });
            },
            select: function (event, ui) {
                $("#product_id").val(ui.item.value);
                $("#product_label").val(ui.item.label);
                return false;
            }
        });

        $('#agent_label').autocomplete({   
            source: function(request, response) {
                $.ajax({
                    url: '/obj/ajax/autocomplete/agent/',
                    dataType: "json",
                    data: {
                        term:   $("#agent_label").val() ,//搜索栏里的内容
                        company_id:  $('#id_company').val() ,//额外参数
                    },
                    success: function(data) {
                        response(data);
                    }
                });
            },            
            select: function (event, ui) {
                $("#agent_id").val(ui.item.value);
                $("#agent_label").val(ui.item.label);
                return false;
            }
        });
        $('#level_label').autocomplete({            
            source: '/obj/ajax/autocomplete/level/',            
            select: function (event, ui) {
                $("#level_id").val(ui.item.value);
                $("#level_label").val(ui.item.label);
                return false;
            }
        });

        $('#award_label').autocomplete({ 
            source: function(request, response) {
                $.ajax({
                    url: '/obj/ajax/autocomplete/award/',
                    dataType: "json",
                    data: {
                        term:   $("#award_label").val() ,//搜索栏里的内容
                        company_id:  $('#id_company').val() ,//额外参数
                    },
                    success: function(data) {
                        response(data);
                    }
                });
            },  
            select: function (event, ui) {
                $("#award_id").val(ui.item.value);
                $("#award_label").val(ui.item.label);
                return false;
            }
        });
        $('#alter_label').autocomplete({      
            source: function(request, response) {
                $.ajax({
                    url: '/obj/ajax/autocomplete/award/',
                    dataType: "json",
                    data: {
                        term:   $("#alter_label").val() ,//搜索栏里的内容
                        company_id:  $('#id_company').val() ,//额外参数
                    },
                    success: function(data) {
                        response(data);
                    }
                });
            },            
            select: function (event, ui) {
                $("#alter_id").val(ui.item.value);
                $("#alter_label").val(ui.item.label);
                return false;
            }
        });


        //2021-01-20
        $('.add-batch').click(function(){
            var id=$('#batch_id').val();
            var label=$('#batch_label').val();
            if(id==''){
                toastr.error("请先选择营销层级！", "操作错误：",
                    {timeOut: 800, positionClass: "toast-center-center"}
                );
                return;
            }else{
                var e=false;
                $("#sel-batch option").each(function(){
                    if($(this).val() == id){
                        e=true;
                        return false;          
                    }
                });
                if(e){
                    toastr.error(label+"已在列表中！", "操作错误：",
                        {timeOut: 800, positionClass: "toast-center-center"}
                    );
                    return;
                }else{
                    $('#sel-batch').append("<option value='"+id+"'>"+label+"</option>");
                }
            };
        });










        $('.add-product').click(function(){
            var id=$('#product_id').val();
            var label=$('#product_label').val();
            if(id==''){
                toastr.error("请先选择产品！", "操作错误：",
                    {timeOut: 800, positionClass: "toast-center-center"}
                );
                return;
            }else{
                var e=false;
                $("#sel-product option").each(function(){
                    if($(this).val() == id){
                        e=true;
                        return false;          
                    }
                });
                if(e){
                    toastr.error(label+"已在列表中！", "操作错误：",
                        {timeOut: 800, positionClass: "toast-center-center"}
                    );
                    return;
                }else{
                    $('#sel-product').append("<option value='"+id+"'>"+label+"</option>");
                }
            };
        });
        $('.add-agent').click(function(){
            var id=$('#agent_id').val();
            var label=$('#agent_label').val();
            if(id==''){
                toastr.error("请先选择经销商！", "操作错误：",
                    {timeOut: 800, positionClass: "toast-center-center"}
                );
                return;
            }else{
                var e=false;
                $("#sel-agent option").each(function(){
                    if($(this).val() == id){
                        e=true;
                        return false;          
                    }
                });
                if(e){
                    toastr.error(label+"已在列表中！", "操作错误：",
                        {timeOut: 800, positionClass: "toast-center-center"}
                    );
                    return;
                }else{
                    $('#sel-agent').append("<option value='"+id+"'>"+label+"</option>");
                }
            };
        });
        $('.add-level').click(function(){
            var id=$('#level_id').val();
            var label=$('#level_label').val();
            if(id==''){
                toastr.error("请先选择营销层级！", "操作错误：",
                    {timeOut: 800, positionClass: "toast-center-center"}
                );
                return;
            }else{
                var e=false;
                $("#sel-level option").each(function(){
                    if($(this).val() == id){
                        e=true;
                        return false;          
                    }
                });
                if(e){
                    toastr.error(label+"已在列表中！", "操作错误：",
                        {timeOut: 800, positionClass: "toast-center-center"}
                    );
                    return;
                }else{
                    $('#sel-level').append("<option value='"+id+"'>"+label+"</option>");
                }
            };
        });

        $('.add-adm').click(function(){            
            var id="";;
            var label="";
            if($('#city').val()!=''){
                if($('#province').val()==''){
                    toastr.error("选择了市级区域，省级区域不能为空！", "操作错误：",
                        {timeOut: 800, positionClass: "toast-center-center"}
                    );
                    
                    return false;
                };
                id=$('#city').val();
                label=$('#province').find("option:selected").text()+$('#city').find("option:selected").text();
            }else{
                if($('#province').val()!=''){
                    id=$('#province').val();
                    label=$("#province").find("option:selected").text();
                }            
            }
            if(id==''){
                toastr.error("请先选择扫码区域！", "操作错误：",
                    {timeOut: 800, positionClass: "toast-center-center"}
                );
                return;
            }else{
                var e=false;
                $("#sel-adm option").each(function(){
                    if($(this).val() == id){
                        e=true;
                        return false;          
                    }
                });
                if(e){
                    toastr.error(label+"已在列表中！", "操作错误：",
                        {timeOut: 800, positionClass: "toast-center-center"}
                    );
                    return;
                }else{
                    $('#sel-adm').append("<option value='"+id+"'>"+label+"</option>");
                }
            };
        });


        $('.add-award').click(function(){     
            {% if not can_edit %}
                return;
            {% endif %}

            //2020-07-30 添加前数据检查
            if ($('#id_scheme').val()==3){
                if( $.isEmpty($('#award_id').val()) 
                    || $.isEmpty($('#award_name').val())
                    || $.isEmpty($('#award_name').val())
                ){
                    toastr.error("奖项名称，对应奖品不能为空", "操作错误：",
                        {timeOut: 2000, positionClass: "toast-center-center"}
                    );
                    return;
                }
            }else{
                if( $.isEmpty($('#award_id').val()) 
                    || $.isEmpty($('#award_name').val())
                    || $.isEmpty($('#award_name').val())
                    || $.isEmpty($('#rate').val())
                ){
                    toastr.error("奖项名称，对应奖品, 抽奖概率不能为空", "操作错误：",
                        {timeOut: 2000, positionClass: "toast-center-center"}
                    );
                    return;
                }                
            };
            

            var prefix='#id_activityawards_activity-';  
            $(prefix+'__prefix__-name').val($('#award_name').val());                
            $(prefix+'__prefix__-award').val($('#award_id').val());
            $(prefix+'__prefix__-alternative').val($('#alter_id').val());  
            $(prefix+'__prefix__ .award_name').text($('#award_name').val());
            $(prefix+'__prefix__ .award').text($('#award_label').val());
            $(prefix+'__prefix__ .alternative').text($('#alter_label').val());           

            $(prefix+'__prefix__ .needcheck').text($('#needcheck').find("option:selected").text()); 
            var count = $('#tb_award tbody tr').length; 
            var tmplMarkup = '<tr class="p">'+$(prefix+'__prefix__').html()+'</tr>';    
            var compiledTmpl = tmplMarkup.replace(/__prefix__/g, count);     
            $('#tb_award tbody').append(compiledTmpl);   

            //添加后的设置INPUT值            
            $(prefix+count+'-qty_upper').val($('#qty_upper').val());  
            $(prefix+count+'-qty_input').val($('#qty_input').val()); 
            $(prefix+count+'-qty_daily').val($('#qty_daily').val()); 
            $(prefix+count+'-rate').val($('#rate').val()); 

            $(prefix+'TOTAL_FORMS').attr('value', (count+1));   
        });


        $('.select2_multiple').on('click','option',function(){
            $(this).remove();
        });


        $('.btn-save').click(function(){
            {% if not can_edit %}
                return;
            {% endif %}
            
            var a=[];
            $("#sel-product option").each(function (){
                a.push($(this).val());
            });  
            if(a.length>0){
                $('#id_products').val(a.join(','));
            }else{
                $('#id_products').val('');
            };

            a=[];
            $("#sel-agent option").each(function (){
                a.push($(this).val());
            });  
            if(a.length>0){
                $('#id_agents').val(a.join(','));
            }else{
                $('#id_agents').val('');
            };

            a=[];
            $("#sel-level option").each(function (){
                a.push($(this).val());
            });  
            if(a.length>0){
                $('#id_agent_lvs').val(a.join(','));
            }else{
                $('#id_agent_lvs').val('');
            };

            a=[];
            $("#sel-adm option").each(function (){
                a.push($(this).val());
            });  
            if(a.length>0){
                $('#id_adm_ids').val(a.join(','));
            }else{
                $('#id_adm_ids').val('');
            };

            //2021-01-20
            a=[];
            $("#sel-batch option").each(function (){
                a.push($(this).val());
            });            
            if(a.length>0){
                $('#id_batch_ids').val(a.join(','));
            }else{
                $('#id_batch_ids').val('');
            };


            
            $.SubmitForm('#obj_form form','{{request.path}}');
        });      

        
        $("#province").change(function() {
            var province_id = $(this).val();
            getCity(province_id);
        });        
        function getCity(province_id) {
            var me=$("#city");
            $.ajax({
                url: "/gis/adm/2/"+province_id+"/",
                success: function(data) {
                    $(me).empty();
                    $('#area').empty();
                    $.each(data,function(i,d){$(me).append("<option value='"+d[0]+"'>"+d[1]+"</option>")});
                    $(me).append("<option value='' selected='selected'>---------</option>");
                },
                dataType: 'json',                
            });
        };
      


    {% endblock %}


    {% block subtitle-1 %}
        {% trans "营销活动" %}
    {% endblock %}
    {% block subtitle-2 %}
        {% trans "活动设置" %}
    {% endblock %}

    <span style="margin-left:10px; color:green; ">
        {% block subtitle-3 %}
            {% if form.instance.id %}
                {% trans "修改" %}
            {% else %}
                {% trans "新建" %}
            {% endif %}
        {% endblock %}

    </span>



{% block form_content %}
    {{ block.super }}    
    <div class="form-group ">
        <label class="col-sm-1 control-label ">{% get_verbose_field_name form.instance 'company' %} </label>
        <div class="col-sm-5">
            <select id='co'>
                {% for co in companys %}
                    <option value='{{co.0}}'>{{co.1}}</option>
                {% endfor %}
                <option value=''>------------------------------</option>
            </select>        
        </div>
        
        <label class="col-sm-1 control-label ">{% get_verbose_field_name form.instance 'name' %} </label>
        <div class="col-sm-5">{{ form.name }}</div>
        <!--
        <label class="col-sm-1 control-label ">{% get_verbose_field_name form.instance 'digest' %} </label>
        <div class="col-sm-5">{{ form.digest }}</div>
        -->
        

    </div>
   
    <div class="form-group ">
        <label class="col-sm-1 control-label ">{% get_verbose_field_name form.instance 'target' %} </label>
        <div class="col-sm-2">{{ form.target }}</div>
         <label class="col-sm-1 control-label ">{% get_verbose_field_name form.instance 'lblpkg_id' %} </label>
        <div class="col-sm-2">{{ form.lblpkg_id }}</div>
        <label class="col-sm-1 control-label ">{% get_verbose_field_name form.instance 'distribution' %} </label>
        <div class="col-sm-2">{{ form.distribution }}</div>
        <label class="col-sm-1 control-label ">{% get_verbose_field_name form.instance 'priority' %} </label>
        <div class="col-sm-2">{{ form.priority }}</div>
    </div>
    <div class="form-group ">
        <label class="col-sm-1 control-label ">{% get_verbose_field_name form.instance 'wx_account' %} </label>
        <div class="col-sm-2">{{ form.wx_account }}</div>
        <label class="col-sm-1 control-label ">{% get_verbose_field_name form.instance 'scheme' %} </label>
        <div class="col-sm-2">{{ form.scheme }}</div>
        <label class="col-sm-1 control-label ">{% get_verbose_field_name form.instance 'template' %} </label>
        <div class="col-sm-2">{{ form.template }}</div>
        <label class="col-sm-1 control-label ">{% get_verbose_field_name form.instance 'background' %} </label>
        <div class="col-sm-2">{{ form.background }}</div>
    </div>
    <div class="form-group ">
        <label class="col-sm-1 control-label">{% get_verbose_field_name form.instance 'products' %}</label>
        <div class='col-sm-2'>
            <div class="input-group">
                <input type="text" class="form-control" id="product_label" placeholder="所有产品">
                <input type="hidden" id="product_id" />
                <span class="input-group-btn"><button type="button" class="btn btn-success add-product">
                <span class='glyphicon glyphicon-arrow-down'></span></button></span>
            </div>        
        </div>  

        <label class="col-sm-1 control-label">{% get_verbose_field_name form.instance 'agents' %}</label>
        <div class='col-sm-2'>
            <div class="input-group">            
                <input  class=' form-control' id="agent_label" placeholder='所有经销商'/>
                <input type="hidden" id="agent_id" />
                <span class="input-group-btn"><button type="button" class="btn btn-success add-agent">
                    <span class='glyphicon glyphicon-arrow-down'></span></button></span>
            </div>
        </div> 

        <label class="col-sm-1 control-label">{% get_verbose_field_name form.instance 'agent_lvs' %}</label>
        <div class='col-sm-2'>
            <div class="input-group"> 
                <input  class=' form-control' id="level_label" placeholder='所有层级'/>
                <input type="hidden" id="level_id" />
                <span class="input-group-btn"><button type="button" class="btn btn-success add-level">
                    <span class='glyphicon glyphicon-arrow-down'></span></button></span>
            </div>        
        </div> 

        <label class="col-md-1 control-label">{% get_verbose_field_name form.instance 'adm_ids' %}</label>  
        <div class='col-md-1'>
            <select id="province" class="form-control adm">
                {% for p in prs %}
                    <option value="{{p.0}}">{{p.1}}</option>
                {% endfor %}
                <option value="" selected="selected">---------</option>
            </select>
        </div>
        <div class='col-md-1'>    
            <div class="input-group"> 
                <select id="city" class="form-control adm">
                    <option value="" selected="selected">---------</option>                
                </select>
                <span class="input-group-btn"><button type="button" class="btn btn-success add-adm">
                    <span class='glyphicon glyphicon-arrow-down'></span></button></span>
            </div>
        </div>   
    </div>

    <div class="form-group" style='margin-top:-28px;'>
        <div class='col-sm-2 col-md-offset-1'>
            <select class="select2_multiple form-control" id="sel-product" multiple="multiple">
                {% for o in products %}
                    <option value='{{o.0}}'>{{o.1}}</option>
                {% endfor %}                                     
            </select>        
        </div>
        <div class='col-sm-2 col-md-offset-1'>
            <select class="select2_multiple form-control" id='sel-agent' multiple="multiple">
                {% for o in agents %}
                    <option value='{{o.0}}'>{{o.1}}</option>
                {% endfor %}   
                                  
            </select>        
        </div>
        <div class='col-sm-2 col-md-offset-1'>
            <select class="select2_multiple form-control" id="sel-level" multiple="multiple">
                {% for o in levels %}
                    <option value='{{o.0}}'>{{o.1}}</option>
                {% endfor %}                       
            </select>        
        </div>
        <div class='col-sm-2 col-md-offset-1'>
            <select class="select2_multiple form-control" id="sel-adm" multiple="multiple">
                {% for o in adms %}
                    <option value='{{o.0}}'>{{o.1}}</option>
                {% endfor %}        
            </select>        
        </div>
    </div>    




    <div class="form-group ">
        <label class="col-md-1 control-label">发货批次</label>  
        <div class='col-sm-5'>
            <div class="input-group">            
                <input  class=' form-control' id="batch_label" placeholder='输入指定的发货批次(单号)'/>
                <input type="hidden" id="batch_id" />
                <span class="input-group-btn"><button type="button" class="btn btn-success add-batch">
                <span class='glyphicon glyphicon-arrow-down'></span></button></span>
            </div>
        </div>       
    </div>
    <div class="form-group" style='margin-top:-28px;'>        
        <div class='col-sm-11 col-md-offset-1'>
            <select class="select2_multiple form-control" id='sel-batch' multiple="multiple">
                {% for o in batch_ids %}
                    <option value='{{o.0}}'>{{o.1}}</option>
                {% endfor %}   
                                  
            </select>        
        </div>       
    </div> 








     <div class="form-group ">
        <label class="col-sm-1 control-label">{% get_verbose_field_name form.instance 'tm_start' %}</label>
        <div class='col-sm-2'> {{ form.tm_start }}</div>
        <label class="col-sm-1 control-label">{% get_verbose_field_name form.instance 'tm_end' %}</label>
        <div class='col-sm-2'> {{ form.tm_end }}</div>
        <label class="col-sm-1 control-label">{% get_verbose_field_name form.instance 'status' %}</label>
        <div class='col-sm-2'> {{ form.status }}</div>
        <label class="col-sm-1 control-label">{% get_verbose_field_name form.instance 'digest' %}</label>
        <div class='col-sm-2'> {{ form.digest }}</div>

    </div>





{% endblock %}





{% block fmset %}    
        
        <div class='col-md-1' style='padding-left:0px;'>            
            <input type="text" id='award_name' class="form-control" placeholder="{% trans '奖项名称' %}">
        </div>

        <div class='col-md-2'>
            <input type='hidden' id='award_id' />
            <input type="text" id='award_label' class="form-control"  placeholder="{% trans '奖品' %}">
        </div>
        <div class='col-md-2'>
            <input type='hidden' id='alter_id'/>
            <input id="alter_label" type="text" class="form-control"  placeholder="{% trans '超限后替代品' %}">
        </div>
        <div class='col-md-1'><select  class="form-control" id='needcheck' >
                <option value='False'>{% trans '不需审核' %}</option>
                <option value='True'>{% trans '需要审核'%}</option>
            </select>
        </div>

        <div class='col-md-1'><input type="text" class="form-control" id='rate' placeholder="{% trans '中奖概率' %}"></div>
        <div class='col-md-1'><input type="text" class="form-control" id='qty_upper' placeholder="{% trans '上限数量' %}"></div>
        <div class='col-md-1'><input type="text" class="form-control" id='qty_input' placeholder="{% trans '投放数量' %}"></div> 
        <div class='col-md-1'><input type="text" class="form-control" id='qty_daily' placeholder="{% trans '每日上限' %}"></div> 

        <table style="display:none;">
            <tr id="id_activityawards_activity-__prefix__" >                
                {{formset.empty_form.id}}{{formset.empty_form.activity}}{{formset.empty_form.name}}
                {{formset.empty_form.award}}{{formset.empty_form.alternative}}               
                <td>{{ formset.empty_form.DELETE }}</td>               
                <td><span class='award_name'></span></td> 
                <td><span class='award'></span></td> 
                <td><span class='alternative'></span></td>    
                <td>{{formset.empty_form.needcheck}}</td>  
                <td>{{formset.empty_form.rate}}</td> 
                <td>{{formset.empty_form.qty_upper}}</td>
                <td>{{formset.empty_form.qty_input}}</td> 
                <td>{{formset.empty_form.qty_daily}}</td>
            </tr>
        </table>

        <span><a type="button" class='btn btn-success add-award'>
                <span class='glyphicon glyphicon-arrow-down' style='padding-right:5px;'></span>{% trans '添加' %}
            </a></span>

        <a class="btn btn-primary btn-save" type="button" style="float:right;">
            {% trans '保存' %}
        </a>

    
    <div class='table-responsive'>
        <table id='tb_award' class="table table-condensed table-bordered table-hover">
            <thead><tr>
                <th>{% trans '删除' %}</th>
                <th>{% trans '奖项名称 ' %}</th>
                <th>{% trans '奖品 ' %}</th>
                <th>{% trans '超限后替代品' %}</th>
                <th>{% trans '中奖审核' %}</th>
                <th>{% trans '中奖概率' %}</th>
                <th>{% trans '上限数量' %}</th>
                <th>{% trans '投放数量' %}</th> 
                <th>{% trans '每日上限' %}</th> 
                
            </tr></thead>
            <tbody>
                {% for f in formset %}
                <tr  class='p'>
                    {{f.id}}{{f.activity}}{{f.name}}{{f.award}}{{f.alternative}}                    
                    <td>{{f.DELETE}}</td>      
                    <td>{{ f.instance.name }}</td>
                    <td>{{ f.instance.award.name }}</td>
                    <td>{{ f.instance.alternative.name}}</td>    
                    <td>{{ f.needcheck}}</td>
                    <td>{{ f.rate }}</td>
                    <td>{{ f.qty_upper}}</td>
                    <td>{{ f.qty_input}}</td>   
                    <td>{{ f.qty_daily}}</td> 
                </tr>
                {% endfor %}
            </tbody>
            {{ formset.management_form }}                
        </table>
    </div>



    
{% endblock %}
