Vue_New/src/xt_pages/user/components/PatientDetail.vue

<template>
  <div class="app-container ">
    <el-dialog
      title="查看传染病检查结果"
      :visible.sync="dialogFormVisible"
      width="1000px"
      id="user-inspection-form"
    >
      <el-form :model="form" ref="form" label-position="top">
        <el-row>
          <el-col :span="1">&nbsp;</el-col>

          <template v-for="(item, index) in form.formItem">
            <el-col :span="7" :key="index">
              <el-form-item
                :label="item.item_name"
                v-if="item.range_type == 1"
                :key="item.item_id"
                :prop="'formItem.' + index + '.value'"
              >
                <el-input
                  placeholder="请填入"
                  v-model="item.value"
                  style="width:95%"
                  type="number"
                  disabled
                >
                  <template slot="append">{{ item.unit }}</template>
                </el-input>
              </el-form-item>
              <el-form-item
                :label="item.item_name"
                v-else
                :key="item.item_id"
                :prop="'formItem.' + index + '.value'"
              >
                <el-select
                  v-model="item.value"
                  placeholder="请选择"
                  style="width:95%"
                  disabled
                >
                  <el-option
                    v-for="(optionItem, oidex) in item.select_options"
                    :key="oidex"
                    :label="optionItem"
                    :value="optionItem"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="1" :key="'form-col' + index">&nbsp;</el-col>
          </template>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">关闭</el-button>
      </div>
    </el-dialog>

    <el-form
      ref="form"
      :rules="rules"
      :model="form"
      label-width="134px"
      class="clearfix"
      id="patient-info"
    >
      <div style="float:right;z-index:8;position: absolute;right: 16px;">
        <el-button
          size="small"
          type="primary"
          @click="printCard()"
          style="margin:0 6px 6px 0;z-index:1;"
          >打印签到卡</el-button
        >
        <el-button
          size="small"
          :disabled="$store.getters.xt_user.subscibe.state == 3 ? true : false"
          type="primary"
          @click="$router.push('/patients/patient/' + patientID + '/edit')"
          style="margin:0 0 6px 0;z-index:1;"
          >修改</el-button
        >
        <el-button
          size="small"
          type="primary"
          @click="printThisInfo()"
          style="margin:0 6px 6px 0;z-index:1;"
          >打印</el-button
        >
      </div>
      <div class="dataTitle">一般资料</div>
      <el-row>
        <el-col :span="20">
          <el-row :gutter="10">
            <el-col :span="8">
              <el-form-item label="姓名 : " class="is-required" prop="name">
                <el-input v-model="form.name" disabled></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8" style="height:59px;">
              <el-form-item label="性别 : " class="is-required" prop="gender">
                <el-radio-group v-model="form.gender">
                  <el-radio
                    v-for="item in sexOptions"
                    :key="item.value"
                    :label="item.value"
                    :value="item.value"
                    disabled
                    >{{ item.label }}</el-radio
                  >
                </el-radio-group>
              </el-form-item>
            </el-col>

            <el-col :span="8">
              <el-form-item
                label="身份证号 : "
                class="is-required"
                prop="idCardNo"
              >
                <el-input v-model="form.idCardNo" disabled></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8" style="height:59px;">
              <el-form-item label="年龄 : " class="is-required" prop="age">
                <el-input v-model="form.age" disabled></el-input>
              </el-form-item>
            </el-col>

            <el-col :span="8">
              <el-form-item label="透析号 : " class="is-required">
                <el-input
                  disabled
                  v-model="form.dialysisNo"
                  placeholder="填写或自动生成"
                  style="width:110px;float:left;margin-right: 1%;"
                ></el-input>
                <el-button disabled type="primary">自动生成</el-button>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item
                label="出生日期 : "
                class="is-required"
                prop="birth"
              >
                <el-date-picker
                  v-model="form.birth"
                  type="date"
                  disabled
                  placeholder="选择日期"
                  :suffix-icon="'el-icon-menu'"
                  format="yyyy-MM-dd"
                  value-format="yyyy-MM-dd"
                ></el-date-picker>
              </el-form-item>
            </el-col>

            <el-col :span="8">
              <el-form-item
                label="首次肾脏治疗时间 : "
                label-width="150px"
                class="is-required"
                prop="birth"
              >
                <el-date-picker
                  v-model="form.firstDialysisDate"
                  type="date"
                  disabled
                  placeholder="选择日期"
                  :suffix-icon="'el-icon-menu'"
                  format="yyyy-MM-dd"
                  value-format="yyyy-MM-dd"
                ></el-date-picker>
              </el-form-item>
            </el-col>

            <el-col :span="8">
              <el-form-item label="本人电话: " class="is-required" prop="phone">
                <el-input
                  v-model="form.phone"
                  maxlength="20"
                  disabled
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="家属姓名: ">
                <el-input
                  v-model="form.contact_name"
                  maxlength="20"
                  disabled
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="家属电话: " prop="homeTelephone">
                <el-input
                  v-model="form.homeTelephone"
                  maxlength="20"
                  disabled
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8" style="height:59px;">
              <el-form-item
                label="患者来源 : "
                class="is-required"
                prop="source"
              >
                <el-radio-group v-model="form.source">
                  <el-radio
                    v-for="item in sourceOptions"
                    :key="item.value"
                    :label="item.value"
                    :value="item.value"
                    disabled
                    >{{ item.label }}</el-radio
                  >
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="8" style="height:59px;">
              <el-form-item
                label="治疗状态(转归) : "
                class="is-required"
                prop="lapseto"
              >
                <el-radio-group v-model="form.lapseto">
                  <el-radio
                    v-for="item in lapsetoOptions"
                    :key="item.value"
                    :label="item.value"
                    :value="item.value"
                    disabled
                    >{{ item.label }}</el-radio
                  >
                </el-radio-group>
              </el-form-item>
            </el-col>

            <el-col :span="24">
              <el-form-item label="传染病 : " required prop="is_infectious">
                <el-radio-group v-model="form.is_infectious" disabled>
                  <el-radio :label="1">阴性</el-radio>
                  <el-radio :label="2">阳性</el-radio>
                </el-radio-group>
                <el-checkbox-group
                  v-model="form.contagions"
                  v-if="form.is_infectious == '2'"
                  disabled
                >
                  <el-checkbox
                    v-for="item in contagionList"
                    v-if="item.type == 2"
                    :label="item.id"
                    :key="item.id"
                    name="contagions"
                    :value="item.id"
                    >{{ item.name }}
                  </el-checkbox>
                </el-checkbox-group>
              </el-form-item>
            </el-col>

            <!--<el-col :span="16" >-->
            <!--<el-form-item label="检查结果日期 : "  >-->
            <!--<el-date-picker v-model="form.record_date" type="date" placeholder="选择日期" :suffix-icon="'el-icon-menu'"-->
            <!--format="yyyy-MM-dd"-->
            <!--style="width: 200px;"-->
            <!--value-format="yyyy-MM-dd"></el-date-picker>-->
            <!--&lt;!&ndash;<el-button type="primary" @click="recordCheck()">录入检验检查</el-button>&ndash;&gt;-->

            <!--</el-form-item>-->

            <!--</el-col>-->

            <el-col :span="16">
              <el-form-item label="检查结果日期 : ">
                <!--<el-date-picker v-model="form.record_date" type="date" placeholder="选择日期" :suffix-icon="'el-icon-menu'"-->
                <!--format="yyyy-MM-dd"-->
                <!--style="width: 200px;"-->
                <!--disabled-->
                <!--value-format="yyyy-MM-dd" v-if="isEdit"></el-date-picker>-->

                <el-date-picker
                  v-model="form.record_date"
                  type="date"
                  placeholder="选择日期"
                  :suffix-icon="'el-icon-menu'"
                  format="yyyy-MM-dd"
                  disabled
                  style="width: 200px;"
                  value-format="yyyy-MM-dd"
                ></el-date-picker>
                <el-button type="primary" @click="showInspectDialog()"
                  >查看检验检查</el-button
                >
              </el-form-item>
            </el-col>

            <el-col :span="24">
              <el-form-item label="传染病周期提醒: ">
                <el-radio-group
                  v-model="form.remind_cycle"
                  @change="changeCycle()"
                  disabled
                >
                  <el-radio :label="1">一月一次</el-radio>
                  <el-radio :label="2">两月一次</el-radio>
                  <el-radio :label="3">三月一次</el-radio>
                  <el-radio :label="4">半年一次</el-radio>
                  <el-radio :label="5">一年一次</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>

            <el-col :span="24">
              <el-form-item label="诊断 : " prop="diagnose">
                <!-- <textarea v-model="form.diagnose" class="textarea" disabled></textarea> -->
                <el-input
                  type="textarea"
                  :rows="3"
                  v-model="form.diagnose"
                  resize="none"
                  placeholder=""
                  readonly
                ></el-input>
              </el-form-item>
            </el-col>

            <el-col :span="8">
              <el-form-item label="民族 : " prop="nation">
                <el-input
                  v-model="form.nation"
                  maxlength="30"
                  disabled
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="籍贯 : " prop="native_place">
                <el-input
                  v-model="form.native_place"
                  maxlength="30"
                  disabled
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="家庭住址 : " prop="homeAddress">
                <el-input v-model="form.homeAddress" disabled></el-input>
              </el-form-item>
            </el-col>

            <div v-show="!generic_info_fold">
              <el-col :span="8">
                <el-form-item label="别名 : " prop="alias">
                  <el-input v-model="form.alias" disabled></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="身高(cm) : " prop="height">
                  <el-input
                    maxlength="5"
                    v-model="form.height"
                    disabled
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="婚姻状况 : " prop="maritalStatus">
                  <el-select
                    v-model="form.maritalStatus"
                    placeholder="请选择婚姻状况"
                    disabled
                  >
                    <el-option
                      v-for="item in maritalOptions"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="子女情况(个) : " prop="children">
                  <el-input
                    maxlength="5"
                    v-model="form.children"
                    disabled
                  ></el-input>
                </el-form-item>
                <!-- <el-form-item label=" " style="float:left;" label-width="30px" >
                </el-form-item> -->
              </el-col>
              <el-col :span="8">
                <el-form-item label="住院(门诊)号 : " prop="admissionNumber">
                  <el-input v-model="form.admissionNumber" disabled></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="医保类型 : " prop="reimbursementWayID">
                  <el-select v-model="form.reimbursementWayID" disabled>
                    <el-option
                      v-for="item in wayOptions"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="医保号 : " prop="healthCareNo">
                  <el-input v-model="form.healthCareNo" disabled></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="教育程度 : " prop="educationOptions">
                  <el-select v-model="form.education" disabled>
                    <el-option
                      v-for="item in educationOptions"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    />
                  </el-select>
                </el-form-item>
              </el-col>

              <el-col :span="8">
                <el-form-item label="固定电话 : ">
                  <el-input
                    v-model="form.tell_phone"
                    maxlength="20"
                    disabled
                  ></el-input>
                </el-form-item>
              </el-col>

              <el-col :span="8">
                <el-form-item label="费别 : ">
                  <el-select v-model="form.expense_kind" disabled>
                    <el-option
                      v-for="item in expenseOptions"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    />
                  </el-select>
                </el-form-item>
              </el-col>

              <el-col :span="8">
                <el-form-item label="透析龄(月): ">
                  <el-input v-model="form.dialysis_age" disabled></el-input>
                </el-form-item>
              </el-col>

              <el-col :span="8">
                <el-form-item label="亲友电话: " prop="relative_phone">
                  <el-input
                    v-model="form.relative_phone"
                    maxlength="20"
                    disabled
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="亲友关系: " prop="relative_relations">
                  <el-input
                    v-model="form.relative_relations"
                    maxlength="20"
                    disabled
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="职业 : " prop="profession">
                  <el-select v-model="form.profession" disabled>
                    <el-option
                      v-for="item in professionOptions"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="工作单位 : " prop="work">
                  <el-input v-model="form.work" disabled></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="单位地址 : " prop="unit_address">
                  <el-input v-model="form.unit_address" disabled></el-input>
                </el-form-item>
              </el-col>
            </div>
            <el-col :span="8">
              <el-form-item>
                <el-button
                  type="text"
                  @click="generic_info_fold = !generic_info_fold"
                  >{{ generic_info_fold ? "更多资料" : "收起"
                  }}<i class="el-icon--right" :class="generic_fold_icon"></i
                ></el-button>
              </el-form-item>
            </el-col>
          </el-row>
        </el-col>
        <el-col :span="4" align="center">
          <img
            width="146px"
            height="146px"
            v-if="form.avatar"
            :src="form.avatar"
            class="avatar"
          />
          <el-form-item prop="avatar">
            <el-input
              v-model="form.avatar"
              type="hidden"
              placeholder=""
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <div class="dataTitle">治疗信息</div>
      <el-row :gutter="24">
        <el-col :span="12">
          <el-form-item label="主诉 : " prop="patient_complains">
            <el-input
              type="textarea"
              :rows="3"
              v-model="form.patient_complains"
              resize="none"
              placeholder=""
              readonly
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="现病史 : " prop="present_history">
            <el-input
              type="textarea"
              :rows="3"
              v-model="form.present_history"
              resize="none"
              placeholder=""
              readonly
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="既往史 : " prop="past_history">
            <el-input
              type="textarea"
              :rows="3"
              v-model="form.past_history"
              resize="none"
              placeholder=""
              readonly
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item label="体格检查">
            <el-input v-model="form.temperature" style="width: 200px;" disabled>
              <template slot="prepend"
                >体温:</template
              >
              <template slot="append"
                >℃</template
              >
            </el-input>
            <el-input v-model="form.pulse" style="width: 220px;" disabled>
              <template slot="prepend"
                >脉搏:
              </template>
              <template slot="append"
                >次/分</template
              >
            </el-input>
            <el-input v-model="form.respiratory" style="width: 220px;" disabled>
              <template slot="prepend"
                >呼吸:
              </template>
              <template slot="append"
                >次/分</template
              >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item>
            <el-input v-model="form.sbp" style="width: 240px;" disabled>
              <template slot="prepend"
                >收缩压:</template
              >
              <template slot="append"
                >mmHg</template
              >
            </el-input>
            <el-input v-model="form.dbp" style="width: 240px;" disabled>
              <template slot="prepend"
                >舒张压:</template
              >
              <template slot="append"
                >mmHg</template
              >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="" prop="remark">
            <!-- <textarea v-model="form.remark" class="textarea" disabled></textarea> -->
            <el-input
              type="textarea"
              :rows="3"
              v-model="form.remark"
              resize="none"
              placeholder=""
              readonly
            ></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="" prop="sch_remark">
            <!-- <textarea v-model="form.remark" class="textarea" disabled></textarea> -->
            <el-input
              type="textarea"
              :rows="3"
              v-model="form.sch_remark"
              resize="none"
              placeholder=""
              readonly
            ></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="24">
          <el-form-item label="慢性病 : " prop="diseases">
            <el-checkbox-group v-model="form.diseases">
              <el-checkbox
                v-for="item in checkDisease"
                :label="item.id"
                :key="item.id"
                :value="item.id"
                disabled
                >{{ item.name }}</el-checkbox
              >
            </el-checkbox-group>
          </el-form-item>
        </el-col>
      </el-row>

      <div v-show="!treat_info_fold">
        <el-col :span="6">
          <el-form-item
            label="本院首次透析 : "
            prop="is_hospital_first_dialysis"
          >
            <el-radio-group v-model="form.is_hospital_first_dialysis">
              <el-radio
                v-for="item in isHospitalFirstDialysisOptions"
                :key="item.value"
                :label="item.value"
                :value="item.value"
                disabled
                >{{ item.label }}</el-radio
              >
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item
            label="系统前透析次数 : "
            prop="first_dialysis_hospital"
          >
            <el-input v-model="form.user_sys_before_count" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="首次诊治日期 : ">
            <el-date-picker
              v-model="form.first_treatment_date"
              type="date"
              disabled
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
            ></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="首次透析医院 : " prop="first_dialysis_hospital">
            <el-input
              v-model="form.first_dialysis_hospital"
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="透析之前情况 : " prop="predialysis_condition">
            <el-checkbox-group v-model="form.predialysis_condition">
              <el-checkbox
                v-for="item in predialysisConditionOptions"
                :label="item.label"
                :key="item.value"
                :value="item.label"
                disabled
                >{{ item.label }}</el-checkbox
              >
            </el-checkbox-group>
          </el-form-item> </el-col
        ><el-col :span="6">
          <el-form-item
            label="本院前透析频率 : "
            prop="pre_hospital_dialysis_frequency"
          >
            <el-input
              v-model="form.pre_hospital_dialysis_frequency"
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item
            label="本院前透析次数 : "
            prop="pre_hospital_dialysis_times"
          >
            <el-input
              v-model="form.pre_hospital_dialysis_times"
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item
            label="本院首次透析 : "
            prop="hospital_first_dialysis_date"
          >
            <el-date-picker
              v-model="form.hospital_first_dialysis_date"
              type="date"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              disabled
            ></el-date-picker>
          </el-form-item>
        </el-col>
      </div>
      <el-col :span="24">
        <el-form-item>
          <el-button type="text" @click="treat_info_fold = !treat_info_fold"
            >{{ treat_info_fold ? "更多治疗信息" : "收起"
            }}<i class="el-icon--right" :class="treat_fold_icon"></i
          ></el-button>
        </el-form-item>
      </el-col>

      <el-col :span="24">
        <el-form-item label="登记人员 : ">
          <span>{{ form.registrars }} </span>
        </el-form-item>
      </el-col>
    </el-form>
    <div style="display:none;">
      <div id="print-info-box">
        <div class="print_main_content">
          <div class="order_title">{{ orgname }} 血液透析门诊病历</div>
          <div>
            <table>
              <thead>
                <!-- 用 thead 规定好宽度 -->
                <tr v-show="false">
                  <td width="5%"></td>
                  <td width="10%"></td>
                  <td width="5%"></td>
                  <td width="10%"></td>
                  <td width="5%"></td>
                  <td width="10%"></td>
                  <td width="5%"></td>
                  <td width="30%"></td>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <td valign="top"><div class="td_proj_title">姓名</div></td>
                  <td valign="top">
                    <div class="td_proj_content">{{ patientPrint.name }}</div>
                  </td>
                  <td valign="top"><div class="td_proj_title">性别</div></td>
                  <td valign="top">
                    <div class="td_proj_content">{{ patientPrint.gender }}</div>
                  </td>
                  <td valign="top"><div class="td_proj_title">年龄</div></td>
                  <td valign="top">
                    <div class="td_proj_content">{{ patientPrint.age }}岁</div>
                  </td>
                  <td valign="top"><div class="td_proj_title">籍贯</div></td>
                  <td valign="top">
                    <div class="td_proj_content td_align_left">
                      {{ patientPrint.native_place }}
                    </div>
                  </td>
                </tr>
                <tr>
                  <td valign="top"><div class="td_proj_title">职业</div></td>
                  <td valign="top">
                    <div class="td_proj_content">
                      {{ patientPrint.profession }}
                    </div>
                  </td>
                  <td valign="top"><div class="td_proj_title">婚姻</div></td>
                  <td valign="top">
                    <div class="td_proj_content">
                      {{ patientPrint.marital_status }}
                    </div>
                  </td>
                  <td valign="top"><div class="td_proj_title">透析号</div></td>
                  <td valign="top">
                    <div class="td_proj_content">
                      {{ patientPrint.dialysis_no }}
                    </div>
                  </td>
                  <td valign="top">
                    <div class="td_proj_title">身份证号</div>
                  </td>
                  <td valign="top">
                    <div class="td_proj_content td_align_left">
                      {{ patientPrint.id_card_no }}
                    </div>
                  </td>
                </tr>
                <tr>
                  <td valign="top"><div class="td_proj_title">民族</div></td>
                  <td valign="top">
                    <div class="td_proj_content">{{ patientPrint.nation }}</div>
                  </td>
                  <td valign="top"><div class="td_proj_title">电话</div></td>
                  <td valign="top" colspan="3">
                    <div class="td_proj_content td_align_left">
                      {{ patientPrint.phone }}
                    </div>
                  </td>
                  <td valign="top">
                    <div class="td_proj_title">备用电话</div>
                  </td>
                  <td valign="top">
                    <div class="td_proj_content td_align_left">
                      {{ patientPrint.home_telephone }}
                    </div>
                  </td>
                </tr>
                <tr>
                  <td><div class="td_proj_title">地址</div></td>
                  <td colspan="7">
                    <div class="td_proj_content td_align_left">
                      {{ patientPrint.home_address }}
                    </div>
                  </td>
                </tr>
                <tr>
                  <td><div class="td_proj_title">主诉</div></td>
                  <td colspan="7">
                    <div
                      class="td_proj_content td_align_left"
                      v-html="patientPrint.patient_complains"
                    ></div>
                  </td>
                </tr>
                <tr>
                  <td>
                    <div class="td_proj_title">现<br />病<br />史</div>
                  </td>
                  <td colspan="7">
                    <div
                      class="td_proj_content td_align_left"
                      v-html="patientPrint.present_history"
                    ></div>
                  </td>
                </tr>
                <tr>
                  <td>
                    <div class="td_proj_title">既<br />往<br />史</div>
                  </td>
                  <td colspan="7">
                    <div
                      class="td_proj_content td_align_left"
                      v-html="patientPrint.past_history"
                    ></div>
                  </td>
                </tr>
                <tr>
                  <td colspan="8"><div class="td_proj_title">体格检查</div></td>
                </tr>
                <tr>
                  <td colspan="8">
                    <div class="td_proj_title">
                      T
                      {{
                        patientPrint.temperature
                      }}℃&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; P
                      {{
                        patientPrint.pulse
                      }}次/分&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; R
                      {{
                        patientPrint.respiratory
                      }}次/分&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; BP
                      {{ patientPrint.sbp }}/{{ patientPrint.dbp }} mmHg
                    </div>
                  </td>
                </tr>
                <tr>
                  <td colspan="8">
                    <div
                      class="td_proj_content td_align_left"
                      v-html="patientPrint.remark"
                    ></div>
                  </td>
                </tr>
                <tr>
                  <td>
                    <div class="td_proj_title">传<br />染<br />病</div>
                  </td>
                  <td colspan="7">
                    <div class="td_proj_content td_align_left">
                      {{ patientPrint.contagions }}
                    </div>
                  </td>
                </tr>
                <tr>
                  <td>
                    <div class="td_proj_title">诊<br />断</div>
                  </td>
                  <td colspan="7">
                    <div
                      class="td_proj_content td_align_left"
                      v-html="patientPrint.diagnose"
                    ></div>
                  </td>
                </tr>
              </tbody>
            </table>
            <div class="print_footnote_panel">
              <div class="proj">
                <span class="proj_title">日期：</span
                >{{ getTime(patientPrint.created_time) }}
              </div>
              <div class="proj"><span class="proj_title">医生签名：</span></div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div hidden="hidden">
      <div id="print-card-info">
        <div
          class="order_title"
          align="center"
          style="margin-bottom:20px;font-size:35px"
        >
          签到卡
        </div>
        <div align="center" style="margin-bottom:4px;font-size:25px">
          姓名:<span>&nbsp;&nbsp;{{ patientPrint.name }}</span
          ><br />
        </div>
        <div align="center" style="margin-bottom:20px;font-size:25px">
          透析号:<span>&nbsp;&nbsp;{{ patientPrint.dialysis_no }}</span>
        </div>
        <div>
          <div id="qrcode" align="center"></div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { getDataConfig } from "@/utils/data";
