设备切片/数据驾驶舱调整。修改日期选择方式。修改访问时序图数据拼接key的字段

chenhaozhe

2026-04-20 51fda66400e848b6e3c44929b56022c70b6e10c3

设备切片/数据驾驶舱调整。修改日期选择方式。修改访问时序图数据拼接key的字段

 WebTM/views/Êý²É¹ÜÀí/DAQ_EquipRunningSlice.html

@@ -14,6 +14,7 @@
    <script src="../../layuiadmin/echarts.min.js"></script>
    <script src="../../layuiadmin/dayjs.min.js"></script>
    <link href="../../layuiadmin/layui/css/ReportPlatform.css" rel="stylesheet" />
    <script src="../../layuiadmin/zgqCustom/zgqCustom.js"></script>
    <script src="../../layuiadmin/Scripts/webConfig.js"></script>
    <style>
        /*树状图点击高亮变色*/
@@ -126,7 +127,7 @@
                            </div>
                            <div class="layui-col-xs10 layui-inline" style="border: solid 1.5px #e0d6d64d;">
                                <div class="layui-form-item" style="display: flex; justify-content: space-around;">
                                    <div class="layui-inline">
                                    <!-- <div class="layui-inline">
                                        <label class="layui-form-label">日期范围</label>
                                        <div class="layui-inline" id="ID-laydate-range">
                                            <div class="layui-input-inline">
@@ -145,7 +146,38 @@
                                        <button type="button" class="layui-btn" data-mode="day">单日数据</button>
                                        <button type="button" class="layui-btn layui-btn-primary layui-border"
                                            data-mode="history">历史数据</button>
                                    </div> -->
                                    <div class="layui-inline">
                                        <label class="layui-form-label">日期间隔</label>
                                        <div class="layui-input-block">
                                            <select name="HInitTimeCycle" id="HInitTimeCycle"
                                                    class="ForFilteringSchemes" lay-filter="HInitTimeCycle"
                                                    style="width:190px;">
                                            </select>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">开始日期</label>
                                        <div class="layui-input-block">
                                            <input type="date" class="layui-input ForFilteringSchemes" name="HDate1"
                                                   id="HDate1">
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">结束日期</label>
                                        <div class="layui-input-block">
                                            <input type="date" class="layui-input ForFilteringSchemes" name="HDate2"
                                                   id="HDate2" style="width:190px;">
                                        </div>
                                    </div>                                  
                                    <button class="layui-btn layuiadmin-btn-order" type="button" lay-submit=""
                                            lay-filter="btnSearch" id="btnSearch">
                                        <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                                    </button>
                                    <button class="layui-btn layuiadmin-btn-order" type="button" lay-submit=""
                                            lay-filter="btnReSearch" id="btnReSearch" style="padding:0 5px">
                                        é€€å‡º
                                    </button>
                                </div>
                                <div id="chartContainer" style="height:600px;display:block;overflow-y:auto;">
                                </div>
@@ -295,7 +327,28 @@
        //#endregion

        //#region è§¦å‘事件：包括form.on(){}格式的所有点击事件、选择事件等
        //日期间隔下拉列表监听
        form.on('select(HInitTimeCycle)', function (data) {
            var HInitTimeCycle = $("#HInitTimeCycle").val() * 1;
            //若日期间隔不为 ä»»æ„é—´éš”，则禁用开始日期与结束日期的选择
            if (HInitTimeCycle != -1) {
                $('#HDate1').prop('disabled', true);
                $('#HDate2').prop('disabled', true);
 
                $("#HDate1").val(Format(new Date(new Date() - 1000 * 60 * 60 * 24 * HInitTimeCycle), "yyyy-MM-dd"));
                $("#HDate2").val(Format(new Date(), "yyyy-MM-dd"));
 
                //执行查询方法
                Check();
            } else {
                $('#HDate1').prop('disabled', false);
                $('#HDate2').prop('disabled', false);
            }
        });

        form.on("submit(btnSearch)",  function (data) {
            Check()
        })

        //#endregion

