preliminary/src/components/PathInfo.vue

<template>
  <div class="path-wrap">
    <p class="info">挂号用户信息查询如下：</p>
    <div class="con">
      <p class="name">
        <span>{{pathInfo.patientName}}</span>|
        <span>{{pathInfo.patientSex}}</span>|
        <span>{{pathInfo.patientAge}}岁</span>
      </p>
      <p>
        <span>挂号科室：</span>
        <span>{{pathInfo.hospitalDeptName}}</span>
      </p>
      <div class="dept">
        <p>
          <span>门诊号：</span>
          <span>{{pathInfo.recordId}}</span>
        </p>
        <p>
          <span>预约医生：</span>
          <span>{{pathInfo.doctorName}}</span>
        </p>
      </div>
      <p>
        <span>预约时间：</span>
        <span>{{pathInfo.systemTime}}</span>
      </p>
      <!-- <div class="dept">
        <p>
          <span>挂号科室：</span>
          <span>{{pathInfo.selfDeptName}}</span>
        </p>
        <p>
          <span>门诊号：</span>
          <span>{{pathInfo.recordId}}</span>
        </p> 
      </div>
      <div class="doct">
        <p>
          <span>预约医生：</span>
          <span>{{pathInfo.doctorName}}</span>
        </p>
        <p>
          <span>预约时间：</span>
          <span>{{pathInfo.systemTime}}</span>
        </p>
      </div> -->
      <p class="already" v-if="type !== 1">{{text[type]}}</p>
    </div>
    <div class="out-box">
      <div class="emery">
        <div class="baner">
          <p>{{pathInfo.hospitalName}}</p>
          <p class="big">智能预问诊</p>
        </div>
        <div class="inner">
          <p>该系统通过智能引导式问诊，帮助医生规范、全面的采集患者的症状、体征、病史等信息，从而实现诊疗流程的优化和配置。</p>
          <button @click="getStart">开始</button>
        </div>
        <!-- <p v-if="type==3">您已完成过一次预问诊，是否再次录入</p> -->
      </div>
      <div class="child" v-if="child.length>0&&child[0].value==1 && !hideChild">
        <div class="baner">
          <p>{{pathInfo.hospitalName}}</p>
          <p class="big">儿童体质检测</p>
        </div>
        <div class="inner">
          <p>该标准将为0-12岁儿童在为体质辨识及与中医体质相关疾病的预防、养生保健、健康管理提供依据，使体质分类科学化、规范化。</p>
          <button>开始</button>
        </div>
      </div>
    </div>
    <Submit
      v-if="submit"
      :fail="message"
      showType="fail"
    ></Submit>
  </div>
</template>
<script type="text/javascript">
  import api from '@utils/api.js'
  import Submit from '../common/Submit';
  import {getUrlArgObject} from '@utils/tools.js'
  export default {
    name:'PathInfo',
    data(){
      return {
        pathInfo:{},
        child:[],
        type:null, //1-未做过；3-只做过问诊；4-只做过体质辨识；6-都做过
        text:{
          "3":'您已完成过一次预问诊，是否再次录入',
          // "4":'您已完成过一次儿童体质辨识，是否再次录入',
          // "6":'您已完成过一次预问诊和儿童体质辨识，是否再次录入',
          "6":'您已完成过一次预问诊，是否再次录入',
        },
        isReady:false,
        hideChild:true,  //隐藏儿童
        submit:false,
        message:''
      }
    },
    created(){
      this.getPathInfo();
      this.getSysConfig();
      this.$store.commit('initAllData');//初始化store数据
    },
    methods:{
      getPathInfo(){
        const params = {
          'hospitalCode':getUrlArgObject('hospitalCode'),
          'hospitalDeptCode':getUrlArgObject('hospitalDeptCode'),
          'doctorCode':getUrlArgObject('doctorCode'),
          'patientCode':getUrlArgObject('patientCode'),
          'recordId':getUrlArgObject('recordId')
        }
        api.getPathInfo(params).then((res)=>{
          const result = res.data;
          if(result.code==0){
            this.pathInfo = result.data;
            this.$store.commit('savePathInfo',result.data);
            this.recordCheck(); //校验是否填过
            this.getAll(); //获取模板
          }
        })
      },
      getSysConfig(){
        const param = {
          'hospitalCode':getUrlArgObject('hospitalCode')
        }
        api.getSysConfig(param).then((res)=>{
          const result = res.data;
          if(result.code==0){
            const datas = result.data;
            this.child = datas.filter((item)=>{return item.code == "constitution_show"})
            this.$store.commit('saveSysConfig',datas)
          }
        })
      },
      recordCheck(){
        const param = {
          'doctorId':this.pathInfo.doctorId,
          'hospitalDeptId':this.pathInfo.hospitalDeptId,
          '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){
            this.type = result.data.type;
          }
        })
      },
      getAll(){
        const param = {
          'age':this.pathInfo.patientAge,
          'relationId':this.pathInfo.selfDeptId,
          'mouduleType':1, //根据科室划分
          'sexType':this.pathInfo.patientSex=='男'?1:(this.pathInfo.patientSex=='女'?2:3),
        }
        api.getAll(param).then((res)=>{
          const result = res.data;
          if(result.code==0){
            const datas = result.data;
            this.$store.commit('saveAll',datas)
            let access = datas.filter(item=>item.type == 1).length>0
            // console.log(datas.filter(item=>item.type == 1)>0)
            this.isReady=access
          }else{
            this.defaultWaring(result.msg)
          }
        })
      },
      getStart(){
        const pathInfo = this.pathInfo;
        if(JSON.stringify(pathInfo)=='{}'){
          this.defaultWaring('网络异常请稍后重试');
          return
        }
        if(this.isReady){
          // this.$router.push({path:'/tab'})
          this.$router.replace({path:'/tab'})
        }else{
          this.defaultWaring('请先维护症状模块')
        }
      },
      defaultWaring(msg){
        this.submit = true
        this.message = msg
        let timer = setTimeout(() => {
          this.submit = false
          clearTimeout(timer)
        }, 2000);
      }, 
    },
    components:{
      Submit
    }
  }
