<style>
.elput{width: 20%;margin-left: 428px;padding-left: 53px}
.sdiv{margin-top:18px;}
.dianm{margin-top: 0px}
.ssele{width: 91%}
.slable{margin-left:0px}
.bdiv{background-color: #fff;box-shadow:none;border-style:none;}
.score{border: 1px solid #ccc;margin-left:5px}
.t-e img {
    width: 16px;
	margin-left:10px;
}

.reward_box {
    margin-left: 0px !important;
    width: 700px;
    overflow: hidden;
}
</style>

<div class="col-md-10" role="main">
    <nav class="breadcrumb"></i> 客户端功能配置<span class="c-gray en">&gt;</span>打赏功能管理</nav>
    <div class="title-box">
        <p class="t-p" style="font-size: 28px; color: #7d7d7d;vertical-align: middle; padding-top: 15px; padding-bottom: 15px;">打赏功能管理</p>
        <div class="t-e">
            <img src="<?php echo asset_url('images/explain.png');?>" alt="">
            <span>说明：用于控制客户端中的帖子打赏功能。</span>
        </div>
    </div>

        <div class="bs-example bdiv">
            <form action="<?php echo site_url('mocuzfun/client_fun/save_reward')?>" method="post" class="regiswidth registerForm" enctype="multipart/form-data">
                
                <div class="reward_box" style="width:800px!important;">
                    <div class="form-group" >
                        <span class="dianm biu_tle">打赏功能：</span>
                        <input type="hidden" name="reward_switch" value="<?php echo $reward_switch['value'];?>">
                        <div class="biu_rdo">

                            <img src="<?php echo asset_url('images/unchoice.png');?>" alt="" class="biu_rdo_img " isc="0" pid="1"> <span>开启</span>
                            <img src="<?php echo asset_url('images/unchoice.png');?>" alt="" class="biu_rdo_img left_rdo" isc="0" pid="0"> <span>关闭</span>
                        </div>
                    </div>
                    
                    <div class="form-group rewaed_jf_bx" >
                        <span class="dianm biu_tle">打赏金额：</span>
                        <ul class="rewaed_je_ul">
                            <li><span>金额1</span><input type="text" name="reward_score1" value="<?php echo $reward_score1['value'];?>"/></li>
                            <li><span>金额2</span><input type="text" name="reward_score2" value="<?php echo $reward_score2['value'];?>"/></li>
                            <li><span>金额3</span><input type="text" name="reward_score3" value="<?php echo $reward_score3['value'];?>"/></li>
                            <li style="margin-right:0px;"><span>金额4</span><input type="text" name="reward_score4" value="<?php echo $reward_score4['value'];?>"/></li>
                        </ul>
                    </div>

                    <div class="form-group gn_set rewaed_jf_bxbtm" >
                        <span class="dianm biu_tle">打赏积分类型：</span>
                        <div style="float: right;">
                            <div class="gn_jf_type">
                                <p class="reward_je_p"></p> 
                                <img src="<?php echo asset_url('images/triangle.png');?>" alt="" class="sel_down">              
                            </div>
                            <input type="hidden" value="<?php echo $reward_score_type['value']?>" name="reward_score_type">
                             <ul isn="0" style="position: absolute;background-color: #FFF;">
                                    <li class="<?php !$reward_score_type['value']?'on_jf_type':'';?>" vid="0">请选择分类</li>
                                <?php
                                    foreach ($extcredits as $id => $value)
                                    {
                                        if($value['available']){

                                ?>
                                        <li class="<?php if($id == $reward_score_type['value']){echo "on_jf_type";}?>" vid="<?php echo $id;?>"><?php echo empty($value['title']) ? 'extcredit'.$id : $value['title']; ?></li>
                                <?php
                                        }
                                    }
                                ?>
                            </ul>
                        </div>
                    </div>

                     <button class="edit_btn" id="save">保存修改</button>
                </div>
            </form>    
        </div>
    </div>

<script type="text/javascript">
$(function(){
    //提交表单事件
    $("#save").on('click',function(event) {
        event.preventDefault();
        /* Act on the event */
        var reward_switch = $('input[name=reward_switch]').val();
        var reward_score_type = $('input[name=reward_score_type]').val();
        if(reward_switch == 1)
        {
            if(reward_score_type == 0)
            {
                alert('请选择积分种类');
                return false;
            }
            var regExp1 = /^[1-9]\d*$/;
            var subvalue = new Array();
            subvalue[0] = $('input[name=reward_score1]').val();  
            subvalue[1] = $('input[name=reward_score2]').val();
            subvalue[2] = $('input[name=reward_score3]').val();
            subvalue[3] = $('input[name=reward_score4]').val();
            for (i=0;i<subvalue.length;i++)
            {
                if(!regExp1.test(subvalue[i]))
                {
                    alert('请输入正确分值');
                    return false;
                }
            }
        }
        $('form').submit();
    });
    //初始化显示
    var reward_switch = $('input[name=reward_switch]').val();
    $('.biu_rdo_img').each(function(){
     if($(this).attr('pid') == reward_switch)
     {
        $(this).attr('src','<?php echo asset_url("images/choice.png");?>');
        $(this).attr('isc',1);
     }
    });

    // 单选按钮切换
    $('.biu_rdo img').click(function(){
        var pval = $(this).attr('pid');
        $('input[name=reward_switch]').val(pval); 
        var isc=$(this).attr('isc');
        if(isc==0){
            $(this).attr('src','<?php echo asset_url("images/choice.png");?>');
            $(this).attr('isc','1');
            $(this).siblings('img').attr('src','<?php echo asset_url("images/unchoice.png");?>');
            $(this).siblings('img').attr('isc','0');
        }
    })

    //初始化下拉框
    $('.gn_set ul li').each(function(index) {
        if($(this).attr('vid') == <?php echo $reward_score_type['value']?>)
        {
            $('.gn_jf_type p').text($(this).text());
        }
    });
      // 模拟下拉框
    $('.gn_jf_type,.sel_down').click(function(e){
        e.stopPropagation();
        var isn=$('.gn_set ul').attr('isn');
        if(isn==0){
            $('.gn_set ul').show();
            $('.gn_set ul').attr('isn','1');
        }else{
            $('.gn_set ul').hide();
            $('.gn_set ul').attr('isn','0');
        }
    })

    $('.gn_set ul li').mouseover(function(){
        $(this).addClass('on_jf_type');
        $(this).siblings().removeClass('on_jf_type');
    })

    $('.gn_set ul li').click(function(){
        var vid = $(this).attr('vid');
        $("input[name=reward_score_type]").val(vid);
        $('.gn_set ul').hide();
        $('.gn_set ul').attr('isn','0');
        var text=$(this).text();
        $('.gn_jf_type p').text(text);
    })
})    
</script>