浏览代码

将详情组件提到tabPage,解决详情关闭后页面调到顶部的问题

liucf 6 年之前
父节点
当前提交
15611f6964

+ 1 - 1
src/common/Input.vue

@@ -24,7 +24,7 @@
         if(this.item.controlType==7){//数字键盘
           this.val = e.target.value=e.target.value.replace(/[^\d]/g,'')
         }
-        document.activeElement.scrollIntoViewIfNeeded(true);
+        // document.activeElement.scrollIntoViewIfNeeded(true);
         this.borColor = false;
         const newData = Object.assign({},this.item,{value:this.val,valueP:this.val});
         this.$emit("updata",newData);

+ 1 - 0
src/common/Label.vue

@@ -72,6 +72,7 @@ import {moduleCP} from '@utils/tools';
         this.$store.commit('setText',{type:this.moduleType,text:it.name,textP:(it.description||it.name),pId:it.id});
         if(it.questionMapping&&it.questionMapping.length>0){//有明细
           this.$emit("setDetail",{detail:it,ppId:this.ppId})
+          this.$store.commit('setDetail',{detail:it,ppId:this.ppId,moduleType:this.moduleType})
         }
       },
       deletSymp(e,it,index){

+ 2 - 2
src/common/MultiLineInput.vue

@@ -9,7 +9,7 @@
               :type="content.type=='number'?'tel':'text'" 
               :style="{'width':1/content.iptLis.length*100-3+'%'}" 
               :key="item.placeholder+idx" 
-              v-model="item.value"
+              v-model="txt"
               :placeholder="item.placeholder"
               @input="changeVal($event,idx,content.type)" 
               @blur="blur" 
@@ -17,7 +17,7 @@
             <input v-show="content.iptLis.length==1" class="contentVal" 
               :type="content.type=='number'?'tel':'text'" 
               :placeholder="content.placeholder" 
-              v-model="item.value" 
+              v-model="txt" 
               @input="changeVal($event,idx,content.type)" 
               @blur="blur" 
               @click="handleClick">

+ 38 - 12
src/components/DetailBox.vue

@@ -7,8 +7,8 @@
         <div class="main">
           <Detail :datas="privateData" 
                   ref="detail"
-                  :type="moduleType" 
-                  :ppId="ppId"
+                  :type="data.moduleType" 
+                  :ppId="data.ppId"
                   @check="changeCheck($event)"/>
         </div>
         <!-- <div class="foot" @click="complete">完成</div> -->
@@ -32,24 +32,28 @@
 <script type="text/javascript">
   import Detail from './Detail.vue';
   import Toast from '../common/Toast.vue';
-  import {fixedKeyboard,setScroll} from '@utils/tools.js';
+  import {fixedKeyboard,setScroll,moduleCP} from '@utils/tools.js';
   import BScroll from 'better-scroll';
   import $ from 'jquery';
   export default {
     name:'DetailBox', //点开详情的盒子
     data(){
+      const {detailInfo,detailShow} = this.$store.state;
       return{
         msg:"胸痛详情",
-        privateData:{},
+        data:detailInfo,
+        // privateData:{},
+        privateData:detailInfo.detail||{},
         compFlag:false,
         clearTxt:"是否清空当前已选内容?",
         showToast:false,
         tips:"(请完成病情预问诊可让医生提前了解病情)",
-        checkF:false //详情页有无已选项标识
+        checkF:false, //详情页有无已选项标识
+        show:detailShow
       }
     },
     created(){
-      this.privateData = this.data;
+      // this.privateData = this.data;
     },
     mounted(){
       this.$nextTick(()=>{
@@ -76,12 +80,14 @@
     },
     methods:{
       close(){
-        this.$emit("close");
+        // this.$emit("close");
+        this.$store.commit('setDetail',{detail:{}})
       },
       complete(){//有选中内容才可以点完成#1919
         if(this.checkF){
           this.$refs.detail.saveData();
-          this.$emit("pComplete");
+          // this.$emit("pComplete");
+          this.$store.commit('setDetail',{detail:{}})
         }
       },
       changeCheck(flag){
@@ -101,15 +107,35 @@
         this.showToast = false;
         this.checkF = false;
         // 让detail组件更新
-        // this.privateData = JSON.parse(JSON.stringify(this.data));
-        this.$emit('reload',this.data.id);
+        const type = this.data.moduleType;
+        if(type == moduleCP['symp']){ //症状情况单独处理
+          const id = this.privateData.id;
+          const read = this.$store.state.symptom.datas;
+          const data = read[id];
+          this.$store.commit('setDetail',{detail:data,ppId:null,moduleType:moduleCP['symp']})
+        }
+        
       }
     },
-    props:['data','moduleType','ppId'],
+    // props:['data','moduleType','ppId'],
     components:{
       Detail,
       Toast
-    }
+    },
+    computed: {
+      getStoreItem () {
+        return this.$store.state.detailInfo
+      }
+    },
+    watch: {
+      getStoreItem:{
+        handler(newVal){
+          this.data = newVal;
+          this.privateData = newVal.detail||{};
+        },
+        deep:true
+      }
+    },
   }
 </script>
 <style lang="less" scoped>

+ 1 - 35
src/components/DiagTreat.vue

@@ -9,12 +9,8 @@
         <img class="questionImg" :src="it.url.replace('{imageUrlPrefix}',imgUrl)" v-if="it.url">
         <Label v-if="it.controlType==0" 
               :item="it" 
-              :indx="i" 
               :ppId="it.id"
-              :moduleType="datas.type"
-              dom=".treatper"
-              @commitShowLabel="commitShowLabel"
-              @setDetail="setDetail"/>
+              :moduleType="datas.type"/>
         <!-- 上传图片 -->
         <UploadImg v-if="it.controlType==4" 
             :item="it" 
@@ -64,14 +60,6 @@
       <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">
@@ -111,9 +99,6 @@
       onScroll(pos) {
         document.activeElement.scrollIntoViewIfNeeded(true);        
       },
-      commitShowLabel(flg){
-        this.scroll = setScroll(BScroll,flg,'.treatper')
-      },
       beBack(){
         this.$emit('back');
       },
@@ -124,25 +109,6 @@
           this.$emit('next');
         }
       },
