knowledgeMap/src/js/knowledgeTree.js

const $ = require("jquery");
require("babel-polyfill");
const echarts = require("echarts");
require("./../css/knowledgeTree.less");
require("./../css/common.less");
// require("ztree");
require('./../resources/images/icon.png');
require('./../resources/images/iconOpen.png');
require('./../resources/images/iconClose.png');
require('./../resources/images/node.png');
require('./../resources/images/radioUnSelect.png');
require('./../resources/images/radioSelect.png');
require('./../resources/images/iconSlideUp.png');
require('./../resources/images/iconSlideDown.png');
require('./../resources/images/iconSelect.png');
require('./../resources/images/syflogo.png');
require('./../resources/images/logo.png');
require('./../resources/zTree/js/jquery.ztree.core.min.js');
require('./../resources/zTree/js/jquery.ztree.excheck.min.js')
require('./../resources/zTree/css/zTreeStyle/zTreeStyle.css');
const iconUp = require('./../resources/images/iconUp.png');
const iconDown = require('./../resources/images/iconDown.png');
// document.write("aaaa");
const {getSchema,updateTree,getTree,getNode,getTab,renderTab} = require('./schemaMap.js');

window.select_type="疾病";
window.select_type_noSearch="疾病";
window.refreshTree = true
 const clientHei = $(window).height()
 const contentHei = clientHei - 80
 $(".left").css("height",contentHei+'px')
 $(".right").css("height",contentHei+'px')
 $(".tabBottom").css("height",contentHei-80-43-10+'px')
 $(".ztree").css("height",contentHei-80-43-60-20+'px')
 $("#main").css("height",contentHei-20-20+'px')
//关系图
getSchema("胆囊炎",select_type);
getTree(1,1,"胆囊炎");
$('#searchInp').val("胆囊炎")

//选择类型
$('.select').click(function(e){
    e.stopPropagation();
    const selectListShow = $('.selectList').css('display')
    if(selectListShow == 'none'){
        $('.iconSlide').attr('src','./images/iconSlideUp.png')
    } else{
        $('.iconSlide').attr('src','./images/iconSlideDown.png')
    }
    $('.selectList').fadeToggle()
   
})
$('.selectList .selectItem').click(function(){
    select_type_noSearch = $(this).attr('data-id')
    const txt =  $(this).text()
    const oldTxt = $(".selectedName").html()
    $(".selectedName").html(txt)
    if(txt.length > 3){
        $(".selectedName").html(txt.slice(0,2)+"...")
    }else{
        $(".selectedName").html(txt)
    }
   
    $(".selectedName").attr('title',txt)
    $("#searchInp").attr("placeholder",`请输入${txt}名称`)
    if(txt != oldTxt){
        $('#searchInp').val("")
    }
    
})

//搜索节点名
$("#searchInp").bind("input propertychange",function(event){
    const val = $("#searchInp").val().trim()
    if(val){
        getNode(val,select_type_noSearch)
    }else{
        $(".tabNameList").hide()
    }
});

//切换条目
$('.radioItem').click(function(e){
    const initDiag = "胆囊炎"
    const type = $(this).attr('data-type')
    // $(this).children('img').attr('src')
    $('.iconRadio').attr('src','/images/radioUnSelect.png')
    $(this).children('img').attr('src','/images/radioSelect.png')
     $('#searchInp').val(initDiag)
    getTree(type,1,initDiag);
    getSchema(initDiag,select_type);
    // updateTree(initDiag)
})
//搜索
$('#searchBtn').click(function(e){
    e.stopPropagation()
    const val = $('#searchInp').val().trim()
    if(val){
        const clientHei = $(window).height()
        const contentHei = clientHei - 80
        $(".tabNameList").hide()
        getSchema(val,select_type_noSearch).then(()=>{
            if(!window.refreshTree){
                return
            }
            if(select_type_noSearch != select_type){
                select_type = select_type_noSearch
                
                if(select_type == '疾病'){
                    // $('#searchInp').val("高血压3级")
                    getTree(1,1,val);
                }else if(select_type == '药品通用名'){
                    getTree(0,2,val);
                }else if(select_type == '症状'){
                    getTree(0,3,val);
                }else if(select_type == '手术和操作'){
                    getTree(0,4,val);
                }else if(select_type == '实验室检查'){
                    getTree(0,5,val);
                }else if(select_type == '辅助检查'){
                    getTree(0,6,val);
                }
                if(select_type == '疾病'){
                    $('.iconRadio').attr('src','/images/radioUnSelect.png')
                    $('.ICD10 img').attr('src','/images/radioSelect.png')
                    $(".radioList").show()
                    $(".ztree").css("height",contentHei-80-43-60-20+'px')
                }else{
                    $(".radioList").hide()
                    $(".ztree").css("height",contentHei-80-43-20-20+'px')
                    $(".ztree").css({
                        margin: '20 0 0 0px'
                    })
                }
                let renderTabInfo = getTab("疾病") 
                renderTab(renderTabInfo)
            }else{
                updateTree(val)
            }
        })
    }else{
       $('.tabNameListNoSearch').show()
    }
})
let renderTabInfo = getTab("疾病") 
renderTab(renderTabInfo)

//切换tab


//点击页面其他地方关闭下拉
$('html').click(function(){
    const selectListShow = $('.selectList').css('display')
    const tabNameListShow = $('.tabNameList').css('display')
    const tabNameListNoSearchShow = $('.tabNameListNoSearch').css('display')

    if(selectListShow == 'block'){
        $('.selectList').hide()
        $('.iconSlide').attr('src','./images/iconSlideDown.png')
    }
    if(tabNameListShow == 'block'){
        $('.tabNameList').hide()
    }
    if(tabNameListNoSearchShow == 'block'){
        $('.tabNameListNoSearch').hide()
    }
})