瀏覽代碼

Merge remote-tracking branch 'remotes/origin/development' into dev

Luolei 6 年之前
父節點
當前提交
54aa3aad2d

+ 24 - 5
src/common/CheckBox.vue

@@ -1,23 +1,39 @@
 <template>
   <div class="check-wrap" v-if="item">
-    <p class="quest">{{item.name}}</p>
+    <p class="quest">{{indx + '.' + item.name}}</p>
     <img :src="item.url.replace('{imageUrlPrefix}',imgUrl)" v-if="item.url">
     <p v-for="(it,index) in item.questionDetailList" class="list">
-      <img src="../images/check-default.png">
-      <span>{{it.name}}</span>
+      <img :src="checkId.includes(it.id)?check:defaultPic" @click="handleClick(it,index)">
+      <span :class="{'check':checkId.includes(it.id)}">{{it.name}}</span>
     </p>
   </div>
 </template>
 <script type="text/javascript">
 import tools from '@utils/tools.js';
+import icon from '../images/check-default.png'
+import checkIcon from '../images/check.png'
   export default{
     name:'CheckBox',
     data(){
       return{
-        imgUrl:tools.imageUrlPrefix
+        imgUrl:tools.imageUrlPrefix,
+        defaultPic:icon,
+        check:checkIcon,
+        checkId:[]
       }
     },
-    props:['item']
+    props:['item','indx'],
+    methods:{
+      handleClick(it){
+        const id = it.id;
+        let ids = this.checkId;
+        if(ids.includes(id)){
+          this.checkId.splice(ids.indexOf(id),1);
+        }else{
+          this.checkId.push(id);
+        }
+      }
+    }
   }
 </script>
 <style lang="less" scoped>
@@ -40,5 +56,8 @@ import tools from '@utils/tools.js';
         vertical-align: middle;
       }
     }
+    .check{
+      color: #4F50FF;
+    }
   }
 </style>

+ 26 - 6
src/common/Radio.vue

@@ -1,29 +1,46 @@
 <template>
   <div class="radio-wrap" v-if="item">
-    <p class="quest">{{item.name}}</p>
+    <p class="quest">{{indx + '.' + item.name}}</p>
     <img :src="item.url.replace('{imageUrlPrefix}',imgUrl)" v-if="item.url">
     <p v-for="(it,index) in item.questionDetailList" :key="it.id" class="list">
       <img :src="index==current?check:defaultPic" @click="handleClick(it,index)">
-      <span>{{it.name}}</span>
+      <!-- <img :src="it.select?check:defaultPic" @click="handleClick(it,index)"> -->
+      <span :class="{'check':index==current}">{{it.name}}</span>
     </p>
   </div>
 </template>
 <script type="text/javascript">
 import icon from '../images/radio-default.png'
 import checkIcon from '../images/radio-check.png'
+import {deepClone} from '@utils/tools.js'
   export default{
     name:'Radio',
     data(){
       return{
         defaultPic:icon,
         check:checkIcon,
-        current:null
+        current:null,
+        datas:{}
       }
     },
-    props:['item'],
+    props:['item','indx','pId'],
     methods:{
-      handleClick(item,index){
-        this.current = index;console.log(123,item)
+      handleClick(it,index){
+        this.current = index;
+        const list = JSON.parse(JSON.stringify(this.item));
+        let data = list.questionDetailList.slice(0); //数组深拷贝?
+        // let data = deepClone(list);
+        let value = "";
+        for(let i=0;i<data.length; i++){
+          data[i].select = 0
+          if(i==index){
+            data[i].select = 1;
+            value = data[i].name;
+          }
+        }
+        const newData = Object.assign({},this.item,{questionDetailList:data},{value:value})
+        this.$store.commit('setDatas',{data:newData,pId:this.pId});
+        this.$store.commit('getUpdate'); //更新数据
       }
     }
   }
@@ -47,6 +64,9 @@ import checkIcon from '../images/radio-check.png'
         width: .38rem;
         vertical-align: middle;
       }
+      .check{
+        color: #4F50FF;
+      }
     }
   }
 </style>

+ 157 - 0
src/common/UploadImg.vue

