elizebeth/src/xt_pages/outpatientCharges/statementTemplate/printFour.vue

<template>
  <div>
      <div v-if="paramsObj.balance_accounts_type != 2" id='prescription-print' class="prescription-print">
          <div v-for='(i,pageIndex) in pageArr.length' :key="pageIndex">
              <div class="printTitle">血液透析中心医药费收据及收费项目清单</div>
              <div class="infoMain">
                  <div class="infoP">医院(药店)编号：{{info.org_code}}</div>
                  <div class="infoP">名称：{{info.org_name}}</div>
                  <div class="infoP">医生工号：{{info.doctor_code}}</div>
                  <div class="infoP">门诊流水号：{{info.number}}</div>
                  <div class="infoP">科别: {{info.department}}</div>
                  <div class="infoP">处方单据号：{{info.order_number}}</div>
                  <div class="infoP">姓名：{{info.patient.name}}</div>
                  <div class="infoP">医疗账号：{{info.health_card_no}}</div>
                  <div class="infoP">医疗类别：</div>
              </div>
              <div class="chargeBox">
                  <div style="display:flex;justify-content: space-between;border-bottom:1px solid #000;">
                      <div class="chargeUl" style="width:20%;">
                          <p style="width:50%;border-right:1px solid #000;">费用类型</p>
                          <p style="width:50%;border-right:1px solid #000;">金额</p>
                      </div>
                      <div class="chargeUl" style="width:80%;">
                          <p style="width:40%;border-right:1px solid #000;">明细名称</p>
                          <p style="width:15%;border-right:1px solid #000;">规格</p>
                          <p style="width:15%;border-right:1px solid #000;">数量</p>
                          <p style="width:15%;border-right:1px solid #000;">单价</p>
                          <p style="width:15%;">金额</p>
                      </div>
                  </div>
                  <div style="display:flex;justify-content: space-between;">
                      <div style="width:20%;">
                          <div class="chargeUl" v-if="info.bed_cost_total > 0">
                              <p style="width:50%;">床位费</p>
                              <p style="width:50%;">{{info.bed_cost_total?info.bed_cost_total:0}}元</p>
                          </div>
                          <div class="chargeUl" v-if="info.operation_cost_total > 0">
                              <p style="width:50%;">手术费</p>
                              <p style="width:50%;">{{info.operation_cost_total?info.operation_cost_total:0}}元</p>
                          </div>
                          <div class="chargeUl" v-if="info.other_cost_total > 0">
                              <p style="width:50%;">其他费</p>
                              <p style="width:50%;">{{info.other_cost_total?info.other_cost_total:0}}元</p>
                          </div>
                          <div class="chargeUl" v-if="info.material_cost_total > 0">
                              <p style="width:50%;">材料费</p>
                              <p style="width:50%;">{{info.material_cost_total?info.material_cost_total:0}}元</p>
                          </div>
                          <div class="chargeUl" v-if="info.western_medicine_cost_total > 0">
                              <p style="width:50%;">西药费</p>
                              <p style="width:50%;">{{info.western_medicine_cost_total?info.western_medicine_cost_total:0}}元</p>
                          </div>
                          <div class="chargeUl" v-if="info.chinese_traditional_medicine_cost_total > 0">
                              <p style="width:50%;">中成费</p>
                              <p style="width:50%;">{{info.chinese_traditional_medicine_cost_total?info.chinese_traditional_medicine_cost_total:0}}元</p>
                          </div>
                          <div class="chargeUl" v-if="info.check_cost_total > 0">
                              <p style="width:50%;">检查费</p>
                              <p style="width:50%;">{{info.check_cost_total?info.check_cost_total:0}}元</p>
                          </div>
                          <div class="chargeUl" v-if="info.laboratory_cost_total > 0">
                              <p style="width:50%;">化验费</p>
                              <p style="width:50%;">{{info.laboratory_cost_total?info.laboratory_cost_total:0}}元</p>
                          </div>
                          <div class="chargeUl" v-if="info.treat_cost_total > 0">
                              <p style="width:50%;">治疗费</p>
                              <p style="width:50%;">{{info.treat_cost_total?info.treat_cost_total:0}}元</p>
                          </div>
                          <div class="chargeUl" style="border-top:1px solid #000;">
                              <p style="width:50%;">费用合计</p>
                              <p style="width:50%;">{{info.medfee_sumamt?info.medfee_sumamt:0}}元</p>
                          </div>
                          <div class="chargeUl" style="border-top:1px solid #000;">
                              <p style="width:50%;">记账支付</p>
                              <p style="width:50%;">{{info.hifp_pay?info.hifp_pay:0}}元</p>
                          </div>
                          <div class="chargeUl" style="border-top:1px solid #000;">
                              <p style="width:50%;">个人账号</p>
                              <p style="width:50%;">{{info.acct_pay?info.acct_pay:0}}元</p>
                          </div>
                          <div class="chargeUl" style="border-top:1px solid #000;border-bottom:1px solid #000;">
                              <p style="width:50%;">现金支付</p>
                              <p style="width:50%;">{{info.psn_pay?info.psn_pay:0}}元</p>
                          </div>
                      </div>
                      <div style="width:80%;max-height:500px;">
                          <div style="display:flex;" v-for="(item,i) in info.order_infos.slice(pageIndex * 13,(pageIndex * 13) + pageArr[pageIndex])" :key="i">
                              <div style="border-left:1px solid #000;border-right:1px solid #000;width:40%;text-align:center;">
                                  <p class="chargeP">
                                      <span v-if='item.type == 1'>{{item.advice.advice_name}}</span>
                                      <span v-if='item.project.type == 2'>{{item.project.project.project_name}}</span>
                                      <span v-if='item.project.type == 3'>{{item.project.good_info.specification_name}}</span>
                                  </p>
                              </div>
                              <div style="border-right:1px solid #000;width:15%;text-align:center;">
                                  <p class="chargeP">
                                      <span v-if='item.type == 1'>{{ item.advice.drug.dose + item.advice.drug.dose_unit + "*" +item.advice.drug.min_number + item.advice.drug.min_unit +"/" + item.advice.drug.max_unit}}</span>
                                      <span v-if='item.project.type == 2'>{{item.project.project.unit}}</span>
                                      <span v-if='item.project.type == 3'>{{item.project.unit}}</span>
                                  </p>
                              </div>
                              <div style="border-right:1px solid #000;width:15%;text-align:center;">
                                  <p class="chargeP">
                                    <span v-if='item.type == 1'>{{item.cnt}}{{item.advice.prescribing_number_unit}}</span>
                                    <span v-if='item.project.type == 2'>{{item.cnt}}{{item.project.project.unit}}</span>
                                    <span v-if='item.project.type == 3'>{{item.cnt}}{{item.project.unit}}</span>
                                  </p>
                              </div>
                              <div style="border-right:1px solid #000;width:15%;text-align:center;">
                                  <p class="chargeP">
                                      <span>{{item.pric}}元</span>
                                  </p>
                              </div>
                              <div style="width:15%;text-align:center;">
                                  <p class="chargeP">
                                      <span>{{(item.cnt * item.pric).toFixed(2)}}元</span>
                                  </p>
                              </div>
                          </div>
                      </div>
                  </div>

              </div>
              <div class="moneyBox">
                  <p>实收金：{{info.medfee_sumamt?info.medfee_sumamt:0}}元</p>
                  <p>记账前金额：{{0.00}}元</p>
                  <p>扣款金额：{{0.00}}元</p>
                  <p>记账后金额：{{info.balc}}元</p>
                  <p>找赎金：{{0.00}}元</p>
              </div>
              <div class="actionBar">
                  <div>收费员：{{info.charge_admin.user_name}}</div>
                  <div>日期：{{info.setl_time ? info.setl_time.split(' ')[0] : ''}}</div>
              </div>
          </div>

      </div>
      <div v-else id='prescription-print' class="prescription-print">
        <div v-for='(i,pageIndex) in pageArr.length' :key="pageIndex">
            <div class="printTitle">血液透析中心医药费收据及收费项目清单</div>
            <div class="infoMain">
                <div class="infoP">医院(药店)编号：{{balanceAccounts.org_config.code}}</div>
                <div class="infoP">名称：{{balanceAccounts.org_config.org_name}}</div>
                <div class="infoP">医生工号：</div>
                <div class="infoP">门诊流水号：{{balanceAccounts.his.number ? balanceAccounts.his.number : ''}}</div>
                <div class="infoP">科别: {{balanceAccounts.order.department_name ? balanceAccounts.order.department_name : ''}}</div>
                <div class="infoP">处方单据号：{{balanceAccounts.order.number ? balanceAccounts.order.number : ''}}</div>
                <div class="infoP">姓名：{{balanceAccounts.patient ? balanceAccounts.patient.name : ''}}</div>
                <div class="infoP">医疗账号：</div>
                <div class="infoP">医疗类别：自费</div>
            </div>
            <div class="chargeBox">
                <div style="display:flex;justify-content: space-between;border-bottom:1px solid #000;">
                    <div class="chargeUl" style="width:20%;">
                        <p style="width:50%;border-right:1px solid #000;">费用类型</p>
                        <p style="width:50%;border-right:1px solid #000;">金额</p>
                    </div>
                    <div class="chargeUl" style="width:80%;">
                        <p style="width:40%;border-right:1px solid #000;">明细名称</p>
                        <p style="width:15%;border-right:1px solid #000;">规格</p>
                        <p style="width:15%;border-right:1px solid #000;">数量</p>
                        <p style="width:15%;border-right:1px solid #000;">单价</p>
                        <p style="width:15%;">金额</p>
                    </div>
                </div>
                <div style="display:flex;justify-content: space-between;">
                    <div style="width:20%;">
                        <div class="chargeUl" v-for="(item,i) in balanceAccounts.new_detail_list" :key="i">
                            <p style="width:50%;">
                              <span v-if="item.type == 1">药品费</span>
                              <span v-if="item.type == 2">治疗费</span>
                              <span v-if="item.type == 3">耗材费</span>
                            </p>
                            <p style="width:50%;">{{item.total?item.total:0}}元</p>
                        </div>
                        <div class="chargeUl" style="border-top:1px solid #000;">
                            <p style="width:50%;">费用合计</p>
                            <p style="width:50%;">{{balanceAccounts.order.medfee_sumamt?balanceAccounts.order.medfee_sumamt:0}}元</p>
                        </div>
                        <div class="chargeUl" style="border-top:1px solid #000;">
                            <p style="width:50%;">记账支付</p>
                            <p style="width:50%;">0元</p>
                        </div>
                        <div class="chargeUl" style="border-top:1px solid #000;">
                            <p style="width:50%;">个人账号</p>
                            <p style="width:50%;">0元</p>
                        </div>
                        <div class="chargeUl" style="border-top:1px solid #000;border-bottom:1px solid #000;">
                            <p style="width:50%;">现金支付</p>
                            <p style="width:50%;">{{balanceAccounts.order.medfee_sumamt?balanceAccounts.order.medfee_sumamt:0}}元</p>
                        </div>
                    </div>
                    <div style="width:80%;max-height:500px;">
                        <div style="display:flex;" v-for="(item,i) in balanceAccounts.order_info.slice(pageIndex * 13,(pageIndex * 13) + pageArr[pageIndex])" :key="i">
                            <div style="border-left:1px solid #000;border-right:1px solid #000;width:40%;text-align:center;">
                                <p class="chargeP">
                                    <span v-if='item.advice_id > 0'>{{item.advice.advice_name}}</span>
                                    <span v-if='item.project.type == 2'>{{item.project.project.project_name}}</span>
                                    <span v-if='item.project.type == 3'>{{item.project.good_info.specification_name}}</span>
                                </p>
                            </div>
                            <div style="border-right:1px solid #000;width:15%;text-align:center;">
                                <p class="chargeP">
                                    <span v-if='item.advice_id > 0'>{{ item.advice.drug.dose + item.advice.drug.dose_unit + "*" +item.advice.drug.min_number + item.advice.drug.min_unit +"/" + item.advice.drug.max_unit}}</span>
                                    <span v-if='item.project.type == 2'>{{item.project.project.unit}}</span>
                                    <span v-if='item.project.type == 3'>{{item.project.unit}}</span>
                                </p>
                            </div>
                            <div style="border-right:1px solid #000;width:15%;text-align:center;">
                                <p class="chargeP">
                                    <span>{{item.cnt}}次</span>
                                </p>
                            </div>
                            <div style="border-right:1px solid #000;width:15%;text-align:center;">
                                <p class="chargeP">
                                    <span>{{item.pric}}元</span>
                                </p>
                            </div>
                            <div style="width:15%;text-align:center;">
                                <p class="chargeP">
                                    <span>{{(item.cnt * item.pric).toFixed(2)}}元</span>
                                </p>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
            <div class="moneyBox">
                <p>实收金：{{balanceAccounts.order.medfee_sumamt?balanceAccounts.order.medfee_sumamt:0}}元</p>
                <p>记账前金额：{{0.00}}元</p>
                <p>扣款金额：{{0.00}}元</p>
                <p>记账后金额：{{0.00}}元</p>
                <p>找赎金：{{0.00}}元</p>
            </div>
            <div class="actionBar">
                <div>收费员：{{balanceAccounts.current_admin.user_name}}</div>
                <div>日期：{{getTime(balanceAccounts.order.settle_accounts_date,"{y}-{m}-{d}")?getTime(balanceAccounts.order.settle_accounts_date,"{y}-{m}-{d}"):""}}</div>
            </div>
        </div>

      </div>
  </div>

