elizebeth/src/xt_pages/outpatientCharges/listTemplate/printTwo.vue

<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.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: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>医保基金支付金额：{{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>
    <!-- <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' || item.med_chrgitm_type == '02' ){
                        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>