userManager.js 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645
  1. const $ = require('jquery');
  2. require("../css/itemManager.less");
  3. require('./../resource/jquery-ui/jquery-ui.min.js');
  4. require('./modal.js');
  5. const {api} = require('./api.js')
  6. const {post,emptyBox} = require('./utils.js')
  7. const switchIconOpen = require("./../images/btn_open.png")
  8. const switchIconClose = require("./../images/btn_close.png")
  9. const iconDown= require("./../images/arrow_down.png")
  10. const iconUp = require("./../images/arrow_up.png")
  11. const arrowLeft= require("./../images/arrow_left.png")
  12. const arrowRight = require("./../images/arrow_right.png")
  13. let casesId="", name="", isReject ="", isUsed ="",casesIdTemp="", nameTemp="", isRejectTemp ="", isUsedTemp =""
  14. $(".selectModuleType").append(`<img class="arrow" src=${iconDown} alt="下拉">`)
  15. $(".selectReject").append(`<img class="arrow" src=${iconDown} alt="下拉">`)
  16. $(".selectUsed").append(`<img class="arrow" src=${iconDown} alt="下拉">`)
  17. $(".abnormalClear").click(function(){
  18. window.location.reload()
  19. })
  20. //获取表格数据
  21. function getTabData(activePage){
  22. let params = {
  23. "current": activePage,
  24. "deptId": casesId||"",
  25. "linkman": name||"",
  26. "roleId": isReject||"",
  27. "size": 15
  28. }
  29. post(api.userPage,params).then(res =>{
  30. if(res.data.code == '0'){
  31. const data = res.data.data.records
  32. const totalPage = res.data.data.pages
  33. const totalNum = res.data.data.total
  34. renderTab(data,activePage)
  35. if(totalPage > 1){
  36. renderPagination(totalPage,Number(activePage),totalNum)
  37. } else{
  38. $('.pagination').html("")
  39. }
  40. }else{}
  41. }).catch((e) =>{
  42. })
  43. }
  44. $(".moduleItemInp").on("input", function(e){
  45. const val = $(this).val().trim()
  46. nameTemp = val
  47. })
  48. $(".filter").on("click", function(e){
  49. casesId=casesIdTemp, name=nameTemp, isReject =isRejectTemp, isUsed =isUsedTemp
  50. getTabData(1)
  51. })
  52. $('.selectModuleType').on("click", function(e){
  53. e.stopPropagation()
  54. $(".rejectList ").css("display","none")
  55. $(".usedList ").css("display", "none")
  56. $(".selectReject .arrow").attr("src",iconDown)
  57. $(".selectUsed .arrow").attr("src",iconDown)
  58. const showList = $(".moduleTypeList ").css("display")
  59. if(showList == "none" ||!showList){
  60. $(".moduleTypeList ").css("display","block")
  61. $(".selectModuleType .arrow").attr("src",iconUp)
  62. }else{
  63. $(".moduleTypeList ").css("display", "none")
  64. $(".selectModuleType .arrow").attr("src",iconDown)
  65. }
  66. })
  67. $('.selectReject').on("click", function(e){
  68. e.stopPropagation()
  69. $(".moduleTypeList ").css("display", "none")
  70. $(".usedList ").css("display", "none")
  71. $(".selectModuleType .arrow").attr("src",iconDown)
  72. $(".selectUsed .arrow").attr("src",iconDown)
  73. const showList = $(".rejectList ").css("display")
  74. if(showList == "none" ||!showList){
  75. $(".rejectList ").css("display","block")
  76. $(".selectUsed .arrow").attr("src",iconUp)
  77. }else{
  78. $(".rejectList ").css("display", "none")
  79. $(".selectUsed .arrow").attr("src",iconDown)
  80. }
  81. })
  82. $('.selectUsed').on("click", function(e){
  83. e.stopPropagation()
  84. $(".moduleTypeList ").css("display", "none")
  85. $(".rejectList ").css("display","none")
  86. $(".selectModuleType .arrow").attr("src",iconDown)
  87. $(".selectReject .arrow").attr("src",iconDown)
  88. const showList = $(".usedList ").css("display")
  89. if(showList == "none" ||!showList){
  90. $(".usedList ").css("display","block")
  91. $(".selectUsed .arrow").attr("src",iconUp)
  92. }else{
  93. $(".usedList ").css("display", "none")
  94. $(".selectUsed .arrow").attr("src",iconDown)
  95. }
  96. })
  97. bindUsedSelect()
  98. getTabData(1)
  99. getmoduleTypeList()
  100. function renderTab(data,activePage){
  101. let str = ``
  102. for(let i = 0; i < data.length; i++){
  103. const item = data[i]
  104. str += `
  105. <tr data-id=${item.id} data-index=${i}>
  106. <td class="textCenter">${(activePage-1)*10 + i+1}</td>
  107. <td class="textCenter">${item.linkman}</td>
  108. <td class="textCenter">${item.deptName||''}</td>
  109. <td class="textCenter">${item.roleName||''}</td>
  110. <td class="textCenter">
  111. <div class="itemMsgInfoBox">
  112. <p class="itemInfoRight itemReject">
  113. <img data-id="${item.userId}" data-status="${item.status}" class="switchImg roleSelect" src=${item.status==1?switchIconOpen:switchIconClose} /><span class="imgInfo"> ${item.status==1?"启用":"禁用"}</span>
  114. </p>
  115. </div>
  116. </td>
  117. <td class="textCenter clearfix"><span data-title="科室" data-id="${item.userId}" class="editItem deptEdit fl">科室编辑</span><span data-id="${item.userId}" data-title="角色" class="editItem roleEdit fr">角色编辑</span></td>
  118. </tr>
  119. `
  120. }
  121. $('tbody').html(str?str:emptyBox())
  122. bindEdit(data,activePage)
  123. }
  124. //获取用户科室列表
  125. function getDeptList(id,activePage,title){
  126. post(api.getUserDepts,{userId:id}).then(res =>{
  127. let data = res.data;
  128. if(data.code == '0'){
  129. let result = data.data
  130. // console.log(result,'科室列表')
  131. editItem(result,activePage,title)
  132. }else{}
  133. }).catch((e) =>{
  134. })
  135. }
  136. //获取用户角色列表
  137. function getUserList(id,activePage,title){
  138. post(api.getUserRoles,{userId:id}).then(res =>{
  139. let data = res.data;
  140. if(data.code == '0'){
  141. const result = data.data
  142. // console.log(result,'角色列表')
  143. editItemRole(result,activePage,title)
  144. }else{}
  145. }).catch((e) =>{
  146. })
  147. }
  148. function bindEdit(data,activePage){
  149. $('.editItem').click(function(e){
  150. const index = $(this).parents("tr").attr('data-index')
  151. const id = $(this).attr('data-id')
  152. const title = $(this).attr('data-title')
  153. if(title == "科室"){
  154. getDeptList(id,activePage,title)
  155. }else if(title == "角色"){
  156. getUserList(id,activePage,title)
  157. }
  158. })
  159. $(".roleSelect").click(function(){
  160. const id = $(this).attr('data-id')
  161. const status = $(this).attr('data-status')
  162. let that = $(this);
  163. if(status == 1){
  164. toggleOnOff(api.disable,id,that,status)
  165. }else{
  166. toggleOnOff(api.enable,id,that,status)
  167. }
  168. })
  169. }
  170. //启用禁用
  171. function toggleOnOff(url,id,that,status){
  172. $.alerModal({type:"loading"});
  173. post(url,{userId:id}).then(res =>{
  174. if(res.data.code == '0'){
  175. // const data = res.data.data
  176. that.attr({
  177. "src":status==1?switchIconClose:switchIconOpen,
  178. "data-status":status==1?0:1
  179. })
  180. that.siblings().html(status==1?' 禁用':' 启用')
  181. $.alerModal({"message":"修改成功",type:"tip",time:'1000',isFather: true, fatherWrapper: $("#mainBox", parent.document)});
  182. }else{
  183. console.log(res)
  184. }
  185. $(".loading").remove()
  186. }).catch((e) =>{
  187. $(".loading").remove()
  188. })
  189. }
  190. let leftDeptLis = [],
  191. rightDeptLis = [],
  192. selectDeptLeft = [],
  193. selectDeptRight = [],
  194. leftRoleLis = [],
  195. rightRoleLis = [],
  196. selectRoleLeft = [],
  197. selectRoleRight = [];
  198. function upDataLis(leftDeptLis,rightDeptLis){
  199. let allLeft = '',allRight = '';
  200. for(let i = 0;i < leftDeptLis.length;i++){//未选中
  201. allLeft+=`
  202. <li class="eclips" data-flg="0" data-id="${leftDeptLis[i].deptId}"><img class="select" src="${require('../images/icon_unchecked.png')}"/>${leftDeptLis[i].deptName}</li>
  203. `
  204. }
  205. for(let j = 0;j < rightDeptLis.length;j++){//已选
  206. allRight+=`
  207. <li class="eclips" data-flg="0" data-id="${rightDeptLis[j].deptId}"><img class="select" src="${require('../images/icon_unchecked.png')}"/>${rightDeptLis[j].deptName}</li>
  208. `
  209. }
  210. $("#partLeftNo", parent.document).html(allLeft)
  211. $("#partRightSelect", parent.document).html(allRight)
  212. $(".partLeft li", parent.document).click(function(){
  213. let dataFlg = $(this).attr("data-flg")
  214. let deptId = $(this).attr("data-id")
  215. $(this).attr({
  216. "data-flg":dataFlg == 0?1:0
  217. }).children("img").attr({
  218. src:dataFlg == 0?require('../images/icon_check.png'):require('../images/icon_unchecked.png'),
  219. })
  220. if(dataFlg == 0){
  221. selectDeptLeft.push(deptId)
  222. }else{
  223. selectDeptLeft.splice($.inArray(deptId,selectDeptLeft),1)
  224. }
  225. })
  226. $(".partRight li", parent.document).click(function(){
  227. let dataFlg = $(this).attr("data-flg")
  228. let deptId = $(this).attr("data-id")
  229. $(this).attr({
  230. "data-flg":dataFlg == 0?1:0
  231. }).children("img").attr({
  232. src:dataFlg == 0?require('../images/icon_check.png'):require('../images/icon_unchecked.png')
  233. })
  234. if(dataFlg == 0){
  235. selectDeptRight.push(deptId)
  236. }else{
  237. selectDeptRight.splice($.inArray(deptId,selectDeptRight),1)
  238. }
  239. })
  240. }
  241. function upDataLisRole(leftDeptLis,rightDeptLis){
  242. let allLeft = '',allRight = '';
  243. for(let i = 0;i < leftDeptLis.length;i++){//未选中
  244. allLeft+=`
  245. <li class="eclips" data-flg="0" data-id="${leftDeptLis[i].id}"><img class="select" src="${require('../images/icon_unchecked.png')}"/>${leftDeptLis[i].name}</li>
  246. `
  247. }
  248. for(let j = 0;j < rightDeptLis.length;j++){//已选
  249. allRight+=`
  250. <li class="eclips" data-flg="0" data-id="${rightDeptLis[j].id}"><img class="select" src="${require('../images/icon_unchecked.png')}"/>${rightDeptLis[j].name}</li>
  251. `
  252. }
  253. $("#partLeftNo", parent.document).html(allLeft)
  254. $("#partRightSelect", parent.document).html(allRight)
  255. $(".partLeft li", parent.document).click(function(){
  256. let dataFlg = $(this).attr("data-flg")
  257. let deptId = $(this).attr("data-id")
  258. $(this).attr({
  259. "data-flg":dataFlg == 0?1:0
  260. }).children("img").attr({
  261. src:dataFlg == 0?require('../images/icon_check.png'):require('../images/icon_unchecked.png'),
  262. })
  263. if(dataFlg == 0){
  264. selectRoleLeft.push(deptId)
  265. }else{
  266. selectRoleLeft.splice($.inArray(deptId,selectRoleLeft),1)
  267. }
  268. })
  269. $(".partRight li", parent.document).click(function(){
  270. let dataFlg = $(this).attr("data-flg")
  271. let deptId = $(this).attr("data-id")
  272. $(this).attr({
  273. "data-flg":dataFlg == 0?1:0
  274. }).children("img").attr({
  275. src:dataFlg == 0?require('../images/icon_check.png'):require('../images/icon_unchecked.png')
  276. })
  277. if(dataFlg == 0){
  278. selectRoleRight.push(deptId)
  279. }else{
  280. selectRoleRight.splice($.inArray(deptId,selectRoleRight),1)
  281. }
  282. })
  283. }
  284. //修改科室
  285. function editItem(result,activePage,title){
  286. $('.pop-box').remove()
  287. $('.container').append('<div class="pop-box"></div>')
  288. let userId = result.userId;
  289. leftDeptLis = result.notSelDepts||[],rightDeptLis = result.selDepts||[];
  290. const str = `
  291. <div class="itemMsgBox">
  292. <div class="mask"></div>
  293. <div class="itemMsgContent" style="height:552px;width:680px;margin: -276px 0 0 -340px;">
  294. <p class="itemMsgTitle">${title}编辑 <img class="iconClose" src=${require('./../images/icon_close_default.png')} alt="关闭" /></p>
  295. <div class="itemContentBoxLisL itemContentBoxLis">
  296. <p class="title">所有${title}</p>
  297. <ul class="partLeft partPub" id="partLeftNo">
  298. </ul>
  299. </div>
  300. <div class="activeGo">
  301. <p class="activeGoRight"><img src="${require('../images/goRight.png')}" /></p>
  302. <p class="btm activeGoLeft"><img src="${require('../images/goLeft.png')}" /></p>
  303. </div>
  304. <div class="itemContentBoxLisR itemContentBoxLis">
  305. <p class="title">已选${title}</p>
  306. <ul class="partRight partPub" id="partRightSelect">
  307. </ul>
  308. </div>
  309. <div class="clearfix"></div>
  310. <div class="confirmEditBox"><span class="confirmEdit">保存</span></div>
  311. </div>
  312. </div>
  313. `
  314. $("#mainBox", parent.document).append(str)
  315. upDataLis(leftDeptLis,rightDeptLis)
  316. $("#mainBox .itemMsgBox .iconClose", parent.document).on("click", function(e){
  317. $("#mainBox .itemMsgBox", parent.document).remove()
  318. })
  319. $("#mainBox .itemMsgBox .activeGoRight", parent.document).on("click", function(e){//数据往右
  320. let selectDeptLeftTmp = selectDeptLeft
  321. if(selectDeptLeftTmp.length == 0){
  322. $.alerModal({type:"tip",message:"请先选择内容",isFather: true, fatherWrapper: $("#mainBox", parent.document)});
  323. return
  324. }
  325. for(let j = 0;j < selectDeptLeftTmp.length;j++){
  326. for(let i = 0;i < leftDeptLis.length;i++){
  327. if(leftDeptLis[i].deptId == selectDeptLeftTmp[j]){
  328. rightDeptLis.push(leftDeptLis[i])
  329. leftDeptLis.splice(i,1)
  330. }
  331. }
  332. }
  333. upDataLis(leftDeptLis,rightDeptLis)
  334. selectDeptLeft=[]
  335. })
  336. $("#mainBox .itemMsgBox .activeGoLeft", parent.document).on("click", function(e){//数据往左
  337. let selectDeptRightTmp = selectDeptRight
  338. if(selectDeptRightTmp.length == 0){
  339. $.alerModal({type:"tip",message:"请先选择内容",isFather: true, fatherWrapper: $("#mainBox", parent.document)});
  340. return
  341. }
  342. for(let j = 0;j < selectDeptRightTmp.length;j++){
  343. for(let i = 0;i < rightDeptLis.length;i++){
  344. if(rightDeptLis[i].deptId == selectDeptRightTmp[j]){
  345. leftDeptLis.push(rightDeptLis[i])
  346. rightDeptLis.splice(i,1)
  347. }
  348. }
  349. }
  350. upDataLis(leftDeptLis,rightDeptLis)
  351. selectDeptRight=[]
  352. })
  353. $("#mainBox .itemMsgBox .confirmEdit", parent.document).on("click", function(){
  354. saveEdit(userId,activePage)
  355. })
  356. }
  357. //修改角色
  358. function editItemRole(result,activePage,title){
  359. $('.pop-box').remove()
  360. $('.container').append('<div class="pop-box"></div>')
  361. let userId = result.userId;
  362. leftRoleLis = result.notSelRoles||[],rightRoleLis = result.selRoles||[];
  363. const str = `
  364. <div class="itemMsgBox">
  365. <div class="mask"></div>
  366. <div class="itemMsgContent" style="height:552px;width:680px;margin: -276px 0 0 -340px;">
  367. <p class="itemMsgTitle">${title}编辑 <img class="iconClose" src=${require('./../images/icon_close_default.png')} alt="关闭" /></p>
  368. <div class="itemContentBoxLisL itemContentBoxLis">
  369. <p class="title">所有${title}</p>
  370. <ul class="partLeft partPub" id="partLeftNo">
  371. </ul>
  372. </div>
  373. <div class="activeGo">
  374. <p class="activeGoRight"><img src="${require('../images/goRight.png')}" /></p>
  375. <p class="btm activeGoLeft"><img src="${require('../images/goLeft.png')}" /></p>
  376. </div>
  377. <div class="itemContentBoxLisR itemContentBoxLis">
  378. <p class="title">已选${title}</p>
  379. <ul class="partRight partPub" id="partRightSelect">
  380. </ul>
  381. </div>
  382. <div class="clearfix"></div>
  383. <div class="confirmEditBox"><span class="confirmEdit">保存</span></div>
  384. </div>
  385. </div>
  386. `
  387. $("#mainBox", parent.document).append(str)
  388. upDataLisRole(leftRoleLis,rightRoleLis)
  389. $("#mainBox .itemMsgBox .iconClose", parent.document).on("click", function(e){
  390. $("#mainBox .itemMsgBox", parent.document).remove()
  391. })
  392. $("#mainBox .itemMsgBox .activeGoRight", parent.document).on("click", function(e){//数据往右
  393. let selectDeptLeftTmp = selectRoleLeft
  394. if(selectDeptLeftTmp.length == 0){
  395. $.alerModal({type:"tip",message:"请先选择内容",isFather: true, fatherWrapper: $("#mainBox", parent.document)});
  396. return
  397. }
  398. let leftDeptLis = leftRoleLis
  399. for(let j = 0;j < selectDeptLeftTmp.length;j++){
  400. for(let i = 0;i < leftDeptLis.length;i++){
  401. if(leftDeptLis[i].id == selectDeptLeftTmp[j]){
  402. rightRoleLis.push(leftDeptLis[i])
  403. leftRoleLis.splice(i,1)
  404. }
  405. }
  406. }
  407. // console.log(leftRoleLis,rightRoleLis)
  408. upDataLisRole(leftRoleLis,rightRoleLis)
  409. selectRoleLeft=[]
  410. })
  411. $("#mainBox .itemMsgBox .activeGoLeft", parent.document).on("click", function(e){//数据往左
  412. let selectDeptRightTmp = selectRoleRight
  413. if(selectDeptRightTmp.length == 0){
  414. $.alerModal({type:"tip",message:"请先选择内容",isFather: true, fatherWrapper: $("#mainBox", parent.document)});
  415. return
  416. }
  417. let rightDeptLis = rightRoleLis
  418. for(let j = 0;j < selectDeptRightTmp.length;j++){
  419. for(let i = 0;i < rightDeptLis.length;i++){
  420. if(rightDeptLis[i].id == selectDeptRightTmp[j]){
  421. leftRoleLis.push(rightDeptLis[i])
  422. rightRoleLis.splice(i,1)
  423. }
  424. }
  425. }
  426. upDataLisRole(leftRoleLis,rightRoleLis)
  427. selectRoleRight=[]
  428. })
  429. $("#mainBox .itemMsgBox .confirmEdit", parent.document).on("click", function(){
  430. saveEditRole(userId,activePage)
  431. })
  432. }
  433. //保存科室修改
  434. function saveEdit(id,activePage){
  435. let ids = []
  436. if(rightDeptLis.length==0){
  437. $.alerModal({"message":"请选择科室",type:"tip",time:'1000',isFather: true, fatherWrapper: $("#mainBox", parent.document)});
  438. return
  439. }
  440. for(let i = 0;i < rightDeptLis.length;i++){
  441. ids.push(rightDeptLis[i].deptId)
  442. }
  443. const param = {
  444. "deptIds": ids,
  445. "userId": id
  446. }
  447. post(api.editUserDepts,param).then(res =>{
  448. if(res.data.code == '0'){
  449. // const data = res.data.data
  450. getTabData(activePage)
  451. $.alerModal({"message":"修改成功",type:"tip",time:'1000',isFather: true, fatherWrapper: $("#mainBox", parent.document)});
  452. $('#mainBox .itemMsgBox', parent.document).remove()
  453. }else{}
  454. }).catch((e) =>{
  455. })
  456. }
  457. //保存角色修改
  458. function saveEditRole(id,activePage){
  459. let ids = []
  460. if(rightRoleLis.length==0){
  461. $.alerModal({"message":"请选择角色",type:"tip",time:'1000',isFather: true, fatherWrapper: $("#mainBox", parent.document)});
  462. return
  463. }
  464. for(let i = 0;i < rightRoleLis.length;i++){
  465. ids.push(rightRoleLis[i].id)
  466. }
  467. const param = {
  468. "roleIds": ids,
  469. "userId": id
  470. }
  471. post(api.editUserRoles,param).then(res =>{
  472. if(res.data.code == '0'){
  473. // const data = res.data.data
  474. getTabData(activePage)
  475. $.alerModal({"message":"修改成功",type:"tip",time:'1000',isFather: true, fatherWrapper: $("#mainBox", parent.document)});
  476. $('#mainBox .itemMsgBox', parent.document).remove()
  477. }else{}
  478. }).catch((e) =>{
  479. })
  480. }
  481. //获取科室,角色列表
  482. function getmoduleTypeList(){
  483. post(api.getDeptListUser,{
  484. "inputStr": ""
  485. }).then(res =>{
  486. if(res.data.code == '0'){
  487. const moduleTypeList = res.data.data
  488. renderModuleTypeList(moduleTypeList)
  489. }else{}
  490. }).catch((e) =>{
  491. })
  492. post(api.listForUserRole).then(res =>{
  493. if(res.data.code == '0'){
  494. const moduleTypeList = res.data.data
  495. renderRoleTypeList(moduleTypeList)
  496. }else{}
  497. }).catch((e) =>{
  498. })
  499. }
  500. function renderRoleTypeList(moduleTypeList){
  501. let str = `<li class="modeTypeItem " data-id="" data-name="全部">全部</li>`
  502. for(let i = 0; i < moduleTypeList.length; i++){
  503. str += `<li class="modeTypeItem ellipsis" title=${moduleTypeList[i].name} data-id=${moduleTypeList[i].id} data-name=${moduleTypeList[i].name}> ${moduleTypeList[i].name}</li>`
  504. }
  505. $('.rejectList').html(str)
  506. bindRoleTypeSelect()
  507. }
  508. function renderModuleTypeList(moduleTypeList){
  509. let str = `<li class="modeTypeItem " data-id="" data-name="全部">全部</li>`
  510. for(let i = 0; i < moduleTypeList.length; i++){
  511. str += `<li class="modeTypeItem ellipsis" title=${moduleTypeList[i].deptName} data-id=${moduleTypeList[i].deptId} data-name=${moduleTypeList[i].deptName}> ${moduleTypeList[i].deptName}</li>`
  512. }
  513. $('.moduleTypeList').html(str)
  514. bindModuleTypeSelect()
  515. }
  516. //模块类型选择
  517. function bindModuleTypeSelect(){
  518. $('.moduleTypeList .modeTypeItem').on("click",function(){
  519. const modeTypeItemName = $(this).attr("data-name")
  520. const modeTypeItemId = $(this).attr("data-id")
  521. casesIdTemp =modeTypeItemId
  522. $('.selectModuleType').html(modeTypeItemName).attr("title",modeTypeItemName)
  523. $(".selectModuleType").append(`<img class="arrow" src=${iconDown} alt="下拉">`)
  524. $(".moduleTypeList ").css("display", "none")
  525. })
  526. }
  527. function bindRoleTypeSelect(){
  528. $('.rejectList .modeTypeItem').on("click",function(){
  529. const modeTypeItemName = $(this).attr("data-name")
  530. const modeTypeItemId = $(this).attr("data-id")
  531. isRejectTemp =modeTypeItemId
  532. $('.selectReject').html(modeTypeItemName)
  533. $(".selectReject").append(`<img class="arrow" src=${iconDown} alt="下拉">`)
  534. $(".moduleTypeList ").css("display", "none")
  535. })
  536. }
  537. //是否启用选择
  538. function bindUsedSelect(){
  539. $('.usedItem').on("click",function(){
  540. const usedItemName = $(this).attr("data-name")
  541. const usedItemItemId = $(this).attr("data-id")
  542. isUsedTemp =usedItemItemId
  543. $('.selectUsed').html(usedItemName)
  544. $(".usedList").css("display", "none")
  545. $(".selectUsed").append(`<img class="arrow" src=${iconDown} alt="下拉">`)
  546. })
  547. }
  548. //分页渲染
  549. function renderPagination(totalPage,activePage,totalNum){
  550. let str = `<span class="totalSum">共${totalPage}页/${totalNum}条数据</span><span class="prePage"><img class="arrowPage" src=${arrowLeft} /></span>`
  551. if(totalPage <= 6){
  552. for(let i = 1; i <= totalPage; i++){
  553. str += `<span class="pageNum ${'page'+i}" data-page=${i}>${i}</span>`
  554. }
  555. }else{
  556. if(activePage <= 3){ //选中页数小于4
  557. for(let i = 1; i <= 4; i++){
  558. str += `<span class="pageNum ${'page'+i}" data-page=${i}>${i}</span>`
  559. }
  560. str += `<span class="more" >...</span>`
  561. str += `<span class="pageNum ${'page'+totalPage}" data-page=${totalPage}>${totalPage}</span>`
  562. } else if(activePage > totalPage -3){
  563. str += `<span class="pageNum page1" data-page=1>1</span>`
  564. str += `<span class="more" >...</span>`
  565. str += `<span class="pageNum ${'page'+(totalPage-3)}" data-page=${totalPage -3}>${totalPage -3}</span>`
  566. str += `<span class="pageNum ${'page'+(totalPage-2)}" data-page=${totalPage -2}>${totalPage -2}</span>`
  567. str += `<span class="pageNum ${'page'+(totalPage-1)}" data-page=${totalPage -1}>${totalPage -1}</span>`
  568. str += `<span class="pageNum ${'page'+totalPage}" data-page=${totalPage}>${totalPage}</span>`
  569. } else {
  570. str += `<span class="pageNum page1" data-page=1>1</span>`
  571. str += `<span class="more" >...</span>`
  572. str += `<span class="pageNum ${'page'+(activePage -1)}" data-page=${activePage -1}>${activePage -1}</span>`
  573. str += `<span class="pageNum ${'page'+activePage}" data-page=${activePage}>${activePage}</span>`
  574. str += `<span class="pageNum ${'page'+(activePage +1)}" data-page=${activePage +1}>${activePage +1}</span>`
  575. str += `<span class="more" >...</span>`
  576. str += `<span class="pageNum ${'page'+totalPage}" data-page=${totalPage}>${totalPage}</span>`
  577. }
  578. }
  579. str += `<span class="nextPage"><img class="arrowPage" src=${arrowRight} /></span>`
  580. $('.pagination').html(str)
  581. $('.page' + activePage).addClass('activePage')
  582. $(".pageNum").on("click", function(e){
  583. const activePageNow = Number($(this).attr('data-page'))
  584. getTabData(activePageNow)
  585. // renderPagination(totalPage,activePageNow,totalNum)
  586. })
  587. $(".prePage").on("click", function(e){
  588. let activePageNow = Number($(".activePage").attr('data-page'))
  589. if(activePageNow > 1){
  590. activePageNow--
  591. getTabData(activePageNow)
  592. // renderPagination(totalPage,activePageNow,totalNum)
  593. }
  594. })
  595. $(".nextPage").on("click", function(e){
  596. let activePageNow = Number($(".activePage").attr('data-page'))
  597. if(activePageNow < totalPage){
  598. activePageNow++
  599. getTabData(activePageNow)
  600. // renderPagination(totalPage,activePageNow,totalNum)
  601. }
  602. })
  603. }
  604. $(document).on("click", function(){
  605. $(".moduleTypeList ").css("display", "none")
  606. $(".rejectList ").css("display","none")
  607. $(".usedList ").css("display", "none")
  608. $(".selectModuleType .arrow").attr("src",iconDown)
  609. $(".selectReject .arrow").attr("src",iconDown)
  610. $(".selectUsed .arrow").attr("src",iconDown)
  611. })