papereditpublish.html 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514
  1. {extend name="public/layout" /} {block name="title"}商学院{/block} {block name="body"}
  2. <style type="text/css">
  3. html,
  4. body {
  5. display: block;
  6. width: 100%;
  7. background-color: #fff;
  8. }
  9. .layui-fluid {
  10. display: block;
  11. border-radius: 5px;
  12. background-color: #ffffff;
  13. padding: 15px 30px;
  14. }
  15. .layui-icon{font-size:18px !important;line-height: 38px;}
  16. .layui-input-inline{line-height: 38px;}
  17. .layui-input-inline input{margin-right: 10px;}
  18. .layui-form-item .layui-input-inline{}
  19. .input-indent-box-small{margin-left:10px;}
  20. .layui-tab {
  21. padding: 15px;
  22. height: 100%;
  23. }
  24. .layui-table-view .layui-table th,
  25. .layui-table-view .layui-table td {
  26. text-align: center;
  27. border-color: #B6CADE;
  28. }
  29. .layui-table thead tr,
  30. .layui-table-header {
  31. background-color: #D8E6F1;
  32. }
  33. .upload-img .area i {
  34. font-size: 50px;
  35. color: #009688;
  36. }
  37. /*///*/
  38. .text-detail>span {
  39. font-size: 40px;
  40. }
  41. .imageDiv div {
  42. width: 100%;
  43. height: 100%;
  44. position: absolute;
  45. top: 0px;
  46. background-color: #e6e6e600;
  47. }
  48. .imageDiv div i {
  49. display: none;
  50. font-size: 31px;
  51. position: absolute;
  52. top: 37%;
  53. left: 40%;
  54. }
  55. .imageDiv div:hover {
  56. background-color: #e6e6e680;
  57. }
  58. .imageDiv div:hover i {
  59. display: block;
  60. cursor: pointer;
  61. }
  62. .layui-input-inline.input-longer-inline {
  63. width: 290px;
  64. }
  65. .layui-item-inline{
  66. width: 290px;
  67. display: inline;
  68. margin-left: 20px;
  69. margin-bottom: 5px;
  70. }
  71. .submit-btn{
  72. text-align: right;
  73. }
  74. .select_items{
  75. display: block;
  76. float:left;
  77. margin-left:10px;
  78. }
  79. .layui-input-answer{
  80. width: 330px;
  81. }
  82. .layui-titlebox{
  83. position: relative;
  84. left: 0;
  85. height: 40px;
  86. white-space: nowrap;
  87. font-size: 0;
  88. border-bottom-width: 1px;
  89. border-bottom-style: solid;
  90. transition: all .2s;
  91. -webkit-transition: all .2s;
  92. border-color: #e6e6e6;
  93. color: #666;
  94. background-color: #f2f2f2;
  95. margin-bottom: 2%;
  96. }
  97. .layui-titlebox li {
  98. display: inline-block;
  99. vertical-align: middle;
  100. font-size: 14px;
  101. transition: all .2s;
  102. -webkit-transition: all .2s;
  103. position: relative;
  104. line-height: 40px;
  105. width: 25%;
  106. text-align: center;
  107. cursor: pointer;
  108. box-sizing: border-box;
  109. }
  110. .layui-titlebox .layui-this {
  111. color: #000;
  112. border-bottom-color: transparent;
  113. background-color: #249EFB;
  114. color: #FFFFFF;
  115. }
  116. .layui-titlebox .layui-this:after {
  117. position: absolute;
  118. left: 0;
  119. top: 0;
  120. content: '';
  121. width: 100%;
  122. height: 41px;
  123. border-width: 1px;
  124. border-style: solid;
  125. border-color: #e6e6e6;
  126. border-bottom-color: #fff;
  127. border-radius: 2px 2px 0 0;
  128. box-sizing: border-box;
  129. pointer-events: none;
  130. }
  131. .layui-btn {
  132. padding: 0px 20px;
  133. }
  134. .layui-form-radio>i {
  135. font-size: 18px;
  136. }
  137. </style>
  138. <body>
  139. <div class="layui-fluid">
  140. <div class="layui-card">
  141. <ul class="layui-titlebox">
  142. <li>创建试卷</li>
  143. <li>选择试题</li>
  144. <li>设置分值</li>
  145. <li class="layui-this">发布考试</li>
  146. </ul>
  147. <div class="layui-card-body">
  148. <form class="layui-form" enctype="multipart/form-data" lay-filter="layuiadmin-publish-form">
  149. <input type="hidden" value="{:$paperid}" name="paperid">
  150. <!-- <div class="layui-form-item">
  151. <label class="layui-form-label"><span style="color:red;">*</span>考试范围:</label>
  152. <div class="layui-input-block">
  153. <select name="scope_org" id="org" lay-filter="org_select" lay-verify="required">
  154. <option value=""></option>
  155. </select>
  156. </div>
  157. </div> -->
  158. <div class="layui-form-item" id="range">
  159. <label class="layui-form-label"><span style="color: red;">*</span>考试人员</label>
  160. <div class="layui-input-block">
  161. <div id="range_person"></div>
  162. </div>
  163. </div>
  164. <div class="layui-form-item layui-hide">
  165. <label class="layui-form-label"><span style="color:red;">*</span>考试对象:</label>
  166. <div class="layui-input-inline" style="width: 380px">
  167. <input type="radio" name="target_group" lay-filter="targetGroup" value="全员" title="全员" checked>
  168. <input type="radio" name="target_group" lay-filter="targetGroup" value="新兵" title="新兵" >
  169. <input type="radio" name="target_group" lay-filter="targetGroup" value="老兵" title="老兵" >
  170. </div>
  171. </div>
  172. <div class="layui-form-item">
  173. <label class="layui-form-label"><span style="color:red;">*</span>考试时长(分钟):</label>
  174. <div class="layui-input-block">
  175. <input class="layui-input layui-input-inline " type="number" name="duringtime" value="45" placeholder="考试时长 比如:60" title="考试时长" autocomplete="off" lay-verify="required">
  176. </div>
  177. </div>
  178. <div class="layui-form-item layui-hide">
  179. <label class="layui-form-label"><span style="color:red;">*</span>及格设置:</label>
  180. <div class="layui-input-block">
  181. <input class="layui-input layui-input-inline " type="number" name="base_score" value="" placeholder="及格分数 比如:60" title="及格分数" autocomplete="off" lay-verify="required">
  182. </div>
  183. </div>
  184. <div class="layui-form-item">
  185. <label class="layui-form-label"><span style="color:red;">*</span>考试时间:</label>
  186. <div class="layui-input-inline " >
  187. <input type="text" class="layui-input layui-input-inline" name="starttime" id="starttime" placeholder="开始时间" autocomplete="off" lay-verify="required">
  188. <span style="margin-right: 10px">至</span>
  189. <input type="text" class="layui-input layui-input-inline" name="endtime" id="endtime" placeholder="结束时间" autocomplete="off" lay-verify="required">
  190. </div>
  191. </div>
  192. <div class="layui-form-item">
  193. <label class="layui-form-label">审核方式:</label>
  194. <div class="layui-input-block " >
  195. <input type="radio" name="checkway" lay-filter="checkway" value="sys" title="系统审核" checked>
  196. <input type="radio" name="checkway" lay-filter="checkway" value="employee" title="人工审核" >
  197. </div>
  198. </div>
  199. <!--<div class="layui-form-item" style="display: none !important;">
  200. <label class="layui-form-label">状态:</label>
  201. <div class="layui-input-block " >
  202. <input type="radio" name="state" lay-filter="state" value="0" title="保存草稿" checked>
  203. <input type="radio" name="state" lay-filter="state" value="1" title="正式发布" >
  204. </div>
  205. </div>-->
  206. <div class="layui-form-item" id="person">
  207. <label class="layui-form-label"><span style="color: red;">*</span>审核人员</label>
  208. <div class="layui-input-block">
  209. <div id="label"></div>
  210. </div>
  211. </div>
  212. <div class="layui-form-item layui-hide">
  213. <label class="layui-form-label">备注:</label>
  214. <div class="layui-input-block " >
  215. <input class="layui-input" type="text" name="desc" value="" title="备注" autocomplete="off">
  216. </div>
  217. </div>
  218. <div class="layui-form-item submit-btn" style="text-align: center;">
  219. <input class="layui-btn " type="button" lay-filter="" id="return" value="上一步">
  220. <input class="layui-btn " type="button" lay-submit lay-filter="layuiadmin-publish-submit" id="layuiadmin-publish-submit" value="保存并发布试卷">
  221. </div>
  222. <!-- <div class="layui-form-item submit-btn">
  223. <input class="layui-btn " type="button" lay-submit lay-filter="layuiadmin-publish-submit" id="layuiadmin-publish-submit" value="发布试卷">
  224. </div> -->
  225. </form>
  226. </div>
  227. </div>
  228. </div>
  229. </body>
  230. {/block}
  231. {block name="js"}
  232. <script src="__STATIC__/layui/layui/layui.js"></script>
  233. <script src="__STATIC__/layui/layui/lay/modules/xm-select.js" type="text/javascript" charset="utf-8"></script>
  234. <script>
  235. var orgids_str = '{:$orgids}';
  236. var orgids = JSON.parse(orgids_str);
  237. var org = eval('{$org|raw}');
  238. var data = JSON.parse('{:$paperinfostr}');
  239. layui.config({
  240. base: '__LAYUI__/' //静态资源所在路径
  241. ,
  242. urlbase: '/sys'
  243. }).extend({
  244. index: 'lib/index' //主入口模块
  245. }).use(['index', 'table', 'layedit', 'laydate'], function() {
  246. var $ = layui.$,
  247. layedit = layui.layedit,
  248. laydate = layui.laydate,
  249. form = layui.form;
  250. //
  251. var obj = {
  252. target_group : data.target_group,
  253. base_score : data.base_score,
  254. starttime : data.starttime,
  255. endtime : data.endtime,
  256. checkway : data.checkway,
  257. desc : data.desc,
  258. state : 1,//data.state
  259. duringtime : data.duringtime,
  260. };
  261. form.val("layuiadmin-publish-form", obj);
  262. if (data.checkway=='sys') {
  263. $('#person').hide();
  264. }else{
  265. $('#person').show();
  266. }
  267. //监听审核方式单项框
  268. form.on('radio(checkway)', function (data) {
  269.   console.log( data );  //打印当前选择的信息
  270. // if( data.elem.checked){      //判断当前多选框是选中还是取消选中
  271. // alert('当前选中');
  272. // }else{
  273. //      alert('取消选中') 
  274. //    }
  275.   var value = data.value; // 当前选中的value值
  276. if (value=="employee") {
  277. $('#person').show();
  278. } else {
  279. $('#person').hide();
  280. }
  281. });
  282. //
  283. $('#org').append(setOrgOption(org, '',data.scope_org));
  284. form.render('select')
  285. laydate.render({
  286. elem: '#starttime'
  287. ,type: 'datetime',
  288. trigger: 'click'//呼出事件改成click
  289. });
  290. laydate.render({
  291. elem: '#endtime'
  292. ,type: 'datetime',
  293. trigger: 'click'//呼出事件改成click
  294. });
  295. form.on('submit(layuiadmin-publish-submit)', function(data) {
  296. var index = parent.layer.getFrameIndex(window.name);
  297. var formData = new FormData(data.form);
  298. var checkway = 'sys';
  299. var employee = '';
  300. formData.forEach((value, key) => {
  301. console.log("key %s: value %s", key, value);
  302. if (key=='checkway') {
  303. checkway = value;
  304. }
  305. if (key=='approve_employee_ids') {
  306. employee = value;
  307. }
  308. })
  309. if (checkway=='employee' && employee=='') {
  310. layer.msg('人工审核请选择审核人员', {
  311. anim: 6
  312. ,time: 2000
  313. });
  314. return false;
  315. }
  316. $.ajax({
  317. url: '{:url("exam/papereditpublish")}',
  318. type: 'post',
  319. data: formData,
  320. dataType: 'json',
  321. processData: false,
  322. contentType: false,
  323. success: function(res) {
  324. if(res.code === 0) {
  325. layer.msg(res.msg, {
  326. anim: 0
  327. ,time: 2000
  328. }, function() {
  329. parent.layui.table.reload('LAY-exam-paper-list'); //重载表格
  330. parent.layer.close(index); //再执行关闭
  331. });
  332. } else {
  333. layer.msg(res.msg, {
  334. anim: 6
  335. ,time: 2000
  336. });
  337. }
  338. }
  339. });
  340. return false;
  341. });
  342. form.on('select(org_select)', function (data) {
  343. var val = data.value;
  344. $.ajax({
  345. url: '{:url("org/employee")}'
  346. , data: { org: val }
  347. , type: 'get'
  348. , success: function (res) {
  349. if (res.code == 0) {
  350. $('#employee').html('<option value="">请选择</option>');
  351. res.data.forEach(element => {
  352. $('#employee').append('<option value="' + element.id + '">' + element.name + '</option>');
  353. });
  354. form.render('select')
  355. }
  356. }
  357. });
  358. });
  359. function setOrgOption(opt, sj,org_id) {
  360. var html = '';
  361. var org = org_id;
  362. var htmls = '';
  363. opt.forEach(element => {
  364. if (org==element.id) {
  365. htmls = 'selected';
  366. }else{
  367. htmls = '';
  368. }
  369. if(orgids.length > 0){
  370. if(in_array(element.id,orgids)) {
  371. html += '<option '+htmls+' value="' + element.id + '">' + sj + element.title + '</option>';
  372. }
  373. }
  374. if (element.children.length > 0) html += setOrgOption(element.children, sj + '-',org);
  375. });
  376. return html;
  377. }
  378. function in_array(search,array){
  379. for(var i in array){
  380. if(array[i] == search){
  381. return true;
  382. }
  383. }
  384. return false;
  385. }
  386. //考试范围选择人员
  387. var approve_ids = xmSelect.render({
  388. el: "#range_person",
  389. autoRow: true,
  390. filterable: true,
  391. tips: '考试人员',
  392. layVerify:'required',
  393. toolbar: {
  394. //工具条,全选,清空,反选,自定义
  395. show: true,
  396. list: [
  397. 'ALL',
  398. 'CLEAR',
  399. 'REVERSE'
  400. ]
  401. },
  402. tree: {
  403. show: true,
  404. showFolderIcon: true,
  405. showLine: true,
  406. indent: 20,
  407. expandedKeys: [ -3 ],
  408. },
  409. height: "200px",
  410. data: [],
  411. //文本显示模式
  412. //处理方式
  413. });
  414. $(function(){
  415. selectperson(data.assessment);
  416. });
  417. function selectperson(ids){
  418. setTimeout(function(){
  419. //data是ajax异步获取的
  420. $.ajax({
  421. type:"get",
  422. url:"{:url('exam/get_person')}",
  423. data:{type:1,id:ids},
  424. dataType: 'json',
  425. success:function(data) {
  426. // var data = JSON.parse(data);
  427. // var res = JSON.parse(data);
  428. //通过ajax 获取json数据,异步更新多选下拉框的值
  429. approve_ids.update({data:data})
  430. }
  431. });
  432. },100);
  433. }
  434. //多选审核人员
  435. var options = {
  436. el: '#label',
  437. name: 'approve_employee_ids',//表单的name属性
  438. layVerify: '',
  439. //layVerType: 'tips',//提示类型 同layui
  440. tips: '审核人员',
  441. toolbar: {
  442. //工具条,全选,清空,反选,自定义
  443. show: true,
  444. list: [
  445. 'ALL',
  446. 'CLEAR',
  447. 'REVERSE'
  448. ]
  449. },
  450. data: [],
  451. // max: 1,
  452. };
  453. var label = xmSelect.render(options)
  454. $(function(){
  455. selectdata(data.approve_employee_ids);
  456. });
  457. function selectdata(personid){
  458. setTimeout(function(){
  459. //data是ajax异步获取的
  460. $.ajax({
  461. type:"get",
  462. url:"{:url('exam/get_person')}",
  463. data:{id:personid},
  464. dataType: 'json',
  465. success:function(data) {
  466. var data = data;
  467. //通过ajax 获取json数据,异步更新多选下拉框的值
  468. label.update({data: data})
  469. }
  470. });
  471. },100);
  472. }
  473. //上一步
  474. $('#return').click(function(){
  475. var paperid = '{:$paperid}';
  476. window.location.href = '{:url("exam/papereditscore")}?paperid='+paperid;
  477. })
  478. });
  479. </script>
  480. {/block}