<template>
   <div class="">
    
    <div class="info ">
        <el-form label-width="95px" label-position="left" >
            <el-row>
                <el-col :span="24" align="center" :class="avatar">
                    <img width="100%" height="100%"  :src="patient.avatar" class="avatar" @click="avatarDialogVisible=true">
                    <div><span @click="avatarDialogVisible=true">点击看大图</span></div>
                </el-col>
                <el-dialog :visible.sync="avatarDialogVisible">
                    <img width="100%" :src="patient.avatar" alt="">
                </el-dialog>
            </el-row>
            <div class="dataTitle">一般资料</div>
            <el-row >
                <el-col :span="24">
                    <el-row >
                        <el-col :span="8" >
                            <el-form-item label="姓名:">
                            <span>{{patient.name}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="别名:">
                            <span>{{patient.alias}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="身份证号:">
                            <span>{{patient.id_card_no}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="透析号:">
                            <span>{{patient.dialysis_no}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="性别:">
                            <span>{{patient.gender}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="出生日期:">
                            <span>{{patient.birthday}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="身高(cm):">
                            <span>{{patient.height}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="婚姻状况:">
                            <span>{{patient.marital_status}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="子女情况:">
                            <span>{{patient.children}} 孩</span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="住院(门诊)号:">
                            <span>{{patient.admission_number}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="医保类型:">
                            <span>{{patient.reimbursement_way_id}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="医保号:">
                            <span>{{patient.health_care_no}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="本人电话:">
                            <span>{{patient.phone}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="家属电话:">
                            <span>{{patient.home_telephone}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="亲友电话:">
                            <span>{{patient.relative_phone}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="亲友关系:">
                            <span>{{patient.relative_relations}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="24" >
                            <el-form-item label="家庭住址:" >
                                <span>{{patient.home_address}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="24" >
                            <el-form-item label="工作单位:" >
                                <span>{{patient.work_unit}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="24" >
                            <el-form-item label="单位地址:" >
                                <span>{{patient.unit_address}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="职业:">
                            <span>{{patient.profession}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="教育程度:">
                            <span>{{patient.education_level}} </span>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8" >
                            <el-form-item label="患者来源:">
                            <span>{{patient.source}} </span>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-col>
            </el-row>
        </el-form>
        <el-form label-width="115px" label-position="left" >
            
            <div class="dataTitle">治疗信息</div>
            <el-row>
                <el-col :span="8" >
                    <el-form-item label="本院首次透析:"  >
                    <span>{{patient.is_hospital_first_dialysis}} </span>
                    </el-form-item>
                </el-col>
                <el-col :span="8" >
                    <el-form-item label="首次透析日期:"  >
                    <span>{{patient.first_dialysis_date}} </span>
                    </el-form-item>
                </el-col>
                <el-col :span="8" >
                    <el-form-item label="首次透析医院:"  >
                    <span>{{patient.first_dialysis_hospital}} </span>
                    </el-form-item>
                </el-col>
                <el-col :span="8" >
                    <el-form-item label="透析之前情况:"  >
                    <span>{{patient.predialysis_condition}} </span>
                    </el-form-item>
                </el-col>
                <el-col :span="8" >
                    <el-form-item label="本院前透析频率:"  >
                    <span>{{patient.pre_hospital_dialysis_frequency}} </span>
                    </el-form-item>
                </el-col>
                <el-col :span="8" >
                    <el-form-item label="本院前透析次数:"  >
                    <span>{{patient.pre_hospital_dialysis_times}} </span>
                    </el-form-item>
                </el-col>
                <el-col :span="8" >
                    <el-form-item label="本院首次透析:"  >
                    <span>{{patient.hospital_first_dialysis_date}} </span>
                    </el-form-item>
                </el-col>
                <el-col :span="24" >
                    <el-form-item label="传染病:"  >
                    <span>{{patient.contagions}} </span>
                    </el-form-item>
                </el-col>
                <el-col :span="24" >
                    <el-form-item label="慢性病:"  >
                    <span>{{patient.diseases}} </span>
                    </el-form-item>
                </el-col>
                <el-col :span="24" >
                    <el-form-item label="备注:"  >
                    <span>{{patient.remark}} </span>
                    </el-form-item>
                </el-col>
                <el-col :span="24" >
                    <el-form-item label="登记人员:"  >
                    <span>{{patient.registrars}} </span>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
    </div>
  </div>
</template>

<script>
import {parseTime} from "@/utils"
import {GetPatientInfoWithDiseases} from "@/api/patient";
import { Toast  } from 'vant';

export default {
  name: "patientInfo",
  data() {
    return {
        avatarDialogVisible:false,
        avatar:"avatarbox",
        maritalOptions: [],
        wayOptions:[],
        professionOptions:[],
        educationOptions:[],
        checkDisease: [],
        contagionList: [],
        patient: {
            contagions:[],
            diseases:[],
        },
        device_number: {
            number: "",
        }
    }
  },
  methods: {
    setPatientInfo(patient, device_number_name) {
        this.initData();
        if (typeof(patient.id != 'undefined') && patient.id>0) {
            this.GetPatientInfoWithDiseases(patient.id);
        }
    },
    GetPatientInfoWithDiseases(id) {
        GetPatientInfoWithDiseases(id).then(response=>{
            if (response.data.state==1) {
                this.patient = response.data.data.patient;
                this.patient.gender = this.patient.gender==1?'男':(this.patient.gender==2?'女':"未知");
                this.patient.birthday = parseTime(this.patient.birthday, "{y}/{m}/{d}")

                var maritalStatus = this.patient.marital_status;
                this.patient.marital_status = "未填";
                var mLen = this.maritalOptions.length;
                if (maritalStatus > 0) {
                    for (let index = 0; index < mLen; index++) {
                        if (maritalStatus == this.maritalOptions[index].id) {
                            this.patient.marital_status = this.maritalOptions[index].name;
                            break;
                        }
                    }
                }

                var reimbursementWayId = this.patient.reimbursement_way_id;
                this.patient.reimbursement_way_id = "未填";
                var wLen = this.wayOptions.length;
                if (reimbursementWayId > 0) {
                    for (let index = 0; index < wLen; index++) {
                        if (reimbursementWayId == this.wayOptions[index].id) {
                            this.patient.reimbursement_way_id = this.wayOptions[index].name;
                            break;
                        }
                    }
                }

                var profession = this.patient.profession;
                this.patient.profession = "未填";
                var pLen = this.professionOptions.length;
                if (profession > 0) {
                    for (let index = 0; index < pLen; index++) {
                        if (profession == this.professionOptions[index].id) {
                            this.patient.profession = this.professionOptions[index].name;
                            break;
                        }
                    }
                }

                var educationLevel = this.patient.education_level;
                this.patient.education_level = "未填";
                var eLen = this.educationOptions.length;
                if (educationLevel > 0) {
                    for (let index = 0; index < eLen; index++) {
                        if (educationLevel == this.educationOptions[index].id) {
                            this.patient.education_level = this.educationOptions[index].name;
                            break;
                        }
                    }
                }

                this.patient.is_hospital_first_dialysis = this.patient.is_hospital_first_dialysis==1?'是':(this.patient.is_hospital_first_dialysis==2?'否':"未填");

                if (this.patient.first_dialysis_date!=0) {
                    this.patient.first_dialysis_date = parseTime(this.patient.first_dialysis_date, "{y}/{m}/{d}")
                }else {
                    this.patient.first_dialysis_date = "";
                }
                
                if (this.patient.hospital_first_dialysis_date!=0) {
                    this.patient.hospital_first_dialysis_date = parseTime(this.patient.hospital_first_dialysis_date, "{y}/{m}/{d}")
                }else {
                    this.patient.hospital_first_dialysis_date = "";
                }
                
                var contagions = {};
                var contagionsName = [];
                if (this.patient.contagions.length > 0) {
                    var clen = this.patient.contagions.length;
                    for (let index = 0; index < clen; index++) {
                        contagions[this.patient.contagions[index].disease_id] = this.patient.contagions[index].disease_id;
                    }

                    var cLen = this.contagionList.length;
                    for (let index = 0; index < cLen; index++) {
                        if (this.contagionList[index].id in contagions) {
                            contagionsName.push(this.contagionList[index].name);
                        }
                    }
                    this.patient.contagions = contagionsName.join("、");
                }

                var diseases = {};
                var diseasesName = [];
                if (this.patient.diseases.length > 0) {
                    var dlen = this.patient.diseases.length;
                    for (let index = 0; index < dlen; index++) {
                        diseases[this.patient.diseases[index].disease_id] = this.patient.diseases[index].disease_id;
                    }

                    var cLen = this.checkDisease.length;
                    for (let index = 0; index < cLen; index++) {
                        if (this.checkDisease[index].id in diseases) {
                            diseasesName.push(this.checkDisease[index].name);
                        }
                    }
                    this.patient.diseases = diseasesName.join("、");
                }else {
                    this.patient.diseases = '';
                }


                this.patient.source = this.patient.source == 1 ? "门诊" : "住院"

            }else {
                Toast.fail("网络异常");
                return false;
            }
        }).catch(() => {
        // on cancel
            Toast.fail("网络异常");
            return false;
      });
    },
    initData(){
        this.maritalOptions = this.$store.getters.marital_options;
        this.wayOptions = this.$store.getters.reimbursement_ways;
        this.professionOptions = this.$store.getters.profession_options;
        this.educationOptions = this.$store.getters.education_types;
        this.contagionList = this.$store.getters.contagions;
        this.checkDisease = this.$store.getters.disease;
    }
  },
};
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.info {
  background: #fff;
  border-top: 1px #ebf1f7 solid;
  padding: 0.25rem 0.28rem;
  font-size: 14px;
  font-weight: 400;
  margin: 0 0.2rem;
  
  .dataTitle{
        color: #409eff;
        font-size: 16px;
        border-bottom: 1px #409eff solid;
        height: 36px;
        line-height: 30px;
        margin: 0 0 15px 0;
        padding: 0 0 6px 15px;
    }

  .avatarbox{
      height: 180px;
  }
  .avatarbox img{
      height: 150px;
      width: 150px;
      border: 1px #ebf1f7 solid;
  }
  .el-form-item {
    margin-bottom: 0
   }
    
}
</style>

