123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538 |
- {extend name="public/layout"/} {block name="title"}集团-添加学练{/block} {block name="body"}
- <style type="text/css">
- html, body {
- display: block;
- min-width: 100%;
- height: 100%;
- background-color: #fff;
- overflow-x: auto;
- overflow-y: hidden;
- min-width: 740px;
- }
- .layui-fluid {
- display: block;
- background-color: #ffffff;
- height: 100%;
- margin: 0;
- box-sizing: border-box;
- }
- .toptext{
- font-size: 12px;
- color: #b4b4b4;
- position: absolute;
- right: 20%;
- top: 4px;
- }
- .clearfix::after {
- clear: both;
- content: ' ';
- display: table;
- }
- .clearfix::before {
- content: ' ';
- display: table;
- }
- .width33{
- width: 33.3%;
- }
- .width67{
- width: 66.7%;
- }
- .layui-fluid{
- padding-top: 20px;
- padding-bottom: 60px;
- }
- .footer{
- position: absolute;
- width: 100%;
- bottom: 0;
- left:0;
- border-top: 1px solid #ccc;
- height: 60px;
- }
- .footer button{
- display: block;
- width: 88px;
- height: 32px;
- background-color: #249efb;
- color: #fff;
- text-align: center;
- line-height: 32px;
- border: unset;
- cursor: pointer;
- border-radius: 4px;
- overflow: hidden;
- margin: 0 auto;
- position: relative;
- top: 14px;
- }
- .left{
- float: left;
- }
- .mainbox{
- width: 100%;
- height: 100%;
- }
- .leftbox{
- display: block;
- height: 100%;
- overflow: hidden;
- }
- .setitbox{
- display: block;
- width: 100%;
- text-align: center;
- }
- .setitbox div{
- width: 45%;
- background-color: #f2f2f2;
- margin-right: 10%;
- height: 32px;
- font-size: 16px;
- line-height: 32px;
- cursor: pointer;
- }
- .setitbox div.trainbox{
- margin-right: 0;
- }
- .setitbox div.nowset{
- background-color: #249efb;
- color: #fff;
- }
- .right{
- float: right;
- }
- .scenetitle{
- margin-top: 10px;
- width: 100%;
- height: 32px;
- background-color: #f2f2f2;
- line-height: 32px;
- padding: 0 10px;
- box-sizing: border-box;
- }
- .scenebox{
- display: block;
- width: 100%;
- height: calc(100vh - 155px);
- overflow: auto;
- padding-left: 16px;
- box-sizing: border-box;
- }
- .everyscenebox{
- display: block;
- height: 40px;
- line-height: 40px;
- padding: 0 10px;
- }
- .everyscenebox input{
- position: relative;
- top: 20px;
- transform: translateY(-50%);
- }
- .leftscenebox{
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- width: 140px;
- }
- .search_input {
- width: 38% !important;
- margin-right: 1%;
- float: left;
- height: 38px;
- border: 1px solid #e6e6e6;
- }
- .search_input .layui-select {
- width: 100%;
- border: 0 !important;
- }
- .rightbox{
- padding-left: 30px;
- box-sizing: border-box;
- position: relative;
- height: calc(100vh - 60px);
- }
- .rightbox::before{
- content: ' ';
- display: block;
- width: 1px;
- height: 100%;
- background-color: #f2f2f2;
- position: absolute;
- left: 15px;
- top: -20px;
- }
- .tablebox{
- display: block;
- width: 100%;
- height: calc(100vh - 100px);
- }
- .percentbox{
- display: inline-block;
- width: 40px;
- height: 24px;
- }
- </style>
- <body>
- <div class="toptext">每日学练个数不得低于已设置“添加学练”随机数的总和</div>
- <div class="layui-fluid clearfix">
- <div class="clearfix mainbox">
- <div class="left width33 leftbox">
- <div class="setitbox clearfix ">
- <div class="left nowset testbox">设置试题</div>
- <div class="trainbox left">设置课件</div>
- </div>
- <div class="clearfix scenetitle">
- <div class="left">场景类别</div>
- <div class="right">选择</div>
- </div>
- <div class="scenebox questionbox">
- <div class="clearfix everyscenebox" style="margin-left: -15px;">
- <div class="left leftscenebox">所有分类</div>
- <input class="right" data-type="question" data-idx="-1" type="checkbox" />
- </div>
-
- </div>
- <div class="scenebox trainclassbox" style="display:none;">
- <div class="clearfix everyscenebox" style="margin-left: -15px;">
- <div class="left leftscenebox">所有场景</div>
- <input class="right" data-type="train" data-idx="-1" type="checkbox" />
- </div>
-
- </div>
- </div>
- <div class="left width67 rightbox">
- <div class="clearfix">
- <div class="search_input">
- <form class="layui-form">
- <select name="cate" id="cate" class="layui-select " lay-filter="selectTest">
- <option value="">全部分类</option>
- <option value="question">试题</option>
- <option value="train">课件</option>
- </select>
- </form>
- </div>
- </div>
- <div class="tablebox">
- <table id="LAY-employee-list" lay-filter="LAY-employee-list" style="margin-top:15px;"></table>
- </div>
-
- </div>
- </div>
- <div class="footer">
- <button type="button">保存</button>
- </div>
- </div>
- </body>
- {/block} {block name="js"}
- <script type="text/html" id="editbox">
- <input class="percentbox" data-type="{{d.type}}" data-tid="{{d.id}}" onkeyup="checkInt(this)" type="text" value="{{d.percent}}" />{if !empty($data['amount'])}<span style="font-size: 16px;padding-left: 5px">/{$data['amount']}</span>{/if}
- </script>
- <script>
- var detailarr = [];
- function checkInt (obj) {
- obj.value = obj.value.replace(/[^\d]/g, ""); //清除"-","数字"和"."以外的字符
- obj.value = obj.value.replace(/^[0]/, ""); //禁止第一个字符为.
- obj.value=obj.value<0?0: obj.value;
- obj.value = obj.value > 100 ? 100 : obj.value;
- for(let i in detailarr){
- if(obj.dataset.type== detailarr[i].type&& obj.dataset.tid== detailarr[i].id){
- detailarr[i].percent= obj.value;
- }
- }
- }
- layui.use(['form', 'table'], function () {
- var form = layui.form,
- table = layui.table,
- $ = layui.$;
- detailarr = [];
- var questionarr=[],trainarr=[];
- $('.testbox').click(function(){
- $('.testbox').addClass('nowset');
- $('.trainbox').removeClass('nowset');
- $('.questionbox').show();
- $('.trainclassbox').hide();
- })
- $('.trainbox').click(function () {
- $('.trainbox').addClass('nowset');
- $('.testbox').removeClass('nowset');
- $('.trainclassbox').show();
- $('.questionbox').hide();
- })
- $.ajax({
- url: "{:url('day_study/getTrainType')}",
- type: 'post',
- data: {},
- dataType: 'json',
- success: function (res) {
- if (res.code === 0) {
- var str='';
- trainarr= res.data;
- var flag=true;
- for (var i in res.data) {
- if(res.data[i].selected==1){
- str += '<div class="clearfix everyscenebox">' +
- `<div class="left leftscenebox" title="${res.data[i].type}">` + res.data[i].type + '</div>' + '<span style="margin-left:20px;">题量:' + res.data[i].child_count + '</span>'+
- '<input class="right" data-type="train" type="checkbox" data-idx="' + i + '" checked /> ' +
- '</div>';
- var obj = {
- id: res.data[i].id,
- type: 'train',
- percent: res.data[i].percent
- };
- detailarr.push(obj);
- }else{
- flag = false;
- str += '<div class="clearfix everyscenebox">' +
- `<div class="left leftscenebox" title="${res.data[i].type}">` + res.data[i].type + '</div>' + '<span style="margin-left:20px;">题量:' + res.data[i].child_count + '</span>'+
- '<input class="right" data-type="train" type="checkbox" data-idx="' + i + '" /> ' +
- '</div>';
- }
-
- }
- if(flag){
- $('.trainclassbox input[type="checkbox"]')[0].checked = true;
- }
-
- $('.trainclassbox').append(str);
- } else {
- layer.msg(res.msg, {
- anim: 6
- , time: 2000
- });
- }
- }
- });
- $.ajax({
- url: "{:url('day_study/getQuestionCate')}",
- type: 'post',
- data: {},
- dataType: 'json',
- success: function (res) {
- if (res.code === 0) {
- var str = '';
- questionarr= res.data;
- var flag=true;
- for (var i in res.data) {
- if (res.data[i].selected == 1){
- str += '<div class="clearfix everyscenebox">' +
- `<div class="left leftscenebox" title="${res.data[i].name}">` + res.data[i].name + '</div>' + '<span style="margin-left:20px;">题量:' + res.data[i].child_count + '</span>'+
- '<input class="right" data-type="question" data-idx="' + i + '" type="checkbox" checked /> ' +
- '</div >';
- var obj = {
- id: res.data[i].id,
- type: 'question',
- percent: res.data[i].percent
- };
- detailarr.push(obj);
- }else{
- str += '<div class="clearfix everyscenebox">' +
- `<div class="left leftscenebox" title="${res.data[i].name}">` + res.data[i].name + '</div>' + '<span style="margin-left:20px;">题量:' + res.data[i].child_count + '</span>'+
- '<input class="right" data-type="question" data-idx="' + i + '" type="checkbox" /> ' +
- '</div >';
- flag=false;
- }
-
- }
- if (flag) {
- $('.questionbox input[type="checkbox"]')[0].checked = true;
- }
- $('.questionbox').append(str);
- } else {
- layer.msg(res.msg, {
- anim: 6
- , time: 2000
- });
- }
- }
- });
-
- var tableIns=table.render({
- elem: '#LAY-employee-list'
- , url: "{:url('day_study/setting_detail')}"
- , cellMinWidth: 80 //全局定义常规单元格的最小宽度,layui 2.2.1 新增
- , cols: [[
- { field: 'type', title: '学练类别', templet:function(d){
- return d.type == 'question' ? '试题' : '课件';
- }}
- , { field: 'name', title: '试题场景'}
- , { field: 'child_type', title: '试题类别', }
- , { field: 'child_count', title: '试题数量'}
- , { field: 'percent', width: 137, title: '随机出题', templet:'#editbox', fixed: 'right' }
- ]],
- page: true,
- limit: 10,
- height: 'full-220',
- text: '对不起,加载出现异常!'
- });
- form.on('select(selectTest)', function (data) {
- tableIns.reload({
- where: { //设定异步数据接口的额外参数,任意设
- type: data.value
- }
- , page: {
- curr: 1 //重新从第 1 页开始
- }
- });
- });
-
- $('.mainbox').on('click','input[type="checkbox"]',function () {
- if($(this).data('type')=='question'&& $(this).data('idx')=='-1'){
- if(this.checked){
- for (var i = 1; i < $('.questionbox input[type="checkbox"]').length; i++) {
- var num = $('.questionbox input[type="checkbox"]')[i].dataset.idx;
- $('.questionbox input[type="checkbox"]')[i].checked = true;
- var obj={
- id: questionarr[num].id,
- type:'question',
- percent:''
- };
- detailarr.push(obj);
- }
- }else{
- for (var i = 1; i < $('.questionbox input[type="checkbox"]').length; i++) {
- var num= $('.questionbox input[type="checkbox"]')[i].dataset.idx;
- $('.questionbox input[type="checkbox"]')[i].checked = false;
- for(var j=0;j< detailarr.length;j++){
- if(detailarr[j].id== questionarr[num].id){
- detailarr.splice(j,1)
- }
- }
- }
- }
- }else if($(this).data('type') == 'question' && $(this).data('idx') != '-1'){
- if(!this.checked){
- $('.questionbox input[type="checkbox"]')[0].checked=false;
- var num = $(this).data('idx');
- for (var j = 0; j < detailarr.length; j++) {
- if (detailarr[j].id == questionarr[num].id) {
- detailarr.splice(j, 1)
- }
- }
- }else{
- var flag=true;
- for (var i = 1; i < $('.questionbox input[type="checkbox"]').length; i++){
- if(!$('.questionbox input[type="checkbox"]')[i].checked){
- flag=false;
- }
- }
- if(flag){
- $('.questionbox input[type="checkbox"]')[0].checked = true;
- }
- var obj = {
- id: questionarr[$(this).data('idx')].id,
- type: 'question',
- percent: ''
- };
- detailarr.push(obj);
- }
-
- }
- if($(this).data('type') == 'train' && $(this).data('idx') == '-1'){
- if (this.checked) {
- for (var i = 1; i < $('.trainclassbox input[type="checkbox"]').length; i++) {
- var num = $('.trainclassbox input[type="checkbox"]')[i].dataset.idx;
- $('.trainclassbox input[type="checkbox"]')[i].checked = true;
- var obj = {
- id: trainarr[num].id,
- type: 'train',
- percent: ''
- };
- detailarr.push(obj);
- }
- } else {
- for (var i = 1; i < $('.trainclassbox input[type="checkbox"]').length; i++) {
- var num = $('.trainclassbox input[type="checkbox"]')[i].dataset.idx;
- $('.trainclassbox input[type="checkbox"]')[i].checked = false;
- for (var j = 0; j < detailarr.length; j++) {
- if (detailarr[j].id == trainarr[num].id) {
- detailarr.splice(j, 1)
- }
- }
- }
- }
- } else if ($(this).data('type') == 'train' && $(this).data('idx') != '-1') {
- if (!this.checked) {
- $('.trainclassbox input[type="checkbox"]')[0].checked = false;
- var num = $(this).data('idx');
- for (var j = 0; j < detailarr.length; j++) {
- if (detailarr[j].id == trainarr[num].id) {
- detailarr.splice(j, 1)
- }
- }
- } else {
- var flag = true;
- for (var i = 1; i < $('.trainclassbox input[type="checkbox"]').length; i++) {
- if (!$('.trainclassbox input[type="checkbox"]')[i].checked) {
- flag = false;
- }
- }
- if (flag) {
- $('.trainclassbox input[type="checkbox"]')[0].checked = true;
- }
- var obj = {
- id: trainarr[$(this).data('idx')].id,
- type: 'train',
- percent: ''
- };
- detailarr.push(obj);
- }
-
- }
- setfun();
- })
- function setfun(){
- $.ajax({
- url: "{:url('day_study/setting')}",
- type: 'post',
- data: {
- setting: detailarr.length? detailarr:''
- },
- processdata: false, // 告诉jquery不要处理发送的数据
- contenttype: false, // 告诉jquery不要设置content-type请求头
- success: function (res) {
- if (res.code === 0) {
- table.reload('LAY-employee-list');
- } else {
- layer.msg(res.msg, {
- anim: 6
- , time: 2000
- });
- }
- }
- });
- }
- $('.footer button').click(function(){
- var index = parent.layer.getFrameIndex(window.name);
- $.ajax({
- url: "{:url('day_study/setting')}",
- type: 'post',
- data: {
- setting: detailarr.length ? detailarr : ''
- },
- processdata: false, // 告诉jquery不要处理发送的数据
- contenttype: false, // 告诉jquery不要设置content-type请求头
- success: function (res) {
- if (res.code === 0) {
- parent.location.reload();
- parent.layer.close(index);
- } else {
- layer.msg(res.msg, {
- anim: 6
- , time: 2000
- });
- }
- }
- });
-
- })
- })
- </script>
- {/block}
|