vue嵌套列循环生成考勤表数据

如图



接口返回数据格式:

```

{

    "total": 1,

    "rows": [

        {

            "name": "钟伟清",

            "employeeID": "25016",

            "paidForDay": 0,

            "workDay": 0,

            "holidayWorkDay": 0,

            "holidayWithPayDay": 0,

            "shouldBeAttendanceDay": 0,

            "errandDay": 0,

            "lateCount": 0,

            "leaveEarlyCount": 0,

            "absenteeismDay": 0,

            "sickLeaveDay": 0,

            "affairLeaveDay": 0,

            "vacationDay": 29,

            "takeWorkOffDay": 0,

            "annualLeaveDay": 0,

            "maternityLeaveDay": 0,

            "funeralLeaveDay": 0,

            "marriageLeave": 0,

            "extraWorkHour": 0,

            "supplementCount": 0,

            "lateChangedCount": 0,

            "daySisuation": [

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休",

                "休休"

            ],

            "goOutDay": 0

        }

    ]

}

```


传值组装transfer数组

// 初始化数据的表头

```

        changeFromat(start,daycount,year,toMonth,end,shortName){

            var empty =[]

            for(var i=start; i<=daycount; i++){

                var current = year + '-' + toMonth + '-' + i;

                var weekday = new Date(current).getDay();

                var text = "";

                switch (weekday) {

                    case 0:

                        text = "日";

                        break;

                    case 1:

                        text = "一";

                        break;

                    case 2:

                        text = "二";

                        break;

                    case 3:

                        text = "三";

                        break;

                    case 4:

                        text = "四";

                        break;

                    case 5:

                        text = "五";

                        break;

                    case 6:

                        text = "六";

                        break;

                }

                var thisDay = String(i)

                var emp = {

                    day:thisDay,

                    week:text

                }

                empty.push(emp)

            }


            for(var i=1; i<=end; i++){

                // i = i > 9 ? i : '0' + i;

                var current = year + '-' + shortName + '-' + i;

                var weekday = new Date(current).getDay();

                var text = "";

                switch (weekday) {

                    case 0:

                        text = "日";

                        break;

                    case 1:

                        text = "一";

                        break;

                    case 2:

                        text = "二";

                        break;

                    case 3:

                        text = "三";

                        break;

                    case 4:

                        text = "四";

                        break;

                    case 5:

                        text = "五";

                        break;

                    case 6:

                        text = "六";

                        break;

                }

                var thisDay = String(i)

                var emp = {

                    day:thisDay,

                    week:text,

                }

                empty.push(emp)

            }

            this.transfer = empty

        },

```


将transfer数组绑定至el-table表单

el-table表单代码

```

                

                

                

                

                

                

                

                

                

                

                

                

                

                

                

                

                

                

                

                

                

                

                    

                        

                                {{scope.row.daySisuation[item.day-1]}}

                        

                    

                

            


```

你可能感兴趣的:(vue嵌套列循环生成考勤表数据)