housealbum.js 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322
  1. var delFiles = []; //用于删除图片
  2. var filesContainer= {}; //存储最终要上传的图片
  3. var files ; //存储选择图片的数量
  4. layui.use(['form','layer','upload','table'],function(){
  5. var form = layui.form,
  6. layer = layui.layer,
  7. upload = layui.upload,
  8. table = layui.table,
  9. $ = layui.jquery;
  10. var inputId = $('input[name="hid"]').val();
  11. var inputName = $('input[name="name"]').val();
  12. var _houseNmae = $('#house_name').html();
  13. //楼盘列表
  14. var indexTtable = table.render({
  15. elem: '#housealbumlist',
  16. url : '/house/albumform',
  17. where:{hid:inputId},
  18. method:'post',
  19. id:'tablerReload',
  20. cols : [[
  21. {type:'numbers'},
  22. {field: 'name', title: '相册名称', align:"center",sort: true},
  23. {field: 'num', title: '数量', align:"center",width:100},
  24. {title: '操作', width:200, templet:'#housesalbumListBar',fixed:"right",align:"center"}
  25. ]]
  26. });
  27. indexTtable.reload('tablerReload'); //重新加载
  28. table.on('tool(housealbumlist)',function (obj) {
  29. var data = obj.data;
  30. if(obj.event === 'edit'){
  31. var index = parent.layui.layer.open({
  32. title : '<span style="color:red" >['+inputName+']</span> 楼盘相册修改',
  33. type : 2,
  34. maxmin: true,
  35. area: ['', '100%'],
  36. content : "/house/albumedit?id="+inputId+'&name='+inputName+'&alnumid='+data.album_id,
  37. end:function(){
  38. layui.table.reload('tablerReload');
  39. }
  40. })
  41. parent.layui.layer.full(index);
  42. //改变窗口大小时,重置弹窗的宽高,防止超出可视区域(如F12调出debug的操作)
  43. $(window).on("resize",function(){
  44. parent.layui.layer.full(index);
  45. })
  46. }else if(obj.event === 'examine'){
  47. var examineName = '';
  48. // console.log(data.state);
  49. switch (data.state){
  50. case 'Y':
  51. examineName = '驳回审核';
  52. break;
  53. case 'N':
  54. examineName = '审核通过';
  55. break;
  56. }
  57. layer.confirm('确定要'+examineName+'吗?',{btn: ['确定', '取消']},function () {
  58. $.post('/house/albumstatesave',{id:data.id,state:data.state,album_id:data.album_id,hid:inputId},function (data) {
  59. if(data.code == 200)
  60. {
  61. layer.msg(data.msg);
  62. table.reload('tablerReload');
  63. } else if(data.code == 300 ) {
  64. layer.msg(data.msg);
  65. }
  66. })
  67. })
  68. } else if(obj.event === 'del'){
  69. layer.confirm('确定要删除吗?',{btn: ['确定', '取消']},function () {
  70. $.post('/house/albumdel',{id:data.id,album_id:data.album_id,hid:inputId},function (data) {
  71. // var data = eval('('+data+')');
  72. // console.log(data);
  73. if(data.code == 200)
  74. {
  75. layer.msg(data.msg);
  76. table.reload('tablerReload');
  77. } else if(data.code == 300 ) {
  78. layer.msg(data.msg);
  79. }
  80. })
  81. })
  82. }
  83. })
  84. /*
  85. * 添加相册
  86. * */
  87. function addAlbum(edit){
  88. var index = parent.layui.layer.open({
  89. title : '<span style="color:red" >['+inputName+']</span> 楼盘添加相册',
  90. type : 2,
  91. maxmin: true,
  92. area: ['', '100%'],
  93. content : "/house/albumadd?id="+inputId+'&name='+inputName,
  94. end:function () {
  95. layui.table.reload('tablerReload');
  96. }
  97. })
  98. parent.layui.layer.full(index);
  99. //改变窗口大小时,重置弹窗的宽高,防止超出可视区域(如F12调出debug的操作)
  100. $(window).on("resize",function(){
  101. parent.layui.layer.full(index);
  102. })
  103. }
  104. //添加相册
  105. $("#add-album").click(function(){
  106. addAlbum()
  107. });
  108. //多图片上传
  109. upload.render({
  110. elem: '#upload_edit'
  111. ,url: '/upload/'
  112. ,multiple: true
  113. ,auto: false
  114. ,number: 30
  115. ,choose:function(obj){
  116. //将每次选择的文件追加到文件队列
  117. files = obj.pushFile();
  118. //预读本地文件示例,不支持ie8
  119. obj.preview(function(index, file, result){
  120. var selectText = $('#ddlregtype').find("option:selected").text();
  121. filesContainer[index] = file; //将每次选择的文件追加到文件队列
  122. $('#demo2').append('<div class="layui-upload-img layer-photos-demo" id="layer-photos-demo"><div class="delete-list" id="delimg"><i class="layui-icon fa-trash-o" >&#xe640;</i></div><img delIdentification="'+index+'" layer-pid="'+index+'" layer-src="'+ result +'" src="'+ result +'" alt="'+ file.name +'" id="hhhh"><div class="close-input"><input type="radio" name="zhu" value="'+index+'-x" title="设为主图"><input type="text" id="album_title" name="'+index+'" value="'+_houseNmae+'-'+selectText+'" placeholder="请输入" autocomplete="off" class="layui-input"></div></div>');
  123. layui.use('form', function(){
  124. var form = layui.form;
  125. form.render();
  126. });
  127. layer.photos({
  128. photos: '#demo2',
  129. closeBtn: 1
  130. ,anim: 5 //0-6的选择,指定弹出图片动画类型,默认随机(请注意,3.0之前的版本用shift参数)
  131. });
  132. });
  133. }
  134. });
  135. form.on('submit(tijiao)',function (data) {
  136. var index = layer.msg('数据提交中,请稍候',{icon: 16,time:false,shade:0.8}); //数据提交提示
  137. var formData = new FormData($('#album_form')[0]);
  138. formData.delete('file'); //删除添加图片组件自带的FILE文件
  139. if(data.field.zhu){
  140. var str = data.field.zhu.split("-");
  141. var st = str[0];
  142. }
  143. $.each(filesContainer,function (k,v) {
  144. if(v != null){
  145. if(typeof (formData.get(k)) != 'undefined'){
  146. formData.append('imginput[]',formData.get(k))
  147. if(st == k.split("-")[0]){
  148. formData.append('editzhux[]',1);
  149. }else{
  150. formData.append('editzhux[]',0);
  151. }
  152. }
  153. formData.append('img[]',v);
  154. }
  155. })
  156. $.ajax({
  157. cache : true,
  158. type : "post",
  159. url : "/house/albumaddform",
  160. data : formData, // 你的formid
  161. contentType: false, //jax 中 contentType 设置为 false 是为了避免 JQuery 对其操作,从而失去分界符,而使服务器不能正常解析文件
  162. processData: false, //当设置为true的时候,jquery ajax 提交的时候不会序列化 data,而是直接使用data
  163. error : function(request) {
  164. layer.close(index); //关闭数据提交信息
  165. layer.alert("网络超时");
  166. },
  167. success : function(data) {
  168. if(data.code == 200){
  169. layer.msg(data.msg);
  170. indexTtable.reload('tablerReload');
  171. TableClose();
  172. } else if(data.code == 300){
  173. layer.msg(data.msg);
  174. layer.msg(ReturnInfo(data.data,{icon:5}));
  175. }
  176. }
  177. });
  178. return false;
  179. })
  180. form.on('submit(editAlbum)',function (data) {
  181. // if(!lock){ // 重复提交解决方法
  182. // return false;
  183. // }
  184. // lock = false //改变值
  185. var zhu_j = null;//旧主图选择
  186. var zhu_x = null;//新主图选择
  187. var index = layer.msg('数据提交中,请稍候',{icon: 16,time:false,shade:0.8}); //数据提交提示
  188. var formData = new FormData($('#album_forms')[0]);
  189. formData.delete('file'); //删除添加图片组件自带的FILE文件
  190. var a = $('#demo2');
  191. if(data.field.zhu){
  192. var str = data.field.zhu.split("-");
  193. var st = str[str.length-1];
  194. if(st == 'x'){
  195. zhu_x = str[0];
  196. }else{
  197. zhu_j = str[0];
  198. }
  199. }
  200. $.each(a.find('img'),function () {
  201. formData.append('editid[]',$(this).attr('imgname'));
  202. if(zhu_j == $(this).attr('imgname')){
  203. formData.append('editzhuj[]',1);
  204. }else{
  205. formData.append('editzhuj[]',0);
  206. }
  207. })
  208. $.each(a.find('input[name=title]'),function () {
  209. formData.append('edittitle[]',$(this).val());
  210. })
  211. //需要添加的图片
  212. $.each(filesContainer,function (k,v) {
  213. if(typeof v === 'object'){
  214. if(typeof (formData.get(k)) != 'undefined'){
  215. formData.append('imginput[]',formData.get(k))
  216. if(zhu_x == k.split("-")[0]){
  217. formData.append('editzhux[]',1);
  218. }else{
  219. formData.append('editzhux[]',0);
  220. }
  221. }
  222. formData.append('img[]',v);
  223. }
  224. })
  225. //需要删除的图片
  226. if(delFiles.length > 0){
  227. $.each(delFiles,function (k,v) {
  228. formData.append('delimg[]',v);
  229. })
  230. }
  231. $.ajax({
  232. cache : false,
  233. type : "post",
  234. url : "/house/albumeditformdata",
  235. data : formData, // 你的formid
  236. contentType: false, //jax 中 contentType 设置为 false 是为了避免 JQuery 对其操作,从而失去分界符,而使服务器不能正常解析文件
  237. processData: false, //当设置为true的时候,jquery ajax 提交的时候不会序列化 data,而是直接使用data
  238. error : function(request) {
  239. layer.close(index);
  240. layer.alert("网络超时");
  241. },
  242. success : function(data) {
  243. top.layer.close(index);
  244. filesContainer = {}; //成功后删除选择的图片
  245. if (data.code == 200) {
  246. layer.msg(data.msg);
  247. } else if(data.code == 300){
  248. layer.msg(data.msg);
  249. }
  250. }
  251. });
  252. return false;
  253. })
  254. layer.photos({
  255. photos: '#demo2',
  256. closeBtn: 1
  257. ,anim: 5 //0-6的选择,指定弹出图片动画类型,默认随机(请注意,3.0之前的版本用shift参数)
  258. });
  259. //设置图片的高度
  260. $(window).resize(function(){
  261. $("#Images li img").height($("#Images li img").width());
  262. });
  263. form.on('select(sele_album)', function(data){
  264. var _text = data.elem[data.elem.selectedIndex].text;
  265. $('#demo2').find('input').val(_houseNmae+'-'+_text);
  266. })
  267. });
  268. //删除图片
  269. $('#demo2').on("click","#delimg",function () {
  270. var name = $(this).next().attr("imgname");
  271. var delIdentification = $(this).next().attr("delIdentification");
  272. if(typeof(delIdentification) != 'undefined'){
  273. filesContainer[delIdentification] = false;
  274. delete files.delIdentification;
  275. console.log(files);
  276. // imgnumber -= 1;
  277. }
  278. if(typeof(name) != 'undefined'){
  279. delFiles.push(name);
  280. }
  281. $(this).parent().remove();
  282. })
  283. // $('#ddlregtype').on('change',function () {
  284. // alert(111);
  285. // })
  286. // $('#ddlregtype').change(function(){
  287. // alert(111);
  288. // // $('#album_title').val('');
  289. // // $('#album_title').val(_houseNmae+'-'+$(this).text());
  290. // })