-
admin
2024-05-17 1ccd6932893e47722574e6d1147e63b2ec4972c1
提交 | 用户 | 时间
e57a89 1 <template>
2   <div class="app-container">
3     <el-card class="box-card">
4     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
5       <el-form-item label-width="80" label="生产工单号" prop="workOrderNo">
6         <el-input
7           v-model="queryParams.workOrderNo"
8           placeholder="请输入生产工单号"
9           clearable
10           @keyup.enter.native="handleQuery"
11         />
12       </el-form-item>
13       <el-form-item label="产品名称" prop="productName">
14         <el-input
15           v-model="queryParams.productName"
16           placeholder="请输入产品名称"
17           clearable
18           @keyup.enter.native="handleQuery"
19         />
20       </el-form-item>
21       <el-form-item label="工单状态" prop="orderStatus">
22         <el-select v-model="queryParams.orderStatus" placeholder="请选择工单状态" clearable>
23           <el-option
24             v-for="dict in dict.type.order_state"
25             :key="dict.value"
26             :label="dict.label"
27             :value="dict.value"
28           />
29         </el-select>
30       </el-form-item>
288790 31       <div style="display: none">
A 32         <div id="printMe" style="width: 500px;">
33           <div ref="canvasWrapper" id="canvasWrapper" style="display: flex;justify-content: center;"></div>
34           <p style="font-size: 10px;word-break: break-all;display: flex;justify-content: center;">{{packCode}}</p>
35         </div>
36         <el-button @click="print">打印</el-button>
37         <el-button @click="test1">生成二维码</el-button>
38       </div>
e57a89 39       <el-form-item style="float: right">
40         <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
41         <el-button type="warning" icon="el-icon-copy-document" size="mini" @click="advancedQuery">高级查询</el-button>
42         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
43       </el-form-item>
44     </el-form>
45     <el-form :model="queryParams" ref="queryParams" size="small" :inline="true" v-show="advancedShowSearch" label-width="68px">
46       <el-form-item style="margin-left: 14px" label="产品编号" prop="productCode">
47         <el-input
48           v-model="queryParams.productCode"
648160 49           placeholder="请输入产品序列号"
e57a89 50           clearable
51           @keyup.enter.native="handleQuery"
52         />
53       </el-form-item>
54       <el-form-item label="订单编号" prop="salesOrderCode">
55         <el-input
56           v-model="queryParams.salesOrderCode"
57           placeholder="请输入订单编号"
58           clearable
59           @keyup.enter.native="handleQuery"
60         />
61       </el-form-item>
648160 62       <el-form-item label="工厂编号" prop="siteCode">
e57a89 63         <el-input
648160 64           v-model="queryParams.siteCode"
H 65           placeholder="请输入工厂编号"
e57a89 66           clearable
67           @keyup.enter.native="handleQuery"
68         />
69       </el-form-item>
648160 70       <el-form-item label="工站编号" prop="stationCode">
e57a89 71         <el-input
648160 72           v-model="queryParams.stationCode"
H 73           placeholder="请输入工站编号"
e57a89 74           clearable
75           @keyup.enter.native="handleQuery"
76         />
77       </el-form-item>
78     </el-form>
79     </el-card>
80
81     <el-card style="margin-top: 10px" class="box-card">
82     <el-row :gutter="10" class="mb8">
83       <el-col :span="1.5">
84         <el-button
85           type="primary"
86           plain
87           icon="el-icon-plus"
88           size="mini"
89           @click="handleAdd"
90           v-hasPermi="['om:productionOrde:add']"
91         >新增</el-button>
92       </el-col>
93       <el-col :span="1.5">
94         <el-button
95           type="success"
96           plain
97           icon="el-icon-edit"
98           size="mini"
99           :disabled="single"
100           @click="handleUpdate"
101           v-hasPermi="['om:productionOrde:edit']"
102         >修改</el-button>
103       </el-col>
104       <el-col :span="1.5">
105         <el-button
106           type="danger"
107           plain
108           icon="el-icon-delete"
109           size="mini"
110           :disabled="multiple"
111           @click="handleDelete"
112           v-hasPermi="['om:productionOrde:remove']"
113         >删除</el-button>
42cfe3 114         <el-button
115           type="info"
116           icon="el-icon-upload2"
117           size="mini"
118           @click="handleImport"
119         >导入</el-button>
e57a89 120       </el-col>
42cfe3 121       <el-col :span="1.5">
122         <el-button
123           type="warning"
124           plain
125           icon="el-icon-download"
126           size="mini"
127           @click="handleExport"
128           v-hasPermi="['om:productionOrde:export']"
129         >导出</el-button>
130       </el-col>
e70fb4 131       <el-col :span="1.5">
A 132         <el-button
133           type="warning"
134           plain
135           icon="el-icon-download"
136           size="mini"
c860ca 137           @click="getWorkOrders"
e70fb4 138         >接收</el-button>
A 139       </el-col>
e57a89 140       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
141     </el-row>
142
143       <el-table border v-loading="loading" :data="productionOrdeList" @selection-change="handleSelectionChange">
144         <el-table-column type="selection" width="55" align="center" />
145         <el-table-column label="生产工单号" width="160" align="center">
146           <template slot-scope="scope">
147             <router-link :to="{path: '/main/workReport-data/index/', query: {workOrderNo: scope.row.workOrderNo} }" class="link-type">
148               <span>{{ scope.row.workOrderNo }}</span>
149             </router-link>
150           </template>
151         </el-table-column>
42cfe3 152 <!--        <el-table-column label="订单编号" width="140" align="center" prop="salesOrderCode">-->
153 <!--        </el-table-column>-->
a75d86 154         <el-table-column :show-overflow-tooltip='true' label="pack码" width="160" align="center" prop="productNum">
A 155         </el-table-column>
156         <el-table-column :show-overflow-tooltip='true' label="小车码" width="160" align="center" prop="trolleyYard">
157         </el-table-column>
49c784 158         <el-table-column label="产品编号" width="110" align="center" prop="productCode">
e57a89 159         </el-table-column>
648160 160         <el-table-column label="产品名称" width="120" align="center" prop="productName">
e57a89 161         </el-table-column>
49c784 162         <el-table-column label="产品序列号" width="110" align="center" prop="productNum">
163         </el-table-column>
b64ed2 164         <el-table-column label="产品型号" align="center" prop="productModel">
165         </el-table-column>
648160 166         <el-table-column label="工单状态" width="100" align="center" prop="orderStatus">
e57a89 167           <template slot-scope="scope">
168             <dict-tag :options="dict.type.order_state" :value="scope.row.orderStatus"/>
169           </template>
170         </el-table-column>
42cfe3 171 <!--        <el-table-column label="工厂编号" align="center" prop="siteCode">-->
172 <!--        </el-table-column>-->
648160 173         <el-table-column label="工站编号" align="center" prop="stationCode">
e57a89 174         </el-table-column>
648160 175         <el-table-column label="报工信息结果" width="110" align="center" prop="resultText">
e57a89 176         </el-table-column>
648160 177         <el-table-column label="报工结果代码" width="110" align="center" prop="resultCode">
e57a89 178         </el-table-column>
648160 179         <el-table-column label="是否报工" width="80" align="center" prop="sfResult">
e57a89 180         </el-table-column>
181         <el-table-column label="实际开始时间" width="160" align="center" prop="actualStartTime">
182         </el-table-column>
648160 183         <el-table-column label="当前站点报工时间" width="160" align="center" prop="actualEndTime">
e57a89 184         </el-table-column>
185         <el-table-column label="创建人" width="80" align="center" prop="createUser">
186         </el-table-column>
187         <el-table-column label="备注" width="100" align="center" prop="remarks">
188         </el-table-column>
189       </el-table>
190     </el-card>
191
192
193     <pagination
194       v-show="total>0"
195       :total="total"
196       :page.sync="queryParams.pageNum"
197       :limit.sync="queryParams.pageSize"
198       @pagination="getList"
199     />
200
201     <!-- 添加或修改生产工单对话框 -->
648160 202     <el-dialog v-dialogpop-up :title="title" :visible.sync="open" width="500px" append-to-body>
e57a89 203        <span slot="title">
204         <i class="el-icon-s-order"></i>
205         {{titleName}}
206       </span>
648160 207       <el-form ref="form" inline :model="form" :rules="rules" label-width="100px">
H 208         <el-form-item label="生产工单号" prop="workOrderNo">
209           <el-input style="width: 265px" v-model="form.workOrderNo" placeholder="请输入生产工单号" />
e57a89 210         </el-form-item>
211         <el-form-item label="订单编号" prop="salesOrderCode">
648160 212           <el-input style="width: 265px" v-model="form.salesOrderCode" placeholder="请输入订单编号" />
e57a89 213         </el-form-item>
648160 214         <el-form-item label="产品序列号" prop="productNum">
e57a89 215           <el-input v-model="form.productCode" placeholder="请选择产品" >
216             <el-button slot="append" @click="handleSelectProduct" icon="el-icon-search"></el-button>
217           </el-input>
218           <ItemSelect ref="itemSelect" @onSelected="onItemSelected" > </ItemSelect>
219         </el-form-item>
220         <el-form-item label="产品名称" prop="productName">
648160 221           <el-input style="width: 265px" v-model="form.productName" disabled placeholder="请输入产品名称" />
e57a89 222         </el-form-item>
b64ed2 223         <el-form-item label="产品型号" prop="productModel">
224           <el-input v-model="form.productModel" placeholder="请输入产品型号" />
225         </el-form-item>
648160 226         <el-form-item label="工厂编号" prop="siteCode">
H 227           <el-input style="width: 265px" v-model="form.siteCode" placeholder="请输入工厂编号" />
e57a89 228         </el-form-item>
648160 229         <el-form-item label="工站编号" prop="stationCode">
H 230           <el-input style="width: 265px"v-model="form.stationCode" placeholder="请输入工站编号" />
e57a89 231         </el-form-item>
648160 232         <el-form-item label="备注" prop="remarks">
H 233           <el-input style="width: 265px" v-model="form.remarks" placeholder="请输入备注" />
e57a89 234         </el-form-item>
235
236       </el-form>
237       <div slot="footer" class="dialog-footer">
238         <el-button type="primary" @click="submitForm">确 定</el-button>
239         <el-button @click="cancel">取 消</el-button>
240       </div>
241     </el-dialog>
242
42cfe3 243     <!-- 用户导入对话框 -->
244     <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px">
245       <el-upload
246         ref="upload"
247         :limit="1"
248         accept=".xlsx, .xls"
249         :headers="upload.headers"
250         :action="upload.url + '?updateSupport=' + upload.updateSupport"
251         :disabled="upload.isUploading"
252         :on-progress="handleFileUploadProgress"
253         :on-success="handleFileSuccess"
254         :auto-upload="false"
255         drag
256       >
257         <i class="el-icon-upload"></i>
258         <div class="el-upload__text">
259           将文件拖到此处,或
260           <em>点击上传</em>
261         </div>
262         <div class="el-upload__tip" slot="tip">
263           <el-checkbox v-model="upload.updateSupport" />是否更新已经存在的用户数据
264           <el-link type="info" style="font-size:12px" @click="importTemplate">下载模板</el-link>
265         </div>
266         <div class="el-upload__tip" style="color:red" slot="tip">提示:仅允许导入“xls”或“xlsx”格式文件!</div>
267       </el-upload>
268       <div slot="footer" class="dialog-footer">
269         <el-button type="primary" @click="submitFileForm">确 定</el-button>
270         <el-button @click="upload.open = false">取 消</el-button>
271       </div>
272     </el-dialog>
273
e57a89 274   </div>
275 </template>
276
277 <script>
42cfe3 278 import { getToken } from "@/utils/auth";
e57a89 279 import { listLineInfo } from "@/api/main/bs/lineInfo/lineInfo";
280 import { listWorkshop } from "@/api/main/bs/workshop/workshop";
281 import { listProductBom } from "@/api/main/bs/ProductBom/ProductBom";
282 import { listTechnologyRoute} from "@/api/main/bs/technologyRoute/technologyRoute";
283 import ItemSelect  from "@/components/itemSelect/single.vue";
c860ca 284 import {
A 285   importTemplate,
286   upDownMove,
287   listProductionOrde,
288   getProductionOrde,
289   delProductionOrde,
290   addProductionOrde,
291   updateProductionOrde,
292   receivingWorkOrders
293 } from "@/api/main/om/productionOrde/productionOrde";
288790 294 import QRCode from "qrcodejs2";
e57a89 295
296 export default {
297   name: "ProductionOrde",
298   dicts: ['order_state'],
299   components: {
300     ItemSelect ,
301   },
302   data() {
303     return {
288790 304       // packCode: '0RSPB001139E3AE4X0000011',
A 305       packCode: 'test111',
e57a89 306       titleName: '',
307       options: [],
308       lineOptions: [],
309       showFlag:false,
310       advancedShowSearch: false,
311       workOrder: {
312         status: 'ss'
313       },
314       // 遮罩层
315       loading: true,
316       // 选中数组
317       ids: [],
318       // 非单个禁用
319       single: true,
320       // 非多个禁用
321       multiple: true,
322       move: true,
323       selectedRowIndex: -1, // 存储选中行的索引
324       // 显示搜索条件
325       showSearch: true,
326       // 总条数
327       total: 0,
328       // 生产工单表格数据
329       productionOrdeList: [],
330       // 弹出层标题
331       title: "",
332       // 是否显示弹出层
333       open: false,
334       // 查询参数
335       queryParams: {
336         pageNum: 1,
337         pageSize: 10,
338         workOrderNo: null,
339         salesOrderCode: null,
340         productCode: null,
341         productName: null,
342         workshopCode: null,
343         lineCode: null,
344         routeCode: null,
345         bomCode: null,
346         recipeCode: null,
347         orderStatus: null,
348         custom: null,
349         marketAreaCode: null,
350         softwareVersionCode: null,
351         productCompanyCode: null,
352         frontEndId: 0,
353         idNums: null,
354         flag: null,
b64ed2 355         siteCode: null,
356         productNum: null,
357         stationCode: null,
358         resultText: null,
359         resultCode: null,
360         sfResult: null,
361         productModel: null
362
e57a89 363       },
364       // 表单参数
365       form: {},
366       updateStatusParameter: {
367         id: null,
368         orderStatus: null
369       },
370       // 表单校验
371       rules: {
372         id: [
373           { required: true, message: "ID不能为空", trigger: "blur" }
374         ],
42cfe3 375       },
376       // 用户导入参数
377       upload: {
378         // 是否显示弹出层(用户导入)
379         open: false,
380         // 弹出层标题(用户导入)
381         title: "",
382         // 是否禁用上传
383         isUploading: false,
384         // 是否更新已经存在的用户数据
385         updateSupport: 0,
386         // 设置上传的请求头部
387         headers: { Authorization: "Bearer " + getToken() },
388         // 上传的地址
389         url: process.env.VUE_APP_BASE_API + "/om/productionOrde/importData"
390       },
e57a89 391     };
392   },
393   created() {
394     this.getList();
395     this.initWorkshop();
396   },
288790 397   mounted() {
A 398     this.test1()
399   },
e57a89 400   methods: {
288790 401      async getWorkOrders(){
A 402       await receivingWorkOrders().then(response => {
c860ca 403         this.getList()
288790 404         this.packCode = response.msg;
A 405         this.test1()
c860ca 406       });
288790 407       setTimeout(() => {
A 408         this.print()
409       },50)
410     },
411      print() {
412       // 本页面直接打印(有bug单岁先不要删)
413       // let oldStr = window.document.body.innerHTML;
414       // let newStr = document.getElementById('printMe').innerHTML;
415       // document.body.innerHTML = newStr;
416       // window.print();
417       // document.body.innerHTML = oldStr;
418       // return false;
419
420       // 新开页面打印
421       //  document.getElementById('canvasWrapper').innerHTML = '';
422       let newStr = document.getElementById('printMe').innerHTML;
423       let newWin = window.open('', '_blank');
424       newWin.document.body.innerHTML = newStr;
425       newWin.print();
426       return false;
427     },
428     test1(){
429       document.getElementById('canvasWrapper').innerHTML = ''
430       this.$nextTick(() => {
431         let qrCode = new QRCode('canvasWrapper',{
432           width: 80,
433           height: 80,
434           padding: 0,
435           margin: 0,
436           text: this.packCode,
437           colorDark: '#000',
438           colorLight: '#fff'
439         })
440       })
441       // console.log(this.packCode)
442       // this.print()
e70fb4 443     },
42cfe3 444     /** 导入按钮操作 */
445     handleImport() {
446       this.upload.title = "订单信息导入";
447       this.upload.open = true;
448     },
449     /** 下载模板操作 */
450     importTemplate() {
451       this.download('om/productionOrde/importTemplate', {
452       }, `productionOrde_template_${new Date().getTime()}.xlsx`)
453     },
454 // 文件上传中处理
455     handleFileUploadProgress(event, file, fileList) {
456       this.upload.isUploading = true;
457     },
458 // 文件上传成功处理
459     handleFileSuccess(response, file, fileList) {
460       this.upload.open = false;
461       this.upload.isUploading = false;
462       this.$refs.upload.clearFiles();
463       this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true });
464       this.getList();
465     },
466 // 提交上传文件
467     submitFileForm() {
468       this.$refs.upload.submit();
e57a89 469     },
470     initWorkshop(){
471       listWorkshop(this.queryParams).then(response => {
472         this.options = response.rows;
473       });
474     },
475     // 在这里编写处理选中事件的逻辑
476     handleSelectChange(selectedOption) {
477       this.form.lineCode = null;
478       let params = {
479         workshopCode: selectedOption
480       };
481       listLineInfo(params).then(response => {
482         this.lineOptions = response.rows;
483       });
484     },
485     //物料选择弹出框
486     onItemSelected(obj){
487       if(obj !== undefined && obj !== null){
488         let productCode = obj.materialCode;
489         this.form.productCode = productCode;
490         this.form.productName = obj.materialName;
491         this.queryParams.productCode = productCode
492         listTechnologyRoute(this.queryParams).then(response => {
493           this.form.routeCode = response.rows[0].routeCode;
494         });
495         listProductBom(this.queryParams).then(response => {
496           this.form.bomCode = response.rows[0].bomCode;
497         });
498       }
499     },
500     handleSelectProduct(){
501       this.$refs.itemSelect.showFlag = true;
502     },
503     advancedQuery(){
504       this.advancedShowSearch = (this.advancedShowSearch) ? this.advancedShowSearch = false : this.advancedShowSearch = true;
505     },
506     handleCommand(status,id) {
507       console.log(status)
508       this.updateStatusParameter.id = id;
509       this.updateStatusParameter.orderStatus = status;
510       updateProductionOrde(this.updateStatusParameter).then(response => {
511         this.$modal.msgSuccess("修改成功");
512         this.open = false;
513         this.getList();
514       });
515     },
516     /** 查询生产工单列表 */
517     getList() {
518       this.loading = true;
519       listProductionOrde(this.queryParams).then(response => {
520         this.productionOrdeList = response.rows;
521         this.total = response.total;
522         this.loading = false;
523       });
524     },
525     // 取消按钮
526     cancel() {
527       this.open = false;
528       this.reset();
529     },
530     // 表单重置
531     reset() {
532       this.form = {
533         id: null,
534         workOrderNo: null,
535         salesOrderCode: null,
536         productCode: null,
537         productName: null,
538         workshopCode: null,
539         lineCode: null,
540         routeCode: null,
541         bomCode: null,
542         recipeCode: null,
543         planQty: null,
544         actualQty: null,
545         badQty: null,
546         scrapQty: null,
547         repairQty: null,
548         actualOnlineQty: null,
549         onlineCompletionMark: null,
550         demandDate: null,
551         planStartTime: null,
552         planEndTime: null,
553         actualStartTime: null,
554         actualEndTime: null,
555         serialNumber: null,
556         orderStatus: null,
557         createTime: null,
558         updateTime: null,
559         createUser: null,
560         updateUser: null,
561         remarks: null,
562         streamNumber: null,
563         custom: null,
564         marketAreaCode: null,
565         softwareVersionCode: null,
566         productCompanyCode: null,
a75d86 567         trolleyYard: null,
e57a89 568         spareField2: null,
569         spareField3: null,
648160 570         spareField4: null,
H 571         siteCode: null,
572         productNum: null,
573         stationCode: null,
574         resultText: null,
575         resultCode: null,
576         sfResult: null
e57a89 577       };
578       this.resetForm("form");
579     },
580     /** 搜索按钮操作 */
581     handleQuery() {
582       this.queryParams.pageNum = 1;
583       this.getList();
584     },
585     /** 重置按钮操作 */
586     resetQuery() {
587       this.resetForm("queryForm");
588       this.handleQuery();
589     },
590     // 多选框选中数据
591     handleSelectionChange(selection) {
592       this.ids = selection.map(item => item.id)
593       this.move = selection.length!==1
594       if(!selection.length){
595         this.single = true
596         this.multiple = true
597       }else {
598         if(selection[0].orderStatus === '1' && selection.length === 1){
599           this.single = false
600           this.multiple = false
601         }
602       }
603
604     },
605     /** 新增按钮操作 */
606     handleAdd() {
607       this.initWorkshop();
608       this.reset();
609       this.open = true;
610       this.titleName = "添加生产工单";
611     },
612     /** 修改按钮操作 */
613     handleUpdate(row) {
614       this.initWorkshop();
615       this.reset();
616       const id = row.id || this.ids
617       getProductionOrde(id).then(response => {
618         console.log(response.data)
619         this.form = response.data;
620         this.open = true;
621         this.titleName = "修改生产工单";
622       });
623     },
624     /** 提交按钮 */
625     submitForm() {
626       this.$refs["form"].validate(valid => {
627         if (valid) {
628           if (this.form.id != null) {
629             updateProductionOrde(this.form).then(response => {
630               this.$modal.msgSuccess("修改成功");
631               this.open = false;
632               this.getList();
633             });
634           } else {
635             addProductionOrde(this.form).then(response => {
636               this.$modal.msgSuccess("新增成功");
637               this.open = false;
638               this.getList();
639             });
640           }
641         }
642       });
643     },
644     /** 删除按钮操作 */
645     handleDelete(row) {
646       const ids = row.id || this.ids;
647       this.$modal.confirm('是否确认删除生产工单编号为"' + ids + '"的数据项?').then(function() {
648         return delProductionOrde(ids);
649       }).then(() => {
650         this.getList();
651         this.$modal.msgSuccess("删除成功");
652       }).catch(() => {});
653     },
654     /** 导出按钮操作 */
655     handleExport() {
656       this.download('om/productionOrde/export', {
657         ...this.queryParams
658       }, `productionOrde_${new Date().getTime()}.xlsx`)
659     }
660   }
661 };
662 </script>
663 <style lang="scss" scoped>
664 //::v-deep .el-dialog__header{
665 //  /*background-color: #f8f8f8;*/
666 //  background-color: #f8f8f9;
667 //}
668 </style>