@@ -304,19 +357,45 @@

        //#region åˆå§‹åŒ–界面
        function set_ClearBill() {
            Init_dateRange()
            // Init_dateRange()

            // var mychart11 = echarts.init(document.getElementById('mychart11'));
            // var mychart22 = echarts.init(document.getElementById('mychart22'));
            // var mychart3 = echarts.init(document.getElementById('mychart3'));
            // var mychart4 = echarts.init(document.getElementById('mychart4'));
            // get_Histogram1(mychart11, '');//柱状图1
            // get_LineChart(mychart22, '');//折线
            // get_Statistics(mychart3, '');//饼图
            // get_Histogram4(mychart4, '');//柱状图4
            //初始化日期间隔、开始日期、结束日期
            setSelect_HInitTimeCycle();

            //若日期间隔不为 ä»»æ„é—´éš”，则禁用开始日期与结束日期的选择
            var HInitTimeCycle = $("#HInitTimeCycle").val() * 1;
            if (HInitTimeCycle != -1) {
                $('#HDate1').prop('disabled', true);
                $('#HDate2').prop('disabled', true);
            } else {
                $('#HDate1').prop('disabled', false);
                $('#HDate2').prop('disabled', false);
            }
            $("#HDate1").val(Format(new Date(new Date() - 1000 * 60 * 60 * 24 * HInitTimeCycle), "yyyy-MM-dd"));
            $("#HDate2").val(Format(new Date(), "yyyy-MM-dd"));
 

            //查询
            get_Display_Tree();
        }
        //#endregion

        //#region åˆå§‹æ—¥æœŸé—´éš” ä¸‹æ‹‰åˆ—表
        function setSelect_HInitTimeCycle() {
            var valueList = [0, 1, 2, 3, 4, 5, 6, 29];
            var titleList = ["今天", "近两天", "近三天", "近四天", "近五天", "近六天", "近七天", "近30天"];
 
            var HInitTimeCycle_ArrayList = '<option  value="-1" selected="selected" >任意间隔</option>';
            for (var i = 0; i < valueList.length; i++) {
                HInitTimeCycle_ArrayList += '<option  style="color:blue;" value="' + valueList[i] + '">' + titleList[i] + '</option>';
            }
 
            $("#HInitTimeCycle").empty();
            $("#HInitTimeCycle").append(HInitTimeCycle_ArrayList);
           
 
            $("#HInitTimeCycle").val("0");
            form.render('select');
        }
        //#endregion

@@ -342,8 +421,8 @@

        //查询部门 è®¾å¤‡å¯¹åº”的报表
        function Check() {
            var HBeginDate = $("#ID-laydate-start-date").val()
            var HEndDate = $("#ID-laydate-end-date").val()
            var HBeginDate = $("#HDate1").val()
            var HEndDate = $("#HDate2").val()

            $.ajax({
                url: GetWEBURL() + '/DAQ_EquipRunningSlice/GetHEquipStatusReportList_DAQ',
@@ -458,14 +537,16 @@
            $container.empty();

            var data = pieData
            console.log(pieChart)
 
            var data1 = timelineData

            for (var i = 0; i < data.length; i++) {
                var hmainid = data[i].hmainid;
                var equipName = data[i].设备名称;
                var equipNumber = data[i].设备编码;
                var equipID = data[i].HEquipID
                var dateStr = data[i].所属日期.split('T')[0];

                debugger
                // æ—¶é—´å­—段
                var runTime = data[i].运行时间 || 0;         // è¿è¡Œ
                var stopTime = data[i].停机时间 || 0;         // åœæœº
@@ -479,7 +560,7 @@
                var itemHtml = `
            <div style="width:100%; height:200px; margin-bottom:20px; border:1px solid #eee; padding:15px; border-radius:8px;">
                <div style="display: inline-block; height:20%; display:flex; gap:20px;">
                    <div style="width:40%;">${dateStr} ${equipName}</div>
                    <div style="width:40%;">${dateStr} ${equipNumber}</div>
                    <div style="width:60%; display: flex; justify-content: right; align-items: center; gap: 8px;">
                        <div style="width: 18px; height: 18px; background-color: #73cc3f; display: inline-block"></div>
                        <div style="padding-left: 4px ;display: inline-block">运行(${runTime}H)</div>
@@ -551,7 +632,7 @@
                // ==============================================
                // data的时间和设备id以‘_’进行拼接可得出data1对象的key，简化操作

                var key = dateStr + "_" + hmainid
                var key = dateStr + "_" + equipID

                var timeChart = echarts.init(document.getElementById(`chart_time_${hmainid}_${i}`));
                // ä½ çš„原始数据

 WebTM/views/Êý²É¹ÜÀí/DAQ_EvidenceEquipmentCockpitDetail.html

@@ -298,8 +298,8 @@
            }

            function get_LineChart(mychart22, chartData1) {
                var baseTime = $("HBeginDate").val()
                var endTime = $("HEndDate").val()
                var baseTime = $("#HBeginDate").val()
                var endTime = $("#HEndDate").val()
                var startTime = dayjs(baseTime).valueOf();
                var endTime = dayjs(endTime).valueOf();
                var yAxisData = [$("#HDeptName").val()]