manHourHousekeeper/fhKeeper/formulahousekeeper/timesheet/src/views/workReport/daily.vue

<template>
    <section>
        <!--工具条-->
        <!-- <el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
            <el-form :inline="true">
                <el-form-item>
                    <el-date-picker v-model="date" :editable="false" format="yyyy-MM" value-format="yyyy-MM" @change="changeMonthOut" :clearable="false" type="month" placeholder="选择月份"></el-date-picker>
                </el-form-item>
            </el-form>
        </el-col> -->

        <!--列表-->
        <div>
            <el-card class="box-card daily" shadow="never" >
                <div slot="header" class="clearfix">
                    <el-date-picker size="small" v-model="date" :editable="false" format="yyyy-MM" value-format="yyyy-MM" @change="changeMonthOut" :clearable="false" type="month" placeholder="选择月份"></el-date-picker>
                    <span >
                    <span>日期：</span>
                    <span v-for="(item,index) in allDate" :id="'day'+index" :class="index==choseDay?'chooseDate date_item':'date_item'" 
                    @click="choseDate(index, item)" :key="index">{{item}}</span>
                    </span>
                </div>
                <div style="display:flex;">
                <div v-if="user.role > 0">
                    <div>
                        <el-select v-model="selectState" size="small" @change="stateChange">
                        <el-option value="-1" label="全部状态" >全部状态</el-option>
                        <el-option value="-2" label="未填报">未填报</el-option>
                        <el-option value="1" label="已通过">已通过</el-option>
                        <el-option value="0" label="待审核">待审核</el-option>
                        <el-option value="2" label="不通过">不通过</el-option>
                        <el-option value="3" label="已撤回">已撤回</el-option>
                        </el-select></div>
                    <div>
                        <el-tree :data="data"  @node-click="handleNodeClick" >
                            <span class="custom-tree-node" slot-scope="{ node, data}">
                            <span>{{ node.label }}</span>
                            <span v-if="data.membCount != null && data.isUser == null">({{data.membCount}})</span>
                            <div style="width:0%;float:right;">
                            <span v-if="data.isUser == 1 && data.state == null" style="color:red;">
                            未填报
                            </span>
                            <span v-if="data.isUser == 1 && data.state == 0" style="color:orange;">
                            待审核
                            </span>
                            <span v-if="data.isUser == 1 && data.state == 1" style="color:green;">
                            已通过
                            </span>
                            <span v-if="data.isUser == 1 && data.state == 2" style="color:red;">
                            未通过
                            </span>
                            <span v-if="data.isUser == 1 && data.state == 3" style="color:red;">
                            已撤回
                            </span>
                            </div>
                        </span>
                        </el-tree>
                    </div>
                </div>
                
                <div :style="'height:'+tableHeight+'px;width:0.5px;background:#eee;margin-right:10px;margin-left:10px;'" ></div>
                <div class="allDaily" style="float:left;flex-grow:1">
                    <!--系统管理员 -->
                    <div class="report_title" v-if="user.role > 0">
                        <span>工作日报 | {{depData.label}}</span> - 已填写<span style="margin-left:5px;margin-right:5px;color:green;">{{reportList.length}}</span>人，
                    未填写<span style="margin-left:5px;margin-right:5px;color:red;">{{(depData == null?data[0].membCount:(depData.isUser == 1?1:depData.membCount))-reportList.length}}</span>人
                        <span style="float:right;">
                            <el-link type="primary" style="margin-right:10px;" :underline="false" @click="fillInReport(-1)">填写日报</el-link>
                            <el-link type="primary" style="margin-right:10px;" :underline="false" @click="exportReport">导出日报</el-link>
                            <el-link type="primary" style="margin-right:10px;" :underline="false" @click="batchApprove">批量审核</el-link>
                        </span>
                    </div>
                    <!--普通员工，含项目经理 -->
                    <div class="report_title" v-if="user.role==0"><span>日报列表</span>
                    <span style="float:right;" v-if="user.role==0">
                            <el-link type="primary" style="margin-right:10px;" :underline="false" @click="fillInReport(-1)">填写日报</el-link>
                            <el-link type="primary" v-if="user.leader" style="margin-right:10px;" :underline="false" @click="batchApprove">批量审核</el-link>
                    </span>
                    </div>
                    <div :style="'height:'+(tableHeight-50)+'px;overflow:scroll;padding-top:10px;'">
                        <div class="one_daily" v-for="(item1,index1) in reportList" :key="index1">
                            <i class="fa fa-circle"></i>{{item1.name}}
                            <span style="margin-left:30px;">
                                <span style="margin-right:20px;">
                                    <!-- <i v-if="parseFloat(item1.reportTime)>parseFloat(item1.calculateTime)+0.5" style="color:red;margin-right:8px;" class="fa fa-exclamation-triangle"></i> -->
                                    工作总时长：
                                    <!-- <span :style="parseFloat(item1.reportTime)>parseFloat(item1.calculateTime)+0.5?'color:red':''">{{item1.reportTime}}h</span> -->
                                    <span >{{item1.reportTime}}</span>h
                                    <span style="margin-left:10px;">成本：</span>
                                    <span >{{item1.cost}}</span>元
                                </span>
                            </span>
                            <div class="checkbtn">
                                <el-button v-if="(user.role != 0 || user.id == item1.data[0].inchargerId) && item1.state == 0" type="primary" :loading="logining" size="small" @click="approve(item1.id, item1)">通过</el-button>
                                <el-button v-if="(user.role != 0 || user.id == item1.data[0].inchargerId) && item1.state == 0" type="danger" :loading="logining" size="small" @click="deny(item1.id,0, item1)">驳回</el-button>
                                <!--自己可以撤回待审核状态的报告 -->
                                <el-button v-if="(user.id == item1.id) && item1.state == 0" type="normal" :loading="logining" size="small" @click="cancel(item1)">撤回</el-button>
                                <el-button v-if="(user.role != 0 || user.id == item1.data[0].inchargerId) && item1.state == 1" type="normal" :loading="logining" size="small" @click="deny(item1.id,1, item1)">撤销</el-button>
                                <el-button v-if="item1.state >= 2 && user.id == item1.id" type="primary" size="small" @click="fillInReport(index1)">编辑日报</el-button>
                            </div>
                            <div class="one_daily_body">
                                <el-timeline>
                                    <el-timeline-item v-for="(item2,index2) in item1.data" :key="index2">
                                        <el-card shadow="never">
                                            <p>项目：<b>{{item2.project}}</b><span v-if="item2.subProjectName != null"> / {{item2.subProjectName}}</span>
                                            <span style="margin-left:15px;color:#DAA520;" v-if="item2.state == 0">[ 待审核 ]</span>
                                            <span style="margin-left:15px;color:#32CD32;" v-else-if="item2.state == 1">[ 已通过 ]</span>
                                            <span style="margin-left:15px;color:#FF0000;" v-else-if="item2.state == 2">[ 已驳回 ]</span>
                                            <span style="margin-left:15px;color:#FF0000;" v-else-if="item2.state == 3">[ 已撤回 ]</span>
                                            </p>
                                            <p>时长：
                                                <span v-if="item2.reportTimeType == 0" style="margin-right:10px;">{{typeList[item2.timeType]}}</span>
                                                <span v-if="item2.reportTimeType == 2" style="margin-right:10px;">{{item2.startTime+'-'+item2.endTime}}</span>
                                            {{item2.time.toFixed(1)}}h  
                                            </p>
                                            <p>事项：<span v-html="item2.content"></span></p>
                                        </el-card>
                                    </el-timeline-item>
                                </el-timeline>
                            </div>
                        </div>
                        <!-- 简陋的无报告提示 -->
                        <div v-if="reportList.length==0" style="width:100%;font-size:17px;text-align:center;color:#aaa;">{{curDate}}暂无报告</div>
                    </div>
                </div>
                </div>
            </el-card>
        </div>

        <!-- 填写日报的dialog -->
        <el-dialog title="填写日报" :visible.sync="dialogVisible" width="60%">
            <el-form ref="workForm" :model="workForm" :rules="workRules" label-width="100px">
                <el-form-item label="工作日期" prop="createDate">
                    <el-date-picker v-model="workForm.createDate" :editable="false" format="yyyy-MM-dd" value-format="yyyy-MM-dd" 
                    @change="changeMonth()" :clearable="false" type="date" placeholder="选择工作日期" :disabled="isDisable"></el-date-picker>
                </el-form-item>
                <!-- <el-form-item label="待分配时长" prop="name">
                    <span>{{report.time}}h</span>
                    <el-link type="primary" :underline="false" @click="addDomain" style="margin-left:40px">添加项目</el-link>
                </el-form-item> -->
                
                <div v-for="(domain, index) in workForm.domains" :key="domain.id">
                    <el-form-item label="工作时长" :prop="'domains.' + index + '.timeType'"
                        :rules="{ required: true, message: '请选择工作时长', trigger: 'blur' }">
                        <!-- <el-input v-model.number="domain.workingTime" placeholder="请输入投入时长" type='number' clearable style="width:200px;"
                         :disabled="workForm.domains.length==0?true:(workForm.domains[0].state==2?false:true)"></el-input> -->
                        <!-- 全天/上下午 -->
                        <el-select v-model="domain.timeType" 
                        v-if="reportTimeType.type == 0"
                        placeholder="请选择工作时长" 
                        :disabled="workForm.domains.length==0?true:(workForm.domains[index].state>=2?false:true)"
                        @change="onTimeTypeChange(domain.timeType)">
                        <el-option
                            v-for="item in timeType"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                            </el-option>
                        </el-select>
                        <!-- 数字时长选择 -->
                        <el-select v-model="domain.workingTime" 
                        v-if="reportTimeType.type == 1"
                        :disabled="workForm.domains.length==0?true:(workForm.domains[index].state>=2?false:true)"
                        placeholder="请选择工作时长" >
                        <el-option v-for="item in timeRange" :key="item" :value="item.toFixed(1)">{{item.toFixed(1)}}</el-option>
                        </el-select>
                        <span v-if="reportTimeType.type == 1">小时</span>
                        <span v-if="reportTimeType.type == 2">
                        <!--时间范围选择 -->
                        <el-time-select 
                        :disabled="workForm.domains.length==0?true:(workForm.domains[index].state>=2?false:true)"
                            placeholder="起始时间"
                            style="width:120px;"
                            v-model="domain.startTime"
                            :picker-options="{
                            start: '08:00',
                            step: '00:30',
                            end: '23:30'
                            }">
                        </el-time-select> - <el-time-select 
                        :disabled="workForm.domains.length==0?true:(workForm.domains[index].state>=2?false:true)"
                            placeholder="结束时间"
                            style="width:120px;"
                            v-model="domain.endTime"
                            :picker-options="{
                            start: '08:00',
                            step: '00:30',
                            end: '23:30',
                            minTime: domain.startTime
                            }">
                        </el-time-select>
                        </span>
                    </el-form-item>
                    <el-form-item label="投入项目" :prop="'domains.' + index + '.projectId'"
                        :rules="{ required: true, message: '请选择投入项目', trigger: ['change','blur'] }">
                        <el-select v-model="domain.projectId" placeholder="请选择" style="width:200px;" clearable="true" @change="selectProject(domain, index)"
                        :disabled="workForm.domains.length==0?true:(workForm.domains[index].state>=2?false:true)">
                            <el-option v-for="item in projectList" :key="item.id" :label="item.projectName" :value="item.id"></el-option>
                        </el-select>
                        <!--子项目 -->
                        <el-select v-model="domain.subProjectId" placeholder="请选择" style="width:200px;" clearable="true" v-if="domain.subProjectList != null && domain.subProjectList.length> 0"
                        :disabled="workForm.domains.length==0?true:(workForm.domains[index].state>=2?false:true)">
                            <el-option v-for="item in domain.subProjectList" :key="item.id" :label="item.name" :value="item.id"></el-option>
                        </el-select>
                        
                        <el-link v-if="index >= 1" type="primary" :underline="false" @click="delDomain(index)" style="float:right;margin-right:10px;"
                            :disabled="workForm.domains.length==0?true:(workForm.domains[index].state>=2?false:true)">
                            <i class="fa fa-trash" style="color: red;;font-size:18px;"></i>
                        </el-link>
                    </el-form-item>
                    <el-form-item label="工作事项" :prop="'domains.' + index + '.content'" >
                        <el-input v-model="domain.content" type="textarea" :rows="4" placeholder="请填写工作事项" clearable
                         :disabled="workForm.domains.length==0?true:(workForm.domains[index].state>=2?false:true)"></el-input>
                    </el-form-item>
                    <el-divider v-if="workForm.domains.length>1"></el-divider>
                </div>
                <el-link v-if="showAddMore" type="primary" :underline="false" @click="addDomain" style="margin-left:40px">添加更多</el-link>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="deleteReport" v-if="workForm.domains[0].id != null">删除</el-button>
                <el-button @click="dialogVisible = false">取消</el-button>
                <el-button type="primary" @click="submitDepartment"
                :disabled="workForm.domains.length==0?true:(canEdit?false:true)" >提交</el-button>
            </span>
        </el-dialog>

        <!-- 批量日报审核 -->
        <el-dialog title="批量日报审核" :visible.sync="approveDialogVisible" width="500px">
            <el-checkbox v-model="isAllSelect" label="全选" style="margin-left:24px;" @change="selectAll" v-if="reportNames.length > 0"></el-checkbox>
            <el-tree ref="approveTree" node-key="id" :data="reportNames" show-checkbox="true" @check-change="handleCheckChange" >
            </el-tree>
            <span slot="footer" class="dialog-footer">
                <el-button @click="approveDialogVisible = false">取消</el-button>
                <el-button type="primary" @click="submitBatchApprove" :disabled="batchShowData.length == 0">审核通过</el-button>
            </span>
        </el-dialog>

    </section>
