260 lines
8.6 KiB
Vue
260 lines
8.6 KiB
Vue
<template>
|
|
<div class="app-container pay-query-main">
|
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="68px">
|
|
<el-form-item label="项目名称" prop="projectId">
|
|
<el-select v-model="queryParams.projectId" filterable placeholder="请选择项目" @change="doQuerySub">
|
|
<el-option v-for="(item, index) in projectOptions" :key="index" :label="item.projectName" :value="item.id">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="总包单位" prop="subDeptId">
|
|
<el-select v-model="queryParams.subDeptId" filterable placeholder="请选择总包单位" clearable>
|
|
<el-option v-for="(item, index) in depts" :key="index" :label="item.deptName" :value="item.deptId">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="姓名" prop="workerName">
|
|
<el-input v-model="queryParams.workerName"/>
|
|
</el-form-item>
|
|
<el-form-item label="日期" >
|
|
<el-date-picker v-model="queryParams.attendanceDay1" style="margin:0px 10px;" type="date" placeholder="选择日期"
|
|
@change="handleQuery">
|
|
</el-date-picker>
|
|
-
|
|
<el-date-picker v-model="queryParams.attendanceDay2" style="margin:0px 10px;" type="date" placeholder="选择日期"
|
|
@change="handleQuery">
|
|
</el-date-picker>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
|
<el-button type="success" v-if="total>0" @click="doExport">导出</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
|
|
<div>
|
|
<el-table v-loading="loading" :data="attendanceList" height="60vh" class="my-table">
|
|
<el-table-column label="照片" align="center" prop="id">
|
|
<template slot-scope="{ row }">
|
|
<el-image :src="row.scanPhoto || row.workerPhoto" :preview-src-list="[row.scanPhoto || 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 slot-scope="{ row }">{{
|
|
row.workerGender == 1 ? "女" : "男"
|
|
}}</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-column label="出勤天数" align="center" prop="pay" v-if="type=='month'">
|
|
<template slot-scope="{ row }">{{row.days }}</template>
|
|
</el-table-column>
|
|
<el-table-column label="出勤日期" align="center" prop="pay" v-if="type=='day'">
|
|
<template slot-scope="{ row }">
|
|
<span>{{(row.attendanceTime||row.attendanceOutTime)|formatDate }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="工资" align="center" prop="pay">
|
|
<template slot-scope="{ row }">
|
|
<span >{{(row.pay/100.0).toFixed(2)}}</span>
|
|
<span v-if="false" >
|
|
{{(row.unitPay/100.0).toFixed(2)}}*{{row.days}}={{(row.pay/100.0).toFixed(2)}}
|
|
</span>
|
|
</template>
|
|
</el-table-column>
|
|
<div slot="empty">
|
|
<el-empty v-if="total==0" image="./images/empty.svg"></el-empty>
|
|
</div>
|
|
</el-table>
|
|
|
|
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
|
|
@pagination="getList" />
|
|
</div>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import DayPay from './dayPay.vue'
|
|
import MonthPay from './monthPay.vue'
|
|
import {listByBetweenDay,listGroupBetweenDay} from '@/api/project/unitpay'
|
|
export default {
|
|
components:{
|
|
DayPay,MonthPay
|
|
},
|
|
name: "Unitpay",
|
|
data() {
|
|
return {
|
|
// 遮罩层
|
|
loading: true,
|
|
activeName: 'day',
|
|
// 查询参数
|
|
queryParams: {
|
|
pageNum: 1,
|
|
pageSize: 10,
|
|
projectId: null,
|
|
subDeptId: null,
|
|
workerName:'',
|
|
attendanceDay1:new Date(),
|
|
attendanceDay2:null,
|
|
},
|
|
// 表单校验
|
|
projectOptions: [],
|
|
depts: [],
|
|
total: 0,
|
|
attendanceList:[],
|
|
type:'',
|
|
};
|
|
},
|
|
created() {
|
|
this.init();
|
|
},
|
|
methods: {
|
|
dataChange(total){
|
|
this.total=total;
|
|
},
|
|
getPrjInfo(){
|
|
return {
|
|
projectId:this.queryParams.projectId,
|
|
deptId:this.queryParams.subDeptId,
|
|
attendanceTime:this.activeName=="day"?this.queryParams.attendanceDay:this.queryParams.attendanceMonth
|
|
}
|
|
},
|
|
doQuerySub() {
|
|
let prjId = this.queryParams.projectId;
|
|
let tmps = this.prjDept2 && this.prjDept2[prjId] ? this.prjDept2[prjId] || [] : [];
|
|
if (tmps.length > 0 || !prjId) {
|
|
this.depts = tmps;
|
|
if (tmps.length == 1) {
|
|
this.queryParams.subDeptId = tmps[0].deptId;
|
|
} else {
|
|
this.queryParams.subDeptId = '';
|
|
}
|
|
this.loading=false;
|
|
return;
|
|
}
|
|
this.$api.publics.queryUnitList({
|
|
projectId: prjId,
|
|
unitTypes: "2".split(","),
|
|
}).then((d) => {
|
|
this.loading=false;
|
|
let objs = d.rows || [];
|
|
if (!this.prjDept2) {
|
|
this.prjDept2 = {};
|
|
}
|
|
this.prjDept2[prjId] = objs;
|
|
this.depts = objs;
|
|
if (objs.length == 1) {
|
|
this.queryParams.subDeptId = objs[0].deptId;
|
|
} else {
|
|
this.queryParams.subDeptId = '';
|
|
}
|
|
});
|
|
},
|
|
init() {
|
|
if (this.projectOptions && this.projectOptions.length > 0) {
|
|
return;
|
|
}
|
|
this.$api.publics.getMyProjectList({}).then((response) => {
|
|
this.projectOptions = response.rows || [];
|
|
if (this.projectOptions.length > 0) {
|
|
this.queryParams.projectId = this.projectOptions[0].id;
|
|
this.doQuerySub();
|
|
}
|
|
});
|
|
},
|
|
handleQuery() {
|
|
this.queryParams.pageNum=1;
|
|
this.getList();
|
|
},
|
|
getPostData(){
|
|
let postData={
|
|
projectId:this.queryParams.projectId,
|
|
deptId:this.queryParams.subDeptId,
|
|
pageNum:this.queryParams.pageNum,
|
|
pageSize:this.queryParams.pageSize
|
|
};
|
|
if(this.queryParams.workerName.trim()){
|
|
this.type='day';
|
|
postData.workerName=this.queryParams.workerName.trim();
|
|
}else{
|
|
this.type='month';
|
|
}
|
|
|
|
if(this.queryParams.attendanceDay1){
|
|
postData.attendanceTime=this.$dt(this.queryParams.attendanceDay1).format("YYYY-MM-DD");
|
|
}
|
|
if(this.queryParams.attendanceDay2){
|
|
postData.attendanceOutTime=this.$dt(this.queryParams.attendanceDay1).format("YYYY-MM-DD");
|
|
}
|
|
return postData;
|
|
},
|
|
getList(){
|
|
this.loading = true;
|
|
let ajaxFun=listByBetweenDay;
|
|
let postData=this.getPostData();
|
|
if(this.type=='month'){
|
|
ajaxFun=listGroupBetweenDay;
|
|
}
|
|
ajaxFun(postData).then(response=>{
|
|
this.attendanceList = (response.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 = response.total;
|
|
this.loading = false;
|
|
});
|
|
},
|
|
doTabClick(){
|
|
setTimeout(this.handleQuery,1000);
|
|
},
|
|
doExport(){
|
|
let postData=this.getPostData();
|
|
let tmps=this.projectOptions.filter(d=>d.id==this.queryParams.projectId);
|
|
let name=tmps.length>0?tmps[0].projectName:"";
|
|
if(this.queryParams.subDeptId){
|
|
tmps=this.depts.filter(d=>d.deptId==this.queryParams.subDeptId);
|
|
if(tmps.length>0){
|
|
name+="_"+tmps[0].deptName;
|
|
}
|
|
}
|
|
name+=`_工资管理_[${new Date().getTime()}].xlsx`
|
|
let url=this.type=="day"?"project/unitpay/exportBetweenDay":"project/unitpay/exportGroupBetweenDay";
|
|
this.download(
|
|
url,
|
|
{
|
|
...postData,
|
|
},
|
|
name
|
|
);
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style lang="scss">
|
|
.pay-query-main{
|
|
font-size: 12px;
|
|
.el-table.my-table{
|
|
height: calc(100vh - 292px) !important;
|
|
}
|
|
}
|
|
</style>
|