This commit is contained in:
lll
parent
357e334844
commit
36d9b118cd
|
|
@ -13,9 +13,11 @@
|
|||
#app {
|
||||
width: 7680px;
|
||||
height: 3240px;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
/* width: 100vw;
|
||||
height: 100vh; */
|
||||
overflow: hidden;
|
||||
background-color: transparent;
|
||||
background-image: url(./assets/img/左遮罩.png), url(./assets/img/右遮罩.png),
|
||||
url(./assets/img/遮罩上.png), url(./assets/img/下遮罩.png);
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<div class="home">
|
||||
<RouterView />
|
||||
</div>
|
||||
<div class="footer">
|
||||
<!-- <div class="footer">
|
||||
<div class="box">
|
||||
<img src="../assets/img/生产工艺按钮.png" alt="" class="tabbars1" />
|
||||
<img
|
||||
|
|
@ -66,7 +66,7 @@
|
|||
/>
|
||||
<p>碳资产管理</p>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -94,7 +94,7 @@ export default {
|
|||
left: 0;
|
||||
bottom: 200px;
|
||||
z-index: 100;
|
||||
background-color: red;
|
||||
// background-color: red;
|
||||
}
|
||||
.footer {
|
||||
width: 100%;
|
||||
|
|
|
|||
|
|
@ -2,19 +2,165 @@
|
|||
<div class="box">
|
||||
<div class="left">
|
||||
<img src="../../assets/img/标题/智能运维.png" class="title" />
|
||||
<div class="hbsj">
|
||||
<div class="imgBox">
|
||||
<img src="../../assets/img/小标题栏.png" class="img" />
|
||||
<p>环保数据</p>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div>一号窑系统</div>
|
||||
<div>二号窑系统</div>
|
||||
<div>三号窑系统</div>
|
||||
</div>
|
||||
<div class="date">
|
||||
<div class="one">
|
||||
<div>
|
||||
<span>SO2折算值：</span>
|
||||
<span>0.47</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>颗粒折算值：</span>
|
||||
<span>0.20</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>NOX折算值：</span>
|
||||
<span>41.42</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>CO折算值：</span>
|
||||
<span>219.70</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="one">
|
||||
<div>
|
||||
<span>实际值：</span>
|
||||
<span>0.60</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>实际值：</span>
|
||||
<span>0.26</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>实际值：</span>
|
||||
<span>52.78</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>实际值：</span>
|
||||
<span>280.00</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="one">
|
||||
<div>
|
||||
<span>O2:：</span>
|
||||
<span>6.98</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>流量：</span>
|
||||
<span style="color: red">615218.94</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>流速：</span>
|
||||
<span>18.74</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>压力：</span>
|
||||
<span>-0.07</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script></script>
|
||||
<style lang="less" scoped>
|
||||
.box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding-top: 500px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.left {
|
||||
width: 1237px;
|
||||
height: 2500px;
|
||||
margin-left: 61px;
|
||||
background-image: url("../../assets/img/侧边.png");
|
||||
margin-top: 289px;
|
||||
padding-left: 59px;
|
||||
padding-right: 45px;
|
||||
box-sizing: border-box;
|
||||
.title {
|
||||
margin-top: 15px;
|
||||
margin-left: 100px;
|
||||
margin-left: 60px;
|
||||
}
|
||||
.hbsj {
|
||||
position: relative;
|
||||
margin-top: 56px;
|
||||
.imgBox {
|
||||
height: 93px;
|
||||
width: 1156px;
|
||||
p {
|
||||
position: absolute;
|
||||
color: #fff;
|
||||
top: 20px;
|
||||
left: 50px;
|
||||
font-size: 30px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
}
|
||||
}
|
||||
.btns {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 50px;
|
||||
margin-bottom: 50px;
|
||||
padding-left: 149px;
|
||||
padding-right: 124px;
|
||||
box-sizing: border-box;
|
||||
div {
|
||||
width: 211px;
|
||||
height: 55px;
|
||||
background: #3ce9c2;
|
||||
border-radius: 12px 12px 12px 12px;
|
||||
border: 1px solid #36ffd3;
|
||||
font-size: 20px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
color: #ffffff;
|
||||
line-height: 55px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.date {
|
||||
width: 1132px;
|
||||
height: 400px;
|
||||
background: linear-gradient(NaNdeg, #1e5181 0%);
|
||||
border: 1px solid #135064;
|
||||
border-image: radial-gradient(circle, rgba(30, 81, 129, 1)) 1 1;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
.one {
|
||||
height: 100%;
|
||||
div {
|
||||
height: 68px;
|
||||
width: 313px;
|
||||
line-height: 68px;
|
||||
font-size: 20px;
|
||||
font-family: "MicrosoftYaHei";
|
||||
display: flex;
|
||||
margin: 20px;
|
||||
justify-content: space-between;
|
||||
background: linear-gradient(#38b7a1 20%, #38b7a1 0%);
|
||||
border-left: 5px solid #28a896;
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
color: #fff;
|
||||
box-sizing: border-box;
|
||||
span:nth-of-type(2) {
|
||||
color: #28ff50;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -2,17 +2,4 @@ const { defineConfig } = require("@vue/cli-service");
|
|||
|
||||
module.exports = defineConfig({
|
||||
transpileDependencies: true,
|
||||
// css: {
|
||||
// loaderOptions: {
|
||||
// // css: {},
|
||||
// // postcss: {
|
||||
// // plugins: [
|
||||
// // require("postcss-px2rem")({
|
||||
// // // 以设计稿750为例， 750 / 10 = 75
|
||||
// // remUnit: 768,
|
||||
// // }),
|
||||
// // ],
|
||||
// // },
|
||||
// },
|
||||
// },
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in New Issue