Jcdm041-Mes.git

wujian

2024-08-03 131e8c0adbd4f56e1f7e7f877ff1b03e1683314f

提交 \| 用户 \| 时间
1c7036	1	<template>
Y	2	<div class="app-container">
	3	<div style="width: 100%">
	4	<el-card class="box-card" style="height: 60px" >
	5	<template>
	6	<div class="container" type="flex" justify="center" style="text-align:center">
	7	<el-divider><span style="font-size:30px;color:black"><strong>曲轴上线</strong></span></el-divider>
	8	</div>
	9	</template>
	10	</el-card>
	11
	12	<el-card class="box-card" >
	13	<el-form :model="from" size="large" :inline="true" label-width="68px" @submit.native.prevent>
	14	<el-form-item label-width="200" label="曲轴码" :prop="from.scanObject2" style="align-content: center">
	15	<input v-model="from.scanObject2"
	16	ref="inputdata"
	17	style="height: 39px; width: 300px"
	18	placeholder="请输入曲轴码"
	19	/>
	20	</el-form-item>
	21	<!-- <el-button type="primary" icon="el-icon-refresh" @click="handleQuery">查询</el-button>-->
	22	</el-form>
	23	</el-card>
	24	<el-col :span="24" >
	25	<el-card class="bottom-card">
	26	<div slot="header" class="clearfix">
	27	<i class="el-icon-tickets"></i>
	28	<span style="font-weight: bold">当前产品信息</span>
	29	</div>
	30	<el-descriptions :column="1" :label-style="{'font-size': '20px'}" border :content-style="{'min-width': '300px'}">
	31	<el-descriptions-item label="机型">
	32	<span>{{queryParams.productSeries}}</span>
	33	</el-descriptions-item>
	34	<el-descriptions-item label="箱体码">
	35	<span>{{queryParams.scanObject1}}</span>
	36	</el-descriptions-item>
	37	<el-descriptions-item label="曲轴码">
	38	<span>{{queryParams.scanObject2}}</span>
	39	</el-descriptions-item>
	40	<el-descriptions-item label="结果">
5030f3	41	<span style="color: #FFFFFF;" :style="{ backgroundColor: queryParams.tileColor }">{{queryParams.words}}</span>
1c7036	42	</el-descriptions-item>
Y	43	</el-descriptions>
	44	<el-divider></el-divider>
	45	</el-card>
	46	</el-col>
	47	</div>
	48	</div>
	49	</template>
	50	<script>
	51	import VueQr from 'vue-qr'
	52	import { listTileMatchRules, getTileMatchRules, delTileMatchRules, addTileMatchRules, updateTileMatchRules } from "@/api/main/bs/tileMatchRules/tileMatchRules";
	53	import {listStationConf,getIp} from "@/api/main/sc/stationConf";
