主页修改 添加实时报表 ,

历史报表修改 分页 表头换行 快捷时间等等
This commit is contained in:
dell
2023-03-30 23:48:29 +08:00
parent a9a5d45006
commit aaeba28501
9 changed files with 1169 additions and 182 deletions

View File

@ -0,0 +1,23 @@
using Microsoft.AspNetCore.Mvc;
using System;
using System.Threading.Tasks;
using HT.Cloud.Service.ChartsManage;
using HT.Cloud.Service.ReportManage;
namespace HT.Cloud.Web.Areas.ReportManage.Controllers
{
[Area("ReportManage")]
public class RtReportController : BaseController
{
public RtReportService _rtReportService { get; set; }
[HttpGet]
public async Task<ActionResult> GetRtData()
{
var data = await _rtReportService.GetRtSubsysTagValue();
return Content(data);
}
}
}

View File

@ -15,7 +15,14 @@
表单设计器代码
</title>
<style type="text/css">
.layui-table-cell {
line-height: 20px !important;
vertical-align: middle;
height: auto;
overflow: visible;
text-overflow: inherit;
white-space: normal;
}
</style>
<link rel="stylesheet" href="~/lib/layui/css/layui.css" />
@ -36,7 +43,7 @@
<label class="layui-form-label layui-form-required" style="width: 110px;">
开始时间:
</label>
<div class="layui-input-block" style="width:calc(100% - 110px);margin-left: 110px;">
<div class="layui-input-block" style="width:calc(100% - 150px);margin-left: 110px;">
<input id="dateReStartTime" name="ndateReStartTime" lay-verify="required"
class="layui-input icon-date widget-date " style="line-height: 40px;">
</div>
@ -48,13 +55,42 @@
<label class="layui-form-label layui-form-required" style="width: 110px;">
结束世间:
</label>
<div class="layui-input-block" style="width:calc(100% - 110px);margin-left: 110px;">
<div class="layui-input-block" style="width:calc(100% - 150px);margin-left: 110px;">
<input id="dateReEndTime" name="ndateReEndTime" lay-verify="required" class="layui-input icon-date widget-date "
style="line-height: 40px;">
</div>
</div>
</div>
<div class="layui-col-md3 widget-col-list column2" data-index="2" data-parentindex="0">
<div class="layui-col-md2 widget-col-list column2" data-index="2" data-parentindex="0">
<div id="select_10" class="layui-form-item active" data-id="select_4" data-tag="select"
data-index="0">
<label class="layui-form-label layui-form-required" style="width: 110px;">
快捷节点:
</label>
<div class="layui-input-block layui-form" lay-filter="select_4" style="margin-left: 110px">
<select name="selectquick" lay-filter="quickTime" lay-verify="required" id="selectQuick">
<option value="def" selected="">
快速选择周期
</option>
<option value="thisWeek">
本周
</option>
<option value="lastWeek">
上周
</option>
<option value="thisMonth">
本月
</option>
<option value="lastMonth">
上月
</option>
</select>
</div>
</div>
</div>
<div class="layui-col-md2 widget-col-list column2" data-index="3" data-parentindex="0">
<div id="select_4" class="layui-form-item active" data-id="select_4" data-tag="select"
data-index="0">
<label class="layui-form-label layui-form-required" style="width: 110px;">
@ -81,7 +117,7 @@
</div>
</div>
</div>
<div class="layui-col-md2 widget-col-list column3" data-index="3" data-parentindex="0">
<div class="layui-col-md1 widget-col-list column3" data-index="4" data-parentindex="0">
<div id="bottom_5" class="layui-form-item active" data-id="bottom_5" data-tag="bottom"
data-index="0">
<div class="layui-input-block" style="margin-left: 0px;">
@ -94,7 +130,7 @@
</div>
</div>
<div class="layui-col-md1 widget-col-list column4" data-index="4" data-parentindex="0">
<div class="layui-col-md1 widget-col-list column4" data-index="5" data-parentindex="0">
<div id="btn_download" class="layui-form-item active" data-id="bottom_6" data-tag="bottom"
data-index="0">
@ -118,13 +154,13 @@
</div>
@*</form>*@
</div>
<script type="text/javascript" src="~/lib/layui/layui.js">
</script>
@*<script type="text/javascript" src="~/lib/layui/layui.js">
</script>*@
<script type="text/javascript" src="~/js/Sortable/Sortable.js">
</script>
<script type="text/javascript" src="~/js/lay-module/iceEditor/iceEditor.js">
@* <script type="text/javascript" src="~/js/lay-module/iceEditor/iceEditor.js">
</script>
<script type="text/javascript" src="~/js/config.js?v=100">
<script type="text/javascript" src="~/js/config.js?v=100">*@
</script>
<script type="text/javascript" src="~/lib/xlsx/dist/xlsx.full.min.js">
</script>
@ -151,8 +187,229 @@
iconPicker = layui.iconPicker,
cron = layui.cron,
labelGeneration = layui.labelGeneration;
debugger;
form.on('select(quickTime)', function (data) {
var selectValue = data.value;
function getFormatDate(date) {
let year = date.getFullYear();
let month = date.getMonth() + 1;
let day = date.getDate();
let hour = date.getHours();
let minutes = date.getMinutes();
let seconds = date.getSeconds();
month = (month < 10) ? '0' + month : month;
day = (day < 10) ? '0' + day : day;
hour = (hour < 10) ? '0' + hour : hour;
minutes = (minutes < 10) ? '0' + minutes : minutes;
seconds = (seconds < 10) ? '0' + seconds : seconds;
let currentDate = year + "-" + month + "-" + day
+ " " + hour + ":" + minutes + ":" + seconds;
return currentDate;
}
/**
* 本周开始时间戳
* returns {number}
*/
function weekStartTimestamp() {
// 一天的秒数
const MillisecondsADay = 24 * 60 * 60
// 今日零点时间戳
const timestamp = Math.floor(new Date(new Date().setHours(0, 0, 0, 0)).getTime() / 1000)
const weekDay = new Date().getDay() === 0 ? (7 - 1) : (new Date().getDay() - 1)
const weekTimeStamp = timestamp - MillisecondsADay * weekDay
return weekTimeStamp
}
/**
* 上周开始、结束时间戳
* returns {number[上周开始时间戳, 上周结束时间戳]}
*/
function lastWeekTimetamp() {
// 一天的秒数
const MillisecondsADay = 24 * 60 * 60
// 今日零点时间戳
const timestamp = Math.floor(new Date(new Date().setHours(0, 0, 0, 0)).getTime() / 1000)
const weekDay = new Date().getDay() === 0 ? (7 - 1) : (new Date().getDay() - 1)
// 本周开始时间戳
const weekTimeStamp = timestamp - MillisecondsADay * weekDay
// 上周开始时间戳
const lastWeekStart = weekTimeStamp - MillisecondsADay * 7
// 上周结束时间戳
const lastWeekEnd = weekTimeStamp - 1
return [lastWeekStart, lastWeekEnd]
}
/**
* 当月开始时间戳
* returns {number}
*/
function monthStartTimestamp() {
const date = new Date()
date.setDate(1)
date.setHours(0, 0, 0, 0)
const timeStamp = date.getTime() / 1000
return timeStamp
}
/**
* 获取上月开始、结束时间戳
* returns {number[上月开始时间戳,上月结束时间戳]}
*/
function lastMonthTimetamp() {
// 一天的秒数
const MillisecondsADay = 24 * 60 * 60
const date = new Date()
date.setDate(1)
date.setHours(0, 0, 0, 0)
// 当月开始时间戳
const timeStamp = date.getTime() / 1000
// 上个月的天数
const days = lastMonthDats()
// 上月开始时间戳
const lastMonthStart = timeStamp - (MillisecondsADay * days)
// 上月结束时间戳
const lastMonthEnd = timeStamp - 1
return [lastMonthStart, lastMonthEnd]
}
/**
* 上月天数
* returns {number}
*/
function lastMonthDats() {
const date = new Date()
const year = date.getFullYear()
// 上个月月份
let month = (date.getMonth() + 1) - 1 // 0-11 表示 1月-12月
// 0 表示12月
month = month || 12
// 30天的月份
const arr30 = [4, 6, 9, 11]
// 31天的月份
const arr31 = [1, 3, 5, 7, 8, 10, 12]
if (arr30.indexOf(month) !== -1) {
// 上个月是 30 天
return 30
} else if (arr31.indexOf(month) !== -1) {
// 上个月是 31 天
return 31
} else {
// 2月
if (isRunYear(year)) {
return 29
} else {
return 28
}
}
}
/**
* 是否为闰年
* param year
* returns {boolean}
*/
function isRunYear(year) {
// 条件:能被4整除并且不能被100整除或者被400整除的
let flag = false
if (year % 4 === 0 && year % 100 !== 0 || year % 400 === 0) {
flag = true
}
return flag
}
var laydate = layui.laydate;
if (selectValue == "thisWeek"){
var weekStartDate = weekStartTimestamp();
var timef1 = getFormatDate(new Date(weekStartDate*1000));
lay('#dateReStartTime').each(function () {
laydate.render({
elem: this,
trigger: 'click',
format: "yyyy-MM-dd HH:mm:ss",
//value: "2023-02-23 13:56:25",
value: timef1,
});
});
var timef2 = getFormatDate(new Date(Date.now()));
lay('#dateReEndTime').each(function () {
laydate.render({
elem: this,
trigger: 'click',
format: "yyyy-MM-dd HH:mm:ss",
//value: "2023-02-23 13:56:25",
value: timef2,
});
});
}else if(selectValue == "lastWeek"){
var lastWeekDate = lastWeekTimetamp();
var timef1 = getFormatDate(new Date(lastWeekDate[0] * 1000));
lay('#dateReStartTime').each(function () {
laydate.render({
elem: this,
trigger: 'click',
format: "yyyy-MM-dd HH:mm:ss",
//value: "2023-02-23 13:56:25",
value: timef1,
});
});
var timef2 = getFormatDate(new Date(lastWeekDate[1] * 1000));
lay('#dateReEndTime').each(function () {
laydate.render({
elem: this,
trigger: 'click',
format: "yyyy-MM-dd HH:mm:ss",
//value: "2023-02-23 13:56:25",
value: timef2,
});
});
}else if(selectValue == "thisMonth"){
var monthStartDate = monthStartTimestamp();
var timef = getFormatDate(new Date(monthStartDate * 1000));
lay('#dateReStartTime').each(function () {
laydate.render({
elem: this,
trigger: 'click',
format: "yyyy-MM-dd HH:mm:ss",
//value: "2023-02-23 13:56:25",
value: timef,
});
});
var timef2 = getFormatDate(new Date(Date.now()));
lay('#dateReEndTime').each(function () {
laydate.render({
elem: this,
trigger: 'click',
format: "yyyy-MM-dd HH:mm:ss",
//value: "2023-02-23 13:56:25",
value: timef2,
});
});
}else if(selectValue == "lastMonth"){
//lastMonthTimetamp()
var lastMonthDate = lastMonthTimetamp();
var timef1 = getFormatDate(new Date(lastMonthDate[0] * 1000));
lay('#dateReStartTime').each(function () {
laydate.render({
elem: this,
trigger: 'click',
format: "yyyy-MM-dd HH:mm:ss",
//value: "2023-02-23 13:56:25",
value: timef1,
});
});
var timef2 = getFormatDate(new Date(lastMonthDate[1] * 1000));
lay('#dateReEndTime').each(function () {
laydate.render({
elem: this,
trigger: 'click',
format: "yyyy-MM-dd HH:mm:ss",
//value: "2023-02-23 13:56:25",
value: timef2,
});
});
}else {}
});
});
wcLoading.close();
//debugger;
@ -161,6 +418,22 @@
var endtime = new Date();
endtime.setDate(endtime.getDate())
var endtimeString = endtime.getFullYear() + "-" + parseInt(endtime.getMonth() + 1) + "-" + endtime.getDate() + " " + (endtime.getHours()) + ":" + endtime.getMinutes() + ":" + endtime.getSeconds();
function getFormatDateone(date) {
let year = date.getFullYear();
let month = date.getMonth() + 1;
let day = date.getDate();
let hour = date.getHours();
let minutes = date.getMinutes();
let seconds = date.getSeconds();
month = (month < 10) ? '0' + month : month;
day = (day < 10) ? '0' + day : day;
hour = (hour < 10) ? '0' + hour : hour;
minutes = (minutes < 10) ? '0' + minutes : minutes;
seconds = (seconds < 10) ? '0' + seconds : seconds;
let currentDate = year + "-" + month + "-" + day
+ " " + hour + ":" + minutes + ":" + seconds;
return currentDate;
}
layui.use('laydate', function () {
var laydate = layui.laydate;
lay('#dateReStartTime').each(function () {
@ -169,7 +442,7 @@
trigger: 'click',
format: "yyyy-MM-dd HH:mm:ss",
//value: "2023-02-23 13:56:25",
value:starttimeString,
value: getFormatDateone(starttime),
});
});
lay('#dateReEndTime').each(function () {
@ -178,11 +451,14 @@
trigger: 'click',
format: "yyyy-MM-dd HH:mm:ss",
//value: "2023-02-23 13:56:25",
value: endtimeString,
value: getFormatDateone(endtime),
});
});
});
//layui.form.on('select(quickTime)',function(data1){
// var selectQuick = data1.value;
// debugger;
//});
var starttime = new Date(new Date().setHours(0, 0, 0, 0));
var starttimeString = starttime.getFullYear() + "-" + parseInt(starttime.getMonth() + 1) + "-" + starttime.getDate() + " " + (starttime.getHours()) + ":" + starttime.getMinutes() + ":" + starttime.getSeconds();
var endtime = new Date();
@ -190,6 +466,8 @@
var endtimeString = endtime.getFullYear() + "-" + parseInt(endtime.getMonth() + 1) + "-" + endtime.getDate() + " " + (endtime.getHours()) + ":" + endtime.getMinutes() + ":" + endtime.getSeconds();
debugger;
//
function getFormatDate(date) {
let year = date.getFullYear();
@ -368,7 +646,7 @@
// csv 数据转换为 table
csv2table(csv, showTab = false) {
var html = "<table lay-filter=\"tdemo\" border=\"1\">";// class=\"layui-table\" lay-data=\"{报表数据}\"
var html = "<table lay-filter=\"tdemo\" border=\"1\" >";// class=\"layui-table\" lay-data=\"{报表数据}\"
var rows = csv.split("\n");
debugger;
rows.pop(); // 最后一行没用的
@ -415,7 +693,7 @@
if(did == 0){
html += "<th lay-data=\"{ field: 'a" + did + "', width:200 ,fixed:\'left\'} \">" + dhead + "</th>";//
}else{
html += "<th lay-data=\"{ field: 'a" + did + "', width:150} \">" + dhead + "</th>";//
html += "<th lay-data=\"{ field: 'a" + did + "', width:80} \">" + dhead + "</th>";//
}
});
@ -509,13 +787,28 @@
//转换静态表格
table.init('tdemo', {
page:true,
limit:17,
limit:15,
//height: 315 //设置高度
//limit: 10 //注意:请务必确保 limit 参数默认10是与你服务端限定的数据条数一致
//支持所有基础参数
done:function(res,curr,count){
// console.log(res)
//var donestyle = "<style>.layui - table - cell { height: auto;overflow: visible;text - overflow: inherit;white - space: normal;word -break: break-all;}.layui - table - cell a {text- decoration: underline;}.layui - table - cell div {white - space: nowrap;overflow: hidden;text - overflow: ellipsis;min - height: 30px;line - height: 30px;}</style>"
//var oDiv = document.querySelector("#tdemo");
//oDiv.style.cssText = donestyle;
//layui-table-cell laytable-cell-group
//layui-table-cell laytable-cell-1-1-0
//$(".layui-table-cell"). [800].style
//解决表头宽度不够自动换行问题
$(".layui-table-cell").each(function(index,val){
$(".layui-table-cell")[index].style.lineHeight = "20px !importanr";
$(".layui-table-cell")[index].style.verticalAlign = "middle";
$(".layui-table-cell")[index].style.height = "auto";
$(".layui-table-cell")[index].style.overflow = "visible";
$(".layui-table-cell")[index].style.textOverflow = "inherit";
$(".layui-table-cell")[index].style.whiteSpace = "normal";
});
//解决操作栏因为内容过多换行问题
$(".layui-table-main tr").each(function (index, val) {
$($(".layui-table-fixed-l .layui-table-body tbody tr")[index]).height($(val).height());
@ -542,6 +835,8 @@
$($(this).find(".layui-table-body tbody th")[index]).height($(val).height());
});
});
$('.layui-laypage-limits').hide();
}
});
}
@ -580,9 +875,114 @@
}
/**
* 本周开始时间戳
* returns {number}
*/
function weekStartTimestamp() {
// 一天的秒数
const MillisecondsADay = 24 * 60 * 60
// 今日零点时间戳
const timestamp = Math.floor(new Date(new Date().setHours(0, 0, 0, 0)).getTime() / 1000)
const weekDay = new Date().getDay() === 0 ? (7 - 1) : (new Date().getDay() - 1)
const weekTimeStamp = timestamp - MillisecondsADay * weekDay
return weekTimeStamp
}
/**
* 上周开始、结束时间戳
* returns {number[上周开始时间戳, 上周结束时间戳]}
*/
function lastWeekTimetamp() {
// 一天的秒数
const MillisecondsADay = 24 * 60 * 60
// 今日零点时间戳
const timestamp = Math.floor(new Date(new Date().setHours(0, 0, 0, 0)).getTime() / 1000)
const weekDay = new Date().getDay() === 0 ? (7 - 1) : (new Date().getDay() - 1)
// 本周开始时间戳
const weekTimeStamp = timestamp - MillisecondsADay * weekDay
// 上周开始时间戳
const lastWeekStart = weekTimeStamp - MillisecondsADay * 7
// 上周结束时间戳
const lastWeekEnd = weekTimeStamp - 1
return [lastWeekStart, lastWeekEnd]
}
/**
* 当月开始时间戳
* returns {number}
*/
function monthStartTimestamp() {
const date = new Date()
date.setDate(1)
date.setHours(0, 0, 0, 0)
const timeStamp = date.getTime() / 1000
return timeStamp
}
/**
* 获取上月开始、结束时间戳
* returns {number[上月开始时间戳,上月结束时间戳]}
*/
function lastMonthTimetamp() {
// 一天的秒数
const MillisecondsADay = 24 * 60 * 60
const date = new Date()
date.setDate(1)
date.setHours(0, 0, 0, 0)
// 当月开始时间戳
const timeStamp = date.getTime() / 1000
// 上个月的天数
const days = lastMonthDats()
// 上月开始时间戳
const lastMonthStart = timeStamp - (MillisecondsADay * days)
// 上月结束时间戳
const lastMonthEnd = timeStamp - 1
return [lastMonthStart, lastMonthEnd]
}
/**
* 上月天数
* returns {number}
*/
function lastMonthDats() {
const date = new Date()
const year = date.getFullYear()
// 上个月月份
let month = (date.getMonth() + 1) - 1 // 0-11 表示 1月-12月
// 0 表示12月
month = month || 12
// 30天的月份
const arr30 = [4, 6, 9, 11]
// 31天的月份
const arr31 = [1, 3, 5, 7, 8, 10, 12]
if (arr30.indexOf(month) !== -1) {
// 上个月是 30 天
return 30
} else if (arr31.indexOf(month) !== -1) {
// 上个月是 31 天
return 31
} else {
// 2月
if (isRunYear(year)) {
return 29
} else {
return 28
}
}
}
/**
* 是否为闰年
* param year
* returns {boolean}
*/
function isRunYear(year) {
// 条件:能被4整除并且不能被100整除或者被400整除的
let flag = false
if (year % 4 === 0 && year % 100 !== 0 || year % 400 === 0) {
flag = true
}
return flag
}
</script>
</body>