_js.blade.php 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. <style>
  2. #layui-upload-box li{
  3. width: 120px;
  4. height: 100px;
  5. float: left;
  6. position: relative;
  7. overflow: hidden;
  8. margin-right: 10px;
  9. border:1px solid #ddd;
  10. }
  11. #layui-upload-box li img{
  12. width: 100%;
  13. }
  14. #layui-upload-box li p{
  15. width: 100%;
  16. height: 22px;
  17. font-size: 12px;
  18. position: absolute;
  19. left: 0;
  20. bottom: 0;
  21. line-height: 22px;
  22. text-align: center;
  23. color: #fff;
  24. background-color: #333;
  25. opacity: 0.6;
  26. }
  27. #layui-upload-box li i{
  28. display: block;
  29. width: 20px;
  30. height:20px;
  31. position: absolute;
  32. text-align: center;
  33. top: 2px;
  34. right:2px;
  35. z-index:999;
  36. cursor: pointer;
  37. }
  38. </style>
  39. <script>
  40. layui.use(['upload'],function () {
  41. var upload = layui.upload
  42. //普通图片上传
  43. var uploadInst = upload.render({
  44. elem: '#uploadPic'
  45. ,url: '{{ route("admin.uploadImg") }}'
  46. ,multiple: false
  47. ,data:{"_token":"{{ csrf_token() }}"}
  48. ,before: function(obj){
  49. //预读本地文件示例,不支持ie8
  50. /*obj.preview(function(index, file, result){
  51. $('#layui-upload-box').append('<li><img src="'+result+'" /><p>待上传</p></li>')
  52. });*/
  53. obj.preview(function(index, file, result){
  54. $('#layui-upload-box').html('<li><img src="'+result+'" /><p>上传中</p></li>')
  55. });
  56. }
  57. ,done: function(res){
  58. //如果上传失败
  59. if(res.code == 0){
  60. $("#iconUrl").val(res.url);
  61. $('#layui-upload-box li p').text('上传成功');
  62. return layer.msg(res.msg,{icon:6});
  63. }
  64. return layer.msg(res.msg,{icon:5});
  65. }
  66. });
  67. });
  68. </script>