| | |
| | | </el-card> |
| | | </el-col> |
| | | </el-row> |
| | | <el-card class="box-card" > |
| | | <el-form :model="from" size="large" :inline="true" label-width="68px" @submit.native.prevent> |
| | | <el-form-item label-width="200" label="活塞连杆托盘码" :prop="from.scanObject2" style="align-content: center"> |
| | | <input v-model="from.scanObject2" |
| | | ref="inputdata" |
| | | style="height: 39px; width: 300px" |
| | | placeholder="请输入活塞连杆托盘码" |
| | | /> |
| | | </el-form-item> |
| | | <!-- <el-button type="primary" icon="el-icon-refresh" @click="handleQuery">查询</el-button>--> |
| | | </el-form> |
| | | </el-card> |
| | | <!-- <el-card class="box-card" >--> |
| | | <!-- <el-form :model="from" size="large" :inline="true" label-width="68px" @submit.native.prevent>--> |
| | | <!-- <el-form-item label-width="200" label="活塞连杆托盘码" :prop="from.scanObject2" style="align-content: center">--> |
| | | <!-- <input v-model="from.scanObject2"--> |
| | | <!-- ref="inputdata"--> |
| | | <!-- style="height: 39px; width: 300px"--> |
| | | <!-- placeholder="请输入活塞连杆托盘码"--> |
| | | <!-- />--> |
| | | <!-- </el-form-item>--> |
| | | <!--<!– <el-button type="primary" icon="el-icon-refresh" @click="handleQuery">查询</el-button>–>--> |
| | | <!-- </el-form>--> |
| | | <!-- </el-card>--> |
| | | <el-col :span="24" > |
| | | <el-card class="bottom-card"> |
| | | <div slot="header" class="clearfix"> |
| | |
| | | <el-descriptions-item label="机型"> |
| | | <span>{{queryParams.productSeries}}</span> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item label="箱体码"> |
| | | <el-descriptions-item label="箱体对应SN码"> |
| | | <span>{{queryParams.scanObject1}}</span> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item label="曲轴码"> |
| | | <el-descriptions-item label="曲轴对应SN码"> |
| | | <span>{{queryParams.scanObject2}}</span> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item label="结果"> |
| | | <span style="color: #FFFFFF;" :style="{ backgroundColor: queryParams.tileColor }">{{queryParams.tileColor}}</span> |
| | | <span style="color: #FFFFFF;" :style="{ backgroundColor: queryParams.tileColor }">{{queryParams.words}}</span> |
| | | </el-descriptions-item> |
| | | </el-descriptions> |
| | | <el-divider></el-divider> |
| | |
| | | import VueQr from 'vue-qr' |
| | | import { listTileMatchRules, getTileMatchRules, delTileMatchRules, addTileMatchRules, updateTileMatchRules } from "@/api/main/bs/tileMatchRules/tileMatchRules"; |
| | | import {listStationConf,getIp} from "@/api/main/sc/stationConf"; |
| | | import {setBarcodeup, outSign, getDetailData} from "@/api/main/da/tileMatchMiddleware/tileMatchMiddleware"; |
| | | import {getUrl} from "@/api/main/bs/orderScheduling/orderScheduling"; |
| | | import WebSocketReconnect from "@/utils/WebsocketTool"; |
| | | import result from "../../../../components/Crontab/result.vue"; |
| | | export default { |
| | | name: "index", |
| | | dicts: ['colour_hex','productseries','axisname','neckname','tilename'], |
| | |
| | | productSeries: null, |
| | | scanObject1: null, |
| | | //scanObject1: 'P0SQ0-01FZ01-1000;T231224116;DBBBBA', |
| | | scanObject2: "", |
| | | scanObject2: null, |
| | | axisName: null, |
| | | neckName: null, |
| | | tileName: null, |
| | |
| | | neckParameterPosition: null, |
| | | axisValue: null, |
| | | neckValue: null, |
| | | words:"", |
| | | tileColor: null, |
| | | createUser: null, |
| | | updateUser: null, |
| | |
| | | } |
| | | }, |
| | | mounted() { |
| | | this.setFocus() |
| | | this.getStationConf() |
| | | //this.getNowTime() |
| | | this.$refs.inputdata.addEventListener('keydown',this.handleScannerInput) |
| | | }, |
| | | beforeDestroy() { |
| | | this.$refs.inputdata.removeEventListener('keydown',this.handleScannerInput) |
| | | this.getWebUrl() |
| | | this.getDetailMessage() |
| | | }, |
| | | methods:{ |
| | | refresh() { |
| | | location.reload(); |
| | | }, |
| | | setFocus(){ |
| | | this.$nextTick(()=>{ |
| | | this.$refs.inputdata.focus() |
| | | getWebUrl(){ |
| | | getUrl().then(res=>{ |
| | | this.websocketUrl = res+"OP050" |
| | | console.log('websocketUrl:',this.websocketUrl) |
| | | this.initWebSocket() |
| | | }) |
| | | }, |
| | | handleScannerInput(event){ |
| | | if (this.scannerFlag){ |
| | | this.from.scanObject2 = '' |
| | | this.$refs.inputdata.value = '' |
| | | this.scannerFlag = false |
| | | } |
| | | const input = event.target |
| | | const inputValue = input.value |
| | | this.from.scanObject2 = inputValue |
| | | if (event.key === 'Enter'){ |
| | | this.scannerFlag = true |
| | | console.log('条码:',this.from.scanObject2) |
| | | //扫描完成 |
| | | initWebSocket: function (){ |
| | | //判断当前浏览器是否支持WebSocket |
| | | if ('WebSocket' in window) { |
| | | //连接WebSocket节点 |
| | | this.websocket = new WebSocketReconnect(this.websocketUrl); |
| | | //接收到消息的回调方法 |
| | | this.websocket.socket.onmessage = (event) => { |
| | | let data = event.data; |
| | | if (data != null && data !== ''){ |
| | | this.result = JSON.parse(data); |
| | | const resultMessage = this.result.server_message.split("*"); |
| | | console.log('resultMessage',resultMessage) |
| | | if (resultMessage.length >=2){ |
| | | if (resultMessage[1] === "sfcCode"){ |
| | | this.queryParams.scanObject1 = resultMessage[0] |
| | | this.queryParams.productSeries = resultMessage[2] |
| | | this.queryParams.scanObject2 = resultMessage[3] |
| | | } else if (resultMessage[1] === "rodCode"){ |
| | | this.queryParams.scanObject2 = resultMessage[0] |
| | | this.queryParams.productSeries = resultMessage[2] |
| | | } else if (resultMessage[1] === "clean"){ |
| | | this.queryParams.scanObject1 = "" |
| | | this.queryParams.scanObject2 = "" |
| | | this.queryParams.words = "" |
| | | this.queryParams.tileColor = "" |
| | | } |
| | | } |
| | | if (this.queryParams.scanObject1 !== null && this.queryParams.scanObject1 !== '' |
| | | && this.queryParams.scanObject2 !== null && this.queryParams.scanObject2 !== ''){ |
| | | if (this.queryParams.scanObject1 === this.queryParams.scanObject2){ |
| | | this.queryParams.words = "配对成功" |
| | | this.queryParams.tileColor = "#3dcc1d" |
| | | //请求出站 |
| | | // this.passStation() |
| | | }else { |
| | | this.queryParams.words = "配对失败" |
| | | this.queryParams.tileColor = "#f50909" |
| | | } |
| | | } |
| | | |
| | | |
| | | // const parts3 = this.result.server_message.split("*"); |
| | | // if (parts3.length >= 2) { |
| | | // this.from.scanObject2=parts3[0]; |
| | | // this.queryParams.words=parts3[1]; |
| | | // this.queryParams.tileColor= parts3[2]; |
| | | // this.handleQuery(); |
| | | // } |
| | | } |
| | | } |
| | | //监听窗口关闭事件,当窗口关闭时,主动去关闭websocket连接,防止连接还没断开就关闭窗口,server端会抛异常。 |
| | | window.onbeforeunload = function () { |
| | | this.websocket.close() |
| | | } |
| | | //关闭连接 |
| | | function closeWebSocket() { |
| | | this.websocket.close() |
| | | } |
| | | //发送消息 |
| | | function send() { |
| | | this.websocket.socket.send({ kk: 123 }) |
| | | } |
| | | } else { |
| | | alert('浏览器不支持webSocket') |
| | | } |
| | | }, |
| | | |
| | | //刷新获取信息 |
| | | getDetailMessage(){ |
| | | getDetailData().then(res => { |
| | | if (res.data == 200){ |
| | | console.log('res200',res) |
| | | this.queryParams.scanObject1 = res.SfcCode |
| | | this.queryParams.productSeries = res.productSeries |
| | | } |
| | | }) |
| | | }, |
| | | /** 查询工位终端配置列表 */ |
| | | getStationConf() { |
| | | getIp().then(response => { |
| | |
| | | }); |
| | | }); |
| | | }, |
| | | passStation(){ |
| | | outSign().then(res =>{ |
| | | console.log("res",res) |
| | | if (res.code === 200){ |
| | | console.log('1212121') |
| | | this.$message({ |
| | | message: '匹配成功,已过站', |
| | | type: 'success', |
| | | duration:3000 |
| | | }); |
| | | this.queryParams.productSeries = '' |
| | | this.queryParams.scanObject1 = '' |
| | | this.queryParams.scanObject2 = '' |
| | | this.queryParams.words = '' |
| | | this.queryParams.tileColor = '' |
| | | |
| | | } |
| | | }) |
| | | }, |
| | | /** 搜索按钮操作 */ |
| | | handleQuery() { |
| | | this.clear(); |
| | | if(this.from.scanObject1 !== null && this.from.scanObject2 !== null |
| | | && this.from.axisName !== null && this.from.axisName !== "" |
| | | && this.from.neckName !== null && this.from.neckName !== "" |
| | | && this.from.tileName !== null && this.from.tileName !== "" |
| | | && this.from.productSeries !== null && this.from.productSeries !== "") |
| | | if(this.from.scanObject2 !== null) |
| | | { |
| | | this.axisValueextracted(); |
| | | this.neckValueextracted(); |
| | | if(this.queryParams.axisValue !== null && this.queryParams.neckValue !== null){ |
| | | this.insetFromToQueryParams(); |
| | | this.getList(); |
| | | } |
| | | else{ |
| | | const h = this.$createElement; |
| | | this.$message({ |
| | | message: h('p',null, [ |
| | | h('span', null, '警告 '), |
| | | h('i', { style: 'color: black' }, '箱体码或曲轴码输入有误'), |
| | | h()]), |
| | | type: 'error', |
| | | center: true, |
| | | offset:300 |
| | | }); |
| | | } |
| | | } |
| | | else{ |
| | | this.insetFromToQueryParams(); |
| | | //this.getList(); |
| | | } else{ |
| | | const h = this.$createElement; |
| | | this.$message({ |
| | | message: h('p',null, [ |
| | |
| | | }); |
| | | } |
| | | }, |
| | | |
| | | // 取箱体码第三段为配瓦值 |
| | | axisValueextracted() { |
| | | const parts1 = this.from.scanObject1.split(";"); |
| | | if (parts1.length >= 3) { |
| | | //const axisValueextracted = parts1[2].substring(3,4); |
| | | const axisValueextracted = parts1[2]; |
| | | return this.queryParams.axisValue= axisValueextracted; |
| | | |
| | | } |
| | | }, |
| | | |
| | | //取曲轴码第三段为配瓦值 |
| | | neckValueextracted() { |
| | | const parts2 = this.from.scanObject2.split(";"); |
| | | if (parts2.length >= 3) { |
| | | //const neckValueextracted = parts2[2].substring(3,4); |
| | | const neckValueextracted = parts2[2]; |
| | | return this.queryParams.neckValue= neckValueextracted; |
| | | } |
| | | cleanForm(){ |
| | | this.queryParams.productSeries = "" |
| | | this.queryParams.scanObject1 = "" |
| | | this.queryParams.scanObject2 = "" |
| | | this.queryParams.words = "" |
| | | this.queryParams.tileColor = "" |
| | | }, |
| | | //取配瓦颜色 |
| | | getList() { |
| | |
| | | }, |
| | | insetFromToQueryParams(){ |
| | | this.queryParams.productSeries=this.from.productSeries; |
| | | this.queryParams.axisName=this.from.axisName; |
| | | this.queryParams.neckName=this.from.neckName; |
| | | this.queryParams.tileName=this.from.tileName; |
| | | this.queryParams.scanObject1=this.from.scanObject1; |
| | | this.queryParams.scanObject2=this.from.scanObject2; |
| | | } |
| | | |