@@ -0,0 +1,157 @@
+<template>
+  <div class="img-wrap">
+    <p class="name">{{item.name|| msg}}</p>
+    <div class="box">
+      <ul class="upload-imgs">
+        <li v-if="imgLen>=6 ? false : true">
+          <input type="file" class="upload" @change="addImg" accept="image/*" ref="inp" style="display:none"/>
+          <p @click="handleUpload">点击上传</p>
+        </li>
+        <li v-for='(value, key) in imgs'>
+          <!-- <p class="img"><img :src="getObjectURL(value)"><a class="close" @click="delImg(key)">×</a></p> -->
+          <p class="img"><img :src="value"><a class="close" @click="delImg(key)">×</a></p>
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+<script type="text/javascript">
+  export default{
+    name:'UploadImg',
+    data(){
+      return{
+        mag:"上传图片",
+        imgs:{},
+        imgLen:0
+      }
+    },
+    props:['item'],
+    methods:{
+      handleUpload(){
+        const inp = this.$refs.inp;
+        inp.click();
+      },
+      delImg(key){
+        console.log(2222,key)
+      },
+      addImg(){
+        // 上传图片进行压缩,压缩后超过4M则不允许上传
+        let fileTag = this.$refs.inp;
+        let img = this.$refs.img;
+        let file = fileTag.files[0];console.log("文件信息:",file)
+        const that = this;
+        this.imgBase64(file, function (image, canvas) {
+            var maxSize = 4*1024; // 4M
+            var fileSize = file.size/1024; //kb 图片大小
+            var uploadSrc;
+            var uploadFile;
+            if(fileSize > maxSize) { // 如果图片大小大于4m,进行压缩
+              console.log(maxSize,fileSize, maxSize/fileSize );
+              uploadSrc = canvas.toDataURL(file.type, maxSize/fileSize);
+                uploadFile = that.dataURLtoFile(uploadSrc, file.name.split('.')[0]); // 转成file文件
+                // uploadFile = that.convertBase64UrlToBlob(uploadSrc); // 转成blob
+                //console.log("大于:",uploadFile)
+              } else {
+                uploadSrc = image.src; //canvas.toDataURL(file.type,0.5);
+                uploadFile = file;
+              }
+
+              var compressedSize = uploadFile.size / 1024 / 1024;
+              //console.log("压缩后大小:",compressedSize)
+              if(compressedSize.toFixed(2) > 4.00) {
+                alert('上传图片不可超过4M');
+              } else {
+                // img.setAttribute('src',uploadSrc);
+                // img.className = 'img';
+                let key = file.name + new Date().getTime();
+                this.$set(this.imgs,key,uploadSrc);
+                this.imgLen++;
+              }
+          });
+      },
+      imgBase64(file, callback) {
+        var self = this;
+        // 看支持不支持FileReader
+        if (!file || !window.FileReader) return;
+        // 创建一个 Image 对象
+        var image = new Image();
+        // 绑定 load 事件处理器,加载完成后执行
+        image.onload = function(){
+            // 获取 canvas DOM 对象
+            var canvas = document.createElement('canvas')
+            // 返回一个用于在画布上绘图的环境, '2d' 指定了您想要在画布上绘制的类型
+            var ctx = canvas.getContext('2d')
+            // 如果高度超标 // 参数,最大高度
+            var MAX_HEIGHT = 3000;
+            if(image.height > MAX_HEIGHT) {
+                // 宽度等比例缩放 *=
+                image.width *= MAX_HEIGHT / image.height;
+                image.height = MAX_HEIGHT;
+              }
+            // 获取 canvas的 2d 环境对象,
+            // canvas清屏
+            ctx.clearRect(0, 0, canvas.width, canvas.height);
+            // 重置canvas宽高
+            canvas.width = image.width;
+            canvas.height = image.height;
+            // 将图像绘制到canvas上
+            ctx.drawImage(image, 0, 0, image.width, image.height);
+            callback(image, canvas);
+          };
+          if (/^image/.test(file.type)) {
+            // 创建一个reader
+            var reader = new FileReader();
+            // 将图片将转成 base64 格式
+            reader.readAsDataURL(file);
+            // 读取成功后的回调
+            reader.onload = function () {
+                // self.imgUrls.push(this.result);
+                // 设置src属性,浏览器会自动加载。
+                // 记住必须先绑定事件,才能设置src属性,否则会出同步问题。
+                image.src = this.result;
+              }
+            }
+          },
+      // 将以base64的图片url数据转换为Blob
+      convertBase64UrlToBlob(urlData) {
+        var bytes = window.atob(urlData.split(',')[1]); //去掉url的头,并转换为byte
+        //处理异常,将ascii码小于0的转换为大于0
+        var ab = new ArrayBuffer(bytes.length);
+        var ia = new Uint8Array(ab);
+        for (var i = 0; i < bytes.length; i++) {
+          ia[i] = bytes.charCodeAt(i);
+        }
+        return new Blob([ab], {type: 'image/jpg'});
+      },
+      // 将以base64的图片url数据转换为file
+      dataURLtoFile(dataurl, filename) { //将base64转换为文件
+        var arr = dataurl.split(','),
+        mime = arr[0].match(/:(.*?);/)[1],
+        bstr = atob(arr[1]),
+        n = bstr.length,
+        u8arr = new Uint8Array(n);
+        while (n--) {
+          u8arr[n] = bstr.charCodeAt(n);
+        }
+        return new File([u8arr], filename, {type: mime});
+      },
+
+    }
+  }
+</script>
+<style lang="less" scoped>
+  .img-wrap{
+    font-size: .3rem;
+    .name{
+      color: #000;
+      margin-bottom: .36rem;
+      font-weight: 700;
+    }
+    .upload-imgs{
+      margin-bottom: .2rem;
+      li{
+        
+      }
+    }
+  }
+</style>

