forked from Gitlink/forgeplus-react
增加成果列表字段
This commit is contained in:
zhangxiaozhuozhuo
parent
386d381d69
commit
7ebd61f205
|
|
@ -3,6 +3,7 @@ import echarts from 'echarts';
|
|||
import './index.scss';
|
||||
import topCountPng from '../image/left_top_icon.png';
|
||||
import botCountPng from '../image/left_bot_icon.png';
|
||||
import { getAchivChart } from '../api';
|
||||
|
||||
function AchivChart() {
|
||||
useEffect(() => {
|
||||
|
|
@ -60,7 +61,18 @@ function AchivChart() {
|
|||
{ value: 45, name: '科研成果 32%' },
|
||||
{ value: 52, name: '装备成果 40%' },
|
||||
{ value: 66, name: '其他成果 50%' }
|
||||
]
|
||||
],
|
||||
label: {
|
||||
show: true,
|
||||
position: 'inside',
|
||||
color: 'white',
|
||||
formatter: function (params) {
|
||||
return Math.round(params.percent) + '%';
|
||||
},
|
||||
textStyle: {
|
||||
fontSize: 20
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
graphic: {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
|
||||
#mainContent {
|
||||
margin: 40px auto 0 auto;
|
||||
margin: 10px auto 0 auto;
|
||||
width: 1200px;
|
||||
height: 450px;
|
||||
display: flex;
|
||||
|
|
@ -8,12 +8,12 @@
|
|||
box-shadow:8px 6px 18px rgba(171, 202, 255, 0.24) inset;
|
||||
|
||||
#leftBox {
|
||||
width: 500px;
|
||||
width: 550px;
|
||||
height: 450px;
|
||||
position: relative;
|
||||
.count-top {
|
||||
display: flex;
|
||||
width: 180px;
|
||||
width: 190px;
|
||||
height: 95px;
|
||||
position: absolute;
|
||||
top: 87px;
|
||||
|
|
@ -39,30 +39,31 @@
|
|||
height: 95px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
#count-num {
|
||||
width: 100%;
|
||||
height: 55px;
|
||||
line-height: 55px;
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
// font-family:Alibaba PuHuiTi;
|
||||
font-weight:600;
|
||||
color:#283444;
|
||||
font-size:24px;
|
||||
letter-spacing:2px;
|
||||
}
|
||||
// .count-title {
|
||||
// width: 100%;
|
||||
// height: 40px;
|
||||
// line-height: 40px;
|
||||
// // font-family:Alibaba PuHuiTi;
|
||||
// color:#445a7a;
|
||||
// font-size:15px;
|
||||
// letter-spacing:50px;
|
||||
// }
|
||||
.count-title {
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
// font-family:Alibaba PuHuiTi;
|
||||
color:#445a7a;
|
||||
font-size:15px;
|
||||
letter-spacing:1px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.count-bot {
|
||||
display: flex;
|
||||
width: 180px;
|
||||
width: 190px;
|
||||
height: 95px;
|
||||
position: absolute;
|
||||
top: 227px;
|
||||
|
|
@ -89,24 +90,23 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
#count-num {
|
||||
width: 100%;
|
||||
height: 55px;
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
// font-family:Alibaba PuHuiTi;
|
||||
font-weight:600;
|
||||
color:#283444;
|
||||
font-size:24px;
|
||||
line-height: 30px;
|
||||
letter-spacing:2px;
|
||||
}
|
||||
.count-title {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
// font-family:Alibaba PuHuiTi;
|
||||
color:#445a7a;
|
||||
font-size:15px;
|
||||
line-height: 20px;
|
||||
letter-spacing:1px;
|
||||
}
|
||||
}
|
||||
|
|
@ -117,7 +117,7 @@
|
|||
height: 450px;
|
||||
}
|
||||
#blankBox {
|
||||
width: 200px;
|
||||
width: 150px;
|
||||
height: 450px;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,21 @@
|
|||
import fetch from './fetch';
|
||||
import { notification } from 'antd';
|
||||
|
||||
// 成果概览查询
|
||||
export async function getAchivChart() {
|
||||
let res = await fetch({
|
||||
url: '/api/',
|
||||
method: 'get'
|
||||
});
|
||||
if (res.message === 'success') {
|
||||
return res.data;
|
||||
} else {
|
||||
notification.open({
|
||||
message: "提示",
|
||||
description: res.message || '请求错误',
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 成果列表查询
|
||||
export async function getNoticeList(params) {
|
||||
|
|
|
|||
|
|
@ -12,10 +12,15 @@ export default (props) => {
|
|||
{item.achievementName || item.title} {item.new && <NewSvg color="#ffb300"/>}
|
||||
</div>
|
||||
<div className="list-other">
|
||||
{item.publisher && <p>发布单位：{item.publisher}</p>}
|
||||
<p>成果来源：{item.achievementSource || '未知'}</p>
|
||||
<p>发布单位：{item.publisher || '未知'}</p>
|
||||
<p>发布时间：{(item.publishDate && item.publishDate.split(' ')[0]) || (item.createTime && item.createTime.split(' ')[0])}</p>
|
||||
<p>下载量：{item.attachmentDownloadCount || '0'}</p>
|
||||
<p><i className="iconfont icon-dianjiliang mr5 font-12" />{item.visits || 0}</p>
|
||||
</div>
|
||||
<div className="list-text">
|
||||
<p>摘要：{item.text && item.text.substring(3, item.text.length-4)}</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
|
|
|
|||
|
|
@ -3,45 +3,69 @@
|
|||
padding: 17px 20px;
|
||||
background: #fff;
|
||||
border-bottom: 1px dashed #dedede;
|
||||
}
|
||||
.list-title {
|
||||
font-size: 1rem;
|
||||
color: #000;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
svg {
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
}
|
||||
.list-title:hover {
|
||||
color: #4154f1;
|
||||
}
|
||||
.list-title span {
|
||||
padding: 3px 5px;
|
||||
margin-left: 0.5em;
|
||||
background: #f8c753;
|
||||
font-size: 13px;
|
||||
color: #fff;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.list-other {
|
||||
margin-top: 0.5rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
& > p {
|
||||
display: inline-block;
|
||||
font-size: 0.875rem;
|
||||
color: #666;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
.list-title {
|
||||
font-size: 1rem;
|
||||
color: #000;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
svg {
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
}
|
||||
p:first-child{
|
||||
width: 50%;
|
||||
.list-title:hover {
|
||||
color: #4154f1;
|
||||
}
|
||||
p:nth-child(2){
|
||||
width: 40%;
|
||||
.list-title span {
|
||||
padding: 3px 5px;
|
||||
margin-left: 0.5em;
|
||||
background: #f8c753;
|
||||
font-size: 13px;
|
||||
color: #fff;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
.list-other {
|
||||
margin-top: 0.5rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
& > p {
|
||||
display: inline-block;
|
||||
font-size: 0.875rem;
|
||||
color: #666;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
p:first-child{
|
||||
width: 25%;
|
||||
}
|
||||
p:nth-child(2){
|
||||
width: 25%;
|
||||
}
|
||||
p:nth-child(3){
|
||||
width: 25%;
|
||||
}
|
||||
p:nth-child(4){
|
||||
width: 15%;
|
||||
}
|
||||
p:nth-child(5){
|
||||
width: 10%;
|
||||
}
|
||||
}
|
||||
|
||||
.list-text {
|
||||
p {
|
||||
width: 100%;
|
||||
// height: 56px;
|
||||
height: 30px;
|
||||
font-size: 0.875rem;
|
||||
color: #666;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -54,6 +54,7 @@
|
|||
}
|
||||
|
||||
.notice-center-content{
|
||||
width: 889px;
|
||||
padding:1.25rem;
|
||||
background: #fff;
|
||||
flex: auto;
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@
|
|||
align-items: center;
|
||||
height: 622px;
|
||||
position: relative;
|
||||
margin-top: -100px;
|
||||
.banner-img {
|
||||
width: 1200px;
|
||||
height: 572px;
|
||||
|
|
@ -16,7 +17,7 @@
|
|||
display: flex;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
bottom: 20px;
|
||||
.button {
|
||||
width: 50%;
|
||||
background:#f6f7fa;
|
||||
|
|
|
|||
Loading…
Reference in New Issue