{% block commission %}
<form action="" method="POST" enctype="multipart/form-data" id="commissionManage" class="form-inline">
    <div class="row" >
        <div class="col-xs-10">
            <div class="row">
                <div class="col-md-8">
                    <div id="staffImg">
                        {% if consultant %}
                            <div style = "display: inline-block;">
                                <div class="row" style="margin-bottom:10px">
                                    <div class="col-md-3">
                                        <label>员工：</label>
                                    </div>
                                    <div class="col-md-5">
                                        <img height="100" width="100" src="{{ consultant.imageUrl }}" style="margin-right: 50px">
                                    </div>
                                    <div class="col-md-4">
                                        <label>{{ consultant.name }}</label>
                                    </div>
                                </div>
                                <div class="row" style="margin-top: 10px;">
                                    <div class="col-md-12">
                                        <label>部门：</label><input type="text">
                                    </div>
                                </div>
                                <input type="hidden" name="data[recConsultant]" value="{{ consultant.consultanId }}">
                            </div>
                        {% endif %}
                        <button type="button" class="btn btn-success" data-toggle="modal" data-target="#myConsultant" id="recConsultantBt">
                            选择员工
                        </button>
                    </div>
                </div>
            </div>
            <br/>
            <div class="row">
                <div class="col-md-8">
                    <label for="intent">目标业绩：</label>
                    <input name="intent" id="intent" type="text"  class="form-control"{% if commission %}value="{{commission.intent}}" readonly {% endif %}>元
                </div>
            </div>
            <br/>
            <div class="row">
                <div class="col-md-8">
                    <label for="completeRate">达成率：</label>
                    <input id="completeRate" type="text"  class="form-control" readonly>
                </div>
            </div>
            <br/>
            <div class="row">
                <div class="col-md-8">
                    <label for="businessType">应佣类型：</label>
                    <select name="businessType">
                        <option value="0">买卖</option>
                        <option value="1">租赁</option>
                    </select>
                </div>
            </div>
            <br/>
            <div class="row">
                <div class="col-md-8">
                    <label for="accounts">应收佣金：</label>
                    <input name="accounts" id="accounts" type="text"  class="form-control" {% if commission %}value = "{{commission.accounts}}" readonly {% endif %}>元
                </div>
            </div>
            <br/>
            <div class="row">
                <div class="col-md-8">
                    <button type="button" class="btn btn-success" id="paid">
                        添加实收佣金
                    </button>
                </div>
            </div>
            <input type="text" name="type" value="4" hidden="hidden">

            <table class="form-table">
                <tbody id="paidTbody">

                </tbody>
            </table>
            {% if commissionLog %}
            <div class="panel panel-default">
                <div class="panel-heading">实收佣金列表</div>
                <table class="table">
                    <tbody id="commissionList">
                        <tr>
                            <th>实收时间：</th>

                            <th>实收佣金：</th>
                        </tr>
                        {% for item in commissionLog %}
                        <tr>
                            <td>
                                {{item.time}}
                            </td>
                            <td class="paidList">
                                {{item.paid}}
                            </td>
                        </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
            {% endif %}

        </div>
    </div>
    {% if id %}
        <input type="hidden" name="contractId" value="{{ id }}">
    {% endif %}
