zxhx
/
xiaoben-as2-php


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571
							<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>试用人数</title>
    <meta name="description" content="">
    <meta name="keywords" content="">
    <link href="/css/ims/base.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="/css/ims/bootstrap.min.css" />
    <link rel="stylesheet" type="text/css" href="/css/ims/ace.min.css"/>
    <link href="/css/ims/ims.css" rel="stylesheet">

    <style>
        .ims-box {
            margin-top: 5px;
            margin-left: 20px;
            margin-right: 20px;
        }

        .screen {
            padding-left: 20px;
            height: 44px;
            line-height: 44px;
            background-color: #eff4fa;
        }

        .screen li {
            float: left;
            margin-right: 65px;
        }

        .bg-d9bf6e {
            margin-left: 5px;
            padding: 0 20px;
            color: #fff;
            background-color: #d9bf6e;
        }
        .number{
            margin-top: 10px;
        }
        .ims-add-student-box {
            margin: 20px;
        }
        .ims-add-student-box p{
            margin: 0;
        }
        .ims-add-student-box .ims-title{
            font-size: 20px;
            font-weight: bold;
        }
        .ims-add-student-box  .ims-title span{
            margin-right: 20px;
        }

        .ims-add-student-box .add-student-box {
            margin-top: 20px;
            font-size: 0;
            overflow: hidden;
        }
        .ims-add-student-box  .add-student-box>div{
            display: inline-block;
            height: 530px;
            font-size: 14px;
            vertical-align: top;
        }
        .ims-add-student-box .add-student-box .add-student-title{
            padding: 0 8px;
            line-height: 30px;
            color: #fff;
            background-color: #2977ff;
        }
        .ims-add-student-box  .add-student-box .add-student-title label{
            font-size: 14px;
            font-weight: normal;
            cursor: pointer;
            margin-bottom: 0;
        }
        .ims-add-student-box  .add-student-box .add-student-title input{
            vertical-align: middle;
            margin: 0;
        }
        #input-search-student{
            width: 120px;
            height: 20px;
            border: 0;
            color:#000;
        }
        .ims-add-student-box  .add-student-box{
            line-height: 30px;
            min-width: 938px;
        }

        .ims-add-student-box .add-student-box .class-box {
            width: 180px;
            text-align: center;
            border: 1px solid #ccc;
        }
        .ims-add-student-box .student-list div{
            font-size: 14px;
            font-weight: normal;
        }
        .ims-add-student-box .add-student-box .class-list{
            height: 500px;
            overflow: auto;
        }
        .ims-add-student-box .add-student-box .class-list li{
            border-bottom: 1px solid #ccc;
            cursor: pointer;
        }
        .ims-add-student-box .class-list .active{
            color: #629aff;
        }
        .ims-add-student-box .add-student-box .student-list{
            margin: 0;
            width: 34%;
            min-width: 326px;
            border: 1px solid #ccc;
            border-left: 0;
        }
        .ims-add-student-box .student-list-content,.selected-list-content{
            padding: 8px;
            height: 500px;
            overflow: auto;
        }
        .ims-add-student-box .student-list-content label,.selected-list-content label{
            display: inline-block;
            width: 150px;
            cursor: pointer;
            font-size: 14px;
            font-weight: normal;
        }

        .ims-add-student-box .btn-search-student{
            height: 20px;
            line-height: 20px;
            padding: 0 5px;
            border-radius: 3px;
            color: #629aff;
            background-color: #2977ff;
            border: none;
            outline: none;
            cursor: pointer;
        }

        .ims-add-student-box .btns-box {
            width: 100px;
            text-align: center;
        }
        .ims-add-student-box .btn-left,.ims-add-student-box .btn-right{
            margin: 150px auto 0;
            width: 40px;
            height: 40px;border: 1px solid #ccc;
            border-radius: 50%;
            background-color: #fff;
            text-align: center;
            line-height: 40px;
            cursor: pointer;
        }
        .ims-add-student-box  .selected-list{
            width: 34%;
            min-width: 326px;
            border: 1px solid #ccc;
        }


        .ims-add-student-box .btn-confirm_purchase {
            display: block;
            margin: 0 auto;
            margin-top: 100px;
            margin-bottom: 50px;
            width: 200px;
            line-height: 54px;
            color: #fff;
            font-family: PingFangSC-Regular, "PingFang SC";
            font-weight: 400;
            font-style: normal;
            font-size: 20px;
            text-align: center;
            background-color: #2977ff;
            cursor: pointer;
        }
        .yiiPager li{display: inline}
        .clear{clear: both}
    </style>
