index.html 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647
  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. <input type="button" value="reset" onclick="onReset()">
  64. <ul>
  65. <li>
  66. <a href="login.html" title="Log Out">
  67. <i class="fa fa-sign-out"></i>
  68. </a>
  69. </li>
  70. <!--
  71. <li>
  72. <a href="" title="Messages">
  73. <i class="fa fa-envelope"></i>
  74. </a>
  75. </li>
  76. <li>
  77. <a href="" title="Edit">
  78. <i class="fa fa-edit"></i>
  79. </a>
  80. </li>
  81. -->
  82. </ul>
  83. </div>
  84. <!-- tab-content -->
  85. <div class="tab-content" style="overflow: auto">
  86. <section class="tab-item-1" style="height: 100%;width: 100%">
  87. <div class="container-fluid">
  88. <div class="row">
  89. <div id="searchCheckBox" class="col-md-8"></div>
  90. <div class="col-md-4">
  91. <input type="text" class="form-group form-control" id="searchInput"
  92. style="width: 300px;display: inline"/>
  93. <button class="btn btn-danger form-inline" style="margin-bottom: 5px"
  94. onclick="searchKeyAction()">搜索
  95. </button>
  96. </div>
  97. </div>
  98. </div>
  99. <div class="container-fluid">
  100. <div class="row">
  101. <!--add-->
  102. <div class="col-md-12">
  103. <table class="table table-bordered table-hover">
  104. <thead id="langTableHead"></thead>
  105. <tbody id="langTableBody"></tbody>
  106. </table>
  107. </div>
  108. </div>
  109. <div id="pagination"></div>
  110. </div>
  111. <!---->
  112. <div class="container-fluid">
  113. <div class="row">
  114. <div class="col-md-12">
  115. <div class="modal fade" id="modal-container-593541" role="dialog" aria-labelledby="myModalLabel"
  116. aria-hidden="true">
  117. <div class="modal-dialog" role="document">
  118. <div class="modal-content">
  119. <div class="modal-header">
  120. <h5 class="modal-title" id="myModalLabel">
  121. EDIT
  122. </h5>
  123. <button type="button" class="close" data-dismiss="modal">
  124. <span aria-hidden="true">×</span>
  125. </button>
  126. </div>
  127. <div class="modal-body">
  128. <div class="form-group" id="edit_model_form">
  129. <!--<label for="InputLangArea">-->
  130. <!--langArea-->
  131. <!--</label>-->
  132. <!--<input type="text" class="form-control" id="InputLangArea"/>-->
  133. </div>
  134. </div>
  135. <div class="modal-footer">
  136. <button type="button" class="btn btn-primary editRowSaveBtn"
  137. onclick="editRow(this);return false;">
  138. Save changes
  139. </button>
  140. <button type="button" class="btn btn-secondary" data-dismiss="modal">
  141. Close
  142. </button>
  143. </div>
  144. </div>
  145. </div>
  146. </div>
  147. </div>
  148. </div>
  149. </div>
  150. <!---->
  151. </section>
  152. <section class="tab-item-2">
  153. <div class="container-fluid">
  154. <div class="row">
  155. <div class="col-md-12">
  156. </div>
  157. </div>
  158. </div>
  159. </section>
  160. </div>
  161. </div>
  162. <script type="text/javascript">
  163. var orderByupdate = 0
  164. var page = 1
  165. var line = 10
  166. var initData
  167. var IndexFlat = 0
  168. $(function () {
  169. toastr.options = {
  170. "closeButton": true,
  171. "debug": false,
  172. "newestOnTop": false,
  173. "progressBar": true,
  174. "positionClass": "toast-top-right",
  175. "preventDuplicates": false,
  176. "onclick": null,
  177. "showDuration": "300",
  178. "hideDuration": "500",
  179. "timeOut": "5000",
  180. "extendedTimeOut": "1000",
  181. "showEasing": "swing",
  182. "hideEasing": "linear",
  183. "showMethod": "fadeIn",
  184. "hideMethod": "fadeOut"
  185. }
  186. var page = GetUrlParam('page')
  187. if (!page) {
  188. page = 1
  189. }
  190. let post_data = {
  191. 'token': $.cookie('access_token'),
  192. 'page': page,
  193. 'line': line,
  194. 'orderByupdate': orderByupdate
  195. };
  196. InitIndex(post_data)
  197. });
  198. function orderByUpdateTimeFunc(status) {
  199. if (status === 1) {
  200. orderByupdate = 0
  201. } else {
  202. orderByupdate = 1
  203. }
  204. var page = GetUrlParam('page')
  205. if (!page) {
  206. page = 1
  207. }
  208. let post_data = {
  209. 'token': $.cookie('access_token'),
  210. 'page': page,
  211. 'line': 10,
  212. 'orderByupdate': orderByupdate,
  213. };
  214. InitIndex(post_data)
  215. }
  216. function InitIndex(post_data) {
  217. $.postJSON(
  218. http_ip_prot + 'langWord/query', JSON.stringify(post_data),
  219. function (data) {
  220. if (data['code'] == 0) {
  221. // console.log(data['res'])
  222. console.log(data)
  223. addTable(data['res'])
  224. let count_page = Math.ceil(data['res']['count'] / line)
  225. $('#pagination').pagination({
  226. pages: count_page, //总页数
  227. // pages: 10000, //总页数
  228. edges: 2,
  229. cssStyle: 'pagination', //按纽大小pagination-lg或写入自定义css
  230. displayedPages: 5, //显示几个
  231. currentPage: GetUrlParam('page'),
  232. onPageClick: function (pageNumber, event) {
  233. //点击时调用
  234. // alert(pageNumber);
  235. queryData(pageNumber)
  236. },
  237. onInit: function (getid) {
  238. //刷新时或初始化调用
  239. // alert(getid);
  240. }
  241. });
  242. } else {
  243. window.location.href = "http://" + domain + ":7724/web/login.html";
  244. alert(data['msg'])
  245. }
  246. }
  247. );
  248. $.postJSON(
  249. http_ip_prot + 'user/init', JSON.stringify(post_data),
  250. function (data) {
  251. if (data['code'] == 0) {
  252. console.log('initData__start')
  253. console.log(data)
  254. console.log('initData__end')
  255. initData = data['res']
  256. } else {
  257. window.location.href = "http://" + domain + ":7724/web/login.html";
  258. alert(data['msg'])
  259. }
  260. }
  261. );
  262. }
  263. let la_list
  264. let lw_data
  265. function queryData(page) {
  266. let searchKey = $('input[name="optionsRadios"]:checked').val();
  267. let searchVal = $('#searchInput').val()
  268. var post_data = {}
  269. if (searchVal) {
  270. post_data = {
  271. 'token': $.cookie('access_token'),
  272. 'page': page,
  273. 'line': 10,
  274. 'orderByupdate': orderByupdate,
  275. 'searchKey': searchKey,
  276. 'searchVal': searchVal
  277. };
  278. } else {
  279. post_data = {
  280. 'token': $.cookie('access_token'),
  281. 'page': page,
  282. 'line': 10,
  283. 'orderByupdate': orderByupdate
  284. };
  285. }
  286. $.postJSON(
  287. http_ip_prot + 'langWord/query', JSON.stringify(post_data),
  288. function (data) {
  289. if (data['code'] == 0) {
  290. // console.log(data['res'])
  291. console.log(data)
  292. addTable(data['res'])
  293. } else {
  294. alert(data['msg'])
  295. }
  296. }
  297. );
  298. }
  299. function addTable(data) {
  300. //头部多区域语言
  301. let head_data = data['la_list'];
  302. la_list = head_data
  303. // body部详细语言
  304. let body_data = data['lw_dict'];
  305. lw_data = body_data
  306. let head_html = '<tr><th width="180px"><a href="javascript:void(0);" onclick="addRow()">add</a></th><th>key</th>';
  307. let search_tab = '<label><input type="radio" name="optionsRadios" value="key" checked>key</label>'
  308. //头部标签添加
  309. $.each(head_data.reverse(), function (idx, obj) {
  310. head_html += ('<th>' + obj['lang'] + '</th>')
  311. search_tab += '&nbsp;&nbsp;&nbsp;<label><input type="radio" name="optionsRadios" value="' + obj['lang'] + '">' + obj['lang'] + '</label>'
  312. });
  313. 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>');
  314. // search_tab += '<td width="180px"><button class="btn-primary btn">搜索</button></td></tr>';
  315. if (IndexFlat == 0) {
  316. $('#searchCheckBox').html(search_tab)
  317. IndexFlat = 1
  318. }
  319. let body_html = '';
  320. console.log('--------');
  321. $.each(body_data, function (idx, obj) {
  322. let edit_btn = '<a href="javascript:void(0);" title="Edit" onclick="editFunc(this)"><i class="fa fa-edit"></i></a>';
  323. let del_btn = '<a href="javascript:void(0);" title="Delete" onclick="deleteFunc(this)"><i class="fa fa-ban"></i></a>';
  324. // let del_btn = '';
  325. if(obj['status'] == 1){
  326. body_html += '<tr style="background: red; color: white"><td>' + edit_btn + '&nbsp;&nbsp;&nbsp;' + del_btn + '</td>';
  327. }else if(obj['status'] == 2){
  328. body_html += '<tr style="background: blue; color: white"><td>' + edit_btn + '&nbsp;&nbsp;&nbsp;' + del_btn + '</td>';
  329. }else{
  330. body_html += '<tr><td>' + edit_btn + '&nbsp;&nbsp;&nbsp;' + del_btn + '</td>';
  331. }
  332. body_html += ('<td id="key">' + idx + '</td>');
  333. $.each(la_list, function (x, y) {
  334. if (obj[y['lang']]) {
  335. body_html += ('<td>' + obj[y['lang']] + '</td>')
  336. } else {
  337. body_html += ('<td></td>')
  338. }
  339. });
  340. let updTime = $.DateChange.UnixToDate(obj['updTime'], true, 8);
  341. body_html += ('<td>' + updTime + '<span class="arrow dsc"></td></tr>');
  342. });
  343. $('#langTableHead').empty().html(head_html);
  344. $('#langTableBody').empty().html(body_html);
  345. addDelFunc()
  346. }
  347. function addRow() {
  348. let save_btn = '<a href="javascript:void(0);" title="Save" class="save_row"><i class="fa fa-check-circle-o"></i></a>';
  349. let del_btn = '<a href="javascript:void(0);" title="Delete" class="del_row"><i class="fa fa-ban"></i></a>';
  350. 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>'
  351. $.each(la_list, function (idx, obj) {
  352. // console.log(idx)
  353. // newRow += ('<td>' + obj['id'] + '</td>')
  354. newRow += ('<td>' +
  355. '<input class="form-control" type="text" langID="' + obj['id'] + '" id="newRow_lang_' + obj['id'] + '">' +
  356. '</td>')
  357. })
  358. newRow += '<td></td></tr>'
  359. $('#langTableBody').prepend(newRow)
  360. addDelFunc()
  361. addSaveFunc()
  362. }
  363. function addDelFunc() {
  364. $(".del_row").bind("click", function () {
  365. let trRow = $(this).parent().parent()
  366. trRow.remove()
  367. });
  368. }
  369. function addSaveFunc() {
  370. $(".save_row").bind("click", function () {
  371. let post_data = {
  372. 'token': $.cookie('access_token')
  373. }
  374. let post_list = []
  375. let trRow = $(this).parent().parent()
  376. trRow.find('input').each(function () {
  377. // console.log($(this).attr('id'))
  378. // console.log($(this).attr('langID'))
  379. let inputVal = $(this).val()
  380. let langID = $(this).attr('langID')
  381. if (langID === 'key') {
  382. post_data['word_key'] = inputVal
  383. } else {
  384. post_list.push({'la_id': langID, 'val': inputVal})
  385. }
  386. })
  387. post_data['word_arr'] = post_list
  388. console.log(post_data)
  389. $.postJSON(
  390. http_ip_prot + 'langWord/add', JSON.stringify(post_data),
  391. function (data) {
  392. if (data['code'] == 0) {
  393. // console.log(data['res'])
  394. window.location.reload();
  395. console.log(data)
  396. } else {
  397. alert(data['msg'])
  398. }
  399. }
  400. )
  401. })
  402. }
  403. // 编辑模态框
  404. function editFunc($this) {
  405. let langKey = $($this).parent().parent().children().eq(1).text()
  406. $('#modal-container-593541').modal('show')
  407. let user_perm = initData['user_perm']
  408. console.log(initData)
  409. // let post_data = {'token': $.cookie('access_token')};
  410. 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 + '"> '
  411. $.each(la_list, function (idx, obj) {
  412. let lang_perm_ls = initData['lang_perm_ls']
  413. let check_perm_flag = $.inArray(obj['lang'], lang_perm_ls)
  414. if (check_perm_flag >= 0) {
  415. var inputAttr = ''
  416. } else {
  417. var inputAttr = 'disabled="disabled"'
  418. }
  419. //console.log(obj);
  420. html_per += ('<label for="InputLangArea">' + obj['lang'] + ':</label>' +
  421. '<textarea type="text" ' + inputAttr + ' class="form-control disabled" lang="' + obj['lang'] + '">' + (lw_data[langKey][obj['lang']] ? lw_data[langKey][obj['lang']] : '') + '</textarea>')
  422. //html_per += ('<label for="InputLangArea">' + obj['lang'] + ':</label>' +
  423. // '<input type="text" ' + inputAttr + ' class="form-control disabled" lang="' + obj['lang'] + '" value="' + (lw_data[langKey][obj['lang']] ? lw_data[langKey][obj['lang']] : '') + '"/>')
  424. });
  425. // console.log(html_per)
  426. $('#edit_model_form').html(html_per)
  427. }
  428. function deleteFunc($this) {
  429. let langKey = $($this).parent().parent().children().eq(1).text()
  430. var r = confirm("Press a button")
  431. if (r) {
  432. let post_data = {
  433. 'token': $.cookie('access_token'),
  434. 'word_key': langKey
  435. }
  436. console.log(post_data)
  437. $.postJSON(
  438. http_ip_prot + 'langWord/delete', JSON.stringify(post_data),
  439. function (data) {
  440. if (data['code'] == 0) {
  441. // console.log(data['res'])
  442. console.log(data);
  443. alert(data['msg']);
  444. window.location.reload();
  445. } else {
  446. alert(data['msg'])
  447. }
  448. }
  449. )
  450. }
  451. }
  452. /*post_data = {
  453. word_key_id:1,
  454. word_key:xxx,
  455. word_arr:[
  456. {'lang':'','val':''},
  457. {'lang':'','val':''},
  458. {'lang':'','val':''}
  459. ]
  460. }*/
  461. function editRow() {
  462. let post_data = {}
  463. post_data['token'] = $.cookie('access_token')
  464. post_data['word_key'] = $('#lang_key_edit').val()
  465. post_data['old_word_key'] = $('#lang_key_edit').attr('oldkey')
  466. post_data['word_arr'] = {}
  467. post_data['status'] = 2
  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. function onReset() {
  556. let role = $.cookie('role');
  557. if(role == 1){
  558. if(!confirm("如果你重置了语言状态,别的翻译者将无法查看到语言的相应状态!")){
  559. return;
  560. }
  561. }
  562. let post_data = {}
  563. var word_key = '';
  564. let table = $('#langTableBody').find('tr').each(function () {
  565. var value = $(this).find('td:eq(1)').text();
  566. word_key += value;
  567. word_key += ',';
  568. })
  569. word_key = word_key.substr(0, word_key.length - 1);
  570. post_data['word_key'] = word_key;
  571. post_data['token'] = $.cookie('access_token');
  572. $.postJSON(
  573. http_ip_prot + 'langWord/reset', JSON.stringify(post_data),
  574. function (data) {
  575. if (data['code'] == 0) {
  576. // console.log(data['res'])
  577. console.log(data)
  578. toastr["success"](data['msg'])
  579. IndexTable()
  580. //window.location.reload();
  581. } else {
  582. alert(data['msg'])
  583. }
  584. }
  585. )
  586. }
  587. </script>
  588. </body>
  589. </html>