xiaoben-as2-php/protected/views/homework/thirdview.php

<script src="/js/jquery.datetimepicker.js"></script>
<link rel="stylesheet" href="/fonts/fpdf/iconfont.css" />
<link rel="stylesheet" href="/css/modelCreatePaper.css" />
<link rel="stylesheet" href="/css/jquery.datetimepicker.css" />
<link rel="stylesheet" href="/css/third/paperCard.css" />
<link type="text/css"  rel="stylesheet" href="/js/select/select2.min.css" />
<link rel="stylesheet" href="/css/alert.css"/>
<script src="/js/select/select2.min.js"></script>
<style>
    #choose-error{color: #FF0000;}
    #examName-error{color: #FF0000;}
    #classIds-error{color: #FF0000;}
    #type-error{color: #FF0000;}
    #markType-error{color: #FF0000;}
    #subject-error{color: #FF0000;}
    #examDate{color: #FF0000;}
    .class-box{
        width: 500px;

    }
    .class-box>p{
        margin-bottom: 10px;
    }
    .class-box>ul{
        width: 500px;
        height: 200px;
        padding: 10px 20px;
        background-color: #FAFAFA;
        box-sizing: border-box;
        border:1px solid #ddd;
    }
    .class-box>ul>li{
        float: left;
        margin-right: 15px;
        margin-bottom: 10px;
        cursor: pointer;
    }
    .class-box>ul>li>img{
        vertical-align: middle;
        margin-left: 3px;
    }

    .class-modal-body{margin-bottom:15px;}
    #gradeTxt{display:inline-block;border-left:2px solid #2677ff;padding-left:10px;}
    .class_right{
        width:650px;
    }
    .class_area li{
        width:185px;
        height:30px;
        line-height: 30px;
        text-align: center;
        border:1px solid #ccc;
        margin:5px;
        border-radius: 3px;
        cursor:pointer
    }
    .class_area li.active{
        color:#fff;
        background: #2977ff;
        cursor:pointer
    }
    .selected-box{overflow:auto}