</form>
{% include 'recConsultant.html' %}
{{ block('recConsultant') }}
<script>
    (function($){
        $(document).ready(function(){
            var j = 0 ;
            var urlParams = getUrlParmas();
            var sum = 0;
            init_modal_myConsultantList(addStaff);
            $("form").on('click','#paid',function(){
                var tr = $("<tr>");
                var th = $("<th>");
                var td = $("<td>");
                var paidTime = $("<input>").attr({"type":"date","name":'log['+j+'][time]'}).addClass("form-control datePicker paidTime");
                var paid = $("<input>").attr({"type":"text","name":'log['+j+'][paid]'}).addClass("form-control paidMoney");
                var paidDelet =  $("<input>").attr({"type":"button","value":"删除"}).addClass("button action paidDelet form-control");
                var th1 = th.clone().append("实收时间：");
                var td1 = td.clone().append(paidTime);
                var th2 = th.clone().append("实收佣金：");
                var td2 = td.clone().append(paid);
                var td3 = td.clone().append(paidDelet);
                tr.append(th1).append(td1).append(th2).append(td2).append(td3);
                $("#paidTbody").append(tr);
                //实收时间默认为当天时间
                var now = new Date();
                var day = ("0" + now.getDate()).slice(-2);
                var month = ("0" + (now.getMonth() + 1)).slice(-2);
                var today = now.getFullYear()+"-"+(month)+"-"+(day) ;
                $('.datePicker').val(today);
                j++;
            });

            if(urlParams.id){
                $("form").find("select[name='businessType']").val("{{ commission.type }}");
            }

            if($("#commissionList > tr").length > 1){
                //计算实收佣金的总和
                $(".paidList").each(function() {
                    var value = $(this).text();
                    if(!isNaN(value) && value.length != 0) {
                        sum += parseFloat(value);
                    }
                });
                var rate  = parseInt(sum * 100/ $("#accounts").val())+"%";
                $("#completeRate").val(rate);
            }

//            $("#accounts").change(function(){
//               var accounts =   $("#accounts").val();
//                $("#intent").val(accounts);
//            });

            $("#paidTbody").on("click",".paidDelet",function(){
                $(this).parents("tr").remove();
            })

            $('#commissionManage').validate({
                onkeyup: false,
                onfocusout: false,
                ignore: [],
                errorClass: "my-error-class",
                rules: {
                    accounts:'required',
                    intent:'required'
                },
                messages: {
                    accounts:'请输入应收佣金',
                    intent:'请输入目标业绩'
                },
                errorContainer: "#commissionMessage",
                errorLabelContainer: "#commissionMessage",
                submitHandler: function (form) {
                    if($("#paidTbody > tr").length == 0){
                        $("#commissionMessage").removeAttr("style");
                        var label = $("<label>").append("请添加实收佣金").addClass("my-error-class");
                        $("#commissionMessage").append(label);
                        return false;
                    }
                    if($("#staffImg > div").length == 0){
                        $("#commissionMessage").removeAttr("style");
                        var label = $("<label>").append("请选择员工").addClass("my-error-class");
                        $("#commissionMessage").append(label);
                        return false;
                    }
                    form.submit();
                }
            });

        });
        function addStaff(data){
            if($("#staffImg > div").length >0 ){
                $("#staffImg > div").remove();
            }
            var row = $("<div>").addClass("row").css("margin-bottom","10px");
            var row2 = $("<div>").addClass("row").css("margin-top","10px");
            var left = $("<div>").addClass("col-md-3");
            var label3 = $("<label>").append("员工：");
            left.append(label3);
            var mid = $("<div>").addClass("col-md-5");
            var img = $("<img>").attr({"src":data.imageUrl,"height":100,"width":100,"style":"margin-right:50px"});
            mid.append(img);
            var mid2 =$("<div>").addClass("col-md-4");
            var label = $("<label>").append(data.name);
            mid2.append(label);

            var div = $("<div>").addClass("col-md-12");
            var input = $("<input>").attr({"type":"text"});
            var label2 = $("<label>").append("部门：").append(input);
            div.append(label2);
            var recommendConsultant = $("<input>").attr({"type":"hidden","name":"data[recConsultant]","value":data.id});
            row.append(left).append(mid).append(mid2);
            row2.append(div);
            var div2 = $("<div>").append(row).append(row2).append(recommendConsultant).css("display","inline-block");
            $("#recConsultantBt").before(div2);
            controlCommand("staffImg",1,1);
        }
    })(jQuery);
</script>
{% endblock %}