</template>
<script>
import axios from 'axios'
import { getChargePrint } from '@/api/project/project'
import { uParseTime } from '@/utils/tools'

export default {
  data() {
    return {
      list: {},
      prescription: [],
      patient: {},
      orgname: '',

      result: {},
      org_code: '',
      patient_name: '',
      doctor_code: '',
      doctor_name: '',

      name_arr: [],
      spec_arr: [],
      count_arr: [],
      price_arr: [],
      total_arr: [],

      page:1,
      pageArr:[],

    }
  },
  props: {
    paramsObj: Object,
    info: Object,
    balanceAccounts:Object
  },
  methods: {
    getItemName(number) {
      switch (number) {
        case '01':
          return '床位费'
          break
        case '02':
          return '西药费'

          break
        case '03':
          return '中药费'

          break
        case '04':
          return '中成药费'

          break
        case '05':
          return '中草药费'

          break
        case '06':
          return '检查费'

          break
        case '07':
          return '治疗费'

          break
        case '08':
          return '放射费'

          break
        case '09':
          return '手术费'

          break
        case '10':
          return '化验费'

          break
        case '11':
          return '输血费'

          break
        case '12':
          return '输氧费'

          break
        case '13':
          return '其它费'

          break
        case '14':
          return '麻醉费'

          break
        case '15':
          return '材料费'

          break
        case '16':
          return '特殊检查费'

          break
        case '17':
          return '特殊治疗费'

          break
        case '18':
          return '诊疗费(诊查费)'

          break
        case '19':
          return '护理费'

          break
        case '20':
          return '诊金'

          break
        case '21':
          return '检查费（CT）'

          break
        case '22':
          return '检查费（MRT）'

          break
        case '23':
          return '检查费（其他）'

          break
        case '24':
          return '特需服务费'

          break
        case '25':
          return '杂费'

          break
        case '26':
          return '挂号费'
          break

      }

    },
    getPage(){
      if(this.paramsObj.balance_accounts_type != 2){
        this.page = 1
        this.pageArr = []
        if(this.info.order_infos.length <= 13){
            this.page = 1
            this.pageArr.push(this.info.order_infos.length)
            console.log('this.pageArr',this.pageArr)
        }else if(this.info.order_infos.length > 13){
            this.page = parseInt(this.info.order_infos.length / 13)
            let num = this.info.order_infos.length % 13
            for (var i=0;i<this.page;i++){
                this.pageArr.push(13)
            }
            if(num != 0){
                this.pageArr.push(num)
            }
        }
      }else{
        this.page = 1
        this.pageArr = []
        if(this.balanceAccounts.order_info.length <= 13){
            this.page = 1
            this.pageArr.push(this.balanceAccounts.order_info.length)
            console.log('this.pageArr',this.pageArr)
        }else if(this.balanceAccounts.order_info.length > 13){
            this.page = parseInt(this.balanceAccounts.order_info.length / 13)
            let num = this.balanceAccounts.order_info.length % 13
            for (var i=0;i<this.page;i++){
                this.pageArr.push(13)
            }
            if(num != 0){
                this.pageArr.push(num)
            }
        }
      }

    },
    getTime(value, temp) {
      if (value != undefined) {
        return uParseTime(value, temp)
      }
      return ''
    }
  },
  created() {


  },
  watch:{
    info: {
      handler(newVal) {
          this.getPage()
      },
      deep: true,
    },
    balanceAccounts(){
      this.getPage()
    },
    deep: true
  }

}
</script>


<style lang="scss" scoped>
  .prescription-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;
  }

  .printTitle {
      font-size: 22px;
      text-align: center;
      font-weight: bold;
  }

  .infoMain {
      display: flex;
      flex-wrap: wrap;
      padding: 0 10px;
      margin-top: 10px;
  }

  .infoMain .infoP {
      width: 33%;
      line-height: 24px;
  }

  .chargeBox {
      border: 1px solid #000;
  }

  .chargeUl {
      display: flex;
      justify-content: space-between;
      text-align: center;
  }

  .chargeUl p {
      height: 40px;
      line-height: 40px;
  }

  .chargeP {
      height: 40px;
      line-height: 40px;
  }

  .moneyBox {
      display: flex;
      justify-content: space-between;
      padding: 0 10px;
      background: #eee;
      height: 40px;
      align-items: center;
      border: 1px solid #000;
      border-top: none
  }

  .actionBar {
      display: flex;
      justify-content: space-between;
      line-height: 24px;
      padding: 0 10px;
  }

  .actionBar div {
      width: 150px;
  }
</style>