YZProjectCloud/yanzhu-ui-vue3/src/views/manage/thirdLabor/attendanceData/index.vue

185 lines
6.9 KiB
Vue

<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>