张涛
2024-08-30 082b572b91abd0d5ae8e409714553130448aa6d1
src/views/employeeSalary/payroll/index.vue
@@ -2,29 +2,20 @@
    <div class="silkRegister-form">
        <div class="filter">
            <div class="filter-card">
                <CommonSearch
                        :show-add="false"
                        :show-download="false"
                        :amount-view="false"
                        :show-action-btn="false"
                        placeholder="请输入关键词"
                        @searchClick="onFilterSearch"
                >
                <CommonSearch :show-add="false" :show-download="false" :amount-view="false" :show-action-btn="false"
                    placeholder="请输入关键词" @searchClick="onFilterSearch">
                    <template slot="leftButton">
                        <div class="margin_right_20px" style="width:200px;">
                            <el-date-picker v-model="object.cycle" style="width:100%"
                                            @change="changeDate"
                                            :clearable="false" type="month" placeholder="选择日期"
                                            :picker-options="pickerOptions"
                            <el-date-picker v-model="object.cycle" style="width:100%" @change="changeDate"
                                :clearable="false" type="month" placeholder="选择日期" :picker-options="pickerOptions"
                                            value-format="yyyy-MM">
                            </el-date-picker>
                        </div>
                        <div>
                            <el-select placeholder="请选择工种" v-model="object.workTypeCode" filterable
                                @change="changeWorkTypeCode"
                                clearable
                            >
                                <el-option v-for="workTypeCode in workTypeCodeList"   :label="workTypeCode.label" :value="workTypeCode.value" />
                                @change="changeWorkTypeCode" clearable>
                                <el-option v-for="workTypeCode in workTypeCodeList" :label="workTypeCode.label"
                                    :value="workTypeCode.value" :key="workTypeCode.value" />
                            </el-select>
                        </div>
                    </template>
@@ -35,12 +26,8 @@
        <div class="body">
            <div class="body-card">
                <div class="list-view">
                    <TableCommonView
                            ref="tableListRef"
                            v-loading="loading"
                            :table-list="tableList"
                            @selTableCol="selTableCol"
                    >
                    <TableCommonView ref="tableListRef" v-loading="loading" :table-list="tableList"
                        @selTableCol="selTableCol" @inputContent="tableInputHandle">
                    </TableCommonView>
                </div>
                 <div class="btn-pager">
@@ -53,7 +40,7 @@
</template>
<script>
    import { getPayrollSalaryPlanListApi } from  "@/api/employeeSalary/payroll.js"
import { getPayrollConstituteListApi, savePayrollConstituteApi } from "@/api/employeeSalary/payroll.js"
    import pageMixin from "@/components/makepager/pager/mixin/pageMixin"
    import NewDate from "@/api/date";
    const { getPreviousMonth } = NewDate;
