imgTab.html 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468
  1. <!doctype html>
  2. <html lang="zh">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <title>afaa</title>
  8. <link rel="stylesheet" type="text/css" href="css/normalize.css"/>
  9. <link rel="stylesheet" type="text/css" href="css/default.css">
  10. <link rel="stylesheet" href="css/style.css">
  11. <link href="http://cdn.bootcss.com/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet">
  12. <link href="css/bootstrap.min.css" rel="stylesheet">
  13. <link href="http://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css" rel="stylesheet">
  14. <script src="https://npmcdn.com/tether@1.2.4/dist/js/tether.min.js"></script>
  15. <script src="js/jquery.min.js"></script>
  16. <script src="js/bootstrap.min.js"></script>
  17. <script src="js/jquery_cookie_min.js"></script>
  18. <script src="js/scripts.js"></script>
  19. <script src="js/jqhttpsdk.js"></script>
  20. <script src="js/jkcor.js"></script>
  21. <script src="js/pages.js"></script>
  22. <script src="js/datachange.js"></script>
  23. <script src="http://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js" type="text/javascript"></script>
  24. </head>
  25. <body>
  26. <div class="clear-backend">
  27. <div class="avatar">
  28. <div>
  29. <a href="javascript:void(0);" target="_blank">
  30. <img src="img/admin.png" alt="">
  31. </a>
  32. </div>
  33. </div>
  34. <input type="radio" class="tab-1" name="tab" onclick="location.href='index.html'">
  35. <span>Home</span><i class="fa fa-home"></i>
  36. <input type="radio" class="tab-2" name="tab" onclick="location.href='langTab.html'">
  37. <span>Lang</span><i class="fa fa-medium"></i>
  38. <input type="radio" class="tab-3" name="tab" onclick="location.href='imgTab.html'">
  39. <span>Users</span><i class="fa fa-user"></i>
  40. <input type="radio" class="tab-4" name="tab" checked="checked">
  41. <span>Azimg</span><i class="fa fa-image"></i>
  42. <!-- tab-top-bar -->
  43. <div class="top-bar">
  44. <ul>
  45. <li>
  46. <a href="login.html" title="Log Out">
  47. <i class="fa fa-sign-out"></i>
  48. </a>
  49. </li>
  50. <!--
  51. <li>
  52. <a href="javascript:void(0);" title="Messages">
  53. <i class="fa fa-envelope"></i>
  54. </a>
  55. </li>
  56. -->
  57. <li>
  58. <a href="javascript:void(0);" title="Edit" onclick="editSysFunc()">
  59. <i class="fa fa-edit"></i>
  60. </a>
  61. </li>
  62. </ul>
  63. </div>
  64. <!-- tab-content -->
  65. <div class="tab-content" style="overflow: auto">
  66. <section class="tab-item-4" style="height: 100%;width: 100%">
  67. <div class="container-fluid">
  68. <div class="row">
  69. <div class="col-md-12">
  70. <form class="form-inline" role="form">
  71. <div class="form-group">
  72. <label class="sr-only" for="asin_add_input">ASIN</label>
  73. <input type="text" class="form-control" id="asin_add_input"
  74. placeholder="请输入ASIN">
  75. </div>
  76. <div class="form-group">
  77. <label class="sr-only" for="url_add_input">链接</label>
  78. <input type="text" class="form-control" id="url_add_input"
  79. placeholder="请输入图片url">
  80. </div>
  81. <button type="submit" class="btn btn-primary" onclick="subAddImgAction();return false;">
  82. 保存
  83. </button>
  84. </form>
  85. </div>
  86. <div class="col-md-12">
  87. <form class="form-inline float-right" role="form">
  88. <div class="form-group">
  89. <input type="text" class="form-control" id="searchInput" placeholder="请输入搜索的ASIN">
  90. </div>
  91. <button type="submit" class="btn btn-primary" onclick="subSearchAsinAction();return false;">
  92. 搜索
  93. </button>
  94. </form>
  95. </div>
  96. </div>
  97. </div>
  98. <hr>
  99. <div class="container-fluid">
  100. <div class="row">
  101. <div class="col-md-12">
  102. <table class="table table-bordered table-hover">
  103. <thead id="tabHead">
  104. <tr>
  105. <th>编号</th>
  106. <th>ASIN</th>
  107. <th>图片URL</th>
  108. <th>MD5</th>
  109. <th>添加时间</th>
  110. <th>更新时间</th>
  111. <th>操作</th>
  112. </tr>
  113. </thead>
  114. <tbody id="tabBody"></tbody>
  115. </table>
  116. </div>
  117. </div>
  118. <div id="pagination"></div>
  119. </div>
  120. <!--模态框start-->
  121. <div class="container-fluid">
  122. <div class="row">
  123. <div class="col-md-12">
  124. <div class="modal fade" id="modal-container-edit" role="dialog"
  125. aria-labelledby="myModalLabel"
  126. aria-hidden="true">
  127. <div class="modal-dialog" role="document">
  128. <div class="modal-content">
  129. <div class="modal-header">
  130. <h5 class="modal-title" id="myModalLabel">
  131. 编辑
  132. </h5>
  133. <button type="button" class="close" data-dismiss="modal">
  134. <span aria-hidden="true">×</span>
  135. </button>
  136. </div>
  137. <div class="modal-body">
  138. <div class="form-group" id="edit_model_form">
  139. </div>
  140. </div>
  141. <div class="modal-footer">
  142. <button type="button" class="btn btn-primary editRowSaveBtn"
  143. onclick="editRow(this);return false;">
  144. 保存
  145. </button>
  146. <button type="button" class="btn btn-secondary" data-dismiss="modal">
  147. 关闭
  148. </button>
  149. </div>
  150. </div>
  151. </div>
  152. </div>
  153. </div>
  154. </div>
  155. </div>
  156. <!--模态框end-->
  157. <!--修改推送邮箱 模态框start -->
  158. <div class="container-fluid">
  159. <div class="row">
  160. <div class="col-md-12">
  161. <div class="modal fade" id="modal-sys-edit" role="dialog"
  162. aria-labelledby="myModalLabel"
  163. aria-hidden="true">
  164. <div class="modal-dialog" role="document">
  165. <div class="modal-content">
  166. <div class="modal-header">
  167. <h5 class="modal-title" id="myModalLabel">
  168. 编辑
  169. </h5>
  170. <button type="button" class="close" data-dismiss="modal">
  171. <span aria-hidden="true">×</span>
  172. </button>
  173. </div>
  174. <div class="modal-body">
  175. <div class="form-group" id="edit_model_form">
  176. <label for="asimgMsgEmailInput">通知邮箱:</label>
  177. <input type="text" class="form-control" id="asimgMsgEmailInput">
  178. <label for="asIntervalINput">时间间隔(小时):</label>
  179. <input type="text" class="form-control" id="asIntervalINput">
  180. </div>
  181. </div>
  182. <div class="modal-footer">
  183. <button type="button" class="btn btn-primary editRowSaveBtn"
  184. onclick="SaveSysFunc(this);return false;">
  185. 保存
  186. </button>
  187. <button type="button" class="btn btn-secondary" data-dismiss="modal">
  188. 关闭
  189. </button>
  190. </div>
  191. </div>
  192. </div>
  193. </div>
  194. </div>
  195. </div>
  196. </div>
  197. <!--模态框end-->
  198. </section>
  199. </div>
  200. </div>
  201. <script type="text/javascript">
  202. let index_data;
  203. var line = 10;
  204. $(function () {
  205. toastr.options = {
  206. "closeButton": true,
  207. "debug": false,
  208. "newestOnTop": false,
  209. "progressBar": true,
  210. "positionClass": "toast-top-right",
  211. "preventDuplicates": false,
  212. "onclick": null,
  213. "showDuration": "300",
  214. "hideDuration": "500",
  215. "timeOut": "5000",
  216. "extendedTimeOut": "1000",
  217. "showEasing": "swing",
  218. "hideEasing": "linear",
  219. "showMethod": "fadeIn",
  220. "hideMethod": "fadeOut"
  221. };
  222. InitIndex()
  223. });
  224. function InitIndex() {
  225. var page = GetUrlParam('page');
  226. page = page.replace('#', '');
  227. if (!page) {
  228. page = 1
  229. }
  230. let post_data = {
  231. 'token': $.cookie('access_token'),
  232. 'page': page,
  233. 'line': line
  234. }
  235. console.log(isNaN(page))
  236. let searchAsin = $('#searchInput').val()
  237. if (searchAsin) {
  238. post_data['searchAsin'] = searchAsin
  239. }
  240. $('#pagination').empty()
  241. $.postJSON(
  242. http_ip_prot + 'asimg/query', JSON.stringify(post_data),
  243. function (data) {
  244. if (data['code'] == 0) {
  245. console.log(data)
  246. addTable(data['res']);
  247. let count_page = Math.ceil(data['count'] / line);
  248. $('#pagination').pagination({
  249. pages: count_page, //总页数
  250. // pages: 10000, //总页数
  251. edges: 2,
  252. cssStyle: 'pagination', //按纽大小pagination-lg或写入自定义css
  253. displayedPages: 5, //显示几个
  254. onPageClick: function (pageNumber, event) {
  255. //点击时调用
  256. // alert(pageNumber);
  257. queryData(pageNumber)
  258. },
  259. onInit: function (getid) {
  260. //刷新时或初始化调用
  261. // alert(getid);
  262. }
  263. });
  264. } else {
  265. alert(data['msg'])
  266. }
  267. }
  268. );
  269. }
  270. function queryData(page) {
  271. let post_data = {
  272. 'token': $.cookie('access_token'),
  273. 'page': page,
  274. 'line': line
  275. };
  276. let searchAsin = $('#searchInput').val()
  277. if (searchAsin) {
  278. post_data['searchAsin'] = searchAsin
  279. }
  280. $.postJSON(
  281. http_ip_prot + 'asimg/query', JSON.stringify(post_data),
  282. function (data) {
  283. if (data['code'] == 0) {
  284. // console.log(data['res'])
  285. console.log(data)
  286. addTable(data['res'])
  287. } else {
  288. alert(data['msg'])
  289. }
  290. }
  291. );
  292. }
  293. function addTable(data) {
  294. index_data = data
  295. let body_html = ''
  296. $.each(data, function (idx, obj) {
  297. let edit_btn = '<a href="javascript:void(0);" title="Edit" onclick="editFunc(\'' + obj['id'] + '\')"><i class="fa fa-edit"></i></a>';
  298. let del_btn = '<a href="javascript:void(0);" title="Delete" onclick="delAsImg(\'' + obj['id'] + '\')"><i class="fa fa-ban"></i></a>';
  299. body_html += '<tr>' +
  300. '<td>' + obj['id'] + '</td>' +
  301. '<td>' + obj['asin'] + '</td>' +
  302. //'<td>' + obj['url'] + '</td>' +
  303. '<td><img width="50px" src="' + obj['url'] + '"/></td>' +
  304. '<td>' + obj['md5'] + '</td>' +
  305. '<td>' + $.DateChange.UnixToDate(obj['addTime'], true, 8) + '</td>' +
  306. '<td>' + $.DateChange.UnixToDate(obj['updTime'], true, 8) + '</td>' +
  307. '<td>' + edit_btn + '&nbsp;&nbsp;&nbsp;' + del_btn + '</td></tr>'
  308. })
  309. $('#tabBody').html(body_html)
  310. }
  311. function delAsImg(id) {
  312. let post_data = {
  313. 'token': $.cookie('access_token'),
  314. 'id': id
  315. }
  316. let cr = confirm('delete it ?')
  317. if (cr) {
  318. $.postJSON(
  319. http_ip_prot + 'asimg/delete', JSON.stringify(post_data),
  320. function (data) {
  321. if (data['code'] == 0) {
  322. console.log(data)
  323. // alert(data['msg'])
  324. window.location.reload()
  325. } else {
  326. alert(data['msg'])
  327. }
  328. }
  329. );
  330. }
  331. }
  332. function editFunc(id) {
  333. // alert(langKey)
  334. $('#modal-container-edit').modal('show')
  335. let html_edit = ''
  336. $.each(index_data, function (idx, obj) {
  337. if (id == obj['id']) {
  338. html_edit = '<input id="editIDInput" type="hidden" value="' + id + '"/>'
  339. html_edit += '<label for="editAsinInput">ASIN</label><input type="text" class="form-control" id="editAsinInput" value="' + obj['asin'] + '">'
  340. html_edit += '<label for="editUrlInput">图片URL</label><input type="text" class="form-control" id="editUrlInput" value="' + obj['url'] + '">'
  341. }
  342. });
  343. $('#edit_model_form').html(html_edit)
  344. }
  345. function editRow() {
  346. let asin = $('#editAsinInput').val()
  347. let url = $('#editUrlInput').val()
  348. let id = $('#editIDInput').val()
  349. let post_data = {
  350. 'token': $.cookie('access_token'),
  351. 'asin': asin,
  352. 'url': url,
  353. 'id': id
  354. }
  355. console.log(post_data)
  356. $.postJSON(
  357. http_ip_prot + 'asimg/update', JSON.stringify(post_data),
  358. function (data) {
  359. if (data['code'] == 0) {
  360. console.log(data)
  361. // alert(data['msg'])
  362. window.location.reload()
  363. } else {
  364. alert(data['msg'])
  365. }
  366. }
  367. );
  368. }
  369. function subAddImgAction() {
  370. let url = $("#url_add_input").val();
  371. let asin = $("#asin_add_input").val();
  372. let post_data = {
  373. 'url': url,
  374. 'asin': asin,
  375. 'token': $.cookie('access_token'),
  376. };
  377. $.postJSON(
  378. http_ip_prot + 'asimg/add',
  379. JSON.stringify(post_data),
  380. function (data) {
  381. if (data['code'] == 0) {
  382. // alert(data['msg'])
  383. toastr["success"]('保存成功')
  384. InitIndex()
  385. // window.location.reload()
  386. } else {
  387. toastr["success"]('保存失败')
  388. console.log(data['msg'])
  389. }
  390. }
  391. );
  392. }
  393. function subSearchAsinAction() {
  394. InitIndex()
  395. }
  396. function editSysFunc() {
  397. $('#modal-sys-edit').modal('show')
  398. let post_data = {
  399. 'token': $.cookie('access_token'),
  400. 'key_list': ['asimgEmail', 'asinterval']
  401. }
  402. $.postJSON(
  403. http_ip_prot + 'sysSet/query', JSON.stringify(post_data),
  404. function (data) {
  405. if (data['code'] == 0) {
  406. console.log('-------------------------------')
  407. console.log(data)
  408. console.log('===============================')
  409. $('#asIntervalINput').val(data['res']['asinterval']/3600)
  410. $('#asimgMsgEmailInput').val(data['res']['asimgEmail'])
  411. } else {
  412. alert(data['msg'])
  413. }
  414. }
  415. );
  416. }
  417. function SaveSysFunc() {
  418. let asinterval = $('#asIntervalINput').val()
  419. let asimgEmail = $('#asimgMsgEmailInput').val()
  420. let post_data = {
  421. 'update_data': [
  422. {'key': 'asimgEmail', 'val': asimgEmail},
  423. {'key': 'asinterval', 'val': asinterval}
  424. ],
  425. 'token': $.cookie('access_token'),
  426. }
  427. $.postJSON(
  428. http_ip_prot + 'sysSet/update', JSON.stringify(post_data),
  429. function (data) {
  430. if (data['code'] == 0) {
  431. console.log(data);
  432. $('#modal-sys-edit').modal('hide')
  433. } else {
  434. console.log(data)
  435. }
  436. }
  437. )
  438. }
  439. </script>
  440. </body>
  441. </html>