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

<template>
    <section>
        <!--列表-->
        <div>
            <el-card class="box-card daily" shadow="never">
                <div slot="header" class="clearfix" id="clearfix" style="padding-left: 255px;">
                    <div class="jjk" style="display:inline-block;position:fixed;top:70px;background:#fff;left:250px;">
                        <el-date-picker size="small" v-model="date" :editable="false" format="yyyy-MM" value-format="yyyy-MM"
                         style="width:190px;"
                         @change="changeMonthOut" :clearable="false" type="month" placeholder="选择月份"></el-date-picker>
                         <el-button style="margin-left:10px;" icon="iconfont firerock-icongongshitongji" size="mini"  @click="showMonthWorkTime"></el-button>
                    </div>
                        <span v-for="(item,index) in allDate" :id="'day'+index" :class="index==choseDay?'chooseDate date_item':'date_item'" 
                        @click="choseDate(index, item)" :key="index" >
                        <div :style="'display:inline-block;'+(item.state == null?'padding:0px 6px;':'')" >
                            <div><span>{{item.showDate}}</span>
                            <span style="font-size:10px;text-align:center;color:#999;">{{item.weekDay}}</span>
                            </div>
                        </div>
                        <i v-if="item.state != null" class="iconfont firerock-icondot" :class="statusStyle[item.state]"></i>
                        </span>
                </div>
                <div style="display:flex;">
                <div v-if="user.role > 0 || user.manageDeptId != 0" >
                    <div style="width:190px;">
                        <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 == 1 || user.role == 2 || user.manageDeptId > 0">
                        <span>工作日报 | {{depData != null ?depData.label:""}}</span>
                        <span v-if="targetUid == null">
                         - 已填写
                        <el-link :underline="false" @click="showMembList(1)"><span style="margin-left:5px;margin-right:5px;color:green;">{{reportList.length}}</span></el-link>人，
                    未填写<el-link :underline="false" @click="showMembList(0)"><span style="margin-left:5px;margin-right:5px;color:red;">{{(depData == null?data[0].membCount:(depData.isUser == 1?1:depData.membCount))-reportList.length}}</span></el-link>人
                        </span>
                        <span style="float:right;">
                            <el-link type="primary" style="margin-right:10px;" :underline="false" @click="isSubstitude=false;fillInReport(-1,0)">填写日报</el-link>
                            <el-link type="primary" style="margin-right:10px;" :underline="false" @click="isSubstitude=true; fillInReport(-1,0)">代填日报</el-link>
                            <el-link type="primary" style="margin-right:10px;" :underline="false" @click="isSubstitude=false;fillInReport(-1,1)">批量填报</el-link>
                            <!-- <el-link type="primary" style="margin-right:10px;" :underline="false" @click="isSubstitude=true; fillInReport(-1,1)">批量代填</el-link> -->
                            <el-link type="primary" style="margin-right:10px;" :underline="false" @click="showExportDialog">导出日报</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||user.role==5) && user.manageDeptId == 0"><span>日报列表</span>
                    <span style="float:right;" v-if="(user.role==0||user.role==5) && user.manageDeptId == 0">
                            <el-link type="primary" style="margin-right:10px;" :underline="false" @click="isSubstitude=false;fillInReport(-1,0)">填写日报</el-link>
                            <el-link type="primary" v-if="user.leader" style="margin-right:10px;" :underline="false" @click="isSubstitude=true; fillInReport(-1,0)">代填日报</el-link>
                            <el-link type="primary" style="margin-right:10px;" :underline="false" @click="isSubstitude=false;fillInReport(-1,1)">批量填报</el-link>
                            <!-- <el-link type="primary" v-if="user.leader" style="margin-right:10px;" :underline="false" @click="isSubstitude=true; fillInReport(-1,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 v-if="user.role >=1 && user.role <=3"><span  style="margin-left:10px;">成本：</span>
                                    <span >{{item1.cost}}</span>元</span>
                                </span>
                            </span>
                            <div class="checkbtn">
                                <el-button v-if="(user.role == 1 || user.role == 2 || 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 == 1 || user.role == 2 || 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 == 1 || user.role == 2 || 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="isSubstitude=false; fillInReport(index1,0)">编辑日报</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 v-if="user.company.packageEngineering == 0">
                                            <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>
                                            </span>
                                            <span v-if="user.company.packageEngineering == 1">
                                                <span style="margin-left:15px;color:#DAA520;" v-if="item2.state == 0 && item2.departmentAuditState == -1">[ 待专业审核 ]</span>
                                                <span style="margin-left:15px;color:#DAA520;" v-if="item2.state == 0 && item2.departmentAuditState == 0">[ 待部门审核 ]</span>
                                                <span style="margin-left:15px;color:#DAA520;" v-if="item2.state == 0 && item2.departmentAuditState == 1">[ 待项目经理审核 ]</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>
                                            </span>
                                            </p>
                                            <p v-if="user.company.packageEngineering == 1">
                                                专业进度：
                                                <span style="margin-right:10px;" v-for="progressItem in item2.professionProgress" :key="progressItem.id">{{progressItem.professionName}}({{progressItem.progress}}%) 
                                                    <el-tooltip v-if="progressItem.auditState == 0"  content="待审核" effect="light" placement="top">
                                                    <i class="iconfont firerock-icondaibandengdaishenhe"></i>
                                                    </el-tooltip>
                                                    <el-tooltip v-if="progressItem.auditState == 1" content="已通过" effect="light" placement="top">
                                                    <i  class="iconfont firerock-iconshenhetongguo"></i>
                                                    </el-tooltip>
                                                    <el-tooltip v-if="progressItem.auditState == 2" content="不通过" effect="light" placement="top">
                                                    <i  class="iconfont firerock-iconshenhebohui"></i>
                                                    </el-tooltip>
                                                    </span>
                                            </p>
                                            <p v-if="item2.taskId != null">任务：{{item2.taskName}}
                                            </p>
                                            <p style="display: inline-block;">时长：
                                                <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  
                                            <el-tag type="danger" size="mini" style="margin-left: 65px" v-if="item2.isOvertime === 1">加班</el-tag>
                                            </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="isBatch==0?'填写日报':'批量填报'" :visible.sync="dialogVisible" width="60%" :close-on-click-modal="false">
            <el-form ref="workForm" :model="workForm" :rules="workRules" label-width="100px">
                <el-form-item label="选择人员" prop="userNames" v-if="isSubstitude" 
                :rules="{ required: true, message: '请选择代填人员', trigger: 'change' }">
                    <el-input @focus="showChooseMembTree" v-model="workForm.userNames"
                    placeholder="请选择代填人员" ></el-input>
                </el-form-item>
                <el-form-item label="工作日期" prop="createDate">
                    <el-date-picker v-model="workForm.createDate" :editable="false" format="yyyy-MM-dd" value-format="yyyy-MM-dd" 
                    :style="'width:'+(isBatch==0?'200':'280')+'px;'" :type="isBatch==0?'date':'daterange'"
                    @change="changeMonth()" :clearable="false" placeholder="选择工作日期" :disabled="isDisable"></el-date-picker>
                    <span v-if="reportTimeType.type == 3" style="margin-left:30px;">{{isBatch==0?'总':'每日'}}时长:</span>
                    <el-input-number :disabled="!canEdit" v-if="reportTimeType.type == 3" style="margin-left:10px;" @change="changeAllTime"
                        v-model="reportTimeType.allday" :precision="1" :step="0.5" :max="12" :min="0.5"></el-input-number>
                    <span v-if="reportTimeType.type == 3">小时</span>
                </el-form-item>
                
                <div v-for="(domain, index) in workForm.domains" :key="domain.id">
                    <el-form-item v-if="reportTimeType.type != 3" label="工作时长" :prop="'domains.' + index + '.'+timeFields[reportTimeType.type]"
                        :rules="{ required: true, message: '请选择工作时长', trigger: 'blur' }">
                        <el-select v-model="domain.timeType" style="width:200px;"
                            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" style="width:200px;"
                        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-picker 
                        :disabled="workForm.domains.length==0?true:(workForm.domains[index].state>=2?false:true)"
                            v-model="domain.startTime"
                            placeholder="起始时间"
                            style="width:120px;"
                            format="HH:mm"
                            value-format="HH:mm"
                            :picker-options="{
                            start: '08:00',
                            end: '23:30'
                            }">
                        </el-time-picker> - <el-time-picker 
                        :disabled="workForm.domains.length==0?true:(workForm.domains[index].state>=2?false:true)"
                            v-model="domain.endTime"
                            placeholder="结束时间"
                            style="width:120px;"
                            format="HH:mm"
                            value-format="HH:mm"
                            :picker-options="{
                            start: '08:00',
                            end: '23:30',
                            minTime: domain.startTime
                            }">
                        </el-time-picker>
                        </span>
                        <div class="overtime"><el-checkbox :disabled="!canEdit" v-model="domain.isOvertime">加班</el-checkbox></div>
                    </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"  filterable="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 v-if="reportTimeType.type == 3" label="用时占比" :prop="'domains.' + index + '.'+timeFields[reportTimeType.type]"
                        :rules="{ required: true, message: '请选择工作时长', trigger: 'blur' }">
                        <div style="width:300px;">
                            <el-col span="14"><el-slider :disabled="!canEdit" v-model="domain.progress" :min="10" :show-tooltip="false" :step="10" style="width:180px;" @change="domain.workingTime = (reportTimeType.allday*domain.progress/100).toFixed(1)"></el-slider></el-col>
                            <el-col span="10"><span style="margin-left:10px;float:right;"><span style="margin-right:10px;">{{domain.progress}}%</span>{{domain.workingTime}}小时</span></el-col>
                        </div>
                        <div class="overtime"><el-checkbox :disabled="!canEdit" v-model="domain.isOvertime">加班</el-checkbox></div>
                    </el-form-item>
                    <!--工程专业版本模式下， 各个专业的进度填报 -->
                    <el-form-item label="专业进度" :prop="'domains.' + index + '.professionProgress'" v-if="user.company.packageEngineering==1">
                        <span v-for="item in domain.professionProgress" :key="item.professionId" style="margin-right:10px;">
                            <span>{{item.professionName}}</span> / 进度:
                            <el-input size="mini" style="width:60px;" v-model="item.progress"
                            @keyup.native="onProgressChange" 
                            :disabled="workForm.domains.length==0?true:(workForm.domains[index].state>=2?false:true)"></el-input>%
                        </span>
                    </el-form-item>
                    <!--项目管理专业版模式下，项目下的近期执行的任务 -->
                    <el-form-item label="相关任务" :prop="'domains.' + index + '.taskId'" v-if="user.company.packageProject==1" >
                        <el-select v-model="domain.taskId" placeholder="请选择" style="width:100%;" filterable="true" 
                        :disabled="workForm.domains.length==0?true:(workForm.domains[index].state>=2?false:true)">
                            <el-option v-for="item in domain.taskList" :key="item.taskId" :label="item.taskName" :value="item.taskId"></el-option>
                        </el-select>
                    </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" style="margin-bottom:10px;"></el-divider>
                </div>
                <el-link v-if="showAddMore"  :disabled="!canEdit" 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>
        <!--导出报表条件选择 -->
        <el-dialog title="日报导出" v-if="exportDialog" :visible.sync="exportDialog" customClass="customWidth" width="500px">
            <el-form ref="form3" :model="exportParam" >
                <el-form-item prop="projectId" label="选择项目">
                    <el-select v-model="exportParam.projectId" placeholder="全部项目"  clearable style="width:350px;">
                        <el-option v-for="item in projectList"  :key="item.id" :label="item.projectName" :value="item.id"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item prop="projectId" label="日期范围">
                    <el-date-picker
                        v-model="exportParam.dateRange" :editable="false" 
                        format="yyyy-MM-dd" value-format="yyyy-MM-dd" 
                        :clearable="true" 
                        range-separator="至"
                        type="daterange" 
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                    ></el-date-picker>
                </el-form-item>
                
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="exportReport" style="width:100%;" >导出</el-button>
            </div>
        </el-dialog>
        <!--人员列表 -->
        <el-dialog  :title="(isFill?'已填':'未填')+'人员列表'" v-if="membListVisible" :visible.sync="membListVisible"  width="500px">
            <el-table :show-header="false" :data="fillMembList" highlight-current-row :height="400" style="width: 100%;">
            <el-table-column type="index" width="60">
                <template slot-scope="scope" >
                        {{scope.$index+1}}
                    </template>
            </el-table-column>
            <el-table-column prop="label" label="姓名" ></el-table-column>
            <el-table-column prop="deptName" label="部门" >
            </el-table-column>

            </el-table>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="weixinNotify"  v-if="!isFill" :disabled="fillMembList == 0">微信催填</el-button>
                <el-button type="default" @click="exportMemb"  :disabled="fillMembList == 0">导出</el-button>
            </div>
        </el-dialog>

        
        <!-- 按部门选择人员 -->
        <el-dialog title="选择需要代填报的人员"  v-if="chooseParticipVisible" :visible.sync="chooseParticipVisible" :close-on-click-modal="false" customClass="customWidth" width="500px">
            <!-- <el-input style="width:100%" v-model="filterName" placeholder="请输入姓名搜索" @change="findUserInTree"></el-input> -->
            <div class="tree" style="height:400px">
                <el-scrollbar style="height:100%">
                <el-tree :data="deptMembData" show-checkbox :props="defaultProps" node-key="id"
                    ref="chooseMembTree" @check-change="onTreeItemChange" :default-checked-keys="workForm.userId"
                    highlight-current ></el-tree>
                </el-scrollbar>
            </div>
            <div>已选中&nbsp;{{chosenMembCount}}&nbsp;人</div>
            <div slot="footer" class="dialog-footer">
                <el-button  @click="chooseParticipVisible = false" >取消</el-button>
                <el-button type="primary" @click="chooseParticip()" >确定</el-button>
            </div>
        </el-dialog>

        <el-dialog title="员工每日填报工时数"   v-if="monthWorkTimeDialog" :visible.sync="monthWorkTimeDialog" :close-on-click-modal="false" customClass="customWidth" width="90%">
            <!-- <el-input style="width:100%" v-model="filterName" placeholder="请输入姓名搜索" @change="findUserInTree"></el-input> -->
            <el-table :data="monthWorkData" border :height="500"   highlight-current-row  style="width: 100%;">
            <el-table-column width="60" type="index" fixed="left" label="序号">
                <template slot-scope="scope" >
                        {{scope.$index+1}}
                    </template>
            </el-table-column>
            
            <el-table-column width="100" prop="name" fixed="left" label="姓名">

            </el-table-column>
            <el-table-column width="90" v-for="(item,index) in allDate" :key="index" :label="item.showDate+'/'+item.weekDay" align="center">
                <template slot-scope="scope">
                    <div style="color:red;" 
                    v-if="scope.row.worktimeList.filter(w=>w.createDate.split('-')[2] == item.date.split('月')[1].replace('日','') 
                        || w.createDate.split('-')[2] == '0'+item.date.split('月')[1].replace('日','') ).length > 0 && scope.row.worktimeList.filter(w=>w.createDate.split('-')[2] == item.date.split('月')[1].replace('日','') 
                                || w.createDate.split('-')[2] == '0'+item.date.split('月')[1].replace('日','') )[0].workingTime < reportTimeType.allday">
                                {{scope.row.worktimeList.filter(w=>w.createDate.split('-')[2] == item.date.split('月')[1].replace('日','') 
                                    || w.createDate.split('-')[2] == '0'+item.date.split('月')[1].replace('日','') )[0].workingTime
                        }}</div>
                    <div style="color:#20a0ff;" 
                     v-if="scope.row.worktimeList.filter(w=>w.createDate.split('-')[2] == item.date.split('月')[1].replace('日','') 
                        || w.createDate.split('-')[2] == '0'+item.date.split('月')[1].replace('日','') ).length > 0 && scope.row.worktimeList.filter(w=>w.createDate.split('-')[2] == item.date.split('月')[1].replace('日','') 
                                || w.createDate.split('-')[2] == '0'+item.date.split('月')[1].replace('日','') )[0].workingTime > reportTimeType.allday">
                                {{scope.row.worktimeList.filter(w=>w.createDate.split('-')[2] == item.date.split('月')[1].replace('日','') 
                                    || w.createDate.split('-')[2] == '0'+item.date.split('月')[1].replace('日','') )[0].workingTime
                        }}</div>
                    <div  v-if="scope.row.worktimeList.filter(w=>w.createDate.split('-')[2] == item.date.split('月')[1].replace('日','') 
                        || w.createDate.split('-')[2] == '0'+item.date.split('月')[1].replace('日','') ).length > 0 && scope.row.worktimeList.filter(w=>w.createDate.split('-')[2] == item.date.split('月')[1].replace('日','') 
                                || w.createDate.split('-')[2] == '0'+item.date.split('月')[1].replace('日','') )[0].workingTime == reportTimeType.allday">
                                {{scope.row.worktimeList.filter(w=>w.createDate.split('-')[2] == item.date.split('月')[1].replace('日','') 
                                    || w.createDate.split('-')[2] == '0'+item.date.split('月')[1].replace('日','') )[0].workingTime
                        }}</div>
                    <div v-if="scope.row.worktimeList.filter(w=>w.createDate.split('-')[2] == item.date.split('月')[1].replace('日','') 
                        || w.createDate.split('-')[2] == '0'+item.date.split('月')[1].replace('日','') ).length == 0">
                        0
                    </div>
                </template>
            </el-table-column>
            </el-table>
            <div slot="title" class="dialog-title">
                <label style="font-size:16px;">员工每日填报工时数</label>
                <el-link type="primary" style="float:right;margin-right:60px;" @click="exportMembWorkHours()" >导出数据</el-link>
                <!-- <el-button >导出</el-button> -->
            </div>
        </el-dialog>
        
    </section>
