{% load i18n %}


<style>
    .space{
        display:inline-block;
        width:10px;
    }    
</style>


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

        {% if obj.id %}
            $('#obj_id').val('{{obj.id}}');
        {% endif %}

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

        $('#sel-div').change(function(){
            var me=$('#sel-subdiv');
            var d=$(this).val();
            $('#sel-subdiv').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>");
                    }
                });
            }
        });

        $('.btn-add-div').click(function(){
            var id=$('#sel-div').val();
            if(has_id('sel-divs',id)){
                toastr.error(
                    "要添加的战区已在列表中!",
                    "操作错误：",
                    {timeOut: 800, positionClass: "toast-center-center"}
                );
                return;            
            };
            if(id==''){
                toastr.error(
                    "要添加的战区不能为空!",
                    "操作错误：",
                    {timeOut: 800, positionClass: "toast-center-center"}
                );
                return;            
            };               
            $('#sel-divs').append('<option value='+id+'>'+$('#sel-div').find("option:selected").text()+'</option>')
            
        });
        $('.btn-add-subdiv').click(function(){
            var id=$('#sel-subdiv').val();
            if(has_id('sel-subdivs',id)){
                toastr.error(
                    "要添加的分区已在列表中!",
                    "操作错误：",
                    {timeOut: 800, positionClass: "toast-center-center"}
                );
                return;            
            };
            if(id==''){
                toastr.error(
                    "要添加的分区不能为空!",
                    "操作错误：",
                    {timeOut: 800, positionClass: "toast-center-center"}
                );
                return;            
            };               
            $('#sel-subdivs').append('<option value='+id+'>'+$("#sel-subdiv").find("option:selected").text()+'</option>')
            
        });       

        function has_id(sel,id){
            var b=0;
            $("#"+sel+" option").each(function(i,el){
                if($(el).val()==id){
                    b=1;
                    return;
                };
            });
            return b;
        };       

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


        $('.btn-save').click(function(){
            var divs=[],subdivs=[],user_id=$('#user_id').val();  
            if(user_id==''){
                toastr.error(
                    "稽察员不能为空!",
                    "操作错误：",
                    {timeOut: 800, positionClass: "toast-center-center"}
                );
                return;                   
            }else{
                $("#sel-divs option").each(function(){
                    divs.push({'id':$(this).val(),'name':$(this).text()})                    
                });
                $("#sel-subdivs option").each(function(){
                    subdivs.push({'id':$(this).val(),'name':$(this).text()})                    
                });

                $.ajax({
                    url: '{{request.path}}',
                    type: 'POST',
                    dataType: "json",                    
                    data: JSON.stringify({
                        user_id:user_id,
                        value:{divs:divs, subdivs:subdivs}
                    }),
                    success: function(data) {
                        if(data.e!=''){
                            toastr.error(
                                data.e,
                                "操作错误：",
                                {timeOut: 800, positionClass: "toast-center-center"}
                            );                        
                        }else{
                            toastr.success('数据已保存!', '操作成功：',
                                {timeOut: 800, positionClass: "toast-center-center"}
                            );
                            $.RefreshContent("/company/bugsell/mktinspection/list/");
                        }
                    }
                });;
            }
           
        });  
    });
</script>


<ol class="breadcrumb">
    <li>{% trans "公司管理" %}</li>
    <li>{% trans "稽察授权" %}</li>   

    {% if show_add %}
        <a type="button" class='btn btn-add l-a create-btn pull-right' href="/company/bugsell/mktinspection/edit/">
            <span class='glyphicon glyphicon-plus' style='padding-right:5px;'></span>
            {% trans '新建' %}
        </a>
    {% endif %}    
</ol>


<div class="row">
<div class="col-md-12 col-sm-12 col-xs-12">
<div class="x_panel">
<br />    



<div id="obj_form" class="container" > 



<div id="obj_form"  style="width:100%;">       
    <form role="form" class="form-horizontal">     
    <div class="form-group">   
        <label class="control-label col-md-1">稽 察 员:</label>
        <div class="col-md-2">
            {% if obj.id %}
                <input type='hidden' id='user_id' value='{{obj.user.id}}' />
                <label class='control-label'>{{obj.user.username}}</label>
            {% else %}
                <select id='user_id' class='form-control'>
                    <option value="">------</option>
                    {% for u in users %}
                        <option value="{{u.id}}">{{u.username}}</option>
                    {% endfor %}
                </select>
            {% endif %}
        </div> 
        <div class="col-sm-1">
            <button type="button" class="btn btn-save btn-primary">保存</button> 
        </div>
    </div>


    <div class='clearfix'/>

    <div class="form-group" >       
        
        <label class="control-label col-md-1">责任战区:</label>
        <div class='col-sm-5'>
            <div class="input-group">
                <select class="form-control" id="sel-div">
                    <option value=''>----------</option>
                    {% for o in divs %}
                        <option value='{{o.0}}'>{{o.1}}</option>
                    {% endfor %}                    
                </select>
                <span class="input-group-btn"><button type="button" class="btn btn-success btn-add-div">
                    <span class='glyphicon glyphicon-arrow-down'></span></button></span>
            </div>
        </div>
        <label class="control-label col-md-1">责任分区:</label>
        <div class='col-sm-5'>
            <div class="input-group">
                <select class="form-control" id='sel-subdiv'>
                    <option value=''>----------</option>                
                </select> 
                <span class="input-group-btn"><button type="button" class="btn btn-success btn-add-subdiv">
                    <span class='glyphicon glyphicon-arrow-down'></span></button></span>
            </div>
        </div>         
    </div>    

    <div class="form-group" style='margin-top:-28px;'>
        <div class='col-sm-5 col-md-offset-1'>
            <select class="select2_multiple form-control" id="sel-divs" multiple="multiple">
                {% for o in obj.value.divs %}
                    <option value='{{o.id}}'>{{o.name}}</option>
                {% endfor %}        
            </select>        
        </div>
        <div class='col-sm-5 col-md-offset-1'>
            <select class="select2_multiple form-control" id="sel-subdivs" multiple="multiple">
                {% for o in obj.value.subdivs %}
                    <option value='{{o.id}}'>{{o.name}}</option>
                {% endfor %}        
            </select>        
        </div>
    </div>



    </form>
<div>
    
</div>
</div>
</div>