+ 4 - 5
src/components/AddContent.vue

@@ -10,7 +10,7 @@
     </div>
     <div
       class="footer"
-      @click="toNext"
+      @click="back"
     >上一步</div>
   </div>
 </template>
@@ -29,12 +29,11 @@ export default {
     this.dataTrd = this.allMoudles&&this.allMoudles.moduleDetailDTOList
   },
   methods: {
-    toNext() {
-      // 把1切换成完成图标,且2高亮
-      this.$emit("nextStep", 0);
+    back() {
+      this.$emit("back");
     },
     changeVal(value,idx){
-      console.log(value,idx)
+      // console.log(value,idx)
     }
   },
   components: {

+ 19 - 4
src/components/Detail.vue

@@ -1,8 +1,18 @@
 <template>
   <div class="detail-wrap">
     <div v-for="(item,index) in datas">
-      <Radio v-if="item.controlType==1" :item="item" />
-      <CheckBox v-if="item.controlType==2" :item="item" />
+      <Radio v-if="item.controlType==1" 
+            :item="item" 
+            :indx="index+1" 
+            :pId="id"
+            :key="item.id"
+            @updata="updataData"/>
+      <CheckBox v-if="item.controlType==2" :item="item" :indx="index+1"/>
+      <!-- 输入框 -->
+      <div class="inp" v-if="item.controlType==6">
+        <p class="name">{{index+1+'.'+item.name}}</p>
+        <input type="" name="">
+      </div>
     </div>
   </div>
 </template>
@@ -16,15 +26,20 @@ import CheckBox from '../common/CheckBox.vue';
 
       }
     },
-    props:['datas'],
+    props:['datas','id'],
     components:{
       Radio,
       CheckBox
+    },
+    methods:{
+      updataData(data){
+        // console.log("源数据:",this.datas,'更改后:',data)
+      }
     }
   }
 </script>
 <style lang="less" scoped>
   .detail-wrap{
-    padding: .3rem .5rem 2.1rem .6rem;
+    padding: .3rem .5rem .3rem .6rem;
   }
 </style>

+ 35 - 15
src/components/DetailBox.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="detailBox-wrap">
+  <div class="detailBox-wrap" ref="detailBox">
     <div class="head">
       <span class="icon" @click="close">
         <img src="../images/small-close.png">
@@ -8,9 +8,9 @@
       <span>清空</span>
     </div>
     <div class="main">
