front
/
preliminary


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560
							<template>
  <div class="page">
    <Head :activeTab='activeTab' :allMoudles='allMoudles' :progress='progress'/>
    <!-- <div class="progress-bar">
      <div class="title">
        <span :class="{'active':activeTab==i.type}" :style="{width:(100/allMoudles.length)+'%'}" v-for="i in allMoudles">{{i.name}}</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>
          <span v-if="!canceledSym&&num<1" class="edit" @click="cancelSymptom">修改</span>
        </div>
        <div v-for="(item,idx) in symptomQasList" :key="'0'+idx+item.id" v-if="activeTab">
          <Dialog :idx="idx" v-if="item.show" :item="item" @cancel="cancelSelected" :num="activeNum" :cancelNum="canceledQa" :extNum ="[]" :cancelTab="cancelTab" :isLast="idx===symptomQasList.length-1"/>
        </div>
        <div v-for="(item,idx) in diagnoseQasList" :key="'1'+idx+item.id" v-if="activeTab==moduleKeys[1]||activeTab==moduleKeys[2]||activeTab==moduleKeys[3]">
          <Dialog :idx="idx" v-if="item.show" :item="item" @cancel="cancelSelected" :num="activeNum" :extNum ="[symptomQasList.length]" :cancelNum="canceledQa" :cancelTab="cancelTab" :isLast="idx===diagnoseQasList.length-1"/>
        </div>
        <div v-for="(item,idx) in othersQasList" :key="'2'+idx+item.id" v-if="activeTab==moduleKeys[2]||activeTab==moduleKeys[3]">
          <Dialog :idx="idx" v-if="item.show" :item="item" @cancel="cancelSelected" :num="activeNum" :extNum ="[symptomQasList.length,diagnoseQasList.length]" :cancelNum="canceledQa" :cancelTab="cancelTab" :isLast="idx===othersQasList.length-1"/>
        </div>
        <div v-for="(item,idx) in addContentQasList" :key="'3'+idx+item.id" v-if="activeTab==moduleKeys[3]">
          <Dialog :idx="idx" v-if="item.show" :item="item" @cancel="cancelSelected" :num="activeNum" :extNum ="[symptomQasList.length,diagnoseQasList.length,othersQasList.length]" :cancelNum="canceledQa" :cancelTab="cancelTab"/>
        </div>
      </div>
    </div>
    <MultSelect @updataResult="updataResultSingle" :num="num" :symptomResult="symptomResult" v-if="type==3"></MultSelect>
    <Select @updataResult="updataResultSingle" :num="num" @getExtQa="addExtQa" :symptomResult="symptomResult" v-if="type == 2"></Select>
    <Radio @updataResultSingle="updataResultSingle" @getExtQa="addExtQa" :num="num" :symptomResult="symptomResult" v-if="type == 1"></Radio>
    <!--普通单列拨盘-->
    <Picker v-if="type==10" @confirm="updataResultSingle" :columns="getColumns()" :num="num" :defaultIndex = "defaultIndex"></Picker>
    <!--时间拨盘，拨盘内容写死-->
    <Picker v-if="type == 9" :symptomResult="symptomResult" :columns="getTimeColumns()" :defaultVal="pickDVal" @confirm="updataResultSingle" :num="num" :defaultIndex = "defaultIndex"></Picker>
    <PushSymptom v-if="type == 99" @updataResult="updataResultSingle" :num="num" @warning="showWarn"></PushSymptom>
    <!-- 上传图片 -->
    <UploadImg v-if="type==4"
               :num="num"
               :item="symptomResult"
               :moduleType="symptomResult.type"
               @updataResult="updataResultSingle"
               :imgList="imgs"/>
    <!-- 输入框 -->
    <!--<Input v-if="type==7"
           :num="num"
           :item="symptomResult"
           :key="symptomResult.id"
           @updata="updataResultSingle"/>-->
    <!-- 文本域 -->
    <ComTextArea v-if="type==6 || type == 5"
                 :num="num"
                 :item="symptomResult"
                 width="92%"
                 @updata="updataResultSingle"/>
    <div class="submit" v-if="showPreview">
      <a href="javascript:void(0)" @click="previewRes">提交并预览</a>
    </div>
    <!--<div v-if="wrong" class="tip">{{waring}}</div>-->
    <TipWarning v-if="wrong" :text="waring" @close="closeTip"/>
  </div>
