liulonglong
/
shuinichang_
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

1

This commit is contained in:
lll 2023-11-22 13:41:10 +08:00
parent 357e334844
commit 36d9b118cd
4 changed files with 155 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/App.vue
View File

@ -13,9 +13,11 @@
#app { #app {
width: 7680px; width: 7680px;
height: 3240px; height: 3240px;
width: 100vw; /* width: 100vw;
height: 100vh; height: 100vh; */
overflow: hidden; overflow: hidden;
background-color: transparent; background-color: transparent;
background-image: url(./assets/img/左遮罩.png), url(./assets/img/右遮罩.png),
url(./assets/img/遮罩上.png), url(./assets/img/下遮罩.png);
} }
</style> </style>

6
src/views/Index.vue
View File

@ -3,7 +3,7 @@
<div class="home"> <div class="home">
<RouterView /> <RouterView />
</div> </div>
<div class="footer"> <!-- <div class="footer">
<div class="box"> <div class="box">
<img src="../assets/img/生产工艺按钮.png" alt="" class="tabbars1" /> <img src="../assets/img/生产工艺按钮.png" alt="" class="tabbars1" />
<img <img
@ -66,7 +66,7 @@
/> />
<p>碳资产管理</p> <p>碳资产管理</p>
</div> </div>
</div> </div> -->
</div> </div>
</template> </template>
@ -94,7 +94,7 @@ export default {
left: 0; left: 0;
bottom: 200px; bottom: 200px;
z-index: 100; z-index: 100;
background-color: red; // background-color: red;
} }
.footer { .footer {
width: 100%; width: 100%;

150
src/views/lll/ZNYW.vue
View File

@ -2,19 +2,165 @@
<div class="box"> <div class="box">
<div class="left"> <div class="left">
<img src="../../assets/img/标题/智能运维.png" class="title" /> <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>
</div> </div>
</template> </template>
<script></script> <script></script>
<style lang="less" scoped> <style lang="less" scoped>
.box {
width: 100%;
height: 100%;
padding-top: 500px;
box-sizing: border-box;
}
.left { .left {
width: 1237px; width: 1237px;
height: 2500px; height: 2500px;
margin-left: 61px;
background-image: url("../../assets/img/侧边.png"); background-image: url("../../assets/img/侧边.png");
margin-top: 289px; padding-left: 59px;
padding-right: 45px;
box-sizing: border-box;
.title { .title {
margin-top: 15px; 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> </style>

13
vue.config.js
View File

@ -2,17 +2,4 @@ const { defineConfig } = require("@vue/cli-service");
module.exports = defineConfig({ module.exports = defineConfig({
transpileDependencies: true, transpileDependencies: true,
// css: {
// loaderOptions: {
// // css: {},
// // postcss: {
// // plugins: [
// // require("postcss-px2rem")({
// // // 以设计稿750为例， 750 / 10 = 75
// // remUnit: 768,
// // }),
// // ],
// // },
// },
// },
}); });