Vue_New/src/xt_pages/outpatientTool/detailPrint.vue

<template>
  <div>
    <div class="print_btn">
      <el-button type="primary" @click="printtpage">打印</el-button>
    </div>
    <div id="list-print" class="list-print">
      <div class="listTitle">
        {{ $store.getters.xt_user.org.org_name }}费用清单
      </div>
      <div class="listInfo">
        <div>患者姓名：{{ patient.name }}</div>
        <div>性别：{{ patient.gender == 1 ? "男" : "女" }}</div>
        <div>结算类别：{{ getType(his_patient.balance_accounts_type) }}</div>
        <div style="min-width:300px;">发票号码：</div>
      </div>
      <div class="listInfo">
        <div>住院/门诊号：</div>
        <div>科室：{{ getDepartment(his_patient.departments) }}</div>
        <div style="min-width:350px;">就诊流水号：{{ his_patient.number }}</div>
      </div>
      <div class="listInfo">
        <div>总费用：{{ getAllPice() }}</div>
        <div>个人支付：{{ getActPay() }}</div>
        <div>基金支付记账：{{ getFundPaySumamt() }}</div>
        <div style="min-width:300px;">补充医疗支付记账：{{ getHifesPay() }}</div>
      </div>
      <div class="listInfo">
        <div>救助支付金额：{{ getMafPay() }}</div>
      </div>
      <table class="listTable" border="1">
        <tr style="height:45px">
          <td style="width: 5%; text-align: center">序号</td>
          <td style="width: 13%; text-align: center">处方日期</td>
          <td style="width: 20%; text-align: center">费用编码</td>
          <td style="width: 17%; text-align: center">项目名称</td>
          <td style="width: 10%; text-align: center">规格</td>
          <td style="width: 13%; text-align: center">数量</td>
          <td style="width: 13%; text-align: center">单位</td>
          <td style="width: 11%; text-align: center">单价(元)</td>
          <td style="width: 10%; text-align: center">金额</td>
        </tr>
        <tr v-for="(item, index) in tableData" :key="index">
          <td style="width: 19%; text-align: center">{{ index + 1 }}</td>
          <td style="width: 10%; text-align: center">
            <span v-if="item.record_date > 0">{{
              getTimes(item.record_date)
            }}</span>
          </td>
          <td style="width: 31%; text-align: center">{{ item.number }}</td>
          <td style="width: 14%; text-align: center">
            <span v-if="item.advice_id > 0">{{ item.advice.advice_name }}</span>
            <span v-if="item.project_id > 0">
              <span v-if="item.project.type == 2">{{
                item.project.project.project_name
              }}</span>
              <span v-if="item.project.type == 3"
                >{item.project.good_info.good_name}}</span
              >
            </span>
          </td>
          <td style="width: 10%; text-align: center">
            <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_id > 0">
              <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>
            </span>
          </td>
          <td style="width: 6%; text-align: center">
            {{ item.cnt }}
          </td>
           <td style="width: 6%; text-align: center">
              <span v-if="item.advice_id > 0">{{item.advice.prescribing_number_unit}}</span>
              <span v-if="item.project_id > 0">
                <span v-if="item.project.type == 2">{{item.project.project.unit}}</span>
                <span v-if="item.project.type == 3">{{item.project.good_info.packing_unit}}</span>
              </span>
          </td>
          <td style="width: 10%; text-align: center">
            {{ item.pric }}
          </td>
          <td style="width: 10%; text-align: center">
            {{ item.total_price }}
          </td>
        </tr>
      </table>
    </div>
  </div>
</template>

