|
@@ -1,252 +1,67 @@
|
|
|
<template>
|
|
|
<div class="white pa-3">
|
|
|
- <m-search :items="searchItems" v-model="searchValues" class="mb-3" @search="onSearch">
|
|
|
- <template #button>
|
|
|
- <el-upload class="el-button pa-0" action="#" :show-file-list="false" :http-request="onImport">
|
|
|
- <m-button type="primary" icon="el-icon-upload2" :loading="importLoading">导入手工数据</m-button>
|
|
|
- </el-upload>
|
|
|
- <m-button type="primary" icon="el-icon-download" :loading="downloadLoading" @click="onExport">导出手工数据模板</m-button>
|
|
|
- <!-- <m-button type="primary" icon="el-icon-check" :loading="submitLoading" :disable="checked" @click="onSubmit">薪酬对比确认</m-button> -->
|
|
|
- </template>
|
|
|
- </m-search>
|
|
|
- <m-table
|
|
|
- :items="items"
|
|
|
- :headers="headers"
|
|
|
- :loading="loading"
|
|
|
- :total="total"
|
|
|
- :page-size="pageInfo.size"
|
|
|
- :page-current="pageInfo.current"
|
|
|
- :row-class-name="rowClassName"
|
|
|
- @page-change="onPageChange"
|
|
|
- @expand-change="onExpandChange"
|
|
|
- >
|
|
|
- <template #expand="{ row }">
|
|
|
- <el-form label-position="left" inline class="demo-table-expand">
|
|
|
- <m-card shadow="nerve">
|
|
|
- <el-timeline>
|
|
|
- <el-timeline-item
|
|
|
- :hide-timestamp="true">
|
|
|
- <el-row>
|
|
|
- <el-col :span="4">月份</el-col>
|
|
|
- <el-col :span="4">绩效薪资</el-col>
|
|
|
- <el-col :span="4">数据来源</el-col>
|
|
|
- <el-col :span="4">写入时间</el-col>
|
|
|
- <el-col :span="4">操作</el-col>
|
|
|
- </el-row>
|
|
|
- </el-timeline-item>
|
|
|
- <el-timeline-item
|
|
|
- v-for="(list, index) in row.childrenList"
|
|
|
- :key="index"
|
|
|
- :hide-timestamp="true">
|
|
|
- <el-row>
|
|
|
- <el-col class="col" :span="4">{{ list.month }}</el-col>
|
|
|
- <el-col class="col" :span="4">{{ list.performanceSalary || '暂无' }}</el-col>
|
|
|
- <el-col class="col" :span="4">{{ list.dataType === 1 ? '手工录入' : '系统数据'}}</el-col>
|
|
|
- <el-col class="col" :span="4">{{ list.createDate }}</el-col>
|
|
|
- <el-col class="col" :span="4">
|
|
|
- <m-button v-if="checked" type="text" size="small" icon="el-icon-check" disabled>已使用当前版本</m-button>
|
|
|
- <m-button
|
|
|
- v-else
|
|
|
- type="primary"
|
|
|
- size="small"
|
|
|
- @click="onConfirm(list)"
|
|
|
- >确认使用该版本</m-button>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </el-timeline-item>
|
|
|
- </el-timeline>
|
|
|
- </m-card>
|
|
|
- </el-form>
|
|
|
- </template>
|
|
|
- </m-table>
|
|
|
+ <el-tabs v-model="activeName" @tab-click="handleClick">
|
|
|
+ <el-tab-pane
|
|
|
+ v-for="item in items"
|
|
|
+ :key="item.name"
|
|
|
+ :label="item.label"
|
|
|
+ :name="item.name"
|
|
|
+ >
|
|
|
+ <component :is="item.component" :ref="item.name" @hook:mounted="onComponentMounted" @history="onHistory"></component>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import {
|
|
|
- getComparisonPage,
|
|
|
- uploadComparisonTemplate,
|
|
|
- downloadComparisonTemplate,
|
|
|
- getComparisonByEmployee,
|
|
|
- getComparisonConfirm,
|
|
|
- confirmComparisonVersion
|
|
|
-} from '@/api/salary'
|
|
|
-import { dateFormat } from '@/utils/date'
|
|
|
-import { downloadFile } from '@/utils'
|
|
|
export default {
|
|
|
name: 'salary-comparison',
|
|
|
data () {
|
|
|
return {
|
|
|
- expandRow: [],
|
|
|
- importLoading: false,
|
|
|
- downloadLoading: false,
|
|
|
- submitLoading: false,
|
|
|
- searchItems: [
|
|
|
- {
|
|
|
- label: '月份',
|
|
|
- prop: 'month',
|
|
|
- type: 'datePicker',
|
|
|
- option: {
|
|
|
- editable: false,
|
|
|
- clearable: false,
|
|
|
- placeholder: '请选择月份',
|
|
|
- type: 'month',
|
|
|
- valueFormat: 'yyyy-MM',
|
|
|
- format: 'yyyy 年 MM 月'
|
|
|
- }
|
|
|
- },
|
|
|
- { label: '部门', prop: 'organizationName', type: 'input', option: { placeholder: '请输入部门' } },
|
|
|
- { label: '姓名', prop: 'employeeName', type: 'input', option: { placeholder: '请输入姓名' } }
|
|
|
- ],
|
|
|
- searchValues: {
|
|
|
- month: dateFormat('YYYY-mm', new Date()),
|
|
|
- organizationName: null,
|
|
|
- employeeName: null
|
|
|
- },
|
|
|
- headers: [
|
|
|
- { type: 'expand', prop: 'expand' },
|
|
|
- { label: '机构', prop: 'organizationName' },
|
|
|
- { label: '姓名', prop: 'employeeName' },
|
|
|
- { label: '统一认证号', prop: 'unifiedCertificationNumber' },
|
|
|
- { label: '月份', prop: 'month' }
|
|
|
- // { label: '操作', prop: 'action', align: 'center', width: 100 }
|
|
|
- ],
|
|
|
- items: [
|
|
|
- ],
|
|
|
- loading: false,
|
|
|
- total: 0,
|
|
|
- pageInfo: {
|
|
|
- current: 1,
|
|
|
- size: 10
|
|
|
- },
|
|
|
- checked: false
|
|
|
+ activeName: '',
|
|
|
+ items: [],
|
|
|
+ itemData: {}
|
|
|
}
|
|
|
},
|
|
|
created () {
|
|
|
- this.init()
|
|
|
+ this.items = this.$route.meta.roles.filter(e => e.hidden === 1).sort((a, b) => b - a).map(e => {
|
|
|
+ return {
|
|
|
+ name: e.name,
|
|
|
+ label: e.label,
|
|
|
+ component: () => import(`./${e.component}/index.vue`)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ if (this.$route.query.name) {
|
|
|
+ this.activeName = this.$route.query.name
|
|
|
+ } else {
|
|
|
+ this.activeName = this.items[0].name
|
|
|
+ }
|
|
|
},
|
|
|
methods: {
|
|
|
- async init () {
|
|
|
- try {
|
|
|
- const { data } = await getComparisonPage({
|
|
|
- page: this.pageInfo,
|
|
|
- ...this.searchValues
|
|
|
- })
|
|
|
- // 确认是否已经确认方案
|
|
|
- const { data: _data } = await getComparisonConfirm({
|
|
|
- page: {
|
|
|
- size: 10,
|
|
|
- current: 1
|
|
|
- },
|
|
|
- month: this.searchValues.month
|
|
|
- })
|
|
|
- this.checked = _data.records[0]?.version ?? false
|
|
|
- this.items = data.records.map(e => {
|
|
|
- return {
|
|
|
- ...e,
|
|
|
- childrenList: []
|
|
|
- }
|
|
|
- })
|
|
|
- this.total = data.total
|
|
|
- } catch (error) {
|
|
|
- this.$message.error(error)
|
|
|
- }
|
|
|
- },
|
|
|
- rowClassName ({ row, rowIndex }) {
|
|
|
- console.log(111, row)
|
|
|
- return this.expandRow.includes(row.unifiedCertificationNumber) ? 'grey' : null
|
|
|
- },
|
|
|
- onSearch () {
|
|
|
- this.pageInfo.current = 1
|
|
|
- this.init()
|
|
|
- },
|
|
|
- async onImport (response) {
|
|
|
- this.importLoading = true
|
|
|
- const formData = new FormData()
|
|
|
- formData.append('file', response.file)
|
|
|
- try {
|
|
|
- await uploadComparisonTemplate(formData)
|
|
|
- this.$message.success('导入成功')
|
|
|
- this.init()
|
|
|
- } catch (error) {
|
|
|
- this.$message.error(error)
|
|
|
- } finally {
|
|
|
- this.importLoading = false
|
|
|
- }
|
|
|
+ handleClick () {
|
|
|
+ this.$router.push(`${this.$route.path}?name=${this.activeName}`)
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs[this.activeName][0].onInit()
|
|
|
+ })
|
|
|
},
|
|
|
- async onExport () {
|
|
|
- this.downloadLoading = true
|
|
|
- try {
|
|
|
- const { data, name } = await downloadComparisonTemplate()
|
|
|
- downloadFile(data, name)
|
|
|
- } catch (error) {
|
|
|
- this.$message.error(error)
|
|
|
- } finally {
|
|
|
- this.downloadLoading = false
|
|
|
- }
|
|
|
- },
|
|
|
- async onExpandChange (row, expandedRows) {
|
|
|
- this.expandRow = expandedRows.map(e => e.unifiedCertificationNumber)
|
|
|
- if (row.childrenList.length) {
|
|
|
- return
|
|
|
- }
|
|
|
- try {
|
|
|
- const { data } = await getComparisonByEmployee({
|
|
|
- page: {
|
|
|
- size: 999,
|
|
|
- current: 1
|
|
|
- },
|
|
|
- entity: {
|
|
|
- unifiedCertificationNumber: row.unifiedCertificationNumber,
|
|
|
- month: row.month
|
|
|
- }
|
|
|
- })
|
|
|
- row.childrenList = data.records
|
|
|
- } catch (error) {
|
|
|
- this.$message.error(error)
|
|
|
- }
|
|
|
+ onComponentMounted () {
|
|
|
+ this.$refs[this.activeName] && this.$refs[this.activeName][0].onInit()
|
|
|
},
|
|
|
- onConfirm (item) {
|
|
|
- const h = this.$createElement
|
|
|
- this.$confirm(h('div', null, [
|
|
|
- h('p', undefined, '确认后将无法修改,是否确认?'),
|
|
|
- h('p', { style: 'color: #ff5555' }, '注:版本确认之后所有人将同步使用当前选择的版本')
|
|
|
- ]), '提示', {
|
|
|
- confirmButtonText: '确定',
|
|
|
- cancelButtonText: '取消',
|
|
|
- type: 'warning'
|
|
|
- }).then(async () => {
|
|
|
- try {
|
|
|
- await confirmComparisonVersion({
|
|
|
- employeePerformanceConfirmation: {
|
|
|
- month: item.month,
|
|
|
- version: item.version
|
|
|
- }
|
|
|
- })
|
|
|
- this.$message.success('确认成功')
|
|
|
- this.checked = true
|
|
|
- } catch (error) {
|
|
|
- this.$message.error(error)
|
|
|
- }
|
|
|
- }).catch(_ => {})
|
|
|
+ onHistory (row) {
|
|
|
+ this.itemData = row
|
|
|
+ this.$refs.drawerHistoryRefs.open(`${row.title} 历史记录`)
|
|
|
},
|
|
|
- onSubmit () {
|
|
|
- this.submitLoading = true
|
|
|
- },
|
|
|
- onPageChange (page) {
|
|
|
- this.pageInfo.current = page
|
|
|
- this.init()
|
|
|
+ async getPage () {
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+
|
|
|
+ })
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
-.col {
|
|
|
- height: 32px;
|
|
|
- line-height: 30px;
|
|
|
-}
|
|
|
-::v-deep .grey {
|
|
|
- background-color: #f0f0f0;
|
|
|
+::v-deep .el-tabs__content {
|
|
|
+ overflow: visible !important;
|
|
|
}
|
|
|
</style>
|