Jcdm041-Mes.git

yyt

2024-06-03 5030f3d30ccc1bd16db371c6970a48103aff9191

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