班级评比-汇总评价

init
gongdi 4 years ago
parent e4e99fc2a5
commit 6bf2dacee9

@ -2,48 +2,92 @@
<div class="summary-evaluation-div"> <div class="summary-evaluation-div">
<div class="search-div"> <div class="search-div">
<div class="title-item"> <div class="title-item">
<div class="title-text"><span>汇总查看</span></div> <div class="title-text"><span>学部</span></div>
</div> </div>
<div class="title-dom"> <div class="title-dom">
<a-select :value="gatherName" @change="taskChange"> <a-select :value="stageId" @change="stageChange">
<a-icon class="drop-down-icon" slot="suffixIcon" type="caret-down" <a-icon class="drop-down-icon" slot="suffixIcon" type="caret-down"
:style="{fontSize:'16px',color:'#c280ff'}"/> :style="{fontSize:'16px',color:'#c280ff'}"/>
<a-select-option v-for="item in gatherTaskList" :key="item.id + '-' + item.gather_name"> <a-select-option v-for="item in stageList" :key="item.stage_id">
{{ item.gather_name }} {{ item.stage_name }}
</a-select-option> </a-select-option>
</a-select> </a-select>
</div> </div>
<div class="title-item"> <div class="title-item">
<div class="title-text"><span>参数设置</span></div> <div class="title-text"><span>入学年份</span></div>
</div> </div>
<div class="title-dom"> <div class="title-dom">
<div class="gather-info-div"> <a-select :value="yearId" @change="yearChange">
<div> <a-icon class="drop-down-icon" slot="suffixIcon" type="caret-down"
汇总周期{{gatherDate}} :style="{fontSize:'16px',color:'#c280ff'}"/>
计算规则{{calcMethods}} <a-select-option v-for="item in yearList" :key="item.create_year">
评定班额数{{classNum}} {{ item.create_year_name }}
</div> </a-select-option>
</div> </a-select>
<!--<div class="gather-info-div">-->
<!--<div>-->
<!--&lt;!&ndash;汇总周期{{gatherDate}}&ndash;&gt;-->
<!--&lt;!&ndash;计算规则{{calcMethods}}&ndash;&gt;-->
<!--&lt;!&ndash;评定班额数{{classNum}}&ndash;&gt;-->
<!--</div>-->
<!--</div>-->
</div> </div>
<div class="title-item">
<div class="title-text"><span>汇总查看</span></div>
</div>
<div class="title-dom">
<a-select :value="gatherId" @change="taskChange">
<a-icon class="drop-down-icon" slot="suffixIcon" type="caret-down"
:style="{fontSize:'16px',color:'#c280ff'}"/>
<a-select-option v-for="item in gatherTaskList" :key="item.id">
{{ item.gather_name }}
</a-select-option>
</a-select>
</div>
<a-tooltip class="taskInfoIcon" placement="bottomRight">
<template slot="title">
汇总周期{{gatherDate}}
计算规则{{calcMethods}}
评定班额数{{classNum}}
</template>
<a-icon class="taskInfoIcon" type="question-circle" title="参数设置" @mouseenter="showTaksInfoFun"
@mouseleave="hideTaksInfoFun"/>
</a-tooltip>
</div> </div>
<div class="table-list-div"> <div class="table-list-div">
<a-table :columns="columns" :data-source="tableData" bordered tableLayout="fixed" <a-table :columns="columns" :data-source="tableData" bordered tableLayout="fixed"
:loading="showLoading" :loading="showLoading"
:scroll="{ x: '100%' }" :pagination="false"
/> :scroll="{ x: '100%'}"
size="middle"
>
<span slot="scoreSlot" slot-scope="record">
{{record.score}}
<a-icon type="flag" v-if="record.isFlag" :style="{color: 'red' }"></a-icon>
</span>
</a-table>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import interConfig from './interConfig'; import interConfig from './interConfig';
import {Select, Icon, Table} from 'ant-design-vue'; import {Select, Icon, Table, Tooltip} from 'ant-design-vue';
export default{ export default{
data(){ data(){
return { return {
showLoading: true, showLoading: true,
showTaksInfo: false,
columns: [], columns: [],
tableData: [], tableData: [],
gatherTaskList: [], stageList: [],//
stageId: "",
stageName: "",
yearList: [],//
yearId: "",
yearName: "",
gatherTaskList: [],//
gatherId: "", gatherId: "",
gatherName: "", gatherName: "",
gatherDate: "",// gatherDate: "",//
@ -56,10 +100,35 @@
mounted(){ mounted(){
this.getGatherTaskList(); this.getGatherTaskList();
}, },
watch: {
yearId: function (newVal) {
for (let i = 0, len = this.yearList.length; i < len; i++) {
if (this.yearList[i].create_year == newVal) {
this.yearName = this.yearList[i].create_year_name;
break;
}
}
},
stageId: function (newVal) {
for (let i = 0, len = this.stageList.length; i < len; i++) {
if (this.stageList[i].stage_id == newVal) {
this.stageName = this.stageList[i].stage_name;
this.yearList = this.stageList[i].create_year_list;
if (this.yearId == "" && this.yearList && this.yearList.length > 0) {
this.yearId = this.yearList[0].create_year;
}
break;
}
}
}
},
methods: { methods: {
getGatherTaskList: function () { getGatherTaskList: function () {
this.showLoading = true;
let param = { let param = {
org_id: this.BaseConfig.person_info_my.bureau_id, org_id: this.BaseConfig.person_info_my.bureau_id,
stage_id: this.stageId,
create_year: this.yearId,
}; };
this.InterfaceConfig.callInterface([{ this.InterfaceConfig.callInterface([{
url: interConfig.getGatherTaskList.url, url: interConfig.getGatherTaskList.url,
@ -68,28 +137,68 @@
isTestLogin: interConfig.getGatherTaskList.isTestLogin, isTestLogin: interConfig.getGatherTaskList.isTestLogin,
}], (result) => { }], (result) => {
let resData = result[0].data; let resData = result[0].data;
this.showLoading = false;
if (result[0].status === 200) { if (result[0].status === 200) {
if (resData.code === 2000) { if (resData.code === 2000) {
this.gatherTaskList = resData.data.gather_task_list; this.gatherTaskList = resData.data.gather_task_list;
this.stageId = resData.data.stage_id;
this.yearId = resData.data.create_year;
this.gatherId = resData.data.gather_id;
this.stageList = resData.data.stage_list;
//
if (this.gatherTaskList && this.gatherTaskList.length > 0) { if (this.gatherTaskList && this.gatherTaskList.length > 0) {
this.gatherId = this.gatherTaskList[0].id; for (let i = 0, len = this.gatherTaskList.length; i < len; i++) {
this.gatherName = this.gatherTaskList[0].gather_name; if (this.gatherTaskList[i].id == this.gatherId) {
let calc_method = this.gatherTaskList[0].calc_method; this.gatherName = this.gatherTaskList[i].gather_name;
this.gatherDate = this.gatherTaskList[0].begin_time + "-" + this.gatherTaskList[0].end_time; let calc_method = this.gatherTaskList[i].calc_method;
this.calcMethods = calc_method == 1 ? '求和' : (calc_method == 2 ? '平均' : (calc_method == 3 ? '权重求和' : ''));// 123 this.gatherDate = this.gatherTaskList[i].begin_time + "-" + this.gatherTaskList[i].end_time;
this.classNum = this.gatherTaskList[0].class_num; this.calcMethods = calc_method == 1 ? '求和' : (calc_method == 2 ? '平均' : (calc_method == 3 ? '权重求和' : ''));// 123
this.redFlagGather(); this.classNum = this.gatherTaskList[i].class_num;
this.redFlagGather();
break;
}
}
} else {
this.columns = [];
this.tableData = [];
this.gatherTaskList = [];
this.gatherId = "";
this.gatherName = "";
this.gatherDate = "";
this.calcMethods = "";
this.classNum = "";
}
//
if (this.stageList && this.stageList.length > 0) {
for (let i = 0, len = this.stageList.length; i < len; i++) {
if (this.stageList[i].stage_id == this.stageId) {
this.stageName = this.stageList[i].stage_name;
this.yearList = this.stageList[i].create_year_list;
//
if (this.yearList && this.yearList.length > 0) {
for (let y = 0, ylen = this.yearList.length; y < ylen; y++) {
if (this.yearList[y].create_year == this.yearId) {
this.yearName = this.yearList[y].create_year_name;
break;
}
}
}
break;
}
}
} }
} }
} }
}) })
}, },
redFlagGather: function () { redFlagGather: function () {
this.showLoading = true;
let param = { let param = {
org_id: this.BaseConfig.person_info_my.bureau_id, org_id: this.BaseConfig.person_info_my.bureau_id,
gather_id: this.gatherId, gather_id: this.gatherId,
page_number: this.pageNumber, page_number: this.pageNumber,
page_size: this.pageSize page_size: 1000000000
}; };
this.InterfaceConfig.callInterface([{ this.InterfaceConfig.callInterface([{
url: interConfig.redFlagGather.url, url: interConfig.redFlagGather.url,
@ -107,7 +216,6 @@
}) })
}, },
buildTableData: function (data) { buildTableData: function (data) {
console.log(data)
//tableData //tableData
let list = data.list; let list = data.list;
let tableData = []; let tableData = [];
@ -127,30 +235,38 @@
if (scoreMapKeys[k] == dataKeys[i]) { if (scoreMapKeys[k] == dataKeys[i]) {
//key key //key key
let score = scoreMap[scoreMapKeys[k]]; let score = scoreMap[scoreMapKeys[k]];
dataJson[classId] = score; dataJson[classId] = {
score: score
};
break; break;
} }
} }
}) })
tableData.push(dataJson); tableData.push(dataJson);
} }
//columns //columns
let columns = [ let columns = [
{ {
title: '评价任务', title: '评价任务',
dataIndex: "taskId", dataIndex: "taskId",
key: 1, key: 1,
align:"center", align: "center",
ellipsis:true,// ellipsis: true,//
width:150, width: 150,
fixed: 'left' fixed: 'left',
// customRender:function (text,record,index) {
// console.log(text,record,index)
// if(record.taskId == ''){
// //return "<a-icon type='flag' />";
// return '<h1></h1>';
// }
// }
}, },
]; ];
//JSON //JSON
let totalJson = { let totalJson = {
key: dataKeys.length + 1, key: dataKeys.length + 1,
taskId: '合计', taskId: '总分',
};//key classId, score: totalScore };//key classId, score: totalScore
for (let i = 0, len = list.length; i < len; i++) { for (let i = 0, len = list.length; i < len; i++) {
let classItem = list[i]; let classItem = list[i];
@ -158,38 +274,73 @@
title: classItem.class_name, title: classItem.class_name,
dataIndex: classItem.class_id, dataIndex: classItem.class_id,
key: i + 2, key: i + 2,
align:"center", align: "center",
ellipsis:true,// ellipsis: true,//
width:120 width: 120,
scopedSlots: {customRender: 'scoreSlot'},
} }
columns.push(column); columns.push(column);
// //
let task_score_map = classItem.task_score_map; let task_score_map = classItem.task_score_map;
let scoreKeys = Object.keys(task_score_map); let scoreKeys = Object.keys(task_score_map);
let totalScore = 0; let totalScore = 0;
scoreKeys.forEach(key=>{ scoreKeys.forEach(key => {
let score = task_score_map[key]; let score = task_score_map[key];
totalScore += parseFloat(score); totalScore += parseFloat(score);
}) })
totalJson[classItem.class_id] = totalScore; totalJson[classItem.class_id] = {
score: totalScore,
isFlag: classItem.is_redFlag
};
} }
this.columns = columns; this.columns = columns;
tableData.push(totalJson); tableData.push(totalJson);
this.tableData = tableData; this.tableData = tableData;
}, },
stageChange: function (value) {
if (parseInt(this.stageId) != parseInt(value)) {
this.stageId = value;
this.yearId = "";
this.$nextTick(function () {
this.getGatherTaskList();
})
//this.redFlagGather();
}
},
yearChange: function (value) {
if (parseInt(this.yearId) != parseInt(value)) {
this.yearId = value;
this.getGatherTaskList();
}
},
taskChange: function (value) { taskChange: function (value) {
let taskId = value.substring(0, value.indexOf('-')); if (parseInt(this.gatherId) != parseInt(value)) {
if (parseInt(this.gatherId) != parseInt(taskId)) { this.gatherId = value;
this.gatherId = taskId; for(let i = 0,len = this.gatherTaskList.length;i < len;i ++){
this.gatherName = value.substring(value.indexOf('-') + 1); if(this.gatherId == this.gatherTaskList[i].id){
let calc_method = this.gatherTaskList[i].calc_method;
this.gatherDate = this.gatherTaskList[i].begin_time + "-" + this.gatherTaskList[i].end_time;
this.calcMethods = calc_method == 1 ? '求和' : (calc_method == 2 ? '平均' : (calc_method == 3 ? '权重求和' : ''));// 123
this.classNum = this.gatherTaskList[i].class_num;
}
}
this.redFlagGather();
} }
}, },
showTaksInfoFun: function () {
this.showTaksInfo = true;
},
hideTaksInfoFun: function () {
//this.showTaksInfo = false;
}
}, },
components: { components: {
ASelect: Select, ASelect: Select,
ASelectOption: Select.Option, ASelectOption: Select.Option,
AIcon: Icon, AIcon: Icon,
ATable: Table ATable: Table,
ATooltip: Tooltip
} }
} }
</script> </script>
@ -212,6 +363,7 @@
border: 1px solid #c280ff; border: 1px solid #c280ff;
margin: auto; margin: auto;
display: flex; display: flex;
position: relative;
.title-item { .title-item {
width: 5rem; width: 5rem;
height: auto; height: auto;
@ -229,13 +381,13 @@
} }
} }
.title-dom { .title-dom {
width: calc(50% - 5rem); width: calc(33% - 5rem);
height: auto; height: auto;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
.ant-select { .ant-select {
width: calc(100% - 5rem); width: calc(100% - 2rem);
margin: auto; margin: auto;
transform: skew(30deg); transform: skew(30deg);
-webkit-transform: skew(30deg); -webkit-transform: skew(30deg);
@ -247,29 +399,51 @@
box-shadow: none !important; box-shadow: none !important;
} }
} }
.gather-info-div {
width: calc(100% - 2rem); }
height: auto; .gather-info-div {
transform: skew(30deg) translateZ(0); /*设置倾斜度为-30 防止点击抖动*/ position: absolute;
-webkit-transform: skew(30deg) translateZ(0); /*设置倾斜度为-30 防止点击抖动*/ width: 10rem;
-moz-transform: skew(30deg) translateZ(0); /*设置倾斜度为-30 防止点击抖动*/ padding: 0 0.5rem;
-o-transform: skew(30deg) translateZ(0); /*设置倾斜度为-30 防止点击抖动*/ height: 2rem;
-ms-transform: skew(30deg) translateZ(0); /*设置倾斜度为-30 防止点击抖动*/ right: 0;
display: flex; top: 3rem;
flex-wrap: wrap; background-color: white;
align-items: center; transform: skew(30deg) translateZ(0); /*设置倾斜度为-30 防止点击抖动*/
font-size: 12px; -webkit-transform: skew(30deg) translateZ(0); /*设置倾斜度为-30 防止点击抖动*/
} -moz-transform: skew(30deg) translateZ(0); /*设置倾斜度为-30 防止点击抖动*/
-o-transform: skew(30deg) translateZ(0); /*设置倾斜度为-30 防止点击抖动*/
-ms-transform: skew(30deg) translateZ(0); /*设置倾斜度为-30 防止点击抖动*/
display: flex;
flex-wrap: wrap;
align-items: center;
font-size: 12px;
}
.taskInfoIcon {
position: absolute;
right: -20px;
bottom: 0;
color: #31a8fa;
transform: skew(30deg) translateZ(0); /*设置倾斜度为-30 防止点击抖动*/
-webkit-transform: skew(30deg);
-moz-transform: skew(30deg);
-o-transform: skew(30deg);
-ms-transform: skew(30deg);
} }
} }
.table-list-div { .table-list-div {
width: 100%; width: 100%;
min-height: 20rem; min-height: 20rem;
margin-top: 0.5rem; margin-top: 0.5rem;
.ant-table-content{ .ant-table-content {
.ant-table-thead{ /*.ant-table-thead{*/
tr th .ant-table-header-column{ /*tr th .ant-table-header-column{*/
color: #31a8fa; /*color: #31a8fa;*/
/*}*/
/*}*/
.ant-table-tbody {
tr td {
padding: 5px 10px !important;
} }
} }
} }

@ -397,7 +397,7 @@
type: 'bar', type: 'bar',
stack:'占比情况', stack:'占比情况',
barWidth : 30,// barWidth : 30,//
data: scoreList data: scoreList,
}) })
} }
} }
@ -515,7 +515,7 @@
} }
.task-echart-div { .task-echart-div {
width: 100%; width: 100%;
min-height: 20rem; min-height: 25rem;
.ant-tabs-bar { .ant-tabs-bar {
display: none; display: none;
} }

Loading…
Cancel
Save