-      <Detail :datas="data.questionMapping" />
+      <Detail :datas="data.questionMapping" :id="data.id"/>
     </div>
-    <div class="foot">完成</div>
+    <div class="foot" @click="complete">完成</div>
   </div>
 </template>
 <script type="text/javascript">
@@ -22,9 +22,28 @@
         msg:"胸痛详情"
       }
     },
+    mounted(){
+      const box = this.$refs.detailBox;
+      const height = document.documentElement.clientHeight;
+      box.style.height = height - 100 + 'px';
+    },
     methods:{
       close(){
         this.$emit("close","胸痛");
+      },
+      complete(){//拼接value
+        const id = this.data.id;
+        const datas = this.$store.state.datas;
+        const current = datas[id];
+        const detail = current.questionMapping;
+        let text = "";
+        for(let i in detail){
+          if(detail[i].value){
+            text += detail[i].value+',';
+          }
+        }
+        let msg = current.name+ ',' + text;
+        this.$emit("pComplete",msg.substring(0,msg.length-1));
       }
     },
     props:['data'],
@@ -37,17 +56,18 @@
 @import '../less/base.less';
   .detailBox-wrap{
     width: 100%;
-    height: 100%;
-    // height: calc(100%-2.03rem);
+    // height: 100%;
+    // height: calc(~"100%-1.15rem");
     overflow-y: auto;
     position: fixed;
-    top: 1.15rem;
+    // top: 1.15rem;
+    bottom: 0;
     left: 0;
     z-index: 666;
     background: #fff;
     border-radius: .08rem .08rem 0 0;
     font-size: .3rem;
-    padding-bottom: .88rem;
+    // padding-bottom: .88rem;
     .head{
       height: .88rem;
       line-height: .88rem;
@@ -75,14 +95,14 @@
 
     }
     .foot{
-      .footer;
-      // width:100%;
-      // height: .88rem;
-      // line-height: .88rem;
-      // text-align: center;
-      // color:#fff;
-      // font-size: .32rem;
-      // background: linear-gradient(-270deg, #4F4FFF,#4F8BFF);
+      // .footer;
+      width:100%;
+      height: .88rem;
+      line-height: .88rem;
+      text-align: center;
+      color:#fff;
+      font-size: .32rem;
+      background: linear-gradient(-270deg, #4F4FFF,#4F8BFF);
     }
   }
 </style>

+ 91 - 0
src/components/DiagTreat.vue

@@ -0,0 +1,91 @@
+<template>
+  <div class="treat-wrap">
+    <div v-for="(it,i) in datas.moduleDetailDTOList" 
+        v-if="datas&&datas.moduleDetailDTOList"
+        :key="it.id">
+      <div class="label" v-if="it.controlType==0">
+        <p class="quest">{{it.name}}</p>
+        <span class="symp" v-for="item in it.questionMapping">{{item.name}}</span>
+      </div>
+      <UploadImg v-if="it.controlType==4" :item="it"/>
+    </div>
+    <div class="result">
+      <p class="title">治疗情况</p>
+      <p>经典款了估计的结果</p>
+    </div>
+    <div class="foot">
+      <span class="back" @click="beBack">{{'返回'+ preName}}</span>
+      <span class="next" @click="toNext">{{'进入'+ nextName}}</span>
+    </div>
+  </div>
+</template>
+<script type="text/javascript">
+  import UploadImg from '../common/UploadImg.vue'
+  export default {
+    name:'DiagTreat',
+    data(){
+      return{
+        msg:"诊疗情况",
+        chooseSymp:[{name:'未治疗'}]
+      }
+    },
+    props:['datas','preName','nextName'],
+    methods:{
+      beBack(){
+        this.$emit('back');
+      },
+      toNext(){
+        this.$emit('next');
+      }
+    },
+    components:{
+      UploadImg
+    }
+  }
+</script>
+<style lang="less" scoped>
+@import '../less/base.less';
+  .treat-wrap{
+    font-size: .3rem;
+    .quest{
+      color: #000;
+      margin-bottom: .36rem;
+      font-weight: 700;
+    }
+    .label{
+      padding-bottom: .2rem;
+      .symp{
+        display: inline-block;
+        width:1.9rem;
+        height: .74rem;
+        line-height: .74rem;
+        border: 1px solid #DFE0E4;
+        border-radius: .08rem;
+        text-align: center;
+        color: #7C828E;
+        margin: 0 0 .3rem .3rem;
+        box-sizing: border-box;
+      }
+      .symp:nth-child(3n+2){
+        margin-left: 0;
+      }
+    }
+    .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;
+  }
+  
+</style>

+ 86 - 0
src/components/Others.vue

@@ -0,0 +1,86 @@
+<template>
+  <div class="other-wrap">
+    <div v-for="(it,i) in datas.moduleDetailDTOList" 
+        v-if="datas&&datas.moduleDetailDTOList"
+        :key="it.id">
+      <div class="label" v-if="it.controlType==0">
+        <p class="quest">{{it.name}}</p>
+        <span class="symp" v-for="item in it.questionMapping">{{item.name}}</span>
+      </div>
+    </div>
+    <div class="result">
+      <p class="title">其他病史</p>
+      <p>结果</p>
+    </div>
+    <div class="foot">
+      <span class="back" @click="beBack">{{'返回'+ preName}}</span>
+      <span class="next" @click="toNext">{{'进入'+ nextName}}</span>
+    </div>
+  </div>
+</template>
+<script type="text/javascript">
+  export default {
+    name:'Others',
+    data(){
+      return{
+        msg:"诊疗情况",
+        chooseSymp:[{name:'未治疗'}]
+      }
+    },
+    props:['datas','preName','nextName'],
+    methods:{
+      beBack(){
+        this.$emit('back');
+      },
+      toNext(){
+        this.$emit('next');
+      }
+    }
+  }
+</script>
+<style lang="less" scoped>
+@import '../less/base.less';
+  .other-wrap{
+    font-size: .3rem;
+    .quest{
+      color: #000;
+      margin-bottom: .36rem;
+      font-weight: 700;
+    }
+    .label{
+      padding-bottom: .2rem;
+      .symp{
+        display: inline-block;
+        width:1.9rem;
+        height: .74rem;
+        line-height: .74rem;
+        border: 1px solid #DFE0E4;
+        border-radius: .08rem;
+        text-align: center;
+        color: #7C828E;
+        margin: 0 0 .3rem .3rem;
+        box-sizing: border-box;
+      }
+      .symp:nth-child(3n+2){
+        margin-left: 0;
+      }
+    }
+    .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;
+  }
+  
+</style>

+ 83 - 27
src/components/Symptom.vue

@@ -1,26 +1,29 @@
 <template>
   <div class="symp-wrap">
     <div class="choose" v-if="chooseSymp.length>0">
-      <h3>已选症状</h3>
+      <p class="quest">已选症状</p>
       <p class="choo-symp" v-for="(v,i) in chooseSymp">
         <span>{{v.name}}</span>
         <span @click="deletSymp(v,i)"><img src="../images/delete.png" alt=""></span>
       </p>
     </div>
     <div class="label">
-      <h3>请问您有哪些不适?</h3>
+      <p class="quest">请问您有哪些不适?</p>
       <span class="symp" 
       v-for="(it,ind) in symp" 
       :key="it.conceptId"
       @click="showDetil(it)">{{it.name}}</span>
     </div>
     <div class="result" v-if="JSON.stringify(checkText) !== '{}'">
-      <h4>症状情况</h4>
+      <p class="title">症状情况</p>
       <p v-for="(value,key,index) in checkText">{{value}}</p>
     </div>
-    <div class="footer" @click="toNext">下一步</div>
+    <div :class="['footer',{'nofoot':chooseSymp.length==0}]" @click="toNext">下一步</div>
     <div class="detail" v-if="show">
-      <DetailBox @close="closeDetal" :data="labelDetail"/>
+      <DetailBox @close="closeDetal" 
+              :data="labelDetail" 
+              v-if="labelDetail.questionMapping&&labelDetail.questionMapping.length>0"
+              @pComplete="complete"/>
     </div>
     <Toast :message="delText" 
           :show="showToast"
@@ -35,7 +38,8 @@ import Toast from '../common/Toast.vue';
   export default {
     name:'Symptom',
     data(){
-      const pathInfo = this.$store.state.pathInfo;
+      let {datas,update} = this.$store.state;
+      const {pathInfo,originDatas} = this.$store.state;
       return {
         age:pathInfo.patientAge,
         sexType:pathInfo.patientSex=='男'?1:(pathInfo.patientSex=='女'?2:3),
@@ -48,10 +52,13 @@ import Toast from '../common/Toast.vue';
         symp:[], //症状
         labelDetail:{}, //明细
         checkText:{}, //选中拼好的明细
-        current:null,
-        delText:"是否删除该信息?",
+        questId:null, //id
+        // symptomName:'', //点击的症状名称
+        delText:"是否删除该信息? (已填内容将清除)",
         delIndex:null,
-        showToast:false
+        showToast:false,
+        finished:false,   //是否填写了明细
+        upData:update
       }
     },
     created(){
@@ -73,26 +80,40 @@ import Toast from '../common/Toast.vue';
       },
       toNext(){
         // 把1切换成完成图标,且2高亮
-        this.$emit("nextStep",3);
+        if(this.chooseSymp.length==0){return}
+        this.$emit('next');
       },
       showDetil(item){
         this.chooseSymp.push(item);
-        this.current = item.conceptId;
-        const id = item.questionId;
+        // this.questId = item.conceptId;
+        this.questId = item.questionId;
         const param = {
           "age":this.age,
-          "id":id,
+          "id":item.questionId,
           "sexType":this.sexType
         }
         api.getById(param).then((res)=>{
           const result = res.data;
           if(result.code==0){
+            const mapping = result.data.questionMapping;
             this.labelDetail = result.data;
-            this.show = true;
+            this.$store.commit('setOrigin',result.data);
+            // this.$store.commit('getUpdate');
+            if(mapping&&mapping.length>0){
+              this.show = true;
+            } 
           }
         })
-        // 推理
-        
+        // 推理 
+        const sympText = this.getSympText();
+        this.getPush(sympText);
+      },
+      getSympText(){
+        let sympText = "";
+        for(let k in this.chooseSymp){
+          sympText += this.chooseSymp[k].name;
+        }
+        return sympText;
       },
       getPush(symptoms){//推理
         const param = {
@@ -109,36 +130,65 @@ import Toast from '../common/Toast.vue';
         })
       },
       closeDetal(msg){
-        const current = this.current;
+        const questId = this.questId;
         this.getPush(msg);
-        this.checkText = Object.assign({},this.checkText,{[current]:msg});
+        // this.checkText = Object.assign({},this.checkText,{[questId]:msg});
         this.show = false;
-        this.current = null;console.log('子组件触发关闭',this.checkText);
+        this.questId = null;
       },
       deletSymp(item,index){
         this.delIndex = index;
-        this.current = item.conceptId;
+        this.questId = item.questionId;
         if(this.chooseSymp.length==1){
-          this.delText = "是否删除该信息?删除后将重新填写预问诊流程"
+          this.delText = "是否删除该信息?删除后将重新填写预问诊流程 (已填内容将清除)"
         }
         this.showToast = true;
       },
       comfirnDel(){
         this.chooseSymp.splice(this.delIndex,1);
-        delete(this.checkText[this.current]);
-        // this.getPush(''); //删除后重新调推理-入参:拼好的内容
+        delete(this.checkText[this.questId]);
+        // 删除完-常见;其他-推送
+        if(this.chooseSymp.length>0){
+          const sympText = this.getSympText();
+          this.getPush(sympText);//删除后重新调推理-入参:拼好的内容
+        }else{
+          this.getSympList();
+        } 
         this.cancelDel();
-        console.log("确认删除:",this.chooseSymp,this.checkText)
       },
       cancelDel(){
         this.showToast = false;
         this.delIndex = null;
-        this.current = null;
+        this.questId = null;
+        this.delText = "是否删除该信息? (已填内容将清除)";
+      },
+      complete(msg){//明细填写完成
+        // 获取选择后的明细数据-拼接症状情况-关闭明细弹窗
+        // let text = this.symptomName + text;
+        this.checkText = Object.assign({},this.checkText,{[this.questId]:msg});
+        this.show = false;
+        this.questId = null;
       }
     },
     components:{
       DetailBox,
       Toast
+    },
+    computed:{
+      getQuestId(){
+        return this.upData;
+      }
+    },
+    watch:{
+      getQuestId:{
+        handler(newVal,oldVal){
+          console.log("数据更新了11",newVal,oldVal);
+          let datas = this.$store.state.datas;
+          let originDatas = this.$store.state.originDatas;
+          this.labelDetail = datas[this.questId] || originDatas[this.questId];
+        },
+        deep:true
+      }
     }
   }
 </script>
