commit
This commit is contained in:
@@ -1,218 +0,0 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<div id="app" v-cloak>
|
||||
<guava>
|
||||
<el-card shadow="never">
|
||||
<el-date-picker
|
||||
v-model="startYear"
|
||||
value-format="yyyy"
|
||||
type="year"
|
||||
placeholder="开始年份">
|
||||
</el-date-picker>
|
||||
<span>至</span>
|
||||
<el-date-picker
|
||||
v-model="endYear"
|
||||
value-format="yyyy"
|
||||
type="year"
|
||||
placeholder="结束年份">
|
||||
</el-date-picker>
|
||||
<el-button icon="el-icon-search" type="primary" @click="doFilter"></el-button>
|
||||
</el-card>
|
||||
|
||||
<el-card class="mt10" shadow="never">
|
||||
<template #header>
|
||||
<el-row type="flex">
|
||||
<el-col :span="12">
|
||||
<vi-title title="年度获奖趋势"></vi-title>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
<div id="honor_type_box"></div>
|
||||
</el-card>
|
||||
|
||||
<el-row :gutter="20" class="mt10" type="flex">
|
||||
<el-col :span="12">
|
||||
<el-card shadow="never">
|
||||
<template #header>
|
||||
<vi-title title="个人荣誉奖项"></vi-title>
|
||||
</template>
|
||||
<div id="single_honor_type_box"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-card shadow="never">
|
||||
<template #header>
|
||||
<vi-title title="个人荣誉奖项级别"></vi-title>
|
||||
</template>
|
||||
<div id="single_honor_level_box"></div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</guava>
|
||||
</div>
|
||||
<script>
|
||||
let linePlot = null
|
||||
let singleHonorTypePlot = null
|
||||
let singleLevelTypePlot = null
|
||||
|
||||
var vue = new Vue({
|
||||
el: '#app',
|
||||
mixins: [initTableMixins],
|
||||
data() {
|
||||
return {
|
||||
startYear: null,
|
||||
endYear: null,
|
||||
honorTypeList: [],
|
||||
singleHonorList: [],
|
||||
singleLevelList: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async getHonorTypeByYear() {
|
||||
const resp_data = await $.get('/platform/honor/board/getHonorTypeByYear')
|
||||
if(resp_data.code===0){
|
||||
this.honorTypeList = resp_data.data
|
||||
}
|
||||
},
|
||||
renderHonorTypeByYear(data) {
|
||||
console.log(data)
|
||||
|
||||
// data = [{
|
||||
// name: "集体荣誉",
|
||||
// num: 4,
|
||||
// year: 2022
|
||||
// },{
|
||||
// name: "个人荣誉",
|
||||
// num:10,
|
||||
// year: 2022
|
||||
// }]
|
||||
|
||||
if (linePlot) {
|
||||
linePlot.changeData(data)
|
||||
} else {
|
||||
linePlot = new G2Plot.Line('honor_type_box', {
|
||||
data,
|
||||
xField: 'year',
|
||||
yField: 'num',
|
||||
seriesField: 'name',
|
||||
legend: {
|
||||
position: 'top',
|
||||
},
|
||||
smooth: true,
|
||||
});
|
||||
linePlot.render()
|
||||
}
|
||||
},
|
||||
|
||||
async getSingleHonorByYear() {
|
||||
const resp_data = await $.get('/platform/honor/board/getSingleHonorByYear')
|
||||
if(resp_data.code===0){
|
||||
this.singleHonorList = resp_data.data
|
||||
}
|
||||
},
|
||||
renderSingleHonorByYear(data) {
|
||||
if (singleHonorTypePlot) {
|
||||
singleHonorTypePlot.changeData(data)
|
||||
} else {
|
||||
singleHonorTypePlot = new G2Plot.Pie('single_honor_type_box', {
|
||||
appendPadding: 10,
|
||||
data,
|
||||
angleField: 'num',
|
||||
colorField: 'name',
|
||||
radius: 0.9,
|
||||
label: {
|
||||
type: 'inner',
|
||||
offset: '-30%',
|
||||
content: ({percent}) => (percent * 100).toFixed(0) + "%",
|
||||
style: {
|
||||
fontSize: 14,
|
||||
textAlign: 'center',
|
||||
},
|
||||
},
|
||||
interactions: [{type: 'element-active'}],
|
||||
})
|
||||
singleHonorTypePlot.render()
|
||||
}
|
||||
},
|
||||
|
||||
async getSingleLevelByYear() {
|
||||
const resp_data = await $.get('/platform/honor/board/getSingleLevelByYear')
|
||||
if(resp_data.code===0){
|
||||
this.singleLevelList = resp_data.data
|
||||
}
|
||||
},
|
||||
renderSingleLevelByYear(data) {
|
||||
if (singleLevelTypePlot) {
|
||||
singleLevelTypePlot.changeData(data)
|
||||
} else {
|
||||
singleLevelTypePlot = new G2Plot.Column('single_honor_level_box', {
|
||||
data,
|
||||
xField: 'name',
|
||||
yField: 'num',
|
||||
position: 'middle',
|
||||
columnStyle: {
|
||||
radius: [20, 20, 0, 0],
|
||||
},
|
||||
})
|
||||
singleLevelTypePlot.render()
|
||||
}
|
||||
},
|
||||
|
||||
doFilter() {
|
||||
if (this.startYear == null) {
|
||||
this.notifyWarning('请输入开始年份')
|
||||
return
|
||||
}
|
||||
if (this.endYear == null) {
|
||||
this.notifyWarning('请输入结束年份')
|
||||
return
|
||||
}
|
||||
if (parseInt(this.startYear) > parseInt(moment().format('YYYY'))) {
|
||||
this.notifyWarning('开始年份不能大于当前年份')
|
||||
return
|
||||
}
|
||||
if (parseInt(this.endYear) > parseInt(moment().format('YYYY'))) {
|
||||
this.notifyWarning('结束年份不能大于当前年份')
|
||||
return
|
||||
}
|
||||
if (parseInt(this.startYear) > parseInt(this.endYear)) {
|
||||
this.notifyWarning('开始年份不能大于结束年份')
|
||||
return
|
||||
}
|
||||
|
||||
const startYear = parseInt(this.startYear)
|
||||
const endYear = parseInt(this.endYear)
|
||||
|
||||
const htl = this.honorTypeList.filter(v => {
|
||||
return startYear <= v.year && v.year <= endYear
|
||||
})
|
||||
console.log(htl)
|
||||
this.renderHonorTypeByYear(htl)
|
||||
|
||||
const shl = this.singleHonorList.filter(v => {
|
||||
return startYear <= v.year && v.year <= endYear
|
||||
})
|
||||
this.renderSingleHonorByYear(shl)
|
||||
|
||||
const sll = this.singleLevelList.filter(v => {
|
||||
return startYear <= v.year && v.year <= endYear
|
||||
})
|
||||
this.renderSingleLevelByYear(sll)
|
||||
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.startYear = (parseInt(moment().format('YYYY')) - 10).toString()
|
||||
this.endYear = moment().format('YYYY')
|
||||
await this.getHonorTypeByYear()
|
||||
await this.getSingleHonorByYear()
|
||||
await this.getSingleLevelByYear()
|
||||
this.doFilter()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
Reference in New Issue
Block a user