Merge remote-tracking branch 'origin/zypms' into zypms

mrzhssss

2022-09-06 8745b76acfd45eadd720d7ce6d87c77e6e0682b9

Merge remote-tracking branch 'origin/zypms' into zypms

 src/main/webapp/static/css/projectSchedule.css

@@ -5,6 +5,7 @@
}
body {
    height: 100%;
    position: absolute;
}
#container {
    padding: 10px 10px;

 src/main/webapp/static/css/style.css

@@ -1,16 +1,18 @@
*{
    margin: 0;
    overflow: hidden;
    /*overflow: hidden;*/
}
html,body{
    height: 100%;
}
/* 画布 */
#root {
    height: 100%;
    /*height: 100%;*/
    min-height:100%;
    width: 100%;
    margin: 0;
    background-color: /* #2C3E50 */ #2e4e7e;
    position: absolute;
    position: relative;
}
#top-tab {
    width: 100%;
@@ -153,7 +155,7 @@
}

#details {
    position: relative;
    position: absolute;
}
#details .head {
    width: 100%;

 src/main/webapp/static/js/projectShow.js

@@ -2,12 +2,12 @@
        var index = $(".row").index(this) // 确定在表格中的第几行
        var rowName = $(this).children(".projects").html() // 当前行中类名为projects的类中的文字
        var project = data[index] // 把data中的第index个项目 赋值给project
        if(project.id==rowName){
        if(project.projectName==rowName){
            // 比较时间
            var currT = new Date() // 当前时间
            var staT = new Date(project.startDay.substring(0,10)) // 项目开始时间
            var endT = new Date(project.endDay.substring(0,10)) // 项目结束时间
            var nodes = project.nodes
            var staT = new Date(project.projectStartTime.substring(0,10)) // 项目开始时间
            var endT = new Date(project.projectEndTime.substring(0,10)) // 项目结束时间
            var nodes = project.projectPlans
            // 判断项目计划节点时间是否有空值
            for(var i=0;i<nodes.length;i++){
                if(nodes[i].staT==''||nodes[i].endTime$==''){
@@ -32,7 +32,7 @@

            var bigDays = []
            for(var i = 0;i<nodes.length;i++){
                var projectsName = nodes[i].name // 节点名称                    改第一个请求用
                var projectsName = nodes[i].flowId$ // 节点名称                    改第一个请求用
                var proRET = new Date(nodes[i].realEndTime$.substring(0,10)) // 节点实际结束时间
                var tab2 ='<tr id="td-node'+i+'-gz">'+'<tr id="td-node'+i+'-gz-2">'+'</tr>'
                tab = tab +tab2
@@ -69,8 +69,8 @@
                            +'<tbody>' // 表身 （项目节点始末）
                                +'<tr class="tab-body">'
                                    +'<td style="height: 50px">'+'项目总时长'+'</td>'
                                    +'<td style="height: 50px">'+project.startDay.substring(0,10)+'</td>'
                                    +'<td style="height: 50px">'+project.endDay.substring(0,10)+'</td>'
                                    +'<td style="height: 50px">'+project.projectStartTime.substring(0,10)+'</td>'
                                    +'<td style="height: 50px">'+project.projectEndTime.substring(0,10)+'</td>'
                                +'</tr>'

            var tabLeft4 = tabLeft + tabLeft3 +'</tbody>'

 src/main/webapp/static/js/projectShow2.js

New file
@@ -0,0 +1,296 @@
$(document).on("dblclick",".row",function(){
        var index = $(".row").index(this) // 确定在表格中的第几行
        var rowName = $(this).children(".projects").html() // 当前行中类名为projects的类中的文字
        var project = data[index] // 把data中的第index个项目 赋值给project
        if(project.id==rowName){
            // 比较时间
            var currT = new Date() // 当前时间
            var staT = new Date(project.startDay.substring(0,10)) // 项目开始时间
            var endT = new Date(project.endDay.substring(0,10)) // 项目结束时间
            var nodes = project.nodes
            // 判断项目计划节点时间是否有空值
            for(var i=0;i<nodes.length;i++){
                if(nodes[i].staT==''||nodes[i].endTime$==''){
                    show = false
                    break
                }else{
                    show = true
                }
            }
            if(show==true){
                $("#details").attr("style","display:block")
            }else if(show==false){
                $("#tips").attr("style","display:block")
            }
            // 项目名称
            $("#details h2").html(project.id)
            // 预计节点时间
            var tab = ''
            var tabLeft3 = ''
            var day = 86400000 // 一天是 86400000毫秒
            var days = (endT - staT + day ) / day // 项目节点天数

            var bigDays = []
            for(var i = 0;i<nodes.length;i++){
                var projectsName = nodes[i].name // 节点名称                    改第一个请求用
                var proRET = new Date(nodes[i].realEndTime$.substring(0,10)) // 节点实际结束时间
                var tab2 ='<tr id="td-node'+i+'-gz">'+'<tr id="td-node'+i+'-gz-2">'+'</tr>'
                tab = tab +tab2
                var tabLeft2 = '<tr class="tab-body">'
                                    +'<td>'+projectsName+'</td>'
                                    +'<td>'+nodes[i].startTime.substring(0,10)+'</td>'
                                    +'<td>'+nodes[i].endTime$.substring(0,10)+'</td>'
                tabLeft3 = tabLeft3 + tabLeft2
                var overtime = endT-proRET
                if(overtime<0){
                    bigDays.push(proRET)
                }
            }
            let max = bigDays[0]
            for(var i = 0;i<bigDays.length;i++){
                max = max <max[i+1] ? max[i+1] : max
            }
            var tab1 =
                '<thead>'
                    +'<tr id="th-gz">' + '</tr>'
                +'</thead>'
                +'<tbody id="tabBody">'
                    +'<tr id="tot">' +'</tr>'
                    +'<tr id="tot-2">'+'</tr>'
            var tab3 = tab1+tab+'</tbody>'
            /* 甘特图左侧 项目内容表 */
            var tabLeft =     '<thead>' // 表头
                                +'<tr class="tab-head">'
                                    +'<th>'+'项目名称'+'</th>'
                                    +'<th>'+'开始时间'+'</th>'
                                    +'<th>'+'结束时间'+'</th>'
                                +'</tr>'
                            +'</thead>'
                            +'<tbody>' // 表身 （项目节点始末）
                                +'<tr class="tab-body">'
                                    +'<td style="height: 50px">'+'项目总时长'+'</td>'
                                    +'<td style="height: 50px">'+project.startDay.substring(0,10)+'</td>'
                                    +'<td style="height: 50px">'+project.endDay.substring(0,10)+'</td>'
                                +'</tr>'

            var tabLeft4 = tabLeft + tabLeft3 +'</tbody>'
            $("#details-tab-left").empty()
            $("#details-tab-left").append(tabLeft4)
            $("#details-tab").empty()
            $("#details-tab").append(tab3);
            // 填充单元格
            var nodeId = ["#tot-2"]
            var nodeId4 = []
            for(let k = 0;k<nodes.length;k++){
                var getId = "#"+"td-node"+k+"-gz"
                var getId2 = "#"+"td-node"+k+"-gz-2"
                nodeId.push(getId)
                nodeId.push(getId2)
            }
            for(let k = 0;k<nodes.length;k++){
                var getId = "#"+"td-node"+k+"-gz"
                var getId2 = "#"+"td-node"+k+"-gz-2"
                nodeId4.push(getId)
                nodeId4.push(getId2)
                k++
            }
			
            if(max>endT){
                 days = (max-staT+day)/day
                endT=max
                getDateArr(staT,endT)
            }else{
                getDateArr(staT,endT);
            }
            let newDataArr = []
            var strr =''
            // 年份
            if(monthDays.length<2){ // 一个月
                var gz=monthDays[0]-staT.getDate()+1 // 当前月份剩余天数
                stt = '<th class="loadBox" colspan="'+gz+'">'+newMonthArr[0]+'</th>' // 有多少天就横跨多少个格子
                $("#th-gz").append(stt)
            }else if (monthDays.length<3){ // 两个月
                var gz=monthDays[0]-staT.getDate()+1// 当前月份剩余天数
                stt = '<th class="loadBox" colspan="'+gz+'">'+newMonthArr[0]+'</th>' // 有多少天就横跨多少个格子
                var gz2 = monthDays[1]-(monthDays[1]-endT.getDate()) // 剩余的天数=当月天数-（当月天数-结束日期）
                stt2 = '<th class="loadBox" colspan="'+gz2+'">'+newMonthArr[1]+'</th>'
                strr =stt +stt2
                $("#th-gz").append(strr)
            }else { // 三个月及以上
                var gz=monthDays[0]-staT.getDate()+1// 当前月份剩余天数
                stt = '<th class="loadBox" colspan="'+gz+'">'+newMonthArr[0]+'</th>' // 有多少天就横跨多少个格子
                var gz2 = monthDays[monthDays.length-1]-(monthDays[monthDays.length-1]-endT.getDate()) // 剩余的天数=当月天数-（当月天数-结束日期）
                stt2 = '<th class="loadBox" colspan="'+gz2+'">'+newMonthArr[newMonthArr.length-1]+'</th>'
                // 去除第一个月 和最后一个月
                monthDays.shift()
                monthDays.pop()
                newMonthArr.shift()
                newMonthArr.pop()
                var std = ''
                for (var j=0;j<monthDays.length;j++){
                    stt3 = '<th class="loadBox" colspan="'+monthDays[j]+'">'+newMonthArr[j]+'</th>'
                    std = std + stt3
                }
                strr = stt + std +stt2
                $("#th-gz").append(strr)
            }
            // 项目时间单元格
            for(let i=0;i<days;i++){
                str = '<th class="loadBox-2">'+dateArr[i]+'</th>'
                $("#tot").append(str);
                // $(".loadBox").attr('style','width:50px')
            }
            // 节点时间单元格
            for (let j=0;j<days;j++){
                tds = '<td class="gz-color'+j+' time-color">'+'</td>'
                for(let k in nodeId){
                    $(nodeId[k]).append(tds)
                }
            }
            var nodeId2 = [],nodeId3 = []
            for(let k = 0;k<nodes.length;k++){
                var getId2 = "#"+"td-node"+k+"-gz"
                var getId3 = "#"+"td-node"+k+"-gz-2"
                nodeId2.push(getId2)
                nodeId3.push(getId3)
            }
            for(var i=0;i<nodeId4.length;i++){
                $(nodeId4[i]).attr("style","background:#eeeeef")
            }
            // for(var j = 0;j < days;j++){
            //     $("#tot").find("td").eq(j+3).attr("style","background:#3597D6")
            // }
            var runDay = Math.ceil((currT - staT)/ day)
            if(runDay>0){
                for(var j = 0;j < runDay;j++){
                    $("#tot-2").find("td").eq(j).attr("style","background:#8bddde")
                }
            }
            for(var i = 0;i<nodes.length;i++){
                var proST = new Date(nodes[i].startTime.substring(0,10)) // 计划开始日期
                var proET = new Date(nodes[i].endTime$.substring(0,10)) // 计划结束日期
                var proET2 = new Date(proET.getTime()-day*2) // 计划结束日期-2天
                var proRST =new Date(nodes[i].realStartTime$.substring(0,10)) // 实际开始日期
                var proRET =new Date(nodes[i].realEndTime$.substring(0,10)) // 实际结束日期
                var nodeDay = (proET-proST+day)/day // 计划工作天数
                var nodeRSDay = (proET-proRST+day)/day // 节点实际工作天数
                        var nodeREDay = (proRET-proST+day)/day // 实际结束减计划开始时间
                var nodeRealDay = (proRET-proRST+day)/day //实际时间段
                var intDay = (proST-staT)/day // 预计开始时间与项目开始时间的间隔
                var intRealDay = (proRST-staT)/day // 实际开始与项目开始时间的间隔
                var intRealEndDay = (proRET-staT)/day // 实际结束与项目开始的间隔
                var nodeRunDay = Math.ceil((currT-proST)/ day)
                var nodeRealRunDay = Math.ceil((currT-proRST)/ day)
                var nodeRun = Math.ceil((currT-proET-day)/ day)
                var notRealStartDay = proRET-(proET-proST) // 推算的实际开始日期
                var intNotRealStartTime = (new Date(notRealStartDay)-staT)/day // 推算的开始日期与项目开始日期的时间段



                // 与当前时间的时间差
                for(var j=0;j<nodeDay;j++){
                    $(nodeId2[i]).find('td').eq(intDay+j).attr("style","background:#5998f5")
                }
                    // 实际开始日期与实际结束日期都填写  按实际时间进渲染
                if(proRST != "Invalid Date" && proRET !="Invalid Date"){
					
                    for(var j=0;j<nodeRealDay;j++){
                        if(proRET<=proET2){ // 实际结束日期<=计划结束日期
                            $(nodeId3[i]).find('td').eq(intRealDay+j).attr("style","background:#00cc88")
                        }else if(proRET>proET2 && proRET<=proET){ // 实际结束日期>计划结束日期
                            $(nodeId3[i]).find('td').eq(intRealDay+j).attr("style","background:#00cc88")
                        }else { // 实际结束日期>计划结束日期+2天
                            $(nodeId3[i]).find('td').eq(intRealDay+j).attr("style","background:#e63939")
                        }
                    }
                    // 实际开始时间已填 实际结束时间未填  (实际结束时间按预计结束时间填)改 当前时间与实际开始时间的间隔
                }else if(proRST != "Invalid Date" && proRET =="Invalid Date"){
                    for(var j=0;j<nodeRealRunDay;j++){
                        if(nodeRun>0){
                            $(nodeId3[i]).find('td').eq(intRealDay+j).attr("style","background:#CC3333")
                        }else if(nodeRun>-3 && nodeRun<=0){
                            $(nodeId3[i]).find('td').eq(intRealDay+j).attr("style","background:#ccc739")
                        }else{
                            $(nodeId3[i]).find('td').eq(intRealDay+j).attr("style","background:#8bddde")
                        }
                    }
                        // 实际开始时间未填 实际结束时间已填  实际开始时间按计划开始时间
                }else if(proRST == "Invalid Date" && proRET !="Invalid Date"){
                    if(proRET<=proST){ // 实际结束日期<=计划开始日期  暂时不填充
                        // for(var j=0;j<nodeDay;j++){ // 天数是节点计划天数
                        //     $(nodeId3[i]).find('td').eq(intNotRealStartTime+j).attr("style","background:#49C7D3") // 实际开始日期是 实际结束日期-计划天数
                        // }
                    }else if(proRET<=proET){ //实际结束日期<=计划结束日期
                        for(var j=0;j<nodeREDay;j++) { // 天数是 实际结束日期-计划开始日期
                            $(nodeId3[i]).find('td').eq(intDay + j).attr("style", "background:#00cc88")// 实际开始日期是 实际结束日期-计划天数
                        }
                    }else{ // 实际结束日期>计划结束日期
                        for(var j=0;j<nodeREDay;j++) { // 天数是 实际结束日期-计划开始日期
                            $(nodeId3[i]).find('td').eq(intDay + j).attr("style", "background:#CC3333")// 实际开始日期是 实际结束日期-计划天数
                        }
                    }
                    // 实际开始时间未填 实际结束时间未填
                }else if(proRST == "Invalid Date" && proRET =="Invalid Date"){

                }
            }
            // 鼠标经过
            $(document).on('mouseover','.time-color',function () {
                // console.log($(this).attr('class'))
                var cls = $(this).attr('class').split(' ')[0]
                var cll = '.'+cls
                $(cll).addClass('over-color')
            })
            // 鼠标离开
            $(document).on('mouseout','.time-color',function () {
                // console.log($(this).attr('class'))
                var cls = $(this).attr('class').split(' ')[0]
                var cll = '.'+cls
                $(cll).removeClass('over-color')
            })
            // 滚轮
			
			
			



            function getDateArr(start,end) {
                    let option = new Date(start) // 开始时间
                    let nowDate = new Date(end) // 结束时间
                    let times = option.getTime() // 获取当前时间戳(毫秒）
                    let ms = (nowDate - option ) / 86400000 // 相差的总天是的毫秒数(天数)
                    let days = Math.ceil(ms) // 向上取整数
                    dateArr = [] // 创建日期数组
                    monthArr = []
                    monthDays=[]
                    let num = 0
                    while (num<=days){
                        let needDate = new Date(times)
                        times += 86400000 // 加一天
                        let dayDAY = needDate.getDate(); // 获取当前时间的日期  1号 2号 3号 4号 等
                        dayDAY = dayDAY<10 ? '0'+dayDAY : dayDAY
                        dateArr.push(dayDAY)
                        let month = needDate.getMonth()+1
                        month = month<10 ? '0'+month : month
                        let year = needDate.getFullYear()
                        yMonth = year+'-'+month
                        monthArr.push(yMonth)	 
                        num++; // 计次用
                    }
                    function unique (monthArr) {
                      return Array.from(new Set(monthArr))
                    }
                    newMonthArr = unique(monthArr)
                    for(var i=0;i<newMonthArr.length;i++){
                        s = newMonthArr[i].split("-")
                        var d = new Date(s[0],s[1],0);
                        a = d.getDate()
                        monthDays.push(a)
                    }
            }
            }
            })




 src/main/webapp/static/js/tableData2.js

@@ -7,6 +7,7 @@
    getThbodyData()
}, 5000)

//表头小进度表
var getType = function () {
    $.ajax({
        url: baseurl + '/pms/projectPlan/dataSummary',
@@ -30,61 +31,124 @@

/****************************************************************************************************************************************************************************/


var proData = ["项目名称", "项目类型", "售前金额核算", "开始时间", "结束时间"]
// 表头
var proData = ["项目名称", "项目类型", "开始时间", "结束时间"]
var getTheaddData = function () {
    $.ajax({
        url: baseurl + '/pms/flowStatus/list/auth',
        type: 'GET',
        data: {
            'is_asrs':0
        },
        success: function (res) {
            console.log(res);
        }
    })
    for (var i = 0; i < proData.length; i++) {
        var str = "<th class='xiangmu'>" + proData[i] + "</th>"
        $("#tab-header").append(str)
    }
    //$.ajax({
    //    url: baseurl + '/pms/flowStatus/list/auth',
    //    type: 'GET',
    //    data: {},
    //    success: function (res) {
    //
    //    }
    //})
    //for (var i = 0; i < proData.length; i++) {
    //    var str = "<th class='xiangmu'>" + proData[i] + "</th>"
    //    $("#tab-header").append(str)
    //}

    // $.ajax({
    //     url:baseurl+'/pms/projectPlan/flowStatus',
    //     type:'GET',
    //     dataType:'JSON',
    //     data:{},
    //     success:function(res){
    //         if(res.code==200){
    //             data=res.data
    //             var headStr = []
    //             for(var i = 0;i<data.length;i++){
    //                 headStr.push(data[i].name)
    //             }
    //             proData = proData.concat(headStr)
    //             // 表头
    //             for(var i = 0;i<proData.length;i++){
    //                 var str = "<th class='xiangmu'>"+proData[i]+"</th>"
    //                 $("#tab-header").append(str)
    //             }
    //         }
    //     },
    //     })
     $.ajax({
         url:baseurl+'/pms/projectPlan/flowStatus',
         type:'GET',
         dataType:'JSON',
         data:{},
         success:function(res){
            console.log(res)
             if(res.code==200){
                 data=res.data
                 var headStr = []
                 for(var i = 0;i<data.length;i++){
                     if (data[i].isAsrs == 0) {
                        headStr.push(data[i].name)
                    }
                 }
                 proData = proData.concat(headStr)
                 // 表头
                 for(var i = 0;i<proData.length;i++){
                     var str = "<th class='xiangmu'>"+proData[i]+"</th>"
                     $("#tab-header").append(str)
                 }
             }
         },
         })
}

/*****************************************************************************************************************************************************************************/
var resMap = [
    {
    endDay:"2023-01-16 00:00:00",
    id:"cs001",
    plandeAmt:10000,
    planinAmt: 50000,
    presaleAmt: 5000000,
    realdeAmt: 9000,
    realinAmt: 40000,
    startDay:"2022-09-15 00:00:00",
    type: "横梁式",
    nodes:[{name: '业务下单', startTime: '2022-09-10', endTime$: '2022-09-15', realStartTime$: '2022-09-10', realEndTime$: '2022-09-15'},
        {name: '预付款', startTime: '2022-09-15', endTime$: '2022-09-26', realStartTime$: '2022-09-15', realEndTime$: '2022-09-26'},
        {name: 'BOM上表', startTime: '2022-09-20', endTime$: '2022-09-30', realStartTime$: '2022-09-20', realEndTime$: '2022-09-30'},
        {name: '物料请购', startTime: '2022-09-30', endTime$: '2022-10-10', realStartTime$: '2022-09-30', realEndTime$: '2022-10-10'},
        {name: '施工计划书', startTime: '2022-10-05', endTime$: '2022-10-18', realStartTime$: '2022-10-05', realEndTime$: '2022-10-18'},
        {name: '生产计划', startTime: '2022-10-18', endTime$: '2022-11-30', realStartTime$: '2022-10-18', realEndTime$: '2022-11-30'},
        {name: '包装设计', startTime: '2022-10-25', endTime$: '2022-10-30', realStartTime$: '2022-10-25', realEndTime$: '2022-10-30'},
        {name: '装车设计', startTime: '2022-10-26', endTime$: '2022-10-30', realStartTime$: '2022-10-26', realEndTime$: '2022-10-30'},
        {name: '发货计划书', startTime: '2022-10-27', endTime$: '2022-10-28', realStartTime$: '2022-10-27', realEndTime$: '2022-10-28'},
        {name: '生产制作', startTime: '2022-11-01', endTime$: '2022-12-05', realStartTime$: '2022-11-01', realEndTime$: '2022-12-05'},
        {name: '发货', startTime: '2022-12-06', endTime$: '2022-12-10', realStartTime$: '2022-12-06', realEndTime$: '2022-12-10'},
        {name: '安装队确认', startTime: '2022-12-15', endTime$: '2022-12-20', realStartTime$: '2022-12-15', realEndTime$: '2022-12-20'},
        {name: '物流公司确认', startTime: '2022-12-20', endTime$: '2022-12-30', realStartTime$: '2022-12-20', realEndTime$: '2022-12-30'},
        {name: '安装', startTime: '2022-12-01', endTime$: '2022-12-15', realStartTime$: '2022-12-01', realEndTime$: '2022-12-15'},
        {name: '完工单签订', startTime: '2022-12-16', endTime$: '2022-12-18', realStartTime$: '2022-12-16', realEndTime$: '2022-12-18'},
        {name: '验收', startTime: '2023-01-06', endTime$: '2023-01-10', realStartTime$: '2023-01-06', realEndTime$: '2023-01-10'},
        {name: '总结报告', startTime: '2023-01-15', endTime$: '2023-01-16', realStartTime$: '2023-01-15', realEndTime$: '2023-01-16'}
    ]
},
    {
        endDay:"2022-09-30 00:00:00",
        id:"cs001",
        plandeAmt:10000,
        planinAmt: 50000,
        presaleAmt: 5000000,
        realdeAmt: 9000,
        realinAmt: 40000,
        startDay:"2022-09-15 00:00:00",
        type: "横梁式",
        nodes:[{name: '业务下单', startTime: '2022-09-10', endTime$: '2022-09-10', realStartTime$: '2022-09-30', realEndTime$: '2022-09-09'},
            {name: '预付款', startTime: '2022-09-26', endTime$: '2022-09-26', realStartTime$: '2022-09-26', realEndTime$: '2022-09-26'},
            {name: 'BOM上表', startTime: '2022-09-24', endTime$: '2022-09-24', realStartTime$: '2022-09-25', realEndTime$: '2022-09-25'},
            {name: '物料请购', startTime: '2022-09-30', endTime$: '2022-09-30', realStartTime$: '2022-09-29', realEndTime$: '2022-09-29'},
            {name: '施工计划书', startTime: '2022-09-26', endTime$: '2022-09-26', realStartTime$: '2022-09-26', realEndTime$: '2022-09-26'},
            {name: '生产计划', startTime: '2022-09-26', endTime$: '2022-09-26', realStartTime$: '2022-09-26', realEndTime$: '2022-09-26'},
            {name: '包装设计', startTime: '2022-09-06', endTime$: '2022-09-06', realStartTime$: '2022-09-06', realEndTime$: '2022-09-06'},
            {name: '装车设计', startTime: '2022-09-26', endTime$: '2022-09-26', realStartTime$: '2022-09-26', realEndTime$: '2022-09-26'},
            {name: '发货计划书', startTime: '2022-09-26', endTime$: '2022-09-26', realStartTime$: '2022-09-26', realEndTime$: '2022-09-26'},
            {name: '生产制作', startTime: '2022-09-26', endTime$: '2022-09-26', realStartTime$: '2022-09-26', realEndTime$: '2022-09-26'},
            {name: '发货', startTime: '2022-09-06', endTime$: '2022-09-06', realStartTime$: '2022-09-06', realEndTime$: '2022-09-06'},
            {name: '安装队确认', startTime: '2022-09-06', endTime$: '2022-09-06', realStartTime$: '2022-09-06', realEndTime$: '2022-09-06'},
            {name: '物流公司确认', startTime: '2022-09-06', endTime$: '2022-09-06', realStartTime$: '2022-09-06', realEndTime$: '2022-09-06'},
            {name: '安装', startTime: '2022-09-06', endTime$: '2022-09-06', realStartTime$: '2022-09-06', realEndTime$: '2022-09-06'},
            {name: '完工单签订', startTime: '2022-09-06', endTime$: '2022-09-06', realStartTime$: '2022-09-06', realEndTime$: '2022-09-06'},
            {name: '验收', startTime: '2022-09-06', endTime$: '2022-09-06', realStartTime$: '2022-09-27', realEndTime$: '2022-09-30'},
            {name: '总结报告', startTime: '2022-09-26', endTime$: '2022-09-26', realStartTime$: '2022-09-26', realEndTime$: '2022-09-26'}
        ]
    },

];
var getThbodyData = function () {
    $.ajax({
        url: baseurl + '/pms/projectPlan/toFront',
        url: baseurl + '/pms/projectPlan/toFront/common',
        type: 'GET',
        dataType: 'JSON',
        data: {},
        success: function (res) {
            if (res.code == 200) {
                // console.log(res)
                 console.log(res)
                data = res.data
                //data = resMap
                // 判断时间是否有null  有null的改为 ""
                for (var i = 0; i < data.length; i++) {
                    var dataNode = data[i].nodes
                    var dataNode = data[i].projectPlans
                    for (var j = 0; j < dataNode.length; j++) {
                        var dataNull = dataNode[j]
                        for (var k in dataNull) {
@@ -93,18 +157,14 @@
                    }
                    data[i].presaleAmt = data[i].presaleAmt === null ? "" : data[i].presaleAmt;
                    data[i].plandeAmt = data[i].plandeAmt === null ? "" : data[i].plandeAmt;
                    ;
                    data[i].planinAmt = data[i].planinAmt === null ? "" : data[i].planinAmt;
                    ;
                    data[i].realdeAmt = data[i].realdeAmt === null ? "" : data[i].realdeAmt;
                    ;
                    data[i].realinAmt = data[i].realinAmt === null ? "" : data[i].realinAmt;
                    ;
                }
                // 表身填充
                $('#tab-body').empty()
                for (var i = 0; i < data.length; i++) {
                    var node = data[i].nodes
                    var node = data[i].projectPlans
                    for (var j = 0; j < node.length; j++) {
                        var dataNull = node[j]
                        for (var k in dataNull) {
@@ -120,13 +180,14 @@
                        str = str + str1
                    }
                    var str2 = '<tr id="row' + i + '" class="row">'
                        + '<th class="projects">' + data[i].id + '</th>'
                        + '<th class="projects">' + data[i].type + '</th>'
                        + '<td class="nor-mal">' + data[i].presaleAmt + '</td>'
                        + '<td class="nor-mal">' + '<p>' + data[i].startDay.substring(0, 10) + '</p>' + '</td>'
                        + '<td class="nor-mal">' + '<p>' + data[i].endDay.substring(0, 10) + '</p>' + '</td>'
                        + '<th class="projects">' + data[i].projectName + '</th>'
                        + '<th class="projects">' + data[i].projectType + '</th>'
                        //+ '<td class="nor-mal">' + data[i].presaleAmt + '</td>'
                        + '<td class="nor-mal">' + '<p>' + data[i].projectStartTime.substring(0, 10) + '</p>' + '</td>'
                        + '<td class="nor-mal">' + '<p>' + data[i].projectEndTime.substring(0, 10) + '</p>' + '</td>'
                    var str9 = '<td class="normal">' + '<p>' + data[i].plandeAmt + '</p>' + '<p>' + data[i].realdeAmt + '</p>' + '</td>'
                        + '<td class="normal">' + '<p>' + data[i].planinAmt + '</p>' + '<p>' + data[i].realinAmt + '</p>' + '</td>'
                    str9 = ''
                    var str3 = str2 + str + str9 + '</tr>'
                    $('#tab-body').append(str3)
                    var deAmt = data[i].plandeAmt - data[i].realdeAmt
@@ -175,21 +236,16 @@
                                var x = oDate1.getTime() - oDate2.getTime()
                                if (x >= 0) {
                                    $("#tab-body").find('tr').eq(t).find("td").eq(k + 3).attr("style", "background:#009966")

                                } else {
                                    $("#tab-body").find('tr').eq(t).find("td").eq(k + 3).attr("style", "background:#CC3333");

                                }
                            }

                            tab(endTime$, realEndTime$,);
                        }

                    }
                }

            }

        }
    })
}

 src/main/webapp/views/index_datashow.html

@@ -16,27 +16,30 @@
    <div id="root">
        <!-- 标题 -->
        <div id="top-tab">
            <h1>项目进度表</h1>
            <h1>常规项目进度表</h1>

            <img src="../static/image/logo-bar.png" alt="logo">
            <div id="showTime">
                
            </div>
        </div>
        <table id="proType" cellspacing="0" cellpadding="0">
            <thead id="type-header"></thead>
        </table>
        <table id="main-tab" cellspacing="0" cellpadding="0">
            <!-- 表头 -->
            <thead id="tab-header">
				
            </thead>
            <!-- 表身体 -->
            <tbody id="tab-body"> </tbody>
            <!-- 注意事项 -->
            <tr><th>注意事项</th></tr>
		   
        </table>
        <div class="table-room" >
            <table id="proType" cellspacing="0" cellpadding="0">
                <thead id="type-header"></thead>
            </table>
            <table id="main-tab" cellspacing="0" cellpadding="0">
                <!-- 表头 -->
                <thead id="tab-header">

                </thead>
                <!-- 表身体 -->
                <tbody id="tab-body"> </tbody>
                <!-- 注意事项 -->
                <tr><th>注意事项</th></tr>

            </table>
        </div>

    </div>
    <div id="details">
        <div class="head">

 src/main/webapp/views/index_datashow2.html

New file
@@ -0,0 +1,68 @@
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>项目进度表</title>
    <link rel="stylesheet" href="../static/css/style.css">
    <script src="../static/js/config.js"></script>
    <script src="../static/js/jquery-3.3.1.min.js"></script>
    <script src="../static/js/clock.js"></script>
<!--    <script src="../static/js/tableData.js"></script>-->
    <script src="../static/js/tableData2.js"></script>
    <script src="../static/js/projectShow2.js"></script>
    <script src="../static/js/cols.js"></script>
</head>
<body>
    <div id="root">
        <!-- 标题 -->
        <div id="top-tab">
            <h1>项目进度表</h1>

            <img src="../static/image/logo-bar.png" alt="logo">
            <div id="showTime">
				
            </div>
        </div>
        <table id="proType" cellspacing="0" cellpadding="0">
            <thead id="type-header"></thead>
        </table>
        <table id="main-tab" cellspacing="0" cellpadding="0">
            <!-- 表头 -->
            <thead id="tab-header">
				
            </thead>
            <!-- 表身体 -->
            <tbody id="tab-body"> </tbody>
            <!-- 注意事项 -->
            <tr><th>注意事项</th></tr>
		   
        </table>
    </div>
    <div id="details">
        <div class="head">
            <h2></h2>
            <button id="close" type="button" style="float: right;">关 闭</button>
        </div>
        <table id="details-tab-left" cellspacing="0" cellpadding="0"></table>
        <table id="details-tab" cellspacing="0" cellpadding="0">
            <thead>
            </thead>
            <tbody>
            </tbody>
        </table>
    </div>
    <div id="tips">
        <h3>提示</h3>
        <div id="text">当前项目计划时间不完整；请补充完成后重试!</div>
        <button id="closee" onclick="">确 认</button>
    </div>
</body>
</html>
<script type="text/javascript">
    $("#close").on("click",function(){
        $("#details").attr("style","display:none")
    })
    $("#closee").on("click",function(){
        $("#tips").attr("style","display:none")
    })
</script>