大屏

gavel/src/main/java/com/gavel/kwell/controller/KmesBoardController.java

@@ -19,5 +19,20 @@ public class KmesBoardController extends BaseController {
         return "kmes/dashboard/first";
     }
 
+    @RequestMapping("/second")
+    public String interfaceSecond() {
+        return "kmes/dashboard/second";
+    }
+
+    @RequestMapping("/third")
+    public String interfaceThird() {
+        return "kmes/dashboard/third";
+    }
+
+    @RequestMapping("/fourth")
+    public String interfaceFourth() {
+        return "kmes/dashboard/fourth";
+    }
+
 
 }

gavel/src/main/resources/static/css/dashboard/index.css

@@ -486,4 +486,47 @@
 }
 .border:hover .in{
     background: #0d283f;
+}
+.main-second .center .center-cen{
+    width: 75%;
+}
+.main-second .center-right .right-bottom .bottom-b {
+    width: calc(100% - 0.2rem);
+    height: 2.6rem;
+    margin-left: 0.1rem;
+    margin-top: 0.1rem;
+}
+.banner{
+    width: calc(100% - .2rem);
+    height: calc(100% - .6rem);
+    margin-left: .1rem;
+    margin-top: .1rem;
+    padding: .1rem;
+    box-sizing: border-box;
+    overflow: hidden;
+}
+.banner .list {
+    color: white !important;
+    width: 6rem;
+    float: left;
+    height: 100%;
+    margin-top: 0.1rem;
+}
+.list .listTxt{
+    color: white !important;
+    /*width: 80%;*/
+    float:left;
+    height: 100%;
+}
+.list .listTxt p label{
+    text-align: right;
+    width: 1rem;
+    display: inline-block;
+    color: #a9e2ff;
+}
+.list .listTxt p{
+    color: #a9e2ff;
+    font-size: 14px;
+    line-height: 25px;
+    padding-bottom: 0.1rem;
 }
\ No newline at end of file

gavel/src/main/resources/static/js/dashboard/echarts.js

@@ -2232,7 +2232,7 @@ function setHglEchart(chart) {
     chart.setOption(ops,true);
 }
 
