elizebeth/src/xt_pages/user/hospitalSummaryPrint.vue

<template>
<div>
  <div style="float:right">
    <el-button type="primary" size="small" @click="printThisPage">打印</el-button> 
  </div>
  <div id="dialysis-print-box">
    <div class="dialysis-print-order">
      <div class="order-yy-name"></div>
      <div class="order-title">{{ orgname }}出院小结</div>
      <div style="margin-float:right">病案号:{{hosDetail.sick_personnel}}</div>
      <div>
        <table class="print-table" border="1" style="margin-top: 10px;">
          <tr>
            <td style="text-align:center;width:50px" colspan="1">
              姓名:
            </td>
             <td style="text-align:center;width:50px" colspan="1">
              <span style="display:inline-block;margin-left:10px;">
               {{patient.name}}
              </span>
            </td>
            <td style="text-align:center;width:50px" colspan="1">
              性别:
            </td>
             <td style="text-align:center;width:50px" colspan="1">
              <span style="display:inline-block;margin-left:10px;">
                <span v-if="patient.gender == 1">男</span>
                <span v-if="patient.gender == 2">女</span>
              </span>
            </td>
            <td style="text-align:center;width:50px" colspan="1">
              年龄:
            </td>
            <td style="text-align:center;width:50px" colspan="1">
              <span style="display:inline-block;margin-left:10px;">
                 {{getNewAge(patient.id_card_no)}}
              </span>
            </td>
            <td style="text-align:center;width:50px" colspan="1">
              婚姻:
            </td>
             <td style="text-align:center;width:50px" colspan="1">
              <span style="display:inline-block;margin-left:10px;">
                 <span v-if="patient.marital_status == 0">未婚</span>
                 <span v-if="patient.marital_status == 1">已婚</span>
                 <span v-if="patient.marital_status == 2">未婚</span>
                 <span v-if="patient.marital_status == 3">离异</span>
                 <span v-if="patient.marital_status == 4">丧偶</span>
              </span>
            </td>
             <td style="text-align:center;width:50px" colspan="1">
              职业: 
            </td>
             <td style="text-align:center;width:50px" colspan="1">
              <span style="display:inline-block;margin-left:10px;">
               {{getProfession(patient.profession)?getProfession(patient.profession):''}}
              </span>
            </td>
             <td style="text-align:center;width:50px" colspan="1">
              电话:
            </td>
             <td style="text-align:center;width:50px" colspan="1">
              <span style="display:inline-block;margin-left:10px;">
                {{patient.phone}}
              </span>
            </td>
          </tr>

          <tr>
            <td style="text-align:center;" colspan="1">
              住址:
            </td>   
            <td style="text-align:center;" colspan="11">
            
              <span style="display:inline-block;margin-left:10px;">
                {{patient.home_address}}
              </span>
            </td>   
          </tr>
          <tr>
            <td style="text-align:center;width:170px" colspan="1">
              入院时间:
            </td>
            <td style="text-align:center;width:170px" colspan="2">
              <span style="display:inline-block;margin-left:10px;">
                {{getTime(hosDetail.admission_time)}}
              </span>
            </td>
            <td style="text-align:center;width:100px" colspan="2">
              出院时间:
            </td>
            <td style="text-align:center;width:100px" colspan="2">
              <span style="display:inline-block;margin-left:10px;">
                {{getTime(hosDetail.discharge_time)}}
              </span>
            </td>
            <td style="text-align:center;width:100px"  colspan="1">
              住院天数:
            </td>
            <td style="text-align:center;width:50px" colspan="1">
              <span style="display:inline-block;margin-left:10px;">
               {{getTimeDay(hosDetail.admission_time,hosDetail.discharge_time)}}
               
              </span>
            </td>
            <td style="text-align:center;width:50px" colspan="2">
              转归:
            
            </td>
            <td style="text-align:center;width:50px" colspan="1">
              <span style="display:inline-block;margin-left:10px;">
                <span v-if="patient.lapseto == 1">留治</span>
                <span v-if="patient.lapseto == 2">转归</span>
              </span>
            </td>
            
          </tr>
          <tr>
            <td style="text-align:center;width:50px" colspan="1">
              检查号:
            </td>
            <td style="text-align:center;width:50px" colspan="2">
              X线:
            </td>
            <td style="text-align:center;width:50px" colspan="1">
              <span style="display:inline-block;margin-left:10px;">
                {{hosDetail.xray}}
              </span>
            </td>
            <td style="text-align:center;width:50px" colspan="1">
              CT:
            </td>
            <td style="text-align:center;width:50px" colspan="1">
              <span style="display:inline-block;margin-left:10px;">
                {{hosDetail.connecticut}}
              </span>
            </td>
            <td style="text-align:center;width:50px" colspan="1">
              MRI:
            </td>
             <td style="text-align:center;width:50px" colspan="1">
              <span style="display:inline-block;margin-left:10px;">
                {{hosDetail.nuclear_magnetic_resonance}}
              </span>
            </td>
             <td style="text-align:center;width:50px" colspan="1">
              超声:
            </td>
             <td style="text-align:center;width:50px" colspan="1">
              <span style="display:inline-block;margin-left:10px;">
                {{hosDetail.ultrasound}}
              </span>
            </td>
             <td style="text-align:center;width:50px" colspan="1">
              病理:
            </td>
             <td style="text-align:center;width:50px" colspan="1">
              <span style="display:inline-block;margin-left:10px;">
                {{hosDetail.pathology}}
              </span>
            </td>
          </tr>
          <tr>
            <td style="text-align:center;" colspan="1">
              入院诊断:
              <span style="display:inline-block;margin-left:10px;">
               
              </span>
            </td>   
            <td style="text-align:center;" colspan="11">
              <span style="display:inline-block;margin-left:10px;">
                <span v-html="hosDetail.admitting_diagnosis"></span>
              </span>
            </td>   
          </tr>
          <tr>
            <td style="text-align:center;width:170px" colspan="1">
              出院诊断:
            </td>
             <td style="text-align:center;width:170px" colspan="11">
             
              <span style="display:inline-block;margin-left:10px;">
               <span v-html="hosDetail.discharge_diagnosis"></span>  
              </span>
            </td>
            
          </tr>
           <tr>
            <td style="text-align:center;width:170px" colspan="1">
              入院时病情:
            </td>
           <td style="text-align:center;width:170px" colspan="11">
            
              <span style="display:inline-block;margin-left:10px;">
                 <span v-html="hosDetail.diagnosis_admission"></span>
              </span>
            </td>
            
          </tr>
        
          <tr>
            <td style="text-align:center;width:170px" colspan="1">
              诊断经过:
           
            </td>
            <td style="text-align:center;width:170px" colspan="11">
              <span style="display:inline-block;margin-left:10px;">
               <span v-html="hosDetail.treatment"></span> 
              </span>
            </td>
            
          </tr>
          <tr>
            <td style="text-align:center;width:170px" colspan="1">
              出院时病情:
            </td>
            <td style="text-align:center;width:170px" colspan="11">
            
              <span style="display:inline-block;margin-left:10px;">
               <span v-html="hosDetail.illness_discharge"></span> 
              </span>
            </td>
          
            
          </tr>
          <tr>
            <td style="text-align:center;width:170px" colspan="1">
              出院医嘱:
            </td>
            <td style="text-align:center;width:170px" colspan="11">
              <span style="display:inline-block;margin-left:10px;">
                <span v-html="hosDetail.discharge_advice"></span> 
              </span>
            </td>
            
          </tr>
          <tr>
            <td style="text-align:center;width:170px" colspan="4">
              <span style="display:inline-block;margin-left:10px;">
               
              </span>
            </td>
            <td style="text-align:center;width:170px" colspan="2">
              上级签名:
            </td>
            <td style="text-align:center;width:170px" colspan="2">
              <span style="display:inline-block;margin-left:10px;">
                {{getDoctor(hosDetail.dean_id)}}
              </span>
            </td>
           <td style="text-align:center;width:170px" colspan="2">
              住院医师签名:
            </td>
             <td style="text-align:center;width:170px" colspan="2">
              <span style="display:inline-block;margin-left:10px;">
                 {{getDoctor(hosDetail.doctor)}}
              </span>
            </td>
          </tr>
        </table>
     </div>
     
    
  
   
    </div>
    </div>
