<!-- 奖惩记录 -->
|
<template>
|
<div>
|
<div style="text-align: left; margin-bottom: 15px;">
|
<label>姓名</label>
|
<el-input v-model="search.userName" clearable placeholder="请输入关键字" size="small" style="width: 20vh;"></el-input>
|
<label style="margin-left: 1em">奖惩日期</label>
|
<el-date-picker
|
v-model="search.searchTimeList"
|
:picker-options="pickerOptions"
|
align="right"
|
clearable
|
end-placeholder="结束日期"
|
format="yyyy-MM-dd"
|
range-separator="至"
|
size="small"
|
start-placeholder="开始日期"
|
style="width: 20%"
|
type="daterange"
|
unlink-panels
|
value-format="yyyy-MM-dd 00:00:00">
|
</el-date-picker>
|
<el-button size="small" type="primary" @click="getPersonnelTraining(departId)">查询</el-button>
|
<div style="float: right;">
|
<el-button :loading="outLoading" size="small" type="primary" @click="handleDown">导出</el-button>
|
<el-button size="small" type="primary" @click="dialogVisible = true">新增</el-button>
|
</div>
|
</div>
|
<div class="table">
|
<el-table :data="tableData" height="70vh" style="width: 100%">
|
<el-table-column label="序号" type="index" width="120">
|
<template v-slot="scope">
|
<span>{{ (search.current - 1) * search.size + scope.$index + 1 }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="员工编号" min-width="180" prop="account">
|
</el-table-column>
|
<el-table-column label="姓名" min-width="180" prop="userName">
|
</el-table-column>
|
<el-table-column label="奖惩级别" min-width="180" prop="rewardPunishLevel">
|
</el-table-column>
|
<el-table-column label="奖惩时间" min-width="180" prop="rewardPunishTime">
|
</el-table-column>
|
<el-table-column label="奖惩名称" min-width="180" prop="rewardPunishName">
|
</el-table-column>
|
<el-table-column label="奖惩具体内容" min-width="120" prop="rewardPunishContent">
|
</el-table-column>
|
<el-table-column label="奖惩单位" min-width="180" prop="rewardPunishWorkUnit">
|
</el-table-column>
|
<el-table-column label="创建人" min-width="180" prop="createUserName">
|
</el-table-column>
|
<el-table-column fixed="right" label="操作" width="100">
|
<template v-slot="scope">
|
<el-button size="small" type="text" @click="editForm(scope.row)">编辑</el-button>
|
<el-button size="small" type="text" @click="deleteRow(scope.row)">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
<el-pagination :current-page="1" :page-size="search.size" :page-sizes="[10, 20, 30, 50, 100]"
|
:total="search.total" layout="->,total, sizes, prev, pager, next, jumper"
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange">
|
</el-pagination>
|
</div>
|
<el-dialog
|
:visible.sync="dialogVisible"
|
title="提示"
|
width="50%"
|
@open="getUserList">
|
<div style="height: 40vh">
|
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
|
<el-col :span="12">
|
<el-form-item label="员工编号">
|
<el-input v-model="form.account" disabled size="small"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="员工姓名" prop="userName">
|
<el-select v-model="form.userName" placeholder="请选择" size="small" style="width: 100%" value-key="id"
|
@change="selectUserChange">
|
<el-option v-for="item in responsibleOptions" :key="item.id" :label="item.name" :value="item">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="奖惩级别" prop="rewardPunishLevel">
|
<el-input v-model="form.rewardPunishLevel" size="small"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="奖惩名称" prop="rewardPunishName">
|
<el-input v-model="form.rewardPunishName" size="small"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="奖惩时间" prop="rewardPunishTime">
|
<el-date-picker
|
v-model="form.rewardPunishTime"
|
format="yyyy-MM-dd HH:mm:ss"
|
placeholder="选择日期"
|
size="small"
|
style="width: 100%"
|
type="datetime"
|
value-format="yyyy-MM-dd HH:mm:ss">
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="奖惩单位" prop="rewardPunishWorkUnit">
|
<el-input v-model="form.rewardPunishWorkUnit" size="small"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="24">
|
<el-form-item label="奖惩内容">
|
<el-input v-model="form.rewardPunishContent" :rows="2" size="small" type="textarea"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-form>
|
</div>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="dialogVisible = false">取 消</el-button>
|
<el-button type="primary" @click="saveOrUpdate">确 定</el-button>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import {
|
addOrUpdateRewardPunishmentApi,
|
deleteRewardPunishmentApi,
|
rewardPunishmentExportApi,
|
rewardPunishmentPageApi
|
} from "../../../assets/api/api"
|
export default {
|
props: {
|
departId: {
|
type: Number,
|
default: () => {
|
return null;
|
}
|
},
|
isDepartment: {
|
type: Boolean,
|
default: false
|
}
|
},
|
data() {
|
return {
|
tableData: [],
|
search: {
|
size: 20,
|
current: 1,
|
total: 0,
|
userName: '',
|
searchTimeList: []
|
},
|
form: {},
|
dialogVisible: false,
|
outLoading: false,
|
pickerOptions: {
|
shortcuts: [{
|
text: '最近一周',
|
onClick(picker) {
|
const end = new Date();
|
const start = new Date();
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
|
picker.$emit('pick', [start, end]);
|
}
|
}, {
|
text: '最近一个月',
|
onClick(picker) {
|
const end = new Date();
|
const start = new Date();
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
|
picker.$emit('pick', [start, end]);
|
}
|
}, {
|
text: '最近三个月',
|
onClick(picker) {
|
const end = new Date();
|
const start = new Date();
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
|
picker.$emit('pick', [start, end]);
|
}
|
}]
|
},
|
rules: {
|
userName: [{
|
required: true, message: '请选择员工姓名', trigger: 'change'
|
}],
|
rewardPunishLevel: [{
|
required: true, message: '请输入奖惩级别', trigger: 'blur'
|
}],
|
rewardPunishName: [{
|
required: true, message: '请输入奖惩名称', trigger: 'blur'
|
}],
|
rewardPunishTime: [{
|
required: true, message: '请输入奖惩时间', trigger: 'blur'
|
}],
|
rewardPunishWorkUnit: [{
|
required: true, message: '请输入奖惩单位', trigger: 'blur'
|
}]
|
},
|
responsibleOptions: []
|
};
|
},
|
mounted() {
|
this.getPersonnelTraining(this.departId);
|
},
|
methods: {
|
handleSizeChange(val) {
|
this.search.size = val
|
this.getPersonnelTraining(this.departId);
|
},
|
handleCurrentChange(val) {
|
this.search.current = val
|
this.getPersonnelTraining(this.departId);
|
},
|
async getPersonnelTraining() {
|
const {code, data} = await this.$axios({
|
method: 'get',
|
url: rewardPunishmentPageApi,
|
params: {
|
userId: this.isDepartment ? '' : this.departId,
|
departmentId: this.isDepartment ? this.departId : '',
|
current: this.search.curent,
|
size: this.search.size,
|
userName: this.search.userName,
|
startTime: this.search.searchTimeList && this.search.searchTimeList[0],
|
endTime: this.search.searchTimeList && this.search.searchTimeList[1],
|
}
|
})
|
if (code == 200) {
|
this.tableData = data.records
|
this.search.total = data.total
|
}
|
},
|
handleDown(){
|
this.outLoading = true
|
this.$axios.post(this.$api.deviceCheck.rewardPunishmentExport,{
|
userId: this.isDepartment ? '' : this.departId,
|
departmentId: this.isDepartment ? this.departId : '',
|
userName: this.search.userName,
|
startTime: this.search.searchTimeList && this.search.searchTimeList[0],
|
endTime: this.search.searchTimeList && this.search.searchTimeList[1]
|
},{responseType: 'blob'}).then(res => {
|
this.outLoading = false
|
const blob = new Blob([res], {
|
type: 'application/force-download'
|
})
|
//将Blob 对象转换成字符串
|
let reader = new FileReader();
|
reader.readAsText(blob, 'utf-8');
|
reader.onload = () => {
|
try {
|
let result = JSON.parse(reader.result);
|
if (result.message) {
|
this.$message.error(result.message);
|
} else {
|
// 创建一个超链接，将文件流赋进去，然后实现这个超链接的单击事件
|
const elink = document.createElement('a')
|
elink.download = decodeURI('奖惩记录'+'.xlsx')
|
elink.style.display = 'none'
|
elink.href = URL.createObjectURL(blob)
|
document.body.appendChild(elink)
|
elink.click();
|
URL.revokeObjectURL(elink.href) // 释放URL 对象
|
document.body.removeChild(elink)
|
this.$message.success('导出成功')
|
}
|
} catch (err) {
|
console.log(err);
|
// 创建一个超链接，将文件流赋进去，然后实现这个超链接的单击事件
|
const elink = document.createElement('a')
|
elink.download = decodeURI('奖惩记录'+'.xlsx')
|
elink.style.display = 'none'
|
elink.href = URL.createObjectURL(blob)
|
document.body.appendChild(elink)
|
elink.click();
|
URL.revokeObjectURL(elink.href) // 释放URL 对象
|
document.body.removeChild(elink)
|
this.$message.success('导出成功')
|
}
|
}
|
})
|
},
|
// 获取负责人信息接口
|
getUserList() {
|
this.$axios.get(this.$api.deviceScope.selectUserList).then(res => {
|
if (res.code == 200) {
|
this.responsibleOptions = res.data
|
}
|
})
|
},
|
selectUserChange(val) {
|
this.form.userName = val.name
|
this.form.account = val.account
|
this.form.userId = val.id
|
},
|
editForm(row) {
|
this.dialogVisible = true
|
this.form = {...row};
|
},
|
saveOrUpdate() {
|
this.$refs.form.validate(async (valid) => {
|
if (valid) {
|
this.dialogVisible = false
|
const {code, data} = await this.$axios({
|
method: 'post',
|
url: addOrUpdateRewardPunishmentApi,
|
data: this.form,
|
headers: {
|
'Content-Type': 'application/json'
|
}
|
})
|
if (code == 200) {
|
this.$message.success("操作成功！")
|
this.getPersonnelTraining(this.departId);
|
}
|
}
|
})
|
},
|
async deleteRow(row) {
|
const {code, data} = await this.$axios({
|
method: 'delete',
|
url: deleteRewardPunishmentApi,
|
params: {
|
id: row.id
|
}
|
})
|
if (code == 200) {
|
this.$message.success("操作成功！")
|
this.getPersonnelTraining(this.departId);
|
}
|
}
|
},
|
watch: {
|
// 监听点击el-tree的数据，进行数据刷新
|
departId: {
|
handler(newId, oldId) {
|
this.getPersonnelTraining(newId);
|
}
|
},
|
dialogVisible(newVal) {
|
if (newVal === false) {
|
this.form = {}
|
this.$refs['form'].clearValidate()
|
}
|
}
|
}
|
};
|
</script>
|
