春风项目四线(合箱线、总装线)
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"  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       <el-row :gutter="3">
12         <el-col :span="6">
13           <el-card shadow="always" class="boxSize">
14             <div class="centerImg">
15               <img style="width: 140px;height: 30px;" src="@/assets/logo/jcdm2.png" alt="dark">
16             </div>
17
18           </el-card>
19         </el-col>
20         <el-col :span="3">
21           <el-card shadow="always" class="boxSize">
22             <span class="centerText" style="height: 60px">{{locationCode}}</span>
23           </el-card>
24         </el-col>
25         <el-col :span="15">
26           <el-card shadow="always" class="boxSize">
27             <span class="centerText" >{{locationName}}</span>
28           </el-card>
29         </el-col>
30       </el-row>
31       <el-card class="box-card" >
32         <el-form :model="from" size="large" :inline="true" label-width="68px" @submit.native.prevent>
33           <el-form-item label-width="200" label="曲轴码" :prop="from.scanObject2"  style="align-content: center">
34             <input v-model="from.scanObject2"
35                    ref="inputdata"
36                    style="height: 39px; width: 300px"
37                    placeholder="请输入曲轴码"
38             />
39           </el-form-item>
40           <!--          <el-button type="primary" icon="el-icon-refresh" @click="handleQuery">查询</el-button>-->
41         </el-form>
42       </el-card>
43       <el-col :span="24" >
44         <el-card class="bottom-card">
45           <div slot="header" class="clearfix">
46             <i class="el-icon-tickets"></i>
47             <span style="font-weight: bold">当前产品信息</span>
48           </div>
49           <el-descriptions :column="1"  :label-style="{'font-size': '20px'}" border  :content-style="{'min-width': '300px'}">
50             <el-descriptions-item label="机型">
51               <span>{{queryParams.productSeries}}</span>
52             </el-descriptions-item>
53             <el-descriptions-item label="箱体码">
54               <span>{{queryParams.scanObject1}}</span>
55             </el-descriptions-item>
56             <el-descriptions-item label="曲轴码">
57               <span>{{queryParams.scanObject2}}</span>
58             </el-descriptions-item>
59             <el-descriptions-item label="结果">
5030f3 60               <span  style="color: #FFFFFF;"  :style="{ backgroundColor: queryParams.tileColor }">{{queryParams.words}}</span>
1c7036 61             </el-descriptions-item>
Y 62           </el-descriptions>
63           <el-divider></el-divider>
64         </el-card>
65       </el-col>
66     </div>
67   </div>
68 </template>
69 <script>
70 import VueQr from 'vue-qr'
71 import { listTileMatchRules, getTileMatchRules, delTileMatchRules, addTileMatchRules, updateTileMatchRules } from "@/api/main/bs/tileMatchRules/tileMatchRules";
72 import {listStationConf,getIp} from "@/api/main/sc/stationConf";
5030f3 73 import {setBarcode1} from "@/api/main/da/opcuaconfig/opcuaconfig";
1c7036 74 export default {
Y 75   name: "index",
76   dicts: ['colour_hex','productseries','axisname','neckname','tilename'],
77   components: {
78     VueQr,
79   },
80   data(){
81     return{
82       scannerFlag: false,
83       loading: true,
84       locationCode: "未配置",
85       locationName: "未配置工位",
86       tileMatchKbList: [],
87       qrCode: '',
88       // 查询参数
89       from:{
90         pageNum: 1,
91         pageSize: 10,
92         productSeries: null,
93         scanObject1: null,
94         //scanObject1: 'P0SQ0-01FZ01-1000;T231224116;DBBBBA',
95         scanObject2: "",
96         axisName: null,
97         neckName: null,
98         tileName: null,
99         axisParameterNoPosition: null,
100         neckParameterPosition: null,
101         axisValue: null,
102         neckValue: null,
103         tileColor: null,
104         createUser: null,
105         updateUser: null,
106         state: null,
107         weight: null,
108       },
109       queryParams: {
110         pageNum: 1,
111         pageSize: 10,
112         productSeries: null,
113         scanObject1: null,
114         // scanObject1: 'P0SQ0-01FZ01-1000;T231224116;DBBBBA',
115         scanObject2: null,
116         axisName: null,
117         neckName: null,
118         tileName: null,
119         axisParameterNoPosition: null,
120         neckParameterPosition: null,
121         axisValue: null,
122         neckValue: null,
5030f3 123         words:"",
1c7036 124         tileColor: null,
Y 125         createUser: null,
126         updateUser: null,
127         state: null,
128         weight: null,
129       },
130     }
131   },
132   mounted() {
133     this.setFocus()
134     this.getStationConf()
135     //this.getNowTime()
136     this.$refs.inputdata.addEventListener('keydown',this.handleScannerInput)
137   },
138   beforeDestroy() {
139     this.$refs.inputdata.removeEventListener('keydown',this.handleScannerInput)
140   },
141   methods:{
142     refresh() {
143       location.reload();
144     },
145     setFocus(){
146       this.$nextTick(()=>{
147         this.$refs.inputdata.focus()
148       })
149     },
150     handleScannerInput(event){
151       if (this.scannerFlag){
152         this.from.scanObject2 = ''
153         this.$refs.inputdata.value = ''
154         this.scannerFlag = false
155       }
156       const input = event.target
157       const inputValue = input.value
5030f3 158       //this.from.scanObject2 = inputValue
1c7036 159       if (event.key === 'Enter'){
Y 160         this.scannerFlag = true
5030f3 161         this.from.scanObject2 = inputValue
Y 162         //console.log('条码:',this.from.scanObject2,this.locationCode)
163         if (typeof this.from.scanObject2 !== 'undefined'&& typeof this.locationCode !== 'undefined' ) {
164           console.log('条码:',this.from.scanObject2,this.locationCode)
165           setBarcode1({barcode:this.from.scanObject2,locationCode:this.locationCode}).then(res => {
166             if (res.data===500){
167               this.$message({
168                 message:res.msg,
169                 type:'warning'
170               })
171             }else {
172               this.$message({
173                 message:'操作成功',
174                 type:'success'
175               })
176               console.log('返回:',res)
177               this.queryParams.productSeries=res.sfcCode
178               this.queryParams.scanObject1=res.paramValue
179               this.queryParams.scanObject2=this.from.scanObject2
180               this.queryParams.words="扫码成功";
181               this.queryParams.tileColor='#00FF00';
182
183             }
184           })
185
186         }
187         //setBarcode({barcode:'1111',locationCode:'555555'})
188         // //扫描完成
189         // if(this.form.scanObject2 !== null && this.form.scanObject2 !== undefined){
190         //   console.log('条码:',this.from.scanObject2,this.locationCode)
191         //   //setBarcode(this.form.scanObject2,this.locationCode)
192         // }
1c7036 193       }
Y 194     },
195
196     /** 查询工位终端配置列表 */
197     getStationConf() {
198       getIp().then(response => {
199         let queryParams = {
200           ipAddress: response.msg,
201         }
202         listStationConf(queryParams).then(response => {
203           this.locationName = response.rows[0].processesName
204           this.locationCode = response.rows[0].processesCode
205         });
206       });
207     },
208     /** 搜索按钮操作 */
209     handleQuery() {
210       this.clear();
211       if(this.from.scanObject1 !== null && this.from.scanObject2 !== null
212         && this.from.axisName !== null && this.from.axisName !== ""
213         && this.from.neckName !== null && this.from.neckName !== ""
214         && this.from.tileName !== null && this.from.tileName !== ""
215         && this.from.productSeries !== null && this.from.productSeries !== "")
216       {
217         this.axisValueextracted();
218         this.neckValueextracted();
219         if(this.queryParams.axisValue !== null && this.queryParams.neckValue !== null){
220           this.insetFromToQueryParams();
221           this.getList();
222         }
223         else{
224           const h = this.$createElement;
225           this.$message({
226             message: h('p',null, [
227               h('span', null, '警告 '),
228               h('i', { style: 'color: black' }, '箱体码或曲轴码输入有误'),
229               h()]),
230             type: 'error',
231             center: true,
232             offset:300
233           });
234         }
235       }
236       else{
237         const h = this.$createElement;
238         this.$message({
239           message: h('p',null, [
240             h('span', null, '警告 '),
241             h('i', { style: 'color: black' }, '请填写所有搜索条件'),
242             h()]),
243           type: 'error',
244           center: true,
245           offset:300
246         });
247       }
248     },
249
250     // 取箱体码第三段为配瓦值
251     axisValueextracted() {
252       const parts1 = this.from.scanObject1.split(";");
253       if (parts1.length >= 3) {
254         //const axisValueextracted = parts1[2].substring(3,4);
255         const axisValueextracted = parts1[2];
256         return this.queryParams.axisValue= axisValueextracted;
257
258       }
259     },
260
261     //取曲轴码第三段为配瓦值
262     neckValueextracted() {
263       const parts2 = this.from.scanObject2.split(";");
264       if (parts2.length >= 3) {
265         //const neckValueextracted = parts2[2].substring(3,4);
266         const neckValueextracted = parts2[2];
267         return this.queryParams.neckValue= neckValueextracted;
268       }
269     },
270     //取配瓦颜色
271     getList() {
272       let queryParams = {
273         productSeries : this.queryParams.productSeries,
274         axisName : this.queryParams.axisName,
275         neckName : this.queryParams.neckName,
276         tileName : this.queryParams.tileName,
277         axisValue: this.queryParams.axisValue,
278         neckValue: this.queryParams.neckValue,
279       }
280       console.log(queryParams)
281       listTileMatchRules(queryParams).then(response => {
282         this.queryParams.tileColor = response.rows[0].tileColor;
283       });
284     },
285     clear(){
286       this.queryParams.axisValue=null;
287       this.queryParams.neckValue=null;
288     },
289     insetFromToQueryParams(){
290       this.queryParams.productSeries=this.from.productSeries;
291       this.queryParams.axisName=this.from.axisName;
292       this.queryParams.neckName=this.from.neckName;
293       this.queryParams.tileName=this.from.tileName;
294       this.queryParams.scanObject1=this.from.scanObject1;
295       this.queryParams.scanObject2=this.from.scanObject2;
296     }
297
298   },
299 }
300 </script>
301
302 <style scoped>
303 ::v-deep .el-form-item__label{
304   font-size: large;
305 }
306 ::v-deep .el-card__body{
307   padding: 15px 20px 0px 20px;
308 }
309 ::v-deep .el-input .el-input--medium .el-input--suffix{
310   width: 200px;
311 }
312 .boxSize{
313   height: 60px;
314 }
315 .centerText{
316   color: black;
317   font-weight: bold;
318   font-size: 20px;
319   display: flex;
320   justify-content: center;
321   margin-top: 5px
322 }
323 </style>