@@ -85,40 +72,9 @@
            }
        },
        created() {
            this.setTable();
            this.initData();
        },
        computed: {
        },
        methods: {
            initTable(){
                this.showcol=[ '工种','姓名','生产工资','满勤',
                    '超时工资','加班工资','交通补贴',
                    '带徒补贴','岗位补贴','社保补贴' ,'工龄补贴',
                    '不达保底','质量奖','奖罚1','奖罚2/清凉补贴',
                    '日常检查/奖罚3','停机补贴','应发工资','备注'
                ];
                this.tableColumn=[
                    { label: "工种", prop: "workTypeName",default:true,fixed:true},
                    { label: "姓名", prop: "workerName",default:true,fixed:true},
                    { label: "应发工资", prop: "amount",default:true,fixed:true},
                    { label: "生产工资", prop: "productionAmount" ,default:true},
                    { label: "超时工资", prop: "timeoutAmount",default:true},
                    { label: "加班工资", prop: "overtimeAmount",default:true},
                    { label: "交通补贴", prop: "trafficAmount" ,default:true},
                    { label: "带徒补贴", prop: "masterApprenticeAmount",default:true },
                    { label: "岗位补贴", prop: "positionAmount",default:true},
                    { label: "社保补贴", prop: "socialSecurityAmount",default:true},
                    { label: "工龄补贴", prop: "seniorityAmount",default:true },
                    { label: "不达保底", prop: "baseSalaryAmount",default:true},
                    { label: "质量奖", prop: "qualityStandardsAmount" ,default:true},
                    { label: "奖罚1", prop: "substandardQualityAmount",default:true},
                    { label: "奖罚2/清凉补贴", prop: "heatAmount",default:true},
                    { label: "日常检查/奖罚3", prop: "dailyInspectionAmount",default:true},
                    { label: "停机补贴", prop: "downtimeAmount",default:true},
                    { label: "备注", prop: "remark",default:true},
                ]
            },
            initData(){
              this.workTypeCodeList=[
                  {label:'挡车工',value:'weavers'},
@@ -139,7 +95,6 @@
              this.getData()
            },
            setTable() {
                this.initTable();
                this.tableList = {
                    selectIndex: true,
                    isFixed:true,
@@ -169,17 +124,73 @@
                this.showcol = val;
                this.tableList.tableColumn = this.setColumnVisible(val);
            },
        async tableInputHandle(prop, row) {
            const data = {
                amount: row[prop],
                cycle: this.object.cycle,
                salaryPlanId: parseInt(prop),
                workerId: row.workerId,
            }
            const { code } = await savePayrollConstituteApi(data)
            if (code == 200) {
                this.$message.success("薪资保存成功");
            } else {
                this.$message.error("薪资保存失败");
            }
            this.getData()
        },
            // 请求数据
            async getData() {
                this.loading = true
                const {code,data,total}=await getPayrollSalaryPlanListApi({
            const { code, data, total } = await getPayrollConstituteListApi({
                    ...this.object,
                    page: this.pagerOptions.currPage,
                    pageSize: this.pagerOptions.pageSize,
                    keyword:this.keyword
                });
                if(code===200){
                    this.tableList.tableInfomation=data;
                const tableData = []
                // 处理表头
                const dynamicColumn = data[0].list.map(item => {
                    return {
                        label: item.salaryPlan.name,
                        prop: item.salaryPlan.ID.toString(),
                        isEditTd: true,
                        default: true,
                    }
                })
                // 处理数据
                data.forEach(item => {
                    const dataObj = {}
                    dataObj.workTypeName = item.worker.workType
                    dataObj.workerName = item.worker.name
                    dataObj.workerId = item.worker.id
                    dataObj.amount = item.amount
                    dataObj.remark = item.remark
                    if (item.list.length > 0) {
                        item.list.forEach(subItem => {
                            dataObj[subItem.salaryPlan.ID.toString()] = subItem.amount
                        })
                    }
                    tableData.push(dataObj)
                })
                // 处理数据
                const col = dynamicColumn.map(item => item.label)
                this.showcol = ['工种', '姓名', '应发工资', ...col, '备注'];
                this.tableColumn = [
                    { label: "工种", prop: "workTypeName", default: true, fixed: true },
                    { label: "姓名", prop: "workerName", default: true, fixed: true },
                    { label: "应发工资", prop: "amount", default: true, fixed: true },
                    ...dynamicColumn,
                    { label: "备注", prop: "remark", default: true },
                ]
                this.setTable();
                this.tableList.tableInfomation = tableData;
                    this.pagerOptions.totalCount=total;
                }
                this.loading=false;
@@ -203,11 +214,13 @@
    .silkRegister-form {
        height: 100%;
        overflow: hidden;
        .filter {
            height: 80px;
            display: flex;
            align-items: center;
            padding: 12px 20px 0 20px;
            &-card {
                height: 80px;
                display: flex;
@@ -219,24 +232,29 @@
                background-color: #fff;
            }
        }
        .body {
            box-sizing: border-box;
            padding: 10px 20px;
            border-radius: 12px;
            height: calc(100% - 92px);
            .body-card {
                background-color: #fff;
                border-radius: 12px;
                height: 100%;
                overflow: hidden;
            }
            .list-view {
                height: calc(100% - 100px);
                overflow: hidden;
            }
            .btn-pager {
                display: flex;
                margin-top: 10px;
                .page {
                    margin-left: auto;
                }