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