choice.js 9.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246
  1. layui.use([ 'laypage', 'layer', 'table', 'element','form','upload'], function(){
  2. var laypage = layui.laypage //分页
  3. ,$ = layui.jquery
  4. ,layer = layui.layer //弹层
  5. ,table = layui.table //表格
  6. ,element = layui.element //元素操作
  7. ,form = layui.form
  8. ,upload = layui.upload;
  9. var tableIds = 'videolist'; //表格ID
  10. //第一个实例
  11. table.render({
  12. elem: '#'+tableIds
  13. ,url: '/push/choiceform' //数据接口
  14. ,where:{token:csrfToken}
  15. ,method:'post'
  16. ,page: true //开启分页
  17. ,text:'数据加载中'
  18. ,id:'tablerReload'
  19. ,cols: [[ //表头
  20. {type:'numbers',title:'序号',width:50},
  21. {field: 'title', title: '精选标题', align:'center'},
  22. {field: 'name', title: '归属楼盘', align:'center'},
  23. {field: 'img', title: '封面图',width:200, align:'center',templet:function(d){
  24. return '<img class="layui_magnify" src="'+d.img+'"/>'
  25. }}
  26. , {field: 'url', title: '地址',width:200, align:'center',templet:function(d){
  27. return '<a href="'+d.url+'" target="_blank">'+d.url+'</a>';
  28. }}
  29. ,{field: 'create_at', title: '添加时间',width:150, align:'center'}
  30. ,{field: 'is_show', title: '审核',align:'center',width:100, templet:function (d) {
  31. if(d.is_show == 2){
  32. return '<input type="checkbox" value="'+d.id+'" name="open" lay-skin="switch" lay-filter="switchTest" lay-text="|">'
  33. } else {
  34. return '<input type="checkbox" checked value="'+d.id+'" name="open" lay-skin="switch" lay-filter="switchTest" lay-text="|">'
  35. }
  36. }}
  37. ,{fixed: 'right',title:'操作', width: 165, align:'center', toolbar: '#operate'}
  38. ]]
  39. });
  40. // 列表点击放大图片
  41. $('.layui-table-main').on('click','.layui_magnify', function(){
  42. var _src = $(this).attr('src');
  43. layui.layer.open({
  44. type: 1,
  45. title: false, //是否显示标题
  46. area: ['95%', '55%'],
  47. shade: 0.6, //透明度
  48. closeBtn: 1, //按钮 1有,0无
  49. shadeClose: true,
  50. content: '<img style="width:100%;height:100%" src="'+_src+'">',
  51. });
  52. });
  53. //监听指定开关
  54. form.on('switch(switchTest)', function(data){
  55. layer.confirm('确定要修改此操作吗?',{btn: ['确定', '取消']},function () {
  56. $.post('/push/choicedelshow',{id:data.value,type:'show'},function (data) {
  57. layer.msg(data.msg);
  58. table.reload('tablerReload');
  59. })
  60. },function (aa) {
  61. table.reload('tablerReload'); //重新加载
  62. })
  63. });
  64. //列表操作
  65. table.on('tool('+tableIds+')', function(obj){
  66. var layEvent = obj.event,
  67. data = obj.data;
  68. if(layEvent === 'edit'){
  69. var index = layer.open({
  70. type: 2,
  71. title: '修改本周精选',
  72. area:['800px','500px'],
  73. content: '/push/choiceedit?id='+data.id+'&house_name='+data.name,
  74. end:function () {
  75. table.reload('tablerReload'); //重新加载
  76. }
  77. });
  78. } else if(layEvent === 'del') {
  79. layer.confirm('您确定要删除吗?',{ btn: ['确定', '取消']},function () {
  80. $.post('/push/choicedelshow',{id:data.id,type:'del'},function (data) {
  81. layer.msg(data.msg);
  82. table.reload('tablerReload');
  83. })
  84. })
  85. }
  86. });
  87. //添加图片上传
  88. upload.render({
  89. elem: '#test1'
  90. ,url: '/house/createimg'
  91. ,data:{token:csrfToken}
  92. ,field:'img'
  93. ,size:1000 //限制上传图片的大小,单位为KB
  94. ,exts: 'png|jpg|jpeg' //只允许上传压缩文件
  95. ,auto:false
  96. ,bindAction:'#addcity'
  97. ,choose: function(obj){
  98. obj.preview(function(index, file, result){
  99. $('#breviary_img').attr('src', result); //图片链接(base64)
  100. });
  101. }
  102. });
  103. // 图片放大浏览
  104. $('.layui_magnify').click(function(){
  105. var _src = $(this).attr('src');
  106. layui.layer.open({
  107. type: 1,
  108. title: false, //是否显示标题
  109. area: ['60%', '80%'],
  110. shade: 0.6, //透明度
  111. closeBtn: 1, //按钮 1有,0无
  112. shadeClose: true,
  113. content: '<img style="width:100%;height:100%" src="'+_src+'">',
  114. });
  115. })
  116. // 新增
  117. var $ = layui.$, active = {
  118. addData: function(){ //获取选中数据
  119. var index = layui.layer.open({
  120. type: 2,
  121. title: '添加本周精选',
  122. closeBtn: 1, //不显示关闭按钮
  123. area: ['800px','500px'],
  124. content: '/push/choiceadd' //iframe的url,no代表不显示滚动条
  125. ,success:function (layero, index) {
  126. },
  127. end:function () {
  128. table.reload('tablerReload');
  129. }
  130. });
  131. },
  132. reload:function(){//搜索
  133. var form = pfgs_serialize($('form'));
  134. var name = '';
  135. var house_name = '';
  136. if(form.input_house == 'name'){
  137. name = form.input_house_text;
  138. } else if(form.input_house == 'house_name'){
  139. house_name = form.input_house_text;
  140. }
  141. table.reload('tablerReload',{
  142. where:{
  143. title:name,
  144. house_name:house_name,
  145. city:form.input_city,
  146. type_name:form.type_name
  147. }
  148. })
  149. },
  150. };
  151. $('.demoTable .layui-btn').on('click', function(){
  152. var type = $(this).data('type');
  153. active[type] ? active[type].call(this) : '';
  154. });
  155. $('.The_house').focus(function(){
  156. // $('form').append('<input type="hidden" name="aa" value="aaa">');
  157. indexOpen = parent.layui.layer.open({
  158. type: 2,
  159. title: '选择需要添加的楼盘',
  160. area: ['','100%'],
  161. content: '/publicuse/housename',
  162. success:function (layero, index) {
  163. },
  164. end:function(){
  165. }
  166. });
  167. parent.layui.layer.full(indexOpen);
  168. //改变窗口大小时,重置弹窗的宽高,防止超出可视区域(如F12调出debug的操作)
  169. $(window).on("resize",function(){
  170. parent.layui.layer.full(indexOpen);
  171. })
  172. })
  173. //添加页面提交数据
  174. form.on('submit(add_choice)', function(data){
  175. var formData = new FormData($('form')[0]);
  176. if(formData.getAll('img')[0].size == 0){
  177. layer.msg('请选择图片');
  178. return false;
  179. }
  180. var index = layer.msg('数据提交中,请稍候',{icon: 16,time:false,shade:0.8}); //数据提交提示
  181. $.ajax({
  182. cache : false,
  183. type : "post",
  184. url : "/push/choiceaddform",
  185. data : formData, // 你的formid
  186. contentType: false, //jax 中 contentType 设置为 false 是为了避免 JQuery 对其操作,从而失去分界符,而使服务器不能正常解析文件
  187. processData: false, //当设置为true的时候,jquery ajax 提交的时候不会序列化 data,而是直接使用data
  188. error : function(request) {
  189. layer.close(index);
  190. layer.msg("请联系管理员");
  191. },
  192. success : function(data) {
  193. if(data.data != null){
  194. layer.msg(ReturnInfo(data.data),{icon:5});
  195. return ;
  196. }
  197. layer.msg(data.msg);
  198. }
  199. });
  200. return false;
  201. });
  202. form.on('submit(edit_choice)', function(data){
  203. var index = layer.msg('数据提交中,请稍候',{icon: 16,time:false,shade:0.8}); //数据提交提示
  204. var formData = new FormData($('form')[0]);
  205. $.ajax({
  206. type : "post",
  207. url : "/push/choiceeditform",
  208. data : formData,
  209. contentType: false, //jax 中 contentType 设置为 false 是为了避免 JQuery 对其操作,从而失去分界符,而使服务器不能正常解析文件
  210. processData: false, //当设置为true的时候,jquery ajax 提交的时候不会序列化 data,而是直接使用data
  211. error : function(request) {
  212. layer.close(index);
  213. layer.msg("请联系管理员");
  214. },
  215. success : function(data) {
  216. if(data.data != null){
  217. layer.msg(ReturnInfo(data.data),{icon:5});
  218. return ;
  219. }
  220. layer.msg(data.msg);
  221. parent.layer.close(oindex); //再执行关闭
  222. }
  223. });
  224. return false;
  225. });
  226. })