6.27 集成
This commit is contained in:
@ -1,8 +1,11 @@
|
||||
import React, { useEffect } from 'react';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import '../Style/ld_style.less';
|
||||
import { Input, List, Pagination } from 'antd';
|
||||
import list_pic from '@/assets/topic/listNewsPic01.jpg'
|
||||
import time_icon from '@/assets/topic/timeIcon.png'
|
||||
import { getGracefulList } from './service';
|
||||
import { getImageUrl } from '../utils';
|
||||
import { history } from 'umi';
|
||||
|
||||
const { Search } = Input;
|
||||
|
||||
@ -29,13 +32,43 @@ const data = [
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
|
||||
const PersonInfor: React.FC<{}> = () => {
|
||||
//graceful data
|
||||
const [gracefulList, setGracefulList] = useState<any[]>([]);
|
||||
//get graceful
|
||||
const getGracefulData = () => {
|
||||
getGracefulList().then(async res => {
|
||||
if (res?.code == 200) {
|
||||
const data = await getImageUrl(res?.data, 'image');
|
||||
setGracefulList(data);
|
||||
}
|
||||
})
|
||||
}
|
||||
//onclick
|
||||
const clickTitle = (data: any) => {
|
||||
sessionStorage.setItem("detailData", JSON.stringify(data));
|
||||
history.push("/partyMemberTopic/newsDetail");
|
||||
}
|
||||
//to home
|
||||
const toHome = () => {
|
||||
history.push("/partyMemberTopic/home");
|
||||
}
|
||||
//goback lastpage
|
||||
const toGoBack = () => {
|
||||
window.history.go(-1);
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getGracefulData();
|
||||
}, [])
|
||||
return (
|
||||
<div className="page-container">
|
||||
<div className="top-banner">
|
||||
<div className="back-home">
|
||||
<span>返回首页</span>
|
||||
<span>上一页</span>
|
||||
<span onClick={() => toHome()}>返回首页</span>
|
||||
<span onClick={() => toGoBack()}>上一页</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="search">
|
||||
@ -52,14 +85,20 @@ const PersonInfor: React.FC<{}> = () => {
|
||||
<div className="list-content">
|
||||
<List
|
||||
itemLayout="horizontal"
|
||||
dataSource={data}
|
||||
pagination={{
|
||||
onChange: page => {
|
||||
console.log(page);
|
||||
},
|
||||
pageSize: 2,
|
||||
}}
|
||||
dataSource={gracefulList}
|
||||
renderItem={item => (
|
||||
<List.Item>
|
||||
<div className="list-pic">
|
||||
<img src={list_pic} />
|
||||
<p className="tit">海南:党员突击队助力公司互联网化运营转型——海口联通资源普查的故事</p>
|
||||
<p className="detail">为了夯实基础管理,助力公司互联网化运营转型,海南联通海口市分公司开展号线资源地址普查专项行动。面对时间短、任务重、人手不足的情况,海口市分公司党员主动请缨,成立党员突击队,攻坚克难</p>
|
||||
<span className="time"><img src={time_icon} />2022-05-01</span>
|
||||
<img src={item.imageUrl} />
|
||||
<p className="tit" onClick={() => clickTitle(item)}>{item.title}</p>
|
||||
<p className="detail">{item.content}</p>
|
||||
<span className="time"><img src={time_icon} />{item.sendTime}</span>
|
||||
</div>
|
||||
</List.Item>
|
||||
)}
|
||||
|
@ -0,0 +1,6 @@
|
||||
import request from '@/utils/request';
|
||||
|
||||
//活动风采列表
|
||||
export async function getGracefulList() {
|
||||
return request('/api/biz-service-ebtp-extend/v1/eventpartybranch/eventStyle/list');
|
||||
}
|
34
src/pages/PartyMemberTopic/HardDetail/index.tsx
Normal file
34
src/pages/PartyMemberTopic/HardDetail/index.tsx
Normal file
@ -0,0 +1,34 @@
|
||||
import React, { useEffect } from 'react';
|
||||
import '../Style/detailStyle.less';
|
||||
import bannerProjectPic from '@/assets/topic/bannerProjectPic.jpg'
|
||||
import { history } from 'umi'
|
||||
|
||||
const HardDetail: React.FC<{}> = () => {
|
||||
//to home
|
||||
const toHome = () => {
|
||||
history.push("/partyMemberTopic/home");
|
||||
}
|
||||
return (
|
||||
<div className="hard-news-global">
|
||||
<div className="wrapBlock">
|
||||
<div className="bannerBlock">
|
||||
<img src={bannerProjectPic} alt="" />
|
||||
</div>
|
||||
<div className="backHomeBlock">
|
||||
<span onClick={() => toHome()}>返回首页</span>
|
||||
</div>
|
||||
<div className="contentBlock01">
|
||||
<h3>党员先锋示范队“攻坚克难”活动项目计划书</h3>
|
||||
<div className="informText01">
|
||||
<p>近期,中国联通牵头的 “新一代宽带无线移动通信网” 国家科技重大专项课题“面向工业制造的5G业务研发与试验”顺利通过工信部的结项验收。课题完成了5G网络和工业网络融合系统架构、工业场景5G网络应用指标、工业场景无线干扰和电磁兼容、工业边缘计算、融合互通、流量标识和拥塞控制等关键技术和解决方案研究,研制了面向工业设备的5G统一接入网关和CPE终端设备。</p>
|
||||
<p>课题组在中兴滨江智能制造工厂和北汽福田诸城超卡工厂搭建了5G工业互联网试验验证平台,通过了第三方测试,实现生产现场的部署应用。滨江智能制造工厂采用UPF下沉到园区的5G本地专网方案,实现了智能制造现场的单板远程维修指导、云化AGV、机器视觉检测、沉浸式远程生产监控等业务的稳定应用。福田诸城超卡工厂采用5G公网方案,通过对覆盖厂区的5G网络进行优化配置,解决了保障工业视觉检测系统的时延和可靠性要求。同时,该研究也为广域网中确定性服务能力的实现积累了经验。</p>
|
||||
<p>2021年,中国联通重磅推出CUBE-Net3.0网络创新体系研究,以打造新一代信息通信基础设施为己任,为产业互联网的发展提供高效确定的ICT融合服务。重大科技专项的研究内容作为CUBE-Net3.0体系下的重大创新工程之“面向确定性服务的定制网络研究项目”的重要组成部分,相关工作得到了未来网络党支部的大力支持。“面向确定性服务的定制网络研究项目”被列为支部的党建融合工程之一,部门负责人及支部委员密切关注课题进展,指导项目推进工作,党支部成员也积极建言献策,保障重大专项课题顺利完成结项验收。后续支部党建融合工程及项目团队将持续探索5G确定性网络关键技术,充分发挥5G高速率、低时延和大连接的能力,以打造高品质网络+业务一体化产品服务为导向,实现5G和工业应用的深度融合,助力行业用户提升生产效率,加快智能化转型步伐。</p>
|
||||
<p>值此中国共产党成立100周年之际,研究院未来网络党支部将继续秉承敬业、精益、专注、创新的工匠精神,以更加饱满的工作热情、更加敬业的工作态度、更加务实的工作作风投入到研究工作中,以实际行动推动我国制造业向智能化转型升级,推动制造业高质量发展。</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default HardDetail;
|
0
src/pages/PartyMemberTopic/HardDetail/service.ts
Normal file
0
src/pages/PartyMemberTopic/HardDetail/service.ts
Normal file
@ -123,6 +123,12 @@
|
||||
font-family: '黑体';
|
||||
font-size: 18px;
|
||||
color: #a2a2a2;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.left-card-other:hover {
|
||||
color: #369;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.left-card-otherimg {
|
||||
@ -177,7 +183,7 @@
|
||||
justify-content: left;
|
||||
|
||||
.left-project-content-list {
|
||||
margin-left: 70px;
|
||||
margin-left: 40px;
|
||||
|
||||
.left-project-content-item {
|
||||
font-size: 21px;
|
||||
@ -188,6 +194,11 @@
|
||||
color: #535353
|
||||
}
|
||||
|
||||
.left-project-content-item-title:hover {
|
||||
color: #369;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.left-project-content-item-time {
|
||||
color: #a2a2a2;
|
||||
margin-left: 8px;
|
||||
@ -217,6 +228,12 @@
|
||||
|
||||
.right-material {
|
||||
width: 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.right-material:hover {
|
||||
-webkit-filter: brightness(108%);
|
||||
filter: brightness(108%);
|
||||
}
|
||||
|
||||
.right-display {
|
||||
@ -249,7 +266,7 @@
|
||||
letter-spacing: 1px;
|
||||
|
||||
.right-display-content-percentage {
|
||||
margin-left: 24px;
|
||||
margin-left: 18px;
|
||||
|
||||
.right-display-content-percentage-increase {
|
||||
color: #28e099;
|
||||
@ -346,6 +363,12 @@
|
||||
font-family: '黑体';
|
||||
font-size: 18px;
|
||||
color: #a2a2a2;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.left-card-other:hover {
|
||||
color: #369;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.left-card-otherimg {
|
||||
@ -487,6 +510,7 @@
|
||||
border-radius: 8px;
|
||||
background: #d44026;
|
||||
margin-left: 8px;
|
||||
border-color: #d44026;
|
||||
}
|
||||
}
|
||||
}
|
@ -18,9 +18,7 @@ import topic_commodity from '@/assets/topic/topic_commodity.png'
|
||||
import topic_protocol from '@/assets/topic/topic_protocol.png'
|
||||
import topic_header_img from '@/assets/topic/topic_header_img.png'
|
||||
import { getHomeActivity, getHomeBanner, getHomeContact, getHomeGraceful, getHomeProject, getHomeRight, submitAdvice } from './service';
|
||||
import { getFilelist } from '@/services/download_';
|
||||
import { pictureDisplayPath } from '@/utils/DownloadUtils';
|
||||
import moment from 'moment';
|
||||
import { formatTime, getImageUrl } from '../utils';
|
||||
|
||||
const LeftCardTop = (props: any) => {
|
||||
return (
|
||||
@ -30,7 +28,7 @@ const LeftCardTop = (props: any) => {
|
||||
<span className='left-card-title'>{props.title}</span>
|
||||
<img src={topic_red_flag} className='left-card-flag' />
|
||||
</div>
|
||||
<div>
|
||||
<div onClick={() => window.open(props.url)}>
|
||||
<span className='left-card-other'>更多</span>
|
||||
<img src={topic_other} className='left-card-otherimg' />
|
||||
</div>
|
||||
@ -158,6 +156,10 @@ const CommentModal = (props: any) => {
|
||||
}
|
||||
|
||||
const onSubmit = async () => {
|
||||
if (textRef.current == '' || textRef.current == null) {
|
||||
message.info("请先输入意见内容");
|
||||
return;
|
||||
}
|
||||
setModalLoading(true);
|
||||
const params = {
|
||||
contactName: props.data?.contactName,
|
||||
@ -211,6 +213,7 @@ const CommentModal = (props: any) => {
|
||||
maxLength={200}
|
||||
defaultValue={''}
|
||||
onChange={onTextChange}
|
||||
placeholder="在这里输入我要提出的意见"
|
||||
/>
|
||||
<div className='bottom-modal-submit'>
|
||||
<span className='submit-text'>提交给{props.data?.contactDepartment}的{props.data?.contactName}</span>
|
||||
@ -244,22 +247,6 @@ const Home: React.FC<{}> = () => {
|
||||
//bottom advice modal data
|
||||
const [adviceItemData, setAdviceItemData] = useState<Object>({});
|
||||
|
||||
const getImageUrl = async (data: any[], paramName: string) => {
|
||||
for (const ite of data) {
|
||||
await getFilelist([ite[paramName]]).then(response => {//获取主图
|
||||
if (response?.success && response?.data?.length > 0) {
|
||||
const returnUrl = window.location.origin + pictureDisplayPath + '?filePath=' + response?.data[0].filePath;
|
||||
ite["imageUrl"] = returnUrl;
|
||||
}
|
||||
})
|
||||
}
|
||||
return data;
|
||||
}
|
||||
|
||||
const formatProjectTime = (time: string) => {
|
||||
return moment(time).format('MM-DD HH:mm');
|
||||
}
|
||||
|
||||
const openModal = (item: any) => {
|
||||
setAdviceItemData(item);
|
||||
setAdviceVisible(true);
|
||||
@ -340,6 +327,18 @@ const Home: React.FC<{}> = () => {
|
||||
})
|
||||
}
|
||||
|
||||
//to hard project
|
||||
const hardProjectClick = (data: any) => {
|
||||
sessionStorage.setItem("detailData", JSON.stringify(data));
|
||||
window.open("/partyMemberTopic/hardDetail");
|
||||
}
|
||||
|
||||
//to hard project
|
||||
const newsDetailClick = (data: any) => {
|
||||
sessionStorage.setItem("detailData", JSON.stringify(data));
|
||||
window.open("/partyMemberTopic/newsDetail");
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getBannerList();
|
||||
getGracefulList();
|
||||
@ -364,7 +363,7 @@ const Home: React.FC<{}> = () => {
|
||||
<div className='carousel-textbg'>
|
||||
<div className='carousel-text'>
|
||||
<span className='carousel-text-content'>{item.imageWord}</span>
|
||||
<span className='carousel-text-click'>⋙点击查看详情</span>
|
||||
<span className='carousel-text-click' onClick={() => newsDetailClick(item)}>⋙点击查看详情</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -396,12 +395,12 @@ const Home: React.FC<{}> = () => {
|
||||
</div>
|
||||
<div className='left-card'>
|
||||
<div className='left-graceful'>
|
||||
<LeftCardTop title="活动风采" />
|
||||
<LeftCardTop title="活动风采" url="/partyMemberTopic/activityStyle" />
|
||||
<div>
|
||||
<Row gutter={[20, 31]}>
|
||||
{gracefulList?.length > 0 && gracefulList.map((item, index) => (
|
||||
<Col span={8} key={index}>
|
||||
<div className='left-graceful-bg' style={{ backgroundImage: `url(${item.imageUrl})` }}>
|
||||
<div className='left-graceful-bg' style={{ backgroundImage: `url(${item.imageUrl})` }} onClick={() => newsDetailClick(item)}>
|
||||
<div className='left-graceful-textbg'>
|
||||
<span className='left-graceful-text'>{item.imageWord}</span>
|
||||
</div>
|
||||
@ -412,7 +411,7 @@ const Home: React.FC<{}> = () => {
|
||||
</div>
|
||||
</div>
|
||||
<div className='left-project'>
|
||||
<LeftCardTop title="攻坚克难项目" />
|
||||
<LeftCardTop title="攻坚克难项目" url="/partyMemberTopic/overDifficult" />
|
||||
<div className='left-project-content'>
|
||||
<img src={topic_project_picture} />
|
||||
<div className='left-project-content-list'>
|
||||
@ -423,8 +422,8 @@ const Home: React.FC<{}> = () => {
|
||||
renderItem={item => (
|
||||
<List.Item>
|
||||
<div className='left-project-content-item'>
|
||||
<span className='left-project-content-item-title'>{item.title}</span>
|
||||
<span className='left-project-content-item-time'>{formatProjectTime(item.createTime)}</span>
|
||||
<a onClick={() => hardProjectClick(item)} className='left-project-content-item-title'>{item.title}</a>
|
||||
<span className='left-project-content-item-time'>{formatTime(item.createTime, 'MM-DD HH:mm')}</span>
|
||||
</div>
|
||||
</List.Item>
|
||||
)}
|
||||
@ -437,7 +436,7 @@ const Home: React.FC<{}> = () => {
|
||||
</div>
|
||||
<div className='right-global'>
|
||||
<div>
|
||||
<img src={topic_right_material} className='right-material' />
|
||||
<img src={topic_right_material} className='right-material' onClick={() => window.open("/partyMemberTopic/partyBranch")} />
|
||||
</div>
|
||||
<div className='right-display'>
|
||||
<RightDisplayTitle title="党员及支部数量情况" />
|
||||
@ -469,14 +468,14 @@ const Home: React.FC<{}> = () => {
|
||||
</div>
|
||||
</div>
|
||||
<div className='bottom-global'>
|
||||
<LeftCardTop title="活动联系人" />
|
||||
<LeftCardTop title="活动联系人" url="" />
|
||||
{Object.entries(contactData).map(([name, value], index) => (
|
||||
<div key={index}>
|
||||
<div className='bottom-title'>{name}</div>
|
||||
<div className='bottom-content'>
|
||||
<Row gutter={[20, 20]}>
|
||||
{value.map((item: any) => (
|
||||
<BottomCardContent data={item} onClick={() => openModal(item)} />
|
||||
<BottomCardContent data={item} onClick={() => openModal(item)} key={item.id} />
|
||||
))}
|
||||
</Row>
|
||||
</div>
|
||||
|
@ -20,7 +20,7 @@ export async function getHomeProject() {
|
||||
return request('/api/biz-service-ebtp-extend/v1/eventpartybranch/eventSubject/list');
|
||||
}
|
||||
|
||||
//攻坚克难项目
|
||||
//右侧专业线数据
|
||||
export async function getHomeRight() {
|
||||
return request('/api/biz-service-ebtp-extend/v1/eventpartybranch/data/list');
|
||||
}
|
||||
|
38
src/pages/PartyMemberTopic/NewsDetail/index.tsx
Normal file
38
src/pages/PartyMemberTopic/NewsDetail/index.tsx
Normal file
@ -0,0 +1,38 @@
|
||||
import React, { useEffect } from 'react';
|
||||
import '../Style/detailStyle.less';
|
||||
import bannerPic from '@/assets/topic/bannerPic.jpg'
|
||||
import newsTempPic from '@/assets/topic/newsTempPic.jpg'
|
||||
import { formatTime, getDetailData } from '../utils';
|
||||
import { history } from 'umi';
|
||||
|
||||
const NewsDetail: React.FC<{}> = () => {
|
||||
const item = getDetailData();
|
||||
//to home
|
||||
const toHome = () => {
|
||||
history.push("/partyMemberTopic/home");
|
||||
}
|
||||
return (
|
||||
<div className="hard-news-global">
|
||||
<div className="wrapBlock">
|
||||
<div className="bannerBlock">
|
||||
<img src={bannerPic} alt="" />
|
||||
</div>
|
||||
<div className="backHomeBlock">
|
||||
<span onClick={() => toHome()}>返回首页</span>
|
||||
</div>
|
||||
<div className="contentBlock02">
|
||||
<h3>{item?.title}</h3>
|
||||
<span>{formatTime(item?.createTime, 'MM-DD HH:mm')}</span>
|
||||
<div className="informText02">
|
||||
<img src={item?.imageUrl} alt="" />
|
||||
<p>2月18日,中国联通召开 2022年党建暨党风廉政建设工作会议。本次会议以习近平新时代中国特色社会主义思想为指导,全面贯彻党的十九大和十九届历次全会精神,深入落实习近平总书记在十九届中央纪委六次全会上的重要讲话及全会精神,认真领会国资委党风廉政建设和反腐败工作会议暨警示教育大会精神,开展警示教育,总结2021年党建和党风廉政建设工作,部署2022年重点任务,坚持不懈把全面从严治党向纵深推进,为在新战略起跑之年实现高质量发展提供坚强政治保证。</p>
|
||||
<p>中国联通集团公司党组书记、董事长刘烈宏出席会议并讲话。党组副书记、总经理陈忠岳主持会议并传达十九届中央纪委六次全会、2022年全国组织部长会议、全国宣传部长会议及全国统战部长会议精神。党组副书记王俊治具体部署2022年党建工作。党组成员、纪检监察组组长董群专项安排2022年党风廉政建设和反腐败工作。与会人员集体观看警示教育片。</p>
|
||||
<p>刘烈宏指出,2021年是党和国家历史上具有里程碑意义的一年,也是中国联通厘定战略、开启新程的重要一年。过去的一年,中国联通各级党组织在以习近平同志为核心的党中央坚强领导下,认真贯彻新时代党的建设总要求,不断加强党的全面领导,突出抓好党的政治建设,积极弘扬伟大建党精神,持之以恒正风肃纪反腐,纵深推进全面从严治党,党建和党风廉政建设全面加强,多项工作得到上级部委的充分肯定。切实做到了坚持以党的政治建设为统领,牢牢把握了企业改革发展的政治方向;强化党的创新理论武装,进一步筑牢了信仰之基、补足精神之钙、把稳思想之舵;筑牢基层党组织建设根基,为高质量发展保驾护航、蓄势赋能;打造高素质专业化干部人才队伍,锻造了一支敢打硬仗、善打胜仗的联通铁军;党风廉政建设和反腐败持续深入,涵养了风清气正的良好政治生态。</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default NewsDetail;
|
0
src/pages/PartyMemberTopic/NewsDetail/service.ts
Normal file
0
src/pages/PartyMemberTopic/NewsDetail/service.ts
Normal file
@ -1,6 +1,9 @@
|
||||
import React, { useEffect } from 'react';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import '../Style/ld_style.less';
|
||||
import { Input, List, Pagination } from 'antd';
|
||||
import { getProjectList } from './service';
|
||||
import { formatTime } from '../utils';
|
||||
import { history } from 'umi';
|
||||
|
||||
const { Search } = Input;
|
||||
|
||||
@ -43,12 +46,42 @@ const data = [
|
||||
];
|
||||
|
||||
const PersonInfor: React.FC<{}> = () => {
|
||||
//project data
|
||||
const [projectList, setProjectList] = useState<any[]>([]);
|
||||
|
||||
//get project
|
||||
const getProjectData = () => {
|
||||
getProjectList().then(res => {
|
||||
if (res?.code == 200) {
|
||||
setProjectList(res?.data);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//onclick
|
||||
const clickTitle = (data: any) => {
|
||||
sessionStorage.setItem("detailData", JSON.stringify(data));
|
||||
history.push("/partyMemberTopic/hardDetail");
|
||||
}
|
||||
//to home
|
||||
const toHome = () => {
|
||||
history.push("/partyMemberTopic/home");
|
||||
}
|
||||
//goback lastpage
|
||||
const toGoBack = () => {
|
||||
window.history.go(-1);
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getProjectData();
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<div className="page-container">
|
||||
<div className="top-banner">
|
||||
<div className="back-home">
|
||||
<span>返回首页</span>
|
||||
<span>上一页</span>
|
||||
<span onClick={() => toHome()}>返回首页</span>
|
||||
<span onClick={() => toGoBack()}>上一页</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="search">
|
||||
@ -65,12 +98,18 @@ const PersonInfor: React.FC<{}> = () => {
|
||||
<div className="list-content">
|
||||
<List
|
||||
itemLayout="horizontal"
|
||||
dataSource={data}
|
||||
pagination={{
|
||||
onChange: page => {
|
||||
console.log(page);
|
||||
},
|
||||
pageSize: 2,
|
||||
}}
|
||||
dataSource={projectList}
|
||||
renderItem={item => (
|
||||
<List.Item>
|
||||
<div className="list-box">
|
||||
<p>党员先锋示范队“攻坚克难”活动项目计划书</p>
|
||||
<span>2022-04-03</span>
|
||||
<p onClick={() => clickTitle(item)}>{item.title}</p>
|
||||
<span>{formatTime(item.createTime, 'YYYY-MM-DD')}</span>
|
||||
</div>
|
||||
</List.Item>
|
||||
)}
|
||||
|
@ -0,0 +1,6 @@
|
||||
import request from '@/utils/request';
|
||||
|
||||
//攻坚克难项目
|
||||
export async function getProjectList() {
|
||||
return request('/api/biz-service-ebtp-extend/v1/eventpartybranch/eventSubject/list');
|
||||
}
|
@ -1,6 +1,8 @@
|
||||
import React, { useEffect } from 'react';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import '../Style/ld_style.less';
|
||||
import { Input, List } from 'antd';
|
||||
import { history } from 'umi'
|
||||
import { getBranchList, getMemberAndBranch } from './service';
|
||||
|
||||
const { Search } = Input;
|
||||
|
||||
@ -71,12 +73,51 @@ const data = [
|
||||
},
|
||||
];
|
||||
|
||||
|
||||
|
||||
const PartyBranch: React.FC<{}> = () => {
|
||||
//member number and branch number
|
||||
const [memberNumber, setMemberNumber] = useState<any>({});
|
||||
//branch list
|
||||
const [branchData, setBranchData] = useState<any[]>([]);
|
||||
//get member and branch
|
||||
const getMemberNumber = () => {
|
||||
getMemberAndBranch().then(res => {
|
||||
if (res?.code == 200) {
|
||||
setMemberNumber(res?.data);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//get member and branch
|
||||
const getBranchData = () => {
|
||||
getBranchList().then(res => {
|
||||
if (res?.code == 200) {
|
||||
setBranchData(res?.data);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//onclick
|
||||
const clickCard = (data: any) => {
|
||||
sessionStorage.setItem("detailData", JSON.stringify(data));
|
||||
history.push("/partyMemberTopic/personInfor");
|
||||
}
|
||||
|
||||
//to home
|
||||
const toHome = () => {
|
||||
history.push("/partyMemberTopic/home");
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getMemberNumber();
|
||||
getBranchData();
|
||||
}, [])
|
||||
return (
|
||||
<div className="page-container">
|
||||
<div className="top-banner">
|
||||
<div className="back-home">
|
||||
<span>返回首页</span>
|
||||
<span onClick={() => toHome()}>返回首页</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="search">
|
||||
@ -91,21 +132,21 @@ const PartyBranch: React.FC<{}> = () => {
|
||||
</div>
|
||||
</div>
|
||||
<div className="static-box">
|
||||
<div className="person-num">党员数量<span>3451</span>人</div>
|
||||
<div className="party-num">党支部数量<span>51</span>个</div>
|
||||
<div className="person-num">党员数量<span>{memberNumber?.member}</span>人</div>
|
||||
<div className="party-num">党支部数量<span>{memberNumber?.branch}</span>个</div>
|
||||
</div>
|
||||
<div className="mess-box">
|
||||
<List
|
||||
grid={{ gutter: 16, column: 4 }}
|
||||
dataSource={data}
|
||||
renderItem={item => (
|
||||
dataSource={branchData}
|
||||
renderItem={(item: any) => (
|
||||
<List.Item>
|
||||
<div className="wrapper">
|
||||
<div className="pic-bg">{item.title}</div>
|
||||
<div className="wrapper" onClick={() => clickCard(item)}>
|
||||
<div className="pic-bg">{item.branchName}</div>
|
||||
<div className="mess">
|
||||
<div className="mess-left">党员数量</div>
|
||||
<div className="mess-right">
|
||||
<span>{item.num}</span>人
|
||||
<span>{item.count}</span>人
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -0,0 +1,11 @@
|
||||
import request from '@/utils/request';
|
||||
|
||||
//获取党员数量,党支部数量
|
||||
export async function getMemberAndBranch() {
|
||||
return request('/api/biz-service-ebtp-extend/v1/eventpartybranch/partyBranchMember/count');
|
||||
}
|
||||
|
||||
//获取党支部列表
|
||||
export async function getBranchList() {
|
||||
return request('/api/biz-service-ebtp-extend/v1/eventpartybranch/partyBranch/list');
|
||||
}
|
@ -1,6 +1,9 @@
|
||||
import React, { useEffect } from 'react';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import '../Style/ld_style.less';
|
||||
import { Input, List } from 'antd';
|
||||
import { getMemberList } from './service';
|
||||
import { getDetailData } from '../utils';
|
||||
import { history } from 'umi';
|
||||
|
||||
const { Search } = Input;
|
||||
|
||||
@ -43,12 +46,36 @@ const data = [
|
||||
];
|
||||
|
||||
const PersonInfor: React.FC<{}> = () => {
|
||||
//member list
|
||||
const [memberData, setMemberData] = useState<any[]>([]);
|
||||
|
||||
//get session
|
||||
const item = getDetailData();
|
||||
//get member list
|
||||
const getMemberData = () => {
|
||||
getMemberList({ belongBranch: 4 }).then(res => {
|
||||
if (res?.code == 200) {
|
||||
setMemberData(res?.data);
|
||||
}
|
||||
})
|
||||
}
|
||||
//to home
|
||||
const toHome = () => {
|
||||
history.push("/partyMemberTopic/home");
|
||||
}
|
||||
//goback lastpage
|
||||
const toGoBack = () => {
|
||||
window.history.go(-1);
|
||||
}
|
||||
useEffect(() => {
|
||||
getMemberData();
|
||||
}, [])
|
||||
return (
|
||||
<div className="page-container">
|
||||
<div className="top-banner">
|
||||
<div className="back-home">
|
||||
<span>返回首页</span>
|
||||
<span>上一页</span>
|
||||
<span onClick={() => toHome()}>返回首页</span>
|
||||
<span onClick={() => toGoBack()}>上一页</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="search">
|
||||
@ -65,19 +92,19 @@ const PersonInfor: React.FC<{}> = () => {
|
||||
<div className="mess-box mess-detail">
|
||||
<List
|
||||
grid={{ gutter: 16, column: 4 }}
|
||||
dataSource={data}
|
||||
dataSource={memberData}
|
||||
renderItem={item => (
|
||||
<List.Item>
|
||||
<div className="wrapper">
|
||||
<div className="top-bg">
|
||||
<div className="tit">{item.title}</div>
|
||||
<div className="text-r">{item.name}</div>
|
||||
<div className="text-r yellow">{item.position}</div>
|
||||
<div className="tit">{item.branchName}</div>
|
||||
<div className="text-r">{item.contactName}</div>
|
||||
<div className="text-r yellow">{item.contactUnit}</div>
|
||||
</div>
|
||||
<div className="mess">
|
||||
<div>部门:某某部</div>
|
||||
<div>邮箱:12345@chinaunicom.cn</div>
|
||||
<div>电话:12345678</div>
|
||||
<div>部门:{item.contactUnit}</div>
|
||||
<div>邮箱:{item.contactEmail}</div>
|
||||
<div>电话:{item.contactMobiphone}</div>
|
||||
</div>
|
||||
</div>
|
||||
</List.Item>
|
||||
|
@ -0,0 +1,9 @@
|
||||
import request from '@/utils/request';
|
||||
|
||||
//党员列表
|
||||
export async function getMemberList(params: any) {
|
||||
return request('/api/biz-service-ebtp-extend/v1/eventpartybranch/partyMember/list', {
|
||||
method: 'GET',
|
||||
params: params
|
||||
});
|
||||
}
|
114
src/pages/PartyMemberTopic/Style/detailStyle.less
Normal file
114
src/pages/PartyMemberTopic/Style/detailStyle.less
Normal file
@ -0,0 +1,114 @@
|
||||
.hard-news-global {
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
text-decoration: none;
|
||||
border: none;
|
||||
|
||||
.wrapBlock {
|
||||
margin: 0 auto;
|
||||
width: 1460px;
|
||||
overflow: hidden;
|
||||
|
||||
.bannerBlock {
|
||||
width: 100%;
|
||||
height: 473px;
|
||||
}
|
||||
|
||||
.backHomeBlock {
|
||||
padding-left: 5%;
|
||||
width: 95%;
|
||||
height: 49px;
|
||||
line-height: 49px;
|
||||
color: #fff;
|
||||
background: #fd0100;
|
||||
font-size: 22px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.backHomeBlock span {
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.backHomeBlock span:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.contentBlock01 {
|
||||
padding-bottom: 50px;
|
||||
width: 100%;
|
||||
background: #f1f1f1;
|
||||
}
|
||||
|
||||
.contentBlock01 h3 {
|
||||
padding: 30px 5px;
|
||||
font-size: 30px;
|
||||
line-height: 1.5;
|
||||
color: #888;
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.contentBlock01 .informText01 {
|
||||
margin: 0 2%;
|
||||
padding: 10px 0;
|
||||
width: 96%;
|
||||
background: #fff;
|
||||
font-size: 22px;
|
||||
color: #888;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.contentBlock01 .informText01 p {
|
||||
padding: 20px;
|
||||
text-indent: 45px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.contentBlock02 {
|
||||
padding-bottom: 50px;
|
||||
width: 100%;
|
||||
background: url("~@/assets/topic/newsDetailBg.jpg") center bottom no-repeat #a81b0b;
|
||||
}
|
||||
|
||||
.contentBlock02 h3 {
|
||||
padding: 30px 5px;
|
||||
font-size: 30px;
|
||||
line-height: 1.5;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.contentBlock02 span {
|
||||
display: block;
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.contentBlock02 .informText02 {
|
||||
margin: 0 5%;
|
||||
padding: 10px 0;
|
||||
width: 90%;
|
||||
font-size: 22px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.contentBlock02 .informText02 img {
|
||||
display: inherit;
|
||||
margin: 10px auto;
|
||||
}
|
||||
|
||||
.contentBlock02 .informText02 p {
|
||||
padding: 20px;
|
||||
text-indent: 45px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
}
|
||||
}
|
@ -1,15 +1,17 @@
|
||||
@import '~antd/es/style/themes/default.less';
|
||||
|
||||
.page-container{
|
||||
.page-container {
|
||||
width: 1460px;
|
||||
margin: 0 auto;
|
||||
.top-banner{
|
||||
|
||||
.top-banner {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 318px;
|
||||
background: url("../../../assets/topic/bannerListPic.jpg") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
.back-home{
|
||||
|
||||
.back-home {
|
||||
height: 50px;
|
||||
background: #fd0100;
|
||||
color: #fff;
|
||||
@ -17,7 +19,8 @@
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
span{
|
||||
|
||||
span {
|
||||
line-height: 46px;
|
||||
font-size: 24px;
|
||||
font-weight: 600;
|
||||
@ -27,64 +30,83 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
.search{
|
||||
|
||||
.search {
|
||||
height: 68px;
|
||||
line-height: 64px;
|
||||
overflow: hidden;
|
||||
.text{
|
||||
|
||||
.text {
|
||||
font-size: 20px;
|
||||
color: #0e0e0e;
|
||||
span{
|
||||
color: #0e0e0e;
|
||||
|
||||
span {
|
||||
color: #ff3838;
|
||||
}
|
||||
}
|
||||
.search-box{
|
||||
|
||||
.search-box {
|
||||
float: right;
|
||||
margin-top: 18px;
|
||||
.ant-btn-primary{
|
||||
|
||||
.ant-btn-primary {
|
||||
background-color: #fd0100;
|
||||
border-color: #fd0100;
|
||||
}
|
||||
}
|
||||
}
|
||||
.static-box{
|
||||
|
||||
.static-box {
|
||||
position: relative;
|
||||
height: 145px;
|
||||
background: url("../../../assets/topic/static-bg.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
div{
|
||||
|
||||
div {
|
||||
font-size: 24px;
|
||||
color: #fff;
|
||||
span{
|
||||
|
||||
span {
|
||||
font-size: 60px;
|
||||
vertical-align: -13px;
|
||||
margin: 0 8px;
|
||||
}
|
||||
}
|
||||
.person-num{
|
||||
|
||||
.person-num {
|
||||
position: absolute;
|
||||
right: 360px;
|
||||
top: 24px;
|
||||
}
|
||||
.party-num{
|
||||
|
||||
.party-num {
|
||||
position: absolute;
|
||||
right: 80px;
|
||||
top: 24px;
|
||||
}
|
||||
}
|
||||
.mess-box{
|
||||
.ant-row{
|
||||
|
||||
.mess-box {
|
||||
.ant-row {
|
||||
margin-left: -20px !important;
|
||||
margin-right: -20px !important;
|
||||
}
|
||||
.ant-col{
|
||||
|
||||
.ant-col {
|
||||
margin-top: 34px;
|
||||
padding: 0 20px !important;
|
||||
}
|
||||
.wrapper{
|
||||
// border: 1px solid #aaa;
|
||||
|
||||
.wrapper {
|
||||
cursor: pointer;
|
||||
}
|
||||
.pic-bg{
|
||||
|
||||
.wrapper:hover {
|
||||
-webkit-filter: brightness(108%);
|
||||
filter: brightness(108%);
|
||||
}
|
||||
|
||||
.pic-bg {
|
||||
height: 80px;
|
||||
background: url("../../../assets/topic/card-bg.png") no-repeat;
|
||||
background-size: cover;
|
||||
@ -94,11 +116,13 @@
|
||||
text-align: center;
|
||||
line-height: 76px;
|
||||
}
|
||||
.mess{
|
||||
|
||||
.mess {
|
||||
border: 1px solid #aaaaaa;
|
||||
border-top: 0;
|
||||
}
|
||||
.mess-left{
|
||||
|
||||
.mess-left {
|
||||
display: inline-block;
|
||||
width: 50%;
|
||||
background: url("../../../assets/topic/person.png") no-repeat 30px 10px;
|
||||
@ -108,71 +132,86 @@
|
||||
font-weight: 600;
|
||||
color: #302f2f;
|
||||
}
|
||||
.mess-right{
|
||||
|
||||
.mess-right {
|
||||
display: inline-block;
|
||||
width: 50%;
|
||||
color: #959595;
|
||||
font-size: 24px;
|
||||
span{
|
||||
|
||||
span {
|
||||
color: #ffb119;
|
||||
font-size: 70px;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
}
|
||||
.mess-detail{
|
||||
.ant-row{
|
||||
|
||||
.mess-detail {
|
||||
.ant-row {
|
||||
width: 100%;
|
||||
margin: 0 !important;
|
||||
}
|
||||
.ant-col{
|
||||
|
||||
.ant-col {
|
||||
margin-top: 0;
|
||||
margin-bottom: 34px;
|
||||
}
|
||||
.top-bg{
|
||||
|
||||
.top-bg {
|
||||
background: url("../../../assets/topic/person-bg.jpg") no-repeat;
|
||||
background-size: cover;
|
||||
height: 88px;
|
||||
.tit{
|
||||
|
||||
.tit {
|
||||
padding: 8px 0 0 15px;
|
||||
font-size: 16px;
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.text-r{
|
||||
|
||||
.text-r {
|
||||
text-align: right;
|
||||
padding-right: 10px;
|
||||
color: #fff;
|
||||
font-size: 18px;
|
||||
}
|
||||
.yellow{
|
||||
|
||||
.yellow {
|
||||
color: #ffd03f;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
.mess{
|
||||
|
||||
.mess {
|
||||
color: #959595;
|
||||
font-size: 14px;
|
||||
padding: 30px 0 30px 15px;
|
||||
}
|
||||
}
|
||||
.list-content{
|
||||
|
||||
.list-content {
|
||||
margin-top: 10px;
|
||||
.list-box{
|
||||
|
||||
.list-box {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
color: #333;
|
||||
font-size: 16px;
|
||||
span{
|
||||
|
||||
span {
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
top: 0;
|
||||
}
|
||||
p{
|
||||
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
padding-left: 30px;
|
||||
cursor: pointer;
|
||||
}
|
||||
p::before{
|
||||
|
||||
p::before {
|
||||
content: "";
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
@ -182,40 +221,53 @@
|
||||
top: 8px;
|
||||
left: 10px;
|
||||
}
|
||||
|
||||
p:hover {
|
||||
color: #369;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
.ant-list-split .ant-list-item{
|
||||
|
||||
.ant-list-split .ant-list-item {
|
||||
border-bottom: 0 !important;
|
||||
}
|
||||
.list-pic{
|
||||
|
||||
.list-pic {
|
||||
margin-top: 0;
|
||||
width: 100%;
|
||||
height: 110px;
|
||||
position: relative;
|
||||
img{
|
||||
|
||||
img {
|
||||
width: 182px;
|
||||
height: 110px;
|
||||
float: left;
|
||||
}
|
||||
p{
|
||||
|
||||
p {
|
||||
padding-left: 206px;
|
||||
}
|
||||
.tit{
|
||||
|
||||
.tit {
|
||||
font-size: 18px;
|
||||
color: #333;
|
||||
font-weight: 600;
|
||||
}
|
||||
.detail{
|
||||
|
||||
.detail {
|
||||
text-indent: 2em;
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
}
|
||||
.time{
|
||||
|
||||
.time {
|
||||
position: absolute;
|
||||
right: 4px;
|
||||
bottom: 0;
|
||||
color: #666;
|
||||
font-size: 16px;
|
||||
img{
|
||||
|
||||
img {
|
||||
position: absolute;
|
||||
bottom: 3px;
|
||||
right: 80px;
|
||||
@ -226,12 +278,14 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
.ant-pagination{
|
||||
|
||||
.ant-pagination {
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
.ant-pagination-item-active{
|
||||
|
||||
.ant-pagination-item-active {
|
||||
background: #fd0100;
|
||||
}
|
||||
}
|
37
src/pages/PartyMemberTopic/utils.ts
Normal file
37
src/pages/PartyMemberTopic/utils.ts
Normal file
@ -0,0 +1,37 @@
|
||||
import { getFilelist } from "@/services/download_";
|
||||
import { pictureDisplayPath } from "@/utils/DownloadUtils";
|
||||
import moment from "moment";
|
||||
/**
|
||||
* 传入list数据,插入图片展示路径 imageUrl
|
||||
* @param data 数组
|
||||
* @param paramName 字段名
|
||||
* @returns
|
||||
*/
|
||||
export const getImageUrl = async (data: any[], paramName: string) => {
|
||||
for (const ite of data) {
|
||||
await getFilelist([ite[paramName]]).then(response => {//获取主图
|
||||
if (response?.success && response?.data?.length > 0) {
|
||||
const returnUrl = window.location.origin + pictureDisplayPath + '?filePath=' + response?.data[0].filePath;
|
||||
ite["imageUrl"] = returnUrl;
|
||||
}
|
||||
})
|
||||
}
|
||||
return data;
|
||||
}
|
||||
/**
|
||||
* 时间格式化
|
||||
* @param time 时间(字符串)
|
||||
* @param format 格式
|
||||
* @returns
|
||||
*/
|
||||
export const formatTime = (time: string, format: string) => {
|
||||
return moment(time).format(format);
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取详情数据
|
||||
* @returns
|
||||
*/
|
||||
export const getDetailData = () => {
|
||||
return JSON.parse(sessionStorage.getItem('detailData') as any);
|
||||
}
|
Reference in New Issue
Block a user