zzyuan
/
gz-att-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

日、月报表导出

This commit is contained in:
lSun 2024-12-24 19:25:19 +08:00
parent 73ac8490cb
commit 95944640d9
5 changed files with 968 additions and 756 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/api/report/attReport.js
View File

@ -82,4 +82,14 @@ export function getAttCountList(query) {
}) })
} }
// 导出
export function exportOutCountList(query) {
return request({
url: '/system/export/exportAttWorkOut',
method: 'get',
responseType: 'blob',
params: query
})
}

4
src/api/report/monthReport.js
View File

@ -9,7 +9,7 @@ export function getMonthAttReport(query) {
params: query params: query
}) })
} }
// 导出 // 导出
export function exportMonthReport(query) { export function exportMonthReport(query) {
return request({ return request({
@ -18,4 +18,4 @@ export function exportMonthReport(query) {
responseType: 'blob', responseType: 'blob',
params: query params: query
}) })
} }

24
src/views/report/attReport/index.vue
View File

@ -200,7 +200,7 @@
<el-dialog :title="title" :visible.sync="showOutCount" width="1200px" height="1000px" append-to-body > <el-dialog :title="title" :visible.sync="showOutCount" width="1200px" height="1000px" append-to-body >
<el-form :model="queryRecord" ref="queryFormRecord" size="small" :inline="true" v-show="showSearch" label-width="110px"> <el-form :model="queryRecord" ref="queryFormRecord" size="small" :inline="true" v-show="showSearch" label-width="110px">
<el-form-item> <el-form-item>
<!-- <el-button type="warning" icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>--> <el-button type="warning" icon="el-icon-download" size="mini" @click="handleExportOutCountList">导出</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
@ -266,7 +266,16 @@
</template> </template>
<script> <script>
import { getDetailsList,updateAttDetails,exportAttRecord,synchronous,listDept,getOutCountList,getAttCountList } from "@/api/report/attReport"; import {
getDetailsList,
updateAttDetails,
exportAttRecord,
synchronous,
listDept,
getOutCountList,
getAttCountList,
exportOutCountList
} from "@/api/report/attReport";
import Treeselect from "@riophae/vue-treeselect"; import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css"; import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import {checkPersonAssignment} from "@/api/system/userInfo"; import {checkPersonAssignment} from "@/api/system/userInfo";
@ -565,6 +574,17 @@
}); });
}, },
/** 导出按钮操作 */
handleExportOutCountList() {
exportOutCountList(this.queryRecord).then(res => {
this.downloadFile({
fileName: `工作时间外出次数记录_${new Date().getTime()}.xlsx`,
fileData: res,
fileType: 'application/vnd.ms-excel;charset=utf-8'
})
})
},
} }
}; };
</script> </script>

826
src/views/report/dayReport/index.vue
View File