-function setPieDailyChart(chart) {
+function setPieDailyChart(chart,cerpent) {
     var ops= {
         color:["#A2E9FF","#409eff"],
         tooltip: {
@@ -2249,30 +2249,31 @@ function setPieDailyChart(chart) {
                 type: 'pie',
                 radius: ['40%', '70%'],
                 avoidLabelOverlap: false,
-                /*label: {
-                    show: false,
-                    position: 'center',
-                    normal:{
-                        show:true,
-                        position:"center",
-                         formatter: '{a}\r\n{b}%',
-                       /!* formatter:function () {
-
-                        }*!/
-                    }
-                },*/
-            /*    emphasis: {
-                    label: {
+                hoverAnimation:false,
+                silent:true,
+                label: {
+                    normal: {
                         show: true,
-                        fontSize: '40',
-                        fontWeight: 'bold'
+                        position: 'center',
+                        formatter: function(data){ // 设置圆饼图中间文字排版
+                            return "完工率\n"+(cerpent?(cerpent+"%"):"")
+                        },
+                    },
+                    emphasis: {
+                        disabled:true,
+                        show: false, //文字至于中间时，这里需为true
+                        textStyle: { //设置文字样式
+                            fontSize: '12',
+                            color:"#333"
+                        }
                     }
-                },*/
+                },
                 labelLine: {
-                    show: false
+                    normal: {
+                        show: false
+                    }
                 },
                 data: [
-
                     { value: 20, name: '未完工'},
                     { value: 80, name: '完工' },
                 ]
@@ -2282,6 +2283,165 @@ function setPieDailyChart(chart) {
     chart.setOption(ops,true);
 }
 
+function setRpcHglEchart(chart) {
+    var ops = {
+        color:["#409eff","#ffd03e"],
+        // tooltip: {
+        //     trigger: 'axis',
+        //     axisPointer: {
+        //         type: 'cross',
+        //         crossStyle: {
+        //             color: '#999'
+        //         }
+        //     }
+        // },
+        legend: {
+            data: ['计划', '合格率'],
+            textStyle:{
+                color:'white'
+            }
+        },
+        grid: {
+            left: '3%',
+            right: '4%',
+            bottom: '3%',
+            containLabel: true
+        },
+        xAxis: [
+            {
+                type: 'category',
+                data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri'],
+                axisPointer: {
+                    type: 'shadow'
+                },
+                axisTick:{
+                    show:true,
+                    lineStyle:{
+                        color:"white"
+                    }
+                },
+                axisLine:{
+                    show:true,
+                    lineStyle:{
+                        color:"white"
+                    }
+                },
+                axisLabel:{
+                    show:true,
+                    color:'white'
+                }
+            }
+        ],
+        yAxis: [
+            {
+                type: 'value',
+                name: '计划',
+                nameTextStyle:{
+                    color:"white"
+                },
+                splitLine: {
+                    show: false,
+
+                },
+                axisTick:{
+                    show:true,
+                    lineStyle:{
+                        color:'white',
+                    }
+                },
+                axisLine:{
+                    show:true,
+                    lineStyle:{
+                        color:'white',
+                    }
+
+                },
+                axisLabel:{
+                    show:true,
+                    color:'white',
+                    formatter: '{value}'
+                }
+            },
+            {
+                type: 'value',
+                name: '合格率',
+                min: 0,
+                max: 100,
+                interval: 20,
+                nameTextStyle:{
+                    color:"white"
+                },
+                splitLine: {
+                    show: false,
+
+                },
+                axisTick:{
+                    show:true,
+                    lineStyle:{
+                        color:'white',
+                    }
+                },
+                axisLine:{
+                    show:true,
+                    lineStyle:{
+                        color:'white',
+                    }
+
+                },
+                axisLabel:{
+                    show:true,
+                    color:'white',
+                    formatter: '{value} %'
+                }
+            }
+        ],
+        series: [
+            {
+                name: '计划',
+                type: 'bar',
+                data: [
+                    2.6, 5.9, 9.0, 26.4, 28.7,
+                ],
+                barWidth : 30,
+                itemStyle:{
+                    normal:{
+                        label:{
+                            show:true,
+                            position:"top",
+                            textStyle:{
+                                color:"white",
+                            }
+                        }
+
+                    }
+
+                }
+            },
+            {
+                name: '合格率',
+                type: 'line',
+                yAxisIndex: 1,
+                data: [20,30,90,30,29],
+                itemStyle:{
+                    normal:{
+                        label:{
+                            show:true,
+                            position:"top",
+                            textStyle:{
+                                color:"orange",
+                            }
+                        }
+
+                    }
+
+                }
+            }
+        ]
+    };
+    chart.setOption(ops,true);
+
+}
+
 // function setPieYChart(chart) {
 //     var ops= {
 //         tooltip: {

gavel/src/main/resources/templates/views/kmes/dashboard/first.html

@@ -315,7 +315,7 @@
         setTimeProductionEchart(myChartSdcl);    /*时段产量*/
         setDailyDataEchart(chartRpcdcsj); /*日排产达成数据*/
         setHglEchart(chartHgl);/*合格率*/
-        setPieDailyChart(chartRjh);/*日计划*/
+        setPieDailyChart(chartRjh,80);/*日计划*/
         setPieDailyChart(chartYjh);
         $('.myscroll').myScroll({
             speed: 60, //数值越大，速度越慢

gavel/src/main/resources/templates/views/kmes/dashboard/index.html

@@ -17,19 +17,19 @@
 					</a>
 				</li>
 				<li>
-					<a href="survey.html" target="_blank">
+					<a href="kmes/dashboard/second" target="_blank">
 						<img src="images/dashboard/xinyong.png" alt="">
 						<span>展示效果二</span>
 					</a>
 				</li>
 				<li>
-					<a href="index2.html" target="_blank">
+					<a href="kmes/dashboard/third" target="_blank">
 						<img src="images/dashboard/fengxian.png" alt="">
 						<span>展示效果三</span>
 					</a>
 				</li>
 				<li>
-					<a href="index3.html" target="_blank">
+					<a href="kmes/dashboard/fourth" target="_blank">
 						<img src="images/dashboard/chanye.png" alt="">
 						<span>展示效果四</span>
 					</a>