1

src/xt_pages/outpatientCharges/allListTemplate/printOne.vue

 <template>
     <div id="allList-print" class="allList-print">
-        <div class="allListTitle">翁源沅胜透析中心费用汇总</div>
-        <div class="allListInfo">
-          <div>患者姓名：{{patient.name}}</div>
-          <div>透析号：{{patient.dialysis_no}}</div>
-          <div>性别：{{patient.gender == 1 ? '男': '女'}}</div>
-          <div>年龄：{{patient.age}}  岁</div>
-          <div>日期：{{getTimes(order.settle_start_time)}} 至 {{getTimes(order.settle_end_time)}}</div>
+        <div v-for='(i,index) in pageArr.length' :key="index">
+            <div class="allListTitle">翁源沅胜透析中心费用汇总</div>
+            <div class="allListInfo">
+            <div>患者姓名：{{patient.name}}</div>
+            <div>透析号：{{patient.dialysis_no}}</div>
+            <div>性别：{{patient.gender == 1 ? '男': '女'}}</div>
+            <div>年龄：{{patient.age}}  岁</div>
+            <div>日期：{{getTimes(order.settle_start_time)}} 至 {{getTimes(order.settle_end_time)}}</div>
 
-        </div>
-        <table class="allListTable" border="1">
-            <tr>
-                <td style="width:10%">类别</td>
-                <td style="width:50%">项目名称</td>
-                <td style="width:10%">规格</td>
-                <td style="width:10%">单价(元)</td>
-                <td style="width:10%">数量</td>
-                <td style="width:10%">金额(元)</td>
-            </tr>
-            <template v-for='item in list'>
-                <tr v-if="item.is_total == 2">
-                    <td style="width:10%">{{item.med_chrgitm_type}}</td>
-                    <td style="width:50%">{{item.name}}</td>
-                    <td style="width:10%">{{item.spec}}</td>
-                    <td style="width:10%">{{(item.price).toFixed(2)}}</td>
-                    <td style="width:10%">{{item.count}}</td>
-                    <td style="width:10%">{{(item.price * item.count).toFixed(2)}}</td>
-                </tr>
+            </div>
+            <table class="allListTable" border="1">
                 <tr>
-                    <td colspan="6" style="text-align:right;" v-if="item.is_total == 1">合计：{{item.total}}元</td>
+                    <td style="width:10%">类别</td>
+                    <td style="width:50%">项目名称</td>
+                    <td style="width:10%">规格</td>
+                    <td style="width:10%">单价(元)</td>
+                    <td style="width:10%">数量</td>
+                    <td style="width:10%">金额(元)</td>
                 </tr>
-            </template>
-        </table>
-        <div class="tableBottom">
-          <div class="tableBottomOne">制表人：{{admin.user_name}}</div>
-          <div class="tableBottomOne">制表日期：{{ getNowTime()}}</div>
-          <div class="tableBottomOne">总费用：{{order.medfee_sumamt}}元</div>
+                <template v-for='item in list.slice(index * 13,(index * 14) + pageArr[index])'>
+                    <tr v-if="item.is_total == 2">
+                        <td style="width:10%">{{item.med_chrgitm_type}}</td>
+                        <td style="width:50%">{{item.name}}</td>
+                        <td style="width:10%">{{item.spec}}</td>
+                        <td style="width:10%">{{(item.price).toFixed(2)}}</td>
+                        <td style="width:10%">{{item.count}}</td>
+                        <td style="width:10%">{{(item.price * item.count).toFixed(2)}}</td>
+                    </tr>
+                    <tr>
+                        <td colspan="6" style="text-align:right;" v-if="item.is_total == 1">合计：{{item.total}}元</td>
+                    </tr>
+                </template>
+            </table>
+            <div class="tableBottom">
+            <div class="tableBottomOne">制表人：{{admin.user_name}}</div>
+            <div class="tableBottomOne">制表日期：{{ getNowTime()}}</div>
+            <div class="tableBottomOne">总费用：{{order.medfee_sumamt}}元</div>
+            </div>
         </div>
     </div>
 </template>
           return {};
         }
       },
-    },methods:{
+    },
+    data(){
+        return{
+            page:1,
+            pageArr:[],
+        }
+    },
+    methods:{
       getNowTime: function () {
         let dateTime
         let yy = new Date().getFullYear()
         }
         return total
 
+      },
+      getPage(){
+        if(this.list.length <= 13){
+            this.page = 1
+            this.pageArr.push(this.list.length)
+        }else if(this.list.length > 13){
+            this.page = parseInt(this.list.length / 13)
+            let num = this.list.length % 13
+            for (var i=0;i<this.page;i++){ 
+                this.pageArr.push(13)
+            }
+            if(num != 0){
+                this.pageArr.push(num)
+            }
+        }
       }
 
+    },
+    watch:{
+        list: {
+            handler(newVal) {
+                this.getPage()
+            },
+            deep: true
+        }
     }
   }
 

src/xt_pages/outpatientCharges/listTemplate/printOne.vue

         }
     },
     mounted(){
-        this.getPage()
+        // this.getPage()
     },
     methods:{
       getNowTime: function () {