ci-plus 1.5.4 → 1.5.6

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