admin
2024-07-11 09ceef0603c39adc3b00650c33e9bb945e0ad2dd
提交 | 用户 | 时间
0ca254 1 <template>
A 2   <div class="app-container">
3    <el-row :gutter="5">
4      <el-col :span="7">
5        <el-card shadow="never">
6          <span class="head-font">工位编号 : {{headContent.processesCode}}</span>
7        </el-card>
8      </el-col>
9      <el-col :span="7">
10        <el-card shadow="never">
11          <span class="head-font">工位名称 : {{headContent.processesName}}</span>
12        </el-card>
13      </el-col>
14      <el-col :span="10">
15        <el-card shadow="never">
16          <span class="head-font">产品序列号 : {{headContent.sfcCode}}</span>
17 <!--         <el-input v-model="content" style="float: right;width: 150px;" placeholder="请输入内容"></el-input>-->
18 <!--         <el-button @click="scanCompleted" style="float: right" type="primary">扫码完成</el-button>-->
19          <el-button type="primary" style="float: right" icon="el-icon-search" size="mini" @click="serialLink">串口连接</el-button>
20          <el-button @click="clearClick" style="float: right" type="danger" size="mini">清除</el-button>
21        </el-card>
22      </el-col>
23
24    </el-row>
25    <el-row :gutter="5" style="margin-top: 5px">
26      <el-col :span="7" >
27        <el-card class="bottom-card">
28          <div slot="header" class="clearfix">
29            <i class="el-icon-tickets"></i>
30            <span style="font-weight: bold">当前工件信息</span>
31          </div>
32          <el-descriptions :column="1" border :content-style="{'min-width': '140px'}">
33 <!--         <el-descriptions :column="1" :label-style="{'font-size': '15px'}" border :content-style="{'min-width': '150px'}">-->
34            <el-descriptions-item label="工单编号">
35                <span>{{workpieceInformation.workOrderNo}}</span>
36            </el-descriptions-item>
37            <el-descriptions-item label="产品型号">
38              <span>{{workpieceInformation.productCode}}</span>
39            </el-descriptions-item>
40            <el-descriptions-item label="小车码">
41              <span>{{headContent.cardCode}}</span>
42            </el-descriptions-item>
43 <!--           <el-descriptions-item label="产品型号">-->
44 <!--             <span>{{workpieceInformation.productModel}}</span>-->
45 <!--           </el-descriptions-item>-->
46 <!--           <el-descriptions-item label="产品名称">-->
47 <!--             <span>{{workpieceInformation.productName}}</span>-->
48 <!--           </el-descriptions-item>-->
49            <el-descriptions-item label="开始时间">
50              <span>{{workpieceInformation.inboundTime}}</span>
51            </el-descriptions-item>
52          </el-descriptions>
53          <el-divider></el-divider>
54          <el-row>
55            <el-col :span="12">
56              <el-button class="circle-button" :class="cakeLamp.plcState ? 'circle-green-animate':'circle-red'" circle></el-button>
57              <span style="display: none">{{cakeLamp.plcState}}</span>
58              <span>&nbsp;PLC状态</span>
59            </el-col>
60            <el-col :span="12">
61              <el-button class="circle-button" :class="cakeLamp.scannerState ? 'circle-green-animate':'circle-red'" circle></el-button>
62              <span style="display: none">{{cakeLamp.scannerState}}</span>
63              <span>&nbsp;扫码枪状态</span>
64            </el-col>
65          </el-row>
66          <el-row style="margin-top: 20px">
67            <el-col :span="12">
68              <el-button class="circle-button" :class="cakeLamp.InPlace ? 'circle-green':'circle-red'" circle></el-button>
69              <span style="display: none">{{cakeLamp.InPlace}}</span>
70              <span>&nbsp;工件到位</span>
71            </el-col>
72            <el-col :span="12">
73              <el-button class="circle-button" :class="cakeLamp.scanFinish ? 'circle-green':'circle-red'" circle></el-button>
74              <span style="display: none">{{cakeLamp.scanFinish}}</span>
75              <span>&nbsp;扫码完成</span>
76            </el-col>
77          </el-row>
78          <el-row style="margin-top: 20px">
79            <el-col :span="12">
80              <el-button class="circle-button" :class="cakeLamp.startWork ? 'circle-green':'circle-red'" circle></el-button>
81              <span style="display: none">{{cakeLamp.startWork}}</span>
82              <span>&nbsp;开始作业</span>
83            </el-col>
84            <el-col :span="12">
85              <el-button class="circle-button" :class="cakeLamp.release ? 'circle-green':'circle-red'" circle></el-button>
86              <span style="display: none">{{cakeLamp.release}}</span>
87              <span>&nbsp;允许放行</span>
88            </el-col>
89          </el-row>
22c9e0 90          <el-row v-show="orderFlag" style="margin-top: 20px">
A 91            <el-button @click="getWorkOrders" type="warning" size="mini">接收工单</el-button>
0ca254 92          </el-row>
A 93 <!--         <el-row v-show="showInput" style="margin-top: 20px">-->
94 <!--           <el-button @click="bindYzSfc" type="primary">绑定</el-button>-->
95 <!--         </el-row>-->
96
97 <!--         <el-row v-show="onLineBinDing" style="margin-top: 20px">-->
98 <!--           <el-col></el-col>-->
99 <!--           <span style="width: 130px;" class="head-font">小车码 : {{headContent.cardCode}}</span>-->
100 <!--         </el-row>-->
101 <!--         <el-row v-show="onLineBinDing" style="margin-top: 20px">-->
102 <!--           <el-button @click="bindcardCode" type="primary">绑定</el-button>-->
103 <!--         </el-row>-->
104        </el-card>
105
106      </el-col>
107      <el-col :span="17">
108        <el-tabs type="border-card"  style="height: 600px" v-model="activeName" @tab-click="changeMenu">
109          <el-tab-pane name="first">
110            <span slot="label"> <a class="el-icon-date"></a>首页</span>
111            <el-col :span="24">
112              <el-table height="500" :cell-style="rowStyle" :data="formulaChildList">
113 <!--               <el-table-column label="排序" width="60" align="center" type="index">-->
114 <!--               </el-table-column>-->
115                <el-table-column label="拧紧步号" width="80" align="center" prop="stepSort">
116                </el-table-column>
117                <el-table-column label="操作内容" align="center" prop="operationSteps">
118                </el-table-column>
119 <!--               <el-table-column label="上限" width="60" align="center" prop="spareField3">-->
120 <!--               </el-table-column>-->
121 <!--               <el-table-column label="下限" width="60" align="center" prop="spareField4">-->
122 <!--               </el-table-column>-->
123                <el-table-column label="产品编号" width="80" align="center" prop="productCode">
124                </el-table-column>
125                <el-table-column label="物料编码" width="110" align="center" prop="materialCode">
126                </el-table-column>
127                <el-table-column label="采集值" align="center" prop="collectData">
128                </el-table-column>
129                <el-table-column label="结果" width="60" align="center" prop="results">
130                </el-table-column>
131
132              </el-table>
133            </el-col>
134 <!--           <el-col :span="14">-->
135 <!--             <el-image style="height: 520px;width: 100%" :src="imgSrc"></el-image>-->
136 <!--           </el-col>-->
137          </el-tab-pane>
138 <!--         <el-tab-pane name="second">-->
139 <!--           <span slot="label"> <b class="el-icon-date"></b>物料BOM</span>-->
140 <!--           <el-empty>-->
141 <!--             <span slot="description">暂无数据</span>-->
142 <!--           </el-empty>-->
143 <!--         </el-tab-pane>-->
144 <!--         <el-tab-pane name="third">-->
145 <!--           <span slot="label"> <b class="el-icon-date"></b>采集清单</span>-->
146 <!--           <el-empty>-->
147 <!--             <span slot="description">暂无数据</span>-->
148 <!--           </el-empty>-->
149 <!--         </el-tab-pane>-->
150 <!--         <el-tab-pane name="fourth">-->
151 <!--           <span slot="label"> <b class="el-icon-date"></b>安灯状态</span>-->
152 <!--           <el-empty>-->
153 <!--             <span slot="description">暂无数据</span>-->
154 <!--           </el-empty>-->
155 <!--         </el-tab-pane>-->
156 <!--         <el-tab-pane name="fifth">-->
157 <!--           <span slot="label"> <b class="el-icon-date"></b>工艺配方</span>-->
158 <!--           <el-empty>-->
159 <!--             <span slot="description">暂无数据</span>-->
160 <!--           </el-empty>-->
161 <!--         </el-tab-pane>-->
162        </el-tabs>
163      </el-col>
164    </el-row>
165     <el-dialog v-dialogpop-up :title="title" :visible.sync="open1" width="1000" append-to-body>
166       <el-row
167         type="flex"
168         class="row-bg"
169         justify="center"
170         v-show="portsList.length === 0"
171       >
172         <el-col :span="7">
173           <div style="margin-top: 400px">
174           <span style="display: block">
175             仅支持Chrome 89+或者Edge 89+浏览器(安全上下文(HTTPS)中可用)
176           </span>
177             <el-button type="primary" @click="obtainAuthorization">授权</el-button>
178           </div>
179         </el-col>
180       </el-row>
181       <el-form
182         v-show="portsList.length > 0"
183         ref="form1"
184         :model="form1"
185         label-width="100px">
186         <el-row>
187           <el-col :span="24"
188           ><div>
189             <el-form-item label="串口">
190               <el-select
191                 v-model="form1.port"
192                 filterable
193                 placeholder="请选择串口"
194                 :disabled="isDisable"
195               >
196                 <el-option
197                   v-for="item in portsList"
198                   :key="item.value"
199                   :label="item.label"
200                   :value="item.value"
201                 >
202                 </el-option>
203               </el-select>
204             </el-form-item>
205             <el-form-item label="波特率">
206               <el-autocomplete
207                 popper-class="my-autocomplete"
208                 v-model="form1.baudRate"
209                 :fetch-suggestions="querySearch"
210                 placeholder="请输入波特率"
211                 :disabled="isDisable"
212               >
213                 <i class="el-icon-edit el-input__icon" slot="suffix"> </i>
214                 <template slot-scope="{ item }">
215                   <div class="name">{{ item.value }}</div>
216                   <span class="addr">{{ item.address }}</span>
217                 </template>
218               </el-autocomplete>
219             </el-form-item>
220             <el-form-item label="数据位">
221               <el-select
222                 v-model="form1.dataBits"
223                 placeholder="请选择数据位"
224                 :disabled="isDisable"
225               >
226                 <el-option label="7" value="7"></el-option>
227                 <el-option label="8" value="8"></el-option>
228               </el-select>
229             </el-form-item>
230             <el-form-item label="停止位">
231               <el-select
232                 v-model="form1.stopBits"
233                 placeholder="请选择停止位"
234                 :disabled="isDisable"
235               >
236                 <el-option label="1" value="1"></el-option>
237                 <el-option label="2" value="2"></el-option>
238               </el-select>
239             </el-form-item>
240
241             <el-form-item label="校验位">
242               <el-select
243                 v-model="form1.parity"
244                 placeholder="请选择校验位"
245                 :disabled="isDisable"
246               >
247                 <el-option label="None" value="none"></el-option>
248                 <el-option label="Even" value="even"></el-option>
249                 <el-option label="Odd" value="odd"></el-option>
250               </el-select>
251             </el-form-item>
252
253             <el-form-item label="流控制">
254               <el-select
255                 v-model="form1.flowControl"
256                 placeholder="请选择流控制"
257                 :disabled="isDisable"
258               >
259                 <el-option label="None" value="none"></el-option>
260                 <el-option label="HardWare" value="hardware"></el-option>
261               </el-select>
262             </el-form-item>
263             <el-form-item label="显示历史">
264               <el-switch
265                 v-model="form1.isShowHistory"
266                 @change="loadHistory"
267               ></el-switch>
268               <el-button
269                 type="danger"
270                 icon="el-icon-delete"
271                 circle
272                 title="清空历史"
273                 @click="clearHistory"
274               ></el-button>
275             </el-form-item>
276             <el-form-item label="发送区设置" v-show="isShowSendArea">
277               <el-form-item label="发送格式">
278                 <el-radio-group v-model="form1.type">
279                   <el-radio label="1">ASCII</el-radio>
280                   <el-radio label="2">HEX</el-radio>
281                 </el-radio-group>
282               </el-form-item>
283               <el-form-item label="发送信息">
284                 <el-input type="textarea" v-model="form1.sendMsg"></el-input>
285               </el-form-item>
286               <el-button type="primary" @click="sendCommon">发送</el-button>
287             </el-form-item>
288
289             <el-form-item>
290               <el-button :type="btnType" @click="connectBtn">{{
291                   btnText
292                 }}</el-button>
293               <el-button type="info" @click="obtainAuthorization"
294               >新增授权</el-button
295               >
296             </el-form-item>
297           </div>
298           </el-col>
299         </el-row>
300       </el-form>
301     </el-dialog>
302   </div>
303 </template>
304 <script>
305 import {listWorkReport} from "@/api/main/om/workReport/workReport";
306 import {listStationConf,getIpv4} from "@/api/main/sc/stationConf";
307 import {
308   clearWorkpieceRelease,
7ae9a9 309   fistSetpNumber, initializedData,
0ca254 310   listFormulaChild,
A 311   noPageListFormulaChild,
312   releaseCheck,
313   updateResults,
314   updateTighteningFormula,
315   workpieceRelease
316 } from "@/api/main/bs/formulaChild/formulaChild";
317 import MySerialPort from "@/utils/MySerialPort";
318 import USBDevice from "@/utils/usb.json";
319 import {
320   bindYzSfcFlag,
321   checkCarCode, checkYzSfcCode,
322   findBytrolleyYardGetOne,
22c9e0 323   listProductionOrde, mozuReceivingWorkOrders,
0ca254 324   receivingWorkOrders,
A 325   trolleyYardBinDing
326 } from "@/api/main/om/productionOrde/productionOrde";
327 import {addPassingStationCollection} from "@/api/main/da/passingStationCollection/passingStationCollection";
328 import {
329   addBasicParameters,
330   addParamCollection,
331   addTighteningParameters,
332   saveCampaignTimeParameters,
333   replaceAssemblyCode, checkRecordDataDone,
334 } from "@/api/main/da/paramCollection/paramCollection";
22c9e0 335 import {addFormula} from "@/api/main/bs/formula/formula";
0ca254 336
A 337 export default {
338   name: "stationTerminal",
339   data() {
340     return {
341       carCode: '',
342       showInput: false,
343       onLineBinDing: false,
344
345       serialPortContent: '',
346       // 查询参数
347       formulaChildParams: {
348         pageNum: 1,
349         pageSize: 10,
350         productCode: null,
351         processesCode: null,
352       },
353       // 配方配置子信息表格数据
354       formulaChildList: [],
355       ipAddress: '',
356       imgSrc: '',
357       headContent: {
358         processesCode: 'OP1010',
359         processesName: '贴标机-贴码',
360         sfcCode: '',
361         yzSfcCode: '',
362         cardCode: '',
363       },
364       workpieceInformation: {
365         workOrderNo: null,
366         productCode: null,
367         productModel: null,
368         productName: null,
369         inboundTime: null,
370       },
371       // 查询参数
372       queryParams: {
373         pageNum: 1,
374         pageSize: 10,
375         sfcCode: null,
376       },
377       // 查询参数
378       StationConfQueryParams: {
379         pageNum: 1,
380         pageSize: 10,
381         ipAddress: null,
382       },
383       cakeLamp: {
384         plcState: 1, //plc
385         scannerState: 1, //扫码枪
386         InPlace: 0, //工件到位
387         scanFinish: 0,
388         startWork: 0,
389         release: 0 //允许放行
390       },
391       content: '',
392       activeName: 'first',
7597c6 393       // url: "ws://10.103.210.248:8080/websocket/message/",
A 394       url: "ws://192.168.10.100:8080/websocket/message/",
0ca254 395       message: "",
A 396       text_content: "",
397       ws: null,
398       inputValue: '9',
399
400       open1: false,
401       input: "",
402       keepReading: true,
403       form1: {
404         baudRate: "115200",
405         dataBits: "8",
406         stopBits: "1",
407         parity: "none",
408         flowControl: "none",
409         desc: "",
410         type: "1",
411         isShowHistory: false,
412       },
413       btnType: "primary",
414       btnText: "连接串口",
415       restaurants: [],
416       portsList: [],
417       isShowSendArea: false,
418       readType: 1,
419       title: "",
420
421       passingStationForm: {},
422       originalArray: [],
423       yzSfcFlag: 1,
424       endYz: false,
22c9e0 425       orderFlag: true
0ca254 426     }
A 427   },
428   beforeDestroy() {
429     this.exit();
430   },
431   created() {
432     this.initStation();
433     // this.getStationConfList();
434     // setTimeout(() => {
435     //   this.connectWebsocket();
436     // }, 3000);
437   },
438   mounted() {
439     if ("serial" in navigator) {
440       this.myserialport = new MySerialPort();
441       this.getPorts();
442       navigator.serial.addEventListener("connect", (e) => {
443         this.$message.success("设备已连接");
444         this.getPorts();
445       });
446       navigator.serial.addEventListener("disconnect", (e) => {
447         this.$message.error("设备已断开");
448       });
449       this.restaurants = this.loadAll();
450     } else {
451       this.$message.error(
452         "当前为HTTP模式或者浏览器版本过低,不支持网页连接串口"
453       );
454     }
455   },
456   computed: {
457     isDisable() {
458       return this.btnType === "danger";
459     },
460   },
461   methods: {
22c9e0 462     getWorkOrders(){
A 463       if(this.headContent.sfcCode === '' || this.headContent.sfcCode === null){
464         //接收工单
465         const param = {
466           lineCode: this.headContent.processesCode
467         }
468         mozuReceivingWorkOrders(param).then(response => {
469           this.headContent.sfcCode = response.msg;
470           this.queryParams.productNum = response.msg;
471           this.getList()
472           this.cakeLamp.scanFinish = 1
473           this.cakeLamp.startWork = 1
09ceef 474           this.cakeLamp.InPlace = 1
22c9e0 475         });
A 476       }else {
477         this.$message.error("已经有工单了,不能接收!");
478       }
479     },
0ca254 480     bindcardCode(scanValue){
A 481       // this.$message('绑定成功!');
482       let param = {
483         productNum: this.headContent.sfcCode,
484         trolleyYard: scanValue,
485       }
486       trolleyYardBinDing(param).then(response => {
487       });
488
489     },
490     serialLink() {
491       this.open1 = true
492     },
493     bindYzSfc(){
494       if(this.headContent.sfcCode!==""&&this.headContent.yzSfcCode!==""){
495         let param = {
496           sfcCode: this.headContent.sfcCode,
497           locationCode: this.headContent.processesCode,
498           yzSfcCode: this.headContent.yzSfcCode
499         }
500         const orderParam = {
501           productNum: this.headContent.sfcCode,
502         }
503         replaceAssemblyCode(param).then(response => {
504           this.$message('绑定成功!');
505           bindYzSfcFlag(orderParam).then(response => {
506             this.yzSfcFlag = 1
507           });
508         });
509       }
510     },
511     Release(){
512       // this.$message('portsList!'+this.portsList.length);
513       if(this.btnType === "danger"){
514         this.$message('连接了!');
515
516       }else {
517         this.$message('mei连接了!');
518
519       }
520     },
521     serialPortMethod(value){
522       let formulaChildParams = {
523         scanBarcode: value,
524         sfcBarcode: this.headContent.sfcCode,
525         workOrderNo: this.workpieceInformation.workOrderNo,
526         productCode: this.workpieceInformation.productCode,
527         locationCode: this.headContent.processesCode,
528         collectionTime: new Date()
529       }
530       updateResults(formulaChildParams).then(response => {
531         console.log(response)
532         if(response.msg === "3"){
533           this.cakeLamp.release= 1 //允许放行
534         }else if(response.msg === "2"){
535           this.$message.error('扫码重复请重新扫码!');
536         }
537         this.getListFormulaChild()
538       });
539     },
540     rowStyle({ row }) {
541       if (row.results === 'OK') {
542         return 'background-color: PaleGreen';
543       } else if (row.results === 'NG') {
544         return 'background-color: LightSalmon';
545       }
546       return '';
547     },
548     /** 查询配方配置子信息列表 */
549     getListFormulaChild() {
550       // this.formulaChildList = []
551       this.formulaChildParams.productCode = this.workpieceInformation.productCode
552       this.formulaChildParams.processesCode = this.headContent.processesCode
553       console.log(this.formulaChildParams)
554       noPageListFormulaChild(this.formulaChildParams).then(response => {
555         this.formulaChildList = response.rows;
556         if (this.formulaChildList.length >0){
557           let pos = 0
558           const tempArr = this.formulaChildList.filter(x=> 'OK' === x.results)
559           if (tempArr.length>0){
560             pos = tempArr.length
561             this.$nextTick(() => {
562               let temp33 = document.getElementsByClassName('el-table__row')
563               console.log('temp33',temp33)
564               console.log('len',temp33.item(pos))
565               if (temp33.length > 0){
566                 console.log('1111111111111111')
567                 let arr = temp33[pos-1]
568                 console.log('srr',arr)
569                 arr.scrollIntoView({ block: 'center' })
570               }
571             })
572           }
573
574         }
575
576       });
577     },
578     endClear(){
579       this.cakeLamp.InPlace= 0 //工件到位
580       this.cakeLamp.scanFinish= 0
581       this.cakeLamp.startWork= 0
582       this.cakeLamp.release= 0 //允许放行
583
584       this.formulaChildList = []
585       this.workpieceInformation.productCode = null;
586       this.workpieceInformation.workOrderNo = null;
587       this.workpieceInformation.productModel = null;
588       this.workpieceInformation.productName = null;
589       this.workpieceInformation.inboundTime = null;
590       this.headContent.sfcCode = '';
591       this.headContent.yzSfcCode = '';
592       this.headContent.cardCode = '';
593     },
594     changeMenu(tab, event) {
595       console.log(tab, event);
596     },
597     clearClick(){
598       const param = {
599         workOrderNo: this.workpieceInformation.workOrderNo,
600         productCode: this.workpieceInformation.productCode,
601         locationCode: this.headContent.processesCode,
602         productBarcode: this.headContent.sfcCode,
603       }
604       this.endClear()
605       clearWorkpieceRelease(param).then(response => {});
606       this.headContent.sfcCode = ''
607       this.$message('清除成功!');
608     },
609     scanCompleted(){
610       this.$message('扫码完成'+this.content);
611       this.headContent.sfcCode = this.content
612       this.queryParams.sfcCode = this.content
613       this.getList()
614       this.getListFormulaChild()
615       this.cakeLamp.scanFinish = 1
616       this.cakeLamp.startWork = 1
617
618     },
619     /** 查询工单列表 */
620     async getList() {
621       await listProductionOrde(this.queryParams).then(response => {
622         let rowsData = response.rows[0];
623         console.log(rowsData)
624         this.workpieceInformation.workOrderNo = rowsData.workOrderNo;
625         this.workpieceInformation.productCode = rowsData.productCode;
626         this.workpieceInformation.productModel = rowsData.productModel;
627         this.workpieceInformation.productName = rowsData.productName;
628         this.headContent.cardCode = rowsData.trolleyYard;
629       });
630       this.getListFormulaChild()
631       this.workpieceInformation.inboundTime = this.getCurrentTime()
632     },
633
7ae9a9 634     initializedData(){
A 635       const param = {
636         locationCode: this.headContent.processesCode,
637       }
638       initializedData(param).then(response => {
639         if(response.msg !== ''){
640           this.headContent.sfcCode = response.msg;
641           this.queryParams.productNum = response.msg;
642           this.getList()
643           this.cakeLamp.scanFinish = 1
644           this.cakeLamp.startWork = 1
da4f49 645           this.cakeLamp.InPlace = 1
7ae9a9 646         }
A 647       });
648     },
649
0ca254 650     getCurrentTime() {
A 651       const now = new Date();
652       const year = now.getFullYear();
653       const month = this.padTimeUnit(now.getMonth() + 1); // 月份是从0开始的
654       const day = this.padTimeUnit(now.getDate());
655       const hours = this.padTimeUnit(now.getHours());
656       const minutes = this.padTimeUnit(now.getMinutes());
657       const seconds = this.padTimeUnit(now.getSeconds());
658       return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
659     },
660     padTimeUnit(value) {
661       return value.toString().padStart(2, '0');
662     },
663     addBaseData(){
664       addBasicParameters(this.passingStationForm).then(response => {});
665     },
666
667     /** 入站增加过站采集记录 **/
668     addOverStationCollection(){
669       this.passingStationForm = {
670         id: null,
671         workOrderNo: this.workpieceInformation.workOrderNo,
672         productCode: this.workpieceInformation.productCode,
673         locationCode: this.headContent.processesCode,
674         model: this.workpieceInformation.productModel,
675         productBarcode: this.headContent.sfcCode,
676         sfcCode: this.headContent.sfcCode,
677         inboundTime: new Date()
678       }
679       addPassingStationCollection(this.passingStationForm).then(response => {});
680       // addBasicParameters(this.passingStationForm).then(response => {});
681     },
682     exit() {
683       if (this.ws) {
684         this.ws.close();
685         this.ws = null;
686       }
687     },
688     send() {
689       if (this.ws) {
690         this.ws.send(this.message);
691       } else {
692         alert("未连接到服务器");
693       }
694     },
695
696     initStation: async function () {
697       await getIpv4().then(response => {
698         this.StationConfQueryParams.ipAddress = response.msg
699         console.log('查询到本工位IP为' + this.StationConfQueryParams.ipAddress)
700       });
701       await listStationConf(this.StationConfQueryParams).then(response => {
702         let rows = response.rows[0]
703         if (response.rows.length === 0) {
704           this.$message('该工位没有配置IP,请联系管理员配置IP');
705           return
706         }
707         this.headContent.processesName = rows.processesName
708         this.headContent.processesCode = rows.processesCode
7ae9a9 709         this.initializedData()
0ca254 710
A 711       });
712       this.conCom()
713       console.log('websocket连接工位为' + this.headContent.processesCode)
714       const wsuri = this.url + this.headContent.processesCode;
715       this.ws = new WebSocket(wsuri);
716       const self = this;
717       this.ws.onopen = function (event) {
718         this.$message('websocket连接成功!');
719
720       };
8c5c9c 721
C 722
723       //socket从后台向前台推送数据
0ca254 724       this.ws.onmessage = function (event) {
A 725         if (event.data === "IN") {
726           self.cakeLamp.InPlace = 1;
727           console.log(self.headContent.processesCode);
728           // const param = {
729           //   processesCode: self.headContent.processesCode,
730           // }
731           // fistSetpNumber(param).then(response => {});
732         } else if (event.data === "IN0") {
733           self.cakeLamp.InPlace = 0;
734         } else if (event.data === "OUT") {
735           self.cakeLamp.release = 1;
736         } else if (event.data === "END") {
737
738           const formulaChildIndex = self.formulaChildList.length-1
739
740           const orderParam = {
741             productNum: self.headContent.sfcCode,
742           }
743
744           if(self.headContent.sfcCode=== ''||self.headContent.sfcCode=== null){
745             self.$message('总成码为空,请扫码!')
746             return;
747           }
748
749           // if(self.headContent.cardCode === null || self.headContent.cardCode === ''){
750           //   self.$alert('<strong style="color: red;font-size: 30px">未扫描小车码禁止放行</strong>', '提示', {
751           //     dangerouslyUseHTMLString: true
752           //   });
753           //   return;
754           // }
755
756           if(self.formulaChildList[formulaChildIndex].results !== 'OK'){
757             self.$message('未做完工序禁止放行');
758             return;
759           }
760
761
762           const param = {
763             workOrderNo: self.workpieceInformation.workOrderNo,
764             productCode: self.workpieceInformation.productCode,
765             locationCode: self.headContent.processesCode,
766             productBarcode: self.headContent.sfcCode,
767             inboundTime: self.workpieceInformation.inboundTime,
768             formulaChildEntity: self.formulaChildList[formulaChildIndex]
769           }
770
771           console.log("进入最终方法")
772           self.endSaveData(param)
773
774         } else if (event.data.includes("[")) {
775           let formulaChilds = "";
776           self.formulaChildList.sort((a, b) => a.stepSort - b.stepSort);
777           self.formulaChildList
778             .filter((formulaChild) => formulaChild.operationType === '1');
779           for (let i = 0; i < self.formulaChildList.length; i++) {
780             let formulaChild = self.formulaChildList[i];
781             let results = formulaChild.results;
782
783             if (results === '' || results === null || results === 'NG') {
784               formulaChilds = formulaChild;
785               break;
786             }
787           }
788            if(formulaChilds === ""){
789              self.$message.error('本工位已工作完成!');
790              return;
791            }
792           const param = {
793             id: formulaChilds.id,
794             tightenTheArray: event.data,
795             paramCode: formulaChilds.paramCode,
796             workOrderNo: self.workpieceInformation.workOrderNo,
797             productCode: self.workpieceInformation.productCode,
798             locationCode: self.headContent.processesCode,
799             productBarcode: self.headContent.sfcCode,
800             spareField1: formulaChilds.spareField1,
801             spareField2: formulaChilds.spareField2,
802             spareField3: formulaChilds.spareField3,
803             spareField4: formulaChilds.spareField4,
804             stepSort: formulaChilds.stepSort
805           }
806           if(formulaChilds.paramCode === null||formulaChilds.paramCode ===''){
807             self.$message('未找到参数码,请检查参数码是否正确');
808             return;
809           }
810           if(self.headContent.sfcCode!==null||self.headContent.sfcCode!==''){
811             updateTighteningFormula(param).then(response => {
812               //addTighteningParameters(param).then(response => {});
813               self.getListFormulaChild()
814             }).catch(error =>{
815               self.getListFormulaChild()
816             });
817           }
8c5c9c 818         }else if(event.data.includes("productNum")){
22c9e0 819           let productNum = event.data.split(',')[1];
A 820           self.headContent.sfcCode = productNum;
821           self.queryParams.productNum = productNum;
822           self.getList()
823           self.cakeLamp.scanFinish = 1
824           self.cakeLamp.startWork = 1
50c585 825           this.cakeLamp.InPlace = 1
A 826
0ca254 827         }
A 828       };
829     },
830
831     endSaveData(param){
832       saveCampaignTimeParameters(param).then(response => {
833       this.cakeLamp.release = 1;
834       this.endClear()
835       workpieceRelease(param).then(response => {});
836       });
837     },
838
839     //接受数据的回调
840     callBack(value) {
841       if (this.form1.isShowHistory) this.form1.desc = this.readLi().join("");
842       else {
843         const scanValue = this.myserialport.hex2atostr(value).replace(/[\r\n]/g, '');
844         console.log("串口收到数据-------------------"+scanValue)
845         console.log("sfc=--"+this.headContent.sfcCode+"--")
846         if(this.headContent.sfcCode !== '' && this.headContent.sfcCode !== null
847           && this.headContent.sfcCode !== undefined){
848           if(scanValue.includes("0RSP1TE") && this.headContent.processesCode === 'OP240'){
849             this.headContent.cardCode = scanValue
850             this.bindcardCode(scanValue);
851             this.serialPortMethod(scanValue)
852           }else {
853             this.$message('工位终端扫描物料编码'+scanValue);
854             console.log(scanValue)
855             this.serialPortMethod(scanValue)
856           }
857         } else {
50c585 858           // if(this.headContent.processesCode === 'OP240'){
0ca254 859             this.headContent.sfcCode = scanValue;
A 860             this.queryParams.productNum = scanValue;
861             this.getList()
862             this.cakeLamp.scanFinish = 1
863             this.cakeLamp.startWork = 1
50c585 864             this.cakeLamp.InPlace = 1
A 865           // }else {
866           //   let param = {
867           //     trolleyYard: scanValue
868           //   }
869           //   findBytrolleyYardGetOne(param).then(response => {
870           //     if(response.msg !== '2'){
871           //       this.headContent.sfcCode = response.msg;
872           //       this.queryParams.productNum = response.msg;
873           //       this.$message('扫码识别产品序列号'+scanValue);
874           //       this.getList()
875           //       this.cakeLamp.scanFinish = 1
876           //       this.cakeLamp.startWork = 1
877           //       this.cakeLamp.InPlace = 1
878           //     }else {
879           //       this.$message('没有序列号'+scanValue);
880           //       return
881           //     }
882           //   });
883           // }
0ca254 884
A 885         }
886
887       }
888     },
889     clearHistory() {
890       this.form1.desc = "";
891       this.myserialport.state.readValue = [];
892     },
893     loadHistory() {
894       if (this.form1.isShowHistory) this.form1.desc = this.readLi().join("");
895       else {
896         let temp = this.readLi();
897         if (temp.length > 0) this.form1.desc = temp[temp.length - 1].join("");
898       }
899     },
900     readLi() {
901       let readType = this.readType;
902       return this.myserialport.state.readValue.map((items, index) => {
903         const item = items.value;
904         const type = items.type; // 1接收,2发送
905         let body = [];
906         if (item !== undefined) {
907           let strArr = [];
908           for (let hex of Array.from(item)) {
909             strArr.push(hex.toString(16).toLocaleUpperCase());
910           }
911           if (strArr.includes("D") && strArr.includes("A")) {
912             if (strArr.indexOf("A") - strArr.indexOf("D") === 1) {
913               strArr.splice(strArr.indexOf("D"), 1);
914               strArr.splice(strArr.indexOf("A"), 1, <br key={0} />);
915             }
916           }
917           strArr = strArr.map((item) => {
918             if (typeof item === "string") {
919               if (readType === 1) {
920                 return this.myserialport.hex2a(parseInt(item, 16));
921               } else if (readType === 2) {
922                 return item + " ";
923               }
924             }
925             return item;
926           });
927           if (typeof strArr[strArr.length - 1] === "string") {
928             strArr.push("\r\n");
929           }
930           body.push(strArr.join(""));
931         }
932         return body;
933       });
934     },
935     conCom(){
936       try {
937         this.myserialport.state.baudRate = this.form1.baudRate;
938         this.myserialport.state.dataBits = this.form1.dataBits;
939         this.myserialport.state.stopBits = this.form1.stopBits;
940         this.myserialport.state.parity = this.form1.parity;
941         this.myserialport.state.flowControl = this.form1.flowControl;
942         this.myserialport.openPort(0, true, this.callBack);
943         console.log(this.form1.port)
944       } catch (error) {
945         this.$message.error("串口连接失败!请检查串口是否已被占用");
946       }
947       if (this.myserialport.state.isOpen) {
948         this.$message.success("串口连接成功");
949       }
950     },
951     //连接
952     async connectBtn() {
953       if (this.btnType === "primary") {
954         try {
955           this.myserialport.state.baudRate = this.form1.baudRate;
956           this.myserialport.state.dataBits = this.form1.dataBits;
957           this.myserialport.state.stopBits = this.form1.stopBits;
958           this.myserialport.state.parity = this.form1.parity;
959           this.myserialport.state.flowControl = this.form1.flowControl;
960           await this.myserialport.openPort(this.form1.port, true, this.callBack);
961           console.log(this.form1.port)
962         } catch (error) {
963           this.$message.error("串口连接失败!请检查串口是否已被占用");
964         }
965         if (this.myserialport.state.isOpen) {
966           this.$message.success("串口连接成功");
967           this.open1 = false
968           this.btnType = "danger";
969           this.btnText = "关闭串口";
970         }
971       } else {
972         this.myserialport.openPort(this.form1.port, false, this.callBack);
973         this.$message.success("串口关闭成功");
974         this.btnType = "primary";
975         this.btnText = "连接串口";
976       }
977     },
978     //授权
979     async obtainAuthorization() {
980       if ("serial" in navigator) {
981         console.log("The Web Serial API is supported.");
982         if (!this.myserialport) this.myserialport = new MySerialPort();
983         try {
984           await this.myserialport.handleRequestPort();
985           this.$message.success("串口授权成功");
986           this.getPortInfo(this.myserialport.state.ports);
987         } catch (error) {
988           this.$message.warning("未选择新串口授权!");
989         }
990       } else {
991         this.$message.error(
992           "当前为HTTP模式或者浏览器版本过低,不支持网页连接串口"
993         );
994       }
995     },
996     //串口列表初始化
997     getPortInfo(portList) {
998       this.portsList = [];
999       portList.map((port, index) => {
1000         const { usbProductId, usbVendorId } = port.getInfo();
1001         if (usbProductId === undefined || usbVendorId === undefined) {
1002           this.portsList.push({ label: "未知设备" + index, value: index });
1003         } else {
1004           const usbVendor = USBDevice.filter(
1005             (item) => parseInt(item.vendor, 16) === usbVendorId
1006           );
1007           let usbProduct = [];
1008           if (usbVendor.length === 1) {
1009             usbProduct = usbVendor[0].devices.filter(
1010               (item) => parseInt(item.devid, 16) === usbProductId
1011             );
1012           }
1013           this.portsList.push({ label: usbProduct[0].devname, value: index });
1014         }
1015       });
1016     },
1017     // 发送
1018     async sendCommon() {
1019       if (this.myserialport.state.isOpen) {
1020         if (this.form1.sendMsg.length !== 0) {
1021           const writeType = this.form1.type;
1022           let value = this.form1.sendMsg;
1023           let arr = [];
1024           if (writeType === 1) {
1025             // ASCII
1026             for (let i = 0; i < value.length; i++) {
1027               arr.push(this.myserialport.a2hex(value[i]));
1028             }
1029           } else if (writeType === 2) {
1030             // HEX
1031             if (/^[0-9A-Fa-f]+$/.test(value) && value.length % 2 === 0) {
1032               for (let i = 0; i < value.length; i = i + 2) {
1033                 arr.push(parseInt(value.substring(i, i + 2), 16));
1034               }
1035             } else {
1036               this.$message.error("格式错误");
1037               return;
1038             }
1039           }
1040           this.myserialport.writeText(arr);
1041         } else {
1042           this.$message.warning("请输入发送的信息");
1043         }
1044       } else {
1045         this.$message.warning("串口处于关闭状态,请连接串口");
1046       }
1047     },
1048     async getPorts() {
1049       await this.myserialport.getPorts();
1050       this.getPortInfo(this.myserialport.state.ports);
1051     },
1052     querySearch(queryString, cb) {
1053       var restaurants = this.restaurants;
1054       var results = queryString
1055         ? restaurants.filter(this.createFilter(queryString))
1056         : restaurants;
1057       // 调用 callback 返回建议列表的数据
1058       cb(results);
1059     },
1060     createFilter(queryString) {
1061       return (restaurant) => {
1062         return (
1063           restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) ===
1064           0
1065         );
1066       };
1067     },
1068     loadAll() {
1069       return [
1070         { value: "110" },
1071         { value: "300" },
1072         { value: "600" },
1073         { value: "1200" },
1074         { value: "2400" },
1075         { value: "4800" },
1076         { value: "7200" },
1077         { value: "9600" },
1078         { value: "14400" },
1079         { value: "19200" },
1080         { value: "28800" },
1081         { value: "38400" },
1082         { value: "56000" },
1083         { value: "57600" },
1084         { value: "76800" },
1085         { value: "115200" },
1086         { value: "230400" },
1087         { value: "460800" },
1088       ];
1089     },
1090   }
1091 }
1092
1093 </script>
1094 <style scoped>
1095 .bottom-card{
1096   height: 600px;
1097 }
1098 .circle-button{
1099   height: 30px;
1100   width: 30px;
1101 }
1102 .circle-red {
1103   background-color: #e01a4f;
1104 }
1105 .circle-green {
1106   background-color: green;
1107 }
1108 .circle-green-animate {
1109   background-color: green;
1110   animation: circle-green-animate 2s infinite;
1111 }
1112   @keyframes circle-green-animate {
1113     50% {
1114       opacity: 0.6;
1115     }
1116     0% {
1117       opacity: 0.2;
1118     }
1119   }
1120 .head-font{
1121   /*font-weight: bold;*/
1122   /*font-size: 25px;*/
1123 }
1124 span{
1125   font-size: 15px;
1126 }
1127 .el-table .warning-row {
1128   background: oldlace;
1129 }
1130
1131 .el-table .success-row {
1132   background: #f0f9eb;
1133 }
1134 </style>
1135