</template>
<script>
import BScroll from 'better-scroll';
import Radio from '../common/Radio';
import Select from '../common/Select';
import Dialog from '../common/Dialog';
import Picker from '../common/Picker';
import Label from '../common/Label.vue';
import ComTextArea from '../common/ComTextArea.vue';
/*import Input from '../common/Input.vue';*/
import PickTime from '../common/PickTime.vue';
import UploadImg from '../common/UploadImg.vue';
import PushSymptom from '../common/PushSymptom.vue';
import ConfirmBox from '../common/ConfirmBox'
import UsualSymptom from '../common/UsualSymptom';
import MultSelect from '../common/MultSelect.vue';
import TipWarning from '../common/TipWarning.vue';
import Head from '../common/Head.vue';
import api from "../utils/api.js";
import {mapState} from 'vuex';
import {moduleCP,moduleConfig,getValuesArr,getNSum} from '@utils/tools'

export default {
  name:'MainPage',
  data(){
    return {
      num:-1,//题目计数
      pickDVal:'1天',    //时间控件默认值
      allMoudles:[],
      showUsual:false,    //常用症状显示
      activeTab:1,      //当前模块
      activeNum:0,    //当前问题的index,整体顺序
      scroll:null,
      canceledSym:false,    //是否已修改过主症状
      canceledQa:-1,
      cancelTab:-1,
      deledUpload:[],  //被删除的上传控件数据(记录用于修改时恢复）
      type :-1,       //当前显示的控件类型
      showPreview:false,//显示预览按钮
      selectedSymptom:{},
      symptomResult:'',//症状选择
      connectResult:[],//关联问题的id
      contentResult:{},//选中的结果val医生端显示，valp患者端显示
      symptomQasList:[],//症状详情所有的问题
      diagnoseQasList:[], //诊疗详情所有问题
      othersQasList:[],//其他情况所有问题
      addContentQasList:[],
      moduleMap:{
        1:'symptom',
        51:'diagnose',
        3:'others',
        52:'addContent'
      },
      defaultIndex: 0, //温度默认值
      order:0,
      userInfo: {}, //用户信息
      pdbm:'8.5rem',
      waring:'',        //错误提示语
      wrong:false,      //是否显示错误toast
      showConfirm: false,
      time:1000,
    }
  },
  created() {
    //const userInfo= JSON.parse(localStorage.getItem("userInfo"))
    const userInfo = this.$store.state.pathInfo;
    this.userInfo = userInfo;
    let tmpModule = moduleConfig(this.config,this.tmpAllMoudles);
    this.allMoudles = tmpModule.data;
    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:{
    ...mapState({
      imgs: state => state.diagnose.imgSrc,
      tmpAllMoudles: state => state.allMoudles,
      config: state => state.sysConfig,
    }),
    moduleKeys(){
      return this.allMoudles.map((it)=>{
        return it.type;
      });
    },
    progress(){
      if(this.num===-1){
        return '0.1px';
      }
      const moduleName = this.moduleMap[this.activeTab]+'QasList';
      const precent = (this.num+1)/this[moduleName].length;
      return precent*100+"%";
    }
  },
  watch:{
    num:function(){
      let n=0;
      let numArr=this.moduleKeys.map((i,index)=>{
        if(this.activeTab!=-1&&i==this.activeTab){
          n=index;
        }
        return this[this.moduleMap[i]+'QasList'].length;
      });
      numArr.length=n;
      this.activeNum = getNSum(numArr)+this.num;
    }
  },
  methods:{
    getColumns(){
      return getValuesArr(this.symptomResult.questionDetailList);
    },
    previewRes(){
      this.$router.push({
        path:'/preview'
      })
    },
    updata(){
      this.symptomQasList = [];
      //this.pdbm = '8.5rem';
      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.order = order
      this.scrollDown()
    },
    getTimeColumns(){
      let num = [];
      for(let i = 1; i <=60; i++) {
        num.push(i)
      }
      let unit = ['分钟', '小时', '天', '周', '月','年'];
      return [
        {
          values:num,
          className:'column1',
          defaultIndex: 0
        },
        {
          values:unit,
          className:'column2',
          defaultIndex: 2
        },
      ]
    },
    cancelSelected(){     //修改题目
      let moduleName='',tmpArr=[],tmpPreItem={},tmpNowItem={};
      moduleName = this.moduleMap[this.activeTab]+'QasList';
      tmpArr = this[moduleName];
      tmpNowItem = tmpArr[this.num];
      this.type = -1;
      tmpNowItem?tmpNowItem.show = false:'';      //最后一题时没有下一题
      const keyIdx = this.moduleKeys.findIndex((i)=>i==this.activeTab);
      if(this.activeTab!==this.moduleKeys[0]&&this.num===0){     //取消上一阶段的最后一题时
        this.activeTab=this.moduleKeys[keyIdx-1];
        this.cancelTab=keyIdx-1;
        moduleName = this.moduleMap[this.activeTab]+'QasList';
        const n = this[moduleName].length-1;
        tmpPreItem = this[moduleName][n];
        this.num=n;
      }else{
        this.cancelTab=keyIdx;
        tmpPreItem = tmpArr[this.num-1];
        this.num=this.num-1;
      }
      tmpPreItem.content='';
      this.symptomResult = tmpPreItem;
      const timer = setTimeout(()=>{
        this.type = tmpPreItem.controlType;
        clearTimeout(timer);
      });
      this.canceledQa=this.num;     //记录被修改过的题目，只可修改一次
    },
    formatQaArr(obj){
      let arr = [],nobj=JSON.parse(JSON.stringify(obj));
      for(let i in nobj){
        arr.push(nobj[i]);
      }
      return arr;
    },
    addExtQa(obj,i){
      const mName=this.moduleMap[this.activeTab];
      let moduleName = mName+'QasList';
      const dataArr = this.formatQaArr(obj);
      this[moduleName].splice(i+1,0,...dataArr);
      this.$store.commit("setModuleDatas",{data:this[moduleName],mName});
    },
    updataResultSingle(result,contentResult,num){
      this.num = num;
      this.type = -1;
      const mkeys =this.moduleKeys;
      let moduleName = this.moduleMap[this.activeTab]+'QasList';
      let tmpArr = JSON.parse(JSON.stringify(this[moduleName]));
      tmpArr[num-1].content = contentResult.valp;
      //选没有可上传报告，则上传控件不显示
      const noUpload = this.symptomResult.id===999999&&contentResult.valp.indexOf("没有")!==-1;
      if(noUpload&&this.deledUpload.length===0){    //是否可上传没有被修改过
        this.deledUpload=tmpArr.splice(num,1);
        this.$store.commit("cancelImgs");
      }else if(this.symptomResult.id===999999&&!noUpload&&this.deledUpload.length>0){
        tmpArr.splice(num,0,...this.deledUpload);
        this.$store.commit("cancelImgs");
      }

      this[moduleName] = tmpArr;
      //上传的图片及是否有可上传***答案不显示在预览所以不记录到state.diagnose.text中
      if(this.symptomResult.id!==999999&&this.symptomResult.controlType!=4){
        this.$store.commit('setText', { type: this.activeTab,
          text: contentResult.val,
          textP: contentResult.valp,
          idx:contentResult.idx,
          flag:contentResult.flag,
          isEdit:this.num-1==this.canceledQa
        });
      }
      //console.log(this.$store.state);   //最后一题答完
      if(+num===this[moduleName].length||(noUpload&&+num===this[moduleName].length+1)){
        if(this.activeTab===mkeys[mkeys.length-1]){   //最后一个模块时显示预览按钮
          this.showPreview=true;
          return;
        }
        const state = this.$store.state;
        const tabIndx =  this.moduleKeys.findIndex((i)=>i==this.activeTab);
        this.activeTab=this.moduleKeys[+tabIndx+1];   //进入下一个阶段问题
        this.num = 0;
        moduleName = this.moduleMap[this.activeTab]+'QasList';
        const mDataName = this.moduleMap[this.activeTab];
        this[moduleName] = JSON.parse(JSON.stringify(state[mDataName].datas));
        let tmpArrDetail1 = JSON.parse(JSON.stringify(this[moduleName][0]));
        this[moduleName][0] = tmpArrDetail1;
        const tmpNowItem = this[moduleName][this.num];
        let timer = setTimeout(() => {
          this.type = tmpNowItem.controlType;
          tmpNowItem.show = true;
          //console.log(tmpNowItem)
          this.symptomResult = tmpNowItem;
        });
        this.$nextTick(()=>{
          this.scroll.refresh()
          this.scroll.scrollTo(0, this.scroll.maxScrollY,500)
        })
        return;
      }
      let tmpArrDetailResult = JSON.parse(JSON.stringify(this[moduleName][num]));
      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.$nextTick(()=>{
        this.scroll.refresh()
        this.scroll.scrollTo(0, this.scroll.maxScrollY,500)
      })
    },
    showWarn(text){
      this.waring=text;
      this.wrong=true;
    },
    closeTip(){
      this.wrong=false;
      /*const _this=this;
      const timer=setTimeout(()=>{
        _this.wrong=false;
        clearTimeout(timer)
      },4500);*/
    },
    cancelSymptom(){      //修改（即删除）已选主症
      this.symptomQasList = [];
      this.selectedSymptom=[];
      this.showUsual=true;
      this.type=-1;
      this.$store.commit('setChoose', { choose: [], type: moduleCP['symp'] });
      this.canceledSym = true;
    },
    selectUsual(sym){
      this.getSymptomQas(sym.questionId);     //获取症状下的关联问题
      sym.idx=1;    //标记主诉
      this.$store.commit('setChoose', { choose: [sym], type: moduleCP['symp'] });
      this.selectedSymptom = sym;   //设置搜索选中症状
      this.showUsual=false; //关闭症状选择进入下一个问题
      this.pdbm = '11rem'
      setTimeout(() => {
        this.scrollDown()
      }, 0);
    },
    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 ;
          }
          let qaLis = data.questionMapping;
          if(qaLis.length===0){
            this.wrong = true;
            this.waring ='该症状数据未维护';
            return ;
          }
          //qaLis.length=2;     //开发测试代码，要删除
          qaLis[0].show=true;   //第一题自动显示
          this.type = qaLis[0].controlType;
          this.symptomResult = qaLis[0];
          this.$store.commit('setSymptomDatas',qaLis);
          this.symptomQasList = this.$store.state.symptom.origin;
        }else{

        }
      });
    },
    scrollDown(){
      this.scroll.scrollTo(0, this.scroll.maxScrollY)
    },
  },
  components:{
    Radio,
    Select,
    Dialog,
    Picker,
    Label,
    ComTextArea,
    /*Input,*/
    PickTime,
    UploadImg,
    PushSymptom,
    ConfirmBox,
    UsualSymptom,
    MultSelect,
    TipWarning,
    Head
  }
}
</script>
<style lang="less" scoped>
  @import "../less/base.less";
