浏览代码

增加新页面

yangdr 1 月之前
父节点
当前提交
48283ddd0e
共有 7 个文件被更改,包括 315 次插入126 次删除
  1. 1 0
      package.json
  2. 1 1
      src/html/home.html
  3. 42 21
      src/js/api.js
  4. 200 79
      src/js/graphMap.js
  5. 33 20
      src/js/home.js
  6. 35 3
      src/js/index.js
  7. 3 2
      webpack.config.js

+ 1 - 0
package.json

@@ -4,6 +4,7 @@
   "description": "",
   "main": "index.js",
   "dependencies": {
+    "axios": "^0.18.0",
     "bluebird": "^3.5.5",
     "dayjs": "^1.11.13",
     "element-ui": "^2.7.2",

+ 1 - 1
src/html/home.html

@@ -4,7 +4,7 @@
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>知识图谱系统</title>
+  <title>知识图谱维护管理</title>
   <link rel="stylesheet" href="./elementUI/theme-chalk/index.css">
   </script>
   <style>

+ 42 - 21
src/js/api.js

@@ -1,32 +1,33 @@
 
 const api = {
-  getGraph: '/kg/getGraph',
-  getNode: '/kg/getNode',
+  getGraph: '/api/kg/getGraph',
+  getSelfGraph: '/open-platform/kb/graph_data',
+  getNode: '/api/kg/getNode',
   getSchema: '/api/ltkg/kg/getSchema',
-  getTree: '/kg/getTree',
-  entity_predict: 'api/ltkg/nlp/getNlp',
+  getTree: '/api/kg/getTree',
+  entity_predict: '/api/ltkg/nlp/getNlp',
   getMrInfo: '/api/ltkg/presetInfo/getMrInfo',
   getAnswer: '/api/ltkg/qa/charBot',
   getTerm: '/api/ltkg/term/getTerm',
   check: 'http://192.168.2.121:7010/test/testStandConvert',
-  findEntity: "/entity/findEntity", //实体详情查询(根据id查询实体)
-  deleteEntity: "/entity/deleteEntity", //批量删除实体
-  mergeEntity: "/entity/mergeEntity",//实体合并
-  createEntity: "/entity/createEntity",//批量新增实体
+  findEntity: "/api/entity/findEntity", //实体详情查询(根据id查询实体)
+  deleteEntity: "/api/entity/deleteEntity", //批量删除实体
+  mergeEntity: "/api/entity/mergeEntity",//实体合并
+  createEntity: "/api/entity/createEntity",//批量新增实体
 
-  updateEntityName: "/entity/updateEntityName",
+  updateEntityName: "/api/entity/updateEntityName",
 
-  createRelationship: "/relationship/createRelationship",
-  findRelationshipType: "/relationship/findRelationshipType", //根据名称模糊查询关系
-  updateRelationshipType: "/relationship/updateRelationshipType",
-  createEntityProperty: "/property/createEntityProperty", //批量新增实体属性
-  deleteRelationship: "/relationship/deleteRelationship",//批量删除关系
-  findEntityListByName: "/entity/findEntityListByName", //实体列表查询(根据标签和名字模糊查询实体)
-  updateEntityProperty: "/property/updateEntityProperty", //更新实体属性
-  deleteEntityProperty: "/property/deleteEntityProperty", //删除实体属性
+  createRelationship: "/api/relationship/createRelationship",
+  findRelationshipType: "/api/relationship/findRelationshipType", //根据名称模糊查询关系
+  updateRelationshipType: "/api/relationship/updateRelationshipType",
+  createEntityProperty: "/api/property/createEntityProperty", //批量新增实体属性
+  deleteRelationship: "/api/relationship/deleteRelationship",//批量删除关系
+  findEntityListByName: "/api/entity/findEntityListByName", //实体列表查询(根据标签和名字模糊查询实体)
+  updateEntityProperty: "/api/property/updateEntityProperty", //更新实体属性
+  deleteEntityProperty: "/api/property/deleteEntityProperty", //删除实体属性
 
-  getCountList: "/kg/count/getCountList",
-  getCountInfo: "/kg/count/getCountInfo"
+  getCountList: "/api/kg/count/getCountList",
+  getCountInfo: "/api/kg/count/getCountInfo"
 };
 $(".goto-homeStatic").on("click", function () {
   window.location.href = "http://192.168.2.121:5666" + $(this).attr("link");
@@ -62,7 +63,7 @@ const post = function (url, data, pId) {
   return new Promise((resolve, reject) => {
     $.ajax({
       method: 'post',
-      url: '/api' + url,
+      url: url,
       data: JSON.stringify(data),
       contentType: "application/json; charset=UTF-8",
       beforeSend: function (xmlHttp) {
@@ -82,7 +83,26 @@ const post = function (url, data, pId) {
     });
   });
 }
-
+const get = function (url, data) {
+  return new Promise((resolve, reject) => {
+    $.ajax({
+      method: 'get',
+      url: url,
+      data: data,
+      contentType: "application/json; charset=UTF-8",
+      beforeSend: function (xmlHttp) {
+        xmlHttp.setRequestHeader("If-Modified-Since", "0");
+        xmlHttp.setRequestHeader("Cache-Control", "no-cache");
+      },
+      success: function (res) {
+        resolve({ data: res });
+      },
+      error: function (error) {
+        reject(error);
+      },
+    });
+  });
+}
 const typeLis = {
   "临床表现": "symptom",
   "疾病名称": "disease",
@@ -108,6 +128,7 @@ const typeLisName = {
 module.exports = {
   post,
   api,
+  get,
   typeLisName,
   typeLis,
   getUrlArgObject,

+ 200 - 79
src/js/graphMap.js

@@ -1,5 +1,5 @@
 const echarts = require("echarts");
-const { post, api, getUrlArgObject } = require('./api.js');
+const { post, get, api, getUrlArgObject } = require('./api.js');
 const iconUp = require('./../resources/images/iconUp.png');
 const iconDown = require('./../resources/images/iconDown.png');
 
@@ -10,31 +10,76 @@ let disease = getUrlArgObject("disease")
 
 //关系图
 function getGraph(val, type) {
-    return post(api.getGraph, {
-        "inputStr": val,
-        "labelName": type
-    }).then(res => {
-        if (res.data.code == 0) {
-            // select_type = select_type_noSearch
-            $('#searchInp').val(val)
-            drawGraph(res.data.data, null)
-            window.graphTxt = val
-            window.refreshTree = true
-
-            if (type != select_type) {
-                select_type = type
+    let url = ""
+    let params = null
+
+    if (window.knowledgeMapSetting.self) {
+        url = api.getSelfGraph
+        params = {
+            "input_str": val,
+            "label_name": type,
+            "user_id": localStorage.getItem("userId") ? +JSON.parse(localStorage.getItem("userId")) : -1
+        }
+        return get(url, params).then(res => {
+
+            if (res.data.code === 200) {
+                let records = res.data.records[0].records || []
+                for (let i = 0; i < records.node.length; i++) {
+                    records.node[i].label = records.node[i].name
+                    records.node[i].name = i + 1
+                }
+                // console.log("getSelfGraph", records.node)
+                // select_type = select_type_noSearch
+                $('#searchInp').val(val)
+                window.graphTxt = val
+                window.refreshTree = true
+                // console.log(val, type, window.select_type)
+                window.select_type = type
+                select_type_noSearch = type
                 let renderTabInfo = getTab(type)
                 renderTab(renderTabInfo)
+                addRecord(val, type)
+                setSelectName(select_type)
+                drawGraph(records, null)
+            } else {
+                let nodeStr
+                nodeStr = '<li class="ellipsis">暂无符合数据</li>'
+                $(".tabNameList").html(nodeStr)
+                $(".tabNameList").show()
+                window.refreshTree = false
             }
-            addRecord(val, type)
-        } else {
-            let nodeStr
-            nodeStr = '<li class="ellipsis">暂无符合数据</li>'
-            $(".tabNameList").html(nodeStr)
-            $(".tabNameList").show()
-            window.refreshTree = false
+        })
+    } else {
+        url = api.getGraph
+        params = {
+            "inputStr": val,
+            "labelName": type
         }
-    })
+        return post(url, params).then(res => {
+            if (res.data.code == 0) {
+                // select_type = select_type_noSearch
+                $('#searchInp').val(val)
+                drawGraph(res.data.data, null)
+                window.graphTxt = val
+                window.refreshTree = true
+
+                if (type != select_type) {
+                    select_type = type
+                    let renderTabInfo = getTab(type)
+                    renderTab(renderTabInfo)
+                }
+                addRecord(val, type)
+            } else {
+                let nodeStr
+                nodeStr = '<li class="ellipsis">暂无符合数据</li>'
+                $(".tabNameList").html(nodeStr)
+                $(".tabNameList").show()
+                window.refreshTree = false
+            }
+        })
+    }
+
+
 }
 
 function reDrawGraph(name, label) {
@@ -47,69 +92,145 @@ function reDrawGraph(name, label) {
         label = $(".selectedName").html().trim()
         name = $("#searchInp").val().trim()
     }
-    post(api.getGraph, {
-        "inputStr": name,
-        "labelName": label
-    }).then(res => {
-        if (res.data.code == 0) {
-            res.data.data.node.forEach(node => {
-                if (!node.itemStyle.display && node.label && node.symbol == 'circle') {
-                    node.symbol = 'pin'
-                    // node.symbolSize = [node.symbolSize * 1.5, node.symbolSize]
+    let url = ""
+    let params = null
+    if (window.knowledgeMapSetting.self) {
+        url = api.getSelfGraph
+        params = {
+            "input_str": name,
+            "label_name": label,
+            "user_id": localStorage.getItem("userId") ? JSON.parse(localStorage.getItem("userId")) : -1
+        }
+        get(url, params).then(res => {
+            if (res.data.code == 0) {
+                res.data.data.node.forEach(node => {
+                    if (!node.itemStyle.display && node.label && node.symbol == 'circle') {
+                        node.symbol = 'pin'
+                        // node.symbolSize = [node.symbolSize * 1.5, node.symbolSize]
+                    }
+                });
+                window.graphMapUpdatedData = res.data.data
+                let expandPropertyNodes = [] //要展开节点的数据
+                let currentNode = null //当前显示信息的节点
+                let legendData = null //新的图例数据
+                for (let i = 0; i < window.graphMapUpdatedData.node.length; i++) {
+                    const node = window.graphMapUpdatedData.node[i]
+                    // console.log(window.knowledgeMapSetting.currentNodeId, node.nodeId)
+                    if (node.nodeId === window.knowledgeMapSetting.currentNodeId) {
+                        currentNode = node
+                    }
+                    for (let j = 0; j < window.knowledgeMapSetting.expandPropertyId.length; j++) {
+                        const expandNodeId = window.knowledgeMapSetting.expandPropertyId[j]
+                        if (expandNodeId === node.nodeId) {
+                            expandPropertyNodes.push(node)
+                        }
+                    }
                 }
-            });
-            window.graphMapUpdatedData = res.data.data
-            let expandPropertyNodes = [] //要展开节点的数据
-            let currentNode = null //当前显示信息的节点
-            let legendData = null //新的图例数据
-            for (let i = 0; i < window.graphMapUpdatedData.node.length; i++) {
-                const node = window.graphMapUpdatedData.node[i]
-                // console.log(window.knowledgeMapSetting.currentNodeId, node.nodeId)
-                if (node.nodeId === window.knowledgeMapSetting.currentNodeId) {
-                    currentNode = node
+                window.knowledgeMapSetting.legends = window.graphMapUpdatedData.categories.slice(2)
+                //重新计算showLegendNum
+                reShowLegendNum()
+                if (window.knowledgeMapSetting.showLegendAll) {
+                    legendData = window.knowledgeMapSetting.legends.map(el => el.name)
+                } else {
+                    legendData = window.knowledgeMapSetting.legends.slice(0, window.knowledgeMapSetting.showLegendNum).map(el => el.name)
                 }
-                for (let j = 0; j < window.knowledgeMapSetting.expandPropertyId.length; j++) {
-                    const expandNodeId = window.knowledgeMapSetting.expandPropertyId[j]
-                    if (expandNodeId === node.nodeId) {
-                        expandPropertyNodes.push(node)
+
+                expandPropertyNodePad(expandPropertyNodes) //添加展开属性节点
+                reNodeCloseAndExpand(legendData) //添加隐藏节点
+                window.graphMap.setOption({
+                    legend: [{
+                        data: legendData
+                    }],
+                    series: [{
+                        edgeLabel: {
+                            formatter: function (x) {
+                                if (x.data.hideLabel) {
+                                    return " ";
+                                }
+                                else {
+                                    return x.data.value;  //横线关系
+                                }
+                            },
+                        },
+                        categories: window.graphMapUpdatedData.categories,
+                        type: 'graph',
+                        data: window.graphMapUpdatedData.node,  // 更新节点数据
+                        links: window.graphMapUpdatedData.links,  // 更新边数据
+                    }]
+                }, false);  // 仅更新指定的部分,不重绘图表
+                rightMsgRender(currentNode) //重新渲染右侧数据
+            }
+        })
+    } else {
+        url = api.getGraph
+        params = {
+            "inputStr": name,
+            "labelName": label
+        }
+        post(url, params).then(res => {
+            if (res.data.code === 200) {
+                let records = res.data.records[0].records
+                records.node.forEach(node => {
+                    if (!node.itemStyle.display && node.label && node.symbol == 'circle') {
+                        node.symbol = 'pin'
+                        // node.symbolSize = [node.symbolSize * 1.5, node.symbolSize]
+                    }
+                });
+                window.graphMapUpdatedData = records
+                let expandPropertyNodes = [] //要展开节点的数据
+                let currentNode = null //当前显示信息的节点
+                let legendData = null //新的图例数据
+                for (let i = 0; i < window.graphMapUpdatedData.node.length; i++) {
+                    const node = window.graphMapUpdatedData.node[i]
+                    // console.log(window.knowledgeMapSetting.currentNodeId, node.nodeId)
+                    if (node.nodeId === window.knowledgeMapSetting.currentNodeId) {
+                        currentNode = node
+                    }
+                    for (let j = 0; j < window.knowledgeMapSetting.expandPropertyId.length; j++) {
+                        const expandNodeId = window.knowledgeMapSetting.expandPropertyId[j]
+                        if (expandNodeId === node.nodeId) {
+                            expandPropertyNodes.push(node)
+                        }
                     }
                 }
-            }
-            window.knowledgeMapSetting.legends = window.graphMapUpdatedData.categories.slice(2)
-            //重新计算showLegendNum
-            reShowLegendNum()
-            if (window.knowledgeMapSetting.showLegendAll) {
-                legendData = window.knowledgeMapSetting.legends.map(el => el.name)
-            } else {
-                legendData = window.knowledgeMapSetting.legends.slice(0, window.knowledgeMapSetting.showLegendNum).map(el => el.name)
-            }
+                window.knowledgeMapSetting.legends = window.graphMapUpdatedData.categories.slice(2)
+                //重新计算showLegendNum
+                reShowLegendNum()
+                if (window.knowledgeMapSetting.showLegendAll) {
+                    legendData = window.knowledgeMapSetting.legends.map(el => el.name)
+                } else {
+                    legendData = window.knowledgeMapSetting.legends.slice(0, window.knowledgeMapSetting.showLegendNum).map(el => el.name)
+                }
 
-            expandPropertyNodePad(expandPropertyNodes) //添加展开属性节点
-            reNodeCloseAndExpand(legendData) //添加隐藏节点
-            window.graphMap.setOption({
-                legend: [{
-                    data: legendData
-                }],
-                series: [{
-                    edgeLabel: {
-                        formatter: function (x) {
-                            if (x.data.hideLabel) {
-                                return " ";
-                            }
-                            else {
-                                return x.data.value;  //横线关系
-                            }
+                expandPropertyNodePad(expandPropertyNodes) //添加展开属性节点
+                reNodeCloseAndExpand(legendData) //添加隐藏节点
+                window.graphMap.setOption({
+                    legend: [{
+                        data: legendData
+                    }],
+                    series: [{
+                        edgeLabel: {
+                            formatter: function (x) {
+                                if (x.data.hideLabel) {
+                                    return " ";
+                                }
+                                else {
+                                    return x.data.value;  //横线关系
+                                }
+                            },
                         },
-                    },
-                    categories: window.graphMapUpdatedData.categories,
-                    type: 'graph',
-                    data: window.graphMapUpdatedData.node,  // 更新节点数据
-                    links: window.graphMapUpdatedData.links,  // 更新边数据
-                }]
-            }, false);  // 仅更新指定的部分,不重绘图表
-            rightMsgRender(currentNode) //重新渲染右侧数据
-        }
-    })
+                        categories: window.graphMapUpdatedData.categories,
+                        type: 'graph',
+                        data: window.graphMapUpdatedData.node,  // 更新节点数据
+                        links: window.graphMapUpdatedData.links,  // 更新边数据
+                    }]
+                }, false);  // 仅更新指定的部分,不重绘图表
+                rightMsgRender(currentNode) //重新渲染右侧数据
+            }
+        })
+    }
+
+
 
 }
 function reShowLegendNum() {

+ 33 - 20
src/js/home.js

@@ -130,7 +130,7 @@ const vm = new Vue({
           title: '知识图谱查询',
           name: 'knowledgeGraph',
           content: './knowledgeGraph.html'
-        },
+        }
       ],
       currentPage: {
         id: "knowledgeGraph",
@@ -150,7 +150,13 @@ const vm = new Vue({
               url: "./knowledgeGraph.html",
               title: "知识图谱查询",
               children: null
-            }
+            },
+            {
+              id: "selfKnowledgeGraph",
+              url: "./knowledgeGraph.html?self=true&input=头痛&label=症状",
+              title: '自构建图谱查询',
+              children: null
+            },
           ]
         },
         {
@@ -164,29 +170,35 @@ const vm = new Vue({
               url: "./knowledgeUpdate.html",
               title: "知识更新",
               children: null
-            }
-          ]
-        },
-        {
-          id: "3",
-          url: "",
-          title: "系统管理",
-          label: "./images/layer10@2x.png",
-          children: [
-            {
-              id: "userManage",
-              url: "",
-              title: "用户管理",
-              children: null
             },
             {
-              id: "permissionManage",
+              id: "selfKnowledgeUpdate",
               url: "",
-              title: "权限管理",
+              title: '自构建图谱更新',
               children: null
-            }
+            },
           ]
         },
+        // {
+        //   id: "3",
+        //   url: "",
+        //   title: "系统管理",
+        //   label: "./images/layer10@2x.png",
+        //   children: [
+        //     {
+        //       id: "userManage",
+        //       url: "",
+        //       title: "用户管理",
+        //       children: null
+        //     },
+        //     {
+        //       id: "permissionManage",
+        //       url: "",
+        //       title: "权限管理",
+        //       children: null
+        //     }
+        //   ]
+        // },
         {
           id: "4",
           url: "",
@@ -1031,10 +1043,11 @@ const vm = new Vue({
       });
     },
     handleLogin(event) {
-      const { type, username } = event.data
+      const { type, username, userId } = event.data
       if (type === 'login') {
         this.username = username
         window.localStorage.setItem('username', JSON.stringify(username))
+        window.localStorage.setItem('userId', JSON.stringify(userId))
       }
     }
   },

+ 35 - 3
src/js/index.js

@@ -27,18 +27,21 @@ const { drawGraph, updateTree, getGraph, getTree, getNode, getTab, renderTab, se
     setSelectName, hideHideTab, hideSlide, reDrawGraph } = require('./graphMap.js');
 /**右侧侧边栏折叠*/
 let isRightCollapse = false
+let self = getUrlArgObject("self") ? true : false;
 let input = getUrlArgObject("input") || ""
 let label = getUrlArgObject("label") || ""
 let noTree = getUrlArgObject("no-tree") || false
+let disease = getUrlArgObject("disease")
 window.select_type = "疾病";
 window.select_type_noSearch = "疾病";
 window.refreshTree = true
-let disease = getUrlArgObject("disease")
+
 // 用来存储节点操作的数据
 window.knowledgeMapData = {}//当前右键节点数据
 window.graphMapUpdatedData = null //实时更新的关系图数据
 window.graphMap = null //当前关系图实例对象
 window.knowledgeMapSetting = {
+    self: self,
     operation: "view", //操作类型,修改
     draggable: true, //是否能拖拽节点
     zTree: !noTree,//是否有zTree
@@ -83,11 +86,40 @@ $(window).resize(function () {
 //     console.log("notTree", notTree)
 
 // }
+function getTree2(data) {
+    if (data.type == "疾病") {
+        getTree(1, 1, data.label);
+
+    } else if (data.type == "药品") {
+        getTree(0, 2, data.label);
+
+    } else if (data.type == "症状") {
+
+        getTree(0, 3, data.label);
+
+    }
+    // else if (data.type == "手术和操作") {
+    //     getTree(0, 4, data.label);
+    // } 
+    else if (data.type == "实验室检查") {
+        getTree(0, 5, data.label);
 
+    } else if (data.type == "辅助检查") {
+        getTree(0, 6, data.label);
+
+    }
+}
 //关系图
 getGraph(disease || input || "艾滋病", label || select_type);
-getTree(1, 1, disease || "艾滋病");
-$('#searchInp').val(disease || "艾滋病")
+
+
+// getTree(1, 1, disease || input || "艾滋病");
+getTree2({
+    type: label || select_type,
+    label: disease || input || "艾滋病",
+})
+// $('#searchInp').val(disease || input || "艾滋病")
+
 
 //选择类型
 $('.select').click(function (e) {

+ 3 - 2
webpack.config.js

@@ -8,6 +8,7 @@ const ExtractTextPlugin = require("extract-text-webpack-plugin");
 const webpack = require('webpack');
 // const proxyHost = "http://173.18.12.195:5050";
 const proxyHost = "http://173.18.12.205:8086/healsphere";
+// const proxyHost = "http://192.18.1.235:8000/open-platform"
 // const proxyHost = "http://192.168.3.113:5050";
 // const proxyHost = "http://173.18.12.192:5050";
 module.exports = {
@@ -281,8 +282,8 @@ module.exports = {
           '^/api': ''  // 重写路径,去掉/api前缀
         },
       },
-      '/kg': { //知识图谱统计API
-        target: "http://173.18.12.205:8086/healsphere",
+      '/open-platform': { //知识图谱统计API
+        target: "http://192.18.1.235:8000",
         changeOrigin: true,
       }
     },