Skip to content

薪
薪瑞通-前端
Commit 2f666340 authored by 谢子梦's avatar 谢子梦
Browse files
Options

stage：发信情况统计

parent 2ac2e7f1
Hide whitespace changes
Inline Side-by-side
Showing with 344 additions and 0 deletions
src/views/statistics/index.vue 0 → 100644
View file @ 2f666340
<template>
<!-- 统计功能页面 -->
<div class="app-container">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="按月统计" name="first">
<!-- 按月-查询条件框 -->
<el-form :model="paramsMonth" label-width="80px" label-position="left">
<el-row :gutter="22">
<el-col :span="8">
<el-form-item label="单位名称">
<el-input v-model="paramsMonth.companyName" placeholder="请输入单位名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="统计月份">
<el-date-picker style="width: 100%;" format="yyyy 年 MM 月" value-format="yyyy-MM"
v-model="paramsMonth.timeVal" type="month" placeholder="选择月">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8">
<div>
<el-button size="small" icon="el-icon-search" type="primary"
@click="getStatisticsListMonth">搜索</el-button>
<el-button size="small" icon="el-icon-refresh" type="info"
@click="reactMonthStatistics">重置</el-button>
</div>
</el-col>
</el-row>
</el-form>
<!-- 列表内容部分 -->
<el-table :data="statisticsMothList" style="width: 100%" :header-cell-style="{ textAlign: 'center' }"
:cell-style="{ textAlign: 'center' }" height="calc(100vh - 300px)" show-summary
:summary-method="getSummariesMonth">
<el-table-column label="序号" type="index" :index="indexMonthFN" width="50">
</el-table-column>
<el-table-column prop="companyName" label="单位名称">
</el-table-column>
<el-table-column prop="actualPayable" label="实发工资">
</el-table-column>
<el-table-column prop="timeVal" label="时间">
</el-table-column>
<el-table-column label="公司承担部分">
<el-table-column prop="gsbxCompanyMoney" label="工商保险">
</el-table-column>
<el-table-column prop="providentFundCompanyMoney" label="公积金">
</el-table-column>
<el-table-column prop="sybxCompanyMoney" label="失业保险">
</el-table-column>
<el-table-column prop="syubxCompanyMoney" label="生育保险">
</el-table-column>
<el-table-column prop="ylbxCompanyMoney" label="养老保险">
</el-table-column>
<el-table-column prop="ysbxCompanyMoney" label="医疗保险">
</el-table-column>
</el-table-column>
</el-table>
<div style="text-align: end;margin-top:6px;">
<el-pagination @size-change="handleSizeChangeMonth" @current-change="handleCurrentChangeMonth"
:current-page="paramsMonth.pageNum" :page-sizes="[10, 20, 30, 40]"
:page-size="paramsMonth.pageSize" layout="total, sizes, prev, pager, next, jumper"
:total="totalMonth">
</el-pagination>
</div>
</el-tab-pane>
<el-tab-pane label="按年统计" name="second">
<!-- 按年-查询条件框 -->
<el-form :model="paramsYear" label-width="80px" label-position="left">
<el-row :gutter="22">
<el-col :span="8">
<el-form-item label="单位名称">
<el-input v-model="paramsYear.companyName" placeholder="请输入单位名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="统计年份">
<el-date-picker style="width: 100%;" format="yyyy 年" value-format="yyyy"
v-model="paramsYear.timeVal" type="year" placeholder="选择年">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8">
<div>
<el-button size="small" icon="el-icon-search" type="primary"
@click="getStatisticsListYear">搜索</el-button>
<el-button size="small" icon="el-icon-refresh" type="info"
@click="reactYearStatistics">重置</el-button>
</div>
</el-col>
</el-row>
</el-form>
<!-- 列表内容部分 -->
<el-table :data="statisticsYearList" style="width: 100%" :header-cell-style="{ textAlign: 'center' }"
:cell-style="{ textAlign: 'center' }" height="calc(100vh - 300px)" show-summary
:summary-method="getSummariesYear">
<el-table-column label="序号" type="index" :index="indexYearFN" width="50">
</el-table-column>
<el-table-column prop="companyName" label="单位名称">
</el-table-column>
<el-table-column prop="actualPayable" label="实发工资">
</el-table-column>
<el-table-column prop="timeVal" label="时间">
</el-table-column>
<el-table-column label="公司承担部分">
<el-table-column prop="gsbxCompanyMoney" label="工商保险">
</el-table-column>
<el-table-column prop="providentFundCompanyMoney" label="公积金">
</el-table-column>
<el-table-column prop="sybxCompanyMoney" label="失业保险">
</el-table-column>
<el-table-column prop="syubxCompanyMoney" label="生育保险">
</el-table-column>
<el-table-column prop="ylbxCompanyMoney" label="养老保险">
</el-table-column>
<el-table-column prop="ysbxCompanyMoney" label="医疗保险">
</el-table-column>
</el-table-column>
</el-table>
<div style="text-align: end;margin-top:6px;">
<el-pagination @size-change="handleSizeChangeYear" @current-change="handleCurrentChangeYear"
:current-page="paramsYear.pageNum" :page-sizes="[10, 20, 30, 40]"
:page-size="paramsYear.pageSize" layout="total, sizes, prev, pager, next, jumper"
:total="totalYear">
</el-pagination>
</div>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
import { payOutStatiStics } from '@/api/business/payOutDetail';
export default {
data() {
return {
/** 按月统计参数 */
paramsMonth: {
pageNum: 1,
pageSize: 10,
timeUnit: 'MONTH',
timeVal: null,
companyName: null,
},
totalMonth: 0,
statisticsMothList: [],
/** 按年统计参数 */
paramsYear: {
pageNum: 1,
pageSize: 10,
timeUnit: 'YEAR',
timeVal: null,
companyName: null,
},
totalYear: 0,
statisticsYearList: [],
activeName: 'first'
}
},
created() { },
mounted() {
this.getStatisticsListMonth()
},
methods: {
/** 按年统计-总计方法 */
getSummariesYear(param) {
const { columns, data } = param;
const sums = [];
columns.forEach((column, index) => {
if (index === 0) {
sums[index] = '总计';
return;
}
if (index === 1) {
sums[index] = '';
return
}
if (index === 3) {
sums[index] = '';
return
}
const values = data.map(item => Number(item[column.property]));
if (!values.every(value => isNaN(value))) {
sums[index] = values.reduce((prev, curr) => {
const value = Number(curr);
if (!isNaN(value)) {
return prev + curr;
} else {
return prev;
}
}, 0);
// sums[index] += ' 元';
} else {
sums[index] = 'N/A';
}
});
let arrAY = []
sums.forEach((ele, index) => {
if (index != 0 && index != 1 && index != 3) {
let tys = null
tys = Math.floor(Number(ele) * 100) / 100
arrAY.push(tys)
} else {
arrAY.push(ele)
}
})
this.$forceUpdate()
return arrAY;
},
/** 按月统计-总计方法 */
getSummariesMonth(param) {
const { columns, data } = param;
const sums = [];
columns.forEach((column, index) => {
if (index === 0) {
sums[index] = '总计';
return;
}
if (index === 1) {
sums[index] = '';
return
}
if (index === 3) {
sums[index] = '';
return
}
const values = data.map(item => Number(item[column.property]));
if (!values.every(value => isNaN(value))) {
sums[index] = values.reduce((prev, curr) => {
const value = Number(curr);
if (!isNaN(value)) {
return prev + curr;
} else {
return prev;
}
}, 0);
// sums[index] += ' 元';
} else {
sums[index] = 'N/A';
}
});
let arrAY = []
sums.forEach((ele, index) => {
if (index != 0 && index != 1 && index != 3) {
let tys = null
tys = Math.floor(Number(ele) * 100) / 100
arrAY.push(tys)
} else {
arrAY.push(ele)
}
})
this.$forceUpdate()
return arrAY;
},
/** 按年统计-重置方法 */
reactYearStatistics() {
this.paramsYear = {
pageNum: 1,
pageSize: 10,
timeUnit: 'YEAR',
timeVal: null,
companyName: null,
}
this.getStatisticsListYear()
},
/** 按月统计-重置方法 */
reactMonthStatistics() {
this.paramsMonth = {
pageNum: 1,
pageSize: 10,
timeUnit: 'MONTH',
timeVal: null,
companyName: null,
}
this.getStatisticsListMonth()
},
/** 按年统计-每页多少条 */
handleSizeChangeYear(val) {
this.paramsYear.pageSize = val
this.getStatisticsListYear()
},
/** 按年统计 - 当前第几页 */
handleCurrentChangeYear(val) {
this.paramsYear.pageNum = val
this.getStatisticsListYear()
},
/** 按月统计-每页多少条 */
handleSizeChangeMonth(val) {
this.paramsMonth.pageSize = val
this.getStatisticsListMonth()
},
/** 按月统计-当前页 */
handleCurrentChangeMonth(val) {
this.paramsMonth.pageNum = val
this.getStatisticsListMonth()
},
//** 按月序号方法 */
indexMonthFN(index) {
return index + (this.paramsMonth.pageNum - 1) * this.paramsMonth.pageSize + 1
},
/** 按年同合计-排序方法 */
indexYearFN(index) {
return index + (this.paramsYear.pageNum - 1) * this.paramsYear.pageSize + 1
},
/** tab切换执行的方法 */
handleClick(tab, event) {
if (this.activeName == 'first') {
this.getStatisticsListMonth()
} else if (this.activeName == 'second') {
this.getStatisticsListYear()
}
},
/** 获取发薪情况统计列表功能-按月 */
getStatisticsListMonth() {
this.$modal.loading("加载中...");
payOutStatiStics(this.paramsMonth).then(res => {
if (res.code == 200) {
this.statisticsMothList = res.rows
this.totalMonth = res.total
this.$forceUpdate()
}
}).finally(() => {
this.$modal.closeLoading()
})
},
/** 获取发薪情况统计列表功能-按年 */
getStatisticsListYear() {
this.$modal.loading("加载中...");
payOutStatiStics(this.paramsYear).then(res => {
if (res.code == 200) {
this.statisticsYearList = res.rows
this.totalYear = res.total
this.$forceUpdate()
}
}).finally(() => {
this.$modal.closeLoading()
})
}
}
}
</script>
<style lang="scss" scoped></style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment