HelloGithub/hellogithub-vue
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

更新页面

Browse Source
This commit is contained in:
Zhang HaoYang
2023-07-09 11:37:19 +08:00
parent fd74c0479f
commit 42f2f6d503
1 changed files with 48 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
src/components/Ranking/Ranking.vue
View File

@@ -13,10 +13,10 @@
<div class="PageContent" style="display: flex;flex-direction: column;flex-wrap: nowrap">
<el-card class="box-card">
<div style="display: flex;flex-direction: row;flex-wrap: nowrap;justify-content: space-between">
<el-cascader @change="FreshPage(selectedValue)" v-model="selectedValue" :options="options" placeholder="选择分类"
<el-cascader @change="FreshPage(selectedValue,true)" v-model="selectedValue" :options="options" placeholder="选择分类"
:show-all-levels="false" style="width: 10vw"></el-cascader>
<el-image fit="fill" :src="require('@/assets/svg/logo-tiobe.svg')" style="width:8vw;height: 4vh;display: flex;flex-direction: row;justify-content: flex-end"></el-image>
<el-select @change="FreshPage(selectedValue)" placeholder="选择年份" v-model="selectedValueByYear" style="width: 7vw">
<el-select @change="FreshPage(selectedValue,false)" placeholder="选择年份" v-model="selectedValueByYear" style="width: 7vw">
<el-option
v-for="(n,index) in 12"
:key="index"
@@ -34,6 +34,14 @@
active-text="月度趋势"
inactive-text="年度统计">
</el-switch>
<el-row :gutter="24" style="margin-top:20px;">
<el-col :span="20" style="margin-left:10%">
<el-card shadow="always">
<span style="font-size:30px;font-weight:600">GitHub官网数据汇总</span>
</el-card>
</el-col>
</el-row>
<el-table
border
class="DataForm"
@@ -52,8 +60,14 @@
</el-table-column>
</el-table>
<el-button @click="test()"></el-button>
<div ref="EChart" style="width: 700px; height: 700px;"></div>
<el-row :gutter="24" style="margin-top:20px;">
<el-col :span="20" style="margin-left:10%">
<el-card shadow="always">
<span style="font-size:30px;font-weight:600">GitHub官网数据统计图</span>
</el-card>
</el-col>
</el-row>
<div ref="EChart" style="width: 700px;height:700px;margin-top:20px"></div>
</el-card>
</div>
</div>
@@ -127,7 +141,7 @@ export default {
value1: false,
// 默认用户选择的分类
selectedValue:['1','2'],
selectedValueByYear:2023,
selectedValueByYear:null,
}
},
updated(){
@@ -142,7 +156,6 @@ export default {
},
mounted() {
this.initPage();
window.open('/', '_self');
console.log(this.showData);
},
methods: {
@@ -156,14 +169,13 @@ export default {
initPage(){
var that = this;
that.formName=['语言种类','获得星数'];
this.getNumData(2023,false);
setTimeout(()=>{
this.getRenderer();
},1000);
// this.getNumData(2023,false);
// this.getRenderer();
},
FreshPage(type){
FreshPage(type,index){
var that = this;
if(index == true) that.selectedValueByYear = 11;
// console.log(that.selectedValueByYear);
type = type[type.length-1] - 1;
let year = that.selectedValueByYear + 2012;
@@ -193,8 +205,9 @@ export default {
var that = this;
that.showData = [];
let starNum2 = that.starNum.filter(item => item['year'] == year);
let tmp = [];
if(index == false){
let tmp = [];
// 按年度统计：
for(let i=0;i<starNum2.length;i++){
let tmpObj = {name:starNum2[i].name,count:starNum2[i].count};
let findSignal = tmp.findIndex(item=>item['name'] == tmpObj['name']);
@@ -204,10 +217,31 @@ export default {
tmp.push(tmpObj);
}
}
that.showData = tmp.slice(0,20);
that.showData = tmp.slice(0,18);
that.showData = that.showData.sort(compare('count'));
// console.log(that.showData);
}else{
let quarterItems = [[],[],[],[]];
//按月度统计：存在两种特例：
// if(year == 2012){
// quarterItems = [[],[],[]];
// }else if(year == 2023){
// quarterItems = {'1':[]};
// }else{
// quarterItems = {'1':[],'2':[],'3':[],'4':[]};
// }
for(let i=0;i<starNum2.length;i++){
// 该数据对象：
let tmpObj = {name:starNum2[i].name,count:starNum2[i].count};
// 应该存入的对应季度数组：quarterItems[starNum2[i]['quarter']]
let tmp = quarterItems[starNum2[i]['quarter']];
let findSignal = quarterItems[starNum2[i]['quarter']].findIndex(item=>item['name'] == tmpObj['name']);
if (findSignal != -1){
tmp[findSignal]['count'] = parseInt(tmp[findSignal]['count']) + parseInt(tmpObj['count']);
}else{
tmp.push(tmpObj);
}
}
}
},
@@ -256,7 +290,7 @@ export default {
}
}],
grid: {
x: '10%',
x: '18%',
y: 0,
x2: '10%',
y2: 0