From a7ab44bca33c0bfc85b301f6edc7398aecb74a81 Mon Sep 17 00:00:00 2001 From: ZengTao <2773468879@qq.com> Date: 星期四, 14 九月 2023 17:03:13 +0800 Subject: [PATCH] 主界面添加1280*1024显示 --- CanadaMes-ui/src/views/home/index.vue | 77 ++++++++++++++++++++++++++++---------- 1 files changed, 56 insertions(+), 21 deletions(-) diff --git a/CanadaMes-ui/src/views/home/index.vue b/CanadaMes-ui/src/views/home/index.vue index 76653ab..72685ec 100644 --- a/CanadaMes-ui/src/views/home/index.vue +++ b/CanadaMes-ui/src/views/home/index.vue @@ -60,67 +60,78 @@ .gezi { height: 35px; - width: 4.22px; + width: 3.07px; + /* width: 4.22px; */ } .gezi:nth-child(22), .gezi:nth-child(43), .gezi:nth-child(64), .gezi:nth-child(85) { - margin-left: 10px; + margin-left: 7px; + /* margin-left: 10px; */ } .blocks { - min-height: 55vh; - max-width: 100vw; + + max-width: 94vw; background-image: url('../../img/xmjc.png'); margin: 0 auto; background-repeat: no-repeat; - /* background-size: 100% 100%; */ - background-size: 1660px 560px; background-attachment: local; width: 1660px; + min-height: 55vh; + background-size: 1200px 510px; + /* max-width: 100vw; + background-size: 1660px 560px; */ + + } .blocks-img { height: 100px; max-width: 100vw; background-repeat: no-repeat; - background-size: 46px 94px; background-attachment: local; width: 32px; position: absolute; - /* left: 116px; */ - /* left:1060px;18.88px */ background-image: url('../../img/bigcar01.png'); + background-size: 40px 87px; + /* background-size: 46px 94px; */ } .blocks-img2 { height: 100px; max-width: 100vw; background-repeat: no-repeat; - background-size: 85px 100px; background-attachment: local; width: 100px; position: absolute; - /* left: 116px; */ - /* left:1060px;18.88px */ background-image: url('../../img/dipan.png'); + background-size: 70px 85px; + left: 654px; + top: 333px; + /* background-size: 85px 100px; + left: 912px; + top: 366px; */ } .blocks-img3 { height: 90px; max-width: 100vw; background-repeat: no-repeat; - background-size: 160px 40px; background-attachment: local; width: 160px; position: absolute; - /* left: 116px; */ - /* left:1060px;18.88px */ background-image: url('../../img/taimian.png'); + background-size: 120px 30px; + left: 630px; + top: 420px; + /* background-size: 160px 40px; + left: 875px; + top: 455px; */ } .el-table td, @@ -226,7 +237,27 @@ </el-main> <el-footer> <div class="blocks" style="position: relative;"> - <div style="display:flex;position: absolute;float:left;z-index: 999;top:112px;left:328px;"> + <div style="display:flex;position: absolute;float:left;z-index: 999;top:102px;left:237px;"> + <div :class="getStatusClass(item.state)" v-for="item in cagelist1" :key="item['date']" + @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 in cagelist2" :key="item['date']" + @click="showcageinfo(item['cage'])"></div> + </div> + <div style="display:flex;position: absolute;float:left;z-index: 999;top:138px;left:237px;"> + <div :class="getStatusClass(item.state)" v-for="item in cagelist3" :key="item['date']" + @click="showcageinfo(item['cage'])"></div> + </div> + <div style="display:flex;position: absolute;float:left;z-index: 999;top:138px;left:640px;"> + <div :class="getStatusClass(item.state)" v-for="item in cagelist4" :key="item['date']" + @click="showcageinfo(item['cage'])"></div> + </div> + <div class="blocks-img" :style="{ left: car1 + 'px', top: '16px' }"></div> + <div class="blocks-img" :style="{ left: car2 + 'px', top: '175px' }"></div> + <div class="blocks-img2"></div> + <div class="blocks-img3"></div> + <!-- <div style="display:flex;position: absolute;float:left;z-index: 999;top:112px;left:328px;"> <div :class="getStatusClass(item.state)" v-for="item in cagelist1" :key="item['date']" @click="showcageinfo(item['cage'])"></div> </div> @@ -245,7 +276,7 @@ <div class="blocks-img" :style="{ left: car1 + 'px', top: '16px' }"></div> <div class="blocks-img" :style="{ left: car2 + 'px', top: '194px' }"></div> <div class="blocks-img2" :style="{ left: '912px', top: '366px' }"></div> - <div class="blocks-img3" :style="{ left: '875px', top: '455px' }"></div> + <div class="blocks-img3" :style="{ left: '875px', top: '455px' }"></div> --> </div> </el-footer> <el-dialog :visible.sync="dialogFormVisible" :title="$t('Please confirm the glass information')"> @@ -356,8 +387,10 @@ order: "", glassid: "", url: "../../img/bigcar01.png", - car1: 150, - car2: 242, + car1: 107, + car2: 175, + // car1: 150, + // car2: 242, cageinfo: [], cage: 0 }; @@ -391,8 +424,10 @@ //console.log("鏀跺埌鏁版嵁====" + msg.data); let obj = JSON.parse(msg.data); if (obj.params != null) { - this.car1 = 150 + 24.6 * obj.params[0][0]; - this.car2 = 242 + 24.6 * obj.params[0][1]; + this.car1 = 107 + 17.62 * obj.params[0][0]; + this.car2 = 175 + 17.62 * obj.params[0][1]; + // this.car1 = 150 + 24.6 * obj.params[0][0]; + // this.car2 = 242 + 24.6 * obj.params[0][1]; } this.tableData = obj.tableData[0]; this.cagelist1 = obj.cagelist1[0]; -- Gitblit v1.8.0