hah阿凡达

src/xt_pages/stock/drugs/drugNewPrint.vue

@@ -0,0 +1,294 @@
+<template>
+    <el-dialog
+      title="打印"
+      :visible.sync="visibility"
+      :close-on-click-modal="isClose"
+      :close-on-press-escape="isClose"
+    >
+      <el-button type="primary" @click="print" class="print_style"
+        >打印</el-button
+      >
+      <div id="dialysis-print-box-1" class="dialysis-print-box-1">
+        <div class="list_title" style="border-bottom:none;">
+          <div style="width:100%;text-align:center;font-size:16px;font-weight:bold;">
+            {{org_name}} <span v-if="state=='待发药'">发药单</span> <span v-if="state=='已发药'">领药单</span>
+          </div>
+        </div>
+        <div style="display: flex;">
+          <div style="margin-right: 20px;">日期：{{times}}</div>
+        </div>
+        <div>
+          <table class="table" border="1" 
+            style="border-collapse: collapse;width: 100%;text-align: center;">
+            <tr>
+              <td>序号</td>
+              <td>医保编码</td>
+              <td>药品名称</td>
+              <td>规格</td>
+              <td>入库数量</td>
+              <td>单位</td>
+              <td>进货单价</td>
+              <td>入库金额</td>
+              <td>零售价</td>
+              <td>批号</td>
+              <td>生产日期</td>
+              <td>有效日期</td>
+              <td>生产厂家</td>
+              <td>进销商</td>
+              <td>入库日期</td>
+              <td>备注</td>
+            </tr>
+            <tr v-for="(item,i) in goodList" >
+              <td>{{ i+1 }}</td>
+              <td>{{ item.social_security_directory_code  }}</td>
+              <td>{{item.drug_name }}</td>
+              <td>{{ item.specification_name }}</td>
+              <td>{{ item.warehousing_count }}</td>
+              <td>{{ item.max_unit}}</td>
+              <td>
+                {{ item.price }}
+              </td>
+              <td>
+               {{ (item.warehousing_count * item.price).toFixed(2) }}
+              </td>
+              <td>
+                {{ item.retail_price }}
+              </td>
+              <td>{{ item.batch_number }}</td>
+              <td>
+                {{ getTime(item.product_date) }}
+              </td>
+              <td>
+                {{ getTime(item.expiry_date) }}
+              </td>
+            
+              <td>
+                {{ item.manufacturer_name }}
+              </td>
+              <td>
+                {{ item.dealer_name }}
+              </td>
+              <td>
+                {{ getTime(item.ctime) }}
+              </td>
+              <td>
+                {{ item.remark }}
+              </td>
+            </tr>
+          </table>
+        </div>
+        <div style="display: flex;margin: 10px 0;">
+          <div style="flex: 1;">数量合计:
+             {{ getSumCount() }}
+          </div>
+          <div style="flex: 1;">金额合计:
+             {{ getSumPrice() }}
+          </div>
+          <div style="flex: 1;">操作人:</div>
+          <div style="flex: 1;">核对人:</div>
+        </div>
+       
+      </div>
+    </el-dialog>
+  </template>
+  <script>
+  import Vue from "vue";
+  import print from "print-js";
+  import printutils from "./print.js";
+  import{todaynumber} from '@/api/pharmacy'
+  const moment = require("moment");
+  import { uParseTime } from "@/utils/tools";
+  export default {
+    
+    data() {
+      return {
+        visibility: false,
+        tableData: [],
+        isClose:false,
+        name:"",
+        DialysisNo:'',
+        state:null,
+        times: moment().format('YYYY-MM-DD HH:mm:ss'),
+        start_time:moment(new Date()).add("year", 0).format("YYYY-MM-DD"),
+        org_name: this.$store.getters.xt_user.org.org_name,
+        baseList:[],
+        Doctor:'',
+        patients:{},
+        doctors:[],
+        Price_zong:0,
+        diagnosearr:[],
+        diagnosis:'',
+        goodList:[],
+        manufacturerList:[],
+        dealerList:[],
+        goodKindList:[],
+      };
+    },
+    props: {
+      propForm: {
+        type: Object,
+      },
+    },
+    created(){
+      this.init();
+    },
+    methods: {
+     pickerOptions(){
+
+     },
+     changeStartTime(){
+
+     },
+     changeEndTime(){
+
+     },
+      getSumCount(){
+        var sum_count = 0
+        for(let i=0;i<this.tableData.length;i++){
+          sum_count+=this.tableData[i].warehousing_count
+        }
+        return sum_count
+      },
+      getSumPrice(){
+        var all_price = 0
+        for(let i=0;i<this.tableData.length;i++){
+          all_price+= (this.tableData[i].warehousing_count * this.tableData[i].price)
+        }
+        if(all_price>0){
+           all_price.toFixed(2)
+        }else{
+          return ""
+        }
+      },
+      getTime: function(val) {
+      if (val == 0) {
+        return "";
+      } else {
+        return uParseTime(val, "{y}-{m}-{d}");
+      }
+     },
+      hide: function () {
+        this.visibility = false;
+        for (let i = 0; i < this.propForm.goods.length; i++) {
+          for (let key in this.propForm.goods[i]) {
+            if (key != "index") {
+              this.propForm.goods[i][key].isSelected = false;
+            }
+          }
+        }
+      },
+      show: function (tableData) {
+        console.log("tableData===========",tableData)
+        this.goodList = []
+        this.goodList = tableData
+        this.visibility = true;
+      },
+   
+      comfirm: function (formName) {
+        this.goodInfo = [];
+        this.goodInfoTableData = [];
+        this.$emit("dialog-comfirm", this.getValue());
+        this.$refs.multipleTable.clearSelection();
+        this.$refs.table.setCurrentRow(null);
+      },
+      getValue() {},
+  
+      // 打印
+      print() {
+        console.log(this.org_name,'this.org_name')
+        Vue.prototype.printJson = printutils.printJson;
+          const style ='@media print {.list_title{width:940px;border-bottom:1px solid;display:flex;margin:20px auto} .table tr td{border:1px solid black;padding: 5px 0;border-left: none;border-right: none;}.dialysis-print-box-1 .table{ border-collapse: collapse;width:100%;text_align:center} .dialysis-print-box-1 .table tr td{ border: 1px solid #000 !important; padding: 5px 0;} }';
+          printJS({
+            printable: "dialysis-print-box-1",
+            type: "html",
+            style: style,
+            scanStyles: false,
+          });
+
+          
+      },
+      getTime(val) {
+          if(val < 0){
+            return ""
+          }
+          if(val == ""){
+          return ""
+          }else {
+          return uParseTime(val, '{y}-{m}-{d} {h}:{i}')
+          }
+      }, 
+      getdoctors(id){
+        for(let i in this.doctors){
+          if(this.doctors[i].id == id){
+            return this.doctors[i].user_name
+          }
+        }
+      }
+    },
+  };
+  </script>
+  
+  <style lang="scss" scoped>
+  /deep/ .el-dialog{
+    width: 60%;
+  }
+  /deep/ .el-table__body-wrapper::-webkit-scrollbar {
+    width: 10px;
+    height: 10px;
+  }
+  .print_style {
+    position: absolute;
+    right: 65px;
+    top: 50px;
+  }
+  
+  .list_title {
+    width: 940px;
+    border-bottom: 1px solid;
+    display: flex;
+  }
+  .table tr td{
+   border:1px solid black;
+   padding: 5px 0;
+   border-left: none;
+   border-right: none;
+  }
+  </style>
+  
+  <style>
+  .sign-and-weigh-box .sign-and-weigh-box-patients .cell {
+    font-size: 12px;
+  }
+  
+  .sign-and-weigh-box .sign-and-weigh-box-patients .current-row > td {
+    background: #6fb5fa;
+  }
+  
+  .count {
+    color: #bd2c00;
+  }
+  .el-table td,
+  .el-table th.is-leaf,
+  .el-table--border,
+  .el-table--group {
+    border-color: #d0d3da;
+  }
+  .el-table--border::after,
+  .el-table--group::after,
+  .el-table::before {
+    background-color: #d0d3da;
+  }
+
+  /* 仅影响当前组件的表格 */
+.dialysis-print-box-1 .table {
+  border-collapse: collapse;
+  width: 100%;
+  text-align: center;
+}
+
+.dialysis-print-box-1 .table tr td {
+  border: 1px solid #000 !important; /* 确保所有边框都显示 */
+  padding: 5px 0;
+}
+  </style>
+  

