<template>
  <div class="app-container third-labor-attendance-data">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="82px">
      <el-form-item label="分包商类型" prop="companyTypeId">
        <el-select v-model="queryParams.companyTypeId" placeholder="请选择分包商类型" clearable style="width:150px">
          <el-option value="0" label="所有"></el-option>
          <el-option value="101" label="总包人员"></el-option>
          <el-option value="102" label="监理人员"></el-option>
          <el-option value="103" label="劳务人员"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="日期" prop="createBy">
        <el-date-picker v-model="queryParams.attendanceTime" :picker-options="disableTime" type="date" placeholder="选择日期"> </el-date-picker>
        -
        <el-date-picker v-model="queryParams.attendanceOutTime" :picker-options="disableTime" type="date" placeholder="选择日期"> </el-date-picker>
      </el-form-item>
      <el-form-item label="姓名" prop="workerName">
        <el-input v-model="queryParams.workerName" placeholder="请输入姓名"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="small" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="small" @click="resetQuery">重置</el-button>
        <el-button type="warning" plain icon="el-icon-download" size="small" @click="handleExport" v-hasPermi="['project:attendance:export']">导出</el-button>
      </el-form-item>
    </el-form>

    <el-table v-loading="loading" :data="attendanceList">
      <el-table-column label="照片" align="center" prop="id">
        <template #default="scope">
          <el-image :src="scope.row.scanPhoto || scope.row.workerPhoto" :preview-src-list="[scope.row.scanPhoto || scope.row.workerPhoto]" style="height: 60px" />
        </template>
      </el-table-column>
      <el-table-column label="姓名" align="center" prop="workerName" />
      <el-table-column label="籍贯" align="center" prop="nativePlace" />
      <el-table-column label="性别" align="center" prop="attendanceType">
        <template #default="scope">{{ scope.row.workerGender == 1 ? "女" : "男" }}</template>
      </el-table-column>
      <el-table-column label="进场时间" align="center" prop="inTime" width="96">
        <template #default="scope">
          <span v-if="scope.row.attendanceTime"> {{ $formatDate(scope.row.attendanceTime) }} }} </span>
          <i v-else class="el-icon-close" style="color: red"></i>
        </template>
      </el-table-column>
      <el-table-column label="离场时间" align="center" prop="outTime" width="96">
        <template #default="scope">
          <span v-if="scope.row.attendanceOutTime">
            {{ $formatDate(scope.row.attendanceOutTime) }}
          </span>
          <i v-else class="el-icon-close" style="color: red"></i>
        </template>
      </el-table-column>
      <el-table-column label="分包商名称" align="center" prop="companyName" />
      <el-table-column label="所属班组" align="center" prop="groupName" />
      <el-table-column label="工种" align="center" prop="workTypeName" />
    </el-table>

    <pagination v-show="total > 0" :total="total" :page="queryParams.pageNum" :limit="queryParams.pageSize" @pagination="getList" />
  </div>
</template>

<script>
import { listAttendance } from "@/api/manage/thirdAttendance";
import useUserStore from "@/store/modules/user";
import { listAttendance_cfg } from "@/api/manage/attendancecfg";
export default {
  name: "ThirdLaborAttendanceWorker",
  data() {
    return {
      // 遮罩层
      loading: false,
      // 选中数组
      ids: [],
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 劳务实名制管理表格数据
      attendanceList: [],
        disableTime: {
          disabledDate: (time) => {
            var t1 = +this.$dt("2023-1-1").$d;
            var t2 = +this.$dt(time).$d;
            var t3 = +this.$dt("2028-12-31").$d;
            return t2 < t1 || t2 > t3;
          },
        },
      queryParams: {
        vendorsCode: "huazhu",
        pageNum: 1,
        pageSize: 10,
        projectId: null,
        workerName: "",
        deptId: null,
        companyTypeId: "0",
        attendanceTime: new Date(),
        attendanceOutTime: undefined,
      
        currentPrjId: null,
        currentComId: null,
        cfgInfo: null,
      },
    };
  },
  mounted() {
    const userStore = useUserStore();
    this.currentPrjId = userStore.currentPrjId;
    this.currentComId = userStore.currentComId;
    listAttendance_cfg({
      pageNum: 1,
      pageSize: 10,
      projectId: this.currentPrjId,
    }).then((d) => {
      let tmps = d.rows || [];
      if (tmps.length == 0) {
        this.$modal.msgError("请先配置考勤规则!");
      } else {
        this.cfgInfo = tmps[0];
        this.getList();
      }
    });
  },
  methods: {
    handleExport() {},
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    getList() {
      this.loading = true;
      this.queryParams.projectId = this.currentPrjId;
      this.queryParams.cfgid = this.cfgInfo.id;
      let postData = {};
      if (this.queryParams.attendanceTime) {
        postData.attendanceTime = this.$dt(this.queryParams.attendanceTime).format("YYYY-MM-DD");
      }
      if (this.queryParams.attendanceOutTime) {
        postData.attendanceOutTime = this.$dt(this.queryParams.attendanceOutTime).format("YYYY-MM-DD");
      }

      postData.cfgid = this.cfgInfo.id;

      postData.pageNum = this.queryParams.pageNum;
      postData.pageSize = this.queryParams.pageSize;
      if (this.queryParams.workerName) {
        postData.workerName = this.queryParams.workerName;
      }
      if (this.queryParams.companyTypeId && this.queryParams.companyTypeId > 0) {
        postData.companyTypeId = this.queryParams.companyTypeId;
      }
      return listAttendance(postData).then((res) => {
        this.attendanceList = (res.rows || []).map((it) => {
          if (it.vendorsCode != "yanzhu") {
            let dt1 = it.attendanceTime;
            let dt2 = it.attendanceOutTime;
            if (!dt1 || !dt2 || dt1 == dt2) {
              let dt = dt1 || dt2;
              if (it.remark == "E") {
                it.attendanceTime = dt;
                it.attendanceOutTime = "";
              } else {
                it.attendanceTime = "";
                it.attendanceOutTime = dt;
              }
            }
          }
          it.scanPhoto = it.scanPhoto && it.scanPhoto.indexOf("/profile") == 0 ? "/jhapi" + it.scanPhoto : it.scanPhoto;
          return it;
        });
        this.total = res.total;
        this.loading = false;
      });
    },
  },
};
</script>

<style lang="scss">
.third-labor-attendance-data {
}
</style>
