<template>
  <div id="statement-print" class="statement-print">
    <div class="statementTitle" style="margin-top:20px;" v-if="info.insutype == '310'">医保费用明细清单</div>
    <div class="statementTitle" style="margin-top:20px;" v-if="info.insutype == '390'">医保费用明细清单</div>

    <div style="display:flex">
      <div style="width:70%">医疗机构名称：{{info.fixmedins_name}}</div>
      <div style="width:30%" v-if="info.hosp_lv == '1'">医院等级：三级特等</div>
      <div style="width:30%" v-if="info.hosp_lv == '2'">医院等级：三级甲等</div>
      <div style="width:30%" v-if="info.hosp_lv == '3'">医院等级：三级乙等</div>
      <div style="width:30%" v-if="info.hosp_lv == '4'">医院等级：三级丙等</div>
      <div style="width:30%" v-if="info.hosp_lv == '5'">医院等级：二级甲等</div>
      <div style="width:30%" v-if="info.hosp_lv == '6'">医院等级：二级乙等</div>
      <div style="width:30%" v-if="info.hosp_lv == '7'">医院等级：二级丙等</div>
      <div style="width:30%" v-if="info.hosp_lv == '8'">医院等级：一级甲等</div>
      <div style="width:30%" v-if="info.hosp_lv == '9'">医院等级：一级乙等</div>
      <div style="width:30%" v-if="info.hosp_lv == '10'">医院等级：一级丙等</div>
      <div style="width:30%" v-if="info.hosp_lv == '11'">医院等级：无等级</div>

    </div>
    <div style="display:flex;justify-content: space-between;border-bottom:1px solid #000;padding-bottom:10px;">
      <div style="flex:1;">单据编码：{{order_infos.number}}</div>
      <div style="width:33%">就诊时间：{{getTime(order_infos.date)}}</div>
      <div>金额单位：元</div>
    </div>
    <div style="display:flex">
      <div style="width:50%">姓名：{{info.psn_name}}</div>
      <div style="width:50%">个人电脑号：{{info.psn_no}}</div>
    </div>
    <div style="display:flex">
      <div style="width:50%">社保卡号</div>
      <div style="width:50%">诊断：慢性肾脏病5期</div>
    </div>
    <div style="display:flex">
      <div style="width:50%" v-if="info.psn_type == '11'">人员类别:在职</div>
      <div style="width:50%" v-if="info.psn_type == '1101'">人员类别:职工在职</div>
      <div style="width:50%" v-if="info.psn_type == '1102'">人员类别:公务员在职</div>
      <div style="width:50%" v-if="info.psn_type == '1103'">人员类别:灵活就业人员在职</div>
      <div style="width:50%" v-if="info.psn_type == '1160'">人员类别:地方其他扩展人员</div>
      <div style="width:50%" v-if="info.psn_type == '12'">人员类别:退休人员</div>
      <div style="width:50%" v-if="info.psn_type == '1201'">人员类别:职工退休</div>
      <div style="width:50%" v-if="info.psn_type == '1202'">人员类别:公务员退休</div>
      <div style="width:50%" v-if="info.psn_type == '1203'">人员类别:灵活就业人员退休</div>
      <div style="width:50%" v-if="info.psn_type == '1260'">人员类别:地方其他扩展人员</div>
      <div style="width:50%" v-if="info.psn_type == '13'">人员类别:离休</div>
      <div style="width:50%" v-if="info.psn_type == '1300'">人员类别:离休人员</div>
      <div style="width:50%" v-if="info.psn_type == '1360'">人员类别:地方其他扩展人员</div>
      <div style="width:50%" v-if="info.psn_type == '14'">人员类别:居民(未成年)</div>
      <div style="width:50%" v-if="info.psn_type == '1401'">人员类别:新生儿</div>
      <div style="width:50%" v-if="info.psn_type == '1402'">人员类别:学龄前儿童</div>
      <div style="width:50%" v-if="info.psn_type == '1403'">人员类别:中小学生</div>
      <div style="width:50%" v-if="info.psn_type == '1404'">人员类别:大学生</div>
      <div style="width:50%" v-if="info.psn_type == '1405'">人员类别:未成年(未入学)</div>
      <div style="width:50%" v-if="info.psn_type == '15'">人员类别:居民(成年)</div>
      <div style="width:50%" v-if="info.psn_type == '1501'">人员类别:普通居民(成年)</div>
      <div style="width:50%" v-if="info.psn_type == '1560'">人员类别:地方其他扩展身份</div>
      <div style="width:50%" v-if="info.psn_type == '16'">人员类别:居民(老年)</div>


      <div style="width:50%">待遇类别：</div>
    </div>
    <div style="display:flex;padding:10px 0;border-top:1px solid #000;border-bottom:1px solid #000;">
      <div style="width:50%;text-align:center;">项目名称</div>
      <div style="width:10%;text-align:center;">单价</div>
      <div style="width:10%;text-align:center;">数量</div>
      <div style="width:10%;text-align:center;">金额</div>
      <div style="width:10%;text-align:center;">门诊目录</div>
      <div style="width:10%;text-align:center;">医保目录</div>
    </div>
    <div style="border-bottom:1px solid #000;padding:10px 0;display:flex;" v-for="(item,index) in order_infos.order_infos"
         :key="index">
      <div style="width:50%;text-align:center;" v-if="item.advice_id > 0">{{item.advice.drug.drug_name}}</div>
      <div style="width:50%;text-align:center;" v-if="item.project_id > 0">{{item.project.project.project_name}}</div>

      <div style="width:10%;text-align:center;">{{item.pric}}</div>
      <div style="width:10%;text-align:center;">{{item.cnt}}</div>
      <div style="width:10%;text-align:center;">{{item.det_item_fee_sumamt}}</div>
      <div style="width:10%;text-align:center;">是</div>
      <div style="width:10%;text-align:center;">是</div>
    </div>
    <div style="display:flex;border-bottom:1px solid #000;padding:20px 0 10px;">
      <div style="width:70%;">合计：</div>
      <div style="width:10%;text-align:center;">{{info.medfee_sumamt}}</div>
      <div style="width:20%;"></div>
    </div>
    <div>医保基金支付金额：{{info.fund_pay_sumamt?info.fund_pay_sumamt:''}}</div>
    <div>个人现金支付金额：{{info.psn_pay?info.psn_pay:''}}</div>
    <div>其中</div>
    <div style="display:flex;border-bottom:1px solid #000;padding-bottom:10px;">
      <div>个人自付：</div>
      <div>其中：1.乙类自付 {{info.preselfpay_amt?info.preselfpay_amt:''}}</div>
      <div style="margin-left:20px;">2.自费 {{info.overlmt_selfpay?info.overlmt_selfpay:''}}</div>
    </div>
    <div style="display:flex;padding-top:10px;">
      <div style="width:33%">参保人签名：</div>
      <div style="width:33%">审核人：</div>
      <div style="width:33%">医院盖章：</div>
    </div>

  </div>