</template>

<script>
    import util from "../../common/js/util";

    export default {
        data() {
            return {
                subProjectList:[],
                canEdit: true,
                timeRange:[0.5,1.0,1.5,2.0,2.5,3.0,3.5,4.0,4.5,5.0,5.5,6.0,6.5,7.0,7.5,8.0,8.5,9.0,9.5,10.0,10.5,11.0,11.5,12.5,13.0,13.5,14.0,14.5,15.0],
                selectTime:null,
                reportTimeType:{},
                curDate:'',
                isAllSelect: false,
                approveDialogVisible:false,
                deptId:null,
                targetUid: null,
                membCount:0,
                selectState:"-1",
                user: JSON.parse(sessionStorage.getItem("user")),
                showAddMore:false,
                allDate: [],
                typeList:['全天','上午','下午'],
                date: sessionStorage.msg?sessionStorage.msg.split('-')[0]+"-"+sessionStorage.msg.split('-')[1]:util.formatDate.format(new Date(new Date()), "yyyy-MM"),
                choseDay: 0,

                tableHeight: 0,
                listLoading: false,

                projectList: [], //项目列表
                reportList: [], //日报列表
                reportNames:[], //批量审批列表

                dialogVisible: false, //项目弹窗
                report: '',
                workForm: {
                    createDate: sessionStorage.msg?sessionStorage.msg:util.formatDate.format(new Date(new Date()), "yyyy-MM-dd"),
                    domains: [{
                        id: null,
                        projectId: "",
                        workingTime: "",
                        timeType:0,
                        content: "",
                        state: 2,
                    }],
                },
                workRules: {
                    createDate: [{ required: true, message: "请选择工作日期", trigger: "change" }],
                },

                logining: false,
                isDisable: false,
                timeType:[],
                //部门人员树状结构
                data: [
                    {
                        id: -1,
                        label: '全部人员',
                        membCount:0
                    },
                    {
                        id: 0,
                        label: '未分配',
                    }
                ],
                allData:{},
                batchShowData:{},
                option: [],
                depData: {
                    id: -1,
                    label: '全部人员',
                },
                defaultProps: {
                    children: 'children',
                    label: 'label'
                },
            };
        },
        methods: {
            //项目选中了， 加载子项目
            selectProject(domain, index) {
                this.http.post('/sub-project/list',{ 
                        projectId: domain.projectId
                    },
                    res => {
                        if (res.code == "ok") {
                            this.workForm.domains[index].subProjectList = res.data;
                            // domain.subProjectList = res.data;
                            // console.log(domain.subProjectList);
                            this.$forceUpdate();
                        } 
                    },
                    error => {
                        this.listLoading = false;
                        this.$message({
                            message: error,
                            type: "error"
                        });
                        }
                    );
            },
            //删除自己的日报
           deleteReport() {
               this.$confirm("确定要删除该日报吗?","提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                })
                .then(() => {
                    this.listLoading = true;
                    this.http.post('/report/delete',{ 
                        userId: this.user.id,
                        date: this.workForm.createDate
                    },
                    res => {
                        this.listLoading = false;
                        if (res.code == "ok") {
                            this.$message({
                                message: "删除成功",
                                type: "success"
                            });
                            this.getReportList();
                            this.getDepartment();
                            this.dialogVisible = false;
                        } else {
                            this.$message({
                                message: res.msg,
                                type: "error"
                            });
                        }
                    },
                    error => {
                        this.listLoading = false;
                        this.$message({
                            message: error,
                            type: "error"
                        });
                        }
                    );
                })
                .catch(() => {});
                
           },
            //提交批量审核数据
            submitBatchApprove() {
                console.log(this.$refs.approveTree.getCheckedNodes());
                var data = this.$refs.approveTree.getCheckedNodes();
                var ids = '';
                if (data.length == 0) {
                    this.$message({
                            message: '请选择要审核的人员',
                            type: "error"
                        });
                    return;
                }
                for (var i=0;i<data.length; i++) {
                    ids += data[i].id;
                    if (i < data.length-1) {
                        ids += ',';
                    }
                }
                let day = this.choseDay > 9 ? "-" + (this.choseDay + 1) : "-0" + (this.choseDay + 1);
                console.log('ids==='+ids);
                this.http.post("/report/batchApproveReport", {ids:ids, date:this.date + day},
                res => {
                    if (res.code == "ok") {
                        this.$message({
                            message: '审核成功',
                            type: "success"
                        });
                        this.getReportList();
                        this.getDepartment();
                        this.approveDialogVisible = false;
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        });
                    }
                },
                error => {
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },
            selectAll() {
                if (this.isAllSelect) {
                    var keys = [];
                    this.reportNames.forEach(b=>{
                        keys.push(b.id);
                    })
                    this.$refs.approveTree.setCheckedKeys(keys);
                } else {
                    this.$refs.approveTree.setCheckedKeys([]);
                }
            },
            //批量审核
            batchApprove() {
                this.approveDialogVisible = true;
                console.log(this.allData);
                this.reportNames = [];
                for (var i=0;i<this.reportList.length; i++) {
                    var report = this.reportList[i];
                    var hasUnChecked =false;
                    var id = '';
                    for (var j=0;j<report.data.length; j++) {
                        if (report.data[j].state == 0) {
                            hasUnChecked = true;
                            id += report.data[j].id+',';
                        }
                    }
                    if (hasUnChecked) {
                        this.reportNames.push({id:id, label: report.name});
                    }
                }
            },
            removeEmptyNode(list) {
                for (var i=0;i<list.length;i++) {
                    var cnt = 0;
                    if (list[i].membCount == 0) {
                        list.splice(i, 1);
                        i--;
                    } else if (list[i].children != null) {
                        this.removeEmptyNode(list[i].children);
                    }
                }
            },
            calculateMembCount(list) {
                for (var i in list) {
                    var cnt = 0;
                    if (list[i].children != null) {
                        this.calculateMembCount(list[i].children);
                        for (var m in list[i].children) {
                            cnt += list[i].children[m].membCount;
                        }
                    }
                    
                    if (list[i].isUser == 1) {
                        cnt++;
                        this.membCount++;
                    } 
                    list[i].membCount = cnt;
                }
            },
            stateChange() {
                this.membCount = 0;
                if (this.selectState == -1) {
                    //全部状态
                    this.data = this.allData;
                } else {
                    //未填报
                    var newData = JSON.parse(JSON.stringify(this.allData));
                    this.filterState(this.selectState, newData);
                    this.data = newData;
                }
                this.calculateMembCount(this.data);
                this.data[0].membCount = this.membCount;//总人数
            },
            //按状态过滤部门人员
            filterState(state, list) {
                for (var i =0;i<list.length; i++) {
                    var obj = list[i];
                    if (obj.isUser == 1) {
                        var match = false;
                        if (state == -2) {
                            if (obj.state == null) {
                                match = true;
                            }
                        } else {
                            if (obj.state == state) {
                                match = true;
                            }
                        }
                        if (!match) {
                            console.log("不匹配，删除="+obj.label+', state='+obj.state);
                            list.splice(i, 1);
                            i--;
                        } else {
                            console.log("匹配"+obj.label);
                        }
                    } else {
                        if (obj.children != null) {
                            this.filterState(state, obj.children);
                        }
                    }
                }
            },
            // 部门列表点击
            handleNodeClick(data) {
                console.log(data);
                // if(this.depData == null || data.id != this.depData.id) {
                //     this.depData = data;
                //     //this.getUser();
                    
                // }
                this.depData = data;
                if (data.id == -1) {
                    this.deptId = null;
                    this.targetUid = null;
                } else if (data.isUser == 1) {
                    this.deptId = null;
                    this.targetUid = data.id;
                } else {
                    this.deptId = data.id;
                    this.targetUid = null;
                }
                this.getReportList();
            },
            
            // 获取部门列表
            getDepartment() {
                let day = this.choseDay > 9 ? "-" + (this.choseDay + 1) : "-0" + (this.choseDay + 1);
                this.http.post("/report/getMembList", {date:this.date + day},
                res => {
                    if (res.code == "ok") {
                        var list = res.data , list1 = JSON.parse(JSON.stringify(res.data));
                        list.splice(0,0,{
                            id: -1,
                            label: '全部人员',
                        })
                        list.push({
                            id: 0,
                            label: '未分配',
                        })
                        this.membCount = 0;
                        //设置员工到部门下面
                        this.setUserToDept(list);
                        this.data = list;
                        this.allData = list;
                        this.option = this.changeArr(list1);
                        list[0].membCount = this.membCount;
                        if (this.depData.id == -1) {
                            this.depData.membCount = this.membCount;
                        }
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        });
                    }
                },
                error => {
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },

            setUserToDept(list) {
                for (var i in list) {
                    var cnt = 0;
                    if (list[i].children != null) {
                        this.setUserToDept(list[i].children);
                        for (var m in list[i].children) {
                            cnt += list[i].children[m].membCount;
                        }
                    }
                    
                    if (list[i].userList != null) {
                        if (list[i].children == null) {
                            list[i].children = [];
                        }
                        list[i].userList.forEach(element => {
                            var obj = {id: element.id, label:element.name, state:element.state, parentId:element.departmentId, isUser:1};
                            list[i].children.push(obj);
                            this.membCount++;
                            cnt++;
                        });
                    }
                    list[i].membCount = cnt;
                }
            },

            // 修改数组
            changeArr(arr) {
                for (var i = 0; i < arr.length; i++) {
                    if(arr[i].id != -1 && arr[i].id != 0) {
                        if (arr[i].children != null && arr[i].children.length>0) {
                            arr[i].children = this.changeArr(arr[i].children);
                        }
                        arr[i].id && (arr[i].value = arr[i].id);
                        delete arr[i].id;
                    }
                }
                for(var i in arr) {
                    if(arr[i].id == -1 || arr[i].id == 0) {
                        arr.splice(i,1)
                    }    
                }
                return arr;
            },
            //时间段范围设置改动，监听
            onTimeTypeChange(timeType) {
                this.showAddMore = true;
                console.log("======" + timeType);
                for(var i in this.workForm.domains) {
                    if (this.workForm.domains[i].timeType == 0) {
                        this.showAddMore = false;
                        break;
                    }
                }
                if (this.showAddMore) {
                    //检测数量
                    if (this.workForm.domains.length == 2) {
                        this.showAddMore = false;
                    } else {
                        this.showAddMore = true;
                    }
                }
            },
            getTimeType() {
                this.http.post('/time-type/getCompanyTimeSetting', { companyId: this.user.companyId},
                    res => {
                        if (res.code == "ok") {
                            var t = res.data;
                            this.reportTimeType = t;
                            if (this.reportTimeType.type > 0) {
                                this.showAddMore = true;
                            }
                            //转化时间格式
                            if (t.allday != null) {
                                this.timeType.push({value:0, label:'全天 - '+t.allday+'小时', hours:t.allday});
                            }
                            if (t.am != null) {
                                this.timeType.push({value:1, label:'上午 - '+t.am+'小时', hours: t.am});
                            }
                            if (t.pm != null) {
                                this.timeType.push({value:2, label:'下午 - '+t.pm+'小时', hours: t.pm});
                            }
                        } else {
                            this.$message({
                                message: res.msg,
                                type: "error"
                            });
                        }
                    },
                    error => {
                        this.listLoading = false;
                        this.$message({
                            message: error,
                            type: "error"
                        });
                    });
            },
            // 改变月份
            changeMonthOut() {
                console.log(sessionStorage.msg)
                this.getAllDate();
                this.getReportList();
                this.getDepartment();
            },

            // 选择日期
            choseDate(i, item) {
                this.choseDay = i;
                let day = this.choseDay > 9 ? "-" + (this.choseDay + 1) : "-0" + (this.choseDay + 1);
                sessionStorage.msg = this.date + day,
                this.getReportList();
                this.getDepartment();
                this.curDate = item;
            },

            // 获取日期列表
            getAllDate() {
                var dayArry = [];
                var day = this.getCountDays();
                for (var k = 1; k <= day; k++) {
                    var str = new Date(this.date.replace(/-/g, "/")).getMonth() + 1 + "月" + k + "日";
                    if ( new Date(this.date.replace(/-/g, "/")).getFullYear() == new Date(new Date()).getFullYear() &&
                    new Date(this.date.replace(/-/g, "/")).getMonth() == new Date(new Date()).getMonth()) {
                        if(sessionStorage.msg) {
                            if(parseInt(sessionStorage.msg.split("-")[2]) == k) {
                                this.choseDay = k - 1;
                            }
                        } else {
                            if (new Date().getDate() == k) {
                                this.choseDay = k - 1;
                            }   
                        }
                    } else {
                        this.choseDay = 0;
                    }
                    dayArry.push(str);
                }
                this.allDate = dayArry;
                if (sessionStorage.msg) {
                    this.curDate = sessionStorage.msg;
                }
            },

            getCountDays() {
                var newstr = this.date.replace(/-/g, "/");
                var curDate = new Date(newstr);
                var curMonth = curDate.getMonth();
                curDate.setMonth(curMonth + 1);
                curDate.setDate(0);
                return curDate.getDate();
            },

            //获取日报列表
            getReportList() {
                this.listLoading = true;
                let day = this.choseDay > 9 ? "-" + (this.choseDay + 1) : "-0" + (this.choseDay + 1);
                let param = {date: this.date + day};
                if (this.deptId != null) {
                    param.deptId = this.deptId;
                }
                if (this.targetUid != null) {
                    param.userId = this.targetUid;
                }
                this.http.post( this.port.report.list, param,
                res => {
                    this.listLoading = false;
                    if (res.code == "ok") {
                        this.reportList = res.data;
                        document.querySelector("#day"+this.choseDay).scrollIntoView(true);
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        });
                    }
                },
                error => {
                    this.listLoading = false;
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },

            //导出日报
            exportReport() {
                if (this.reportList.length > 0) {
                    this.listLoading = true;
                    //首先处理日期
                    let day = this.choseDay > 9 ? "-" + (this.choseDay + 1) : "-0" + (this.choseDay + 1);
                    this.http.post( this.port.report.export, { date: this.date + day },
                    res => {
                        this.listLoading = false;
                        if (res.code == "ok") {
                            location.href = res.data;
                        } else {
                            this.$message({
                                message: res.msg,
                                type: "error"
                            });
                        }
                    },
                    error => {
                        this.listLoading = false;
                        this.$message({
                            message: error,
                            type: "error"
                        });
                    });
                } else {
                    this.$message({
                        message: "当天没有报告 无法导出",
                        type: "info"
                    });
                }
            },

            //获取项目列表
            getProjectList() {
                this.listLoading = true;
                this.http.post( this.port.project.list, {},
                res => {
                    this.listLoading = false;
                    if (res.code == "ok") {
                        this.projectList = res.data;
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        });
                    }
                },
                error => {
                    this.listLoading = false;
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },

            // 获取个人某天的日报
            getReport(i) {
                this.http.post( this.port.report.getPort, {
                    date: this.workForm.createDate
                },
                res => {
                    if (res.code == "ok") {
                        var list = res.data;
                        this.report = list;
                        if(list.report.length != 0) {
                            var arr = [];
                            this.canEdit = false;
                            for(var i in list.report) {
                                arr.push({
                                    id: list.report[i].id,
                                    projectId: list.report[i].projectId,
                                    workingTime: list.report[i].workingTime,
                                    content: list.report[i].content,
                                    state: list.report[i].state,
                                    timeType: list.report[i].timeType
                                })
                                if (list.report[i].state >= 2) {
                                    this.canEdit = true;
                                }
                            }
                            this.workForm = {
                                createDate: this.workForm.createDate,
                                domains: arr,
                            }
                        } else {
                            this.workForm = {
                                createDate: this.workForm.createDate,
                                domains: [{
                                    id: null,
                                    projectId: "",
                                    workingTime: "",
                                    content: "",
                                    state: 2,
                                    timeType:0,
                                }],
                            }
                            this.canEdit = true;
                        }
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        });
                    }
                },
                error => {
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },

            // 打开日报填写
            fillInReport(i) {
                if(i == -1) {
                    this.isDisable = false;
                } else {
                    this.isDisable = true;
                }
                let day = this.choseDay > 9 ? "-" + (this.choseDay + 1) : "-0" + (this.choseDay + 1);
                this.workForm.createDate = this.date + day;
                this.getReport(i);
                this.dialogVisible = true;
            },

            // 添加模块
            addDomain() {
                this.workForm.domains.push({
                        projectId: "",
                        workingTime: "",
                        content: "",
                        state:2,//2-表示待提交
                });
                
                if (this.reportTimeType.type == 0) {
                    //全天上下午模式下，检测时间段数量，达到2个，不能再加了
                    var length = this.workForm.domains.length;
                    if (length == 2) {
                        this.showAddMore = false;
                    }
                }
                
            },

            // 移除模块
            delDomain(i) {
                this.workForm.domains.splice(i,1)
                //检测当前剩下的一个，时间类型是否是全天
                if (this.reportTimeType.type == 0) {
                    if (this.workForm.domains[0].timeType == 0) {
                        this.showAddMore = false;
                    } else {
                        this.showAddMore = true;
                    }
                }
                
            },

            // 改变月份
            changeMonth() {
                this.getReport()
            },

            // 保存日报
            submitDepartment() {
                this.$refs.workForm.validate(valid => {
                    if (valid) {
                        //检查时间，全天和上下午不能同时存在
                        if (this.reportTimeType.type == 0) {
                            var alldayNum = 0;
                            var amNum = 0;
                            var pmNum = 0;
                            for(var i in this.workForm.domains) {
                                if (this.workForm.domains[i].timeType == 0) {
                                    alldayNum ++;
                                } else if (this.workForm.domains[i].timeType == 1) {
                                    amNum++;
                                } else if (this.workForm.domains[i].timeType == 2) {
                                    pmNum++;
                                }
                            }
                            if (alldayNum > 1) {
                                this.$message({
                                        message: "工作时间-全天，只能选择一次",
                                        type: "error"
                                    });
                                return;
                            }
                            if (amNum > 1) {
                                this.$message({
                                        message: "工作时间-上午，只能选择一次",
                                        type: "error"
                                    });
                                return;
                            }
                            if (pmNum > 1) {
                                this.$message({
                                        message: "工作时间-下午，只能选择一次",
                                        type: "error"
                                    });
                                return;
                            }
                            if (alldayNum == 1 && (amNum > 0 || pmNum > 0)) {
                                this.$message({
                                        message: "工作时间-全天，不能和上下午同时存在",
                                        type: "error"
                                    });
                                return;
                            }
                        }
                        
                        this.listLoading = true;
                        let formData = new FormData();
                        for(var i in this.workForm.domains) {
                            if (this.workForm.domains[i].id != null) {
                                formData.append("id", this.workForm.domains[i].id);
                            } else {
                                formData.append("id", -1);
                            }
                            formData.append("projectId", this.workForm.domains[i].projectId);
                            if (this.workForm.domains[i].subProjectId != null) {
                                formData.append("subProjectId", this.workForm.domains[i].subProjectId);
                            } else {
                                formData.append("subProjectId", 0);
                            }
                            
                            formData.append("reportTimeType", this.reportTimeType.type);
                            if (this.reportTimeType.type == 0) {
                                formData.append("timeType", this.workForm.domains[i].timeType);
                                var workingTime = this.timeType.filter(t=>t.value == this.workForm.domains[i].timeType)[0].hours;
                                formData.append("workingTime", workingTime);
                            } else if (this.reportTimeType.type == 1){
                                formData.append("workingTime", this.workForm.domains[i].workingTime);
                            } else if (this.reportTimeType.type == 2) {
                                formData.append("startTime", this.workForm.domains[i].startTime);
                                formData.append("endTime", this.workForm.domains[i].endTime);
                            }
                            
                            
                            if (this.workForm.domains[i].content == null || this.workForm.domains[i].content == '') {
                                formData.append("content", '-');
                            } else {
                                formData.append("content", this.workForm.domains[i].content);
                            }
                            
                            formData.append("createDate", this.workForm.createDate);
                        }
                        this.http.uploadFile( this.port.report.editPort, formData,
                        res => {
                            this.listLoading = false;
                            if (res.code == "ok") {
                                this.$message({
                                    message: "填报成功",
                                    type: "success"
                                });
                                this.dialogVisible = false;
                                this.getReportList();
                                this.getDepartment();
                            } else {
                                this.$message({
                                    message: res.msg,
                                    type: "error"
                                });
                            }
                        },
                        error => {
                            this.listLoading = false;
                            this.$message({
                                message: error,
                                type: "error"
                            });
                        });
                    }
                });
            },

            // 跳转
            junpToDeskTop(id) {
                let day = this.choseDay > 9 ? "-" + (this.choseDay + 1) : "-0" + (this.choseDay + 1);
                this.$router.push("/desktop/" + id + "/" + this.date +day);
            },

            // 通过日报
            approve(id, item) {
                this.logining = true;
                let day = this.choseDay > 9 ? "-" + (this.choseDay + 1) : "-0" + (this.choseDay + 1);

                var ids = '';
                var data = item.data;
                data.forEach(element => {
                    ids +=(element.id+',');
                });
                this.http.post( this.port.report.approve, {id: id , date: this.date +day, reportIds: ids},
                res => {
                    this.logining = false;
                    if (res.code == "ok") {
                        this.$message({
                            message: "审核成功",
                            type: "success"
                        });
                        this.getReportList();
                        this.getDepartment();
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        });
                    }
                },
                error => {
                    this.logining = false;
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },

            //撤回日报
            cancel(item) {
                this.logining = true;
                
                var ids = '';
                var data = item.data;
                data.forEach(element => {
                    ids +=(element.id+',');
                });
                this.http.post(this.port.report.cancelReport, {userId: this.user.id, reportIds: ids},
                res => {
                    this.logining = false;
                    if (res.code == "ok") {
                        this.$message({
                            message:"撤回成功",
                            type: "success"
                        });
                        this.getReportList();
                        this.getDepartment();
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        });
                    }
                },
                error => {
                    this.logining = false;
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },

            // 未通过日报
            deny(id,i, item) {
                this.logining = true;
                let day = this.choseDay > 9 ? "-" + (this.choseDay + 1) : "-0" + (this.choseDay + 1);
                var ids = '';
                var data = item.data;
                data.forEach(element => {
                    ids +=(element.id+',');
                });
                this.http.post( this.port.report.deny, {id: id , date: this.date +day, reportIds: ids},
                res => {
                    this.logining = false;
                    if (res.code == "ok") {
                        this.$message({
                            message: i==0?"驳回成功":"撤销成功",
                            type: "success"
                        });
                        this.getReportList();
                        this.getDepartment();
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        });
                    }
                },
                error => {
                    this.logining = false;
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            }

        },
        created() {
            let height = window.innerHeight;
            console.log('window inner height=='+height)
            this.tableHeight = height - 153;
            const that = this;
            window.onresize = function temp() {
                that.tableHeight = window.innerHeight - 153;
            };

        },
        mounted() {
            this.getAllDate();
            this.getReportList();
            this.getProjectList();
            this.getTimeType();
            this.getDepartment();
        }
    };
</script>

<style lang="scss" scoped>
    .allDaily {
        width:82%;
    }
    .report_title {
        padding:10px 0;
    }
    .clearfix {
        overflow-x: auto;
        white-space: nowrap;
        padding: 15px 0;
        .date_item {
            padding: 0 15px;
            cursor: pointer;
        }
        .chooseDate {
            color: #20a0ff;
        }
    }

    .one_daily {
        i {
            color: #9ed0ff;
            margin-right: 5px;
        }
        .one_daily_body {
            padding: 15px 0px;
            p {
            margin: 0;
            line-height: 30px;
            }
        }
        ul {
            padding: 0;
        }
    }

    .checkbtn {
        float: right;
        margin-top: -10px;
    }
</style>

<style lang="scss">
    .daily {
        .el-card__body {
            height: 80%;
            overflow-y: auto;
        }

        .el-card__header {
            padding: 0 20px;
        }
        
    }
    
</style>

<style scoped>
/* 项目标签的样式 */
    .el-tag + .el-tag {
        margin-left: 10px;
    }
    .button-new-tag {
        margin-left: 10px;
        height: 32px;
        line-height: 30px;
        padding-top: 0;
        padding-bottom: 0;
    }
    .input-new-tag {
        width: 90px;
        margin-left: 10px;
        vertical-align: bottom;
    }
</style>