ci-plus 1.1.1 → 1.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,1469 @@
1
+ <template>
2
+ <div style="display: flex; flex-direction: column; height: 100%">
3
+ <div style="width: 100px"><el-button @click="print">打印</el-button></div>
4
+ <iframe
5
+ :style="`width: ${myWidth}; height: ${myHeight}; margin: 0`"
6
+ ref="iframeRef"
7
+ :srcdoc="barcodeCon"
8
+ frameborder="0"
9
+ ></iframe>
10
+ <div id="barcode" style="display: none">
11
+ <!-- 给print-conten 添加 page-break-a;可以使打印的时候在每个print-content元素的下方添加一个分页标记,即可实现一张纸只打印一张标签
12
+ 参考:https://blog.csdn.net/qq_35491739/article/details/126279510
13
+ -->
14
+ <div
15
+ v-for="(item, index) in list"
16
+ :key="index"
17
+ class="print-content"
18
+ :style="`width: calc(${myWidth} - 30px); height: calc(${myHeight} - 290px); margin: 0 0 20px 0;page-break-after:always;`"
19
+ >
20
+ <div class="content" style="width: 100%; height: 100%">
21
+ <div
22
+ style="
23
+ display: flex;
24
+ justify-content: space-between;
25
+ margin: 0;
26
+ font-size: 16px;
27
+ width: 100%;
28
+ "
29
+ >
30
+ <!-- <div style="color: red">{{ props.cardName }}</div>
31
+ <div>第{{ index + 1 }}张标签</div> -->
32
+ </div>
33
+ <!-- 帐物卡 -->
34
+ <div class="id-code" :style="`width: ${myWidth}; `" v-if="item.card_state == 'ZHANGWU'">
35
+ <table
36
+ border="1"
37
+ cellpadding="0"
38
+ style="
39
+ width: 100%;
40
+ border-collapse: collapse;
41
+ border-spacing: 0;
42
+ border-width: 1px;
43
+ text-align: center;
44
+ "
45
+ >
46
+ <tbody>
47
+ <tr>
48
+ <td style="width: 100px">
49
+ <el-image style="height: 20px; margin-top: 5px" src="../public/C&U.png" />
50
+ </td>
51
+ <td style="font-size: 23px">{{ item.r1c2 }}</td>
52
+ <!-- 文件编号 -->
53
+ <td>{{ item.r1c3 }}</td>
54
+ <td>{{ item.r1c4 }}</td>
55
+ </tr>
56
+ <tr>
57
+ <td>{{ item.r2c1 }}</td>
58
+ <td colspan="2">{{ item.r2c2 }}</td>
59
+ <td rowspan="3" colspan="2" class="content">
60
+ <!-- <img
61
+ alt="二维码"
62
+ src="http://10.20.72.231:9999/media/card_code/20240116/No18202401161.png"
63
+ :width="80"
64
+ style="margin: 1px"
65
+ /> -->
66
+ <img alt="二维码" :src="item.r2c4" :width="80" style="margin: 1px" />
67
+ </td>
68
+ </tr>
69
+ <tr>
70
+ <!-- 产品型号 -->
71
+ <td>{{ item.r3c1 }}</td>
72
+ <td colspan="2">{{ item.r3c2 }}</td>
73
+ </tr>
74
+ <tr>
75
+ <!-- 物料编号 -->
76
+ <td>{{ item.r4c1 }}</td>
77
+ <td colspan="2">{{ item.r4c2 }}</td>
78
+ </tr>
79
+ <tr>
80
+ <td>{{ item.r5c1 }}</td>
81
+ <td colspan="2">{{ item.r5c2 }}</td>
82
+ <td colspan="2" class="content">
83
+ {{ item.r5c4 }}
84
+ </td>
85
+ </tr>
86
+ <tr>
87
+ <!-- 规值 -->
88
+ <td>{{ item.r6c1 }}</td>
89
+ <td>{{ item.r6c2 }}</td>
90
+ <td>{{ item.r6c3 }}</td>
91
+ <td class="content">
92
+ {{ item.r6c4 }}
93
+ </td>
94
+ </tr>
95
+ <tr style="border-bottom: none; border-top: none">
96
+ <td colspan="4">
97
+ <table
98
+ border="1"
99
+ cellpadding="0"
100
+ style="
101
+ width: 100%;
102
+ border-collapse: collapse;
103
+ border-spacing: 0;
104
+ border-width: 1px;
105
+ text-align: center;
106
+ "
107
+ >
108
+ <tbody>
109
+ <tr style="border-left: none; border-top: none">
110
+ <th style="width: 40px">No</th>
111
+ <th style="width: 110px">日期</th>
112
+ <th>收入</th>
113
+ <th>发出</th>
114
+ <th>结转</th>
115
+ <th>签字/备注</th>
116
+ </tr>
117
+ <tr style="border-left: none">
118
+ <td>1</td>
119
+ <td>{{ item.data[0]?.opt_time }}</td>
120
+ <td>{{ item.data[0]?.sr }}</td>
121
+ <td>{{ item.data[0]?.fc }}</td>
122
+ <td>{{ item.data[0]?.balance_count }}</td>
123
+ <td>{{ item.data[0]?.remark }}</td>
124
+ </tr>
125
+ <tr v-for="(item, index) in 5" :key="index" style="border-left: none">
126
+ <td>{{ index + 2 }}</td>
127
+ <td></td>
128
+ <td></td>
129
+ <td></td>
130
+ <td></td>
131
+ <td></td>
132
+ </tr>
133
+ </tbody>
134
+ </table>
135
+ </td>
136
+ </tr>
137
+
138
+ <tr>
139
+ <td colspan="4">
140
+ <div class="b2bcode" style="margin: 1px">
141
+ <!-- 将条码文本传递到组件生成对应条形码 -->
142
+ <bar-code
143
+ :key="item + new Date()"
144
+ :value="item.r14c1"
145
+ :maxWidth="myWidth"
146
+ :newClass="index"
147
+ ></bar-code>
148
+ </div>
149
+ </td>
150
+ </tr>
151
+ </tbody>
152
+ </table>
153
+ </div>
154
+ <!-- 产品标识卡(成品工厂) -->
155
+ <div
156
+ class="id-code"
157
+ style="width: 100%; display: flex; justify-content: flex-start; flex-direction: column"
158
+ v-else-if="item.card_state == 'CHANPIN' && item.factoryType == '2'"
159
+ >
160
+ <table
161
+ border="1"
162
+ cellpadding="0"
163
+ style="
164
+ border-collapse: collapse;
165
+ border-spacing: 0;
166
+ border-width: 1px;
167
+ text-align: center;
168
+ "
169
+ >
170
+ <tbody>
171
+ <tr>
172
+ <td style="width: 100px">
173
+ <el-image style="height: 20px; margin-top: 5px" :src="C_U" />
174
+ </td>
175
+ <td style="font-size: 23px; width: 120px">
176
+ {{ item.r1c2 }}
177
+ </td>
178
+ <td style="width: 120px">产品类别</td>
179
+ <td style="width: 200px">{{ item.r1c4 }}</td>
180
+ </tr>
181
+ <tr>
182
+ <td>物料编码</td>
183
+ <td colspan="2">{{ item.r2c2 }}</td>
184
+ <td rowspan="3" colspan="2" class="content">
185
+ <img alt="二维码" :src="item.r2c4" :width="75" style="margin: 1px" />
186
+ </td>
187
+ </tr>
188
+ <tr>
189
+ <td>产品型号</td>
190
+ <td colspan="2">{{ item.r3c2 }}</td>
191
+ </tr>
192
+ <tr>
193
+ <td>客户名称</td>
194
+ <td colspan="2">{{ item.r4c2 }}</td>
195
+ </tr>
196
+ <tr>
197
+ <td>流转批号</td>
198
+ <td colspan="2">{{ item.r5c2 }}</td>
199
+ <td colspan="2" class="content">
200
+ {{ item.r5c4 }}
201
+ </td>
202
+ </tr>
203
+ <tr>
204
+ <td>本工序</td>
205
+ <td>{{ item.r6c2 }}</td>
206
+ <td>下工序</td>
207
+ <td class="content">
208
+ {{ item.r6c4 }}
209
+ </td>
210
+ </tr>
211
+ <tr>
212
+ <td>本箱数量</td>
213
+ <td>{{ item.r7c2 }}</td>
214
+ <td>操作工/自检员</td>
215
+ <td class="content">
216
+ {{ item.r7c4 }}
217
+ </td>
218
+ </tr>
219
+ <tr>
220
+ <td>巡检员</td>
221
+ <td>{{ item.r8c2 }}</td>
222
+ <td>生产日期</td>
223
+ <td class="content">
224
+ {{ item.r8c4 }}
225
+ </td>
226
+ </tr>
227
+ <tr>
228
+ <td>规值</td>
229
+ <td>{{ item.r9c2 }}</td>
230
+ <td>规格</td>
231
+ <td class="content">
232
+ {{ item.r9c4 }}
233
+ </td>
234
+ </tr>
235
+ <tr>
236
+ <td>备注</td>
237
+ <td colspan="3">{{ item.r12c2 }}</td>
238
+ </tr>
239
+ <tr>
240
+ <td colspan="4">
241
+ <div class="b2bcode" style="margin: 1px">
242
+ <bar-code
243
+ :key="item + new Date()"
244
+ :value="item.r13c1"
245
+ :maxWidth="myWidth"
246
+ :newClass="index"
247
+ ></bar-code>
248
+ </div>
249
+ </td>
250
+ </tr>
251
+ </tbody>
252
+ </table>
253
+ </div>
254
+ <!-- 尚工厂:产品标识卡/尾料标识卡(为尚工厂的尾料标识卡也使用产品标示卡样式) -->
255
+ <div
256
+ class="id-code"
257
+ style="width: 100%; display: flex; justify-content: flex-start; flex-direction: column"
258
+ v-else-if="
259
+ (item.card_state == 'CHANPIN' || item.card_state == 'WEILIAO') &&
260
+ item.factoryType == '1'
261
+ "
262
+ >
263
+ <table
264
+ border="1"
265
+ cellpadding="0"
266
+ style="
267
+ border-collapse: collapse;
268
+ border-spacing: 0;
269
+ border-width: 1px;
270
+ text-align: center;
271
+ "
272
+ >
273
+ <tbody>
274
+ <tr>
275
+ <td style="width: 100px">
276
+ <el-image style="height: 20px; margin-top: 5px" :src="C_U" />
277
+ </td>
278
+ <td style="font-size: 23px; width: 120px">
279
+ {{ item.r1c2 }}
280
+ </td>
281
+ <!-- 产品类别 -->
282
+ <td style="width: 120px">{{ item.r1c3 }}</td>
283
+ <td style="width: 200px">{{ item.r1c4 }}</td>
284
+ </tr>
285
+ <tr>
286
+ <!-- 分布场所代号 -->
287
+ <td>{{ item.r2c1 }}</td>
288
+ <td colspan="2">{{ item.r2c2 }}</td>
289
+ <td rowspan="3" colspan="2" class="content">
290
+ <img alt="二维码" :src="item.r2c4" :width="75" style="margin: 1px" />
291
+ </td>
292
+ </tr>
293
+ <tr>
294
+ <!-- 客户名称 -->
295
+ <td>{{ item.r3c1 }}</td>
296
+ <td colspan="2">{{ item.r3c2 }}</td>
297
+ </tr>
298
+ <tr>
299
+ <td>{{ item.r4c1 }}</td>
300
+ <td colspan="2">{{ item.r4c2 }}</td>
301
+ </tr>
302
+ <tr>
303
+ <td>{{ item.r5c1 }}</td>
304
+ <td colspan="2">{{ item.r5c2 }}</td>
305
+ <td colspan="2" class="content">
306
+ {{ item.r5c4 }}
307
+ </td>
308
+ </tr>
309
+ <tr>
310
+ <!-- 产品物料号 -->
311
+ <td>{{ item.r6c1 }}</td>
312
+ <td>{{ item.r6c2 }}</td>
313
+ <td>{{ item.r6c3 }}</td>
314
+ <td class="content">
315
+ {{ item.r6c4 }}
316
+ </td>
317
+ </tr>
318
+ <tr>
319
+ <!-- 材料炉号 -->
320
+ <td>{{ item.r7c1 }}</td>
321
+ <td>{{ item.r7c2 }}</td>
322
+ <td>{{ item.r7c3 }}</td>
323
+ <td>{{ item.r7c4 }}</td>
324
+ </tr>
325
+ <tr>
326
+ <!-- 材料厂家 -->
327
+ <td>{{ item.r8c1 }}</td>
328
+ <td>{{ item.r8c2 }}</td>
329
+ <td>{{ item.r8c3 }}</td>
330
+ <td>{{ item.r8c4 }}</td>
331
+ </tr>
332
+ <tr>
333
+ <!-- 抽检结果 -->
334
+ <td>{{ item.r9c1 }}</td>
335
+ <td>{{ item.r9c2 }}</td>
336
+ <!-- 单重 -->
337
+ <td>{{ item.r9c3 }}</td>
338
+ <td>{{ item.r9c4 }}</td>
339
+ </tr>
340
+ <tr>
341
+ <!-- 本箱数量 -->
342
+ <td>{{ item.r10c1 }}</td>
343
+ <td>{{ item.r10c2 }}</td>
344
+ <!-- 抽检人员 -->
345
+ <td>{{ item.r10c3 }}</td>
346
+ <td>{{ item.r10c4 }}</td>
347
+ </tr>
348
+ <tr>
349
+ <td>{{ item.r11c1 }}</td>
350
+ <td>{{ item.r11c2 }}</td>
351
+ <td>{{ item.r11c3 }}</td>
352
+ <td>{{ item.r11c4 }}</td>
353
+ </tr>
354
+ <tr>
355
+ <td>{{ item.r12c1 }}</td>
356
+ <td>{{ item.r12c2 }}</td>
357
+ <td>{{ item.r12c3 }}</td>
358
+ <td>{{ item.r12c4 }}</td>
359
+ </tr>
360
+ <tr>
361
+ <!-- 备注 -->
362
+ <td>{{ item.r13c2 }}</td>
363
+ <td colspan="3">{{ item.r13c2 }}</td>
364
+ </tr>
365
+ <tr>
366
+ <td colspan="4">
367
+ <div class="b2bcode" style="margin: 1px">
368
+ <bar-code
369
+ :key="item + new Date()"
370
+ :value="item.r14c1"
371
+ :maxWidth="myWidth"
372
+ :newClass="index"
373
+ ></bar-code>
374
+ </div>
375
+ </td>
376
+ </tr>
377
+ </tbody>
378
+ </table>
379
+ </div>
380
+ <!-- 尾料标识卡(成品工厂) -->
381
+ <div
382
+ class="id-code"
383
+ :style="`width: ${myWidth}; `"
384
+ v-else-if="item.card_state == 'WEILIAO' && item.factoryType == '2'"
385
+ >
386
+ <table
387
+ border="1"
388
+ cellpadding="0"
389
+ style="
390
+ width: 100%;
391
+ border-collapse: collapse;
392
+ border-spacing: 0;
393
+ border-width: 1px;
394
+ text-align: center;
395
+ "
396
+ >
397
+ <tbody>
398
+ <tr>
399
+ <td style="width: 100px">
400
+ <el-image style="height: 20px; margin-top: 5px" :src="C_U" />
401
+ </td>
402
+ <td style="font-size: 23px; width: 120px">
403
+ {{ item.r1c2 }}
404
+ </td>
405
+ <td style="width: 120px">产品类别</td>
406
+ <td style="width: 200px">{{ item.r1c4 }}</td>
407
+ </tr>
408
+ <tr>
409
+ <td>物料编码</td>
410
+ <td colspan="2">{{ item.r2c2 }}</td>
411
+ <td rowspan="3" colspan="2" class="content">
412
+ <img alt="二维码" :src="item.r2c4" :width="75" style="margin: 1px" />
413
+ </td>
414
+ </tr>
415
+ <tr>
416
+ <td>产品型号</td>
417
+ <td colspan="2">{{ item.r3c2 }}</td>
418
+ </tr>
419
+ <tr>
420
+ <td>客户名称</td>
421
+ <td colspan="2">{{ item.r4c2 }}</td>
422
+ </tr>
423
+ <tr>
424
+ <td>流转批号</td>
425
+ <td colspan="2">{{ item.r5c2 }}</td>
426
+ <td colspan="2" class="content">
427
+ {{ item.r5c4 }}
428
+ </td>
429
+ </tr>
430
+ <tr>
431
+ <td>尾料原因</td>
432
+ <td colspan="3">{{ item.r6c2 }}</td>
433
+ </tr>
434
+ <tr>
435
+ <td>本工序</td>
436
+ <td>{{ item.r7c2 }}</td>
437
+ <td>下工序</td>
438
+ <td class="content">
439
+ {{ item.r7c4 }}
440
+ </td>
441
+ </tr>
442
+ <tr>
443
+ <td>本箱数量</td>
444
+ <td>{{ item.r8c2 }}</td>
445
+ <td>操作工/自检员</td>
446
+ <td class="content">
447
+ {{ item.r8c4 }}
448
+ </td>
449
+ </tr>
450
+ <tr>
451
+ <td>检验员</td>
452
+ <td>{{ item.r9c2 }}</td>
453
+ <td>生产日期</td>
454
+ <td class="content">
455
+ {{ item.r9c4 }}
456
+ </td>
457
+ </tr>
458
+ <tr>
459
+ <td>检验日期</td>
460
+ <td>{{ item.r10c2 }}</td>
461
+ <td>规格</td>
462
+ <td class="content">
463
+ {{ item.r10c4 }}
464
+ </td>
465
+ </tr>
466
+ <tr>
467
+ <td>游隙/尺寸</td>
468
+ <td>{{ item.r11c2 }}</td>
469
+ <td>规值</td>
470
+ <td class="content">
471
+ {{ item.r11c4 }}
472
+ </td>
473
+ </tr>
474
+ <tr>
475
+ <td>备注</td>
476
+ <td colspan="3">{{ item.r12c2 }}</td>
477
+ </tr>
478
+ <tr>
479
+ <td colspan="4">
480
+ <div class="b2bcode" style="margin: 1px">
481
+ <bar-code
482
+ :key="item + new Date()"
483
+ :value="item.r13c1"
484
+ :maxWidth="myWidth"
485
+ :newClass="index"
486
+ ></bar-code>
487
+ </div>
488
+ </td>
489
+ </tr>
490
+ </tbody>
491
+ </table>
492
+ </div>
493
+
494
+ <!-- 责废标识卡(成品工厂) -->
495
+ <div
496
+ class="id-code"
497
+ :style="`width: ${myWidth}; `"
498
+ v-else-if="item.card_state == 'ZEFEI' && item.factoryType == '2'"
499
+ >
500
+ <table
501
+ border="1"
502
+ cellpadding="0"
503
+ style="
504
+ width: 100%;
505
+ border-collapse: collapse;
506
+ border-spacing: 0;
507
+ border-width: 1px;
508
+ text-align: center;
509
+ "
510
+ >
511
+ <tbody>
512
+ <tr>
513
+ <td style="width: 100px">
514
+ <el-image style="height: 20px; margin-top: 5px" :src="C_U" />
515
+ </td>
516
+ <td style="font-size: 23px; width: 120px">
517
+ {{ item.r1c2 }}
518
+ </td>
519
+ <td style="width: 120px">产品类别</td>
520
+ <td style="width: 200px">{{ item.r1c4 }}</td>
521
+ </tr>
522
+ <tr>
523
+ <td>物料编码</td>
524
+ <td colspan="2">{{ item.r2c2 }}</td>
525
+ <td rowspan="3" colspan="2" class="content">
526
+ <img alt="二维码" :src="item.r2c4" :width="75" style="margin: 1px" />
527
+ </td>
528
+ </tr>
529
+ <tr>
530
+ <td>产品型号</td>
531
+ <td colspan="2">{{ item.r3c2 }}</td>
532
+ </tr>
533
+ <tr>
534
+ <td>流转批号</td>
535
+ <td colspan="2">{{ item.r4c2 }}</td>
536
+ </tr>
537
+ <tr>
538
+ <td>责废总数</td>
539
+ <td colspan="2">{{ item.r5c2 }}</td>
540
+ <td colspan="2" class="content">
541
+ {{ item.r5c4 }}
542
+ </td>
543
+ </tr>
544
+ <tr>
545
+ <td>工序</td>
546
+ <td>{{ item.r6c2 }}</td>
547
+ <td>生产日期</td>
548
+ <td class="content">
549
+ {{ item.r6c4 }}
550
+ </td>
551
+ </tr>
552
+ <tr>
553
+ <td>规值</td>
554
+ <td>{{ item.r7c2 }}</td>
555
+ <td>规格</td>
556
+ <td class="content">
557
+ {{ item.r7c4 }}
558
+ </td>
559
+ </tr>
560
+ <tr>
561
+ <td>提交人</td>
562
+ <td>{{ item.r8c2 }}</td>
563
+ <td>责任人</td>
564
+ <td class="content">
565
+ {{ item.r8c4 }}
566
+ </td>
567
+ </tr>
568
+ <tr v-if="item.r9c1">
569
+ <td>{{ item.r9c1 }}</td>
570
+ <td>{{ item.r9c2 }}</td>
571
+ <td>{{ item.r9c3 }}</td>
572
+ <td>{{ item.r9c4 }}</td>
573
+ </tr>
574
+ <tr v-if="item.r10c1">
575
+ <td>{{ item.r10c1 }}</td>
576
+ <td>{{ item.r10c2 }}</td>
577
+ <td>{{ item.r10c3 }}</td>
578
+ <td>{{ item.r10c4 }}</td>
579
+ </tr>
580
+
581
+ <tr v-if="item.r12c2">
582
+ <td>{{ item.r12c1 }}</td>
583
+ <td colspan="3">{{ item.r12c2 }}</td>
584
+ </tr>
585
+ <tr>
586
+ <td>备注</td>
587
+ <td colspan="3">{{ item.r13c2 }}</td>
588
+ </tr>
589
+ <tr>
590
+ <td colspan="4">
591
+ <div class="b2bcode" style="margin: 1px">
592
+ <bar-code
593
+ :key="item + new Date()"
594
+ :value="item.r14c1"
595
+ :maxWidth="myWidth"
596
+ :newClass="index"
597
+ ></bar-code>
598
+ </div>
599
+ </td>
600
+ </tr>
601
+ </tbody>
602
+ </table>
603
+ </div>
604
+ <!-- 责废标识卡(为尚工厂) -->
605
+ <div
606
+ class="id-code"
607
+ :style="`width: ${myWidth}; `"
608
+ v-else-if="item.card_state == 'ZEFEI' && item.factoryType == '1'"
609
+ >
610
+ <table
611
+ border="1"
612
+ cellpadding="0"
613
+ style="
614
+ width: 100%;
615
+ border-collapse: collapse;
616
+ border-spacing: 0;
617
+ border-width: 1px;
618
+ text-align: center;
619
+ "
620
+ >
621
+ <tbody>
622
+ <tr>
623
+ <td style="width: 100px">
624
+ <el-image style="height: 20px; margin-top: 5px" :src="C_U" />
625
+ </td>
626
+ <td style="font-size: 23px; width: 120px">
627
+ {{ item.r1c2 }}
628
+ </td>
629
+ <td style="width: 120px">{{ item.r1c3 }}</td>
630
+ <td style="width: 200px">{{ item.r1c4 }}</td>
631
+ </tr>
632
+ <tr>
633
+ <td>{{ item.r2c1 }}</td>
634
+ <td colspan="2">{{ item.r2c2 }}</td>
635
+ <td rowspan="3" colspan="2" class="content">
636
+ <img alt="二维码" :src="item.r2c4" :width="75" style="margin: 1px" />
637
+ </td>
638
+ </tr>
639
+ <tr>
640
+ <td>{{ item.r3c1 }}</td>
641
+ <td colspan="2">{{ item.r3c2 }}</td>
642
+ </tr>
643
+ <tr>
644
+ <td>{{ item.r4c1 }}</td>
645
+ <td colspan="2">{{ item.r4c2 }}</td>
646
+ </tr>
647
+ <tr>
648
+ <td>{{ item.r5c1 }}</td>
649
+ <td colspan="2">{{ item.r5c2 }}</td>
650
+ <td colspan="2" class="content">
651
+ {{ item.r5c4 }}
652
+ </td>
653
+ </tr>
654
+ <tr>
655
+ <td>{{ item.r6c1 }}</td>
656
+ <td>{{ item.r6c2 }}</td>
657
+ <td>{{ item.r6c3 }}</td>
658
+ <td>{{ item.r6c4 }}</td>
659
+ </tr>
660
+ <tr>
661
+ <td>{{ item.r7c1 }}</td>
662
+ <td>{{ item.r7c2 }}</td>
663
+ <td>{{ item.r7c3 }}</td>
664
+ <td>{{ item.r7c4 }}</td>
665
+ </tr>
666
+ <tr>
667
+ <td>{{ item.r8c1 }}</td>
668
+ <td>{{ item.r8c2 }}</td>
669
+ <td>{{ item.r8c3 }}</td>
670
+ <td>{{ item.r8c4 }}</td>
671
+ </tr>
672
+ <tr>
673
+ <td>{{ item.r9c1 }}</td>
674
+ <td>{{ item.r9c2 }}</td>
675
+ <td>{{ item.r9c3 }}</td>
676
+ <td>{{ item.r9c4 }}</td>
677
+ </tr>
678
+ <tr>
679
+ <td>{{ item.r10c1 }}</td>
680
+ <td>{{ item.r10c2 }}</td>
681
+ <td>{{ item.r10c3 }}</td>
682
+ <td>{{ item.r10c4 }}</td>
683
+ </tr>
684
+ <tr>
685
+ <td>{{ item.r11c1 }}</td>
686
+ <td>{{ item.r11c2 }}</td>
687
+ <td>{{ item.r11c3 }}</td>
688
+ <td>{{ item.r11c4 }}</td>
689
+ </tr>
690
+ <tr>
691
+ <td>{{ item.r12c1 }}</td>
692
+ <td>{{ item.r12c2 }}</td>
693
+ <td>{{ item.r12c3 }}</td>
694
+ <td>{{ item.r12c4 }}</td>
695
+ </tr>
696
+ <tr v-if="item.r13c1">
697
+ <td>{{ item.r13c1 }}</td>
698
+ <td>{{ item.r13c2 }}</td>
699
+ <td>{{ item.r13c3 }}</td>
700
+ <td>{{ item.r13c4 }}</td>
701
+ </tr>
702
+
703
+ <tr v-if="item.r14c2">
704
+ <td>{{ item.r14c1 }}</td>
705
+ <td colspan="3">{{ item.r14c2 }}</td>
706
+ </tr>
707
+ <tr>
708
+ <td>{{ item.r15c1 }}</td>
709
+ <td colspan="3">{{ item.r15c2 }}</td>
710
+ </tr>
711
+ <tr>
712
+ <td colspan="4">
713
+ <div class="b2bcode" style="margin: 1px">
714
+ <bar-code
715
+ :key="item + new Date()"
716
+ :value="item.r16c1"
717
+ :maxWidth="myWidth"
718
+ :newClass="index"
719
+ ></bar-code>
720
+ </div>
721
+ </td>
722
+ </tr>
723
+ </tbody>
724
+ </table>
725
+ </div>
726
+ <!-- 返工标识卡(成品工厂) -->
727
+ <div
728
+ class="id-code"
729
+ :style="`width: ${myWidth}; `"
730
+ v-else-if="item.card_state == 'FANGONG' && item.factoryType == '2'"
731
+ >
732
+ <table
733
+ border="1"
734
+ cellpadding="0"
735
+ style="
736
+ width: 100%;
737
+ border-collapse: collapse;
738
+ border-spacing: 0;
739
+ border-width: 1px;
740
+ text-align: center;
741
+ "
742
+ >
743
+ <tbody>
744
+ <tr>
745
+ <td style="width: 100px">
746
+ <el-image style="height: 20px; margin-top: 5px" :src="C_U" />
747
+ </td>
748
+ <td style="font-size: 23px; width: 120px">
749
+ {{ item.r1c2 }}
750
+ </td>
751
+ <td style="width: 120px">{{ item.r1c3 }}</td>
752
+ <td style="width: 200px">{{ item.r1c4 }}</td>
753
+ </tr>
754
+ <tr>
755
+ <td>{{ item.r2c1 }}</td>
756
+ <td colspan="2">{{ item.r2c2 }}</td>
757
+ <td rowspan="3" colspan="2" class="content">
758
+ <img alt="二维码" :src="item.r2c4" :width="75" style="margin: 1px" />
759
+ </td>
760
+ </tr>
761
+ <tr>
762
+ <td>{{ item.r3c1 }}</td>
763
+ <td colspan="2">{{ item.r3c2 }}</td>
764
+ </tr>
765
+ <tr>
766
+ <td>{{ item.r4c1 }}</td>
767
+ <td colspan="2">{{ item.r4c2 }}</td>
768
+ </tr>
769
+ <tr>
770
+ <td>{{ item.r5c1 }}</td>
771
+ <td colspan="2">{{ item.r5c2 }}</td>
772
+ <td colspan="2" class="content">
773
+ {{ item.r5c4 }}
774
+ </td>
775
+ </tr>
776
+ <tr>
777
+ <td>{{ item.r6c1 }}</td>
778
+ <td>{{ item.r6c2 }}</td>
779
+ <td>{{ item.r6c3 }}</td>
780
+ <td>{{ item.r6c4 }}</td>
781
+ </tr>
782
+ <tr>
783
+ <td>{{ item.r7c1 }}</td>
784
+ <td>{{ item.r7c2 }}</td>
785
+ <td>{{ item.r7c3 }}</td>
786
+ <td>{{ item.r7c4 }}</td>
787
+ </tr>
788
+ <tr>
789
+ <td>{{ item.r8c1 }}</td>
790
+ <td>{{ item.r8c2 }}</td>
791
+ <td>{{ item.r8c3 }}</td>
792
+ <td>{{ item.r8c4 }}</td>
793
+ </tr>
794
+ <tr>
795
+ <td>{{ item.r9c1 }}</td>
796
+ <td>{{ item.r9c2 }}</td>
797
+ <td>{{ item.r9c3 }}</td>
798
+ <td>{{ item.r9c4 }}</td>
799
+ </tr>
800
+ <tr>
801
+ <td>{{ item.r10c1 }}</td>
802
+ <td>{{ item.r10c2 }}</td>
803
+ <td>{{ item.r10c3 }}</td>
804
+ <td>{{ item.r10c4 }}</td>
805
+ </tr>
806
+
807
+ <tr>
808
+ <!-- 不良项目 -->
809
+ <td>{{ item.r11c1 }}</td>
810
+ <td colspan="3">{{ item.r11c2 }}</td>
811
+ </tr>
812
+ <tr>
813
+ <!-- 备注 -->
814
+ <td>{{ item.r13c1 }}</td>
815
+ <td colspan="3">{{ item.r13c2 }}</td>
816
+ </tr>
817
+ <tr>
818
+ <td colspan="4">
819
+ <div class="b2bcode" style="margin: 1px">
820
+ <bar-code
821
+ :key="item + new Date()"
822
+ :value="item.r14c1"
823
+ :maxWidth="myWidth"
824
+ :newClass="index"
825
+ ></bar-code>
826
+ </div>
827
+ </td>
828
+ </tr>
829
+ </tbody>
830
+ </table>
831
+ </div>
832
+ <!-- 返工标识卡(为尚工厂) -->
833
+ <div
834
+ class="id-code"
835
+ :style="`width: ${myWidth}; `"
836
+ v-else-if="item.card_state == 'FANGONG' && item.factoryType == '1'"
837
+ >
838
+ <table
839
+ border="1"
840
+ cellpadding="0"
841
+ style="
842
+ width: 100%;
843
+ border-collapse: collapse;
844
+ border-spacing: 0;
845
+ border-width: 1px;
846
+ text-align: center;
847
+ "
848
+ >
849
+ <tbody>
850
+ <tr>
851
+ <td style="width: 100px">
852
+ <el-image style="height: 20px; margin-top: 5px" :src="C_U" />
853
+ </td>
854
+ <td style="font-size: 23px; width: 120px">
855
+ {{ item.r1c2 }}
856
+ </td>
857
+ <td style="width: 120px">{{ item.r1c3 }}</td>
858
+ <td style="width: 200px">{{ item.r1c4 }}</td>
859
+ </tr>
860
+ <tr>
861
+ <td>{{ item.r2c1 }}</td>
862
+ <td colspan="2">{{ item.r2c2 }}</td>
863
+ <td rowspan="3" colspan="2" class="content">
864
+ <img alt="二维码" :src="item.r2c4" :width="75" style="margin: 1px" />
865
+ </td>
866
+ </tr>
867
+ <tr>
868
+ <td>{{ item.r3c1 }}</td>
869
+ <td colspan="2">{{ item.r3c2 }}</td>
870
+ </tr>
871
+ <tr>
872
+ <td>{{ item.r4c1 }}</td>
873
+ <td colspan="2">{{ item.r4c2 }}</td>
874
+ </tr>
875
+ <tr>
876
+ <td>{{ item.r5c1 }}</td>
877
+ <td colspan="2">{{ item.r5c2 }}</td>
878
+ <td colspan="2" class="content">
879
+ {{ item.r5c4 }}
880
+ </td>
881
+ </tr>
882
+ <tr>
883
+ <td>{{ item.r6c1 }}</td>
884
+ <td>{{ item.r6c2 }}</td>
885
+ <td>{{ item.r6c3 }}</td>
886
+ <td>{{ item.r6c4 }}</td>
887
+ </tr>
888
+ <tr>
889
+ <td>{{ item.r7c1 }}</td>
890
+ <td>{{ item.r7c2 }}</td>
891
+ <td>{{ item.r7c3 }}</td>
892
+ <td>{{ item.r7c4 }}</td>
893
+ </tr>
894
+ <tr>
895
+ <td>{{ item.r8c1 }}</td>
896
+ <td>{{ item.r8c2 }}</td>
897
+ <td>{{ item.r8c3 }}</td>
898
+ <td>{{ item.r8c4 }}</td>
899
+ </tr>
900
+ <tr>
901
+ <td>{{ item.r9c1 }}</td>
902
+ <td>{{ item.r9c2 }}</td>
903
+ <td>{{ item.r9c3 }}</td>
904
+ <td>{{ item.r9c4 }}</td>
905
+ </tr>
906
+ <tr>
907
+ <td>{{ item.r10c1 }}</td>
908
+ <td>{{ item.r10c2 }}</td>
909
+ <td>{{ item.r10c3 }}</td>
910
+ <td>{{ item.r10c4 }}</td>
911
+ </tr>
912
+ <tr>
913
+ <td>{{ item.r11c1 }}</td>
914
+ <td>{{ item.r11c2 }}</td>
915
+ <td>{{ item.r11c3 }}</td>
916
+ <td>{{ item.r11c4 }}</td>
917
+ </tr>
918
+ <tr>
919
+ <td>{{ item.r12c1 }}</td>
920
+ <td>{{ item.r12c2 }}</td>
921
+ <td>{{ item.r12c3 }}</td>
922
+ <td>{{ item.r12c4 }}</td>
923
+ </tr>
924
+
925
+ <tr>
926
+ <!-- 不良项目 -->
927
+ <td>{{ item.r13c1 }}</td>
928
+ <td colspan="3">{{ item.r13c2 }}</td>
929
+ </tr>
930
+ <tr>
931
+ <!-- 备注 -->
932
+ <td>{{ item.r14c1 }}</td>
933
+ <td colspan="3">{{ item.r14c2 }}</td>
934
+ </tr>
935
+ <tr>
936
+ <td colspan="4">
937
+ <div class="b2bcode" style="margin: 1px">
938
+ <bar-code
939
+ :key="item + new Date()"
940
+ :value="item.r15c1"
941
+ :maxWidth="myWidth"
942
+ :newClass="index"
943
+ ></bar-code>
944
+ </div>
945
+ </td>
946
+ </tr>
947
+ </tbody>
948
+ </table>
949
+ </div>
950
+ <!-- 装配标识卡(成品工厂--为尚工厂无装配标识卡) -->
951
+ <div
952
+ class="id-code"
953
+ :style="`width: ${myWidth}; `"
954
+ v-else-if="item.card_state == 'ZHUANGPEI' && item.factoryType == '2'"
955
+ >
956
+ <table
957
+ border="1"
958
+ cellpadding="0"
959
+ style="
960
+ width: 100%;
961
+ border-collapse: collapse;
962
+ border-spacing: 0;
963
+ border-width: 1px;
964
+ text-align: center;
965
+ "
966
+ >
967
+ <tbody>
968
+ <tr>
969
+ <td style="width: 100px">
970
+ <el-image style="height: 20px; margin-top: 5px" :src="C_U" />
971
+ </td>
972
+ <td style="font-size: 23px; width: 120px">
973
+ {{ item.r1c2 }}
974
+ </td>
975
+ <td style="width: 120px">{{ item.r1c3 }}</td>
976
+ <td style="width: 200px">{{ item.r1c4 }}</td>
977
+ </tr>
978
+ <tr>
979
+ <td>{{ item.r2c1 }}</td>
980
+ <td colspan="2">{{ item.r2c2 }}</td>
981
+ <td rowspan="3" colspan="2" class="content">
982
+ <img alt="二维码" :src="item.r2c4" :width="75" style="margin: 1px" />
983
+ </td>
984
+ </tr>
985
+ <tr>
986
+ <td>{{ item.r3c1 }}</td>
987
+ <td colspan="2">{{ item.r3c2 }}</td>
988
+ </tr>
989
+ <tr>
990
+ <td>{{ item.r4c1 }}</td>
991
+ <td colspan="2">{{ item.r4c2 }}</td>
992
+ </tr>
993
+ <tr>
994
+ <td>{{ item.r5c1 }}</td>
995
+ <td colspan="2">{{ item.r5c2 }}</td>
996
+ <td colspan="2" class="content">
997
+ {{ item.r5c4 }}
998
+ </td>
999
+ </tr>
1000
+ <tr>
1001
+ <td>{{ item.r6c1 }}</td>
1002
+ <td>{{ item.r6c2 }}</td>
1003
+ <td>{{ item.r6c3 }}</td>
1004
+ <td>{{ item.r6c4 }}</td>
1005
+ </tr>
1006
+ <tr>
1007
+ <td>{{ item.r7c1 }}</td>
1008
+ <td>{{ item.r7c2 }}</td>
1009
+ <td>{{ item.r7c3 }}</td>
1010
+ <td>{{ item.r7c4 }}</td>
1011
+ </tr>
1012
+ <tr>
1013
+ <td>{{ item.r8c1 }}</td>
1014
+ <td>{{ item.r8c2 }}</td>
1015
+ <td>{{ item.r8c3 }}</td>
1016
+ <td>{{ item.r8c4 }}</td>
1017
+ </tr>
1018
+ <tr>
1019
+ <td>{{ item.r9c1 }}</td>
1020
+ <td>{{ item.r9c2 }}</td>
1021
+ <td>{{ item.r9c3 }}</td>
1022
+ <td>{{ item.r9c4 }}</td>
1023
+ </tr>
1024
+ <tr>
1025
+ <td>{{ item.r10c1 }}</td>
1026
+ <td>{{ item.r10c2 }}</td>
1027
+ <td>{{ item.r10c3 }}</td>
1028
+ <td>{{ item.r10c4 }}</td>
1029
+ </tr>
1030
+ <tr>
1031
+ <td>{{ item.r11c1 }}</td>
1032
+ <td>{{ item.r11c2 }}</td>
1033
+ <td>{{ item.r11c3 }}</td>
1034
+ <td>{{ item.r11c4 }}</td>
1035
+ </tr>
1036
+ <tr>
1037
+ <td>{{ item.r12c1 }}</td>
1038
+ <td>{{ item.r12c2 }}</td>
1039
+ <td>{{ item.r12c3 }}</td>
1040
+ <td>{{ item.r12c4 }}</td>
1041
+ </tr>
1042
+ <tr>
1043
+ <td>{{ item.r13c1 }}</td>
1044
+ <td>{{ item.r13c2 }}</td>
1045
+ <td>{{ item.r13c3 }}</td>
1046
+ <td>{{ item.r13c4 }}</td>
1047
+ </tr>
1048
+
1049
+ <tr>
1050
+ <!-- 质检日期 -->
1051
+ <td>{{ item.r14c1 }}</td>
1052
+ <td colspan="3">{{ item.r14c2 }}</td>
1053
+ </tr>
1054
+ <tr>
1055
+ <!-- 备注 -->
1056
+ <td>{{ item.r15c1 }}</td>
1057
+ <td colspan="3">{{ item.r15c2 }}</td>
1058
+ </tr>
1059
+ <!--
1060
+ 装配标识卡无条形码
1061
+ <tr>
1062
+ <td colspan="4">
1063
+ <div
1064
+ class="b2bcode"
1065
+ style="margin: 1px"
1066
+ >
1067
+ <bar-code
1068
+ :key="item + new Date()"
1069
+ :value="item.r15c1"
1070
+ :maxWidth="myWidth"
1071
+ :newClass="index"
1072
+ ></bar-code>
1073
+ </div>
1074
+ </td>
1075
+ </tr> -->
1076
+ </tbody>
1077
+ </table>
1078
+ </div>
1079
+ <!-- 装配标识卡(为尚工厂无装配标识卡) -->
1080
+ <div
1081
+ class="id-code"
1082
+ :style="`width: ${myWidth}; `"
1083
+ v-else-if="item.card_state == 'ZHUANGPEI' && item.factoryType == '1'"
1084
+ >
1085
+ <div>为尚工厂无装配标识卡模板</div>
1086
+ </div>
1087
+
1088
+ <!-- 料废标识卡(成品工厂) -->
1089
+ <div
1090
+ class="id-code"
1091
+ :style="`width: ${myWidth}; `"
1092
+ v-else-if="item.card_state == 'LIAOFEI' && item.factoryType == '2'"
1093
+ >
1094
+ <table
1095
+ border="1"
1096
+ cellpadding="0"
1097
+ style="
1098
+ width: 100%;
1099
+ border-collapse: collapse;
1100
+ border-spacing: 0;
1101
+ border-width: 1px;
1102
+ text-align: center;
1103
+ "
1104
+ >
1105
+ <tbody>
1106
+ <tr>
1107
+ <td style="width: 100px">
1108
+ <el-image style="height: 20px; margin-top: 5px" :src="C_U" />
1109
+ </td>
1110
+ <td style="font-size: 23px; width: 120px">
1111
+ {{ item.r1c2 }}
1112
+ </td>
1113
+ <td style="width: 120px">产品类别</td>
1114
+ <td style="width: 200px">{{ item.r1c4 }}</td>
1115
+ </tr>
1116
+ <tr>
1117
+ <td>物料编码</td>
1118
+ <td colspan="2">{{ item.r2c2 }}</td>
1119
+ <td rowspan="3" colspan="2" class="content">
1120
+ <img alt="二维码" :src="item.r2c4" :width="75" style="margin: 1px" />
1121
+ </td>
1122
+ </tr>
1123
+ <tr>
1124
+ <td>产品型号</td>
1125
+ <td colspan="2">{{ item.r3c2 }}</td>
1126
+ </tr>
1127
+ <tr>
1128
+ <td>流转批号</td>
1129
+ <td colspan="2">{{ item.r4c2 }}</td>
1130
+ </tr>
1131
+ <tr>
1132
+ <td>生产厂商</td>
1133
+ <td colspan="2">{{ item.r5c2 }}</td>
1134
+ <td colspan="2" class="content">
1135
+ {{ item.r5c4 }}
1136
+ </td>
1137
+ </tr>
1138
+ <tr>
1139
+ <td>料废总数</td>
1140
+ <td>{{ item.r6c2 }}</td>
1141
+ <td>工序</td>
1142
+ <td class="content">
1143
+ {{ item.r6c4 }}
1144
+ </td>
1145
+ </tr>
1146
+ <tr>
1147
+ <td>生产日期</td>
1148
+ <td>{{ item.r7c2 }}</td>
1149
+ <td>规值</td>
1150
+ <td class="content">
1151
+ {{ item.r7c4 }}
1152
+ </td>
1153
+ </tr>
1154
+ <tr>
1155
+ <td>规格</td>
1156
+ <td>{{ item.r8c2 }}</td>
1157
+ <td>提交人</td>
1158
+ <td class="content">
1159
+ {{ item.r8c4 }}
1160
+ </td>
1161
+ </tr>
1162
+ <tr>
1163
+ <td>检验员</td>
1164
+ <td>{{ item.r9c2 }}</td>
1165
+ <td v-if="item.r9c3">{{ item.r9c3 }}</td>
1166
+ <td>{{ item.r9c4 }}</td>
1167
+ </tr>
1168
+ <tr v-if="item.r10c1">
1169
+ <td>{{ item.r10c1 }}</td>
1170
+ <td>{{ item.r10c2 }}</td>
1171
+ <td>{{ item.r10c3 }}</td>
1172
+ <td>{{ item.r10c4 }}</td>
1173
+ </tr>
1174
+ <!-- 其他 -->
1175
+ <tr v-if="item.r11c2">
1176
+ <td>{{ item.r11c1 }}</td>
1177
+ <td colspan="3">{{ item.r11c2 }}</td>
1178
+ </tr>
1179
+ <tr>
1180
+ <td>备注</td>
1181
+ <td colspan="3">{{ item.r13c2 }}</td>
1182
+ </tr>
1183
+ <tr>
1184
+ <td colspan="4">
1185
+ <div class="b2bcode" style="margin: 1px">
1186
+ <bar-code
1187
+ :key="item + new Date()"
1188
+ :value="item.r14c1"
1189
+ :maxWidth="myWidth"
1190
+ :newClass="index"
1191
+ ></bar-code>
1192
+ </div>
1193
+ </td>
1194
+ </tr>
1195
+ </tbody>
1196
+ </table>
1197
+ </div>
1198
+ <!-- 料废标识卡(为尚工厂) -->
1199
+ <div
1200
+ class="id-code"
1201
+ :style="`width: ${myWidth}; `"
1202
+ v-else-if="item.card_state == 'LIAOFEI' && item.factoryType == '1'"
1203
+ >
1204
+ <table
1205
+ border="1"
1206
+ cellpadding="0"
1207
+ style="
1208
+ width: 100%;
1209
+ border-collapse: collapse;
1210
+ border-spacing: 0;
1211
+ border-width: 1px;
1212
+ text-align: center;
1213
+ "
1214
+ >
1215
+ <tbody>
1216
+ <tr>
1217
+ <td style="width: 100px">
1218
+ <el-image style="height: 20px; margin-top: 5px" :src="C_U" />
1219
+ </td>
1220
+ <td style="font-size: 23px; width: 120px">
1221
+ {{ item.r1c2 }}
1222
+ </td>
1223
+ <td style="width: 120px">{{ item.r1c3 }}</td>
1224
+ <td style="width: 200px">{{ item.r1c4 }}</td>
1225
+ </tr>
1226
+ <tr>
1227
+ <td>{{ item.r2c1 }}</td>
1228
+ <td colspan="2">{{ item.r2c2 }}</td>
1229
+ <td rowspan="3" colspan="2" class="content">
1230
+ <img alt="二维码" :src="item.r2c4" :width="75" style="margin: 1px" />
1231
+ </td>
1232
+ </tr>
1233
+ <tr>
1234
+ <td>{{ item.r3c1 }}</td>
1235
+ <td colspan="2">{{ item.r3c2 }}</td>
1236
+ </tr>
1237
+ <tr>
1238
+ <td>{{ item.r4c1 }}</td>
1239
+ <td colspan="2">{{ item.r4c2 }}</td>
1240
+ </tr>
1241
+ <tr>
1242
+ <td>{{ item.r5c1 }}</td>
1243
+ <td colspan="2">{{ item.r5c2 }}</td>
1244
+ <td colspan="2" class="content">
1245
+ {{ item.r5c4 }}
1246
+ </td>
1247
+ </tr>
1248
+ <tr>
1249
+ <td>{{ item.r6c1 }}</td>
1250
+ <td>{{ item.r6c2 }}</td>
1251
+ <td>{{ item.r6c3 }}</td>
1252
+ <td>{{ item.r6c4 }}</td>
1253
+ </tr>
1254
+ <tr>
1255
+ <td>{{ item.r7c1 }}</td>
1256
+ <td>{{ item.r7c2 }}</td>
1257
+ <td>{{ item.r7c3 }}</td>
1258
+ <td>{{ item.r7c4 }}</td>
1259
+ </tr>
1260
+ <tr>
1261
+ <td>{{ item.r8c1 }}</td>
1262
+ <td>{{ item.r8c2 }}</td>
1263
+ <td>{{ item.r8c3 }}</td>
1264
+ <td>{{ item.r8c4 }}</td>
1265
+ </tr>
1266
+ <tr>
1267
+ <td>{{ item.r9c1 }}</td>
1268
+ <td>{{ item.r9c2 }}</td>
1269
+ <td>{{ item.r9c3 }}</td>
1270
+ <td>{{ item.r9c4 }}</td>
1271
+ </tr>
1272
+ <tr>
1273
+ <td>{{ item.r10c1 }}</td>
1274
+ <td>{{ item.r10c2 }}</td>
1275
+ <td>{{ item.r10c3 }}</td>
1276
+ <td>{{ item.r10c4 }}</td>
1277
+ </tr>
1278
+ <tr>
1279
+ <td>{{ item.r11c1 }}</td>
1280
+ <td>{{ item.r11c2 }}</td>
1281
+ <td>{{ item.r11c3 }}</td>
1282
+ <td>{{ item.r11c4 }}</td>
1283
+ </tr>
1284
+ <tr>
1285
+ <td>{{ item.r12c1 }}</td>
1286
+ <td>{{ item.r12c2 }}</td>
1287
+ <td></td>
1288
+ <td></td>
1289
+ </tr>
1290
+
1291
+ <tr v-if="item.r13c2">
1292
+ <td>{{ item.r13c1 }}</td>
1293
+ <td colspan="3">{{ item.r13c2 }}</td>
1294
+ </tr>
1295
+ <!-- 备注 -->
1296
+ <tr>
1297
+ <td>{{ item.r14c1 }}</td>
1298
+ <td colspan="3">{{ item.r14c2 }}</td>
1299
+ </tr>
1300
+ <tr>
1301
+ <td colspan="4">
1302
+ <div class="b2bcode" style="margin: 1px">
1303
+ <bar-code
1304
+ :key="item + new Date()"
1305
+ :value="item.r15c1"
1306
+ :maxWidth="myWidth"
1307
+ :newClass="index"
1308
+ ></bar-code>
1309
+ </div>
1310
+ </td>
1311
+ </tr>
1312
+ </tbody>
1313
+ </table>
1314
+ </div>
1315
+
1316
+ <!-- 尾料标识卡(为尚工厂) -->
1317
+ <div class="id-code" :style="`width: ${myWidth}; `" v-else>
1318
+ <div>此标识卡号无打印模板</div>
1319
+ </div>
1320
+ </div>
1321
+ </div>
1322
+ </div>
1323
+ </div>
1324
+ </template>
1325
+
1326
+ <script setup>
1327
+ defineOptions({ name: 'ci-identificationCard' })
1328
+ import { ref, onMounted, nextTick, watch, computed } from 'vue'
1329
+ import barCode from './barCode.vue'
1330
+ // 导入 public/C&U.png 图片
1331
+ import C_U from '@/assets/C&U.png'
1332
+
1333
+ const props = defineProps({
1334
+ value: {
1335
+ type: String,
1336
+ default: ''
1337
+ },
1338
+ // 循环生成的标签数据
1339
+ list: {
1340
+ type: Array,
1341
+ default: []
1342
+ },
1343
+ cardName: {
1344
+ type: String,
1345
+ default: ''
1346
+ },
1347
+ // 循环生成的标签宽度
1348
+ width: {
1349
+ type: String,
1350
+ default: '100%'
1351
+ },
1352
+ // 循环生成的标签高度
1353
+ height: {
1354
+ type: String,
1355
+ default: '100%'
1356
+ }
1357
+ })
1358
+
1359
+ console.log('props', props)
1360
+ console.log(props.cardName)
1361
+ const barcodeCon = ref('')
1362
+ const iframeRef = ref(null)
1363
+
1364
+ const myWidth = ref(props.width)
1365
+ const myHeight = ref(props.height)
1366
+ const w = computed(() => {
1367
+ console.log('props.width', props.width)
1368
+ get: () => props.width
1369
+ })
1370
+ const h = computed(() => {
1371
+ console.log('props.height', props.height)
1372
+ get: () => props.height
1373
+ })
1374
+ // console.log('props', props)
1375
+ // console.log('myWidth: ', myWidth.value)
1376
+ // console.log('myHeight: ', myHeight.value)
1377
+ // console.log('w: ', w)
1378
+ // console.log('h: ', h)
1379
+
1380
+ // 渲染+打印
1381
+ function print() {
1382
+ //赋值:将要打印 dom区域赋值给iframe标签,iframe才是真正的打印区域
1383
+ // barcodeCon.value = `<div class='goudan'>你好啊</div>`
1384
+ // barcodeCon.value = document.getElementById('barcode').innerHTML
1385
+ setTimeout(function () {
1386
+ iframeRef.value.contentWindow.print()
1387
+ // console.log('iframeRef.value', iframeRef.value.contentWindow.document.all)
1388
+ // iframeRef.value.contentWindow.document.execCommand('print')
1389
+ // printTemplate(iframeRef.value.contentWindow.document.all[3])
1390
+ // printWithCustomSize()
1391
+ }, 100)
1392
+ }
1393
+ // 渲染
1394
+ function render() {
1395
+ // 创建一个iframe元素
1396
+ barcodeCon.value = document.getElementById('barcode').innerHTML
1397
+ }
1398
+ // 自动渲染
1399
+ setTimeout(function () {
1400
+ // console.log('渲染')
1401
+ barcodeCon.value = document.getElementById('barcode').innerHTML
1402
+ }, 500)
1403
+
1404
+ defineExpose({
1405
+ print,
1406
+ render
1407
+ })
1408
+
1409
+ const printTemplate = (template) => {
1410
+ console.log('template.innerHTML', template)
1411
+ const printWindow = window.open('', '_blank')
1412
+ printWindow.document.open()
1413
+ printWindow.document.write(`
1414
+ <html>
1415
+ <head>
1416
+ <style>
1417
+ @media print {
1418
+ @page {
1419
+ size: 200mm 300mm;
1420
+ }
1421
+ }
1422
+ </style>
1423
+ </head>
1424
+ <body>
1425
+ ${template.innerHTML}
1426
+ </body>
1427
+ </html>
1428
+ `)
1429
+ printWindow.document.close()
1430
+ printWindow.print()
1431
+ printWindow.close()
1432
+ }
1433
+ function printWithCustomSize() {
1434
+ window.print({
1435
+ printParams: {
1436
+ pages: '1',
1437
+ margin: '1cm',
1438
+ pageRanges: '1-1',
1439
+ scale: 1,
1440
+ media: {
1441
+ name: 'Custom',
1442
+ width: 300,
1443
+ height: 400
1444
+ },
1445
+ landscape: false,
1446
+ displayHeaderFooter: false,
1447
+ printBackground: true,
1448
+ ignorePrintExperience: true,
1449
+ silent: true,
1450
+ printWithJs: true
1451
+ }
1452
+ })
1453
+ }
1454
+ </script>
1455
+
1456
+ <style>
1457
+ .goudan {
1458
+ color: red;
1459
+ font-size: 60px;
1460
+ }
1461
+ /* @media print {
1462
+ .page-break {
1463
+ page-break-before: always;
1464
+ }
1465
+ }
1466
+ .page-break {
1467
+ page-break-before: always;
1468
+ } */
1469
+ </style>