<!-- 培训记录 -->
|
<template>
|
<div>
|
<div class="flex_table">
|
<div v-if="isDepartment" style="width: 50%">
|
<TableCard :showTitle="false">
|
<template v-slot:form>
|
<div class="items_center">
|
<span>姓名</span>
|
<el-input v-model="trainingPagination.userName" class="search" clearable placeholder="请输入"
|
size="small"></el-input>
|
<el-button size="small" type="primary" @click="getPersonnelTraining(departId)">查询</el-button>
|
</div>
|
<div>
|
<!-- <el-button :loading="outLoading" size="small" type="primary" @click="exportExcel">导出</el-button>-->
|
</div>
|
</template>
|
<template v-slot:table>
|
<limsTable :column="trainingColumn" :currentChange="currentChange" :height="'calc(100vh - 20em)'"
|
:highlightCurrentRow="true" :table-data="trainingTableData" :table-loading="trainingLoading"
|
style="padding: 0 15px;" :page="trainingPagination" @pagination="trainingPaginationMethod">
|
</limsTable>
|
</template>
|
</TableCard>
|
</div>
|
<div :style="`width: ${isDepartment ? '50%' : '100%'};`">
|
<TableCard :showTitle="false">
|
<template v-slot:form>
|
<div class="items_center">
|
<span>年份</span>
|
<el-date-picker v-model="searchForm.trainingDate" clearable format="yyyy" placeholder="选择年" size="small"
|
style="margin: 0 10px" type="year" value-format="yyyy">
|
</el-date-picker>
|
<el-button size="small" type="primary"
|
@click="queryPersonnelDetailsPage(currentChangeRow.userId)">查询</el-button>
|
<el-button size="small" type="primary" @click="openDownloadDia(currentChangeRow)">导出</el-button>
|
</div>
|
</template>
|
<template v-slot:table>
|
<limsTable :column="trainingPersonColumn" :height="'calc(100vh - 18em)'"
|
:table-data="trainingPersonTableData" :table-loading="trainingPersonLoading" style="padding: 0 15px;"
|
:page="trainingPersonPagination" @pagination="trainingPersonPaginationMethod">
|
</limsTable>
|
</template>
|
</TableCard>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import limsTable from "@/components/Table/lims-table.vue";
|
import TableCard from "@/components/TableCard/index.vue";
|
import {
|
exportTrainingRecord,
|
trainingSelectTrainingRecord,
|
queryPersonnelDetails,
|
} from '@/api/cnas/personnel/personnelInfo.js'
|
export default {
|
components: { TableCard, limsTable },
|
props: {
|
departId: {
|
type: Number,
|
default: () => {
|
return null;
|
}
|
},
|
isDepartment: {
|
type: Boolean,
|
default: false
|
}
|
},
|
data() {
|
return {
|
outLoading: false,
|
trainingForm: {},
|
trainingColumn: [
|
{
|
label: '员工编号',
|
prop: 'account',
|
width: '100'
|
}, {
|
label: '姓名',
|
prop: 'name'
|
}, {
|
label: '所在部门',
|
prop: 'departLimsName',
|
width: '150'
|
}, {
|
label: '职称',
|
prop: 'professionalTitle'
|
}, {
|
label: '最高学历',
|
prop: 'officialAcademicRedentials',
|
width: '100'
|
}, {
|
label: '入单位时间',
|
prop: 'unitTime',
|
width: '150'
|
},
|
// {
|
// fixed: 'right',
|
// dataType: 'action',
|
// width: 80,
|
// label: '操作',
|
// operation: [
|
// {
|
// name: '导出',
|
// type: 'text',
|
// clickFun: (row) => {
|
// this.openDownloadDia(row)
|
// }
|
// }
|
// ]
|
// }
|
],
|
trainingTableData: [],
|
trainingLoading: false,
|
trainingPagination: {
|
size: 20,
|
total: 0,
|
current: 1,
|
userName: null
|
},
|
searchForm: {
|
trainingDate: ''
|
},
|
trainingPersonColumn: [
|
{
|
label: '培训日期',
|
prop: 'trainingDate'
|
}, {
|
label: '培训内容',
|
prop: 'trainingContent'
|
}, {
|
label: '培训课时',
|
prop: 'educationBackground'
|
}, {
|
label: '课时',
|
prop: 'classHour'
|
}, {
|
label: '培训结果',
|
prop: 'examinationResults',
|
}, {
|
label: '备注',
|
prop: 'remarks'
|
}
|
],
|
trainingPersonTableData: [],
|
trainingPersonLoading: false,
|
trainingPersonPagination: {
|
size: 20,
|
current: 1,
|
total: 0
|
},
|
currentChangeRow: '',
|
};
|
},
|
mounted() {
|
this.getPersonnelTraining(this.departId);
|
},
|
methods: {
|
// exportExcel() {
|
// this.outLoading = true;
|
// const name = this.isDepartment ? 'departmentId' : 'userId';
|
// this.$axios.get(this.$api.personnel.personTrackRecordExport + `&${name}=` + this.departId, { responseType: 'blob' }).then(res => {
|
// this.outLoading = false;
|
// this.$message.success('导出成功');
|
// const blob = new Blob([res], { type: 'application/octet-stream' });
|
// const url = URL.createObjectURL(blob);
|
// const link = document.createElement('a');
|
// link.href = url;
|
// link.download = '培训记录.xlsx';
|
// link.click();
|
// }).catch(err => {
|
// this.outLoading = false;
|
// })
|
// },
|
// 查询
|
refreshTable() {
|
this.getPersonnelTraining(this.departId);
|
},
|
// 培训记录导出
|
openDownloadDia(row) {
|
let date = this.searchForm.trainingDate
|
if (!date) {
|
date = this.$moment().format('YYYY')
|
}
|
console.log('date----', date);
|
exportTrainingRecord({
|
userId: row.userId,
|
trainingDate: date
|
}).then(res => {
|
this.outLoading = false
|
const blob = new Blob([res], { type: 'application/msword' });
|
this.$download.saveAs(blob, '培训记录导出' + '.docx')
|
})
|
},
|
// 获取实验室-培训计划列表信息
|
getPersonnelTraining(departId) {
|
// const name = this.isDepartment ? 'departmentId' : 'userId';
|
trainingSelectTrainingRecord({
|
departmentId: departId,
|
...this.trainingPagination
|
}).then(res => {
|
this.trainingTableData = res.data.records;
|
this.trainingPagination.total = res.data.total;
|
if (this.trainingTableData.length > 0) {
|
this.currentChange(this.trainingTableData[0]);
|
}
|
});
|
},
|
// 获取个人-培训计划列表信息
|
currentChange(row) {
|
this.currentChangeRow = row
|
if (row === null) {
|
row = this.trainingTableData[0]
|
}
|
this.queryPersonnelDetailsPage(row.userId)
|
},
|
queryPersonnelDetailsPage(userId) {
|
if (this.searchForm.trainingDate === null) {
|
this.searchForm.trainingDate = ''
|
}
|
queryPersonnelDetails({
|
userId,
|
...this.trainingPersonPagination
|
}).then(res => {
|
this.trainingPersonTableData = res.data.records;
|
this.trainingPersonPagination.total = res.data.total;
|
});
|
},
|
// 分页
|
trainingPaginationMethod({ page, limit }) {
|
this.trainingPagination.current = page;
|
this.trainingPagination.size = limit;
|
this.getPersonnelTraining(this.departId);
|
},
|
// 分页
|
trainingPersonPaginationMethod({ page, limit }) {
|
this.trainingPersonPagination.current = page;
|
this.trainingPersonPagination.size = limit;
|
this.queryPersonnelDetailsPage(this.currentChangeRow.userId);
|
},
|
},
|
watch: {
|
departId: {
|
handler(newId, oldId) {
|
if (this.isDepartment) {
|
this.getPersonnelTraining(newId);
|
} else {
|
this.queryPersonnelDetailsPage(newId)
|
}
|
}
|
}
|
}
|
};
|
</script>
|
<style scoped>
|
>>>.el-form-item {
|
margin-bottom: 13px;
|
}
|
|
.flex_table {
|
display: flex;
|
flex-direction: row;
|
justify-content: space-between;
|
}
|
|
.pagination {
|
display: flex;
|
justify-content: space-between;
|
margin-top: 10px;
|
}
|
|
.items_center {
|
display: flex;
|
align-items: center;
|
}
|
|
.search {
|
width: 150px;
|
padding: 0 6px;
|
}
|
</style>
|
