{% extends 'obj_form.html' %}
{% load i18n %}
{% load tj_filters %}

<script type="text/javascript" src='/static/js/tinymce/tinymce.min.js'></script> 


{% block css %}
    {{ block.super }}
    #obj_form .datepicker{
        width:100px
    }
    #obj_form select.adm{
        min-width:100px;
        margin-left:5px;
    }
    #product_label{
        min-width:380px;
        margin-left:15px;
        margin-right:7px;
    }
    #obj_form .btn-del{
        float:right;
    }  

    #obj_form .checkbox { 
        padding-left:20px;
    }
    #obj_form .select2_multiple{
        max-height:80px;
    }

{% endblock %}



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

    {% if is_saved %}
        $('#tb_outlet .btn-location').unbind('click');        
    {% endif %}

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



    $.ajax({
        url: "/gis/adm/1/",
        success: function(data) { 
            var provinces="<option value=''>---------------</option>";
            $.each(data,function(i,d){
                provinces=provinces+"<option value='"+d[0]+"'>"+d[1]+"</option>";
            });
            $('#obj_form select.province').html(provinces);
            $('#tb_outlet tbody tr').each(function(){    
                var me=$(this);
                var s,v;
                s=$(me).find('.province_gis').val();
                if (s!='{}'){
                    v=JSON.parse(s).id;
                    $(me).find('.province option[value="'+v+'"]').attr("selected",true);
                    $.ajax({
                        url: "/gis/adm/2/"+v+"/",
                        success: function(data) {
                            var html="<option value='' selected='selected'>---------</option>";
                            $.each(data,function(i,d){
                                html=html+"<option value='"+d[0]+"'>"+d[1]+"</option>";
                            });
                            $(me).find('.city').html(html);
                            s=$(me).find('.city_gis').val();
                            if (s!='{}'){
                                v=JSON.parse(s).id;
                                $(me).find('.city option[value="'+v+'"]').attr("selected",true);
                                $.ajax({
                                    url: "/gis/adm/3/"+v+"/",
                                    success: function(data) {
                                        var html="<option value='' selected='selected'>---------</option>";
                                        $.each(data,function(i,d){
                                            html=html+"<option value='"+d[0]+"'>"+d[1]+"</option>";
                                        });
                                        $(me).find('.county').html(html);
                                        s=$(me).find('.county_gis').val();
                                        if (s!='{}'){
                                            v=JSON.parse(s).id;
                                            $(me).find('.county option[value="'+v+'"]').attr("selected",true);
                                        }
                                    },
                                    dataType: 'jsonp',
                                    jsonp: 'callback'
                                });
                            }
                        },
                        dataType: 'jsonp',
                        jsonp: 'callback'
                    });
                };
            });
        },
        dataType: 'jsonp',
        jsonp: 'callback'
    });    

    $('#tb_outlet').on('change','.province',function(){
        var id=$(this).val();
        var tr=$(this).closest('tr');
        $.ajax({
            url: "/gis/adm/2/"+id+"/",
            success: function(data) {
                var html="<option value='' selected='selected'>---------</option>";               
                $.each(data,function(i,d){
                    html=html+"<option value='"+d[0]+"'>"+d[1]+"</option>";
                });
                $(tr).find('.city').html(html);
            },
            dataType: 'jsonp',
            jsonp: 'callback'
        }); 
    });
    $('#tb_outlet').on('change','.city',function(){
        var id=$(this).val();
        var tr=$(this).closest('tr');
        $.ajax({
            url: "/gis/adm/3/"+id+"/",
            success: function(data) {
                var html="<option value='' selected='selected'>---------</option>";               
                $.each(data,function(i,d){
                    html=html+"<option value='"+d[0]+"'>"+d[1]+"</option>";
                });
                $(tr).find('.county').html(html);
            },
            dataType: 'jsonp',
            jsonp: 'callback'
        }); 
    });

    $('.btn-add-outlet').click(function(){
        var prefix='#id_outlet_company-';             
        var count = $('#tb_outlet tbody tr').length; 
        var tmplMarkup = '<tr class="p">'+$(prefix+'__prefix__').html()+'</tr>';    
        var compiledTmpl = tmplMarkup.replace(/__prefix__/g, count);     
        $('#tb_outlet tbody').append(compiledTmpl);    
        $(prefix+'TOTAL_FORMS').attr('value', (count+1));

        $('#tb_outlet tbody tr:last').find('.btn-location').tooltip({
            title:'点击设置门店地理位置',
		    placement:'left',
		    animation:'true',
		    container:'#tb_outlet',
		    trigger:'hover'        
        });
    });

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

    $('.add-status').click(function(){   
        var id=$("#status").val();
        var label=$("#status").find("option:selected").text();            
        var e=false;
        $("#sel-status 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-status').append("<option value='"+id+"'>"+label+"</option>");
        };              
    });
    $('.add-series').click(function(){   
        var id=$("#series").val();
        var label=$("#series").find("option:selected").text();            
        var e=false;
        $("#sel-series 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-series').append("<option value='"+id+"'>"+label+"</option>");
        };              
    });   
    
    $('.btn-save').click(function(){
        $('.btn').hide();

        $('#tb_outlet tbody tr').each(function(){    
            var me=$(this);
            var v,d;            
            v=$(me).find('.province').val();
            if (v!=''){
                d={
                    'id':v,
                    'name':$(me).find(".province option:selected").text()
                };
                $(me).find('.province_gis').val(JSON.stringify(d));
            };  
            v=$(me).find('.city').val();
            if (v!=''){
                d={
                    'id':v,
                    'name':$(me).find(".city option:selected").text()
                };
                $(me).find('.city_gis').val(JSON.stringify(d));
            };           
            v=$(me).find('.county').val();
            if (v!=''){
                d={
                    'id':v,
                    'name':$(me).find(".county option:selected").text()
                };
                $(me).find('.county_gis').val(JSON.stringify(d));
            };        
            if($(me).find('.name').val()==''){
                $(me).find('input[type="checkbox"]').prop('checked',true);
            };
        });   
        
        $.SubmitForm('#obj_form form','{{request.path}}',btn_app_show);
    });

    $('#id_division').change(function(){
        var me=$('#id_sub_division');
        var d=$(this).val();
        $('#id_sub_division').empty();
        if (d!=''){
            $.ajax({
                url: "/company/json/subdivision/"+d+"/",
                success: function(data) {
                    data=data.details;
                    $.each(data,function(i,d){$(me).append("<option value='"+d[0]+"'>"+d[1]+"</option>")});
                    $(me).append("<option value='' selected='selected'>---------</option>");
                }
            });
        }
    });    




    $('#obj_form .select2_multiple option').tooltip({
		title:'双击删除',
		placement:'left',
		animation:'true',
		container:'#obj_form',
		trigger:'hover'
	});

    $('#obj_form .btn-location').tooltip({
        title:'点击设置门店地理位置',
		placement:'left',
		animation:'true',
		container:'#tb_outlet',
		trigger:'hover'        
    });







    
    //2020-11-24
    $('#data-content .btn-delete').click(function(){
        $.ajax({
            url:'/obj/delete/agent/{{form.instance.id}}/',                             
            success: function(data) {
                if(data.cnt>0){  
                    toastr.success('当前经销商已删除!', '操作成功：',
                        {timeOut: 800, positionClass: "toast-center-center"}
                    );
                    $.RefreshContent("/obj/list/agent/");                   
                };
            },

        });       
    
    });

    //$('.btn-confirm').unbind('click').bind('click',function(){    
    //        $(this).hide();   



    //$('#tb_outlet').on('click','.btn-location',function(){
    //$('#tb_outlet .btn-location').click(function(){

    //2023-02-14 防止事件重复，解绑后再绑定
    $('#tb_outlet').off('click','.btn-location').on('click','.btn-location',function(){       
        event.preventDefault(); 
        var tr=$(this).closest('tr');
        var gis_city_id=$(tr).find('.city').val();
        var name=$(tr).find('.name').val();
        var series_name=$(tr).find('.series option:selected').text(); 
        var obj_id=$(tr).find("input[id$='-id']").val(); 
        if($.isEmpty(gis_city_id) || $.isEmpty(name) || $.isEmpty(series_name)){
            toastr.error("请先设置门店名称和所在城市及授权品牌！", "操作错误：",
                {timeOut: 800, positionClass: "toast-center-center"}
            );
            return;            
        }else{            
            var url='/company/franchise/outlet/';                
            url=url+"?lng_lat="+$(tr).find('.lng_lat').val()+
                "&el_id="+$(tr).find('.lng_lat').attr('id')+
                "&gis_city_id="+gis_city_id+
                "&outlet_name="+name+
                "&obj_id="+obj_id; 
       

            //console.log("$.OpenUrlCfmDlg("+url,name+" ["+series_name+"]地理位置：,保存,取消)");
            
            $.OpenUrlCfmDlg(url,name+" ["+series_name+"] 地理位置：","保存","取消");
        }
    }); 



    function btn_app_show(){
            $('.btn_approve').show();
        }

    $('.approve').click(function(){
        event.preventDefault();

        var id = '{{ form.instance.id }}'
        var name=$("#id_name").val();

        var msg =  name + ':\n您确定要通过当前加盟商的审核吗？';
        if (confirm(msg) == true) {
            $.ajax({
                type: 'GET',
                processData: false,
                contentType: 'application/json; charset=utf-8',
                url: '/company/franchise/action/agent/approve/' + id + '/',
                success: function (data) {
                    $('.approve').html('已审核');
                    $('.approve').attr({"disabled":"disabled"});

                }
            });
        } ;
    })



    $('.btn-new-franchise').click(function(){
        var url=$(this).attr('href')
        event.preventDefault();
        
        alert(url);

        $.RefreshContent(url);   
    });

