xiaoben-as2-php/protected/views/print/review_setting.php

<link rel="stylesheet" href="/fonts/fpdf/iconfont.css"/>
<link rel="stylesheet" href="/css/alert.css"/>
<style>
    .color-red{
        color: red;
    }
    .en-tfb-grade-1 .date>span{
        margin-right: 40px;
    }
    .option-wrap{
        margin-top: 20px;
        min-width: 600px;
    }
    .option-name{
        display: inline-block;
        width: 100px;
        vertical-align: top;
        margin-top: 10px;
    }
    .option-con{
        display: inline-block;
        width: 80%;
        min-width: 490px;
        padding: 10px;
        border: 1px solid #ccc;
    }
    .option-con>span{
        display: inline-block;
        margin-right: 20px;
        line-height: 1rem;
        cursor: pointer;
    }
    .select-grade{
        width: 150px;
        line-height: 30px;
        margin-bottom: 10px;
    }
    .option-con-class label{
        display: inline-block;
        margin-right: 20px;
    }
    .active{
        color: #619aff;
    }
    .btn-start{
        display: inline-block;
        margin-top: 20px;
        margin-left: 100px;
        padding: 10px 30px;
        color: #fff;
        background-color: #2977ff;
        cursor: pointer;
    }
    .en-tfb-grade-1{
        margin-left: 20px;
    }
    .hgc_leader-btn {
        display: flex;
        justify-content: space-between;
        padding: 10px 0;
        font-size: 14px;
    }

    .hgc_leader-btn span {
        display: flex;
        align-items: center;
        cursor: pointer;
    }

    .hgc_leader-btn span .icon {
        width: 15px;
        height: 15px;
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAWCAYAAADNX8xBAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHXSURBVDhPnZS/S4JRFIZvYlDQYOBg0ODg4ODW4ugaNDT2HxRE0NA/EA0NFQUNDRENjQUN0dRQQVDgEmQ4aBQouLQVJBTZ816PpvX5o154Oufce87r57X7uU6qOReBsJV/16dzU5DHpEZ8g2MYt+3+ZCYVTKZhCKLUa1Aij1hbbzGgJ5kmzmgYstRJ4j6sWFugBiw2zqTEwijxkaUNmIBXOIX5kHOTxECx15QGpIT+sLGF6R5pklgklrXeSU0jmj8IFxAD5Q3prGS+XC/7EANxziIN+mqqM6Bf7wXebS/N2pAf6CYzaxop1yDxQKZCa5CAtB9CrWfUSU987So8YHJFPQhl6gLxBLMzNXkjGsL6BOU9VLSzLDKzTj5GridLhVhIgn72Agvn5DpsL/JnQq5etYv+ezPVE0dlNEtxBMNwC8fgxePmYEE5fTcMXPqNIPEUq3BopepN8IfdSewnMB6xXN8io0/SfcrLwHch8kVLe6ppJJHEfpr1KxlBysr/m9F/zWzcyrr+akZ/hF69dn6/AFvMtgMbWkTPEuxa+VtmloU7ct23NkNqXaMd8FfFloOlYZrmQG9H3S+96DRYAf8KZj1q7d8vtm5iIEnw//Hkumeiqrou574AaXrOncWtEY0AAAAASUVORK5CYII=') no-repeat center;
        background-size: contain;

    }

    .hgc_leader-btn span:nth-child(2) .icon {
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAWCAYAAADAQbwGAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAE6SURBVDhP7ZStTgNBFEZvmwpkRUUFsqJJKyoqKhBIRCWiD4CkggRPeAIEgodA8gAYEgQPgICktrJJDUkJ5dztV5id7KZDlqA4ydf7N/duZtIZK+PD7Bi9rM3WoTyHTrQsDRoHNK3QEs0iLTV4rOW7YfGNmiZKfUFupNq9UjlqFI5qZm3FGTRcY/bQlNpblgygfkW+iT3DLpR2Fj5wRbKhRGV84CkDW/gXm5RdyqYS9n3vxs/FpTCZuK8u+2sUDuQYJsj/b33Ft+hRfgc9o3OPYwoHcqZd1NHZOkP8kTvYfa/j9jyO+ZstV+F/YHVSB77LOqFfTniF+GmhQ+QvjsddNJDfQAcoe6GwxVe2tLCDuC+3ZbKvcpOh50FuHu7m3fZrPxW9TxrjV3MDhTbyl3p7f1OZM8Rf7rmZ2Sd4TZIuop129AAAAABJRU5ErkJggg==') no-repeat center;
        background-size: contain;
    }

    .hgc_leader-btn i {
        font-style: normal;
    }

    .hgc_option-con label {
        position: relative;
        padding: 5px;
        padding-right: 30px;
        border: 1px solid #999;
    }

    .hgc_option-con .icon {
        position: absolute;
        top: 50%;
        right: 5px;
        transform: translateY(-50%);
        width: 15px;
        height: 15px;
        background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAWCAYAAADAQbwGAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAE6SURBVDhP7ZStTgNBFEZvmwpkRUUFsqJJKyoqKhBIRCWiD4CkggRPeAIEgodA8gAYEgQPgICktrJJDUkJ5dztV5id7KZDlqA4ydf7N/duZtIZK+PD7Bi9rM3WoTyHTrQsDRoHNK3QEs0iLTV4rOW7YfGNmiZKfUFupNq9UjlqFI5qZm3FGTRcY/bQlNpblgygfkW+iT3DLpR2Fj5wRbKhRGV84CkDW/gXm5RdyqYS9n3vxs/FpTCZuK8u+2sUDuQYJsj/b33Ft+hRfgc9o3OPYwoHcqZd1NHZOkP8kTvYfa/j9jyO+ZstV+F/YHVSB77LOqFfTniF+GmhQ+QvjsddNJDfQAcoe6GwxVe2tLCDuC+3ZbKvcpOh50FuHu7m3fZrPxW9TxrjV3MDhTbyl3p7f1OZM8Rf7rmZ2Sd4TZIuop129AAAAABJRU5ErkJggg==') no-repeat center;
        background-size: contain;
        cursor: pointer;
    }
    #kp .kp-name{
        display: inline-block;
        margin-right: 20px;
    }