</template>

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

    export default {
        data() {
            return {
                monthWorkTimeDialog: false,
                isSubstitude:false,
                isFill:false,
                unFillList:[],
                fillList:[],
                fillMembList:[],
                membListVisible: false,
                isBatch:0,//是否是批量填报
                weekDay : ["周日", "周一", "周二", "周三", "周四", "周五", "周六"],
                statusStyle:["waiting", "filledReportStyle", "RejectStyle", ""],
                fillStatusList: [],
                exportParam:{projectId: null, dateRange:[]},
                exportDialog:false,
                timeFields:['timeType', 'workingTime', 'startTime', 'progress'],
                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.0,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" }],
                },
                chooseParticipVisible: false,
                logining: false,
                isDisable: false,
                timeType:[],

                deptMembData: [
                    
                ],
                //部门人员树状结构
                data: [
                    {
                        id: -1,
                        label: '全部人员',
                        membCount:0
                    },
                    {
                        id: 0,
                        label: '未分配',
                    }
                ],
                allData:{},
                batchShowData:{},
                option: [],
                depData: {
                    id: -1,
                    label: '全部人员',
                },
                defaultProps: {
                    children: 'children',
                    label: 'label'
                },
                isNew: false,
                selected: false,
                valuet: new Date(),
                domObj: null,
                participator:[],
                chosenMembCount:0,
            };
        },
        methods: {
            //导出员工每日填报工时数
            exportMembWorkHours() {
                this.http.post('/report/exportUserDailyWorkTime',{ 
                        month: this.date
                    },
                    res => {
                        if (res.code == "ok") {
                            var url = '/upload/'+res.data;
                            this.downloadByA("人员每日工时统计.xlxs", url);
                        } 
                    },
                    error => {
                        this.$message({
                            message: error,
                            type: "error"
                        });
                        }
                    );
            },
            downloadByA(name, url) {
                const a = document.createElement('a'); // 创建a标签
                a.setAttribute('download', name);// download属性
                a.setAttribute('href', url);// href链接
                a.click();// 自执行点击事件
                a.remove();
            },
            showMonthWorkTime() {
                this.monthWorkTimeDialog = true;
                this.http.post('/report/getUserDailyWorkTime',{ 
                        month: this.date
                    },
                    res => {
                        if (res.code == "ok") {
                            this.monthWorkData = res.data.list;
                            console.log('获取到数据：'+this.monthWorkData[0].name+', daytime='+this.reportTimeType.allday);
                            this.$forceUpdate();
                        } 
                    },
                    error => {
                        this.$message({
                            message: error,
                            type: "error"
                        });
                        }
                    );
            },
            onProgressChange() {
                this.$forceUpdate();
            },
            showChooseMembTree() {
                this.chosenMembCount = this.participator.length;
                this.chooseParticipVisible = true;
            },
            onTreeItemChange() {
                var chosenList = this.$refs.chooseMembTree.getCheckedNodes();
                var list = chosenList.filter(item=>item.isUser == 1);
                this.chosenMembCount = list.length;
            },
            findUserInTree() {
                if (this.filterName == '') {
                    this.deptMembData = this.allMembData;
                } else {
                    var list = this.findRecursively(this.filterName, this.allMembData);
                    this.deptMembData = list;
                }
            },

            findRecursively(username, list) {
                var filterList = [];
                for (var i=0;i<list.length; i++) {
                    if (list[i].isUser == 1) {
                        if (list[i].label.indexOf(username) >= 0) {
                            //匹配上了
                            filterList.push(list[i]);
                        }
                    } else if (list[i].children != null && list[i].children.length > 0) {
                        var subList = this.findRecursively(username, list[i].children);
                        if (subList.length > 0) {
                            subList.forEach(s=>filterList.push(s));
                        }
                    }
                }
                return filterList;
            },

            //确定选择参与人
            chooseParticip() {
                this.chooseParticipVisible = false;
                var chosenList = this.$refs.chooseMembTree.getCheckedNodes();
                this.chosenMembList = chosenList.filter(item=>item.isUser == 1);
                this.workForm.userNames = '';
                this.workForm.userId = [];
                this.participator = [];
                for (var i=0;i<this.chosenMembList.length; i++) {
                    this.workForm.userId.push(this.chosenMembList[i].id);
                    this.workForm.userNames += this.chosenMembList[i].label+',';
                    var item = {id:this.chosenMembList[i].id, name:this.chosenMembList[i].label};
                    this.participator.push(item);
                }
                if (this.workForm.userNames.length > 0) {
                    this.workForm.userNames = this.workForm.userNames.substring(0, this.workForm.userNames.length-1);
                }
                
            },

            //微信通知人员填写
            weixinNotify() {
                if (this.fillMembList.length == 0) return;
                var ids = '';
                this.fillMembList.forEach(f=>{
                    ids += f.id+',';
                })
                this.http.post('/user/pushFillReport',{ 
                        ids: ids, date: this.curDate
                    },
                    res => {
                        if (res.code == "ok") {
                            this.$message({
                                message: '已发送成功',
                                type: "success"
                            });
                        } 
                    },
                    error => {
                        this.$message({
                            message: error,
                            type: "error"
                        });
                        }
                    );
            },
            //导出人员列表
            exportMemb() {
                if (this.fillMembList.length == 0) return;
                var ids = '';
                this.fillMembList.forEach(f=>{
                    ids += f.id+',';
                })
                this.http.post('/user/exportMembList',{ 
                        ids: ids,isFill: this.isFill, date: this.curDate
                    },
                    res => {
                        if (res.code == "ok") {
                            var aTag = document.createElement('a');
                            aTag.download = this.curDate+(this.isFill?"已填":"未填")+"人员列表.xls";
                            aTag.href = res.data;
                            aTag.click();
                        } 
                    },
                    error => {
                        this.$message({
                            message: error,
                            type: "error"
                        });
                        }
                    );
            },
            showMembList(fill) {
                this.membListVisible = true;
                if (fill == 0) {
                    this.fillMembList = this.unFillList;
                    this.isFill = false;
                } else {
                    this.fillMembList = this.fillList;
                    this.isFill = true;
                }
            },
            //获取自己填写的日报状态
            getReportFillStatus() {
                this.http.post('/report/getReportFillStatus',{ 
                        startDate: this.date+"-01", endDate: this.date+"-31", userId: this.user.id
                    },
                    res => {
                        if (res.code == "ok") {
                            this.fillStatusList = res.data;
                            this.allDate.forEach(d=>{
                                var fillInfo = null;
                                d.state = null;
                                this.fillStatusList.forEach(s=>{
                                    var d1 = s.createDate.split('-')[2];
                                    var d2 = d.date.split('月')[1].split('日')[0];
                                    if (d1.indexOf('0') == 0) {
                                        d1 = d1.substring(1,d1.length);
                                    }
                                    
                                    if (d1 == d2) {
                                        d.state = s.state;
                                    }
                                })
                            })
                            this.$forceUpdate();
                        } 
                    },
                    error => {
                        this.$message({
                            message: error,
                            type: "error"
                        });
                        }
                    );
            },
            scrollFunction () {
                this.domObj = document.getElementById('clearfix') // 通过id获取要设置的div
                if (this.domObj.attachEvent) { // IE
                this.domObj.attachEvent('onmousewheel', this.mouseScroll)
                } else if (this.domObj.addEventListener) {
                this.domObj.addEventListener('DOMMouseScroll', this.mouseScroll, false)
                }
                this.domObj.onmousewheel = this.domObj.onmousewheel = this.mouseScroll
            },

            mouseScroll(event) { // google 浏览器下
                let detail = event.wheelDelta || event.detail
                let moveForwardStep = -1
                let moveBackStep = 1
                let step = 0
                step = detail > 0 ? moveForwardStep * 100 : moveBackStep * 100
                event.preventDefault() // 阻止浏览器默认事件
                this.domObj.scrollLeft = this.domObj.scrollLeft + step
            },

            // //左右滚动
            // wheel(e){
            //     var a = document.getElementById("dateScroll");
            //     var scroll_width = 80; //滚动一下的距离
            //     var e = e || window.event, v;
            //     e.wheelDelta ? v=e.wheelDelta : v=e.detail;
            //     if(v>3||-v>3) v=-v;
            //     v>0 ? a.scrollLeft+=scroll_width : a.scrollLeft-=scroll_width;
                
            //     e.preventDefault(); //阻止浏览器的默认滚动
            // },

            showExportDialog() {
                this.exportDialog = true;
            },
            changeAllTime() {
                //总时长发生改变，自动按比例计算
                this.workForm.domains.forEach(d=>{
                    d.workingTime = (d.progress*this.reportTimeType.allday/100).toFixed(1);
                });
            },

            // 是否加班的单机事件
            check() {
                this.selected = !this.selected
                this.isNew = this.selected
                
            },
            //项目选中了， 加载子项目
            selectProject(domain, index) {
                this.http.post('/sub-project/list',{ 
                    projectId: domain.projectId
                },
                res => {
                    if (res.code == "ok") {
                        this.workForm.domains[index].subProjectList = res.data;
                        this.$forceUpdate();
                    } 
                },
                error => {
                    this.$message({
                        message: error,
                        type: "error"
                    });
                    }
                );
                //项目相关的近期任务
                if (this.user.company.packageProject == 1) {
                    this.http.post('/task/getRecentTask',{ 
                        projectId: domain.projectId
                    },
                    res => {
                        if (res.code == "ok") {
                            this.workForm.domains[index].taskList = res.data;
                            this.$forceUpdate();
                        } 
                    },
                    error => {
                        this.$message({
                            message: error,
                            type: "error"
                        });
                        }
                    );
                }
                //获取项目相关专业
                if (this.user.company.packageEngineering == 1) {
                    this.getProjectProfessions(domain, index);
                }
            },
            getProjectProfessions(domain, index) {
                this.http.post("/project-profession/getMyProfession", {projectId: domain.projectId},
                    res => {
                        if (res.code == "ok") {
                            this.workForm.domains[index].professionProgress = res.data;
                            this.$forceUpdate();
                        }
                    },
                    error => {
                        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() {
                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+1) > 9 ? "-" + (this.choseDay + 1) : "-0" + (this.choseDay + 1);
                
                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;
                
                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) {
                            list.splice(i, 1);
                            i--;
                        } else {
                        }
                    } else {
                        if (obj.children != null) {
                            this.filterState(state, obj.children);
                        }
                    }
                }
            },
            // 部门列表点击
            handleNodeClick(data) {
                this.depData = data;
                var list = [];
                if (data.id == -1) {
                    this.deptId = null;
                    this.targetUid = null;
                    list = this.data;
                } else if (data.isUser == 1) {
                    this.deptId = null;
                    this.targetUid = data.id;
                } else {
                    this.deptId = data.id;
                    this.targetUid = null;
                    list.push(data);
                }
                this.getReportList();
                if (list.length > 0) {
                    this.unFillList = this.getUserMembListFromDeptList(list, 0);
                    this.fillList = this.getUserMembListFromDeptList(list, 1);
                } 
                
            },

            //获取可以选择的代填的人员列表
            getSubstitudeUserDeptList() {
                if (this.deptMembData.length == 0) {
                    this.http.post("/department/listMyMembs", {},
                        res => {
                            if (res.code == "ok") {
                                let noAllData = JSON.parse(JSON.stringify(res.data));
                                if (noAllData.length > 0) {
                                    if (noAllData[0].label == '全部人员') {
                                        noAllData.splice(0,1);
                                    }
                                }
                                this.setUserToDept(noAllData);
                                this.deptMembData = noAllData;
                            } else {
                                this.$message({
                                    message: res.msg,
                                    type: "error"
                                });
                            }
                        },
                        error => {
                            this.$message({
                                message: error,
                                type: "error"
                            });
                        });
                }
            },
            
            // 获取部门列表
            getDepartment() {
                let day = (this.choseDay+1) > 9 ? "-" + (this.choseDay + 1) : "-0" + (this.choseDay + 1);
                var param = {date:this.date + day};
                if (this.user.manageDeptId != 0) {
                    param.manageDeptId = this.user.manageDeptId;
                }
                this.http.post("/report/getMembList", param,
                res => {
                    if (res.code == "ok") {
                        var list = res.data , list1 = JSON.parse(JSON.stringify(res.data));
                        // let noAllData = JSON.parse(JSON.stringify(res.data));
                        if (this.user.role > 0) {
                            list.splice(0,0,{
                                id: -1,
                                label: '全部人员',
                            })
                        }
                       
                        this.membCount = 0;
                        //设置员工到部门下面
                        this.setUserToDept(list);
                        this.data = list;
                        this.allData = list;
                        
                        // if (noAllData.length > 0) {
                        //     if (noAllData[0].label == '全部人员') {
                        //         noAllData.splice(0,1);
                        //     }
                        // }
                        // this.setUserToDept(noAllData);
                        // this.deptMembData = noAllData;

                        this.option = this.changeArr(list1);
                        list[0].membCount = this.membCount;
                        if (this.depData.id == -1) {
                            this.depData.membCount = this.membCount;
                            this.unFillList = this.getUserMembListFromDeptList(this.data, 0);
                            this.fillList = this.getUserMembListFromDeptList(this.data, 1);
                        } else {
                            if (this.depData.isUser == null) {
                                var dep = this.findTargetDept(this.data, this.depData.id);
                                var membDeptList = [];
                                membDeptList.push(dep);
                                this.unFillList = this.getUserMembListFromDeptList(membDeptList, 0);
                                this.fillList = this.getUserMembListFromDeptList(membDeptList, 1);
                            }
                        }
                        if (this.depData.isUser == null) {
                            if (this.isFill) {
                                this.fillMembList = this.fillList;
                            } else {
                                this.fillMembList = this.unFillList;
                            }
                        }
                        
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        });
                    }
                },
                error => {
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });

                this.getReportFillStatus();
            },

            findTargetDept(list, deptId) {
                var t = null;
                for (var i=0;i<list.length; i++) {
                    if (list[i].isUser == null && list[i].id == deptId) {
                        t = list[i];
                        break;
                    }
                }
                if (t == null) {
                    for (var i=0;i<list.length; i++) {
                        if (list[i].children != null && list[i].children.length > 0) {
                            t = this.findTargetDept(list[i].children, deptId);
                            if (t != null) {
                                break;
                            }
                        }
                    }
                }
                return t;
            },

            getUserMembListFromDeptList(list, isFill) {
                var membList = [];
                for (var i in list) {
                    var deptName = list[i].label;
                    if (list[i].userList != null) {
                        list[i].userList.forEach(element => {
                            if (isFill == 0) {
                                //获取未填的
                                if (element.state == null) {
                                    var obj = {id: element.id, label:element.name, deptId:element.departmentId, deptName: deptName};
                                    membList.push(obj);
                                }
                            } else {
                                if (element.state != null) {
                                    var obj = {id: element.id, label:element.name, deptId:element.departmentId, deptName: deptName};
                                    membList.push(obj);
                                }
                            }
                            
                        });
                    }

                    if (list[i].children != null) {
                        membList = membList.concat(this.getUserMembListFromDeptList(list[i].children, isFill));
                    }
                }

                return membList;
            },

            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;
                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() {
                this.getAllDate();
                this.getReportList();
                this.getDepartment();
                
            },

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

            // 获取日期列表
            getAllDate() {
                var dayArry = [];
                var day = this.getCountDays();
                let curMonthDay = null;
                for (var k = 1; k <= day; k++) {
                    var str = new Date(this.date.replace(/-/g, "/")+'/01').getMonth() + 1 + "月" + k+'日';
                    var showStr = new Date(this.date.replace(/-/g, "/")+'/01').getMonth() + 1+'.'+k;
                    if ( new Date(this.date.replace(/-/g, "/")+'/01').getFullYear() == new Date(new Date()).getFullYear() &&
                    new Date(this.date.replace(/-/g, "/")+'/01').getMonth() == new Date(new Date()).getMonth()) {
                        if(sessionStorage.msg) {
                            if(parseInt(sessionStorage.msg.split("-")[2]) == k) {
                                this.choseDay = k - 1;
                                curMonthDay = str;
                            }
                        } else {
                            if (new Date().getDate() == k) {
                                this.choseDay = k - 1;
                            }   
                        }
                    } else {
                        this.choseDay = 0;
                    }
                    var curDateStr = (this.date +'-'+ (k<10?('0'+k):k));
                    var curDateTime = util.formatDate.parse(curDateStr, 'yyyy-MM-dd');
                    dayArry.push({date:str, weekDay:this.weekDay[curDateTime.getDay()], showDate:showStr});
                }
                this.allDate = dayArry;
                //不能超过最大日期
                if (this.choseDay > day-1) {
                    this.choseDay = day-1;
                }
                //从消息点击跳转过来的，直接加载指定日期
                if (sessionStorage.from == 1 && sessionStorage.msg) {
                    this.curDate = sessionStorage.msg;
                    sessionStorage.from = 0;
                } else {
                    if (curMonthDay != null) {
                        this.curDate = curMonthDay;
                    } else {
                        var d = new Date(this.date.replace(/-/g, "/")+'/01')
                        this.curDate = (d.getMonth()+1)+'月'+d.getDate()+'日';  
                    }
                }
                this.getReportFillStatus();
            },

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

            //获取日报列表
            getReportList() {
                this.listLoading = true;
                let day = (this.choseDay + 1) > 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() {
                this.listLoading = true;
                var param = {};
                if (this.exportParam.dateRange != null) {
                    param = {startDate:this.exportParam.dateRange[0], endDate: this.exportParam.dateRange[1]};
                }
                if (this.exportParam.projectId != null) {
                    param.projectId = this.exportParam.projectId;
                }
                this.http.post( this.port.report.export, param,
                res => {
                    this.listLoading = false;
                    if (res.code == "ok") {
                        location.href = res.data;
                        this.exportDialog = false;
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        });
                    }
                },
                error => {
                    this.listLoading = false;
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },

            //获取项目列表
            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() {
                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) {
                                var flg = null
                                list.report[i].isOvertime == 1 ? flg = true : flg = false
                                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,
                                    subProjectList: list.report[i].subProjectList,
                                    taskList: list.report[i].taskList,
                                    subProjectId: list.report[i].subProjectId,
                                    taskId: list.report[i].taskId,
                                    // startTime: `Fri May 16 2021 ${list.report[i].startTime}:12 GMT+0800 (中国标准时间)`,
                                    startTime: list.report[i].startTime,
                                    // endTime: `Fri May 16 2021 ${list.report[i].endTime}:12 GMT+0800 (中国标准时间)`,
                                    endTime: list.report[i].endTime,
                                    isOvertime: flg,
                                    progress:list.report[i].progress,
                                    professionProgress: list.report[i].professionProgressList
                                })
                                if (list.report[i].state >= 2) {
                                    this.canEdit = true;
                                }
                            }
                            this.workForm = {
                                createDate: this.workForm.createDate,
                                domains: arr,
                                userNames:null,
                                userId:null,
                            }
                        } else {
                            this.workForm = {
                                createDate: this.workForm.createDate,
                                domains: [{
                                    id: null,
                                    projectId: "",
                                    workingTime: this.reportTimeType.type==3?(this.reportTimeType.allday).toFixed(1):"",
                                    content: "",
                                    progress:100,
                                    state: 2,
                                    timeType:0,
                                }],
                                userId:null,
                                userNames:null,
                            }
                            this.canEdit = true;
                        }
                    } else {
                        this.$message({
                            message: res.msg,
                            type: "error"
                        });
                    }
                },
                error => {
                    this.$message({
                        message: error,
                        type: "error"
                    });
                });
            },

            // 打开日报填写
            fillInReport(i, isBatch) {
                if (this.isSubstitude) {
                    this.getSubstitudeUserDeptList();
                }
                if(i == -1) {
                    this.isDisable = false;
                } else {
                    this.isDisable = true;
                }
                let day = (this.choseDay + 1) > 9 ? "-" + (this.choseDay + 1) : "-0" + (this.choseDay + 1);
                this.isBatch = isBatch;
                if (this.isBatch == 0) {
                    this.workForm.createDate = this.date + day; // 获取个人某天的日报
                    this.getReport(i);
                } else {
                    this.workForm = {
                                createDate: null,//批量填报没有日期
                                domains: [{
                                    id: null,
                                    projectId: "",
                                    workingTime: this.reportTimeType.type==3?(this.reportTimeType.allday).toFixed(1):"",
                                    content: "",
                                    progress:100,
                                    state: 2,
                                    timeType:0,
                                }],
                            }
                    this.canEdit = true;
                }
                
                this.dialogVisible = true;
                
            },

            // 添加模块
            addDomain() {
                var leftProgress = 10;
                if (this.reportTimeType.type == 3) {
                    //计算已经待分配工时比例
                    let array = this.workForm.domains;
                    let totalProgress = 0;
                    for (var i=0;i<array.length; i++) {
                        totalProgress += array[i].progress;
                    }
                    if (totalProgress < 100) {
                        leftProgress = 100 - totalProgress;
                    }
                }
                this.workForm.domains.push({
                        projectId: "",
                        workingTime: this.reportTimeType.type == 3?(leftProgress*this.reportTimeType.allday/100).toFixed(1):"",
                        content: "",
                        progress:leftProgress,
                        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() {
                if (this.isBatch == 0) {
                    //只有按天填报才能获取当天的日报
                    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;
                            }
                        } else if (this.reportTimeType.type == 3) {
                            //总百分比不能超过100%
                            let total = 0;
                            this.workForm.domains.forEach(w=>{total += w.progress});
                            if (total > 100) {
                                this.$message({
                                        message: "用时比例之和不能超过100%",
                                        type: "error"
                                    });
                                return;
                            } else if (total < 100) {
                                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);
                            }
                            if (this.workForm.domains[i].taskId != null) {
                                formData.append("taskId", this.workForm.domains[i].taskId);
                            } else {
                                formData.append("taskId", 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("endTime", this.workForm.domains[i].endTime);
                                formData.append("startTime", this.workForm.domains[i].startTime);
                            } else if (this.reportTimeType.type == 3) {
                                //按比例分配
                                formData.append("progress", this.workForm.domains[i].progress);
                                formData.append("workingTime", this.workForm.domains[i].workingTime);
                            }
                            
                            
                            if (this.workForm.domains[i].content == null || this.workForm.domains[i].content == '') {
                                formData.append("content", '-');
                            } else {
                                formData.append("content", this.workForm.domains[i].content);
                            }
                            if (this.isBatch == 0) {
                                formData.append("createDate", this.workForm.createDate);
                            } else {
                                //批量填报，时间范围
                                formData.append("createDate", this.workForm.createDate[0]+'@'+this.workForm.createDate[1]);
                            }
                            
                            if(this.workForm.domains[i].isOvertime == undefined ) {
                                this.workForm.domains[i].isOvertime = '0'
                                formData.append("isOvertime", this.workForm.domains[i].isOvertime);
                            } else if (this.workForm.domains[i].isOvertime == false){
                                this.workForm.domains[i].isOvertime = '0'
                                formData.append("isOvertime", this.workForm.domains[i].isOvertime);
                            } else {
                                this.workForm.domains[i].isOvertime = '1'
                                formData.append("isOvertime", this.workForm.domains[i].isOvertime);
                            }
                            
                            if (this.workForm.userId != null) {
                                var targetUids = '';
                                this.workForm.userId.forEach(u=>{
                                    targetUids += u + '@';
                                });
                                if (targetUids.length > 0) {
                                    targetUids = targetUids.substring(0, targetUids.length -1);
                                    formData.append("targetUids", targetUids);
                                }
                            }
                            //项目专业进度
                            if (this.workForm.domains[i].professionProgress != null) {
                                var m = JSON.stringify(this.workForm.domains[i].professionProgress);
                                
                                m = m.replace(/,/g,"@");//replaceAll(',','@');企业微信不兼容replaceAll
                                
                                formData.append("professionProgress", m);
                            } else {
                                formData.append("professionProgress", "[]");
                            }
                        }
                        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"
                            });
                        });
                    }
                });
            },
            cli() {
                
            },
            // 跳转
            junpToDeskTop(id) {
                let day = (this.choseDay + 1) > 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 + 1) > 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+1) > 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;
            this.tableHeight = height - 178;
            const that = this;
            window.onresize = function temp() {
                that.tableHeight = window.innerHeight - 178;
            };

        },
        mounted() {
            var now = new Date();
            var t = util.formatDate.format(now, 'yyyy-MM-dd');
            var startStr = util.formatDate.format(new Date(), 'yyyy-MM') + "-01";
            this.exportParam.dateRange = [startStr,t];
            this.getAllDate();
            this.getReportList();
            this.getProjectList();
            this.getTimeType();
            this.getDepartment();
            this.scrollFunction()
        }
    };
</script>

<style lang="scss" scoped>
.waiting {
    color:orange;
}
.filledReportStyle {
    color:#32CD32;

}
.RejectStyle {
    color:red;
}
    .allDaily {
        width:82%;
    }
    .report_title {
        padding:10px 0;
        color:#666;
    }
    .clearfix {
        overflow-x: auto;
        white-space: nowrap;
        padding: 15px 0;
        // overflow-y: hidden;
        .date_item {
            padding: 0 3px;
            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>

<style lang="scss" scoped>
    // 加班样式
    .overtime {
        display: inline-block;
        margin-left: 20px;

        input {
            display: inline-block;
            margin-top: 5px;
        }
    }
    .plus {
        display: inline-block;
    }
    // .tages {
    //     float: right;
    // }
    .overtime {
        display: inline-block;
        margin-left: 30px;
    }
    
</style>