@ -1,398 +1,486 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="日期"> <el-form-item label="日期">
<el-date-picker <el-date-picker
v-model="dateRange" v-model="dateRange"
style="width: 240px" style="width: 240px"
value-format="yyyy-MM-dd" value-format="yyyy-MM-dd"
type="daterange" type="daterange"
range-separator="-" range-separator="-"
start-placeholder="开始日期" start-placeholder="开始日期"
end-placeholder="结束日期" end-placeholder="结束日期"
></el-date-picker> ></el-date-picker>
</el-form-item> </el-form-item>
<!-- <el-form-item label="部门" prop="orgId"> <!-- <el-form-item label="部门" prop="orgId">
<treeselect v-model="queryParams.orgId" :options="deptOptions" :normalizer="normalizer" @select="handleSelect" placeholder="选择部门" style="width: 240px"/> <treeselect v-model="queryParams.orgId" :options="deptOptions" :normalizer="normalizer" @select="handleSelect" placeholder="选择部门" style="width: 240px"/>
</el-form-item> </el-form-item>
<el-form-item label="姓名" prop="userName"> <el-form-item label="姓名" prop="userName">
<el-input <el-input
v-model="queryParams.userName" v-model="queryParams.userName"
placeholder="请输入姓名" placeholder="请输入姓名"
clearable clearable
style="width: 240px" style="width: 240px"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> --> </el-form-item> -->
<el-form-item>
<el-form-item> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> </el-form-item>
</el-form-item> </el-form>
</el-form>
<el-row :gutter="10" class="mb8">
<el-row :gutter="10" class="mb8"> <el-col :span="1.5">
<el-col :span="1.5"> <el-button
<el-button type="warning"
type="warning" plain
plain icon="el-icon-download"
icon="el-icon-download" size="mini"
size="mini" @click="handleExport"
@click="handleExport" >导出
>导出</el-button> </el-button>
</el-col> </el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row> </el-row>
<el-table v-loading="loading" :data="typeList" @selection-change="handleSelectionChange"> <el-table v-loading="loading" :data="typeList" @selection-change="handleSelectionChange">
<!-- <el-table-column type="selection" width="55" align="center" /> --> <!-- <el-table-column type="selection" width="55" align="center" /> -->
<el-table-column label="序号" align="center" width="80" type="index"> <el-table-column label="序号" align="center" width="80" type="index">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}</span> <span>{{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="考勤日期" align="center" prop="attCurrentDay" /> <el-table-column label="考勤日期" align="center" prop="attCurrentDay"/>
<el-table-column label="正常打卡人数" align="center" prop="normalNum"> <el-table-column label="正常打卡人数" align="center" prop="normalNum">
<template slot-scope="scope"> <template slot-scope="scope">
<div <div
@click="openRecord(scope.row,title1)" style="color: #02a7f0; cursor: pointer"> @click="openRecord(scope.row,title1)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.normalNum}} {{ scope.row.normalNum }}
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="迟到人数" align="center" prop="lateNum"> <el-table-column label="迟到人数" align="center" prop="lateNum">
<template slot-scope="scope"> <template slot-scope="scope">
<div <div
@click="openRecord(scope.row,title2)" style="color: #02a7f0; cursor: pointer"> @click="openRecord(scope.row,title2)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.lateNum}} {{ scope.row.lateNum }}
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="早退人数" align="center" prop="earlyNum"> <el-table-column label="早退人数" align="center" prop="earlyNum">
<template slot-scope="scope"> <template slot-scope="scope">
<div <div
@click="openRecord(scope.row,title3)" style="color: #02a7f0; cursor: pointer"> @click="openRecord(scope.row,title3)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.earlyNum}} {{ scope.row.earlyNum }}
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="旷工人数" align="center" prop="skippingNum"> <el-table-column label="旷工人数" align="center" prop="skippingNum">
<template slot-scope="scope"> <template slot-scope="scope">
<div <div
@click="openRecord(scope.row,title4)" style="color: #02a7f0; cursor: pointer"> @click="openRecord(scope.row,title4)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.skippingNum}} {{ scope.row.skippingNum }}
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="请假人数" align="center" prop="leaveNum"> <el-table-column label="请假人数" align="center" prop="leaveNum">
<template slot-scope="scope"> <template slot-scope="scope">
<div <div
@click="openRecord(scope.row,title7)" style="color: #02a7f0; cursor: pointer"> @click="openRecord(scope.row,title7)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.leaveNum}} {{ scope.row.leaveNum }}
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="打卡地异常人数" align="center" prop="addressErrorNum"> <el-table-column label="打卡地异常人数" align="center" prop="addressErrorNum">
<template slot-scope="scope"> <template slot-scope="scope">
<div <div
@click="openRecord(scope.row,title5)" style="color: #02a7f0; cursor: pointer"> @click="openRecord(scope.row,title5)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.addressErrorNum}} {{ scope.row.addressErrorNum }}
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="出入异常人数" align="center" prop="einErrorNum"> <el-table-column label="出入异常人数" align="center" prop="einErrorNum">
<template slot-scope="scope"> <template slot-scope="scope">
<div <div
@click="openRecord(scope.row,title6)" style="color: #02a7f0; cursor: pointer"> @click="openRecord(scope.row,title6)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.einErrorNum}} {{ scope.row.einErrorNum }}
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="轮休人数" align="center" prop="restNum"> <el-table-column label="轮休人数" align="center" prop="restNum">
<template slot-scope="scope"> <template slot-scope="scope">
<div <div
@click="openRecord(scope.row,title8)" style="color: #02a7f0; cursor: pointer"> @click="openRecord(scope.row,title8)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.restNum}} {{ scope.row.restNum }}
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="临时外出人数" align="center" prop="outNum"> <el-table-column label="临时外出人数" align="center" prop="outNum">
<template slot-scope="scope"> <template slot-scope="scope">
<div <div
@click="openRecord(scope.row,title9)" style="color: #02a7f0; cursor: pointer"> @click="openRecord(scope.row,title9)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.outNum}} {{ scope.row.outNum }}
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<pagination <pagination
v-show="total>0" v-show="total>0"
:total="total" :total="total"
:page.sync="queryParams.pageNum" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" :limit.sync="queryParams.pageSize"
@pagination="getList" @pagination="getList"
/> />
<el-dialog :title="title" :visible.sync="open" width="1300px" append-to-body> <el-dialog :title="title" :visible.sync="open" width="1300px" append-to-body>
<el-form ref="dialogQueryForm" :model="dialogQueryForm" :inline="true" size="small" label-width="80px"> <el-form ref="dialogQueryForm" :model="dialogQueryForm" :inline="true" size="small" label-width="80px">
<el-form-item label="姓名" prop="userName"> <el-form-item label="姓名" prop="userName">
<el-input <el-input
v-model="dialogQueryForm.userName" v-model="dialogQueryForm.userName"
placeholder="请输入姓名" placeholder="请输入姓名"
clearable clearable
style="width: 200px" style="width: 200px"
@keyup.enter.native="handleQuery" @keyup.enter.native="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleDialogQuery">搜索</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleDialogQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetDialogQuery">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetDialogQuery">重置</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-table v-loading="loading" :data="dialogList" width="1000px" height = "500px"> <el-table v-loading="loading" :data="dialogList" width="1000px" height="500px">
<el-table-column label="序号" type="index" width="55" align="center"> <el-table-column label="序号" type="index" width="55" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ (dialogQueryForm.pageNum - 1) * dialogQueryForm.pageSize + scope.$index + 1 }}</span> <span>{{ (dialogQueryForm.pageNum - 1) * dialogQueryForm.pageSize + scope.$index + 1 }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="姓名" align="center" prop="userName" /> <el-table-column label="姓名" align="center" prop="userName"/>
<el-table-column label="所属部门" align="center" prop="orgName" :show-overflow-tooltip="true" /> <el-table-column label="所属部门" align="center" prop="orgName" :show-overflow-tooltip="true"/>
<el-table-column label="上班打卡时间" align="center" prop="toWorkAttCurrentTime" width="180"></el-table-column> <el-table-column label="工作时间外出次数" align="center" prop="normalNum" width="180">
<el-table-column label="上班状态" align="center" prop="toWorkAttStatus"> <template slot-scope="scope">
<template slot-scope="scope"> <div
<dict-tag :options="dict.type.att_status" :value="scope.row.toWorkAttStatus"/> @click="openOutCountList(scope.row)" style="color: #02a7f0; cursor: pointer">
</template> {{ scope.row.outCount }}
</el-table-column> </div>
<el-table-column label="打卡地址" align="center" prop="toWorkAttAddress" :show-overflow-tooltip="true" /> </template>
<el-table-column label="下班打卡时间" align="center" prop="offWorkAttCurrentTime" width="180"></el-table-column> </el-table-column>
<el-table-column label="下班状态" align="center" prop="offWorkAttStatus"> <el-table-column label="上班打卡时间" align="center" prop="toWorkAttCurrentTime" width="180"></el-table-column>
<template slot-scope="scope"> <el-table-column label="上班状态" align="center" prop="toWorkAttStatus">
<dict-tag :options="dict.type.att_status" :value="scope.row.offWorkAttStatus"/> <template slot-scope="scope">
</template> <dict-tag :options="dict.type.att_status" :value="scope.row.toWorkAttStatus"/>
</el-table-column> </template>
<el-table-column label="打卡地址" align="center" prop="offWorkAttAddress" :show-overflow-tooltip="true" /> </el-table-column>
</el-table> <el-table-column label="打卡地址" align="center" prop="toWorkAttAddress" :show-overflow-tooltip="true"/>
<el-table-column label="下班打卡时间" align="center" prop="offWorkAttCurrentTime" width="180"></el-table-column>
<el-table-column label="下班状态" align="center" prop="offWorkAttStatus">
<template slot-scope="scope">
<dict-tag :options="dict.type.att_status" :value="scope.row.offWorkAttStatus"/>
</template>
</el-table-column>
<el-table-column label="打卡地址" align="center" prop="offWorkAttAddress" :show-overflow-tooltip="true"/>
</el-table>
<pagination <pagination
v-show="dialogTotal>0" v-show="dialogTotal>0"
:total="dialogTotal" :total="dialogTotal"
:page.sync="dialogQueryForm.pageNum" :page.sync="dialogQueryForm.pageNum"
:limit.sync="dialogQueryForm.pageSize" :limit.sync="dialogQueryForm.pageSize"
@pagination="getDialogList" @pagination="getDialogList"
/> />
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" @click="cancel">确 定</el-button> <el-button type="primary" @click="cancel">确 定</el-button>
<el-button @click="cancel">取 消</el-button> <el-button @click="cancel">取 消</el-button>
</div> </div>
</el-dialog> </el-dialog>
</div> <!-- 外出次数查询 -->
</template> <el-dialog :title="title" :visible.sync="showOutCount" width="1200px" height="1000px" append-to-body >
<el-form :model="queryRecord" ref="queryFormRecord" size="small" :inline="true" v-show="showSearch" label-width="110px">
<script> <el-form-item>
// import { getDetail} from "@/api/report/monthlyError"; <el-button type="warning" icon="el-icon-download" size="mini" @click="handleExportOutCountList">导出</el-button>
import { getdayAttReport,getAttDayReportDetailsList,exportDayReport } from "@/api/report/dayReport"; </el-form-item>
import { listDept } from "@/api/system/dept"; </el-form>
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css"; <el-table v-loading="loadingTwo" :data="tableDataOutCount" width="900px" height = "600px" row-key="id">
export default { <el-table-column label="序号" align="center" width="80" type="index">
name: "Dict", <template slot-scope="scope">
dicts: ['att_status'], <span>{{ (queryRecord.pageNum - 1) * queryRecord.pageSize + scope.$index + 1 }}</span>
components: { Treeselect }, </template>
data() { </el-table-column>
<el-table-column label="考勤日期" align="center" prop="attCurrentDay" width="180" :show-overflow-tooltip="true">
<template slot-scope="scope">
<span>{{ formatDate(scope.row.attCurrentDay) }}</span>
</template>
</el-table-column>
<el-table-column label="打卡时间" align="center" prop="attCurrentTime" width="140" sortable/>
<el-table-column label="打卡地址" align="center" prop="attAddress" sortable/>
</el-table>
<pagination
v-show="totalTwo>0"
:total="totalTwo"
:page.sync="queryRecord.pageNum"
:limit.sync="queryRecord.pageSize"
@pagination="getOutCountList"
/>
</el-dialog>
</div>
</template>
<script>
// import { getDetail} from "@/api/report/monthlyError";
import {getdayAttReport, getAttDayReportDetailsList, exportDayReport} from "@/api/report/dayReport";
import {listDept} from "@/api/system/dept";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import {exportOutCountList, getOutCountList} from "@/api/report/attReport";
export default {
name: "Dict",
dicts: ['att_status'],
components: {Treeselect},
data() {
return {
// 遮罩层
loading: false,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 字典表格数据
typeList: [],
// 弹出层标题
title: "",
title1: "打卡记录",
title2: "迟到记录",
title3: "早退记录",
title4: "旷工记录",
title5: "打卡地异常记录",
title6: "出入异常记录",
title7: "请假记录",
title8: "轮休记录",
title9: "临时外出记录",
// 是否显示弹出层
open: false,
dialogQueryForm: {
pageNum: 1,
pageSize: 10,
userName: undefined
},
dialogList: [],
dialogTotal: 0,
// 日期范围
dateRange: [],
deptOptions: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
userName: undefined,
orgId: undefined,
orgName: undefined,
},
queryRecord: {
pageNum: 1,
pageSize: 10,
userId: undefined,
attCurrentDay: undefined,
userName: undefined,
},
showOutCount:false,
totalTwo: 0,
// 遮罩层
loadingTwo: false,
tableDataOutCount: [],
};
},
created() {
this.getDeptList();
this.getWeekDates();
this.getList();
},
methods: {
getWeekDates() {
const now = new Date();
const dayOfWeek = now.getDay();
const dayOffset = dayOfWeek === 0 ? -6 : 1 - dayOfWeek;
const monday = new Date(now);
monday.setDate(monday.getDate() + dayOffset);
const sunday = new Date(monday);
sunday.setDate(sunday.getDate() + 6);
this.dateRange[0] = monday.toISOString().split('T')[0];
this.dateRange[1] = sunday.toISOString().split('T')[0];
},
getDeptList() {
listDept().then(response => {
this.deptOptions = this.handleTree(response.data, "id");
});
},
/** 转换部门数据结构 */
normalizer(node) {
if (node.children && !node.children.length) {
delete node.children;
}
return { return {
// 遮罩层 id: node.id,
loading: false, label: node.orgName,
// 选中数组 children: node.children
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 字典表格数据
typeList: [],
// 弹出层标题
title: "",
title1: "打卡记录",
title2: "迟到记录",
title3: "早退记录",
title4: "旷工记录",
title5: "打卡地异常记录",
title6: "出入异常记录",
title7: "请假记录",
title8: "轮休记录",
title9: "临时外出记录",
// 是否显示弹出层
open: false,
dialogQueryForm:{
pageNum: 1,
pageSize: 10,
userName:undefined
},
dialogList:[],
dialogTotal: 0,
// 日期范围
dateRange: [],
deptOptions: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
userName: undefined,
orgId: undefined,
orgName: undefined,
},
}; };
}, },
created() { handleSelect(value, instanceId) {
this.getDeptList(); console.log('Selected:', value);
this.getWeekDates(); // 在这里处理选择事件
this.queryParams.orgName = value.orgName;
},
/** 查询字典类型列表 */
getList() {
this.loading = true;
console.log(this.dateRange)
if (this.dateRange && this.dateRange.length > 0) {
this.queryParams.startDate = this.dateRange[0]
this.queryParams.endDate = this.dateRange[1]
} else {
this.queryParams.startDate = undefined
this.queryParams.endDate = undefined
}
getdayAttReport(this.queryParams).then(response => {
this.typeList = response.rows;
this.total = response.total;
this.loading = false;
}
);
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList(); this.getList();
}, },
methods: { /** 重置按钮操作 */
getWeekDates() { resetQuery() {
const now = new Date(); this.dateRange = [];
const dayOfWeek = now.getDay(); this.getWeekDates();
const dayOffset = dayOfWeek === 0 ? -6 : 1 - dayOfWeek; this.resetForm("queryForm");
this.handleQuery();
const monday = new Date(now); },
monday.setDate(monday.getDate() + dayOffset);
const sunday = new Date(monday);
sunday.setDate(sunday.getDate() + 6);
this.dateRange[0]=monday.toISOString().split('T')[0];
this.dateRange[1]=sunday.toISOString().split('T')[0];
},
getDeptList(){
listDept().then(response => {
this.deptOptions = this.handleTree(response.data, "id");
});
},
/** 转换部门数据结构 */
normalizer(node) {
if (node.children && !node.children.length) {
delete node.children;
}
return {
id: node.id,
label: node.orgName,
children: node.children
};
},
handleSelect(value, instanceId) {
console.log('Selected:', value);
// 在这里处理选择事件
this.queryParams.orgName=value.orgName;
},
/** 查询字典类型列表 */
getList() {
this.loading = true;
console.log(this.dateRange)
if(this.dateRange&&this.dateRange.length>0){
this.queryParams.startDate=this.dateRange[0]
this.queryParams.endDate=this.dateRange[1]
}else{
this.queryParams.startDate=undefined
this.queryParams.endDate=undefined
}
getdayAttReport(this.queryParams).then(response => {
this.typeList = response.rows;
this.total = response.total;
this.loading = false;
}
);
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.dateRange = [];
this.getWeekDates();
this.resetForm("queryForm");
this.handleQuery();
},
//打开详情页面 //打开详情页面
openRecord(row,titleBoss){ openRecord(row, titleBoss) {
this.id = row.id; this.id = row.id;
this.title = titleBoss; this.title = titleBoss;
this.dialogQueryForm.userId = row.userId; this.dialogQueryForm.userId = row.userId;
this.dialogQueryForm.attCurrentDay = row.attCurrentDay; this.dialogQueryForm.attCurrentDay = row.attCurrentDay;
if(titleBoss=='打卡记录'){ if (titleBoss == '打卡记录') {
this.dialogQueryForm.attStatus=1; this.dialogQueryForm.attStatus = 1;
}else if(titleBoss=='迟到记录'){ } else if (titleBoss == '迟到记录') {
this.dialogQueryForm.attStatus=2; this.dialogQueryForm.attStatus = 2;
}else if(titleBoss=='早退记录'){ } else if (titleBoss == '早退记录') {
this.dialogQueryForm.attStatus=4; this.dialogQueryForm.attStatus = 4;
}else if(titleBoss=='旷工记录'){ } else if (titleBoss == '旷工记录') {
this.dialogQueryForm.attStatus=3; this.dialogQueryForm.attStatus = 3;
}else if(titleBoss=='打卡地异常记录'){ } else if (titleBoss == '打卡地异常记录') {
this.dialogQueryForm.attStatus=9; this.dialogQueryForm.attStatus = 9;
}else if(titleBoss=='出入异常记录'){ } else if (titleBoss == '出入异常记录') {
this.dialogQueryForm.attStatus=8; this.dialogQueryForm.attStatus = 8;
}else if(titleBoss=='请假记录'){ } else if (titleBoss == '请假记录') {
this.dialogQueryForm.attStatus=6; this.dialogQueryForm.attStatus = 6;
}else if(titleBoss=='轮休记录'){ } else if (titleBoss == '轮休记录') {
this.dialogQueryForm.attStatus=5; this.dialogQueryForm.attStatus = 5;
}else if(titleBoss=='临时外出记录'){ } else if (titleBoss == '临时外出记录') {
this.dialogQueryForm.attStatus=7; this.dialogQueryForm.attStatus = 7;
} }
this.open = true; this.open = true;
this.resetForm("dialogQueryForm"); this.resetForm("dialogQueryForm");
this.handleDialogQuery(); this.handleDialogQuery();
}, },
// openDialog(){ // openDialog(){
// this.open=true; // this.open=true;
// this.resetForm("dialogQueryForm"); // this.resetForm("dialogQueryForm");
// this.handleQuery(); // this.handleQuery();
// }, // },
cancel(){ cancel() {
this.open=false; this.open = false;
}, },
getDialogList() { getDialogList() {
getAttDayReportDetailsList(this.dialogQueryForm).then(response => { getAttDayReportDetailsList(this.dialogQueryForm).then(response => {
this.dialogList = response.rows; this.dialogList = response.rows;
this.dialogTotal = response.total; this.dialogTotal = response.total;
}); });
}, },
/** 搜索按钮操作 */ /** 搜索按钮操作 */
handleDialogQuery() { handleDialogQuery() {
this.dialogQueryForm.pageNum = 1; this.dialogQueryForm.pageNum = 1;
this.getDialogList(); this.getDialogList();
}, },
/** 重置按钮操作 */ /** 重置按钮操作 */
resetDialogQuery() { resetDialogQuery() {
this.dialogQueryForm.userName="" this.dialogQueryForm.userName = ""
// this.resetForm("dialogQueryForm"); // this.resetForm("dialogQueryForm");
this.handleDialogQuery(); this.handleDialogQuery();
}, },
// 多选框选中数据 // 多选框选中数据
handleSelectionChange(selection) { handleSelectionChange(selection) {
this.ids = selection.map(item => item.dictId) this.ids = selection.map(item => item.dictId)
this.single = selection.length!=1 this.single = selection.length != 1
this.multiple = !selection.length this.multiple = !selection.length
}, },
/** 导出按钮操作 */ /** 导出按钮操作 */
handleExport() { handleExport() {
exportDayReport(this.queryParams).then(res => { exportDayReport(this.queryParams).then(res => {
this.downloadFile({ fileName: `日报表记录_${new Date().getTime()}.xlsx`, fileData: res, fileType: 'application/vnd.ms-excel;charset=utf-8' }) this.downloadFile({
}) fileName: `日报表记录_${new Date().getTime()}.xlsx`,
}, fileData: res,
fileType: 'application/vnd.ms-excel;charset=utf-8'
} })
}; })
</script> },
//打开工作时间外出次数
openOutCountList(row){
this.title = "工作时间外出次数";
this.queryRecord.userId = row.userId;
this.queryRecord.attCurrentDay = row.attCurrentDay;
this.showOutCount = true;
this.getOutCountList();
},
/** 查询工作时间外出次数列表 */
getOutCountList() {
this.loadingTwo = true;
getOutCountList(this.queryRecord).then(response => {
this.tableDataOutCount = response.rows;
this.totalTwo = response.total;
this.loadingTwo = false;
});
},
/** 导出按钮操作 */
handleExportOutCountList() {
exportOutCountList(this.queryRecord).then(res => {
this.downloadFile({
fileName: `工作时间外出次数记录_${new Date().getTime()}.xlsx`,
fileData: res,
fileType: 'application/vnd.ms-excel;charset=utf-8'
})
})
},
}
};
</script>