</style>


<div class="main-content-inner">
    <!--    导航栏开始-->
    <?php include(Yii::app()->basePath.'/views/layouts/view_production_navigation.php');?>
    <!--    导航栏结束-->
    <div class="en-tfb-grade-1">
        <h2>二轮学习指导手册</h2>

        <p class="date">
            <span>生成方式：</span>
            <span><input type="radio" name="create_type" checked value="1">自动生成（根据学生历次考试大数据）&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="create_type" value="2">手动生成（自主选择考点范围）</span>
        </p>
        <div class="option-wrap">
            <span class="option-name">专题:</span>
            <div class="option-con" id="optionEdition">
                <?php if(isset($special_arr) && $special_arr):?>
                    <?php $no =1;?>
                    <?php foreach($special_arr as $k=>$v):?>
                        <span code="<?php echo $v['special_id'];?>" class="special-name <?php echo $no==1?'active':'';?>"><?php echo $v['special_name'];?></span>
                        <?php $no++;?>
                    <?php endforeach;?>
                <?php endif;?>
            </div>
        </div>
        <div class="option-wrap kp-select-area" style="display:none ">
            <span class="option-name">知识点:</span>
            <?php if(isset($special_arr) && $special_arr):?>
                <?php $no =1;?>
                <?php foreach($special_arr as $k=>$special):?>
                    <div class="option-con"  id="special_item_<?php echo $special['special_id'];?>" style="display: <?php echo $no == 1?'':'none';?>">
                        <div class="option-con-class" id="kp">
                            <?php if($special['kps']):?>
                                <?php foreach($special['kps'] as $item):?>

                                        <span code="<?php echo $item['kp_id'];?>" class="kp-name <?php echo $no==1?'active':'';?>"><?php echo $item['kp_name'];?></span>

                                    <?php $no++;?>
                                <?php endforeach;?>
                            <?php endif;?>
                        </div>
                    </div>

                <?php endforeach;?>
            <?php endif;?>
        </div>
        <div class="option-wrap method-select-area" style="display:none ">
            <span class="option-name">考点:</span>
            <?php if(isset($special_arr) && $special_arr):?>
                <?php $no =1;?>
                <?php foreach($special_arr as $k=>$special):?>
                    <?php foreach($special['kps'] as $i=>$method):?>
                    <div class="option-con method-list"  id="method_item_<?php echo $method['kp_id'];?>" style="display: <?php echo $no == 1?'':'none';?>">
                        <div class="hgc_leader-btn select-all">
                            <span class="color-red" is_all="1"><i class="icon"></i>全选</span>
                            <span class="color-red" is_all="0"><i class="icon"></i>全不选</span>
                        </div>
                        <div class="option-con-class" id="">
                            <?php if($method['methods']):?>
                                <?php foreach($method['methods'] as $item):?>
                                    <label>
                                        <input type="checkbox" name="option-class" value="<?php echo $item['method_id'];?>" item_name="<?php echo $item['method_name'];?>">
                                        <?php echo $item['method_name'];?>
                                    </label>
                                <?php endforeach;?>
                            <?php endif;?>
                        </div>
                    </div>
                    <?php $no++;?>
                <?php endforeach;?>
                <?php endforeach;?>
            <?php endif;?>
        </div>
        <div class="option-wrap">
            <span class="option-name">已选择:</span>
            <div class="option-con">
                <div class="hgc_leader-btn">
                    <span>已选<i class="color-red item-num">0</i>个选项</span>
                    <span class="color-red clear-all-item"><i class="icon"></i>清空所有选项</span>
                </div>
                <div class="option-con-class hgc_option-con special-item-box">
