104 lines
4.1 KiB
Plaintext
104 lines
4.1 KiB
Plaintext
|
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ManPowerWorkChart.aspx.cs" Inherits="FineUIPro.Web.JDGL.SGManPower.ManPowerWorkChart" %>
|
||
|
<%@ Register Src="~/Controls/ChartControl.ascx" TagName="ChartControl" TagPrefix="uc1" %>
|
||
|
<!DOCTYPE html>
|
||
|
|
||
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
||
|
<head runat="server">
|
||
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||
|
<title>现场考勤人力图表</title>
|
||
|
<link href="../../res/css/common.css" rel="stylesheet" type="text/css" />
|
||
|
<style type="text/css"> .chart-container {
|
||
|
overflow-x: auto;
|
||
|
overflow-y: hidden;
|
||
|
width: 100%;
|
||
|
}
|
||
|
|
||
|
.chart-content {
|
||
|
display: inline-block;
|
||
|
min-width: 100%;
|
||
|
}
|
||
|
|
||
|
.chart-wrapper {
|
||
|
text-align: center;
|
||
|
padding: 20px;
|
||
|
}
|
||
|
|
||
|
.scroll-hint {
|
||
|
text-align: center;
|
||
|
color: #666;
|
||
|
font-size: 12px;
|
||
|
margin-bottom: 10px;
|
||
|
display: none;
|
||
|
}
|
||
|
|
||
|
.chart-container::-webkit-scrollbar {
|
||
|
height: 8px;
|
||
|
}
|
||
|
|
||
|
.chart-container::-webkit-scrollbar-track {
|
||
|
background: #f1f1f1;
|
||
|
}
|
||
|
|
||
|
.chart-container::-webkit-scrollbar-thumb {
|
||
|
background: #c1c1c1;
|
||
|
border-radius: 4px;
|
||
|
}
|
||
|
|
||
|
.chart-container::-webkit-scrollbar-thumb:hover {
|
||
|
background: #a1a1a1;
|
||
|
}
|
||
|
</style>
|
||
|
</head>
|
||
|
<body>
|
||
|
<form id="form1" runat="server">
|
||
|
<f:PageManager ID="PageManager1" runat="server" />
|
||
|
<f:Panel ID="Panel1" runat="server" ShowBorder="false" ShowHeader="false"
|
||
|
Layout="Region" Margin="5px">
|
||
|
<Items>
|
||
|
<f:Panel ID="panelCenterRegion" runat="server" RegionPosition="Center"
|
||
|
ShowBorder="false" ShowHeader="false" Layout="Fit">
|
||
|
<Items>
|
||
|
<f:ContentPanel ID="ContentPanel1" runat="server" ShowBorder="false" ShowHeader="false">
|
||
|
<div class="scroll-hint" id="scrollHint" runat="server">← 左右滑动查看图表 →</div>
|
||
|
<div class="chart-container" id="chartContainer" runat="server">
|
||
|
<div class="chart-content">
|
||
|
<div class="chart-wrapper">
|
||
|
<%-- <h2>总人力需求计划</h2> --%>
|
||
|
<uc1:ChartControl ID="Chart1" runat="server"
|
||
|
ChartType="Column"
|
||
|
Title="人力需求计划"
|
||
|
YAxisTitle="人员数量"
|
||
|
XAxisTitle="日期" />
|
||
|
</div>
|
||
|
</div>
|
||
|
</div>
|
||
|
</f:ContentPanel>
|
||
|
</Items>
|
||
|
</f:Panel>
|
||
|
</Items>
|
||
|
</f:Panel>
|
||
|
</form>
|
||
|
<script type="text/javascript"> function checkScroll() {
|
||
|
var container = document.getElementById('<%= chartContainer.ClientID %>');
|
||
|
var hint = document.getElementById('<%= scrollHint.ClientID %>');
|
||
|
|
||
|
if (container && hint) {
|
||
|
// 如果内容宽度大于容器宽度,显示滚动提示
|
||
|
if (container.scrollWidth > container.clientWidth) {
|
||
|
hint.style.display = 'block';
|
||
|
} else {
|
||
|
hint.style.display = 'none';
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
// 页面加载完成后检查是否需要显示滚动提示
|
||
|
window.addEventListener('load', function() {
|
||
|
setTimeout(checkScroll, 100); // 稍微延迟以确保图表已渲染
|
||
|
});
|
||
|
|
||
|
// 窗口大小改变时重新检查
|
||
|
window.addEventListener('resize', checkScroll);
|
||
|
</script>
|
||
|
</body>
|
||
|
</html>
|