index.html 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606
  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. <style>
  25. td {
  26. white-space: nowrap;
  27. }
  28. </style>
  29. </head>
  30. <body>
  31. <div class="clear-backend">
  32. <div class="avatar">
  33. <div>
  34. <a href="javascript:void(0);" target="_blank">
  35. <img src="img/admin.png" alt="">
  36. </a>
  37. </div>
  38. </div>
  39. <!-- tab-menu -->
  40. <input type="radio" class="tab-1" name="tab" checked="checked">
  41. <span>Home</span><i class="fa fa-home"></i>
  42. <input type="radio" class="tab-2" name="tab" onclick="location.href='langTab.html'">
  43. <span>Lang</span><i class="fa fa-medium"></i>
  44. <input type="radio" class="tab-3" name="tab" onclick="location.href='userTab.html'">
  45. <span>Users</span><i class="fa fa-user"></i>
  46. <input type="radio" class="tab-4" name="tab" onclick="location.href='imgTab.html'">
  47. <span>Azimg</span><i class="fa fa-image"></i>
  48. <!--
  49. <input type="radio" class="tab-5" name="tab">
  50. <span>Upload</span><i class="fa fa-cloud-upload"></i>
  51. <input type="radio" class="tab-6" name="tab">
  52. <span>Favorite</span><i class="fa fa-star"></i>
  53. <input type="radio" class="tab-7" name="tab">
  54. <span>Photos</span><i class="fa fa-photo"></i>
  55. <input type="radio" class="tab-8" name="tab">
  56. <span>Analysis</span><i class="fa fa-line-chart"></i>
  57. <input type="radio" class="tab-9" name="tab">
  58. <span>Links</span><i class="fa fa-link"></i>
  59. <input type="radio" class="tab-10" name="tab">
  60. <span>Settings</span><i class="fa fa-cog"></i>-->
  61. <!-- tab-top-bar -->
  62. <div class="top-bar">
  63. <ul>
  64. <li>
  65. <a href="login.html" title="Log Out">
  66. <i class="fa fa-sign-out"></i>
  67. </a>
  68. </li>
  69. <!--
  70. <li>
  71. <a href="" title="Messages">
  72. <i class="fa fa-envelope"></i>
  73. </a>
  74. </li>
  75. <li>
  76. <a href="" title="Edit">
  77. <i class="fa fa-edit"></i>
  78. </a>
  79. </li>
  80. -->
  81. </ul>
  82. </div>
  83. <!-- tab-content -->
  84. <div class="tab-content" style="overflow: auto">
  85. <section class="tab-item-1" style="height: 100%;width: 100%">
  86. <div class="container-fluid">
  87. <div class="row">
  88. <div id="searchCheckBox" class="col-md-8"></div>
  89. <div class="col-md-4">
  90. <input type="text" class="form-group form-control" id="searchInput"
  91. style="width: 300px;display: inline"/>
  92. <button class="btn btn-danger form-inline" style="margin-bottom: 5px"
  93. onclick="searchKeyAction()">搜索
  94. </button>
  95. </div>
  96. </div>
  97. </div>
  98. <div class="container-fluid">
  99. <div class="row">
  100. <!--add-->
  101. <div class="col-md-12">
  102. <table class="table table-bordered table-hover">
  103. <thead id="langTableHead"></thead>
  104. <tbody id="langTableBody"></tbody>
  105. </table>
  106. </div>
  107. </div>
  108. <div id="pagination"></div>
  109. </div>
  110. <!---->
  111. <div class="container-fluid">
  112. <div class="row">
  113. <div class="col-md-12">
  114. <div class="modal fade" id="modal-container-593541" role="dialog" aria-labelledby="myModalLabel"
  115. aria-hidden="true">
  116. <div class="modal-dialog" role="document">
  117. <div class="modal-content">
  118. <div class="modal-header">
  119. <h5 class="modal-title" id="myModalLabel">
  120. EDIT
  121. </h5>
  122. <button type="button" class="close" data-dismiss="modal">
  123. <span aria-hidden="true">×</span>
  124. </button>
  125. </div>
  126. <div class="modal-body">
  127. <div class="form-group" id="edit_model_form">
  128. <!--<label for="InputLangArea">-->
  129. <!--langArea-->
  130. <!--</label>-->
  131. <!--<input type="text" class="form-control" id="InputLangArea"/>-->
  132. </div>
  133. </div>
  134. <div class="modal-footer">
  135. <button type="button" class="btn btn-primary editRowSaveBtn"
  136. onclick="editRow(this);return false;">
  137. Save changes
  138. </button>
  139. <button type="button" class="btn btn-secondary" data-dismiss="modal">
  140. Close
  141. </button>
  142. </div>
  143. </div>
  144. </div>
  145. </div>
  146. </div>
  147. </div>
  148. </div>
  149. <!---->
  150. </section>
  151. <section class="tab-item-2">
  152. <div class="container-fluid">
  153. <div class="row">
  154. <div class="col-md-12">
  155. </div>
  156. </div>
  157. </div>
  158. </section>
  159. </div>
  160. </div>
  161. <script type="text/javascript">
  162. var orderByupdate=$.cookie('orderByupdate');
  163. if(orderByupdate!=1){
  164. setCookie('orderByupdate', 0, 1000)
  165. }
  166. console.log("11111111orderByupdate"+orderByupdate);
  167. var page = 1
  168. var line = 10
  169. var initData
  170. var IndexFlat = 0
  171. $(function () {
  172. toastr.options = {
  173. "closeButton": true,
  174. "debug": false,
  175. "newestOnTop": false,
  176. "progressBar": true,
  177. "positionClass": "toast-top-right",
  178. "preventDuplicates": false,
  179. "onclick": null,
  180. "showDuration": "300",
  181. "hideDuration": "500",
  182. "timeOut": "5000",
  183. "extendedTimeOut": "1000",
  184. "showEasing": "swing",
  185. "hideEasing": "linear",
  186. "showMethod": "fadeIn",
  187. "hideMethod": "fadeOut"
  188. }
  189. var page = GetUrlParam('page')
  190. if (!page) {
  191. page = 1
  192. }
  193. let post_data = {
  194. 'token': $.cookie('access_token'),
  195. 'page': page,
  196. 'line': line,
  197. 'orderByupdate': orderByupdate
  198. };
  199. InitIndex(post_data)
  200. });
  201. function orderByUpdateTimeFunc(status) {
  202. if (status === 1) {
  203. orderByupdate = 0
  204. } else {
  205. orderByupdate = 1
  206. }
  207. setCookie('orderByupdate', orderByupdate, 1000)
  208. orderByupdate=$.cookie('orderByupdate');
  209. console.log("orderByupdate------------"+orderByupdate)
  210. var page = GetUrlParam('page')
  211. console.log("page----------------"+page)
  212. if (!page) {
  213. page = 1
  214. }
  215. let post_data = {
  216. 'token': $.cookie('access_token'),
  217. 'page': page,
  218. 'line': 10,
  219. 'orderByupdate': orderByupdate
  220. };
  221. InitIndex(post_data)
  222. window.location.reload(); //刷新当前页面.
  223. }
  224. function InitIndex(post_data) {
  225. $.postJSON(
  226. http_ip_prot + 'langWord/query', JSON.stringify(post_data),
  227. function (data) {
  228. if (data['code'] == 0) {
  229. // console.log(data['res'])
  230. console.log(data)
  231. addTable(data['res'])
  232. let count_page = Math.ceil(data['res']['count'] / line)
  233. $('#pagination').pagination({
  234. pages: count_page, //总页数
  235. // pages: 10000, //总页数
  236. edges: 2,
  237. cssStyle: 'pagination', //按纽大小pagination-lg或写入自定义css
  238. displayedPages: 5, //显示几个
  239. onPageClick: function (pageNumber, event) {
  240. //点击时调用
  241. queryData(pageNumber)
  242. },
  243. onInit: function (getid) {
  244. //刷新时或初始化调用
  245. // alert(getid);
  246. }
  247. });
  248. } else {
  249. window.location.href = "http://" + domain + ":7724/web/login.html";
  250. alert(data['msg'])
  251. }
  252. }
  253. );
  254. $.postJSON(
  255. http_ip_prot + 'user/init', JSON.stringify(post_data),
  256. function (data) {
  257. if (data['code'] == 0) {
  258. console.log('initData__start')
  259. console.log(data)
  260. console.log('initData__end')
  261. initData = data['res']
  262. } else {
  263. window.location.href = "http://" + domain + ":7724/web/login.html";
  264. alert(data['msg'])
  265. }
  266. }
  267. );
  268. }
  269. let la_list
  270. let lw_data
  271. function queryData(page) {
  272. console.log("----------"+page) ;
  273. let searchKey = $('input[name="optionsRadios"]:checked').val();
  274. let searchVal = $('#searchInput').val()
  275. var post_data = {}
  276. if (searchVal) {
  277. post_data = {
  278. 'token': $.cookie('access_token'),
  279. 'page': page,
  280. 'line': 10,
  281. 'orderByupdate': orderByupdate,
  282. 'searchKey': searchKey,
  283. 'searchVal': searchVal
  284. };
  285. } else {
  286. post_data = {
  287. 'token': $.cookie('access_token'),
  288. 'page': page,
  289. 'line': 10,
  290. 'orderByupdate': orderByupdate
  291. };
  292. }
  293. $.postJSON(
  294. http_ip_prot + 'langWord/query', JSON.stringify(post_data),
  295. function (data) {
  296. if (data['code'] == 0) {
  297. // console.log(data['res'])
  298. console.log(data)
  299. addTable(data['res'])
  300. } else {
  301. alert(data['msg'])
  302. }
  303. }
  304. );
  305. }
  306. function addTable(data) {
  307. //头部多区域语言
  308. let head_data = data['la_list'];
  309. la_list = head_data
  310. // body部详细语言
  311. let body_data = data['lw_dict'];
  312. lw_data = body_data
  313. let head_html = '<tr><th width="180px"><a href="javascript:void(0);" onclick="addRow()">add</a></th><th>key</th>';
  314. let search_tab = '<label><input type="radio" name="optionsRadios" value="key" checked>key</label>'
  315. //头部标签添加
  316. $.each(head_data.reverse(), function (idx, obj) {
  317. head_html += ('<th>' + obj['lang'] + '</th>')
  318. search_tab += '&nbsp;&nbsp;&nbsp;<label><input type="radio" name="optionsRadios" value="' + obj['lang'] + '">' + obj['lang'] + '</label>'
  319. });
  320. head_html += ('<th><a href="javascript:void(0);" onclick="orderByUpdateTimeFunc(' + orderByupdate + ')">udpateTime &nbsp;<i class="fa ' + (orderByupdate == 1 ? 'fa-arrow-up' : 'fa-arrow-down') + '" aria-hidden="true"></i></a></td></tr>');
  321. // search_tab += '<td width="180px"><button class="btn-primary btn">搜索</button></td></tr>';
  322. if (IndexFlat == 0) {
  323. $('#searchCheckBox').html(search_tab)
  324. IndexFlat = 1
  325. }
  326. let body_html = '';
  327. console.log('--------');
  328. $.each(body_data, function (idx, obj) {
  329. let edit_btn = '<a href="javascript:void(0);" title="Edit" onclick="editFunc(this)"><i class="fa fa-edit"></i></a>';
  330. let del_btn = '<a href="javascript:void(0);" title="Delete" onclick="deleteFunc(this)"><i class="fa fa-ban"></i></a>';
  331. // let del_btn = '';
  332. body_html += '<tr><td>' + edit_btn + '&nbsp;&nbsp;&nbsp;' + del_btn + '</td>';
  333. body_html += ('<td>' + idx + '</td>');
  334. $.each(la_list, function (x, y) {
  335. if (obj[y['lang']]) {
  336. body_html += ('<td>' + obj[y['lang']] + '</td>')
  337. } else {
  338. body_html += ('<td></td>')
  339. }
  340. });
  341. let updTime = $.DateChange.UnixToDate(obj['updTime'], true, 8);
  342. body_html += ('<td>' + updTime + '<span class="arrow dsc"></td></tr>');
  343. });
  344. $('#langTableHead').empty().html(head_html);
  345. $('#langTableBody').empty().html(body_html);
  346. addDelFunc()
  347. }
  348. function addRow() {
  349. let save_btn = '<a href="javascript:void(0);" title="Save" class="save_row"><i class="fa fa-check-circle-o"></i></a>';
  350. let del_btn = '<a href="javascript:void(0);" title="Delete" class="del_row"><i class="fa fa-ban"></i></a>';
  351. let newRow = '<tr><td>' + save_btn + '&nbsp;&nbsp;&nbsp;' + del_btn + '</td><td><input class="form-control" type="text" langID="key" id="newRow_key"></td>'
  352. $.each(la_list, function (idx, obj) {
  353. // console.log(idx)
  354. // newRow += ('<td>' + obj['id'] + '</td>')
  355. newRow += ('<td>' +
  356. '<input class="form-control" type="text" langID="' + obj['id'] + '" id="newRow_lang_' + obj['id'] + '">' +
  357. '</td>')
  358. })
  359. newRow += '<td></td></tr>'
  360. $('#langTableBody').prepend(newRow)
  361. addDelFunc()
  362. addSaveFunc()
  363. }
  364. function addDelFunc() {
  365. $(".del_row").bind("click", function () {
  366. let trRow = $(this).parent().parent()
  367. trRow.remove()
  368. });
  369. }
  370. function addSaveFunc() {
  371. $(".save_row").bind("click", function () {
  372. let post_data = {
  373. 'token': $.cookie('access_token')
  374. }
  375. let post_list = []
  376. let trRow = $(this).parent().parent()
  377. trRow.find('input').each(function () {
  378. // console.log($(this).attr('id'))
  379. // console.log($(this).attr('langID'))
  380. let inputVal = $(this).val()
  381. let langID = $(this).attr('langID')
  382. if (langID === 'key') {
  383. post_data['word_key'] = inputVal
  384. } else {
  385. post_list.push({'la_id': langID, 'val': inputVal})
  386. }
  387. })
  388. post_data['word_arr'] = post_list
  389. console.log(post_data)
  390. $.postJSON(
  391. http_ip_prot + 'langWord/add', JSON.stringify(post_data),
  392. function (data) {
  393. if (data['code'] == 0) {
  394. // console.log(data['res'])
  395. window.location.reload();
  396. console.log(data)
  397. } else {
  398. alert(data['msg'])
  399. }
  400. }
  401. )
  402. })
  403. }
  404. // 编辑模态框
  405. function editFunc($this) {
  406. let langKey = $($this).parent().parent().children().eq(1).text()
  407. $('#modal-container-593541').modal('show')
  408. let user_perm = initData['user_perm']
  409. console.log(initData)
  410. // let post_data = {'token': $.cookie('access_token')};
  411. let html_per = '<label for="lang_key_edit">KEY</label><input class="form-control" ' + (user_perm == 1 ? '' : 'disabled="disabled"') + ' type="text" id="lang_key_edit" oldkey="' + langKey + '" value="' + langKey + '"> '
  412. $.each(la_list, function (idx, obj) {
  413. let lang_perm_ls = initData['lang_perm_ls']
  414. let check_perm_flag = $.inArray(obj['lang'], lang_perm_ls)
  415. if (check_perm_flag >= 0) {
  416. var inputAttr = ''
  417. } else {
  418. var inputAttr = 'disabled="disabled"'
  419. }
  420. //console.log(obj);
  421. html_per += ('<label for="InputLangArea">' + obj['lang'] + ':</label>' +
  422. '<textarea type="text" ' + inputAttr + ' class="form-control disabled" lang="' + obj['lang'] + '">' + (lw_data[langKey][obj['lang']] ? lw_data[langKey][obj['lang']] : '') + '</textarea>')
  423. //html_per += ('<label for="InputLangArea">' + obj['lang'] + ':</label>' +
  424. // '<input type="text" ' + inputAttr + ' class="form-control disabled" lang="' + obj['lang'] + '" value="' + (lw_data[langKey][obj['lang']] ? lw_data[langKey][obj['lang']] : '') + '"/>')
  425. });
  426. // console.log(html_per)
  427. $('#edit_model_form').html(html_per)
  428. }
  429. function deleteFunc($this) {
  430. let langKey = $($this).parent().parent().children().eq(1).text()
  431. var r = confirm("Press a button")
  432. if (r) {
  433. let post_data = {
  434. 'token': $.cookie('access_token'),
  435. 'word_key': langKey
  436. }
  437. console.log(post_data)
  438. $.postJSON(
  439. http_ip_prot + 'langWord/delete', JSON.stringify(post_data),
  440. function (data) {
  441. if (data['code'] == 0) {
  442. // console.log(data['res'])
  443. console.log(data);
  444. alert(data['msg']);
  445. window.location.reload();
  446. } else {
  447. alert(data['msg'])
  448. }
  449. }
  450. )
  451. }
  452. }
  453. /*post_data = {
  454. word_key_id:1,
  455. word_key:xxx,
  456. word_arr:[
  457. {'lang':'','val':''},
  458. {'lang':'','val':''},
  459. {'lang':'','val':''}
  460. ]
  461. }*/
  462. function editRow() {
  463. let post_data = {}
  464. post_data['token'] = $.cookie('access_token')
  465. post_data['word_key'] = $('#lang_key_edit').val()
  466. post_data['old_word_key'] = $('#lang_key_edit').attr('oldkey')
  467. post_data['word_arr'] = {}
  468. // $('#edit_model_form').find('input').each(function () {
  469. // let langArea = $(this).attr('lang')
  470. // if (langArea) {
  471. // post_data['word_arr'][langArea] = $(this).val()
  472. //}
  473. //})
  474. $('#edit_model_form').find('textarea').each(function () {
  475. let langArea = $(this).attr('lang')
  476. if (langArea) {
  477. post_data['word_arr'][langArea] = $(this).val()
  478. }
  479. })
  480. console.log(post_data)
  481. $.postJSON(
  482. http_ip_prot + 'langWord/update', JSON.stringify(post_data),
  483. function (data) {
  484. if (data['code'] == 0) {
  485. // console.log(data['res'])
  486. console.log(data)
  487. toastr["success"](data['msg'])
  488. $('#modal-container-593541').modal('hide')
  489. IndexTable()
  490. //window.location.reload();
  491. } else {
  492. alert(data['msg'])
  493. }
  494. }
  495. )
  496. // $('.editRowSaveBtn').bind('click', function () {
  497. // console.log('adjslkfjsdalkfj')
  498. // })
  499. }
  500. function IndexTable() {
  501. var page = GetUrlParam('page')
  502. if (!page) {
  503. page = 1
  504. }
  505. let post_data = {
  506. 'token': $.cookie('access_token'),
  507. 'page': page,
  508. 'line': line,
  509. 'orderByupdate': orderByupdate
  510. };
  511. $.postJSON(
  512. http_ip_prot + 'langWord/query', JSON.stringify(post_data),
  513. function (data) {
  514. if (data['code'] == 0) {
  515. // console.log(data['res'])
  516. console.log(data)
  517. addTable(data['res'])
  518. let count_page = Math.ceil(data['res']['count'] / line)
  519. queryData(page)
  520. } else {
  521. alert(data['msg'])
  522. }
  523. }
  524. );
  525. }
  526. function searchKeyAction() {
  527. var page = GetUrlParam('page')
  528. if (!page) {
  529. page = 1
  530. }
  531. let searchKey = $('input[name="optionsRadios"]:checked').val();
  532. let searchVal = $('#searchInput').val()
  533. console.log('-------------------------------')
  534. console.log(searchKey)
  535. console.log(searchVal)
  536. console.log('-------------------------------')
  537. let post_data = {}
  538. if (searchVal && searchKey) {
  539. post_data = {
  540. 'token': $.cookie('access_token'),
  541. 'page': page,
  542. 'line': 10,
  543. 'searchKey': searchKey,
  544. 'searchVal': searchVal
  545. };
  546. } else {
  547. post_data = {
  548. 'token': $.cookie('access_token'),
  549. 'page': page,
  550. 'line': 10,
  551. };
  552. }
  553. InitIndex(post_data)
  554. }
  555. </script>
  556. </body>
  557. </html>