月报表、月异常报表月份添加范围查询

This commit is contained in:
cwchen 2025-02-18 20:23:33 +08:00
parent 2955f045e2
commit 69b3f95d4d
2 changed files with 88 additions and 100 deletions

View File

@ -2,24 +2,22 @@
<div class="app-container" id="monthReport"> <div class="app-container" id="monthReport">
<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 v-model="queryParams.month" type="monthrange" range-separator="" start-placeholder="开始月份"
end-placeholder="结束月份" value-format="yyyy-MM" :clearable="false" :editable="false">
</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" <treeselect v-model="queryParams.orgId" :options="deptOptions" :normalizer="normalizer" @select="handleSelect"
placeholder="选择部门" style="width: 240px"/> 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" placeholder="请输入姓名" clearable style="width: 240px"
v-model="queryParams.userName" @keyup.enter.native="handleQuery" />
placeholder="请输入姓名"
clearable
style="width: 240px"
@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>
@ -28,14 +26,8 @@
</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" plain icon="el-icon-download" size="mini" @click="handleExport"
type="warning" v-hasPermi="['att:attMonthReport:export']">导出
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['att:attMonthReport:export']"
>导出
</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>
@ -48,58 +40,53 @@
<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="userName"/> <el-table-column label="姓名" align="center" prop="userName" />
<el-table-column label="所属部门" align="center" prop="orgName"/> <el-table-column label="所属部门" align="center" prop="orgName" />
<el-table-column label="应出勤天数" align="center" prop="requiredDays"/> <el-table-column label="考勤月份" align="center" prop="attCurrentMonth" />
<el-table-column label="应出勤天数" align="center" prop="requiredDays" />
<el-table-column label="工作时间外出次数" align="center" prop="normalNum" width="180"> <el-table-column label="工作时间外出次数" align="center" prop="normalNum" width="180">
<template slot-scope="scope"> <template slot-scope="scope">
<div <div @click="openOutCountList(scope.row)" style="color: #02a7f0; cursor: pointer">
@click="openOutCountList(scope.row)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.outCount }} {{ scope.row.outCount }}
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<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="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">
@ -109,21 +96,21 @@
</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 @click="openRecord(scope.row,title7)" style="color: #02a7f0; cursor: pointer"> <div @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="restNum"> <el-table-column label="轮休天数" align="center" prop="restNum">
<template slot-scope="scope"> <template slot-scope="scope">
<div @click="openRecord(scope.row,title8)" style="color: #02a7f0; cursor: pointer"> <div @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 @click="openRecord(scope.row,title9)" style="color: #02a7f0; cursor: pointer"> <div @click="openRecord(scope.row, title9)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.outNum }} {{ scope.row.outNum }}
</div> </div>
</template> </template>
@ -131,7 +118,7 @@
<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 @click="openRecord(scope.row,title10)" style="color: #02a7f0; cursor: pointer"> <div @click="openRecord(scope.row, title10)" style="color: #02a7f0; cursor: pointer">
{{ scope.row.businessTripNum }} {{ scope.row.businessTripNum }}
</div> </div>
</template> </template>
@ -139,30 +126,18 @@
</el-table> </el-table>
<pagination <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
v-show="total>0" @pagination="getList" />
: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 <el-dialog :title="title" :visible.sync="showRecord" width="1300px" height="1000px" append-to-body
@close="cancelRecord"> @close="cancelRecord">
<el-form :model="queryRecord" ref="queryFormRecord" size="small" :inline="true" v-show="showSearch" <el-form :model="queryRecord" ref="queryFormRecord" size="small" :inline="true" v-show="showSearch"
label-width="110px"> label-width="110px">
<el-form-item label="选择考勤时间段"> <el-form-item label="选择考勤时间段">
<el-date-picker <el-date-picker v-model="dateRange" style="width: 240px" value-format="yyyy-MM-dd" type="daterange"
v-model="dateRange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"
style="width: 240px" :picker-options="pickerOptions"></el-date-picker>
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>
@ -176,37 +151,32 @@
<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" :total="totalTwo" :page.sync="queryRecord.pageNum"
v-show="totalTwo>0" :limit.sync="queryRecord.pageSize" @pagination="getListRecord" />
:total="totalTwo"
:page.sync="queryRecord.pageNum"
:limit.sync="queryRecord.pageSize"
@pagination="getListRecord"
/>
</el-dialog> </el-dialog>
@ -214,7 +184,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="queryRecordOutCount" ref="queryFormRecord" size="small" :inline="true" v-show="showSearch" <el-form :model="queryRecordOutCount" ref="queryFormRecord" size="small" :inline="true" v-show="showSearch"
label-width="110px"> label-width="110px">
<el-form-item> <el-form-item>
<el-button type="warning" icon="el-icon-download" size="mini" @click="handleExportOutCountList">导出</el-button> <el-button type="warning" icon="el-icon-download" size="mini" @click="handleExportOutCountList">导出</el-button>
</el-form-item> </el-form-item>
@ -231,34 +201,29 @@
<span>{{ formatDate(scope.row.attCurrentDay) }}</span> <span>{{ formatDate(scope.row.attCurrentDay) }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="打卡时间" align="center" prop="attCurrentTime" width="140" sortable/> <el-table-column label="打卡时间" align="center" prop="attCurrentTime" width="140" sortable />
<el-table-column label="打卡地址" align="center" prop="attAddress" sortable/> <el-table-column label="打卡地址" align="center" prop="attAddress" sortable />
</el-table> </el-table>
<pagination <pagination v-show="totalTwoOutCount > 0" :total="totalTwoOutCount" :page.sync="queryRecord.pageNum"
v-show="totalTwoOutCount>0" :limit.sync="queryRecord.pageSize" @pagination="getOutCountList" />
:total="totalTwoOutCount"
:page.sync="queryRecord.pageNum"
:limit.sync="queryRecord.pageSize"
@pagination="getOutCountList"
/>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
import {getDetail} from "@/api/report/monthlyError"; import { getDetail } from "@/api/report/monthlyError";
import {getMonthAttReport, exportMonthReport} from "@/api/report/monthReport"; import { getMonthAttReport, exportMonthReport } from "@/api/report/monthReport";
import {listDeptTree} from "@/api/system/userInfo"; import { listDeptTree } from "@/api/system/userInfo";
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 {getOutCountList,exportOutCountList} from "@/api/report/attReport"; import { getOutCountList, exportOutCountList } from "@/api/report/attReport";
var monstr = ""; var monstr = "";
export default { export default {
name: "MonthReport", name: "MonthReport",
dicts: ['att_status'], dicts: ['att_status'],
components: {Treeselect}, components: { Treeselect },
data() { data() {
return { return {
// //
@ -362,7 +327,7 @@ export default {
day: nowDate.getDate() day: nowDate.getDate()
}; };
const dayDate = date.year + "-" + (date.month >= 10 ? date.month : "0" + date.month); const dayDate = date.year + "-" + (date.month >= 10 ? date.month : "0" + date.month);
this.$set(this.queryParams, "month", dayDate.toString()); this.$set(this.queryParams, "month", [dayDate,dayDate]);
}, },
getDeptList() { getDeptList() {
listDeptTree().then(response => { listDeptTree().then(response => {
@ -389,11 +354,16 @@ export default {
getList() { getList() {
this.loading = true; this.loading = true;
console.log(this.queryParams) console.log(this.queryParams)
getMonthAttReport(this.queryParams).then(response => { let query = _.cloneDeep(this.queryParams);
this.typeList = response.rows; query.startMonth = query.month[0];
this.total = response.total; query.endMonth = query.month[1];
this.loading = false; delete query['month'];
} console.log(query)
getMonthAttReport(query).then(response => {
this.typeList = response.rows;
this.total = response.total;
this.loading = false;
}
); );
}, },
/** 搜索按钮操作 */ /** 搜索按钮操作 */
@ -432,7 +402,7 @@ export default {
this.queryRecord.attStatis = 5; this.queryRecord.attStatis = 5;
} else if (titleBoss == '临时外出记录') { } else if (titleBoss == '临时外出记录') {
this.queryRecord.attStatis = 7; this.queryRecord.attStatis = 7;
}else if (titleBoss == '出差天数') { } else if (titleBoss == '出差天数') {
this.queryRecord.attStatis = 10; this.queryRecord.attStatis = 10;
} }
this.showRecord = true; this.showRecord = true;
@ -474,7 +444,12 @@ export default {
/** 导出按钮操作 */ /** 导出按钮操作 */
handleExport() { handleExport() {
exportMonthReport(this.queryParams).then(res => { let query = _.cloneDeep(this.queryParams);
query.startMonth = query.month[0];
query.endMonth = query.month[1];
delete query['month'];
console.log(query)
exportMonthReport(query).then(res => {
this.downloadFile({ this.downloadFile({
fileName: `月报表记录_${new Date().getTime()}.xlsx`, fileName: `月报表记录_${new Date().getTime()}.xlsx`,
fileData: res, fileData: res,

View File

@ -2,13 +2,16 @@
<div class="app-container" id="monthlyError"> <div class="app-container" id="monthlyError">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="80px"> <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="80px">
<el-form-item label="选择月份" prop="attCurrentMonth"> <el-form-item label="选择月份" prop="attCurrentMonth">
<el-date-picker <!-- <el-date-picker
v-model="queryParams.attCurrentMonth" v-model="queryParams.attCurrentMonth"
style="width: 240px" style="width: 240px"
placeholder="请选择月份" placeholder="请选择月份"
type="month" type="month"
value-format="yyyy-MM" value-format="yyyy-MM"
></el-date-picker> ></el-date-picker> -->
<el-date-picker v-model="queryParams.attCurrentMonth" type="monthrange" range-separator="" start-placeholder="开始月份"
end-placeholder="结束月份" value-format="yyyy-MM" :clearable="false" :editable="false">
</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"/>
@ -298,7 +301,7 @@
}; };
const dayDate = date.year + "-" + (date.month >= 10 ? date.month : "0" + date.month); const dayDate = date.year + "-" + (date.month >= 10 ? date.month : "0" + date.month);
// var date = new Date(); // var date = new Date();
this.$set(this.queryParams, "attCurrentMonth", dayDate.toString()); this.$set(this.queryParams, "attCurrentMonth", [dayDate.toString(),dayDate.toString()]);
}, },
formatDate(dateString){ formatDate(dateString){
const date = new Date(dateString); // const date = new Date(dateString); //
@ -337,7 +340,12 @@
/** 查询月异常列表 */ /** 查询月异常列表 */
getList() { getList() {
this.loading = true; this.loading = true;
listMonthlyError(this.queryParams).then(response => { let query = _.cloneDeep(this.queryParams);
query.startMonth = query.attCurrentMonth[0];
query.endMonth = query.attCurrentMonth[1];
delete query['attCurrentMonth'];
console.log(query)
listMonthlyError(query).then(response => {
this.tableData = response.rows; this.tableData = response.rows;
this.total = response.total; this.total = response.total;
this.loading = false; this.loading = false;
@ -413,7 +421,12 @@
/** 导出按钮操作 */ /** 导出按钮操作 */
handleExport() { handleExport() {
exportMonthlyError(this.queryParams).then(res => { let query = _.cloneDeep(this.queryParams);
query.startMonth = query.attCurrentMonth[0];
query.endMonth = query.attCurrentMonth[1];
delete query['attCurrentMonth'];
console.log(query)
exportMonthlyError(query).then(res => {
downloadFile({ fileName: `月异常报表_${new Date().getTime()}.xlsx`, fileData: res, fileType: 'application/vnd.ms-excel;charset=utf-8' }) downloadFile({ fileName: `月异常报表_${new Date().getTime()}.xlsx`, fileData: res, fileType: 'application/vnd.ms-excel;charset=utf-8' })
}) })
}, },