-      setDetail(obj){
-        this.labelDetail = obj.detail;
-        this.ppId = obj.ppId;
-        this.show = true;
-        this.scroll = setScroll(BScroll,false,'.treatper')
-      },
-      complete(){
-        this.show = false;
-        this.labelDetail = {};
-        this.ppId = null;
-        // 处理明细选中的值
-        this.scroll = setScroll(BScroll,true,'.treatper')
-      },
-      closeDetal(){
-        this.show = false;
-        this.labelDetail = {};
-        this.ppId = null;
-        this.scroll = setScroll(BScroll,true,'.treatper')
-      },
       getText(){
         let textArr = this.checkText;
         let msg = "";

+ 1 - 47
src/components/Others.vue

@@ -11,8 +11,7 @@
         <Label v-if="it.controlType==0"
               :item="it"
               :ppId="it.id" 
-              :moduleType="datas.type" 
-              @setDetail="setDetail"/>
+              :moduleType="datas.type"/>
         <!-- 输入框 -->
         <Input v-if="it.controlType==6 || it.controlType==7"
             :item="it"
@@ -55,31 +54,6 @@
       <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 class="foot" v-if="modluesLen==3&&!nextName||modluesLen==2">
-        <span class="back" @click="beBack">{{'返回'+ preName}}</span>
-        <span class="next" @click="toNext">{{'预览并提交病历'}}</span>
-      </div>
-      <div class="foot" v-else>
-        <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">
@@ -128,26 +102,6 @@
           this.$emit('next');
         }
       },
-      setDetail(obj){
-        this.labelDetail = obj.detail;
-        this.ppId = obj.ppId;
-        this.show = true;
-        
-        this.scroll = setScroll(BScroll,false,'.otherper')
-      },
-      complete(){
-        this.show = false;
-        this.labelDetail = {};
-        this.ppId = null;
-        // 处理明细选中的值
-        this.scroll = setScroll(BScroll,true,'.otherper')
-      },
-      closeDetal(){
-        this.show = false;
-        this.labelDetail = {};
-        this.ppId = null;
-        this.scroll = setScroll(BScroll,true,'.otherper')
-      },
       updataData(data,id,index){//输入框存值
         let list = this.dtoList;
         for(let i in list){

+ 15 - 53
src/components/Symptom.vue

@@ -47,19 +47,6 @@
       :class="['footer',{'nofoot':chooseSymp.length==0}]"
       @click="toNext"
     >预览并提交病历</div>
-    <div
-      class="detail"
-      v-if="show"
-    >
-      <DetailBox
-        @close="closeDetal"
-        :data="labelDetail"
-        :moduleType="1"
-        v-if="labelDetail.questionMapping&&labelDetail.questionMapping.length>0"
-        @pComplete="complete"
-        @reload="reload"
-      />
-    </div>
     <Toast
       :message="delText"
       :show="showToast"
@@ -94,7 +81,7 @@ export default {
       sexType: pathInfo.patientSex == '男' ? 1 : (pathInfo.patientSex == '女' ? 2 : 3),
       deptName: pathInfo.selfDeptName,
       hosCode: pathInfo.hospitalCode,
-      show: false, //显示明细
+      // show: false, //显示明细
       chooseSymp: choose, //已选症状
       symp: [], //症状
       labelDetail: {}, //明细
@@ -178,25 +165,19 @@ export default {
             this.labelDetail = result.data;
             this.$store.commit('setOrigin', { type: moduleCP['symp'], data: result.data });
             if (mapping && mapping.length > 0) {
-              this.show = true;
-              // this.scroll = setScroll(BScroll,false,'.symper')
+              this.$store.commit('setDetail',{detail:result.data,ppId:null,moduleType:moduleCP['symp']})
               if(flg){
                 return
               }
               this.chooseSymp.push(item);
-            } else { //没有详情,推送
-              const sympText = this.getSympText();
-              this.getPush(sympText);
+            } else { 
               this.chooseSymp.push(item);
               this.searchShow = false
-              // this.complete()
             }
           }
         })
-      } else {//没有questionId或id 则直接调推送
+      } else {//没有questionId或id 
         this.chooseSymp.push(item);
-        const sympText = this.getSympText();
-        this.getPush(sympText);
         this.checkText = this.$store.state.symptom.text;
       }
 
