cwchen
/
ah_jjzhgd_webscreen
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

样式修改

This commit is contained in:
cwchen 2025-07-24 11:14:56 +08:00
parent 73f20adcdf
commit 8b5afaf6a4
3 changed files with 61 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
js/pages/newDataAnalysis/resourceRateAnalysis_api.js
View File

@ -195,7 +195,7 @@ function initUtilizationChart(distributionData) {
name: '资源利用率',
type: 'pie',
radius: ['40%', '70%'],
center: ['65%', '50%'],
center: ['65%', '40%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 8,
@ -313,15 +313,15 @@ function initTrendsChart(trendsData) {
textStyle: {
color: '#16baaa'
},
top: 10
// top: 10
},
grid: {
/* grid: {
left: '3%',
right: '4%',
bottom: '3%',
top: '15%',
bottom: '0%',
top: '5%',
containLabel: true
},
}, */
xAxis: {
type: 'category',
boundaryGap: false,
@ -475,6 +475,9 @@ function showNoDataMessage() {
};
trendsChart.setOption(option);
window.addEventListener("resize", function () {
trendsChart.resize();
});
}
/**

54
pages/newDataAnalysis/overallEfficiency.html
View File

@ -3,19 +3,19 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>工地整体效能分析系统</title>
<title>工地整体效能分析</title>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<script src="https://cdn.jsdelivr.net/npm/echarts@5.4.2/dist/echarts.min.js"></script>
<style>
:root {
--primary: #1a3a5f;
--primary: #20d3c2 ;
--secondary: #2c5c8c;
--accent: #4caf50;
--warning: #ff9800;
--danger: #f44336;
--light: #f5f7fa;
--dark: #333;
--dark: #8cc8c1;
--gray: #e4e7eb;
--card-shadow: 0 4px 15px rgba(0,0,0,0.08);
--bg-color: #ffffff;
@ -75,7 +75,7 @@
}
.last-update {
color: #666;
color: #8cc8c1;
font-size: 0.9rem;
}
@ -88,10 +88,13 @@
}
.kpi-card {
background: var(--bg-color);
/* background: var(--bg-color); */
background: linear-gradient(135deg, rgba(22, 186, 170, 0.1) 0%, rgba(22, 186, 170, 0.05) 100%);
border: 1px solid rgba(22, 186, 170, 0.3);
box-shadow: 0 4px 20px rgb;
border-radius: 12px;
padding: 25px;
box-shadow: var(--card-shadow);
/* box-shadow: var(--card-shadow); */
display: flex;
flex-direction: column;
transition: transform 0.3s;
@ -144,13 +147,14 @@
.kpi-title {
font-size: 1rem;
font-weight: 500;
color: #666;
color: #8cc8c1;
}
.kpi-value {
font-size: 2.2rem;
font-weight: 700;
margin: 10px 0;
color: #8cc8c1;
}
.kpi-trend {
@ -170,11 +174,13 @@
/* 分析部分 */
.analysis-section {
background: var(--bg-color);
/* background: var(--bg-color); */
background: linear-gradient(135deg, rgba(22, 186, 170, 0.1) 0%, rgba(22, 186, 170, 0.05) 100%);
border-radius: 12px;
padding: 25px;
box-shadow: var(--card-shadow);
margin-bottom: 25px;
border-top: 4px solid var(--primary);
}
.section-title {
@ -194,15 +200,20 @@
.bottleneck-card {
border-left: 4px solid var(--warning);
padding: 15px;
background: #fff9e6;
border-radius: 0 8px 8px 0;
/* background: #fff9e6; */
background: rgba(22, 186, 170, 0.08);
border: 1px solid rgba(22, 186, 170, 0.2);
border-radius: 8px;
/* border-radius: 0 8px 8px 0; */
transition: all 0.3s;
cursor: pointer;
}
.bottleneck-card:hover {
transform: translateX(5px);
background: #fff1cc;
/* background: #fff1cc; */
background: rgba(22, 186, 170, 0.15);
border-color: rgba(22, 186, 170, 0.4);
}
.bottleneck-title {
@ -215,12 +226,14 @@
.bottleneck-desc {
font-size: 0.9rem;
color: #666;
color: #8cc8c1;
margin-bottom: 10px;
}
.optimization-card {
background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
/* background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%); */
background: rgba(22, 186, 170, 0.08);
border: 1px solid rgba(22, 186, 170, 0.2);
border-radius: 8px;
padding: 20px;
}
@ -235,7 +248,11 @@
}
.suggestion-item:hover {
background: rgba(255,255,255,0.5);
/* background: rgba(255,255,255,0.5); */
background: rgba(22, 186, 170, 0.15);
border-color: rgba(22, 186, 170, 0.4);
transform: translateX(5px);
/* box-shadow: -2px 0 10px rgba(22, 186, 170, 0.3); */
border-radius: 8px;
padding: 15px;
}
@ -263,7 +280,7 @@
}
.suggestion-content p {
color: #666;
color: #8cc8c1;
font-size: 0.9rem;
}
@ -414,7 +431,7 @@
/* 页脚 */
footer {
text-align: center;
color: #666;
color: #8cc8c1;
padding: 20px;
font-size: 0.9rem;
margin-top: 20px;
@ -492,6 +509,11 @@
.data-table tr:hover {
background: rgba(26, 58, 95, 0.05);
}
/* background: rgba(22, 186, 170, 0.15);
border-color: rgba(22, 186, 170, 0.4);
transform: translateX(5px);
box-shadow: -2px 0 10px rgba(22, 186, 170, 0.3); */
</style>
</head>
<body>

21
pages/newDataAnalysis/resourceRateAnalysis.html
View File

@ -13,9 +13,9 @@
<!-- Font Awesome 图标库 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
<!-- Animate.css 动画库 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css">
<!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"> -->
<!-- Particles.js 粒子特效库 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/particles.js/2.0.0/particles.min.js"></script>
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/particles.js/2.0.0/particles.min.js"></script> -->
<script src="../../js/publics/sm4.js" type="text/javascript"></script>
<script src="../../js/publics/jquery-3.6.0.min.js" type="text/javascript"></script>
<script src="../../js/publics/public.js"></script>
@ -31,10 +31,14 @@
</head>
<style>
body{
height: 96%;
margin: 2% 0;
}
.resource-container {
width: 100%;
height: 100%;
background: linear-gradient(135deg, #0a1e2b 0%, #1a2f3a 50%, #0a1e2b 100%);
/* background: linear-gradient(135deg, #0a1e2b 0%, #1a2f3a 50%, #0a1e2b 100%); */
padding: 20px;
box-sizing: border-box;
overflow: hidden;
@ -68,7 +72,7 @@
left: 0;
width: 100%;
height: 100%;
background: rgba(10, 30, 43, 0.9);
/* background: rgba(10, 30, 43, 0.9); */
display: flex;
justify-content: center;
align-items: center;
@ -134,6 +138,7 @@
.header-stats {
display: flex;
gap: 30px;
width: 35%;
}
.stat-item {
@ -208,7 +213,8 @@
background: linear-gradient(135deg, rgba(22, 186, 170, 0.1) 0%, rgba(22, 186, 170, 0.05) 100%);
border: 1px solid rgba(22, 186, 170, 0.3);
border-radius: 12px;
padding: 20px;
/* padding: 20px; */
padding: 5px;
position: relative;
overflow: hidden;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
@ -270,7 +276,8 @@
background: rgba(22, 186, 170, 0.1);
border: 1px solid rgba(22, 186, 170, 0.3);
border-radius: 8px;
padding: 20px;
/* padding: 20px; */
padding: 8px 10px 0 10px;
text-align: center;
position: relative;
transition: all 0.3s ease;
@ -478,7 +485,7 @@
<div class="resource-header animate__animated animate__fadeInDown">
<div class="header-title">
<i class="fas fa-chart-line header-icon"></i>
资源利用率实时监控
资源利用率分析
</div>
<div class="header-stats">
<div class="stat-item">