index.js 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190
  1. const $ = require("jquery");
  2. require("babel-polyfill");
  3. const echarts = require("echarts");
  4. require("./../css/knowledgeMap.less");
  5. require("./../css/common.css");
  6. // require("ztree");
  7. require('./../resources/images/icon.png');
  8. require('./../resources/images/iconOpen.png');
  9. require('./../resources/images/iconClose.png');
  10. require('./../resources/images/node.png');
  11. require('./../resources/images/radioUnSelect.png');
  12. require('./../resources/images/radioSelect.png');
  13. require('./../resources/images/iconSlideUp.png');
  14. require('./../resources/images/iconSlideDown.png');
  15. require('./../resources/images/iconSelect.png');
  16. require('./../resources/images/syflogo.png');
  17. require('./../resources/images/logo.png');
  18. require('./../resources/images/logo_shaoyifu.png');
  19. require('./../resources/zTree/js/jquery.ztree.core.min.js');
  20. require('./../resources/zTree/js/jquery.ztree.excheck.min.js')
  21. require('./../resources/zTree/css/zTreeStyle/zTreeStyle.css');
  22. const { post, api } = require('./api.js');
  23. const { mapData, zTreeData,mapData3,zTreeData3 } = require('./data.js');
  24. const { drawGraph,updateTree,getGraph,getTree,getNode } = require('./graphMap.js');
  25. window.select_type="疾病";
  26. window.select_type_noSearch="疾病";
  27. window.refreshTree = true
  28. const clientHei = $(window).height()
  29. const contentHei = clientHei - 80
  30. $(".left").css("height",contentHei+'px')
  31. $(".right").css("height",contentHei+'px')
  32. $(".tabBottom").css("height",contentHei-80-43-10+'px')
  33. $(".ztree").css("height",contentHei-80-43-60-20+'px')
  34. $("#main").css("height",contentHei-20-20+'px')
  35. //关系图
  36. getGraph("高血压3级",select_type);
  37. getTree(1,1,"高血压3级");
  38. $('#searchInp').val("高血压3级")
  39. //选择类型
  40. $('.select').click(function(e){
  41. e.stopPropagation();
  42. const selectListShow = $('.selectList').css('display')
  43. if(selectListShow == 'none'){
  44. $('.iconSlide').attr('src','./images/iconSlideUp.png')
  45. } else{
  46. $('.iconSlide').attr('src','./images/iconSlideDown.png')
  47. }
  48. $('.selectList').fadeToggle()
  49. })
  50. $('.selectList .selectItem').click(function(){
  51. select_type_noSearch = $(this).attr('data-id')
  52. const txt = $(this).text()
  53. const oldTxt = $(".selectedName").html()
  54. $(".selectedName").html(txt)
  55. if(txt == '疾病'){
  56. $("#searchInp").attr("placeholder","请输入疾病名称")
  57. }else if(txt == '药品'){
  58. $("#searchInp").attr("placeholder","请输入药品名称")
  59. }
  60. if(txt != oldTxt){
  61. $('#searchInp').val("")
  62. }
  63. })
  64. //搜索节点名
  65. $("#searchInp").bind("input propertychange",function(event){
  66. const val = $("#searchInp").val().trim()
  67. if(val){
  68. getNode(val,select_type_noSearch)
  69. }else{
  70. $(".tabNameList").hide()
  71. }
  72. });
  73. //切换条目
  74. $('.radioItem').click(function(e){
  75. const initDiag = "高血压3级"
  76. const type = $(this).attr('data-type')
  77. // $(this).children('img').attr('src')
  78. $('.iconRadio').attr('src','/images/radioUnSelect.png')
  79. $(this).children('img').attr('src','/images/radioSelect.png')
  80. $('#searchInp').val(initDiag)
  81. getTree(type,1,initDiag);
  82. getGraph(initDiag,select_type);
  83. // updateTree(initDiag)
  84. })
  85. //搜索
  86. $('#searchBtn').click(function(e){
  87. e.stopPropagation()
  88. const val = $('#searchInp').val().trim()
  89. if(val){
  90. const clientHei = $(window).height()
  91. const contentHei = clientHei - 80
  92. $(".tabNameList").hide()
  93. getGraph(val,select_type_noSearch).then(()=>{
  94. if(!window.refreshTree){
  95. return
  96. }
  97. if(select_type_noSearch != select_type){
  98. select_type = select_type_noSearch
  99. if(select_type == '疾病'){
  100. $(".radioList").show()
  101. $(".activeTab").removeClass("activeTab")
  102. $(".diagnose").addClass("activeTab")
  103. $(".ztree").css("height",contentHei-80-43-60-20+'px')
  104. // $('#searchInp').val("高血压3级")
  105. $('.iconRadio').attr('src','/images/radioUnSelect.png')
  106. $('.ICD10 img').attr('src','/images/radioSelect.png')
  107. getTree(1,1,val);
  108. }else if(select_type == '药品通用名'){
  109. $(".radioList").hide()
  110. $(".ztree").css("height",contentHei-80-43-20+'px')
  111. $(".activeTab").removeClass("activeTab")
  112. $(".drug").addClass("activeTab")
  113. getTree(0,2,val);
  114. }
  115. }else{
  116. updateTree(val)
  117. }
  118. })
  119. }else{
  120. $('.tabNameListNoSearch').show()
  121. }
  122. })
  123. //切换tab
  124. $('.tabList .tab').click(function(){
  125. const id = $(this).attr('data-id')
  126. $(this).addClass("activeTab").siblings().removeClass('activeTab')
  127. if(id != select_type){
  128. if(id != "疾病"){
  129. $(".radioList").hide()
  130. }else{
  131. $(".radioList").show()
  132. }
  133. if(id == "疾病"){
  134. select_type_noSearch = id
  135. select_type = id
  136. $('.selectedName').html(select_type)
  137. $(".ztree").css("height",contentHei-80-43-60-20+'px')
  138. $('#searchInp').val("高血压3级")
  139. $('.iconRadio').attr('src','/images/radioUnSelect.png')
  140. $('.ICD10 img').attr('src','/images/radioSelect.png')
  141. getTree(1,1,"高血压3级");
  142. getGraph("高血压3级",select_type);
  143. }else if(id=="药品通用名"){
  144. select_type_noSearch = id
  145. select_type = id
  146. $('.selectedName').html("药品")
  147. $(".ztree").css("height",contentHei-80-43-20+'px')
  148. $('#searchInp').val("氟康唑注射液")
  149. getTree(0,2,"氟康唑注射液");
  150. getGraph("氟康唑注射液",select_type);
  151. }
  152. select_type = id
  153. // getTree(1,1,""); //切换tab重新画菜单树
  154. }
  155. })
  156. //点击页面其他地方关闭下拉
  157. $('html').click(function(){
  158. const selectListShow = $('.selectList').css('display')
  159. const tabNameListShow = $('.tabNameList').css('display')
  160. const tabNameListNoSearchShow = $('.tabNameListNoSearch').css('display')
  161. if(selectListShow == 'block'){
  162. $('.selectList').hide()
  163. $('.iconSlide').attr('src','./images/iconSlideDown.png')
  164. }
  165. if(tabNameListShow == 'block'){
  166. $('.tabNameList').hide()
  167. }
  168. if(tabNameListNoSearchShow == 'block'){
  169. $('.tabNameListNoSearch').hide()
  170. }
  171. })