5030f3	54	import {setBarcode1} from "@/api/main/da/opcuaconfig/opcuaconfig";
59e228	55	import WebSocketReconnect from "@/utils/WebsocketTool";
W	56	import {getUrl} from "@/api/main/bs/orderScheduling/orderScheduling";
1c7036	57	export default {
Y	58	name: "index",
	59	dicts: ['colour_hex','productseries','axisname','neckname','tilename'],
	60	components: {
	61	VueQr,
	62	},
	63	data(){
	64	return{
	65	scannerFlag: false,
	66	loading: true,
59e228	67	locationCode: "OP030",
1c7036	68	locationName: "未配置工位",
Y	69	tileMatchKbList: [],
	70	qrCode: '',
	71	// 查询参数
	72	from:{
	73	pageNum: 1,
	74	pageSize: 10,
	75	productSeries: null,
	76	scanObject1: null,
	77	//scanObject1: 'P0SQ0-01FZ01-1000;T231224116;DBBBBA',
	78	scanObject2: "",
	79	axisName: null,
	80	neckName: null,
	81	tileName: null,
	82	axisParameterNoPosition: null,
	83	neckParameterPosition: null,
	84	axisValue: null,
	85	neckValue: null,
	86	tileColor: null,
	87	createUser: null,
	88	updateUser: null,
	89	state: null,
	90	weight: null,
	91	},
	92	queryParams: {
	93	pageNum: 1,
	94	pageSize: 10,
	95	productSeries: null,
	96	scanObject1: null,
	97	// scanObject1: 'P0SQ0-01FZ01-1000;T231224116;DBBBBA',
	98	scanObject2: null,
	99	axisName: null,
	100	neckName: null,
	101	tileName: null,
	102	axisParameterNoPosition: null,
	103	neckParameterPosition: null,
	104	axisValue: null,
	105	neckValue: null,
5030f3	106	words:"",
1c7036	107	tileColor: null,
Y	108	createUser: null,
	109	updateUser: null,
	110	state: null,
	111	weight: null,
	112	},
	113	}
	114	},
	115	mounted() {
59e228	116	this.getWebUrl()
1c7036	117	this.setFocus()
Y	118	//this.getNowTime()
	119	this.$refs.inputdata.addEventListener('keydown',this.handleScannerInput)
	120	},
	121	beforeDestroy() {
	122	this.$refs.inputdata.removeEventListener('keydown',this.handleScannerInput)
	123	},
	124	methods:{
59e228	125	getWebUrl(){
W	126	getUrl().then(res=>{
	127	this.websocketUrl = res+"OP030"
	128	console.log('websocketUrl：',this.websocketUrl)
	129	this.initWebSocket()
	130	})
	131	},
	132	initWebSocket: function (){
	133	//判断当前浏览器是否支持WebSocket
	134	if ('WebSocket' in window) {
	135	//连接WebSocket节点
	136	this.websocket = new WebSocketReconnect(this.websocketUrl);
	137	//接收到消息的回调方法
	138	this.websocket.socket.onmessage = (event) => {
	139	let data = event.data;
	140	if (data != null && data !== ''){
	141	this.result = JSON.parse(data);
d2daac	142	console.log('this.result.server_message',this.result.server_message)
59e228	143	if (this.result.server_message === 'clean'){
d2daac	144	this.$refs.inputdata.focus();
59e228	145	this.from.scanObject1 = ''
W	146	this.from.scanObjectCopy = ''
	147	this.from.scanObject2 = ''
	148	this.from.scanObject3 = ''
	149	this.from.scanObject4 = ''
	150	this.from.scanObject5 = ''
	151	this.queryParams.productSeries = ''
	152	this.queryParams.scanObject1 = ''
	153	this.queryParams.scanObjectCopy = ''
	154	this.queryParams.scanObject2 = ''
	155	this.queryParams.scanObject3 = ''
	156	this.queryParams.scanObject4 = ''
	157	this.queryParams.scanObject5 = ''
	158	this.queryParams.checkResult = ''
	159	this.queryParams.checkResultColor = ''
	160	this.queryParams.tileColor = ''
	161	this.queryParams.words = ''
	162	} else if (this.result.server_message.indexOf("*") !== -1){
	163	const parts1 = this.result.server_message.split("*");
	164	if (parts1.length >= 2) {
	165	console.log("44",parts1)
	166	//const axisValueextracted = parts1[2].substring(3,4);
	167	this.queryParams.productSeries = parts1[0]
	168	this.queryParams.scanObject1 = parts1[1]
	169	}
	170	}
	171	}
	172	}
	173	//监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
	174	window.onbeforeunload = function () {
	175	this.websocket.close()
	176	}
	177	//关闭连接
	178	function closeWebSocket() {
	179	this.websocket.close()
	180	}
	181	} else {
	182	alert('浏览器不支持webSocket')
	183	}
	184	},
1c7036	185	refresh() {
Y	186	location.reload();
	187	},
	188	setFocus(){
	189	this.$nextTick(()=>{
	190	this.$refs.inputdata.focus()
	191	})
	192	},
	193	handleScannerInput(event){
	194	if (this.scannerFlag){
	195	this.from.scanObject2 = ''
	196	this.$refs.inputdata.value = ''
	197	this.scannerFlag = false
	198	}
	199	const input = event.target
	200	const inputValue = input.value
5030f3	201	//this.from.scanObject2 = inputValue
1c7036	202	if (event.key === 'Enter'){
Y	203	this.scannerFlag = true
5030f3	204	this.from.scanObject2 = inputValue
Y	205	//console.log('条码：',this.from.scanObject2,this.locationCode)
59e228	206	if (this.from.scanObject2 !== null && this.from.scanObject2 !== '' && this.locationCode !== '' ) {
5030f3	207	console.log('条码：',this.from.scanObject2,this.locationCode)
Y	208	setBarcode1({barcode:this.from.scanObject2,locationCode:this.locationCode}).then(res => {
59e228	209	if (res.code === 200){
5030f3	210	this.$message({
Y	211	message:'操作成功',
	212	type:'success'
	213	})
	214	console.log('返回：',res)
59e228	215	this.queryParams.scanObject2 = this.from.scanObject2
5030f3	216	this.queryParams.words="扫码成功";
Y	217	this.queryParams.tileColor='#00FF00';
59e228	218	}else {
W	219	this.$message({
	220	message:res.msg,
	221	type:'warning'
	222	})
5030f3	223	}
Y	224	})
	225
	226	}
	227	//setBarcode({barcode:'1111',locationCode:'555555'})
	228	// //扫描完成
	229	// if(this.form.scanObject2 !== null && this.form.scanObject2 !== undefined){
	230	// console.log('条码：',this.from.scanObject2,this.locationCode)
	231	// //setBarcode(this.form.scanObject2,this.locationCode)
	232	// }
1c7036	233	}
Y	234	},
	235
	236	/** 搜索按钮操作 */
131e8c	237	// handleQuery() {
W	238	// this.clear();
	239	// if(this.from.scanObject1 !== null && this.from.scanObject2 !== null
	240	// && this.from.axisName !== null && this.from.axisName !== ""
	241	// && this.from.neckName !== null && this.from.neckName !== ""
	242	// && this.from.tileName !== null && this.from.tileName !== ""
	243	// && this.from.productSeries !== null && this.from.productSeries !== "")
	244	// {
	245	// this.axisValueextracted();
	246	// this.neckValueextracted();
	247	// if(this.queryParams.axisValue !== null && this.queryParams.neckValue !== null){
	248	// this.insetFromToQueryParams();
	249	// this.getList();
	250	// }
	251	// else{
	252	// const h = this.$createElement;
	253	// this.$message({
	254	// message: h('p',null, [
	255	// h('span', null, '警告 '),
	256	// h('i', { style: 'color: black' }, '箱体码或曲轴码输入有误'),
	257	// h()]),
	258	// type: 'error',
	259	// center: true,
	260	// offset:300
	261	// });
	262	// }
	263	// }
	264	// else{
	265	// const h = this.$createElement;
	266	// this.$message({
	267	// message: h('p',null, [
	268	// h('span', null, '警告 '),
	269	// h('i', { style: 'color: black' }, '请填写所有搜索条件'),
	270	// h()]),
	271	// type: 'error',
	272	// center: true,
	273	// offset:300
	274	// });
	275	// }
	276	// },
1c7036	277
Y	278	// 取箱体码第三段为配瓦值
	279	axisValueextracted() {
	280	const parts1 = this.from.scanObject1.split(";");
	281	if (parts1.length >= 3) {
	282	//const axisValueextracted = parts1[2].substring(3,4);
	283	const axisValueextracted = parts1[2];
	284	return this.queryParams.axisValue= axisValueextracted;
	285
	286	}
	287	},
	288
	289	//取曲轴码第三段为配瓦值
	290	neckValueextracted() {
	291	const parts2 = this.from.scanObject2.split(";");
	292	if (parts2.length >= 3) {
	293	//const neckValueextracted = parts2[2].substring(3,4);
	294	const neckValueextracted = parts2[2];
	295	return this.queryParams.neckValue= neckValueextracted;
	296	}
	297	},
	298	//取配瓦颜色
	299	getList() {
	300	let queryParams = {
	301	productSeries : this.queryParams.productSeries,
	302	axisName : this.queryParams.axisName,
	303	neckName : this.queryParams.neckName,
	304	tileName : this.queryParams.tileName,
	305	axisValue: this.queryParams.axisValue,
	306	neckValue: this.queryParams.neckValue,
	307	}
	308	console.log(queryParams)
	309	listTileMatchRules(queryParams).then(response => {
	310	this.queryParams.tileColor = response.rows[0].tileColor;
	311	});
	312	},
	313	clear(){
	314	this.queryParams.axisValue=null;
	315	this.queryParams.neckValue=null;
	316	},
	317	insetFromToQueryParams(){
	318	this.queryParams.productSeries=this.from.productSeries;
	319	this.queryParams.axisName=this.from.axisName;
	320	this.queryParams.neckName=this.from.neckName;
	321	this.queryParams.tileName=this.from.tileName;
	322	this.queryParams.scanObject1=this.from.scanObject1;
	323	this.queryParams.scanObject2=this.from.scanObject2;
	324	}
	325
	326	},
	327	}
	328	</script>
	329
	330	<style scoped>
	331	::v-deep .el-form-item__label{
	332	font-size: large;
	333	}
	334	::v-deep .el-card__body{
	335	padding: 15px 20px 0px 20px;
	336	}
	337	::v-deep .el-input .el-input--medium .el-input--suffix{
	338	width: 200px;
	339	}
	340	.boxSize{
	341	height: 60px;
	342	}
	343	.centerText{
	344	color: black;
	345	font-weight: bold;
	346	font-size: 20px;
	347	display: flex;
	348	justify-content: center;
	349	margin-top: 5px
	350	}
	351	</style>