<template>
|
<div class="container">
|
<el-alert type="warning" show-icon style="margin-bottom: 20px;" v-if="params.data.evaluateState === 2">
|
<template #title>
|
如对当前任务有相同票数候选人，可点击右侧重新下发任务进行投票
|
<span class="right-arrow">→</span>
|
<el-button text type="success" icon="el-icon-position" @click="reissueTask">下发任务</el-button>
|
</template>
|
</el-alert>
|
<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 categoryEntities" :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 }}</div>
|
<div class="tool">
|
<el-button type="primary" icon="el-icon-view" text
|
@click="viewEcCandidateHandler(item)">查看类别候选人</el-button>
|
</div>
|
</li>
|
</ul>
|
<typeDetails :params="typeDetailsParams" />
|
<reissueSecondRound :params="reissueTaskParams" @initAsideData="initAsideData" />
|
</div>
|
</template>
|
|
<script>
|
import { getEcList } from '@/api/evaluate/evaluateTask'
|
import typeDetails from './typeDetails.vue'
|
import reissueSecondRound from './reissueSecondRound.vue'
|
|
export default {
|
components: {
|
typeDetails,
|
reissueSecondRound
|
},
|
props: {
|
params: {
|
type: Object,
|
default: () => {
|
return {
|
data: {}
|
}
|
}
|
}
|
},
|
data() {
|
return {
|
categoryEntities: [],
|
pageParams: {
|
current: 1,
|
size: 10,
|
total: 0
|
},
|
typeDetailsParams: {},
|
reissueTaskParams: {}
|
}
|
},
|
watch: {
|
'params.data': {
|
handler(value) {
|
this.pageParams.current = 1
|
this.initEccList()
|
},
|
deep: true
|
}
|
},
|
methods: {
|
initEccList() {
|
const { id } = this.params.data
|
const { current, size } = this.pageParams
|
getEcList(current, size, id).then(ecResult => {
|
const { code, data: { records } } = ecResult.data
|
if (code !== 200) return this.$message.error('评优类别加载失败')
|
this.categoryEntities = records
|
})
|
},
|
viewEcCandidateHandler(row) {
|
const evaluateTaskId = this.params.data.id
|
const evaluateTaskCategoryId = row.id
|
this.typeDetailsParams = {
|
visible: true,
|
data: {
|
evaluateTaskId,
|
evaluateTaskCategoryId
|
}
|
}
|
},
|
reissueTask() {
|
this.$confirm('是否发下任务?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
}).then(res => {
|
this.reissueTaskParams = {
|
visible: true,
|
data: this.params.data
|
}
|
})
|
|
},
|
initAsideData() {
|
this.$emit('initAsideData')
|
}
|
},
|
mounted() {
|
this.initEccList()
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
$borderColor: var(--el-border-color);
|
|
.right-arrow {
|
display: inline-block;
|
padding: 0 7px;
|
font-weight: bolder;
|
animation: moveAnimation 1s ease-in-out infinite;
|
}
|
|
@keyframes moveAnimation {
|
from {
|
transform: translateX(7px);
|
}
|
|
50% {
|
transform: translateX(-7px);
|
}
|
|
to {
|
transform: translateX(7px);
|
}
|
}
|
|
.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>
|