</div>
</template>

<script>
import { jsGetAge, uParseTime } from '@/utils/tools'
import LabelBox from '../dialysis/printItem/LabelBox'
import CheckBox from '../dialysis/batch_print/option_check_box'
import BreadCrumb from '@/xt_pages/components/bread-crumb'
import {getHospitalSummaryDetail,getPatientInfo} from "@/api/patient"
import { getAllDoctorList } from "@/api/device"
import { getDataConfig } from "@/utils/data";
export default {
  name: 'dialysisPrintOrderOne',
  components: {
    LabelBox,
    BreadCrumb,
    CheckBox
  },
  data() {
    return {
      crumbs: [
        { path: false, name: '透析管理' },
        { path: false, name: '打印单' }
      ],
     hosDetail:{},
     patient:{},
     doctorList:[],
    educationOptions:[],
    }
  },
  methods: {
    getDatge(value) {
      var times = Date.parse(value) / 1000
      var timestr = uParseTime(times, '{y}年{m}月{d}日')
      return timestr
    },
    getTime(val) {
       if(val == "" || val == undefined){
          return ""
         }else {
          return uParseTime(val, '{y}-{m}-{d}')
         }
    },
    printThisPage() {
        var ptime = Math.round(new Date().getTime() / 1000)
        this.print_time = uParseTime(ptime, '{y}-{m}-{d} {h}:{i}')
        const style ='@media print {.dialysis-print-order{width:960px;margin:0 auto;letter-spacing:5px} .dialysis-print-order p{margin:0 auto}.dialysis-print-order .order-yy-name{margin:auto;text-align:center;font-size:20px;letter-spacing:5px}.dialysis-print-order .order-title{margin:auto;font-weight:600;text-align:center;font-size:22px;padding:10px 20px 20px 20px}.dialysis-print-order .table-box{width:100%;line-height:23px;font-size:14px}.dialysis-print-order .print-table{width:100%;text-align:center;border-collapse:collapse;line-height:25px;font-size:14px}.dialysis-print-order .print-table-no{width:100%;text-align:center;border-collapse:collapse;font-size:14px}.dialysis-print-order .under-line{border-bottom:1px solid #999;width:95%;text-align:center;margin-left:2px}.dialysis-print-order .title-box{text-align:center;font-size:16px;border:1px solid #666}.dialysis-print-order .radio-lebel-box{font-weight:400;cursor:pointer}.dialysis-print-order .radio-no{opacity:0;outline:0;position:absolute;margin:0;width:0;height:0;z-index:-1}.dialysis-print-order .radio-inner{white-space:nowrap;cursor:pointer;outline:0;display:inline-block;line-height:1;position:relative;vertical-align:middle}.dialysis-print-order .radio-fang{display:inline-block;position:relative;border:1px solid #000;box-sizing:border-box;width:14px;height:14px;background-color:#fff;z-index:1;transition:border-color .25s cubic-bezier(.71,-.46,.29,1.46),background-color .25s cubic-bezier(.71,-.46,.29,1.46)}.dialysis-print-order .is-checked-radio::after{content:"√";font-size:15px}}.dialysis-print-order .print-table-no tr td { padding: 8px 5px; line-height: 25px; }.es-img{height: 20px; }.advice-name{text-align: left;}.advice-children{display:flex;} .dialysis-print-order .print-table tr td{padding: 0px 0px;} .print-template-two tr {line-height: 30px;}   .title-box-pro{border: 0 #fff;line-height: 40px;height: 40px;text-align: left;padding-left: 10px !important;}  .text-align-left{text-align: left !important;padding-left:10px !important;font-size: 14px !important;line-height: 25px;font-weight: bold;margin: 10px 0;}'
        printJS({
            printable: 'dialysis-print-box',
            type: 'html',
            style: style,
            scanStyles: false
        })
      
    },
  
    getAge: function(val) {
      if (val.birthday != 0) {
        return jsGetAge(val.birth, '-')
      } else {
        return ''
      }
    },
  
    getNewAge(UUserCard) {
      if (UUserCard != null && UUserCard != '') {
        // 获取年龄
        var myDate = new Date()
        var month = myDate.getMonth() + 1
        var day = myDate.getDate()
        var age = myDate.getFullYear() - UUserCard.substring(6, 10) - 1
        if (UUserCard.substring(10, 12) < month || UUserCard.substring(10, 12) == month && UUserCard.substring(12, 14) <= day) {
          age++
        }
        return age
      }
    },
    getHospitalSummaryDetail(id){
        getHospitalSummaryDetail(id).then(response=>{
           if(response.data.state == 1){
             var detail = response.data.data.detail
             this.hosDetail = detail
           }
        })
    },
    getlist(){
       var params = {
         patient_id:parseInt(this.$route.query.patient_id),
       }
       console.log("param223322322323",params)
      getPatientInfo(params).then(response=>{
         if(response.data.state == 1){
           var patient = response.data.data.patient
           this.patient = patient
         }
      })
    },
    getAllDoctorList(){
      getAllDoctorList().then(response=>{
        if(response.data.state == 1){
        var list = response.data.data.list
        this.doctorList = list
        }
       })
     },
     getDoctor(id){
        var name = ""
        for(let i=0;i<this.doctorList.length;i++){
          if(id == this.doctorList[i].admin_user_id){
             name = this.doctorList[i].user_name
          }
        }
        return name
    },
    getProfession(id){
      var name = ""
      for(let i=0;i<this.educationOptions.length;i++){
          if(id == this.educationOptions[i].id){
              name = this.educationOptions[i].name
          }
      }
      return name
    },
    getTimeDay(start,end){
      var count = ""
      count = (end-start)/86400
      return count
    }
  },
 
  created() {
    this.educationOptions = getDataConfig("patient", "education_types");
    var xtuser = this.$store.getters.xt_user
    this.orgname = xtuser.org.org_name
    var id = this.$route.query.id
    this.getlist()
    this.getHospitalSummaryDetail(id)
    this.getAllDoctorList()
    
  }
}
</script>