import { getToken } from "@/api/qiniu";
import {
  getFileExtension,
  isCardNo,
  jsGetAge,
  isPositiveInteger,
  dialysisAge,
  uParseTime
} from "@/utils/tools";
import {
  generateDialysisNo,
  createPatient,
  editPatient,
  fetchPatient
} from "@/api/patient";
import { fetchAllDoctorAndNurse, fetchAllAdminUsers } from "@/api/doctor";
import { getZones } from "@/api/device/device";
import print from "print-js";
import QRCode from "qrcodejs2";
import { Base64 } from "js-base64";
import { parse } from "path";

const defaultForm = {
  avatar: "",
  patientType: "",
  dialysisNo: "",
  admissionNumber: "",
  source: "",
  lapseto: "",
  partition: "",
  bed: "",
  name: "",
  gender: "",
  nation: "",
  native_place: "",
  maritalStatus: "",
  idCardNo: "",
  birth: "",
  age: "",
  reimbursementWayID: "",
  healthCareNo: "",
  healthCareDueDate: "",
  height: "",
  blood: "",
  rh: "",
  healthCareDueAlertDate: "",
  education: "",
  profession: "",
  phone: "",
  homeTelephone: "",
  homeAddress: "",
  work: "",
  receivingDate: "",
  firstDialysisDate: "",
  dialysisAge: "",
  induction: "",
  initial: "",
  dialysisTotal: "",
  contagions: [],
  doctor: "",
  nurse: "",
  assessment: "",
  diseases: [],
  diagnose: "",
  registrars: "",
  patient_complains: "",
  present_history: "",
  past_history: "",
  temperature: "",
  pulse: "",
  respiratory: "",
  sbp: "",
  dbp: "",
  record_date: "",
  response_result: "",
  is_infectious: "",
  formItem: [],
  tell_phone: "",
  first_treatment_date: "",
  dialysis_age: "",
  expense_kind: "",
  contact_name: "",
  sch_remark:"",
};

