<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="decorator" content="base"/>
    <link rel="stylesheet" href="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/style/admin.css" media="all">
    <link rel="stylesheet" href="${ctxPlugin}/static/css/reset.css" media="all">
    <link rel="stylesheet" href="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/style/formSelects-v4.css" media="all">
    <style>
        html{background-color: #fff;padding-bottom: 50px;}
        .layui-form-select dl{
            max-height:200px;
            width: 80%;
        }
        .border-s{border: 1px #DDD dashed; padding: 20px 0; width: 95%; margin: 0 auto; border-radius: 10px;margin-bottom: 10px}
        .xm-select-parent .xm-select {
            min-height: 32px;
        }
        .layui-btn.black-cloth{display: block}

        .remoDiv{
            display: none;
        }
        .layui-table tr{
            text-align: center;
        }
    </style>
</head>
<body>

<div class="layui-form">
    <div class="layui-card mt-10">
        <input name="id" value="${apply.columns.id}" hidden>
        <input name="type" value="${type}" hidden>

        <div id="anyDiv">
            <span style="margin-left: 30px">功能说明：代理商质保金结算方案设置</span>
                <div class="layui-row border-s">
                    <div class="layui-col-xs12">

                        <div class="layui-col-xs6 mb-15 pr-30 diDiv">
                            <div class="layui-inline ">
                                <label class="layui-form-label w-130"><i class="red">*</i>结算方式：</label>
                                <div class="layui-input-block">
                                    <select name="rangeTap" id="rangeTap" lay-filter="rangeTap" lay-verify="required">
                                        <option value="">请选择</option>
                                        <option value="1"  <c:if test="${apply.columns.way eq '1'}"> selected</c:if>>按瓦数</option>
                                        <option value="2" <c:if test="${apply.columns.way eq '2'}"> selected</c:if>>按组件块数</option>
                                        <option value="3" <c:if test="${apply.columns.way eq '3'}"> selected</c:if>>按结算费比例</option>
                                    </select>
                                </div>
                            </div>
                        </div>

                        <div class="layui-col-xs6 mb-15 jiesuanbili  <c:if test="${apply.columns.way ne '3'}"> remoDiv</c:if>">
                            <div class="layui-inline">
                                <label class="layui-form-label w-130"><i class="red">*</i>结算规则：</label>

                                   <div class="layui-inline " style="display: flex; align-items: center">
                                        <span>结算费 * </span>
                                       <input type="text" class="layui-input"  name="amount" id="amountBai" lay-verify="required" style="margin-left:10px; width: 100px" value="${apply.columns.proportion}" >
                                       <span class="pos-a h-32 lh-32 layui-span-unit" >%</span>
                                   </div>
                                </div>
                        </div>

                        <div class="layui-col-xs6 mb-15 washu-kuaishu <c:if test="${apply.columns.way eq '3'}"> remoDiv</c:if>">
                            <div class="layui-inline">
                                <label class="layui-form-label w-130"><i class="red">*</i>结算规则：</label>
                                <div class="layui-inline  ">
                                    <input type="text" class="layui-input"  name="amount" id="amount" lay-verify="required" value="${apply.columns.proportion}" >
                                    <span class="pos-a h-32 lh-32 layui-span-unit  amountUnit" >元/瓦</span>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
        </div>
    </div>
    <div class="operate-footer" >
        <input type="button" id="confirm" class="layui-btn " value="保存">
        <input type="button"   value="取消" class="layui-btn layui-btn-primary " onclick="closeDiv();" >
    </div>
</div>


<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/layui/layui.js"></script>
<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/lib/formSelects-v4.js"></script>
<script type="text/javascript">
    //初始数据
    var form;
    var formSelects;
    var cou=0;
    var addIndex = '';
    layui.config({
        base: '${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'tableExt', 'jquery', 'layer','laypage','laydate','form','formSelects'], function(){
        $ = layui.jquery;
        form = layui.form;
        formSelects = layui.formSelects;


        form.on('select(rangeTap)', function(data){
            var rangeTap = data.value;
            if("1"==rangeTap){
                $(".amountUnit").html("元/瓦")
                $(".washu-kuaishu").removeClass("remoDiv");
                $(".jiesuanbili").addClass("remoDiv");
            }else if("2"==rangeTap){
                $(".amountUnit").html("元/块")
                $(".washu-kuaishu").removeClass("remoDiv");
                $(".jiesuanbili").addClass("remoDiv");
            }else if("3"==rangeTap){
                $(".washu-kuaishu").addClass("remoDiv");
                $(".jiesuanbili").removeClass("remoDiv");
            }else{
                $(".amountUnit").html("元/瓦")
                $(".washu-kuaishu").removeClass("remoDiv");
                $(".jiesuanbili").addClass("remoDiv");
            }
        });


        $("#confirm").click(function (){
            $("#confirm").attr("disabled","true");

            var con=false;

            if(con){
                $("#confirm").removeAttr("disabled");
                return false;
            }
            con=true;
            var type=$("input[name='type']").val();
            var way=$("#rangeTap").val();
            var amount=$("#amount").val();
            if("3"==way){
                amount=$("#amountBai").val();
                if (amount <= 0 || amount >= 100) {
                    layer.msg("结算比例只能在0到100之间!", {icon: 5, anim: 6})
                    $("#confirm").removeAttr("disabled");
                    return;
                }
            }

            if(isBlank(way)){
                layer.msg("请选择结算方式", {icon: 5, anim: 6})
                return
            }
            if(isBlank(amount)){
                layer.msg("请输入结算规则", {icon: 5, anim: 6})
                return
            }
            var data={
                way:way,
                type:type,
                amount:amount
            };
            $.ajax({
                url:'${ctx}/accountSet/saveOtherAccountSet',
                method:'post',
                data:data,
                success:function(res){
                    con=false;
                    if(res.code=="200"){
                        layer.msg("保存成功",{time:2000},function(){
                            parent.layer.closeAll();
                            parent.window.location.reload();
                        });
                    } else{
                        layer.msg(res.errMsg,{time:3000});
                        $("#confirm").removeAttr("disabled");
                    }
                },
                error:function (data) {
                }
            }) ;
        })

    })

    function  closeDiv() {
        var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
        parent.layer.close(index);
    }

    function isBlank(val) {
        if (val == null || val == '' || val == undefined) {
            return true;
        }
        return false;
    }

    function closeThisDiv(){
        $("#trades tr").remove();
        $("#choiceTrader").addClass("layui-hide")
        layer.close(addIndex);
    }

    function deleteTr(that){
        $(that).parent().parent().remove();
        $("#trades tr").each(function(index){
            $(this).find("td:first").text(index+1);
        })
    }




</script>
</body>
</html>




