|
|
@@ -1,177 +1,195 @@
|
|
|
<!DOCTYPE html>
|
|
|
<html xmlns:th="http://www.thymeleaf.org">
|
|
|
-<head>
|
|
|
- <meta charset="utf-8">
|
|
|
- <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
|
|
|
- <meta http-equiv="refresh" content="30">
|
|
|
- <title>企业管理及健康监管平台(大屏版)</title>
|
|
|
- <link th:href="@{/static/css/mui.min.css}" href="static/css/mui.min.css" rel="stylesheet"/>
|
|
|
- <link th:href="@{/static/fonts/iconfont.css}" href="static/css/iconfont.css" rel="stylesheet"/>
|
|
|
- <link th:href="@{/static/css/sczpfyy.css}" href="static/css/sczpfyy.css" rel="stylesheet"/>
|
|
|
- <style>
|
|
|
- header .mui-pull-right {
|
|
|
- z-index: 99 !important;
|
|
|
- }
|
|
|
|
|
|
- .header-right-wz {
|
|
|
- margin-left: 5px;
|
|
|
- }
|
|
|
- </style>
|
|
|
- <link th:href="@{/static/css/xpwyfyy.css}" href="static/css/xpwyfyy.css" rel="stylesheet" />
|
|
|
- <link th:href="@{/static/css/wallfyy.css}" href="static/css/wallfyy.css" rel="stylesheet" />
|
|
|
- <style>
|
|
|
- .fyy-statistics.mui-grid-view.mui-grid-9 .mui-table-view-cell {
|
|
|
- padding: 0 10px;
|
|
|
- }
|
|
|
+ <head>
|
|
|
+ <meta charset="utf-8">
|
|
|
+ <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
|
|
|
+ <meta http-equiv="refresh" content="30">
|
|
|
+ <title>企业管理及健康监管平台</title>
|
|
|
+ <link th:href="@{/static/css/mui.min.css}" href="static/css/mui.min.css" rel="stylesheet" />
|
|
|
+ <link th:href="@{/static/fonts/iconfont.css}" href="static/css/iconfont.css" rel="stylesheet" />
|
|
|
+ <link th:href="@{/static/css/sczpfyy.css}" href="static/css/sczpfyy.css" rel="stylesheet" />
|
|
|
+ <style>
|
|
|
+ header .mui-pull-right {
|
|
|
+ z-index: 99 !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .header-right-wz {
|
|
|
+ margin-left: 5px;
|
|
|
+ }
|
|
|
+ </style>
|
|
|
+ <link th:href="@{/static/css/xpwyfyy.css}" href="static/css/xpwyfyy.css" rel="stylesheet" />
|
|
|
+ <link th:href="@{/static/css/wallfyy.css}" href="static/css/wallfyy.css" rel="stylesheet" />
|
|
|
+ <style>
|
|
|
+ .fyy-statistics.mui-grid-view.mui-grid-9 .mui-table-view-cell {
|
|
|
+ padding: 0 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .fyy-statistics.mui-table-view.mui-grid-view .mui-table-view-cell .mui-media-body {
|
|
|
+ text-align: inherit;
|
|
|
+ margin: 0;
|
|
|
+ display: inherit;
|
|
|
+ line-height: inherit;
|
|
|
+ height: auto;
|
|
|
+ background: #283464;
|
|
|
+ padding: 15px 0;
|
|
|
+ border-radius: 4px;
|
|
|
+ border: #375cf5 solid 1px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .fyy-statistics.mui-grid-view.mui-grid-9 .mui-media .mui-icon {
|
|
|
+ padding: 0;
|
|
|
+ font-size: 60px
|
|
|
+ }
|
|
|
+
|
|
|
+ .fyy-wall-top .mui-table-view-cell p {
|
|
|
+ color: #ffffff;
|
|
|
+ font-size: 24px;
|
|
|
+ margin: 20px 0
|
|
|
+ }
|
|
|
+
|
|
|
+ .mui-bar .mui-content-padded h5 {
|
|
|
+ font-size: 24px;
|
|
|
+ position: absolute;
|
|
|
+ right: 15px;
|
|
|
+ top: 50%;
|
|
|
+ margin-top: -12px;
|
|
|
+ color: #ffffff
|
|
|
+ }
|
|
|
+
|
|
|
+ .fyy-wall-top .mui-col-xs-3 {
|
|
|
+ width: 25%
|
|
|
+ }
|
|
|
+
|
|
|
+ .fyy-slider .mui-table-view-cell,
|
|
|
+ .fyy-slider .mui-table-view-cell .mui-content-padded,
|
|
|
+ .fyy-slider .mui-table-view {
|
|
|
+ padding: 10px
|
|
|
+ }
|
|
|
+
|
|
|
+ .mui-segmented-control.mui-scroll-wrapper,
|
|
|
+ .mui-segmented-control.mui-scroll-wrapper .mui-scroll {
|
|
|
+ height: 60px
|
|
|
+ }
|
|
|
+
|
|
|
+ .mui-segmented-control .fyy-control-item {
|
|
|
+ line-height: 60px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .mui-bar {
|
|
|
+ height: 100px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .mui-bar .mui-title {
|
|
|
+ font-size: 60px;
|
|
|
+ line-height: 100px;
|
|
|
+ font-weight: 600;
|
|
|
+ letter-spacing: 10px;
|
|
|
+ top: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .mui-bar-nav~.mui-content {
|
|
|
+ padding-top: 120px
|
|
|
+ }
|
|
|
+
|
|
|
+ .mui-segmented-control.mui-segmented-control-inverted .fyy-control-item {
|
|
|
+ font-size: 24px
|
|
|
+ }
|
|
|
+
|
|
|
+ .mui-table-view .mui-table-view-cell {
|
|
|
+ font-size: 18px;
|
|
|
+ line-height: 30px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .mui-table-view-cell p {
|
|
|
+ font-size: 18px
|
|
|
+ }
|
|
|
+
|
|
|
+ .mui-slider-group .mui-col-xs-1 {
|
|
|
+ width: 12.5%
|
|
|
+ }
|
|
|
|
|
|
- .fyy-statistics.mui-table-view.mui-grid-view .mui-table-view-cell .mui-media-body {
|
|
|
- text-align: inherit;
|
|
|
- margin: 0;
|
|
|
- display: inherit;
|
|
|
- line-height: inherit;
|
|
|
- height: auto;
|
|
|
- background: #283464;
|
|
|
- padding: 30px 0;
|
|
|
- border-radius: 4px;
|
|
|
- border: #375cf5 solid 1px;
|
|
|
- }
|
|
|
+ .mui-table-view:before,.mui-table-view:after{
|
|
|
+ background:0
|
|
|
+ }
|
|
|
+ </style>
|
|
|
+ </head>
|
|
|
|
|
|
- .fyy-statistics.mui-grid-view.mui-grid-9 .mui-media .mui-icon {
|
|
|
- padding: 0;
|
|
|
- font-size:60px
|
|
|
- }
|
|
|
+ <body>
|
|
|
+ <div id="app">
|
|
|
+ <header class="mui-bar mui-bar-nav">
|
|
|
+ <h1 class="mui-title"><span th:value="${company.name}"></span>荆鹏软件健康公示墙</h1>
|
|
|
+ <div class="mui-content-padded">
|
|
|
+ <h5 th:text="${now}"></h5>
|
|
|
+ </div>
|
|
|
+ </header>
|
|
|
+ <div class="mui-content fyy-wall">
|
|
|
+ <div class="fyy-wall-top">
|
|
|
+ <div class="fyy-wall-today">
|
|
|
|
|
|
- .fyy-wall-top .mui-table-view-cell p {
|
|
|
- color: #ffffff;
|
|
|
- font-size:24px;
|
|
|
- margin:20px 0
|
|
|
- }
|
|
|
-
|
|
|
- .mui-content-padded h5 {
|
|
|
- margin: 20px 10px 10px;
|
|
|
- font-size: 24px;
|
|
|
- }
|
|
|
-
|
|
|
- .fyy-wall-top .mui-col-xs-3 {
|
|
|
- width: 25%
|
|
|
- }
|
|
|
-
|
|
|
- .fyy-slider .mui-table-view-cell,
|
|
|
- .fyy-slider .mui-table-view-cell .mui-content-padded,
|
|
|
- .fyy-slider .mui-table-view {
|
|
|
- padding: 10px
|
|
|
- }
|
|
|
-
|
|
|
- .mui-segmented-control.mui-scroll-wrapper,
|
|
|
- .mui-segmented-control.mui-scroll-wrapper .mui-scroll {
|
|
|
- height: 60px
|
|
|
- }
|
|
|
-
|
|
|
- .mui-segmented-control .fyy-control-item {
|
|
|
- line-height: 60px;
|
|
|
- }
|
|
|
- .mui-bar{
|
|
|
- height: 150px;
|
|
|
- }
|
|
|
- .mui-bar .mui-title{
|
|
|
- font-size: 60px;
|
|
|
- line-height: 150px;
|
|
|
- font-weight: 600;
|
|
|
- letter-spacing: 10px;
|
|
|
- top: 0;
|
|
|
- }
|
|
|
- .mui-bar-nav~.mui-content{
|
|
|
- padding-top:150px
|
|
|
- }
|
|
|
- .mui-segmented-control.mui-segmented-control-inverted .fyy-control-item{
|
|
|
- font-size:24px
|
|
|
- }
|
|
|
-
|
|
|
- .mui-table-view .mui-table-view-cell{
|
|
|
- font-size: 18px;
|
|
|
- line-height: 30px;
|
|
|
- }
|
|
|
-
|
|
|
- .mui-table-view-cell p{
|
|
|
- font-size:18px
|
|
|
- }
|
|
|
- </style>
|
|
|
-</head>
|
|
|
-<body>
|
|
|
-<div id="app">
|
|
|
- <header class="mui-bar mui-bar-nav">
|
|
|
- <h1 class="mui-title"><span th:text="${company.name}"></span>健康公示墙</h1>
|
|
|
- </header>
|
|
|
- <div class="mui-content fyy-wall">
|
|
|
- <div class="fyy-wall-top">
|
|
|
- <div class="fyy-wall-today">
|
|
|
- <div class="mui-content-padded">
|
|
|
- <h5 th:text="${now}"></h5>
|
|
|
- </div>
|
|
|
- <ul class="mui-table-view mui-grid-view mui-grid-9 fyy-statistics">
|
|
|
- <li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-2">
|
|
|
- <div class="mui-media-body" style="margin-bottom:5px">
|
|
|
- <span class="mui-icon iconfont icon-renyuanjieshao"></span>
|
|
|
- <p>已测员工人数<span style="margin:0 5px">/</span>应测员工人数</p>
|
|
|
- <h1>
|
|
|
+ <ul class="mui-table-view mui-grid-view mui-grid-9 fyy-statistics">
|
|
|
+ <li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-2">
|
|
|
+ <div class="mui-media-body" style="margin-bottom:5px">
|
|
|
+ <span class="mui-icon iconfont icon-renyuanjieshao"></span>
|
|
|
+ <p>已测员工人数<span style="margin:0 5px">/</span>应测员工人数</p>
|
|
|
+ <h1>
|
|
|
<span class="color4fc5f7" th:text="${checkedPersonNum}">0</span>
|
|
|
<span style="margin:0 15px">/</span>
|
|
|
<span class="color4fc5f7" th:text="${personNum}">0</span>
|
|
|
</h1>
|
|
|
- </div>
|
|
|
- </li>
|
|
|
- <li class="mui-table-view-cell mui-media mui-col-xs-2 mui-col-sm-2">
|
|
|
- <div class="mui-media-body" style="margin-bottom:5px">
|
|
|
- <span class="mui-icon iconfont icon-renshu"></span>
|
|
|
- <p>已测访客人数</p>
|
|
|
- <h1 class="colorda94f8" th:text="${checkedVisitorNum}">0</h1>
|
|
|
- </div>
|
|
|
- </li>
|
|
|
- <li class="mui-table-view-cell mui-media mui-col-xs-2 mui-col-sm-2">
|
|
|
- <div class="mui-media-body" style="margin-bottom:5px">
|
|
|
- <span class="mui-icon iconfont icon-leijicishu1"></span>
|
|
|
- <p>累计检测人次</p>
|
|
|
- <h1 class="colorf8b155" th:text="${totalCheckNum}">0</h1>
|
|
|
- </div>
|
|
|
- </li>
|
|
|
- <li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-2">
|
|
|
- <div class="mui-media-body" style="margin-bottom:5px">
|
|
|
- <span class="mui-icon iconfont icon-baojing"></span>
|
|
|
- <p>当日异常人数<span style="margin:0 5px">/</span>累计异常人数</p>
|
|
|
- <h1>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ <li class="mui-table-view-cell mui-media mui-col-xs-2 mui-col-sm-2">
|
|
|
+ <div class="mui-media-body" style="margin-bottom:5px">
|
|
|
+ <span class="mui-icon iconfont icon-renshu"></span>
|
|
|
+ <p>已测访客人数</p>
|
|
|
+ <h1 class="colorda94f8" th:text="${checkedVisitorNum}">0</h1>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ <li class="mui-table-view-cell mui-media mui-col-xs-2 mui-col-sm-2">
|
|
|
+ <div class="mui-media-body" style="margin-bottom:5px">
|
|
|
+ <span class="mui-icon iconfont icon-leijicishu1"></span>
|
|
|
+ <p>累计检测人次</p>
|
|
|
+ <h1 class="colorf8b155" th:text="${totalCheckNum}">0</h1>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ <li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-2">
|
|
|
+ <div class="mui-media-body" style="margin-bottom:5px">
|
|
|
+ <span class="mui-icon iconfont icon-baojing"></span>
|
|
|
+ <p>当日异常人数<span style="margin:0 5px">/</span>累计异常人数</p>
|
|
|
+ <h1>
|
|
|
<span class="colorfe616c" th:text="${dayAbnormalNum}">0</span>
|
|
|
<span style="margin:0 15px">/</span>
|
|
|
<span class="colorfe616c" th:text="${totalAbnormalNum}">0</span>
|
|
|
</h1>
|
|
|
- </div>
|
|
|
- </li>
|
|
|
- <li class="mui-table-view-cell mui-media mui-col-xs-2 mui-col-sm-2">
|
|
|
- <div class="mui-media-body" style="margin-bottom:5px">
|
|
|
- <span class="mui-icon iconfont icon-shijian"></span>
|
|
|
- <p>连续无异常天数</p>
|
|
|
- <h1 class="color05c8af" th:text="${normalDays}">0</h1>
|
|
|
- </div>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <ul class="mui-table-view">
|
|
|
- <li class="mui-table-view-cell mui-media mui-col-xs-2 mui-pull-left"
|
|
|
- th:each="item : ${itemList}">
|
|
|
- <div class="mui-content-padded">
|
|
|
- <div class="mui-media-object" style="height: 300px;">
|
|
|
- <img th:src="${item.faceImage}" style=" object-fit:cover;min-height:100%;width:100%;">
|
|
|
- </div>
|
|
|
- <div class="mui-media-body">
|
|
|
- <span th:text="${item.name}"></span>
|
|
|
- <span class="mui-pull-right color05c8af" th:text="${item.temperature}"></span>
|
|
|
- </div>
|
|
|
- <p th:text="${#dates.format(item.recordTime, 'MM-dd HH:mm')}"></p>
|
|
|
- </div>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- </div>
|
|
|
-</div>
|
|
|
-</body>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ <li class="mui-table-view-cell mui-media mui-col-xs-2 mui-col-sm-2">
|
|
|
+ <div class="mui-media-body" style="margin-bottom:5px">
|
|
|
+ <span class="mui-icon iconfont icon-shijian"></span>
|
|
|
+ <p>连续无异常天数</p>
|
|
|
+ <h1 class="color05c8af" th:text="${normalDays}">0</h1>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <ul class="mui-table-view">
|
|
|
+ <li class="mui-table-view-cell mui-media mui-col-xs-1 mui-pull-left" th:each="item : ${itemList}">
|
|
|
+ <div class="mui-content-padded">
|
|
|
+ <div class="mui-media-object" style="height: 260px;">
|
|
|
+ <img th:src="${item.faceImage}" style=" object-fit:cover;min-height:100%;width:100%;">
|
|
|
+ </div>
|
|
|
+ <div class="mui-media-body">
|
|
|
+ <span th:text="${item.name}"></span>
|
|
|
+ <span class="mui-pull-right color05c8af" th:text="${item.temperature}"></span>
|
|
|
+ </div>
|
|
|
+ <p th:text="${#dates.format(item.recordTime, 'MM-dd HH:mm')}"></p>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </body>
|
|
|
|
|
|
-</html>
|
|
|
+</html>
|
