<!--监督员考核-->
<template>
<app-container>
<search-area :need-search-more="false" type="default" size="small" @search="search" @clear="clearInput">
<search-item >
<el-date-picker
v-model="timeRange"
:picker-options="pickerOptions"
type="daterange"
size="small"
range-separator="至"
value-format="yyyy-MM-dd"
start-placeholder="开始日期"
end-placeholder="结束日期"/>
</search-item>
</search-area>
<normal-table :data="list" :query="listQuery" :total="total" :columns="columns" :list-loading="listLoading" @change="changePage">
<template slot="btns">
<el-button size="small" class="edit_btn" @click="setRule">考核规则</el-button>
<el-button size="small" class="edit_btn" @click="exportTable">导出报表</el-button>
</template>
</normal-table>
<el-dialog
:visible.sync="dialogVisible"
:append-to-body="true"
:close-on-click-modal="false"
title="考核规则"
width="70%"
>
<assess-rule-dispatcher ref="assessRule"/>
</el-dialog>
</app-container>
<!--<div class="app-container">-->
<!--<!–筛选条件–>-->
<!--<div class="search-div">-->
<!--<el-form ref="selectForm" :inline="true" :model="listQuery" class="form-container">-->
<!--<el-row>-->
<!--<el-form-item class="selectForm-container-item" prop="beginDate">-->
<!--<el-date-picker-->
<!--v-model="timeRange"-->
<!--:picker-options="pickerOptions"-->
<!--type="daterange"-->
<!--range-separator="至"-->
<!--value-format="yyyy-MM-dd"-->
<!--start-placeholder="开始日期"-->
<!--end-placeholder="结束日期"/>-->
<!--</el-form-item>-->
<!--<el-button class="filter-item" type="primary" icon="el-icon-data-analysis" @click="search">统计</el-button>-->
<!--<el-button class="filter-item" icon="el-icon-document" @click="exportTable">报表</el-button>-->
<!--</el-row>-->
<!--</el-form>-->
<!--</div>-->
<!--<!–查询结果Table显示–>-->
<!--<div class="table-container">-->
<!--<el-row class="table-title">-->
<!--<el-col :span="6"><div class="title-header"><i class="el-icon-menu"/>数据列表</div></el-col>-->
<!--<el-col :span="12" :offset="6" class="edit_btns">-->
<!--<el-button class="edit_btn" size="small" @click="setRule">考核规则</el-button>-->
<!--</el-col>-->
<!--</el-row>-->
<!--<el-table v-loading="listLoading" :data="list" class="table" border @selection-change="handleSelectionChange">-->
<!--<!–<el-table-column :index="indexMethod" align="center" type="index"/>–>-->
<!--<el-table-column v-for="column in columns" :key="column.name" :label="column.text" :width="column.width" align="center" show-overflow-tooltip>-->
<!--<template slot-scope="scope">-->
<!--<el-button v-if="column.type=='Button'&&scope.row[column.value]!=0" type="text" @click="showCaseList(scope.row,column.value)">{{ scope.row[column.value] }}</el-button>-->
<!--<span v-else :class="column.class">{{ scope.row[column.value] }}</span>-->
<!--</template>-->
<!--</el-table-column>-->
<!--</el-table>-->
<!--</div>-->
<!--<!–分页–>-->
<!--<div class="pagination-container">-->
<!--<el-pagination-->
<!--v-show="total>listQuery.limit"-->
<!--:current-page="listQuery.offset"-->
<!--:page-sizes="[20,30,50]"-->
<!--:page-size="listQuery.limit"-->
<!--:total="total"-->
<!--align="center"-->
<!--layout="total, sizes, prev, pager, next"-->
<!--@size-change="handleSizeChange"-->
<!--@current-change="handleCurrentChange"/>-->
<!--</div>-->
<!--<el-dialog-->
<!--:visible.sync="dialogVisible"-->
<!--:append-to-body="true"-->
<!--:close-on-click-modal="false"-->
<!--title="考核规则"-->
<!--width="70%"-->
<!-->-->
<!--<assess-rule-dispatcher ref="assessRule"/>-->
<!--</el-dialog>-->
<!--</div>-->
</template>
<script>
import AssessRuleDispatcher from './components/assessRuleDispatcher'
import { getDayTime } from '@/utils/dateutils'
import { assessDispatcher, exportAssessDispatcher } from '@/api/assess/assessPost'
export default {
name: 'DispatcherAssess',
components: { AssessRuleDispatcher },
data() {
return {
props: [], // 存储列表页传递的row
list: [], // 数据列表
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])
}
}]
},
columns: [
{
text: '姓名',
value: 'name'
},
{
text: '派遣数',
value: 'distribute',
width: 60,
type: 'Button'
},
{
text: '按时派遣数',
value: 'disOntime',
width: 65,
type: 'Button'
},
{
text: '超时派遣数',
value: 'disOvertime',
width: 65,
type: 'Button'
},
{
text: '按时派遣率',
value: 'disOntimeRate',
width: 70
},
{
text: '准确派遣数',
value: 'disExact',
width: 70,
type: 'Button'
},
{
text: '错误派遣数',
value: 'disWrong',
width: 70,
type: 'Button'
},
{
text: '派遣准确率',
value: 'disExactRate',
width: 70
},
{
text: '处理审核数',
value: 'proAudit',
width: 70,
type: 'Button'
},
{
text: '按时处理审核数',
value: 'proAuditOntime',
width: 80,
type: 'Button'
},
{
text: '超时处理审核数',
value: 'proAuditOvertime',
width: 80,
type: 'Button'
},
{
text: '按时处理审核率',
value: 'proAuditOntimeRate',
width: 80
},
{
text: '待调整数',
value: 'adjust',
width: 60,
type: 'Button'
},
{
text: '按时待调整数',
value: 'adjustOntime',
width: 70,
type: 'Button'
},
{
text: '超时待调整数',
value: 'adjustOvertime',
width: 70,
type: 'Button'
},
{
text: '按时待调整率',
value: 'adjustOntimeRate',
width: 70
},
{
text: '综合指标',
value: 'score',
width: 60
},
{
text: '等级',
value: 'grade',
width: 60
}
],
listQuery: {
beginDate: '',
endDate: '',
offset: 1,
limit: 20,
sort: '',
order: ''
}, // 筛选条件
timeRange: [],
total: 0,
dialogVisible: false, // 考核规则的显示
listLoading: true // 加载动画
}
},
watch: {
timeRange(val) {
if (val && val.length > 0) {
this.listQuery.beginDate = val[0]
this.listQuery.endDate = val[1]
} else {
this.listQuery.beginDate = ''
this.listQuery.endDate = ''
}
}
},
mounted() {
this.fetchData()
},
methods: {
fetchData(isNowPage = true) {
this.listLoading = true
if (!isNowPage) { // 是否显示当前页，否则跳转第一页
this.listQuery.offset = 1
}
if (this.listQuery.beginDate === '') {
const defaultBeginTime = getDayTime(new Date().getTime() - 24 * 7 * 60 * 60 * 1000).Format('yyyy-MM-dd')
const defaultEndTime = new Date().Format('yyyy-MM-dd')
if (this.timeRange.length === 0) {
this.timeRange = [defaultBeginTime, defaultEndTime]
}
this.listQuery.beginDate = this.timeRange[0]
this.listQuery.endDate = this.timeRange[1]
}
assessDispatcher(this.listQuery).then(res => {
this.list = res.data
this.limit = res.data.length
this.total = res.data.length
this.listLoading = false
})
},
showCaseList(row, value) {
const query = {
personId: row.personId,
beginDate: this.listQuery.beginDate,
endDate: this.listQuery.endDate,
type: 'dispatcher/' + value
}
this.$router.push({ path: '/assessCaseList', query: query })
},
// 生成报表
exportTable() {
// 全屏加载动画
const loading = this.$loading({
lock: true,
text: '数据处理中,请稍后...',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
})
exportAssessDispatcher(this.listQuery).then(res => {
loading.close() // 关闭加载动画
console.log('download===', res)
const blob = new Blob([res.data])
const downloadElement = document.createElement('a')
const href = window.URL.createObjectURL(blob) // 创建下载的链接
downloadElement.href = href
downloadElement.download = `派遣员评价列表.xlsx` // 下载后文件名
document.body.appendChild(downloadElement)
downloadElement.click() // 点击下载
document.body.removeChild(downloadElement) // 下载完成移除元素
window.URL.revokeObjectURL(href) // 释放blob对象
}).catch((res) => {
loading.close()
this.$message.error(res.message)
})
},
// 来自业务查询条件更改后的查询
search() {
this.fetchData(false)
},
// 点击告警规则
setRule() {
this.dialogVisible = true
this.$refs.assessRule.fetchData()
},
// 计算行号
indexMethod(index) {
return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
},
// 改变页容量
handleSizeChange(val) {
this.listQuery.limit = val
this.fetchData()
},
// 改变当前页
handleCurrentChange(val) {
this.listQuery.offset = val
this.fetchData()
},
// 多选触发方法
handleSelectionChange(val) {
this.multipleSelection = val
},
// 页数发生变化后的操作，可能是页码变化，可能是每页容量变化，此函数必写
changePage(val) {
if (val && val.size) {
this.listQuery.limit = val.size
}
if (val && val.page) {
this.listQuery.offset = val.page
}
this.fetchData()
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
</style>