.wrapper {
  height: 100%;
  width: 100%;
  position: fixed;
  box-sizing: border-box;
  overflow: hidden;
  top: 0.86rem;
}
.scrollPart {
  // padding-bottom: 5rem;
  // padding-top: 1.44rem;
  // box-sizing: border-box;
}
.progress-bar {
  height: .8rem;
  line-height: 0.44rem;
  background: #fff;
  color: #aaa;
  /*margin-bottom:.4rem;*/
  .title{
    height: 100%;
  }
  span{
    display: inline-block;
    font-size: .26rem;
    color: #aaa;
    text-align: center;
    &:not(:last-child):after{
        content: ">";
        float: right;
        color: #aaa;
     }
  }
  .active{
    font-size: #font[dialog];
    color: #colors[theme];
    font-weight: 500;
  }
  .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: #font[dialog];
    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: #font[dialog];
    padding: .24rem;
    display: inline-block;
  }
  img {
    width: 0.8rem;
    height: 0.8rem;
    margin-right: .24rem;
  }
}
  .edit{
    color: #colors[theme];
    font-style: normal;
    font-size: #font[dialog];
    float: right;
    display: inline-block;
    margin-top: .56rem;
    margin-right: .24rem;
  }
  .submit{
    position: fixed;
    bottom: 0;
    width: 100%;
    a{
      display: inline-block;
      width: 100%;
      height: 0.88rem;
      font-size: #font[dialog];
      background-color: #colors[btn];
      line-height: 0.88rem;
      margin-top: 0.8rem;
      text-align: center;
      color: #fff;
    }
  }

</style>