index.php 7.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173
  1. {extend name="public/container"}
  2. {block name="content"}
  3. <div class="layui-fluid">
  4. <div class="layui-card">
  5. <div class="layui-card-header">Bucket列表</div>
  6. <div class="layui-card-body">
  7. <div class="layui-row layui-col-space15">
  8. <div class="layui-col-md12">
  9. <form class="layui-form layui-form-pane" action="">
  10. <div class="layui-form-item">
  11. <div class="layui-inline">
  12. <label class="layui-form-label">Bucket名称</label>
  13. <div class="layui-input-inline">
  14. <input type="text" name="title" class="layui-input" placeholder="Bucket名称">
  15. </div>
  16. </div>
  17. <div class="layui-inline">
  18. <label class="layui-form-label">地域</label>
  19. <div class="layui-input-inline">
  20. <select name="endpoint" lay-search="" id="endpoints">
  21. <option value="">区域</option>
  22. {volist name="$endpoint" id="vo" key="k"}
  23. <option value="{$vo}">{$key}</option>
  24. {/volist}
  25. </select>
  26. </div>
  27. </div>
  28. <div class="layui-inline">
  29. <div class="layui-input-inline">
  30. <div class="layui-btn-group">
  31. <button type="button" class="layui-btn layui-btn-sm layui-btn-normal" lay-submit="search" lay-filter="search">
  32. <i class="layui-icon">&#xe615;</i>搜索
  33. </button>
  34. <button type="button" class="layui-btn layui-btn-normal layui-btn-sm pull">
  35. 拉取Bucket
  36. </button>
  37. </div>
  38. </div>
  39. </div>
  40. </div>
  41. </form>
  42. </div>
  43. <div class="layui-col-md12">
  44. <div class="layui-btn-group conrelTable">
  45. <button type="button" class="layui-btn layui-btn-normal layui-btn-sm" data-type="add" onclick="action.open_add('{:Url('create')}','创建Bucket')">
  46. <i class="layui-icon">&#xe608;</i>创建Bucket
  47. </button>
  48. <button type="button" class="layui-btn layui-btn-normal layui-btn-sm" data-type="refresh" onclick="window.location.reload()">
  49. <i class="layui-icon">&#xe669;</i>刷新
  50. </button>
  51. </div>
  52. <table class="layui-hide" id="List" lay-filter="List"></table>
  53. <script type="text/html" id="is_use">
  54. {{# if(d.is_use==1){ }}
  55. 使用中<br/>
  56. {{# }else{ }}
  57. <button lay-event='userUse' class="layui-btn layui-btn-normal layui-btn-xs use-btn" type="button"><i class="fa fa-check"></i> 使用</button>
  58. {{# } }}
  59. </script>
  60. <script type="text/html" id="act">
  61. <button type="button" class="layui-btn layui-btn-danger layui-btn-xs" lay-event='delect'>
  62. <i class="layui-icon">&#xe640;</i> 删除
  63. </button>
  64. </script>
  65. </div>
  66. </div>
  67. </div>
  68. </div>
  69. </div>
  70. <script src="{__ADMIN_PATH}js/layuiList.js"></script>
  71. {/block}
  72. {block name="script"}
  73. <script>
  74. var $ = layui.jquery;
  75. var layer = layui.layer;
  76. //实例化form
  77. layList.form.render();
  78. layList.date({elem: '#datetime', type: 'datetime', range: '~'});
  79. //加载列表
  80. layList.tableList({o:'List', done:function () {}},"{:Url('bucket_list')}",function (){
  81. return [
  82. {field: 'id', title: '编号', width: '8%', align: 'center'},
  83. {field: 'bucket_name', title: '存储空间名称', align: 'center'},
  84. {field: 'endpoint', title: '区域',align: 'center', width: '20%'},
  85. {field: 'domain_name', title: '空间域名Domain',align: 'center', width: '25%'},
  86. {field: 'is_use', title: '是否使用',templet:'#is_use', align: 'center', width: '10%'},
  87. {field: 'right', title: '操作', align: 'center', toolbar: '#act', width: '12%'}
  88. ];
  89. });
  90. //自定义方法
  91. var action= {
  92. //打开新添加页面
  93. open_add: function (url,title) {
  94. layer.open({
  95. type: 2 //Page层类型
  96. ,area: ['60%', '60%']
  97. ,title: title
  98. ,shade: 0.6 //遮罩透明度
  99. ,maxmin: true //允许全屏最小化
  100. ,anim: 1 //0-6的动画形式,-1不开启
  101. ,content: url
  102. ,end:function() {
  103. location.reload();
  104. }
  105. });
  106. }
  107. };
  108. //查询
  109. layList.search('search',function(where){
  110. layList.reload({
  111. obtain: where.obtain,
  112. title: where.title
  113. },true);
  114. });
  115. $('.pull').on('click',function(){
  116. var endpoint=$('#endpoints option:selected').val();
  117. if(endpoint=='') return $eb.$swal('error','请先选择区域');
  118. var url=layList.U({a:'pullBucket',q:{endpoint:endpoint}});
  119. $eb.$swal('delete',function(){
  120. $eb.axios.get(url).then(function(res){
  121. if(res.data.code == 200) {
  122. window.location.reload();
  123. $eb.$swal('success', res.data.msg);
  124. }else
  125. $eb.$swal('error',res.data.msg||'操作失败!');
  126. });
  127. },{
  128. title:'确定拉取储存空间Bucket吗?',
  129. text:'使用后无法撤销,请谨慎操作!',
  130. confirm:'确认'
  131. });
  132. });
  133. //监听并执行排序
  134. layList.sort(['id','sort'],true);
  135. //点击事件绑定
  136. layList.tool(function (event,data,obj) {
  137. switch (event) {
  138. case 'delect':
  139. var url=layList.U({a:'delete',q:{id:data.id}});
  140. $eb.$swal('delete',function(){
  141. $eb.axios.get(url).then(function(res){
  142. if(res.status == 200 && res.data.code == 200) {
  143. $eb.$swal('success',res.data.msg);
  144. location.reload();
  145. }else
  146. return Promise.reject(res.data.msg || '删除失败')
  147. }).catch(function(err){
  148. $eb.$swal('error',err);
  149. });
  150. });
  151. break;
  152. case 'userUse':
  153. var url=layList.U({a:'userUse',q:{id:data.id}});
  154. $eb.$swal('delete',function(){
  155. $eb.axios.post(url).then(function(res){
  156. if(res.data.code == 200) {
  157. window.location.reload();
  158. $eb.$swal('success', res.data.msg);
  159. }else
  160. $eb.$swal('error',res.data.msg||'操作失败!');
  161. });
  162. },{
  163. title:'确定使用该储存空间吗?',
  164. text:'使用后无法撤销,请谨慎操作!',
  165. confirm:'确认'
  166. });
  167. break;
  168. }
  169. })
  170. </script>
  171. {/block}