parent
c87ef545b5
commit
89d6102636
@ -0,0 +1,249 @@
|
||||
<template>
|
||||
<div>
|
||||
<card-container>
|
||||
<vxe-toolbar print custom export>
|
||||
<template #buttons>
|
||||
<el-date-picker v-model="select.month" type="month" size="small" value-format="yyyy-MM" placeholder="月份"
|
||||
format="yyyy-MM" />
|
||||
<el-select v-if="is_bgs" style="width:250px;margin-left:6px" size="small" @change="changeDepartment"
|
||||
v-model="select.department_id" placeholder="请选择">
|
||||
<el-option v-for="item in departments" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-switch
|
||||
style="margin-left:15px"
|
||||
v-model="select.is_week"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
active-text="双休"
|
||||
inactive-text="节假日">
|
||||
</el-switch>
|
||||
<el-button icon="el-icon-search" type="primary" plain size="small" style="margin-left: 15px;"
|
||||
@click="getList">搜索</el-button>
|
||||
</template>
|
||||
</vxe-toolbar>
|
||||
<vxe-table ref="table" stripe :border='true' style="margin-top: 10px;border:1px solid #333" :loading="loading" :max-height="1400"
|
||||
:min-height="400" :export-config="{type: 'xlsx',filename:exportName,sheetName:exportName}" :print-config="{}"
|
||||
:column-config="{ resizable: true }" :expand-config="{
|
||||
visibleMethod: () => false,
|
||||
trigger: 'manual'
|
||||
}" :data="tableData" :merge-cells="mergeCells">
|
||||
<!-- :span-method="spanMethods" -->
|
||||
<vxe-column width="180" header-align="center" align="center" field="department_name" title="科室"></vxe-column>
|
||||
<vxe-column width="120" header-align="center" align="center" field="name" title="姓名"></vxe-column>
|
||||
<vxe-column width="180" header-align="center" align="center" field="kaishiriqi" title="日期">
|
||||
<template #default="{ row }">
|
||||
{{row.kaishiriqi?row.kaishiriqi.substring(0,11):''}}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column width="120" header-align="center" align="center" field="day_type_name" title="类型"></vxe-column>
|
||||
<vxe-column minWidth="180" header-align="center" align="center" field="yuanyinshuoming" title="加班事由"></vxe-column>
|
||||
<vxe-column width="180" :export-method="exportjbMethod" header-align="center" align="center" field="jiabanshijian"
|
||||
title="加班时间">
|
||||
<template #default="{ row }">
|
||||
{{row.kaishiriqi?row.kaishiriqi.substring(11,row.kaishiriqi.length):''}}-{{row.kaishiriqi?row.jieshushijian.substring(11,row.jieshushijian.length):''}}
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column width="120" header-align="center" align="center" field="jiabanshichang" title="加班时长(h)"></vxe-column>
|
||||
<vxe-column width="120" header-align="center" align="center" field="convertTime" title="折算时长(h)"></vxe-column>
|
||||
|
||||
|
||||
<!-- <vxe-column header-align="center" align="center" field="day" title="day"></vxe-column> -->
|
||||
<vxe-column width="120" header-align="center" align="center" field="allDay" title="本月累计(h)"></vxe-column>
|
||||
<vxe-column width="120" header-align="center" align="center" field="allConvertTime" title="本月折算累计(h)"></vxe-column>
|
||||
</vxe-table>
|
||||
</card-container>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
otherOvertimeList
|
||||
} from "@/api/chart"
|
||||
import {
|
||||
departmentListNoAuth
|
||||
} from "@/api/common.js"
|
||||
import store from "@/store/modules/user.js"
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
tableData: [],
|
||||
select: {
|
||||
page: 1,
|
||||
page_size: 10,
|
||||
month: this.$moment().format('YYYY-MM'),
|
||||
department_id: '',
|
||||
is_week:1
|
||||
},
|
||||
my_department_id:"",
|
||||
is_bgs:false, // 是否是办公室
|
||||
departments: [],
|
||||
mergeCells: [],
|
||||
exportName: '加班统计表',
|
||||
dName: '全部科室'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async getList() {
|
||||
this.loading = true;
|
||||
try {
|
||||
const res = await otherOvertimeList(this.select, false);
|
||||
console.log(res);
|
||||
let data = res?.users || [];
|
||||
this.tableData = this.overtimeData(data)
|
||||
let date = this.$moment(this.select.month).format("YYYY年MM月")
|
||||
this.exportName = `${date}${this.dName}加班统计表`
|
||||
this.loading = false;
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
async getDepartmentList() {
|
||||
try {
|
||||
const res = await departmentListNoAuth();
|
||||
console.log(res);
|
||||
let arr = res
|
||||
this.departments = arr
|
||||
this.departments.unshift({
|
||||
id: '',
|
||||
name: '全部'
|
||||
})
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
}
|
||||
},
|
||||
overtimeData(arr) {
|
||||
let _arr = []
|
||||
const result = [];
|
||||
_arr = arr.filter(item => item.overtime && item.overtime.length > 0)
|
||||
|
||||
_arr.forEach(item => {
|
||||
const {
|
||||
id,
|
||||
name,
|
||||
department,
|
||||
overtime
|
||||
} = item;
|
||||
const allDay = overtime.reduce((sum, overtimeItem) => sum + parseFloat(overtimeItem.jiabanshichang), 0);
|
||||
overtime.forEach(overtimeItem => {
|
||||
let convertTime = 0 //折算加班
|
||||
if(overtimeItem.day_type=='normal'){
|
||||
overtimeItem.day_type_name = '工作日'
|
||||
convertTime = parseFloat(overtimeItem.jiabanshichang) * 1.5
|
||||
}else if(overtimeItem.day_type=='week'){
|
||||
overtimeItem.day_type_name = '双休日'
|
||||
convertTime = parseFloat(overtimeItem.jiabanshichang) * 2
|
||||
}else if(overtimeItem.day_type=='holiday'){
|
||||
overtimeItem.day_type_name = '节假日'
|
||||
convertTime = parseFloat(overtimeItem.jiabanshichang) * 3
|
||||
}
|
||||
overtimeItem.pid = id;
|
||||
overtimeItem.name = name;
|
||||
overtimeItem.department_name = department.name
|
||||
overtimeItem.sortnumber = department.sortnumber
|
||||
overtimeItem.department_id = department.id
|
||||
overtimeItem.convertTime = parseFloat(convertTime).toFixed(2);
|
||||
overtimeItem.allDay = parseFloat(allDay).toFixed(2);
|
||||
result.push(overtimeItem);
|
||||
});
|
||||
|
||||
// 累计折算时长
|
||||
const allConvertTime = result.reduce((sum, overtimeItem) => sum + parseFloat(overtimeItem.convertTime), 0);
|
||||
result.forEach(overtimeItem => {
|
||||
overtimeItem.allConvertTime = parseFloat(allConvertTime).toFixed(2);
|
||||
});
|
||||
|
||||
|
||||
result.sort((a, b) => {
|
||||
return a.sortnumber - b.sortnumber
|
||||
})
|
||||
});
|
||||
this.mergeCells = this.generateMergeCells(result)
|
||||
return result;
|
||||
},
|
||||
exportjbMethod({
|
||||
row
|
||||
}) {
|
||||
return `${row.kaishiriqi?row.kaishiriqi.substring(11,row.kaishiriqi.length):''}-${row.kaishiriqi?row.jieshushijian.substring(11,row.jieshushijian.length):''}`
|
||||
},
|
||||
changeDepartment(e) {
|
||||
if (e) {
|
||||
this.departments.map(item => {
|
||||
if (item.id == e) {
|
||||
this.dName = item.name
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.dName = '全部科室'
|
||||
}
|
||||
},
|
||||
// 合并单元格
|
||||
generateMergeCells(data) {
|
||||
const columns = this.$refs.table.getColumns()
|
||||
let mergeCells = [];
|
||||
const columnsToMerge = ['department_name', 'name', 'allDay','allConvertTime'];
|
||||
columnsToMerge.forEach(key => {
|
||||
const col = columns.findIndex(item => item['field'] === key);
|
||||
if (col === -1) {
|
||||
return;
|
||||
}
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
let rowspan = 1;
|
||||
const currentValue = data[i][key];
|
||||
for (let j = i + 1; j < data.length; j++) {
|
||||
if (data[j][key] === currentValue) {
|
||||
rowspan++;
|
||||
} else {
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (rowspan > 1) {
|
||||
mergeCells.push({
|
||||
row: i,
|
||||
col,
|
||||
rowspan,
|
||||
colspan: 1
|
||||
});
|
||||
i += rowspan - 1;
|
||||
}
|
||||
}
|
||||
});
|
||||
return mergeCells;
|
||||
},
|
||||
|
||||
},
|
||||
computed: {},
|
||||
created() {
|
||||
this.my_department_id = store.state.department?store.state.department.id:''
|
||||
this.dName = store.state.department?store.state.department.name:'全部科室'
|
||||
if(this.my_department_id){
|
||||
this.is_bgs = this.my_department_id==2?true:false
|
||||
this.select.department_id = this.my_department_id
|
||||
|
||||
}
|
||||
this.getDepartmentList()
|
||||
this.getList()
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
if (this.$refs["table"] && this.$refs["toolbar"]) {
|
||||
this.$refs["table"].connect(this.$refs["toolbar"]);
|
||||
}
|
||||
});
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
::v-deep .vxe-body--column {
|
||||
border-left: 1px solid #333 !important;
|
||||
border-bottom: 1px solid #333 !important;
|
||||
}
|
||||
::v-deep th.vxe-header--column{
|
||||
border-left: 1px solid #333 !important;
|
||||
border-bottom: 2px solid #333 !important;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue