Vue_New/src/xt_pages/hospitalStation/invoicePrint.vue

<template>
  <div>
    <template>
      <el-button
        style="position: fixed; right: 25px; z-index: 999"
        :loading="loading"
        size="small"
        icon="el-icon-printer"
        @click="printThisPage"
        type="primary"
        >打印</el-button
      >
    </template>
    <div class="app-container" style="padding-top: 40px">
      <div class="dialysisPage">
        <printOne
          v-if="
            org_id != 10215 &&
            org_id != 10265 &&
            org_id != 4 &&
            org_id != 0 &&
            org_id != 9675
          "
          :paramsObj="invoiceParams"
        ></printOne>
        <printTwo
          v-if="org_id == 10215 "
          :paramsObj="invoiceParams"
        ></printTwo>
        <printThree
          v-if="org_id == 10265 || org_id == 4 || org_id == 9675 "
          :paramsObj="invoiceParams"
        ></printThree>
<!--        <print-night v-if="org_id == 10210 || org_id == 0"-->
<!--                  :paramsObj="invoiceParams"></print-night>-->
      </div>
    </div>
  </div>
</template>

<script>
import printOne from "./invoiceTemplate/printOne";
import printTwo from "./invoiceTemplate/printTwo";
import printThree from "./invoiceTemplate/printThree";
// import PrintNight from "./invoiceTemplate/printNight";
export default {
  name: "invoicePrint",
  components: {
    PrintNight,
    printOne,
    printTwo,
    printThree,
  },
  props: {
    invoiceParams: Object,
  },
  data() {
    return {
      childResponse: {},
      //   invoiceParams:{}
      org_id: "",
    };
  },
  methods: {
    getAdminUser(id) {
      if (id == 0) {
        return "";
      }
      if (id == undefined) {
        return "";
      }
      for (let i = 0; i < this.adminUser.length; i++) {
        if (this.adminUser[i].id == id) {
          return this.adminUser[i].name;
        }
      }
    },
    getTime(value, temp) {
      if (value == 0) {
        return "";
      }
      if (value != undefined) {
        return uParseTime(value, temp);
      }
      return "";
    },
    printThisPage() {
      if (this.org_id == 10265 || this.org_id == 0 || this.org_id == 4) {
        const style1 =
          "@page{size:landscape ; margin: 20mm;} @media print {#invoice-print{font-size:14px;}.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%;}.chargeBox{border: 1px solid #000;}.chargeUl{display:flex;justify-content: space-between;text-align: center;}.chargeUl p{line-height: 1px;}.chargeP{line-height: 1px;padding-bottom:16px;}.moneyBox{display: flex;justify-content: space-between;padding: 0 10px;background: #eeeeee;-webkit-print-color-adjust:exact;-moz-print-color-adjust:exact;-ms-print-color-adjust:exact;print-color-adjust:exact;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;}}";
        printJS({
          printable: "invoice-print",
          type: "html",
          style: style1,
          scanStyles: false,
        });
      } else {
        const style =
          "@media print {#invoice-print{font-size:12px;}.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%;}.chargeBox{border: 1px solid #000;}.chargeUl{display:flex;justify-content: space-between;text-align: center;}.chargeUl p{line-height: 1px;}.chargeP{line-height: 1px;padding-bottom:16px;}.moneyBox{display: flex;justify-content: space-between;padding: 0 10px;background: #eeeeee;-webkit-print-color-adjust:exact;-moz-print-color-adjust:exact;-ms-print-color-adjust:exact;print-color-adjust:exact;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;}}";
        printJS({
          printable: "invoice-print",
          type: "html",
          style: style,
          scanStyles: false,
        });
      }

      // if (this.org_template_info.template_id == 1) {
      //   printJS({
      //     printable: "dialysis-print-box",
      //     type: "html",
      //     style: style,
      //     scanStyles: false
      //   });
      // }
    },
  },
  created() {
    console.log("this.invoiceParams", this.invoiceParams);
    this.org_id = this.$store.getters.xt_user.org_id;
    console.log(this.org_id, "this.org_id");
  },
  watch: {
    paramsObj: {
      //深度监听，可监听到对象、数组的变化
      handler(val, oldVal) {
        this.invoiceParams = val;
      },
      deep: true,
    },
  },
};
</script>

<style lang="scss" scoped>
.printTitle {
  font-size: 22px;
  text-align: center;
  font-weight: bold;
}
.infoMain {
  display: flex;
  flex-wrap: wrap;
  border-bottom: 2px solid #000;
  padding: 0 10px;
}
.infoMain .infoP {
  width: 33%;
  line-height: 24px;
}
.prescriptionBox {
  padding: 0 10px;
  height: 600px;
}
.Rp {
  font-size: 22px;
  font-weight: bold;
}
.drugsBox {
  padding-left: 40px;
  margin-bottom: 10px;
}
.drugsBox p {
  line-height: 30px;
}
.drugsOne {
  line-height: 24px;
}
.drugsOne span {
  margin-right: 20px;
}
.doctorBox {
  display: flex;
  justify-content: space-between;
  padding: 0 10px;
  line-height: 24px;
  border-bottom: 2px solid #000;
}
.actionBar {
  display: flex;
  justify-content: space-between;
  line-height: 24px;
  padding: 0 10px;
}
.actionBar p {
  width: 150px;
}
</style>