<style>
.borderBox  p{
  font-weight: bold;
  margin: 10px 0;
}
.dialysis-print-order {
  width: 960px;
  margin: 0 auto;
}

.dialysis-print-order .order-yy-name {
  margin: auto;
  text-align: center;
  font-size: 20px;
  letter-spacing: 5px;
}

.dialysis-print-order .order-title {
  margin: auto;
  font-weight: 600;
  text-align: center;
  font-size: 22px;
  padding: 10px 20px 20px 20px;
}

.dialysis-print-order .table-box {
  width: 100%;
  line-height: 23px;
  font-size: 14px;
}

.dialysis-print-order .print-table {
  width: 100%;
  text-align: center;
  border-collapse: collapse;
  line-height: 40px;
  font-size: 14px;
}

.dialysis-print-order .print-table-no {
  width: 100%;
  text-align: center;
  border-collapse: collapse;
  font-size: 14px;
}

.dialysis-print-order .under-line {
  border-bottom: 1px solid #999;
  width: 95%;
  text-align: center;
  margin-left: 2px;
}

.dialysis-print-order .title-box {
  text-align: center;
  font-size: 16px;
}

.dialysis-print-order .radio-lebel-box {
  font-weight: 400;
  cursor: pointer;
}

.dialysis-print-order .radio-no {
  opacity: 0;
  outline: none;
  position: absolute;
  margin: 0;
  width: 0;
  height: 0;
  z-index: -1;
}

