add.html 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709
  1. {extend name="public/layout"/} {block name="title"}VR楼书{/block} {block name="body"}
  2. <link rel="stylesheet" href="__STATIC__/css/csspc.css">
  3. <link rel="stylesheet" href="__STATIC__/css/font.css">
  4. <style type="text/css">
  5. html,body{height: 100%;min-width:1100px;}
  6. .body{background: #fff;height: 100%;overflow-y:auto;width:100%;box-sizing: border-box;padding: 25px;}
  7. .layui-form-box .layui-form-label{width:136px;text-align: right;float:left;line-height: 46px;padding: 0 10px;}
  8. .layui-form-box .layui-input-block{float:left;margin-left:0;max-width: 25%;width: 100%;}
  9. .layui-input{height: 46px;}
  10. .addImages {display: inline-block;width:145px !important;height:87px !important;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;border: 1px dashed darkgray;background: #f8f8f8;position: relative;overflow: hidden;}
  11. .addImages .upload_ico{font-size: 50px;color:#28A1FF;margin-top: 5px;display: inline-block;}
  12. .imageDiv div {width: 100%;height: 100%;position: absolute;top: 0px;background-color: #e6e6e600;}
  13. .imageDiv div:hover {background-color: #e6e6e680;}
  14. .imageDiv div:hover i {display: block;cursor: pointer;}
  15. .text-detail{text-align: center;}
  16. .imageDiv div i{display: none; font-size: 31px;line-height: 142px;text-align: center;}
  17. .isshow{display: none;}
  18. .vrdelbtn{height: 46px;}
  19. .lanse{color:#28A1FF;}
  20. .addlp_top .layui-form-item{float:left;width:33.33%;box-sizing: border-box;clear: none;}
  21. .addlp_top .layui-form-label{width:110px;}
  22. .addlp_top .layui-input-block{max-width:58%;}
  23. .time-ico{left:3%;top:31%;color:#999;}
  24. .layui-input-li{border:1px solid #e6e6e6;height: 44px;}
  25. .layui-form-box .layui-form-label{width:110px;}
  26. .relative {
  27. position: relative;
  28. }
  29. .noneClass {
  30. display: none !important;
  31. }
  32. .li_active {
  33. font-weight: 700;
  34. background-color: #249EFB;
  35. color: #fff;
  36. }
  37. .c_wordlist {
  38. width: 20px;
  39. position: absolute;
  40. top: 43px;
  41. left: 244px;
  42. display: flex;
  43. flex-direction: column;
  44. z-index: 99999;
  45. height: auto;
  46. justify-content: flex-start;
  47. align-items: center;
  48. box-sizing: border-box;
  49. padding: 4px 0px;
  50. overflow: hidden;
  51. max-height: 297px;
  52. -ms-overflow-style: none;
  53. /* IE 10+ */
  54. scrollbar-width: none;
  55. /* Firefox */
  56. overflow-y: scroll;
  57. background-color: #f5f5f5;
  58. }
  59. .c_wordlist::-webkit-scrollbar {
  60. display: none;
  61. /* Chrome Safari */
  62. }
  63. .c_wordlist>li {
  64. width: 20px;
  65. height: 37px;
  66. cursor: pointer;
  67. display: flex;
  68. justify-content: center;
  69. align-items: center;
  70. margin-bottom: 0px;
  71. line-height: 37px;
  72. }
  73. dd {
  74. border-bottom: 1px solid #EFEFEF;
  75. }
  76. .layui-anim-upbit {
  77. -ms-overflow-style: none;
  78. /* IE 10+ */
  79. scrollbar-width: none;
  80. /* Firefox */
  81. overflow-y: scroll;
  82. background-color: #fff;
  83. }
  84. .layui-anim-upbit::-webkit-scrollbar {
  85. display: none;
  86. /* Chrome Safari */
  87. }
  88. .layui-icon {
  89. font-size: 24px !important;
  90. line-height: 46px;
  91. }
  92. .adding {
  93. cursor: pointer;
  94. }
  95. .layui-form-item .layui-input-inline{
  96. width: 155px;
  97. }
  98. .layui-form-select dl {
  99. width: 100% !important;
  100. }
  101. .imageDiv {
  102. float: left;
  103. width: 145px;
  104. height: 87px;
  105. -webkit-box-sizing: border-box;
  106. -moz-box-sizing: border-box;
  107. box-sizing: border-box;
  108. border: 1px dashed darkgray;
  109. background: #f8f8f8;
  110. position: relative;
  111. overflow: hidden;
  112. margin: 0 10px 10px 0;
  113. }
  114. .imageDiv div {
  115. width: 100%;
  116. height: 100%;
  117. position: absolute;
  118. top: 0px;
  119. background-color: #e6e6e600;
  120. }
  121. .imageDiv div:hover {
  122. background-color: #e6e6e680;
  123. }
  124. .imageDiv div:hover i {
  125. display: block;
  126. cursor: pointer;
  127. }
  128. .text-detail {
  129. text-align: center;
  130. }
  131. .imageDiv div i {
  132. display: none;
  133. font-size: 31px;
  134. line-height: 90px;
  135. text-align: center;
  136. }
  137. </style>
  138. <body>
  139. <div class="body">
  140. <form class="layui-form layui-form-box font14">
  141. <div class="addlp_top">
  142. <div class="layui-form-item relative">
  143. <label class="layui-form-label" style="width: 110px;"><i style="color:red;">*</i> 小区:</label>
  144. <div class="layui-input-inline" id="box212">
  145. <select name="community_id" id="label" lay-verify="required" lay-filter="type" lay-search>
  146. <option value="">请选择小区</option>
  147. {notempty name="communities"}
  148. {volist name="communities.arr" id="vo"}
  149. <option data-py="{$vo.s}" value="{$vo.id}">{$vo.name}</option>
  150. {/volist}
  151. {/notempty}
  152. </select>
  153. </div>
  154. <ul class="c_wordlist noneClass">
  155. {notempty name="communities"}
  156. {volist name="communities.sort" id="vo"}
  157. <li data-py="{$vo}">{$vo}</li>
  158. {/volist}
  159. {/notempty}
  160. </ul>
  161. <i class="layui-icon layui-icon-add-circle adding" id="community-add"></i>
  162. </div>
  163. <div class="layui-form-item">
  164. <label class="layui-form-label"><!--<i style="color:red;">*</i>--> 交房时间:</label>
  165. <div class="layui-input-block layui-input-li">
  166. <i class="fa fa-calendar-minus-o wpsa time-ico" aria-hidden="true"></i>
  167. <input type="text" class="pdl40 huise999 ds" name="duetime" id="time_date" placeholder="请选择时间" autocomplete="off" class="layui-input">
  168. </div>
  169. </div>
  170. <div class="layui-form-item">
  171. <label class="layui-form-label"><i style="color:red;">*</i> 地址:</label>
  172. <div class="layui-input-block">
  173. <input type="text" name="address" required lay-verify="required" placeholder="请输入地址" autocomplete="off" class="layui-input">
  174. </div>
  175. </div>
  176. <div class="layui-form-item">
  177. <label class="layui-form-label"> 签约户数:</label>
  178. <div class="layui-input-block">
  179. <input type="number" name="sign_num" id="sign_num" min="0" required placeholder="请填写签约户数" autocomplete="off" class="layui-input" onkeyup="value=zhzs(this.value)">
  180. </div>
  181. </div>
  182. <div class="layui-form-item">
  183. <label class="layui-form-label"> 开工户数:</label>
  184. <div class="layui-input-block">
  185. <input type="number" name="start_num" id="start_num" min="0" required
  186. placeholder="请填写开工户数" autocomplete="off" class="layui-input" onkeyup="value=zhzs(this.value)">
  187. </div>
  188. </div>
  189. <div class="layui-form-item">
  190. <label class="layui-form-label"> 完工户数:</label>
  191. <div class="layui-input-block">
  192. <input type="number" name="finish_num" id="finish_num" min="0" required
  193. placeholder="请填写完工户数" autocomplete="off" class="layui-input" onkeyup="value=zhzs(this.value)">
  194. </div>
  195. </div>
  196. </div>
  197. <div class="layui-form-item mdt20">
  198. <label class="layui-form-label"><i style="color:red;">*</i> 图片:</label>
  199. <div class="layui-input-block" style="max-width: 776px">
  200. <!-- <div class="layui-input-inline addImages" id="anlicoverimg">
  201. <div class="text-detail" style="width: 100%;">
  202. <i class="layui-icon upload_ico">&#xe681;</i>
  203. <p>上传封面</p>
  204. </div>
  205. </div> -->
  206. <div class="picDiv images-op" id="draggable" style="margin: 20px 0px;overflow: hidden;">
  207. <div class="addImages" id="img">
  208. <div class="text-detail">
  209. <i class="layui-icon upload_ico">&#xe681;</i>
  210. <p>选择单、多图</p>
  211. </div>
  212. </div>
  213. </div>
  214. </div>
  215. </div>
  216. <div class="layui-form-item mdt20">
  217. <label class="layui-form-label">分享封面:</label>
  218. <div class="layui-input-block" style="max-width: 776px">
  219. <div style="margin: 20px 0px;overflow: hidden;" id="cover_share_img" class="images-op">
  220. <div class="addImages">
  221. <div class="text-detail">
  222. <i class="layui-icon upload_ico">&#xe681;</i>
  223. <p>请选择分享封面</p>
  224. </div>
  225. </div>
  226. </div>
  227. </div>
  228. </div>
  229. <div class="layui-form-item">
  230. <label class="layui-form-label"></label>
  231. <div style="margin-left: 109px;"><i style="color:red;margin-right: 5px;">*</i><span>注:不支持拖拽文件 宽:高=5:4</span></div>
  232. </div>
  233. <div class="layui-form-item woverflow mdt20">
  234. <label class="layui-form-label">VR类型:</label>
  235. <div class="layui-input-block lh45 mdl20" style="max-width: 400px !important;">
  236. <input type="radio" id="1" class="radio_input" lay-filter="types" name="type" value="vr"
  237. title="VR链接" checked>
  238. <input type="radio" id="2" class="radio_input" lay-filter="types" name="type" value="group"
  239. title="VR作品">
  240. </div>
  241. </div>
  242. <div class="layui-form-item mdt40 vrlinkEle">
  243. <label class="layui-form-label">小区VR链接:</label>
  244. <div class="layui-input-block">
  245. <input type="text" name="vr_link" placeholder="请输入VR链接" autocomplete="off" class="layui-input">
  246. </div>
  247. </div>
  248. <div class="vrAuthEle layui-hide">
  249. <label class="layui-form-label">VR作品</label>
  250. <div class="layui-input-inline" style="width: 400px;display: block;">
  251. <a class="layui-btn btn layui-border-btn" style="margin-top: 5px;" id="selectVRCreate" href="javascript:void(0);">选择VR作品</a>
  252. <span id="vrWorks"></span>
  253. </div>
  254. </div>
  255. <div class="layui-form-item woverflow mdt40">
  256. <label class="layui-form-label"><i style="color:red;">*</i>&nbsp;简介:</label>
  257. <div class="layui-input-block mdl20 wleft" style="max-width: 70%;">
  258. <textarea name="content" id="content" required lay-verify="required" rows="10" autocomplete="off" class="layui-textarea width100_ pdtb15"></textarea>
  259. </div>
  260. </div>
  261. <div class="mdt50 mdl110">
  262. <button type="button" class="layui-btn layui-btn-normal layuiSubmit pdlr30" lay-submit lay-filter="building-submit" id="building-submit">保存</button>
  263. </div>
  264. </form>
  265. </div>
  266. </body>
  267. {/block} {block name="js"}
  268. <script src="__STATIC__/layui/layui/lay/modules/xm-select.js" type="text/javascript" charset="utf-8"></script>
  269. <script type="text/javascript">
  270. //转化正整数
  271. function zhzs(value){
  272. value = value.replace(/[^\d]/g,'');
  273. if(''!=value){
  274. value = parseInt(value);
  275. }
  276. return value;
  277. }
  278. </script>
  279. <script>
  280. layui.config({
  281. base: '__LAYUI__/',
  282. urlbase: '/sys'
  283. }).extend({
  284. index: 'lib/index' //主入口模块
  285. }).use(['index','element','upload','laydate','form'], function() {
  286. var $ = layui.$,
  287. layer = layui.layer,
  288. upload = layui.upload,
  289. form = layui.form,
  290. element = layui.element,
  291. files = [];
  292. laydate = layui.laydate;
  293. var objdata={};
  294. var bodyjsonimg=[];
  295. objdata['isnulls'] = 0;
  296. var vrlinkVal = '';
  297. laydate.render({
  298. elem: '#time_date'
  299. ,format: 'yyyy-MM-dd',
  300. trigger: 'click',
  301. done:function(value,date,endDate){
  302. cache();
  303. }
  304. });
  305. if(localStorage.getItem('data')){
  306. var bodyjson = JSON.parse(localStorage.getItem('data'));
  307. if(bodyjson){
  308. if(bodyjson.community_id){
  309. set_select('label',bodyjson.community_id);
  310. }
  311. $('#time_date').val(bodyjson.duetime);
  312. $('input[name="address"]').val(bodyjson.address);
  313. $('input[name="sign_num"]').val(bodyjson.sign_num);
  314. $('input[name="start_num"]').val(bodyjson.start_num);
  315. $('input[name="finish_num"]').val(bodyjson.finish_num);
  316. $('input[name="vr_link"]').val(bodyjson.vr_link);
  317. if(bodyjson.img!==undefined){
  318. if(bodyjson.img.length!==0){
  319. objdata['img'] = bodyjson.img;
  320. objdata['img_data_id'] = bodyjson.img_data_id;
  321. bodyjsonimg = bodyjson.img;
  322. objdata['isnulls'] = 1;
  323. $.each(bodyjson.img_data_id,function(index,ele){
  324. files.push(index);
  325. })
  326. for(let i=0;i<bodyjson.img.length;i++){
  327. $('.picDiv').prepend('<div class="imageDiv" data-indexs="'+i+'" data-id="' + files[i] + '"><img src="' + bodyjson.img[i] + '" alt="" class="layui-upload-img" width="100%" height="100%"><div><i class="layui-icon layui-icon-delete" prop="del"></i> <i class="layui-icon layui-icon-search" prop="view" data-image="'+ bodyjson.img[i] +'" style="margin-left:25px;"></i></div></div>');
  328. }
  329. }
  330. }
  331. if(bodyjson.cover_share_img!==undefined){
  332. $('#cover_share_img').html('<div class="imageDiv"><img src="'+bodyjson.cover_share_img+'" alt="画板.jpg" class="layui-upload-img" width="100%" height="100%"></div>');
  333. objdata['cover_share_img'] = bodyjson.cover_share_img
  334. }
  335. $('#content').text(bodyjson.content)
  336. }
  337. }
  338. function set_select(id,value){
  339. let obj=$("#"+id);
  340. let names='';
  341. for(var i=0;i<obj.find('option').length;i++){
  342. if(obj.find('option').eq(i).val()==value){
  343. obj.find("option").eq(i).attr("selected",true);
  344. names=obj.find('option').eq(i).html();
  345. }
  346. }
  347. setTimeout(function(){
  348. obj.parent().find(".layui-select-title").find("input").val(names);
  349. },500)
  350. }
  351. $('input,textarea').off('input').on('input',function(obj){
  352. cache();
  353. })
  354. form.on('select(type)', function (data) {
  355. $('.c_wordlist').addClass('noneClass');
  356. cache();
  357. })
  358. form.on('radio(types)', function (data) {
  359. if (data.value == 'vr') {
  360. $(".vrlinkEle").removeClass('layui-hide');
  361. $(".vrAuthEle").addClass('layui-hide');
  362. } else {
  363. $(".vrlinkEle").addClass('layui-hide');
  364. $(".vrAuthEle").removeClass('layui-hide');
  365. }
  366. });
  367. //vr作品
  368. $('#selectVRCreate').click(function(){
  369. layer.open({
  370. type: 2,
  371. title: ['选择VR作品', 'color:#333333;background-color:#D8E6F1;'],
  372. content: '{:url("building/group")}',
  373. area: ['80%', '80%'],
  374. btn: ['确定', '取消'],
  375. yes: function (index, layero) {
  376. let data = layero.find('iframe').contents().find("#hiddentext").val();
  377. if (data) {
  378. let vrObject = JSON.parse(data);
  379. vrlinkVal = vrObject.id;
  380. $("#vrWorks").text(vrObject.name);
  381. }
  382. layer.close(index);
  383. //点击确认触发 iframe 内容中的按钮提交
  384. }
  385. });
  386. })
  387. function cache(){
  388. setTimeout(function(){
  389. var formarray=$("form").serializeArray();
  390. for(var i in formarray){
  391. objdata[formarray[i]['name']]=formarray[i]['value']
  392. }
  393. var datas=JSON.stringify(objdata);
  394. localStorage.setItem('data',datas);
  395. setTimeout(function(){
  396. layer.close(loadindex);
  397. },1000)
  398. },500)
  399. }
  400. var loadindex;
  401. //多图片上传
  402. upload.render({
  403. elem: '#img',
  404. accept: 'images',
  405. url: '{:url("fileupload")}',
  406. exts: 'jpg|png|bmp|jpeg|JPG|PNG|BMP|JPEG',
  407. field: 'file',
  408. size: 5 * 1024,
  409. auto: true,
  410. multiple: true,
  411. choose: function(obj) {
  412. files = obj.pushFile();
  413. objdata['img_data_id']=files;
  414. length = $('.imageDiv').length;
  415. if(objdata['isnulls'] == 0){
  416. bodyjsonimg = [];
  417. }
  418. loadindex = layer.msg('加载中..', {
  419. icon: 16
  420. ,shade: 0.3
  421. ,time: false
  422. });
  423. obj.preview(function(index, file, result) {
  424. length++;
  425. if(length > 9) {
  426. if(length == 10) {
  427. loadindex = layer.msg('限制九张图片以下..', {
  428. icon: 16
  429. ,shade: 0.3
  430. ,time: false
  431. });
  432. }
  433. delete files[index];
  434. } else {
  435. $('.picDiv').prepend('<div class="imageDiv" data-indexs="'+length+'" 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" prop="del"></i> <i class="layui-icon layui-icon-search" prop="view" data-image="'+result+'" style="margin-left:25px;"></i></div></div>');
  436. }
  437. });
  438. },
  439. done:function(res,index){
  440. if(res.code==0){
  441. if(bodyjsonimg.length < 9) {
  442. bodyjsonimg.push(res.data.src);
  443. objdata['img']=bodyjsonimg;
  444. cache();
  445. }
  446. }
  447. }
  448. });
  449. upload.render({
  450. elem: '#cover_share_img',
  451. accept: 'images',
  452. url: '{:url("fileupload")}',
  453. exts: 'jpg|png|bmp|jpeg|JPG|PNG|BMP|JPEG',
  454. field: 'file',
  455. size: 5 * 1024,
  456. auto: true,
  457. choose: function(obj) {
  458. loadindex = layer.msg('加载中..', {
  459. icon: 16
  460. ,shade: 0.3
  461. ,time: false
  462. });
  463. obj.preview(function(index, file, result) {
  464. $('#cover_share_img').html('<div class="imageDiv"><img src="' + result + '" alt="' + file.name + '" class="layui-upload-img" width="100%" height="100%"></div>');
  465. });
  466. },
  467. done:function(res,index){
  468. objdata['cover_share_img']=res.data.src;
  469. cache();
  470. }
  471. });
  472. $('.images-op').on('click', 'i', function(e) {
  473. var that = this;
  474. if (e.target.attributes[1].nodeValue === 'del') {
  475. layer.confirm('确定删除该图片么?',{title: ['信息', 'color:#333333;background-color:#D8E6F1;'],}, function(index) {
  476. var imgDiv = $(that).closest('.imageDiv');
  477. var indexs = (bodyjsonimg.length-1)-parseInt(imgDiv.index());
  478. if(id = imgDiv.data('id')) {
  479. delete files[id];
  480. delete objdata['img_data_id'][id];
  481. }
  482. bodyjsonimg.splice(indexs,1);
  483. objdata['img']=bodyjsonimg;
  484. if(bodyjsonimg.length==0){
  485. objdata['isnulls'] = 0;
  486. }
  487. imgDiv.remove();
  488. layer.close(index);
  489. cache();
  490. });
  491. } else {
  492. layer.photos({ photos: {"data": [{"src": e.target.attributes[2].nodeValue}]} ,closeBtn:true});
  493. }
  494. });
  495. //添加保存
  496. form.on('submit(building-submit)', function(data) {
  497. var formData = new FormData(data.form);
  498. if(!objdata['img']) objdata['img']=[];
  499. Object.keys(objdata['img']).forEach((v,i) => {
  500. formData.append(`cover[${i}]`, objdata['img'][v])
  501. })
  502. if(objdata['cover_share_img'])
  503. formData.append('cover_share_img', objdata['cover_share_img'])
  504. if (!Object.keys(objdata['img']).length) {
  505. layer.msg('请添加图片')
  506. return;
  507. }
  508. formData.append('vr_group_ids', vrlinkVal);
  509. // if (data.field.duetime=="" || data.field.duetime==null || data.field.duetime==undefined) {
  510. // layer.msg('请选择时间', {anim: 0,time: 1000,icon: 5});
  511. // return false;
  512. // }
  513. //formData.append('cover',objdata['cover']);
  514. // 单击之后提交按钮不可选,防止重复提交
  515. var DISABLED = 'layui-btn-disabled';
  516. var target = '#building-submit';
  517. $(target).addClass(DISABLED);
  518. $(target).attr('disabled', 'disabled');
  519. $.ajax({
  520. url: '{:url("building/add")}',
  521. type: 'post',
  522. data: formData,
  523. dataType: 'json',
  524. processData: false,
  525. contentType: false,
  526. success: function(res) {
  527. if(res.code === 0) {
  528. objdata={};
  529. localStorage.setItem('data','');
  530. layer.msg(res.msg,{
  531. anim: 0,time: 1000,icon: 6,
  532. }, function() {
  533. var index = parent.layer.getFrameIndex(window.name);
  534. // parent.layui.table.reload('company-activity'); //重载表格
  535. parent.layer.close(index); //再执行关闭
  536. });
  537. } else {
  538. layer.msg(res.msg, {anim: 0,time: 1000,icon: 5});
  539. $(target).removeClass(DISABLED);
  540. $(target).removeAttr('disabled');
  541. }
  542. },
  543. error : function(e){
  544. $(target).removeClass(DISABLED);
  545. $(target).removeAttr('disabled');
  546. }
  547. });
  548. return false;
  549. });
  550. $(document).click((e) => {
  551. let displayState = $('#dropdown_designer').attr('style');
  552. if (displayState === 'display: none;') {
  553. $('.wordlist').addClass('noneClass');
  554. }
  555. let c_element = $('#label').next();
  556. if (c_element[0].className.indexOf('layui-form-selected') < 0) {
  557. $('.c_wordlist').addClass('noneClass');
  558. }
  559. })
  560. $('dd').click(() => {
  561. $('.c_wordlist').addClass('noneClass');
  562. })
  563. $('#box212').click(() => {
  564. $('.c_wordlist').toggleClass('noneClass');
  565. })
  566. let xqElement = $('.layui-anim-upbit')[0];
  567. xqElement.classList.add('xqElement');
  568. let options = [];
  569. let xqDatalist = $('#label').children();
  570. for (let i = 0; i < xqDatalist.length; i++) {
  571. if (xqDatalist[i].dataset.py) {
  572. options.push(xqDatalist[i].dataset.py)
  573. }
  574. }
  575. $('.c_wordlist').click((e) => {
  576. if (e.target.localName != 'li') {
  577. e.stopPropagation();
  578. return;
  579. }
  580. let index = 0;
  581. let curWord = e.target.dataset.py;
  582. let lilist = $('.c_wordlist').children();
  583. for (let i = 0; i < lilist.length; i++) {
  584. lilist[i].className = '';
  585. }
  586. if (parseInt(curWord) != NaN) {
  587. let word1 = curWord.toLowerCase();
  588. index = options.indexOf(word1)
  589. } else {
  590. index = options.indexOf(curWord)
  591. }
  592. setTimeout(() => {
  593. e.target.className = 'li_active';
  594. let num = index * 37 + 37;
  595. $('.xqElement').scrollTop(num);
  596. }, 50)
  597. e.stopPropagation();
  598. })
  599. $('.select_community_input').on('click', function () {
  600. $('#dropdown_community').toggle();
  601. $('#commu_arrow').toggleClass('rotate180');
  602. });
  603. $(".commu_option").on('click', function () {
  604. var commu_name = $(this).text();
  605. var commu_id = $(this).data('id');
  606. var select_community = $("#select_community");
  607. select_community.val(commu_name);
  608. select_community.data('selectedid', commu_id);
  609. select_community.click();
  610. });
  611. $('.topselectbtn').on('click', function () {
  612. var gonnado = $(this).data('ref');
  613. if (gonnado == 'addcommu') {
  614. addcommunity();
  615. $('#select_community').click();
  616. }
  617. });
  618. $('.layui-select-title input').on('input',function(e) {
  619. if (e.target.placeholder == '请选择小区') {
  620. let val = $(this).val();
  621. if (!val) {
  622. $('.c_wordlist').removeClass('noneClass');
  623. return;
  624. }
  625. $('.c_wordlist').addClass('noneClass');
  626. }
  627. })
  628. //--------------------------------------------------------------------------
  629. //小区添加
  630. $('#community-add').on('click', function () {
  631. addcommunity();
  632. });
  633. var addcommunity = function () {
  634. layer.prompt({
  635. title: ['小区添加', 'color:#333333;background-color:#D8E6F1;'],
  636. }, function (value, index, elem) {
  637. var value = $.trim(value);
  638. if (value == '') {
  639. layer.msg('请输入小区名称', { anim: 6 });
  640. return false;
  641. }
  642. if (value.length > 20) {
  643. layer.msg('小区名称超长', { anim: 6 });
  644. return false;
  645. }
  646. $.post('{:url("material/apicommunityadding")}', {
  647. community: value
  648. }, function (res) {
  649. if (res.code == 0) {
  650. $('#label').append("<option selected value='" + res.data.id + "'>" + res.data.name + "</option>")
  651. form.render('select');
  652. layer.msg(res.msg, {
  653. anim: 0
  654. }, function () {
  655. layer.close(index); //再执行关闭
  656. });
  657. } else {
  658. layer.msg(res.msg, {
  659. anim: 6
  660. });
  661. }
  662. });
  663. });
  664. }
  665. })
  666. </script>
  667. {/block}