preliminary/src/components/Others.vue

<template>
  <div class="other-wrap">
    <div v-for="(it,i) in dtoList" 
        v-if="dtoList"
        :key="it.id"
        class="label">
        <p class="quest">{{i + 1 +'.' + it.name}}</p>
        <Label v-if="it.controlType==0"
              :item="it"
              :ppId="it.id" 
              :moduleType="datas.type" 
              @setDetail="setDetail"
              @updateOrig="updateOrig"/>
        <!-- 输入框 -->
        <Input v-if="it.controlType==6 || it.controlType==7"
            :item="it"
            :key="it.id"
            :uFlag="uFlag"
            @updata="updataData"/>
    </div>
    <div class="result" v-if="checkText.length>0">
      <p class="title">其他病史</p>
      <!-- <p v-for="(v,i) in checkText">{{v.text}}</p> -->
      <p>{{getText()}}</p>
    </div>
    <div class="foot">
      <span class="back" @click="beBack">{{'返回'+ preName}}</span>
      <span class="next" @click="toNext">{{'进入'+ nextName}}</span>
    </div>
    <div class="detail" v-if="show">
      <DetailBox @close="closeDetal" 
              :data="labelDetail" 
              :moduleType="datas.type"
              :ppId="ppId"
              v-if="labelDetail.questionMapping&&labelDetail.questionMapping.length>0"
              @pComplete="complete"/>
    </div>
  </div>
</template>
<script type="text/javascript">
  import UploadImg from '../common/UploadImg.vue';
  import Label from '../common/Label.vue';
  import DetailBox from './DetailBox.vue';
  import Toast from '../common/Toast.vue';
  import Input from '../common/Input.vue';
  export default {
    name:'Others',
    data(){
      let {origin,text} = this.$store.state.others;
      return{
        msg:"其他情况",
        // imgs:this.$store.state.others.imgSrc,
        dtoList:origin, //模板数据
        labelDetail:{}, //标签明细
        checkText:text, //选中的文字
        ppId:null,
        show:false,
        uFlag:false
      }
    },
    props:['datas','preName','nextName'],
    created(){},
    methods:{
      beBack(){
        this.$emit('back');
      },
      toNext(){
        this.$emit('next');
        // console.log("模板数据:",this.datas,"诊疗数据:",this.dtoList)
      },
      setDetail(obj){
        this.labelDetail = obj.detail;
        this.ppId = obj.ppId;
        this.show = true;
      },
      complete(){
        this.show = false;
        this.labelDetail = {};
        this.ppId = null;
        // 处理明细选中的值
      },
      closeDetal(){
        this.show = false;
        this.labelDetail = {};
        this.ppId = null;
      },
      updateOrig(){
        let origin = this.$store.state.diagnose.origin;
      },
      updataData(data){//输入框存值
        console.log("输入框的值：",data,this.dtoList)
        let list = this.dtoList;
        for(let i in list){
          if(list[i].id==data.id){
            list.splice(i,1,data)
          }
        }
        this.$store.commit('setOrigin',{type:'3',data:data,pId:data.id});
        this.$store.commit('setText',{type:'3',text:data.value,pId:data.id}); 
      },
      getText(){
        let textArr = this.checkText;
        let msg = "";
        for(let k in textArr){
          msg += textArr[k].text + '；'
        }
        return msg;
      }
    },
    components:{
      UploadImg,
      Label,
      DetailBox,
      Input
    },
    watch:{
      dtoList:{
        handler(newVal,oldVal){
          // console.log("诊疗数据更新:",newVal,oldVal); 
        },
        deep:true
      }
    },
  }
</script>
<style lang="less" scoped>
@import '../less/base.less';
  .other-wrap{
    font-size: .3rem;
    .quest{
      color: #000;
      margin-bottom: .36rem;
      font-weight: 700;
    }
    .label{
      .label;
    }
    .result{
      .title{
        color: #4F50FF;
        padding-left: .1rem;
        border-left: .08rem solid #4F50FF;
        margin-bottom: .19rem;
        font-weight: 700;
      }
      p{
        color: #666;
        line-height: .44rem;
      }
    }
  }
  .foot{
    .dbfooter;
  }
  .detail{
    .mask;
    z-index: 66;
  }
  
</style>