.dialysis-print-order .radio-inner {
  white-space: nowrap;
  cursor: pointer;
  outline: none;
  display: inline-block;
  line-height: 1;
  position: relative;
  vertical-align: middle;
}

.dialysis-print-order .radio-fang {
  display: inline-block;
  position: relative;
  border: 1px solid #000;
  box-sizing: border-box;
  width: 14px;
  height: 14px;
  background-color: #fff;
  z-index: 1;
  transition: border-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46),
    background-color 0.25s cubic-bezier(0.71, -0.46, 0.29, 1.46);
}

.dialysis-print-order .is-checked-radio::after {
  content: "√";
  font-size: 15px;
}

.dialysis-print-order .print-table-no tr td {
  padding: 8px 5px;
  line-height: 25px;
}

.dialysis-print-order .print-table tr td {
  padding: 1px 1px;
  /*line-height: 25px;*/
}

.es-img {
  height: 25px;
}

.advice-name {
  text-align: left;
}

.advice-children {
  display: flex;
}

.title-box-pro {
  border: 0 #fff;
  line-height: 25px;
  height: 25px;
  text-align: left;
  padding-left: 10px !important;
}
.title-box-pro-tr {
  border: 0 #fff;
}
.text-align-left {
  text-align: left !important;
  padding-left: 10px !important;
  font-size: 14px !important;
  line-height: 25px;
}
.print-table-tr-new td {
  line-height: 20px !important;
}
.border-top-solid {
  border: solid 1px #000;
}
.print-template-two tr {
  line-height: 30px;
}
.parent {
  text-align: left;
  padding-left: 20px !important;
}
</style>