静态知识树

src/components/common/Crumbs.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="container clearfix" :style="{'minWidth':minWidth?minWidth:'980px'}">
+  <div class="container clearfix" :style="{'minWidth':minWidth?minWidth:'980px',position:fix?fix:'absolute'}">
     <img
       v-if="linkTo"
       class="return-btn fl"
@@ -17,7 +17,7 @@
 <script>
 export default {
   name: 'crumbs',
-  props: ['title', 'linkTo', 'minWidth', 'param'], //minWidth-有些头部选项比较多，最小宽度需要调整
+  props: ['title', 'linkTo', 'minWidth', 'param','fix'], //minWidth-有些头部选项比较多，最小宽度需要调整
   data: function() {
     return {
       isShowEllipsis: false // 是否显示文字省略号

src/components/developKnow/KnowledgeAll.vue

@@ -1,6 +1,17 @@
 <template>
   <div class="addMedicalMultRelationWrapper">
-    <crumbs :title="minTitle" linkTo="MedicalMultRelation"></crumbs>
+    <crumbs :title="minTitle" fix="fixed" linkTo="MedicalMultRelation"></crumbs>
+    <div class="tabList">
+      <ul>
+        <li>ICD10疾病类别</li>
+        <li>科室疾病类别</li>
+        <li>药物类别</li>
+        <li>症状类别</li>
+        <li>手术和操作类别</li>
+        <li>实验室检查类别</li>
+        <li>辅助检查类别</li>
+      </ul>
+    </div>
     <div class="contents">
       <div class="content">
         <div class="addBtn" v-if="list.length == 0">
@@ -76,49 +87,9 @@ import api from '@api/knowledgeTree.js';
   export default {
     name:'KnowledgeAll',
     data(){
-      const data = [
-        // {
-        //   id: 1,
-        //   label: '一级 1',
-        //   children: [{
-        //     id: 4,
-        //     label: '二级 1-1',
-        //     children: [{
-        //       id: 9,
-        //       label: '三级 1-1-1'
-        //     }, {
-        //       id: 10,
-        //       label: '三级 1-1-2'
-        //     }]
-        //   }]
-        // }, 
-        // {
-        //   id: 2,
-        //   label: '一级 2',
-        //   children: [{
-        //     id: 5,
-        //     label: '二级 2-1'
-        //   }, {
-        //     id: 6,
-        //     label: '二级 2-2'
-        //   }]
-        // }, 
-        // {
-        //   id: 3,
-        //   label: '一级 3',
-        //   children: [{
-        //     id: 7,
-        //     label: '二级 3-1'
-        //   }, {
-        //     id: 8,
-        //     label: '二级 3-2'
-        //   }]
-        // }
-      ];
-
       return{
         minTitle:'分诊人体图数据维护-添加',
-        list: JSON.parse(JSON.stringify(data)),
+        list: [],
         defaultProps: {
           children: 'nodeList',
           label: 'conceptNameType'
@@ -137,8 +108,6 @@ import api from '@api/knowledgeTree.js';
     created(){
       this.getTreeList()
     },
-    mounted(){
-    },
     watch:{
       conceptText(nextVal, prevVal) {
         if(!nextVal.trim()) {
@@ -152,26 +121,20 @@ import api from '@api/knowledgeTree.js';
     methods:{
       getTreeList(){
         api.getlistTree({}).then((res) => {
-          const result = res.data
-          const { data } = result
-          
-          const item = JSON.parse(JSON.stringify(data))
-          item.level = 0
-          item.isExpanded = false
-          item.nodeList = this.IteraNodeList(item.nodeList, [], 1)
-          this.list[0] = item
-          console.log(item,1111)
-          
-          // if(data.code == '0') {
-          //   this.message(res.data.msg||'术语关系建立成功','success');
-          //   setTimeout(() => {
-          //     //返回带搜索条件的首页
-          //     this.$router.push({name:'MedicalMultRelation',params:Object.assign({},this.$route.params,{currentPage:1})});
-          //   }, 2000);
-          // } else {
-          //   this.message(data.msg);
-          // }
-          // this.saveDisable = false;
+          const { data } = res
+          if(data.code == '0') {
+            let result = data.data
+            const item = JSON.parse(JSON.stringify(result))
+            item.level = 0
+            item.isExpanded = false
+            item.nodeList = this.IteraNodeList(item.nodeList, [], 1)
+            let arr = []
+            arr[0] = item
+            this.list = [...arr]
+          } else {
+            this.message(data.msg);
+          }
+          this.saveDisable = false;
         })
       },
       allowDrop(draggingNode, dropNode, type) {
@@ -272,7 +235,6 @@ import api from '@api/knowledgeTree.js';
         }
         
         api.getTreeSearchList({}).then((res) => {
-          console.log(res)
           const { data } = res
           if(data.code == '0') {
             this.conceptList = data.data
@@ -336,6 +298,21 @@ import api from '@api/knowledgeTree.js';
 </script>
 <style lang="less" scoped>
 @import "../../less/admin.less";
+.tabList {
+  position: fixed;
+  top: 100px;
+  ul {
+      margin: 10px 0 0 20px;
+    li {
+      float: left;
+      height: 60px;
+      line-height: 60px;
+      background-color: #fff;
+      padding: 0 20px;
+      box-sizing: border-box;
+    }
+  }
+}
 .addMedicalMultRelationWrapper {
   height: calc(100% - 70px);
 }
@@ -344,6 +321,7 @@ import api from '@api/knowledgeTree.js';
 }
 .contents {
   height: 100%;
+  padding-top: 120px;
 }
 .btn-box {
   position: absolute;