@@ -223,14 +204,6 @@ export default {
         }
       })
     },
-    closeDetal() {
-      // 推理 
-      const sympText = this.getSympText();
-      this.getPush(sympText);
-      this.show = false;
-      this.questId = null;
-      // this.scroll = setScroll(BScroll,true,'.symper')
-    },
     deletSymp(item, index) {
       this.delIndex = index;
       this.questId = item.questionId || item.id || item.conceptId;
@@ -238,7 +211,6 @@ export default {
         this.delText = "是否删除该信息?<br/>删除后将重新填写预问诊流程 <br/>(已填内容将清除)"
       }
       this.showToast = true;
-      // this.scroll = setScroll(BScroll,false,'.symper')
     },
     comfirnDel() {
       this.chooseSymp.splice(this.delIndex, 1);
@@ -248,8 +220,7 @@ export default {
       this.$store.commit('setDatas', { type: moduleCP['symp'], pId: this.questId ,data:''})
       // 删除完-常见;其他-推送
       if (this.chooseSymp.length > 0) {
-        const sympText = this.getSympText();
-        this.getPush(sympText);//删除后重新调推理-入参:拼好的内容
+
       } else {
         // 全部删除完 重新走问诊流程
         // this.$router.push("/")
@@ -263,39 +234,30 @@ export default {
       this.delIndex = null;
       this.questId = null;
       this.delText = "是否删除该信息?<br/>(已填内容将清除)";
-      // this.scroll = setScroll(BScroll,true,'.symper')
-    },
-    complete() {//明细填写完成
-      this.searchShow = false;
-      this.checkText = this.$store.state.symptom.text;
-      this.show = false;
-      // this.scroll = setScroll(BScroll,true,'.symper')
-      this.questId = null;
-      // 推理 
-      const sympText = this.getSympText();
-      this.getPush(sympText);
     },
     showChecked(item) {
       const origin = this.$store.state.symptom.origin;
       const read = this.$store.state.symptom.datas;
       const data = read[(item.questionId||item.id)] || origin[(item.questionId||item.id)];
       if (data&&data.questionMapping && data.questionMapping.length > 0) {
-        this.labelDetail = data;
-        this.show = true;
-        // this.scroll = setScroll(BScroll,true,'.symper')        
+        this.$store.commit('setDetail',{detail:data,ppId:null,moduleType:moduleCP['symp']})       
       }
     },
-    reload(id) {//清空重新赋值
-      const read = this.$store.state.symptom.datas;
-      const data = read[id];
-      this.labelDetail = data;
-    }
   },
   components: {
     DetailBox,
     Toast,
     Search
   },
+  watch:{
+    checkText:{//更新推送
+      handler(newVal,oldVal){
+        const sympText = this.getSympText();
+        this.getPush(sympText);
+      },
+      deep:true
+    }
+  }
 }
 </script>
 <style lang="less" scoped>

+ 8 - 1
src/components/TabPage.vue

@@ -59,6 +59,10 @@
         @back="beBack" 
       />
     </div>
+    <!-- 详情页 -->
+    <div class="detail" v-if="this.$store.state.detailShow">
+    <DetailBox />
+    </div>
   </div>
 </template>
 <script type="text/javascript">
@@ -69,6 +73,7 @@ import Others from './Others.vue';
 import Preview from './Preview.vue';
 import {moduleConfig,moduleCP} from '../utils/tools.js';
 import $ from 'jquery';
+import DetailBox from './DetailBox.vue';
 export default {
   name: 'TabPage',
   data() {
@@ -196,11 +201,13 @@ export default {
     DiagTreat,
     Others,
     AddContent,
-    Preview
+    Preview,
+    DetailBox
   }
 }
 </script>
 <style lang="less" scoped>
+@import '../less/base.less';
 .tab-wrap {
   width: 100%;
   height: 100%;

+ 12 - 1
src/store.js

@@ -33,7 +33,9 @@ const store = new Vuex.Store({
       txt:'',
       txtDoc:''
     },
-    loadingShow:false
+    loadingShow:false,
+    detailInfo:{},
+    detailShow:false
   },
   mutations:{
     initAllData(state){
@@ -63,6 +65,15 @@ const store = new Vuex.Store({
         txtDoc:''
       }
     },
+    setDetail(state,param){//明细
+      const detail = param.detail;
+      if(JSON.stringify(detail)=='{}'){
+        state.detailShow = false;
+      }else{
+        state.detailInfo = Object.assign({},param);
+        state.detailShow = true;
+      }
+    },
     setDataAll(state,param){
       let res = state.allMoudles
       for(let i = 0;i<res.length;i++){