<script>
import print from "print-js";
import { uParseTime } from "@/utils/tools";
import { getHisSummaryDetailList } from "@/api/his/his_tools";
export default {
  data() {
    return {
      patient: {},
      tableData: [],
      list: [],
      his_patient: {},
      hisDepatment: [],
      settlement: [
        { value: 1, label: "医保" },
        { value: 2, label: "自费" },
        { value: 3, label: "公费" },
        { value: 4, label: "农保" },
        { value: 5, label: "会员" },
        { value: 6, label: "职工" },
        { value: 7, label: "合同" },
        { value: 8, label: "医保自费" },
      ],
    };
  },
  methods: {
    printtpage() {
      const style =
        '@media print {.list-print{width:960px;margin:0 auto} .listTitle {font-size: 24px;text-align: center;font-weight: bold;margin-bottom: 10px;}.listInfo {display: flex;font-size: 16px;justify-content: space-between;margin: 10px 0;}.listTable {width: 100%;text-align: center;border-collapse: collapse;line-height: 25px;font-size: 14px;border-color: #000;text-align: left;} .listTable tr td {padding: 0 5px;}.tableBottom {font-size: 16px;display: flex;margin-top: 20px;}.tableBottomOne {margin-right: 40px;}';
      printJS({
        printable: "list-print",
        type: "html",
        style: style,
        scanStyles: false,
      });
    },

    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;
    },
    getTimes(time) {
      return uParseTime(time, "{y}-{m}-{d}");
    },
    getHisSummaryDetailList() {
      let start_time = this.$route.query.start_time;
      let end_time = this.$route.query.end_time;
      let params = {
        patient_id: this.$route.query.patient_id,
        start_time: start_time,
        end_time: end_time,
        type: this.$route.query.type,
        keyword: this.$route.query.keyword,
      };
      getHisSummaryDetailList(params).then((response) => {
        if (response.data.state == 1) {
          var list = response.data.data.list;

          this.list = list;
          this.patient = response.data.data.patient;

          this.his_patient = response.data.data.his_patient;
         

          this.hisDepatment = response.data.data.hisDepatment;

          this.tableData = [];
          for (let i = 0; i < list.length; i++) {
            for (let j = 0; j < list[i].orders.length; j++) {
              for (let z = 0; z < list[i].orders[j].order_info.length; z++) {
                list[i].orders[j].order_info[z].record_date =
                  list[i].orders[j].settle_accounts_date;
                list[i].orders[j].order_info[z].number =
                  list[i].orders[j].number;
                this.tableData.push(list[i].orders[j].order_info[z]);
              }
            }
          }
          var obj = { index: "合计", total_price: 0, record_date: "0" };
          for (let i = 0; i < this.tableData.length; i++) {
            this.tableData[i].index = i + 1;
            this.tableData[i].total_price = 0;
            this.tableData[i].total_price = (
              this.tableData[i].cnt * this.tableData[i].pric
            ).toFixed(2);
            obj.total_price += this.tableData[i].cnt * this.tableData[i].pric;
          }
          obj.total_price = obj.total_price.toFixed(2);
          this.tableData.push(obj);
          if (this.$route.query.keyword != "") {
            for (let i = 0; i < this.tableData.length; i++) {
              if (this.tableData[i].index != "合计") {
                if (this.tableData[i].advice_id > 0) {
                  if (
                    this.tableData[i].advice.advice_name.indexOf(
                      this.$route.query.keyword
                    ) > -1
                  ) {
                    new_arr.push(this.tableData[i]);
                  }
                }
                if (this.tableData[i].project_id > 0) {
                  if (this.tableData[i].project.type == 2) {
                    if (
                      this.tableData[i].project.project.project_name.indexOf(
                        this.$route.query.keyword
                      ) > -1
                    ) {
                      new_arr.push(this.tableData[i]);
                    }
                  }
                  if (this.tableData[i].project.type == 3) {
                    if (
                      this.tableData[i].project.good_info.good_name.indexOf(
                        this.$route.query.keyword
                      ) > -1
                    ) {
                      new_arr.push(this.tableData[i]);
                    }
                  }
                }
              }
            }
            if (this.$route.query.keyword != "") {
              this.tableData.push(obj);
            }
            this.tableData = new_arr;
          }
          console.log("tabledata32233223323232", this.tableData);
        }
      });
    },
    getAllPice() {
      var total_price = 0;
      for (let i = 0; i < this.tableData.length; i++) {
        if (this.tableData[i].index == "合计") {
          total_price = this.tableData[i].total_price;
        }
      }
      return total_price;
    },
    getActPay() {
      console.log("hh23h323223323", this.list);
      var act_pay = 0;
      for (let i = 0; i < this.list.length; i++) {
        for (let j = 0; j < this.list[i].orders.length; j++) {
          act_pay += this.list[i].orders[j].acct_pay;
        }
      }
      return act_pay;
    },
    getFundPaySumamt() {
      var fund_pay_sumamt = 0;
      for (let i = 0; i < this.list.length; i++) {
        for (let j = 0; j < this.list[i].orders.length; j++) {
          fund_pay_sumamt += this.list[i].orders[j].fund_pay_sumamt;
        }
      }
      return fund_pay_sumamt;
    },
    getHifesPay() {
      var hifes_pay = 0;
      for (let i = 0; i < this.list.length; i++) {
        for (let j = 0; j < this.list[i].orders.length; j++) {
          hifes_pay += this.list[i].orders[j].hifes_pay;
        }
      }
      return hifes_pay;
    },
    getMafPay() {
      var maf_pay = 0;
      for (let i = 0; i < this.list.length; i++) {
        for (let j = 0; j < this.list[i].orders.length; j++) {
          maf_pay += this.list[i].orders[j].maf_pay;
        }
      }
      return maf_pay;
    },
    getDepartment(id) {
      var name = "";
      for (let i = 0; i < this.hisDepatment.length; i++) {
        if (id == this.hisDepatment[i].id) {
          name = this.hisDepatment[i].name;
        }
      }
      return name;
    },
    getType(id) {
      var name = "";
      for (let i = 0; i < this.settlement.length; i++) {
        if (id == this.settlement[i].value) {
          name = this.settlement[i].label;
        }
      }
      return name;
    },
  },
  created() {
    this.getHisSummaryDetailList();
  },
};
</script>

<style lang="scss" scoped>
.list-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;
}
.listTitle {
  font-size: 24px;
  text-align: center;
  font-weight: bold;
  margin-bottom: 10px;
}
.listInfo {
  display: flex;
  font-size: 16px;
  justify-content: space-between;
  margin: 10px 0;
}
.listTable {
  width: 100%;
  text-align: center;
  border-collapse: collapse;
  line-height: 25px;
  font-size: 14px;
  border-color: #000;
  text-align: left;
}
.listTable tr td {
  padding: 0 5px;
}
.tableBottom {
  font-size: 16px;
  display: flex;
  margin-top: 20px;
}
.tableBottomOne {
  margin-right: 40px;
}
.print_btn {
  display: flex;
  justify-content: flex-end;
}
</style>