From bf8d8aaf62190e0d49bbd34e3bb2aa7707d86537 Mon Sep 17 00:00:00 2001
From: chenhuan <czj123456>
Date: 星期三, 22 五月 2024 10:05:44 +0800
Subject: [PATCH] Merge branch 'master' of http://117.78.1.188:8089/r/dkyChenJiang
---
javaweb-plus/javaweb-admin/src/main/resources/templates/main.html | 323 ++++++++++++++++++++++++++++++++++++++++++++---------
1 files changed, 269 insertions(+), 54 deletions(-)
diff --git a/javaweb-plus/javaweb-admin/src/main/resources/templates/main.html b/javaweb-plus/javaweb-admin/src/main/resources/templates/main.html
index ce0adc3..21e4277 100644
--- a/javaweb-plus/javaweb-admin/src/main/resources/templates/main.html
+++ b/javaweb-plus/javaweb-admin/src/main/resources/templates/main.html
@@ -2,61 +2,265 @@
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
<th:block th:include="include :: header('寮瑰眰缁勪欢')" />
-<link href="../static/css/bootstrap.min.css"
- th:href="@{/css/bootstrap.min.css}" rel="stylesheet" />
-<link href="../static/css/font-awesome.min.css"
- th:href="@{/css/font-awesome.min.css}" rel="stylesheet" />
-<link href="../static/css/main/animate.min.css"
- th:href="@{/css/main/animate.min.css}" rel="stylesheet" />
-<link href="../static/css/main/style.min862f.css"
- th:href="@{/css/main/style.min862f.css}" rel="stylesheet" />
+<link href="../static/css/bootstrap.min.css" th:href="@{/css/bootstrap.min.css}" rel="stylesheet" />
+<link href="../static/css/font-awesome.min.css" th:href="@{/css/font-awesome.min.css}" rel="stylesheet" />
+<link href="../static/css/main/animate.min.css" th:href="@{/css/main/animate.min.css}" rel="stylesheet" />
+<link href="../static/css/main/style.min862f.css" th:href="@{/css/main/style.min862f.css}" rel="stylesheet" />
<link rel="stylesheet" th:href="@{/css/custom/main.css}" />
- <th:block th:include="include :: datetimepicker-css" />
- <style type="text/css">
- .content {
- width: 100%;
- background-color: rgba(0,0,0,0.01) !important;
- }
- </style>
+<link href="../static/js/elementUI/index.css" th:href="@{/js/elementUI/index.css}" rel="stylesheet" />
+
+<style type="text/css">
+ .content {
+ width: 100%;
+ background-color: rgba(0,0,0,0.01) !important;
+ }
+ .el-badge__content.is-fixed {
+ position: absolute;
+ top: 0;
+ right: 0px;
+ -webkit-transform: translateY(-50%) translateX(100%);
+ transform: translateY(0%) translateX(100%);
+ }
+ .el-card__header{
+ height: 40px;
+ padding: 8px 20px;
+ }
+ .active-red{
+ width: 20px;
+ height: 20px;
+ border-radius: 50%;
+ font-size: 16px;
+ color: white;
+ background: #314659;
+ text-align: center;
+ line-height: 20px;
+ float: left;
+ }
+
+ .active-blue{
+ width: 2%;
+ height: 10px;
+ border-radius: 50%;
+ font-size: 16px;
+ color:blue;
+ }
+ .cdcode{
+ width: 15%;
+ float: left;
+ margin-left: 10px;
+ font-size: 16px;
+ line-height: 20px;
+ }
+ .cdstatus{
+ width: 15%;
+ float: left;
+ margin-left: 0px;
+ font-size: 16px;
+ line-height: 20px;
+ }
+ .cdprocess{
+ width: 60%;
+ float: left;
+ margin-left: 10px;
+ }
+ .rankrow{
+ margin-top: 15px;
+ }
+
+</style>
</head>
<body class="gray-bg">
- <div class="content">
- <div class="col-sm-12">
- <div class="ibox float-e-margins">
- <div class="ibox-title">
- <h3>娌夐檷鐩戞祴缃戝缓璁惧伐绋嬮」鐩垎甯�</h3>
- </div>
- <div class="ibox-content">
-
- <div class="row">
- <div class="col-sm-8">
- <div id="map_div" style="width: 100%;height: 750px;"></div>
- </div>
-
- <div class="col-sm-4">
- <div >
- <div style="width: 100%;height: 20px;">
- <h3>椤圭洰鎬讳綋杩涘害(%)</h3>
- </div>
- <div id="Chart1" style="width: 80%;height: 250px;margin-left: 10%;"></div>
- </div>
-
- <div >
- <div style="width: 100%;height: 20px;">
- <h3>鍦哄湴璇︾粏杩涘害(%)</h3>
- </div>
- <div style="width: 100%;height: 500px;overflow: auto">
- <div id="Chart2" style="width: 100%;height: 1500px;"></div>
- </div>
-
- </div>
-
- </div>
+ <div class="content" id="app">
+ <el-row style="height: 130px;">
+ <el-col :span="6">
+ <el-card class="box-card">
+ <div>
+ <span style="color:rgba(0,0,0,.65);font-size: 15px;">鍦哄湴鏁伴噺</span>
+ <li class="el-icon-s-promotion" style="font-size: 18px;float: right;color: grey">
</div>
- </div>
- </div>
- </div>
+ <div>
+ <span style="color:#000;font-size: 26px;word-break: break-all;line-height: 38px">34涓�
+ </span>
+ </div>
+ <div>
+ <span style="color:rgba(0,0,0,.65);font-size: 15px;">
+ 鍗忚皟涓� 0
+ <li class="el-icon-caret-bottom" style="color: #f56c6c">
+ </span>
+ <span style="color:rgba(0,0,0,.65);font-size: 15px;">
+ 寰呭紑宸� 34
+ <li class="el-icon-caret-bottom" style="color: #e6a23c">
+ </span>
+ <span style="color:rgba(0,0,0,.65);font-size: 15px;">
+ 杩涜涓� 0
+ <li class="el-icon-caret-top" style="color: #409eff">
+ </span>
+
+ </div>
+ </el-card>
+ </el-col>
+
+ <el-col :span="6">
+ <el-card class="box-card">
+ <div>
+ <span style="color:rgba(0,0,0,.65);font-size: 15px;">閽诲瓟杩涘昂</span>
+ <li class="el-icon-coin" style="font-size: 18px;float: right;color: grey">
+ </div>
+ <div>
+ <span style="color:#000;font-size: 26px;word-break: break-all;line-height: 38px">864涓�
+ </span>
+ </div>
+ <div>
+ <span style="color:rgba(0,0,0,.65);font-size: 15px;">
+ 鎬昏繘灏� 134,1000.00m
+ <li class="el-icon-caret-bottom" style="color: #f56c6c">
+ </span>
+ <span style="color:rgba(0,0,0,.65);font-size: 15px;">
+ 宸插畬鎴� 12,322.23m
+ <li class="el-icon-caret-bottom" style="color: #409eff">
+ </span>
+ </div>
+ </el-card>
+ </el-col>
+
+ <el-col :span="6">
+ <el-card class="box-card">
+ <div>
+ <span style="color:rgba(0,0,0,.65);font-size: 15px;">瀹炴椂鐩戞帶</span>
+ <li class="el-icon-video-camera" style="font-size: 18px;float: right;color: grey">
+ </div>
+ <div>
+ <span style="color:#000;font-size: 26px;word-break: break-all;line-height: 38px">114涓�
+ </span>
+ </div>
+ <div>
+ <span style="color:rgba(0,0,0,.65);font-size: 15px;">
+ 鎬昏繘灏� 134,1000.00m
+ <li class="el-icon-caret-bottom" style="color: #f56c6c">
+ </span>
+ <span style="color:rgba(0,0,0,.65);font-size: 15px;">
+ 宸插畬鎴� 12,322.23m
+ <li class="el-icon-caret-bottom" style="color: #409eff">
+ </span>
+ </div>
+ </el-card>
+ </el-col>
+ <el-col :span="6">
+ <el-card class="box-card">
+ <div>
+ <span style="color:rgba(0,0,0,.65);font-size: 15px;">璧勬枡鏂囦欢</span>
+ <li class="el-icon-s-order" style="font-size: 18px;float: right;color: grey">
+ </div>
+ <div>
+ <span style="color:#000;font-size: 26px;word-break: break-all;line-height: 38px">3813
+ </span>
+ </div>
+ <div>
+ <span style="color:rgba(0,0,0,.65);font-size: 15px;">
+ 鎬昏繘灏� 134,1000.00m
+ <li class="el-icon-caret-bottom" style="color: #f56c6c">
+ </span>
+ <span style="color:rgba(0,0,0,.65);font-size: 15px;">
+ 宸插畬鎴� 12,322.23m
+ <li class="el-icon-caret-bottom" style="color: #409eff">
+ </span>
+ </div>
+
+ </el-card>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="16">
+ <el-card class="box-card">
+<!-- <div slot="header">-->
+<!-- -->
+<!-- </div>-->
+ <div style="height: 200px;">
+ <h3>鏉愭枡缁熻</h3>
+ </div>
+ </el-card>
+
+ <el-card class="box-card">
+ <div id="map_div" style="width: 100%;height: 550px;"></div>
+ </el-card>
+
+ </el-col>
+
+ <el-col :span="8">
+ <el-card class="box-card">
+ <div style="width: 100%;height: 20px;">
+ <h3>椤圭洰鎬讳綋杩涘害(%)</h3>
+ </div>
+ <div id="Chart1" style="width: 80%;height: 180px;margin-left: 10%;"></div>
+ </el-card>
+
+ <el-card class="box-card">
+ <div style="width: 100%;height: 20px;">
+ <h3>鍦哄湴璇︾粏杩涘害(%)</h3>
+ </div>
+ <div style="width: 100%;height: 500px;overflow: auto">
+<!-- <div id="Chart2" style="width: 100%;height: 1500px;"></div>-->
+
+ <el-row class="rankrow">
+ <el-col :span="2">
+ <div class="active-red">1</div>
+ </el-col>
+
+ <el-col :span="4">
+ <div style="font-size: 16px">鍦哄湴001</div>
+ </el-col >
+
+ <el-col :span="4">
+ <div style="font-size: 16px">鍗忚皟涓�</div>
+ </el-col>
+
+ <el-col :span="12">
+ <div><el-progress :stroke-width="12" :percentage="50"></el-progress></div>
+ </el-col>
+ </el-row>
+ <el-row class="rankrow">
+ <el-col :span="2">
+ <div class="active-red">1</div>
+ </el-col>
+
+ <el-col :span="4">
+ <div style="font-size: 16px">鍦哄湴002</div>
+ </el-col >
+
+ <el-col :span="4">
+ <div style="font-size: 16px">鍗忚皟涓�</div>
+ </el-col>
+
+ <el-col :span="12">
+ <div><el-progress :stroke-width="12" :percentage="50"></el-progress></div>
+ </el-col>
+ </el-row>
+ <el-row class="rankrow">
+ <el-col :span="2">
+ <div class="active-red">1</div>
+ </el-col>
+
+ <el-col :span="4">
+ <div style="font-size: 16px">鍦哄湴003</div>
+ </el-col >
+
+ <el-col :span="4">
+ <div style="font-size: 16px">鍗忚皟涓�</div>
+ </el-col>
+
+ <el-col :span="12">
+ <div><el-progress :stroke-width="12" :percentage="50"></el-progress></div>
+ </el-col>
+ </el-row>
+
+ </div>
+
+ </el-card>
+
+ </el-col>
+
+ </el-row>
</div>
@@ -68,6 +272,10 @@
<script src="http://lbs.tianditu.gov.cn/js/lib/d3/d3.min.js" type="text/javascript"></script>
<script src="http://lbs.tianditu.gov.cn/api/js4.0/opensource/openlibrary/D3SvgOverlay.js" type="text/javascript"></script>
<script th:src="@{/js/custom/main.js}"></script>
+
+ <script th:src="@{/js/vue.min.js}"></script>
+ <script th:src="@{/js/elementUI/index.js}"></script>
+
<th:block th:include="include :: sparkline-js" />
<th:block th:include="include :: footer" />
@@ -78,8 +286,15 @@
getReallyData();
totalProcess();
stationProcess();
-
})
+ var vm = new Vue({
+ el: "#app",
+ data() {
+ return {};
+ },
+ methods: {
+ }
+ });
// 鍔犺浇鍦板浘
let map=null;
var countries = [];
@@ -215,7 +430,7 @@
series: [
{
type: "gauge",
- radius: 120,
+ radius: 80,
z: 1,
startAngle: 225,
endAngle: -45,
@@ -351,8 +566,8 @@
}
var datas = [
- { ranking: 1, station: '鍦哄湴001', value: 85 },
- { ranking: 2, station: '鍦哄湴002', value: 22 },
+ { ranking: 1, station: '鍦哄湴001 鍗忚皟涓�', value: 85 },
+ { ranking: 2, station: '鍦哄湴002 鍗忚皟涓�', value: 22 },
{ ranking: 3, station: '鍦哄湴003', value: 33 },
{ ranking: 4, station: '鍦哄湴004', value: 40 },
{ ranking: 5, station: '鍦哄湴005', value: 33 },
--
Gitblit v1.9.1