353 lines
		
	
	
		
			15 KiB
		
	
	
	
		
			HTML
		
	
	
		
		
			
		
	
	
			353 lines
		
	
	
		
			15 KiB
		
	
	
	
		
			HTML
		
	
	
|  | {layout name="layout2" /} | ||
|  | <div class="file-manager"> | ||
|  |     <div id="cate-tree-more" class="cate-tree-more" style="width: 200px"></div> | ||
|  |     <div class="gallery"> | ||
|  |         <div class="layui-card" style="box-shadow:none;"> | ||
|  |             <div class="layui-card-header"> | ||
|  |                 <button type="button" class="layui-btn layui-btn layui-btn-sm layui-btn-normal layEvent" lay-event="addCate"><i class="layui-icon layui-icon-add-circle"></i> 添加分类</button> | ||
|  |                 <button type="button" class="layui-btn layui-btn layui-btn-sm layui-btn-normal" id="upload"> | ||
|  |                     <i class="layui-icon layui-icon-upload"></i> {if $type == 10}上传图片{elseif $type == 20}上传视频{else/}上传文件{/if} | ||
|  |                 </button> | ||
|  |                 <button type="button" class="layui-btn layui-btn layui-btn-sm layEvent layui-btn layui-btn-warm" lay-event="move" style="margin-left:5px;"><i class="layui-icon layui-icon-water"></i>  移动分类</button> | ||
|  |                 <button type="button" class="layui-btn layui-btn layui-btn-sm layEvent layui-btn layui-btn-danger" lay-event="del"><i class="layui-icon layui-icon-delete"></i>  删除文件</button> | ||
|  |             </div> | ||
|  |             <div class="layui-card-body"> | ||
|  |                 <script id="manager" type="text/html"> | ||
|  |                     <ul class="warehouse"> | ||
|  |                         {{#  layui.each(d, function(index, item){ }} | ||
|  |                             <li lay-id="{{item.id}}" lay-href="{{item.uri}}"> | ||
|  |                                 <div class="file-icon"><img class="file-image" src="{{item.uri}}"></div> | ||
|  |                                 <div class="file-name"><a href="javascript:">{{item.name}}</a></div> | ||
|  |                             </li> | ||
|  |                         {{#  }); }} | ||
|  |                     </ul> | ||
|  |                     {{#  if(d.length === 0){ }} | ||
|  |                         <div class="empty"> | ||
|  |                             <i class="layui-icon layui-icon-release" style=""></i> | ||
|  |                             <p>木有数据,请去上传</p> | ||
|  |                         </div> | ||
|  |                     {{#  } }} | ||
|  |                 </script> | ||
|  |                 <div id="view"></div> | ||
|  |                 <input type="hidden" id="fileUrl" value=""> | ||
|  |             </div> | ||
|  |         </div> | ||
|  |         <div style="height:55px;"></div> | ||
|  |         <div class="footer"> | ||
|  |             <button type="button" id="okFile" class="layui-btn layui-btn layui-btn-sm layui-btn-normal">使用选中文件</button> | ||
|  |             <div id="page"></div> | ||
|  |         </div> | ||
|  |     </div> | ||
|  | </div> | ||
|  | 
 | ||
|  | <script> | ||
|  |     layui.use(["form", "element", "tree", "laytpl", "laypage", "upload"], function() { | ||
|  |         var $ = layui.jquery; | ||
|  |         var tree     = layui.tree; | ||
|  |         var laytpl   = layui.laytpl; | ||
|  |         var laypage  = layui.laypage; | ||
|  |         var upload   = layui.upload; | ||
|  |         var category = JSON.parse('{$category|raw}'); | ||
|  |         var curCid   = 0; | ||
|  | 
 | ||
|  |         var uploadIns = upload.render({ | ||
|  |             elem: "#upload" | ||
|  |             ,url: "{:url('Upload/image')}" | ||
|  |             ,accept: "images" | ||
|  |             ,exts: "jpg|png|gif|bmp|jpeg|ico" | ||
|  |             ,size: 4096 | ||
|  |             ,data : { | ||
|  |                 "cid": curCid,  | ||
|  |                 "type": "{$type}" | ||
|  |             } | ||
|  |             ,number: 20 | ||
|  |             ,multiple: true | ||
|  |             ,done: function (res) { | ||
|  |                 if (res.code === 1) { | ||
|  |                     var li  = "<li lay-id='"+res.data.id+"' lay-href='"+res.data.uri+"'>\n"; | ||
|  |                         li += "<div class='file-icon'><img class='file-image' src='"+res.data.uri+"'></div>\n" | ||
|  |                         li += "<div class='file-name'><a href='javascript:'>"+res.data.name+"</a></div>\n"; | ||
|  |                         li += "</li>" | ||
|  |                     $(".warehouse").prepend(li) | ||
|  |                 } | ||
|  | 
 | ||
|  |                 layer.msg(res.msg); | ||
|  |             } | ||
|  |         }); | ||
|  | 
 | ||
|  |         var active = { | ||
|  |             getFile: function (cid, page) { | ||
|  |                 cid = cid === undefined ? 0 : cid; | ||
|  |                 page = page === undefined ? 1 : page; | ||
|  |                 var data = {cid:cid, page:page, type: "{$type}"}; | ||
|  |                 var index = layer.load(1, {shade: false}); | ||
|  |                 like.ajax({ | ||
|  |                     url: "{:url('File/lists')}", | ||
|  |                     type: "GET", | ||
|  |                     data: data, | ||
|  |                     success:function(res) { | ||
|  |                         layer.close(index); | ||
|  |                         if(res.code === 1) { | ||
|  |                             active.renderList(res.data.data); | ||
|  |                             laypage.render({ | ||
|  |                                 elem: "page" | ||
|  |                                 ,count: res.data.total | ||
|  |                                 ,curr: res.data.current_page | ||
|  |                                 ,limit: res.data.per_page | ||
|  |                                 ,last: res.data.last_page | ||
|  |                                 ,jump: function (obj, first) { | ||
|  |                                     if (!first) { | ||
|  |                                         active.getFile(cid, obj.curr) | ||
|  |                                     } | ||
|  |                                 } | ||
|  |                             }); | ||
|  |                         } | ||
|  |                     } | ||
|  |                 }); | ||
|  |             }, | ||
|  |             renderList: function(data) { | ||
|  |                 var getTpl = document.getElementById("manager").innerHTML; | ||
|  |                 var view   = document.getElementById('view'); | ||
|  |                 laytpl(getTpl).render(data, function(html){ | ||
|  |                     view.innerHTML = html; | ||
|  |                 }); | ||
|  |             }, | ||
|  |             getChoice: function() { | ||
|  |                 var ids  = []; | ||
|  |                 var href = []; | ||
|  |                 $(".warehouse li.on").each(function () { | ||
|  |                     ids.push($(this).attr("lay-id")); | ||
|  |                     href.push($(this).attr("lay-href")); | ||
|  |                 }); | ||
|  | 
 | ||
|  |                 return {ids:ids, href:href} | ||
|  |             }, | ||
|  |             move: function () { | ||
|  |                 var fileData = active.getChoice(); | ||
|  |                 if (fileData.ids.length === 0) { | ||
|  |                     layer.msg("尚未选择任何文件"); | ||
|  |                     return false; | ||
|  |                 } | ||
|  |                 layer.open({ | ||
|  |                     type: 2 | ||
|  |                     ,title: "移动文件" | ||
|  |                     ,content: "{:url('File/move')}?type={$type}" | ||
|  |                     ,area: ["400px", "440px"] | ||
|  |                     ,btn: ["确定", "取消"] | ||
|  |                     ,yes: function(index, layero){ | ||
|  |                         var iframeWindow = window["layui-layer-iframe" + index]; | ||
|  |                         var submit = layero.find("iframe").contents().find("#addSubmit"); | ||
|  |                         iframeWindow.layui.form.on("submit(addSubmit)", function(data){ | ||
|  |                             data.field["file_ids"] = fileData.ids; | ||
|  |                             data.field["type"] = "{$type}"; | ||
|  |                             like.ajax({ | ||
|  |                                 url: "{:url('File/move')}", | ||
|  |                                 data: data.field, | ||
|  |                                 type: "POST", | ||
|  |                                 success:function(res) { | ||
|  |                                     if(res.code === 1) { | ||
|  |                                         // if (data.field['cid'] !== '0') { | ||
|  |                                         //     $(".warehouse li.on").remove(); | ||
|  |                                         // } | ||
|  |                                         active.getFile(curCid, 1); | ||
|  |                                         layui.layer.msg(res.msg); | ||
|  |                                         layer.close(index); | ||
|  |                                     } | ||
|  |                                 } | ||
|  |                             }); | ||
|  |                         }); | ||
|  |                         submit.trigger("click"); | ||
|  |                         return false; | ||
|  |                     } | ||
|  |                 }); | ||
|  |             }, | ||
|  |             del: function () { | ||
|  |                 var fileData = active.getChoice(); | ||
|  |                 if (fileData.ids.length === 0) { | ||
|  |                     layer.msg("尚未选择任何文件"); | ||
|  |                     return false; | ||
|  |                 } | ||
|  |                 layer.confirm('确定删除所选文件?', function(index){ | ||
|  |                     like.ajax({ | ||
|  |                         url: "{:url('File/del')}", | ||
|  |                         data: {file_ids: fileData.ids, type: '{$type}'}, | ||
|  |                         type: "POST", | ||
|  |                         success:function(res) { | ||
|  |                             console.log(res) | ||
|  |                             if(res.code === 1) { | ||
|  |                                 active.getFile(curCid, 1); | ||
|  |                                 layui.layer.msg(res.msg); | ||
|  |                             } | ||
|  |                         } | ||
|  |                     }); | ||
|  |                     layer.close(index); | ||
|  |                 }); | ||
|  | 
 | ||
|  |             }, | ||
|  |             addCate: function () { | ||
|  |                 layer.open({ | ||
|  |                     type: 2 | ||
|  |                     ,title: "新增分类" | ||
|  |                     ,content: "{:url('File/addCate')}" | ||
|  |                     ,area: ["400px", "400px"] | ||
|  |                     ,btn: ["确定", "取消"] | ||
|  |                     ,yes: function(index, layero){ | ||
|  |                         var iframeWindow = window["layui-layer-iframe" + index]; | ||
|  |                         var submit = layero.find("iframe").contents().find("#addSubmit"); | ||
|  |                         iframeWindow.layui.form.on("submit(addSubmit)", function(data){ | ||
|  |                             data.field["type"] = "{$type}"; | ||
|  |                             like.ajax({ | ||
|  |                                 url: "{:url('File/addCate')}", | ||
|  |                                 data: data.field, | ||
|  |                                 type: "POST", | ||
|  |                                 success:function(res) { | ||
|  |                                     if(res.code === 1) { | ||
|  |                                         category = res.data; | ||
|  |                                         active.renderTree(); | ||
|  |                                         layui.layer.msg(res.msg); | ||
|  |                                         layer.close(index); | ||
|  |                                     } | ||
|  |                                 } | ||
|  |                             }); | ||
|  |                         }); | ||
|  |                         submit.trigger("click"); | ||
|  |                     } | ||
|  |                 }); | ||
|  |             }, | ||
|  |             editCate: function (obj) { | ||
|  |                 if (obj.data.id === 0) { | ||
|  |                     layer.msg("此分类不允许编辑", {icon: 2}); | ||
|  |                     return false; | ||
|  |                 } | ||
|  |                 layer.open({ | ||
|  |                     type: 2 | ||
|  |                     ,title: "编辑分类" | ||
|  |                     ,content: "{:url('File/editCate')}?id="+ obj.data.id + '&&type={$type}&&shop_id=0' | ||
|  |                     ,area: ["400px", "400px"] | ||
|  |                     ,btn: ["确定", "取消"] | ||
|  |                     ,yes: function(index, layero){ | ||
|  |                         var iframeWindow = window["layui-layer-iframe" + index]; | ||
|  |                         var submit = layero.find("iframe").contents().find("#addSubmit"); | ||
|  |                         iframeWindow.layui.form.on("submit(addSubmit)", function(data){ | ||
|  |                             data.field['id'] = obj.data.id; | ||
|  |                             data.field["type"] = "{$type}"; | ||
|  |                             like.ajax({ | ||
|  |                                 url: "{:url('File/editCate')}", | ||
|  |                                 data: data.field, | ||
|  |                                 type: "POST", | ||
|  |                                 success:function(res) { | ||
|  |                                     if(res.code === 1) { | ||
|  |                                         category = res.data; | ||
|  |                                         active.renderTree(); | ||
|  |                                         layui.layer.msg(res.msg); | ||
|  |                                         layer.close(index); | ||
|  |                                     } | ||
|  |                                 } | ||
|  |                             }); | ||
|  |                         }); | ||
|  |                         submit.trigger("click"); | ||
|  |                         return false; | ||
|  |                     } | ||
|  |                 }); | ||
|  |             }, | ||
|  |             delCate: function(obj) { | ||
|  |                 if (obj.data.id === 0) { | ||
|  |                     layer.msg("此分类不允许删除", {icon: 2}); | ||
|  |                     return false; | ||
|  |                 } | ||
|  |                 like.ajax({ | ||
|  |                     url: "{:url('File/delCate')}", | ||
|  |                     data: {id: obj.data.id, type: "{$type}"}, | ||
|  |                     type: "POST", | ||
|  |                     success:function(res) { | ||
|  |                         if(res.code === 1) { | ||
|  |                             category = res.data; | ||
|  |                             active.renderTree(); | ||
|  |                             layui.layer.msg(res.msg); | ||
|  |                         }else{ | ||
|  |                             category = res.data; | ||
|  |                             active.renderTree(); | ||
|  |                         } | ||
|  |                     } | ||
|  |                 }); | ||
|  |             }, | ||
|  |             renderTree: function () { | ||
|  |                 tree.render({ | ||
|  |                     elem: '#cate-tree-more' | ||
|  |                     ,edit: ['update', 'del'] | ||
|  |                     ,customOperate: false | ||
|  |                     ,onlyIconControl:true | ||
|  |                     ,data: category | ||
|  |                     ,click: function (obj) { | ||
|  |                         // 节点被点击 | ||
|  |                         var cid = obj.data.id; | ||
|  |                         var page = 1; | ||
|  |                         curCid = cid; | ||
|  |                         active.getFile(cid, page); | ||
|  |                         uploadIns.reload({ | ||
|  |                             elem: "#upload" | ||
|  |                             ,url: "{:url('Upload/image')}" | ||
|  |                             ,data : { | ||
|  |                                 "cid": curCid,  | ||
|  |                                 "type": "{$type}" | ||
|  |                             } | ||
|  |                         }); | ||
|  |                     } | ||
|  |                     ,operate: function(obj){ | ||
|  |                         switch (obj.type) { | ||
|  |                             case "update": | ||
|  |                                 active.editCate(obj); | ||
|  |                                 break; | ||
|  |                             case "del": | ||
|  |                                 active.delCate(obj); | ||
|  |                                 break; | ||
|  |                         } | ||
|  |                     } | ||
|  |                 }); | ||
|  |             } | ||
|  |         }; | ||
|  | 
 | ||
|  |         like.eventClick(active); | ||
|  |         active.renderTree(); | ||
|  |         active.getFile(); | ||
|  | 
 | ||
|  |         var globalUrls = []; | ||
|  | 
 | ||
|  |         $(document).on("click", ".warehouse li", function () { | ||
|  | 
 | ||
|  |             var isExist = $.inArray($(this).attr("lay-href"), globalUrls); | ||
|  |             if (isExist >= 0){ | ||
|  |                 globalUrls.splice(isExist, 1); | ||
|  |             } else { | ||
|  |                 globalUrls.push($(this).attr("lay-href")); | ||
|  |             } | ||
|  | 
 | ||
|  |             if ($(this).hasClass("on")) { | ||
|  |                 $(this).removeClass("on"); | ||
|  |             } else { | ||
|  |                 $(this).addClass("on"); | ||
|  |             } | ||
|  |             $('#fileUrl').val(globalUrls.join(',')); | ||
|  |         }); | ||
|  | 
 | ||
|  | 
 | ||
|  |         // 选择图片(用于富文本的图片选择) | ||
|  |         // Author: 张无忌 | ||
|  |         $("#okFile").click(function () { | ||
|  |             // var urls = []; | ||
|  |             // $(".warehouse li.on").each(function () { | ||
|  |             //     urls.push($(this).attr("lay-href")); | ||
|  |             // }); | ||
|  | 
 | ||
|  |             if (globalUrls.length <= 0) { | ||
|  |                 parent.layer.msg("请至少选择一张图片"); | ||
|  |                 return false; | ||
|  |             } | ||
|  | 
 | ||
|  |             var index = parent.layer.getFrameIndex(window.name); | ||
|  |             parent.layer.close(index); | ||
|  |             parent.window.callback && parent.window.callback(globalUrls.reverse()); | ||
|  |         }); | ||
|  | 
 | ||
|  |     }) | ||
|  | </script> |