Commit 7f2a7fad by yanglang123

修改

parent aa468004
import './index.css'; import './index.css';
import $ from 'jquery'; import $ from 'jquery';
export default class VideoPlayer export default class VideoPlayer {
{ constructor(props) {
constructor(props) { this.player;
this.player; this.props = props;
this.props = props; this._setup();
this._setup(); this._bindEvent();
this._bindEvent(); this._firstFullscreen = true;
this._firstFullscreen = true; }
}
loadByUrl(url) {
loadByUrl(url) if (this.player)
{ this.player.loadByUrl(url);
if(this.player) }
this.player.loadByUrl(url);
} dispose() {
if (this.player) {
dispose() this.player.dispose();
{ Zepto('#' + this.props.id).empty();
if(this.player) }
{ }
this.player.dispose();
Zepto('#'+this.props.id).empty(); _setup() {
} this.player = new Aliplayer(this.props);
} }
_setup() _bindEvent() {
{ let that = this;
this.player = new Aliplayer(this.props); this.player.on('ready', (e) => {
}
_bindEvent()
{
let that = this;
this.player.on('ready', (e)=>{
console.log('ready'); console.log('ready');
that.props.videoStart(); that.props.videoStart();
}); });
this.player.on('play',(e)=>{ this.player.on('play', (e) => {
console.log('play'); console.log('play');
}); });
this.player.on('ended',(e)=>{ this.player.on('ended', (e) => {
console.log('ended'); console.log('ended');
that.props.videoComplete(); that.props.videoComplete();
}); });
this.player.on('pause',(e)=>{ this.player.on('pause', (e) => {
console.log('pause'); console.log('pause');
});
this.player.on('requestFullScreen', (e)=>{
let video=$(that.player.tag);
video.addClass('center');
if((/iPhone|iPad|iPod/i).test(navigator.userAgent))
{
$(that.player.el()).removeClass('prism-fullscreen');
}
}); });
this.player.on('x5cancelFullScreen',(e)=>{ this.player.on('requestFullScreen', (e) => {
let service = that.player.fullscreenService; let video = $(that.player.tag);
if(service.getIsFullScreen()) video.addClass('center');
{ if ((/iPhone|iPad|iPod/i).test(navigator.userAgent)) {
service.cancelFullScreen() $(that.player.el()).removeClass('prism-fullscreen');
} }
});
this.player.on('x5cancelFullScreen', (e) => {
let service = that.player.fullscreenService;
if (service.getIsFullScreen()) {
service.cancelFullScreen()
}
$(that.player.el()).removeClass('enter-x5-player'); $(that.player.el()).removeClass('enter-x5-player');
var layout = that.player.originalLayout; var layout = that.player.originalLayout;
if(layout) if (layout) {
{
that.player.tag.style.height = layout.video.height; that.player.tag.style.height = layout.video.height;
}h } h
}); });
this.player.on('x5requestFullScreen',(e)=>{ this.player.on('x5requestFullScreen', (e) => {
//调整视频的位置 //调整视频的位置
$(that.player.el()).addClass('enter-x5-player'); $(that.player.el()).addClass('enter-x5-player');
var screenHeight = document.body.clientHeight*(window.devicePixelRatio||1)+ "px"; var screenHeight = document.body.clientHeight * (window.devicePixelRatio || 1) + "px";
that.player.tag.style.height = screenHeight; that.player.tag.style.height = screenHeight;
let video=$(that.player.tag); let video = $(that.player.tag);
setTimeout(()=>{ setTimeout(() => {
video.removeClass('x5-top-left'); video.removeClass('x5-top-left');
}); });
}); });
this.player.on('cancelFullScreen', (e)=>{ this.player.on('cancelFullScreen', (e) => {
let video=$(that.player.tag); let video = $(that.player.tag);
setTimeout(()=>{ setTimeout(() => {
video.removeClass('center'); video.removeClass('center');
video.removeClass('x5-top-left'); video.removeClass('x5-top-left');
}) })
}); });
//微信左上角退出按钮触发是,关闭页面 //微信左上角退出按钮触发是,关闭页面
this.player.tag.addEventListener("x5videoexitfullscreen", ()=>{ this.player.tag.addEventListener("x5videoexitfullscreen", () => {
if(WeixinJSBridge) if (WeixinJSBridge)
WeixinJSBridge.call('closeWindow'); WeixinJSBridge.call('closeWindow');
else else {
{ try {
try
{
window.location.refresh(); window.location.refresh();
}catch(e) } catch (e) { }
{}
} }
}); });
$(document).on('WeixinJSBridgeReady',()=>{ $(document).on('WeixinJSBridgeReady', () => {
let video=$(that.player.el()).find('video')[0]; let video = $(that.player.el()).find('video')[0];
video.play(); video.play();
}); });
} }
_unbindEvent() _unbindEvent() {
{ let that = this;
let that = this; this.player.off('ready', function (e) {
this.player.off('ready',function (e) { // 解决ios不自动播放的问题
// 解决ios不自动播放的问题 if ($.os.ios)
if($.os.ios) that._autoPlay();
that._autoPlay(); console.log('ready');
console.log('ready');
}); });
this.player.off('play',function (e) { this.player.off('play', function (e) {
console.log('play'); console.log('play');
}); });
this.player.off('ended',function (e) { this.player.off('ended', function (e) {
console.log('ended'); console.log('ended');
}); });
this.player.off('pause',function (e) { this.player.off('pause', function (e) {
console.log('pause'); console.log('pause');
}); });
} }
} }
\ No newline at end of file
...@@ -43,7 +43,6 @@ class App extends React.Component { ...@@ -43,7 +43,6 @@ class App extends React.Component {
//底部tab配置信息获取 //底部tab配置信息获取
tabInfo: [], tabInfo: [],
showTab: 0, showTab: 0,
isHomeSite: true,
initSite: "", initSite: "",
canVisit: true, canVisit: true,
}; };
...@@ -87,8 +86,8 @@ class App extends React.Component { ...@@ -87,8 +86,8 @@ class App extends React.Component {
componentWillMount() { componentWillMount() {
console.log("diyici"); console.log("diyici");
if (navigator.appVersion.indexOf("iPhone") != -1) { if (navigator.userAgent.indexOf("iPhone") != -1) {
//this.iosTouch(); this.iosTouch();
} }
let tab = location.hash.split("/")[location.hash.split("/").length - 1]; let tab = location.hash.split("/")[location.hash.split("/").length - 1];
...@@ -168,7 +167,6 @@ class App extends React.Component { ...@@ -168,7 +167,6 @@ class App extends React.Component {
let currentSite = tempParam[1] + "/" + tempParam[2]; let currentSite = tempParam[1] + "/" + tempParam[2];
if (currentSite != res.data) { if (currentSite != res.data) {
this.setState({ this.setState({
isHomeSite: false,
initSite: window.location.origin + "/#/" + res.data + "/", initSite: window.location.origin + "/#/" + res.data + "/",
}); });
} }
...@@ -378,19 +376,6 @@ class App extends React.Component { ...@@ -378,19 +376,6 @@ class App extends React.Component {
return tabResult; return tabResult;
} }
}; };
//bug 13650 zj
goHomeSite = () => {
this.setState(
{
isHomeSite: true,
},
() => {
window.location.href = this.state.initSite;
}
);
};
render() { render() {
if (this.props.signResult) { if (this.props.signResult) {
if (!this.state.wxconfig) { if (!this.state.wxconfig) {
...@@ -405,6 +390,7 @@ class App extends React.Component { ...@@ -405,6 +390,7 @@ class App extends React.Component {
this.state.wxconfig = true; this.state.wxconfig = true;
} }
wx.ready(() => { wx.ready(() => {
console.log("是否在微信小程序中启动~~~~~~~~~~~~~");
wx.hideMenuItems({ wx.hideMenuItems({
menuList: [ menuList: [
"menuItem:share:appMessage", "menuItem:share:appMessage",
...@@ -459,43 +445,7 @@ class App extends React.Component { ...@@ -459,43 +445,7 @@ class App extends React.Component {
changeLeftIcon: (lefticon) => this.setState({ lefticon }), changeLeftIcon: (lefticon) => this.setState({ lefticon }),
})} })}
</div> </div>
{/* 底部三个tab页 */}
{/*返回主站点按钮*/}
{!this.state.isHomeSite ? (
<a
onClick={this.goHomeSite}
style={{
boxShadow: "0px 1px 4px 0px rgba(0, 0, 0, 0.25)",
borderRadius: "0px 100px 100px 0px",
paddingLeft: "10px",
paddingRight: "20px",
height: 48,
position: "fixed",
left: 0,
bottom: 148,
zIndex: 999,
background: "#4285F4",
}}
>
<div>
<div
style={{
color: "#ffffff",
width: "auto",
fontSize: 24,
height: 32,
marginLeft: 8,
marginTop: 4,
}}
>
{"< 返回站点"}
</div>
</div>
</a>
) : (
""
)}
{/* 底部五个tab页 */}
{showTab == 0 ? null : ( {showTab == 0 ? null : (
<div className={"index-tab-bar-container"}> <div className={"index-tab-bar-container"}>
...@@ -530,7 +480,7 @@ class App extends React.Component { ...@@ -530,7 +480,7 @@ class App extends React.Component {
selectedTab: "menuhome", selectedTab: "menuhome",
}); });
//暂时修改 //暂时修改
hashHistory.push(func.routerBefore() + '/') hashHistory.push(func.routerBefore() + "/");
}} }}
data-seed="logId" data-seed="logId"
></TabBar.Item> ></TabBar.Item>
...@@ -594,7 +544,7 @@ class App extends React.Component { ...@@ -594,7 +544,7 @@ class App extends React.Component {
selectedTab: "menume", selectedTab: "menume",
}); });
//暂时修改 //暂时修改
hashHistory.push(func.routerBefore() + '/menume') hashHistory.push(func.routerBefore() + "/menume");
}} }}
></TabBar.Item> ></TabBar.Item>
); );
......
...@@ -41,7 +41,7 @@ ...@@ -41,7 +41,7 @@
} }
.login .login-container .login-form { .login .login-container .login-form {
width: 100%; width: 100%;
margin-top: 240px !important; margin-top: 20% !important;
padding-left: 40px; padding-left: 40px;
padding-right: 40px; padding-right: 40px;
} }
...@@ -149,12 +149,14 @@ ...@@ -149,12 +149,14 @@
top: 0.1rem; top: 0.1rem;
} }
.login .login-bot-text { .login .login-bot-text {
width: 360px;
font-size: 28px; font-size: 28px;
position: fixed; position: fixed;
bottom: 60px; bottom: 2%;
left: 31%; left: 50%;
margin-left: -180px;
z-index: 99999; z-index: 99999;
padding: 8px 80px; text-align: center;
color: #fff; color: #fff;
background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0) 100%); background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0) 100%);
} }
...@@ -35,7 +35,7 @@ ...@@ -35,7 +35,7 @@
.login-form { .login-form {
width: 100%; width: 100%;
margin-top: 240px !important; margin-top: 20% !important;
padding-left: 40px; padding-left: 40px;
padding-right: 40px; padding-right: 40px;
.login-form-item { .login-form-item {
...@@ -147,12 +147,14 @@ ...@@ -147,12 +147,14 @@
} }
.login-bot-text { .login-bot-text {
width: 360px;
font-size: 28px; font-size: 28px;
position: fixed; position: fixed;
bottom: 60px; bottom: 2%;
left: 31%; left: 50%;
margin-left: -180px;
z-index: 99999; z-index: 99999;
padding: 8px 80px; text-align: center;
color: #fff; color: #fff;
background: linear-gradient( background: linear-gradient(
270deg, 270deg,
......
...@@ -448,6 +448,8 @@ class LoginForm extends Component { ...@@ -448,6 +448,8 @@ class LoginForm extends Component {
render() { render() {
let { loginNameDesc, loginPwdDesc, passwordType } = this.state; let { loginNameDesc, loginPwdDesc, passwordType } = this.state;
return ( return (
<div className="login-form-item"> <div className="login-form-item">
<div className="login-form-top-logo"> <div className="login-form-top-logo">
......
...@@ -37,7 +37,7 @@ import IndexFirstEnter from "../indexComponent/indexFirstEnter"; ...@@ -37,7 +37,7 @@ import IndexFirstEnter from "../indexComponent/indexFirstEnter";
import IndexTips from "./indexTip"; import IndexTips from "./indexTip";
import MessageIcon from './message-icon.png' import MessageIcon from "./message-icon.png";
function mapStateToProps(state, ownProps) { function mapStateToProps(state, ownProps) {
return { return {
...@@ -89,7 +89,7 @@ const initConfig = { ...@@ -89,7 +89,7 @@ const initConfig = {
shyz: {}, shyz: {},
}; };
const defaultConfig = { const defaultConfig = {
viewTitle: intl.get("Home"), //首页标题 viewTitle: '智慧党建', //首页标题
navModel: 0, //0:导航全部显示 1:只显示搜索栏 2不显示 navModel: 0, //0:导航全部显示 1:只显示搜索栏 2不显示
heroHidden: true, //是否隐藏英雄榜栏目 heroHidden: true, //是否隐藏英雄榜栏目
}; };
...@@ -299,7 +299,7 @@ class Menulearn extends React.Component { ...@@ -299,7 +299,7 @@ class Menulearn extends React.Component {
}); });
}; };
render() { render() {
let bannerHeight = (document.body.clientWidth) * (212 / 726); let bannerHeight = document.body.clientWidth * (212 / 726);
//轮播图参数 //轮播图参数
const carouselparam = { const carouselparam = {
...@@ -333,7 +333,9 @@ class Menulearn extends React.Component { ...@@ -333,7 +333,9 @@ class Menulearn extends React.Component {
isFetching={this.state.isLoading} isFetching={this.state.isLoading}
imageUrl={OccupyIndexImage} imageUrl={OccupyIndexImage}
> >
<div style={{ width: "100%", overflowX: "hidden" ,position:'relative'}}> <div
style={{ width: "100%", overflowX: "hidden", position: "relative" }}
>
{viewConfig.navModel == 2 ? null : viewConfig.navModel == 1 ? ( {viewConfig.navModel == 2 ? null : viewConfig.navModel == 1 ? (
<div onClick={this.taixiangSearchClick}> <div onClick={this.taixiangSearchClick}>
<SearchBar placeholder={intl.get("keyword")} maxLength={8} /> <SearchBar placeholder={intl.get("keyword")} maxLength={8} />
...@@ -350,7 +352,7 @@ class Menulearn extends React.Component { ...@@ -350,7 +352,7 @@ class Menulearn extends React.Component {
{/* 轮播图 */} {/* 轮播图 */}
<div className="carouseldiv"> <div className="carouseldiv">
<div style={{ height: '34%', position: "relative" }}> <div style={{ height: "34%", position: "relative" }}>
{carouselData && carouselData.length > 0 ? ( {carouselData && carouselData.length > 0 ? (
<Mycarousel <Mycarousel
carouselparam={carouselparam} carouselparam={carouselparam}
...@@ -386,8 +388,8 @@ class Menulearn extends React.Component { ...@@ -386,8 +388,8 @@ class Menulearn extends React.Component {
display: "inline-block", display: "inline-block",
width: "9px", width: "9px",
height: "28px", height: "28px",
background: 'linear-gradient(180deg,#fe742b, #fc5b2b 100%)', background: "linear-gradient(180deg,#fe742b, #fc5b2b 100%)",
borderRadius:'8px', borderRadius: "8px",
marginLeft: "40px", marginLeft: "40px",
marginRight: "15px", marginRight: "15px",
}} }}
...@@ -399,13 +401,15 @@ class Menulearn extends React.Component { ...@@ -399,13 +401,15 @@ class Menulearn extends React.Component {
) : ( ) : (
"" ""
)} )}
{/* 新消息icon */} {/* 新消息icon */}
<div style={{ <div
position:'fixed', style={{
top:'55%', position: "fixed",
right:'0' top: "55%",
}}> right: "0",
<img style={{width:'180px'}} src={MessageIcon} alt="" /> }}
>
<img style={{ width: "180px" }} src={MessageIcon} alt="" />
</div> </div>
{/* 通知 :6月1号版本,隐藏首页的公告字段*/} {/* 通知 :6月1号版本,隐藏首页的公告字段*/}
{this.state.announceList && this.state.announceList.length > 0 ? ( {this.state.announceList && this.state.announceList.length > 0 ? (
...@@ -457,7 +461,7 @@ class Menulearn extends React.Component { ...@@ -457,7 +461,7 @@ class Menulearn extends React.Component {
export default connect(mapStateToProps, mapDispatchToProps)(Menulearn); export default connect(mapStateToProps, mapDispatchToProps)(Menulearn);
const NewsItemList = ({ list, onClick }) => { const NewsItemList = ({ list, onClick }) => {
return ( return (
<div className="news-item-list-container" style={{paddingLeft:'15px'}}> <div className="news-item-list-container" style={{ paddingLeft: "15px" }}>
{list.map((item, index) => { {list.map((item, index) => {
let data = { let data = {
id: item.id, id: item.id,
...@@ -469,7 +473,7 @@ const NewsItemList = ({ list, onClick }) => { ...@@ -469,7 +473,7 @@ const NewsItemList = ({ list, onClick }) => {
}; };
if (index < list.length - 1) { if (index < list.length - 1) {
return ( return (
<Fragment> <Fragment key={index}>
<IndexNewsItem <IndexNewsItem
key={index} key={index}
data={data} data={data}
...@@ -501,15 +505,15 @@ const IndexNewsItem = ({ data, onClick }) => { ...@@ -501,15 +505,15 @@ const IndexNewsItem = ({ data, onClick }) => {
src={data.image} src={data.image}
alt="图片加载失败" alt="图片加载失败"
className="index-module-news-item-image" className="index-module-news-item-image"
style={{ width: imageWidth, height: '180px' }} style={{ width: imageWidth, height: "180px" }}
/> />
<div <div
className="index-module-news-info-container" className="index-module-news-info-container"
style={{ height: '180px' }} style={{ height: "180px" }}
> >
<div className="index-module-news-item-info-name">{data.name}</div> <div className="index-module-news-item-info-name">{data.name}</div>
<div className="index-module-news-item-info-text"> <div className="index-module-news-item-info-text">
<span style={{marginRight:'20px'}}>{data.author}</span> <span style={{ marginRight: "20px" }}>{data.author}</span>
{moment(data.releaseTime).format("YYYY.MM.DD")} {moment(data.releaseTime).format("YYYY.MM.DD")}
</div> </div>
</div> </div>
......
...@@ -15,9 +15,11 @@ ...@@ -15,9 +15,11 @@
margin-bottom: 100px; margin-bottom: 100px;
} }
.my-menu-body .header-info-box .personal-info-main { .my-menu-body .header-info-box .personal-info-main {
width: 92%;
margin: 0 auto;
border-radius: 10px; border-radius: 10px;
height: 240px; height: 240px;
padding: 40px 30px; padding: 40px 10px;
position: relative; position: relative;
} }
.my-menu-body .header-info-box .personal-info-main .playcard-entry { .my-menu-body .header-info-box .personal-info-main .playcard-entry {
...@@ -53,6 +55,7 @@ ...@@ -53,6 +55,7 @@
padding-left: 100px; padding-left: 100px;
padding-right: 130px; padding-right: 130px;
position: relative; position: relative;
margin-top: 20px;
} }
.my-menu-body .header-info-box .personal-info-main .personal-info .personal-img { .my-menu-body .header-info-box .personal-info-main .personal-info .personal-img {
position: absolute; position: absolute;
...@@ -144,13 +147,11 @@ ...@@ -144,13 +147,11 @@
justify-content: space-between; justify-content: space-between;
} }
.my-menu-body .header-info-box .study-record-info .study-item .study-jf { .my-menu-body .header-info-box .study-record-info .study-item .study-jf {
width: 160px; padding: 10px 25px;
height: 60px;
line-height: 60px;
background: linear-gradient(90deg, #d23a29, #eb6c53 100%); background: linear-gradient(90deg, #d23a29, #eb6c53 100%);
border-radius: 40px; border-radius: 40px;
color: #fff; color: #fff;
font-size: 30px; font-size: 28px;
text-align: center; text-align: center;
margin-left: 20px; margin-left: 20px;
} }
...@@ -166,12 +167,12 @@ ...@@ -166,12 +167,12 @@
padding: 20px; padding: 20px;
} }
.my-menu-body .list-box .list-item { .my-menu-body .list-box .list-item {
width: 33%; width: 33.3%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
margin: 28px 0; margin: 24px 0;
} }
.my-menu-body .list-box .list-item .item-img { .my-menu-body .list-box .list-item .item-img {
width: 88px; width: 88px;
...@@ -179,7 +180,7 @@ ...@@ -179,7 +180,7 @@
} }
.my-menu-body .list-box .list-item .item-name { .my-menu-body .list-box .list-item .item-name {
color: #333; color: #333;
font-size: 32px; font-size: 24px;
} }
.my-menu-body .mess-list { .my-menu-body .mess-list {
width: 90%; width: 90%;
...@@ -196,6 +197,7 @@ ...@@ -196,6 +197,7 @@
height: 116px; height: 116px;
background-color: #f7f7f7; background-color: #f7f7f7;
padding-top: 16px; padding-top: 16px;
margin-bottom: 40px;
} }
.my-menu-body .menume-quit-login .menume-quit-login-btn { .my-menu-body .menume-quit-login .menume-quit-login-btn {
height: 84px; height: 84px;
......
...@@ -42,7 +42,7 @@ const mapList = { ...@@ -42,7 +42,7 @@ const mapList = {
}, },
tg: { tg: {
text: "我的投稿", text: "我的投稿",
url: "/integral/myintegral", url: "/contributeMyself",
}, },
dy: { dy: {
text: "我的问卷", text: "我的问卷",
...@@ -57,8 +57,8 @@ const mapList = { ...@@ -57,8 +57,8 @@ const mapList = {
url: "/mysurvey", url: "/mysurvey",
}, },
MyLy: { MyLy: {
text: "我留言", text: "我留言",
url: "/mysurvey", url: "/myLeaveMessage",
}, },
}; };
...@@ -286,7 +286,7 @@ class Menume extends React.Component { ...@@ -286,7 +286,7 @@ class Menume extends React.Component {
}; };
let param1 = { let param1 = {
my: 1, my: 1,
test: '2', //进入我的测测试或培训时 0:培训,1:测试 test: "2", //进入我的测测试或培训时 0:培训,1:测试
}; };
hashHistory.push({ hashHistory.push({
pathname: func.routerBefore() + mapList[code].url, pathname: func.routerBefore() + mapList[code].url,
...@@ -406,20 +406,36 @@ class Menume extends React.Component { ...@@ -406,20 +406,36 @@ class Menume extends React.Component {
</div> </div>
<div className="study-record-info"> <div className="study-record-info">
<div className="study-item"> <div className="study-item">
<img <div style={{ display: "flex" }}>
style={{ width: "45px" }} <img
src={jinbi} style={{ width: "45px", marginRight: "20px" }}
alt="" src={jinbi}
/> alt=""
<span style={{ fontSize: "32px", fontWeight: "bold" }}> />
做任务,赢积分 <span style={{ fontSize: "30px", fontWeight: "bold" }}>
</span> 做任务,赢积分
<div className="study-jf">我的积分</div> </span>
<div </div>
className="study-jf" <div style={{ display: "flex" }}>
style={{ background: "rgba(230,98,74,0.10)", color: "#E6624A" }} <div
> className="study-jf"
学习报表 onClick={() =>
hashHistory.push(
func.routerBefore() + "/integral/myintegral"
)
}
>
我的积分
</div>
<div
className="study-jf"
style={{
background: "rgba(230,98,74,0.10)",
color: "#E6624A",
}}
>
学习报表
</div>
</div> </div>
</div> </div>
</div> </div>
......
...@@ -10,11 +10,13 @@ ...@@ -10,11 +10,13 @@
background-repeat: no-repeat; background-repeat: no-repeat;
margin-bottom: 100px; margin-bottom: 100px;
.personal-info-main { .personal-info-main {
width: 92%;
margin: 0 auto;
border-radius: 10px; border-radius: 10px;
height: 240px; height: 240px;
padding: 40px 30px; padding: 40px 10px;
position: relative; position: relative;
.playcard-entry { .playcard-entry {
width: 128px; width: 128px;
height: 52px; height: 52px;
...@@ -55,7 +57,7 @@ ...@@ -55,7 +57,7 @@
padding-left: 100px; padding-left: 100px;
padding-right: 130px; padding-right: 130px;
position: relative; position: relative;
margin-top: 20px;
.personal-img { .personal-img {
position: absolute; position: absolute;
left: 0; left: 0;
...@@ -157,13 +159,11 @@ ...@@ -157,13 +159,11 @@
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
.study-jf { .study-jf {
width: 160px; padding: 10px 25px;
height: 60px;
line-height: 60px;
background: linear-gradient(90deg, #d23a29, #eb6c53 100%); background: linear-gradient(90deg, #d23a29, #eb6c53 100%);
border-radius: 40px; border-radius: 40px;
color: #fff; color: #fff;
font-size: 30px; font-size: 28px;
text-align: center; text-align: center;
margin-left: 20px; margin-left: 20px;
} }
...@@ -181,19 +181,19 @@ ...@@ -181,19 +181,19 @@
border-radius: 10px; border-radius: 10px;
padding: 20px; padding: 20px;
.list-item { .list-item {
width: 33%; width: 33.3%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
margin: 28px 0; margin: 24px 0;
.item-img { .item-img {
width: 88px; width: 88px;
height: 88px; height: 88px;
} }
.item-name { .item-name {
color: #333; color: #333;
font-size: 32px; font-size: 24px;
} }
} }
} }
...@@ -212,7 +212,7 @@ ...@@ -212,7 +212,7 @@
height: 116px; height: 116px;
background-color: #f7f7f7; background-color: #f7f7f7;
padding-top: 16px; padding-top: 16px;
margin-bottom: 40px;
.menume-quit-login-btn { .menume-quit-login-btn {
height: 84px; height: 84px;
width: 100%; width: 100%;
......
...@@ -9,17 +9,17 @@ ...@@ -9,17 +9,17 @@
} }
.train-index-list-container .train-index-list-item-container { .train-index-list-container .train-index-list-item-container {
width: 100%; width: 100%;
padding: 30px; padding: 25px;
background-color: #fff; background-color: #fff;
margin-bottom: 25px; margin-bottom: 25px;
} }
.train-index-list-container .train-index-list-item-container .train-index-list-item-image { .train-index-list-container .train-index-list-item-container .train-index-list-item-image {
width: 220px; width: 36%;
height: 180px; height: 180px;
border-radius: 20px; border-radius: 20px;
} }
.train-index-list-container .train-index-list-item-container .train-index-list-item-info { .train-index-list-container .train-index-list-item-container .train-index-list-item-info {
width: 66%; width: 60%;
} }
.train-index-list-container .train-index-list-item-container .train-index-list-item-info .train-index-list-item-info-name { .train-index-list-container .train-index-list-item-container .train-index-list-item-info .train-index-list-item-info-name {
width: 100%; width: 100%;
......
...@@ -3,16 +3,16 @@ ...@@ -3,16 +3,16 @@
width: 100%; width: 100%;
.train-index-list-item-container { .train-index-list-item-container {
width: 100%; width: 100%;
padding: 30px; padding: 25px;
background-color: #fff; background-color: #fff;
margin-bottom: 25px; margin-bottom: 25px;
.train-index-list-item-image { .train-index-list-item-image {
width: 220px; width: 36%;
height: 180px; height: 180px;
border-radius: 20px; border-radius: 20px;
} }
.train-index-list-item-info { .train-index-list-item-info {
width: 66%; width: 60%;
.train-index-list-item-info-name { .train-index-list-item-info-name {
width: 100%; width: 100%;
height: 40px; height: 40px;
......
import excute from '../../util/fetchUtil';
import API from '../../util/urlconfig';
export function VoteListApi(params, callback) {
const url = `${API.voteListApi}?researchId=${params.id}`;
return (dispatch) => {
return excute.get(
url,
(response) => {
if (callback) {
callback(response.data);
}
}
);
};
}
\ No newline at end of file
import React, { Component } from "react";
import "./style.less";
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import { VoteListApi } from "./action";
import { Input, Upload, Icon, Modal, Radio } from "antd";
const { TextArea } = Input;
function getBase64(file) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = (error) => reject(error);
});
}
class MyLeaveMessage extends Component {
constructor(props) {
super(props);
this.state = {
anonymousValue: 1,
titleValue: "",
contentValue: "",
previewVisible: false,
previewImage: "",
fileList: [
{
uid: "-1",
name: "image.png",
status: "done",
url: "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png",
},
],
activeId: 0,
mapList: [
{
id: 0,
cnName: "功能异常",
},
{
id: 1,
cnName: "体验问题",
},
{
id: 2,
cnName: "产品建议",
},
{
id: 3,
cnName: "其他",
},
],
};
document.title = "我要留言";
this.beforeUpload = this.beforeUpload.bind(this);
this.handleChange = this.handleChange.bind(this);
}
componentDidMount() {}
handleCancel = () => this.setState({ previewVisible: false });
handlePreview = async (file) => {
console.log("111111111111111");
if (!file.url && !file.preview) {
file.preview = await getBase64(file.originFileObj);
}
this.setState({
previewImage: file.url || file.preview,
previewVisible: true,
});
};
beforeUpload(file, fileList) {
console.log("file, fileList", file, fileList);
// this.setState({
// previewImage: file.url || file.preview,
// previewVisible: true,
// });
}
handleChange({ fileList }) {
this.setState({ fileList });
}
handleMessageClick(data, index) {
let _this = this;
_this.setState({
activeId: index,
typeOne: data.id,
});
}
handleClick = () => {
console.log(this.state.titleValue, "点击情况~~~~~~~~~");
// let { typeOne, typeTwo, typeThree } = this.props.location.query;
// let params = {
// id: data.id,
// };
// this.props.VoteListApi(params, (response) => {
// console.log(response);
// });
};
render() {
const { mapList, activeId, previewVisible, previewImage, fileList } =
this.state;
const uploadButton = (
<div>
<Icon type="plus" />
<div className="ant-upload-text">上传</div>
</div>
);
return (
<div className="contribute-detail-out">
<div className="contribute-detail-box">
<div className="top-tit">
问题类型 <span className="red-star">*</span>
</div>
<div className="mycontribute-box">
{mapList.map((item, index) => {
return (
<MyLessaveMessageItem
key={index}
data={item}
isActive={activeId == index ? true : false}
onClick={() => this.handleMessageClick(item, index)}
/>
);
})}
</div>
</div>
<div className="contribute-detail-box">
<div className="top-tit">
标题 <span className="red-star">*</span>
<span>(15字以内)</span>
</div>
<Input
placeholder="请填写您标题"
value={this.state.titleValue}
onChange={(event) =>
this.setState({ titleValue: event.target.value })
}
allowClear
maxLength={15}
style={{ height: "60px", lineHeight: "60px" }}
/>
</div>
<div className="contribute-detail-box">
<div className="top-tit">
问题或建议<span>(10-500个字)</span>
</div>
<TextArea
value={this.state.contentValue}
onChange={(event) =>
this.setState({ contentValue: event.target.value })
}
placeholder="请填写您的问题或建议"
rows={8}
/>
</div>
<div className="contribute-detail-box">
<div className="top-tit">
图片<span>(0/6)</span>
</div>
<Upload
action={""}
listType="picture-card"
fileList={fileList}
onPreview={this.handlePreview}
beforeUpload={this.beforeUpload}
onChange={this.handleChange}
>
{fileList.length >= 6 ? null : uploadButton}
</Upload>
<Modal
visible={previewVisible}
footer={null}
onCancel={this.handleCancel}
>
<img alt="example" style={{ width: "100%" }} src={previewImage} />
</Modal>
<div style={{ fontSize: "30px", color: "#9E9E9E" }}>
支持.png.jepg格式,每张最大5MB
</div>
</div>
<div
className="contribute-detail-box"
style={{
display: "flex",
justifyContent: "space-between",
alignItems: "center",
}}
>
<div className="top-tit">
是否匿名 <span className="red-star">*</span>
</div>
<Radio.Group
size='large'
value={this.state.anonymousValue}
onChange={(event) =>
this.setState({ anonymousValue: event.target.value })
}
>
<Radio value={1}></Radio>
<Radio value={2}></Radio>
</Radio.Group>
</div>
<div className="contribute-detail-btn">
<div className="sumbit-btn" onClick={this.handleClick}>
提交
</div>
</div>
</div>
);
}
}
const mapStateToProps = (state) => {
return {};
};
const mapDispatchToProps = (dispatch) => {
return {
VoteListApi: bindActionCreators(VoteListApi, dispatch),
};
};
export default connect(mapStateToProps, mapDispatchToProps)(MyLeaveMessage);
const MyLessaveMessageItem = ({ data, isActive, onClick }) => {
return (
<div
className={isActive ? "item-box-active" : "item-box"}
onClick={onClick}
>
{isActive ? <span>{data.cnName}</span> : data.cnName}
</div>
);
};
.contribute-detail-out {
width: 92%;
margin: 30px auto;
padding-bottom: 30px;
}
.contribute-detail-out .contribute-detail-box {
padding: 40px 30px;
background-color: #fff;
margin-bottom: 30px;
}
.contribute-detail-out .contribute-detail-box .top-tit {
font-size: 40px;
font-weight: bold;
color: #000;
margin-bottom: 15px;
}
.contribute-detail-out .contribute-detail-box .top-tit .red-star {
color: red;
font-size: 40px;
}
.contribute-detail-out .contribute-detail-box .top-tit span {
color: #9e9e9e;
font-size: 32px;
}
.contribute-detail-out .contribute-detail-box .ant-input-affix-wrapper {
border: 0 !important;
}
.contribute-detail-out .contribute-detail-box .ant-input {
border: 0 !important;
font-size: 32px !important;
}
.contribute-detail-out .contribute-detail-box .ant-input:focus {
box-shadow: none !important;
}
.contribute-detail-out .contribute-detail-box .ant-input-clear-icon {
font-size: 30px !important;
}
.contribute-detail-out .contribute-detail-box .ant-upload-list-picture-card-container {
width: 200px !important;
height: 200px !important;
}
.contribute-detail-out .contribute-detail-box .ant-upload-list-picture-card .ant-upload-list-item {
width: 200px !important;
height: 200px !important;
}
.contribute-detail-out .contribute-detail-box .ant-upload-select-picture-card {
width: 200px !important;
height: 200px !important;
}
.contribute-detail-out .contribute-detail-box .anticon {
font-size: 40px;
}
.contribute-detail-out .contribute-detail-box .ant-upload-text {
font-size: 30px;
}
.contribute-detail-out .contribute-detail-box .ant-radio-wrapper {
font-size: 32px;
}
.contribute-detail-out .mycontribute-box {
background-color: #fff;
width: 100%;
padding-top: 30px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.contribute-detail-out .mycontribute-box .item-box {
width: 32%;
margin-bottom: 40px;
height: 85px;
line-height: 85px;
background-color: #f7f7f7;
text-align: center;
font-size: 34px;
color: #454343;
border-radius: 15px;
}
.contribute-detail-out .mycontribute-box .item-box-active {
width: 32%;
margin-bottom: 40px;
height: 85px;
line-height: 85px;
background: rgba(253, 63, 52, 0.05);
border: 1px solid #f3ab9f;
border-radius: 4px;
text-align: center;
font-size: 34px;
color: #454343;
border-radius: 15px;
}
.contribute-detail-out .mycontribute-box span {
width: 100%;
color: #e6624a;
}
.contribute-detail-out .contribute-detail-btn .sumbit-btn {
width: 100%;
text-align: center;
color: #fff;
font-size: 40px;
padding: 10px 0;
border-radius: 4px;
background: linear-gradient(270deg, #eb6c53 0%, #d23a29);
}
//投稿详情
.contribute-detail-out {
width: 92%;
margin: 30px auto;
padding-bottom: 30px;
.contribute-detail-box {
padding: 40px 30px;
background-color: #fff;
margin-bottom: 30px;
.top-tit {
font-size: 40px;
font-weight: bold;
color: #000;
margin-bottom: 15px;
.red-star {
color: red;
font-size: 40px;
}
span {
color: #9e9e9e;
font-size: 32px;
}
}
.ant-input-affix-wrapper {
border: 0 !important;
}
.ant-input {
border: 0 !important;
font-size: 32px !important;
}
.ant-input:focus {
box-shadow: none !important;
}
.ant-input-clear-icon {
font-size: 30px !important;
}
.ant-upload-list-picture-card-container {
width: 200px !important;
height: 200px !important;
}
.ant-upload-list-picture-card .ant-upload-list-item {
width: 200px !important;
height: 200px !important;
}
.ant-upload-select-picture-card {
width: 200px !important;
height: 200px !important;
}
.anticon {
font-size: 40px;
}
.ant-upload-text {
font-size: 30px;
}
.ant-radio-wrapper {
font-size: 32px;
}
// .ant-radio-inner {
// width: 30px !important;
// height: 30px !important;
// }
// .ant-radio-input{
// width: 30px !important;
// height: 30px !important;
// }
// .ant-radio-inner::after {
// width: 30px !important;
// height: 30px !important;
// border-radius: 50% !important;
// background-color: #d23a29 !important;
// }
// .ant-radio-checked {
// border: 0 !important;
// .ant-radio-inner {
// border: 0 !important;
// }
// }
// .ant-radio-checked::after {
// width: 30px !important;
// height: 30px !important;
// }
}
.mycontribute-box {
background-color: #fff;
width: 100%;
padding-top: 30px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.item-box {
width: 32%;
margin-bottom: 40px;
height: 85px;
line-height: 85px;
background-color: #f7f7f7;
text-align: center;
font-size: 34px;
color: #454343;
border-radius: 15px;
}
.item-box-active {
width: 32%;
margin-bottom: 40px;
height: 85px;
line-height: 85px;
background: rgba(253, 63, 52, 0.05);
border: 1px solid #f3ab9f;
border-radius: 4px;
text-align: center;
font-size: 34px;
color: #454343;
border-radius: 15px;
}
span {
width: 100%;
color: #e6624a;
}
}
.contribute-detail-btn {
.sumbit-btn {
width: 100%;
text-align: center;
color: #fff;
font-size: 40px;
padding: 10px 0;
border-radius: 4px;
background: linear-gradient(270deg, #eb6c53 0%, #d23a29);
}
}
}
import excute from '../../util/fetchUtil'; import excute from '../../util/fetchUtil';
import API from '../../util/urlconfig'; import API from '../../util/urlconfig';
import { Toast } from "antd-mobile"; import { Toast } from "antd-mobile";
export function VoteListApi(params, callback) { //获取投稿类型list
const url = `${API.voteListApi}?researchId=${params.id}`; export function getContributeListApi(params, callback) {
const url = `${API.getContributeListApi}?id=${params.id}`;
return (dispatch) => { return (dispatch) => {
return excute.get( return excute.get(
url, url,
...@@ -14,50 +15,30 @@ export function VoteListApi(params, callback) { ...@@ -14,50 +15,30 @@ export function VoteListApi(params, callback) {
); );
}; };
} }
export function voteSumbitApi(params, callback) { //提交投稿
export function commitContributeApi(params, callback) {
return (dispatch) => { return (dispatch) => {
return excute.post( return excute.post(
API.voteSumbitApi, API.commitContributeApi,
params, params,
(response) => { (response) => {
if (Number.parseFloat(response.code) === 1000) { if (callback) {
Toast.info("提交成功"); callback(response.data);
if (callback) {
callback(response.data);
}
}
}
);
};
}
export function voteSumbitSecondApi(params, callback) {
const url = `${API.voteSumbitSecondApi}?researchId=${params.researchId}`;
return (dispatch) => {
return excute.get(
url,
(response) => {
if (Number.parseFloat(response.code) === 1000) {
if (callback) {
callback(response.data);
}
} }
} }
); );
}; };
} }
//获取排行榜 //我的投稿列表
export function voteTopApi(params, callback) { export function getContributeMyListApi(params, callback) {
const url = `${API.voteTopApi}?researchId=${params.id}`; const url = `${API.getContributeMyListApi}`;
return (dispatch) => { return (dispatch) => {
return excute.get( return excute.post(
url, url,
{},
(response) => { (response) => {
if (Number.parseFloat(response.code) === 1000) { if (callback) {
if (callback) { callback(response.data);
callback(response.data);
}
} }
} }
); );
......
import React, { Component } from "react";
import "./style.less";
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import { getContributeListApi } from "./action";
import { Input, Upload, Icon, Modal } from "antd";
const { TextArea } = Input;
function getBase64(file) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = (error) => reject(error);
});
}
class ContributeDetail extends Component {
constructor(props) {
super(props);
this.state = {
videoVisible: false,
authValue: "",
delValue: "",
titleValue: "",
contentValue: "",
previewVisible: false,
previewImage: "",
fileList: [
{
uid: "-1",
name: "image.png",
status: "done",
url: "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png",
},
],
};
document.title = "我要投稿";
this.showVideoModal = this.showVideoModal.bind(this);
this.closeVideoModal = this.closeVideoModal.bind(this);
this.beforeUpload = this.beforeUpload.bind(this);
this.handleChange = this.handleChange.bind(this);
}
showVideoModal() {
this.setState({
videoVisible: true,
});
}
closeVideoModal() {
this.setState({
videoVisible: false,
});
}
componentDidMount() {}
handleCancel = () => this.setState({ previewVisible: false });
handlePreview = async (file) => {
console.log("111111111111111");
if (!file.url && !file.preview) {
file.preview = await getBase64(file.originFileObj);
}
this.setState({
previewImage: file.url || file.preview,
previewVisible: true,
});
};
beforeUpload(file, fileList) {
console.log("file, fileList", file, fileList);
// this.setState({
// previewImage: file.url || file.preview,
// previewVisible: true,
// });
}
handleChange({ fileList }) {
this.setState({ fileList });
}
handleClick = () => {
console.log(this.state.titleValue, "点击情况~~~~~~~~~");
// let { typeOne, typeTwo, typeThree } = this.props.location.query;
// let params = {
// id: data.id,
// };
// this.props.getContributeListApi(params, (response) => {
// console.log(response);
// });
};
render() {
const { previewVisible, previewImage, fileList } = this.state;
const uploadButton = (
<div>
<Icon type="plus" />
<div className="ant-upload-text">上传</div>
</div>
);
return (
<div className="contribute-detail-out">
<div className="contribute-detail-box">
<div className="top-tit">
标题 <span className="red-star">*</span>
</div>
<Input
placeholder="标题需15字以内"
value={this.state.titleValue}
onChange={(event) =>
this.setState({ titleValue: event.target.value })
}
allowClear
maxLength={15}
style={{ height: "60px", lineHeight: "60px" }}
/>
</div>
<div className="contribute-detail-box">
<div className="top-tit">正文</div>
<TextArea
value={this.state.contentValue}
onChange={(event) =>
this.setState({ contentValue: event.target.value })
}
placeholder="请输入正文"
rows={8}
/>
</div>
<div className="contribute-detail-box">
<div className="top-tit">图片或视频上传</div>
<Upload
action={""}
listType="picture-card"
fileList={fileList}
onPreview={this.handlePreview}
beforeUpload={this.beforeUpload}
onChange={this.handleChange}
>
{fileList.length >= 20 ? null : uploadButton}
</Upload>
<Modal
visible={previewVisible}
footer={null}
onCancel={this.handleCancel}
>
<img alt="example" style={{ width: "100%" }} src={previewImage} />
</Modal>
</div>
<div className="contribute-detail-box">
<div className="user-tit">以下为公开信息,将会在稿件中显示</div>
<div className="userinfo-box">
<div className="userinfo-name">作者</div>
<Input
value={this.state.authValue}
onChange={(event) =>
this.setState({ authValue: event.target.value })
}
placeholder="请输入"
style={{ width: "40%", height: "60px", lineHeight: "60px" }}
/>
</div>
<div className="userinfo-box">
<div className="userinfo-name">支部和部室</div>
<Input
value={this.state.delValue}
onChange={(event) =>
this.setState({ delValue: event.target.value })
}
placeholder="请输入"
style={{ width: "40%", height: "60px", lineHeight: "60px" }}
/>
</div>
</div>
<div className="contribute-detail-btn">
<div className="perview-btn" onClick={this.showVideoModal}>
预览
</div>
<div className="sumbit-btn" onClick={this.handleClick}>
提交
</div>
</div>
<Modal
className="preview-modal"
visible={this.state.videoVisible}
width={document.body.clientWidth}
onCancel={this.closeVideoModal}
>
<div className="preview-out">
<div className="preview-top">
<div className="preview-tit">{this.state.titleValue}</div>
<div className="preview-user">
<div className="user-item">{this.state.authValue}</div>
<div className="user-item">{this.state.delValue}</div>
</div>
</div>
<div className="preview-mid">
<div className="preview-imgs">
{fileList.map((item, index) => {
return <img src={item.url} alt="" key={index} />;
})}
</div>
<div className="perview-con">{this.state.contentValue}</div>
</div>
</div>
</Modal>
</div>
);
}
}
const mapStateToProps = (state) => {
return {};
};
const mapDispatchToProps = (dispatch) => {
return {
getContributeListApi: bindActionCreators(getContributeListApi, dispatch),
};
};
export default connect(mapStateToProps, mapDispatchToProps)(ContributeDetail);
import React, { Component } from "react";
import "./style.less";
import "./../style.less";
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import { getContributeMyListApi } from "./../action";
import moment from "moment";
import comeBack from "../../../image/comebake.png";
import tomore from "../../../image/tomore.png";
class ContributeMyself extends Component {
constructor(props) {
super(props);
this.state = {
list: [],
showStatu: true,
content: {},
};
document.title = "我的投稿";
}
componentDidMount() {
this.props.getContributeMyListApi("", (res) => {
console.log(res);
this.setState({
list: res.records,
});
});
}
handleClick = (item, statu) => {
let _this = this;
console.log(item, _this.state.showStatu, "点击情况~~~~~~~~~");
_this.setState({
showStatu: statu,
content: item,
});
};
handleBack = (statu) => {
let _this = this;
_this.setState({
showStatu: statu,
});
};
render() {
let { list, showStatu, content } = this.state;
return (
<div className="contribute-myself-out">
{showStatu ? (
list.map((item, index) => {
return (
<div
key={index}
className="contribute-myself-box"
onClick={() => this.handleClick(item, false)}
>
<div>
<div className="contribute-myself-top">{item.fileName}</div>
<div className="contribute-myself-bot">
<div className="contribute-bot-item">
{moment(item.submitTime).format("YYYY-MM-DD")}
</div>
<div className="contribute-bot-item">{item.deptName}</div>
</div>
</div>
<div>
<img src={tomore} alt="" />
</div>
</div>
);
})
) : (
<div>
<div className="tit-top">
<div className="back-icon" onClick={() => this.handleBack(true)}>
<img src={comeBack} alt="" style={{ width: "38px" }} />
</div>
<div style={{ fontSize: "40px", color: "#fff" }}>
{content.typeOneName}
</div>
<div style={{ width: "38px", height: "30px" }}></div>
</div>
<div className="contribute-detail-out">
<div className="contribute-detail-box">
<div className="top-tit">标题</div>
<div style={{ fontSize: "36px" }}>{content.fileName}</div>
</div>
<div className="contribute-detail-box">
<div className="top-tit">正文</div>
<div style={{ fontSize: "36px" }}> {content.content}</div>
</div>
<div className="contribute-detail-box">
<div className="top-tit">图片或视频上传</div>
<div>
<img src={content.ossUrl} alt="" />
</div>
</div>
<div className="contribute-detail-box">
<div className="userinfo-box">
<div className="userinfo-name">作者</div>
<div style={{ fontSize: "30px", marginTop: "30px" }}>
{content.author}
</div>
</div>
<div className="userinfo-box">
<div className="userinfo-name">支部和部室</div>
<div style={{ fontSize: "30px", marginTop: "30px" }}>
{content.deptName}
</div>
</div>
</div>
</div>
</div>
)}
</div>
);
}
}
const mapStateToProps = (state) => {
return {};
};
const mapDispatchToProps = (dispatch) => {
return {
getContributeMyListApi: bindActionCreators(
getContributeMyListApi,
dispatch
),
};
};
export default connect(mapStateToProps, mapDispatchToProps)(ContributeMyself);
.contribute-myself-out {
background-color: #FFF;
height: 100%;
}
.contribute-myself-out .tit-top {
height: 90px;
display: flex;
justify-content: space-between;
align-items: center;
background: linear-gradient(270deg, #ee4e3c 0%, #d23a29);
}
.contribute-myself-out .tit-top .back-icon {
width: 38px;
height: 38px;
padding-left: 20px;
}
.contribute-myself-out .contribute-myself-box {
width: 92%;
margin: 0 auto;
background-color: #fff;
margin-bottom: 30px;
padding: 20px 10px;
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #E5E6E8;
}
.contribute-myself-out .contribute-myself-box .contribute-myself-top {
font-size: 42px;
font-weight: 500;
color: #000;
margin-bottom: 30px;
}
.contribute-myself-out .contribute-myself-box .contribute-myself-bot {
display: flex;
}
.contribute-myself-out .contribute-myself-box .contribute-myself-bot .contribute-bot-item {
font-size: 30px;
color: #ababab;
margin-right: 20px;
}
.contribute-myself-out {
background-color: #FFF;
height: 100%;
.tit-top {
height: 90px;
display: flex;
justify-content: space-between;
align-items: center;
background: linear-gradient(270deg, #ee4e3c 0%, #d23a29);
.back-icon {
width: 38px;
height: 38px;
padding-left: 20px;
}
}
.contribute-myself-box {
width: 92%;
margin: 0 auto;
background-color: #fff;
margin-bottom: 30px;
padding: 20px 10px;
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #E5E6E8;
.contribute-myself-top {
font-size: 42px;
font-weight: 500;
color: #000;
margin-bottom: 30px;
}
.contribute-myself-bot {
display: flex;
.contribute-bot-item {
font-size: 30px;
color: #ababab;
margin-right: 20px;
}
}
}
}
...@@ -5,84 +5,162 @@ import func from "../../util/commonFunc"; ...@@ -5,84 +5,162 @@ import func from "../../util/commonFunc";
import moment from "moment"; import moment from "moment";
import { connect } from "react-redux"; import { connect } from "react-redux";
import { bindActionCreators } from "redux"; import { bindActionCreators } from "redux";
import { VoteListApi, voteSumbitApi, voteSumbitSecondApi } from "./action"; import { getContributeListApi } from "./action";
import { Modal } from "antd-mobile"; import { Modal } from "antd-mobile";
class Mycontribute extends Component { class Mycontribute extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
activeId:0, activeId: null,
mapList: [ activeTwoId: null,
{ activeThreeId: null,
name: "党务直通", typeOne: null,
activityType:0 typeTwo: null,
}, typeThree: null,
{ mapList: [],
name: "廉洁作风", mapTwoList: [],
activityType:1 mapThreeList: [],
},
{
name: "机电视窗",
activityType:2
},
{
name: "支部风采",
activityType:3
},
{
name: "年度专栏",
activityType:4
},
{
name: "工团快讯",
activityType:5
},
{
name: "学习栏目",
activityType:6
},
{
name: "其他",
activityType:7
},
],
}; };
document.title = "我要投稿"; document.title = "我要投稿";
} }
componentDidMount() {} componentDidMount() {
handleClick = (data) => { let _this = this;
let params = {
id: 2,
};
this.props.getContributeListApi(params, (response) => {
_this.setState({
mapList: response,
});
});
}
handleClick = (data, index) => {
console.log(data, "点击情况~~~~~~~~~"); console.log(data, "点击情况~~~~~~~~~");
let params = {
id: data.id,
};
this.props.getContributeListApi(params, (response) => {
_this.setState({
mapTwoList: response,
});
});
const { activeId } = this.state; const { activeId } = this.state;
let _this = this; let _this = this;
if (activeId != data.activityType) { if (activeId != index) {
this.setState( _this.setState({
{ activeId: index,
activeId: data.activityType, activeTwoId: null,
childShow:true typeOne: data.id,
}, typeTwo: null,
); activeThreeId: null,
typeThree: null,
mapThreeList:[]
});
} }
}; };
handleTwoClick = (data, index) => {
let params = {
id: data.id,
};
this.props.getContributeListApi(params, (response) => {
_this.setState({
mapThreeList: response,
});
});
const { activeTwoId } = this.state;
let _this = this;
if (activeTwoId != index) {
_this.setState({
activeTwoId: index,
activeThreeId: null,
typeTwo: data.id,
typeThree: null,
});
}
};
handleThreeClick = (data, index) => {
const { activeThreeId } = this.state;
let _this = this;
if (activeThreeId != index) {
_this.setState({
activeThreeId: index,
typeThree: data.id,
});
}
};
handleTo = () => {
let { typeOne, typeTwo, typeThree } = this.state;
hashHistory.push({
pathname: func.routerBefore() + "/contributeDetail",
query: {
typeOne: typeOne,
typeTwo: typeTwo,
typeThree: typeThree,
},
});
};
render() { render() {
let { mapList,activeId } = this.state; let {
mapList,
mapTwoList,
mapThreeList,
activeId,
activeTwoId,
activeThreeId,
} = this.state;
return ( return (
<div className="mycontribute-out"> <div className="mycontribute-out">
<div className="mycontribute-tit">请选择投稿类型</div> <div className="mycontribute-tit">请选择投稿类型</div>
<div className="mycontribute-box"> <div className="mycontribute-box">
{mapList.map((item,index) => { {mapList.map((item, index) => {
return ( return (
<MycontributeItem <MycontributeItem
key={index} key={index}
data={item} data={item}
isActive={activeId == item.activityType ? true : false} isActive={activeId == index ? true : false}
onClick={() => this.handleClick(item)} onClick={() => this.handleClick(item, index)}
/> />
); );
})} })}
</div> </div>
{mapTwoList.length > 0 ? (
<div className="mycontribute-btn">写稿</div> <div className="mycontribute-box">
{mapTwoList.map((item, index) => {
return (
<MycontributeItem
key={index}
data={item}
isActive={activeTwoId == index ? true : false}
onClick={() => this.handleTwoClick(item, index)}
/>
);
})}
</div>
) : (
""
)}
{mapThreeList.length > 0 ? (
<div className="mycontribute-box">
{mapThreeList.map((item, index) => {
return (
<MycontributeItem
key={index}
data={item}
isActive={activeThreeId == index ? true : false}
onClick={() => this.handleThreeClick(item, index)}
/>
);
})}
</div>
) : (
""
)}
<div className="mycontribute-btn" onClick={this.handleTo}>
写稿
</div>
</div> </div>
); );
} }
...@@ -92,16 +170,17 @@ const mapStateToProps = (state) => { ...@@ -92,16 +170,17 @@ const mapStateToProps = (state) => {
}; };
const mapDispatchToProps = (dispatch) => { const mapDispatchToProps = (dispatch) => {
return { return {
VoteListApi: bindActionCreators(VoteListApi, dispatch), getContributeListApi: bindActionCreators(getContributeListApi, dispatch),
voteSumbitApi: bindActionCreators(voteSumbitApi, dispatch),
voteSumbitSecondApi: bindActionCreators(voteSumbitSecondApi, dispatch),
}; };
}; };
export default connect(mapStateToProps, mapDispatchToProps)(Mycontribute); export default connect(mapStateToProps, mapDispatchToProps)(Mycontribute);
const MycontributeItem = ({ data, isActive, onClick }) => { const MycontributeItem = ({ data, isActive, onClick }) => {
return ( return (
<div className={isActive?'item-box-active':"item-box"} onClick={onClick}> <div
{isActive ? <span>{data.name}</span> : data.name} className={isActive ? "item-box-active" : "item-box"}
onClick={onClick}
>
{isActive ? <span>{data.cnName}</span> : data.cnName}
</div> </div>
); );
}; };
...@@ -59,3 +59,119 @@ ...@@ -59,3 +59,119 @@
color: #fff; color: #fff;
font-size: 36px; font-size: 36px;
} }
.contribute-detail-out {
width: 92%;
margin: 30px auto;
padding-bottom: 30px;
}
.contribute-detail-out .contribute-detail-box {
padding: 40px 30px;
background-color: #fff;
margin-bottom: 30px;
}
.contribute-detail-out .contribute-detail-box .top-tit {
font-size: 40px;
font-weight: bold;
color: #000;
margin-bottom: 15px;
}
.contribute-detail-out .contribute-detail-box .top-tit .red-star {
color: red;
font-size: 40px;
}
.contribute-detail-out .contribute-detail-box .user-tit {
color: #999999;
font-size: 32px;
}
.contribute-detail-out .contribute-detail-box .userinfo-box {
display: flex;
justify-content: space-between;
align-items: center;
}
.contribute-detail-out .contribute-detail-box .userinfo-box .userinfo-name {
margin-top: 30px;
color: #666666;
font-size: 32px;
}
.contribute-detail-out .contribute-detail-box .ant-input-affix-wrapper {
border: 0 !important;
}
.contribute-detail-out .contribute-detail-box .ant-input {
border: 0 !important;
font-size: 32px !important;
}
.contribute-detail-out .contribute-detail-box .ant-input:focus {
box-shadow: none !important;
}
.contribute-detail-out .contribute-detail-box .ant-input-clear-icon {
font-size: 30px !important;
}
.contribute-detail-out .contribute-detail-box .ant-upload-list-picture-card-container {
width: 200px !important;
height: 200px !important;
}
.contribute-detail-out .contribute-detail-box .ant-upload-list-picture-card .ant-upload-list-item {
width: 200px !important;
height: 200px !important;
}
.contribute-detail-out .contribute-detail-box .ant-upload-select-picture-card {
width: 200px !important;
height: 200px !important;
}
.contribute-detail-out .contribute-detail-box .anticon {
font-size: 40px;
}
.contribute-detail-out .contribute-detail-box .ant-upload-text {
font-size: 30px;
}
.contribute-detail-out .contribute-detail-btn {
display: flex;
justify-content: space-between;
}
.contribute-detail-out .contribute-detail-btn .perview-btn {
width: 48%;
text-align: center;
color: #666;
font-size: 40px;
padding: 10px 0;
border: 1px solid #666;
border-radius: 4px;
}
.contribute-detail-out .contribute-detail-btn .sumbit-btn {
width: 48%;
text-align: center;
color: #fff;
font-size: 40px;
padding: 10px 0;
border-radius: 4px;
background: linear-gradient(270deg, #eb6c53 0%, #d23a29);
}
.preview-modal .preview-out .preview-top .preview-tit {
font-size: 42px;
color: #000;
font-weight: bold;
}
.preview-modal .preview-out .preview-top .preview-user {
display: flex;
}
.preview-modal .preview-out .preview-top .preview-user .user-item {
color: #999;
font-size: 30px;
margin-right: 15px;
}
.preview-modal .preview-out .preview-mid .preview-imgs img {
width: 100%;
}
.preview-modal .preview-out .preview-mid .perview-con {
font-size: 36px;
color: #000;
}
.ant-modal-footer {
display: none !important;
}
.ant-upload-list-item-actions a {
margin-right: 35px;
}
.ant-upload-list-item-actions .anticon-delete {
margin-left: 35px;
}
...@@ -47,7 +47,6 @@ ...@@ -47,7 +47,6 @@
width: 92%; width: 92%;
margin: 0 auto; margin: 0 auto;
padding: 40px 25px; padding: 40px 25px;
} }
.mycontribute-btn { .mycontribute-btn {
width: 92%; width: 92%;
...@@ -60,3 +59,133 @@ ...@@ -60,3 +59,133 @@
font-size: 36px; font-size: 36px;
} }
} }
//投稿详情
.contribute-detail-out {
width: 92%;
margin: 30px auto;
padding-bottom: 30px;
.contribute-detail-box {
padding: 40px 30px;
background-color: #fff;
margin-bottom: 30px;
.top-tit {
font-size: 40px;
font-weight: bold;
color: #000;
margin-bottom: 15px;
.red-star {
color: red;
font-size: 40px;
}
}
.user-tit {
color: #999999;
font-size: 32px;
}
.userinfo-box {
display: flex;
justify-content: space-between;
align-items: center;
.userinfo-name {
margin-top: 30px;
color: #666666;
font-size: 32px;
}
}
.ant-input-affix-wrapper {
border: 0 !important;
}
.ant-input {
border: 0 !important;
font-size: 32px !important;
}
.ant-input:focus {
box-shadow: none !important;
}
.ant-input-clear-icon {
font-size: 30px !important;
}
.ant-upload-list-picture-card-container {
width: 200px !important;
height: 200px !important;
}
.ant-upload-list-picture-card .ant-upload-list-item {
width: 200px !important;
height: 200px !important;
}
.ant-upload-select-picture-card {
width: 200px !important;
height: 200px !important;
}
.anticon {
font-size: 40px;
}
.ant-upload-text {
font-size: 30px;
}
}
.contribute-detail-btn {
display: flex;
justify-content: space-between;
.perview-btn {
width: 48%;
text-align: center;
color: #666;
font-size: 40px;
padding: 10px 0;
border: 1px solid #666;
border-radius: 4px;
}
.sumbit-btn {
width: 48%;
text-align: center;
color: #fff;
font-size: 40px;
padding: 10px 0;
border-radius: 4px;
background: linear-gradient(270deg, #eb6c53 0%, #d23a29);
}
}
}
.preview-modal {
.preview-out {
.preview-top {
.preview-tit {
font-size: 42px;
color: #000;
font-weight: bold;
}
.preview-user {
display: flex;
.user-item {
color: #999;
font-size: 30px;
margin-right: 15px;
}
}
}
.preview-mid {
.preview-imgs {
img {
width: 100%;
// height: 180px;
}
}
.perview-con {
font-size: 36px;
color: #000;
}
}
}
}
.ant-modal-footer {
display: none !important;
}
.ant-upload-list-item-actions {
a {
margin-right: 35px;
}
.anticon-delete {
margin-left: 35px;
}
}
...@@ -57,27 +57,13 @@ class mehomeNav extends React.Component { ...@@ -57,27 +57,13 @@ class mehomeNav extends React.Component {
zIndex: 998, zIndex: 998,
width: "100%", width: "100%",
}} }}
> >
<div id="hometitle" iconname={""} className="menuhomeNav"> <div id="hometitle" iconname={""} className="menuhomeNav">
<div <div
style={{ style={{ width: "80%", margin: "auto" }}
width: "25%",
fontSize: "36px",
marginRight: "20px",
paddingLeft: "20px",
}}
>
智慧党建
</div>
<div
style={{ width: "50%" }}
onClick={() => hashHistory.push(func.routerBefore() + "/search")} onClick={() => hashHistory.push(func.routerBefore() + "/search")}
> >
<SearchBar <SearchBar placeholder="搜索" maxLength={8} />
placeholder='搜索'
maxLength={8}
/>
</div> </div>
</div> </div>
</div> </div>
......
...@@ -248,9 +248,6 @@ const NewsClassifyList = ({ list, currentClassifyId, onClick }) => { ...@@ -248,9 +248,6 @@ const NewsClassifyList = ({ list, currentClassifyId, onClick }) => {
return ( return (
<div className="news-classify-list-container"> <div className="news-classify-list-container">
<div <div
className="news-classify-list-container-bg"
></div>
<div
className="news-classify-list-scroll-container" className="news-classify-list-scroll-container"
id={"news-classify-list-scroll-id"} id={"news-classify-list-scroll-id"}
> >
...@@ -329,7 +326,7 @@ const NewsItemList = ({ list, onClick }) => { ...@@ -329,7 +326,7 @@ const NewsItemList = ({ list, onClick }) => {
}; };
if (index < list.length - 1) { if (index < list.length - 1) {
return ( return (
<Fragment> <Fragment key={index}>
<IndexNewsItem <IndexNewsItem
key={index} key={index}
data={data} data={data}
......
...@@ -21,42 +21,26 @@ ...@@ -21,42 +21,26 @@
.news-list-page-container .news-list-page-scroll-container .news-classify-list-container { .news-list-page-container .news-list-page-scroll-container .news-classify-list-container {
width: 100%; width: 100%;
height: 90px; height: 90px;
z-index: 9;
overflow-y: hidden;
overflow-x: auto; overflow-x: auto;
} position: fixed;
.news-list-page-container .news-list-page-scroll-container .news-classify-list-container .news-classify-list-container-bg {
width: 100%;
height: 88px;
position: absolute;
left: 0;
top: 0;
background-color: #D23A29;
z-index: 1;
} }
.news-list-page-container .news-list-page-scroll-container .news-classify-list-container .news-classify-list-scroll-container { .news-list-page-container .news-list-page-scroll-container .news-classify-list-container .news-classify-list-scroll-container {
width: max-content; width: max-content;
min-width: 100%;
height: 88px; height: 88px;
position: relative; display: flex;
z-index: 2;
padding: 0 10px; padding: 0 10px;
overflow-x: auto; overflow-x: auto;
background-color: #D23A29;
} }
.news-list-page-container .news-list-page-scroll-container .news-classify-list-container .news-classify-list-scroll-container .news-classify-item-container { .news-list-page-container .news-list-page-scroll-container .news-classify-list-container .news-classify-list-scroll-container .news-classify-item-container {
max-width: 324px;
height: 88px; height: 88px;
line-height: 88px; line-height: 88px;
text-align: center; text-align: center;
margin: 0 25px; margin: 0 25px;
display: inline-block;
vertical-align: middle;
font-size: 32px; font-size: 32px;
color: #fff; color: #fff;
font-weight: 400; font-weight: 400;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
word-break: break-all;
} }
.news-list-page-container .news-list-page-scroll-container .news-classify-list-container .news-classify-list-scroll-container .news-classify-item-container span { .news-list-page-container .news-list-page-scroll-container .news-classify-list-container .news-classify-list-scroll-container .news-classify-item-container span {
border-bottom: 4px solid #fff; border-bottom: 4px solid #fff;
...@@ -90,4 +74,5 @@ ...@@ -90,4 +74,5 @@
} }
.news-list-page-container .news-list-page-scroll-container .news-item-list-container { .news-list-page-container .news-list-page-scroll-container .news-item-list-container {
width: 100%; width: 100%;
padding-top: 90px;
} }
...@@ -18,38 +18,24 @@ ...@@ -18,38 +18,24 @@
.news-classify-list-container { .news-classify-list-container {
width: 100%; width: 100%;
height: 90px; height: 90px;
z-index: 9;
overflow-y: hidden;
overflow-x: auto; overflow-x: auto;
position: fixed;
.news-classify-list-container-bg {
width: 100%;
height: 88px;
position: absolute;
left: 0;
top: 0;
background-color: #D23A29;
z-index: 1;
}
.news-classify-list-scroll-container{ .news-classify-list-scroll-container{
width: max-content; width: max-content;
min-width: 100%;
height: 88px; height: 88px;
position: relative; display: flex;
z-index: 2;
padding: 0 10px; padding: 0 10px;
overflow-x: auto; overflow-x: auto;
background-color: #D23A29;
.news-classify-item-container{ .news-classify-item-container{
max-width: 324px;
height: 88px; height: 88px;
line-height: 88px; line-height: 88px;
text-align: center; text-align: center;
margin: 0 25px; margin: 0 25px;
display: inline-block;
vertical-align: middle;
font-size: 32px; font-size: 32px;
color:#fff; color:#fff;
font-weight:400; font-weight:400;
.singleLineOverflow;
span{ span{
border-bottom: 4px solid #fff; border-bottom: 4px solid #fff;
padding-bottom: 12px; padding-bottom: 12px;
...@@ -83,6 +69,7 @@ ...@@ -83,6 +69,7 @@
.news-item-list-container{ .news-item-list-container{
width: 100%; width: 100%;
padding-top: 90px;
} }
......

1.06 KB | W: | H:

777 Bytes | W: | H:

src/image/alreadyzan.png
src/image/alreadyzan.png
src/image/alreadyzan.png
src/image/alreadyzan.png
  • 2-up
  • Swipe
  • Onion skin
...@@ -191,7 +191,18 @@ const TheCharts = LazyLoad(() => ...@@ -191,7 +191,18 @@ const TheCharts = LazyLoad(() =>
const Mycontribute = LazyLoad(() => const Mycontribute = LazyLoad(() =>
import('./components/mycontribute') import('./components/mycontribute')
) )
//投稿详情
const ContributeDetail = LazyLoad(() =>
import('./components/mycontribute/contributeDetail.jsx')
)
//我的投稿
const ContributeMyself = LazyLoad(() =>
import('./components/mycontribute/contributeMyself')
)
//我要留言
const MyLeaveMessage = LazyLoad(() =>
import('./components/myLeaveMessage')
)
const MediaPreview = LazyLoad(() => const MediaPreview = LazyLoad(() =>
import('./common/preview/preview') import('./common/preview/preview')
) )
...@@ -373,6 +384,11 @@ class AppRouter extends React.Component { ...@@ -373,6 +384,11 @@ class AppRouter extends React.Component {
<Route path="/*/*/theCharts" component={TheCharts} /> <Route path="/*/*/theCharts" component={TheCharts} />
{/* 我要投稿 */} {/* 我要投稿 */}
<Route path="/*/*/mycontribute" component={Mycontribute} /> <Route path="/*/*/mycontribute" component={Mycontribute} />
<Route path="/*/*/contributeDetail" component={ContributeDetail} />
{/* 我的投稿 */}
<Route path="/*/*/contributeMyself" component={ContributeMyself} />
{/* 我要留言 */}
<Route path="/*/*/myLeaveMessage" component={MyLeaveMessage} />
{/*empty*/} {/*empty*/}
<Route path="/*/*/empty" component={Empty} /> <Route path="/*/*/empty" component={Empty} />
......
const WEBSTUDENT = "/web-student/"; const WEBSTUDENT = "/web-student/";
const WEBMANAGE = "/web-manage/";
// 只有交银康林企业用 // 只有交银康林企业用
let urlPrefix = localStorage.getItem("host_config"); let urlPrefix = localStorage.getItem("host_config");
...@@ -20,9 +21,10 @@ if ( ...@@ -20,9 +21,10 @@ if (
host.indexOf("172.") != -1 host.indexOf("172.") != -1
) { ) {
//本地环境 //本地环境
// baseUrl = "http://192.168.1.106:8090"; baseUrl = "http://192.168.1.107:8090";
//服务器环境 //服务器环境
baseUrl = "http://10.23.1.180:8090"; // baseUrl = "https://10.23.1.180:8090";
// baseUrl = "https://hqjddj.shanghaiairport.com";
} else if ( } else if (
host.indexOf("192.168.1.131") != -1 || host.indexOf("192.168.1.131") != -1 ||
...@@ -453,5 +455,10 @@ const url = { ...@@ -453,5 +455,10 @@ const url = {
searchDeleteApi:`${baseUrl}${SYSTEM}dictionary/home/searchDeleteByMe`, searchDeleteApi:`${baseUrl}${SYSTEM}dictionary/home/searchDeleteByMe`,
searchListAllApi:`${baseUrl}${SYSTEM}dictionary/home/searchListByAll`, searchListAllApi:`${baseUrl}${SYSTEM}dictionary/home/searchListByAll`,
//我要投稿
getContributeListApi:`${baseUrl}${SYSTEM}dictionary/child/list`,
commitContributeApi:`${baseUrl}${WEBMANAGE}manage/site/classify/publication/insert`,
//我的投稿
getContributeMyListApi:`${baseUrl}${WEBMANAGE}manage/site/classify/publication/list`,
}; };
export default url; export default url;
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment