creatCheckTask.js 24 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667
  1. const $ = require('jquery');
  2. require("../css/creatCheckTask.less");
  3. require('./modal.js');
  4. const { api, ywCheckApi } = require('./api.js')
  5. const { post, getCookie, emptyBox, listenScroll, getScoreTabList } = require('./utils.js')
  6. require('./../resource/jquery-ui/jquery-ui.min.js');
  7. require('./../resource/jquery-ui/jquery-ui.min.css');
  8. const iconCheck = require("./../images/icon_check.png")
  9. const iconUnCheck = require("./../images/icon_unchecked.png")
  10. const iconDisCheck = require("./../images/icon_dis.png")
  11. const iconCalenBlue = require("./../images/icon_calen_blue.png")
  12. const iconCalenGrey = require("./../images/icon_calen_grey.png")
  13. const iconDown = require("./../images/arrow_down.png")
  14. const iconUp = require("./../images/arrow_up.png")
  15. const loadingImg = require("./../images/loading.gif")
  16. const arrowLeft = require("./../images/arrow_left.png")
  17. const arrowRight = require("./../images/arrow_right.png")
  18. listenScroll()
  19. let tabList = [], global_level = "", global_status = "0",
  20. global_deptId = [], global_deptName = "", global_score = '',
  21. data_desc = ["leaveHospitalDate"], data_asc = [], global_taskList = [], global_delOrAdd = 1;//1生成0取消
  22. let global_activeTabCode = '0'; //激活的tab code
  23. let isPlacefile = getCookie('isPlacefile') || 1
  24. $(function () {
  25. $(window.parent.document).find(".modaltip").hide();//切换页面过快时toast隐藏
  26. const checkAuth = getCookie('checkAuth');
  27. /*if(!checkAuth){
  28. $(".tabs").hide();
  29. toast("没有质控核查权限!");
  30. return
  31. }*/
  32. const tabs = checkAuth.replace(/[^456]/g, '');
  33. if (tabs.length === 0) {
  34. //$(".tabs").hide();
  35. toast("没有质控核查权限!");
  36. return;
  37. } else if (tabs.length > 1) {
  38. //多于一个权限,显示tab切换
  39. $(".tabs").show();
  40. const last = "456".replace(tabs, '');
  41. $(".tabs [data-code=" + (last - 4) + "]").parent().hide();
  42. }
  43. global_activeTabCode = tabs.substr(0, 1) - 4;
  44. //获取科室列表
  45. if (global_activeTabCode == "0") {
  46. getSubDeptList();
  47. } else {
  48. getDeptList();
  49. }
  50. $(".tabs [data-code=" + global_activeTabCode + "]").addClass("active");
  51. $('.datapickerBox').append(`<img class="iconCalen" src=${iconCalenGrey} />`)
  52. $('.iconCalen').on("mouseenter", function (e) {
  53. $(this).attr("src", iconCalenBlue)
  54. })
  55. $('.iconCalen').on("mouseleave", function (e) {
  56. $(this).attr("src", iconCalenGrey)
  57. })
  58. $('.iconCalen').on("click", function (e) {
  59. $(this).parent().find("input").focus()
  60. })
  61. $(".menu .page", parent.document).removeClass("active")
  62. $(parent.document).find(".menu .page[code=YH-ZKHC-SCHCRW]").addClass("active")
  63. $(".filter").on("click", function (e) {
  64. global_taskList = [];
  65. const isCreated = (global_status == "1");
  66. const text = isCreated ? '取消' : '生成';
  67. $(".modal-body p").text("确定要" + text + "这些任务吗?");
  68. $("th[code]").removeClass("asc desc");
  69. if (isCreated) {
  70. $(".creatTask").addClass("disabled");
  71. $(".cancelTask").removeClass("disabled");
  72. } else {
  73. $(".creatTask").removeClass("disabled");
  74. $(".cancelTask").addClass("disabled");
  75. }
  76. //已生成筛选时按生成日期倒序筛选
  77. if (isCreated) {
  78. global_delOrAdd = 0;
  79. data_desc = ["jobCreateTime"];
  80. $("th[code=jobCreateTime]").addClass("desc");
  81. $("th[code=leaveHospitalDate]").removeClass("desc");
  82. } else {
  83. global_delOrAdd = 1;
  84. data_desc = ["leaveHospitalDate"];
  85. $("th[code=leaveHospitalDate]").addClass("desc");
  86. $("th[code=jobCreateTime]").removeClass("desc");
  87. }
  88. getTabData(1)
  89. })
  90. $(".abnormalClear").on("click", function (e) {
  91. clearFilter();
  92. getTabData(1)
  93. })
  94. //切换tab
  95. $(".tabBox .tabs button").on("click", (e) => {
  96. const me = e.target;
  97. $('.selectDept i').text('全部')
  98. $(".deptItem.active").removeClass("active");
  99. $(".deptList").css("display", "none")
  100. global_deptId = [];
  101. global_deptName = "";
  102. global_activeTabCode = $(me).attr("data-code");
  103. if (global_activeTabCode == "0") {
  104. getSubDeptList();
  105. } else {
  106. getDeptList();
  107. }
  108. $(".tabBox .tabs button").removeClass("active");
  109. $(me).addClass("active");
  110. //更新列表并重置筛选条件
  111. $(".filter").click();
  112. });
  113. //选择生成状态
  114. $('.selectStatus').on("click", function (e) {
  115. e.stopPropagation()
  116. const showList = $(".statusList ").css("display")
  117. if (showList == "none" || !showList) {
  118. $(".levelList ").css("display", "none")
  119. $(".deptList ").css("display", "none")
  120. $(".scoreList ").css("display", "none")
  121. $(".statusList ").css("display", "block")
  122. } else {
  123. $(".statusList ").css("display", "none")
  124. }
  125. })
  126. //选择病历等级
  127. $('.selectLevel').on("click", function (e) {
  128. e.stopPropagation()
  129. $(".deptList ").css("display", "none")
  130. const showList = $(".levelList ").css("display")
  131. if (showList == "none" || !showList) {
  132. $(".deptList ").css("display", "none")
  133. $(".statusList ").css("display", "none")
  134. $(".scoreList ").css("display", "none")
  135. $(".levelList ").css("display", "block")
  136. } else {
  137. $(".levelList ").css("display", "none")
  138. }
  139. })
  140. //科室选择
  141. $('.selectDept').on("click", function (e) {
  142. e.stopPropagation();
  143. $(".levelList ").css("display", "none")
  144. $(".statusList ").css("display", "none")
  145. $(".scoreList ").css("display", "none")
  146. $(".deptList ").css("display", "block")
  147. })
  148. //筛选分值选择
  149. $('.selectScore').on("click", function (e) {
  150. e.stopPropagation();
  151. $(".levelList ").css("display", "none")
  152. $(".deptList ").css("display", "none")
  153. $(".statusList ").css("display", "none")
  154. $(".scoreList ").css("display", "block")
  155. })
  156. $(".creatTask,.cancelTask").click(function () {
  157. if ($(this).is(".disabled")) {
  158. return;
  159. }
  160. if (!global_taskList.join("").length) {
  161. toast("至少勾选一个任务");
  162. return;
  163. }
  164. $(".modal-container").show();
  165. });
  166. $(".modal-container .confirm").click(function () {
  167. creatTask(global_delOrAdd)
  168. });
  169. $(".modal-container .cancel,.modal-container .close").click(function () {
  170. /*if(global_delOrAdd==0){
  171. global_taskList=[];
  172. }*/
  173. $(".modal-container").hide();
  174. })
  175. //出院日期初始化
  176. $.datepicker.regional['zh-CN'] = {
  177. clearText: '清除',
  178. clearStatus: '清除已选日期',
  179. closeText: '关闭',
  180. closeStatus: '不改变当前选择',
  181. prevText: '<上月',
  182. prevStatus: '显示上月',
  183. prevBigText: '<<',
  184. prevBigStatus: '显示上一年',
  185. nextText: '下月>',
  186. nextStatus: '显示下月',
  187. nextBigText: '>>',
  188. nextBigStatus: '显示下一年',
  189. currentText: '今天',
  190. currentStatus: '显示本月',
  191. monthNames: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
  192. monthNamesShort: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
  193. yearNamesShort: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'],
  194. monthStatus: '选择月份',
  195. yearStatus: '选择年份',
  196. weekHeader: '周',
  197. weekStatus: '年内周次',
  198. dayNames: ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'],
  199. dayNamesShort: ['周日', '周一', '周二', '周三', '周四', '周五', '周六'],
  200. dayNamesMin: ['日', '一', '二', '三', '四', '五', '六'],
  201. dayStatus: '设置 DD 为一周起始',
  202. dateStatus: '选择 m月 d日, DD',
  203. dateFormat: 'yy-mm-dd',
  204. firstDay: 1,
  205. initStatus: '请选择日期',
  206. isRTL: false
  207. };
  208. const days = new Date().getDate() - 1;
  209. let startDate = "-" + days + "d", endDate = new Date();
  210. $.datepicker.setDefaults($.datepicker.regional['zh-CN']);
  211. $("#datepicker").datepicker({
  212. changeMonth: true,
  213. changeYear: true,
  214. dateFormat: "yy-mm-dd",
  215. }).datepicker("setDate", startDate);
  216. $("#datepicker2").datepicker({
  217. changeMonth: true,
  218. changeYear: true,
  219. dateFormat: "yy-mm-dd"
  220. }).datepicker("setDate", endDate);
  221. getScoreTabList((data) => { rendeScoreList(data) })
  222. //获取列表数据
  223. getTabData(1)
  224. //状态选择
  225. bindStatusSelect()
  226. //等级选择
  227. bindLeveldSelect()
  228. //关闭下拉
  229. $(document).on("click", function () {
  230. $(".levelList ").css("display", "none")
  231. $(".deptList ").css("display", "none")
  232. $(".statusList ").css("display", "none")
  233. $(".scoreList ").css("display", "none")
  234. })
  235. });
  236. //判断有无某一权限
  237. function hasData(data) {
  238. let trdObj = JSON.parse(getCookie("trdObj"))
  239. let lis = trdObj['YH-ZKHC-SCRW']
  240. if (!lis) {
  241. return false
  242. }
  243. if (lis.indexOf(data) > -1) {//有权限
  244. return true
  245. }
  246. return false;
  247. }
  248. function rendeScoreList(list) {
  249. if (list.length == 0) {
  250. $('.scoreList').html("")
  251. return
  252. }
  253. let str = `<li class="scoreItem ellipsis" data-id=" " data-name="全部">全部</li>`;
  254. for (let i = 0; i < list.length; i++) {
  255. str += `<li class="scoreItem ellipsis" data-id=${list[i]} data-name=${list[i]}> ${list[i]}</li>`
  256. }
  257. $('.scoreList').html(str)
  258. bindScoreSelect()
  259. }
  260. function bindScoreSelect() {
  261. $('.scoreItem').on("click", function () {
  262. const scoreItemName = $(this).attr("data-name")
  263. const scoreItemItemId = $(this).attr("data-id")
  264. global_score = scoreItemItemId;
  265. $('.selectScore i').html(scoreItemName)
  266. $(".scoreList").css("display", "none")
  267. })
  268. }
  269. //排序事件
  270. function bindOrder() {
  271. $("th[code]").off("click").on("click", function (e) {
  272. const code = $(this).attr("code");
  273. console.log(code);
  274. if (data_asc[0] === code) {
  275. data_desc = [code];
  276. data_asc = [];
  277. if (code == 'birthday') {
  278. $("th[code]").removeClass("asc desc");
  279. $(this).addClass("asc");
  280. } else {
  281. $("th[code]").removeClass("asc desc");
  282. $(this).addClass("desc");
  283. }
  284. } else {
  285. data_desc = [];
  286. data_asc = [code];
  287. if (code == 'birthday') {
  288. $("th[code]").removeClass("asc desc");
  289. $(this).addClass("desc");
  290. } else {
  291. $("th[code]").removeClass("asc desc");
  292. $(this).addClass("asc");
  293. }
  294. }
  295. getTabData(1);
  296. });
  297. }
  298. function bindCancelTaskEvent() {
  299. $(".taskCancel").unbind("click").click(function () {
  300. global_delOrAdd = 0;
  301. global_taskList = [$(this).attr("code")];
  302. $(".modal-container .modal-body p").text("确定要取消该任务吗?");
  303. $(".modal-container").show();
  304. });
  305. }
  306. //生成任务
  307. function creatTask() {
  308. const param = {
  309. behospitalCodeList: global_taskList,
  310. jobType: global_activeTabCode,
  311. checkStatus: global_delOrAdd,
  312. };
  313. post(ywCheckApi.addCheck, param).then(res => {
  314. if (res.data.code == '0') {
  315. global_taskList = [];
  316. $(".modal-container").hide();
  317. toast("操作成功!");
  318. getTabData(1)
  319. } else {
  320. toast(res.data.msg);
  321. }
  322. }).catch((e) => {
  323. })
  324. }
  325. function getTabData(activePage) {
  326. const filterData = getFilterData();
  327. const { smallDay, bigDay, startDate, endDate } = filterData;
  328. if (+smallDay > +bigDay) {
  329. toast("住院天数区间有误~");
  330. return;
  331. }
  332. if (new Date(startDate).getTime() > new Date(endDate).getTime()) {
  333. toast("出院日期开始时间不能大于结束时间~");
  334. return;
  335. }
  336. const param = {
  337. jobType: global_activeTabCode, //科室/质控科/院级
  338. creatStatus: global_status,
  339. current: activePage,
  340. hospitalId: '',
  341. level: global_level,//病历等级
  342. values: global_score.trim() ? [global_score] : [],
  343. department: global_deptId,
  344. asc: data_asc, //升序
  345. desc: data_desc, //降序
  346. size: 15,
  347. ...filterData,
  348. startDate: filterData.startDate + " 00:00:00",
  349. endDate: filterData.endDate + " 23:59:59",
  350. }
  351. $('.pagination').html("")
  352. $('.tbody').html(emptyBox('努力加载中...', '', 17))
  353. return post(ywCheckApi.getTaskList, param).then(res => {
  354. if (res.data.code == '0') {
  355. const data = res.data.data;
  356. tabList = data.records;
  357. const totalPage = data.pages;
  358. const totalNum = data.total;
  359. renderTab(tabList, data.hospitalId);
  360. renderPagination(totalPage, Number(activePage), totalNum)
  361. if (totalPage > 0) {
  362. renderPagination(totalPage, Number(activePage), totalNum)
  363. } else {
  364. $('.pagination').html("")
  365. }
  366. } else {
  367. toast(res.data.msg);
  368. }
  369. }).catch((e) => {
  370. })
  371. }
  372. function toast(msg) {
  373. $.alerModal({ "message": msg, type: "tip", time: '1000', isFather: true, fatherWrapper: $("#mainBox", parent.document) });
  374. }
  375. function renderTab(data) {
  376. let str = ``, code = "";
  377. let hasSelectAll = true;
  378. if (data.length === 0) {
  379. $('.tbody').html(emptyBox(null, 17))
  380. // initScroll("qcList","YX",1)
  381. return;
  382. }
  383. const titles = $(".tabTitle th[code]");
  384. for (let i = 0; i < data.length; i++) {
  385. const item = data[i]
  386. str += `
  387. <tr data-index=${i}>
  388. <td class="operaItem taskCheck textCenter"><img code="${item.behospitalCode}" src="${iconUnCheck}" alt=""></td>`;
  389. for (let i = 0; i < titles.length; i++) {
  390. code = $(titles[i]).attr('code');
  391. str += `<td class="textCenter"><span data-index=${i}>${item[code] || "-"}<span></td>`
  392. }
  393. str += `<td class="operaItem textCenter ${(item.creatStatus == '已生成' && item.delFlag) ? 'taskCancel' : 'disable'}" code="${item.behospitalCode}">取消</td></tr>`
  394. }
  395. if (data.length === 0) {
  396. hasSelectAll = false
  397. }
  398. if (hasSelectAll) {
  399. $('.scoreOpera img').attr("src", iconCheck)
  400. $('.scoreOpera').attr("data-selectall", true)
  401. } else {
  402. $('.scoreOpera img').attr("src", iconUnCheck)
  403. $('.scoreOpera').attr("data-selectall", false)
  404. }
  405. $('.tbody').html(str)
  406. $(".allCheck img").attr("src", iconUnCheck); //全选改为可用状态
  407. bindOrder();
  408. bindTaskCheckEvent();
  409. bindCancelTaskEvent();
  410. }
  411. function bindTaskCheckEvent() {
  412. $(".taskCheck img").unbind("click").click(function () {
  413. const code = $(this).attr("code");
  414. if ($(this).is(".active")) {
  415. let str = global_taskList.join(",") + ",";
  416. str = str.replace(code + ",", "").replace(/^,|,$/, '');
  417. global_taskList = str.split(",");
  418. $(".allCheck img").attr('src', iconUnCheck).removeClass("active");
  419. $(this).attr('src', iconUnCheck).removeClass("active");
  420. } else {
  421. global_taskList.push(code);
  422. $(this).attr('src', iconCheck).addClass("active");
  423. }
  424. });
  425. //全选
  426. $(".allCheck img").unbind("click").click(function () {
  427. const checks = $(".taskCheck img");
  428. if ($(this).is(".active")) {
  429. $(this).attr("src", iconUnCheck).removeClass("active");
  430. checks.attr("src", iconUnCheck).removeClass("active");
  431. global_taskList = [];
  432. } else {
  433. $(this).attr("src", iconCheck).addClass("active");
  434. checks.attr("src", iconCheck).addClass("active");
  435. let codes = [];
  436. checks.map((i) => {
  437. codes.push($(checks[i]).attr("code"));
  438. });
  439. global_taskList = codes;
  440. }
  441. console.log(global_taskList)
  442. });
  443. }
  444. //列表获取筛选值
  445. function getFilterData() {
  446. const obj = {};
  447. $(".filterBox input[code]").map((i, it) => {
  448. obj[$(it).attr("code")] = $(it).val()
  449. })
  450. return obj;
  451. }
  452. //生成状态选择
  453. function bindStatusSelect() {
  454. $('.statusItem').on("click", function () {
  455. const statusItemName = $(this).attr("data-name")
  456. global_status = $(this).attr("data-id")
  457. $('.selectStatus i').html(statusItemName)
  458. $(".statusList").css("display", "none")
  459. $('.selectStatus').removeClass('unSelect')
  460. })
  461. }
  462. //病历等级选择
  463. function bindLeveldSelect() {
  464. $('.levelItem').on("click", function () {
  465. const levelItemName = $(this).attr("data-name")
  466. const levelItemItemId = $(this).attr("data-id")
  467. global_level = levelItemItemId
  468. $('.selectLevel i').html(levelItemName)
  469. $(".levelList").css("display", "none")
  470. //$(".selectLevel").append(`<img class="arrow" src=${iconDown} alt="下拉">`)
  471. })
  472. }
  473. //获取科室任务对应的列表
  474. function getSubDeptList() {
  475. post(api.getDept, {}).then(res => {
  476. if (res.data.code == '0') {
  477. const deptList = res.data.data || []
  478. rendeDeptList(deptList)
  479. } else { rendeDeptList([]) }
  480. }).catch((e) => {
  481. })
  482. }
  483. //科室列表
  484. function getDeptList() {
  485. post(api.getDeptList, {}).then(res => {
  486. if (res.data.code == '0') {
  487. const deptList = res.data.data || []
  488. rendeDeptList(deptList)
  489. } else { rendeDeptList([]) }
  490. }).catch((e) => {
  491. })
  492. }
  493. function rendeDeptList(deptList) {
  494. if (deptList.length == 0) {
  495. $('.deptList').html("")
  496. return
  497. }
  498. let str = `<li class="deptItem ellipsis" data-id=" " data-name="全部">全部</li>`;
  499. for (let i = 0; i < deptList.length; i++) {
  500. str += `<li class="deptItem ellipsis" title=${deptList[i].deptName} data-id=${deptList[i].deptId} data-name=${deptList[i].deptName}> ${deptList[i].deptName}</li>`
  501. }
  502. $('.deptList').html(str)
  503. bindDeptSelect()
  504. }
  505. //科室选择
  506. function bindDeptSelect() {
  507. $('.deptItem').on("click", function (e) {
  508. e.stopPropagation();
  509. const deptItemName = $(this).attr("data-name");
  510. let str = global_deptId.join(",") + ",";
  511. const code = $(this).attr("data-id")
  512. if (!code.trim()) {
  513. $(".deptItem").removeClass("active");
  514. global_deptId = [];
  515. global_deptName = "";
  516. $('.selectDept i').text('全部')
  517. $('.selectDept').attr('title', '全部')
  518. return;
  519. }
  520. if ($(this).is(".active")) {
  521. global_deptName = global_deptName.replace(deptItemName + ",", '');
  522. str = str.replace(code + ",", "").replace(/^,|,$/, '');
  523. global_deptId = str.split(",");
  524. } else {
  525. global_deptName = global_deptName + deptItemName + ",";
  526. global_deptId.push(code);
  527. }
  528. $(this).toggleClass("active");
  529. const name = global_deptName.replace(/,$/, '');
  530. $('.selectDept i').text(name)
  531. $('.selectDept').attr('title', name)
  532. })
  533. }
  534. function loading() {
  535. const str = `
  536. <div class="loadingBox">
  537. <div class="mask"></div>
  538. <img class="loadingImg" src=${loadingImg} alt="loading" />
  539. </div>
  540. `
  541. $("#mainBox", parent.document).append(str)
  542. }
  543. function hideLoading() {
  544. $("#mainBox .loadingBox", parent.document).remove()
  545. }
  546. function clearFilter() {
  547. const days = new Date().getDate() - 1;
  548. let startDate = "-" + days + "d", endDate = new Date();
  549. $(".creatTask").removeClass("disabled");
  550. $(".cancelTask").addClass("disabled");
  551. $(".filterBox input").val("");
  552. data_desc = ["leaveHospitalDate"];
  553. //默认日期为本月
  554. $("#datepicker").datepicker({
  555. changeMonth: true,
  556. changeYear: true,
  557. dateFormat: "yy-mm-dd",
  558. }).datepicker("setDate", startDate);
  559. $("#datepicker2").datepicker({
  560. changeMonth: true,
  561. changeYear: true,
  562. dateFormat: "yy-mm-dd"
  563. }).datepicker("setDate", endDate);
  564. $('.selectDept i').text('全部')
  565. $(".deptItem.active").removeClass("active");
  566. $(".deptList").css("display", "none")
  567. global_deptId = [];
  568. global_deptName = "";
  569. $('.selectLevel i').html('全部')
  570. $(".levelList").css("display", "none")
  571. global_level = "";
  572. $('.selectStatus i').html('未生成')
  573. $(".statusList").css("display", "none")
  574. $('.selectScore i').html('全部')
  575. $(".scoreList").css("display", "none")
  576. global_score = '';
  577. global_status = '0'
  578. $("th[code]").removeClass("asc desc")
  579. }
  580. //分页渲染
  581. function renderPagination(totalPage, activePage, totalNum) {
  582. let str = `<span class="totalSum">共${totalPage}页/${totalNum}条数据</span><span class="prePage"><img class="arrowPage" src=${arrowLeft} /></span>`
  583. if (totalPage <= 6) {
  584. for (let i = 1; i <= totalPage; i++) {
  585. str += `<span class="pageNum ${'page' + i}" data-page=${i}>${i}</span>`
  586. }
  587. } else {
  588. if (activePage <= 3) { //选中页数小于4
  589. for (let i = 1; i <= 4; i++) {
  590. str += `<span class="pageNum ${'page' + i}" data-page=${i}>${i}</span>`
  591. }
  592. str += `<span class="more" >...</span>`
  593. str += `<span class="pageNum ${'page' + totalPage}" data-page=${totalPage}>${totalPage}</span>`
  594. } else if (activePage > totalPage - 3) {
  595. str += `<span class="pageNum page1" data-page=1>1</span>`
  596. str += `<span class="more" >...</span>`
  597. str += `<span class="pageNum ${'page' + (totalPage - 3)}" data-page=${totalPage - 3}>${totalPage - 3}</span>`
  598. str += `<span class="pageNum ${'page' + (totalPage - 2)}" data-page=${totalPage - 2}>${totalPage - 2}</span>`
  599. str += `<span class="pageNum ${'page' + (totalPage - 1)}" data-page=${totalPage - 1}>${totalPage - 1}</span>`
  600. str += `<span class="pageNum ${'page' + totalPage}" data-page=${totalPage}>${totalPage}</span>`
  601. } else {
  602. str += `<span class="pageNum page1" data-page=1>1</span>`
  603. str += `<span class="more" >...</span>`
  604. str += `<span class="pageNum ${'page' + (activePage - 1)}" data-page=${activePage - 1}>${activePage - 1}</span>`
  605. str += `<span class="pageNum ${'page' + activePage}" data-page=${activePage}>${activePage}</span>`
  606. str += `<span class="pageNum ${'page' + (activePage + 1)}" data-page=${activePage + 1}>${activePage + 1}</span>`
  607. str += `<span class="more" >...</span>`
  608. str += `<span class="pageNum ${'page' + totalPage}" data-page=${totalPage}>${totalPage}</span>`
  609. }
  610. }
  611. str += `<span class="nextPage"><img class="arrowPage" src=${arrowRight} /></span>`
  612. $('.pagination').html(str)
  613. $('.page' + activePage).addClass('activePage')
  614. $(".pageNum").on("click", function (e) {
  615. const activePageNow = Number($(this).attr('data-page'))
  616. getTabData(activePageNow)
  617. // renderPagination(totalPage,activePageNow,totalNum)
  618. })
  619. $(".prePage").on("click", function (e) {
  620. let activePageNow = Number($(".activePage").attr('data-page'))
  621. if (activePageNow > 1) {
  622. activePageNow--
  623. getTabData(activePageNow)
  624. // renderPagination(totalPage,activePageNow,totalNum)
  625. }
  626. })
  627. $(".nextPage").on("click", function (e) {
  628. let activePageNow = Number($(".activePage").attr('data-page'))
  629. if (activePageNow < totalPage) {
  630. activePageNow++
  631. getTabData(activePageNow)
  632. // renderPagination(totalPage,activePageNow,totalNum)
  633. }
  634. })
  635. }