</style>
<div class="main-content-inner">
    <!--    导航栏开始-->
    <?php include(Yii::app()->basePath.'/views/layouts/view_navigation.php');?>
    <!--    导航栏结束-->

    <div class="test-data">
        <div class="page-content">
            <div class="mcp-title">
                <span class="active">第1步、考试基本信息</span>
                <span><i class="horizontal-line"></i></span>
                <span>第2步、关联在线答题卡</span>
            </div>
            <form class="saveForm">
                <div class="mcp-main-con">
                        <div class="mcp-form-list clearfix">
                                <div class="mcp-form-menu fl">试卷名称</div>
                                <div class="mcp-form-detail fl"><input type="text" placeholder="必填" class="test-paper-name" name="examName"></div>
                                <div id="examName-error"></div>
                        </div>
                        <div class="mcp-form-list clearfix">
                            <div class="mcp-form-menu fl">试卷类型</div>
                            <div class="mcp-form-menu fl">
                                <div class="mcp-form-detail fl clearfix">
                                    <select name="tpl_index" class="fl choose-subject">
                                            <option value="1050" selected>全国版</option>
                                            <option value="1051">江苏版</option>
                                    </select>
                                </div>

                            </div>
                            <div id="subject-error"></div>
                        </div>
                        <div class="mcp-form-list clearfix">
                                <div class="mcp-form-menu fl">考试类型</div>
                                <div class="mcp-form-detail fl clearfix">
                                        <div class="mcp-radio-sel fl">
                                                <span class="sel-btn select examType" value="1"></span>
                                                <span>周考</span>
                                        </div>
                                        <div class="mcp-radio-sel fl">
                                                <span class="sel-btn examType" value="2"></span>
                                                <span>单元考</span>
                                        </div>
                                        <div class="mcp-radio-sel fl">
                                                <span class="sel-btn examType" value="3"></span>
                                                <span>月考</span>
                                        </div>
                                        <div class="mcp-radio-sel fl">
                                                <span class="sel-btn examType" value="4"></span>
                                                <span>联考</span>
                                        </div>
                                        <div class="mcp-radio-sel fl">
                                                <span class="sel-btn examType" value="5"></span>
                                                <span>期中考试</span>
                                        </div>
                                        <div class="mcp-radio-sel fl">
                                                <span class="sel-btn examType" value="6"></span>
                                                <span>期末考试</span>
                                        </div>
                                        <div class="mcp-radio-sel fl">
                                                <span class="sel-btn examType" value="7"></span>
                                                <span>模拟考</span>
                                        </div>
                                        <div class="mcp-radio-sel fl">
                                                <span class="sel-btn examType" value="8"></span>
                                                <span>冲刺考</span>
                                        </div>
                                        <div class="clear"></div>
                                        <div class="mcp-radio-sel fl">
                                            <span class="sel-btn examType" value="9"></span>
                                            <span>测验（适用于非正式考试）</span>
                                        </div>
                                </div>
                                <div id="type-error"></div>
                        </div>
                        <div class="mcp-form-list clearfix">
                                <div class="mcp-form-menu fl">主阅卷员</div>
                                <div class="mcp-form-detail fl">
                                    <select class="sel-option projSelect" style="width: 150px">
                                        <option value="0">选择阅卷员</option>
                                        <?php foreach($teacher_arr as $t):?>
                                            <option  value="<?php echo $t['teacher_id']?>"><?php echo $t['teacher_name']?></option>
                                        <?php endforeach;?>
                                    </select>
                                </div>

                                <div id="choose-error"></div>
                        </div>
                        <div class="mcp-form-list clearfix">
                            <div class="mcp-form-menu fl">选择年级</div>
                            <div class="mcp-form-detail fl">
                                <select class="select-grade"  isthird="0" name="select-grade" style="width: 150px">
                                    <option value="0">请选择</option>
                                    <option  value="1">高一</option>
                                    <option  value="2">高二</option>
                                    <option  value="3">高三</option>
                                </select>
                            </div>

                            <div id="grade-error"></div>
                        </div>
                        <div class="mcp-form-list clearfix">
                            <div class="mcp-form-menu fl">选择班级</div>
                            <div class="mcp-form-detail fl">
                                <a class="btn btn-success btn-sm select-class">添加班级</a>
                                <span id="classIds-error"></span>
                                <div class="select-class-list">
                                    <div class="class-box fl">
                                        <ul class="selected-box">
                                        </ul>
                                    </div>
                                </div>
                            </div>

                        </div>
                        <div class="mcp-form-list clearfix <?php echo $is_qxk?'hide':'';?>">
                            <div class="mcp-form-menu fl">题源</div>
                            <div class="mcp-form-detail fl clearfix" >
                               <span class="show_text_book">
                                   <?php
                                   if(isset($textbookArr[1])){
                                       echo $textbookArr[1]['subject_name'].'    教材版本   '.$textbookArr[1]['text_book_name'];
                                   }
                                   ?>
                               </span>
                                <span class="red">
                                 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;**请认真确认，如果信息有误，请在教材管理模块更改
                                </span>
                                <input type="hidden" name="subjectId" value="<?php echo $textbookArr[1]['subject_id']?>">
                                <input type="hidden" name="textbookId" value="<?php echo $textbookArr[1]['textbook_id']?>">
                            </div>
                        </div>
                        <div class="mcp-form-list clearfix">
                                <div class="mcp-form-menu fl">阅卷方式</div>
                                <div class="mcp-form-detail fl clearfix" id ="markType">
                                        <div class="mcp-radio-sel fl">
                                                <span class="sel-btn select markType" value="3"></span>
                                                <span class ="markType" value="3">班级混合阅卷</span>
                                        </div>
                                        <div class="mcp-radio-sel fl">
                                                <span class="sel-btn markType" value="4"></span>
                                                <span class="markType" value="4">班级单独阅卷</span>
                                        </div>
                                        <div class="mcp-radio-sel fl">
                                            <span class="sel-btn markType" value="0"></span>
                                            <span class="markType" value="0">线下阅卷（暂只支持在线答题卡）</span>
                                        </div>

                                        <div id="markType-error"></div>
                                </div>
                        </div>
                        <div class="mcp-form-list clearfix">
                            <div class="mcp-form-menu fl">考试时间</div>
                            <div class="mcp-form-detail fl clearfix">
                                <input type="text" class='core datetimepicker8' readonly style="width: 100px;" name="examDate" />
                            </div>
                            <div id="examDate"></div>
                        </div>

                </div>
                <input name="type" value="1" type="hidden"/>
                <input name="teacherId" value="0" type="hidden"/>
                <input name="markType" value="3" type="hidden"/>
                <input name="classIds" value="0" type="hidden"/>
                <input name="isQxk" value="<?php echo $is_qxk?>" type="hidden"/>
            </form>
            <!--<button id="createThird">确定</button>-->
            <!-- <div class="mcp-form-list mcp-fl-btns clearfix">
                <input type="button" value="保存并返回" class="mcp-sure-btn" id="createThird" active="true">
                <input type="button" value="确定" class="mcp-sure-btn" active="true">
                <input type="button" value="返回" class="mcp-back-btn" >
            </div> -->
            <div class="template-flag-box">
                <a href="javascript:;" id="createThird" active="true">保存并返回</a>

                    <!-- <a href="javascript:;" id="goNext" active="true">保存并下一步</a> -->
                    <a href="javascript:;" id="goNextNew" active="true">保存并下一步</a>

                <a href="javascript:;" id="goBack" class="gray" active="true">放弃并返回</a>
                <!--<a href="javascript:;" class="template-flag">创建答题卡</a>-->
            </div>
        </div>
    </div>
    <div class="relation-answer-card">
        <div class="page-content">

            <div class="mcp-title">
                <span >第1步、考试基本信息</span>
                <span><i class="horizontal-line"></i></span>
                <span class="active">第2步、关联在线答题卡</span>
            </div>

             <!-- 新版本右侧答题卡 -->
            <div class="hgc_leftContent">
                <div class="module">
                <h2>
                    <span>当前答题卡</span>
                    <span class="theme notice">新版本，无需切割模板，可通过扫描入口直接扫描</span>
                </h2>
                <div class="contentInfo">
                    <div class="opratorBnts">
                    <span class="theme" id="saveMyTpl">保存为我的模版</span>
                    <span class="theme" id="downLoadPdfBtn">下载答题卡</span>
                    <span class="theme" id="editMyTpl">修改答题卡>></span>
                    </div>
                    <div class="subjectInfo">
                    <div class="infoItem">
                        <em>基本信息：</em>
                        <div class="info">
                        <p>
                            <span>板式：A3-横版-三栏</span>
                            <span>考号：填涂（10位）</span>
                            <span>装订线：有</span>
                            <span>总分：150分</span>
                            <span>题量：50</span>
                        </p>
                        </div>
                    </div>
                    <div class="infoItem">
                        <em>题目信息：</em>
                        <div class="info">
                        <p>
                            <span>一、单项填空</span>
                            <span>单选</span>
                            <span>20题</span>
                            <span>共20分</span>
                        </p>
                        </div>
                    </div>
                    </div>
                </div>
                <div class="contentNoInfo">
                    <!-- <img src="" alt=""> -->
                    <span>未创建答题卡</span>
                    <div class="hbtn">创建在线答题卡</div>
                </div>
                </div>
                <div class="module">
                <h2>
                    <span>我的模版(<em id="tplLength">0</em>)</span>
                </h2>
                <div class="tplBox">
                    <div class="leftBtn btnItem"></div>

                    <div class="tplCut">
                        <div class="tplList">

                        </div>
                        <p id="tplListMsg" style="text-align: center;">暂未保存模板</p>
                    </div>
                    <div class="rightBtn btnItem"></div>
                </div>
                </div>
            </div>
            <div class="template-flag-box">
                <a href="javascript:;" id="createThirdCard" active="true">保存并返回</a>
                <a href="javascript:;" id="goBack" class="gray" active="true">放弃并返回</a>
            </div>
        </div>
    </div>

