<template>
|
<basic-container>
|
<avue-tabs :option="taskTypeList" @change="tabChange"></avue-tabs>
|
<avue-crud :option="option" v-model:search="search" v-model:page="page" v-model="form" :table-loading="loading"
|
:data="data" :permission="permissionList" :before-open="beforeOpen" ref="crud" @row-update="rowUpdate"
|
@row-save="rowSave" @row-del="rowDel" @search-change="searchChange" @search-reset="searchReset"
|
@selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange"
|
@refresh-change="refreshChange" @on-load="onLoad">
|
<template #candidateState="{ row }">
|
<div v-if="row.candidateState !== 1">{{ setStatus(row.candidateState) }}</div>
|
<el-button v-else text type="success" icon="el-icon-edit" @click="updateState(row, 'candidateState')">{{
|
setStatus(row.candidateState) }}</el-button>
|
</template>
|
<template #evaluateState="{ row }">
|
<div v-if="row.evaluateState !== 1">{{ setStatus(row.evaluateState) }}</div>
|
<el-button v-else :disabled="row.evaluateState !== 1" text type="success" icon="el-icon-edit"
|
@click="updateState(row, 'evaluateState')">{{
|
setStatus(row.evaluateState) }}</el-button>
|
</template>
|
<template #candidateCutoffTimeEnd="{ row }">
|
<div class="time-box">
|
{{ row.candidateCutoffTimeStart }}
|
<div>-</div>
|
{{ row.candidateCutoffTimeEnd }}
|
</div>
|
</template>
|
<template #evaluateCutoffTimeEnd="{ row }">
|
<div class="time-box">
|
{{ row.evaluateCutoffTimeStart }}
|
<div>-</div>
|
{{ row.evaluateCutoffTimeEnd }}
|
</div>
|
</template>
|
<template #menu-left>
|
<el-button type="primary" icon="el-icon-plus" @click="handleAdd">新增评优任务</el-button>
|
<el-button type="danger" icon="el-icon-delete" plain v-if="permission.evaluateTask_delete"
|
@click="handleDelete">删除</el-button>
|
<!-- <el-button type="warning" plain icon="el-icon-download" @click="handleExport">导出</el-button> -->
|
</template>
|
<template #menu="{ size, row, index }">
|
<el-button type="primary" text plain icon="el-icon-view" @click="viewHandlerClick(row)">结果详情</el-button>
|
<el-button type="primary" text plain icon="el-icon-view"
|
@click="viewVotingDetailsHandlerClick(row)">投票详情</el-button>
|
<el-button type="primary" text plain icon="el-icon-position"
|
v-if="!row.type && row.candidateState === 2 && !row.evaluateState" @click="taskPublicDialog(row)">发布</el-button>
|
<el-button type="success" v-if="(row.candidateState === 0 && !row.type) || (row.evaluateState === 0 && row.type)"
|
text plain icon="el-icon-edit" @click="editTaskDialog(row)">编辑</el-button>
|
<el-button type="danger" text plain icon="el-icon-delete" @click="rowDel(row)">删除</el-button>
|
</template>
|
</avue-crud>
|
<!-- 新增个人评优任务弹窗 -->
|
<addIndividualTask :params="addIndividualParams" @refreshTable="this.onLoad" />
|
<addSectionTask :params="addSectionParams" @refreshTable="this.onLoad" />
|
<!-- 编辑任务 -->
|
<editIndividualTask :params="editIndividualTaskParams" @refreshTable="this.onLoad" />
|
<editSectionTask :params="editSectionTaskParams" @refreshTable="this.onLoad" />
|
<!-- 发布 -->
|
<individualTaskPublic :params="taskPublicParams" @refreshTable="this.onLoad" />
|
<!-- 预览 -->
|
<viewEvaluate :params="viewEvaluateParams" />
|
<!-- 投票详情 -->
|
<votingDetails :params="votingParams" />
|
</basic-container>
|
</template>
|
|
<script>
|
import { getList, getDetail, add, update, remove } from '@/api/evaluate/evaluateTask';
|
import { option, sectionOption } from '@/option/evaluate/evaluateTask';
|
import { mapGetters } from 'vuex';
|
import { exportBlob } from '@/api/common';
|
import { getToken } from '@/utils/auth';
|
import { downloadXls } from '@/utils/util';
|
import { dateNow } from '@/utils/date';
|
import NProgress from 'nprogress';
|
import 'nprogress/nprogress.css';
|
import addIndividualTask from './components/addIndividualTask.vue';
|
import addSectionTask from './components/addSectionTask.vue';
|
import viewEvaluate from './components/viewEvaluateDetail.vue';
|
import individualTaskPublic from './components/IndividualTaskPublic.vue';
|
import votingDetails from './components/votingDetails.vue';
|
import editIndividualTask from './components/editIndividualTask.vue'
|
import editSectionTask from './components/editSectionTask.vue'
|
|
export default {
|
components: {
|
addIndividualTask,
|
addSectionTask,
|
individualTaskPublic,
|
viewEvaluate,
|
votingDetails,
|
editIndividualTask,
|
editSectionTask
|
},
|
data() {
|
return {
|
rowData: {},
|
form: {},
|
query: {},
|
search: {},
|
loading: true,
|
page: {
|
pageSize: 10,
|
currentPage: 1,
|
total: 0,
|
},
|
selectionList: [],
|
option: option,
|
data: [],
|
addIndividualParams: {},
|
addSectionParams: {},
|
viewParams: {},
|
// 考核结果参数
|
defaultTaskType: 0,
|
taskTypeList: {
|
column: [
|
{
|
label: '个人评优',
|
prop: 0,
|
},
|
{
|
label: '部门评优',
|
prop: 1,
|
},
|
],
|
},
|
// 信息预览弹窗
|
viewEvaluateParams: {},
|
taskPublicParams: {},
|
votingParams: {},
|
// 编辑
|
editIndividualTaskParams: {},
|
editSectionTaskParams: {},
|
};
|
},
|
watch: {
|
defaultTaskType: {
|
handler(n) {
|
this.query = {};
|
this.query['type'] = n;
|
let params = {
|
type: n,
|
};
|
// 更改option
|
!n ? (this.option = option) : (this.option = sectionOption)
|
this.page.currentPage = 1;
|
this.onLoad(this.page, params);
|
},
|
immediate: true,
|
},
|
},
|
computed: {
|
...mapGetters(['permission']),
|
permissionList() {
|
return {
|
addBtn: this.validData(this.permission.evaluateTask_add, false),
|
viewBtn: this.validData(this.permission.evaluateTask_view, false),
|
delBtn: this.validData(this.permission.evaluateTask_delete, false),
|
editBtn: this.validData(this.permission.evaluateTask_edit, false),
|
};
|
},
|
ids() {
|
let ids = [];
|
this.selectionList.forEach(ele => {
|
ids.push(ele.id);
|
});
|
return ids.join(',');
|
},
|
},
|
methods: {
|
handleAdd() {
|
if (!this.defaultTaskType) {
|
this.addIndividualParams = {
|
visible: true,
|
title: '添加个人评优任务'
|
}
|
return
|
}
|
this.addSectionParams = {
|
visible: true,
|
title: '添加部门评优任务'
|
}
|
},
|
rowSave(row, done, loading) {
|
add(row).then(
|
() => {
|
this.onLoad(this.page);
|
this.$message({
|
type: 'success',
|
message: '操作成功!',
|
});
|
done();
|
},
|
error => {
|
loading();
|
window.console.log(error);
|
}
|
);
|
},
|
viewHandlerClick(row) {
|
this.viewEvaluateParams = {
|
visible: true,
|
data: row
|
}
|
},
|
viewVotingDetailsHandlerClick(row) {
|
this.votingParams = {
|
visible: true,
|
data: row
|
}
|
},
|
editTaskDialog(row) {
|
if (!this.defaultTaskType) {
|
this.editIndividualTaskParams = {
|
visible: true,
|
data: row
|
}
|
} else {
|
this.editSectionTaskParams = {
|
visible: true,
|
data: row
|
}
|
}
|
|
},
|
taskPublicDialog(row) {
|
this.taskPublicParams = {
|
visible: true,
|
data: row
|
}
|
},
|
rowUpdate(row, index, done, loading) {
|
update(row).then(
|
() => {
|
this.onLoad(this.page);
|
this.$message({
|
type: 'success',
|
message: '操作成功!',
|
});
|
done();
|
},
|
error => {
|
loading();
|
console.log(error);
|
}
|
);
|
},
|
rowDel(row) {
|
this.$confirm('确定将选择数据删除?', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
})
|
.then(() => {
|
return remove(row.id);
|
})
|
.then(() => {
|
this.onLoad(this.page);
|
this.$message({
|
type: 'success',
|
message: '操作成功!',
|
});
|
});
|
},
|
handleDelete() {
|
if (this.selectionList.length === 0) {
|
this.$message.warning('请选择至少一条数据');
|
return;
|
}
|
this.$confirm('确定将选择数据删除?', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
})
|
.then(() => {
|
return remove(this.ids);
|
})
|
.then(() => {
|
this.onLoad(this.page);
|
this.$message({
|
type: 'success',
|
message: '操作成功!',
|
});
|
this.$refs.crud.toggleSelection();
|
});
|
},
|
handleExport() {
|
let downloadUrl = `/evaluateTask/evaluateTask/export-evaluateTask?${this.website.tokenHeader
|
}=${getToken()}`;
|
const { taskName } = this.query;
|
let values = {
|
taskName_like: taskName,
|
};
|
this.$confirm('是否导出数据?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
}).then(() => {
|
NProgress.start();
|
exportBlob(downloadUrl, values).then(res => {
|
downloadXls(res.data, `评优任务表${dateNow()}.xlsx`);
|
NProgress.done();
|
});
|
});
|
},
|
beforeOpen(done, type) {
|
if (['edit', 'view'].includes(type)) {
|
getDetail(this.form.id).then(res => {
|
if (type === 'view') {
|
const candidates = [];
|
res.data.data.candidateNum.forEach(item => {
|
const users = []
|
item.users.forEach(item => users.push(item.name))
|
candidates.push(`${item.deptName}(${item.val || 0}人): ${users.join('、')}`);
|
})
|
this.form.candidateNum = candidates.join('\n');
|
}
|
this.form = res.data.data;
|
});
|
}
|
done();
|
},
|
searchReset() {
|
this.query = {};
|
this.onLoad(this.page, { type: this.defaultTaskType });
|
},
|
searchChange(params, done) {
|
this.query = {
|
...params,
|
type: this.defaultTaskType,
|
};
|
this.page.currentPage = 1;
|
this.onLoad(this.page, params);
|
done();
|
},
|
selectionChange(list) {
|
this.selectionList = list;
|
},
|
selectionClear() {
|
this.selectionList = [];
|
this.$refs.crud.toggleSelection();
|
},
|
currentChange(currentPage) {
|
this.page.currentPage = currentPage;
|
},
|
sizeChange(pageSize) {
|
this.page.pageSize = pageSize;
|
},
|
refreshChange() {
|
this.onLoad(this.page, this.query);
|
},
|
onLoad(page, params = {}) {
|
this.loading = true;
|
|
const { taskName } = this.query;
|
|
let values = {
|
...this.query,
|
...params
|
};
|
getList(page.currentPage, page.pageSize, values).then(res => {
|
const data = res.data.data;
|
this.page.total = data.total;
|
this.data = data.records;
|
this.loading = false;
|
this.selectionClear();
|
});
|
},
|
tabChange(value) {
|
this.defaultTaskType = value.prop;
|
},
|
setStatus(value) {
|
const status = {
|
0: '未开始',
|
1: '进行中',
|
2: '已完成'
|
}
|
return status[value]
|
},
|
updateState(row, name) {
|
const text = (name === 'candidateState' ? '是否提前结束第一轮评优?' : '是否提前结束评优任务?')
|
this.$confirm(text, {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
}).then(res => {
|
const { id } = row
|
let params = {
|
id
|
}
|
name === 'candidateState' ? Object.assign(params, { candidateState: 2 }) : Object.assign(params, { evaluateState: 2 })
|
update(params).then(res => {
|
if (res.data.code !== 200) return this.$message.error(res.data.msg)
|
this.$message({
|
type: 'success',
|
message: '操作成功!',
|
});
|
this.onLoad(this.page);
|
})
|
})
|
}
|
},
|
provide() {
|
return {
|
type: () => this.defaultTaskType
|
}
|
}
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.time-box {
|
display: inline-block;
|
text-align: center;
|
}
|
</style>
|