</script>
<style lang="less" scoped>
  .path-wrap{
    padding-top: .5rem;
    font-size: .28rem;
    box-sizing: border-box;
    .info{
      font-size: .32rem;
      font-weight: 700;
      color: #040428;
      margin-left: .6rem;
      font-weight: bold;
    }
    .con{
      margin-left: .6rem;
      position: relative;
      >p{
        color: #7C828E;
        margin-top: .27rem;
      }
      .name{
        color: #7C828E;
        margin-top: .27rem;
        span{
          margin-right: .08rem;
        }
      }
      .dept{
        p{
          display: inline-block;
          margin-top: .27rem;
          span{
            color: #7C828E;
          }
        }
        p:first-child{
          margin-right: .25rem;
        }
      }
      /* .dept,.doct{
        display: inline-block;
        p{
          display: inline-block;
          margin-top: .27rem;
          span{
            color: #7C828E;
          }
        }
      }
      .doct{
        margin-left: .26rem;
      } */
      .already{
        position: absolute;
        left: 0;
        bottom:-.6rem;
        color: #7C828E;
      }
    }
    .out-box{
      white-space: nowrap;
      overflow-x: auto;
      padding:0 .15rem .15rem 0;
      -webkit-overflow-scrolling: touch;  
      text-align: center;//隐藏儿童
    }
    .emery,.child{
      display: inline-block;
      vertical-align: top;
      // width:5.3rem;
      width:5.1rem;
      margin-top: .91rem;
      // margin-left: .6rem;
      box-sizing: border-box;
      .baner{
        box-sizing: border-box;
        width:100%;
        // height: 2.52rem;
        height: 2.3rem;
        // padding: .66rem 0 0 .6rem;
        padding-top: .5rem;
        p{
          color:#fff;
        }
        .big{
          font-size: .56rem;
          margin-top: .12rem;
        }
      }
      .inner{
        // height: 4.98rem;
        height: 4.5rem;
        box-shadow:-.05rem .05rem .10rem -.04rem #989da3,.05rem .05rem .10rem -.04rem #989da3;
        border-radius: 0 0 .20rem .20rem;
        padding: .45rem .6rem .6rem;
        box-sizing: border-box;
        position: relative;
        p{
          font-size: .24rem;
          line-height: .5rem;
          white-space: normal;
          min-height: 100px;
        }
        button{
          width: 4rem;
          height: .88rem;
          color: #fff;
          font-size: .32rem;
          // margin-top: .20rem;
          margin: .40rem 0 0 -.05rem;
          background: -webkit-gradient(linear, right top, left top, from(#4F8BFF), to(#4F4FFF));
          background: -webkit-linear-gradient(right, #4F8BFF, #4F4FFF);
          box-shadow: 0 .12rem .24rem 0 rgba(79,129,255,0.40);
          border-radius: .44rem;
          // position: absolute;
          // bottom: .7rem;
        }
      }
    }
    .emery .baner{
      background: url('../images/banerbg@1.5x.png') no-repeat;
      background-size: cover;
    }
    .child .baner{
      background: url('../images/childbg@1.5x.png') no-repeat;
      background-size: cover;
    }
  }
</style>