修改界面

master
夜笙歌 3 years ago
parent 8d17a6d494
commit 187075b45a

@ -14,15 +14,15 @@ body {
position: absolute;
width: 23%;
height: 35%;
top: 15%;
left: 2.5%;
top: 17%;
left: 1.5%;
}
.outputStatistics{
position: absolute;
width: 23%;
height: 35%;
top: 60%;
left: 2.5%;
top: 18.5%;
left: 75.3%;
}
.quality{
position: absolute;
@ -32,56 +32,58 @@ body {
left: 26.5%;
}
.ecosphere{
background: url(../../img/board/month/one.png) no-repeat;
background-size: 100% 100%;
position: absolute;
width: 23%;
height: 35%;
top: 15%;
left: 75%;
/*background: url(../../img/board/month/one.png) no-repeat;*/
/*background-size: 100% 100%;*/
/*position: absolute;*/
/*width: 23%;*/
/*height: 35%;*/
/*top: 15%;*/
/*left: 75%;*/
}
.scene{
background: url(../../img/board/month/two.jpg) no-repeat;
background-size: 100% 100%;
position: absolute;
width: 23%;
height: 35%;
top: 15%;
left: 50.5%;
width: 22%;
height: 34%;
top: 18%;
left: 51.5%;
}
.Highlight{
background-repeat: no-repeat;
background-size: 100% 100%;
position: absolute;
width: 22%;
height: 34%;
top: 18.7%;
left: 26.7%;
}
.nivoSlider{
width: 100%;
height: 100%;
}
.HighlightOne{
background-repeat: no-repeat;
background-size: 100% 100%;
/*position: absolute;*/
width:200px;
height: 200px;
/*top: 16%;*/
/*left: 27.5%;*/
/*width: 23vw;*/
/*height: 35vh;*/
width: 230px;
height: 350px;
}
.HighlightTwo{
background-repeat: no-repeat;
background-size: 100% 100%;
/*position: absolute;*/
width:200px;
height: 200px;
/*top: 16%;*/
/*left: 38.5%;*/
/*width: 23vw;*/
/*height: 35vh;*/
width: 230px;
height: 350px;
}
.HighlightThree{
background-repeat: no-repeat;
background-size: 100% 100%;
/*position: absolute;*/
width:200px;
height: 200px;
/*top: 34.5%;*/
/*left: 27.5%;*/
/*width: 23vw;*/
/*height: 35vh;*/
width: 230px;
height: 350px;
}
.HighlightFour{
background-repeat: no-repeat;
background-size: 100% 100%;
/*position: absolute;*/
width:200px;
height: 200px;
/*top: 34.5%;*/
/*left: 38.5%*/
/*width: 23vw;*/
/*height: 35vh;*/
width: 230px;
height: 350px;
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.8 MiB

After

Width:  |  Height:  |  Size: 444 KiB

@ -26,10 +26,14 @@ $(() => {
})
autoUpdate(url + "/selectHighlightProducts", INTERVAL, data => {
let url = data.map(val => val.picturePath)
$('#HighlightOne').css({backgroundImage: `url("http://10.100.70.5:9090/${url[0]}")`})
$('#HighlightTwo').css({backgroundImage: `url("http://10.100.70.5:9090/${url[1]}")`})
$('#HighlightThree').css({backgroundImage: `url("http://10.100.70.5:9090/${url[2]}")`})
$('#HighlightFour').css({backgroundImage: `url("http://10.100.70.5:9090/${url[3]}")`})
// $('#HighlightOne').css({backgroundImage: `url("http://10.100.70.5:9090/${url[0]}")`})
// $('#HighlightTwo').css({backgroundImage: `url("http://10.100.70.5:9090/${url[1]}")`})
// $('#HighlightThree').css({backgroundImage: `url("http://10.100.70.5:9090/${url[2]}")`})
// $('#HighlightFour').css({backgroundImage: `url("http://10.100.70.5:9090/${url[3]}")`})
$('#HighlightOne').attr("src" , `http://10.100.70.5:9090/${url[0]}`)
$('#HighlightTwo').attr("src" , `http://10.100.70.5:9090/${url[1]}`)
$('#HighlightThree').attr("src" , `http://10.100.70.5:9090/${url[2]}`)
$('#HighlightFour').attr("src" , `http://10.100.70.5:9090/${url[3]}`)
})
lineChart(null, document.getElementById("quality"))
@ -65,15 +69,15 @@ const curWeek = () => {
const moduleTitle = () => {
const html = `
<span style="position: absolute;top: 0.9%;left: 50%;color: #fff;font-size: 1.3vw;transform: translateX(-50%);letter-spacing: 0.3vw">智能冷柜集成控制中心</span>
<span style="position: absolute;top: 10%;left: 3.3%;color: #CFD2D0;font-size: 1.0vw">用户满意度</span>
<span style="position: absolute;top: 10%;left: 27.6%;color: #CFD2D0;font-size: 1.0vw">产品升级</span>
<span style="position: absolute;top: 10%;left: 51.5%;color: #CFD2D0;font-size: 1.0vw">场景升级</span>
<span style="position: absolute;top: 10%;left: 76%;color: #CFD2D0;font-size: 1.0vw">全价值链</span>
<span style="position: absolute;top: 54.5%;left: 3.3%;color: #CFD2D0;font-size: 1.0vw">产量统计</span>
<span style="position: absolute;top: 54.5%;left: 27.6%;color: #CFD2D0;font-size: 1.0vw">品质提升</span>
<span style="position: absolute;top: 54.5%;left: 51.5%;color: #CFD2D0;font-size: 1.0vw">周质量分析</span>
<span style="position: absolute;top: 54.5%;left: 76%;color: #CFD2D0;font-size: 1.0vw">安全生产</span>
<span style="position: absolute;top: 2.9%;left: 50%;color: #fff;font-size: 1.1vw;transform: translateX(-50%);letter-spacing: 0.3vw">智能冷柜集成控制中心</span>
<span style="position: absolute;top: 14.5%;left: 2.6%;color: #CFD2D0;font-size: 1.0vw">用户满意度</span>
<span style="position: absolute;top: 14.5%;left: 27.6%;color: #CFD2D0;font-size: 1.0vw">产品升级</span>
<span style="position: absolute;top: 14.5%;left: 68%;color: #CFD2D0;font-size: 1.0vw">场景升级</span>
<span style="position: absolute;top: 14.5%;left: 93%;color: #CFD2D0;font-size: 1.0vw">全价值链</span>
<span style="position: absolute;top: 57.8%;left: 3.3%;color: #CFD2D0;font-size: 1.0vw">产量统计</span>
<span style="position: absolute;top: 57.8%;left: 27.6%;color: #CFD2D0;font-size: 1.0vw">品质提升</span>
<span style="position: absolute;top: 57.8%;left: 68%;color: #CFD2D0;font-size: 1.0vw">周质量分析</span>
<span style="position: absolute;top: 57.8%;left: 93%;color: #CFD2D0;font-size: 1.0vw">安全生产</span>
`
$('body').append(html)
}

@ -51,12 +51,13 @@
<!--<div class="HighlightTwo" id="HighlightTwo"></div>-->
<!--<div class="HighlightThree" id="HighlightThree"></div>-->
<!--<div class="HighlightFour" id="HighlightFour"></div>-->
<div id="sliderq" class="nivoSlider">
<img class="HighlightOne" id="HighlightOne"></img>
<img class="HighlightTwo" id="HighlightTwo"></img>
<img class="HighlightThree" id="HighlightThree"></img>
<img class="HighlightFour" id="HighlightFour"></img>
<div class="Highlight" id="Highlight">
<div id="slider" class="nivoSlider">
<img class="HighlightOne" id="HighlightOne" width="23vw"/>
<img class="HighlightTwo" id="HighlightTwo" width="23vw"/>
<img class="HighlightThree" id="HighlightThree" width="23vw"/>
<img class="HighlightFour" id="HighlightFour" width="23vw"/>
</div>
</div>
</body>
<script src="../../static/js/board/month.js" th:src="@{/js/board/month.js}"></script>

Loading…
Cancel
Save