</div>

<!-- 弹窗 -->
<div class="confirmbox-mask" style="display: none;" id="fieldModal">
    <div class="class-modal" style="padding: 0px;">

        <div class="class-modal-head" style="background-color: #2977ff;color: white;height: 30px;font-size: 16px;font-weight: initial;"><span style="float: left;padding: 5px;">选择考试班级</span><span class=" add-class-close" style="float: right;padding: 5px;cursor: pointer;">X</span></div>
        <form id="examSelect">
            <div class="class-modal-body">
                <p class="title">
                    <input type="hidden" id="grade_id" name="grade_id" value="0">
                    <span style="float: left;" id="gradeTxt">
                     </span>
                    <span style="margin-left: 300px;">
                         <input type="checkbox" id="global_check_all" class="add_class_input">&nbsp;全选 &nbsp;&nbsp;
                         <input type="checkbox" id="global_check_arts" class="add_class_input">&nbsp;全部文科班 &nbsp;&nbsp;
                         <input type="checkbox" id="global_check_science" class="add_class_input">&nbsp;全部理科班 &nbsp;&nbsp;
                     </span>

                </p>
                <div class="class_area" id="class_area">
                    <ul class="class_right area_1">

                    </ul>
                </div>
            </div>
            <p class="class_btn" style="text-align: center;">
                <input type="hidden" name="exam_gruop_id" value="0">
                <button type="button" class="setting_sumbit" style="margin-right: 10px;">确定</button>
                <button type="button" class="cancel-btn">取消</button>
            </p>
        </form>
    </div>