</head>

<body>
<div class="ims-box">
        <div class="screen">
            <ul>
                <li><span class="product">试用商品</span><span class="product-name bg-d9bf6e"><?php echo $goodDetail['goodsTypeName'];?></span></li>
                <li><span class="grade">试用年级</span><span class="grade-name bg-d9bf6e"><?php echo $goodDetail['gradeName'];?></span></li>
                <li><span class="date">试用时间</span><span class="date-name bg-d9bf6e"><?php echo $goodDetail['date'];?></span></li>
                <li><span class="type">状态</span><span class="type-name bg-d9bf6e"><?php echo $goodDetail['status'];?></span></li>
                <li><span class="type">开启人数</span><span class="type-name bg-d9bf6e"><?php echo $goodDetail['enableNum'];?>/<?php echo $page['total'];?></span></li>
            </ul>
        </div>
    <div class="number">
        <table id="record-table" class="table table-striped table-bordered table-hover dataTable no-footer DTTT_selectable" style="font-size:12px">
            <thead>
            <tr>
                <th>序号</th>
                <th>学生姓名</th>
                <th>班级</th>
            </tr>
            </thead>
            <tbody>
            <?php if ($list):?>
            <?php foreach ($list as $k=>$item):?>
            <tr>
                <td><?php echo $k+1;?></td>
                <td><?php echo $item['studentName']?></td>
                <td><?php echo $item['clazzName']?></td>
            </tr>
            <?php endforeach;?>
            <?php else:?>
                <tr><td colspan="3">暂无数据</td></tr>
            <?php endif;?>
            </tbody>
        </table>

        <div>
        <?php if ($page): ?>
            <div class="col-sm-12" style="float: left;width:70%;">
                <ul class="pagination">
                    <?php
                    $params = array();
                    if (isset($_GET['orderId']) && $_GET['orderId']) {
                        $params['orderId'] = $_GET['orderId'];
                    }
                    if (isset($_GET['page'])) {
                        $params['page'] = $_GET['page'];
                    }else{
                        $params['page'] = 1;
                    }
                    echo formatPage($page, 'imsSale/trialStudent', $params)
                    ?>
                </ul>
            </div>
        <?php endif; ?>
            <div  style="float: right;width:180px;text-align: right;padding-top:20px;">
            <button type="button" class="label-primary-s bth-s start "  >部分开启</button>
            <button type="button" class="label-primary-s bth-s stop"  >部分暂停</button>
            </div>
        </div>
    </div>
    <div class="clear"></div>
    <div class="layer-edit">
        <div class="ims-add-student-box">
            <h2 class="ims-title"><span>添加学生</span></h2>
            <div class="reason-div">
                <br>重启原因及备注：<br>
                <textarea rows="3" cols="80" class="use-explain reason" name="mark"></textarea>
            </div>
            <div class="add-student-box">
                <div class="class-box">
                    <div class="add-student-title">
                        <p>班级</p>
                    </div>
                    <ul class="class-list">
                        <li class="active">一班</li>
                        <li>二班</li>
                        <li>三班</li>
                    </ul>

                </div>
                <div class="student-list">
                    <div class="add-student-title clearfix">
                        <span class="fl">
                            <label>
                                <input type="checkbox" name="select-all" value="1" /><span class="msg1">已开启</span>
                            </label>
                            <span></span>
                        </span>
                        <span class="fr">

                        </span>
                    </div>
                    <div class="student-list-content" id="studentListContent">

                    </div>

                </div>
                <div class="btns-box">
                    <p class="btn-left" id="btnRemoveStudent"><</p>
                    <p class="btn-right" id="btnAddStudent" >></p>
                </div>
                <div class="selected-list">
                    <div class="add-student-title">
                        <p><span class="msg2">已开启</span>(<span id="studentSelectedLength">0</span>人)</p>
                    </div>
                    <div class="selected-list-content" id="selectedListContent">

                    </div>
                </div>
            </div>

            <input type="hidden" name="actionType" value="">
            <button type="button" class="label-primary-s bth-s cancel" style="float: left;margin-top:5px;margin-left:45%" >返回</button>
            <button type="button" class="label-primary-s bth-s save" style="float: left;margin-top:5px;" >保存</button>

        </div>
    </div>
