ICD10

src/css/homeStatic.less

@@ -1,4 +1,4 @@
-@import './common.less';
+@import "./common.less";
 
 .staticWrap {
   .staticTopCenter {
@@ -10,7 +10,7 @@
   }
   .staticTop {
     height: 450px;
-    background-color: #2A9BD5;
+    background-color: #2a9bd5;
   }
   .staticTopLogo {
     margin-bottom: 40px;
@@ -23,18 +23,20 @@
     ul {
       text-align: left;
     }
-    li {
-      /*display: inline-block;*/
-      float: left;
-      font-size: 16px;
-      color: #fff;
-      margin: 0 2% 10px;
-      cursor: pointer;
-      padding-bottom: 2px;
-      border-bottom: 2px solid #2A9BD5;
-    }
-    .tabFst {
-      border-bottom: 2px solid #fff;
+    .knowledge {
+      li {
+        /*display: inline-block;*/
+        float: left;
+        font-size: 16px;
+        color: #fff;
+        margin: 0 2% 10px;
+        cursor: pointer;
+        padding-bottom: 2px;
+        border-bottom: 2px solid #2a9bd5;
+      }
+      .tabFst {
+        border-bottom: 2px solid #fff;
+      }
     }
   }
   .staticTopSearch {
@@ -79,8 +81,8 @@
   .foryou {
     width: 100%;
     text-align: center;
-    margin:180px 0 50px 0;
-    img{
+    margin: 180px 0 50px 0;
+    img {
       width: 47%;
       max-width: 647px;
     }
@@ -92,4 +94,58 @@
       width: 100%;
     }
   }
-}
+}
+.staticTopTab {
+  margin-top: 20px;
+}
+.selectItem {
+  width: 146px;
+  height: 60px;
+  background: #ffffff;
+  border-radius: 4px;
+  position: absolute;
+  left: -156px;
+  cursor: pointer;
+  .arrow {
+    width: 17px;
+    height: 17px;
+    vertical-align: middle;
+  }
+  .selc-list {
+    background: #ffffff;
+    border-radius: 4px;
+    padding: 8px 0;
+    display: none;
+    & li {
+      height: 34px;
+      font-size: 16px;
+      font-weight: 400;
+      color: #666666;
+      line-height: 36px;
+      padding: 0 8px;
+    }
+    & li:hover {
+      background: #edfaff;
+      color: #2a9bd5;
+    }
+    .active {
+      background: #edfaff;
+      color: #2a9bd5;
+    }
+  }
+}
+.code-list {
+  display: none;
+  & li {
+    float: left;
+    font-size: 16px;
+    color: #fff;
+    margin: 0 2% 10px;
+    cursor: pointer;
+    padding-bottom: 2px;
+    border-bottom: 2px solid #2a9bd5;
+  }
+  .code-active {
+    border-bottom: 2px solid #fff;
+  }
+}

src/css/searchStaticList.less

@@ -1,4 +1,4 @@
-@import './common.less';
+@import "./common.less";
 
 .staticListWrap {
   position: absolute;
@@ -8,20 +8,20 @@
   min-width: 900px;*/
   padding: 60px 20px 20px;
   box-sizing: border-box;
-  background-color: #DDE2E4;
+  background-color: #dde2e4;
   /*overflow: auto;*/
   .staticMainWrap {
     background-color: #fff;
     padding: 0 60px 20px 60px;
   }
   .staticResult {
-      .loading{
-        text-align: center;
-        img{
-          width: 50px;
-          height: 50px;
-        }
+    .loading {
+      text-align: center;
+      img {
+        width: 50px;
+        height: 50px;
       }
+    }
   }
   .staticTopCenter {
     width: 100%;
@@ -34,32 +34,41 @@
     background-color: @staticMainColor;
   }
   .staticTopLogo {
-      height: 25px;
-      margin-top: 16px;
-      margin-left: 50px;
+    height: 25px;
+    margin-top: 16px;
+    margin-left: 50px;
   }
   .staticTopTab {
-    padding-top: 20px;
+    padding-top: 35px;
     background-color: #fff;
     ul {
       text-align: left;
-      max-width: 750px;
-    }
-    li {
-      float: left;
-      font-size: 16px;
-      color: #333;
-      margin: 0 2% 10px;
-      cursor: pointer;
-      padding-bottom: 2px;
+      max-width: 900px;
     }
-    .tabFst {
-      color: @staticMainColor;
+    .knowledge {
+      li {
+        float: left;
+        font-size: 16px;
+        color: #333;
+        margin: 0 5px 10px;
+        cursor: pointer;
+        padding-bottom: 2px;
+        padding: 8px 14px;
+        border-radius: 17px;
+        background: #a0c4d7;
+        color: #ffffff;
+      }
+      .tabFst {
+        padding: 8px 14px;
+        border-radius: 17px;
+        background: #63889b;
+        color: #ffffff;
+      }
     }
   }
   .staticTopSearch {
     width: 95.3%;
-    max-width: 750px;
+    max-width: 900px;
     height: 50px;
     line-height: 50px;
     background-color: #fff;
@@ -69,6 +78,7 @@
     position: relative;
     overflow: hidden;
     border: 1px solid #979797;
+    top: 20px;
     input {
       height: 50px;
       line-height: 50px;
@@ -76,6 +86,7 @@
       float: left;
       width: 100%;
       padding: 0 30px;
+      margin-left: 146px;
     }
     .searchBtn {
       width: 75px;
@@ -101,7 +112,7 @@
   .foryou {
     width: 100%;
     text-align: center;
-    margin:80px 0 50px 0;
+    margin: 80px 0 50px 0;
     color: #333;
     font-size: 30px;
     font-weight: bold;
@@ -114,198 +125,268 @@
     }
   }
   .navTab {
-      height: 70px;
-      line-height: 70px;
-      a {
-        text-decoration: none;
-        color: @staticMainColor;
-      }
+    height: 70px;
+    line-height: 70px;
+    a {
+      text-decoration: none;
+      color: @staticMainColor;
+    }
   }
 }
 .staticResult {
-    .resultItem {
-      padding: 14px 38px;
-      background-color: #EDFAFF;
-      margin-bottom: 14px;
-        cursor: pointer;
-        div {
-            line-height: 20px;
-            span {
-                display: inline-block;
-            }
-            margin-bottom: 10px;
-        }
+  .resultItem,.resultItem2 {
+    padding: 14px 38px;
+    background-color: #edfaff;
+    margin-bottom: 14px;
+    cursor: pointer;
+    div {
+      line-height: 20px;
+      span {
+        display: inline-block;
+      }
+      margin-bottom: 10px;
     }
-  .icon{
-    border:1px #4F9FF3 solid;
-    color: #4F9FF3;
+  }
+  .icon {
+    border: 1px #4f9ff3 solid;
+    color: #4f9ff3;
     border-radius: 11px;
     display: inline-block;
     width: 58px;
     height: 20px;
     text-align: center;
-    margin:0 6px 0 20px;
-    &.gicon{
-      border-color:#1ECEBD;
-      color: #1ECEBD;
+    margin: 0 6px 0 20px;
+    &.gicon {
+      border-color: #1ecebd;
+      color: #1ecebd;
     }
   }
-  .code{
-    color:#999;
+  .code {
+    color: #999;
     word-break: break-all;
   }
-    .type {
-        border-radius: 3px;
-        color: #fff;
-        padding: 0 5px;
-        background-color: @staticMainColor;
+  .type {
+    border-radius: 3px;
+    color: #fff;
+    padding: 0 5px;
+    background-color: @staticMainColor;
+  }
+  .code {
+    font-size: 14px;
+    color: #999;
+    margin-left: 10px;
+  }
+  .drug {
+    color: @staticMainColor;
+    margin-left: 10px;
+  }
+  .notice {
+    border: 1px solid @staticMainColor;
+    color: @staticMainColor;
+    border-radius: 3px;
+    margin-left: 10px;
+    padding: 0 5px;
+  }
+  .same {
+    color: #666;
+  }
+  .content {
+    word-break: break-all;
+    max-height: 40px;
+    overflow: hidden;
+  }
+  .resultItemEmpty {
+    text-align: center;
+    display: none;
+    img {
+      width: 358px;
     }
-    .code{
-      font-size: 14px;
+    p {
       color: #999;
-        margin-left: 10px;
-    }
-    .drug{
-        color: @staticMainColor;
-        margin-left: 10px;
-    }
-    .notice{
-        border: 1px solid @staticMainColor;
-        color: @staticMainColor;
-        border-radius: 3px;
-        margin-left: 10px;
-        padding: 0 5px;
-    }
-    .same {
-        color: #666;
-    }
-    .content {
-        word-break: break-all;
-        max-height: 40px;
-        overflow: hidden;
-    }
-    .resultItemEmpty {
-        text-align: center;
-        display: none;
-        img {
-            width: 358px;
-        }
-        p {
-            color: #999;
-        }
     }
+  }
 }
-
-
-.pagination{
-    margin: 35px 0 20px 0  ;
-    text-align: right;
-    .goNum {
-        input::-webkit-outer-spin-button,
-        input::-webkit-inner-spin-button {
-            -webkit-appearance: none;
-        }
-      font-size: 12px;
-        input {
-          width: 25px;
-          height: 22px;
-          line-height: 22px;
-            text-align: center;
-            border-radius: 3px;
-            border: 1px solid @staticMainColor;
-            color: @staticMainColor;
-            box-sizing: border-box;
-        }
-    }
-    .select {
-      font-size: 12px;
-        color: @staticMainColor;
-      height: 22px;
-      line-height: 22px;
-        border: 1px solid @staticMainColor;
-        border-radius: 3px;
-        box-sizing: border-box;
-        position: relative;
-        margin-right: 10px;
-        outline: none;
-      background: none;
+.resultItem2{
+  div{
+    margin-bottom: 0;
+  }
+  .drug{
+    color: #333;
+    margin-left: 34px;
+  }
+}
+.pagination {
+  margin: 35px 0 20px 0;
+  text-align: right;
+  .goNum {
+    input::-webkit-outer-spin-button,
+    input::-webkit-inner-spin-button {
+      -webkit-appearance: none;
     }
-    .totalSum{
-        display: inline-block;
-        font-size:12px;
+    font-size: 12px;
+    input {
+      width: 25px;
       height: 22px;
       line-height: 22px;
-        color: @staticMainColor;
-        margin-right: 10px;
-        position: relative;
+      text-align: center;
+      border-radius: 3px;
+      border: 1px solid @staticMainColor;
+      color: @staticMainColor;
+      box-sizing: border-box;
     }
-    .pageNum,.prePage,.nextPage, .more{
-      font-size: 12px;
-        display: inline-block;
-        box-sizing: border-box;
-      /*width: 30px;
+  }
+  .select {
+    font-size: 12px;
+    color: @staticMainColor;
+    height: 22px;
+    line-height: 22px;
+    border: 1px solid @staticMainColor;
+    border-radius: 3px;
+    box-sizing: border-box;
+    position: relative;
+    margin-right: 10px;
+    outline: none;
+    background: none;
+  }
+  .totalSum {
+    display: inline-block;
+    font-size: 12px;
+    height: 22px;
+    line-height: 22px;
+    color: @staticMainColor;
+    margin-right: 10px;
+    position: relative;
+  }
+  .pageNum,
+  .prePage,
+  .nextPage,
+  .more {
+    font-size: 12px;
+    display: inline-block;
+    box-sizing: border-box;
+    /*width: 30px;
       height: 30px;*/
-        line-height: 30px;
-        cursor: pointer;
-        margin: 0 10px 0 0;
-        text-align: center;
-        color: @staticMainColor;
-        border-radius: 3px;
-    }
+    line-height: 30px;
+    cursor: pointer;
+    margin: 0 10px 0 0;
+    text-align: center;
+    color: @staticMainColor;
+    border-radius: 3px;
+  }
   .pageNum {
     text-decoration: underline;
   }
-    .prePage,.nextPage{
-        img{
-            position: relative;
-            top: 0px   ;
-        }
-    }
-     .more{
-        cursor: not-allowed;
-    }
-    .arrowPage{
-      width: 10px;
-    }
-    .activePage{
-      color: #FE7D3D;
-      text-decoration: none;
-    }
-    
-    .tipIcon{
-      color: #777;
-      cursor: pointer;
-      display: inline-block;
-      margin-left: 6px;
-      margin-right: 2px;
+  .prePage,
+  .nextPage {
+    img {
+      position: relative;
+      top: 0px;
     }
-    .toolTipIcon{
-        width: 18px;
-        position: relative;
-        top: 3px;
+  }
+  .more {
+    cursor: not-allowed;
+  }
+  .arrowPage {
+    width: 10px;
+  }
+  .activePage {
+    color: #fe7d3d;
+    text-decoration: none;
+  }
+
+  .tipIcon {
+    color: #777;
+    cursor: pointer;
+    display: inline-block;
+    margin-left: 6px;
+    margin-right: 2px;
+  }
+  .toolTipIcon {
+    width: 18px;
+    position: relative;
+    top: 3px;
+  }
+
+  .tooltip {
+    visibility: hidden;
+    position: relative;
+    padding: 7px 10px;
+    border-radius: 4px;
+    margin: 100px auto;
+    background-color: #4d4d4d;
+    text-align: center;
+    color: #fff;
+    font-size: 14px;
+  }
+  .tooltip:before {
+    content: "";
+    display: block;
+    position: absolute;
+    bottom: 9px;
+    left: -12px;
+    border-bottom: 6px solid transparent;
+    border-top: 6px solid transparent;
+    border-left: 6px solid transparent;
+    border-right: 6px solid #4d4d4d;
+  }
+}
+.selectItem {
+  width: 146px;
+  height: 48px;
+  line-height: 50px;
+  background: #ffffff;
+  position: absolute;
+  border: 1px solid #979797;
+  cursor: pointer;
+  text-align: center;
+  top: 80px;
+  z-index: 99;
+  .arrow {
+    width: 17px;
+    height: 17px;
+    vertical-align: middle;
+  }
+  .selc-list {
+    background: #ffffff;
+    border-radius: 4px;
+    padding: 8px 0;
+    display: none;
+    & li {
+      height: 34px;
+      font-size: 16px;
+      font-weight: 400;
+      color: #666666;
+      line-height: 36px;
+      padding: 0 8px;
     }
-    
-    .tooltip{
-        visibility: hidden;
-        position: relative;
-        padding: 7px 10px;
-        border-radius: 4px;
-        margin: 100px auto;
-        background-color: #4D4D4D;
-        text-align: center;
-        color: #fff;
-        font-size: 14px;
+    & li:hover {
+      background: #edfaff;
+      color: #2a9bd5;
     }
-    .tooltip:before{
-        content: '';
-        display: block;
-        position: absolute;
-        bottom: 9px;
-        left: -12px;
-        border-bottom: 6px solid transparent;
-        border-top: 6px solid transparent;
-        border-left: 6px solid transparent;
-        border-right: 6px solid #4D4D4D;
+    .active {
+      background: #edfaff;
+      color: #2a9bd5;
     }
-    
+  }
+}
+.code-list {
+  display: none;
+  & li {
+    float: left;
+    font-size: 16px;
+    color: #333;
+    margin: 0 5px 10px;
+    cursor: pointer;
+    padding-bottom: 2px;
+    padding: 8px 14px;
+    border-radius: 17px;
+    background: #a0c4d7;
+    color: #ffffff;
+  }
+  .code-active {
+    padding: 8px 14px;
+    border-radius: 17px;
+    background: #63889b;
+    color: #ffffff;
+  }
 }

src/js/homeStatic.js

@@ -1,45 +1,47 @@
 require('./../css/homeStatic.less');
 
 const $ = require("jquery");
-const {post, config,} = require('./promise.js');
-const {toggleWarnBox} = require('./util.js');
-let searchType = 0;
+const { post, config, } = require('./promise.js');
+const { toggleWarnBox } = require('./util.js');
+let searchType = 0,codeType = 1,codeVal = 1;
 require('./../images/staticBgS.png').replace(/^undefined/g, '')
 require('./../images/staticLogo.png').replace(/^undefined/g, '')
 require('./../images/staticBg.png').replace(/^undefined/g, '')
 require('./../images/word.png').replace(/^undefined/g, '')
-
-$(function(){
+require('./../images/icon-down.png').replace(/^undefined/g, '')
+const iconDown = require('./../images/icon-down.png').replace(/^undefined/g, '')
+const iconUp = require('./../images/up-icon.png').replace(/^undefined/g, '')
+$(function () {
   getAllTypes()
   goSearchList()
 });
 //tab
-function renderTab(data){
+function renderTab(data) {
   let str = '';
   for (let i = 0; i < data.length; i++) {
     const element = data[i];
-    str += `<li class="${i==0?'tabFst':''}" data-id="${element.val}">${element.name}</li>`
+    str += `<li class="${i == 0 ? 'tabFst' : ''}" data-id="${element.val}">${element.name}</li>`
   }
-  $('.staticTopTab ul').html(str)
-  $(".staticTopTab li").click(function(){
+  $('.staticTopTab .knowledge').html(str)
+  $(".staticTopTab .knowledge li").click(function () {
     searchType = $(this).attr('data-id')
-    $(this).css({borderColor:'#fff'}).siblings().css({borderColor:'#2A9BD5'})
+    $(this).css({ borderColor: '#fff' }).siblings().css({ borderColor: '#2A9BD5' })
   })
 }
 //搜索跳转
-function goSearchList(){
-  $(".searchBtn").click(function(){
+function goSearchList() {
+  $(".searchBtn").click(function () {
     let vals = $('.searchStr').val().replace(/(^\s*)|(\s*$)/g, "")
-      if (!vals) {
-          $(".staticResult .loading").hide();
-          toggleWarnBox('检索词不能为空！');
-          return;
-      }
-    window.location.href = './searchStaticList.html?type='+searchType+'&inputStr='+vals
+    if (!vals) {
+      $(".staticResult .loading").hide();
+      toggleWarnBox('检索词不能为空！');
+      return;
+    }
+    window.location.href = './searchStaticList.html?type=' + searchType + '&inputStr=' + vals+ '&codeType=' + codeType+ '&codeVal=' + codeVal
   })
 }
 //获取字典信息
-function getAllTypes(){
+function getAllTypes() {
   /*const allTypes = localStorage.getItem('allTypes')&&JSON.parse(localStorage.getItem('allTypes'))||[];
   if(allTypes.length>0){
     renderTab(allTypes)
@@ -47,8 +49,8 @@ function getAllTypes(){
   }*/
   post(config.dictionaryInfo, {}).then((res) => {
     const result = res.data
-    if(result.code==='0'){
-      const data = result.data[7]||[];
+    if (result.code === '0') {
+      const data = result.data[7] || [];
       //localStorage.setItem('allTypes',JSON.stringify(data))
       renderTab(data)
     }
@@ -56,7 +58,46 @@ function getAllTypes(){
 }
 
 $(function () {
-    $(".warning-box .confirm,.warning-box .close").click(function () {
-        toggleWarnBox();
-    })
-});
+  $(".warning-box .confirm,.warning-box .close").click(function () {
+    toggleWarnBox();
+  })
+
+  $(".selectItem").click(function (e) {
+    e.stopPropagation()
+    const showList = $(".selc-list ").css("display")
+    if (showList == "none" || !showList) {
+      $(".selc-list").css('display', 'block')
+      $(".selectItem .arrow").attr("src", iconUp)
+    } else {
+      $(".selc-list").css('display', 'none')
+      $(".selectItem .arrow").attr("src", iconDown)
+    }
+
+  })
+  $(".selc-list li").click(function (e) {
+    e.stopPropagation()
+    codeVal = $(this).attr('data-val')
+    $(".searchStr").val('')
+    $(this).addClass('active').siblings().removeClass('active');
+    $(".seleName").html($(this).text())
+    $(".selc-list").css('display', 'none')
+    $(".selectItem .arrow").attr("src", iconDown)
+    if(codeVal == 1){
+      $(".staticTopTab .code-list").css('display','none')
+      $(".staticTopTab .knowledge").css('display','block')
+    }else{
+      $(".staticTopTab .code-list").css('display','block')
+      $(".staticTopTab .knowledge").css('display','none')
+    }
+  })
+
+  $(".staticTopTab .code-list li").click(function () {
+    codeType = $(this).attr('data-id')
+    $(this).css({ borderColor: '#fff' }).siblings().css({ borderColor: '#2A9BD5' })
+  })
+});
+
+$(document).on("click", function () {
+  $(".selc-list").css('display', 'none')
+  $(".selectItem .arrow").attr("src", iconDown)
+})

src/js/searchStaticList.js

@@ -1,13 +1,14 @@
 require('./../css/searchStaticList.less');
 
 const $ = require("jquery");
-const { post,config,getUrlArgObject,openNewWin } = require('./promise.js');
-const {toggleWarnBox} = require('./util.js');
+const { post, config, getUrlArgObject, openNewWin } = require('./promise.js');
+const { toggleWarnBox } = require('./util.js');
 
-let searchType = 0, inputStr = '', curPage = 1, size = 10, totalPage = 1;
+let searchType = 0, inputStr = '', curPage = 1, size = 10, totalPage = 1, codeType = 1, codeVal = 1;
 searchType = getUrlArgObject('type') || 0
 inputStr = getUrlArgObject('inputStr') || ''
-
+codeType = getUrlArgObject('codeType') || 1
+codeVal = getUrlArgObject('codeVal') || 1
 let arrowLeft = require('./../images/leftpage.png').replace(/^undefined/g, '')
 let arrowRight = require('./../images/rightpage.png').replace(/^undefined/g, '')
 require('./../images/staticBgS.png').replace(/^undefined/g, '')
@@ -15,202 +16,238 @@ require('./../images/staticLogo.png').replace(/^undefined/g, '')
 require('./../images/staticBg.png').replace(/^undefined/g, '')
 require('./../images/nolis.png').replace(/^undefined/g, '')
 require('./../images/warn.png').replace(/^undefined/g, '')
-
-$(function(){
-  initData()
-  getAllTypes()
-  getSearchList()
-  getTabData()
+require('./../images/icon-down.png').replace(/^undefined/g, '')
+const iconDown = require('./../images/icon-down.png').replace(/^undefined/g, '')
+const iconUp = require('./../images/up-icon.png').replace(/^undefined/g, '')
+$(function () {
+    initData()
+    getAllTypes()
+    getSearchList()
+    getTabData()
 });
 //tab
-function renderTab(data){
+function renderTab(data) {
     let str = '';
     for (let i = 0; i < data.length; i++) {
-      const element = data[i];
-      str += `<li class="${i==0?'tabFst':''}" data-id="${element.val}">${element.name}</li>`
+        const element = data[i];
+        str += `<li class="${i == 0 ? 'tabFst' : ''}" data-id="${element.val}">${element.name}</li>`
     }
-    $('.staticTopTab ul').html(str)
-    $('.staticTopTab li[data-id='+searchType+']').css({color:'#2A9BD5'}).siblings().css({color:'#333'});
-    $(".staticTopTab li").click(function(){
-      searchType = $(this).attr('data-id')
-      $(this).css({color:'#2A9BD5'}).siblings().css({color:'#333'})
+    $('.staticTopTab .knowledge').html(str)
+    $('.staticTopTab .knowledge li[data-id=' + searchType + ']').addClass('tabFst').siblings().removeClass('tabFst')
+    $(".staticTopTab .knowledge li").click(function () {
+        searchType = $(this).attr('data-id')
+        $(this).addClass('tabFst').siblings().removeClass('tabFst')
     })
-  }
+}
 //获取字典信息
-function getAllTypes(){
+function getAllTypes() {
     /*const allTypes = localStorage.getItem('allTypes')&&JSON.parse(localStorage.getItem('allTypes'))||[];
     if(allTypes.length>0){
       renderTab(allTypes)
       return
     }*/
     post(config.dictionaryInfo, {}).then((res) => {
-      const result = res.data
-      if(result.code==='0'){
-        const data = result.data[7]||[];
-        //localStorage.setItem('allTypes',JSON.stringify(data))
-        renderTab(data)
-      }
+        const result = res.data
+        if (result.code === '0') {
+            const data = result.data[7] || [];
+            //localStorage.setItem('allTypes',JSON.stringify(data))
+            renderTab(data)
+        }
     })
-  }
-function getSearchList(){
-    $(".searchBtn").click(function(){
+}
+function getSearchList() {
+    $(".searchBtn").click(function () {
         $(".resultItemWrap,.pagination").html("");
         $(".staticResult .loading").show();
-        curPage=1;
+        curPage = 1;
         getTabData()
     })
 }
-function getTabData(){
+function getTabData() {
     let vals = $('.searchStr').val().trim();
     if (!vals) {
         $(".staticResult .loading").hide();
         toggleWarnBox('检索词不能为空！');
         return;
     }
-    let param = {
-        size,
-        current:curPage,
-        types:[+searchType],
-        inputStr:vals
+    let url, param
+    if (codeVal == 1) {
+        url = config.staticSearch
+        param = {
+            size,
+            current: curPage,
+            types: [+searchType],
+            inputStr: vals
+        }
+    } else {
+        url = config.diseaseIndex
+        param = {
+            current: curPage,
+            size: size,
+            inputStr: vals,
+            type: codeVal
+        }
     }
     $(".resultItemEmpty").hide();
-    post(config.staticSearch,param).then((res) => {
-      const result = res.data
-      if(result.code == 0) {
-        const data = result.data;
-        tabList = data.records;
-          totalPage = data.pages;
-        const totalNum = data.total;
-        renderList(tabList);
-        if(totalNum > 0){
-            renderPagination(totalPage,Number(curPage),totalNum)
-        } else{
-            $('.pagination').html("")
+    post(url, param).then((res) => {
+        const result = res.data
+        if (result.code == 0) {
+            const data = result.data;
+            tabList = data.records;
+            totalPage = data.pages;
+            const totalNum = data.total;
+            renderList(tabList);
+            if (totalNum > 0) {
+                renderPagination(totalPage, Number(curPage), totalNum)
+            } else {
+                $('.pagination').html("")
+            }
         }
-      }
     })
 }
-function renderList(tabList){
+function renderList(tabList) {
     $(".staticResult .loading").hide();
-    if(tabList.length == 0){
+    if (tabList.length == 0) {
         $('.pagination').html('')
         $(".resultItemWrap").html('');
-        $(".resultItemEmpty").css({display:'block'});
+        $(".resultItemEmpty").css({ display: 'block' });
         return
     }
     let str = ''
-    for(let i = 0;i<tabList.length;i++){
+    for (let i = 0; i < tabList.length; i++) {
         let item = tabList[i]
-        str += `
+        str += codeVal == 1 ? `
             <div class="resultItem" data-type="${item.type}" data-name="${item.name}">
                 <div>
                     <span class="type">${item.typeName}</span>
                     <span class="drug">${item.name}</span>
-                    ${item.code ?`<span class="icon">医保版</span><span class="name">${item.name}</span><span class="code">${item.code}</span>`:''}
-                    ${(item.guoname||item.guocode) ?`<span class="icon gicon">国临版</span><span class="name">${item.guoname}</span><span class="code">${item.guocode}</span>`:''}
+                    ${item.code ? `<span class="icon">医保版</span><span class="name">${item.name}</span><span class="code">${item.code}</span>` : ''}
+                    ${(item.guoname || item.guocode) ? `<span class="icon gicon">国临版</span><span class="name">${item.guoname}</span><span class="code">${item.guocode}</span>` : ''}
 					</div>
-${item.retrievalName?`<div class="same">同义词：<span>${item.retrievalName}</span></div>`:''}
+${item.retrievalName ? `<div class="same">同义词：<span>${item.retrievalName}</span></div>` : ''}
                 <div class="content">
                     <p>${item.abstractContent ? item.abstractContent : ''}</p>
                 </div>
             </div>
-        `
+        `: `
+        <div class="resultItem2">
+            <div>
+                <span class="code">${item.code}</span>
+                <span class="drug">${item.name}</span>
+                </div>
+        </div>
+    `
     }
     $(".resultItemWrap").html(str);
-    $('.resultItem').click(function(){
+    $('.resultItem').click(function () {
         let name = $(this).attr('data-name')
         let type = $(this).attr('data-type')
-        if(window.opener){
+        if (window.opener) {
             openNewWin(`./staticInfo.html?name=${name}&type=${type}`);
-        }else{
+        } else {
             window.open(`./staticInfo.html?name=${name}&type=${type}`);
         }
     })
     window.scrollTo(0, 0);
 }
-function initData(){
-    if(searchType){
-        $('.staticTopTab li').eq(searchType).css({color:'#2A9BD5'}).siblings().css({color:'#333'})
+function initData() {
+    if (searchType) {
+        $('.staticTopTab .knowledge li').eq(searchType).addClass('tabFst').siblings().removeClass('tabFst')
+    }
+    if (codeType) {
+        $('.staticTopTab .code-list li[data-id=' + codeType + ']').addClass('code-active').siblings().removeClass('code-active')
     }
-    if(inputStr){
+    if (codeVal) {
+        $('.selectItem .selc-list li[data-val=' + codeVal + ']').addClass('active').siblings().removeClass('active')
+        val = codeVal == 1 ? '医学静态知识' : 'ICD10编码查询'
+        $(".seleName").html(val)
+        if (codeVal == 1) {
+            $(".staticTopTab .knowledge").css('display', 'block')
+            $(".staticTopTab .code-list").css('display', 'none')
+        } else {
+            $(".staticTopTab .knowledge").css('display', 'none')
+            $(".staticTopTab .code-list").css('display', 'block')
+        }
+    }
+    if (inputStr) {
         $(".searchStr").val(inputStr)
     }
 }
 
 // 分页
-function renderPagination(totalPage,activePage,totalNum){
+function renderPagination(totalPage, activePage, totalNum) {
     let str = `<span class="totalSum">共${totalNum}条</span>
         <select class="select">
-            <option value="10" ${size==10?'selected':''}>10条/页</option>
-            <option value="50" ${size==50?'selected':''}>50条/页</option>
-            <option value="100" ${size==100?'selected':''}>100条/页</option>
-            <option value="500" ${size==500?'selected':''}>500条/页</option>
-            <option value="1000" ${size==1000?'selected':''}>1000条/页</option>
-            <option value="5000" ${size==5000?'selected':''}>5000条/页</option>
+            <option value="10" ${size == 10 ? 'selected' : ''}>10条/页</option>
+            <option value="50" ${size == 50 ? 'selected' : ''}>50条/页</option>
+            <option value="100" ${size == 100 ? 'selected' : ''}>100条/页</option>
+            <option value="500" ${size == 500 ? 'selected' : ''}>500条/页</option>
+            <option value="1000" ${size == 1000 ? 'selected' : ''}>1000条/页</option>
+            <option value="5000" ${size == 5000 ? 'selected' : ''}>5000条/页</option>
         </select>
         <span class="prePage">
             <img class="arrowPage" src=${arrowLeft} />
         </span>
     `
-    if(totalPage <= 6){
-        for(let i = 1; i <= totalPage; i++){
-            str += `<span class="pageNum ${'page'+i}" data-page=${i}>${i}</span>`
+    if (totalPage <= 6) {
+        for (let i = 1; i <= totalPage; i++) {
+            str += `<span class="pageNum ${'page' + i}" data-page=${i}>${i}</span>`
         }
-    }else{
-        if(activePage <= 3){ //选中页数小于4
-            for(let i = 1; i <= 4; i++){
-                str += `<span class="pageNum ${'page'+i}" data-page=${i}>${i}</span>`
+    } else {
+        if (activePage <= 3) { //选中页数小于4
+            for (let i = 1; i <= 4; i++) {
+                str += `<span class="pageNum ${'page' + i}" data-page=${i}>${i}</span>`
             }
             str += `<span class="more" >...</span>`
-            str += `<span class="pageNum ${'page'+totalPage}" data-page=${totalPage}>${totalPage}</span>`
-        } else if(activePage > totalPage -3){
+            str += `<span class="pageNum ${'page' + totalPage}" data-page=${totalPage}>${totalPage}</span>`
+        } else if (activePage > totalPage - 3) {
             str += `<span class="pageNum page1" data-page=1>1</span>`
             str += `<span class="more" >...</span>`
-            str += `<span class="pageNum ${'page'+(totalPage-3)}" data-page=${totalPage -3}>${totalPage -3}</span>`
-            str += `<span class="pageNum ${'page'+(totalPage-2)}" data-page=${totalPage -2}>${totalPage -2}</span>`
-            str += `<span class="pageNum ${'page'+(totalPage-1)}" data-page=${totalPage -1}>${totalPage -1}</span>`
-            str += `<span class="pageNum ${'page'+totalPage}" data-page=${totalPage}>${totalPage}</span>`
+            str += `<span class="pageNum ${'page' + (totalPage - 3)}" data-page=${totalPage - 3}>${totalPage - 3}</span>`
+            str += `<span class="pageNum ${'page' + (totalPage - 2)}" data-page=${totalPage - 2}>${totalPage - 2}</span>`
+            str += `<span class="pageNum ${'page' + (totalPage - 1)}" data-page=${totalPage - 1}>${totalPage - 1}</span>`
+            str += `<span class="pageNum ${'page' + totalPage}" data-page=${totalPage}>${totalPage}</span>`
         } else {
             str += `<span class="pageNum page1" data-page=1>1</span>`
             str += `<span class="more" >...</span>`
-            str += `<span class="pageNum ${'page'+(activePage -1)}" data-page=${activePage -1}>${activePage -1}</span>`
-            str += `<span class="pageNum ${'page'+activePage}" data-page=${activePage}>${activePage}</span>`
-            str += `<span class="pageNum ${'page'+(activePage +1)}" data-page=${activePage +1}>${activePage +1}</span>`
+            str += `<span class="pageNum ${'page' + (activePage - 1)}" data-page=${activePage - 1}>${activePage - 1}</span>`
+            str += `<span class="pageNum ${'page' + activePage}" data-page=${activePage}>${activePage}</span>`
+            str += `<span class="pageNum ${'page' + (activePage + 1)}" data-page=${activePage + 1}>${activePage + 1}</span>`
             str += `<span class="more" >...</span>`
-            str += `<span class="pageNum ${'page'+totalPage}" data-page=${totalPage}>${totalPage}</span>`
+            str += `<span class="pageNum ${'page' + totalPage}" data-page=${totalPage}>${totalPage}</span>`
         }
-       
+
     }
     str += `<span class="nextPage"><img class="arrowPage" src=${arrowRight} /></span>
         <span class="goNum">前往 <input type="number" value="${curPage}" /> 页</span>`
     $('.pagination').html(str)
     $('.page' + activePage).addClass('activePage')
-    $(".pageNum").on("click", function(e){
+    $(".pageNum").on("click", function (e) {
         //console.log($(this)[0])
         const activePageNow = Number($(this).attr('data-page'))
         curPage = activePageNow
         getTabData()
     })
-    $(".prePage").on("click", function(e){
+    $(".prePage").on("click", function (e) {
         let activePageNow = Number($(".activePage").attr('data-page'))
-        if(activePageNow > 1){
+        if (activePageNow > 1) {
             curPage = --activePageNow
             getTabData()
         }
     })
-    $(".nextPage").on("click", function(e){
+    $(".nextPage").on("click", function (e) {
         let activePageNow = Number($(".activePage").attr('data-page'))
-        if(activePageNow < totalPage){
+        if (activePageNow < totalPage) {
             curPage = ++activePageNow
             getTabData()
         }
     })
-    $('.select').change(function(){
+    $('.select').change(function () {
         size = $(this).val();
-        curPage=1;
+        curPage = 1;
         getTabData()
     })
-    $('.goNum input').change(function(){
+    $('.goNum input').change(function () {
         const n = $(this).val()
         if (totalPage < n || n < 1) {
             toggleWarnBox("请输入1-" + totalPage + "范围内的整数");
@@ -225,5 +262,42 @@ $(function () {
     $(".warning-box .confirm,.warning-box .close").click(function () {
         toggleWarnBox();
     })
+    $(".selectItem").click(function (e) {
+        e.stopPropagation()
+        const showList = $(".selc-list ").css("display")
+        if (showList == "none" || !showList) {
+            $(".selc-list").css('display', 'block')
+            $(".selectItem .arrow").attr("src", iconUp)
+        } else {
+            $(".selc-list").css('display', 'none')
+            $(".selectItem .arrow").attr("src", iconDown)
+        }
+
+    })
+    $(".selc-list li").click(function (e) {
+        e.stopPropagation()
+        codeVal = $(this).attr('data-val')
+        $(".searchStr").val('')
+        $(this).addClass('active').siblings().removeClass('active');
+        $(".seleName").html($(this).text())
+        $(".selc-list").css('display', 'none')
+        $(".selectItem .arrow").attr("src", iconDown)
+        if (codeVal == 1) {
+            $(".staticTopTab .code-list").css('display', 'none')
+            $(".staticTopTab .knowledge").css('display', 'block')
+        } else {
+            $(".staticTopTab .code-list").css('display', 'block')
+            $(".staticTopTab .knowledge").css('display', 'none')
+        }
+    })
+
+    $(".staticTopTab .code-list li").click(function () {
+        codeType = $(this).attr('data-id')
+        $(this).addClass('code-active').siblings().removeClass('code-active')
+    })
 });
 
+$(document).on("click", function () {
+    $(".selc-list").css('display', 'none')
+    $(".selectItem .arrow").attr("src", iconDown)
+})

src/js/staticSearch.js

@@ -33,6 +33,7 @@ if (searchType == '1') {
 $(".header-tab li").click(function () {
     // 修改tab标签样式
     tabid = $(this).attr("tabid");
+    $(".staticSearchT input").val('')
     $(this).attr("class", "choice")
     $(this).siblings().attr("class", "")
     // 获取tab ID