<!--                    <label>一般现在时<i class="icon"></i></label>-->
                </div>
            </div>
        </div>

        <div class="option-wrap">
            <span class="option-name">班级:</span>
            <div class="option-con">
                <div class="option-con-class"  id="optionClass">
                </div>
            </div>
        </div>

        <span class="btn-start" id="confirm" active="true">开始生成</span>


    </div>

</div>
<input type="hidden" value="1" class="is-new-version"/>
<script src="/js/jquery.ajaxfileupload.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        var createType=1;   //生成类型
        var grade=3;
        var kpId=$('#kp').find('span').eq(0).attr('code');
        getClassByGrade(grade);


        //增加专项
        function addItem(id,name) {
            var ele = '<label item_id="'+id+'">'+name+'<i class="icon selected-item"></i></label>';
            $(".special-item-box").append(ele);
        }

        function itmeNume() {
            $(".item-num").text($(".special-item-box>label").length);
        }

        //切换生成类型
        $('input[name=create_type]').click(function(){
            if($(this).val()==1){
               // $('#method_item_'+kpId).find('span').eq(1).click();
                $('.method-select-area').find('.method-list').each(function(){
                    $(this).find('span').eq(1).click();
                })
                $('.kp-select-area').hide();
                $('.method-select-area').hide();
            }else{
                $('.kp-select-area').show();
                $('.method-select-area').show();
            }
            createType=$(this).val();

        });
        //切换专题
        $(".special-name").click(function () {
            $("#optionEdition>span").removeClass('active')
            $(this).addClass('active');
            var specialId = $(this).attr('code');
            $('#special_item_'+specialId).show().siblings('.option-con').hide();
            kpId=$('#special_item_'+specialId).find('span').eq(0).attr('code');
            $('#method_item_'+kpId).show().siblings('.option-con').hide();

            $(".select-all>span").eq(1).click();
            $('.clear-all-item').click();
            getClassByGrade(grade);
            $('#optionClass').html('');
        });

        // 切换知识点
        $('.kp-name').click(function(){
            if(createType==1){
                return false;
            }
            $("#kp>span").removeClass('active')
            $(this).addClass('active');
            kpId = $(this).attr('code');
            $('#method_item_'+kpId).show().siblings('.option-con').hide();

        });
        //选择专项
        $(".select-all>span").click(function () {
            if(createType==1){
                return false;
            }
            var input_arr = $(this).parent().siblings('.option-con-class').children('label').children('input');
            //全选
            if ($(this).attr('is_all') > 0) {
                if (input_arr) {
                    $.each(input_arr,function () {
                        if (!$(this).is(':checked')) {
                            $(this).prop("checked",true);
                            addItem($(this).val(), $(this).attr('item_name'));
                        }
                    })
                }
            }else{//全不选
                if (input_arr) {
                    $.each(input_arr,function () {
                        if ($(this).is(':checked')) {
                            $(this).prop("checked",false);

                            var item_id = $(this).val();
                            $('label[item_id="'+item_id+'"]').remove();
                        }
                    })

                }
            }
            itmeNume();


        });

        //选择单个专项
        $('input[name="option-class"]').change(function () {
            if(createType==1){
                $(this).attr('checked',false);
                return false;
            }
            if (!$(this).is(':checked')) {
                var item_id = $(this).val();
                $('label[item_id="'+item_id+'"]').remove();
            }else{
                addItem($(this).val(), $(this).attr('item_name'));
            }
            itmeNume();
        });

        //清空所有选项
        $(".clear-all-item").click(function () {
            $.each($(".special-item-box>label"),function () {
                $('input[value="'+$(this).attr('item_id')+'"]').prop("checked",false);
            })
            $(".special-item-box").empty();
            itmeNume();
        });
        //清空单个选项
        $("body").delegate(".selected-item", "click", function() {
            $('input[value="'+$(this).parent('label').attr('item_id')+'"]').prop("checked",false);
            $(this).parent('label').remove();
            itmeNume();
        });


        var optionData={
            edition:0,
            modular:0,
            unit:0,
            class:[],
        }


        // 单选按钮
        $("input[name='option-class']").change(function() {
            getsClassSelected();
        });

        function getsClassSelected() {
            optionData.class=[];
            var selectedData = $("input[name='option-class']:checked"); //获取所以选中学生
            for (var i = 0; i < selectedData.length; i++) {
                code = $(selectedData[i]).val();
                optionData.class.push(code);
            }
        };


        var active=true;
        $("#confirm[active='true']").on("click", function() {
           
            if(!active){
                return false;
            }
            active=false;

            var error = [];
            var selectClassIds = [];
            var selectedItemIds = [];

            var specialId = parseInt($('#optionEdition span.active').attr("code"));
            var specialName = $('#optionEdition span.active').html();
            var isNewVersion=parseInt($('.is-new-version').val());

            $('#optionClass input:checked').each(function(k,v){
                if($(this).attr("status") == 0){
                    selectClassIds.push($(this).val());
                }
            });
            $(".special-item-box>label").each(function(k,v){
                if($(this).attr("item_id")){
                    selectedItemIds.push($(this).attr("item_id"));
                }
            });

            if(selectedItemIds.length == 0 && createType==2){
                error.push("请选择考点");
            }
            if(selectClassIds.length == 0){
                error.push("请选择班级");
            }

            var data={
                grade:3,
                selectClassIds:selectClassIds,
                selectedItemIds:selectedItemIds,
                createType:createType,
                special:specialId,
                specialName:specialName,
                isNewVersion:isNewVersion
            };

            if(error.length == 0){
                var index=layer.msg('正在发送中，请稍候。。。。。。',{time:0});
                $.ajax({
                    url: "<?php echo $this->createUrl('print/ajaxSaveMathReview');?>",
                    type: "POST",
                    dataType: "json",
                    data: data,
                    success: function (data) {
                        layer.close(index);
                        if(data.status == 1){
                            layer.msg('已发送到后台，预计1小时左右生成！', {
                                time: 2000,
                            });
                            setTimeout(function(){window.location.href = "<?php echo Yii::app()->createUrl('print/review');?>";}, 2000);

                        }else{
                            layer.msg(data.error.join('</br>'));
                            active=true;
                        }
                    }

                });
            }else{

                active=true;
                layer.msg(error.join('</br>'));
            }
        });
        function getClassByGrade(grade){
            var specialId = parseInt($('#optionEdition span.active').attr("code"));

            if(grade){
                $.ajax({
                    url: "<?php echo $this->createUrl('print/ajaxGetClassesBySettingMath');?>",
                    type: "POST",
                    dataType: "json",
                    data: {
                        grade: grade,
                        specialId:specialId
                    },
                    success: function (data) {
                        var html = '';
                        if(data && data.length > 0){
                            for(var i in data){
                                html +='<label>';
                                if(data[i].status == 1){
                                    html += '   <input type="checkbox" name="option-class" value="'+data[i].class_id+'" checked="checked" disabled="disabled" status="1">'+data[i].class_name;
                                }else{
                                    html += '   <input type="checkbox" name="option-class" value="'+data[i].class_id+'" status="0">'+data[i].class_name;
                                }

                                html +='</label>';
                            }
                        }
                        $('#optionClass').html(html);
                    }

                });
            }
        }

    });


</script>