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