</div>
<script>
    var subjects  = <?php echo json_encode($textbookArr); ?>;
	$(document).ready(function(){
        $('.projSelect').select2();
        var teacher_name = '';
        var islocal = ~location.href.indexOf('xg.com');
        var baseUrl = '';

        if(islocal){
            // baseUrl ='http://192.168.1.51/index.php'
            baseUrl ='/index.php'
        }else {
            baseUrl =''
        }
       var saveFormData ="";
       function isReturn(){
        // var isCardReturn = localStorage.getItem('isCardReturn');
        // var isCardReturn = ~document.referrer.indexOf('online/third');
        var locationUrl = window.location.href;
        let isCardReturn = locationUrl.indexOf('isCardReturn')
        if(isCardReturn>-1){
            $('.test-data').hide();
            $('.relation-answer-card').show();
            saveFormData = JSON.parse(localStorage.getItem('testFormData'));

        }else{
            var locationUrl = window.location.href;
            localStorage.setItem('referrerUrl',JSON.stringify(locationUrl));
        }

       }
       isReturn();


            $('.datetimepicker8').datetimepicker({
                onGenerate:function( ct ){
                    $(this).find('.xdsoft_date').toggleClass('xdsoft_disabled');
                    $(this).find('.xdsoft_today').removeClass('xdsoft_disabled');
                },
                format:'Y-m-d',
                formatDate:'Y-m-d',
                minDate:'-1970/01/2',
                maxDate:'+1970/01/2',

                timepicker:false
            });
                //选择考试时间

                //选择教材题源

                console.log(subjects);

                for(var key in subjects){
                        $(".choose-grade").append('<option value="'+ key +'">'+ subjects[key] +'</option>');
                }
                $(".choose-grade").change(function(){
                        var obj = $(this);
                        var val = obj.val();
                        var child = $('.choose-book');

                        child.html('<option value="0">选择教材</option>');

                        for (var key in textbooks) {
                                if (key == val) {
                                        child.html('');
                                        for (var name in textbooks[key]) {
                                                child.append('<option value="'+ [name] +'">'+ textbooks[key][name] +'</option>');
                                        }
                                }
                        }
                });
                //返回
                $('.mcp-back-btn').click(function(){
                    location.href="<?php echo Yii::app()->createUrl('third/index')?>";
                });

                $('input[name="examName"]').keydown(function(event){
                    $('#examName-error').html("");
                });
                //阅卷方式
                $('.markType').click(function(){
                    var markType = $(this).attr('value');
                    if(markType){
                        $('#markType-error').html("");
                    }
                    $('input[name="markType"]').val(markType);
                });
                //考试类型
                $('.examType').click(function(){
                    var type = $(this).attr('value');
                    if(type){
                        $('#type-error').html("");
                    }
                    $('input[name="type"]').val(type);
                });
                //选择教师
                $('.sel-option').change(function(){
                    var teacher_id = $(this).val();
                      teacher_name = $(this).text();
                    if(teacher_id){
                        $('#choose-error').html("");
                    }
                    $('input[name="teacherId"]').val(teacher_id);
                });


		if ($('.sel-classes > span').length > 0){
			for (var i = 0;i < $('.sel-classes > span').length; i++){
				for (var k = 0;k < $('.bjs-lis').length; k++){
					if ($('.bjs-lis').eq(k).text().trim()==$('.sel-classes > span').eq(i).text().trim()) {
						$('.bjs-lis').eq(k).find('.judge-sel').addClass('active');
					}
				}
			}
		}


		$('.mcp-radio-sel').click(function(){
			if (!$(this).find('.sel-btn').hasClass('select')) {
				$(this).find('.sel-btn').addClass('select');
				$(this).siblings().find('.sel-btn').removeClass('select');
			}
		});

		$('.grade-sel ul li').click(function(){
			$(this).addClass('active').siblings().removeClass('active');
		});

//		$('.judge-sel').on('click',function(){
//                    alert(1);
//			if (!$(this).hasClass('active')) {
//				$(this).addClass('active');
//				$('.sel-classes').append('<span>'+$(this).closest('.bjs-lis').text()+'</span>');
//			} else {
//				$(this).removeClass('active');
//				for (var i = 0;i < $('.sel-classes > span').length; i++) {
//					console.log($('.sel-classes > span').eq(i).text());
//					if ($('.sel-classes > span').eq(i).text().trim() == $(this).closest('.bjs-lis').text().trim()){
//						$('.sel-classes > span').eq(i).remove();
//					}
//				}
//			}
//		});

		$('.sel-classes > span').click(function(){
			$(this).remove();
			for (var i = 0;i < $('.bjs-lis').length; i++) {
				if ($('.bjs-lis').eq(i).text().trim()==$(this).text().trim()){
					$('.bjs-lis').eq(i).find('.judge-sel').removeClass('active');
				}
			}
		});

		// 下拉列表模拟
		$('.inp-text').click(function(){
			if ($(this).next().is(':hidden')){
				$(this).next().show();
			} else {
				$(this).next().hide();
			}
		});
		// 点下拉列表选项
		$('.select-con li').click(function(){
			$(this).closest('.select-con').hide();
			$(this).closest('.mcp-form-detail').find('.inp-text').text($(this).text());
		});
		// 点击空白处下拉列表消失
		$(document).click(function(e){
            var targetNode =  $(e.target).closest(".inp-text");
            if (targetNode.length>0){
                return;
            }else{
                $(".select-con").hide();
            }
        });

        function saveThirdForm(e,btnType) {
            var classIds='';
            $(".selected-box").find('li').each(function(index,el){
                classIds += $(el).attr('value')+",";
            });

            $('input[name="classIds"]').val(classIds);

            var error = new Array();
            var classIds = $('input[name="classIds"]').val();
            var examName = $('input[name="examName"]').val();
            var type = $('input[name="type"]').val();
            var teacherId = $('input[name="teacherId"]').val();
//                    var markType = $('input[name="markType"]').val();

            var markType = $("#markType").find(".select").attr("value");

            var subjectId = $('input[name=subjectId]').val();
            var examDate = $("input[name='examDate']").val();

            if(subjectId == 0 || subjectId == null){
                $('#subject-error').html('请指定题源');
                error.push('没有指定题源');
            }else{
                $('#subject-error').html('');
            }
            if(examName == "" || examName == null){
                $('#examName-error').html('请指定考试名称');
                error.push('没有指定考试名称');
            }else{
                $('#examName-error').html('');
            }
            if(type == "" || type == null){
                $('#type-error').html('请指定考试类型');
                error.push('没有指定考试类型');
            }else{
                $('#type-error').html('');
            }
            if(teacherId == '0' || teacherId == null){
                $('#choose-error').html('请指定阅卷老师');
                error.push('没有指定阅卷老师');
            }

            $('#choose-error').html('');
            if(classIds == "" || classIds == null){
                $('#classIds-error').html('请指定考试班级');
                error.push('没有指定考试班级');
            }else{
                $('#classIds-error').html('');
            }

            console.log(classIds);
            if(!markType){
                $('#markType-error').html('请指定阅卷方式');
                error.push('没有指定阅卷方式');
            }else{
                $('#markType-error').html('');
            }
            if (examDate == '') {
                    $('#examDate').html('请设置考试日期');
                    error.push('请设置考试日期');
            } else if (examDate < '<?php echo date('Y-m-d'); ?>') {
                    //$('#examDate').html('考试日期设置错误');
                   // error.push('考试日期设置错误');
            }else{
                    $('#examDate').html('');
            }


            if(error.length == 0){
                // debugger
                $(e.target).attr("active","false");
                saveFormData = {
                    examName:examName,
                    subjectId:subjectId,
                    textbookId:$('input[name="textbookId"]').val(),
                    tpl_index:$('select[name="tpl_index"]').val(),
                    examDate:examDate,
                    type:type,
                    teacherId:teacherId,
                    markType:markType,
                    classIds:classIds,
                    isQxk:$('input[name="isQxk"]').val()
                };

                localStorage.setItem('testFormData',JSON.stringify(saveFormData))
                var formData = new FormData();
                for(var k in saveFormData){
                    formData.append(k,saveFormData[k])
                }

                $.ajax({
                    url:baseUrl+'/index.php/third/createthirdForNext',
                    method: 'POST',
                    processData: false,
                    contentType: false,
                    dataType: 'json',
                    data: formData,
                    success: function (data) {
                         if(data.status ==1){
                            saveFormData.examGroupId = data.examGroupId;
                            saveFormData.teacher_name = teacher_name;
                            var addGrade = 0;
                            $('.grade-sel ul li').each(function(){
                                if($(this).hasClass('active')){
                                    addGrade = $(this).attr('grade')
                                }
                            })
                            saveFormData.grade = addGrade;
                            localStorage.setItem('testFormData',JSON.stringify(saveFormData));
                            if(btnType===1){
                                goBack();
                            }else if(btnType===2){
                                $('.test-data').hide();
                                $('.relation-answer-card').show();
                            }else if(btnType===3){
                              // location.href = '/index.php/third/thirdCardSecond'
                                location.href = '/index.php/online/answersheetList/examGroupId/'+saveFormData.examGroupId+'?isThird=1&examGroupId='+saveFormData.examGroupId
                            }
                        }else{
                            if(data.info){
                                layer.msg(data.info);
                            }else{
                            if(data.msg){
                                layer.msg(data.msg);
                            }
//
                            }

                            $(e.target).attr("active","true");
                        }

                    }
                })
            }else{
                layer.msg(error.join(','));
                $(e.target).attr("active","true");
            }
        }

        function goBack(){
            //location.href = '/index.php/third/index'
            window.history.back();
        }
        //保存并返回
        $("body").delegate("#createThird[active='true']", "click", function(e) {
            $('#createThird').attr('active',false);
            $('#goNext').attr('active',false);
            $('#goNextNew').attr('active',false);
            saveThirdForm(e,1);
        });
        //保存并关联答题卡
        $("body").delegate("#goNext[active='true']", "click", function(e) {
            $('#createThird').attr('active',false);
            $('#goNext').attr('active',false);
            $('#goNextNew').attr('active',false);
            saveThirdForm(e,2);
        });
         //保存并关联答题卡
         $("body").delegate("#goNextNew[active='true']", "click", function(e) {
             $('#createThird').attr('active',false);
             $('#goNext').attr('active',false);
             $('#goNextNew').attr('active',false);
            saveThirdForm(e,3);
        });
        //取消并返回
        $("body").delegate("#goBack[active='true']", "click", function(e) {
            localStorage.setItem('isCardReturn',0)
            goBack();

        });

	});
</script>
<script src="/js/third/submit.js"></script>
<script src="/js/third/select-class.js"></script>