<template>
  <div class="unidentification_box">
    <div class="searchBox whiteBlock">
        <el-date-picker
            v-model="datetimer"
            type="datetimerange"
            :range-separator="$t('message.laborMange.to')"
            value-format="yyyy-MM-dd HH:mm:ss"
            :start-placeholder="$t('message.laborMange.startDate')"
            :end-placeholder="$t('message.laborMange.dateClosed')">
        </el-date-picker>
        <el-button type="primary" style="margin-left: 20px" @click="searchData(1)">查询</el-button>
    </div>
    <div class="table_wrap whiteBlock">
      <el-table :data="tableData" class="tables" height="660" style="width: 100%">
        <!-- 设备名称 -->
        <el-table-column
          prop="deviceName"
          :label="$t('message.laborMange.devName')"
          align="center"
        >
        </el-table-column>
        <!-- 设备序列号 -->
        <el-table-column prop="deviceSerial" :label="$t('message.laborMange.devNo')" align="center">
        </el-table-column>
        <!-- 进出方向 -->
        <el-table-column prop="passType" :label="$t('message.laborMange.inOutWay')" align="center">
          <template slot-scope="scope">
            <!-- "进":"出" -->
            {{
              scope.row.passType == 1
                ? $t('message.laborMange.in')
                : scope.row.passType == 2
                ? $t('message.laborMange.out'):""
            }}
          </template>
        </el-table-column>
        <!-- I深建人员序列号 -->
        <el-table-column prop="personSerial" :label="$t('message.laborMange.peopleIdNo')" align="center">
        </el-table-column>
        <!-- 出入时间 -->
        <el-table-column prop="createTime" :label="$t('message.laborMange.inOutTime')" align="center">
        </el-table-column>
        <!-- 照片 -->
        <el-table-column :label="$t('message.laborMange.picture')" align="center">
          <template slot-scope="scope">
            <el-image 
                style="width: 100px; height: 100px"
                :src="$store.state.FILEURL+scope.row.imageUrl" 
                :preview-src-list="[$store.state.FILEURL+scope.row.imageUrl]">
            </el-image>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        class="pagerBox"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pageNo"
        :page-sizes="$store.state.PAGESIZRS"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next"
        :total="Number(total)"
        background
      ></el-pagination>
    </div>
  </div>
</template>

<script>
import {selectWorkerStrangerAttendancePageListApi} from '@/assets/js/api/laborPerson'
export default {
    data(){
        return{
            datetimer: [],
            tableData: [],
            pageNo: 1,
            pageSize: 10,
            total: 0
        }
    },
    created(){
        this.selectNowDate()
        this.searchData()
    },
    methods:{
        // 获取当前时间 返回YYYY-MM-DD HH:mm:ss
        selectNowDate(){
			var date = new Date(),
			year = date.getFullYear(),
			month = date.getMonth() + 1,
			day = date.getDate(),
            hours = date.getHours(), //获取当前小时数(0-23)
            minutes = date.getMinutes(),//获取当前分钟数(0-59)
            seconds = date.getSeconds()
			month >= 1 && month <= 9 ? (month = "0" + month) : "";
			day >= 0 && day <= 9 ? (day = "0" + day) : "";
            hours >= 0 && hours <= 9 ? (hours = "0" + hours) : "";
            minutes >= 0 && minutes <= 9 ? (minutes = "0" + minutes) : "";
            seconds >= 0 && seconds <= 9 ? (seconds = "0" + seconds) : "";
			var timer = year + '-' + month + '-' + day + ' ' + hours + ':' + minutes+ ':' + seconds;
            // var timer = year + '-' + month + '-' + day
            this.datetimer = [timer.split(' ')[0]+' 00:00:00',timer]
			console.log(timer)
			// return timer;
		},
        searchData(val){
            if(val){
                this.pageNo = 1
            }
            let data = {
                endTime: this.datetimer[1],
                startTime: this.datetimer[0],
                projectSn: this.$store.state.projectSn,
                pageNo: this.pageNo,
                pageSize: this.pageSize
            }
            selectWorkerStrangerAttendancePageListApi(data).then(res=>{
                console.log(res)
                if(res.code == 200){
                    this.tableData = res.result.records
                    this.total = res.result.total
                }
            })
        },
        handleSizeChange(val){
            this.pageSize = val
            this.searchData()
            // console.log(val)
        },
        handleCurrentChange(val){
            this.pageNo = val
            this.searchData()
        }
    }
}
</script>

<style lang="less" scoped>
.unidentification_box{
    background: #fff;
    width: 100%;
    height: 100%;
}

</style>