export default {
  name: "patientDetail",
  components: {},

  data() {
    return {
      expenseOptions: [
        { id: 1, name: "基本医保" },
        { id: 2, name: "新农合" },
        { id: 3, name: "自费医疗" },
        { id: 4, name: "公费医疗" },
        { id: 5, name: "商业保险" },
        { id: 6, name: "军队医疗" },
        { id: 7, name: "其他" }
      ],

      generic_info_fold: true,
      treat_info_fold: true,
      dialogFormVisible: false,
      orgname: "",
      adminusername: "",
      form: Object.assign({}, defaultForm),
      formSubmit: true,
      submitMethod: "",
      uploadData: { token: "", key: "" },
      dialogImageUrl: "",
      qiniuDomain: "https://images.shengws.com/",
      dialogVisible: false,
      typeOptions: null,
      styleOptions: null,
      sourceOptions: [{ value: 1, label: "门诊" }, { value: 2, label: "住院" }],
      lapsetoOptions: [
        { value: 1, label: "留治" },
        { value: 2, label: "转出" }
      ],
      partitionOptions: [],
      sexOptions: [{ value: 1, label: "男" }, { value: 2, label: "女" }],
      isHospitalFirstDialysisOptions: [
        { value: 1, label: "是" },
        { value: 2, label: "否" }
      ],
      predialysisConditionOptions: [
        { value: 1, label: "腹膜透析" },
        { value: 2, label: "肾移植" }
      ],
      maritalOptions: null,
      wayOptions: null,
      educationOptions: null,
      professionOptions: null,
      inductionOptions: null,
      doctorOptions: null,
      nurseOptions: null,
      adminUserOptions: [],
      infections: [],
      rhOptions: null,
      checkDisease: null,
      contagionList: null,
      loading: null,
      patientID: 0,
      patientPrint: {},
      print_time: "",

      rules: {
        contagions: [{ type: "array", required: false, trigger: "change" }],
        avatar: [{ required: true, message: "请上传头像", trigger: "blur" }],
        patientType: [
          { required: true, message: "请选择患者类型", trigger: "blur" }
        ],
        dialysisNo: [
          { required: true, message: "请填写透析号", trigger: "blur" }
        ],
        admissionNumber: [
          { required: true, message: "请填写住院(门诊)号", trigger: "blur" }
        ],
        source: [
          { required: true, message: "请选择患者来源", trigger: "blur" }
        ],
        lapseto: [
          { required: true, message: "请选择治疗状态", trigger: "blur" }
        ],
        name: [{ required: true, message: "请填写姓名", trigger: "blur" }],
        gender: [{ required: true, message: "请选择性别", trigger: "blur" }],
        idCardNo: [
          { required: true, message: "请填写身份证号", trigger: "blur" }
        ],
        birth: [{ required: true, message: "请填写生日", trigger: "blur" }]
      }
    };
  },
  computed: {
    generic_fold_icon: function() {
      return this.generic_info_fold ? "el-icon-arrow-down" : "el-icon-arrow-up";
    },
    treat_fold_icon: function() {
      return this.treat_info_fold ? "el-icon-arrow-down" : "el-icon-arrow-up";
    }
  },
  created() {
    this.styleOptions = this.$store.getters.patient_types;
    // this.partitionOptions = this.$store.getters.partitions;
    this.maritalOptions = getDataConfig("patient", "marital_options");
    this.wayOptions = getDataConfig("patient", "reimbursement_ways");
    this.typeOptions = this.$store.getters.blood_types;
    this.rhOptions = this.$store.getters.rh;
    this.educationOptions = getDataConfig("patient", "education_types");
    this.professionOptions = getDataConfig("patient", "profession_options");
    this.inductionOptions = this.$store.getters.induction_options;
    this.contagionList = this.$store.getters.contagions;
    this.checkDisease = this.$store.getters.disease;

    var xtuser = this.$store.getters.xt_user;
    this.orgname = xtuser.org.org_name;
    this.adminusername = xtuser.user.user_name;

    this.fetchAllAdminUsers();

    const id = this.$route.params && this.$route.params.id;
    this.patientID = parseInt(id);
    if (isNaN(this.patientID) || this.patientID <= 0) {
      console.log("patient detail not had id");
      this.$notify.error({
        title: "错误",
        message: "无效的id"
      });
      this.$router.push("/patients/patients");
    }
    this.fetchPatient(id);
    this.getZones();
    var ptime = Math.round(new Date().getTime() / 1000);
    // this.print_time = uParseTime(ptime, '{y}-{m}-{d} {h}:{i}');
  },
  methods: {
    getTime(val) {
      return uParseTime(val, "{y}年{m}月{d}日");
    },
    printThisInfo() {
      var ptime = Math.round(new Date().getTime() / 1000);
      this.print_time = uParseTime(ptime, "{y}年{m}月{d}日");

      const style =
        "@media print { .print_main_content { background-color: white; width:960px; margin:0 auto; padding: 0 0 20px 0; } .print_main_content .order_title { text-align: center; font-size: 23px; line-height: 50px; font-weight: 500; } .print_main_content table { width: 100%; border: 1px solid; border-collapse: collapse; padding: 2px; } .print_main_content table tbody tr td { border: 1px solid; text-align: center; padding: 10px 8px; } .td_proj_title { font-size: 18px; line-height: 25px; font-weight: 500; } .td_proj_content { font-size: 18px; line-height: 25px; } .td_align_left { text-align: left; } .print_footnote_panel { font-size: 17px; line-height: 40px; } .print_footnote_panel .proj { display: inline-block; width: 49%; } .print_footnote_panel .proj .proj_title { font-weight: 500;} }";

      setTimeout(() => {
        printJS({
          printable: "print-info-box",
          type: "html",
          style: style,
          scanStyles: false
        });
      }, 1);
    },
    getZones() {
      getZones().then(response => {
        if (response.data.state === 1) {
          this.partitionOptions = response.data.data.zones;
        }
      });
    },
    fetchPatient(id) {
      fetchPatient(id)
        .then(response => {
          console.log(response.data.data);
          if (response.data.state === 1) {
            this.$emit("tran-patient-info", response.data.data.patient);
            var patietInfo = response.data.data.patient;
            this.form.avatar = patietInfo.avatar;
            this.form.name = patietInfo.name;
            this.form.alias = patietInfo.alias;
            this.form.lapseto = patietInfo.lapseto;
            this.form.idCardNo = patietInfo.id_card_no;
            this.form.dialysisNo = patietInfo.dialysis_no;
            this.form.gender = patietInfo.gender;
            this.form.is_infectious = patietInfo.is_infectious;
            // this.form.record_date = patietInfo.is_infectious
            this.form.response_result = patietInfo.response_result;
            this.form.remind_cycle = patietInfo.remind_cycle;
            this.form.user_sys_before_count = patietInfo.user_sys_before_count;

            this.infections = response.data.data.infections;
            this.form.formItem = this.infections;
            if (this.infections != null) {
              if (this.infections.length > 0) {
                this.form.record_date = uParseTime(
                  this.infections[0].inspect_date,
                  "{y}-{m}-{d}"
                );
                const select_options = ["阴性", "阳性", "弱阳性"];
                for (let i = 0; i < this.infections.length; i++) {
                  this.infections[i]["select_options"] = select_options;
                  this.infections[i]["value"] = this.infections[
                    i
                  ].inspect_value;
                }
              }
            }

            if (patietInfo.gender === 1 || patietInfo.gender === 2) {
              this.form.gender = patietInfo.gender;
            }
            this.form.nation = patietInfo.nation;
            this.form.native_place = patietInfo.native_place;
            this.form.birth = uParseTime(patietInfo.birthday, "{y}-{m}-{d}");
            this.form.firstDialysisDate = uParseTime(
              patietInfo.first_dialysis_date,
              "{y}-{m}-{d}"
            );
            this.form.height = patietInfo.height + "";
            // this.form.age = jsGetAge(this.form.birth, "-");
            if (patietInfo.marital_status > 0) {
              this.form.maritalStatus = patietInfo.marital_status;
            }
            this.form.children = patietInfo.children;
            this.form.admissionNumber = patietInfo.admission_number;
            if (patietInfo.reimbursement_way_id > 0) {
              this.form.reimbursementWayID = patietInfo.reimbursement_way_id;
            }
            this.form.healthCareNo = patietInfo.health_care_no;
            this.form.phone = patietInfo.phone;
            this.form.homeTelephone = patietInfo.home_telephone;
            this.form.relative_phone = patietInfo.relative_phone;
            this.form.relative_relations = patietInfo.relative_relations;
            this.form.homeAddress = patietInfo.home_address;
            this.form.work = patietInfo.work_unit;
            this.form.unit_address = patietInfo.unit_address;

            if (patietInfo.age == 0) {
              this.form.age = jsGetAge(this.form.birth, "-");
            } else {
              this.form.age = patietInfo.age;
            }

            if (patietInfo.profession > 0) {
              this.form.profession = patietInfo.profession;
            }
            if (patietInfo.education_level > 0) {
              this.form.education = patietInfo.education_level;
            }
            if (patietInfo.source === 1 || patietInfo.source === 2) {
              this.form.source = patietInfo.source;
            }
            if (patietInfo.lapseto === 1 || patietInfo.lapseto === 2) {
              this.form.lapseto = patietInfo.lapseto;
            }
            if (
              patietInfo.is_hospital_first_dialysis === 1 ||
              patietInfo.is_hospital_first_dialysis === 2
            ) {
              this.form.is_hospital_first_dialysis =
                patietInfo.is_hospital_first_dialysis;
            }
            if (patietInfo.first_dialysis_date !== 0) {
              this.form.firstDialysisDate = uParseTime(
                patietInfo.first_dialysis_date,
                "{y}-{m}-{d}"
              );
            }
            this.form.first_dialysis_hospital =
              patietInfo.first_dialysis_hospital;
            if (patietInfo.predialysis_condition.length > 0) {
              this.form.predialysis_condition = patietInfo.predialysis_condition.split(
                ","
              );
            }
            this.form.pre_hospital_dialysis_frequency =
              patietInfo.pre_hospital_dialysis_frequency;
            this.form.pre_hospital_dialysis_times =
              patietInfo.pre_hospital_dialysis_times;
            if (patietInfo.hospital_first_dialysis_date !== 0) {
              this.form.hospital_first_dialysis_date = uParseTime(
                patietInfo.hospital_first_dialysis_date,
                "{y}-{m}-{d}"
              );
            }
            this.form.contagions = response.data.data.contagions;
            this.form.diseases = response.data.data.diseases;
            this.form.remark = patietInfo.remark;
            this.form.sch_remark = patietInfo.sch_remark;

            this.form.diagnose = patietInfo.diagnose;

            this.form.patient_complains = patietInfo.patient_complains;
            this.form.present_history = patietInfo.present_history;
            this.form.past_history = patietInfo.past_history;
            this.form.temperature = patietInfo.temperature;
            this.form.pulse = patietInfo.pulse;
            this.form.respiratory = patietInfo.respiratory;
            this.form.sbp = patietInfo.sbp;
            this.form.dbp = patietInfo.dbp;

            this.form.contact_name = patietInfo.contact_name;
            this.form.tell_phone = patietInfo.tell_phone;
            this.form.dialysis_age = patietInfo.dialysis_age;
            if (patietInfo.expense_kind == 0) {
              this.form.expense_kind = "";
            } else {
              this.form.expense_kind = patietInfo.expense_kind;
            }

            this.form.first_treatment_date = uParseTime(
              patietInfo.first_treatment_date,
              "{y}-{m}-{d}"
            );

            // this.form.initial = patietInfo.initial_dialysis + "";
            // this.form.dialysisTotal = patietInfo.total_dialysis + "";
            // this.form.assessment = patietInfo.evaluate;
            // if (patietInfo.patient_type > 0) {
            //   this.form.patientType = patietInfo.patient_type;
            // }
            // if (patietInfo.partition_id > 0) {
            //   this.form.partition = patietInfo.partition_id;
            // }
            // if (patietInfo.bed_id > 0) {
            //   this.form.bed = patietInfo.bed_id;
            // }
            // this.form.healthCareDueDate = uParseTime(
            //   patietInfo.health_care_due_date,
            //   "{y}-{m}-{d}"
            // );
            // if (patietInfo.blood_type > 0) {
            //   this.form.blood = patietInfo.blood_type;
            // }
            // if (patietInfo.rh > 0) {
            //   this.form.rh = patietInfo.rh;
            // }
            // this.form.healthCareDueAlertDate = uParseTime(
            //   patietInfo.health_care_due_alert_date,
            //   "{y}-{m}-{d}"
            // );
            // this.form.receivingDate = uParseTime(
            //   patietInfo.receiving_date,
            //   "{y}-{m}-{d}"
            // );
            // this.form.dialysisAge = dialysisAge(
            //   this.form.firstDialysisDate,
            //   "-"
            // );
            // if (patietInfo.induction_period > 0) {
            //   this.form.induction = patietInfo.induction_period;
            // }
            // if (patietInfo.attending_doctor_id > 0) {
            //   this.form.doctor = patietInfo.attending_doctor_id;
            // }
            // if (patietInfo.head_nurse_id > 0) {
            //   this.form.nurse = patietInfo.head_nurse_id;
            // }
            // if (patietInfo.registrars_id > 0) {
            //   this.form.registrars = patietInfo.registrars_id;
            // }

            var contagionsArr = response.data.data.contagions;
            var diseasesArr = response.data.data.diseases;

            this.patientPrint = patietInfo;

            var sourceLen = this.sourceOptions.length;
            for (let index = 0; index < sourceLen; index++) {
              if (this.sourceOptions[index].value === patietInfo.source) {
                this.patientPrint.source = this.sourceOptions[index].label;
                break;
              }
            }
            var styleLen = this.styleOptions.length;
            for (let index = 0; index < styleLen; index++) {
              if (this.styleOptions[index].id === patietInfo.patient_type) {
                this.patientPrint.patient_type = this.styleOptions[index].name;
                break;
              }
            }
            var partitionLen = this.partitionOptions.length;
            for (let index = 0; index < partitionLen; index++) {
              if (this.partitionOptions[index].id === patietInfo.partition_id) {
                this.patientPrint.partition_id = this.partitionOptions[
                  index
                ].name;
                break;
              }
            }
            this.patientPrint.bed_id =
              patietInfo.bed_id > 0 ? patietInfo.bed_id : "";
            if (patietInfo.gender === 1) {
              this.patientPrint.gender = "男";
            } else if (patietInfo.gender === 2) {
              this.patientPrint.gender = "女";
            } else {
              this.patientPrint.gender = "";
            }
            var maritalLen = this.maritalOptions.length;
            console.log(maritalLen);
            for (let index = 0; index < maritalLen; index++) {
              if (
                this.maritalOptions[index].id ==
                response.data.data.patient.marital_status
              ) {
                this.patientPrint.marital_status = this.maritalOptions[
                  index
                ].name;
              }
            }

            this.patientPrint.birthday = uParseTime(
              patietInfo.birthday,
              "{y}-{m}-{d}"
            );
            this.patientPrint.age = jsGetAge(this.patientPrint.birthday, "-");

            this.patientPrint.patient_complains = patietInfo.patient_complains.replace(
              /\n/g,
              "<br/>"
            );
            this.patientPrint.present_history = patietInfo.present_history.replace(
              /\n/g,
              "<br/>"
            );
            this.patientPrint.past_history = patietInfo.past_history.replace(
              /\n/g,
              "<br/>"
            );
            this.patientPrint.remark = patietInfo.remark.replace(
              /\n/g,
              "<br/>"
            );
            this.patientPrint.sch_remark = patietInfo.sch_remark.replace(
              /\n/g,
              "<br/>"
            );
            this.patientPrint.diagnose = patietInfo.diagnose.replace(
              /\n/g,
              "<br/>"
            );
            if (typeof patietInfo.temperature === "number") {
              this.patientPrint.temperature = patietInfo.temperature.toFixed(1);
            }

            if (patietInfo.reimbursement_way_id > 0) {
              var wayLen = this.wayOptions.length;
              for (let index = 0; index < wayLen; index++) {
                if (
                  this.wayOptions[index].id === patietInfo.reimbursement_way_id
                ) {
                  this.patientPrint.reimbursement_way_id = this.wayOptions[
                    index
                  ].name;
                  break;
                }
              }
            } else {
              this.patientPrint.reimbursement_way_id = "";
            }
            if (patietInfo.health_care_due_date !== 0) {
              this.patientPrint.health_care_due_date = uParseTime(
                patietInfo.health_care_due_date,
                "{y}-{m}-{d}"
              );
            } else {
              this.patientPrint.health_care_due_date = "";
            }
            if (patietInfo.blood_type > 0) {
              var typeLen = this.typeOptions.length;
              for (let index = 0; index < typeLen; index++) {
                if (this.typeOptions[index].id === patietInfo.blood_type) {
                  this.patientPrint.blood_type = this.typeOptions[index].name;
                  break;
                }
              }
            } else {
              this.patientPrint.blood_type = "";
            }
            if (patietInfo.rh > 0) {
              var rhLen = this.rhOptions.length;
              for (let index = 0; index < rhLen; index++) {
                if (this.rhOptions[index].id === patietInfo.rh) {
                  this.patientPrint.rh = this.rhOptions[index].name;
                  break;
                }
              }
            } else {
              this.patientPrint.rh = "";
            }
            if (patietInfo.health_care_due_alert_date !== 0) {
              this.patientPrint.health_care_due_alert_date = uParseTime(
                patietInfo.health_care_due_alert_date,
                "{y}-{m}-{d}"
              );
            } else {
              this.patientPrint.health_care_due_alert_date = "";
            }
            if (patietInfo.education_level > 0) {
              var eLen = this.educationOptions.length;
              for (let index = 0; index < eLen; index++) {
                if (
                  this.educationOptions[index].id === patietInfo.education_level
                ) {
                  this.patientPrint.education_level = this.educationOptions[
                    index
                  ].name;
                  break;
                }
              }
            } else {
              this.patientPrint.education_level = "";
            }
            if (patietInfo.profession > 0) {
              var eLen = this.professionOptions.length;
              for (let index = 0; index < eLen; index++) {
                if (
                  this.professionOptions[index].id === patietInfo.profession
                ) {
                  this.patientPrint.profession = this.professionOptions[
                    index
                  ].name;
                  break;
                }
              }
            } else {
              this.patientPrint.profession = "";
            }
            if (patietInfo.receiving_date !== 0) {
              this.patientPrint.receiving_date = uParseTime(
                patietInfo.receiving_date,
                "{y}-{m}-{d}"
              );
            } else {
              this.patientPrint.receiving_date = "";
            }
            if (patietInfo.first_dialysis_date !== 0) {
              this.patientPrint.first_dialysis_date = uParseTime(
                patietInfo.first_dialysis_date,
                "{y}-{m}-{d}"
              );
              this.patientPrint.dialysis_age = dialysisAge(
                this.patientPrint.first_dialysis_date
              );
            } else {
              this.patientPrint.first_dialysis_date = "";
              this.patientPrint.dialysis_age = "";
            }
            if (patietInfo.induction_period > 0) {
              var eLen = this.inductionOptions.length;
              for (let index = 0; index < eLen; index++) {
                if (
                  this.inductionOptions[index].id ===
                  patietInfo.induction_period
                ) {
                  this.patientPrint.induction_period = this.inductionOptions[
                    index
                  ].name;
                  break;
                }
              }
            } else {
              this.patientPrint.induction_period = "";
            }
            if (patietInfo.attending_doctor_id > 0) {
              var eLen = this.adminUserOptions.length;
              for (let index = 0; index < eLen; index++) {
                if (
                  this.adminUserOptions[index].id ===
                  patietInfo.attending_doctor_id
                ) {
                  this.patientPrint.attending_doctor_id = this.adminUserOptions[
                    index
                  ].name;
                  break;
                }
              }
            } else {
              this.patientPrint.attending_doctor_id = "";
            }
            if (patietInfo.head_nurse_id > 0) {
              var eLen = this.adminUserOptions.length;
              for (let index = 0; index < eLen; index++) {
                if (
                  this.adminUserOptions[index].id === patietInfo.head_nurse_id
                ) {
                  this.patientPrint.head_nurse_id = this.adminUserOptions[
                    index
                  ].name;
                  break;
                }
              }
            } else {
              this.patientPrint.head_nurse_id = "";
            }

            if (contagionsArr.length > 0) {
              var contagionsIdArr = {};
              var alen = contagionsArr.length;
              for (let index = 0; index < alen; index++) {
                contagionsIdArr[contagionsArr[index]] = 1;
              }
              var printContagions = [];
              var clen = this.contagionList.length;
              for (let index = 0; index < clen; index++) {
                if (this.contagionList[index].id in contagionsIdArr) {
                  printContagions.push(this.contagionList[index].name);
                }
              }
              this.patientPrint.contagions = printContagions.join("、");
            } else {
              this.patientPrint.contagions = "无";
            }

            if (diseasesArr.length > 0) {
              var diseasesIdArr = {};
              var alen = diseasesArr.length;
              for (let index = 0; index < alen; index++) {
                diseasesIdArr[diseasesArr[index]] = 1;
              }
              var printDisease = [];
              var clen = this.checkDisease.length;
              for (let index = 0; index < clen; index++) {
                if (this.checkDisease[index].id in diseasesIdArr) {
                  printDisease.push(this.checkDisease[index].name);
                }
              }
              this.patientPrint.diseases = printDisease.join("、");
            } else {
              this.patientPrint.diseases = "";
            }

            if (patietInfo.registrars_id > 0) {
              var eLen = this.adminUserOptions.length;
              for (let index = 0; index < eLen; index++) {
                if (
                  this.adminUserOptions[index].id === patietInfo.registrars_id
                ) {
                  this.patientPrint.registrars = this.adminUserOptions[
                    index
                  ].name;
                  this.form.registrars = this.adminUserOptions[index].name;
                  break;
                }
              }
            } else {
              this.patientPrint.registrars = "";
            }

            if (patietInfo.hospital_first_dialysis_date !== 0) {
              this.patientPrint.hospital_first_dialysis_date = uParseTime(
                patietInfo.hospital_first_dialysis_date,
                "{y}-{m}-{d}"
              );
            } else {
              this.patientPrint.hospital_first_dialysis_date = "";
            }

            this.checkIdCardNo();
          } else {
            console.log("patient get err state");
            this.$notify.error({
              title: "错误",
              message: "网络异常"
            });
            this.$router.push("/patients/patients");
          }

          // this.postForm = response.data
          // // Just for test
          // this.postForm.title += `   Article Id:${this.postForm.id}`
          // this.postForm.content_short += `   Article Id:${this.postForm.id}`
        })
        .catch(err => {
          console.log("patient get err", err);
          this.$notify.error({
            title: "错误",
            message: "网络异常"
          });
          this.$router.push("/patients/patients");
        });
    },
    fetchAllDoctorAndNurse() {
      fetchAllDoctorAndNurse().then(response => {
        if (response.data.state === 1) {
          this.doctorOptions = response.data.data.doctors;
          this.nurseOptions = response.data.data.nursers;
        }
      });
    },
    fetchAllAdminUsers() {
      fetchAllAdminUsers().then(response => {
        if (response.data.state === 1) {
          this.adminUserOptions = response.data.data.users;
        }
      });
    },

    printCard() {
      var ptime = Math.round(new Date().getTime() / 1000);
      this.print_time = uParseTime(ptime, "{y}年{m}月{d}日");

      const style =
        "@media print { .print_main_content { background-color: white; width:960px; margin:0 auto; padding: 0 0 20px 0; } .print_main_content .order_title { text-align: center; font-size: 23px; line-height: 50px; font-weight: 500; } .print_main_content table { width: 100%; border: 1px solid; border-collapse: collapse; padding: 2px; } .print_main_content table tbody tr td { border: 1px solid; text-align: center; padding: 10px 8px; } .td_proj_title { font-size: 18px; line-height: 25px; font-weight: 500; } .td_proj_content { font-size: 18px; line-height: 25px; } .td_align_left { text-align: left; } .print_footnote_panel { font-size: 17px; line-height: 40px; } .print_footnote_panel .proj { display: inline-block; width: 49%; } .print_footnote_panel .proj .proj_title { font-weight: 500;} }";

      setTimeout(() => {
        printJS({
          printable: "print-card-info",
          type: "html",
          style: style,
          scanStyles: false
        });
      }, 1);

      var patientID = this.patientPrint.id;
      var name = this.patientPrint.name;
      var gender = this.patientPrint.gender;
      if (gender === 1) {
        gender = "男";
      }
      if (gender === 2) {
        gender = "女";
      }
      var idCardNo = this.patientPrint.id_card_no;
      var dialysisNo = this.patientPrint.dialysis_no;
      var phone = this.patientPrint.phone;
      var healthCareNo = this.patientPrint.health_care_no;

      // Base64加密
      var epatientID = this.Base64.encode(patientID);
      var ename = this.Base64.encode(name);
      var egender = this.Base64.encode(gender);
      var eidCardNo = this.Base64.encode(idCardNo);
      var edialysisNo = this.Base64.encode(dialysisNo);
      var ephone = this.Base64.encode(phone);
      var eheathCareNo = this.Base64.encode(healthCareNo);
      console.log(
        "id号:" + epatientID,
        "姓名:" + ename,
        "性别:" + egender,
        "身份证:" + eidCardNo,
        "透析号:" + edialysisNo,
        "电话:" + ephone,
        "社保号:" + eheathCareNo
      );
      //  var params =new Object();
      //    params.id = this.patientPrint.id
      //    params.name =  this.patientPrint.name;
      // this.$options.methods.qrcode(epatientID, ename, egender, eidCardNo, edialysisNo, ephone, eheathCareNo)// 调用生成二维码的方法
      this.$options.methods.qrcode(
        patientID,
        name,
        gender,
        idCardNo,
        dialysisNo,
        phone,
        healthCareNo
      );
      // this.$options.methods.qrcode(params)
    },
    showInspectDialog() {
      this.dialogFormVisible = true;
    },

    qrcode(patientID, name, gender, idCardNo, dialysisNo, phone, healthCareNo) {
      document.getElementById("qrcode").innerHTML = "";
      new QRCode("qrcode", {
        width: 200,
        height: 200,
        text:
          "user_id:" +
          patientID +
          "," +
          "name:" +
          name +
          "," +
          "dialysis_no:" +
          dialysisNo +
          "," +
          "gender:" +
          gender +
          "," +
          "idcard_no:" +
          idCardNo +
          "," +
          "phone:" +
          phone +
          "," +
          "healthcare_no:" +
          healthCareNo
      });
    },
    checkIdCardNo() {
      if (!isCardNo(this.form.idCardNo)) {
        this.$message.error("身份证号码信息有误!");
        this.form.birth = "";
        return false;
      }
      var thisLen = this.form.idCardNo.length;
      var birth = "";
      if (thisLen == 15) {
        birth = "19" + this.form.idCardNo.substr(6, 6);
      } else {
        birth = this.form.idCardNo.substr(6, 8);
      }
      this.form.birth =
        birth.substr(0, 4) +
        "-" +
        birth.substr(4, 2) +
        "-" +
        birth.substr(6, 2);

      this.form.age = jsGetAge(this.form.birth, "-");
    }

    // qrcode(params){
    //    new QRCode('qrcode',{
    //        width:200,
    //        height:200,
    //        text:params,
    //    })
    // }
  }
};
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.uploadHead {
  margin-top: 25%;
}
.uploadHeadBtn {
  width: 148px;
  margin-top: 10px;
}
.el-form {
  .el-col-6,
  .el-col-8 {
    width: 360px;
    height: 59px !important;
  }
  .el-form-item {
    // margin-bottom: 17px !important;
    .el-select {
      width: 100%;
    }
    .el-date-editor.el-input {
      width: 100%;
    }
    .textarea {
      width: 100%;
      height: 70px;
      border-color: #dcdfe6;
      padding: 5px;
    }
  }
}

