show.html 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. <style>
  2. #component-anim .layui-card-body{padding: 15px;}
  3. #component-anim .component-anim-demo{font-size: 0;}
  4. #component-anim .component-anim-demo li{display: inline-block; vertical-align: middle; width: 127px; line-height: 25px; padding: 20px 0; font-size: 14px; text-align: center; color: #666; transition: all .3s; -webkit-transition: all .3s;margin:5px;}
  5. #component-anim .component-anim-demo li .layui-icon{display: inline-block; font-size: 36px;}
  6. #component-anim .component-anim-demo li .fontclass{display: none;}
  7. #component-anim .component-anim-demo li .name{color: #c2c2c2;}
  8. #component-anim .component-anim-demo li:hover{background-color: #f2f2f2; color: #000;}
  9. #component-anim .component-anim-demo li{width: 168px;}
  10. #component-anim .component-anim-demo .layui-anim{cursor: pointer;}
  11. #component-anim .component-anim-demo .layui-anim{width:150px;height:100px;}
  12. #component-anim .component-anim-demo .code{height:25px;width: auto;
  13. overflow: hidden;
  14. text-overflow: ellipsis;
  15. white-space: nowrap;}
  16. #component-anim .component-anim-demo .layui-anim-yes
  17. {
  18. border:1px solid #0000ff;
  19. }
  20. #component-anim .component-anim-demo .layui-anim-no
  21. {
  22. border: 1px solid #e2e2e2;
  23. }
  24. </style>
  25. <div class="layui-card" id="component-anim">
  26. <div class="layui-card-header">
  27. <input type="hidden" class="file_key" value="<{$key}>">
  28. <input type="hidden" class="file_pg" value="<{$search_pg}>">
  29. <input type="hidden" class="file_cur" value="<{$cur}>">
  30. <input type="hidden" class="upload_search_value" value="<{$upload_search_value}>">
  31. <input type="hidden" class="upload_search" value="<{$upload_search}>">
  32. <div class="layui-inline"><div class="layui-input-inline"><input type="text" style="width: 100%;" class="layui-input file_filename" value="<{$search_name}>" autocomplete="new-password" placeholder="<{$name}>"></div></div>
  33. <div class="layui-inline" style="display: none;"><div class="layui-input-inline"><input type="text" style="width: 100%;" class="layui-input file_tag" value="<{$search_tag}>" autocomplete="new-password" placeholder="标签"></div></div>
  34. <div class="layui-inline"><div class="layui-input-inline"><select lay-ignore="" class="layui-input file_cate" style="width: 100%;"><option parent="" value="-1" selected="">选择分类</option>
  35. <{loop($cate):}>
  36. <option parent="" value="<{$v.id}>" <{if($v.id == $search_cate):}>selected<{endif}>><{$v.name}></option>
  37. <{endloop}>
  38. </select></div></div>
  39. <div class="layui-inline" class="file-search" id="showUploadFilesSearch" onclick="showUploadFilesSearch($(this), 1, false, 1)"><div class="layui-input-inline"><button type="button" class="layui-btn"><i class="fa fa-save"></i> 搜索</button></div></div>
  40. <div class="layui-inline" class="file-search" onclick="showUploadFilesUpload($(this))"><div class="layui-input-inline"><button type="button" class="layui-btn"><i class="fa fa-save"></i> 上传</button></div></div>
  41. <div class="layui-inline" class="file-search" id="showUploadFilesSearch2" onclick="showUploadFilesSearch($(this), 2, false, 1)"><div class="layui-input-inline"><button type="button" class="layui-btn layui-btn-danger"><i class="fa fa-submit"></i> 回收站</button></div></div>
  42. <div class="layui-inline" class="file-search" id="showUploadFilesSearch" onclick="showUploadFilesSearch($(this), 1, true, 1)"><div class="layui-input-inline"><button type="button" class="layui-btn layui-btn-normal"><i class="fa fa-save"></i> 全部图库</button></div></div>
  43. </div>
  44. <div class="layui-card-body">
  45. <ul class="component-anim-demo">
  46. <{loop($file):}>
  47. <li class="<{if($v1.check):}>layui-anim-yes<{else:}>layui-anim-no<{endif}>">
  48. <div class="layui-anim" data-anim="layui-anim-up" onclick="showUploadFilesSet($(this), '<{$v1.name}>','<{$v1.url}>','<{$v1.id}>')"><img src="<{$v1.pic}>" style="max-width: 150px;max-height: 100px;margin-left: 10px;"/></div>
  49. <div class="code" style="margin-left: 5px;" onclick="showUploadFilesShowValue($(this))"><{$v1.source_name}></div>
  50. <div class="code" ><a style="color:<{$v1.stateColor}>;cursor: pointer;" onclick="showUploadFilesSetState($(this), '<{$v1.stateUrl}>')">[<{$v1.stateName}>]</a>
  51. <{if($v1.state == 1):}>
  52. <a class="code" style="color:blue;cursor: pointer;" onclick="showUploadFilesSetValue($(this), '<{$v1.valueUrl}>', 't<{$v1.id}>', '<{$v1.value}>')">[附加值]</a>
  53. <{endif}>
  54. </div>
  55. </li>
  56. <{endloop}>
  57. </ul>
  58. <div id="file-page"></div>
  59. </div>
  60. <script>
  61. layui.use('laypage', function(){
  62. var laypage = layui.laypage;
  63. //执行一个laypage实例
  64. laypage.render({
  65. elem: 'file-page' //注意,这里的 test1 是 ID,不用加 # 号
  66. ,count: <{$total}> //数据总数,从服务端得到
  67. ,limit:12
  68. ,curr:<{$search_pg}>
  69. ,jump: function(obj, first){
  70. //首次不执行
  71. if(!first){
  72. $('.file_pg').val(obj.curr);
  73. showUploadFilesSearch($('.file_pg'), showUploadFilesSearchState, showUploadFilesSearchAll);
  74. }
  75. }
  76. });
  77. });
  78. </script>
  79. </div>