From 9c3ae7e4abd5452b3bc005c549de3f448b5a4cde Mon Sep 17 00:00:00 2001
From: ZengTao <2773468879@qq.com>
Date: 星期日, 17 九月 2023 17:53:24 +0800
Subject: [PATCH] 修改格子高度
---
CanadaMes-ui/src/views/home/index.vue | 36 +++++++++++++++++++-----------------
1 files changed, 19 insertions(+), 17 deletions(-)
diff --git a/CanadaMes-ui/src/views/home/index.vue b/CanadaMes-ui/src/views/home/index.vue
index ad12103..9a39977 100644
--- a/CanadaMes-ui/src/views/home/index.vue
+++ b/CanadaMes-ui/src/views/home/index.vue
@@ -60,25 +60,25 @@
.gezi {
height: 35px;
-
+
position: absolute;
- width: 3.07px;
+ width: 3.08px;
/* width: 4.22px; */
}
-.gezi:nth-child(22),
+/* .gezi:nth-child(22),
.gezi:nth-child(43),
.gezi:nth-child(64),
.gezi:nth-child(85) {
margin-left: 7px;
- /* margin-left: 10px; */
-}
+ margin-left: 10px;
+} */
.blocks {
-
+
background-image: url('../../img/xmjc.png');
margin: 0 auto;
background-repeat: no-repeat;
@@ -241,22 +241,24 @@
<el-footer>
<div class="blocks" style="position: relative;">
<div style="display:flex;position: absolute;float:left;z-index: 999;top:102px;left:237px;">
- <div :class="getStatusClass(item.state)" v-for="(item,index) in cagelist1" :key="item['date']"
- :style="{ height: 35 * item['glassWidth'] + 'px',left:3.07*index+'px' }" @click="showcageinfo(item['cage'])"></div>
+ <div :class="getStatusClass(item.state)" v-for="(item, index) in cagelist1" :key="item['date']"
+ :style="{ height: 35 * item['glassWidth'] + 'px', left: 3.07 * index+(item['cage']-1)*6.8 + 'px' }"
+ @click="showcageinfo(item['cage'])"></div>
</div>
<div style="display:flex;position: absolute;float:left;z-index: 999;top:102px;left:640px;">
- <div :class="getStatusClass(item.state)" v-for="(item,index) in cagelist2" :key="item['date']"
- :style="{ height: 35 * item['glassWidth'] + 'px',left:3.07*index+'px' }" @click="showcageinfo(item['cage'])"></div>
+ <div :class="getStatusClass(item.state)" v-for="(item, index) in cagelist2" :key="item['date']"
+ :style="{ height: 35 * item['glassWidth'] + 'px', left: 3.07 * index+(item['cage']-6)*6.8 + 'px' }"
+ @click="showcageinfo(item['cage'])"></div>
</div>
<div style="display:flex;position: absolute;float:left;z-index: 999;top:139px;left:237px;">
- <div :class="getStatusClass(item.state)" v-for="(item,index) in cagelist3" :key="item['date']"
- :style="{ height: 35 * item['glassWidth'] + 'px', top: item['width'] * 35 - 35 + 'px',left:3.07*index+'px' }"
+ <div :class="getStatusClass(item.state)" v-for="(item, index) in cagelist3" :key="item['date']"
+ :style="{ height: 35 * item['glassWidth'] + 'px', top: item['width'] * 35 - 35 + 'px', left: 3.07 * index+(item['cage']-1)*6.8 + 'px' }"
@click="showcageinfo(item['cage'])">
</div>
</div>
<div style="display:flex;position: absolute;float:left;z-index: 999;top:139px;left:640px;">
- <div :class="getStatusClass(item.state)" v-for="(item,index) in cagelist4" :key="item['date']"
- :style="{ height: 35 * item['glassWidth'] + 'px', top: item['width'] * 35 - 35 + 'px',left:3.07*index+'px' }"
+ <div :class="getStatusClass(item.state)" v-for="(item, index) in cagelist4" :key="item['date']"
+ :style="{ height: 35 * item['glassWidth'] + 'px', top: item['width'] * 35 - 35 + 'px', left: 3.07 * index+(item['cage']-6)*6.8 + 'px' }"
@click="showcageinfo(item['cage'])"></div>
</div>
<div class="blocks-img" :style="{ left: car1 + 'px', top: '16px' }"></div>
@@ -403,7 +405,7 @@
// car2: 300,
cageinfo: [],
cage: 0,
- carlist:[]
+ carlist: []
};
},
created() {
@@ -435,8 +437,8 @@
//console.log("鏀跺埌鏁版嵁====" + msg.data);
let obj = JSON.parse(msg.data);
if (obj.params != null) {
- this.car1 = 145 + 8.15 * (obj.params[0][0]-this.carlist[0]['start'])/(this.carlist[0]['end']-this.carlist[0]['start'])*100;
- this.car2 = 210 + 8.15 * (obj.params[0][1]-this.carlist[1]['start'])/(this.carlist[1]['end']-this.carlist[1]['start'])*100;
+ this.car1 = 145 + 8.15 * (obj.params[0][0] - this.carlist[0]['start']) / (this.carlist[0]['end'] - this.carlist[0]['start']) * 100;
+ this.car2 = 210 + 8.15 * (obj.params[0][1] - this.carlist[1]['start']) / (this.carlist[1]['end'] - this.carlist[1]['start']) * 100;
// this.car1 = 210 + 11.25 * (obj.params[0][1]-this.carlist[1]['start'])/(this.carlist[1]['end']-this.carlist[1]['start'])*100;
// this.car2 = 300 + 11.25 * (obj.params[0][1]-this.carlist[1]['start'])/(this.carlist[1]['end']-this.carlist[1]['start'])*100;
}
--
Gitblit v1.8.0