@@ -146,9 +196,10 @@ import Toast from '../common/Toast.vue';
 @import '../less/base.less';
   .symp-wrap{
     font-size: .3rem;
-    h3{
+    .quest{
       color: #000;
       margin-bottom: .36rem;
+      font-weight: 700;
     }
   }
   .choose{
@@ -198,11 +249,12 @@ import Toast from '../common/Toast.vue';
     }
   }
   .result{
-    h4{
+    .title{
       color: #4F50FF;
       padding-left: .1rem;
       border-left: .08rem solid #4F50FF;
       margin-bottom: .19rem;
+      font-weight: 700;
     }
     p{
       color: #666;
@@ -212,6 +264,10 @@ import Toast from '../common/Toast.vue';
   .footer{
     .footer;
   }
+  .nofoot{
+    opacity: 0.3;
+    background: linear-gradient(-270deg,#4F4FFF, #4F8BFF);
+  }
   .detail{
     .mask;
     z-index: 66;

+ 42 - 12
src/components/TabPage.vue

@@ -2,7 +2,8 @@
   <div class="tab-wrap">
     <div class="tab" v-if="modlues&&modlues.length>0">
       <p v-for="(it,index) in modlues" :key="it.id">
-        <span :class="{current:index==step}" v-if="type[it.type]==1">
+        <!-- <span :class="{current:index==0}" v-if="type[it.type]==1"> -->
+        <span :class="{current:index==parseInt(flag)-1}" v-if="type[it.type]==1">
           <i>{{it.type}}</i>
           {{it.name}}
         </span>
@@ -10,15 +11,33 @@
     </div>
     <!-- 内容 -->
     <div class="content">
-      <Symptom @nextStep="nextStep" v-show="step == 0"/>
-      <AddContent :allMoudles="modlues[3]" @nextStep="nextStep" v-show="step == 3"/>
+      <Symptom v-if="flag==1" @next="toNext"/>
+      <DiagTreat v-if="flag==2" 
+            :datas="modlues[1]"
+            :preName="modlues[0]&&modlues[0].name"
+            :nextName="modlues[2]&&modlues[2].name"
+            @next="toNext"
+            @back="beBack"
+            />
+      <Others v-if="flag==3" 
+            :datas="modlues[2]"
+            :preName="modlues[1]&&modlues[1].name"
+            :nextName="modlues[3]&&modlues[3].name"
+            @next="toNext"
+            @back="beBack"
+            />
+      <AddContent v-show="flag == 4" 
+        :allMoudles="modlues[3]" 
+        @back="beBack"
+         />
     </div>
-    <!-- <div class="footer">下一步</div> -->
   </div>
 </template>
 <script type="text/javascript">
   import Symptom from './Symptom.vue';
   import AddContent from './AddContent.vue';
+  import DiagTreat from './DiagTreat.vue';
+  import Others from './Others.vue';
   export default {
     name:'TabPage',
     data(){
@@ -33,23 +52,34 @@
           "3":sysConfig.length>0&&sysConfig.filter(item=>item.code=="omhistory_show")[0].value,
           "4":sysConfig.length>0&&sysConfig.filter(item=>item.code=="replenish_show")[0].value,
         },
-        step:0
+        flag:allMoudles.length>0&&allMoudles[0].type
       }
     },
     created(){
       // console.log('配置信息:',this.config,'type',this.type)
-      if(this.config.length==0){
+      if(this.config.length == 0){
         this.$router.go(-1)
       }
     },
-    methods:{
-      nextStep(idx){
-        this.step = idx
-      }
-    },
     components:{
       Symptom,
-      AddContent,
+      DiagTreat,
+      Others,
+      AddContent
+    },
+    methods:{
+      toNext(){
+        let flag = parseInt(this.flag);
+        if(this.modlues[flag]){
+          this.flag = this.modlues[flag].type;
+        } 
+      },
+      beBack(){
+        let flag = parseInt(this.flag)-1;
+        if(this.modlues[flag-1]){
+          this.flag = this.modlues[flag-1].type;
+        }
+      }
     }
   }
 </script>

二進制
src/images/pic.png


+ 27 - 1
src/less/base.less

@@ -1,6 +1,6 @@
 // 公用less
 @font-size: 13.33333333vw !important;
-
+@theme-color:#4F50FF;
 .mask{
   width:100%;
   height: 100%;
@@ -20,4 +20,30 @@
   position: fixed;
   bottom: 0;
   left: 0;
+}
+.dbfooter{
+  width:100%;
+  font-size: .32rem;
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  background: #F2F2F5;
+  .back,.next{
+    display: inline-block;
+    height: .88rem;
+    line-height: .88rem;
+    text-align: center;
+    vertical-align: top;
+  }
+  .back{
+    width: 2.5rem;
+    color: #7C828E;
+    // background: #F2F2F5;
+  }
+  .next{
+    // width: 5rem;
+    width: 4.91rem;
+    color: #fff;
+    background: linear-gradient(-270deg, #4F4FFF,#4F8BFF);
+  }
 }

+ 22 - 0
src/store.js

@@ -1,5 +1,6 @@
 import Vue from 'vue';
 import Vuex from 'vuex';
+import {deepClone} from '@utils/tools.js'
 Vue.use(Vuex);
 
 const store = new Vuex.Store({
@@ -7,6 +8,9 @@ const store = new Vuex.Store({
     pathInfo:{}, //患者信息-后续提交要用
     sysConfig:[], //系统配置项
     allMoudles:[], //模板
+    originDatas:{},  //getById获取到的数据
+    datas:{},  //处理过的数据
+    updata:false  //更新数据
   },
   mutations:{
     savePathInfo(state,param){
@@ -17,6 +21,24 @@ const store = new Vuex.Store({
     },
     saveAll(state,param){
       state.allMoudles = param;
+    },
+    setOrigin(state,param){
+      state.originDatas[param.id] = param;
+    },
+    setDatas(state,param){
+      // let originData = JSON.parse(JSON.stringify(state.originDatas[param.pId]));
+      let originData = state.datas[param.pId]?state.datas[param.pId]:JSON.parse(JSON.stringify(state.originDatas[param.pId]));
+      // let list = deepClone(originData.questionMapping);
+      let list = originData.questionMapping.slice(0);
+      for(let i=0; i<originData.questionMapping.length; i++){
+        if(originData.questionMapping[i].id==param.data.id){
+          list.splice(i,1,param.data);
+        }
+      }
+      state.datas[param.pId] = Object.assign({},state.originDatas[param.pId],{questionMapping:list});
+    },
+    getUpdate(state){//更新数据
+      state.updata = !state.updata;
     }
   }
 })

+ 10 - 1
src/utils/tools.js

@@ -8,7 +8,16 @@ const getUrlArgObject = (parm) => {
     return args[parm];//返回对象  
 } 
 
+const deepClone = (arr) =>{
+  let newArr = [];
+  for(let i in arr){
+    newArr.push(arr[i]);
+  }
+  return newArr;
+}
+
 module.exports =  {
   imageUrlPrefix,
-  getUrlArgObject
+  getUrlArgObject,
+  deepClone
 }

+ 0 - 1
webpack.dev.js

@@ -10,7 +10,6 @@ module.exports = merge(common,{
   devServer: {
     // contentBase:'./dist',
     port:'8082',
-    host:'192.168.3.126',
     openPage:'?hospitalCode=A001&hospitalDeptCode=D01&doctorCode=YS001&patientCode=1600&recordId=44',//携带参数
     proxy:{
       '/api':{