860
src/views/report/monthReport/index.vue
View File

@ -1,411 +1,505 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="选择月份"> <el-form-item label="选择月份">
<el-date-picker <el-date-picker
v-model="queryParams.month" v-model="queryParams.month"
type="month" value-format="yyyy-MM" type="month" value-format="yyyy-MM"
placeholder="选择月"> placeholder="选择月">
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item label="部门" prop="orgId"> <el-form-item label="部门" prop="orgId">
<treeselect v-model="queryParams.orgId" :options="deptOptions" :normalizer="normalizer" @select="handleSelect" placeholder="选择部门" style="width: 240px"/> <treeselect v-model="queryParams.orgId" :options="deptOptions" :normalizer="normalizer" @select="handleSelect"
</el-form-item> placeholder="选择部门" style="width: 240px"/>
<el-form-item label="姓名" prop="userName"> </el-form-item>
<el-input <el-form-item label="姓名" prop="userName">
v-model="queryParams.userName" <el-input
placeholder="请输入姓名" v-model="queryParams.userName"
clearable placeholder="请输入姓名"
style="width: 240px" clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
>导出</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="typeList">
<!-- <el-table-column type="selection" width="55" align="center" /> -->
<el-table-column label="序号" align="center" width="80" type="index">
<template slot-scope="scope">
<span>{{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}</span>
</template>
</el-table-column>
<el-table-column label="姓名" align="center" prop="userName" />
<el-table-column label="所属部门" align="center" prop="orgName" />
<el-table-column label="应出勤天数" align="center" prop="requiredDays" />
<el-table-column label="正常打卡天数" align="center" prop="normalNum">
<template slot-scope="scope">
<div
@click="openRecord(scope.row,title1)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.normalNum}}
</div>
</template>
</el-table-column>
<el-table-column label="迟到次数" align="center" prop="lateNum">
<template slot-scope="scope">
<div
@click="openRecord(scope.row,title2)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.lateNum}}
</div>
</template>
</el-table-column>
<el-table-column label="早退次数" align="center" prop="earlyNum">
<template slot-scope="scope">
<div
@click="openRecord(scope.row,title3)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.earlyNum}}
</div>
</template>
</el-table-column>
<el-table-column label="旷工次数" align="center" prop="skippingNum">
<template slot-scope="scope">
<div
@click="openRecord(scope.row,title4)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.skippingNum}}
</div>
</template>
</el-table-column>
<el-table-column label="打卡地异常次数" align="center" prop="addressErrorNum">
<template slot-scope="scope">
<div
@click="openRecord(scope.row,title5)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.addressErrorNum}}
</div>
</template>
</el-table-column>
<el-table-column label="出入异常次数" align="center" prop="einErrorNum">
<template slot-scope="scope">
<div
@click="openRecord(scope.row,title6)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.einErrorNum}}
</div>
</template>
</el-table-column>
<el-table-column label="请假天数" align="center" prop="leaveNum">
<template slot-scope="scope">
<div @click="openRecord(scope.row,title7)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.leaveNum}}
</div>
</template>
</el-table-column>
<el-table-column label="轮休天数" align="center" prop="restNum">
<template slot-scope="scope">
<div @click="openRecord(scope.row,title8)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.restNum}}
</div>
</template>
</el-table-column>
<el-table-column label="临时外出天数" align="center" prop="outNum">
<template slot-scope="scope">
<div @click="openRecord(scope.row,title9)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.outNum}}
</div>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 相关记录 -->
<el-dialog :title="title" :visible.sync="showRecord" width="1300px" height="1000px" append-to-body @close="cancelRecord">
<el-form :model="queryRecord" ref="queryFormRecord" size="small" :inline="true" v-show="showSearch" label-width="110px">
<el-form-item label="选择考勤时间段">
<el-date-picker
v-model="dateRange"
style="width: 240px" style="width: 240px"
value-format="yyyy-MM-dd" @keyup.enter.native="handleQuery"
type="daterange" />
range-separator="-" </el-form-item>
start-placeholder="开始日期" <el-form-item>
end-placeholder="结束日期" <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
:picker-options="pickerOptions" <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
></el-date-picker> </el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
>导出
</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="typeList">
<!-- <el-table-column type="selection" width="55" align="center" /> -->
<el-table-column label="序号" align="center" width="80" type="index">
<template slot-scope="scope">
<span>{{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}</span>
</template>
</el-table-column>
<el-table-column label="姓名" align="center" prop="userName"/>
<el-table-column label="所属部门" align="center" prop="orgName"/>
<el-table-column label="应出勤天数" align="center" prop="requiredDays"/>
<el-table-column label="工作时间外出次数" align="center" prop="normalNum" width="180">
<template slot-scope="scope">
<div
@click="openOutCountList(scope.row)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.outCount }}
</div>
</template>
</el-table-column>
<el-table-column label="正常打卡天数" align="center" prop="normalNum">
<template slot-scope="scope">
<div
@click="openRecord(scope.row,title1)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.normalNum }}
</div>
</template>
</el-table-column>
<el-table-column label="迟到次数" align="center" prop="lateNum">
<template slot-scope="scope">
<div
@click="openRecord(scope.row,title2)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.lateNum }}
</div>
</template>
</el-table-column>
<el-table-column label="早退次数" align="center" prop="earlyNum">
<template slot-scope="scope">
<div
@click="openRecord(scope.row,title3)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.earlyNum }}
</div>
</template>
</el-table-column>
<el-table-column label="旷工次数" align="center" prop="skippingNum">
<template slot-scope="scope">
<div
@click="openRecord(scope.row,title4)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.skippingNum }}
</div>
</template>
</el-table-column>
<el-table-column label="打卡地异常次数" align="center" prop="addressErrorNum">
<template slot-scope="scope">
<div
@click="openRecord(scope.row,title5)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.addressErrorNum }}
</div>
</template>
</el-table-column>
<el-table-column label="出入异常次数" align="center" prop="einErrorNum">
<template slot-scope="scope">
<div
@click="openRecord(scope.row,title6)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.einErrorNum }}
</div>
</template>
</el-table-column>
<el-table-column label="请假天数" align="center" prop="leaveNum">
<template slot-scope="scope">
<div @click="openRecord(scope.row,title7)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.leaveNum }}
</div>
</template>
</el-table-column>
<el-table-column label="轮休天数" align="center" prop="restNum">
<template slot-scope="scope">
<div @click="openRecord(scope.row,title8)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.restNum }}
</div>
</template>
</el-table-column>
<el-table-column label="临时外出天数" align="center" prop="outNum">
<template slot-scope="scope">
<div @click="openRecord(scope.row,title9)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.outNum }}
</div>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 相关记录 -->
<el-dialog :title="title" :visible.sync="showRecord" width="1300px" height="1000px" append-to-body
@close="cancelRecord">
<el-form :model="queryRecord" ref="queryFormRecord" size="small" :inline="true" v-show="showSearch"
label-width="110px">
<el-form-item label="选择考勤时间段">
<el-date-picker
v-model="dateRange"
style="width: 240px"
value-format="yyyy-MM-dd"
type="daterange"
range-separator="-"
start-placeholder="开始日期"
end-placeholder="结束日期"
:picker-options="pickerOptions"
></el-date-picker>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQueryRecord">查询</el-button> <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQueryRecord">查询</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetRecord">重置</el-button> <el-button icon="el-icon-refresh" size="mini" @click="resetRecord">重置</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-table :data="tableDataRecord" width="900px" height = "600px" row-key="id"> <el-table :data="tableDataRecord" width="900px" height="600px" row-key="id">
<el-table-column label="序号" align="center" width="80" type="index"> <el-table-column label="序号" align="center" width="80" type="index">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ (queryRecord.pageNum - 1) * queryRecord.pageSize + scope.$index + 1 }}</span> <span>{{ (queryRecord.pageNum - 1) * queryRecord.pageSize + scope.$index + 1 }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="id" align="center" prop="id" v-if="false" /> <el-table-column label="id" align="center" prop="id" v-if="false"/>
<el-table-column label="姓名" align="center" prop="name" width="80" sortable/> <el-table-column label="姓名" align="center" prop="name" width="80" sortable/>
<el-table-column label="所属部门" align="center" prop="orgName" width="150" sortable/> <el-table-column label="所属部门" align="center" prop="orgName" width="150" sortable/>
<el-table-column label="考勤日期" align="center" prop="attCurrent" width="150" sortable>\ <el-table-column label="考勤日期" align="center" prop="attCurrent" width="150" sortable>\
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ formatDate(scope.row.attCurrent) }}</span> <span>{{ formatDate(scope.row.attCurrent) }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="上班打卡时间" align="center" prop="goWorkTime" width="180" sortable/> <el-table-column label="上班打卡时间" align="center" prop="goWorkTime" width="180" sortable/>
<el-table-column label="上班状态" align="center" prop="goWorkStatus" width="100" sortable> <el-table-column label="上班状态" align="center" prop="goWorkStatus" width="100" sortable>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.att_status" :value="scope.row.goWorkStatus"/> <dict-tag :options="dict.type.att_status" :value="scope.row.goWorkStatus"/>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="上班打卡地址" align="center" prop="goWorkAddress" sortable width="180"/> <el-table-column label="上班打卡地址" align="center" prop="goWorkAddress" sortable width="180"/>
<el-table-column label="下班打卡时间" align="center" prop="offWorkTime" width="180" ortable/> <el-table-column label="下班打卡时间" align="center" prop="offWorkTime" width="180" ortable/>
<el-table-column label="下班状态" align="center" prop="offWorkStatus" width="100" sortable> <el-table-column label="下班状态" align="center" prop="offWorkStatus" width="100" sortable>
<template slot-scope="scope"> <template slot-scope="scope">
<dict-tag :options="dict.type.att_status" :value="scope.row.offWorkStatus"/> <dict-tag :options="dict.type.att_status" :value="scope.row.offWorkStatus"/>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="下班打卡地址" align="center" prop="offWorkAddress" width="180" sortable/> <el-table-column label="下班打卡地址" align="center" prop="offWorkAddress" width="180" sortable/>
</el-table> </el-table>
<pagination <pagination
v-show="totalTwo>0" v-show="totalTwo>0"
:total="totalTwo" :total="totalTwo"
:page.sync="queryRecord.pageNum" :page.sync="queryRecord.pageNum"
:limit.sync="queryRecord.pageSize" :limit.sync="queryRecord.pageSize"
@pagination="getListRecord" @pagination="getListRecord"
/> />
</el-dialog> </el-dialog>
</div>
</template>
<script> <!-- 外出次数查询 -->
import { getDetail} from "@/api/report/monthlyError"; <el-dialog :title="title" :visible.sync="showOutCount" width="1200px" height="1000px" append-to-body>
import { getMonthAttReport,exportMonthReport } from "@/api/report/monthReport"; <el-form :model="queryRecordOutCount" ref="queryFormRecord" size="small" :inline="true" v-show="showSearch"
import { listDept } from "@/api/system/dept"; label-width="110px">
import Treeselect from "@riophae/vue-treeselect"; <el-form-item>
import "@riophae/vue-treeselect/dist/vue-treeselect.css"; <el-button type="warning" icon="el-icon-download" size="mini" @click="handleExportOutCountList">导出</el-button>
var monstr=""; </el-form-item>
export default { </el-form>
name: "Dict",
dicts: ['att_status'], <el-table v-loading="loadingTwo" :data="tableDataOutCount" width="900px" height="600px" row-key="id">
components: { Treeselect }, <el-table-column label="序号" align="center" width="80" type="index">
data() { <template slot-scope="scope">
<span>{{ (queryRecordOutCount.pageNum - 1) * queryRecordOutCount.pageSize + scope.$index + 1 }}</span>
</template>
</el-table-column>
<el-table-column label="考勤日期" align="center" prop="attCurrentDay" width="180" :show-overflow-tooltip="true">
<template slot-scope="scope">
<span>{{ formatDate(scope.row.attCurrentDay) }}</span>
</template>
</el-table-column>
<el-table-column label="打卡时间" align="center" prop="attCurrentTime" width="140" sortable/>
<el-table-column label="打卡地址" align="center" prop="attAddress" sortable/>
</el-table>
<pagination
v-show="totalTwoOutCount>0"
:total="totalTwoOutCount"
:page.sync="queryRecord.pageNum"
:limit.sync="queryRecord.pageSize"
@pagination="getOutCountList"
/>
</el-dialog>
</div>
</template>
<script>
import {getDetail} from "@/api/report/monthlyError";
import {getMonthAttReport, exportMonthReport} from "@/api/report/monthReport";
import {listDept} from "@/api/system/dept";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import {getOutCountList,exportOutCountList} from "@/api/report/attReport";
var monstr = "";
export default {
name: "Dict",
dicts: ['att_status'],
components: {Treeselect},
data() {
return {
// 遮罩层
loading: false,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 字典表格数据
typeList: [],
// 弹出层标题
title: "",
title1: "打卡记录",
title2: "迟到记录",
title3: "早退记录",
title4: "旷工记录",
title5: "打卡地异常记录",
title6: "出入异常记录",
title7: "请假记录",
title8: "轮休记录",
title9: "临时外出记录",
// 是否显示弹出层
open: false,
showRecord: false,
dateRange: [],
attCurrentMonth: "",
pickerOptions: {
disabledDate: this.disabledDate,
},
queryRecord: {
pageNum: 1,
pageSize: 10,
userId: undefined,
attStatis: undefined,
attCurrentMonth: undefined
},
tableDataRecord: [],
totalTwo: 0,
dialogQueryForm: {
pageNum: 1,
pageSize: 10,
},
dialogList: [],
dialogTotal: 0,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
month: undefined,
userName: undefined,
orgId: undefined,
orgName: undefined,
},
deptOptions: [],
queryRecordOutCount: {
pageNum: 1,
pageSize: 10,
userId: undefined,
attCurrentDay: undefined,
userName: undefined,
},
showOutCount: false,
totalTwoOutCount: 0,
// 遮罩层
loadingTwo: false,
tableDataOutCount: [],
};
},
created() {
this.getDeptList();
this.getMonth();
this.getList();
},
methods: {
formatDate(dateString) {
const date = new Date(dateString); // 创建日期对象
const year = date.getFullYear(); // 获取年份
const month = String(date.getMonth() + 1).padStart(2, '0'); // 获取月份（注意：月份从0开始）
const day = String(date.getDate()).padStart(2, '0'); // 获取日期
const weekdays = ['星期天', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']; // 星期几数组
const weekday = weekdays[date.getDay()]; // 获取星期几
return `${year}-${month}-${day} ${weekday}`; // 组合成所需格式
},
getMonth() {
// 默认当月
var nowDate = new Date();
var date = {
year: nowDate.getFullYear(),
month: nowDate.getMonth() + 1,
day: nowDate.getDate()
};
const dayDate = date.year + "-" + (date.month >= 10 ? date.month : "0" + date.month);
this.$set(this.queryParams, "month", dayDate.toString());
},
getDeptList() {
listDept().then(response => {
this.deptOptions = this.handleTree(response.data, "id");
});
},
/** 转换部门数据结构 */
normalizer(node) {
if (node.children && !node.children.length) {
delete node.children;
}
return { return {
// 遮罩层 id: node.id,
loading: false, label: node.orgName,
// 选中数组 children: node.children
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 字典表格数据
typeList: [],
// 弹出层标题
title: "",
title1: "打卡记录",
title2: "迟到记录",
title3: "早退记录",
title4: "旷工记录",
title5: "打卡地异常记录",
title6: "出入异常记录",
title7: "请假记录",
title8: "轮休记录",
title9: "临时外出记录",
// 是否显示弹出层
open: false,
showRecord:false,
dateRange: [],
attCurrentMonth:"",
pickerOptions: {
disabledDate: this.disabledDate,
},
queryRecord: {
pageNum: 1,
pageSize: 10,
userId: undefined,
attStatis: undefined,
attCurrentMonth:undefined
},
tableDataRecord: [],
totalTwo: 0,
dialogQueryForm:{
pageNum: 1,
pageSize: 10,
},
dialogList:[],
dialogTotal: 0,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
month: undefined,
userName: undefined,
orgId: undefined,
orgName: undefined,
},
deptOptions: [],
}; };
}, },
created() { handleSelect(value, instanceId) {
this.getDeptList(); console.log('Selected:', value);
this.getMonth(); // 在这里处理选择事件
this.queryParams.orgName = value.orgName;
},
/** 查询字典类型列表 */
getList() {
this.loading = true;
console.log(this.queryParams)
getMonthAttReport(this.queryParams).then(response => {
this.typeList = response.rows;
this.total = response.total;
this.loading = false;
}
);
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList(); this.getList();
}, },
methods: { /** 重置按钮操作 */
resetQuery() {
this.getMonth()
this.resetForm("queryForm");
this.handleQuery();
},
//打开月异常详情页面
openRecord(row, titleBoss) {
this.id = row.id;
this.title = titleBoss;
this.queryRecord.userId = row.userId;
this.queryRecord.attCurrentMonth = row.attCurrentMonth;
this.attCurrentMonth = row.attCurrentMonth;
if (titleBoss == '打卡记录') {
this.queryRecord.attStatis = 1;
} else if (titleBoss == '迟到记录') {
this.queryRecord.attStatis = 2;
} else if (titleBoss == '早退记录') {
this.queryRecord.attStatis = 4;
} else if (titleBoss == '旷工记录') {
this.queryRecord.attStatis = 3;
} else if (titleBoss == '打卡地异常记录') {
this.queryRecord.attStatis = 9;
} else if (titleBoss == '出入异常记录') {
this.queryRecord.attStatis = 8;
} else if (titleBoss == '请假记录') {
this.queryRecord.attStatis = 6;
} else if (titleBoss == '轮休记录') {
this.queryRecord.attStatis = 5;
} else if (titleBoss == '临时外出记录') {
this.queryRecord.attStatis = 7;
}
this.showRecord = true;
this.getListRecord();
},
disabledDate(time) {
const str = this.attCurrentMonth + '-01';
// 获取当前日期
var currentDate = new Date(str);
// 获取当前月份的第一天
var firstDayOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1);
// 获取当前月份的最后一天
var lastDayOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0);
return time < firstDayOfMonth || time > lastDayOfMonth;
},
/** 查询月异常详情列表 */
getListRecord() {
getDetail(this.addDateRange(this.queryRecord, this.dateRange)).then(response => {
this.tableDataRecord = response.rows;
this.totalTwo = response.total;
});
},
formatDate(dateString){ /** 搜索按钮操作 */
const date = new Date(dateString); // 创建日期对象 handleQueryRecord() {
const year = date.getFullYear(); // 获取年份 this.queryRecord.pageNum = 1;
const month = String(date.getMonth() + 1).padStart(2, '0'); // 获取月份（注意：月份从0开始） this.getListRecord();
const day = String(date.getDate()).padStart(2, '0'); // 获取日期 },
const weekdays = ['星期天', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']; // 星期几数组
const weekday = weekdays[date.getDay()]; // 获取星期几
return `${year}-${month}-${day} ${weekday}`; // 组合成所需格式 cancelRecord() {
}, this.showRecord = false;
getMonth(){ this.resetRecord();
// 默认当月 },
var nowDate = new Date(); /** 重置按钮操作 */
var date = { resetRecord() {
year: nowDate.getFullYear(), // this.resetForm("queryFormRecord");
month: nowDate.getMonth() + 1, this.handleQueryRecord();
day: nowDate.getDate() },
};
const dayDate = date.year + "-" + (date.month >= 10 ? date.month : "0" + date.month);
this.$set(this.queryParams, "month", dayDate.toString());
},
getDeptList(){
listDept().then(response => {
this.deptOptions = this.handleTree(response.data, "id");
});
},
/** 转换部门数据结构 */
normalizer(node) {
if (node.children && !node.children.length) {
delete node.children;
}
return {
id: node.id,
label: node.orgName,
children: node.children
};
},
handleSelect(value, instanceId) {
console.log('Selected:', value);
// 在这里处理选择事件
this.queryParams.orgName=value.orgName;
},
/** 查询字典类型列表 */
getList() {
this.loading = true;
console.log(this.queryParams)
getMonthAttReport(this.queryParams).then(response => {
this.typeList = response.rows;
this.total = response.total;
this.loading = false;
}
);
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.getMonth()
this.resetForm("queryForm");
this.handleQuery();
},
//打开月异常详情页面
openRecord(row,titleBoss){
this.id = row.id;
this.title = titleBoss;
this.queryRecord.userId = row.userId;
this.queryRecord.attCurrentMonth = row.attCurrentMonth;
this.attCurrentMonth = row.attCurrentMonth;
if(titleBoss=='打卡记录'){
this.queryRecord.attStatis=1;
}else if(titleBoss=='迟到记录'){
this.queryRecord.attStatis=2;
}else if(titleBoss=='早退记录'){
this.queryRecord.attStatis=4;
}else if(titleBoss=='旷工记录'){
this.queryRecord.attStatis=3;
}else if(titleBoss=='打卡地异常记录'){
this.queryRecord.attStatis=9;
}else if(titleBoss=='出入异常记录'){
this.queryRecord.attStatis=8;
}else if(titleBoss=='请假记录'){
this.queryRecord.attStatis=6;
}else if(titleBoss=='轮休记录'){
this.queryRecord.attStatis=5;
}else if(titleBoss=='临时外出记录'){
this.queryRecord.attStatis=7;
}
this.showRecord = true;
this.getListRecord();
},
disabledDate(time) {
const str=this.attCurrentMonth+'-01';
// 获取当前日期
var currentDate = new Date(str);
// 获取当前月份的第一天
var firstDayOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth(), 1);
// 获取当前月份的最后一天
var lastDayOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() + 1, 0);
return time < firstDayOfMonth || time > lastDayOfMonth;
},
/** 查询月异常详情列表 */
getListRecord() {
getDetail(this.addDateRange(this.queryRecord, this.dateRange)).then(response => {
this.tableDataRecord = response.rows;
this.totalTwo = response.total;
});
},
/** 搜索按钮操作 */ /** 导出按钮操作 */
handleQueryRecord() { handleExport() {
this.queryRecord.pageNum = 1; exportMonthReport(this.queryParams).then(res => {
this.getListRecord(); this.downloadFile({
}, fileName: `月报表记录_${new Date().getTime()}.xlsx`,
fileData: res,
fileType: 'application/vnd.ms-excel;charset=utf-8'
})
})
},
cancelRecord() { //打开工作时间外出次数
this.showRecord = false; openOutCountList(row) {
this.resetRecord(); this.title = "工作时间外出次数";
}, this.queryRecordOutCount.userId = row.userId;
/** 重置按钮操作 */ this.queryRecordOutCount.attCurrentDay = row.attCurrentDay;
resetRecord() { this.showOutCount = true;
// this.resetForm("queryFormRecord"); this.getOutCountList();
this.handleQueryRecord(); },
},
/** 导出按钮操作 */ /** 查询工作时间外出次数列表 */
handleExport() { getOutCountList() {
exportMonthReport(this.queryParams).then(res => { this.loadingTwo = true;
this.downloadFile({ fileName: `月报表记录_${new Date().getTime()}.xlsx`, fileData: res, fileType: 'application/vnd.ms-excel;charset=utf-8' }) getOutCountList(this.queryRecordOutCount).then(response => {
}) this.tableDataOutCount = response.rows;
}, this.totalTwoOutCount = response.total;
this.loadingTwo = false;
});
},
} /** 导出按钮操作 */
}; handleExportOutCountList() {
</script> exportOutCountList(this.queryRecordOutCount).then(res => {
this.downloadFile({
fileName: `工作时间外出次数记录_${new Date().getTime()}.xlsx`,
fileData: res,
fileType: 'application/vnd.ms-excel;charset=utf-8'
})
})
},
}
};
</script>