专业搜索

src/views/search/components/ProfessionSearch.vue

@@ -0,0 +1,438 @@
+<template>
+  <div>
+    <div class="content-box">
+      <!-- 病历搜索 -->
+      <div class="search-box">
+        <div class="row-box">
+          <el-row v-for="(item, index) of rows" :key="index" style="margin-bottom: 16px;">
+            <el-col :span="4">
+              <el-select v-model="item.region" placeholder="请选择">
+                <el-option label="且" :value="0"></el-option>
+                <el-option label="或" :value="1"></el-option>
+                <el-option label="不包含" :value="2"></el-option>
+              </el-select>
+            </el-col>
+            <el-col :span="5">
+              <el-cascader
+                v-model="item.value"
+                :options="bl"
+                :props="{
+                  label: 'name',
+                  value: 'key',
+                  expandTrigger: 'hover'
+                }">
+              </el-cascader>
+            </el-col>
+            <el-col :span="11">
+              <el-input v-model="item.input" placeholder="请输入"></el-input>
+            </el-col>
+            <el-col :span="4">
+              <el-button type="primary" icon="el-icon-plus" circle size="mini" style="margin-left: 16px; margin-top: 5px;" @click="onPlus"></el-button>
+              <el-button type="primary" icon="el-icon-minus" circle size="mini" @click="onMinus(index)"></el-button>
+            </el-col>
+          </el-row>
+        </div>
+      </div>
+      <!-- 信息搜索 -->
+      <div class="info-search">
+        <el-form :inline="true" :model="formInline" class="demo-form-inline">
+          <el-form-item label="住院号码">
+            <el-input v-model="formInline.user" placeholder="请输入"></el-input>
+          </el-form-item>
+          <el-form-item label="出院科室">
+            <el-select v-model="formInline.user" filterable placeholder="请选择">
+              <el-option v-for="(item, index) in departmentList" :key="index" :label="item.name" :value="item.name" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="出院时间">
+            <el-date-picker
+              v-model="formInline.startTime"
+              type="date"
+              format="yyyy年MM月dd日"
+              value-format="yyyyMMdd"
+              placeholder="开始日期"
+              :picker-options="pickerOptions"
+              style="margin-right: 10px;"
+            />
+            <el-date-picker
+              v-model="formInline.endTime"
+              type="date"
+              format="yyyy年MM月dd日"
+              value-format="yyyyMMdd"
+              placeholder="结束日期"
+              :picker-options="pickerOptions"
+            />
+          </el-form-item>
+        </el-form>
+        <el-collapse v-model="activeNames" @change="handleChange" style="margin-top: -40px; border: none;">
+          <el-collapse-item title="" name="1">
+            <el-form :inline="true" :model="formInline2" class="demo-form-inline2">
+              <el-form-item label="姓名">
+                <el-input v-model="formInline2.user" placeholder="请输入"></el-input>
+              </el-form-item>
+              <el-form-item label="性别">
+                <el-input v-model="formInline2.user" placeholder="请输入"></el-input>
+              </el-form-item>
+              <el-form-item label="入院时间">
+                <el-date-picker
+                  v-model="formInline2.startTime"
+                  type="date"
+                  format="yyyy年MM月dd日"
+                  value-format="yyyyMMdd"
+                  placeholder="开始日期"
+                  :picker-options="pickerOptions"
+                  style="margin-right: 10px;"
+                />
+                <el-date-picker
+                  v-model="formInline2.endTime"
+                  type="date"
+                  format="yyyy年MM月dd日"
+                  value-format="yyyyMMdd"
+                  placeholder="结束日期"
+                  :picker-options="pickerOptions"
+                />
+              </el-form-item>
+              <el-form-item label="住院天数">
+                <el-input placeholder="起始天数" v-model="formInline2.AAC04_start" style="width: 180px; margin-right: 10px;">
+                  <template slot="append">天</template>
+                </el-input>
+                <el-input placeholder="终止天数" v-model="formInline2.AAC04_end" style="width: 180px;">
+                  <template slot="append">天</template>
+                </el-input>
+              </el-form-item>
+              <el-form-item label="年龄">
+                <el-input placeholder="起始年龄" v-model="formInline2.AAC04_start" style="width: 220px; margin-right: 10px;">
+                  <el-select v-model="formInline2.ageType" slot="append" placeholder="请选择">
+                    <el-option label="天" value="1"></el-option>
+                    <el-option label="岁" value="2"></el-option>
+                  </el-select>
+                </el-input>
+                <el-input placeholder="终止年龄" v-model="formInline2.AAC04_end" style="width: 220px;">
+                  <el-select v-model="formInline2.ageType" slot="append" placeholder="请选择">
+                    <el-option label="天" value="1"></el-option>
+                    <el-option label="岁" value="2"></el-option>
+                  </el-select>
+                </el-input>
+              </el-form-item>
+              <el-form-item label="体温">
+                <el-input placeholder="起始体温" v-model="formInline2.AAC04_start" style="width: 180px; margin-right: 10px;">
+                  <template slot="append">℃</template>
+                </el-input>
+                <el-input placeholder="终止体温" v-model="formInline2.AAC04_end" style="width: 180px;">
+                  <template slot="append">℃</template>
+                </el-input>
+              </el-form-item>
+            </el-form>
+          </el-collapse-item>
+        </el-collapse>
+        <el-button type="primary" class="search-btn">检 索</el-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      pickerOptions: {
+        disabledDate(time) {
+          return time.getTime() > Date.now();
+        },
+      },
+      rows: [{
+        region: 0,
+        value: '',
+        input: ''
+      }],
+      form: {
+        region: 0,
+        value: '',
+        input: ''
+      },
+      "bl": [{
+          "key": "RYJL",
+          "name": "入院记录",
+          "children": [{
+              "key": "RYJL_HJNR",
+              "name": "整体",
+              "type": "input",
+              "value": []
+            },
+            {
+              "key": "RYJL_ZHS",
+              "name": "主诉",
+              "type": "input",
+              "value": []
+            },
+            {
+              "key": "RYJL_XBS",
+              "name": "现病史",
+              "type": "input",
+              "value": []
+            },
+            {
+              "key": "RYJL_JWS",
+              "name": "既往史",
+              "type": "input",
+              "value": []
+            },
+            {
+              "key": "RYJL_GRS",
+              "name": "个人史",
+              "type": "input",
+              "value": []
+            },
+            {
+              "key": "RYJL_YJJHYS",
+              "name": "月经及婚育史+婚育史",
+              "type": "input",
+              "value": []
+            },
+            {
+              "key": "RYJL_JZS",
+              "name": "家族史",
+              "type": "input",
+              "value": []
+            },
+            {
+              "key": "RYJL_TGJC",
+              "name": "体格检查",
+              "type": "input",
+              "value": []
+            },
+            {
+              "key": "RYJL_ZHUANKE",
+              "name": "专科检查",
+              "type": "input",
+              "value": []
+            },
+            {
+              "key": "RYJL_FZJC",
+              "name": "辅助检查",
+              "type": "input",
+              "value": []
+            },
+            {
+              "key": "RYJL_CBZD",
+              "name": "初步诊断",
+              "type": "input",
+              "value": []
+            },
+            {
+              "key": "RYJL_CBZB_FIRST",
+              "name": "第一初步诊断",
+              "type": "input",
+              "value": []
+            }
+          ]
+        },
+        {
+          "key": "BCJL",
+          "name": "病程记录",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "SSJL",
+          "name": "手术记录",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "CYJL",
+          "name": "出院记录",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "SWJL",
+          "name": "死亡记录",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "23XSNJLL",
+          "name": "24小时内记录类",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "YZB",
+          "name": "医嘱单",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "BGD",
+          "name": "报告单",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "FYMC",
+          "name": "费用明细",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "ZYZDMC",
+          "name": "主要诊断名称",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "ZYZDBM",
+          "name": "主要诊断编码",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "QTZDMC",
+          "name": "其他诊断名称",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "QTZDBM",
+          "name": "其他诊断编码",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "ZYSSMC",
+          "name": "主要手术名称",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "ZYSSBM",
+          "name": "主要手术编码",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "QTSSMC",
+          "name": "其他手术名称",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "QTSSBM",
+          "name": "其他手术编码",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "SQTYL",
+          "name": "授权同意类",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "YHGTL",
+          "name": "医患沟通类",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "BLTLJL",
+          "name": "病历讨论记录",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "PGPFB",
+          "name": "评估评分表类",
+          "type": "input",
+          "value": []
+        },
+        {
+          "key": "YLCYBG",
+          "name": "医疗常用表格",
+          "type": "input",
+          "value": []
+        }
+      ],
+      formInline: {
+        user: '',
+        startTime: '',
+        endTime: ''
+      },
+      formInline2: {
+        ageType: '1',
+        user: '',
+        startTime: '',
+        endTime: '',
+        AAC04_start: '',
+        AAC04_end: ''
+      },
+      departmentList: []
+    }
+  },
+  created() {
+    this.selectInfo()
+  },
+  methods: {
+    // 获取科室
+    selectInfo() {
+      this.$axios.post('/selectInfo').then(res => {
+        this.departmentList = res.data.department;
+      });
+    },
+    // 新增一行
+    onPlus() {
+      this.rows.push({
+        region: 0,
+        value: '',
+        input: ''
+      })
+    },
+    // 减一行
+    onMinus(index) {
+      this.rows.splice(index, 1)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.content-box {
+  background: #fff;
+  border-radius: 5px;
+  margin: 20px;
+  .search-box {
+    .row-box {
+      width: 800px;
+      margin: 0 auto 16px;
+    }
+  }
+  .info-search {
+    margin-top: 20px;
+    .demo-form-inline {
+      width: 1110px;
+      margin: 0 auto;
+    }
+  }
+  .search-btn {
+    width: 240px;
+    display: block;
+    margin: 0 auto;
+  }
+}
+::v-deep .el-input-group__append {
+  width: 65px;
+}
+::v-deep .el-form--inline .el-form-item {
+  margin-right: 20px;
+}
+::v-deep .el-collapse-item__arrow {
+  margin-top: -50px;
+}
+:v-deep .is-active .el-collapse-item__header {
+  border-bottom: none !important;
+}
+:v-deep .is-active .el-collapse-item__wrap {
+  border-bottom: none !important;
+}
+</style>

src/views/search/index.vue

@@ -5,9 +5,11 @@
         <el-radio-group v-model="choice" class="bnts" size="medium">
           <el-radio-button :label="0">普通检索</el-radio-button>
           <el-radio-button :label="1">高级检索</el-radio-button>
+          <el-radio-button :label="2">专业检索</el-radio-button>
         </el-radio-group>
       </div>
       <div class="bnh" />
+      <!-- 普通检索 -->
       <div v-if="choice == 0" class="bnh">
         <el-form :inline="true" class="demo-form-inline">
           <el-form-item label="">
@@ -40,7 +42,14 @@
         </el-form>
         <div style="margin: 15px" />
       </div>
-      <div v-else class="barBtn">
+      <div v-if="choice == 0" class="fBtn" style="position: relative">
+        <el-button type="primary" icon="el-icon-download" style="position: absolute; right: 220px" @click="normalDownload('病历-普通搜索')">导出execl</el-button>
+        <el-select v-model="formData0.input1" style="position: absolute; right: 0px" placeholder="检索历史" @change="funSetList()">
+          <el-option v-for="(item, index) in setList" :key="index" :label="item" :value="item" />
+        </el-select>
+      </div>
+      <!-- 高级检索 -->
+      <div v-if="choice == 1" class="barBtn">
         <el-form ref="form" :model="formData1" label-width="100px">
           <el-form-item v-for="(item, index) in formData1.seniorList" :key="index">
             <!-- 下拉框开始 -->
@@ -155,12 +164,8 @@
         <el-button class="btn11" @click="reset">重置条件</el-button>
         <el-button class="btn2" @click="searchBtn(1)">检索</el-button>
       </div>
-      <div v-else class="fBtn" style="position: relative">
-        <el-button type="primary" icon="el-icon-download" style="position: absolute; right: 220px" @click="normalDownload('病历-普通搜索')">导出execl</el-button>
-        <el-select v-model="formData0.input1" style="position: absolute; right: 0px" placeholder="检索历史" @change="funSetList()">
-          <el-option v-for="(item, index) in setList" :key="index" :label="item" :value="item" />
-        </el-select>
-      </div>
+      <!-- 专业检索 -->
+      <ProfessionSearchVue v-if="choice == 2" />
     </div>
     <div class="tableBox">
       <div class="flextab" style="margin: 0; margin-bottom: 30px; display: block">
@@ -275,11 +280,13 @@ import Title from '@/components/Title';
 import { mapGetters } from 'vuex';
 import mPagination from '@/components/m-pagination';
 import { bassNormalSearchDownload, bassHighSearchDownload } from '@/api/excel';
+import ProfessionSearchVue from './components/ProfessionSearch.vue';
 
 export default {
   components: {
     Title,
     mPagination,
+    ProfessionSearchVue
   },
   computed: {
     ...mapGetters(['name']),

src/views/search/index1.vue

@@ -1,165 +0,0 @@
-<template>
-  <div id="MyDiv">
-    <!-- <m-breadcrumb :data="breadData"></m-breadcrumb> -->
-    <div class="cont">
-      <div class="title-text">
-        <span>详情页</span>
-      </div>
-      <div class="cont_container">
-        <div class="block">
-          <el-slider v-model="value" :step="10" show-stops :show-tooltip="false" :marks="marks" @input="funChang()"></el-slider>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-  <script>
-// import OtherComponent from '@/components/OtherComponent'
-export default {
-  name: 'passwordManagement',
-  components: {
-    // OtherComponent
-  },
-  directives: {},
-  filters: {},
-  extends: {},
-  mixins: {},
-  props: {},
-  data() {
-    return {
-      breadData: [
-        {
-          path: '',
-          text: '个人中心',
-        },
-        {
-          path: '',
-          text: '密码管理',
-        },
-      ],
-      value: [0, 10],
-      marks: {
-        0: '2020/01/52',
-        10: '2020/01/52',
-        20: '2020/01/52',
-        30: '2020/01/52',
-        40: '2020/01/52',
-        50: '2020/01/52',
-        60: '2020/01/52',
-        70: '2020/01/52',
-        80: '2020/01/52',
-        90: '2020/01/52',
-        100: '2020/01/52',
-      },
-    };
-  },
-  computed: {},
-  watch: {},
-  beforeCreate() {
-    // 生命周期钩子：组件实例刚被创建，组件属性计算之前，如 data 属性等
-  },
-  created() {
-    // 生命周期钩子：组件实例创建完成，属性已绑定，但 DOM 还未生成，el 属性还不存在
-    // 初始化渲染页面
-  },
-  beforeMount() {
-    // 生命周期钩子：模板编译/挂载之前
-  },
-  mounted() {
-    this.funQuery();
-    // 生命周期钩子：模板编译、挂载之后（此时不保证已在 document 中）
-  },
-  beforeUpate() {
-    // 生命周期钩子：组件更新之前
-  },
-  updated() {
-    // 生命周期钩子：组件更新之后
-  },
-  activated() {
-    // 生命周期钩子：keep-alive 组件激活时调用
-  },
-  deactivated() {
-    // 生命周期钩子：keep-alive 组件停用时调用
-  },
-  beforeDestroy() {
-    // 生命周期钩子：实例销毁前调用
-  },
-  destroyed() {
-    // 生命周期钩子：实例销毁后调用
-  },
-  errorCaptured(err, vm, info) {
-    // 生命周期钩子：当捕获一个来自子孙组件的错误时被调用。此钩子会收到三个参数：错误对象、发生错误的组件实例以及一个包含错误来源信息的字符串。
-    console.log(err, vm, info);
-  },
-  methods: {
-    funQuery() {
-      let entTime = new Date('2021-11-23 0:00:00');
-      let sterTime = new Date('2021-11-22 0:00:00');
-      let timeer = Date.parse(entTime) - Date.parse(sterTime);
-      let timeerNum = timeer / 10;
-    //   let newdata = new Date(Date.parse(sterTime) + timeerNum * 2).toLocaleString();
-      let marks = [];
-      for (let item = 1; item < 10; item++) {
-        marks.push({
-          time: new Date(Date.parse(sterTime) + timeerNum * item).toLocaleString(),
-        });
-      }
-      //   for(let item in ){
-      console.log(marks);
-      this.marks = {
-        0: '2021-11-22 0:00:00',
-        10: marks[0].time,
-        20: marks[1].time,
-        30: marks[2].time,
-        40: marks[3].time,
-        50: marks[4].time,
-        60: marks[5].time,
-        70: marks[6].time,
-        80: marks[7].time,
-        90: marks[8].time,
-        100: '2021-11-23 0:00:00',
-      };
-      console.log(this.marks);
-    },
-    funChang() {
-      console.log(this.value);
-      console.log(this.marks[this.value]);
-    },
-  },
-};
-</script>
-  <style lang='scss' scoped>
-#MyDiv {
-  margin: 0;
-  padding: 0;
-}
-.cont {
-  width: 1200px;
-  margin: 0 auto;
-  min-height: 650px;
-  background: #ffffff;
-  margin-bottom: 21px;
-  padding: 0 24px;
-}
-.title-text {
-  font-size: 16px;
-  color: #333333;
-  padding: 25px 0 30px 0px;
-  img {
-    width: 17px;
-    height: 14px;
-    margin-right: 8px;
-  }
-}
-.cont_container {
-  margin-top: 60px;
-  display: flex;
-  justify-content: center;
-  flex-direction: column;
-  align-items: center;
-}
-.block {
-  width: 1000px;
-}
-</style>
-  

src/views/search/index33.vue

@@ -0,0 +1,257 @@
+<template>
+  <div>
+    <div class="content-box">
+      <div class="search-box">
+        <div class="row-box">
+          <el-row>
+            <el-col :span="4">
+              <el-select v-model="form.region" placeholder="请选择">
+                <el-option label="且" :value="0"></el-option>
+                <el-option label="或" :value="1"></el-option>
+                <el-option label="不包含" :value="2"></el-option>
+              </el-select>
+            </el-col>
+            <el-col :span="5">
+              <el-cascader
+                v-model="form.value"
+                :options="options"
+                :props="{ expandTrigger: 'hover' }">
+              </el-cascader>
+            </el-col>
+            <el-col :span="11">
+              <el-input v-model="form.input" placeholder="请输入"></el-input>
+            </el-col>
+            <el-col :span="4">
+              <el-button type="primary" icon="el-icon-plus" circle size="mini" style="margin-left: 16px; margin-top: 5px;"></el-button>
+              <el-button type="primary" icon="el-icon-minus" circle size="mini"></el-button>
+            </el-col>
+          </el-row>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    data() {
+      return {
+        form: {
+          region: 0,
+          value: '',
+          input: ''
+        },
+        options: [{
+          value: 'zhinan',
+          label: '指南',
+          children: [{
+            value: 'shejiyuanze',
+            label: '设计原则',
+            children: [{
+              value: 'yizhi',
+              label: '一致'
+            }, {
+              value: 'fankui',
+              label: '反馈'
+            }, {
+              value: 'xiaolv',
+              label: '效率'
+            }, {
+              value: 'kekong',
+              label: '可控'
+            }]
+          }, {
+            value: 'daohang',
+            label: '导航',
+            children: [{
+              value: 'cexiangdaohang',
+              label: '侧向导航'
+            }, {
+              value: 'dingbudaohang',
+              label: '顶部导航'
+            }]
+          }]
+        }, {
+          value: 'zujian',
+          label: '组件',
+          children: [{
+            value: 'basic',
+            label: 'Basic',
+            children: [{
+              value: 'layout',
+              label: 'Layout 布局'
+            }, {
+              value: 'color',
+              label: 'Color 色彩'
+            }, {
+              value: 'typography',
+              label: 'Typography 字体'
+            }, {
+              value: 'icon',
+              label: 'Icon 图标'
+            }, {
+              value: 'button',
+              label: 'Button 按钮'
+            }]
+          }, {
+            value: 'form',
+            label: 'Form',
+            children: [{
+              value: 'radio',
+              label: 'Radio 单选框'
+            }, {
+              value: 'checkbox',
+              label: 'Checkbox 多选框'
+            }, {
+              value: 'input',
+              label: 'Input 输入框'
+            }, {
+              value: 'input-number',
+              label: 'InputNumber 计数器'
+            }, {
+              value: 'select',
+              label: 'Select 选择器'
+            }, {
+              value: 'cascader',
+              label: 'Cascader 级联选择器'
+            }, {
+              value: 'switch',
+              label: 'Switch 开关'
+            }, {
+              value: 'slider',
+              label: 'Slider 滑块'
+            }, {
+              value: 'time-picker',
+              label: 'TimePicker 时间选择器'
+            }, {
+              value: 'date-picker',
+              label: 'DatePicker 日期选择器'
+            }, {
+              value: 'datetime-picker',
+              label: 'DateTimePicker 日期时间选择器'
+            }, {
+              value: 'upload',
+              label: 'Upload 上传'
+            }, {
+              value: 'rate',
+              label: 'Rate 评分'
+            }, {
+              value: 'form',
+              label: 'Form 表单'
+            }]
+          }, {
+            value: 'data',
+            label: 'Data',
+            children: [{
+              value: 'table',
+              label: 'Table 表格'
+            }, {
+              value: 'tag',
+              label: 'Tag 标签'
+            }, {
+              value: 'progress',
+              label: 'Progress 进度条'
+            }, {
+              value: 'tree',
+              label: 'Tree 树形控件'
+            }, {
+              value: 'pagination',
+              label: 'Pagination 分页'
+            }, {
+              value: 'badge',
+              label: 'Badge 标记'
+            }]
+          }, {
+            value: 'notice',
+            label: 'Notice',
+            children: [{
+              value: 'alert',
+              label: 'Alert 警告'
+            }, {
+              value: 'loading',
+              label: 'Loading 加载'
+            }, {
+              value: 'message',
+              label: 'Message 消息提示'
+            }, {
+              value: 'message-box',
+              label: 'MessageBox 弹框'
+            }, {
+              value: 'notification',
+              label: 'Notification 通知'
+            }]
+          }, {
+            value: 'navigation',
+            label: 'Navigation',
+            children: [{
+              value: 'menu',
+              label: 'NavMenu 导航菜单'
+            }, {
+              value: 'tabs',
+              label: 'Tabs 标签页'
+            }, {
+              value: 'breadcrumb',
+              label: 'Breadcrumb 面包屑'
+            }, {
+              value: 'dropdown',
+              label: 'Dropdown 下拉菜单'
+            }, {
+              value: 'steps',
+              label: 'Steps 步骤条'
+            }]
+          }, {
+            value: 'others',
+            label: 'Others',
+            children: [{
+              value: 'dialog',
+              label: 'Dialog 对话框'
+            }, {
+              value: 'tooltip',
+              label: 'Tooltip 文字提示'
+            }, {
+              value: 'popover',
+              label: 'Popover 弹出框'
+            }, {
+              value: 'card',
+              label: 'Card 卡片'
+            }, {
+              value: 'carousel',
+              label: 'Carousel 走马灯'
+            }, {
+              value: 'collapse',
+              label: 'Collapse 折叠面板'
+            }]
+          }]
+        }, {
+          value: 'ziyuan',
+          label: '资源',
+          children: [{
+            value: 'axure',
+            label: 'Axure Components'
+          }, {
+            value: 'sketch',
+            label: 'Sketch Templates'
+          }, {
+            value: 'jiaohu',
+            label: '组件交互文档'
+          }]
+        }]
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+.content-box {
+  background: #fff;
+  border-radius: 5px;
+  margin: 20px;
+  min-height: 400px;
+  .search-box {
+    .row-box {
+      width: 800px;
+      margin: 0 auto;
+    }
+  }
+}
+</style>