From 634518780dd0391191b4c7955643495e3a9bdf9e Mon Sep 17 00:00:00 2001
From: haoxuan <haoxuan>
Date: 星期二, 19 九月 2023 15:49:05 +0800
Subject: [PATCH] 输出资源的样式修改 文字超出，按钮固定到下发， 设备状态默认空
---
src/views/visualization.vue | 89 ++++++++++++++++++++++----------------------
1 files changed, 44 insertions(+), 45 deletions(-)
diff --git a/src/views/visualization.vue b/src/views/visualization.vue
index af754f7..33b594a 100644
--- a/src/views/visualization.vue
+++ b/src/views/visualization.vue
@@ -199,7 +199,7 @@
<div class="card_content">
<div class="card_contentLeft">{{ list.materialId }}</div>
</div>
- <div class="card_top">
+ <div class="card-top-input-out-l">
<div>
<!-- 璁惧12<i
style="font-size: 14px"
@@ -209,7 +209,7 @@
{{ list.materialName }}
</div>
</div>
- <div class="card_top2">
+ <div class="card-top-input-out-r">
<div style="line-height: 45px; text-align: center">
{{ list.amount }} {{ list.unit }}
</div>
@@ -219,7 +219,7 @@
</div>
</el-carousel-item>
</el-carousel>
- <el-button type="primary" class="color_f70f83">
+ <el-button type="primary" class="color_f70f83 bottom-box-btn">
<i class="el-icon-phone-outline" />鐗╂枡鍛煎彨</el-button
>
</div>
@@ -328,7 +328,7 @@
<p
style="font-size: 22px; margin-left: 12px; margin-top: 50px"
></p>
- <div class="right-small-btn">
+ <div class="right-small-btn bottom-box-btn">
<el-button type="primary"> 鎵撳嵃</el-button>
<el-popover
placement="top-end"
@@ -385,49 +385,21 @@
{{ list.materialId }}
</div>
</div>
- <div class="card_top">
+ <div class="card-top-input-out-l">
<div>
{{ list.materialName }}
- <!-- 璁惧12<i
- style="font-size: 14px"
- class="el-icon-right font-arrow-20"
- ></i>
- 璁惧13 -->
</div>
</div>
- <div class="card_top2">
+ <div class="card-top-input-out-r">
<div style="line-height: 45px; text-align: center">
{{ list.amount }} {{ list.unit }}
</div>
- <!-- <span class="card-top-r-t">鐢熶骇瀹屾垚</span>
- <span class="card-top-r-b">12鏈�28鏃� 08:24</span> -->
</div>
- <!-- <div class="card-info-box">棰勮10鍒嗛挓閫佽揪</div> -->
</div>
- <!-- <div class="card">
- <div class="card_content">
- <div class="card_contentLeft color_green">
- 鍖呭彿:G22122304 100鍚�
- </div>
- </div>
- <div class="card_top">
- <div>
- 璁惧12<i
- style="font-size: 14px"
- class="el-icon-right font-arrow-20"
- ></i>
- 璁惧13
- </div>
- </div>
- <div class="card_top-2">
- <span class="card-top-r-t">鐢熶骇瀹屾垚</span>
- <span class="card-top-r-b">12鏈�28鏃� 08:24</span>
- </div>
- </div> -->
</div>
</el-carousel-item>
</el-carousel>
- <el-button type="primary" class="color_f70f83">
+ <el-button type="primary" class="color_f70f83 bottom-box-btn">
<i class="el-icon-phone-outline" />杩愯緭鍛煎彨</el-button
>
</div>
@@ -460,7 +432,7 @@
璁惧鐘舵��:
<!-- 1鏂紑2鐢熶骇3寰呮満 -->
<span style="position: relative"
- >
+ v-if="plcStatus" >
<img v-if="plcStatus == 1" src="../../public/duan.png" />
<img v-else src="../../public/lian.png" />
<!-- <span class="yuandian"></span> -->
@@ -690,7 +662,7 @@
procInfoTimer: null,
cutdownTimer: null,
TaskCount:0,
- plcStatus:1,
+ plcStatus:0,
isTipShow:false,
};
},
@@ -858,7 +830,16 @@
procedure: { inputMaterials: [], outputMaterials: [], workers: [] },
},
inputMaterials: [],
- outputMaterials: [],
+ outputMaterials: [
+ [
+ {
+ materialId:11111,
+ materialName:'272澶у鍟婃斁鍋囦簡鍗¤壈鑻﹀鏂楀瀮鍦惧彂蹇�掑瀮鍦惧弽棣堟潵寰楀強鍏嬮殕',
+ amount:100,
+ unit:'浠�'
+ }
+ ]
+ ],
procedureList: [
// [
// {
@@ -940,8 +921,8 @@
}
});
- // this.Tasks.push(object)
- // this.Tasks.push(object)
+ this.Tasks.push(object)
+ this.Tasks.push(object)
},
getStartArr(){
for (let i in this.Tasks) {
@@ -963,7 +944,7 @@
this.Tasks[i].finishNumber = res.data.finishNumber
? res.data.finishNumber
: 0;
- this.plcStatus=res.data.plcStatus?res.data.plcStatus:1
+ this.plcStatus=res.data.plcStatus?res.data.plcStatus:0
}
});
}
@@ -1301,7 +1282,7 @@
}
.card-box {
width: 100%;
- height: calc(100% - 50px - 50px);
+ height: calc(100% - 50px - 40px);
// height:300px;
.el-carousel__container{
overflow-y:auto;
@@ -1310,6 +1291,12 @@
// height:auto;
min-height:160px;
}
+ }
+ .bottom-box-btn{
+ width:calc(100% - 20px);
+ position:absolute;
+ bottom:10px;
+ left:10px;
}
}
@@ -1476,7 +1463,7 @@
margin-top: 10px;
color: #333;
position: relative;
- .card_top-2,
+ .card_top-2,.card-top-input-out-r,
.card_top-3 {
width: 50%;
height: 45px;
@@ -1518,7 +1505,7 @@
}
}
- .card_top,
+ .card_top,.card-top-input-out-l,
.card_top-4 {
width: 50%;
height: 45px;
@@ -1528,7 +1515,7 @@
font-size: 12px;
line-height: 45px;
> div {
- margin-left: 12px;
+ padding-left: 12px;
position: relative;
p {
position: absolute;
@@ -1541,6 +1528,18 @@
.card_top{
float: left;
}
+ .card-top-input-out-l{
+ float:left;
+ width:65%;
+ line-height:20px;
+ vertical-align: middle;
+ display:flex;
+ justify-content:space-around;
+ align-items:center;
+ }
+ .card-top-input-out-r{
+ width:35%;
+ }
.card_top-4 {
width: calc(100% - 20px);
padding: 10px 10px;
--
Gitblit v1.8.0