allotCheckTask.js 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638
  1. const $ = require('jquery');
  2. require("../css/allotCheckTask.less");
  3. require('./modal.js');
  4. const {api,ywCheckApi} = require('./api.js')
  5. const {post,getCookie,emptyBox,listenScroll} = 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 iconRadio=require("./../images/radio.png")
  11. const iconUnRadio=require("./../images/unradio.png")
  12. const iconCalenBlue= require("./../images/icon_calen_blue.png")
  13. const iconCalenGrey= require("./../images/icon_calen_grey.png")
  14. const iconDown= require("./../images/arrow_down.png")
  15. const iconUp = require("./../images/arrow_up.png")
  16. const loadingImg = require("./../images/loading.gif")
  17. const arrowLeft= require("./../images/arrow_left.png")
  18. const arrowRight = require("./../images/arrow_right.png")
  19. listenScroll()
  20. let tabList = [], deptNameTemp="",data_desc=["leaveHospitalDate"],data_asc=[];
  21. let global_DeptCheckers = {},global_Checkers={4:[],5:[],6:[]},global_CheckerId='',global_CheckerName='',global_DeptId='',
  22. global_activeTabCode='0',global_TaskCodes=[];
  23. let isPlacefile = getCookie('isPlacefile')||1
  24. /*if(isPlacefile != 1){
  25. data_desc=["behospital_date"]
  26. }*/
  27. $(function() {
  28. const checkAuth = getCookie('checkAuth');
  29. if(!checkAuth){
  30. $(".tabs").hide();
  31. toast("没有质控核查权限!");
  32. return
  33. }
  34. const tabs = checkAuth.replace(/[^456]/g,'');
  35. if(tabs.length<2){
  36. //只有一个权限,隐藏tab切换
  37. $(".tabs").hide();
  38. }else{//隐藏没有权限的tab
  39. const last = "456".replace(tabs,'');
  40. $(".tabs [data-code="+(last-4)+"]").parent().hide();
  41. }
  42. global_activeTabCode=tabs.substr(0,1)-4;
  43. $(".tabs [data-code="+global_activeTabCode+"]").addClass("active");
  44. //初始化日期
  45. $.datepicker.regional['zh-CN'] = {
  46. clearText: '清除',
  47. clearStatus: '清除已选e799bee5baa6e59b9ee7ad9431333361303131日期',
  48. closeText: '关闭',
  49. closeStatus: '不改变当前选择',
  50. prevText: '<上月',
  51. prevStatus: '显示上月',
  52. prevBigText: '<<',
  53. prevBigStatus: '显示上一年',
  54. nextText: '下月>',
  55. nextStatus: '显示下月',
  56. nextBigText: '>>',
  57. nextBigStatus: '显示下一年',
  58. currentText: '今天',
  59. currentStatus: '显示本月',
  60. monthNames: ['一月','二月','三月','四月','五月','六月', '七月','八月','九月','十月','十一月','十二月'],
  61. monthNamesShort: ['一月','二月','三月','四月','五月','六月', '七月','八月','九月','十月','十一月','十二月'],
  62. yearNamesShort: ['一月','二月','三月','四月','五月','六月', '七月','八月','九月','十月','十一月','十二月'],
  63. monthStatus: '选择月份',
  64. yearStatus: '选择年份',
  65. weekHeader: '周',
  66. weekStatus: '年内周次',
  67. dayNames: ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],
  68. dayNamesShort: ['周日','周一','周二','周三','周四','周五','周六'],
  69. dayNamesMin: ['日','一','二','三','四','五','六'],
  70. dayStatus: '设置 DD 为一周起始',
  71. dateStatus: '选择 m月 d日, DD',
  72. dateFormat: 'yy-mm-dd',
  73. firstDay: 1,
  74. initStatus: '请选择日期',
  75. isRTL: false};
  76. $.datepicker.setDefaults($.datepicker.regional['zh-CN']);
  77. const days = new Date().getDate()-1;
  78. let startDate = "-"+days+"d",endDate=new Date();
  79. $( "#datepicker" ).datepicker({
  80. changeMonth: true,
  81. changeYear: true,
  82. dateFormat:"yy-mm-dd",
  83. }).datepicker( "setDate", startDate);
  84. $( "#datepicker2" ).datepicker({
  85. changeMonth: true,
  86. changeYear: true,
  87. dateFormat:"yy-mm-dd",
  88. }).datepicker( "setDate",endDate);
  89. /*$( "#datepicker3" ).datepicker({
  90. changeMonth: true,
  91. changeYear: true,
  92. dateFormat:"yy-mm-dd",
  93. }).datepicker( "setDate",startDate);
  94. $( "#datepicker4" ).datepicker({
  95. changeMonth: true,
  96. changeYear: true,
  97. dateFormat:"yy-mm-dd",
  98. }).datepicker( "setDate",endDate);*/
  99. $('.datapickerBox').append(`<img class="iconCalen" src=${iconCalenGrey} />`)
  100. $('.iconCalen').on("mouseenter", function(e){
  101. $(this).attr("src", iconCalenBlue)
  102. })
  103. $('.iconCalen').on("mouseleave", function(e){
  104. $(this).attr("src", iconCalenGrey)
  105. })
  106. $('.iconCalen').on("click", function(e){
  107. $(this).parent().find("input").focus()
  108. })
  109. //保存分配
  110. $(".save-btn").click(function(){
  111. allotTask(0);
  112. })
  113. //菜单选中状态
  114. $(".menu .page", parent.document).removeClass("active")
  115. $(parent.document).find(".menu .page[code=YH-ZKHC-FPHCRW]").addClass("active")
  116. //表格容器高度计算
  117. setBoxHeight();
  118. $(window).resize(function() {
  119. setBoxHeight();
  120. });
  121. //切换tab
  122. $(".tabBox .tabs button").on("click",(e)=>{
  123. const me = e.target;
  124. global_activeTabCode = $(me).attr("data-code");
  125. $(".tabBox .tabs button").removeClass("active");
  126. $(me).addClass("active");
  127. clearCheckerFilter();
  128. clearFilter();
  129. //刷新质控员、任务列表
  130. //getCheckerList();
  131. const data = global_Checkers[+global_activeTabCode+4];
  132. rendeCheckerList(data||[]);
  133. renderCheckerTable(data);
  134. });
  135. //任务筛选
  136. $(".filter").on("click", function(e){
  137. const behosDateStart1 = $("#datepicker1").val() //出院日期
  138. const behosDateEnd1 = $("#datepicker2").val()
  139. const behosDateStartTime1 = new Date(behosDateStart1).getTime()
  140. const behosDateEndTime1 = new Date(behosDateEnd1).getTime()
  141. const behosDateStart = $("#datepicker3").val() //出院日期
  142. const behosDateEnd = $("#datepicker4").val()
  143. const behosDateStartTime = new Date(behosDateStart).getTime()
  144. const behosDateEndTime = new Date(behosDateEnd).getTime()
  145. if(behosDateStartTime > behosDateEndTime){
  146. $.alerModal({"message":'生成日期开始时间不能大于结束时间~',type:"tip",time:'1000',isFather: true, fatherWrapper: $("#mainBox", parent.document)});
  147. return
  148. }
  149. if(behosDateStartTime > behosDateEndTime){
  150. $.alerModal({"message":'出院日期开始时间不能大于结束时间~',type:"tip",time:'1000',isFather: true, fatherWrapper: $("#mainBox", parent.document)});
  151. return
  152. }
  153. getTabData(1)
  154. })
  155. //重置
  156. $(".abnormalClear").on("click", function(e){
  157. clearFilter();
  158. getTabData(1)
  159. })
  160. //关闭弹窗事件
  161. $(".modal-container .close").click(function(){
  162. $(".modal-container").hide();
  163. });
  164. //科室选择
  165. $('.selectDept').on("click", function(e){
  166. e.stopPropagation()
  167. $(".checkerList ").css("display", "none")
  168. $(".selectChecker .arrow").attr("src",iconDown)
  169. $(".deptList ").css("display","block")
  170. })
  171. //质控员选择
  172. $('.selectChecker').on("click", function(e){
  173. e.stopPropagation()
  174. $(".deptList ").css("display", "none")
  175. $(".selectChecker .arrow").attr("src",iconDown)
  176. $(".checkerList").css("display","block")
  177. })
  178. //关闭下拉事件
  179. $(document).on("click", function(){
  180. $(".deptList ").css("display", "none")
  181. $(".checkerList").css("display", "none")
  182. $(".selectDept .arrow").attr("src",iconDown)
  183. $(".selectChecker .arrow").attr("src",iconDown)
  184. })
  185. //获取科室列表
  186. getDeptList()
  187. //获取核查人员列表
  188. getCheckerList()
  189. });
  190. //高度适应
  191. function setBoxHeight() {
  192. const ht = window.innerHeight;
  193. $('.table-cont').height(ht - 319 + 'px');
  194. $('.overAuto').height(ht - 174 + 'px');
  195. }
  196. //显示tab权限判断
  197. function showWhichTab(){
  198. }
  199. //病人列表获取筛选值
  200. function getFilterData(){
  201. const obj = {};
  202. $(".overAuto.fr .filterBox input[code]").map((i,it)=>{
  203. obj[$(it).attr("code")]=$(it).val()
  204. })
  205. return obj;
  206. }
  207. //获取分配核查任务列表数据
  208. function getTabData(activePage){
  209. const filterData = getFilterData();
  210. const deptList=global_DeptId?[global_DeptId]:undefined;
  211. const param = {
  212. current:activePage,
  213. asc:data_asc, //升序
  214. desc:data_desc, //降序
  215. size: 15,
  216. jobType:global_activeTabCode, //0-科室任务 1-院级 2-质控科
  217. ...filterData,
  218. deptList:deptList,
  219. behosDateEnd:undefined,
  220. behosDateStart:undefined
  221. };
  222. $('.pagination').html("");
  223. $('.patientTable .tbody').html(emptyBox('努力加载中...','',8))
  224. return post(ywCheckApi.getAllotCheckList,param).then(res =>{
  225. if(res.data.code == '0'){
  226. const data = res.data.data;
  227. tabList = data.records;
  228. const totalPage = data.pages;
  229. const totalNum = data.total;
  230. renderTab(tabList)
  231. renderPagination(totalPage,Number(activePage),totalNum)
  232. if(totalPage > 0){
  233. renderPagination(totalPage,Number(activePage),totalNum)
  234. } else{
  235. $('.pagination').html("")
  236. }
  237. }else{
  238. $.alerModal({"message":res.data.msg,type:"tip",time:'1000',isFather: true, fatherWrapper: $("#mainBox", parent.document)});
  239. }
  240. }).catch((e) =>{
  241. })
  242. }
  243. function clearCheckerFilter(){
  244. $('.selectDept i').text('全部')
  245. $(".deptList").css("display", "none")
  246. $('.selectChecker i').text('全部')
  247. $(".checkerList").css("display", "none")
  248. global_DeptId="";
  249. global_CheckerId="";
  250. global_CheckerName="";
  251. }
  252. function clearFilter(){
  253. $(".overAuto.fr input").val("");
  254. data_desc=["leaveHospitalDate"];
  255. /*if(isPlacefile != 1){
  256. data_desc=["behospital_date"]
  257. }*/
  258. data_asc=[];
  259. //默认日期为本月
  260. const days = new Date().getDate()-1;
  261. let startDate = "-"+days+"d",endDate=new Date();
  262. $( "#datepicker" ).datepicker({
  263. changeMonth: true,
  264. changeYear: true,
  265. dateFormat:"yy-mm-dd",
  266. }).datepicker( "setDate", startDate);
  267. $( "#datepicker2" ).datepicker({
  268. changeMonth: true,
  269. changeYear: true,
  270. dateFormat:"yy-mm-dd"
  271. }).datepicker( "setDate",endDate);
  272. /*$( "#datepicker3" ).datepicker({
  273. changeMonth: true,
  274. changeYear: true,
  275. dateFormat:"yy-mm-dd",
  276. }).datepicker( "setDate", startDate);
  277. $( "#datepicker4" ).datepicker({
  278. changeMonth: true,
  279. changeYear: true,
  280. dateFormat:"yy-mm-dd"
  281. }).datepicker( "setDate",endDate);*/
  282. $("th[code]").removeClass("asc desc")
  283. }
  284. //质控员列表渲染
  285. function renderCheckerTable(data,noTasksUpdate){
  286. let str = ``,code="";
  287. if(!data||data.length===0){
  288. $('.checkerTable .tbody').html(emptyBox(null,4))
  289. // initScroll("qcList","YX",1)
  290. return;
  291. }
  292. //获取任务列表数据
  293. if(!noTasksUpdate){getTabData(1);}
  294. const titles = $(".checkerTable .tabTitle th[valCode]");
  295. for(let i = 0; i < data.length; i++){
  296. const item = data[i]
  297. str += `
  298. <tr data-index=${i}>
  299. <td class="operaItem checkerRadio textCenter" code="${item.doctorId}" data-name="${item.doctorName}"><img src="${iconUnRadio}" alt=""></td>
  300. `
  301. for(let i=0;i<titles.length;i++){
  302. code=$(titles[i]).attr('valCode');
  303. if(code==="jobNum"){
  304. str += `<td class="textCenter"><a class="job-num" data-index=${i} data-id="${item.doctorId}" data-name="${item.doctorName}">${ item[code]}<a></td>`
  305. }else{
  306. str += `<td class="textCenter"><span data-index=${i}>${ item[code]}<span></td>`
  307. }
  308. }
  309. str += "</tr>"
  310. }
  311. $('.checkerTable .tbody').html(str)
  312. selectCheckerTb();
  313. bindTaskNumEvent();
  314. }
  315. //选中质控员
  316. function selectCheckerTb(){
  317. $(".checkerRadio").click(function(){
  318. global_CheckerId=$(this).attr("code");
  319. global_CheckerName=$(this).attr("data-name");
  320. $(".checkerRadio img").attr('src',iconUnRadio);
  321. $(this).find("img").attr('src',iconRadio);
  322. });
  323. }
  324. //选中任务
  325. function selectTaskTb(){
  326. $(".taskCheck").unbind("click").click(function(){
  327. const id=$(this).attr("code");
  328. const it =$(this).find("img");
  329. const codes = global_TaskCodes.join(",")+",";
  330. if(it.is(".active")){
  331. $(this).find("img").attr('src',iconUnCheck);
  332. global_TaskCodes = codes.replace(id+",","").replace(/^,|,$/,'').split(",");
  333. }else{
  334. $(this).find("img").attr('src',iconCheck);
  335. global_TaskCodes.push(id);
  336. }
  337. it.toggleClass('active');
  338. });
  339. }
  340. //待分配任务列表渲染
  341. function renderTab(data){
  342. let str = ``,code=""
  343. if(data.length===0){
  344. $('.patientTable .tbody').html(emptyBox(null,7))
  345. // initScroll("qcList","YX",1)
  346. return;
  347. }
  348. const titles = $(".patientTable .tabTitle th[valCode]");
  349. for(let i = 0; i < data.length; i++){
  350. const item = data[i]
  351. str += `
  352. <tr data-index=${i}>
  353. <td class="operaItem taskCheck textCenter" code="${item.behospitalCode}"><img src="${iconUnCheck}" alt=""></td>`;
  354. for(let i=0;i<titles.length;i++){
  355. code=$(titles[i]).attr('valCode');
  356. str += `<td class="textCenter"><span data-index=${i}>${ item[code] || "-"}<span></td>`
  357. }
  358. str += "</tr>"
  359. }
  360. $('.patientTable .tbody').html(str)
  361. selectTaskTb();
  362. }
  363. //任务数点击事件
  364. function bindTaskNumEvent(){
  365. $(".job-num").unbind("click").click(function(){
  366. global_CheckerId = $(this).attr("data-id");
  367. global_CheckerName=$(this).attr("data-name");
  368. $(".modal-container").show();
  369. getTasksList();
  370. })
  371. }
  372. function getDeptList(){
  373. post(api.getDeptList,{}).then(res =>{
  374. if(res.data.code == '0'){
  375. const deptList = res.data.data||[]
  376. rendeDeptList(deptList)
  377. }else{rendeDeptList([])}
  378. }).catch((e) =>{
  379. })
  380. }
  381. function getCheckerList(){
  382. post(ywCheckApi.getCheckUserMap,{}).then(res =>{
  383. if(res.data.code == '0'){
  384. const list = res.data.data||{};
  385. formatDeptChecker(list);
  386. }else{rendeCheckerList([])}
  387. }).catch((e) =>{
  388. })
  389. }
  390. //获取质控员任务列表
  391. function getTasksList(){
  392. post(ywCheckApi.getTaskByUserId,{checkId:global_CheckerId}).then(res =>{
  393. if(res.data.code == '0'){
  394. const list = res.data.data||{};
  395. renderTaskTable(list);
  396. }else{rendeCheckerList([])}
  397. }).catch((e) =>{
  398. })
  399. }
  400. //质控员任务列表渲染
  401. function renderTaskTable(data) {
  402. let str = ``, code = "";
  403. if (!data || data.length === 0) {
  404. $('.taskTable .tbody').html(emptyBox(null, 7))
  405. return;
  406. }
  407. const titles = $(".taskTable .tabTitle th[valCode]");console.log(data)
  408. for (let i = 0; i < data.length; i++) {
  409. const item = data[i];
  410. str += `<tr data-index=${i}>`;
  411. for (let i = 0; i < titles.length; i++) {
  412. code = $(titles[i]).attr('valCode');
  413. str += `<td class="textCenter"><span data-index=${i}>${ item[code] || "-"}<span></td>`
  414. }
  415. str+=`<td class="operaItem textCenter"><a class="delete" code="${item.behospitalCode}">移除</a></td><tr>`
  416. }
  417. $('.taskTable .tbody').html(str);
  418. bindDeleteEvent();
  419. }
  420. //移除任务事件
  421. function bindDeleteEvent(){
  422. $(".taskTable .delete").unbind("click").click(function(e){
  423. global_TaskCodes=[$(this).attr("code")];
  424. $(".del-pop").insertAfter($(this)).show();
  425. });
  426. $(".del-pop .cancel").unbind("click").click(function(){
  427. $(".del-pop").hide();
  428. });
  429. $(".del-pop .del-confirm").unbind("click").click(function(){
  430. allotTask(1);
  431. });
  432. }
  433. //科室筛选质控员
  434. function formatDeptChecker(list){
  435. const k=+global_activeTabCode +4;
  436. const allCheckArrs = list[k];
  437. allCheckArrs.map((it)=>{
  438. global_DeptCheckers[it.deptId]=it.deptcheckUsers;
  439. global_Checkers[k].push(...it.deptcheckUsers);
  440. });
  441. rendeCheckerList(global_Checkers[k]);
  442. renderCheckerTable(global_Checkers[k]);
  443. }
  444. //渲染科室列表
  445. function rendeDeptList(list){
  446. if(list.length == 0){
  447. $(".deptList").html("")
  448. return
  449. }
  450. let str = `<li class="deptItem ellipsis" data-id=" " data-name="全部">全部</li>`;
  451. for(let i = 0; i < list.length; i++){
  452. str += `<li class="deptItem ellipsis" title=${list[i]['deptName']} data-id=${list[i]['deptId']} data-name=${list[i].deptName}> ${list[i].deptName}</li>`
  453. }
  454. $(".deptList").html(str)
  455. bindDeptSelect()
  456. }
  457. //质控员列表渲染
  458. function rendeCheckerList(list){
  459. if(list.length == 0){
  460. $(".checkerList").html("")
  461. return
  462. }
  463. let str = `<li class="checkerItem ellipsis" data-id=" " data-name="全部">全部</li>`;
  464. for(let i = 0; i < list.length; i++){
  465. str += `<li class="checkerItem ellipsis" data-id=${list[i]['doctorId']} data-name=${list[i].doctorName}> ${list[i].doctorName}</li>`
  466. }
  467. $(".checkerList").html(str)
  468. bindCheckerSelect()
  469. }
  470. //科室选择
  471. function bindDeptSelect(){
  472. $('.deptItem').on("mousedown",function(){
  473. const deptItemName = $(this).attr("data-name")
  474. global_DeptId = $(this).attr("data-id")
  475. deptNameTemp=deptItemName==="全部"?"":deptItemName;
  476. $('.selectDept i').text(deptItemName)
  477. $('.selectDept').attr('title',deptItemName)
  478. $(".deptList").css("display", "none")
  479. //质控员选择清空
  480. $('.selectChecker i').text('全部')
  481. $('.selectChecker').attr('title','全部')
  482. const data = +global_DeptId?global_DeptCheckers[global_DeptId]:global_Checkers[+global_activeTabCode+4];
  483. console.log(data,global_DeptId)
  484. rendeCheckerList(data||[]);
  485. renderCheckerTable(data);
  486. getTabData(1);
  487. })
  488. }
  489. //质控员选择
  490. function bindCheckerSelect(){
  491. $('.checkerItem').on("mousedown",function(){
  492. const itemName = $(this).attr("data-name")
  493. const itemId = $(this).attr("data-id")
  494. $('.selectChecker i').text(itemName)
  495. $('.selectChecker').attr('title',itemName)
  496. $(".checkerList").css("display", "none")
  497. const totalArr = global_DeptId?global_DeptCheckers[global_DeptId]:global_Checkers[+global_activeTabCode+4];
  498. const arr = totalArr.find((it)=>itemId===it.doctorId);
  499. renderCheckerTable([arr],true);
  500. })
  501. }
  502. function loading(){
  503. const str = `
  504. <div class="loadingBox">
  505. <div class="mask"></div>
  506. <img class="loadingImg" src=${loadingImg} alt="loading" />
  507. </div>
  508. `
  509. $("#mainBox", parent.document).append(str)
  510. }
  511. function hideLoading(){
  512. $("#mainBox .loadingBox", parent.document).remove()
  513. }
  514. function allotTask(flag){
  515. if(!global_CheckerId){
  516. toast("请先选择质控员");
  517. return;
  518. }
  519. if(global_TaskCodes.length===0){
  520. toast("请选择至少一个任务");
  521. return;
  522. }
  523. const param = {
  524. checkId:global_CheckerId,
  525. checkName:global_CheckerName,
  526. distributionType:flag,
  527. behospitalCodes:global_TaskCodes,
  528. }
  529. post(ywCheckApi.allotTask,param).then(res =>{
  530. if(res.data.code == '0'){
  531. global_TaskCodes=[];
  532. getCheckerList();
  533. flag&&getTasksList(); //移除时更新已分配任务列表弹窗数据
  534. }else{
  535. toast(res.data.msg||'保存分配失败,请重试~');
  536. }
  537. }).catch((e) =>{
  538. })
  539. }
  540. //气泡提示
  541. function toast(msg) {
  542. $.alerModal({"message":msg,type:"tip",time:'1000',isFather: true, fatherWrapper: $("#mainBox", parent.document)});
  543. }
  544. //分页渲染
  545. function renderPagination(totalPage,activePage,totalNum){
  546. let str = `<span class="totalSum">共${totalPage}页/${totalNum}条数据</span><span class="prePage"><img class="arrowPage" src=${arrowLeft} /></span>`
  547. if(totalPage <= 6){
  548. for(let i = 1; i <= totalPage; i++){
  549. str += `<span class="pageNum ${'page'+i}" data-page=${i}>${i}</span>`
  550. }
  551. }else{
  552. if(activePage <= 3){ //选中页数小于4
  553. for(let i = 1; i <= 4; i++){
  554. str += `<span class="pageNum ${'page'+i}" data-page=${i}>${i}</span>`
  555. }
  556. str += `<span class="more" >...</span>`
  557. str += `<span class="pageNum ${'page'+totalPage}" data-page=${totalPage}>${totalPage}</span>`
  558. } else if(activePage > totalPage -3){
  559. str += `<span class="pageNum page1" data-page=1>1</span>`
  560. str += `<span class="more" >...</span>`
  561. str += `<span class="pageNum ${'page'+(totalPage-3)}" data-page=${totalPage -3}>${totalPage -3}</span>`
  562. str += `<span class="pageNum ${'page'+(totalPage-2)}" data-page=${totalPage -2}>${totalPage -2}</span>`
  563. str += `<span class="pageNum ${'page'+(totalPage-1)}" data-page=${totalPage -1}>${totalPage -1}</span>`
  564. str += `<span class="pageNum ${'page'+totalPage}" data-page=${totalPage}>${totalPage}</span>`
  565. } else {
  566. str += `<span class="pageNum page1" data-page=1>1</span>`
  567. str += `<span class="more" >...</span>`
  568. str += `<span class="pageNum ${'page'+(activePage -1)}" data-page=${activePage -1}>${activePage -1}</span>`
  569. str += `<span class="pageNum ${'page'+activePage}" data-page=${activePage}>${activePage}</span>`
  570. str += `<span class="pageNum ${'page'+(activePage +1)}" data-page=${activePage +1}>${activePage +1}</span>`
  571. str += `<span class="more" >...</span>`
  572. str += `<span class="pageNum ${'page'+totalPage}" data-page=${totalPage}>${totalPage}</span>`
  573. }
  574. }
  575. str += `<span class="nextPage"><img class="arrowPage" src=${arrowRight} /></span>`
  576. $('.pagination').html(str)
  577. $('.page' + activePage).addClass('activePage')
  578. $(".pageNum").on("click", function(e){
  579. const activePageNow = Number($(this).attr('data-page'))
  580. getTabData(activePageNow)
  581. // renderPagination(totalPage,activePageNow,totalNum)
  582. })
  583. $(".prePage").on("click", function(e){
  584. let activePageNow = Number($(".activePage").attr('data-page'))
  585. if(activePageNow > 1){
  586. activePageNow--
  587. getTabData(activePageNow)
  588. // renderPagination(totalPage,activePageNow,totalNum)
  589. }
  590. })
  591. $(".nextPage").on("click", function(e){
  592. let activePageNow = Number($(".activePage").attr('data-page'))
  593. if(activePageNow < totalPage){
  594. activePageNow++
  595. getTabData(activePageNow)
  596. // renderPagination(totalPage,activePageNow,totalNum)
  597. }
  598. })
  599. }