{% endblock %}


{% block subtitle %}
    <ol class="breadcrumb">
        <li>{% trans '经销商管理' %}</li>
        <li>{% trans '加盟商信息' %}</li>

        {% if is_saved %}
            <a type="button" class='btn btn-obj-add l-a create-btn pull-right'  href="/obj/edit/agent/">
                <span class='glyphicon glyphicon-plus' style='padding-right:5px;'></span>
                {% trans '新建加盟商' %}
            </a>
        {% endif %}
    </ol>
{% endblock %}


{% block form_content %}
    {{ block.super }}    
    <div class="form-group ">
        <label class="col-sm-1 control-label ">{% trans '外部编码:' %}</label>
        <!--<div class="col-sm-5">{{ form.external_code }}</div>-->        
        {% if  id  %}
            <div class="col-sm-5" onchange="checkCode({{ id }})">{{ form.external_code }}</div>
        {% else %}
            <div class="col-sm-5" onchange="checkCode(0)">{{ form.external_code }}</div>
        {% endif %}


        <label class="col-sm-1 control-label ">{% trans '归属部门:' %} </label>
        <div class="col-sm-5">{{ form.sub_division }}</div>
    </div>
    <div class="form-group ">
        <label class="col-sm-1 control-label ">{% trans '加盟商名:' %} </label>
        {% if  id  %}
            <div class="col-sm-5" onchange="checkAgentName({{ id }})">{{ form.name }}</div>  
        {% else %} 
            <div class="col-sm-5">{{ form.name }}</div> 
        {% endif %}
        <label class="col-sm-1 control-label">{% trans '联系人:' %}</label>
        <div class="col-sm-1">{{ form.contacts }} </div>
         <label class="col-sm-1 control-label">{% trans '电话:' %}</label>
        <div class="col-sm-1">{{ form.cell_phone }} </div>
         <label class="col-sm-1 control-label">{% trans '职务:' %}</label>
        <div class="col-sm-1">{{ form.title }} </div>
    </div>

    <div class="form-group ">
        <label class="col-sm-1 control-label ">{% trans '查询老师:' %}</label>
        <div class="col-sm-5">{{ form.qry_teacher }}</div>        

        <label class="col-sm-1 control-label ">{% trans '首查时间:' %} </label>
        <div class="col-sm-5">{{ form.qry_time }}</div>
    </div>

    <div class="form-group">
        <label class="col-sm-1 control-label ">{% trans '备注说明:' %} </label>
        <div class="col-sm-11">{{ form.remark }}</div>
    </div>


    <div class="form-group">
        <label class="col-sm-1 control-label ">{% trans '加盟状态:' %} </label>
        <div class="col-sm-5">
            <div class="input-group" style="width: 100%;">
            {{ form.franchisestatus }}
            </div>
        </div>
        <label class="col-sm-1 control-label ">{% trans '授权品牌:' %} </label>
        <div class="col-sm-5">
            <div class="input-group" style="width: 100%;">
            {{ form.series }}
            </div>
        </div>    
    </div>        


    <table style="display:none;">
        <tr id="id_outlet_company-__prefix__">                
            {{empty_form.id}}                         
            <td>{{empty_form.DELETE }}</td>   
            <td>{{empty_form.name}}</td> 
            <td>{{empty_form.province_gis}}<select class='province' /></td>
            <td>{{empty_form.city_gis}}<select class='city' /></td> 
            <td>{{empty_form.county_gis}}<select class='county' /></td>            
            <td>{{empty_form.series}}</td>
            <td>{{empty_form.status}}</td>
            <td>{{empty_form.remark}}</td>
            <td><div class="input-group">{{empty_form.address}}{{empty_form.lng_lat}}
                <span class="input-group-btn"><a class='btn btn-success btn-location'>
                    <span class='glyphicon glyphicon-map-marker'></span></a></span>                  
            </div></td>
        </tr>
    </table>
    <div  class="form-group">
        <label class='control-label'>加盟商门店信息：</label>
        <a type="button" class='btn btn-success btn-xs btn-add-outlet'>
            <span class='glyphicon glyphicon-plus' style='padding-right:5px;'></span>
            {% trans '添加门店' %}
        </a>

        <span class="btn_approve" style="display:none;"><button class="approve btn btn-sm btn-primary">审核通过</button></span>

        <a type="button" class='btn btn-primary btn-save' style="float:right;">
            <span class='glyphicon glyphicon-floppy-disk' style='padding-right:5px;'></span>{% trans '保存' %}
        </a>
    </div>
    <div class='table-responsive'>
        <table id='tb_outlet' class="table table-condensed table-bordered table-hover">
            <thead><tr>
                <th style='width:30px;padding-left:0px;padding-right:0px;'>{% trans '删除' %}</th>
                <th>{% trans '分店名称 ' %}</th>
                <th style='width:100px;'>{% trans '省份' %}</th>
                <th style='width:100px;'>{% trans '城市' %}</th>
                <th style='width:100px;'>{% trans '区/县' %}</th>                
                <th style=' width:80px;'>{% trans '授权品牌' %}</th>
                <th style='width:100px;'>{% trans '门店状态' %}</th>  ·
                <th>{% trans '特殊情况' %}</th>  
                <th>{% trans '详细地址' %}</th>
            </tr></thead>
            <tbody>{% for f in formset %}<tr>
                <td>{{f.DELETE}}{{f.id}}</td> 
                <td>{{f.name}}</td>
                <td>{{f.province_gis}}<select class='province' /></td>
                <td>{{f.city_gis}}<select class='city' /></td>
                <td>{{f.county_gis}}<select class='county' /></td>                
                <td>{{f.series}}</td>
                <td>{{f.status}}</td>
                <td>{{f.remark}}</td>
                <td><div class="input-group">{{f.address}}{{f.lng_lat}}
                    <span class="input-group-btn"><a class='btn btn-success btn-location'>
                        <span class='glyphicon glyphicon-map-marker'></span></a></span>                  
                </div></td>
            </tr>{% endfor %}</tbody>
            {{ formset.management_form }}  
        </table>
    </div>
{% endblock %}


