xybpkmweb/src/components/DiagCalcShow.vue

<template>
  <div class="container">
    <div class="bgimg"></div>
    <div class="content">
      <div class="diagShowForm">
        <div class="formTitle">FVIII药代动力学检测</div>
        <mt-cell title="姓名" :value="caseInfo.name"></mt-cell>
        <mt-cell title="ID" :value="caseInfo.code"></mt-cell>
        <mt-cell title="年龄" :value="caseInfo.age"></mt-cell>
        <mt-cell title="体重(kg)" :value="caseInfo.bltz"></mt-cell>
        <mt-cell title="性别" :value="caseInfo.sex"></mt-cell>
        <mt-cell title="注射产品" :value="caseInfo.mpro"></mt-cell>
        <mt-cell title="注射剂量(IU/kg)" :value="caseInfo.zsjl"></mt-cell>
        <mt-cell title="注射时间t0" :value="caseInfo.zssjt0"></mt-cell>
        <mt-cell title="基础活性%" :value="caseInfo.jchx"></mt-cell>
        <mt-cell title="注射后半小时内活性%" :value="caseInfo.zs30hx"></mt-cell>
        <mt-cell title="采血时间t1" :value="caseInfo.cxsjt1"></mt-cell>
        <mt-cell title="t1点活性%" :value="caseInfo.t1hx"></mt-cell>
        <mt-cell title="采血时间t2" :value="caseInfo.cxsjt2"></mt-cell>
        <mt-cell title="t2点活性%" :value="caseInfo.t2hx"></mt-cell>
        <mt-cell title="采血时间t3" :value="caseInfo.cxsjt3"></mt-cell>
        <mt-cell title="t3点活性%" :value="caseInfo.t3hx"></mt-cell>
        <!-- <mt-cell title="采血时间t4" :value="caseInfo.cxsjt4"></mt-cell>
        <mt-cell title="t4点活性%" :value="caseInfo.t4hx"></mt-cell> -->
        <mt-cell title="预期峰值活性%" :value="caseInfo.yqfzhx"></mt-cell>
      </div>
      <div class="diagShowForm">
        <div class="formTitle">FVI药代动力学参数</div>
        <mt-cell title="半衰期:" :value="caseInfo.bsq"></mt-cell>
        <mt-cell title="利用率%:" :value="caseInfo.lyl"></mt-cell>
      </div>
      <div class="diagShowForm">
        <div class="formTitle">血友病治疗方案</div>
        <mt-cell title="预防谷活性%:" :value="caseInfo.yfghx"></mt-cell>
        <mt-cell title="注射频次:" :value="caseInfo.zspc"></mt-cell>
        <mt-cell title="每次注射剂量(IU/kg):" :value="caseInfo.mczsjl"></mt-cell>
      </div>
      <div class="footer">
        <div class="jbbtn" @click="goPage">下一页</div>
      </div>
    </div>
  </div>
</template>

<script>
  import {
    Field,
    Cell
  } from 'mint-ui'
  export default {
    name: 'Index',
    components: {
      Field,
      Cell
    },
    data() {
      return {
        msg: 'Welcome to Your Vue.js App',
        caseInfo:{}
      }
    },
    methods: {
      goPage() {
        let id = this.$route.query.id
        this.$router.push({'path':'/solutionpkline',query:{id:id}})
      },
      getData(){
        let id = this.$route.query.id
        this.$api.getPatientCaseInfo({id:id}).then(res=>{
          if(!res.data.code){
            this.caseInfo = res.data.data
          }
        })
      }
    },
    created(){
      this.getData()
    }
  }

</script>

<style scoped lang="scss">
  .diagShowForm {
    width: 84%;
    margin: auto;
    margin-top: 1rem;
    background: #fff;
    padding: 1rem;
    border-radius: 5px;

    .formTitle {
      height: 1rem;
      line-height: 1rem;
      text-align: left;
      color: #2882F4;
      padding-bottom: 0.5rem;
      border-bottom: 1px solid #2882F4;
      font-weight: bold;
    }

    .mint-cell {
      min-height: 2rem;
    }

    /deep/ .mint-cell .mint-cell-title {
      width: 70%;
      text-align: left;
    }

    /deep/ .mint-cell .mint-cell-value {
      width: 50%;
      text-align: right;
    }
  }
  .container{
    height: 100%;
  }

</style>