|
|
@@ -0,0 +1,270 @@
|
|
|
+<template>
|
|
|
+ <a-card :bordered="false">
|
|
|
+
|
|
|
+ <!-- 查询区域 -->
|
|
|
+ <div class="table-page-search-wrapper">
|
|
|
+ <a-form layout="inline" @keyup.enter.native="searchQuery">
|
|
|
+ <a-row :gutter="24">
|
|
|
+
|
|
|
+ <a-col :md="6" :sm="8">
|
|
|
+ <a-form-item label="人员">
|
|
|
+ <a-input placeholder="请输入人员" v-model="queryParam.realname"></a-input>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :md="6" :sm="8">
|
|
|
+ <a-form-item label="账号">
|
|
|
+ <a-input placeholder="请输入账号" v-model="queryParam.username"></a-input>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :md="6" :sm="8">
|
|
|
+ <a-form-item label="日期">
|
|
|
+ <a-date-picker valueFormat="YYYY-MM-DD" @change="onChange" placeholder="请输入日期" v-model="queryParam.viewDate"></a-date-picker>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+
|
|
|
+ <a-col :md="6" :sm="8">
|
|
|
+ <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
|
|
+ <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
|
|
|
+ <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
|
|
|
+
|
|
|
+ </span>
|
|
|
+ </a-col>
|
|
|
+
|
|
|
+ </a-row>
|
|
|
+
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :md="6" :sm="8">
|
|
|
+ <a-form-item label="生成月报日期">
|
|
|
+ <a-month-picker format="YYYY-MM" placeholder="请输入生成月报日期" v-model="queryParam.nowDate" />
|
|
|
+ <!-- <a-input placeholder="请输入生成月报日期" v-model="queryParam.nowDate"></a-input> -->
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
+ <a-col :md="6" :sm="8">
|
|
|
+ <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
|
|
|
+ <a-button type="primary" @click="monthReport" icon="reload" style="margin-left: 8px">生成当月考勤月报</a-button>
|
|
|
+ </span>
|
|
|
+ </a-col>
|
|
|
+
|
|
|
+ </a-row>
|
|
|
+ </a-form>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <!-- table区域-begin -->
|
|
|
+ <div>
|
|
|
+
|
|
|
+ <a-table class="j-table-force-nowrap" ref="table" size="middle" bordered rowKey="id" :columns="columns"
|
|
|
+ :dataSource="dataSource" :pagination="ipagination" :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
|
|
+ @change="handleTableChange">
|
|
|
+
|
|
|
+ <span slot="latetimeState" slot-scope="text, record, index">
|
|
|
+ <a-tag color="pink" v-if="record.latetimeX > 0 || record.latetimeS > 0 ">异常</a-tag>
|
|
|
+ <a-tag color="#87d068" v-if="record.latetimeX <= 0 && record.latetimeS <= 0 ">正常</a-tag>
|
|
|
+ </span>
|
|
|
+
|
|
|
+ </a-table>
|
|
|
+ </div>
|
|
|
+ <!-- table区域-end -->
|
|
|
+
|
|
|
+ <!-- 表单区域 -->
|
|
|
+ <!-- <ViewClockIn-modal ref="modalForm" @ok="modalFormOk"></ViewClockIn-modal> -->
|
|
|
+ </a-card>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ JeecgListMixin
|
|
|
+ } from '@/mixins/JeecgListMixin'
|
|
|
+ import JDictSelectTag from '@/components/dict/JDictSelectTag'
|
|
|
+ import {
|
|
|
+ monthReport
|
|
|
+ } from '@/api/api'
|
|
|
+ import moment from 'moment';
|
|
|
+ import 'moment/locale/zh-cn';
|
|
|
+
|
|
|
+ export default {
|
|
|
+ name: 'ViewClockInList',
|
|
|
+ mixins: [JeecgListMixin],
|
|
|
+ components: {
|
|
|
+ JDictSelectTag
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ moment,
|
|
|
+ description: '考勤日报',
|
|
|
+ // 表头
|
|
|
+ columns: [{
|
|
|
+ title: '行号',
|
|
|
+ dataIndex: '',
|
|
|
+ key: 'rowIndex',
|
|
|
+ width: 60,
|
|
|
+ align: 'center',
|
|
|
+ customRender: function(t, r, index) {
|
|
|
+ return parseInt(index) + 1
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '日期',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'viewDate'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '人员',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'realname'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '账号',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'username'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '班次',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'name'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '上班时间',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'shiftTimeS'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '下班时间',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'shiftTimeX'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '上班打卡时间',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'gotoTime'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '下班打卡时间',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'closingTime'
|
|
|
+ }, {
|
|
|
+ title: '考勤状态',
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: {
|
|
|
+ customRender: 'latetimeState'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '迟到分钟',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'latetimeS',
|
|
|
+ customRender: function(t, r, index) {
|
|
|
+ if (t > 0) {
|
|
|
+ return t;
|
|
|
+ } else {
|
|
|
+ return 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '早退分钟',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'latetimeX',
|
|
|
+ customRender: function(t, r, index) {
|
|
|
+ if (t > 0) {
|
|
|
+ return t;
|
|
|
+ } else {
|
|
|
+ return 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '上班打卡',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'gotoState'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '下班打卡',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'closingState'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '加班开始时间',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'durationBeginDate'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '加班结束时间',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'durationEndDate'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '加班事由',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'demo'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '加班时长',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'duration'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '请假开始时间',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'holidayStartDate'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '请假结束时间',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'holidayEndDate'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '请假类型',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'holidayType'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ url: {
|
|
|
+ list: '/viewClockIn/viewClockIn/list'
|
|
|
+ },
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ importExcelUrl: function() {
|
|
|
+ return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ onChange(date, dateString) {
|
|
|
+ console.log(date, dateString);
|
|
|
+ // this.value = "2021-01-01"
|
|
|
+ },
|
|
|
+ monthReport() {
|
|
|
+ let sqp1 = this.getQueryParams();
|
|
|
+ if(sqp1['nowDate'] == 'undefined' || sqp1['nowDate'] == null || sqp1['nowDate'] == ''){
|
|
|
+ this.$message.warning('请选择生成月报日期！');
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ let nowDate = moment(sqp1['nowDate']).format('YYYY-MM');
|
|
|
+ let that = this;
|
|
|
+ that.$confirm({
|
|
|
+ title: "确认操作",
|
|
|
+ content: "是否生成" + nowDate + "月报?",
|
|
|
+ onOk: function () {
|
|
|
+ monthReport({nowDate:nowDate}).then((res) => {
|
|
|
+ if (res == 'true') {
|
|
|
+ that.$message.success("已成功生成"+nowDate+"考勤月报");
|
|
|
+ that.loadData();
|
|
|
+ } else {
|
|
|
+ that.$message.warning(res);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+<style scoped>
|
|
|
+ @import '~@assets/less/common.less'
|
|
|
+</style>
|
EDZ