</div>
</body>
<script src="/js/jquery-2.2.2.min.js" ></script>
<script src="/js/layer/layer.js"></script>
<script>
    var orderId='<?php echo $orderId?>';
    var canOpen='<?php echo $canOpen?>';
    var errMsg='<?php echo $errMsg?>';

    var selectedDataAll=[];
    var selectedDataValue =[];

    var selectedClassId=0;
    var selectedClassName='';

    $('.cancel').click(function(){
        layer.closeAll();
        selectedDataAll=[];
        selectedDataValue =[];
        $('#selectedListContent').html('');
    });
    $('.save').click(function(){
        reason=$('.reason').val();
        actionType=$('input[name=actionType]').val();
        if(selectedDataValue.length==0){
            layer.msg('请选择学生');
            return false;
        }

        if(actionType==1 && (reason=='' || reason==undefined)){
            layer.msg('请填写重启原因及备注');
            return false;
        }
        $.ajax({
            url:'<?php echo $this->createUrl('imsSale/doStudentOrder')?>',
            type:'POST',
            dataType:'json',
            data:{orderId:orderId,type:actionType,selectedDataValue:selectedDataValue,reason:reason},
            success:function (res) {
                if(res.status==1){
                    layer.msg("执行成功");
                    window.location.reload();
                }else{
                    layer.msg("执行失败");
                }
            }
        });
    });
    $('.start').click(function(){
        if(canOpen!='1'){
            layer.msg(errMsg);
            return false;
        }
        selectedDataAll=[];
        selectedDataValue =[];

        selectedClassId=0;
       selectedClassName='';
        $('.ims-title').html('部分开启');
        $('.msg1').html('已暂停');
        $('.msg2').html('已开启');
        $('input[name=actionType]').val(1);
        $('.reason-div').show();
        //请求班级
        $.ajax({
            url:'<?php echo $this->createUrl('imsSale/getClassesByOrderId')?>',
            type:'POST',
            dataType:'json',
            data:{orderId:orderId,type:0},
            success:function (res) {
                if(res.status==1){
                    var html='';
                    for(var i=0;i<res.data.length;i++){
                        html+='<li classId="'+res.data[i]['clazzId']+'" rel="0">'+res.data[i]['clazzName']+'</li>';
                    }

                    $('.class-list').html(html);

                    var studentHtml='';
                    for(var i=0;i<res.students.length;i++){
                        studentHtml+='<label><input type="checkbox"    name="studentName" value="'+res.students[i]['osId']+'" />'+res.students[i]['studentName']+'</label>';
                    }

                    $('.student-list-content').html(studentHtml);
                    var selectStudentIndex=layer.open({
                        title: false,
                        closeBtn: 1,
                        type: 1,
                        offset: '20px',
                        area: ['65%', '650px'],
                        content: $(".layer-edit")
                    });
                }
            }
        });

    });
    $('.stop').click(function(){
        selectedDataAll=[];
        selectedDataValue =[];

        selectedClassId=0;
        selectedClassName='';
        $('.ims-title').html('部分暂停');
        $('.msg1').html('已开启');
        $('.msg2').html('已暂停');
        $('input[name=actionType]').val(0);
        $('.reason-div').hide();
        $.ajax({
            url:'<?php echo $this->createUrl('imsSale/getClassesByOrderId')?>',
            type:'POST',
            dataType:'json',
            data:{orderId:orderId,type:1},
            success:function (res) {
                if(res.status==1){
                    var html='';
                    for(var i=0;i<res.data.length;i++){
                        html+='<li classId="'+res.data[i]['clazzId']+'" rel="1">'+res.data[i]['clazzName']+'</li>';
                    }

                    $('.class-list').html(html);

                    var studentHtml='';
                    for(var i=0;i<res.students.length;i++){
                        studentHtml+='<label><input type="checkbox"   name="studentName" value="'+res.students[i]['osId']+'" />'+res.students[i]['studentName']+'</label>';
                    }

                    $('.student-list-content').html(studentHtml);
                    var selectStudentIndex=layer.open({
                        title: false,
                        closeBtn: 1,
                        type: 1,
                        offset: '20px',
                        area: ['65%', '650px'],
                        content: $(".layer-edit")
                    });
                }
            }
        });
    });
    //班级切换
    $(".class-list").on("click", "li", function(event) {
        if(!$(this).hasClass('subjectObj')){
            $(".class-list li").removeClass("active");
            $(this).addClass("active");

            selectedClassId=classId=$(this).attr('classId');
            selectType=$(this).attr('rel');
            selectedClassName=className=$(this).html();
            getStudent(classId,selectType);
        }
    });
    function getStudent(classId,selectType){

        $.ajax({
            url:'<?php echo $this->createUrl('imsSale/getStudentByClassIdOrderId')?>',
            type:'POST',
            dataType:'json',
            data:{'classId':classId,'orderId':orderId,'type':selectType},
            success:function(res){
                if(res.status==1){
                    var studentHtml='';
                    for(var i=0;i<res.data.length;i++){
                        studentHtml+='<label><input type="checkbox"  name="studentName" classId="'+classId+'"  value="'+res.data[i]['osId']+'" />'+res.data[i]['studentName']+'</label>';
                    }
                    $('.student-list-content').html(studentHtml);
                }else{
                    $('.student-list-content').html('');
                }

            }
        });
    }
    // 全选按钮
    $("input[name='select-all']").change(function() {

        var type = $("input[name='select-all']").prop("checked")
        if(type){
            obj=$("#studentListContent").find("input");
            for(var i=0;i<obj.length;i++){
                if(obj.eq(i).attr('disabled')==undefined){
                    obj.eq(i).prop("checked", true);
                }
            }

        }else{
            $("#studentListContent").find("input").prop("checked", false);
        }
    });
    // 添加学生
    $("#btnAddStudent").on("click", function() {
        getStudentSelected();

    });
    // 移出学生
    $("#btnRemoveStudent").on("click", function() {
        removeStudentSelected();

    });


    function getStudentSelected() {
        var selectedData = $("#studentListContent input[name='studentName']:checked"); //获取所以选中学生
        var studentName = '';

        for (var i = 0; i < selectedData.length; i++) {
            if (!isSelected(selectedData[i].value)) {
                studentName = $(selectedData[i]).parent().text();
                var student ={
                    name:studentName,
                    value:selectedData[i].value,
                    class:$(selectedData[i]).attr('className'),
                    classId:$(selectedData[i]).attr('classId'),
                };
                selectedDataAll.push(student);
                selectedDataValue.push(selectedData[i].value);
            }else{
                //console.log(selectedData[i].value)
            }
            showSelectedStudent();
        }

    };

    function isSelected(val){
        return selectedDataValue.indexOf(val) > -1
    };
    function removeStudentSelected() {
        var selectedStudent = $("#selectedListContent input[name='selectedStudent']:checked"); //获取所有选中学生
        var selectedData = $("#studentListContent input[name='studentName']:checked"); //获取所以选中学生


        for (var i = 0; i < selectedStudent.length; i++) {

            $(selectedStudent[i]).parent().remove();
            for (var j = 0; j < selectedData.length; j++) {
                if(selectedData[j].value===selectedStudent[i].value){
                    $(selectedData[j]).prop("checked", false);
                    if(selectedDataValue.length>0){
                        for(var k=0;k<selectedDataValue.length;k++){
                            if(selectedDataValue[k]===selectedStudent[i].value){
                                selectedDataValue.splice(k,1);
                                selectedDataAll.splice(k,1);
                            }
                        }
                    }

                }
            }
        }
        $('#studentSelectedLength').text(selectedDataAll.length);
    };

    function showSelectedStudent() {
        var selectedDataList = [];
        for (var i = 0; i < selectedDataAll.length; i++) {
            selectedDataList.push('<label><input type="checkbox" name="selectedStudent"  value="'+ selectedDataAll[i].value +'" />'+selectedDataAll[i].name+'</label>');

        }
        $('#selectedListContent').html(selectedDataList);
        $('#studentSelectedLength').text(selectedDataAll.length);
    };
</script>

</html>