2.0改版，选项输入未完

build/webpack.dev.conf.js

@@ -34,7 +34,7 @@ const devWebpackConfig = merge(baseWebpackConfig, {
     compress: true,
     // host: HOST || config.dev.host,
     // host: '192.168.3.6',
-    host: '192.168.3.106',
+    //host: '192.168.3.106',
     port: PORT || config.dev.port,
     open: config.dev.autoOpenBrowser,
     overlay: config.dev.errorOverlay

src/common/ConfirmBox.vue

@@ -0,0 +1,89 @@
+<template>
+    <!--<van-overlay :show="show" @click="">-->
+      <div class="wrapper" :show="show" @click.stop>
+          <div class="title">
+              温馨提示
+          </div>
+          <div class="message">
+              本次问诊正在进行，确定退出？
+          </div>
+          <div class="buttonBox">
+              <span class="button okBtn" @click="confirm">确定</span>
+              <span class="button cancelBtn" @click="cancel">取消</span>
+          </div>
+      </div>
+    <!--</van-overlay>-->
+</template>
+<script>
+export default {
+    name:"ConfirmBox",
+    props:["show"],
+    methods: {
+        confirm(){
+            this.$emit("confirmDialog")
+        },
+        cancel(){
+            this.$emit("cancelDialog")
+        }
+    }
+}
+</script>
+<style lang="less" scoped>
+.wrapper{
+    position: fixed;
+  top: 45%;
+  left: 50%;
+  width: 6.4rem;
+  height: 3.36rem;
+  overflow: hidden;
+  font-size: 16px;
+  background-color: #fff;
+  border-radius: 16px;
+  -webkit-transform: translate3d(-50%, -50%, 0);
+  transform: translate3d(-50%, -50%, 0);
+  -webkit-backface-visibility: hidden;
+  backface-visibility: hidden;
+  -webkit-transition: 0.3s;
+  transition: 0.3s;
+  -webkit-transition-property: opacity, -webkit-transform;
+  transition-property: opacity, -webkit-transform;
+  transition-property: transform, opacity;
+  transition-property: transform, opacity, -webkit-transform;
+}
+.title {
+    height: .44rem;
+  line-height: .44rem;
+  font-size: .32rem;
+  color: #333;
+  width: 100%;
+  text-align: center;
+  padding: .6rem 0  .4rem 0;
+}
+.message {
+    height: .42rem;
+    line-height: .42rem;
+    font-size: .30rem;
+    color: #333;
+    width: 100%;
+    text-align: center;
+    padding: 0 0  .6rem 0;
+}
+.buttonBox {
+    position: absolute;
+    bottom: 0;
+    height: .9rem;
+    line-height: .9rem;
+    width: 100%;
+}
+.button{
+    display: inline-block;
+    width: 50%;
+    text-align: center;
+    box-sizing: border-box;
+    font-size: .32rem;
+    border: 1px solid #E6E6E6;
+}
+.okBtn {
+    color: #FF6167;
+}
+</style>

src/common/Dialog.vue

@@ -0,0 +1,73 @@
+<template>
+  <div>
+    <div class="left clearfix" v-if="item.show" @click="selectToggle(item.type,item.questionDetailList,item.order)">
+      <img src="../images/doctor.png" class="fl" />
+      <div class="content fl">
+        <p>{{item.name}}{{item.type==2?'(可多选)':''}}</p>
+      </div>
+    </div>
+    <div class="right clearfix" v-if="item.content">
+      <img src="../images/patient.png" alt class="fr" />
+      <div class="content fr">
+        <p>{{item.content}}</p>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  props:['item','idx'],
+  data() {
+    return {};
+  },
+  methods:{
+    selectToggle(type,result,order){
+      this.$emit("selectToggle",type,result,false,this.idx,order)
+    }
+  }
+};
+</script>
+<style lang="less" scoped>
+  @import "../less/base.less";
+.left {
+  margin-bottom: 0.2rem;
+  padding-top: 0.12rem;
+  padding-left: 0.24rem;
+  .content {
+    max-width: 5rem;
+    background-color: #colors[bgques];
+    border-radius: 0 0.24rem 0.24rem 0.24rem;
+    margin-top: 0.3rem;
+    font-size: 0.3rem;
+    padding: 0.24rem;
+    display: inline-block;
+  }
+  img {
+    width: 0.8rem;
+    height: 0.8rem;
+    margin-right: 0.24rem;
+  }
+}
+.right {
+  padding-top: 0.2rem;
+  margin-bottom: 0.12rem;
+  padding-right: 0.24rem;
+  .content {
+    max-width: 5rem;
+    background-color: #colors[theme];
+    border-radius: 0.24rem 0 0.24rem 0.24rem;
+    margin-top: 0.3rem;
+    font-size: 0.3rem;
+    padding: 0.24rem;
+    display: inline-block;
+    p {
+      color: #fff;
+    }
+  }
+  img {
+    width: 0.8rem;
+    height: 0.8rem;
+    margin-left: 0.24rem;
+  }
+}
+</style>

src/common/OptionInp.vue

@@ -1,10 +1,10 @@
 <!-- 带输入框选项 -->
 <template>
   <div :class="['inpbox',{'iptCheck':item.select},{'exclu':exclu}]">
-    <img class="iptimg" :src="item.select?url[0]:url[1]" alt="">
+    <!--<img class="iptimg" :src="item.select?url[0]:url[1]" alt="">-->
     <span class="prefix" v-if="msg.prefix">{{msg.prefix}}</span>
     <!-- <div class="inp" @click="preClick"> -->
-      <input :type="msg.type=='number'?'number':'text'" 
+      <input :type="msg.type=='number'?'number':'text'"
               :placeholder="msg.placeholder"
               :style="{'width':!msg.prefix&&!msg.suffix?'90%':'33%'}"
               :disabled="exclu"
@@ -73,7 +73,7 @@ import $ from 'jquery';
         // const select = this.item.select;
         if(!this.select&&this.txt){//聚焦时自动选中该项
           this.$emit('handleSelec');
-        } 
+        }
       }
     },
     watch:{
@@ -95,30 +95,28 @@ import $ from 'jquery';
     width: 100%;
     white-space: normal;
     vertical-align: middle;
-    height: .42rem;
-    line-height: .42rem;
+    height: .68rem;
+    line-height: .68rem;
     margin-bottom:.08rem;
     .prefix,.suffix{
       display: inline-block;
       vertical-align: middle;
     }
-    .iptimg {
+    /*.iptimg {
       width: .34rem;
       height: .34rem;
       margin-right: .1rem;
       position: relative;
       top: .06rem;
-    }
+    }*/
      input{
-      height: .42rem;
+      height: 100%;
       color: #4F50FF;
       font-size: .3rem;
-      border-bottom: 1px solid #CCCCCC !important;
+      border-bottom: 1px solid #E6E6E6 !important;
       border-radius: 0;
       padding-left: .05rem;
       background-color: transparent;
-      height: 0.38rem;
-      line-height: 0.38rem;
       position: relative;
       top: 1px;
       box-sizing: border-box;

src/common/Picker.vue

@@ -1,145 +1,166 @@
-<!-- 时间选择弹窗 -->
 <template>
-  <portal to="notification-outlet">
-      <div class="toast-wrap" v-if="show">
-        <div class="content">
-          <van-picker
-            :columns="columns"
-            :visible-item-count='5'
-            @change="handlechange"
-            :swipe-duration="time"
-          />
-          <div class="confBtn">
-            <div @click="getVal">确定</div>
-          </div>
+<portal to="notification-outlet">
+    <div>
+        <div class="pickerBox">
+            <div class="picker">
+                <van-picker :columns="columns"
+                    :visible-item-count = "5"
+                    :swipe-duration = "time"
+                    :item-height ="36"
+                    @change="changeTemp" />
+                <!-- <div class="selected">
+                </div> -->
+            </div>
+            <div class="conBtn">
+                <div class="confirm" @click="onConfirm">确定</div>
+            </div>
         </div>
-      <div class="mask" @click="onCancel"></div>
-      </div>
-  </portal> 
+    </div>
+
+</portal>
 </template>
-<script type="text/javascript">
-  import $ from 'jquery';
-  let num = [];
-  for(let i = 1; i <=60; i++) {
-    num.push(i)
-  }
-  let unit = ['分钟', '小时', '天', '周', '月','年'];
-  export default {
-    name:'Picker',
+<script>
+export default {
+    name:"Picker",
+    props: ["defaultIndex","num"],
     data() {
-      return {
-        columns: [
-          {
-            values:num,
-            className:'column1',
-            defaultIndex: 0
-          },
-          {
-            values:unit,
-            className:'column2',
-            defaultIndex: 2
-          },
-          // {
-          //   values:unit,
-          //   className:'column3',
-          //   defaultIndex: 2
-          // },
-        ],
-        columIndx:[0,2,2],
-        time:100
-      }
-    },
-    props:['show','picIndex'],
-    created(){//记录位置
-      this.columns[0].defaultIndex = this.columIndx[0] = this.picIndex[0] || 0;
-      this.columns[1].defaultIndex = this.columIndx[1] = this.picIndex[1] || 2;
-      // this.columns[2].defaultIndex = this.columIndx[2] = this.picIndex[2] || 2;
+        let num = [];
+        for(let i = 1; i <=60; i++) {
+          num.push(i)
+        }
+        let unit = ['分钟', '小时', '天', '周', '月','年'];
+        return {
+            columns: [
+              {
+                values:num,
+                className:'column1',
+                defaultIndex: 0
+              },
+              {
+                values:unit,
+                className:'column2',
+                defaultIndex: 2
+              },
+            ],
+            time: 100,
+            selectIndex: 0,
+            selectValue: "1天"
+        }
     },
     methods: {
-      getVal() {
-        const val1 = $(".column1 ul .van-picker-column__item--selected")[0].innerText;
-        const val2 = $(".column2 ul .van-picker-column__item--selected")[0].innerText;
-        // const val3 = $(".column3 ul .van-picker-column__item--selected")[0].innerText;
-        // 如果选两个0,则提示
-        
-        const value = val1 + val2 ;
-        console.log(this.columIndx)
-        this.$emit("comfirn",value,this.columIndx)
-        this.columns[0].defaultIndex = this.columIndx[0] || 0;
-        this.columns[1].defaultIndex = this.columIndx[1] || 2;
-        // this.columns[2].defaultIndex = this.columIndx[2] || 2;
-      },
-      onCancel() {
-        this.$emit("cancel")
-      },
-      handlechange(picker, value, colum){//关掉提示
-        for(let i=0;i<2;i++){
-          if(i == 1){
-            let tmpVal = unit.lastIndexOf(value[i]);
-            this.columIndx[i] = tmpVal;
-          }else{
-            let tmpVal = num.lastIndexOf(value[i]);
-            this.columIndx[i] = tmpVal;
-          }
-        }
-      },
-      resetIndex(){//清除时复原默认index
-        this.columIndx=[0,2,2]
-        this.columns[0].defaultIndex = 0;
-        this.columns[1].defaultIndex = 2;
-        this.columns[2].defaultIndex = 6;
-      }
+        changeTemp(picker, value, index) {
+            this.selectIndex = index;
+            this.selectValue = value.join("");
+        },
+        onConfirm() {
+            let number = this.num;
+            this.$emit('confirm', this.selectValue, this.selectIndex,++number)
+        },
+
     }
-  };
+}
 </script>
 <style lang="less" scoped>
-  @import '../less/base.less';
-  .toast-wrap{
-    .content{
-      padding-top: 7px;
-      width: 100%;
-      // height: 4.8rem;
-      height: 278px;
-      background: #fff;
-      position: fixed;
-      bottom:0;
-      left: 0;
-      box-sizing: border-box;
-      border-radius: .2rem .2rem 0 0;
-      z-index: 9999;
-      font-size: .3rem;
-      .confBtn{
-        height: 44px;
-        line-height: 44px;
-        text-align: center;
-        border-top: 1px solid #ebedf0;
-        margin-top: 7px;
-        position: relative;
-        .tip{
-          position: absolute;
-          top:-22px;
-          font-size: .24rem;
-          color: red;
-          line-height: 20px;
-          width:100%;
-          text-align: center;
-        }
-        div{
-          background: #colors[theme];
-          color: #fff;
-        }
-      }
-    }
-    .mask{
-      .mask;
-      z-index: 999;
-    }
-    /deep/.van-picker-column__item{
-      font-size: 14px;
-    }
-    /deep/.van-picker-column__item--selected {
-      color: #colors[theme];
-      font-size: 18px;
-    }
-  }
-</style>
+  @import "../less/base.less";
+.pickerBox{
+    position: fixed;
+    width: 100%;
+    height: 230px;
+    border-radius: 10px 10px 0 0;
+    background: #fff;
+    overflow-y: hidden;
+    z-index: 99;
+    bottom: 0;
+    left: 0;
+}
+.picker {
+    position: relative;
+    height: 180px;
+}
+/deep/.van-picker {
+    position: relative;
+    overflow-y: hidden;
+}
+.conBtn{
+    height: 44px;
+    line-height: 44px;
+    background: #5B99EB;
+    color: #fff;
+
+    font-size: 16px;
+    text-align: center;
+    position: absolute;
+    bottom: 0rem;
+    width: 100%;
+}
+.selected {
+    position: absolute;
+    width: 100%;
+    height: 36px;
+    background: #5B99EB;
+    top: 0;
+    opacity: .1;
+}
+.confirm{
+    color: #fff;
+}
+.mask{
+}
+/deep/.van-picker-column__item {
+    text-align: center;
+    font-size: 14px;
+    /*background: #F3F4F6;*/
+}
+/deep/.van-picker-column__item--selected{
+    /*background: #F3F4F6;*/
+    font-size: .3rem;
+    color: #colors[theme];
+}
+/deep/van-picker__columns {
+    position: relative;
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: flex;
+    cursor: grab;
+}
+/deep/.van-picker__mask {
+    position: absolute;
+    top: 0;
+    left: 0;
+    z-index: 2;
+    width: 100%;
+    height: 100%;
+    background-image: -webkit-linear-gradient(top, hsla(0, 0%, 100%, 0.9), hsla(0, 0%, 100%, 0.4)), -webkit-linear-gradient(bottom, hsla(0, 0%, 100%, 0.9), hsla(0, 0%, 100%, 0.4));
+    background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0.9), hsla(0, 0%, 100%, 0.4)), linear-gradient(0deg, hsla(0, 0%, 100%, 0.9), hsla(0, 0%, 100%, 0.4));
+    background-repeat: no-repeat;
+    background-position: top, bottom;
+    -webkit-backface-visibility: hidden;
+    backface-visibility: hidden;
+    pointer-events: none;
+}
+/deep/.van-picker__frame{
+    position: absolute;
+    top: 50%;
+    left: 0;
+    z-index: 3;
+    width: 100%;
+    -webkit-transform: translateY(-50%);
+    transform: translateY(-50%);
+    pointer-events: none;
+}
+/deep/[class*='van-hairline']::after {
+    position: absolute;
+    background: #5B99EB;
+    opacity: .1;
+    box-sizing: border-box;
+    content: ' ';
+    pointer-events: none;
+    top: -50%;
+    right: -50%;
+    bottom: -50%;
+    left: -50%;
+    border: 0 solid #ebedf0;
+    -webkit-transform: scale(0.5);
+    transform: scale(0.5);
+}
+</style>

src/common/Radio.vue

@@ -1,161 +1,171 @@
 <template>
-  <div v-if="item" class="radio-wrap bgques clearfix" :style="getStyle(detail,slide)">
-    <!-- <p v-for="(it,index) in datas.questionDetailList" :key="it.id" class="list" @click="handleClick(it,index,true)"> -->
-    <div v-for="(it,index) in datas.questionDetailList" :key="it.id" :class="['list',{'block':((it.description||it.name).indexOf('${'))!=-1}]">
-      <!-- <img :src="it.select==1?check:defaultPic"> -->
-      <span v-if="((it.description||it.name).indexOf('${'))==-1" :class="['radioCheck',{'check':it.select==1}]" @click="handleClick(it,index,true)">{{it.description||it.name}}</span>
-      <OptionInp v-else :item="it" @handleInp="inpVal($event,index)" @handleSelec="handleClick(it,index,false,true)"/>
+ <!-- <portal to="notification-outlet">-->
+  <div class="select">
+    <ul class="clearfix">
+      <li
+
+        v-for="(item,idx) in result"
+        :class="[{'liSelect':item.select,'noBorder':((item.description||item.name).indexOf('${'))!=-1}]"
+        :key="item.value"
+        @click="selectResult(item,idx)"
+      >
+        <span v-if="((item.description||item.name).indexOf('${'))==-1">{{item.description||item.name}}</span>
+        <OptionInp v-else :item="item" @handleInp="inpVal($event,idx)" @handleSelec="handleClick(item,idx,false,true)"/>
+      </li>
+    </ul>
+    <div :class="sure?'realSure sure':'sure'" @click="makeSuer">
+      确定
     </div>
   </div>
+  <!--</portal>-->
 </template>
-<script type="text/javascript">
-import icon from '../images/radio-default.png';
-import checkIcon from '../images/radio-check.png';
-import {patt,concatVal} from '@utils/tools.js';
-import MultiLineInput from '../common/MultiLineInput.vue';
-import OptionInp from '../common/OptionInp.vue';
-  export default{
-    name:'Radio',
-    props:{
-      item:{
-        default:''
-      },
-      slide:{
-        default:false,
-        type:Boolean
-      },
-      detail:{
-        default:2,
-        type:Number||String
-      }
-    },
-    data(){
-      return{
-        defaultPic:icon,
-        check:checkIcon,
-        datas:{}
-      }
-    },
-    created(){
-      // this.datas = JSON.parse(JSON.stringify(this.item));
-      this.datas = this.item;
-    },
-    methods:{
-      getStyle(detail,slide){
-        if(detail == 1){
-          if(slide){
-            return {'display':'block','background-color': '#F9F9F9'}
-          }else{
-            return {'display':'none'}
+<script>
+  import OptionInp from '../common/OptionInp.vue';
+export default {
+  props: ["symptomResult","num"],
+  data() {
+    return {
+      result: [], //答案结果
+      connectResult: [], //id
+      contentResult: "", //name
+      rules: [], //规则所需数据value
+      sure:false,
+      numPlus:1
+    };
+  },
+  mounted() {
+    this.numPlus = this.num;
+    this.result = this.symptomResult;
+  },
+  watch:{
+    result: {
+      handler(newArr) {
+        let num = 0;
+        for(let i = 0;i < newArr.length;i++){
+          if(!newArr[i].select){
+            ++num
           }
+        }
+        if(num == newArr.length){
+          this.sure = false
         }else{
-          return {'display':'block'}
+          this.sure = true
         }
       },
-      handleClick(it,index,flg,ipt){
-        if(flg){
-          document.activeElement.blur();      
+      immediate: true,
+      deep:true
+    }
+  },
+  methods: {
+    handleClick(it,index,flg,ipt){
+      if(flg){
+        document.activeElement.blur();
+        document.activeElement.scrollIntoViewIfNeeded(true);
+        setTimeout(()=>{
           document.activeElement.scrollIntoViewIfNeeded(true);
-          setTimeout(()=>{
-            document.activeElement.scrollIntoViewIfNeeded(true);
-          },300)
+        },300)
+      }
+      const list = this.datas;
+      let data = list.questionDetailList&&list.questionDetailList.slice(0); //数组深拷贝
+      if(ipt){//输入框单选，输入了内容才算选中,删除内容算取消
+        for(let i=0;i<data.length; i++){
+          if(i==index){
+            data[i].select=data[i].value?1:0;
+          }else{
+            data[i].select = 0
+          }
         }
-        const list = this.datas;
-        let data = list.questionDetailList&&list.questionDetailList.slice(0); //数组深拷贝
-        if(ipt){//输入框单选，输入了内容才算选中,删除内容算取消
-          for(let i=0;i<data.length; i++){
-            if(i==index){
-              data[i].select=data[i].value?1:0;
-            }else{
-              data[i].select = 0
-            }
+      }else{
+        for(let i=0;i<data.length; i++){
+          if(i==index){
+            data[i].select = data[i].select==1?0:1;
+          }else{
+            data[i].select = 0
           }
-        }else{
-          for(let i=0;i<data.length; i++){
-            if(i==index){
-              data[i].select = data[i].select==1?0:1;
-            }else{
-              data[i].select = 0
-            }
+        }
+      }
+      let temp = concatVal(data);
+      const newData = Object.assign({},this.datas,{questionDetailList:data,value:temp.value,valueP:temp.valueP});
+      this.$emit("updata",newData);
+    },
+    makeSuer() {
+      if(!this.sure){return}
+      let result = this.result;console.log(result)
+      let number = this.numPlus,tmpResult='';
+      for (let i = 0; i < result.length; i++) {
+          if(result[i].select){
+            tmpResult=result[i].name
           }
         }
-        let temp = concatVal(data);
-        const newData = Object.assign({},this.datas,{questionDetailList:data,value:temp.value,valueP:temp.valueP})
-        this.$emit("updata",newData);
-      },
-      inpVal(val,index){//输入框失焦处理  
-        // 输入框回读
-        let detailList = this.datas.questionDetailList;
-        let currItem = detailList[index];
-        currItem.value = val; 
-        // 输入框失焦重新拼接父级的value
-        let temp = concatVal(detailList);
-        this.datas.value = temp.value;
-        this.datas.valueP = temp.valueP;
-        this.$emit("updata",this.datas);
-      },
+        this.contentResult = tmpResult
+      this.$emit("updataResultSingle", this.result, this.contentResult,++number);
     },
-    watch:{
-      item:{
-        handler(newVal,oldVal){
-          this.datas = JSON.parse(JSON.stringify(newVal));
-        },
-        deep:true
+    selectResult(item,idx) {
+      const { select } = item;
+      let result = JSON.parse(JSON.stringify(this.result))
+      if (select) {//判断是否选中,选中的取消,关联id删除，未选中判断是否互斥
+        for (let i = 0; i < result.length; i++) {
+          if(i == idx){
+            result[i].select = false
+          }
+        }
+      }else{
+        for (let i = 0; i < result.length; i++) {
+          if(i == idx){
+            result[i].select = true
+          }else{
+            result[i].select = false
+          }
+        }
       }
-    },
-    components:{
-      MultiLineInput,
-      OptionInp
+      this.result = result
     }
+  },
+  components:{
+    OptionInp
   }
+};
 </script>
 <style lang="less" scoped>
-@import '../less/base.less';
-  .radio-wrap{
-    .bgques;
-    img{
-      width:100%;
-    }
-    .block{
-      width:100%;
-    }
-    .list{
-      color: #colors[text];
-      margin:0 .05rem;
-      padding: .05rem;
-      display: inline-block;
-      white-space: nowrap;
-      // overflow-x: hidden;
-      float: left;
-      // -webkit-white-space: nowrap;
-      // -webkit-box-orient: vertical;
-      img{
-        width: .38rem;
-        vertical-align: middle;
-      }
-      >span{
-        white-space: normal;
-        vertical-align: middle;
-      }
-      .radioCheck {
-        display: inline-block;
-        line-height: .66rem;
-        // min-width: 2rem;
-        // text-align: center;
-        padding:0 .2rem;
-        box-sizing: border-box;
-        border-radius: .38rem;
-        border: 1px solid #dfe0e4;
-        background-color: #ffffff;
-      }
-      .check{
-        color: #fff;
-        background-color: #6678FF;
-        border: 1px solid #6678FF;
-      }
-      .iptCheck {
-        color: #colors[theme];
-      }
+  @import "../less/base.less";
+.select {
+  background-color: #fff;
+  padding: 0.3rem 0 0;
+  position: fixed;
+  width: 100%;
+  bottom: 0;
+  box-sizing: border-box;
+  li {
+    padding: 0.14rem 0.2rem;
+    border:1px #DFE0E4 solid;
+    border-radius: 0.36rem;
+    font-size: 0.26rem;
+    margin: 0.15rem;
+    float: left;
+    color: #666;
+    &.noBorder{
+      border: none;
+      width: 100%;
+     }
+  }
+  .liSelect {
+    color: #fff;
+    background-color: #colors[btn];
+    border-color:  #colors[btn];
+  }
+  .sure {
+    width: 100%;
+    height: 0.88rem;
+    font-size: .28rem;
+    background-color: #colors[btn];
+    line-height: 0.88rem;
+    margin-top: 0.8rem;
+    text-align: center;
+    color: #fff;
+    opacity: 0.5;
+    &.realSure {
+      opacity: 1;
     }
   }
-</style>
+}
+</style>

src/common/Select.vue

@@ -0,0 +1,153 @@
+<template>
+  <portal to="notification-outlet">
+  <div class="select">
+    <ul class="clearfix">
+      <li
+        v-for="(item,idx) in result"
+        :class="[{'liSelect':item.select}]"
+        :key="item.value"
+        @click="selectResult(item,idx)"
+      >
+      {{item.description||item.name}}
+      </li>
+    </ul>
+    <div :class="sure?'realSure sure':'sure'" @click="makeSuer">
+      确定 <span v-if="numPlus">({{numPlus}})</span>
+    </div>
+  </div>
+  </portal>
+</template>
+<script>
+export default {
+  props: ["symptomResult","num"],
+  data() {
+    return {
+      result: [], //答案结果
+      connectResult: [], //id
+      contentResult: "", //name
+      rules: [], //规则所需数据value
+      sure:false,
+      numPlus:0     //已选答案个数
+    };
+  },
+  mounted() {
+    //this.numPlus = this.num
+    this.result = this.symptomResult;
+  },
+  watch:{
+    result: {
+      handler(newArr) {
+        let num = 0,sldNum=0;
+        for(let i = 0;i < newArr.length;i++){
+          if(!newArr[i].select){
+            ++num;
+          }else{
+            sldNum++;
+          }
+        }
+        this.numPlus =sldNum;
+        if(num == newArr.length){
+          this.sure = false
+        }else{
+          this.sure = true
+        }
+      },
+      immediate: true,
+      deep:true
+    }
+  },
+  methods: {
+    makeSuer() {
+      if(!this.sure){return}
+      let result = this.result;
+      // if(this.numPlus == 1){
+        let tmpIds = [],tmpResult=[],staticArr=['2001','2002'];
+        for (let i = 0; i < result.length; i++) {
+          if(result[i].select){
+            //tmpIds=tmpIds.concat(result[i].connectId)
+            tmpResult.push(result[i].name)
+          }
+        }
+        //tmpIds=tmpIds.concat(staticArr)
+        //this.connectResult = tmpIds
+        this.contentResult = tmpResult.join('、')
+      // }else{
+
+      // }
+      let number = this.num;
+      this.$emit("updataResult", this.result,  this.contentResult,number == 0?0:++number);
+    },
+    selectResult(item,idx) {
+      const { exclusion, select } = item;
+      let result = JSON.parse(JSON.stringify(this.result));
+      if (select) {//判断是否选中,选中的取消,关联id删除，未选中判断是否互斥
+        for (let i = 0; i < result.length; i++) {
+          if(i == idx){
+            result[i].select = false
+          }
+        }
+      }else{
+        if(+exclusion === 1){
+          for (let i = 0; i < result.length; i++) {
+              if(i == idx){
+                result[i].select = true
+              }else{
+                result[i].select = false
+              }
+          }
+        }else{
+          for (let i = 0; i < result.length; i++) {
+            if(result[i].select&&+result[i].exclusion === 1){
+              result[i].select=false
+            }else{
+              if(i == idx){
+                result[i].select = true
+              }
+            }
+          }
+        }
+      }
+      this.result = result
+    }
+  }
+};
+</script>
+<style lang="less" scoped>
+  @import "../less/base.less";
+.select {
+  background-color: #fff;
+  padding: 0.2rem 0 0 0;
+  position: fixed;
+  width: 100%;
+  bottom: 0;
+  box-sizing: border-box;
+  li {
+    padding: 0.14rem 0.2rem;
+    border:1px #DFE0E4 solid;
+    border-radius: 0.36rem;
+    font-size: 0.26rem;
+    margin: 0.15rem;
+    float: left;
+    color: #666;
+  }
+  .liSelect {
+    color: #fff;
+    background-color: #colors[btn];
+    border-color:  #colors[btn];
+  }
+  .sure {
+    width: 100%;
+    height: 0.88rem;
+    font-size: .28rem;
+    background-color: #colors[btn];
+    line-height: 0.88rem;
+    margin-top: 0.8rem;
+    text-align: center;
+    color: #fff;
+    opacity: 0.5;
+    &.realSure {
+       opacity: 1;
+     }
+  }
+}
+</style>

src/common/UsualSymptom.vue

@@ -0,0 +1,181 @@
+<template>
+  <div class="usual-symptom">
+    <p class="title-bar">
+      <a href="javascript:void(0)"><img src="../images/back.png" alt="返回"/></a>
+      <span>您哪里不舒服？</span>
+    </p>
+    <ul class="radio-item clearfix">
+      <li
+        v-for="(item,idx) in symptoms"
+        :class="[{'liSelect':item.select}]"
+        :key="item.value"
+        @click="selectResult(item,idx)"
+        @touchstart.prevent="touchstart(item,idx)"
+        @touchend.prevent="touchend(item,idx+1)"
+      >
+        {{item.description||item.name}}
+        <img src="../images/icon_que.png" alt="解释说明" v-if="item.explains"/>
+      </li>
+    </ul>
+
+    <div class="searchWrap" @click="search(true)">
+        <img class="searchImg" src="../images/search.png" alt="">
+        <span class="placeholder">找不到？也可点击搜索症状...</span>
+    </div>
+    <Search
+      v-if="this.$store.state.searchShow"
+      @search="search"
+      @showDetil="showDetil"
+    ></Search>
+    <!--<ConfirmBox :show="showConfirm" @confirmDialog="confirmDialog" @cancelDialog = "cancelDialog"></ConfirmBox>-->
+  </div>
+</template>
+<script>
+  import Radio from './Radio';
+  import Search from '../components/Search.vue';
+  import ConfirmBox from '../common/ConfirmBox'
+  export default {
+    name:'UsualSymptom',
+    props:[],
+    data(){
+      const data = this.$store.state.usualSymptom;
+      return {
+        symptoms:this.formatData(data),
+        portaled:false,   //是否将radio渲染到最外层
+        showConfirm:false,
+        len:10,     //显示常用症状个数
+      }
+    },
+    methods:{
+      touchend(item,flg) {//症状点开详情
+        clearTimeout(this.timer);
+        this.end = this.$store.state.scroll
+        if(JSON.stringify(this.start) != JSON.stringify(this.end)){
+          this.startNum = 0
+          return
+        }
+        let endTime = +new Date();
+        if(endTime - this.startTime < 500){//点击事件
+          if(this.startNum == 1){
+            this.common(item,flg);
+          }
+          this.startNum = 0
+          this.slideTxt = '点击展开'
+          this.degNum = 0
+        }
+        this.startTime = "";
+      },
+      touchstart(it){
+        this.startNum = ++this.startNum;
+        this.start = this.$store.state.scroll;
+        this.startTime = +new Date();
+        const that = this;
+        this.timer = setTimeout(function(){
+          // 长按事件
+          that.showExp = true;
+          if(it.explains){
+            that.message.title = it.description || it.name;
+            that.message.text = it.explains;
+          }else{
+            that.message.title = "";
+            that.message.text = "暂无资料";
+          }
+          this.startNum = 0
+        },600)
+      },
+      formatData(data){
+        data.length=10;
+        return data.map((i)=>{
+          return Object.assign({},i,{
+            name:i.name,
+            value:i.questionId,
+            special:'',
+            connectId:[]
+          })
+        });
+      },
+      selectResult(item,idx){
+        this.$emit('selectUsual',item,idx);
+        this.$store.commit('setSearchShow', false);
+      },
+      confirmDialog(){
+
+      },
+      cancelDialog(){
+
+      },
+      search(flag){
+        this.$store.commit('setSearchShow', flag);
+      },
+      showDetil(item,flg) {//搜索点开的详情
+        this.$emit('selectUsual',item,flg);
+        this.$store.commit('setSearchShow', false);
+      },
+    },
+    components:{
+      Radio,
+      ConfirmBox,
+      Search
+    }
+  }
+</script>
+<style lang="less" scoped>
+  @import "../less/base.less";
+  .usual-symptom{
+    position: fixed;
+    bottom: 0;
+    background: #fff;
+    padding: .4rem .1rem;
+  }
+  .title-bar{
+    font-size: .28rem;
+    margin:0 0 .5rem .2rem;
+    img{
+      width: .16rem;
+      margin-right:.4rem;
+    }
+  }
+  .radio-item{
+    li {
+      padding: 0.14rem 0.2rem;
+      border:1px #DFE0E4 solid;
+      border-radius: 0.36rem;
+      font-size: 0.26rem;
+      margin: 0.15rem .65rem .15rem .15rem;
+      float: left;
+      color: #666;
+      position: relative;
+      img{
+        width: .35rem;
+        position: absolute;
+        right: -0.55rem;
+      }
+    }
+    .liSelect {
+      color: #fff;
+      background-color: #colors[btn];
+      border-color:  #colors[btn];
+    }
+  }
+  .searchWrap {
+    margin:1.2rem .2rem 0 .2rem;
+    height: .68rem;
+    line-height: .25rem;
+    box-sizing: border-box;
+    position: relative;
+    background: #F5F5F5;
+    border-radius: .32rem;
+    padding-left:.7rem;
+    color: #AAAAAA;
+    .placeholder{
+      font-size: .28rem;
+    }
+    .searchImg {
+      width: 0.44rem;
+      height: 0.44rem;
+      position: absolute;
+      left: .2rem;
+      top: .1rem;
+    }
+  }
+</style>

src/components/MainPage.vue

@@ -0,0 +1,479 @@
+<template>
+  <div class="page">
+    <div class="progress-bar">
+      <div class="title">
+        <span class="active">症状情况</span>
+        <span>诊疗情况</span>
+        <span>其他情况</span>
+      </div>
+      <div class="progress">
+        <p :style="{width:progress}"></p>
+      </div>
+    </div>
+    <div class="wrapper">
+      <div class="scrollPart" :style="{'paddingBottom':pdbm}">
+        <!--<div class="right clearfix">
+          <img src="../assets/patient.png" alt="" class="fr">
+          <div class="content fr">
+            <p>医生您好！我想咨询新型冠状病毒。（个人信息：{{userInfo.patientName}}{{userInfo.patientSex?'，'+userInfo.patientSex:''}}{{userInfo.patientAge?'，'+userInfo.patientAge+'岁':''}}）</p>
+          </div>
+        </div>-->
+        <div class="left clearfix">
+          <img src="../images/doctor.png" alt="" class="fl">
+          <div class="content fl">
+            <p>欢迎来到{{userInfo.hospitalName}}！候诊期间请先填写自己实际症状，信息会马上传送到您预约的医生，便于您实现快速就诊。</p>
+          </div>
+        </div>
+        <!--<div class="left clearfix" @click="selectToggle(2,disData.symptom.result,true)">
+          <img src="../assets/doctor.png" alt="" class="fl">
+          <div class="content fl">
+            <p>您哪里不舒服？</p>
+          </div>
+        </div>-->
+        <UsualSymptom v-if="showUsual" @selectUsual="selectUsual"></UsualSymptom>
+        <div class="right clearfix" v-if="selectedSymptom.name">
+          <img src="../images/patient.png" alt="" class="fr">
+          <div class="content fr">
+            <p>{{selectedSymptom.description||selectedSymptom.name}}</p>
+          </div>
+        </div>
+        <div v-for="(item,idx) in allquestionLis" :key="idx">
+          <Dialog :idx="idx" v-if="item.show" :item="item" @selectToggle="selectToggle"/>
+        </div>
+      </div>
+    </div>
+    <Select @updataResult="updataResultSingle" :num="num" :symptomResult="symptomResult" v-if="type == 2"></Select>
+    <Radio @updataResultSingle="updataResultSingle" :num="num" :symptomResult="symptomResult" v-if="type == 1"></Radio>
+    <Picker v-if="type == 9" @confirm="pickerConfirm" :num="num" :defaultIndex = "defaultIndex"></Picker>
+    <div v-if="wrong" class="tip">{{waring}}</div>
+    <!--<ConfirmBox :show="showConfirm" @confirmDialog="confirmDialog" @cancelDialog = "cancelDialog"></ConfirmBox>-->
+  </div>
+</template>
+<script>
+import BScroll from 'better-scroll';
+import {data} from '../utils/data.js'
+import Radio from '../common/Radio'
+import Select from '../common/Select'
+import Dialog from '../common/Dialog'
+import Picker from '../common/Picker'
+import ConfirmBox from '../common/ConfirmBox'
+import UsualSymptom from '../common/UsualSymptom';
+import api from "../utils/api.js";
+
+export default {
+  name:'MainPage',
+  data(){
+    let tmpDatas = JSON.parse(JSON.stringify(data));
+    return {
+      disData:data,//所有的数据
+      result:'诊断结果',
+      num:0,//题目计数
+      show:false,
+      showUsual:false,
+      scroll:null,
+      type :-1,
+      tmpSymptom:'',
+      selectedSymptom:{},
+      tmpDatas:tmpDatas,
+      symptomResult:'',//症状选择
+      connectResult:[],//关联问题的id
+      contentResult:'',//选中的结果name
+      rules:[],//规则所需数据value
+      allquestionLis:[],//所有的问题
+      current:0,//第几题
+      defaultIndex: 0, //温度默认值
+      selectTemp: '', //选择的温度
+      order:0,
+      arr1:[],//规则数据1.....
+      arr2:[],//规则数据2.....
+      userInfo: {}, //用户信息
+      lastDis:'',//诊断
+      pdbm:'8.5rem',
+      waring:'',
+      wrong:false,
+      showConfirm: false,
+      time:1000,
+    }
+  },
+  created() {
+    //const userInfo= JSON.parse(localStorage.getItem("userInfo"))
+    const userInfo = this.$store.state.pathInfo;
+    this.userInfo = userInfo;
+    this.updata()
+  },
+  mounted(){
+    this.$nextTick(()=>{
+      let bs = new BScroll('.wrapper', {
+        probeType: 3,
+        click:true
+      })
+      this.scroll = bs
+    })
+    // this.tmpSymptom = JSON.parse(JSON.stringify(data))
+    this.symptomResult = data.symptom.result;
+  },
+  computed:{
+    progress(){
+      if(!this.num){
+        return '0.1px';
+      }
+      const precent = this.num/(this.allquestionLis.length+1);
+      return precent*100+"%";
+    }
+  },
+  methods:{
+    updata(){
+      let tmpData = data
+      tmpData.symptom.content = ''
+      this.disData = this.tmpDatas
+
+      this.symptomResult = this.tmpDatas.symptom.result
+      this.connectResult = []
+      this.rules = []
+      this.allquestionLis = []
+      this.arr1 = []
+      this.arr2 = []
+      this.pdbm = '8.5rem'
+      //this.type = 1;
+      this.showUsual=true;
+      this.num = 0;
+    },
+    selectToggle(type,result,flg,idx,order){
+      return
+      if(flg){
+        this.num = 1
+      }
+      this.symptomResult = result
+      this.type = type
+      this.current = idx
+      this.order = order
+      this.scrollDown()
+    },
+    updataResultSingle(result,contentResult,num){
+      this.num = num;
+      this.type = -1;
+      let tmpArr = JSON.parse(JSON.stringify(this.allquestionLis));
+      let tmpArrDetailResult = JSON.parse(JSON.stringify(this.allquestionLis[num].questionDetailList));
+      tmpArr[num-1].content = contentResult;
+      let tmpArrDetail = JSON.parse(JSON.stringify(tmpArr[num]));
+
+      let timer = setTimeout(() => {
+        this.type = tmpArrDetail.controlType;
+        tmpArrDetail.show = true;
+        tmpArr[num] = tmpArrDetail;
+        this.symptomResult = tmpArrDetailResult;
+        clearTimeout(timer)
+      }, this.time);
+
+      this.allquestionLis = tmpArr;
+      this.$nextTick(()=>{
+        this.scroll.refresh()
+        this.scroll.scrollTo(0, this.scroll.maxScrollY,500)
+      })
+    },
+    updataResult(result,connectResult,contentResult,num){
+      this.num = num;
+      this.type = -1;
+      let tmpAllData = this.disData;
+      let tmpAllquestion = this.disData.allquestion,tmpArr = [],cur = this.current;
+      for(let i = 0;i < tmpAllquestion.length;i++){//根据选择的答案需要添加问题
+        for(let k = 0;k < connectResult.length;k++){
+          if(connectResult[k] == tmpAllquestion[i].id){
+            tmpAllquestion[i].order = k
+            tmpArr.push(tmpAllquestion[i])
+          }
+        }
+      }
+      if(num == 0){//第一题完成
+        let tmpSymptom = this.disData.symptom
+        tmpSymptom.content = contentResult
+        tmpSymptom.result = result
+        this.disData.symptom = tmpSymptom
+        tmpAllData.symptom = tmpSymptom
+        let timer = setTimeout(() => {
+          tmpArr[0].show = true
+          this.type = tmpArr[0].type
+          this.symptomResult = tmpArr[0].result
+          this.allquestionLis = tmpArr
+          clearTimeout(timer)
+        }, this.time);
+        let tmpArr1 = []
+        for(let i = 0;i < result.length;i++){
+          if(result[i].select){
+            tmpArr1.push(result[i].value)
+          }
+        }
+        this.arr1 = tmpArr1
+      }else{//最后一道题多选，答完匹配规则
+        let tmpAllquestion = this.disData.allquestion,tmpArrs = JSON.parse(JSON.stringify(this.allquestionLis));
+        let tmpArr1 = []
+        tmpArrs[num-1].content = contentResult
+        tmpAllquestion.result = result
+        this.allquestionLis = tmpArrs
+        tmpAllquestion[tmpAllquestion.length-1].content = contentResult
+        tmpAllData.allquestion = tmpAllquestion
+
+        for(let i = 0;i < result.length;i++){
+          if(result[i].select){
+            tmpArr1.push(result[i].value)
+          }
+        }
+
+        this.arr2 = tmpArr1
+        this.getDis()
+        let detailArr=[];
+        let obj = {
+          "question":tmpAllData.symptom.question,
+          "answer":tmpAllData.symptom.content
+        };
+
+        detailArr.push(obj)
+        for(let k = 0;k < tmpArrs.length;k++){
+          let tmpObj = {}
+          tmpObj.question = tmpArrs[k].question
+          tmpObj.answer = tmpArrs[k].content
+          detailArr.push(tmpObj)
+        }
+        let params =	{
+          "doctorId": this.userInfo.doctorId,
+	        "mpiId": this.userInfo.mpiId,
+	        "appId": this.userInfo.appId,
+	        "diagnosis": this.lastDis,
+          "detailList": detailArr,
+          "department":this.userInfo.department,
+          "doctorName": this.userInfo.doctorName,
+          "organName": this.userInfo.organName,
+          "patientAge": this.userInfo.patientAge,
+          "patientName": this.userInfo.patientName,
+          "patientSex": this.userInfo.patientSex
+        }
+        this.saveInfo(params)
+      }
+      this.disData = tmpAllData
+      // this.symptomResult = result
+      this.contentResult = contentResult
+      this.$nextTick(()=>{
+        this.scroll.refresh()
+        this.scroll.scrollTo(0, this.scroll.maxScrollY,500)
+      })
+    },
+    saveInfo(params){
+      api.saveInfo(params).then((res)=>{
+        let data = res.data;
+        if(data.code == 0){
+          let url = data.data.body
+          window.location.href = url
+        }else{
+          this.waring = data.msg
+          this.wrong = true
+          setTimeout(() => {
+            this.wrong = false
+          }, 2000);
+        }
+      })
+    },
+    getDis(){//规则匹配诊断结果诊断结果获取
+      const result1 = this.arr1;
+      const result2 = this.arr2;
+      const resultList = data.resultList;
+      let resultIndex = -1
+      for(let i = 0; i < resultList.length; i++) {
+        if(this.hasResult(resultList[i].result1,result1)&&this.hasResult(resultList[i].result2,result2)) {
+          resultIndex = i
+          break;
+        }
+      }
+      if(resultIndex == 0){
+        this.lastDis = '建议立刻发热门诊就诊，并且佩戴好口罩做好防护。佩戴医用外科口罩或N95口罩，避免乘坐公共交通工具。'
+      }else if(resultIndex == 1){
+        this.lastDis = '结合你提供的病情症状及接触史特点，建议继续在家监测体温，可适当服用治疗感冒的中成药，注意手卫生，多饮水，休息为主。若体温持续不退或体温大于38℃或不适症状加重，及时就诊。'
+      }else if(resultIndex == 2){
+        this.lastDis = '建议你们全家及密切接触者居家隔离至少2周，在家期间建议戴口罩交流，条件允许时，尽量单独居住或居住在通风良好的单人房间。多休息，多饮水，注意手卫生和常用物品卫生消毒。若出现发热及呼吸道症状，需马上前往医院就诊。'
+      }else if(resultIndex == 3){
+        this.lastDis = '建议您戴口罩、勤洗手，避免人群聚集，减少不必要外出。'
+      }
+    },
+    hasResult(arr1, arr2) {
+      let result = false;
+      for(let i = 0; i < arr2.length; i++) {
+        if(arr1.findIndex((item) => {return item === arr2[i]}) >-1) {
+          result = true;
+        }
+      }
+      return result;
+    },
+    back(){
+      this.showConfirm = true
+      // this.$router.go(-1)
+    },
+    selectUsual(sym){
+      this.getSymptomQas(sym.questionId);     //获取症状下的关联问题
+      this.selectedSymptom = sym;   //设置搜索选中症状
+      this.showUsual=false; //关闭症状选择进入下一个问题
+    },
+    getSymptomQas(id){
+      const param = {
+        age:this.userInfo.patientAge,
+        id:id,
+        sexType:this.userInfo.sexType
+      };
+      api.getById(param).then((res) => {
+        const result = res.data;
+        if(result.code==='0'){
+          const data = result.data;
+          if(!data){
+            return ;
+          }
+          const qaLis = data.questionMapping;
+          qaLis[0].show=true;   //第一题自动显示
+          this.type = qaLis[0].controlType;
+          this.symptomResult = qaLis[0].questionDetailList;
+          this.allquestionLis = qaLis;
+        }else{
+
+        }
+      });
+    },
+    scrollDown(){
+      this.scroll.scrollTo(0, this.scroll.maxScrollY)
+    },
+    pickerConfirm(value,index,num){
+      this.defaultIndex = index
+      this.type = -1;
+      this.num = num;
+      let tmpArr = JSON.parse(JSON.stringify(this.allquestionLis));
+      tmpArr[num-1].content = value;
+      let timer = setTimeout(() => {
+        tmpArr[num].show = true;
+        this.type = tmpArr[num].controlType;
+        this.symptomResult = tmpArr[num].questionDetailList;
+        clearTimeout(timer)
+      }, this.time);
+
+      this.allquestionLis = tmpArr;
+      this.$nextTick(()=>{
+        this.scroll.refresh();
+        this.scroll.scrollTo(0, this.scroll.maxScrollY,500)
+      })
+    },
+    confirmDialog(){
+      this.$router.replace({
+        path:'/',
+        query:this.userInfo
+      })
+      // this.$router.go(-1)
+    },
+    cancelDialog(){
+      this.showConfirm = false
+    }
+  },
+  components:{
+    Radio,
+    Select,
+    Dialog,
+    Picker,
+    ConfirmBox,
+    UsualSymptom
+  }
+}
+</script>
+<style lang="less" scoped>
+  @import "../less/base.less";
+.wrapper {
+  height: 100%;
+  width: 100%;
+  position: fixed;
+  box-sizing: border-box;
+  overflow: hidden;
+}
+.scrollPart {
+  // padding-bottom: 5rem;
+  // padding-top: 1.44rem;
+  // box-sizing: border-box;
+}
+.progress-bar {
+  height: .8rem;
+  line-height: .8rem;
+  background: #fff;
+  color: #aaa;
+  margin-bottom:.4rem;
+  span{
+    display: inline-block;
+    font-size: .26rem;
+    width: 30%;
+    color: #aaa;
+    text-align: center;
+    &:not(:last-child):after{
+        content: ">";
+        float: right;
+        color: #aaa;
+     }
+  }
+  .active{
+    font-size: .28rem;
+    color: #colors[theme];
+  }
+  .progress{
+    height:0.06rem;
+    background:#F5F5F5;
+    p{
+      width:.1px;
+      height: 100%;
+      background: #colors[theme];
+    }
+  }
+}
+.right {
+  padding-top: .2rem;
+  margin-bottom: .12rem;
+  padding-right: .24rem;
+  .content {
+    max-width: 5rem;
+    background-color: #colors[theme];
+    border-radius: .24rem 0 .24rem .24rem;
+    margin-top: .3rem;
+    font-size: .28rem;
+    padding: .24rem;
+    display: inline-block;
+    p {
+      color: #fff;
+    }
+  }
+  img {
+    width: 0.8rem;
+    height: 0.8rem;
+    margin-left: .24rem;
+  }
+}
+.left {
+  margin-bottom: .2rem;
+  padding-top: .12rem;
+  padding-left: .24rem;
+  .content {
+    max-width: 5rem;
+    background-color: #colors[bgques];
+    border-radius: 0 .24rem .24rem .24rem;
+    margin-top: .3rem;
+    font-size: .28rem;
+    padding: .24rem;
+    display: inline-block;
+  }
+  img {
+    width: 0.8rem;
+    height: 0.8rem;
+    margin-right: .24rem;
+  }
+}
+.tip {
+  max-width: 80%;
+  padding: .2rem;
+  border-radius: .1rem;
+  background-color:rgba(0,0,0,0.7);
+  position: fixed;
+  top: 40%;
+  left: 50%;
+  transform: translateX(-50%);
+  color: #fff;
+}
+
+</style>

src/components/PathInfo.vue

@@ -10,12 +10,12 @@
         <p class="perLine">
           <span class="msgTitle">姓名</span>
           <i>：</i>
-          <span>{{pathInfo.patientName}}</span>  
+          <span>{{pathInfo.patientName}}</span>
         </p>
         <p class="perLine">
           <span class="msgTitle">性别</span>
           <i>：</i>
-          <span>{{pathInfo.patientSex}}</span>  
+          <span>{{pathInfo.patientSex}}</span>
         </p>
         <p class="perMsg perLine">
           <span class="msgTitle">年龄</span>
@@ -31,7 +31,7 @@
         <p class="perLine" v-if="pathInfo.hospitalDeptName">
           <span class="msgTitle">{{pathInfo.hospitalDeptName?'科室':''}}</span>
           <i v-if="pathInfo.hospitalDeptName">：</i>
-          <span>{{pathInfo.hospitalDeptName}}</span>  
+          <span>{{pathInfo.hospitalDeptName}}</span>
         </p>
         <p class="perLine" v-if="pathInfo.recordId">
           <span class="msgTitle">{{pathInfo.recordId?'排队号':''}}</span>
@@ -50,7 +50,7 @@
         <p class="already" v-if="type !== 1">{{text[type]}}</p>
       </div> -->
     </div>
-    
+
     <Toast
       :message="message"
       :show="showToast"
@@ -160,6 +160,7 @@
             this.pathInfo = result.data;
             this.$store.commit('savePathInfo',result.data);
             this.getAll(); //获取模板
+            this.getUsualSymptom();   //获取科室常用症状
           }
         })
       },
@@ -189,6 +190,21 @@
           }
         })
       },
+      getUsualSymptom(){
+        const param = {
+          "age": this.pathInfo.patientAge,
+          "deptName": this.pathInfo.selfDeptName,
+          "sexType": this.pathInfo.sexType
+        };
+        api.getSymptom(param).then((res) => {
+          const result = res.data;
+          if (result.code == 0) {
+            this.$store.commit("setUsualSymptom",result.data);
+          }else{
+            this.defaultWaring('常用症状获取失败，请稍后重试！')
+          }
+        })
+      },
       recordCheck(){
         const param = {
           'doctorId':this.pathInfo.doctorId,
@@ -196,7 +212,7 @@
           'hospitalId':this.pathInfo.hospitalId,
           'inquiryCode':this.pathInfo.recordId,
           'patientId':this.pathInfo.patientId
-        }
+        };
         api.recordCheck(param).then((res)=>{
           const result = res.data;
           if(result.code==0){
@@ -204,7 +220,7 @@
             if(type == 3||type == 6){//有预问诊信息
               this.showToast = true
             }else{
-              this.goNext()
+              this.goNext();
             }
           }
         })
@@ -250,7 +266,7 @@
           this.submit = false
           clearTimeout(timer)
         }, 2000);
-      }, 
+      },
     },
     components:{
       Submit,
@@ -300,7 +316,7 @@
     .explain {
       font-size: .24rem;
       color: #AAAAAA;
-      padding:0 .4rem; 
+      padding:0 .4rem;
       line-height: .4rem;
       position: relative;
       bottom: 1.1rem;
@@ -351,7 +367,7 @@
           margin-right: .24rem;
         }
       }
-      
+
     }
     .btmContent {
       width: 94%;
@@ -372,4 +388,4 @@
       height: 0.22rem;
     }
   }
