admin
2024-07-05 7597c63fa8a1384c452873ff1fd9d471d8ad1237
提交 | 用户 | 时间
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
474         });
475       }else {
476         this.$message.error("已经有工单了,不能接收!");
477       }
478     },
0ca254 479     bindcardCode(scanValue){
A 480       // this.$message('绑定成功!');
481       let param = {
482         productNum: this.headContent.sfcCode,
483         trolleyYard: scanValue,
484       }
485       trolleyYardBinDing(param).then(response => {
486       });
487
488     },
489     serialLink() {
490       this.open1 = true
491     },
492     bindYzSfc(){
493       if(this.headContent.sfcCode!==""&&this.headContent.yzSfcCode!==""){
494         let param = {
495           sfcCode: this.headContent.sfcCode,
496           locationCode: this.headContent.processesCode,
497           yzSfcCode: this.headContent.yzSfcCode
498         }
499         const orderParam = {
500           productNum: this.headContent.sfcCode,
501         }
502         replaceAssemblyCode(param).then(response => {
503           this.$message('绑定成功!');
504           bindYzSfcFlag(orderParam).then(response => {
505             this.yzSfcFlag = 1
506           });
507         });
508       }
509     },
510     Release(){
511       // this.$message('portsList!'+this.portsList.length);
512       if(this.btnType === "danger"){
513         this.$message('连接了!');
514
515       }else {
516         this.$message('mei连接了!');
517
518       }
519     },
520     serialPortMethod(value){
521       let formulaChildParams = {
522         scanBarcode: value,
523         sfcBarcode: this.headContent.sfcCode,
524         workOrderNo: this.workpieceInformation.workOrderNo,
525         productCode: this.workpieceInformation.productCode,
526         locationCode: this.headContent.processesCode,
527         collectionTime: new Date()
528       }
529       updateResults(formulaChildParams).then(response => {
530         console.log(response)
531         if(response.msg === "3"){
532           this.cakeLamp.release= 1 //允许放行
533         }else if(response.msg === "2"){
534           this.$message.error('扫码重复请重新扫码!');
535         }
536         this.getListFormulaChild()
537       });
538     },
539     rowStyle({ row }) {
540       if (row.results === 'OK') {
541         return 'background-color: PaleGreen';
542       } else if (row.results === 'NG') {
543         return 'background-color: LightSalmon';
544       }
545       return '';
546     },
547     /** 查询配方配置子信息列表 */
548     getListFormulaChild() {
549       // this.formulaChildList = []
550       this.formulaChildParams.productCode = this.workpieceInformation.productCode
551       this.formulaChildParams.processesCode = this.headContent.processesCode
552       console.log(this.formulaChildParams)
553       noPageListFormulaChild(this.formulaChildParams).then(response => {
554         this.formulaChildList = response.rows;
555         if (this.formulaChildList.length >0){
556           let pos = 0
557           const tempArr = this.formulaChildList.filter(x=> 'OK' === x.results)
558           if (tempArr.length>0){
559             pos = tempArr.length
560             this.$nextTick(() => {
561               let temp33 = document.getElementsByClassName('el-table__row')
562               console.log('temp33',temp33)
563               console.log('len',temp33.item(pos))
564               if (temp33.length > 0){
565                 console.log('1111111111111111')
566                 let arr = temp33[pos-1]
567                 console.log('srr',arr)
568                 arr.scrollIntoView({ block: 'center' })
569               }
570             })
571           }
572
573         }
574
575       });
576     },
577     endClear(){
578       this.cakeLamp.InPlace= 0 //工件到位
579       this.cakeLamp.scanFinish= 0
580       this.cakeLamp.startWork= 0
581       this.cakeLamp.release= 0 //允许放行
582
583       this.formulaChildList = []
584       this.workpieceInformation.productCode = null;
585       this.workpieceInformation.workOrderNo = null;
586       this.workpieceInformation.productModel = null;
587       this.workpieceInformation.productName = null;
588       this.workpieceInformation.inboundTime = null;
589       this.headContent.sfcCode = '';
590       this.headContent.yzSfcCode = '';
591       this.headContent.cardCode = '';
592     },
593     changeMenu(tab, event) {
594       console.log(tab, event);
595     },
596     clearClick(){
597       const param = {
598         workOrderNo: this.workpieceInformation.workOrderNo,
599         productCode: this.workpieceInformation.productCode,
600         locationCode: this.headContent.processesCode,
601         productBarcode: this.headContent.sfcCode,
602       }
603       this.endClear()
604       clearWorkpieceRelease(param).then(response => {});
605       this.headContent.sfcCode = ''
606       this.$message('清除成功!');
607     },
608     scanCompleted(){
609       this.$message('扫码完成'+this.content);
610       this.headContent.sfcCode = this.content
611       this.queryParams.sfcCode = this.content
612       this.getList()
613       this.getListFormulaChild()
614       this.cakeLamp.scanFinish = 1
615       this.cakeLamp.startWork = 1
616
617     },
618     /** 查询工单列表 */
619     async getList() {
620       await listProductionOrde(this.queryParams).then(response => {
621         let rowsData = response.rows[0];
622         console.log(rowsData)
623         this.workpieceInformation.workOrderNo = rowsData.workOrderNo;
624         this.workpieceInformation.productCode = rowsData.productCode;
625         this.workpieceInformation.productModel = rowsData.productModel;
626         this.workpieceInformation.productName = rowsData.productName;
627         this.headContent.cardCode = rowsData.trolleyYard;
628       });
629       this.getListFormulaChild()
630       this.workpieceInformation.inboundTime = this.getCurrentTime()
631     },
632
7ae9a9 633     initializedData(){
A 634       const param = {
635         locationCode: this.headContent.processesCode,
636       }
637       initializedData(param).then(response => {
638         if(response.msg !== ''){
639           this.headContent.sfcCode = response.msg;
640           this.queryParams.productNum = response.msg;
641           this.getList()
642           this.cakeLamp.scanFinish = 1
643           this.cakeLamp.startWork = 1
644         }
645       });
646     },
647
0ca254 648     getCurrentTime() {
A 649       const now = new Date();
650       const year = now.getFullYear();
651       const month = this.padTimeUnit(now.getMonth() + 1); // 月份是从0开始的
652       const day = this.padTimeUnit(now.getDate());
653       const hours = this.padTimeUnit(now.getHours());
654       const minutes = this.padTimeUnit(now.getMinutes());
655       const seconds = this.padTimeUnit(now.getSeconds());
656       return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
657     },
658     padTimeUnit(value) {
659       return value.toString().padStart(2, '0');
660     },
661     addBaseData(){
662       addBasicParameters(this.passingStationForm).then(response => {});
663     },
664
665     /** 入站增加过站采集记录 **/
666     addOverStationCollection(){
667       this.passingStationForm = {
668         id: null,
669         workOrderNo: this.workpieceInformation.workOrderNo,
670         productCode: this.workpieceInformation.productCode,
671         locationCode: this.headContent.processesCode,
672         model: this.workpieceInformation.productModel,
673         productBarcode: this.headContent.sfcCode,
674         sfcCode: this.headContent.sfcCode,
675         inboundTime: new Date()
676       }
677       addPassingStationCollection(this.passingStationForm).then(response => {});
678       // addBasicParameters(this.passingStationForm).then(response => {});
679     },
680     exit() {
681       if (this.ws) {
682         this.ws.close();
683         this.ws = null;
684       }
685     },
686     send() {
687       if (this.ws) {
688         this.ws.send(this.message);
689       } else {
690         alert("未连接到服务器");
691       }
692     },
693
694     initStation: async function () {
695       await getIpv4().then(response => {
696         this.StationConfQueryParams.ipAddress = response.msg
697         console.log('查询到本工位IP为' + this.StationConfQueryParams.ipAddress)
698       });
699       await listStationConf(this.StationConfQueryParams).then(response => {
700         let rows = response.rows[0]
701         if (response.rows.length === 0) {
702           this.$message('该工位没有配置IP,请联系管理员配置IP');
703           return
704         }
705         this.headContent.processesName = rows.processesName
706         this.headContent.processesCode = rows.processesCode
7ae9a9 707         this.initializedData()
0ca254 708
A 709       });
710       this.conCom()
711       console.log('websocket连接工位为' + this.headContent.processesCode)
712       const wsuri = this.url + this.headContent.processesCode;
713       this.ws = new WebSocket(wsuri);
714       const self = this;
715       this.ws.onopen = function (event) {
716         this.$message('websocket连接成功!');
717
718       };
8c5c9c 719
C 720
721       //socket从后台向前台推送数据
0ca254 722       this.ws.onmessage = function (event) {
A 723         if (event.data === "IN") {
724           self.cakeLamp.InPlace = 1;
725           console.log(self.headContent.processesCode);
726           // const param = {
727           //   processesCode: self.headContent.processesCode,
728           // }
729           // fistSetpNumber(param).then(response => {});
730         } else if (event.data === "IN0") {
731           self.cakeLamp.InPlace = 0;
732         } else if (event.data === "OUT") {
733           self.cakeLamp.release = 1;
734         } else if (event.data === "END") {
735
736           const formulaChildIndex = self.formulaChildList.length-1
737
738           const orderParam = {
739             productNum: self.headContent.sfcCode,
740           }
741
742           if(self.headContent.sfcCode=== ''||self.headContent.sfcCode=== null){
743             self.$message('总成码为空,请扫码!')
744             return;
745           }
746
747           // if(self.headContent.cardCode === null || self.headContent.cardCode === ''){
748           //   self.$alert('<strong style="color: red;font-size: 30px">未扫描小车码禁止放行</strong>', '提示', {
749           //     dangerouslyUseHTMLString: true
750           //   });
751           //   return;
752           // }
753
754           if(self.formulaChildList[formulaChildIndex].results !== 'OK'){
755             self.$message('未做完工序禁止放行');
756             return;
757           }
758
759
760           const param = {
761             workOrderNo: self.workpieceInformation.workOrderNo,
762             productCode: self.workpieceInformation.productCode,
763             locationCode: self.headContent.processesCode,
764             productBarcode: self.headContent.sfcCode,
765             inboundTime: self.workpieceInformation.inboundTime,
766             formulaChildEntity: self.formulaChildList[formulaChildIndex]
767           }
768
769           console.log("进入最终方法")
770           self.endSaveData(param)
771
772         } else if (event.data.includes("[")) {
773           let formulaChilds = "";
774           self.formulaChildList.sort((a, b) => a.stepSort - b.stepSort);
775           self.formulaChildList
776             .filter((formulaChild) => formulaChild.operationType === '1');
777           for (let i = 0; i < self.formulaChildList.length; i++) {
778             let formulaChild = self.formulaChildList[i];
779             let results = formulaChild.results;
780
781             if (results === '' || results === null || results === 'NG') {
782               formulaChilds = formulaChild;
783               break;
784             }
785           }
786            if(formulaChilds === ""){
787              self.$message.error('本工位已工作完成!');
788              return;
789            }
790           const param = {
791             id: formulaChilds.id,
792             tightenTheArray: event.data,
793             paramCode: formulaChilds.paramCode,
794             workOrderNo: self.workpieceInformation.workOrderNo,
795             productCode: self.workpieceInformation.productCode,
796             locationCode: self.headContent.processesCode,
797             productBarcode: self.headContent.sfcCode,
798             spareField1: formulaChilds.spareField1,
799             spareField2: formulaChilds.spareField2,
800             spareField3: formulaChilds.spareField3,
801             spareField4: formulaChilds.spareField4,
802             stepSort: formulaChilds.stepSort
803           }
804           if(formulaChilds.paramCode === null||formulaChilds.paramCode ===''){
805             self.$message('未找到参数码,请检查参数码是否正确');
806             return;
807           }
808           if(self.headContent.sfcCode!==null||self.headContent.sfcCode!==''){
809             updateTighteningFormula(param).then(response => {
810               //addTighteningParameters(param).then(response => {});
811               self.getListFormulaChild()
812             }).catch(error =>{
813               self.getListFormulaChild()
814             });
815           }
8c5c9c 816         }else if(event.data.includes("productNum")){
22c9e0 817           let productNum = event.data.split(',')[1];
A 818           self.headContent.sfcCode = productNum;
819           self.queryParams.productNum = productNum;
820           self.getList()
821           self.cakeLamp.scanFinish = 1
822           self.cakeLamp.startWork = 1
50c585 823           this.cakeLamp.InPlace = 1
A 824
0ca254 825         }
A 826       };
827     },
828
829     endSaveData(param){
830       saveCampaignTimeParameters(param).then(response => {
831       this.cakeLamp.release = 1;
832       this.endClear()
833       workpieceRelease(param).then(response => {});
834       });
835     },
836
837     //接受数据的回调
838     callBack(value) {
839       if (this.form1.isShowHistory) this.form1.desc = this.readLi().join("");
840       else {
841         const scanValue = this.myserialport.hex2atostr(value).replace(/[\r\n]/g, '');
842         console.log("串口收到数据-------------------"+scanValue)
843         console.log("sfc=--"+this.headContent.sfcCode+"--")
844         if(this.headContent.sfcCode !== '' && this.headContent.sfcCode !== null
845           && this.headContent.sfcCode !== undefined){
846           if(scanValue.includes("0RSP1TE") && this.headContent.processesCode === 'OP240'){
847             this.headContent.cardCode = scanValue
848             this.bindcardCode(scanValue);
849             this.serialPortMethod(scanValue)
850           }else {
851             this.$message('工位终端扫描物料编码'+scanValue);
852             console.log(scanValue)
853             this.serialPortMethod(scanValue)
854           }
855         } else {
50c585 856           // if(this.headContent.processesCode === 'OP240'){
0ca254 857             this.headContent.sfcCode = scanValue;
A 858             this.queryParams.productNum = scanValue;
859             this.getList()
860             this.cakeLamp.scanFinish = 1
861             this.cakeLamp.startWork = 1
50c585 862             this.cakeLamp.InPlace = 1
A 863           // }else {
864           //   let param = {
865           //     trolleyYard: scanValue
866           //   }
867           //   findBytrolleyYardGetOne(param).then(response => {
868           //     if(response.msg !== '2'){
869           //       this.headContent.sfcCode = response.msg;
870           //       this.queryParams.productNum = response.msg;
871           //       this.$message('扫码识别产品序列号'+scanValue);
872           //       this.getList()
873           //       this.cakeLamp.scanFinish = 1
874           //       this.cakeLamp.startWork = 1
875           //       this.cakeLamp.InPlace = 1
876           //     }else {
877           //       this.$message('没有序列号'+scanValue);
878           //       return
879           //     }
880           //   });
881           // }
0ca254 882
A 883         }
884
885       }
886     },
887     clearHistory() {
888       this.form1.desc = "";
889       this.myserialport.state.readValue = [];
890     },
891     loadHistory() {
892       if (this.form1.isShowHistory) this.form1.desc = this.readLi().join("");
893       else {
894         let temp = this.readLi();
895         if (temp.length > 0) this.form1.desc = temp[temp.length - 1].join("");
896       }
897     },
898     readLi() {
899       let readType = this.readType;
900       return this.myserialport.state.readValue.map((items, index) => {
901         const item = items.value;
902         const type = items.type; // 1接收,2发送
903         let body = [];
904         if (item !== undefined) {
905           let strArr = [];
906           for (let hex of Array.from(item)) {
907             strArr.push(hex.toString(16).toLocaleUpperCase());
908           }
909           if (strArr.includes("D") && strArr.includes("A")) {
910             if (strArr.indexOf("A") - strArr.indexOf("D") === 1) {
911               strArr.splice(strArr.indexOf("D"), 1);
912               strArr.splice(strArr.indexOf("A"), 1, <br key={0} />);
913             }
914           }
915           strArr = strArr.map((item) => {
916             if (typeof item === "string") {
917               if (readType === 1) {
918                 return this.myserialport.hex2a(parseInt(item, 16));
919               } else if (readType === 2) {
920                 return item + " ";
921               }
922             }
923             return item;
924           });
925           if (typeof strArr[strArr.length - 1] === "string") {
926             strArr.push("\r\n");
927           }
928           body.push(strArr.join(""));
929         }
930         return body;
931       });
932     },
933     conCom(){
934       try {
935         this.myserialport.state.baudRate = this.form1.baudRate;
936         this.myserialport.state.dataBits = this.form1.dataBits;
937         this.myserialport.state.stopBits = this.form1.stopBits;
938         this.myserialport.state.parity = this.form1.parity;
939         this.myserialport.state.flowControl = this.form1.flowControl;
940         this.myserialport.openPort(0, true, this.callBack);
941         console.log(this.form1.port)
942       } catch (error) {
943         this.$message.error("串口连接失败!请检查串口是否已被占用");
944       }
945       if (this.myserialport.state.isOpen) {
946         this.$message.success("串口连接成功");
947       }
948     },
949     //连接
950     async connectBtn() {
951       if (this.btnType === "primary") {
952         try {
953           this.myserialport.state.baudRate = this.form1.baudRate;
954           this.myserialport.state.dataBits = this.form1.dataBits;
955           this.myserialport.state.stopBits = this.form1.stopBits;
956           this.myserialport.state.parity = this.form1.parity;
957           this.myserialport.state.flowControl = this.form1.flowControl;
958           await this.myserialport.openPort(this.form1.port, true, this.callBack);
959           console.log(this.form1.port)
960         } catch (error) {
961           this.$message.error("串口连接失败!请检查串口是否已被占用");
962         }
963         if (this.myserialport.state.isOpen) {
964           this.$message.success("串口连接成功");
965           this.open1 = false
966           this.btnType = "danger";
967           this.btnText = "关闭串口";
968         }
969       } else {
970         this.myserialport.openPort(this.form1.port, false, this.callBack);
971         this.$message.success("串口关闭成功");
972         this.btnType = "primary";
973         this.btnText = "连接串口";
974       }
975     },
976     //授权
977     async obtainAuthorization() {
978       if ("serial" in navigator) {
979         console.log("The Web Serial API is supported.");
980         if (!this.myserialport) this.myserialport = new MySerialPort();
981         try {
982           await this.myserialport.handleRequestPort();
983           this.$message.success("串口授权成功");
984           this.getPortInfo(this.myserialport.state.ports);
985         } catch (error) {
986           this.$message.warning("未选择新串口授权!");
987         }
988       } else {
989         this.$message.error(
990           "当前为HTTP模式或者浏览器版本过低,不支持网页连接串口"
991         );
992       }
993     },
994     //串口列表初始化
995     getPortInfo(portList) {
996       this.portsList = [];
997       portList.map((port, index) => {
998         const { usbProductId, usbVendorId } = port.getInfo();
999         if (usbProductId === undefined || usbVendorId === undefined) {
1000           this.portsList.push({ label: "未知设备" + index, value: index });
1001         } else {
1002           const usbVendor = USBDevice.filter(
1003             (item) => parseInt(item.vendor, 16) === usbVendorId
1004           );
1005           let usbProduct = [];
1006           if (usbVendor.length === 1) {
1007             usbProduct = usbVendor[0].devices.filter(
1008               (item) => parseInt(item.devid, 16) === usbProductId
1009             );
1010           }
1011           this.portsList.push({ label: usbProduct[0].devname, value: index });
1012         }
1013       });
1014     },
1015     // 发送
1016     async sendCommon() {
1017       if (this.myserialport.state.isOpen) {
1018         if (this.form1.sendMsg.length !== 0) {
1019           const writeType = this.form1.type;
1020           let value = this.form1.sendMsg;
1021           let arr = [];
1022           if (writeType === 1) {
1023             // ASCII
1024             for (let i = 0; i < value.length; i++) {
1025               arr.push(this.myserialport.a2hex(value[i]));
1026             }
1027           } else if (writeType === 2) {
1028             // HEX
1029             if (/^[0-9A-Fa-f]+$/.test(value) && value.length % 2 === 0) {
1030               for (let i = 0; i < value.length; i = i + 2) {
1031                 arr.push(parseInt(value.substring(i, i + 2), 16));
1032               }
1033             } else {
1034               this.$message.error("格式错误");
1035               return;
1036             }
1037           }
1038           this.myserialport.writeText(arr);
1039         } else {
1040           this.$message.warning("请输入发送的信息");
1041         }
1042       } else {
1043         this.$message.warning("串口处于关闭状态,请连接串口");
1044       }
1045     },
1046     async getPorts() {
1047       await this.myserialport.getPorts();
1048       this.getPortInfo(this.myserialport.state.ports);
1049     },
1050     querySearch(queryString, cb) {
1051       var restaurants = this.restaurants;
1052       var results = queryString
1053         ? restaurants.filter(this.createFilter(queryString))
1054         : restaurants;
1055       // 调用 callback 返回建议列表的数据
1056       cb(results);
1057     },
1058     createFilter(queryString) {
1059       return (restaurant) => {
1060         return (
1061           restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) ===
1062           0
1063         );
1064       };
1065     },
1066     loadAll() {
1067       return [
1068         { value: "110" },
1069         { value: "300" },
1070         { value: "600" },
1071         { value: "1200" },
1072         { value: "2400" },
1073         { value: "4800" },
1074         { value: "7200" },
1075         { value: "9600" },
1076         { value: "14400" },
1077         { value: "19200" },
1078         { value: "28800" },
1079         { value: "38400" },
1080         { value: "56000" },
1081         { value: "57600" },
1082         { value: "76800" },
1083         { value: "115200" },
1084         { value: "230400" },
1085         { value: "460800" },
1086       ];
1087     },
1088   }
1089 }
1090
1091 </script>
1092 <style scoped>
1093 .bottom-card{
1094   height: 600px;
1095 }
1096 .circle-button{
1097   height: 30px;
1098   width: 30px;
1099 }
1100 .circle-red {
1101   background-color: #e01a4f;
1102 }
1103 .circle-green {
1104   background-color: green;
1105 }
1106 .circle-green-animate {
1107   background-color: green;
1108   animation: circle-green-animate 2s infinite;
1109 }
1110   @keyframes circle-green-animate {
1111     50% {
1112       opacity: 0.6;
1113     }
1114     0% {
1115       opacity: 0.2;
1116     }
1117   }
1118 .head-font{
1119   /*font-weight: bold;*/
1120   /*font-size: 25px;*/
1121 }
1122 span{
1123   font-size: 15px;
1124 }
1125 .el-table .warning-row {
1126   background: oldlace;
1127 }
1128
1129 .el-table .success-row {
1130   background: #f0f9eb;
1131 }
1132 </style>
1133