src/xt_pages/stock/drugs/print.js

@@ -0,0 +1,53 @@
+import printJS from "print-js";
+/**
+ * 
+ * @param {
+ *      title:"", // 表名
+ *      serial：false, // 是否需要序号
+ *      data:[], // 要打印的数据
+ *      fields:[], // 需要打印的字段
+ *      properties:[
+ *          {
+ *              field:"字段名（对应fields）",
+ *              displayName:"打印时展⽰的中⽂表头名字",
+ *              columnSize:"定义列宽，⽤百分⽐来表⽰⼤⼩，可不传"
+ *          }
+ *      ],
+ * } args
+ *  
+ */
+function printJson(args = {}) {
+    let data = [];
+    for (let di = 0; di < args.data.length; di++) {
+        var obj = {}
+        // 如果需要序列号则是列表index+1
+        if (args.serial) {
+            obj.serial = di + 1
+        }
+        // 遍历需要打印的字段与列表字段⼀⼀对应，形成键值对
+        for (let fi = 0; fi < args.fields.length; fi++) {
+            obj[args.fields[fi]] = args.data[di][args.fields[fi]]
+        }
+        data.push(obj)
+    }
+    let properties = args.properties;
+    if (args.serial) {
+        properties.unshift({
+            field: "serial",
+            displayName: "序号",
+        })
+    }
+    printJS({
+        printable: data,
+        properties: properties || [],
+        header: args.title || "",
+        // 样式设置
+        type: 'json',  // 打印的格式
+        headerStyle:'display:flex;  .list_title{  width: 940px;border-bottom: 1px solid;display: flex;margin: 30px auto;}',
+        gridStyle: 'border: 1px solid #000;text-align:center;padding:5px 0;', // 表格样式
+        gridHeaderStyle: 'border: 1px solid #000;text-align:center;padding:5px 0;',//表头样式
+    });
+}
+export default {
+    printJson
+}