<template>
  <div class="medical-record-con" id="medical-record" style="line-height: 30px">
    <div id="timeLinePrint-header">
      <el-row>
        <el-col :span="24">
          <div class="hos-name" style="font-family: 'SimSun';font-size:25px;margin-bottom: 10px;">北京美中爱瑞肿瘤医院</div>
        </el-col>
        <el-col :span="24">
          <div class="type" style="font-family: 'SimSun';font-size: 25px;margin-bottom: 16px;">门(急)诊病历</div>
        </el-col>
      </el-row>
      <div class="patient-info" style="padding: 5px 0;border-top: 1px solid #333;border-bottom: 1px solid #333;margin:25px 0 0;">
        <div style="text-align: left;">
          <div  style="font-family: 'SimSun';height: 40px;line-height: 40px;font-size: 23px;color: black;width: 40%;display: inline-block;text-align: left;">
            <span class="label"
              >患者<span class="Arial">ID/Patient ID</span>：</span
            >
            <span class="text" v-show="caseHistory.patientId">{{
              caseHistory.patientId
              }}</span>
          </div>
          <div  style="font-family: 'SimSun';height: 40px;line-height: 40px;font-size: 23px;color: black;width: 40%;display: inline-block;text-align: left;">
            <span class="label"
              >姓名<span class="Arial">/Patient Name</span>：</span
            >
            <span class="text" v-show="caseHistory.patientName">{{
              caseHistory.patientName
              }}</span>
          </div>
          <div  style="font-family: 'SimSun';height: 40px;line-height: 40px;font-size: 23px;color: black;width: 40%;display: inline-block;text-align: left;">
             <span class="label"
              >出生日期<span class="Arial">/Date of Birth</span>：</span
            >
            <span class="text" v-show="caseHistory.year">{{
              caseHistory.year
              }}</span>
          </div>
          <div  style="font-family: 'SimSun';height: 40px;line-height: 40px;font-size: 23px;color: black;width: 30%;display: inline-block;text-align: left;">
            <span class="label">性别<span class="Arial">/Gender</span>：</span>
            <span class="text">{{ caseHistory.sex === "M" ? "男" : "女" }}</span>
          </div>
          <div  style="font-family: 'SimSun';height: 40px;line-height: 40px;font-size: 23px;color: black;width: 20%;display: inline-block;text-align: left;">
            <span class="label">年龄<span class="Arial">/Age</span>：</span>
            <span class="text">{{ caseHistory.age }}</span><span class="label" style="margin-left:5px">岁</span>
          </div>
          
          <!-- <el-col :span="7">
            <span class="label"
              >婚姻<span class="Arial">/Marital Status</span>：</span
            >
            <span class="text" v-show="caseHistory.marriage">{{
              caseHistory.marriage
            }}</span>
          </el-col> -->
          <div  style="font-family: 'SimSun';height: 40px;line-height: 40px;font-size: 23px;color: black;width: 50%;display: inline-block;text-align: left;" >
            <span class="label"
              >就诊科室<span class="Arial">/Department</span>：</span
            >
            <span class="text" v-show="caseHistory.deptName">{{
              caseHistory.deptName
              }}</span>
          </div>
          <!-- <el-col :span="8">
            <span class="label">民族<span class="Arial">/Ethnicity</span>：</span>
            <span class="text" v-show="caseHistory.nation">{{
              caseHistory.nation
            }}</span>
          </el-col>
          <el-col :span="7">
            <span class="label"
              >职业<span class="Arial">/Occupation</span>：</span
            >
            <span class="text" v-show="caseHistory.profession">{{
              caseHistory.profession
            }}</span>
          </el-col> -->
          <div  style="font-family: 'SimSun';height: 40px;line-height: 40px;font-size: 23px;color: black;width: 50%;display: inline-block;text-align: left;">
            <span class="label"
              >就诊日期<span class="Arial">/Arrival Time</span>：</span
            >
            <span class="text" v-show="caseHistory.date">{{
              caseHistory.date
              }}</span>
          </div>
          <!-- <el-col :span="24">
            <span class="label"
              >工作单位或地址<span class="Arial">/Employer or Address</span
              >：</span
            >
            <span class="text" v-show="caseHistory.workUnit">{{
              caseHistory.workUnit
            }}</span>
          </el-col>
          <el-col :span="24">
            <span class="label"
              >过敏史<span class="Arial">/Allergy History</span>：</span
            >
            <span
              class="text"
              v-show="caseHistory.allergyCon.length || caseHistory.allergyText"
            >
              <template v-if="caseHistory.allergyText">
                <span>{{ caseHistory.allergyText }}</span>
              </template>
              <span v-for="(item, index) of caseHistory.allergyCon" :key="index">
                <span v-if="index > 0">,</span>{{ item.allergenName }}
              </span>
            </span>
          </el-col> -->
        </div>
      </div>
    </div>
    <div id="timeLinePrint-content">
      <section>
        <span class="label-bold" style="font-family: 'SimSun';font-size: 23px;width: 150px;">主诉：</span>
        <span class="info-content" style="white-space: pre-wrap;font-family: 'SimSun';font-size: 23px;color: #2f2f2f;">
          {{ caseHistory.mainSuit }}
        </span>
      </section>
      <section>
        <span class="label-bold" style="font-weight: bold;font-family: 'SimSun';font-size: 23px;width: 150px;font-weight: bold;">现病史：</span>
        <span class="info-content" style="white-space: pre-wrap;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height:40px;">
          {{ caseHistory.hpi.content }}
        </span>
        <!-- <el-descriptions
          class="margin-top"
          size="medium  "
          :labelStyle="{ 'width': '120px', 'background': '#fff','color':'#333','font-family':'SimSun' }"
          :column="4"
          :border="true"
        >
          <el-descriptions-item>
            <template slot="label"> 白带多 </template>
            {{
              caseHistory.hpi.leukorrheaMore == 1
                ? "是"
                : caseHistory.hpi.leukorrheaMore == 0
                ? "否"
                : ""
            }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 白带异味 </template>
            {{
              caseHistory.hpi.leukorrheaOdor == 1
                ? "是"
                : caseHistory.hpi.leukorrheaOdor == 0
                ? "否"
                : ""
            }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 外阴瘙痒 </template>
            {{
              caseHistory.hpi.vulvarPruritus == 1
                ? "是"
                : caseHistory.hpi.vulvarPruritus == 0
                ? "否"
                : ""
            }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 外阴痛 </template>
            {{
              caseHistory.hpi.vulvarPain == 1
                ? "是"
                : caseHistory.hpi.vulvarPain == 0
                ? "否"
                : ""
            }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 阴道排液 </template>
            {{
              caseHistory.hpi.vaginalDischarge == 1
                ? "是"
                : caseHistory.hpi.vaginalDischarge == 0
                ? "否"
                : ""
            }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 异常出血 </template>
            {{
              caseHistory.hpi.abnormalBleeding == 1
                ? "是"
                : caseHistory.hpi.abnormalBleeding == 0
                ? "否"
                : ""
            }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 性交出血 </template>
            {{
              caseHistory.hpi.sexualBleeding == 1
                ? "是"
                : caseHistory.hpi.sexualBleeding == 0
                ? "否"
                : ""
            }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 绝经后出血 </template>
            {{
              caseHistory.hpi.menopauseBleeding == 1
                ? "是"
                : caseHistory.hpi.menopauseBleeding == 0
                ? "否"
                : ""
            }}
          </el-descriptions-item>
        </el-descriptions> -->
      </section>
      <section>
        <span class="label-bold" style="font-weight: bold;font-family: 'SimSun';font-size: 23px;width: 150px; font-weight: bold;">既往史：</span>
        <span class="info-content" style="white-space: pre-wrap;">
          <span style="white-space: pre-wrap;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height:40px;">否认疫区(含境外、国内中高风险地区或重点地区)旅居史;</span>
          <span v-if="caseHistory.pastHistory" style="margin-right: 10px;white-space: pre-wrap;white-space: pre-wrap;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height:40px;">{{
            "既往史:" + caseHistory.pastHistory
            }}</span>
          <span v-if="caseHistory.personalHistory" style="margin-right: 10px;white-space: pre-wrap;white-space: pre-wrap;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height:40px;">{{
            "个人史:" + caseHistory.personalHistory
            }}</span>
          <!-- <span v-if="caseHistory.pm.content" style="margin-right: 10px;white-space: pre-wrap;">{{
            "月经/婚育史:" + caseHistory.pm.content
          }}</span> -->
          <span v-if="caseHistory.familyHistory" style="margin-right: 10px;white-space: pre-wrap;white-space: pre-wrap;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height:40px;">{{
            "家族史:" + caseHistory.familyHistory
            }}</span>
        </span>
      </section>
      <section style="display: flex;">
        <span class="label-bold" style="width: 145px;font-weight: bold;font-family: 'SimSun';font-size: 23px;"
          v-if="caseHistory.pm.pregnancy||
                caseHistory.pm.contraceptiveMethod||
                caseHistory.pm.lastMensesDate||
                caseHistory.pm.menopauseAge||
                caseHistory.pm.content">月经/婚育史:</span>
        <div style="width: 765px;margin-top: 0px">
          <span style="font-size:23px;color: rgb(51, 51, 51);font-family: SimSun;display: flex;" v-if="caseHistory.pm.pregnancy">
            <div  style="width:125px;font-size: 23px;color: rgb(51, 51, 51);font-family: 'SimSun';">
              孕/产:
            </div>
            <div  style="width:700px;margin-left: -10px;">
            <span class="info-content" style="white-space: pre-wrap;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height: 30px;margin-top:3px">{{caseHistory.pm.pregnancy ?caseHistory.pm.pregnancy : "" }}</span>
            </div>
          </span>
          <span style="font-size:23px;color: rgb(51, 51, 51);font-family: SimSun;display: flex;" v-if="caseHistory.pm.contraceptiveMethod">
            <div  style="width:125px;font-size: 23px;color: rgb(51, 51, 51);font-family: 'SimSun';">
              避孕方式:
            </div>
            <div  style="width:700px;margin-left: -10px;">
            <span class="info-content" style="white-space: pre-wrap;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height: 30px;margin-top:3px">{{caseHistory.pm.contraceptiveMethod ?caseHistory.pm.contraceptiveMethod : "" }}</span>
            </div>
          </span>
          <span style="font-size:23px;color: rgb(51, 51, 51);font-family: SimSun;display: flex;" v-if="caseHistory.pm.lastMensesDate">
            <div  style="width:125px;font-size: 23px;color: rgb(51, 51, 51);font-family: 'SimSun';">
              末次月经:
            </div>
            <div  style="width:700px;margin-left: -10px;">
            <span class="info-content" style="white-space: pre-wrap;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height: 30px;margin-top:3px">{{caseHistory.pm.lastMensesDate ?caseHistory.pm.lastMensesDate : "" }}</span>
            </div>
          </span>
          <span style="font-size:23px;color: rgb(51, 51, 51);font-family: SimSun;display: flex;" v-if="caseHistory.pm.menopauseAge">
            <div  style="width:125px;font-size: 23px;color: rgb(51, 51, 51);font-family: 'SimSun';">
              绝经年龄:
            </div>
            <div  style="width:700px;margin-left: -10px;">
            <span class="info-content" style="white-space: pre-wrap;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height: 30px;margin-top:3px">{{caseHistory.pm.menopauseAge ?caseHistory.pm.menopauseAge : "" }}</span>
            </div>
          </span>
          <span style="font-size:23px;color: rgb(51, 51, 51);font-family: SimSun;display: flex;" v-if="caseHistory.pm.content">
            <div  style="width:125px;font-size: 23px;color: rgb(51, 51, 51);font-family: 'SimSun';">
              其他:
            </div>
            <div  style="width:700px;margin-left: -10px;">
            <span class="info-content" style="white-space: pre-wrap;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height: 30px;margin-top:3px">{{caseHistory.pm.content ?caseHistory.pm.content : "" }}</span>
            </div>
          </span>
        </div>
        <!-- <el-descriptions
          class="margin-top"
          size="medium"
           :contentStyle="{'width':'120px','whiteSpace':'pre-wrap'}"
          :labelStyle="{ 'width': '70px', 'background': '#fff','color':'#333','font-family':'SimSun' }"
          :column="4"
          :border="true"
        >
          <el-descriptions-item>
            <template slot="label"> 孕/产 </template>
             {{ caseHistory.pm.pregnancy ? caseHistory.pm.pregnancy : "" }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 避孕方式 </template>
            {{
              caseHistory.pm.contraceptiveMethod
                ? caseHistory.pm.contraceptiveMethod
                : ""
            }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 末次月经 </template>
            {{ caseHistory.pm.lastMensesDate ? caseHistory.pm.lastMensesDate : "" }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 绝经年龄 </template>
            {{ caseHistory.pm.menopauseAge ? caseHistory.pm.menopauseAge + '岁' : "" }}
          </el-descriptions-item>
         <el-descriptions-item>
            <template slot="label"> 月经时间 </template>
            {{ caseHistory.pm.menopauseDate ? caseHistory.pm.menopauseDate : "" }}
          </el-descriptions-item> 
        </el-descriptions> -->
      </section>
      <section style="display: flex;">
        <span class="label-bold" style="width:120px;font-weight: bold;font-family: 'SimSun';font-size: 23px;margin-top:3px">体格检查：</span>
        <div style="margin-top:-2px;width: 810px;">
          <span class="info-content" style="white-space: pre-wrap;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height: 40px;">
            <span v-show="caseHistory.ppe.checked===1">已查,</span><span v-show="caseHistory.ppe.checked===0">未查,</span>{{
            caseHistory.ppe.content }}
          </span>
          <span class="info-content" style="white-space: pre-wrap;display: flex;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height: 40px;" v-if="caseHistory.ppe.vulvar">
          <div style="width: 12%;">外阴：</div>
          <div>{{caseHistory.ppe.vulvar ? caseHistory.ppe.vulvar : "" }}</div>
          </span>
          <span class="info-content" style="white-space: pre-wrap;display: flex;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height: 40px;" v-if="caseHistory.ppe.vaginal">
          <div style="width: 12%;">阴道：</div>
          <div>{{caseHistory.ppe.vaginal ? caseHistory.ppe.vaginal : "" }}</div>
          </span>
          <span class="info-content" style="white-space: pre-wrap;display: flex;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height: 40px;" v-if="caseHistory.ppe.cervical">
          <div style="width: 12%;">宫颈：</div>
          <div>{{caseHistory.ppe.cervical ? caseHistory.ppe.cervical : "" }}</div>
          </span>
          <span class="info-content" style="white-space: pre-wrap;display: flex;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height: 40px;" v-if="caseHistory.ppe.uterus">
          <div style="width: 12%;">子宫：</div>
          <div>{{caseHistory.ppe.uterus ? caseHistory.ppe.uterus : "" }}</div>
          </span>
          <span class="info-content" style="white-space: pre-wrap;display: flex;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height: 40px;" v-if="caseHistory.ppe.doubleAppendages">
          <div style="width: 12%;">双附件：</div>
          <div>{{caseHistory.ppe.doubleAppendages ? caseHistory.ppe.doubleAppendages : "" }}</div>
          </span>
          <span class="info-content" style="white-space: pre-wrap;display: flex;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height: 40px;" v-if="caseHistory.ppe.other">
          <div style="width: 12%;">其他：</div>
          <div>{{caseHistory.ppe.other ? caseHistory.ppe.other : "" }}</div>
          </span>
        </div>
        <!-- <el-descriptions
          class="margin-top"
          size="medium "
          :contentStyle="{'whiteSpace':'pre-wrap'}"
          :labelStyle="{ 'width': '170px', 'background': '#fff','color':'#333','font-family':'SimSun' }"
          :column="1"
          :border="true"
          v-show="caseHistory.ppe.checked===1"
        >
          <el-descriptions-item>
            <template slot="label"> 外阴: </template>
            {{ caseHistory.ppe.vulvar ? caseHistory.ppe.vulvar : "" }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 阴道: </template>
            {{ caseHistory.ppe.vaginal ? caseHistory.ppe.vaginal : "" }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 宫颈: </template>
            {{ caseHistory.ppe.cervical ? caseHistory.ppe.cervical : "" }}
          </el-descriptions-item>
           <el-descriptions-item>
              <template slot="label"> 残端 </template>
              {{caseHistory.ppe.stump ? caseHistory.ppe.stump : ""}}
            </el-descriptions-item>
           <el-descriptions-item contentClassName="contentClassName">
                <template slot="label"> 子宫: </template>
                 <el-descriptions size="small"  :contentStyle="{'whiteSpace':'pre-wrap'}"  class="descriptions" :labelStyle="{'width':'90px','background':'#fff','color':'#333','fontSize':'13px'}"  :border='true' :column="1">
                  <el-descriptions-item>
                      <template slot="label"> 大小 </template>
                       {{ caseHistory.ppe.uterusSize ? caseHistory.ppe.uterusSize : "" }}
                    </el-descriptions-item>
                    <el-descriptions-item>
                      <template slot="label"> 质地 </template>
                     {{ caseHistory.ppe.uterusTexture ? caseHistory.ppe.uterusTexture : ""}}
                    </el-descriptions-item>
                    <el-descriptions-item>
                      <template slot="label"> 子宫缺如 </template>
                     {{ caseHistory.ppe.uterusAbsence == 1
                    ? "是"
                    : caseHistory.ppe.uterusAbsence == 0
                    ? "否"
                    : ""}}
                    </el-descriptions-item>
                </el-descriptions>
              </el-descriptions-item>
  
           <el-descriptions-item contentClassName="contentClassName">
            <template slot="label"> 子宫: </template>
            <div class="descriptions-uterus">
              <div class="descriptions-uterus-div">
                <span
                  style="
                    margin-left: 10px;
                    width: 50px;
                    font-weight: bold;
                    ;color:#333;font-family:宋体
                  "
                  >大小</span
                >
                <span>
                  {{ caseHistory.ppe.uterusSize ? caseHistory.ppe.uterusSize : "" }}</span
                >
                <span style="width: 50px; font-weight: bold;color:#333;font-family:宋体"
                  >质地</span
                >
                <span>{{
                  caseHistory.ppe.uterusTexture ? caseHistory.ppe.uterusTexture : ""
                }}</span>
              </div>
              <div class="descriptions-uterus-span">
                <span class="span1" style="font-weight: bold;color:#333;font-family:宋体"
                  >子宫缺如:</span
                >
                <span class="span2">{{
                  caseHistory.ppe.uterusAbsence == 1
                    ? "是"
                    : caseHistory.ppe.uterusAbsence == 0
                    ? "否"
                    : ""
                }}</span>
              </div>
            </div>
          </el-descriptions-item> 
          <el-descriptions-item>
            <template slot="label"> 双附件: </template>
            {{ caseHistory.ppe.doubleAppendages ? caseHistory.ppe.doubleAppendages : "" }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 一侧/双侧附件缺如: </template>
            {{
              caseHistory.ppe.appendagesAbsence ? caseHistory.ppe.appendagesAbsence : ""
            }}
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 其它: </template>
            {{ caseHistory.ppe.other ? caseHistory.ppe.other : "" }}
          </el-descriptions-item>
        </el-descriptions> -->
      </section>
      <section>
        <span class="label-bold" style="font-weight: bold;font-family: 'SimSun';font-size: 23px;width: 150px;">辅助检查结果：</span>
        <span class="info-content" style="white-space: pre-wrap;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height: 40px;">
          {{ caseHistory.todayCheckRemark }}
        </span>
      </section>
      <section>
        <span class="label-bold" style="font-weight: bold;font-family: 'SimSun';font-size: 23px;width: 150px;">诊断：</span>
        <span class="info-content"  style="white-space: pre-wrap;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height: 40px;">{{caseHistory.diagnose}}</span>
      </section>
      <section>
        <span class="label-bold" style="font-weight: bold;font-family: 'SimSun';font-size: 23px;width: 150px;">诊疗意见：</span>
        <span class="info-content"  style="white-space: pre-wrap;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height: 40px;">{{caseHistory.medicalOpinion}}</span>
      </section>
      <el-row style="margin-top: 50px">
        <el-col :span="24">
          <span class="info-content"> </span>
        </el-col>
      </el-row>
      <el-row class="flex-one" style="margin: 150px 0px 0px 0px;flex: 1;">
        <el-col :span="24">
          <div class="signature-con" style="text-align: right;">
            <span class="title" style="font-weight: bold;font-family: 'SimSun';font-size: 23px;text-align: left;color: #2f2f2f;line-height: 40px;">医师签名：</span>
            <span class="signature" style="margin-bottom: -5px;display: inline-block;width: 200px;border-bottom: 1px solid #333333;">
              <img src="" alt="" />
            </span>
          </div>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
export default {
  props: ["caseHistory"],
};
</script>
<style lang="less" scoped>
.descriptions-label{
    display: flex;
    justify-content: space-between;
    height: 42px;
    >span{
        border-right: 1px solid #EBEEF5;
        display:block;
        flex: 1;
        margin-right: 11px;
        line-height: 42px;
    }
    .descriptions-label-span{
        flex: 1;
        display: flex;
        justify-content: space-between;
        line-height: 42px;
        .span1{
            display:block;
            margin: 0;
            margin-right: 37px;
        }
        .span2{
             border-left: 1px solid #EBEEF5;
            flex: 1;
            display:block;
            padding: 0 15px !important;
        }
    }
}
.descriptions-uterus{
    display: flex;
    justify-content: space-between;
    height: 42px;
     div{
         flex: 1;
     }
     .descriptions-uterus-div{
        display: flex;
        justify-content: space-between;
         line-height: 42px;
        span{
            width: 120px;
            border-right: 1px solid #EBEEF5;
            margin-left: 10px;
        }
     }
     .descriptions-uterus-span{
        display: flex;
        justify-content: space-between;
        line-height: 42px;
        .span1{
            display:block;
            padding: 0 10px!important;
        }
        .span2{
             border-left: 1px solid #EBEEF5;
            flex: 1;
            display:block;
            padding: 0 15px!important;
        }
     }
}
.contentClassName{
  padding: 0 !important;
}
</style>
<style scoped lang="less">
.medical-record-con {
  background-color: #ffffff;
  position: relative;
  box-sizing: border-box;
  display: flex;
   width: 970px;
  padding: 30px 30px 20px 30px;
  flex-direction: column;
  margin: 0 auto;
  section {
    margin-bottom: 0px;
  }
  .label-bold {
    font-weight: bold;
    font-family: "SimSun";
    font-size: 16px;
    width: 150px;
  }
  .patient-info {
    padding:5px 0;
    border-top: 1px solid #333;
    border-bottom: 1px solid #333;
    margin: 25px 0;
    .label {
      font-family: "SimSun";
      height: 40px;
      line-height: 40px;
      font-size: 20px;
    }
    .Arial {
      font-family: "Arial";
    }
    .text {
      font-family: "SimSun";
      height: 40px;
      line-height: 40px;
      font-size: 20px;
    }
  }
  section {
    // margin-bottom: 5px;
  }
  .flex-one {
    margin: 150px 0px 0px 0px;
    flex: 1;
    // position: absolute;
    // right: 10px;
    // bottom: 40px;
    // display: flex;
    // flex-direction: column;
    // justify-info-content: space-between;
  }
  .print {
    position: absolute;
    right: -100px;
    top: 200px;
  }
  .hos-name,
  .type {
    text-align: center;
  }
  .hos-name {
    font-weight: bold;
    font-family: "SimSun";
    font-size: 20px;
    color: #2f2f2f;
    line-height: 30px;
    margin-bottom: 10px;
  }
  .type {
    font-weight: bold;
    font-family: "SimSun";
    letter-spacing: 5px;
    font-size: 20px;
    color: #2f2f2f;
    line-height: 30px;
    margin-bottom: 16px;
  }
  .info-content {
    font-family: "SimSun";
    font-size: 18px;
    text-align: left;
    color: #2f2f2f;
    line-height: 40px;
  }
  .signature-con {
    text-align: right;
    .title {
      font-weight: bold;
      font-family: "SimSun";
      font-size: 16px;
      text-align: left;
      color: #2f2f2f;
      line-height: 40px;
    }
    .signature {
      margin-bottom: -5px;
      display: inline-block;
      width: 200px;
      border-bottom: 1px solid #333333;
    }
  }
}
</style>
