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

        <div style="display:flex">
            <div style="width:70%">医疗机构名称：{{info.org_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;">单据编码：{{info.number}}</div>
            <div style="width:33%">就诊时间：{{getTime(info.date)}}</div>
            <div>金额单位：元</div>
        </div>
        <div style="display:flex">
            <div style="width:50%">姓名：{{info.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:20%;text-align:center;">医保编码</div>
            <div style="width:20%;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 style="width:10%;text-align:center;">自费比例</div>
        </div>
        <div v-for="(newItem,index) in Object.keys(obj)" :key="index">
            <div v-if="Object.values(obj)[index].length > 0"  style="border-bottom:1px solid #000;padding:10px 0;">
                <span v-if="Object.keys(obj)[index] == 'med_chrgitm_type01'">床位费<span>小记：{{ price01 }}</span></span>
                <span v-if="Object.keys(obj)[index] == 'med_chrgitm_type03'">检查费<span>小记：{{ price03 }}</span></span>
                <span v-if="Object.keys(obj)[index] == 'med_chrgitm_type04'">化验费<span>小记：{{ price04 }}</span></span>
                <span v-if="Object.keys(obj)[index] == 'med_chrgitm_type05'">治疗费<span>小记：{{ price05 }}</span></span>
                <span v-if="Object.keys(obj)[index] == 'med_chrgitm_type06'">手术费<span>小记：{{ price06 }}</span></span>
                <span v-if="Object.keys(obj)[index] == 'med_chrgitm_type08'">材料费<span>小记：{{ price08 }}</span></span>
                <span v-if="Object.keys(obj)[index] == 'med_chrgitm_type09'">西药费<span>小记：{{ price09 }}</span></span>
                <span v-if="Object.keys(obj)[index] == 'med_chrgitm_type11'">中成费<span>小记：{{ price11 }}</span></span>
                <span v-if="Object.keys(obj)[index] == 'med_chrgitm_type14'">其他费<span>小记：{{ price14 }}</span></span>
            </div>
            <div>
                <div v-if="Object.values(obj)[index].length > 0" v-for="(item,itemIndex) in Object.values(obj)[index]" :key="itemIndex" style="border-bottom:1px solid #000;padding:10px 0;display:flex;" >
                    <div style="width:20%;text-align:center;" v-if="item.advice_id > 0">{{ item.advice.drug.medical_insurance_number }}</div>
                    <div style="width:20%;text-align:center;" v-if="item.project_id > 0">{{item.project.type == 2?item.project.project.medical_code: item.project.good_info.medical_insurance_number}}</div>
                    <div style="width:20%;text-align:center;" v-if="item.advice_id > 0">{{item.advice.drug.drug_name}}</div>
                    <div style="width:20%;text-align:center;" v-if="item.project_id > 0">{{item.project.type == 2?item.project.project.project_name:item.project.good_info.good_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;">{{item.preselfpay_amt}}</div>
                    <div style="width:10%;text-align:center;">{{item.fulamt_ownpay_amt}}</div>
                    <div style="width:10%;text-align:center;">{{item.selfpay_prop}}</div>
                </div>
            </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>医保基金支付金额：{{''}}</div>
        <div>个人现金支付金额：{{info.medfee_sumamt}}</div>
        <div>其中</div>
        <div style="display:flex;border-bottom:1px solid #000;padding-bottom:10px;">
            <div>个人自付：</div>
            <div>其中：1.乙类自付 {{''}}</div>
            <div style="margin-left:20px;">2.自费 {{info.medfee_sumamt}}</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>
    <!-- <div>
        123
    <div v-for='(item,index) in Object.values(obj)' :key="index">
        <div>{{Object.keys(obj)[index]}}</div>
        <div v-for="it in Object.values(obj)[index]">{{ it.name }}</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 {}
        }
      }
    },
    data(){
      return{
        obj:{},
        price01: 0,
        price03: 0,
        price04: 0,
        price05: 0,
        price06: 0,
        price08: 0,
        price09: 0,
        price11: 0,
        price14: 0,
      }
    },
    created(){
      // let obj = {
      //     med_chrgitm_type01:[{name:1,age:2},{name:'张三',age:41}],
      //     med_chrgitm_type03:[{name:3,age:4}],
      //     med_chrgitm_type04:[{name:5,age:6}],
      // }
      // this.obj = obj
      // console.log(1111,Object.values(obj))
      // obj.map(item => {
      //     console.log(111,item)


      // })
    },
    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
      },

    },
    watch:{
      "order_infos.order_infos":{
        handler(newVal){
          let obj = {
            'med_chrgitm_type01':[],
            'med_chrgitm_type03':[],
            'med_chrgitm_type04':[],
            'med_chrgitm_type05':[],
            'med_chrgitm_type06':[],
            'med_chrgitm_type08':[],
            'med_chrgitm_type09':[],
            'med_chrgitm_type11':[],
            'med_chrgitm_type14':[],
          }

          newVal.map(item => {

            if(item.med_chrgitm_type == '01'){
              obj.med_chrgitm_type01.push(item)
              this.price01 += item.det_item_fee_sumamt
            }else if(item.med_chrgitm_type == '03'){
              obj.med_chrgitm_type03.push(item)
              this.price03 += item.det_item_fee_sumamt
            }else if(item.med_chrgitm_type == '04'){
              obj.med_chrgitm_type04.push(item)
              this.price04 += item.det_item_fee_sumamt
            }else if(item.med_chrgitm_type == '05'){
              obj.med_chrgitm_type05.push(item)
              this.price05 += item.det_item_fee_sumamt
            }else if(item.med_chrgitm_type == '06'){
              obj.med_chrgitm_type06.push(item)
              this.price06 += item.det_item_fee_sumamt
            }else if(item.med_chrgitm_type == '08'){
              obj.med_chrgitm_type08.push(item)
              this.price08 += item.det_item_fee_sumamt
            }else if(item.med_chrgitm_type == '09'){
              obj.med_chrgitm_type09.push(item)
              this.price09 += item.det_item_fee_sumamt
            }else if(item.med_chrgitm_type == '11'){
              obj.med_chrgitm_type11.push(item)
              this.price11 += item.det_item_fee_sumamt
            }else if(item.med_chrgitm_type == '14'){
              obj.med_chrgitm_type14.push(item)
              this.price14 += item.det_item_fee_sumamt
            }

          })
          this.obj = obj
          console.log('this.obj',this.obj)
        },
        deep:true
      }
    }
  }



</script>


<style lang="scss" scoped>
    #statement-print{
        width: 800px;
        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>