</template>
<script>
  import {uParseTime} from '@/utils/tools'
  export default {
    props: {
      info: {
        type: Object,
        default: function () {
          return {}
        }
      }, 
      order_infos: {
        type: Object,
        default: function () {
          return {}
        }
      }, 
      p_admin: {
        type: Object,
        default: function () {
          return {}
        }
      }, charge_admin: {
        type: Object,
        default: function () {
          return {}
        }
      }
    }, methods: {
      getTime(val) {
        if (val < 0) {
          return ""
        }
        if (val == "") {
          return ""
        } else {
          return uParseTime(val, '{y}-{m}-{d}')
        }
      },
        getNowTime: function () {
          let dateTime
          let yy = new Date().getFullYear()
          let mm = new Date().getMonth() + 1
          let dd = new Date().getDate()
          let hh = new Date().getHours()
          let mf = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes()
            :
            new Date().getMinutes()
          let ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds()
            :
            new Date().getSeconds()
          dateTime = yy + '-' + mm + '-' + dd + ' ' + hh + ':' + mf + ':' + ss
          return dateTime
        }
      ,

      }
    }


</script>


<style lang="scss" scoped>
  #statement-print{
    width: 600px;
    margin: 0 auto;
  }
  .statement-print {
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 60px rgba(0, 0, 0, 0.06) inset;
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset;
    margin-bottom: 20px;
    padding: 20px 10px;
  }

  .statementTitle {
    font-size: 22px;
    text-align: center;
    margin-bottom: 10px;
  }

  .statementTable {
    width: 100%;
    text-align: center;
    border-collapse: collapse;
    line-height: 40px;
    font-size: 14px;
    border-color: #000;
  }
</style>
