dev-cl
qsh
4 months ago
parent
f3b5079fbe
commit
a9c5d16926
@ -0,0 +1,53 @@ |
|||||||
|
<template> |
||||||
|
<Dialog v-model="dialogVisible" title="生成工资条" style="width: 800px"> |
||||||
|
<el-form :model="formData" ref="formRef" :rules="rules" label-width="80px"> |
||||||
|
<el-row :gutter="20"> |
||||||
|
<el-col :span="12" :offset="0"> |
||||||
|
<el-form-item label="年月" prop="yearmonth"> |
||||||
|
<el-date-picker v-model="formData.yearmonth" type="month" placeholder="选择年月" /> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
<el-row :gutter="20"> |
||||||
|
<el-col :span="12" :offset="0"> |
||||||
|
<el-form-item label="导入奖金" size="normal"> |
||||||
|
<UploadFile v-model="formData.files1" :limit="1" :isShowTip="false" /> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
<el-col :span="12" :offset="0"> |
||||||
|
<el-form-item label="导入考勤" size="normal"> |
||||||
|
<UploadFile v-model="formData.files2" :limit="1" :isShowTip="false" /> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
</el-form> |
||||||
|
<template #footer> |
||||||
|
<span> |
||||||
|
<el-button @click="dialogVisible = false">取 消</el-button> |
||||||
|
<el-button type="primary" :disabled="formLoading" @click="handleSave"> |
||||||
|
确 认 生 成 |
||||||
|
</el-button> |
||||||
|
</span> |
||||||
|
</template> |
||||||
|
</Dialog> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script setup name="DialogCreateSalary"> |
||||||
|
const dialogVisible = ref(false) |
||||||
|
|
||||||
|
const formData = ref({}) |
||||||
|
|
||||||
|
const formLoading = ref(false) |
||||||
|
|
||||||
|
const rules = {} |
||||||
|
|
||||||
|
function open() { |
||||||
|
dialogVisible.value = true |
||||||
|
} |
||||||
|
|
||||||
|
defineExpose({ open }) |
||||||
|
|
||||||
|
function handleSave() {} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped></style> |
||||||
@ -1,7 +1,354 @@ |
|||||||
<template> |
<template> |
||||||
<div> 工资条 </div> |
<div> |
||||||
|
<el-form :model="searchForm" ref="searchFormRef" inline> |
||||||
|
<el-form-item> |
||||||
|
<el-input v-model="searchForm.employeeName" placeholder="员工姓名" /> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-date-picker |
||||||
|
v-model="searchForm.month" |
||||||
|
type="month" |
||||||
|
placeholder="年月" |
||||||
|
format="YYYY-MM" |
||||||
|
value-format="YYYY-MM" |
||||||
|
style="width: 100%" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
<el-form-item> |
||||||
|
<el-button @click="handleSearch">查询</el-button> |
||||||
|
<el-button type="primary" plain @click="craeteSalary">生成工资条</el-button> |
||||||
|
<el-button type="primary" @click="importHistorySalary">导入历史工资条</el-button> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
|
||||||
|
<el-table |
||||||
|
v-loading="loading" |
||||||
|
:data="tableList" |
||||||
|
border |
||||||
|
stripe |
||||||
|
:default-expand-all="false" |
||||||
|
row-key="id" |
||||||
|
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }" |
||||||
|
:span-method="spanMethod" |
||||||
|
> |
||||||
|
<el-table-column label="姓名" min-width="90px"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<span v-if="row.children && row.children.length"> |
||||||
|
<span>{{ row.yearmonth }}</span> |
||||||
|
<span class="ml-20px">应发工资人数：30人</span> |
||||||
|
</span> |
||||||
|
<span v-else> |
||||||
|
{{ row.name }} |
||||||
|
</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="dept" label="部门" min-width="90px" /> |
||||||
|
<el-table-column prop="job" label="职位" min-width="90px" /> |
||||||
|
<el-table-column label="应发工资" align="center"> |
||||||
|
<el-table-column label="基本工资" min-width="90px"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-input-number |
||||||
|
v-if="row.edit" |
||||||
|
v-model="row.jbgz" |
||||||
|
:min="0" |
||||||
|
:controls="false" |
||||||
|
size="small" |
||||||
|
style="width: 65px" |
||||||
|
/> |
||||||
|
<span v-else> {{ row.jbgz }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="补贴" min-width="90px"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-input-number |
||||||
|
v-if="row.edit" |
||||||
|
v-model="row.jbgz" |
||||||
|
:min="0" |
||||||
|
:controls="false" |
||||||
|
size="small" |
||||||
|
style="width: 65px" |
||||||
|
/> |
||||||
|
<span v-else> {{ row.jbgz }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="提成" min-width="90px"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-input-number |
||||||
|
v-if="row.edit" |
||||||
|
v-model="row.jbgz" |
||||||
|
:min="0" |
||||||
|
:controls="false" |
||||||
|
size="small" |
||||||
|
style="width: 65px" |
||||||
|
/> |
||||||
|
<span v-else> {{ row.jbgz }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="满勤" min-width="90px"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-input-number |
||||||
|
v-if="row.edit" |
||||||
|
v-model="row.jbgz" |
||||||
|
:min="0" |
||||||
|
:controls="false" |
||||||
|
size="small" |
||||||
|
style="width: 65px" |
||||||
|
/> |
||||||
|
<span v-else> {{ row.jbgz }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="绩效" min-width="90px"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-input-number |
||||||
|
v-if="row.edit" |
||||||
|
v-model="row.jbgz" |
||||||
|
:min="0" |
||||||
|
:controls="false" |
||||||
|
size="small" |
||||||
|
style="width: 65px" |
||||||
|
/> |
||||||
|
<span v-else> {{ row.jbgz }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="其他" min-width="90px"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-input-number |
||||||
|
v-if="row.edit" |
||||||
|
v-model="row.jbgz" |
||||||
|
:min="0" |
||||||
|
:controls="false" |
||||||
|
size="small" |
||||||
|
style="width: 65px" |
||||||
|
/> |
||||||
|
<span v-else> {{ row.jbgz }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="小计" min-width="90px" /> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="应发工资" align="center"> |
||||||
|
<el-table-column label="基本工资" min-width="90px"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-input-number |
||||||
|
v-if="row.edit" |
||||||
|
v-model="row.jbgz" |
||||||
|
:min="0" |
||||||
|
:controls="false" |
||||||
|
size="small" |
||||||
|
style="width: 65px" |
||||||
|
/> |
||||||
|
<span v-else> {{ row.jbgz }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="请假" min-width="90px"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-input-number |
||||||
|
v-if="row.edit" |
||||||
|
v-model="row.jbgz" |
||||||
|
:min="0" |
||||||
|
:controls="false" |
||||||
|
size="small" |
||||||
|
style="width: 65px" |
||||||
|
/> |
||||||
|
<span v-else> {{ row.jbgz }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="缺勤" min-width="90px"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-input-number |
||||||
|
v-if="row.edit" |
||||||
|
v-model="row.jbgz" |
||||||
|
:min="0" |
||||||
|
:controls="false" |
||||||
|
size="small" |
||||||
|
style="width: 65px" |
||||||
|
/> |
||||||
|
<span v-else> {{ row.jbgz }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="旷工" min-width="90px"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-input-number |
||||||
|
v-if="row.edit" |
||||||
|
v-model="row.jbgz" |
||||||
|
:min="0" |
||||||
|
:controls="false" |
||||||
|
size="small" |
||||||
|
style="width: 65px" |
||||||
|
/> |
||||||
|
<span v-else> {{ row.jbgz }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="违纪" min-width="90px"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-input-number |
||||||
|
v-if="row.edit" |
||||||
|
v-model="row.jbgz" |
||||||
|
:min="0" |
||||||
|
:controls="false" |
||||||
|
size="small" |
||||||
|
style="width: 65px" |
||||||
|
/> |
||||||
|
<span v-else> {{ row.jbgz }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="公积金" min-width="90px"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-input-number |
||||||
|
v-if="row.edit" |
||||||
|
v-model="row.jbgz" |
||||||
|
:min="0" |
||||||
|
:controls="false" |
||||||
|
size="small" |
||||||
|
style="width: 65px" |
||||||
|
/> |
||||||
|
<span v-else> {{ row.jbgz }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="社保" min-width="90px"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-input-number |
||||||
|
v-if="row.edit" |
||||||
|
v-model="row.jbgz" |
||||||
|
:min="0" |
||||||
|
:controls="false" |
||||||
|
size="small" |
||||||
|
style="width: 65px" |
||||||
|
/> |
||||||
|
<span v-else> {{ row.jbgz }}</span> |
||||||
</template> |
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="所得税" min-width="90px"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-input-number |
||||||
|
v-if="row.edit" |
||||||
|
v-model="row.jbgz" |
||||||
|
:min="0" |
||||||
|
:controls="false" |
||||||
|
size="small" |
||||||
|
style="width: 65px" |
||||||
|
/> |
||||||
|
<span v-else> {{ row.jbgz }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="其他" min-width="90px"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-input-number |
||||||
|
v-if="row.edit" |
||||||
|
v-model="row.jbgz" |
||||||
|
:min="0" |
||||||
|
:controls="false" |
||||||
|
size="small" |
||||||
|
style="width: 65px" |
||||||
|
/> |
||||||
|
<span v-else> {{ row.jbgz }}</span> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="小计" min-width="90px" /> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="实发工资" fixed="right" /> |
||||||
|
<el-table-column label="操作" fixed="right" width="200"> |
||||||
|
<template #default="{ row }"> |
||||||
|
<el-button |
||||||
|
type="primary" |
||||||
|
style="padding: 0" |
||||||
|
v-if="!row.edit && row.yearmonth" |
||||||
|
text |
||||||
|
@click="handleEdit(row)" |
||||||
|
> |
||||||
|
修改 |
||||||
|
</el-button> |
||||||
|
<el-button |
||||||
|
type="primary" |
||||||
|
v-else-if="row.edit && row.yearmonth" |
||||||
|
text |
||||||
|
style="padding: 0" |
||||||
|
@click="handleSave(row)" |
||||||
|
> |
||||||
|
保存 |
||||||
|
</el-button> |
||||||
|
<el-button |
||||||
|
type="danger" |
||||||
|
v-if="row.yearmonth" |
||||||
|
style="padding: 0" |
||||||
|
text |
||||||
|
@click="handleSave(row)" |
||||||
|
> |
||||||
|
封存 |
||||||
|
</el-button> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
</el-table> |
||||||
|
<DialogCreateSalary ref="createSalaryRef" @success="getList" /> |
||||||
|
<DialogImportSalary ref="importSalaryRef" @success="getList" /> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script setup name="SalarySlip"> |
||||||
|
import DialogCreateSalary from './Comp/DialogCreateSalary.vue' |
||||||
|
const searchForm = ref({}) |
||||||
|
|
||||||
|
onMounted(() => { |
||||||
|
handleSearch() |
||||||
|
}) |
||||||
|
|
||||||
|
function handleSearch() { |
||||||
|
searchForm.value.pageNO = 1 |
||||||
|
getList() |
||||||
|
} |
||||||
|
|
||||||
|
const loading = ref(false) |
||||||
|
const tableList = ref([]) |
||||||
|
const total = ref(0) |
||||||
|
function getList() { |
||||||
|
tableList.value = [ |
||||||
|
{ |
||||||
|
yearmonth: '2024-06', |
||||||
|
id: 1, |
||||||
|
children: [ |
||||||
|
{ id: 11, name: '张三' }, |
||||||
|
{ id: 12, name: '李四' } |
||||||
|
] |
||||||
|
} |
||||||
|
] |
||||||
|
total.value = 0 |
||||||
|
} |
||||||
|
|
||||||
|
const createSalaryRef = ref() |
||||||
|
function craeteSalary() { |
||||||
|
createSalaryRef.value.open() |
||||||
|
} |
||||||
|
|
||||||
|
function importHistorySalary() {} |
||||||
|
|
||||||
|
function spanMethod({ row, columnIndex }) { |
||||||
|
if (row.children && row.children.length > 0) { |
||||||
|
if (columnIndex === 0) { |
||||||
|
return [1, 21] |
||||||
|
} else if (columnIndex == 21) { |
||||||
|
return [1, 1] |
||||||
|
} else { |
||||||
|
return [0, 0] |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
function handleEdit(row) { |
||||||
|
row.edit = true |
||||||
|
row.children.forEach((it) => (it.edit = true)) |
||||||
|
} |
||||||
|
|
||||||
|
function handleSave(row) { |
||||||
|
row.edit = false |
||||||
|
row.children.forEach((it) => (it.edit = false)) |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
<script setup name="SalarySlip"></script> |
<style lang="scss" scoped> |
||||||
|
:deep(.el-table__indent) { |
||||||
|
display: none; |
||||||
|
} |
||||||
|
|
||||||
<style lang="scss" scoped></style> |
:deep(.el-table__placeholder) { |
||||||
|
display: none; |
||||||
|
} |
||||||
|
</style> |
||||||
|
|||||||
Loading…
Reference in new issue