<template>
|
<div class="first-result">
|
<el-button style="margin-bottom: 10px;" type="success" plain icon="el-icon-download"
|
@click="handleExport">导出当前数据</el-button>
|
<ul class="type-list">
|
<li class="type-item">
|
<div class="title">奖项</div>
|
<div class="introduction">认定标准</div>
|
<div class="number">名额</div>
|
<div class="tool">操作</div>
|
</li>
|
<li class="type-item" v-for="(item, index) in data" :key="index">
|
<div class="title">{{ item.categoryName || '' }}</div>
|
<el-tooltip effect="dark" placement="top">
|
<template #content>
|
<p style="max-width: 500px;">{{ item.standard || '' }}</p>
|
</template>
|
<div class="introduction">
|
{{ item.standard || '' }}
|
</div>
|
</el-tooltip>
|
|
<div class="number">{{ item.peopleNum || 0 }}人</div>
|
<div class="tool">
|
<el-button type="primary" text icon="el-icon-view" @click="view(item)">查看第一轮候选结果</el-button>
|
</div>
|
</li>
|
</ul>
|
<el-dialog v-model="visible" :title="`第一轮候选结果(${currentCategory.categoryName})`" width="60%" @open="dialogOpen" destroy-on-close>
|
<avue-crud v-model:page="page" :option="option" :table-loading="loading" :data="dialogData"
|
@current-change="currentChange" @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad">
|
<template #menu="{ row }">
|
<referrerPopover :params="{ userId: row.userId, evaluateTaskCategoryId: row.evaluateTaskCategoryId, evaluateTaskId: params.data.id }">
|
<el-button type="success" icon="el-icon-view" text>推荐人预览</el-button>
|
</referrerPopover>
|
</template>
|
</avue-crud>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import referrerPopover from './referrerPopover.vue'
|
import { getEcList, getCandidateResult } from '@/api/evaluate/evaluateTask'
|
import { exportBlob } from "@/api/common";
|
import { downloadXls } from "@/utils/util";
|
import { dateNow } from "@/utils/date";
|
import NProgress from 'nprogress';
|
import 'nprogress/nprogress.css';
|
|
export default {
|
components: {
|
referrerPopover
|
},
|
props: {
|
params: {
|
type: Object,
|
default: () => {
|
return {
|
data: {}
|
}
|
}
|
}
|
},
|
data() {
|
return {
|
loading: true,
|
query: {},
|
page: {
|
pageSize: 10,
|
currentPage: 1,
|
total: 0
|
},
|
option: {
|
height: '400',
|
calcHeight: 30,
|
tip: false,
|
searchShow: true,
|
searchMenuSpan: 6,
|
border: true,
|
index: true,
|
viewBtn: false,
|
addBtn: false,
|
editBtn: false,
|
delBtn: false,
|
viewBtn: false,
|
header: true,
|
menuWidth: 150,
|
// menu: false,
|
dialogClickModal: false,
|
column: [
|
{
|
label: '姓名',
|
prop: 'userName',
|
type: 'input'
|
},
|
{
|
label: '部门',
|
prop: 'deptName',
|
type: 'input'
|
},
|
{
|
label: '职位',
|
prop: 'postName',
|
type: 'input'
|
},
|
{
|
label: '票数',
|
prop: 'voteNum',
|
type: 'input',
|
formatter: (_row, value) => {
|
return value + '票'
|
}
|
},
|
]
|
},
|
data: [],
|
dialogData: [],
|
visible: false,
|
currentCategory: {}
|
}
|
},
|
methods: {
|
handleExport() {
|
const { id } = this.params.data
|
const downloadUrl = `/evaluate/evaluateTaskReferrer/export/${id}`;
|
this.$confirm("是否导出数据?", "提示", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning"
|
}).then(() => {
|
NProgress.start();
|
exportBlob(downloadUrl, {}).then(res => {
|
downloadXls(res.data, `第一轮候选结果(${dateNow()}).xlsx`);
|
NProgress.done();
|
})
|
});
|
},
|
currentChange(currentPage) {
|
this.page.currentPage = currentPage;
|
this.getDialogDetails()
|
},
|
sizeChange(pageSize) {
|
this.page.pageSize = pageSize;
|
this.getDialogDetails()
|
},
|
refreshChange() {
|
this.onLoad(this.page, this.query);
|
},
|
onLoad(page, params = {}) {
|
this.loading = true;
|
|
const { id } = this.params.data
|
|
const {
|
} = this.query;
|
|
let values = {
|
...this.query,
|
...params
|
};
|
getEcList(1, 50, id).then(ecResult => {
|
const { code, data: { records } } = ecResult.data
|
if (code !== 200) return this.$message.error('评优类别加载失败')
|
this.data = records || []
|
this.loading = false;
|
})
|
// getFinallyResult(page.currentPage, page.pageSize, id).then(res => {
|
// const data = res.data.data;
|
// this.data = data || [];
|
// this.loading = false;
|
// });
|
},
|
view(item) {
|
this.currentCategory = item
|
this.visible = true
|
},
|
dialogOpen() {
|
this.page.currentPage = 1
|
this.getDialogDetails()
|
},
|
getDialogDetails() {
|
const { id, evaluateTaskId } = this.currentCategory
|
const { currentPage, pageSize } = this.page
|
getCandidateResult(currentPage, pageSize, evaluateTaskId, id).then(candidateRes => {
|
const res = candidateRes.data
|
if (res.code !== 200) return this.$message.error(res.msg)
|
console.log(res);
|
this.dialogData = res.data.records
|
this.page.total = res.data.total
|
})
|
}
|
},
|
watch: {
|
'params.data': {
|
handler(value) {
|
this.onLoad(this.page)
|
},
|
deep: true
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
$borderColor: var(--el-border-color);
|
|
.type-list {
|
margin: 0;
|
padding: 0;
|
list-style-type: none;
|
width: 100%;
|
border: 1px solid $borderColor;
|
border-radius: var(--el-border-radius-base);
|
box-sizing: border-box;
|
|
.type-item {
|
display: flex;
|
height: 40px;
|
line-height: 40px;
|
text-align: center;
|
|
div {
|
border-bottom: 1px solid $borderColor;
|
flex-shrink: 0;
|
white-space: nowrap;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
}
|
|
.title {
|
flex: 2;
|
}
|
|
.introduction {
|
flex: 5;
|
flex-shrink: 0;
|
|
border: {
|
right: 1px solid $borderColor;
|
left: 1px solid $borderColor;
|
}
|
}
|
|
.number {
|
flex: 1;
|
}
|
|
.tool {
|
flex: 2;
|
border-left: 1px solid $borderColor;
|
}
|
|
&:last-child {
|
div {
|
border-bottom: 0;
|
}
|
}
|
}
|
}
|
</style>
|