zm/tougao_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

期刊

Browse Source
This commit is contained in:
始于初见
2024-09-04 11:35:15 +08:00
parent 5a670be729
commit 9017497b15
2 changed files with 199 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

250
src/components/page/PaperSubmitanalysis.vue
View File

@@ -1,12 +1,14 @@
<template>
<div class="container" style="padding-bottom: 50px; width: 100%; height: 100%" v-loading="loading" >
<div style="width: 100%; height: 38vh; margin-bottom: 2vh; position: relative">
<i class="el-icon-refresh refresh" @click="getCharts('year')"></i>
<div id="yearchart" style="width: 100%; height: 100%"></div>
</div>
<div style="width: 100%; height: 44vh; position: relative; margin-bottom: 80px">
<i class="el-icon-refresh refresh" @click="getCharts('month')"></i>
<div id="monthchart" style="width: 100%; height: 100%"></div>
<div class="container" style="padding-bottom: 50px; width: 100%; height: 100%" v-loading="loading">
<div style="display: flex; align-items: center; justify-content: space-between; width: 100%; height: 34vh; margin-bottom: 40px">
<div style="width: 48%; height: 100%; margin-bottom: 2vh; position: relative">
<i class="el-icon-refresh refresh" @click="getCharts('year')"></i>
<div id="yearchart" style="width: 100%; height: 100%"></div>
</div>
<div style="width: 48%; height: 100%; position: relative">
<i class="el-icon-refresh refresh" @click="getCharts('month')"></i>
<div id="monthchart" style="width: 100%; height: 100%"></div>
</div>
</div>
<div
@@ -55,7 +57,18 @@ const jAtableM = () => import('@/components/common/journalArticleTable');
export default {
data() {
return {
loading: false
loading: false,
yearData: {},
monthData: {},
JournalYearData: [],
JournalMonthData: [],
user_id: localStorage.getItem('U_id'),
urlList: {
year: 'api/Monitor/getArticleNumByYearForEditor',
month: 'api/Monitor/getArticleNumByMonthForEditor',
Journalyear: 'api/Monitor/getArticleNumByYearAndJournalForEditor',
Journalmonth: 'api/Monitor/getArticleNumByMonthAndJournalForEditor'
}
};
},
components: {
@@ -70,12 +83,16 @@ export default {
// spinner: 'el-icon-loading',
// background: 'rgba(0, 0, 0, 0.7)'
// });
await this.getData('year');
await this.getData('month');
await this.getJournalData('year');
await this.getJournalData('month');
await this.getCharts('year');
await this.getCharts('month');
await this.getTableData();
this.$forceUpdate();
},
async mounted() {},
methods: {
handleRefresh() {},
async getEchartsData() {
@@ -85,7 +102,6 @@ export default {
},
async getCharts(type) {
var optionsData = await this.getdata(type);
console.log('🚀 ~ getCharts ~ optionsData:', optionsData);
const chartBox = await this.$echarts.init(document.getElementById(`${type}chart`));
var option = {};
@@ -93,15 +109,69 @@ export default {
title: {
text: this.$t(`journalArticleCount.${type}Title`)
},
// tooltip: {
// trigger: 'axis',
// axisPointer: {
// type: 'cross',
// label: {
// backgroundColor: '#6a7985'
// }
// }
// },
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
label: {
backgroundColor: '#6a7985'
// formatter函数动态修改tooltip样式
formatter: function (params) {
var that = this;
console.log('params at line 430:', params);
if (params) {
var htmlStr = '';
// htmlStr += params[0].name.replace(/\-/g, '/') + '<br/>'; //x轴的名称
if (params[0].axisIndex == 0) {
htmlStr += '<div>';
htmlStr += `${params[0].name} `;
//圆点后面显示的文本
for (var i = 0; i < params.length; i++) {
var param = params[i]; // 存一份item项
console.log('param at line 404:', param);
var value = param.value; //y轴值
var color = param.color; //图例颜色
var journalStr = ``;
param.data.otherInfo.forEach((e) => {
journalStr +=
'<span style="margin-right:5px;display:inline-block;width:10px;height:10px;border-radius:5px;background-color:' +
color +
';"></span>' +
`<span>${e.key} : ${e.value}</span><br/>`;
});
htmlStr += `${param.seriesName}: ${value}`; //2023年
htmlStr += `<p style='border-bottom:1px solid #b0b0b0;margin:5px 0;'></p>`;
htmlStr += journalStr;
htmlStr += '</div>';
}
}
return htmlStr;
} else {
return;
}
},
backgroundColor: '#fff',
borderWidth: 1,
borderColor: '#ccc',
padding: 10,
textStyle: {
color: '#000',
fontSize: 12,
align: 'left'
}
},
// legend: {
// data: ['Email', 'Union Ads', 'Video Ads', 'Direct', 'Search Engine']
// },
@@ -113,6 +183,18 @@ export default {
// restore: {},
// }
},
label: {
formatter: '',
rich: {
b: {
color: '#4C5058',
fontSize: 12,
fontWeight: 'bold',
lineHeight: 10
}
}
},
dataZoom:
type == 'month'
? [
@@ -192,37 +274,102 @@ export default {
});
this.$forceUpdate();
},
// 获取文章列表数据
async getdata(type) {
var data = {};
async getData(type) {
var url = '';
if (type == 'month') {
url = '/api/Monitor/getArticleNumByMonth';
url = this.urlList.month;
} else if (type == 'year') {
url = '/api/Monitor/getArticleNumByYear';
url = this.urlList.year;
}
await this.$api
.post(url)
.post(url, {
user_id: this.user_id
})
.then((res) => {
var that = this;
if (res.code == 0) {
console.log('🚀 ~ .then ~ res1998:' + type, res.data.articles);
var xAxisData = [];
var seriesData = [];
Object.entries(res.data.articles).forEach(([key, value]) => {
xAxisData.push(key);
seriesData.push(value);
data = { type: type, xAxisData: xAxisData, seriesData: seriesData };
});
if (type == 'month') {
this.monthData = res.data.articles;
} else if (type == 'year') {
this.yearData = res.data.articles;
}
}
})
.catch((err) => {
console.log(err);
});
},
// 获取文章列表数据
async getdata(type) {
var data = {};
var optionJournalData = [];
var optionData = [];
console.log('...this.JournalMonthData at line 308:', this.JournalMonthData);
if (type == 'month') {
optionJournalData = [...this.JournalMonthData];
optionData = this.monthData;
} else if (type == 'year') {
optionJournalData = [...this.JournalYearData];
optionData = this.yearData;
}
var xAxisData = [];
var seriesData = [];
console.log('optionJournalData at line 291:', optionData);
Object.entries(optionData).forEach(([key, value]) => {
xAxisData.push(key);
console.log('key at line 294:', key);
var otherInfo = optionJournalData.map((e) => {
for (let i in e.value) {
if (i == key) {
console.log('e at line 299:', e.value[i]);
return {
key: e.key,
value: e.value[i].split('/')[0]
};
}
}
});
seriesData.push({ value: value, otherInfo: otherInfo });
data = { type: type, xAxisData: xAxisData, seriesData: seriesData };
});
return data;
},
async getJournalData(type) {
var data = {};
var url = '';
if (type == 'month') {
url = this.urlList.Journalmonth;
} else if (type == 'year') {
url = this.urlList.Journalyear;
}
await this.$api
.post(url, {
user_id: this.user_id
})
.then((res) => {
var that = this;
if (res.code == 0) {
data = res.data.data.map((e) => {
return { key: e.journal.abbr, value: e.articles, jabbr: e.journal.jabbr };
});
if (type == 'month') {
this.JournalMonthData = data;
} else if (type == 'year') {
this.JournalYearData = data;
}
}
})
.catch((err) => {
console.log(err);
});
},
// 获取文章列表数据
async getTableData() {
this.$nextTick(async () => {
@@ -235,32 +382,29 @@ export default {
var data = {};
var timeData = [];
var tableData = [];
var url = '';
if (type == 'month') {
url = '/api/Monitor/getArticleNumByMonthForJournal';
} else if (type == 'year') {
url = '/api/Monitor/getArticleNumByYearForJournal';
}
await this.$api
.post(url)
.then(async (res) => {
var that = this;
if (res.code == 0) {
for (let i in res.data.data) {
tableData.push({ ...res.data.data[i].journal, ...res.data.data[i].articles });
}
for (let i in this.monthData) {
console.log('i at line 386:', i);
timeData.push(i);
}
for (let i in res.data.data[0].articles) {
timeData.push(i);
}
data = { tableData: tableData, timeData: timeData };
}
})
.catch((err) => {
console.log(err, '989898');
this.loading = false;
tableData = this.JournalMonthData.map((e) => {
console.log('e at line 394:', e);
return { ...e.value, abbr: e.key, jabbr: e.jabbr };
});
} else if (type == 'year') {
for (let i in this.yearData) {
console.log('i at line 386:', i);
timeData.push(i);
}
tableData = this.JournalYearData.map((e) => {
console.log('e at line 394:', e);
return { ...e.value, abbr: e.key, jabbr: e.jabbr };
});
}
data = { tableData: tableData, timeData };
console.log(data, type, '98999');
if (type == 'year') {
this.$refs.yearTableData.getTableInfo(type, data);

4
vue.config.js
View File

@@ -72,9 +72,9 @@ module.exports = {
// target: 'https://www.tmrjournals.cn',
// target: 'http://www.tougao.com/public/index.php/',
// target: 'http://www.tougao.com/',
// target: 'http://192.168.110.110/tougao/public/index.php/',
target: 'http://192.168.110.110/tougao/public/index.php/',
// target: 'http://api.tmrjournals.com/public/index.php/',//正式
target: 'https://submission.tmrjournals.com/',//正式
// target: 'https://submission.tmrjournals.com/',//正式
changeOrigin: true,
pathRewrite: {
'^/api': ''