zj_zlx
/
forgeplus-react
forked from Gitlink/forgeplus-react
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

专区-资讯详情-手机端适配

This commit is contained in:
caishi 2023-07-18 17:49:20 +08:00
parent 963a5e7186
commit 1f824c306b
19 changed files with 264 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
public/css/edu-all.css
View File

@ -7854,12 +7854,6 @@ a.singlepublishtwo {
.markdown-body {
text-align: justify;
word-break: break-all;
}
.RightPaneDrawer .ant-drawer-content {
background: #070f1a;
overflow: hidden !important;

4
public/css/edu-main.css
View File

@ -4200,10 +4200,6 @@ html>body #ajax-indicator {
color: #898989 !important;
}
.markdown-body {
text-align: justify;
word-break: break-all;
}
.RightPaneDrawer .ant-drawer-content {
background: #070f1a;

7
public/css/edu-purge.css
View File

@ -6635,13 +6635,6 @@ ul.count_ul li:not(:last-child):after {
}
.markdown-body {
text-align: justify;
word-break: break-all;
}
.RightPaneDrawer .ant-drawer-content {
background: #070f1a;
overflow: hidden !important;

2
public/index.html
View File

@ -55,7 +55,7 @@
<script src="%PUBLIC_URL%js/codemirror/merge/merge.js"></script>
<script src="%PUBLIC_URL%js/alex/moment.js"></script>
<script src="https://gw.alipayobjects.com/os/lib/alipay/alex/2.0.19/bundle/alex.all.global.min.js"></script>
<!-- <meta name="viewport" content="width=device-width, user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0"> -->
<meta name="viewport" content="">
<%= htmlWebpackPlugin.tags.bodyTags %>
<script>
var _hmt = _hmt || [];

15
src/common/UrlTool.js
View File

@ -19,6 +19,21 @@ export function getImageUrl(path) {
return `${path}`;
}
export function IsPC(){
var userAgentInfo = navigator.userAgent;
var Agents = ["Android", "iPhone",
"SymbianOS", "Windows Phone",
"iPad", "iPod"];
var flag = false;
for (var v = 0; v < Agents.length; v++) {
if (userAgentInfo.indexOf(Agents[v]) > 0) {
flag = true;
break;
}
}
return flag;
}
export function getImageUrlAbsolute(path) {
// https://www.educoder.net
// https://testbdweb.trustie.net

2
src/common/educoder.js
View File

@ -7,7 +7,7 @@ export {
getImageUrl as getImageUrl,getImageUrlAbsolute as getImageUrlAbsolute,getImage as getImage, getmyUrl as getmyUrl, getRandomNumber as getRandomNumber, getUrl as getUrl, getZoneUrl as getZoneUrl, publicSearchs as publicSearchs, getRandomcode as getRandomcode, getUrlmys as getUrlmys, getUrl2 as getUrl2, setImagesUrl as setImagesUrl
, getUploadActionUrl as getUploadActionUrl, getUploadActionUrltwo as getUploadActionUrltwo, getUploadActionUrlthree as getUploadActionUrlthree, getUploadActionUrlOfAuth as getUploadActionUrlOfAuth
, getTaskUrlById as getTaskUrlById, TEST_HOST, htmlEncode as htmlEncode, getupload_git_file as getupload_git_file, getcdnImageUrl as getcdnImageUrl,
turnbar,returnbar,setSeoMeta as setSeoMeta
turnbar,returnbar,setSeoMeta as setSeoMeta , IsPC as IsPC
} from './UrlTool';
export { setmiyah as setmiyah } from './Component';

34
src/forge/Information/Component/mobile/accessory.jsx Normal file
View File

@ -0,0 +1,34 @@
import React from 'react';
import './index.scss';
function acce({type}){
return(
type === "head" ?
<div className="head_zone">
<a href="/"><img src={require('../../img/logo.png')} alt=""/></a>
</div>
:
<div>
<div style={{height: "26em"}}></div>
<div className="foot_zone">
<p style={{fontSize:'1.6em',color:"#141519"}}>欢迎加入GitLink！</p>
<ul className="foot_ewm">
<li>
<img src={require('../../img/gitlink-gz.png')} alt="" />
<span>开源发展委员会<br/>公众号</span>
</li>
<li>
<img src={require('../../img/gitlink-qq.png')} alt="" />
<span>GitLink官方<br/>QQ群</span>
</li>
</ul>
<p className="foot_copyright">
<span>©Copyright 2023 CCF 开源发展委员会</span>
<span>Powered by Trustie& IntelliDE </span>
<span>京ICP备13000930号</span>
</p>
</div>
</div>
)
}
export default acce;

73
src/forge/Information/Component/mobile/index.scss Normal file
View File

@ -0,0 +1,73 @@
@media screen and (max-width: 750px){
#root{
width: 100%;
}
.newContainers{
min-width: unset;
}
}
.head_zone{
height: 4.4em;
background-color:#183553;
width: 100%;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
position: fixed;
top: 0px;
width: 100%;
z-index: 10;
img{
height: 2em;
}
}
.foot_zone{
background-image: url(../../img/f_banner.png);
background-size: 100% 100%;
height: 26em;
position: absolute;
bottom: 0px;
width: 100%;
left: 0px;
padding:1.6em 1.2em 0em 1.2em;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
.foot_ewm{
display: flex;
align-items: center;
justify-content: space-around;
width: 100%;
padding:1.2em;
li{
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
img{
width: 7em;
height: 7em;
margin-bottom: 0.8em;
}
span{
display: block;
color:#444549;
text-align: center;
line-height: 1.5em;
}
}
}
.foot_copyright{
padding:1em 0;
border-top: 1px solid rgba(129, 131, 138, 0.15);
color:#63687a;
font-size: 1em;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
width: 100%;
}
}

88
src/forge/Information/Pages/newsDetail.jsx
View File

@ -5,7 +5,11 @@ import RenderHtml from '../../../components/render-html';
import { Base64 } from 'js-base64';
import axios from 'axios';
import { getNewsDetail } from '../api';
import { IsPC } from 'educoder';
import { tempConfig } from '../tempInfo';
import Acce from '../Component/mobile/accessory';
function NewsDetail(props){
const { deptId , id } = props.match.params;
@ -13,7 +17,15 @@ function NewsDetail(props){
const [ cmsDir , setCmsDir ] = useState(undefined);
const [ content , setContent]=useState(undefined);
const [ isSpin , setIsSpin]=useState(false);
const temp = props.temp
const temp = props.temp;
const zonedetail = props.data;
console.log(zonedetail);
useEffect(()=>{
if(IsPC()){
document.querySelector('meta[name="viewport"]').setAttribute('content','width=device-width, user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0');
}
},[])
useEffect(()=>{
if(id){
@ -37,37 +49,55 @@ function NewsDetail(props){
})
}
return(
<div className="detail_news_all">
<Spin spinning={isSpin} size="large">
{
detail &&
<div style={{width:'1200px',margin:"0px auto",padding:"30px 0px"}}>
<Breadcrumb separator=">">
<Breadcrumb.Item href={`/zone/${deptId}/news`}>{tempConfig[temp].mainTitle}</Breadcrumb.Item>
{ cmsDir && <Breadcrumb.Item href={`/zone/${deptId}/news/${cmsDir.id}`}>{cmsDir.name}</Breadcrumb.Item> }
<Breadcrumb.Item>正文</Breadcrumb.Item>
</Breadcrumb>
<div className="info_text">
<div className="info_text_main">
<p className="i_name">{detail.name}</p>
<ul className="i_ul_value">
{ cmsDir && <li><a href={ detail.publishUserUrl } ><img src={ detail.publishUserImage } alt="" className="headimg" /> { detail.publishUserNickname }</a></li> }
{ cmsDir && <li>{ detail.isFirstPublish ? '创建于' : '更新于' }{detail.publishTime}</li> }
{ detail.visits && <li><img src={liulan} alt="" className="mr5" />{detail.visits}</li> }
</ul>
</div>
<Divider dashed={true} />
<React.Fragment>
{
IsPC() && <Acce type="head"/>
}
<div className={IsPC() ? "detail_news_phone" :"detail_news_all"}>
<Spin spinning={isSpin} size="large">
{
detail &&
<div className="d_news_box">
{
content ?
<RenderHtml className="informations_detail imageLayerParent" value={content} url={props.history.location} />
:
<span>暂无详情~</span>
IsPC() && zonedetail &&
<div className="p_title_box">
<p className="p_t_title"><a href={`/zone/${deptId}`}>{zonedetail.name}</a></p>
<p className="p_t_desc">{zonedetail.introductionContent}</p>
</div>
}
{
!IsPC() &&
<Breadcrumb separator=">">
<Breadcrumb.Item href={`/zone/${deptId}/news`}>{tempConfig[temp].mainTitle}</Breadcrumb.Item>
{ cmsDir && <Breadcrumb.Item href={`/zone/${deptId}/news/${cmsDir.id}`}>{cmsDir.name}</Breadcrumb.Item> }
<Breadcrumb.Item>正文</Breadcrumb.Item>
</Breadcrumb>
}
<div className="info_text">
<div className="info_text_main">
<p className="i_name">{detail.name}</p>
<ul className="i_ul_value">
{ cmsDir && <li><a href={ detail.publishUserUrl } ><img src={ detail.publishUserImage } alt="" className="headimg" /> { detail.publishUserNickname }</a></li> }
{ cmsDir && <li>{ detail.isFirstPublish ? '创建于' : '更新于' }{detail.publishTime}</li> }
{ detail.visits && <li><img src={liulan} alt="" className="mr5" />{detail.visits}</li> }
</ul>
</div>
{ !IsPC() && <Divider dashed={true} /> }
{
content ?
<RenderHtml className="informations_detail imageLayerParent" value={content} url={props.history.location} />
:
<span>暂无详情~</span>
}
</div>
</div>
</div>
}
</Spin>
</div>
}
</Spin>
</div>
{
IsPC() && <Acce type="foot" />
}
</React.Fragment>
)
}
export default NewsDetail;

BIN
src/forge/Information/img/f_banner.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 53 KiB

BIN
src/forge/Information/img/gitlink-gz.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.7 KiB

BIN
src/forge/Information/img/gitlink-qq.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.1 KiB

BIN
src/forge/Information/img/logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.6 KiB

BIN
src/forge/Information/img/p_banner.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

7
src/forge/Information/index.jsx
View File

@ -11,6 +11,7 @@ import Loading from "../../Loading";
import { getMainInfos , getCheckZoneRole } from './api';
import PublicBanner from "./Component/publicBanner";
import './index.scss';
import { IsPC } from 'educoder';
import "slick-carousel/slick/slick.css";
import "slick-carousel/slick/slick-theme.css";
import { tempEnum } from "./tempInfo";
@ -61,6 +62,8 @@ function Index(props){
const { deptId } = props.match.params;
const [ id , setId ] = useState(undefined);
const [ temp , setTemp ] = useState(tempEnum.zone);
const { pathname } = props.history.location;
const sourcedetail = pathname.indexOf(`/zone/${deptId}/newdetail/`)>-1 && IsPC();
useEffect(()=>{
if(deptId){
@ -109,7 +112,7 @@ function Index(props){
}
return(
<div className="information_main">
{ id ? <PublicBanner {...props} data={data} temp={ temp } adminUrl={adminUrl}/> : <div style={{ width: '100%', height: '450px' }}></div>}
{ !sourcedetail && (id ? <PublicBanner {...props} data={data} temp={ temp } adminUrl={adminUrl}/> : <div style={{ width: '100%', height: '450px' }}></div>)}
<Switch>
<Route
path="/zone/:deptId/news/:cateId"
@ -120,7 +123,7 @@ function Index(props){
<Route
path="/zone/:deptId/newdetail/:id"
render={(p) => (
<NewsDetail {...props} {...p} id={id} temp={ temp }/>
<NewsDetail {...props} {...p} id={id} temp={ temp } data={data}/>
)}
></Route>
<Route

61
src/forge/Information/index.scss
View File

@ -418,12 +418,73 @@
display: flex;
justify-content: center;
}
.detail_news_phone{
font-size: 62.5%;
padding:1.5em;
.markdown-body p{
font-size: 0.9em!important;
}
.p_title_box{
padding:2em 1.5em;
min-height: 15em;
background-image: url('./img/p_banner.png');
background-size: 100% 100%;
margin-bottom: 2em;
.p_t_title{
font-weight:600;
color:#141519;
font-size:2em;
height: 2em;
line-height: 2em;
margin-bottom: 1.5em!important;
text-align: center;
}
.p_t_desc{
color:#75767a;
font-size:1.6em;
letter-spacing:2px;
line-height: 2em;
}
}
.info_text{
padding:1.5em;
background-image:linear-gradient(180deg,#f8f9fd 0%,#f8f9fd 100%);
border:1px solid #ffffff;
box-sizing: border-box;
}
.info_text_main{
margin-bottom: 2em;
.i_name{
font-size: 2em;
}
.i_ul_value{
display: flex;
align-items: center;
margin-top: 1em;
font-size: 1.5em;
li{
margin-right: 1.5em;
}
.headimg{
width: 2em;
height: 2em;
border-radius: 50%;
margin-right: 0.2em;
}
}
}
}
.detail_news_all{
display: flex;
flex-direction: column;
align-items: center;
min-height: 600px;
justify-content: unset;
.d_news_box{
width:1200px;
margin:0px auto;
padding:30px 0px;
}
.ant-spin-spinning {
margin: auto;
}

6
src/forge/css/index.scss
View File

@ -228,6 +228,12 @@ form{
.normal{
width: 100%;
}
#root{
width: 1200px;
}
.newContainers{
min-width: 1200px;
}
}
.ver-middle{
vertical-align: middle;

4
src/index.css
View File

@ -51,6 +51,10 @@
list-style-type: none;
}
.markdown-body video{
max-width: 100%;
}
ol,
ul,
li {

7
src/modules/tpm/TPMIndexHOC.js
View File

@ -11,6 +11,7 @@ import SupplyPhoneModal from '../../forge/Component/ProfileModal/SupplyPhone';
import SystemNotice from '../../forge/Component/NoticeModal/SystemNotice';
import cookie from 'react-cookies';
import NpsModal from '../modals/npsModal';
import { IsPC } from 'educoder';
export function TPMIndexHOC(WrappedComponent) {
return class II extends React.Component {
@ -285,6 +286,8 @@ export function TPMIndexHOC(WrappedComponent) {
showCompeleteDialog:this.showCompeleteDialog,
showNpsModal: this.showNpsModal
};
let path =this.props.location.pathname;
let pathCheck = path.indexOf("/zone")>-1 && path.indexOf("/newdetail")>-1 && IsPC();
return (
<div className="indexHOC">
<SystemNotice
@ -307,7 +310,7 @@ export function TPMIndexHOC(WrappedComponent) {
{...this.state}
/> : ""}
{npsModalVisible && <NpsModal closeNpsModal={()=>{this.closeNpsModal()}} npsActionType={npsActionType} npsActionId={npsActionId}/>}
<Header {...this.state} {...this.props} {...common} publicNav={publicNav}></Header>
{ !pathCheck && <Header {...this.state} {...this.props} {...common} publicNav={publicNav}></Header> }
<Spin spinning={this.state.globalLoading} delay={0} className="globalSpin"
size="large" tip={this._gLoadingTip || "加载中..."}
>
@ -321,7 +324,7 @@ export function TPMIndexHOC(WrappedComponent) {
}
</div>
</Spin>
<NewFooter {...this.state} {...this.props} />
{!pathCheck && <NewFooter {...this.state} {...this.props} /> }
</div>
);
}