From 49ac5ceb9f6b2e065e5d1c61aad2de63399304e1 Mon Sep 17 00:00:00 2001
From: 懒羊羊 <15939171744@163.com>
Date: 星期一, 08 一月 2024 15:58:30 +0800
Subject: [PATCH] 工位终端优化
---
jcdm-ui/src/views/main/kb/stationTerminal/index.vue | 191 ++++++++++++++++++++++++++++++++++-------------
1 files changed, 139 insertions(+), 52 deletions(-)
diff --git a/jcdm-ui/src/views/main/kb/stationTerminal/index.vue b/jcdm-ui/src/views/main/kb/stationTerminal/index.vue
index 75f4f62..6169b62 100644
--- a/jcdm-ui/src/views/main/kb/stationTerminal/index.vue
+++ b/jcdm-ui/src/views/main/kb/stationTerminal/index.vue
@@ -2,18 +2,21 @@
<div class="app-container">
<el-row :gutter="5">
<el-col :span="6">
- <el-card shadow="hover">
- 宸ヤ綅缂栧彿 : OP1010
+ <el-card shadow="never">
+ <span class="head-font">宸ヤ綅缂栧彿 : {{headContent.processesCode}}</span>
</el-card>
</el-col>
<el-col :span="6">
- <el-card shadow="hover">
- 宸ヤ綅鍚嶇О : 璐存爣鏈�-璐寸爜
+ <el-card shadow="never">
+ <span class="head-font">宸ヤ綅鍚嶇О : {{headContent.processesName}}</span>
</el-card>
</el-col>
<el-col :span="12">
- <el-card shadow="hover">
- 鎬绘垚缂栫爜 : 1000000000000001
+ <el-card shadow="never">
+ <span class="head-font">鎬绘垚缂栫爜 : {{headContent.sfcCode}}</span>
+ <el-input v-model="input" style="float: right;width: 150px;" placeholder="璇疯緭鍏ュ唴瀹�"></el-input>
+ <el-button @click="scanCompleted" style="float: right" type="primary">鎵爜瀹屾垚</el-button>
+ <el-button @click="clearClick" style="float: right" type="danger">娓呴櫎</el-button>
</el-card>
</el-col>
@@ -22,68 +25,60 @@
<el-col :span="6" >
<el-card class="bottom-card">
<div slot="header" class="clearfix">
- <span>褰撳墠宸ヤ欢淇℃伅</span>
+ <i class="el-icon-tickets"></i>
+ <span style="font-weight: bold">褰撳墠宸ヤ欢淇℃伅</span>
</div>
- <el-descriptions :column="1" border>
- <el-descriptions-item>
- <template slot="label">
- <span>宸ュ崟缂栧彿</span>
- </template>
- <span>test00000001</span>
+ <el-descriptions :column="1" :label-style="{'font-size': '15px'}" border :content-style="{'min-width': '150px'}">
+ <el-descriptions-item label="宸ュ崟缂栧彿">
+ <span>{{workpieceInformation.workOrderCode}}</span>
</el-descriptions-item>
- <el-descriptions-item>
- <template slot="label">
- <span>浜у搧缂栧彿</span>
- </template>
- <span>test00000001</span>
+ <el-descriptions-item label="浜у搧缂栧彿">
+ <span>{{workpieceInformation.productCode}}</span>
</el-descriptions-item>
- <el-descriptions-item>
- <template slot="label">
- <span>浜у搧鍨嬪彿</span>
- </template>
- <span>test00000001</span>
+ <el-descriptions-item label="浜у搧鍨嬪彿">
+ <span>{{workpieceInformation.productModel}}</span>
</el-descriptions-item>
- <el-descriptions-item>
- <template slot="label">
- <span>浜у搧鍚嶇О</span>
- </template>
- <span>test00000001</span>
+ <el-descriptions-item label="浜у搧鍚嶇О">
+ <span>{{workpieceInformation.productName}}</span>
</el-descriptions-item>
- <el-descriptions-item>
- <template slot="label">
- <span>鑺傛媿</span>
- </template>
- <span>姹熻嫃鐪佽嫃宸炲競鍚翠腑鍖哄惔涓�</span>
+ <el-descriptions-item label="鑺傛媿">
+ <span>{{workpieceInformation.beat}}</span>
</el-descriptions-item>
</el-descriptions>
<el-divider></el-divider>
<el-row>
<el-col :span="12">
- <el-button class="circle-button" circle></el-button>
+ <el-button class="circle-button" :class="cakeLamp.plcState ? 'circle-green-animate':'circle-red'" circle></el-button>
+ <span style="display: none">{{cakeLamp.plcState}}</span>
<span> PLC鐘舵��</span>
</el-col>
<el-col :span="12">
- <el-button class="circle-button" circle></el-button>
+ <el-button class="circle-button" :class="cakeLamp.scannerState ? 'circle-green-animate':'circle-red'" circle></el-button>
+ <span style="display: none">{{cakeLamp.scannerState}}</span>
<span> 鎵爜鏋姸鎬�</span>
</el-col>
</el-row>
<el-row style="margin-top: 20px">
<el-col :span="12">
- <el-button class="circle-button" circle></el-button>
+ <el-button class="circle-button" :class="cakeLamp.InPlace ? 'circle-green':'circle-red'" circle></el-button>
+ <span style="display: none">{{cakeLamp.InPlace}}</span>
<span> 宸ヤ欢鍒颁綅</span>
</el-col>
<el-col :span="12">
- <el-button class="circle-button" circle></el-button>
+ <el-button class="circle-button" :class="cakeLamp.scanFinish ? 'circle-green':'circle-red'" circle></el-button>
+ <span style="display: none">{{cakeLamp.scanFinish}}</span>
<span> 鎵爜瀹屾垚</span>
</el-col>
</el-row>
<el-row style="margin-top: 20px">
<el-col :span="12">
- <el-button class="circle-button" circle></el-button>
+ <el-button class="circle-button" :class="cakeLamp.startWork ? 'circle-green':'circle-red'" circle></el-button>
+ <span style="display: none">{{cakeLamp.startWork}}</span>
<span> 寮�濮嬩綔涓�</span>
</el-col>
<el-col :span="12">
- <el-button class="circle-button" circle></el-button>
+ <el-button class="circle-button" :class="cakeLamp.release ? 'circle-green':'circle-red'" circle></el-button>
+ <span style="display: none">{{cakeLamp.release}}</span>
<span> 鍏佽鏀捐</span>
</el-col>
</el-row>
@@ -131,24 +126,98 @@
</el-tabs>
</el-col>
</el-row>
-
-
</div>
</template>
<script>
+import {listWorkReport} from "@/api/main/om/workReport/workReport";
+import {listStationConf,getIpv4} from "@/api/main/sc/stationConf";
+
export default {
- components: {},
- props: [],
+ name: "stationTerminal",
data() {
return {
+ ipAddress: '',
+ input: null,
imgSrc: '',
+ headContent: {
+ processesCode: 'OP1010',
+ processesName: '璐存爣鏈�-璐寸爜',
+ sfcCode: '1000000000000001',
+ },
+ workpieceInformation: {
+ workOrderCode: null,
+ productCode: null,
+ productModel: null,
+ productName: null,
+ beat: null,
+ },
+ // 鏌ヨ鍙傛暟
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ sfcCode: null,
+ },
+ cakeLamp: {
+ plcState: 1, //plc
+ scannerState: 1, //鎵爜鏋�
+ InPlace: 0, //宸ヤ欢鍒颁綅
+ scanFinish: 0,
+ startWork: 0,
+ release: 0 //鍏佽鏀捐
+ }
}
},
- computed: {},
- watch: {},
- created() {},
- mounted() {},
- methods: {}
+ created() {
+ this.getIPAddress();
+ this.getStationConfList();
+ },
+ methods: {
+ clearClick(){
+ this.$message('杩欐槸涓�鏉℃竻闄ゆ秷鎭彁绀�');
+ this.headContent.sfcCode = null
+ },
+ scanCompleted(){
+ this.$message('鎵爜瀹屾垚'+this.input);
+ this.headContent.sfcCode = this.input
+ this.queryParams.sfcCode = this.input
+ this.getList()
+ this.cakeLamp.scanFinish = 1
+ },
+ /** 鏌ヨ鎶ュ伐璁板綍 琛ㄥ垪琛� */
+ getList() {
+ listWorkReport(this.queryParams).then(response => {
+ let rowsData = response.rows[0];
+ this.workpieceInformation.workOrderCode = rowsData.workOrderCode;
+ this.workpieceInformation.productCode = rowsData.productCode;
+ this.workpieceInformation.productModel = rowsData.productModel;
+ this.workpieceInformation.productName = rowsData.productName;
+ this.timer = setInterval(() => {
+ this.workpieceInformation.beat++;
+ }, 1000);
+ });
+ },
+ allowRelease(){
+ clearInterval(this.timer);
+ this.$message('淇濆瓨鑺傛媿涓�'+this.workpieceInformation.beat+'绉�');
+ },
+ getIPAddress() {
+ this.ipAddress = window.location.hostname;
+ },
+ /** 鏌ヨ宸ヤ綅缁堢閰嶇疆鍒楄〃 */
+ getStationConfList() {
+ let queryParams = {
+ ipAddress: null,
+ }
+ getIpv4().then(response => {
+ queryParams.ipAddress = response.msg
+ });
+ listStationConf(queryParams).then(response => {
+ let rows = response.rows[0]
+ this.headContent.processesName = rows.processesName
+ this.headContent.processesCode = rows.processesCode
+ });
+ },
+ }
}
</script>
@@ -159,11 +228,29 @@
.circle-button{
height: 30px;
width: 30px;
- //background-color: #ce0b0b;
- //background-color: #00afff;
- background-color: #13ce66;
}
-
+.circle-red {
+ background-color: #e01a4f;
+}
+.circle-green {
+ background-color: green;
+}
+.circle-green-animate {
+ background-color: green;
+ animation: circle-green-animate 2s infinite;
+}
+ @keyframes circle-green-animate {
+ 50% {
+ opacity: 0.6;
+ }
+ 0% {
+ opacity: 0.2;
+ }
+ }
+.head-font{
+ font-weight: bold;
+ font-size: 25px;
+}
span{
font-size: 15px;
}
--
Gitblit v1.9.3