questionadd.html 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808
  1. {extend name="public/layout" /} {block name="title"}商学院{/block} {block name="body"}
  2. {include file="public/head"/}
  3. <script src="/static/js/jquery.min.js"></script>
  4. <style type="text/css">
  5. html,
  6. body {
  7. display: block;
  8. width: 100%;
  9. background-color: #fff;
  10. }
  11. .layui-fluid {
  12. display: block;
  13. border-radius: 5px;
  14. background-color: #ffffff;
  15. padding: 15px 20px;
  16. }
  17. .layui-icon{font-size:20px !important;line-height: 38px;}
  18. .layui-input-inline{line-height: 38px;}
  19. .layui-input-inline input{margin-right: 10px;}
  20. .input-indent-box-small{margin-left:10px;}
  21. .layui-tab {
  22. padding: 15px;
  23. height: 100%;
  24. }
  25. .layui-table-view .layui-table th,
  26. .layui-table-view .layui-table td {
  27. text-align: center;
  28. border-color: #B6CADE;
  29. }
  30. .layui-table thead tr,
  31. .layui-table-header {
  32. background-color: #D4E4ED;
  33. }
  34. .upload-img .area i {
  35. font-size: 50px;
  36. color: #009688;
  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: 260px;
  67. display: inline;
  68. margin-bottom: 5px;
  69. }
  70. .submit-btn{
  71. text-align: right;
  72. }
  73. .select_items{
  74. display: block;
  75. float:left;
  76. margin-left:10px;
  77. }
  78. .layui-input-answer{
  79. width: 330px;
  80. }
  81. .option_alls{
  82. clear: both;
  83. overflow: hidden;
  84. }
  85. .option_alld{
  86. clear: both;
  87. overflow: hidden;
  88. }
  89. .everyoptionboxs{
  90. display: block;
  91. width: 100%;
  92. float: left;
  93. margin-bottom: 10px;
  94. }
  95. .everyoptionboxd{
  96. display: block;
  97. width: 100%;
  98. float: left;
  99. margin: 0px 0px 10px;
  100. position: relative;
  101. }
  102. /*//多图上传*/
  103. .imageDiv {
  104. display: inline-block;
  105. width: 140px;
  106. height: 125px;
  107. -webkit-box-sizing: border-box;
  108. -moz-box-sizing: border-box;
  109. box-sizing: border-box;
  110. border: 1px dashed darkgray;
  111. background: #f8f8f8;
  112. position: relative;
  113. overflow: hidden;
  114. margin-left: 5px;
  115. }
  116. .addImages {
  117. display: inline-block;
  118. width: 140px;
  119. height: 125px;
  120. -webkit-box-sizing: border-box;
  121. -moz-box-sizing: border-box;
  122. box-sizing: border-box;
  123. border: 1px dashed darkgray;
  124. background: #f8f8f8;
  125. position: relative;
  126. overflow: hidden;
  127. }
  128. .text-detail {
  129. margin-top: 40px;
  130. text-align: center;
  131. }
  132. .text-detail>span {
  133. font-size: 40px;
  134. }
  135. .imageDiv div {
  136. width: 100%;
  137. height: 100%;
  138. position: absolute;
  139. top: 0px;
  140. background-color: #e6e6e600;
  141. }
  142. .imageDiv div i {
  143. display: none;
  144. font-size: 31px;
  145. position: absolute;
  146. top: 37%;
  147. left: 40%;
  148. }
  149. .imageDiv div:hover {
  150. background-color: #e6e6e680;
  151. }
  152. .imageDiv div:hover i {
  153. display: block;
  154. cursor: pointer;
  155. }
  156. .rotate180 {
  157. -webkit-transform: rotate(180deg);
  158. transform: rotate(180deg);
  159. }
  160. .layui-edge.rotate180 {
  161. margin-top: -9px;
  162. }
  163. .layui-input-inline.input-longer-inline {
  164. width: 290px;
  165. }
  166. .goback {
  167. float: right;
  168. }
  169. .goback a {
  170. color: #269efb;
  171. }
  172. .goback i {
  173. position: relative !important;
  174. }
  175. @media screen and (max-width: 450px){
  176. .layui-form-item{
  177. position: relative;
  178. }
  179. .layui-form-item .layui-input-inline {
  180. padding-right: 40px !important;
  181. }
  182. .adding {
  183. position: absolute;
  184. right: 10px;
  185. top: 0;
  186. }
  187. }
  188. input:disabled, input[disabled]{
  189. color: black;
  190. opacity: 1;
  191. -webkit-text-fill-color:black;
  192. -webkit-opacity:1;
  193. }
  194. .labels{
  195. display:block;
  196. float:left;
  197. height: 4%;
  198. }
  199. .picDiv{
  200. margin: 110px;
  201. }
  202. .everyoptionboxd,.everyoptionboxs{position: relative;}
  203. .everyoptionboxd .layui-form-radio,.everyoptionboxs .layui-form-checkbox{position: absolute;top:0;left:0;width:13%;height: 38px !important;margin:0 !important;padding: 0 !important;}
  204. .everyoptionboxd .layui-form-radio>i:hover, .layui-form-radioed>i,.layui-form-radio>i,.everyoptionboxs .layui-form-checkbox[lay-skin=primary] i{color:rgba(0.0.0.0);display: none !important;}
  205. .addradiod{background:#249efb !important;color:#fff !important;}
  206. .layui-form-radio>i {
  207. font-size: 18px;
  208. }
  209. .layui-form-select dl{
  210. z-index: 999;
  211. }
  212. .lay-delete {
  213. position: absolute;
  214. right: 20px;
  215. color: red;
  216. cursor: pointer;
  217. }
  218. .edui-default .edui-editor-iframeholder {
  219. min-height: 350px !important;
  220. }
  221. </style>
  222. <body>
  223. <div class="layui-fluid">
  224. <div class="layui-card">
  225. <div class="layui-card-body">
  226. <form class="layui-form" enctype="multipart/form-data" lay-filter="layuiadmin-question-form">
  227. <div class="layui-form-item">
  228. <label class="layui-form-label"><b style="color:red;">*</b>选择题型:</label>
  229. <div class="layui-input-inline" style="width: 380px">
  230. <input type='button' class="layui-btn problem0 problem" id="type0" values="单选" value="单选题">
  231. <input type='button' class="layui-btn layui-btn-primary problem1 problem" id="type1" values="多选" value="多选题">
  232. <input type="button" class="layui-btn layui-btn-primary problem2 problem" id="type2" values="判断" value="判断题">
  233. <input type="button" class="layui-btn layui-btn-primary problem3 problem" id="type3" values="简答" value="简答题">
  234. <input type="hidden" id="typename" name="type" value='单选'>
  235. </div>
  236. </div>
  237. <div class="layui-form-item">
  238. <label class="layui-form-label"><b style="color:red;">*</b>题面内容:</label>
  239. <div class="layui-input-block">
  240. <!-- <textarea name="ask" id="content" cols="50" rows="20" placeholder="请输入题干内容" required></textarea> -->
  241. <textarea id='content' name='ask' cols="50" rows="20" placeholder="请输入题干内容" required style="height: 350px;width: 99%;"></textarea>
  242. </div>
  243. </div>
  244. <div class="layui-form-item">
  245. <label for="type" class="layui-form-label"><b style="color:red;">*</b>分类:</label>
  246. <div class="layui-input-block">
  247. <div class="layui-input-inline" style="width:100%;max-width: 205px;margin-left: 0;">
  248. <select id="cate" name="cate" lay-verify="required" >
  249. <option value="">请选择分类</option>
  250. {volist name="cate" id="vo"}
  251. <option value="{$vo}">{$vo}</option>
  252. {/volist}
  253. </select>
  254. </div>
  255. <!-- <a id="addcate" href="javascript:void(0)"><i class="layui-icon layui-icon-add-circle-fine" style="font-size: 30px;"></i></a> -->
  256. </div>
  257. </div>
  258. <div class="layui-form-item img">
  259. <label class="layui-form-label labels">题面图片:</label>
  260. <div class="imgs">
  261. <div class="picDiv" style="margin:10px 10px 0px;margin-left:110px;">
  262. <div class="addImages" id="evidence_imgs">
  263. <div class="text-detail">
  264. <span>+</span>
  265. <p>选择单、多图</p>
  266. </div>
  267. </div>
  268. </div>
  269. </div>
  270. </div>
  271. <div class="layui-form-item">
  272. <label class="layui-form-label labels"></label>
  273. <div><i style="color: red;margin-right:5px;">*</i>建议上传图片宽高比例7:10,图片大小不超过1M</div>
  274. </div>
  275. <!-- 单选 -->
  276. <div class="con0 con">
  277. <div class="layui-form-item">
  278. <label for="type" class="layui-form-label"><b style="color:red;">*</b>选项名称:</label>
  279. <!-- <div class="layui-input-block"> -->
  280. <div class="layui-input-inline" style="width: 44%;">
  281. <input class="layui-input" type="hidden" name="option_named" id="option_named" value="" placeholder="请输入" title="题面" autocomplete="off" >
  282. </div>
  283. <button type="button" class="layui-btn" id="quea_d">添加选项</button>
  284. <!-- </div> -->
  285. </div>
  286. <div class="layui-form-item">
  287. <label class="layui-form-label"></label>
  288. <div class="layui-input-block option_alld">
  289. <div class="everyoptionboxd">
  290. <input style="width:13%;font-size:15px;padding: 0px;margin-bottom: 10px;" type="text" class="layui-btn layui-btn-primary" readonly name="option0[]" value="A">
  291. <textarea id='textarea_content_A' name="answer0[0]" cols="50" rows="20" placeholder="请输入内容" required style="height: 350px;width: 99%;"></textarea>
  292. <input type="radio" name="checkbox0" title="" lay-skin="primary" value="A">
  293. </div>
  294. <div class="everyoptionboxd">
  295. <input style="width:13%;font-size:15px;padding: 0px;margin-bottom: 10px;" type="text" class="layui-btn layui-btn-primary" readonly name="option0[]" value="B">
  296. <textarea id='textarea_content_B' name="answer0[1]" cols="50" rows="20" placeholder="请输入内容" required style="height: 350px;width: 99%;"></textarea>
  297. <input type="radio" name="checkbox0" title="" lay-skin="primary" value="B">
  298. </div>
  299. </div>
  300. </div>
  301. </div>
  302. <!-- 多选 -->
  303. <div class="con1 con layui-hide">
  304. <div class="layui-form-item">
  305. <label for="type" class="layui-form-label"><b style="color:red;">*</b>选项名称:</label>
  306. <!-- <div class="layui-input-block"> -->
  307. <div class="layui-input-inline" style="width: 44%;">
  308. <input class="layui-input" type="hidden" name="option_names" id="option_names" value="" placeholder="请输入" title="题面" autocomplete="off" >
  309. </div>
  310. <button type="button" class="layui-btn" id="quea_s">添加选项</button>
  311. <!-- </div> -->
  312. </div>
  313. <div class="layui-form-item">
  314. <label class="layui-form-label"></label>
  315. <div class="layui-input-block option_alls">
  316. <div class="everyoptionboxs" data-offtrue='true'>
  317. <input style="width:13%;font-size:15px;padding: 0px;margin-bottom: 10px;" type="text" class="layui-btn layui-btn-primary checkbox_li" readonly name="option1[]" value="A">
  318. <textarea id='textarea_duoxuan_A' name="answer1[0]" cols="50" rows="20" placeholder="请输入内容" required style="height: 350px !important;width: 99%;"></textarea>
  319. <input type="checkbox" name="checkbox1[]" title="" lay-skin="primary" value="A">
  320. </div>
  321. <div class="everyoptionboxs" data-offtrue='true'>
  322. <input style="width:13%;font-size:15px;padding: 0px;margin-bottom: 10px;" type="text" class="layui-btn layui-btn-primary checkbox_li" readonly name="option1[]" value="B">
  323. <textarea id='textarea_duoxuan_B' name="answer1[1]" cols="50" rows="20" placeholder="请输入内容" required style="height: 350px !important;width: 99%;"></textarea>
  324. <input type="checkbox" name="checkbox1[]" title="" lay-skin="primary" value="B">
  325. </div>
  326. </div>
  327. </div>
  328. </div>
  329. <!-- 判断题 -->
  330. <div class="layui-form-item con2 con layui-hide">
  331. <label class="layui-form-label"><b style="color:red;">*</b>正确答案:</label>
  332. <div class="layui-input-block">
  333. <input type="hidden" id="answer2" name="answer2" value="1" lay-verify="required">
  334. <input type="button" class="layui-btn panduan1 panduan" onclick="panduan(1)" value="正确">
  335. <input type="button" class="layui-btn layui-btn-primary panduan2 panduan" onclick="panduan(2)" value="错误">
  336. </div>
  337. </div>
  338. <!-- 简答题 -->
  339. <div class="layui-form-item con3 con layui-hide">
  340. <label class="layui-form-label">参考答案:</label>
  341. <div class="layui-input-block">
  342. <textarea name="content3" cols="6" autocomplete="off" id="jiandan_answer" class="layui-textarea"></textarea>
  343. </div>
  344. </div>
  345. <div class="layui-form-item con3 con layui-hide">
  346. <label class="layui-form-label"><b style="color:red;">*</b>答案关键字:</label>
  347. <div class="layui-input-block">
  348. <textarea name="answer3" cols="6" autocomplete="off" id="jiandan_answer" class="layui-textarea" placeholder="请使用竖杠“|”间隔"></textarea>
  349. </div>
  350. </div>
  351. <div class="layui-form-item submit-btn">
  352. <input class="layui-btn " type="button" lay-submit lay-filter="layuiadmin-question-submit" id="layuiadmin-anli-submit" value="确认提交">
  353. </div>
  354. </form>
  355. </div>
  356. </div>
  357. </div>
  358. </body>
  359. {/block}
  360. {block name="js"}
  361. <!-- 配置文件 -->
  362. <script type="text/javascript" src="__STATIC__/ueditor/dist/utf8-php/ueditor.config.js"></script>
  363. <!-- 编辑器源码文件 -->
  364. <script type="text/javascript" src="__STATIC__/ueditor/dist/utf8-php/ueditor.all.js"></script>
  365. <!-- 实例化编辑器 -->
  366. <script type="text/javascript">
  367. setEditorFunc('content');
  368. setEditorFunc('textarea_content_A');
  369. setEditorFunc('textarea_content_B');
  370. setEditorFunc('textarea_duoxuan_A');
  371. setEditorFunc('textarea_duoxuan_B');
  372. function setEditorFunc(element) {
  373. UE.getEditor(element,{
  374. toolbars: [
  375. [
  376. "fullscreen",
  377. "bold",
  378. "italic",
  379. "underline",
  380. "fontborder",
  381. "strikethrough",
  382. "superscript",
  383. "subscript",
  384. "removeformat",
  385. "formatmatch",
  386. "autotypeset",
  387. "blockquote",
  388. "pasteplain",
  389. "|",
  390. "forecolor",
  391. "backcolor",
  392. "insertorderedlist",
  393. "insertunorderedlist",
  394. "|",
  395. "rowspacingtop",
  396. "rowspacingbottom",
  397. "lineheight",
  398. "|",
  399. "paragraph",
  400. "fontfamily",
  401. "fontsize",
  402. "|",
  403. "directionalityltr",
  404. "directionalityrtl",
  405. "indent",
  406. "|",
  407. "justifyleft",
  408. "justifycenter",
  409. "justifyright",
  410. "justifyjustify",
  411. "|",
  412. "touppercase",
  413. "tolowercase",
  414. "simpleupload",
  415. "|",
  416. "imagenone",
  417. "imageleft",
  418. "imageright",
  419. "imagecenter",
  420. "|",
  421. "horizontal",
  422. "spechars",
  423. "preview",
  424. ]]
  425. });
  426. }
  427. </script>
  428. <script src="__STATIC__/layui/layui/layui.js"></script>
  429. <script>
  430. layui.config({
  431. base: '__LAYUI__/' //静态资源所在路径
  432. ,
  433. urlbase: '/sys'
  434. }).extend({
  435. index: 'lib/index' //主入口模块
  436. }).use(['index', 'table', 'layedit', 'element', 'upload'], function() {
  437. var $ = layui.$,
  438. layedit = layui.layedit,
  439. upload = layui.upload,
  440. form = layui.form,
  441. files;
  442. var active = {
  443. gettype: function(type) {
  444. var value = type;
  445. if (type == '单选') {
  446. type = 0;
  447. } else if (type=='多选') {
  448. type = 1;
  449. } else if (type=='判断') {
  450. type = 2;
  451. } else if (type=='简答') {
  452. type = 3;
  453. }
  454. var id = '.problem'+type;
  455. $('.problem').addClass('layui-btn-primary');
  456. $(id).removeClass('layui-btn-primary');
  457. $('#typename').val(value);
  458. $('.con').addClass('layui-hide');
  459. $('.con'+type).removeClass('layui-hide');
  460. if (type == 0) {
  461. $('.everyoptionboxd input').attr('lay-verify',"required");
  462. $('.everyoptionboxs input').attr('lay-verify',"");
  463. $('#jiandan_answer').attr('lay-verify',"");
  464. } else if (type==1) {
  465. $('.everyoptionboxs input').attr('lay-verify',"required");
  466. $('.everyoptionboxd input').attr('lay-verify',"");
  467. $('#jiandan_answer').attr('lay-verify',"");
  468. form.render('select');
  469. } else if (type==3) {
  470. $('.everyoptionboxs input').attr('lay-verify',"");
  471. $('.everyoptionboxd input').attr('lay-verify',"");
  472. $('#jiandan_answer').attr('lay-verify',"");
  473. form.render('select');
  474. } else if(type==2){
  475. $('.everyoptionboxs input').attr('lay-verify',"");
  476. $('.everyoptionboxd input').attr('lay-verify',"");
  477. $('#jiandan_answer').attr('lay-verify',"");
  478. form.render('select');
  479. }
  480. }
  481. };
  482. $(document).on('click','.layui-form-radio',function(obj){
  483. var _this=this;
  484. jQuery(_this).siblings('.layui-btn-primary').addClass('addradiod').parents('.everyoptionboxd').siblings().find('.layui-btn-primary').removeClass('addradiod');
  485. })
  486. $(document).on('click','.layui-form-checkbox',function(obj){
  487. var _this=this;
  488. if(jQuery(_this).hasClass('layui-form-checked')){
  489. jQuery(_this).siblings('.layui-btn-primary').addClass('addradiod')
  490. }else{
  491. jQuery(_this).siblings('.layui-btn-primary').removeClass('addradiod')
  492. }
  493. })
  494. form.on('submit(layuiadmin-question-submit)', function(data) {
  495. var index = parent.layer.getFrameIndex(window.name);
  496. var formData = new FormData();
  497. let danxuan = false;
  498. let duoxuan = false;
  499. Object.keys(data.field).forEach(key => {
  500. if (key.indexOf('answer0') > -1 && !data.field[key]) {
  501. danxuan = true;
  502. }
  503. if (key.indexOf('answer1') > -1 && !data.field[key]) {
  504. duoxuan = true;
  505. }
  506. formData.append(key, data.field[key]);
  507. })
  508. if (danxuan && data.field.type == '单选') {
  509. layer.msg('请完善选项内容', {
  510. anim: 6
  511. });
  512. return false;
  513. }
  514. if (duoxuan && data.field.type == '多选') {
  515. layer.msg('请完善选项内容', {
  516. anim: 6
  517. });
  518. return false;
  519. }
  520. if (data.field.ask=='') {
  521. layer.msg('请填写题干内容', {
  522. anim: 6
  523. });
  524. return false;
  525. }
  526. formData.delete('imgs');
  527. if (typeof(files) == "undefined" || JSON.stringify(files)=="{}") {
  528. // layer.msg('请至少选择一张图片', {
  529. // anim: 6
  530. // });
  531. // return false;
  532. } else {
  533. for(i in files) {
  534. formData.append('imgs[]', files[i]);
  535. }
  536. }
  537. // 单击之后提交按钮不可选,防止重复提交
  538. var loading = layer.load(0, {
  539. shade: false,
  540. time: 2*1000
  541. });
  542. var DISABLED = 'layui-btn-disabled';
  543. var target = '#layuiadmin-anli-submit';
  544. $(target).addClass(DISABLED);
  545. $(target).attr('disabled', 'disabled');
  546. $.ajax({
  547. url: '{:url("exam/questionsave")}',
  548. type: 'post',
  549. data: formData,
  550. dataType: 'json',
  551. processData: false,
  552. contentType: false,
  553. success: function(res) {
  554. if(res.code === 0) {
  555. layer.msg(res.msg, {
  556. anim: 0
  557. ,time: 2000
  558. }, function() {
  559. parent.layui.table.reload('evidence-table'); //重载表格
  560. window.location.reload();
  561. parent.layer.close(index); //再执行关闭
  562. });
  563. } else {
  564. layer.msg(res.msg, {
  565. anim: 6
  566. ,time: 2000
  567. });
  568. $(target).removeClass(DISABLED);
  569. $(target).removeAttr('disabled');
  570. layer.close(loading);
  571. }
  572. },
  573. error : function(e){
  574. $(target).removeClass(DISABLED);
  575. $(target).removeAttr('disabled');
  576. layer.close(loading);
  577. }
  578. });
  579. return false;
  580. });
  581. $('#addcate').click(function () {
  582. layer.prompt({
  583. formType: 0,
  584. value: '',
  585. title: ['请输入类型', 'color:#333333;background-color:#D8E6F1;'],
  586. }, function (value, index, elem) {
  587. $.ajax({
  588. url: '{:url("exam/addquestioncate")}',
  589. data: { cate: value },
  590. type: 'post',
  591. success: function (res) {
  592. $('#cate').append('<option value="' + value + '">' + value + '</option>');
  593. form.render('select');
  594. layer.close(index);
  595. }
  596. });
  597. });
  598. });
  599. //单选题增加选项
  600. $('#quea_d').click(function(){
  601. var value = $('#option_named').val();
  602. // if (value=='') {
  603. // layer.msg('请填写选项');
  604. // return false;
  605. // }
  606. var arr=$('.option_alld .layui-btn-primary');
  607. var val=arr[arr.length-1].value;
  608. var arr=['A','B','C','D','E','F','G','H'];
  609. let str="";
  610. let index = null;
  611. for(let i in arr){
  612. if(val==arr[i]){
  613. index = i*1+1;
  614. str=arr[i*1+1];
  615. break;
  616. }
  617. }
  618. if (str=='' || str==undefined) {
  619. layer.msg('最多添加8个选项');
  620. return false;
  621. }
  622. let word = Date.now();
  623. var option = '';
  624. option += '<div class="everyoptionboxd">';
  625. option += '<i class="layui-icon layui-icon-delete lay-delete" data-word="'+str+'"></i>';
  626. option += '<input style="width:13%;font-size:15px;margin-bottom: 10px" type="text" class="layui-btn layui-btn-primary" readonly name="option0[]" value="'+str+'"> ';
  627. option += '<textarea id="textarea_content_'+word+'" name="answer0['+index+']" cols="50" rows="20" placeholder="请输入内容" required style="height: 350px;width: 99%;">'+value+'</textarea>';
  628. option += '<input type="radio" name="checkbox0" title="" lay-skin="primary" value="'+str+'"> ';
  629. option += '</div>';
  630. $('.option_alld').append(option);
  631. form.render();
  632. let timer = setTimeout(() => {
  633. clearTimeout(timer);
  634. setEditorFunc(`textarea_content_${word}`, `textarea_content_${str}`);
  635. $(".lay-delete").click(function() {
  636. $(this).parent().remove();
  637. })
  638. }, 500)
  639. });
  640. //多选增加选项
  641. $('#quea_s').click(function(){
  642. var value = $('#option_names').val();
  643. // if (value=='') {
  644. // layer.msg('请填写选项');
  645. // return false;
  646. // }
  647. var arr=$('.option_alls .layui-btn-primary');
  648. var val=arr[arr.length-1].value;
  649. var arr=['A','B','C','D','E','F','G','H'];
  650. let str="";
  651. let index = null;
  652. for(let i in arr){
  653. if(val==arr[i]){
  654. index = i*1+1;
  655. str=arr[i*1+1];
  656. break;
  657. }
  658. }
  659. if (str=='' || str==undefined) {
  660. layer.msg('最多添加8个选项');
  661. return false;
  662. }
  663. let word = Date.now();
  664. var option = '';
  665. option += '<div class="everyoptionboxs">';
  666. option += '<i class="layui-icon layui-icon-delete lay-delete" data-word="'+str+'"></i>';
  667. option += '<input style="width:13%;font-size:15px;margin-bottom: 10px;" type="text" class="layui-btn layui-btn-primary" readonly name="option1[]" value="'+str+'"> ';
  668. option += '<textarea id="textarea_duoxuan_'+word+'" name="answer1['+index+']" cols="50" rows="20" placeholder="请输入内容" required style="height: 350px;width: 99%;"></textarea>';
  669. option += '<input type="checkbox" name="checkbox1[]" title="" lay-skin="primary" value="'+str+'"> ';
  670. option += '</div>';
  671. $('.option_alls').append(option);
  672. form.render();
  673. let timer = setTimeout(() => {
  674. clearTimeout(timer);
  675. setEditorFunc(`textarea_duoxuan_${word}`);
  676. $(".lay-delete").click(function() {
  677. $(this).parent().remove();
  678. })
  679. }, 500)
  680. });
  681. //切换选择判断简答
  682. $('#type0').click(function(){
  683. var type = $('#type0').attr('values');
  684. $('#typename').val(type);
  685. active.gettype(type)
  686. });
  687. $('#type1').click(function(){
  688. var type = $('#type1').attr('values');
  689. $('#typename').val(type);
  690. active.gettype(type)
  691. });
  692. $('#type2').click(function(){
  693. var type = $('#type2').attr('values');
  694. $('#typename').val(type);
  695. active.gettype(type)
  696. });
  697. $('#type3').click(function(){
  698. var type = $('#type3').attr('values');
  699. $('#typename').val(type);
  700. active.gettype(type)
  701. });
  702. // 多图上传
  703. upload.render({
  704. elem: '#evidence_imgs',
  705. accept: 'images',
  706. url: '/upload/',
  707. exts: 'jpg|png|bmp|jpeg|JPG|PNG|BMP|JPEG',
  708. field: 'imgs',
  709. size: 5 * 1024,
  710. auto: false,
  711. multiple: true,
  712. choose: function(obj) {
  713. files = obj.pushFile();
  714. length = $('.imageDiv').length;
  715. obj.preview(function(index, file, result) {
  716. length++;
  717. if(length > 8) {
  718. if(length == 9) layer.msg('限制八张图片以下');
  719. delete files[index];
  720. } else {
  721. $('.picDiv').prepend('<div class="imageDiv" data-id="' + index + '"><img src="' + result + '" alt="' + file.name + '" class="layui-upload-img" width="100%" height="100%"><div><i class="layui-icon layui-icon-delete"></i></div></div>');
  722. }
  723. });
  724. }
  725. });
  726. $('.picDiv').on('click', 'i', function() {
  727. var that = this;
  728. layer.confirm('确定删除该图片么?',{title: ['信息', 'color:#333333;background-color:#D8E6F1;']}, function(index) {
  729. var imgDiv = $(that).closest('.imageDiv');
  730. if(id = imgDiv.data('id')) {
  731. delete files[id];
  732. }
  733. imgDiv.remove();
  734. layer.close(index);
  735. });
  736. });
  737. });
  738. function gettype(type){
  739. var id = '.problem'+type;
  740. $('.problem').addClass('layui-btn-primary');
  741. $(id).removeClass('layui-btn-primary');
  742. $('#typename').val(type);
  743. $('.con').addClass('layui-hide');
  744. $('.con'+type).removeClass('layui-hide');
  745. }
  746. function panduan(type){
  747. var id = '.panduan'+type;
  748. $('.panduan').addClass('layui-btn-primary');
  749. $(id).removeClass('layui-btn-primary');
  750. $('#answer2').val(type);
  751. }
  752. </script>
  753. {/block}