{extend name="layout/base" /}
{block name="detail_css"}
<link rel="stylesheet" href="__STATIC__/lib/Select Into/css/select_style.css">
<link rel="stylesheet" href="__STATIC__/lib/Select Into/css/chosen.css">

<style>
    body {
            background: unset;
            font-size:12px !important;
        }

        .layui-form-label {
            width: 112px;
        }


        .layui-textarea {
            width: 350px;
        }


        .chosen-container.chosen-container-multi {
            display: inline-block;
        }


        select[name="gongneng_state"] {
            height: 38px;
        }

        .addRule {
            position: absolute;
            left: 616px;
        }

        .add label {
            width: 154px;
        }

        .add .layui-form-item .layui-input-inline {
            width: 263px;
        }


        .fl_r {
            float: right;
        }

        .fl_l {
            float: left;
        }

        .pd_t_5 {
            padding-top: 5px;
        }

        .pd_t_8 {
            padding-top: 8px;
        }

        .mg_l_20 {
            margin-left: 20px;
        }

        .mg_l {
            margin-left: 142px;
        }

        .mg_r_5 {
            margin-right: 5px;
        }


        .no_border {
            border: 0;
        }


        .ruleText {
            font-size: 18px;
        }

        .wrap {
            width: 670px;
            display: flex;
            justify-content: space-between;
            margin-bottom: 20px;
        }
</style>
{/block}

{block name="content"}
<div class="x-body">
        <form>
            <div class="add_content">
             	{notempty name="rule_list"} 
             	{volist name="rule_list" id="rvo"}
	            <section class="x-body add" id="section{$i}">
	            	<div class="wrap"><h1 class="ruleText">规则<span></span></h1><button type="button" class="layui-btn layui-btn-danger J_delete_rule">删除规则</button></div>
	            	<div class="layui-form-item"><label for="" class="layui-form-label">预警时间阈值：</label><div class="layui-input-inline"><input type="text" autocomplete="off" class="layui-input" value="{$rvo.warning_time}" placeholder="" name="warn_time"></div><div class="layui-form-mid layui-word-aux"><span class="x-red">单位：分钟，必须正整数</span></div></div>
	            	<div class="layui-form-item"><label for="" class="layui-form-label">连续充值成功订单阈值：</label><div class="layui-input-inline"><input type="text" autocomplete="off" class="layui-input" value="{$rvo.order_count}" placeholder="" name="warn_succeed_order"></div><div class="layui-form-mid layui-word-aux"><span class="x-red">单位：笔，必须正整数</span></div></div>
	            	<div class="layui-form-item">
	            		<label class="layui-form-label">金额预警：</label>
	            		<div class="layui-input-inline" style="width: 100px;"><input type="text" name="price_min" placeholder="￥" autocomplete="off" class="layui-input J_price_min" value="{$rvo.min_amount}"></div>
	            		<div class="layui-form-mid">≦金额≦</div><div class="layui-input-inline" style="width: 100px;"><input type="text" name="price_max" placeholder="￥" autocomplete="off" class="layui-input J_price_max" value="{$rvo.max_amount}"></div>
	            		<div class="layui-form-mid layui-word-aux"><span class="x-red">单位：元，必须正整数</span></div>
	            	</div>
	            	<div class="layui-form-item"><label class="layui-form-label">是否包括6元：</label><div class="layui-input-inline pd_t_8"><label class="mg_r_5">是</label><input type="radio" name="includeSix_{$i}" value="1" title="是" {if condition="$rvo.is_six eq 1" }checked{/if} lay-filter="radios"><label class="mg_l_20 mg_r_5">否</label><input type="radio" name="includeSix_{$i}" value="0" {if condition="$rvo.is_six eq '0'" }checked{/if} title="否" lay-filter="radios"></div></div>
	            	<hr>
	            </section>
             	{/volist} 
             	{/notempty}
            </div>
            <button type="button" class="layui-btn layui-btn-normal addRule">添加规则</button>
            <div class="layui-form-item">
                <label class="layui-form-label">功能状态：</label>
                <div class="layui-input-inline">
                    <select lay-search id="J_status" name="status" lay-filter="filter">
                        <option value="1" {if condition="$settingInfo.status eq 1" }selected="selected" {/if}>开启</option>
                        <option value="0" {if condition="$settingInfo.status eq '0'" }selected="selected" {/if}>关闭</option>
                    </select>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">白名单渠道：</label>
                <div class="layui-input-block pd_t_5">
                    <select data-placeholder="请选择白名单渠道" id="whiteListChannel" class="chosen-select" multiple tabindex="1" name="whitelist_channel">
                        <option value=""></option>
                        {notempty name="channel_list"} 
                        {volist name="channel_list" id="cvo"}
                        <option value="{$cvo.id}" {if condition="in_array($cvo.id,$whitelist_channels)"}selected="selected" {/if}>{:escape($cvo.name)}</option>
                        {/volist} 
                        {/notempty}
                    </select>
                </div>
            </div>

            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">收件人邮箱：</label>
                <div class="layui-input-block">
                    <textarea name="emails" id="J_emails" placeholder="" class="layui-textarea">{:str_replace(';',"\\n",$settingInfo.emails)}</textarea>
                </div>

                <div class="layui-form-mid layui-word-aux mg_l">
                    <span class="x-red">多个邮箱请换行，一个邮箱一行</span>
                </div>
            </div>

            <div class="layui-form-item">
                <div class="layui-input-block mg_l">
                    <button type="button" class="layui-btn layui-btn-normal" id="J_save">保存</button>
                </div>
            </div>

        </form>
    </div>
{/block}


