From d873f6f5f94b44e0c4292dc709f2120848549119 Mon Sep 17 00:00:00 2001
From: haoxuan <haoxuan>
Date: 星期三, 20 九月 2023 20:05:33 +0800
Subject: [PATCH] 面板的样式修改
---
src/views/set.vue | 31 ++++++++-------
src/views/visualization.vue | 61 +++++++++++++++++++++---------
2 files changed, 58 insertions(+), 34 deletions(-)
diff --git a/src/views/set.vue b/src/views/set.vue
index 2091032..3311d97 100644
--- a/src/views/set.vue
+++ b/src/views/set.vue
@@ -28,7 +28,7 @@
鍔犲叆闆嗙兢</el-button
>
</div> -->
- <div class="form-box-l-item">
+ <!-- <div class="form-box-l-item">
<el-button
type="primary"
@click="buttonClick(3)"
@@ -37,7 +37,7 @@
>
PLC閰嶇疆</el-button
>
- </div>
+ </div> -->
</div>
<div class="form-box-r">
<el-form
@@ -236,18 +236,20 @@
</el-form-item>
</div>
<div style="height: 100%" v-if="active == 3">
+ <div class="form-box-r-title" >PLC鍦板潃閰嶇疆</div>
<div
style="
overflow: auto;
- width: 100%;
- min-height: 180px;
+ width: 80%;
+ min-height: 200px;
padding-right: 10px;
+ margin:60px auto 0;
"
>
<el-form-item
label="PLC鍝佺墝"
prop="brand"
- class="form-item2 float_left"
+ class="form-item float_left"
>
<!-- style="width: calc(100% - 30px)" -->
<el-select
@@ -270,7 +272,7 @@
></i> -->
</el-form-item>
- <el-form-item label="鎺ュ彛鏂瑰紡" prop="method" class="form-item2">
+ <el-form-item label="鎺ュ彛鏂瑰紡" prop="method" class="form-item">
<!-- <el-input v-model="form.method" placeholder="璇疯緭鍏�"></el-input> -->
<el-select
v-model="form.method"
@@ -287,7 +289,7 @@
label="娉㈢壒鐜�"
prop="baudRate"
v-if="form.method == 'serial'"
- class="form-item2 float_right margin_left_10px"
+ class="form-item float_right"
>
<el-input
v-model="form.baudRate"
@@ -298,7 +300,7 @@
label="涓插彛鍚嶇О"
prop="serialName"
v-if="form.method == 'serial'"
- class="form-item2 float_right margin_left_10px"
+ class="form-item float_right"
>
<el-input
v-model="form.serialName"
@@ -309,7 +311,7 @@
label="PLC鍦板潃"
v-if="form.method == 'modbusTCP'"
prop="address"
- class="form-item2 float_right margin_left_10px"
+ class="form-item float_right"
>
<el-input
v-model="form.address"
@@ -335,7 +337,7 @@
label="绔彛鍙�"
prop="port"
v-if="form.method == 'modbusTCP'"
- class="form-item2 float_right"
+ class="form-item float_right"
>
<el-input
v-model.number="form.port"
@@ -343,7 +345,7 @@
></el-input>
</el-form-item>
</div>
- <el-button
+ <!-- <el-button
style="margin-bottom: 10px; float: right"
@click="addPreProduction"
type="primary"
@@ -392,7 +394,6 @@
</el-table-column>
<el-table-column prop="type" label="鏁版嵁绫诲瀷" width="120">
<template slot-scope="scope">
- <!-- :popper-append-to-body="false" -->
<el-select
v-if="scope.row.edit"
v-model="scope.row.type"
@@ -444,7 +445,7 @@
</span>
</template>
</el-table-column>
- </el-table>
+ </el-table> -->
</div>
</el-form>
@@ -954,7 +955,7 @@
margin: 30px 0 0 40px;
}
.height_100 {
- height: calc(100% - 90px);
+ height: calc(100% - 120px);
}
.el-form {
width: 100%;
@@ -1013,7 +1014,7 @@
// position:absolute;
// left:10px;
// bottom:20px;
- margin-top: 40px;
+ margin-top: 0px;
float: right;
}
diff --git a/src/views/visualization.vue b/src/views/visualization.vue
index aedaf2c..4ca6d69 100644
--- a/src/views/visualization.vue
+++ b/src/views/visualization.vue
@@ -143,8 +143,8 @@
<el-descriptions-item label="瀹屾垚搴�" style="width: 100%">
<!--:text-format="format" -->
<el-progress
- define-back-color="#133EAF"
- color="#09E5ED"
+ define-back-color="#132f6e"
+ color="#00cc66"
text-color="#fff"
:text-inside="true"
:stroke-width="30"
@@ -223,7 +223,7 @@
<i class="el-icon-phone-outline" />鐗╂枡鍛煎彨</el-button
>
</div>
- <i class="el-icon-arrow-right font-arrow-20 color_4efefa"></i>
+ <i class="el-icon-arrow-right font-arrow-20 color_318583"></i>
<div class="bottom_list">
<div class="bottom-title">
褰撳墠宸ュ簭:{{ taskData.Procedure.procedure.procedureName || "" }}
@@ -274,8 +274,8 @@
>
<span class="card-top-r-b">
<el-progress
- define-back-color="#133EAF"
- color="#09E5ED"
+ define-back-color="#132f6e"
+ color="#00cc66"
text-color="#fff"
:text-inside="true"
:stroke-width="10"
@@ -337,7 +337,7 @@
v-model="finishShow['finishShow&'+index]"
trigger="click"
>
- <p>璇风‘璁ゆ槸鍚﹀凡瀹屾垚璇ョ敓浜т换鍔�?</p>
+ <p><i class="el-icon-error" style="color:red;margin-right:5px;"/>璇风‘璁ゆ槸鍚﹀凡瀹屾垚璇ョ敓浜т换鍔�?</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" @click="finishShow['finishShow&'+index] = false">
鍙栨秷</el-button
@@ -345,6 +345,7 @@
<el-button
type="primary"
size="mini"
+ class="color_f70f83"
@click="finishClick(index, taskData)"
>
纭畾</el-button
@@ -354,7 +355,7 @@
</el-popover>
</div>
</div>
- <i class="el-icon-arrow-right font-arrow-20 color_4efefa"></i>
+ <i class="el-icon-arrow-right font-arrow-20 color_318583"></i>
<div class="bottom_list">
<div class="bottom-title">
<span>杈撳嚭璧勬簮</span>
@@ -485,7 +486,7 @@
</div> -->
</div>
<div class="right_base">
- <div class="right-small-title" style="line-height: 40px">鐭ヨ瘑搴�</div>
+ <div class="right-small-title" style="line-height: 40px;margin-top:20px;">鐭ヨ瘑搴�</div>
<Knowledge />
<div class="right-base-btn call">
<el-button type="primary"
@@ -1003,8 +1004,20 @@
width:200px;
line-height:1.3!important;
}
+.el-popover{
+ background:#12234a!important;
+ color:#fff!important;
+ border-color: #09e5ed !important;
+
+ .popper__arrow::after{
+ border-top-color:#09e5ed !important;
+ }
+}
.color_yellow{
color:yellow;
+}
+.color_318583{
+ color:#318583;
}
.el-empty{
height:100%;
@@ -1024,10 +1037,10 @@
margin-bottom: 20px;
}
.content {
- height: 240px;
+ height: 300px;
}
.bottom {
- height: calc(100% - 410px);
+ height: calc(100% - 470px);
}
.font_size_20px{
font-size:20px!important;
@@ -1059,18 +1072,18 @@
line-height: 20px;
}
.content {
- height: 370px;
+ height: 430px;
.content-top {
- height: calc(50% - 20px) !important;
- padding-top: 10px !important;
+ height: calc(50% - 30px) !important;
+ padding-top: 20px !important;
}
.el-descriptions__body {
font-size: 16px !important;
}
}
.bottom {
- height: calc(100% - 560px);
+ height: calc(100% - 610px);
}
.bottom_list .bottom-title {
font-size: 16px;
@@ -1424,6 +1437,9 @@
background: rgb(22 72 173);
border-radius: 6px;
// background: #233b9e;
+ .el-descriptions-row{
+ height:45px;
+ }
.el-descriptions__body {
background: transparent;
font-size: 18px;
@@ -1463,15 +1479,22 @@
margin-top: 10px;
color: #333;
position: relative;
+ .card_top-2{
+ width:35%;
+ }
+ .card-top-input-out-r,
+ .card_top-3 {
+ width:65%;
+ }
.card_top-2,.card-top-input-out-r,
.card_top-3 {
- width: 50%;
height: 45px;
border-radius: 5px;
background: #6b83ff;
- font-size: 12px;
+ font-size: 13px;
color: #fff;
float: left;
+ font-weight: 700;
.card-top-r-t {
width: 100%;
text-align: center;
@@ -1680,7 +1703,7 @@
.right_dutyLst {
width: calc(106% - 20px);
// height: 270px;
- height: 310px;
+ height: 370px;
border-radius: 4px;
line-height: 30px;
overflow: hidden;
@@ -1699,7 +1722,7 @@
}
.right-person-box {
width: 100%;
- height: calc(100% - 40px);
+ height: calc(100% - 60px);
overflow: auto;
margin-top: -10px;
}
@@ -1729,7 +1752,7 @@
}
.right_base {
width: 100%;
- height: calc(100% - 520px);
+ height: calc(100% - 580px);
min-height: 200px;
// overflow-y:auto;
position: relative;
--
Gitblit v1.8.0