-</style>
+</style>

src/components/Search.vue

@@ -57,7 +57,7 @@ export default {
   },
   computed:{
     ...mapState({
-      chooseSymp: state => state.symptom.choose,//已选症状
+      //chooseSymp: state => state.symptom.choose,//已选症状
       pathInfo: state => state.pathInfo
     }),
   },
@@ -76,17 +76,17 @@ export default {
   },
   methods: {
     showDetil(item) {
-      let flg = false;
+      /*let flg = false;
       if(JSON.stringify(this.tmpItem)==JSON.stringify(item)){//eg:重复点击胸痛bug
         flg = true
       }
       this.tmpItem = item
-      
+
       if(this.chooseSymp.length == 0){
         item.idx = 1
-      }
+      }*/
       let timer = setTimeout(() => {
-        this.$emit('showDetil',item,flg)
+        this.$emit('showDetil',item);
         clearTimeout(timer)
       }, 250);
       // this.$emit('search', false)
@@ -95,15 +95,15 @@ export default {
       this.$emit('search', false)
     },
     searchList() {
-      let tmpArr = [], chooseSymp = this.chooseSymp;
-      for (let i = 0; i < chooseSymp.length; i++) {
+      let tmpArr = []/*, chooseSymp = this.chooseSymp*/;
+      /*for (let i = 0; i < chooseSymp.length; i++) {
         if(chooseSymp[i].conceptId){
           tmpArr.push(chooseSymp[i].conceptId)
         }
-      }
+      }*/
       const param = {
         "age": this.pathInfo.patientAge,
-        "inputIds": tmpArr,
+        "inputIds": [],
         "inputStr": this.searchVal,
         "sexType": this.pathInfo.sexType
       }
@@ -127,7 +127,7 @@ export default {
   position: fixed;
   height: 100%;
   width: 100%;
-  top: 0;
+  top: 1.45rem;
   left: 0;
   z-index: 102;
   background-color: #ededed;

src/less/base.less

@@ -9,7 +9,7 @@
   exclu:#e6e7e9; //互斥文字颜色
   btn:#6678FF;//按钮颜色
   line:#E6E6E6;//按钮颜色
-  bgques:#F9F9F9;//问题背景颜色
+  bgques:#F3F4F6;//问题背景颜色
 }
 .mask{
   width:100%;
@@ -59,7 +59,7 @@
     line-height: .88rem;
     text-align: center;
     vertical-align: top;
-    border: 1px solid #colors[theme];  
+    border: 1px solid #colors[theme];
     box-sizing: border-box;
     border-radius: .44rem;
   }
@@ -175,4 +175,4 @@
 }
 .displayNone {
   display: none !important;
-}
+}

src/router/index.js

@@ -1,7 +1,8 @@
 import Vue from 'vue';
 import Router from 'vue-router';
 import PathInfo from '@components/PathInfo.vue';
-import TabPage from '@components/TabPage.vue';
+/*import TabPage from '@components/TabPage.vue';*/
+import MainPage from '@components/MainPage.vue';
 import Login from '@components/Login.vue';
 import Symptom from '@components/Symptom.vue';
 import DiagTreat from '@components/DiagTreat.vue';
@@ -27,10 +28,10 @@ const router = new Router({
     },
     {
       path:'/tab',
-      component:TabPage,
+      component:MainPage,
       children:[
         {
-          path:'/',      
+          path:'/',
           name:'symptom',
           component:Symptom
         },{
@@ -73,7 +74,7 @@ router.beforeEach((to, from, next) => {
     document.title = to.meta.title;
     // let i = document.createElement('iframe');//解决qq内title不刷新问题
     // i.style.display = 'none';
-    // i.src = '.'; 
+    // i.src = '.';
     // i.onload = ()=>{
     //     setTimeout(()=>{
     //         i.remove()
@@ -83,4 +84,4 @@ router.beforeEach((to, from, next) => {
   }
   next();
 })
-export default router;
+export default router;

src/store.js

@@ -71,7 +71,7 @@ const store = new Vuex.Store({
         }else{
           obj1[key] = false
         }
-      } 
+      }
       state.finish = obj
     },
     setActiveModule(state,param){
@@ -125,6 +125,9 @@ const store = new Vuex.Store({
     setSearchShow(state,flg){//搜索显示与否
       state.searchShow = flg;
     },
+    setUsualSymptom(state,data){
+      state.usualSymptom = data;
+    },
     setDataAll(state,param){
       let res = state.allMoudles
       for(let i = 0;i<res.length;i++){
@@ -195,7 +198,7 @@ const store = new Vuex.Store({
           }
           break;
         case moduleCP['suplement']:
-          
+
           break;
         default:
           break;
@@ -243,14 +246,14 @@ const store = new Vuex.Store({
         default:
           break;
       }
-      
+
     },
     setText(state,param){
       const type = parseInt(param.type);
       switch(type){
         case moduleCP['symp']:
           // 对象易更新但顺序无法控制
-          // state.symptom.text = Object.assign({},state.symptom.text,{[param.pId]:param.text}); 
+          // state.symptom.text = Object.assign({},state.symptom.text,{[param.pId]:param.text});
           let text = state.symptom.text;
           if(text.length > 0){
             for(let i in text){
@@ -266,7 +269,7 @@ const store = new Vuex.Store({
           text.push(param);
           break;
         case moduleCP['diagT']: //诊疗情况
-          let diaText = JSON.parse(JSON.stringify(state.diagnose.text)); 
+          let diaText = JSON.parse(JSON.stringify(state.diagnose.text));
           // 先判断order，然后判断index
           let item = diaText[param.order];
           if(item){
@@ -397,7 +400,7 @@ const store = new Vuex.Store({
         default:
           break;
       }
-      
+
     },
     setImgSrc(state,param){
       const key = param.key;
@@ -419,7 +422,7 @@ const store = new Vuex.Store({
         default:
           break;
       }
-      
+
     },
     deleImg(state,param){
       const key = param.key;
@@ -445,7 +448,7 @@ const store = new Vuex.Store({
         default:
           break;
       }
-      
+
     },
     deleSrc(state,param){
       const key = param.key;
@@ -469,7 +472,7 @@ const store = new Vuex.Store({
         default:
           break;
       }
-      
+
     },
     handleToggleShow(state,flg){
       state.loadingShow = flg

src/utils/data.js

@@ -0,0 +1,345 @@
+export const data = {
+    symptom:{
+        question:'是否有以下症状？',
+        type:'1',//单选1多选2滚动3
+        show:true,//当前问题是否需要显示
+        result:[//症状
+            {
+                'name':'发热',
+                'value':'1.1',//规则里面的数据
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':['1001','1002','1003','1004','1005']//关联问题的id
+            },{
+                'name':'咽喉痛',
+                'value':'1.2',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':[]
+            },{
+                'name':'咳嗽',
+                'value':'1.3',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':['1006']
+            },{
+                'name':'鼻塞',
+                'value':'1.4',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':[]
+            },{
+                'name':'流鼻涕',
+                'value':'1.5',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':[]
+            },{
+                'name':'胸闷',
+                'value':'1.6',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':['1008']
+            },{
+                'name':'气急',
+                'value':'1.7',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':['1009']
+            },{
+                'name':'呼吸困难',
+                'value':'1.8',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':[]
+            },{
+                'name':'全身酸痛',
+                'value':'1.9',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':[]
+            },{
+                'name':'乏力',
+                'value':'1.11',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':[]
+            },{
+                'name':'腹泻',
+                'value':'1.12',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':['1007']
+            },{
+                'name':'都没有',
+                'value':'1.13',
+                'special':'2',//1为正常选项，2为互斥项
+                'connectId':[]
+            }
+        ]
+    },
+    allquestion:[
+        {
+        question:'是否有以下症状？(可多选)',
+        type:'2',//单选1多选2滚动3
+        show:true,//当前问题是否需要显示
+        result:[//症状
+            {
+                'name':'发热',
+                'value':'1.1',//规则里面的数据
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':['1001','1002','1003','1004','1005']//关联问题的id
+            },{
+                'name':'咽喉痛',
+                'value':'1.2',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':[]
+            },{
+                'name':'咳嗽',
+                'value':'1.3',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':['1006']
+            },{
+                'name':'鼻塞',
+                'value':'1.4',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':[]
+            },{
+                'name':'流鼻涕',
+                'value':'1.5',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':[]
+            },{
+                'name':'胸闷',
+                'value':'1.6',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':['1008']
+            },{
+                'name':'气急',
+                'value':'1.7',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':['1009']
+            },{
+                'name':'呼吸困难',
+                'value':'1.8',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':[]
+            },{
+                'name':'全身酸痛',
+                'value':'1.9',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':[]
+            },{
+                'name':'乏力',
+                'value':'1.11',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':[]
+            },{
+                'name':'腹泻',
+                'value':'1.12',
+                'special':'1',//1为正常选项，2为互斥项
+                'connectId':['1007']
+            },{
+                'name':'都没有',
+                'value':'1.13',
+                'special':'2',//1为正常选项，2为互斥项
+                'connectId':[]
+            }
+        ]
+        },
+        {
+            id:'1001',
+            type:'1',
+            show:false,
+            question:'目前体温是多少？',
+            result:[
+                {
+                    'name':'<37.3℃',
+                },
+                {
+                    'name':'≥37.3℃',
+                }
+            ]
+        },
+        {
+            id:'1002',
+            type:'3',
+            show:false,
+            question:'最高体温是多少？',
+            result:[
+                {
+                    'name':'37.3℃',
+                },
+                {
+                    'name':'37.4℃',
+                },
+                {
+                    'name':'37.5℃',
+                },
+                {
+                    'name':'37.6℃',
+                },
+                {
+                    'name':'37.7℃',
+                },
+                {
+                    'name':'37.8℃',
+                },
+                {
+                    'name':'37.9℃',
+                },
+                {
+                    'name':'38.0℃',
+                }
+            ]
+        },
+        {
+            id:'1003',
+            type:'1',
+            show:false,
+            question:'发热时有没有以下情况？',
+            result:[
+                {
+                    'name':'发热体温持续不退',
+                },{
+                    'name':'体温一直大于38℃',
+                },{
+                    'name':'都没有'
+                }
+            ]
+        },
+        {
+            id:'1004',
+            type:'1',
+            show:false,
+            question:'发热后有没有吃退热药？',
+            result:[
+                {
+                    'name':'有吃退热药',
+                },{
+                    'name':'没有吃退热药',
+                }
+            ]
+        },
+        {
+            id:'1005',
+            type:'1',
+            show:false,
+            question:'吃退热药后的体温情况是？',
+            result:[
+                {
+                    'name':'体温下降',
+                },{
+                    'name':'体温下降又升高',
+                },{
+                    'name':'体温没有下降'
+                }
+            ]
+        },
+        {
+            id:'1006',
+            type:'1',
+            show:false,
+            question:'有没有咳痰？',
+            result:[
+                {
+                    'name':'没有咳痰(干咳)',
+                },{
+                    'name':'有咳痰'
+                },
+            ]
+        },
+        {
+            id:'1007',
+            type:'1',
+            show:false,
+            question:'有没有腹泻加重？',
+            result:[
+                {
+                    'name':'有',
+                },{
+                    'name':'没有',
+                }
+            ]
+        },
+        {
+            id:'1008',
+            type:'1',
+            show:false,
+            question:'有没有胸闷加重？',
+            result:[
+                {
+                    'name':'有',
+                },{
+                    'name':'没有',
+                }
+            ]
+        },
+        {
+            id:'1009',
+            type:'1',
+            show:false,
+            question:'有没有气急加重？',
+            result:[
+                {
+                    'name':'有',
+                },{
+                    'name':'没有',
+                }
+            ]
+        },
+        {
+            id:'2001',
+            type:'1',
+            show:false,
+            question:'本次不舒服有多久了？',
+            result:[
+                {
+                    'name':'14天以内',
+                },
+                {
+                    'name':'14天以上',
+                }
+            ]
+        },{
+            id:'2002',
+            type:'2',
+            show:false,
+            question:'近14天有没有以下情况？',
+            result:[
+                {
+                    'name':'有武汉（湖北）、温州、台州旅游史或居住史',
+                    'special':'1',//1为正常选项，2为互斥项
+                    'value':'2.1',
+                },
+                {
+                    'name':'有接触过来自武汉（湖北）、温州、台州的人员',
+                    'special':'1',//1为正常选项，2为互斥项
+                    'value':'2.2'
+                },
+                {
+                    'name':'有接触过疑似或确诊新型冠状病毒感染者',
+                    'special':'1',//1为正常选项，2为互斥项
+                    'value':'2.3'
+                },
+                {
+                    'name':'身边有多人出现发热、乏力、咳嗽、咽痛等',
+                    'special':'1',//1为正常选项，2为互斥项
+                    'value':'2.4'
+                },
+                {
+                    'name':'都没有',
+                    'special':'2',//1为正常选项，2为互斥项
+                    'value':'2.5'
+                }
+            ]
+        },
+    ],
+    resultList: [
+        {
+            result1:['1.1','1.2','1.3','1.4','1.5','1.6','1.7','1.8','1.9','1.11','1.12'],
+            result2:['2.1','2.2','2.3','2.4']
+        },
+        {
+            result1:['1.1','1.2','1.3','1.4','1.5','1.6','1.7','1.8','1.9','1.11','1.12'],
+            result2:['2.5']
+        },
+        {
+            result1:['1.13'],
+            result2:['2.1','2.2','2.3','2.4']
+        },
+        {
+            result1:['1.13'],
+            result2:['2.5']
+        },
+    ]
+}