{block name="detail_js"}
<script src="__STATIC__/lib/Select Into/js/chosen.jquery.js" type="text/javascript"></script>
<script src="__STATIC__/lib/Select Into/js/select_init.js" type="text/javascript" ></script>
<script>
	$(document).ready(function () {
	    //chosen初始化  
	    $(".chosen-select").chosen();
	    //多选select 数据同步  
	    chose_get_ini('#whiteListChannel');
	    //change 事件  
	    $('#whiteListChannel').change(function () {
	    });
	})
	
	
	var body = document.body;
	var add_content = document.getElementsByClassName("add_content")[0];
	var count = {:count($rule_list)};
	
	layui.use(['form'], function () {
	    var form = layui.form;
	
	    $(".addRule").on("click", function () {
	      
	        count++;
	        var my_form = document.getElementsByTagName("form")[0];
	        var obj_section = document.createElement("section");
	        obj_section.className = "x-body add"; //layui-form
	        obj_section.setAttribute("id", "section" + count)
	        obj_section.innerHTML =
	            '<div class="wrap"><h1 class="ruleText">规则<span></span></h1><button type="button" class="layui-btn layui-btn-danger J_delete_rule">删除规则</button></div><div class="layui-form-item"><label for="" class="layui-form-label">预警时间阈值：</label><div class="layui-input-inline"><input type="text" autocomplete="off" class="layui-input" value="1" placeholder="" name="warn_time"></div><div class="layui-form-mid layui-word-aux"><span class="x-red">单位：分钟，必须正整数</span></div></div><div class="layui-form-item"><label for="" class="layui-form-label">连续充值成功订单阈值：</label><div class="layui-input-inline"><input type="text" autocomplete="off" class="layui-input" value="2" placeholder="" name="warn_succeed_order"></div><div class="layui-form-mid layui-word-aux"><span class="x-red">单位：笔，必须正整数</span></div></div><div class="layui-form-item"><label class="layui-form-label">金额预警：</label><div class="layui-input-inline" style="width: 100px;"><input type="text" name="price_min" placeholder="￥" autocomplete="off" class="layui-input J_price_min"></div><div class="layui-form-mid">≦金额≦</div><div class="layui-input-inline" style="width: 100px;"><input type="text" name="price_max" placeholder="￥" autocomplete="off" class="layui-input J_price_max"></div><div class="layui-form-mid layui-word-aux"><span class="x-red">单位：元，必须正整数</span></div></div><div class="layui-form-item"><label class="layui-form-label">是否包括6元：</label><div class="layui-input-inline pd_t_8"><label class="mg_r_5">是</label><input type="radio" name="includeSix_' +
	            count +
	            '" value="1" title="是" lay-filter="radios" ><label class="mg_l_20 mg_r_5">否</label><input type="radio" name="includeSix_' +
	            count + '" value="0" title="否" checked lay-filter="radios"></div></div><hr>'
	
	        add_content.appendChild(obj_section);
	    });
	
	
		//删除规则
	    $(body).on("click", ".J_delete_rule", function () {
	        $(this).parent().parent().remove();
	    });
	
		//保存按钮
	    $("#J_save").on("click", function () {
	
	        //白名单渠道
	        console.log(chose_get_value('#whiteListChannel'));
	
	        // 预警时间阈值
	        var warn_time_Ary = [];
	        for (var i = 0; i < $("input[name=warn_time]").length; i++) {
	            warn_time_Ary.push($("input[name=warn_time]").eq(i).val());
	
	        }
	        console.log(warn_time_Ary);
	
	
	        //连续充值成功订单阈值
	        var warn_succeed_order_Ary = [];
	        for (var i = 0; i < $("input[name=warn_succeed_order]").length; i++) {
	            warn_succeed_order_Ary.push($("input[name=warn_succeed_order]").eq(i).val());
	
	        }
	        console.log(warn_succeed_order_Ary);
	
	
	        //金额预警 最小值 
	        var price_min_Ary = [];
	        for (var i = 0; i < $(".J_price_min").length; i++) {
	            price_min_Ary.push($(".J_price_min").eq(i).val());
	            // console.log($(".J_price_min"));
	        }
	        console.log(price_min_Ary);
	
	
	
	        //金额预警 最大值 
	        var price_max_Ary = [];
	        for (var i = 0; i < $(".J_price_max").length; i++) {
	            price_max_Ary.push($(".J_price_max").eq(i).val());
	        }
	        console.log(price_max_Ary);
	
	
	        //是否包括6元
	        var radioAry = [];
	        for (var i = 0; i < $("input[type=radio]:checked").length; i++) {
	            radioAry.push($("input[type=radio]:checked").eq(i).val());
	
	        }
	        console.log(radioAry);
	
	        var request_data = {
	            "status": $("select[id=J_status] option:selected").val(),
	            "whitelist_channel": chose_get_value('#whiteListChannel'),
	            "emails": $("#J_emails").val().split(/[\n]/),
	            "warning_time": warn_time_Ary,
	            "order_count": warn_succeed_order_Ary,
	            "min_amount": price_min_Ary,
	            "max_amount": price_max_Ary,
	            "is_six": radioAry
	        }
	
	        console.log(request_data);
	
	        //ajax提交
	        $.ajax({
	            url: "{:url('payPost')}",
	            data: request_data,
	            type: "post",
	            dataType: "json",
	            timeout: 5000,
	            success: function (data) {
	            	
	            	layer.alert(data['msg']);
	            },
	            error: function (err) {
	            	layer.alert('网络错误，请重试');
	            }
	        })
	    })
	});
	
	
	
	
	//select 数据同步  
	function chose_get_ini(select) {
	    $(select).chosen().change(function () {
	        $(select).trigger("liszt:updated");
	    });
	}
	
	//select value获取  
	function chose_get_value(select) {
	    return $(select).val();
	}
	
	//select text获取，多选时请注意  
	function chose_get_text(select) {
	    return $(select + "option:selected").text();
	}


</script>
{/block}