1.考勤打卡页面递交

小小儁爺

2024-09-05 e74c7f21a3a9a64d2a4a311bd42d38db4daa7244

1.考勤打卡页面递交

 src/api/attendanceModule.js

@@ -44,3 +44,21 @@
    data
  })
}

// 考勤记录查询
export function AttendanceRecordSearch(data) {
  return request({
    url: 'HourlyWage/AttendanceRecordSearch',
    method: 'get',
    params: data
  })
}

// 考勤记录核算提交
export function AttendanceRecordSave(data) {
  return request({
    url: 'HourlyWage/AttendanceRecordSave',
    method: 'post',
    data
  })
}

 src/router/index.js

@@ -655,35 +655,35 @@
    children: [
      {
        path: 'attendanceSettings',
        name: 'attendanceSettings',
        name: 'AttendanceSettings',
        code: '1101',
        component: () => import('@/views/attendanceModule/attendanceSettings'),
        meta: { code: '1101', title: '考勤设置', icon: '', keepAlive: true }
      },
      {
        path: 'attendanceClockIn',
        name: 'attendanceClockIn',
        name: 'AttendanceClockIn',
        code: '1102',
        component: () => import('@/views/attendanceModule/attendanceClockIn'),
        meta: { code: '1102', title: '考勤打卡', icon: '', keepAlive: true }
      },
      {
        path: 'attendanceRecord',
        name: 'attendanceRecord',
        name: 'AttendanceRecord',
        code: '1103',
        component: () => import('@/views/attendanceModule/attendanceRecord'),
        meta: { code: '1103', title: '考勤记录', icon: '', keepAlive: true }
      },
      {
        path: 'attendanceDay',
        name: 'attendanceDay',
        name: 'AttendanceDay',
        code: '1104',
        component: () => import('@/views/attendanceModule/attendanceDay'),
        meta: { code: '1104', title: '日计时工资', icon: '', keepAlive: true }
      },
      {
        path: 'attendanceMonth',
        name: 'attendanceMonth',
        name: 'AttendanceMonth',
        code: '1105',
        component: () => import('@/views/attendanceModule/attendanceMonth'),
        meta: { code: '1105', title: '月计时工资', icon: '', keepAlive: true }

 src/views/attendanceModule/attendanceClockIn.vue

@@ -1,15 +1,172 @@
<template>
  <div>
    123
    <div class="body" :style="{height:mainHeight+'px'}">

      <div class="bodyTopFormGroup" style="margin-top: 10px;height: 50px;padding:5px 0;">
        <div class="elForm" style="align-items: center;padding:5px 0;">
          <div style="font-weight: bolder;font-size: 14px;margin: 0 15px;color: #606266">
            工号二维码
          </div>
          <el-input
            v-model="form.usercode"
            :name="'usercodeInput'"
            placeholder="请扫描或输入工号二维码"
            style="width: 300px"
            @change="enterNative"
          />
        </div>
      </div>

      <div class="bodyTopButtonGroup" style="margin-top: 2px;height: 100px;align-items: center;">
        <el-form
          ref="form"
          :model="form"
          label-width="80px"
          inline
          style="display: flex;width: 50%;"
        >
          <div class="elForm">
            <el-form-item label="员工编号:" style=" display: flex;">
              <div style="width: 200px;">{{ form2.usercode }}</div>
            </el-form-item>
            <el-form-item label="员工姓名:" style=" display: flex;">
              <div style="width: 200px;">{{ form2.username }}</div>
            </el-form-item>
            <el-form-item label="所属车间:" style=" display: flex;">
              <div style="width: 200px;">{{ form2.torg_name }}</div>
            </el-form-item>
            <el-form-item label="所属岗位:" style=" display: flex;">
              <div style="width: 200px;">{{ form2.postname }}</div>
            </el-form-item>
          </div>
        </el-form>
      </div>

      <div class="elTableDiv">
        <el-table
          ref="tableDataRef"
          class="tableFixed"
          :data="tableData"
          :height="tableHeight+'px'"
          border
          row-class-name="custom-row"
          :style="{width: 100+'%',height:tableHeight+'px',}"
          highlight-current-row
          :header-cell-style="this.$headerCellStyle"
          :cell-style="this.$cellStyle"
        >
          <el-table-column
            type="index"
            width="50"
            fixed
            label="序号"
          />
          <el-table-column
            prop="wkshop_name"
            label="所属车间"
          />
          <el-table-column
            prop="username"
            label="打卡人员"
          />
          <el-table-column
            prop="createdate"
            label="打卡时间"
          />
          <el-table-column
            prop="workprice"
            label="工价(元/小时)"
          />
        </el-table>
      </div>
      <div
        class="bodyTopButtonGroup"
        style="margin-top: 0;height: 60px;display:flex;align-items: center;justify-content: center"
      >
        <el-button
          v-waves
          :disabled="isDisabled"
          type="primary"
          style="width: 150px;height: 40px;"
          icon="el-icon-alarm-clock"
          @click="clockIn"
        >考勤打卡</el-button>
      </div>

    </div>

  </div>
</template>

<script>
import elDragDialog from '@/directive/el-drag-dialog'
import waves from '@/directive/waves'
import { AttendanceSave, AttendanceSearch } from '@/api/attendanceModule'
import $ from 'jquery'

export default {
  name: 'AttendanceClockIn'
  name: 'AttendanceClockIn',
  directives: { elDragDialog, waves },
  data() {
    return {
      mainHeight: 0,
      tableHeight: 0,
      form: {
        usercode: ''
      },
      form2: {

      },
      tableData: [],
      isDisabled: true
    }
  },
  created() {
  },
  mounted() {
    window.addEventListener('resize', this.getHeight)
    this.getHeight()
    this.inputFocus()
  },
  methods: {
    inputFocus() {
      // this.$nextTick(() => {
      $('input[name=\'usercodeInput\']')[0].focus()
      // })
    },
    async enterNative(val) {
      const { data: res } = await AttendanceSearch({ usercode: val })
      this.form.usercode = ''
      if (res.userdate.length === 0 && res.checkcrd.length === 0) {
        this.$message.info('无此员工号！')
        this.form2 = {}
        this.tableData = []
        this.isDisabled = true
      } else {
        this.form2 = res.userdate[0]
        this.tableData = res.checkcrd
        this.isDisabled = false
      }
    },
    async clockIn() {
      const data = {
        'wkshop_code': this.form2.storg_code,
        'user_code': this.form2.usercode
      }
      const res = await AttendanceSave(data)
      if (res.code === '200') {
        await this.enterNative(this.form2.usercode)
      }
    },
    // 获取页面高度
    getHeight() {
      this.$nextTick(() => {
        this.mainHeight = window.innerHeight - 85
        this.tableHeight = this.mainHeight - 250
        this.$refs.tableDataRef.doLayout()
      })
    }
  }
}
</script>

<style scoped>

</style>

 src/views/attendanceModule/attendanceSettings.vue

@@ -392,13 +392,12 @@
  },
  created() {
    this.getAttendanceSettSearch()

    this.getPrentOrganizationNoCompany()
    this.getPersonPermissions()
  },
  mounted() {
  async mounted() {
    window.addEventListener('resize', this.getHeight)
    this.getHeight()
    await this.getPrentOrganizationNoCompany()
    await this.getPersonPermissions()
  },
  methods: {
    async getPrentOrganizationNoCompany() {