// #print-info-box .info_print {
//     width: 920px;
//     margin: 0 auto !important;
//     position: relative;
//     top: 0;
//     left: 0;
//     padding: 20px 30px;
// }
// #print-info-box .box-title {
//     text-align: center;
//     font-weight: 600;
//     font-size: 30px;
//     line-height: 80px;
//     margin-bottom: 20px;
// }

// #print-info-box .unit-title {
//     text-align: center;
//     line-height: 40px;
//     font-size: 20px;
//     font-weight: 400;
//     padding-top: 10px;
//     /* border: 1px solid #333; */
// }

// #print-info-box .unit-box {
//     padding: 15px;
// }

// #print-info-box .unit-box-item {
//     display: flex;
//     align-items: center;
//     justify-content: space-between;
//     padding: 4px 1em;
// }

// #print-info-box .unit-box-item-col3 {
//     width: 30%;
//     display: flex;
//     padding: 4px 0;
// }

// #print-info-box .unit-box-item-col4 {
//     width: 23%;
//     display: flex;
//     padding: 4px 0;
// }

// #print-info-box .item-value {
//     flex: 1;
//     border-bottom: 1px solid #333;
// }
</style>

<style scoped>
/* 打印表格的样式 */
.print_main_content {
  background-color: white;
  width: 960px;
  margin: 0 auto;
  padding: 0 0 20px 0;
}
.print_main_content .order_title {
  text-align: center;
  font-size: 23px;
  line-height: 50px;
  font-weight: 500;
}
.print_main_content table {
  width: 100%;
  border: 1px solid;
  border-collapse: collapse;
  padding: 2px;
}
.print_main_content table tbody tr td {
  border: 1px solid;
  text-align: center;
  /* font-size: 17px; */
  padding: 10px 8px;
}
.td_proj_title {
  font-size: 18px;
  line-height: 25px;
  font-weight: 500;
}
.td_proj_content {
  font-size: 18px;
  line-height: 25px;
}
.td_align_left {
  text-align: left;
}
.print_footnote_panel {
  font-size: 17px;
  line-height: 40px;
}
.print_footnote_panel .proj {
  display: inline-block;
  width: 49%;
}
.print_footnote_panel .proj .proj_title {
  font-weight: 500;
}
.el-select-dropdown {
  z-index: 998 !important;
}
</style>