Skip to content

R
risk-monitor
提交 9862d5f0 authored 作者: huhuiqing's avatar huhuiqing
浏览文件
操作

创新主体首页、详情页（学校详情、科研实力接口对接）

上级 425de076
全部展开 显示空白字符变更
内嵌 并排
正在显示 包含 365 行增加 和 55 行删除
src/api/innovationSubject/overview.js
浏览文件 @ 9862d5f0
// 智库概览信息
import request from "@/api/request.js";
// 获取新闻资讯
/**
* @param {moduleId}
*/
export function getNews(moduleId = "0105") {
return request({
method: 'GET',
url: `/api/commonFeature/news/${moduleId}`,
})
}
/**
* 社交媒体
*/
export function getSocialMediaInfo(moduleId = "0105") {
return request({
method: "GET",
url: `/api/commonFeature/remarks/${moduleId}`
})
}
// 获取法案风险信号
/**
* @param {moduleId}
*/
export function getBillRiskSignal(moduleId = "0105") {
return request({
method: 'GET',
url: `/api/commonFeature/riskSignal/${moduleId}`,
})
}
//创新主体主页:统计不同创新主体类型对应的主体数量
export function getCountSubjectType() {
return request({
......@@ -59,4 +94,86 @@ export function getResearchFieldSubjectType(params) {
params
})
}
/***********详情页 */
//创新主体详情:基本信息
export function getInfo(params) {
return request({
method: 'GET',
url: `/api/innovateSubject/info/${params.id}`,
params
})
}
//最新动态
export function getDynamics(params) {
return request({
method: 'GET',
url: `/api/innovateSubject/dynamics/${params.orgId}`,
params
})
}
//创新主体详情:历史事件轴
export function getEventList(params) {
return request({
method: 'GET',
url: `/api/innovateSubject/eventList/${params.id}`,
params
})
}
//创新主体详情:重点人物
export function getPersonList(params) {
return request({
method: 'GET',
url: `/api/innovateSubject/personList/${params.id}`,
params
})
}
//创新主体科研实力:专利数量统计
export function getPatentList(params) {
return request({
method: 'GET',
url: `/api/innovateSubject/patentList/${params.id}`,
params
})
}
// 创新主体科研实力:论文数量统计
export function getPaperList(params) {
return request({
method: 'GET',
url: `/api/innovateSubject/paperList/${params.id}`,
params
})
}
//创新主体科研实力:经费增长情况
export function getFundGrowth(params) {
return request({
method: 'GET',
url: `/api/innovateSubject/fundGrowth/${params.id}`,
params
})
}
//创新主体科研实力:经费来源
export function getFundFromList(params) {
return request({
method: 'GET',
url: `/api/innovateSubject/fundFromList/${params.id}`,
params
})
}
//创新主体科研实力:经费分配
export function getFundToList(params) {
return request({
method: 'GET',
url: `/api/innovateSubject/fundToList/${params.id}`,
params
})
}
src/router/modules/InnovationSubject.js
浏览文件 @ 9862d5f0
......@@ -13,7 +13,7 @@ const innovationSubjectRoutes = [
}
},
{
path: "/InnovativeInstitutions",
path: "/InnovativeInstitutions/:id",
name: "InnovativeInstitutions",
component: InnovationInstitution,
meta: {
......
src/views/innovationSubject/index.vue
浏览文件 @ 9862d5f0
......@@ -158,16 +158,16 @@
<div class="box2-main">
<div class="box2-main-item" v-for="(item, index) in warningList" :key="index">
<div class="item-left" :class="{
itemLeftStatus1: item.status === '一般风险',
itemLeftStatus2: item.status === '重大风险'
itemLeftStatus1: item.signalLevel === '一般风险',
itemLeftStatus2: item.signalLevel === '重大风险'
}">
{{ item.status }}
{{ item.signalLevel }}
</div>
<div class="item-right">
<div class="text">
{{ item.title }}
{{ item.signalTitle }}
</div>
<div class="time">{{ item.time }}</div>
<div class="time">{{ item.signalTime }}</div>
</div>
</div>
</div>
......@@ -194,14 +194,14 @@
<div class="box3-main">
<div class="box3-item" v-for="(news, index) in newsList" :key="index">
<div class="left">
<img :src="news.img" alt="" />
<img :src="news.newsImage" alt="" />
</div>
<div class="right">
<div class="right-top">
<div class="title">{{ news.title }}</div>
<div class="time">{{ news.from }}</div>
<div class="title">{{ news.newsTitle }}</div>
<div class="time">{{ news.newsDate + '.' + news.newsOrg }}</div>
</div>
<div class="right-footer">{{ news.content }}</div>
<div class="right-footer">{{ news.newsContent }}</div>
</div>
</div>
</div>
......@@ -216,14 +216,14 @@
<div class="box4-main">
<div class="box4-main-item" v-for="(item, index) in messageList" :key="index">
<div class="left">
<img :src="item.img" alt="" />
<img :src="item.personImage" alt="" />
</div>
<div class="right">
<div class="right-top">
<div class="name">{{ item.name }}</div>
<div class="time">{{ item.time }}</div>
<div class="name">{{ item.personName }}</div>
<div class="time">{{ item.time + '.' + item.orgName }}</div>
</div>
<div class="content">{{ item.content }}</div>
<div class="content">{{ item.remarks }}</div>
</div>
</div>
</div>
......@@ -367,7 +367,8 @@
</div>
<div class="home-main-footer-main">
<div style=" width: 1600px;">
<div class="footer-main-item" v-for="item in universityList" :key="item.name" @click="handleClickToDetail">
<div class="footer-main-item" v-for="item in universityList" :key="item.name"
@click="handleClickToDetail(item.orgId)">
<img :src="item.logoUrl" style="height: 32px; width: 32px;" />
<div class="item-text">{{ item.orgName }}</div>
<div class="item-text2">{{ item.address }}</div>
......@@ -411,6 +412,9 @@ import getCalendarHeatChart from "./utils/cleandarHeat";
import EChart from "@/components/Chart/index.vue";
import { pieOption, raderOption } from "./utils/charts";
import {
getNews,
getSocialMediaInfo,
getBillRiskSignal,
getCountGeography,
getCountSubjectType,
getSubjectTypeList,
......@@ -559,9 +563,11 @@ const handleGetCountGeography = async () => {
}
};
// 点击查看详情
const handleClickToDetail = () => {
const route = router.resolve("/InnovativeInstitutions");
window.open(route.href, "_blank");
const handleClickToDetail = (university) => {
const curRoute = router.resolve({ name: "InnovativeInstitutions", params: { id: university } });
window.open(curRoute.href, "_blank");
// const route = router.resolve("/InnovativeInstitutions");
// window.open(route.href, "_blank");
};
// 查看更多风险信号
......@@ -614,7 +620,17 @@ const warningList = ref([
status: "重大风险"
}
]);
const handleGetBillRiskSignal = async () => {
try {
const res = await getBillRiskSignal();
console.log("风险信号", res);
if (res.code === 200 && res.data) {
warningList.value = res.data
}
} catch (error) {
console.error("获取风险信号error", error);
}
};
// 新闻资讯
const newsList = ref([
{
......@@ -648,6 +664,18 @@ const newsList = ref([
from: "11-2 · ​福克斯新闻网"
}
]);
const handleGetNews = async () => {
try {
const res = await getNews();
console.log("新闻资讯", res);
if (res.code === 200 && res.data) {
newsList.value = res.data
}
} catch (error) {
console.error("获取新闻资讯error", error);
}
};
// 社交媒体
const messageList = ref([
......@@ -670,7 +698,17 @@ const messageList = ref([
content: `提出特朗普政府的AI政策强调技术开放与快速应用，但可能以牺牲安全防范为代价，开启了“潘多拉魔盒”。`
}
]);
const handleGetSocialMediaInfo = async () => {
try {
const res = await getSocialMediaInfo();
console.log("社交媒体", res);
if (res.code === 200 && res.data) {
messageList.value = res.data
}
} catch (error) {
console.error("获取社交媒体error", error);
}
};
// 政令涉及领域
const chart1Data = ref([
......@@ -935,7 +973,6 @@ const areaList = ref([
const categoryList1 = ref(["研究型大学", "国家实验室", "科技企业", "国防承包商"]);
const activeCate1 = ref('');
//类型列表
const handleGetSubjectTypeList = async () => {
try {
......@@ -1000,6 +1037,9 @@ const handleToPosi = id => {
};
onMounted(async () => {
handleGetNews()
handleGetSocialMediaInfo()
handleGetBillRiskSignal()
await handleGetSubjectTypeList()
handleGetCountGeography()
handleGetCountSubjectType()
......@@ -1664,7 +1704,7 @@ onMounted(async () => {
display: flex;
.text {
width: 348px;
width: 310px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 16px;
......
src/views/innovationSubject/innovativeInstitutions/index.vue
浏览文件 @ 9862d5f0
......@@ -2,14 +2,14 @@
<div class="wrap">
<div class="header">
<div class="header-left">
<img src="./assets/images/icon-harvard.png" alt="" />
<img :src="institutionInfo.logoUrl" alt="" />
</div>
<div class="header-right">
<div class="title">{{ institutionInfo.name }}</div>
<div class="en-title">{{ institutionInfo.enName }}</div>
<div class="desc">{{ institutionInfo.desc }}</div>
<div class="title">{{ institutionInfo.orgName }}</div>
<div class="en-title">{{ institutionInfo.orgNameEn }}</div>
<div class="desc">{{ institutionInfo.orgIntroduction }}</div>
<div class="tag-box">
<div class="tag" v-for="(tag, index) in institutionInfo.tagList" :key="index">
<div class="tag" v-for="(tag, index) in institutionInfo.taglist" :key="index">
{{ tag }}
</div>
</div>
......@@ -18,17 +18,12 @@
<div class="icon">
<img src="@/assets/images/links-icon.png" alt="" />
</div>
<div class="text">{{ "查看官网" }}</div>
<div class="text" @click="toURL(institutionInfo.url)">{{ "查看官网" }}</div>
</div>
</div>
<div class="tab-box">
<div
class="tab"
@click="handleClickTab(item, index)"
:class="{ tabActive: item.active }"
v-for="(item, index) in tabList"
:key="index"
>
<div class="tab" @click="handleClickTab(item, index)" :class="{ tabActive: item.active }"
v-for="(item, index) in tabList" :key="index">
{{ item.name }}
</div>
</div>
......@@ -47,6 +42,11 @@ import overView from "./overView/index.vue";
import researchStrength from "./researchStrength/index.vue";
import cooperationStatus from "./cooperationStatus/index.vue";
import otherStatus from "./otherStatus/index.vue";
import { useRouter } from "vue-router";
import {
getInfo
} from "@/api/innovationSubject/overview.js";
const router = useRouter();
const institutionInfo = ref({
name: "哈佛大学",
......@@ -55,6 +55,23 @@ const institutionInfo = ref({
tagList: ["常春藤", "精英摇篮"]
});
const handleGetInfo = async () => {
try {
let params = {
id: router.currentRoute._value.params.id
}
const res = await getInfo(params);
console.log("创新主体详情", res);
if (res.code === 200 && res.data) {
institutionInfo.value = res.data
}
} catch (error) {
console.error("获取创新主体详情error", error);
}
};
const toURL = (url) => {
}
const activeTabName = ref("学校详情");
const tabList = ref([
......@@ -83,6 +100,11 @@ const handleClickTab = (val, index) => {
tabList.value[index].active = true;
activeTabName.value = val.name;
};
onMounted(async () => {
handleGetInfo()
});
</script>
<style lang="scss" scoped>
......@@ -93,6 +115,7 @@ const handleClickTab = (val, index) => {
background-repeat: no-repeat;
background-size: 100% auto;
padding-top: 16px;
.header {
width: 1600px;
height: 200px;
......@@ -104,17 +127,21 @@ const handleClickTab = (val, index) => {
background: rgba(255, 255, 255, 0.8);
display: flex;
position: relative;
.header-left {
width: 160px;
height: 160px;
margin: 20px;
img {
width: 100%;
height: 100%;
}
}
.header-right {
margin-left: 24px;
.title {
margin-top: 26px;
height: 42px;
......@@ -126,6 +153,7 @@ const handleClickTab = (val, index) => {
letter-spacing: 0px;
text-align: left;
}
.en-title {
margin-top: 8px;
height: 24px;
......@@ -137,6 +165,7 @@ const handleClickTab = (val, index) => {
letter-spacing: 0px;
text-align: left;
}
.desc {
margin-top: 6px;
height: 24px;
......@@ -148,10 +177,12 @@ const handleClickTab = (val, index) => {
letter-spacing: 0px;
text-align: justify;
}
.tag-box {
margin-top: 14px;
display: flex;
gap: 8px;
.tag {
height: 24px;
padding: 0px 8px;
......@@ -166,6 +197,7 @@ const handleClickTab = (val, index) => {
}
}
}
.header-btn {
position: absolute;
top: 26px;
......@@ -179,14 +211,17 @@ const handleClickTab = (val, index) => {
justify-content: center;
align-items: center;
cursor: pointer;
.icon {
width: 16px;
height: 16px;
img {
width: 100%;
height: 100%;
}
}
.text {
height: 22px;
color: rgba(255, 255, 255, 1);
......@@ -197,6 +232,7 @@ const handleClickTab = (val, index) => {
}
}
}
.tab-box {
width: 1600px;
height: 64px;
......@@ -209,6 +245,7 @@ const handleClickTab = (val, index) => {
display: flex;
justify-content: space-between;
align-items: center;
.tab {
width: 397px;
height: 54px;
......@@ -223,10 +260,12 @@ const handleClickTab = (val, index) => {
font-weight: 400;
letter-spacing: 0px;
cursor: pointer;
&:hover {
background: rgba(231, 243, 255, 1);
}
}
.tabActive {
border: 2px solid rgba(174, 214, 255, 1);
background: rgba(231, 243, 255, 1);
......@@ -235,6 +274,7 @@ const handleClickTab = (val, index) => {
font-weight: 700;
}
}
.main {
width: 1600px;
margin: 16px auto;
......
src/views/innovationSubject/innovativeInstitutions/researchStrength/index.vue
浏览文件 @ 9862d5f0
<!--科研实力-->
<template>
<div class="detail-wrap">
<div class="row">
......@@ -15,7 +16,7 @@
</div>
</div>
<div class="statisticsChart">
<Echarts :option="barOption" height="100%"></Echarts>
<Echarts :option="barOption(patentList)" height="100%"></Echarts>
</div>
<div class="statisticsAI">
<div class="AIbox">
......@@ -39,7 +40,7 @@
</div>
</div>
<div class="statisticsChart">
<Echarts :option="lineChart" height="100%"></Echarts>
<Echarts :option="lineChart(paperList)" height="100%"></Echarts>
</div>
<div class="statisticsAI">
<div class="AIbox">
......@@ -89,7 +90,7 @@
</div>
</div>
<div class="statisticsChart">
<Echarts :option="lineChart1" height="100%"></Echarts>
<Echarts :option="lineChart1(fundGrowth)" height="100%"></Echarts>
</div>
<div class="statisticsAI">
<div class="AIbox">
......@@ -115,7 +116,7 @@
</div>
</div>
<div class="statisticsChart">
<Echarts :option="pieOption1" height="100%"></Echarts>
<Echarts :option="pieOption1(fundFromList)" height="100%"></Echarts>
</div>
<div class="statisticsAI">
<div class="AIbox">
......@@ -146,7 +147,7 @@
letter-spacing: 0px;
text-align: right;">（亿美元）</div>
<div class="statisticsChart" style="height: 298px; ">
<Echarts :option="horizontalBaroption" height="100%" ></Echarts>
<Echarts :option="horizontalBaroption(fundToList)" height="100%"></Echarts>
</div>
<div class="statisticsAI">
<div class="AIbox">
......@@ -164,8 +165,103 @@
import { ref, computed, onMounted } from "vue";
import Echarts from "@/components/Chart/index.vue";
import { barOption, lineChart, raderOption1, lineChart1, pieOption1, horizontalBaroption } from "../../utils/charts.js";
import {
getPatentList,
getPaperList, getFundGrowth, getFundFromList, getFundToList
} from "@/api/innovationSubject/overview.js";
import { useRouter } from "vue-router";
const router = useRouter();
//专利数量统计
const patentList = ref([])
const handleGetPatentList = async () => {
try {
let params = {
id: router.currentRoute._value.params.id
}
const res = await getPatentList(params);
console.log("专利数量统计", res);
if (res.code === 200 && res.data) {
patentList.value = res.data
}
} catch (error) {
console.error("获取专利数量统计error", error);
}
};
//论文数量统计
const paperList = ref([])
const handleGetPaperList = async () => {
try {
let params = {
id: router.currentRoute._value.params.id
}
const res = await getPaperList(params);
console.log("论文数量统计", res);
if (res.code === 200 && res.data) {
paperList.value = res.data
}
} catch (error) {
console.error("获取论文数量统计error", error);
}
};
//经费增长情况
const fundGrowth = ref([])
const handleGetFundGrowth = async () => {
try {
let params = {
id: router.currentRoute._value.params.id
}
const res = await getFundGrowth(params);
console.log("经费增长情况", res);
if (res.code === 200 && res.data) {
fundGrowth.value = res.data
}
} catch (error) {
console.error("获取经费增长情况error", error);
}
};
//经费来源
const fundFromList = ref([])
const handleGetFundFromList = async () => {
try {
let params = {
id: router.currentRoute._value.params.id
}
const res = await getFundFromList(params);
console.log("经费来源", res);
if (res.code === 200 && res.data) {
fundFromList.value = res.data
}
} catch (error) {
console.error("获取经费来源error", error);
}
};
//学院经费分配排序
const fundToList = ref([])
const handlegGetFundToList = async () => {
try {
let params = {
id: router.currentRoute._value.params.id
}
const res = await getFundToList(params);
console.log("学院经费分配排序", res);
if (res.code === 200 && res.data) {
fundToList.value = res.data
}
} catch (error) {
console.error("获取学院经费分配排序error", error);
}
};
onMounted(async () => {
handleGetPatentList()
handleGetPaperList()
handleGetFundGrowth()
handleGetFundFromList()
handlegGetFundToList()
});
</script>
......@@ -175,16 +271,19 @@ import { barOption, lineChart, raderOption1, lineChart1, pieOption1, horizontalB
flex-direction: column;
gap: 16px;
padding-bottom: 30px;
.box {
border: 1px solid rgba(234, 236, 238, 1);
border-radius: 10px;
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
background: rgba(255, 255, 255, 1);
}
.box-header {
height: 56px;
display: flex;
position: relative;
.header-left {
margin-top: 18px;
width: 8px;
......@@ -192,6 +291,7 @@ import { barOption, lineChart, raderOption1, lineChart1, pieOption1, horizontalB
border-radius: 0 4px 4px 0;
background: rgba(10, 87, 166, 1);
}
.title {
margin-left: 14px;
margin-top: 14px;
......@@ -203,11 +303,13 @@ import { barOption, lineChart, raderOption1, lineChart1, pieOption1, horizontalB
letter-spacing: 0px;
text-align: left;
}
.header-btn-box {
position: absolute;
top: 14px;
right: 52px;
display: flex;
.btn {
margin-left: 8px;
height: 28px;
......@@ -224,12 +326,14 @@ import { barOption, lineChart, raderOption1, lineChart1, pieOption1, horizontalB
font-weight: 400;
cursor: pointer;
}
.btnActive {
border: 1px solid rgba(10, 87, 166, 1);
background: rgba(246, 250, 255, 1);
color: rgba(10, 87, 166, 1);
}
}
.header-info {
height: 22px;
position: absolute;
......@@ -237,16 +341,19 @@ import { barOption, lineChart, raderOption1, lineChart1, pieOption1, horizontalB
top: 17px;
display: flex;
justify-content: flex-end;
.icon {
margin-top: 3px;
width: 14px;
height: 14px;
margin-right: 8px;
img {
width: 100%;
height: 100%;
}
}
.text {
height: 22px;
color: rgba(95, 101, 108, 1);
......@@ -256,6 +363,7 @@ import { barOption, lineChart, raderOption1, lineChart1, pieOption1, horizontalB
line-height: 22px;
}
}
.header-right {
position: absolute;
top: 14px;
......@@ -263,15 +371,18 @@ import { barOption, lineChart, raderOption1, lineChart1, pieOption1, horizontalB
display: flex;
justify-content: flex-end;
gap: 8px;
.icon {
width: 28px;
height: 28px;
img {
width: 100%;
height: 100%;
}
}
.checkboxRight{
.checkboxRight {
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei;
font-size: 16px;
......@@ -280,7 +391,8 @@ import { barOption, lineChart, raderOption1, lineChart1, pieOption1, horizontalB
letter-spacing: 0px;
text-align: justify;
}
.btnRightActive{
.btnRightActive {
width: 80px;
height: 28px;
display: flex;
......@@ -299,7 +411,8 @@ import { barOption, lineChart, raderOption1, lineChart1, pieOption1, horizontalB
letter-spacing: 0px;
text-align: center;
}
.btnRight{
.btnRight {
width: 80px;
height: 28px;
display: flex;
......@@ -320,20 +433,24 @@ import { barOption, lineChart, raderOption1, lineChart1, pieOption1, horizontalB
}
}
}
.row{
.row {
display: flex;
width: 1600px;
height: 500px;
gap: 16px;
.statisticsItem{
.statisticsItem {
width: 792px;
height: 500px;
.statisticsChart{
.statisticsChart {
width: 736px;
height: 321px;
margin: 20px auto;
}
.statisticsAI{
.statisticsAI {
margin: 0 auto;
width: 760px;
height: 64px;
......@@ -348,7 +465,8 @@ import { barOption, lineChart, raderOption1, lineChart1, pieOption1, horizontalB
border: 1px solid rgba(231, 243, 255, 1);
border-radius: 4px;
background: rgba(246, 250, 255, 1);
.AIbox{
.AIbox {
width: 736px;
height: 52px;
......@@ -359,7 +477,8 @@ import { barOption, lineChart, raderOption1, lineChart1, pieOption1, horizontalB
align-items: center;
gap: 13px;
padding: 2px 0px 2px 0px;
.AItext{
.AItext {
width: 667px;
height: 48px;
display: flex;
......@@ -381,9 +500,4 @@ import { barOption, lineChart, raderOption1, lineChart1, pieOption1, horizontalB
}
}
</style>
\ No newline at end of file
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论