index.html 6.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>layui</title>
  6. <link rel="stylesheet" href="__PUBLIC__/layui/css/layui.css" media="all">
  7. <script src="__PUBLIC__/layui/layui.js" charset="utf-8"></script>
  8. </head>
  9. <body style="padding:10px;">
  10. <div style="margin:20px 0px;">
  11. <div class="layui-tab">
  12. <ul class="layui-tab-title">
  13. <li class="layui-this">备份</li>
  14. <li><a href="{:url('admin/databackup/importlist')}" class="a_menu">还原</a></li>
  15. </ul>
  16. </div>
  17. <a id="export" class="layui-btn layui-btn-sm" href="javascript:;" autocomplete="off">立即备份</a>
  18. <a id="optimize" href="{:url('admin/databackup/optimize')}" class="layui-btn layui-btn-sm ">优化数据表</a>
  19. <a id="repair" href="{:url('admin/databackup/repair')}" class="layui-btn layui-btn-sm">修复数据表</a>
  20. <form id="export-form" method="post" action="{:url('admin/databackup/export')}">
  21. <table class="layui-table" lay-even="" lay-skin="row" lay-size="sm">
  22. <colgroup>
  23. <col width="50">
  24. <col width="150">
  25. <col width="150">
  26. <col width="150">
  27. <col width="200">
  28. <col width="200">
  29. <col width="150">
  30. </colgroup>
  31. <thead>
  32. <tr>
  33. <th width="48"><input lay-skin="primary" checked="chedked" type="checkbox" value=""
  34. id="checkOrCancelAll"></th>
  35. <th>表名</th>
  36. <th>数据量</th>
  37. <th>数据大小</th>
  38. <th>创建时间</th>
  39. <th>状态</th>
  40. <th>操作</th>
  41. </tr>
  42. </thead>
  43. <tbody>
  44. {volist name='list' id='table'}
  45. <tr>
  46. <td>
  47. <input class="ids" checked="chedked" type="checkbox" name="tables[]" value="{$table.name}">
  48. </td>
  49. <td class="tablename">{$table.name}</td>
  50. <td>{$table.rows}</td>
  51. <td>{$table.data_length|format_bytes}</td>
  52. <td>{$table.create_time}</td>
  53. <td class="info">-</td>
  54. <td>
  55. <a href="javascript:;" class="layui-btn layui-btn-xs optimiz" tables="{$table.name}">优化表</a>&nbsp;
  56. <a href="javascript:;" class="layui-btn layui-btn-xs repair" tables="{$table.name}">修复表</a>
  57. </td>
  58. </tr>
  59. {/volist}
  60. </tbody>
  61. </table>
  62. </form>
  63. <span style="color:red;">注意 :此功能虽然便捷,但是效率差,数据多时请使用其它备份工具</span>
  64. </div>
  65. <script src="__PUBLIC__/jquery/jquery.min.js"></script>
  66. <script>
  67. layui.use(['jquery', 'layer'], function () {
  68. window.$ = layui.$;
  69. var layer = layui.layer;
  70. //备份表方法
  71. $("#export").click(function () {
  72. $(this).html("正在发送备份请求...");
  73. clearmsg();
  74. $.post(
  75. $("#export-form").attr("action"),
  76. $("#export-form").serialize(),
  77. function (data) {
  78. if (data.code == 1) {
  79. $("#export").html("开始备份,请不要关闭本页面!");
  80. myload = layer.load(1, {
  81. shade: [0.5, '#fff'] //0.1透明度的白色背景
  82. });
  83. backup(data.data.tab);
  84. window.onbeforeunload = function () {
  85. return "正在备份数据库,请不要关闭!"
  86. }
  87. } else {
  88. layer.tips(data.msg, "#export", {
  89. tips: [1, '#3595CC'],
  90. time: 4000
  91. });
  92. $("#export").html("立即备份");
  93. }
  94. }, "json");
  95. return false;
  96. });
  97. //递归备份表
  98. function backup(tab, status) {
  99. status && showmsg(tab.id, "开始备份...(0%)");
  100. $.get($("#export-form").attr("action"), tab, function (data) {
  101. // console.log(data)
  102. if (data.code == 1) {
  103. showmsg(tab, data.msg);
  104. if (!$.isPlainObject(data.data.tab)) {
  105. $("#export").html("备份完成");
  106. layer.close(myload);
  107. window.onbeforeunload = function () {
  108. return null
  109. }
  110. return;
  111. }
  112. backup(data.data.tab, tab.id != data.data.tab.id);
  113. } else {
  114. $("#export").html("立即备份");
  115. }
  116. }, "json");
  117. }
  118. //修改备份状态
  119. function showmsg(tab, msg) {
  120. $(".tablename").each(function (index) {
  121. if ($(this).text() == tab.tablename) {
  122. $("table tbody tr").eq(index).find(".info").html(msg)
  123. }
  124. })
  125. }
  126. function clearmsg() {
  127. $("table tbody tr").each(function (index) {
  128. $(this).find(".info").html('-');
  129. })
  130. }
  131. //优化表
  132. $("#optimize").click(function () {
  133. $.post(this.href, $("#export-form").serialize(), function (data) {
  134. layer.tips(data.msg, "#optimize", {
  135. tips: [1, '#3595CC'],
  136. time: 4000
  137. });
  138. }, "json");
  139. return false;
  140. });
  141. //修复表
  142. $("#repair").on("click", function (e) {
  143. $.post(this.href, $("#export-form").serialize(), function (data) {
  144. layer.tips(data.msg, "#repair", {
  145. tips: [1, '#3595CC'],
  146. time: 4000
  147. });
  148. }, "json");
  149. return false;
  150. });
  151. });
  152. </script>
  153. <script type="text/javascript">
  154. //全选
  155. $(function () {
  156. $('#checkOrCancelAll').on('click', function () {
  157. if (this.checked) {
  158. $(".ids").prop('checked', true);
  159. } else {
  160. $(".ids").prop('checked', false);
  161. }
  162. });
  163. });
  164. $('.optimiz').click(function () {
  165. var tables = $(this).attr('tables');
  166. $.ajax({
  167. url: "{:url('admin/databackup/optimize')}"
  168. , dataType: 'json', data: {tables: tables}
  169. , success: function (res) {
  170. layer.msg(res.msg);
  171. }
  172. })
  173. })
  174. $('.repair').on('click', function () {
  175. var tables = $(this).attr('tables');
  176. $.ajax({
  177. url: "{:url('admin/databackup/repair')}"
  178. , dataType: 'json', data: {tables: tables}
  179. , success: function (res) {
  180. layer.msg(res.msg);
  181. }
  182. })
  183. })
  184. </script>
  185. </body>
  186. </html>