Skip to content

S
saas-weichat
Commit 192bee37 by yanglang123
Options

xiugai

parent e2c7aa96
Showing with 3468 additions and 3622 deletions
src/common/mediaDisplay/index.jsx
...@@ -188,7 +188,7 @@ class MediaDisplay extends Component { ...@@ -188,7 +188,7 @@ class MediaDisplay extends Component {
key={this.state.imgRefreshKey} key={this.state.imgRefreshKey}
id={'media-diplay-container' + this.state.randomId} id={'media-diplay-container' + this.state.randomId}
className={this.props.className + ' media-diplay-container-class'} className={this.props.className + ' media-diplay-container-class'}
style={{ width: this.props.width || '100%' }} style={{ width: this.props.width || '100%' ,fontSize:'32px'}}
dangerouslySetInnerHTML={{ __html: this.props.content }} dangerouslySetInnerHTML={{ __html: this.props.content }}
/> />
); );
......
src/components/AllDescribe/action.js 0 → 100644
import excute from '../../util/fetchUtil';
import API from '../../util/urlconfig';
export function AllDescribeApi(params,callback) {
return (dispatch) => {
return excute.post(
API.allDescribeUrl,
params,
(response) => {
if (callback) {
callback(response.data);
}
}
);
};
}
\ No newline at end of file
src/components/AllDescribe/index.jsx 0 → 100644
import React, { Component } from "react";
import "./style.less";
import { hashHistory } from "react-router";
import func from "../../util/commonFunc";
import moment from "moment";
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import { AllDescribeApi } from "./action";
class AllDescribe extends Component {
constructor(props) {
super(props);
this.state = {
list: {},
};
}
componentDidMount() {
let _this = this;
let { id } = this.props.location.query;
let params = {
researchId: id,
};
this.props.AllDescribeApi(params, (response) => {
_this.setState({
list: response,
});
});
}
render() {
let { id, type } = this.props.location.query;
const { list } = this.state;
let pageWidth =
document.body.clientWidth > 750 ? 750 : document.body.clientWidth;
return (
<div className="describe-out">
<div className="describe-top">
<div className="top-title">{list.name}</div>
<div className="top-img">
<img src={list.image} alt="" />
</div>
</div>
<div className="describe-mid">
{/* 主题 */}
<div className="mid-item">
<p className="item-tit">{type}主题</p>
<p className="item-cont" style={{ color: "#333" }}>
{list.content}
</p>
</div>
{/* 说明 */}
<div className="mid-item">
<p className="item-tit">{type}说明</p>
<p className="item-cont">{list.remark}</p>
</div>
{/* 时间 */}
<div className="mid-item">
<p className="item-tit">{type}时间</p>
<p className="item-cont">
{moment(list.startTime).format("YYYY年MM月DD日 HH:mm:ss")}
</p>
</div>
</div>
<div className="describe-bot">
<div
className="describe-btn"
onClick={() => {
this.handleTo(id, type);
}}
>
立即{type}
</div>
</div>
</div>
);
}
// 跳转到投票
handleTo = (id, type) => {
if (type == "投票") {
hashHistory.push({
pathname: func.routerBefore() + "/SurveyDetails",
query: { id: id },
});
}
};
}
const mapStateToProps = (state) => {
return {};
};
const mapDispatchToProps = (dispatch) => {
return {
AllDescribeApi: bindActionCreators(AllDescribeApi, dispatch),
};
};
export default connect(mapStateToProps, mapDispatchToProps)(AllDescribe);
src/components/AllDescribe/style.css 0 → 100644
.describe-out {
padding-top: 60px;
width: 100%;
height: 100%;
background: linear-gradient(0deg, #ff9286 0%, #d23a29), linear-gradient(180deg, rgba(255, 255, 255, 0) 59%, #f5f5f5 100%), linear-gradient(0deg, rgba(210, 58, 41, 0) 0%, #d23a29);
}
.describe-out .describe-top {
width: 92%;
margin: 0 auto;
margin-bottom: 40px;
}
.describe-out .describe-top .top-title {
width: 100%;
margin-bottom: 40px;
height: 60px;
line-height: 60px;
text-align: center;
font-size: 42px;
color: #fff;
font-family: PingFang SC, PingFang SC-500;
font-weight: 500;
background: linear-gradient(90deg, rgba(255, 151, 130, 0), #ff9782 53%, rgba(255, 151, 130, 0) 100%);
}
.describe-out .describe-top .top-img img {
width: 100%;
}
.describe-out .describe-mid {
width: 92%;
margin: 0 auto;
background-color: #fff;
border-radius: 14px;
}
.describe-out .describe-mid .mid-item {
padding: 40px;
}
.describe-out .describe-mid .mid-item .item-tit {
font-size: 40px;
font-weight: 600;
color: #353535;
}
.describe-out .describe-mid .mid-item .item-cont {
font-size: 32px;
font-weight: 500;
color: #000;
}
.describe-out .describe-bot .describe-btn {
position: fixed;
bottom: 0;
width: 100%;
text-align: center;
padding: 20px 0;
background: linear-gradient(270deg, #eb6c53 0%, #d23a29);
border-radius: 5px;
color: #fff;
font-size: 36px;
}
src/components/AllDescribe/style.less 0 → 100644
.describe-out {
padding-top: 60px;
width: 100%;
height: 100%;
background: linear-gradient(0deg, #ff9286 0%, #d23a29),
linear-gradient(180deg, rgba(255, 255, 255, 0) 59%, #f5f5f5 100%),
linear-gradient(0deg, rgba(210, 58, 41, 0) 0%, #d23a29);
.describe-top {
width: 92%;
margin: 0 auto;
margin-bottom: 40px;
.top-title {
width: 100%;
margin-bottom: 40px;
height: 60px;
line-height: 60px;
text-align: center;
font-size: 42px;
color: #fff;
font-family: PingFang SC, PingFang SC-500;
font-weight: 500;
background: linear-gradient(
90deg,
rgba(255, 151, 130, 0),
#ff9782 53%,
rgba(255, 151, 130, 0) 100%
);
}
.top-img {
img {
width: 100%;
}
}
}
.describe-mid {
width: 92%;
margin: 0 auto;
background-color: #fff;
border-radius: 14px;
.mid-item {
padding: 40px;
.item-tit {
font-size: 40px;
font-weight: 600;
color: #353535;
}
.item-cont {
font-size: 32px;
font-weight: 500;
color: #000;
}
}
}
.describe-bot {
.describe-btn {
position: fixed;
bottom: 0;
width: 100%;
text-align: center;
padding: 20px 0;
background: linear-gradient(270deg, #eb6c53 0%, #d23a29);
border-radius: 5px;
color: #fff;
font-size: 36px;
}
}
}
src/components/App.jsx
...@@ -22,7 +22,6 @@ import { ...@@ -22,7 +22,6 @@ import {
import intl from "react-intl-universal"; import intl from "react-intl-universal";
class App extends React.Component { class App extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
...@@ -64,16 +63,6 @@ class App extends React.Component { ...@@ -64,16 +63,6 @@ class App extends React.Component {
selectedTab: 'menucourse', selectedTab: 'menucourse',
}); });
func.changeDocumentTitle(intl.get("Course")); func.changeDocumentTitle(intl.get("Course"));
} else if (tab === 'menumarketing') {
this.setState({
selectedTab: 'menumarketing',
});
if (func.routerBefore() == "/shpd/lsbdd") {
func.changeDocumentTitle(intl.get("juyoucai"));
} else {
func.changeDocumentTitle(intl.get("PublishKey131"));
}
} else if (tab === 'menume') { } else if (tab === 'menume') {
this.setState({ this.setState({
selectedTab: 'menume', selectedTab: 'menume',
...@@ -124,17 +113,6 @@ class App extends React.Component { ...@@ -124,17 +113,6 @@ class App extends React.Component {
}); });
func.changeDocumentTitle(intl.get("Account")); func.changeDocumentTitle(intl.get("Account"));
break; break;
case "menumarketing":
this.setState({
selectedTab: 'menumarketing',
});
if (func.routerBefore() == "/shpd/lsbdd") {
func.changeDocumentTitle(intl.get("juyoucai"));
} else {
func.changeDocumentTitle(intl.get("PublishKey131"));
}
break;
case "association": case "association":
this.setState({ this.setState({
selectedTab: 'association', selectedTab: 'association',
...@@ -318,28 +296,6 @@ class App extends React.Component { ...@@ -318,28 +296,6 @@ class App extends React.Component {
</TabBar.Item> </TabBar.Item>
); );
let tabMarket = (<TabBar.Item
icon={
<IconfontD code={"iconhometabbar-marketing-unselect"} style={{fontSize:48}}/>
}
selectedIcon={
<IconfontD code={"iconhometabbar-marketing-selected"} style={{fontSize:48}}/>
}
title={<span>{intl.get("PublishKey131")}</span>}
di
key={intl.get("marketing")}
selected={this.state.selectedTab === 'menumarketing'}
onPress={() => {
this.setState({
selectedTab: 'menumarketing',
});
hashHistory.push(func.routerBefore() + '/menumarketing')
}}
>
</TabBar.Item>
)
let menuHome = (<TabBar.Item let menuHome = (<TabBar.Item
icon={ icon={
<IconfontD code={"iconhometabbar-mine-unselect"} style={{fontSize:48}}/> <IconfontD code={"iconhometabbar-mine-unselect"} style={{fontSize:48}}/>
...@@ -511,7 +467,7 @@ class App extends React.Component { ...@@ -511,7 +467,7 @@ class App extends React.Component {
: <div className={"index-tab-bar-container"}> <TabBar : <div className={"index-tab-bar-container"}> <TabBar
unselectedTintColor="#949494" unselectedTintColor="#949494"
tintColor="#4285f4" tintColor="#D23A29"
barTintColor="white" barTintColor="white"
hidden={this.state.hidden} hidden={this.state.hidden}
> >
...@@ -526,7 +482,7 @@ class App extends React.Component { ...@@ -526,7 +482,7 @@ class App extends React.Component {
<IconfontD code={"iconhometabbar-home-unselect"} style={{ fontSize: 48 }} /> <IconfontD code={"iconhometabbar-home-unselect"} style={{ fontSize: 48 }} />
} }
selectedIcon={ selectedIcon={
<IconfontD code={"iconhometabbar-home-selected"} style={{ fontSize: 48 }} /> <IconfontD code={"iconhometabbar-home-selected"} style={{ fontSize:48,color:'#E05540'}} />
} }
selected={this.state.selectedTab === 'menuhome'} selected={this.state.selectedTab === 'menuhome'}
onPress={() => { onPress={() => {
...@@ -548,7 +504,7 @@ class App extends React.Component { ...@@ -548,7 +504,7 @@ class App extends React.Component {
<IconfontD code={"iconhometabbar-training-unselect"} style={{ fontSize: 48 }} /> <IconfontD code={"iconhometabbar-training-unselect"} style={{ fontSize: 48 }} />
} }
selectedIcon={ selectedIcon={
<IconfontD code={"iconhometabbar-training-selected"} style={{ fontSize: 48 }} /> <IconfontD code={"iconhometabbar-training-selected"} style={{fontSize:48,color:'#E05540'}} />
} }
title={<span>{intl.get("TrainingProgram2") || "活动"}</span>} title={<span>{intl.get("TrainingProgram2") || "活动"}</span>}
key="train" key="train"
...@@ -565,53 +521,6 @@ class App extends React.Component { ...@@ -565,53 +521,6 @@ class App extends React.Component {
</TabBar.Item> </TabBar.Item>
) )
} }
if (data.id == '3' && data.checked) {
return (
<TabBar.Item
style={{ visibility: 'hidden' }}
hidden={tabInfo[2] && tabInfo[2].checked}
icon={
<IconfontD code={"iconhometabbar-course-unselect"} style={{fontSize:48}}/>
}
selectedIcon={
<IconfontD code={"iconhometabbar-course-selected"} style={{fontSize:48}}/>
}
title={<span>{intl.get("Course") || '课程'}</span>}
key="course"
selected={this.state.selectedTab === 'menucourse'}
onPress={() => {
this.setState({
selectedTab: 'menucourse',
});
hashHistory.push(func.routerBefore() + '/menucourse')
}}
>
</TabBar.Item>
)
}
if (data.id == '4' && data.checked) {
return (
<TabBar.Item
hidden={tabInfo[3] && tabInfo[3].checked}
icon={
<IconfontD code={"iconhometabbar-marketing-unselect"} style={{fontSize:48}}/>
}
selectedIcon={
<IconfontD code={"iconhometabbar-marketing-selected"} style={{fontSize:48}}/>
}
title={<span>{intl.get("PublishKey131") || "营销"}</span>}
key="menumarket"
selected={this.state.selectedTab === 'menumarketing'}
onPress={() => {
this.setState({
selectedTab: 'menumarketing',
});
hashHistory.push(func.routerBefore() + '/menumarketing')
}}
>
</TabBar.Item>
)
}
if (data.id == '5' && data.checked) { if (data.id == '5' && data.checked) {
return ( return (
<TabBar.Item <TabBar.Item
...@@ -620,7 +529,7 @@ class App extends React.Component { ...@@ -620,7 +529,7 @@ class App extends React.Component {
<IconfontD code={"iconhometabbar-mine-unselect"} style={{fontSize:48}}/> <IconfontD code={"iconhometabbar-mine-unselect"} style={{fontSize:48}}/>
} }
selectedIcon={ selectedIcon={
<IconfontD code={"iconhometabbar-mine-selected"} style={{fontSize:48}}/> <IconfontD code={"iconhometabbar-mine-selected"} style={{fontSize:48,color:'#E05540'}}/>
} }
title={<span>{intl.get("QuicklinkMyStudy") || "我的"}</span>} title={<span>{intl.get("QuicklinkMyStudy") || "我的"}</span>}
key="me" key="me"
......
src/components/Training/TrainingSteps/TrainingSteps copy.jsx deleted 100644 → 0
import React, { Component, Fragment } from 'react';
import { Icon, List } from 'antd';
import {
Accordion,
ListView,
Modal,
Tabs,
TextareaItem,
Toast,
} from 'antd-mobile';
import API from '../../../util/urlconfig';
import { Sticky, StickyContainer } from 'react-sticky';
import MediaDisplay from '../../../common/mediaDisplay/index';
import trainExam from '../../../image/train-exam.png';
import trainHomeowrk from '../../../image/train-homework.png';
import trainLesson from '../../../image/train-lesson.png';
import trainSurvery from '../../../image/train-survey.png';
import trainVote from '../../../image/train-vote.png';
import trainSign from '../../../image/train-sign.png';
import trainCer from '../../../image/train-cer.png';
import trainLink from '../../../image/train-link.png';
import trainOffline from '../../../image/train-offline.png';
import trainLive from '../../../image/train-live.png';
import trainExamGray from '../../../image/train-exam-gray.png';
import trainHomeowrkGray from '../../../image/train-homework-gray.png';
import trainLessonGray from '../../../image/train-lesson-gray.png';
import trainSurveryGray from '../../../image/train-survey-gray.png';
import trainVoteGray from '../../../image/train-vote-gray.png';
import trainSignGray from '../../../image/train-sign-gray.png';
import trainLinkGray from '../../../image/train-link-gray.png';
import blackPage from '../../../common/mediaDisplay/black-bg.png';
import inCompleteIcon from './train-in-complete-icon.png';
import progressIcon from './train-progress-icon.png';
import completeIcon from './train-complete-icon.png';
import trainComment from './comment-icon.jpg';
import trainCommentReplay from '../../../image/train-comment.png';
import trainCase from '../../../image/train-case.png';
import tarinData from '../../../image/train-data.png';
import forumIcon from '../../../image/forumIcon2.png';
import intl, { init } from "react-intl-universal";
import { hashHistory } from 'react-router';
import FontAwesome from 'react-fontawesome';
import './index.less';
import moment from 'moment';
import { connect } from 'react-redux';
import * as TrainingStepsAction from './TrainingStepsAction';
import func from '../../../util/commonFunc';
import { Circle } from 'rc-progress';
import SecListView from '../../common/listview/secListView';
import ReactEcharts from 'echarts-for-react';
import $ from 'jquery';
import Footer from '../../../common/footer/footer';
import zan from '../../../image/zan.png';
import alreadyzan from '../../../image/alreadyzan.png';
import myIcon from '../../../image/my.png';
import jumpToLive from '../../../util/jumpToLive';
import DataLibraryList from './trainningDataLibrary/DataLibraryList';
import certificateIcon
from '../../course/courseplay/plugin/courseFooter/certificateIcon.png';
import location from './signing-location.png';
const TabPane = Tabs.TabPane;
class TrainingSteps extends Component {
constructor(props) {
super(props);
const ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 });
this.state = {
displayProgress: false,
courseInfo: 'IC1金融法规与银行从业人员职业操守认证考试试题20170901项目名称项目名称项目名称项...', //课程信息
successTimer: '2018-02-28 至 2018-03-28', //报名成功时间
successTxt: '开始时间:', //开始时间
learningCountTxt: '总学习时长', //学习时长
hour: '10', //总共小时
minute: '30', //总共分钟
loading: false,
visible: false,
confirmLoading: false,
commitContent: '',
currentType: 1,
//showEnroll :0评论 >=1:报名 （具体处理到下周接口出来）
showEnroll: 1,
showComment: false,
comment: '',
dataSource: ds,
isLoading: false,
commentType: 1,
replyCommentTypeId: 0,
hiddenUp: false,
showProgress: true,
defaultTabKey: '1',
trainLogoHeight: 400,
commentHasMore: true,
showContentOccupy: false,
isNative: false,
enablePosition: 0,
refreshTrainComment: ""
};
this.tabClick = this.tabClick.bind(this);
this.logoHeightListen = this.logoHeightListen.bind(this);
this.contentDomHeightSetForSticky = this.contentDomHeightSetForSticky.bind(
this
);
}
componentWillMount() {
const { tabkey } = this.props.location.query;
this.setState({
defaultTabKey: tabkey ? tabkey + '' : '1',
});
}
componentDidMount() {
let _this = this;
if (parseInt(terminalMp) == 0 || parseInt(terminalMp) == 1) {
console.log("原生", terminalMp)
_this.setState({ isNative: true })
}
this.logoHeightListen();
this.props.initailData();
let { id, finished, tabkey } = this.props.location.query;
let params = {
id: id,
};
this.props.trainStepsData(finished, params, () => {
let { introductionVo } = _this.props.TrainingStepsReducer;
let { needEnroll, needAudit, hasEnrolled, audited, enablePosition, enableSign } = introductionVo;
console.log("did-introductionVo", introductionVo)
_this.setState({
showProgress: this.showProgressJudge(
needEnroll,
hasEnrolled,
needAudit,
audited
),
enablePosition,
enableSign,
});
if (!tabkey) {
if (eval(finished) == true) {
} else if (
introductionVo.auditStatus == 2 ||
(!introductionVo.needAudit && introductionVo.hasEnrolled)
) {
_this.setState({
defaultTabKey: '2',
});
}
}
_this.contentDomHeightSetForSticky();
});
this.setState({
isLoading: true,
});
this.props.reviewListData(
{ ...params, pageNo: 1, pageSize: 10 },
false,
() => {
const {
reviewListTotle,
reviewPageNo,
reviewListData,
} = _this.props.TrainingStepsReducer;
this.setState({
isLoading: false,
commentHasMore: (reviewPageNo - 2) * 10 + reviewListData.length <
reviewListTotle
? true
: false,
});
}
);
func.changeDocumentTitle(intl.get("TrainingProgram2") || '项目');
}
logoHeightListen() {
this.setState({
trainLogoHeight: document.body.clientWidth * (225 / 375),
});
}
contentDomHeightSetForSticky() {
let domHeight = document.getElementById('train-contain-list-sticky-div')
.offsetHeight;
let bodyHeight = document.body.clientHeight;
if (
bodyHeight - (domHeight + 88) < 50 &&
bodyHeight - (domHeight + 88) > 0
) {
this.setState({
showContentOccupy: true,
});
}
}
showProgressJudge(needEnroll, hasEnrolled, needAudit, audited) {
if (needEnroll) {
if (hasEnrolled) {
if (needAudit) {
if (audited) {
return true;
} else {
return false;
}
} else {
return true;
}
} else {
return false;
}
} else {
return true;
}
}
onLoadMore = () => {
let { id } = this.props.location.query;
let _this = this;
let { reviewPageNo } = this.props.TrainingStepsReducer;
let params = {
id: id,
};
if (this.state.isLoading) {
return;
}
if (!this.state.commentHasMore) {
return;
}
this.setState({
isLoading: true,
});
this.props.reviewListData(
{ ...params, pageNo: reviewPageNo, pageSize: 10 },
true,
() => {
const {
reviewListTotle,
reviewPageNo,
reviewListData,
} = _this.props.TrainingStepsReducer;
this.setState({
isLoading: false,
commentHasMore: (reviewPageNo - 2) * 10 + reviewListData.length <
reviewListTotle
? true
: false,
});
}
);
};
goToBuy = ()=>{
let { id } = this.props.location.query;
hashHistory.push({
pathname: func.routerBefore() + '/settleAccounts',
query: { id: id },
});
}
showInputView = () => {
console.log('出现');
this.setState({ showEnroll: 0 });
};
hiddenInputView = () => {
if (this.state.commitContent == '') {
this.setState({ showEnroll: 1 });
}
};
//提交评论
trainCommitVerb = () => {
if (!this.state.commitContent) {
Toast.info(intl.get("PublishKey73") || '评论不能为空');
return;
}
let _this = this;
if (this.state.commentType == 1) {
let { id } = this.props.location.query;
let param = { trainingProjectId: id, content: this.state.commitContent };
this.props.commitVerb(param, () => {
this.setState({ commitContent: '' });
let params = {
id: id,
};
this.props.reviewListData({ ...params, pageNo: 1, pageSize: 10 }, false, () => {
_this.setState({
refreshTrainComment: new Date().getTime()
})
});
});
this.setState({ showEnroll: 1, showComment: false });
} else if (this.state.commentType == 2) {
let { id } = this.props.location.query;
let param = {
trainingProjectId: id,
tpCommentId: this.state.replyCommentTypeId,
content: this.state.commitContent,
};
this.props.reviewReplyCommit(param, () => {
this.setState({ commitContent: '' });
let params = {
id: id,
};
this.props.reviewListData(
{ ...params, pageNo: 1, pageSize: 10 },
false,
() => {
this.setState({
isLoading: false,
});
}
);
Toast.info(intl.get("CommentSuccess") || '评论成功');
});
this.setState({ showEnroll: 1, showComment: false });
}
};
tabClick(tabs, tab) {
console.log(tabs, tab,'```````````````````````111111111111111111',this.props.location.pathname)
if (Number(tab) == tabs.length) {
this.setState({ hiddenUp: true });
} else {
this.setState({ hiddenUp: false });
}
let { query } = this.props.location;
query.tabkey = parseInt(tab);
this.setState({
defaultTabKey: String(tab),
});
hashHistory.replace({
pathname: this.props.location.pathname,
query: this.props.location.query,
});
}
renderTabBar = (props) => {
return <Tabs.DefaultTabBar {...props} />;
}
renderContent = (tab) => {
let i = parseInt(tab.key) - 1;
let {
introductionVo = {},
hasEnrolled,
contentVo,
reviewListData,
isMore,
reviewListTotle,
progressVo,
} = this.props.TrainingStepsReducer;
let { visible, confirmLoading, showEnroll } = this.state;
let { finished, id } = this.props.location.query;
let loadMore = isMore
? <button className="load-more" onClick={() => this.onLoadMore()}>
{intl.get("PublishKey74") || "点击加载更多"}
</button>
: <button className="load-more">{intl.get("PublishKey30") || "没有更多数据"}</button>;
let enrollEnable = !hasEnrolled;
let enrollTitle = enrollEnable ? intl.get("msg.immediately.enroll") || "立即报名" : intl.get("ApplyNotStarted") || "报名未开始";
let now = new Date();
let number = Number(now);
let signUpEnable = false;
let signUpShow = false;
let signUpTitle = intl.get("msg.immediately.enroll") || '立即报名';
let signUpColor = '#999999';
//判断底部报名按钮状态，是否显示，及标题颜色，是否允许点击
if (introductionVo) {
if (introductionVo.needEnroll) {
//需要报名-- 判断是否已报名
signUpShow = true;
if (introductionVo.hasEnrolled) {
//已报名
if (introductionVo.audited) {
//已审核
if (introductionVo.auditStatus == 2) {
//审核通过
signUpShow = false;
signUpTitle = intl.get("PublishKey70") || '报名成功';
signUpEnable = false;
} else if (introductionVo.auditStatus == 3) {
//审核未通过
signUpShow = true;
signUpColor = '#EA554E';
signUpTitle = intl.get('PublishKey75') || '报名未通过';
signUpEnable = false;
}
} else {
if (introductionVo.auditStatus == 1) {
//待审核
signUpShow = true;
signUpTitle = intl.get('msg.audit.ing') || '报名审核中';
signUpColor = '#54C246';
signUpEnable = false;
} else if (introductionVo.auditStatus == 0) {
//不需要审核
signUpShow = false;
}
}
} else {
//未报名
signUpShow = true;
if (number > introductionVo.enroll.endTime) {
//报名结束
signUpEnable = false;
signUpTitle = intl.get('ApplyExpired') || '报名已结束';
signUpColor = '#999999';
} else if (number < introductionVo.enroll.startTime) {
//报名未开始
signUpEnable = false;
signUpTitle = intl.get('ApplyNotStarted') || '报名未开始';
signUpColor = '#999999';
} else {
//正常报名 -- 判断人数条件
if (
introductionVo.enrollLimit == 0 ||
introductionVo.enrollLimit == '' ||
introductionVo.enrollLimit > introductionVo.hasEnrolledNum
) {
//人数无限制
signUpEnable = true;
signUpTitle = intl.get('enjoin') || '立即报名';
signUpColor = '#4285F4';
} else if (
introductionVo.enrollLimit <= introductionVo.hasEnrolledNum
) {
//报名人额已满
signUpEnable = false;
signUpTitle = intl.get('msg.quota.full') || '名额已满';
signUpColor = '#EA554E';
}
}
}
} else {
//没有报名
signUpShow = false;
}
}
this.state.dataSource = this.state.dataSource.cloneWithRows(
this.props.TrainingStepsReducer.reviewListData
);
return <Fragment>
{eval(finished) == true
? //完成时显示统计
i == 0
? this.renderPlan(progressVo, introductionVo)
: i == 1
? this.renderIntroduction(introductionVo)
: i == 2
? this.renderContain(contentVo)
: i == 3
? this.renderDataLibraryList(id)
: i == 4
? this.renderComment(
reviewListData,
loadMore
)
: ''
: //不完成时不显示统计
i == 0
? this.renderIntroduction(introductionVo)
: i == 1
? this.renderContain(contentVo)
: i == 2
? this.renderDataLibraryList(id)
: i == 3
? this.renderComment(
reviewListData,
loadMore
)
: ''}
</Fragment>
}
render() {
let {
introductionVo = {},
hasEnrolled,
contentVo,
reviewListData,
isMore,
reviewListTotle,
progressVo,
} = this.props.TrainingStepsReducer;
let { visible, confirmLoading, showEnroll } = this.state;
let { finished, id } = this.props.location.query;
let loadMore = isMore
? <button className="load-more" onClick={() => this.onLoadMore()}>
{intl.get('PublishKey74') || "点击加载更多"}
</button>
: <button className="load-more">{intl.get('PublishKey30') || "没有更多数据"}</button>;
let enrollEnable = !hasEnrolled;
let enrollTitle = enrollEnable ? intl.get('msg.immediately.enroll') || '立即报名' : intl.get('ApplyNotStarted') || '报名未开始';
let now = new Date();
let number = Number(now);
let signUpEnable = false;
let signUpShow = false;
let signUpTitle = intl.get('msg.immediately.enroll') || '立即报名';
let signUpColor = '#999999';
//判断底部报名按钮状态，是否显示，及标题颜色，是否允许点击
if (introductionVo) {
if (introductionVo.needEnroll) {
//需要报名-- 判断是否已报名
signUpShow = true;
if (introductionVo.hasEnrolled) {
//已报名
if (introductionVo.audited) {
//已审核
if (introductionVo.auditStatus == 2) {
//审核通过
signUpShow = false;
signUpTitle = intl.get('PublishKey70') || '报名成功';
signUpEnable = false;
} else if (introductionVo.auditStatus == 3) {
//审核未通过
signUpShow = true;
signUpColor = '#EA554E';
signUpTitle = intl.get('PublishKey75') || '报名未通过';
signUpEnable = false;
}
} else {
if (introductionVo.auditStatus == 1) {
//待审核
signUpShow = true;
signUpTitle = intl.get('msg.audit.ing') || '报名审核中';
signUpColor = '#54C246';
signUpEnable = false;
} else if (introductionVo.auditStatus == 0) {
//不需要审核
signUpShow = false;
}
}
} else {
//未报名
signUpShow = true;
if (number > introductionVo.enroll.endTime) {
//报名结束
signUpEnable = false;
signUpTitle = intl.get('ApplyExpired') || '报名已结束';
signUpColor = '#999999';
} else if (number < introductionVo.enroll.startTime) {
//报名未开始
signUpEnable = false;
signUpTitle = intl.get('ApplyNotStarted') || '报名未开始';
signUpColor = '#999999';
} else {
//正常报名 -- 判断人数条件
if (
introductionVo.enrollLimit == 0 ||
introductionVo.enrollLimit == '' ||
introductionVo.enrollLimit > introductionVo.hasEnrolledNum
) {
//人数无限制
signUpEnable = true;
signUpTitle = intl.get('enjoin') || '立即报名';
signUpColor = '#4285F4';
} else if (
introductionVo.enrollLimit <= introductionVo.hasEnrolledNum
) {
//报名人额已满
signUpEnable = false;
signUpTitle = intl.get('msg.quota.full') || '名额已满';
signUpColor = '#EA554E';
}
}
}
} else {
//没有报名
signUpShow = false;
}
}
this.state.dataSource = this.state.dataSource.cloneWithRows(
this.props.TrainingStepsReducer.reviewListData
);
let tabsData = [];
//tabs适配，因为antd-mobile版本原因，Tabs组件定制表头api无法使用,所以根据className更改样式满足功能
tabsData = [
{
key: '1',
title: (
<Sticky>
{({ style, distanceFromTop }) => {
return <span className="tabspan" >{intl.get('Overview') || "简介"}</span>;
}}
</Sticky>
),
},
{
key: '2',
title: (
<Sticky>
{({ style, distanceFromTop }) => {
return <span className="tabspan" >{intl.get('PublishKey56') || "内容"}</span>;
}}
</Sticky>
),
},
{
key: '3',
title: (
<Sticky>
{({ style, distanceFromTop }) => {
return <span className="tabspan" >{intl.get('document') || "资料"}</span>;
}}
</Sticky>
),
},
{
key: '4',
title: (
<Sticky>
{({ style, distanceFromTop }) => {
if (distanceFromTop < 0) {
let tab = document.getElementsByClassName('am-tabs-default-bar')[0];
tab.style.top = '0px';
tab.style.width = '100%';
tab.style.position = 'fixed';
} else if (distanceFromTop >= 0) {
let tab = document.getElementsByClassName('am-tabs-default-bar')[0];
tab.style.top = '';
tab.style.width = '';
tab.style.position = '';
}
return <span className="tabspan" >{intl.get('Comment') || "评论"}({reviewListTotle})</span>;
}}
</Sticky>
),
},
];
//如果完成则显示统计
if (eval(finished) == true) {
tabsData = tabsData.map((item, index) => {
return {
key: String(parseInt(item.key) + 1),
title: item.title
}
});
tabsData.unshift({
key: "1",
title: (
<Sticky>
{({ style, distanceFromTop }) => {
return <span className="tabspan" >{intl.get('PublishKey76') || "统计"}</span>;
}}
</Sticky>
),
});
}
console.log(tabsData, this.state.defaultTabKey);
return (
<div
className="train-contain"
style={{ backgroundColor: '#f4f4f4', width: '100%', height: '100%' }}
>
<div
className="train-logo"
style={{ height: this.state.trainLogoHeight }}
>
<img
id="train-logo-image"
style={{ height: this.state.trainLogoHeight }}
src={introductionVo && introductionVo.logoImg}
alt=""
/>
{
this.state.isNative && this.state.enablePosition == 1 ?
<div className={"signing_location_container"} onClick={this.jumpToSigningLocation}>
<div className={"signing_icon_container"}>
<img src={location} className={"signing_icon"} />
</div>
<div className={"signing_location_text"}>{intl.get('CheckIn') || "签到"}</div>
</div>
: null
}
</div>
<div style={{ width: '100%', marginTop: 0 }}>
<StickyContainer>
<Tabs
page={this.state.defaultTabKey}
swipeable={false}
pageSize={5}
style={{ marginBottom: signUpShow ? '0.75rem' : '0px' }}
onTabClick={tab => {
console.log(tab,'22222222222222222222222~~~~~~~~~~~~~')
this.tabClick(tabsData, tab.key);
}}
tabs={tabsData}
renderTabBar={(props) => this.renderTabBar(props)}
>
{this.renderContent}
</Tabs>
</StickyContainer>
</div>
{this.state.hiddenUp
? ''
: '' ||
introductionVo && introductionVo.enablePay == 1 ?
!introductionVo.hasEnrolled ?
<Fragment>
<div style={{ width: "100%", height: 128 }}></div>
<div className="train-pay-button-container">
<div className="train-pay-button" onClick={this.goToBuy}>
{intl.get("buy") || "购买"}:
<span className="train-actualPrice">
{introductionVo.actualPrice || 0}
</span>
{window.virtualCurrencyUnit}
{
parseInt(introductionVo.originalPrice || 0) > 0 ?
<span className="train-originalPrice">
{introductionVo.originalPrice || 1}{window.virtualCurrencyUnit}
</span> : ""
}
</div>
</div>
</Fragment> : ""
:
<Fragment>
<div style={{ width: "100%", height: 88 }}></div>
<div
disabled={signUpEnable ? true : false}
style={{
display: signUpShow ? 'block' : 'none',
backgroundColor: signUpColor,
}}
type="primary"
className="signup-button"
onClick={() => {
if (signUpEnable) {
this.handleOk(tabsData);
}
}}
>
{signUpTitle}
</div>
</Fragment>
}
</div>
);
}
//报表
renderPlan = (planData, introductionVo) => {
let xArr = [], yArr = [], dataArr = [];
if (planData.courseRecentVos) {
planData.courseRecentVos.map((rowData, index) => {
let introStartTime = moment(rowData.date)
.format('YYYY-MM-DD HH:ss')
.substring(5, 10);
xArr.push(introStartTime);
let second = Number(rowData.seconds);
dataArr.push(Math.floor(second / 60));
});
}
var option = {
title: {
text: intl.get("PublishKey77") || '最近7天的学习时长 (单位:分钟)',
},
tooltip: {},
xAxis: {
data: xArr,
},
yAxis: {},
series: [
{
type: 'bar',
data: dataArr,
},
],
};
// 使用刚指定的配置项和数据显示图表。
// myChart.setOption(option);
if (!introductionVo) return;
let startTime = moment(introductionVo.startTime).format('YYYY-MM-DD');
let endTime = moment(introductionVo.endTime).format('YYYY-MM-DD');
let totleLearn = Number(planData.totalStudySeconds);
let learnHour = parseInt(totleLearn / 3600);
let learnMin = parseInt(totleLearn % 3600 / 60);
return (
<div style={{ paddingBottom: '0.5rem', backgroundColor: 'white' }}>
<div className="train-info-view">
<div className="train-info">
<p>{introductionVo.name}</p>
<div style={{ marginTop: '20px' }}>
<span>{intl.get("TrainingTime") || "项目时间"}: </span>
<span>{`${startTime} ${intl.get("To") || "至"} ${endTime}`}</span>
</div>
</div>
<div className="segement" />
</div>
<div className="train-plan-studytime">
<span>{intl.get("TotalLearnTime") || "总学习时长"}</span>
<div>
<span style={{ color: '#4285F4 ' }}>{learnHour}</span><span>{intl.get("Hours") || "小时"}</span>
<span style={{ color: '#4285F4 ' }}>{learnMin}</span><span>{intl.get("Pts") || "分"}</span>
</div>
</div>
<div style={{ paddingLeft: 26, paddingRight: 26 }}>
<ReactEcharts style={{ fontSize: 30 }} option={option} />
</div>
<div>
<div className="train-plan-row">
<div className="train-plan-cell">
<div>{this.itemIcon(0, 1)}<span>{intl.get("Course") || "课程"}</span></div>
<div>
<span style={{ color: '#4285F4 ' }}>{planData.totalCourse}</span>
{' '}
<span>门</span>
</div>
</div>
<div className="train-plan-cell">
<div>{this.itemIcon(1, 1)}<span>{intl.get("Exam") || "考试"}</span></div>
<div>
<span style={{ color: '#4285F4 ' }}>{planData.totalExam}</span>
{' '}
<span>门</span>
</div>
</div>
</div>
<div className="train-plan-row">
<div className="train-plan-cell">
<div>{this.itemIcon(5, 1)}<span>{intl.get("Assignment") || "作业"}</span></div>
<div>
<span style={{ color: '#4285F4 ' }}>
{planData.totalAssignment}
</span>
{' '}
<span>门</span>
</div>
</div>
<div className="train-plan-cell">
<div>{this.itemIcon(8, 1)}<span>{intl.get("CheckIn") || "签到"}</span></div>
<div>
<span style={{ color: '#4285F4 ' }}>{planData.totalSign}</span>
{' '}
<span>门</span>
</div>
</div>
</div>
<div className="train-plan-row">
<div className="train-plan-cell">
<div>{this.itemIcon(2, 1)}<span>{intl.get("Research") || "调研"}</span></div>
<div>
<span style={{ color: '#4285F4 ' }}>
{planData.totalResearch}
</span>
{' '}
<span>{intl.get("men") || "门"}</span>
</div>
</div>
{/* <div className='train-plan-cell'>
<div>{this.itemIcon(4, 1)}<span>投票</span></div>
<div><span style={{color: '#4285F4 '}}>{planData.totalVote}</span> <span>门</span></div>
</div>
*/}
<div className="train-plan-cell" style={{ background: '#fff' }}>
<div><span /></div>
<div><span /> <span /></div>
</div>
</div>
</div>
</div>
);
};
//简介
renderIntroduction = introductionVo => {
let now = new Date();
let number = Number(now);
let signUpEnable = false;
let signUpShow = false;
let signUpTitle = '立即报名';
let startTime = moment(introductionVo && introductionVo.startTime).format(
'YYYY-MM-DD'
);
let endTime = moment(introductionVo && introductionVo.endTime).format(
'YYYY-MM-DD'
);
let { reviewListTotle } = this.props.TrainingStepsReducer;
// console.log('========================================');
let introStartTime = moment(
introductionVo && introductionVo.enroll.startTime
).format('YYYY-MM-DD HH:mm');
let introEndTime = moment(
introductionVo && introductionVo.enroll.endTime
).format('YYYY-MM-DD HH:mm');
$('#train-marketId video').each((index, item) => {
$(item)
.attr('controls', true)
.attr('preload', true)
.css('width', '100%')
.attr('poster', blackPage);
});
$('#train-marketId audio').each((index, item) => {
$(item)
.attr('controls', true)
.css('width', '100%')
.attr('preload', true);
});
$('#train-marketId img').each((index, item) => {
$(item).css('width', '100%');
});
return (
<div id="train-marketId" style={{ height: '100%', zIndex: 999 }}>
<div
className="train-header"
style={{
// 简介内容为空不需要设置样式 任务919
paddingBottom: introductionVo && !introductionVo.description.trim()
? 0
: '0.5rem',
}}
>
{/*课程信息*/}
<div className="train-info-view">
<div className="train-info">
<p>{introductionVo && introductionVo.name}</p>
<div style={{ marginTop: '20px' }}>
<span>{intl.get("TrainingTime") || "项目时间"}: </span>
<span>{`${startTime} ${intl.get("To") || "至"} ${endTime}`}</span>
</div>
{introductionVo &&
introductionVo.enablePoint &&
<div style={{ marginTop: '8px' }}>
<span>
{intl.get("ProjectPoint") || "项目积分"}:
<span style={{ marginLeft: '3px' }}>
{introductionVo.point}
</span>
</span>
</div>}
{introductionVo &&
introductionVo.trainingDurationShow &&
<div>
<span>
{intl.get("period") || "学时"}:
<span style={{ marginLeft: '3px' }}>
{introductionVo.period}
</span>
</span>
</div>}
</div>
<div className="segement-slider" />
</div>
{/*项目介绍*/}
{String(introductionVo && introductionVo.description) === '' ||
(introductionVo && introductionVo.description === null) ||
!introductionVo
? null
: // 简介内容为空不追加product-info-view 任务919
introductionVo && !introductionVo.description.trim()
? null
: <div>
<div className="product-info-view">
<div className="train-info-view">
<div className="train-info">
<div>
<List className="train-info-contain">
<List.Item>
<MediaDisplay
width={document.body.clientWidth - 80}
content={introductionVo.description}
/>
</List.Item>
</List>
</div>
</div>
</div>
</div>
<div className="segement" />
</div>}
{/*项目须知*/}
{introductionVo && introductionVo.needEnroll
? <div className="train-info-view">
<div className="train-up-info">
<p style={{ fontSize: '0.32rem', paddingBottom: '0.1rem' }}>
{intl.get("ApplyNotice") || "报名须知"}
</p>
{introductionVo &&
<div>
<p
>{`${intl.get("PublishKey78") || '项目名额'}：${introductionVo && introductionVo.enroll.limit ? introductionVo && introductionVo.enroll.limit + intl.get("People") || '人' : intl.get('PublishKey79') || '无限制'} `}</p>
<p>
{intl.get('ApplyTime') || '报名时间'}：
{`${introStartTime && introStartTime} ${intl.get("To") || "至"} ${introEndTime && introEndTime}`}
</p>
<div style={{ display: 'flex' }}>
<p style={{ minWidth: '120px' }}>{intl.get("PublishKey80") || "注意事项"}：</p>
<p
dangerouslySetInnerHTML={{
__html: introductionVo &&
introductionVo.enroll.notice.replace(
/\r?\n/g,
'</br>'
),
}}
/>
</div>
</div>}
</div>
</div>
: null}
</div>
<Footer
page={{ pageTotle: 5 }}
currentNumber={10}
isLoading={false}
isEnd={true}
footText={intl.get('PublishKey47') || '没有更多了'}
/>
</div>
);
};
//内容
renderContain = contentVo => {
let { introductionVo } = this.props.TrainingStepsReducer;
let now = new Date().getTime();
//判断内容显示状态
let isStarted = false;
if (introductionVo) {
if (introductionVo.needEnroll) {
//需要报名-- 判断是否已报名
if (introductionVo.hasEnrolled) {
//已报名
if (introductionVo.audited) {
//已审核
} else {
if (introductionVo.auditStatus == 1) {
//待审核
} else if (introductionVo.auditStatus == 2) {
//审核通过
if (introductionVo.startTime < now) {
isStarted = true;
}
} else if (introductionVo.auditStatus == 3) {
//审核未通过
} else if (introductionVo.auditStatus == 0) {
//不需要审核
}
}
} else {
//未报名
}
} else {
//没有报名
if (introductionVo.startTime < now) {
isStarted = true;
}
}
}
let id = this.props.location.query.id;
let activeKeyGroup = contentVo.plans.map((item, index) => {
return item.id;
});
//图标没写完
return (
<div
className="train-contain-list"
id={'train-contain-list-sticky-div'}
style={{ marginBottom: '0.5rem', backgroundColor: 'white' }}
>
<Accordion activeKey={activeKeyGroup}>
{contentVo.plans.map((acItem, index) => {
let startTime = moment(acItem.startTime).format('YYYY-MM-DD');
let endTime = moment(acItem.endTime).format('YYYY-MM-DD');
let header = (
<div className="train-contain-header">
<div style={{ position: 'relative', paddingRight: 100 }}>
{`${acItem.name}`}
{this.state.showProgress
? <div className={'train-progress-count'}>
{acItem.percentageOfCompletion}
</div>
: ''}
</div>
<div
style={{
width: '100%',
position: 'relative',
paddingRight: 200,
}}
>
{`${intl.get('PlanTime') || '学习时间'}：${startTime} ${intl.get("To") || "至"} ${endTime}`}
<div className="train-compete-tag">
{acItem.toFinishedActivityIds.length != 0
? acItem.toFinishedActivityIds.length + intl.get("ContentRequired") || '个必修活动'
: acItem.toFinishedActivityNum == 0
? intl.get("FinishAllContentNotice") || '需完成全部活动'
: (intl.get('AtLeastFinish1') || '至少完成') + acItem.toFinishedActivityNum + (intl.get('AtLeastFinish2') || '个活动')}
</div>
</div>
</div>
);
return (
<Accordion.Panel header={header} key={acItem.id}>
<List>
{acItem.activities.map((item, index) => {
//计划是否开始---》（具体活动）计划内活动是否开始----》活动状态
if (item.type == 14) {
item.status = 'none'; // 帖子不需要状态；
}
let statuSub = item.status == '未导入'
? <div className={'train-content-status-cell'}>
<img
src={inCompleteIcon}
alt=""
className="train-in-complete-icon"
/>
<br />
<span style={{ fontSize: 20, color: '#999' }}>
{"(" + intl.get('data.not.imported') + ")" || '(数据未导入)'}
</span>
</div>
: item.status == '已完成'
? <div className={'train-content-status-cell'}>
<img
src={completeIcon}
alt=""
className="train-complete-icon"
/>
<br />
{acItem.toFinishedActivityIds.indexOf(item.id) !=
-1
? <span
style={{
fontSize: 20,
color: '#999',
}}
>
({item.type == 10 ? item.status : '必修'})
</span>
: <span
style={{
fontSize: 20,
color: item.type == 10
? '#999'
: 'transparent',
}}
>
({item.status})
</span>}
</div>
: item.status == '未完成' && item.type == 10
? <div className={'train-content-status-cell'}>
<img
src={inCompleteIcon}
alt=""
className="train-in-complete-icon"
/>
<br />
<span
style={{
fontSize: 20,
color: '#999',
}}
>
({item.status})
</span>
</div>
: acItem.toFinishedActivityIds.indexOf(
item.id
) != -1
? <div
className={'train-content-status-cell'}
>
{item.status == '进行中'
? <img
src={progressIcon}
alt=""
className="train-progress-icon"
/>
: <img
src={inCompleteIcon}
alt=""
className="train-in-complete-icon"
/>}
<br />
<span
style={{
fontSize: 20,
color: '#999',
}}
>
{intl.get('RequiredTag') || '(必修)'}
</span>
</div>
: item.status == '进行中'
? <div
className={
'train-content-status-cell'
}
>
<img
src={progressIcon}
alt=""
className="train-progress-icon"
/>
<br />
<span
style={{
fontSize: 20,
color: 'transparent',
}}
>
({item.status})
</span>
</div>
: item.status == '已获得'
? <span
className="tip-text"
style={{}}
>
{intl.get('certificate.has.obtained') || '已获取证书'}
</span>
: item.status == '未获得'
? <span
className="tip-text"
style={{}}
>
{intl.get('get.the.certificate') || '获取证书'}
</span>
: item.status == 'none'
? ''
: item.status
? <span className="tip-text">
{item.status}
</span>
: <div
className={
'train-content-status-cell'
}
>
<img
src={inCompleteIcon}
alt=""
className="train-in-complete-icon"
/>
<br />
<span
style={{
fontSize: 20,
color: 'transparent',
}}
>
{intl.get('PublishKey82') || '未知情况'}
</span>
</div>;
// let statuSub =isStarted?acItem.started?item.started?item.finished? <span className="tip-text-green" style={{}}>已完成</span>:<span className="tip-text">进行中</span> :'':'':'';
return (
<List.Item
key={index}
onClick={() => this.contentItemClick(acItem, item, id, contentVo)}
>
<div className="train-content-cell">
<div className="train-contain-listcell">
{this.itemIcon(item.type)}
<p
className="training-done-info-name"
style={{ marginBottom: 0, WebkitBoxOrient: 'vertical' }}
>{`${item.name}`}</p>
<img
style={{
display: item.hasCertificate ? 'block' : 'none',
}}
className={'certificate-icon'}
src={certificateIcon}
alt=""
/>
</div>
{this.state.showProgress ? statuSub : ''}
</div>
</List.Item>
);
})}
</List>
</Accordion.Panel>
);
})}
</Accordion>
<Footer
page={{ pageTotle: 5 }}
currentNumber={10}
isLoading={false}
isEnd={true}
footText={intl.get('PublishKey47') || '没有更多了'}
/>
{this.state.showContentOccupy
? <div style={{ height: 100, backgroundColor: '#f4f4f4' }} />
: ''}
</div>
);
};
// 资料
renderDataLibraryList = id => {
console.log('TrainingSteps-renderDataLibraryList-id', id);
let { introductionVo } = this.props.TrainingStepsReducer;
return (
<List style={{ height: '' }}>
<DataLibraryList relationId={id} data={introductionVo} />
</List>
);
};
//评论
renderComment = (reviewListData, loadMore) => {
let { reviewPageNo, reviewListTotle } = this.props.TrainingStepsReducer;
let row = (item, section, row) => {
let imgsrc = item.userAvatar == '' ? myIcon : item.userAvatar;
const imageStyle = {
backgroundImage: `url(${imgsrc})`,
backgroundPosition: 'center',
backgroundRepeat: 'no-repeat',
backgroundSize: 'contain',
};
return (
<div className="list-item-div">
<div className="list-item-img-box">
<div className="list-item-img" style={imageStyle} />
</div>
<div className="list-item-content">
<h2 className="item-title-style">{item.commentator}</h2>
<p
className="item-text-style"
dangerouslySetInnerHTML={{
__html: item.content.replace(/\r?\n/g, '</br>'),
}}
/>
<div className="item-footer-box">
<p className="item-time-style">
{item.createTime.length > 16
? item.createTime.substring(0, 16)
: item.createTime}
{' '}
</p>
<span
className="item-zhan-style"
style={{ marginLeft: '2rem' }}
onClick={() => this.reviewDetail(item)}
>
<span>{item.replys == '0' ? '0' : item.replys}</span>
<img
src={trainCommentReplay}
style={{ marginTop: 10 }}
className="cell-left-icon"
alt=""
/>
</span>
<span
className="item-zhan-style"
onClick={() => this.laudClick(item, row)}
>
<span>{item.thumbsUps}</span>
<img
src={String(item.status) === '1' ? alreadyzan : zan}
alt=""
/>
</span>
</div>
{item.tpCommentReplies.length > 0
? <div className="train-comment-replay">
<div>{item.tpCommentReplies[0].createByName}:</div>
<div
dangerouslySetInnerHTML={{
__html: item.tpCommentReplies[0].content.replace(
/\r?\n/g,
'</br>'
),
}}
/>
{item.tpCommentReplies.length > 1
? <div onClick={() => this.reviewDetail(item)}>
{`${intl.get('PublishKey83') || '查看全部'}${item.replys}${intl.get("PublishKey84") || '条回复'}>`}
</div>
: ''}
</div>
: ''}
</div>
</div>
);
};
return (
<div
className="train-comment"
style={{ paddingBottom: '1rem', backgroundColor: '#F4F4F4' }}
>
<div className="train-comment-contain">
<img src={trainComment} className="cell-left-icon" alt="" />
<div className="comment-slider" onClick={() => this.commentShow(1)}>
{' '}{intl.get('PublishKey85') || "说点什么吧~"}
</div>
</div>
<p style={{ padding: '0.3rem 0.2rem', fontSize: '0.3rem' }}>{intl.get('all_comment') || "全部评论"}</p>
{/* */}
<SecListView
key={this.state.refreshTrainComment}
dataSource={this.state.dataSource}
renderRow={row.bind(this)}
onEndReached={this.onLoadMore}
listStyle={50}
isLoading={this.state.isLoading}
page={{
pageTotal: reviewListTotle,
pageNo: reviewPageNo,
pageSize: 10,
}}
footText={intl.get('PublishKey47') || "没有更多了"}
/>
<Modal
title={intl.get('Comment') || "评论"}
visible={this.state.showComment}
transparent
maskClosable={false}
className={'train-comment-input'}
onClose={this.commentHidden}
footer={[
{
text: intl.get('Cancel') || "取消",
onPress: () => {
this.commentHidden();
},
},
{
text: intl.get('Yes') || '确定',
onPress: () => {
this.trainCommitVerb(1, 0);
},
},
]}
>
<div className="comment-body">
<TextareaItem
maxLength={800}
placeholder={intl.get('WriteComment') || "写评论"}
rows={4}
value={this.state.commitContent}
style={{ backgroundColor: 'clear' }}
onChange={txt => {
let value = txt;
if (value.length > 800) {
value = value.slice(0, 800);
}
this.setState({ commitContent: value });
}}
ref={el => (this.autoFocusInst = el)}
/>
</div>
</Modal>
</div>
);
};
reachEnd = () => { };
commentShow = (type, id) => {
//type=1为项目评论，2为项目评论回复
this.setState({
showComment: true,
commentType: type,
replyCommentTypeId: id,
});
};
commentHidden = () => {
this.setState({
showComment: false,
commitContent: '',
});
};
handleCancel = () => {
this.setState({
visible: false,
});
};
//确认报名
handleOk = tabs => {
let { id, finished } = this.props.location.query;
let params = {
id: id,
};
let _this = this;
let contentTab = 0;
tabs.map((item, index) => {
if (item.title == 'Second Tab') {
contentTab = index + 1;
}
return item;
});
this.props.lessonEnrollEvent(params, () => {
_this.props.trainStepsData(finished, params, () => {
let { introductionVo } = _this.props.TrainingStepsReducer;
let { needEnroll, needAudit, hasEnrolled, audited } = introductionVo;
_this.setState({
showProgress: _this.showProgressJudge(
needEnroll,
hasEnrolled,
needAudit,
audited
),
});
if (introductionVo.auditStatus == 2 || !introductionVo.needAudit) {
_this.tabClick(tabs, contentTab);
}
});
});
};
//报名
jumpComment = () => {
let arr = document.getElementsByClassName('list-item-div');
console.log(arr);
arr[0].scrollIntoView();
};
//列表item
reviewItem = item => {
let imgsrc = item.userAvatar == '' ? '' : item.userAvatar;
const imageStyle = {
backgroundImage: `url(${imgsrc})`,
backgroundPosition: 'center',
backgroundRepeat: 'no-repeat',
backgroundSize: 'contain',
};
return (
<List.Item>
<div className="list-item-div">
<div className="list-item-img-box">
<div className="list-item-img" style={imageStyle} />
</div>
<div className="list-item-content">
<h2 className="item-title-style">{item.commentator}</h2>
<p className="item-text-style">{item.content}</p>
<div className="item-footer-box">
<p className="item-time-style">
{item.createTime.length > 16
? item.createTime.substring(0, 16)
: item.createTime}
<button
className={
item.replys <= 0
? 'item-btn-style'
: 'item-btn-style-active'
}
onClick={() => {
this.reviewDetail(item);
}}
>{`${item.replys <= 0 ? '' : item.replys} ${intl.get('Reply') || '回复'}`}</button>
</p>
<button
className="item-zhan-style"
onClick={() => this.laudClick(item)}
>
<FontAwesome
className={
String(item.status) === '1'
? 'item-zhan-icon-active'
: 'item-zhan-icon'
}
style={{ fontSize: '0.3rem' }}
name="thumbs-up"
/>
{item.thumbsUps}
</button>
</div>
</div>
</div>
</List.Item>
);
};
reviewDetail = item => {
console.log(item);
// let time = moment(item.createTime).format("YYYY-MM-DD HH:hh:SS");
let time = moment(item.createTime).format('YYYY-MM-DD HH:mm');
hashHistory.push({
pathname: func.routerBefore() + '/train/trainingReview',
query: {
targeId: this.props.location.query.id,
commentId: item.id,
headsrc: item.userAvatar,
time: time,
title: item.commentator,
content: item.content,
lauNumber: item.thumbsUps,
status: item.status,
},
});
};
//点赞
laudClick = (item, index) => {
let params = {
tpCommentId: item.id,
};
let { id } = this.props.location.query;
let param = { id: id };
let _this = this;
if (String(item.status) === '0') {
// item.thumbsUps++;
// this.props.TrainingStepsReducer.reviewListData[index].thumbsUps++;
this.props.laudSaveEnrollEvent(params, () => {
Toast.info(intl.get('LikeSuccess') || "点赞成功");
this.props.reviewListData(
{ ...param, pageNo: 1, pageSize: 10 },
false,
() => {
_this.setState({
refreshTrainComment: new Date().getTime()
})
}
);
});
} else {
this.props.laudDeleEnrollEvent(params, () => {
Toast.info(intl.get('Unlike') || "取消点赞");
this.props.reviewListData(
{ ...param, pageNo: 1, pageSize: 10 },
false,
() => {
_this.setState({
refreshTrainComment: new Date().getTime()
})
}
);
});
}
};
//项目详情tab
panelItem = (data, id) => {
return data.map((item, index) => {
return (
<Accordion.Panel
header={this.trainContentItemHeader(item)}
key={index}
>
{this.trainContentItemInner(item, id)}
</Accordion.Panel>
);
});
};
trainContentItemHeader = item => {
let startTime = moment(item.startTime).format('YYYY-MM-DD');
let endTime = moment(item.endTime).format('YYYY-MM-DD');
return (
<div className="training-element">
<div className="training-icon-steps">
<Circle
className="icon-doc"
trailColor="#0076FF"
percent={item.ratio * 100}
trailWidth="4"
strokeWidth="20"
strokeColor="#0076FF"
/>
<span className="line-row" />
</div>
<div className="training-header-con">
<h2>{`${item.name}`}</h2>
<div className="training-timing">{`${intl.get("PlanTime") || "学习时间"}：${startTime} ${intl.get("To") || "至"} ${endTime}`}</div>
</div>
</div>
);
};
// 项目内容活动
contentItemClick = (data, item, id, contentVo) => {
let _this = this;
let { introductionVo } = this.props.TrainingStepsReducer;
if (introductionVo.needEnroll) {
//需要报名
if (introductionVo.hasEnrolled) {
//已报名
if (introductionVo.audited || !introductionVo.needAudit) {
//已审核
if (introductionVo.auditStatus == 3 && introductionVo.needAudit) {
//审核不通过
return Toast.info(intl.get("caseStatus3") || '审核不通过', 1);
}
} else {
//未审核
return Toast.info('等待审核', 1);
}
} else {
//未报名
return Toast.info('请先报名', 1);
}
}
if (data.started) {
let { finished, expired, started, status } = item;
let oDateTime = new Date().getTime();
if (oDateTime < data.startTime) {
Toast.info(intl.get("PublishKey86") || '还没有开始');
return;
} else if (oDateTime > data.endTime) {
Toast.info(intl.get("PublishKey87") || '已经结束');
return;
}
if (!expired && started) {
//如果计划：已结束||开始未截止也未完成------ 跳界面------除此之外都不挑界面并给提示
this.props.trainClickLog(item.id);
// debugger
switch (Number.parseInt(item.type)) {
case 0: //return str="课程";
if (parseInt(item.valid) == 0) {
func.ToastForOverTime('课程已过期', 2);
} else {
hashHistory.push({
pathname: func.routerBefore() + '/courseplay',
query: { id: item.relationId, tpId: id },
});
}
break;
case 1:
//考试
hashHistory.push({
pathname: func.routerBefore() + '/examdetail',
query: { id: item.relationId, type: 0, tpId: id },
});
break;
case 2:
//调研（未做）
if (status === '已完成') {
hashHistory.push({
pathname: func.routerBefore() + '/mysurvey/SurveyAnswer',
query: { ...item, id: item.relationId, data: 1 },
});
return;
} else {
hashHistory.push({
pathname: func.routerBefore() + '/mysurvey/SurveyDetails',
query: { id: item.relationId, tpId: id },
});
}
break;
// live
case 3:
//直播（外链）
//此处要做判断，公开直播还是站内直播，站内直播不变，公开直播要跳到新的播放地址
if (item.viewType == 0) { //viewType 0公开直播 1站内直播
if (item.url) {
window.location.href = `https://live.polyv.cn/watch/${item.url}` //应军哥要求，此处地址写死
} else {
Toast.info(intl.get("PublishKey89") || '直播频道号不存在', 2);
}
break;
}
if (item.url) {
jumpToLive.jumpToLive(item.url, id);
} else {
Toast.info(intl.get("PublishKey89") || '直播频道号不存在', 2);
}
break;
case 4:
//投票（外链）
hashHistory.push({
pathname: func.routerBefore() + '/vote',
query: { id: item.relationId },
});
break;
case 5:
//作业（未做
hashHistory.push({
pathname: func.routerBefore() + '/homework/homeworkdetail',
query: { id: item.relationId, tpId: id },
});
break;
case 6:
//证书
if (item.finished) {
hashHistory.push({
pathname: func.routerBefore() + '/mycred/details/',
query: { id: item.relationId, projectId: id },
});
} else {
this.props.trainCertificateGet(
{
planId: data.id,
certificateId: item.relationId,
},
response => {
Toast.info(response.data, 1);
}
);
}
break;
case 7: //签 到 8外部
window.location.href = item.url;
break;
case 8:
window.location.href = item.url;
// hashHistory.push({
// pathname: func.routerBefore() + '/course/courseplay',
// query: { id: item.relationId,type:2},
// });
break;
case 10:
//线下课程
//let {id} = _this.props.location.query;
hashHistory.push({
pathname: func.routerBefore() + '/course/courseplay',
query: { id: item.relationId, type: 2, tpId: id },
});
break;
case 13:
//资料任务-872-cwj
hashHistory.push({
pathname: func.routerBefore() + '/dataView', /* feature1123资料的预览或下载统一处理，zhouzhongyan20200526 */
query: {
id: item.relationId,
type: 1,
},
});
break;
case 14:
hashHistory.push({
pathname: func.routerBefore() + '/postDetail',
query: {
postId: item.relationId,
tpId: id,
},
});
break;
default:
window.location.href = item.url;
break;
}
} else {
Toast.info(item.status);
}
} else {
if (data.prePlanNames.length == 0) {
//没有前置计划提示status
Toast.info(data.status);
} else {
let text = ''
data.conditionPrePlanIds.map((ids, index) => {
contentVo.plans.map(plan => {
if (plan.id === ids && plan.status !== "已完成") {
return text = data.prePlanNames[index]
}
})
})
//有前置计划提示前置计划prePlanNames
Toast.info(text + intl.get("PublishKey90") || '学习计划未完成，无法开始新计划');
}
}
};
itemType = type => {
//0课程 1考试 2调研 3直播 4投票 5作业 6证书 7外部链接
let str = '';
switch (Number.parseInt(type)) {
case 0:
return (str = '课程');
case 1:
return (str = '考试');
case 2:
return (str = '调研');
case 3:
return (str = '直播');
case 4:
return (str = '投票');
case 5:
return (str = '作业');
case 6:
return (str = '证书');
case 7:
return (str = '外部链接');
case 8:
return (str = '签到');
case 10:
return (str = '线下课程');
}
return str;
};
isShowUnComplete(type, hasPre) {
//0课程 1考试 2调研 3直播 4投票 5作业 6证书 7外部链接 10 线下课程
if (hasPre.length == 0) {
switch (type) {
case 1:
return true;
case 2:
return true;
case 3:
return true;
case 5:
return true;
case 7:
return true;
case 10:
return true;
default:
return false;
}
} else {
return false;
}
}
itemIcon = (type, isGray) => {
//0课程 1考试 2调研 3直播 4投票 5作业 6证书 7外部链接 10 线下课程 11 作品 12精选作品 13资料,14论坛
let str = '';
switch (Number.parseInt(type)) {
case 0:
return (
<img
className="cell-left-icon"
src={isGray ? trainLessonGray : trainLesson}
alt=""
/>
);
case 1:
return (
<img
className="cell-left-icon"
src={isGray ? trainExamGray : trainExam}
alt=""
/>
);
case 2:
return (
<img
className="cell-left-icon"
src={isGray ? trainSurveryGray : trainSurvery}
alt=""
/>
);
case 3:
return <img className="cell-left-icon" src={trainLive} alt="" />;
case 4:
return (
<img
className="cell-left-icon"
src={isGray ? trainVoteGray : trainVote}
alt=""
/>
);
case 5:
return (
<img
className="cell-left-icon"
style={isGray ? { width: 26 } : {}}
src={isGray ? trainHomeowrkGray : trainHomeowrk}
alt=""
/>
);
case 6:
return <img className="cell-left-icon" src={trainCer} alt="" />;
case 7:
return (
<img
className="cell-left-icon"
src={isGray ? trainLinkGray : trainLink}
alt=""
/>
);
case 8:
return (
<img
className="cell-left-icon"
src={isGray ? trainSignGray : trainSign}
alt=""
/>
);
case 10:
return <img className="cell-left-icon" src={trainOffline} alt="" />;
case 11:
return <img className="cell-left-icon" src={trainCase} alt="" />;
case 12:
return <img className="cell-left-icon" src={trainCase} alt="" />;
case 13:
return <img className="cell-left-icon" src={tarinData} alt="" />;
case 14:
return <img className="cell-left-icon" src={forumIcon} alt="" />;
}
return str;
};
}
export default connect(state => {
let { TrainingStepsReducer } = state;
return {
TrainingStepsReducer,
};
}, TrainingStepsAction)(TrainingSteps);
src/components/Training/TrainingSteps/TrainingSteps.jsx
...@@ -76,6 +76,7 @@ class TrainingSteps extends Component { ...@@ -76,6 +76,7 @@ class TrainingSteps extends Component {
activityStateName: "", activityStateName: "",
signTimeId: "", //签到 signTimeId: "", //签到
signType: "", //签到 signType: "", //签到
hasFinished: "", //控制是否可以评论
}; };
this.contentDomHeightSetForSticky = this.contentDomHeightSetForSticky =
this.contentDomHeightSetForSticky.bind(this); this.contentDomHeightSetForSticky.bind(this);
...@@ -103,13 +104,19 @@ class TrainingSteps extends Component { ...@@ -103,13 +104,19 @@ class TrainingSteps extends Component {
this.props.trainStepsData(finished, params, () => { this.props.trainStepsData(finished, params, () => {
let { introductionVo } = _this.props.TrainingStepsReducer; let { introductionVo } = _this.props.TrainingStepsReducer;
let { activityStateCode, activityStateName, signTimeId, signType } = let {
introductionVo; activityStateCode,
activityStateName,
signTimeId,
signType,
hasFinished,
} = introductionVo;
_this.setState({ _this.setState({
activityStateCode: activityStateCode, activityStateCode: activityStateCode,
activityStateName: activityStateName, activityStateName: activityStateName,
signTimeId: signTimeId, signTimeId: signTimeId,
signType: signType, signType: signType,
hasFinished: hasFinished,
}); });
_this.contentDomHeightSetForSticky(); _this.contentDomHeightSetForSticky();
}); });
...@@ -247,7 +254,7 @@ class TrainingSteps extends Component { ...@@ -247,7 +254,7 @@ class TrainingSteps extends Component {
} }
}; };
renderContent = (code) => { renderContent = (hasFinished) => {
let { let {
introductionVo = {}, introductionVo = {},
hasEnrolled, hasEnrolled,
...@@ -275,15 +282,20 @@ class TrainingSteps extends Component { ...@@ -275,15 +282,20 @@ class TrainingSteps extends Component {
<div style={{ backgroundColor: "#F4F4F4" }}> <div style={{ backgroundColor: "#F4F4F4" }}>
{this.renderIntroduction(introductionVo)} {this.renderIntroduction(introductionVo)}
{code != "4" ? this.renderComment(reviewListData, loadMore) : ""} {hasFinished ? this.renderComment(reviewListData, loadMore) : ""}
</div> </div>
); );
}; };
render() { render() {
let { introductionVo = {} } = this.props.TrainingStepsReducer; let { introductionVo = {} } = this.props.TrainingStepsReducer;
let { activityStateCode, activityStateName, signTimeId, signType } = let {
this.state; activityStateCode,
hasFinished,
activityStateName,
signTimeId,
signType,
} = this.state;
let signUpTitle = let signUpTitle =
activityStateCode == "1" activityStateCode == "1"
? "待报名" ? "待报名"
...@@ -293,7 +305,11 @@ class TrainingSteps extends Component { ...@@ -293,7 +305,11 @@ class TrainingSteps extends Component {
? "立即报名" ? "立即报名"
: activityStateCode == "4" : activityStateCode == "4"
? "立即签到" ? "立即签到"
: "进行中"; : activityStateCode == "5"
? "进行中"
: activityStateCode == "7"
? "未报名"
: "";
let signUpColor = "#999999"; let signUpColor = "#999999";
let signedColor = "#d23a29"; let signedColor = "#d23a29";
...@@ -312,8 +328,9 @@ class TrainingSteps extends Component { ...@@ -312,8 +328,9 @@ class TrainingSteps extends Component {
alt="" alt=""
/> />
{/*头部信息*/} {/*头部信息*/}
<div className="train-info"> <div className="train-info-header">
<p>{introductionVo && introductionVo.name}</p> <p>{introductionVo && introductionVo.name}</p>
{activityStateCode == 1 ? ( {activityStateCode == 1 ? (
<div className="overed">待报名</div> <div className="overed">待报名</div>
) : activityStateCode == 2 ? ( ) : activityStateCode == 2 ? (
...@@ -336,9 +353,7 @@ class TrainingSteps extends Component { ...@@ -336,9 +353,7 @@ class TrainingSteps extends Component {
</div> </div>
</div> </div>
<div style={{ width: "100%", marginTop: 0 }}> <div style={{ width: "100%", marginTop: 0 }}>
<StickyContainer> <StickyContainer>{this.renderContent(hasFinished)}</StickyContainer>
{this.renderContent(activityStateCode)}
</StickyContainer>
</div> </div>
{activityStateCode != "5" && activityStateCode != "6" ? ( {activityStateCode != "5" && activityStateCode != "6" ? (
<Fragment> <Fragment>
...@@ -421,7 +436,10 @@ class TrainingSteps extends Component { ...@@ -421,7 +436,10 @@ class TrainingSteps extends Component {
}} }}
> >
{/*项目须知*/} {/*项目须知*/}
<div className="train-info-view"> <div
className="train-info-view"
style={{ width: "92%", margin: "0 auto", borderRadius: "10px" }}
>
<div className="train-up-info"> <div className="train-up-info">
{introductionVo && ( {introductionVo && (
<div> <div>
...@@ -466,11 +484,20 @@ class TrainingSteps extends Component { ...@@ -466,11 +484,20 @@ class TrainingSteps extends Component {
<div> <div>
<div className="product-info-view"> <div className="product-info-view">
<div className="train-info-view"> <div className="train-info-view">
<div style={{ marginBottom: "20px" }}> <div
style={{
marginBottom: "20px",
borderBottom: "1px solid #e5e6e8",
}}
>
<p <p
style={{ style={{
fontSize: "40px",
fontWeight: "bold", fontWeight: "bold",
paddingLeft: "40px", paddingLeft: "40px",
paddingTop: "15px",
paddingBottom: "20px",
color: "#353535",
}} }}
> >
活动介绍 活动介绍
...@@ -501,7 +528,8 @@ class TrainingSteps extends Component { ...@@ -501,7 +528,8 @@ class TrainingSteps extends Component {
width: "100%", width: "100%",
height: "280px", height: "280px",
paddingLeft: "40px", paddingLeft: "40px",
paddingRight: "40px", paddingRight: "15px",
marginBottom: "10px",
}} }}
> >
<img <img
...@@ -528,12 +556,18 @@ class TrainingSteps extends Component { ...@@ -528,12 +556,18 @@ class TrainingSteps extends Component {
</div> </div>
</div> </div>
{introductionVo.researchName ? ( {introductionVo.researchName ? (
<div style={{ marginBottom: "20px" }}> <div
style={{
marginBottom: "20px",
}}
>
<p <p
style={{ style={{
fontWeight: "bold", fontWeight: "bold",
paddingLeft: "40px", paddingLeft: "40px",
paddingBottom: "20px", paddingBottom: "20px",
color: "#353535",
fontSize: "40px",
}} }}
> >
投票链接 投票链接
...@@ -562,6 +596,8 @@ class TrainingSteps extends Component { ...@@ -562,6 +596,8 @@ class TrainingSteps extends Component {
fontWeight: "bold", fontWeight: "bold",
paddingLeft: "40px", paddingLeft: "40px",
paddingBottom: "20px", paddingBottom: "20px",
color: "#353535",
fontSize: "40px",
}} }}
> >
活动奖励 活动奖励
...@@ -788,9 +824,10 @@ class TrainingSteps extends Component { ...@@ -788,9 +824,10 @@ class TrainingSteps extends Component {
this.props.sign(params, () => { this.props.sign(params, () => {
_this.props.trainStepsData(finished, params1, () => { _this.props.trainStepsData(finished, params1, () => {
let { introductionVo } = _this.props.TrainingStepsReducer; let { introductionVo } = _this.props.TrainingStepsReducer;
let { activityStateCode } = introductionVo; let { activityStateCode, hasFinished } = introductionVo;
_this.setState({ _this.setState({
activityStateCode: activityStateCode, activityStateCode: activityStateCode,
hasFinished: hasFinished,
}); });
}); });
}); });
...@@ -867,11 +904,11 @@ class TrainingSteps extends Component { ...@@ -867,11 +904,11 @@ class TrainingSteps extends Component {
}); });
} }
}; };
// 跳转到投稿 // 跳转到投票详情
toSurvey = (id) => { toSurvey = (id) => {
hashHistory.push({ hashHistory.push({
pathname: func.routerBefore() + "/SurveyDetails", pathname: func.routerBefore() + "/allDescribe",
query: { id: id }, query: { id: id, type: "投票" },
}); });
}; };
} }
......
src/components/Training/TrainingSteps/TrainingSteps111.jsx deleted 100644 → 0
import React, { Component, Fragment } from "react";
import { ListView, Modal, TextareaItem, Toast } from "antd-mobile";
import trainCommentReplay from "../../../image/train-comment.png";
import intl, { init } from "react-intl-universal";
import { hashHistory } from "react-router";
import "./index.less";
import moment from "moment";
import { connect } from "react-redux";
import * as TrainingStepsAction from "./TrainingStepsAction";
import func from "../../../util/commonFunc";
import SecListView from "../../common/listview/secListView";
import trainComment from "./comment-icon.jpg";
import zan from "../../../image/zan.png";
import alreadyzan from "../../../image/alreadyzan.png";
import myIcon from "../../../image/my.png";
class TrainingSteps extends Component {
constructor(props) {
super(props);
const ds = new ListView.DataSource({
rowHasChanged: (r1, r2) => r1 !== r2,
});
this.state = {
displayProgress: false,
visible: false,
confirmLoading: false,
commitContent: "",
showEnroll: 1,
showComment: false,
comment: "",
dataSource: ds,
isLoading: false,
commentType: 1,
replyCommentTypeId: 0,
showProgress: true,
trainLogoHeight: 400,
commentHasMore: true,
showContentOccupy: false,
enablePosition: 0,
refreshTrainComment: "",
};
}
componentWillMount() {}
componentDidMount() {
let _this = this;
this.logoHeightListen();
this.props.initailData();
let { id, finished, tabkey, bizType } = this.props.location.query;
let params = {
id: id,
};
if (bizType != "2") {
this.props.trainStepsData(finished, params, () => {
let { introductionVo } = _this.props.TrainingStepsReducer;
let {
needEnroll,
needAudit,
hasEnrolled,
audited,
enablePosition,
enableSign,
} = introductionVo;
_this.setState({
showProgress: this.showProgressJudge(
needEnroll,
hasEnrolled,
needAudit,
audited
),
enablePosition,
enableSign,
});
_this.contentDomHeightSetForSticky();
});
}
this.setState({
isLoading: true,
});
this.props.reviewListData(
{ ...params, pageNo: 1, pageSize: 10 },
false,
() => {
const { reviewListTotle, reviewPageNo, reviewListData } =
_this.props.TrainingStepsReducer;
this.setState({
isLoading: false,
commentHasMore:
(reviewPageNo - 2) * 10 + reviewListData.length < reviewListTotle
? true
: false,
});
}
);
}
logoHeightListen() {
this.setState({
trainLogoHeight: document.body.clientWidth * (225 / 375),
});
}
contentDomHeightSetForSticky() {
let domHeight = document.getElementById(
"train-contain-list-sticky-div"
).offsetHeight;
let bodyHeight = document.body.clientHeight;
if (
bodyHeight - (domHeight + 88) < 50 &&
bodyHeight - (domHeight + 88) > 0
) {
this.setState({
showContentOccupy: true,
});
}
}
showProgressJudge(needEnroll, hasEnrolled, needAudit, audited) {
if (needEnroll) {
if (hasEnrolled) {
if (needAudit) {
if (audited) {
return true;
} else {
return false;
}
} else {
return true;
}
} else {
return false;
}
} else {
return true;
}
}
onLoadMore = () => {
let { id } = this.props.location.query;
let _this = this;
let { reviewPageNo } = this.props.TrainingStepsReducer;
let params = {
id: id,
};
if (this.state.isLoading) {
return;
}
if (!this.state.commentHasMore) {
return;
}
this.setState({
isLoading: true,
});
this.props.reviewListData(
{ ...params, pageNo: reviewPageNo, pageSize: 10 },
true,
() => {
const { reviewListTotle, reviewPageNo, reviewListData } =
_this.props.TrainingStepsReducer;
this.setState({
isLoading: false,
commentHasMore:
(reviewPageNo - 2) * 10 + reviewListData.length < reviewListTotle
? true
: false,
});
}
);
};
//提交评论
trainCommitVerb = () => {
if (!this.state.commitContent) {
Toast.info(intl.get("PublishKey73") || "评论不能为空");
return;
}
let _this = this;
if (this.state.commentType == 1) {
let { id } = this.props.location.query;
let param = { trainingProjectId: id, content: this.state.commitContent };
this.props.commitVerb(param, () => {
this.setState({ commitContent: "" });
let params = {
id: id,
};
this.props.reviewListData(
{ ...params, pageNo: 1, pageSize: 10 },
false,
() => {
_this.setState({
refreshTrainComment: new Date().getTime(),
});
}
);
});
this.setState({ showEnroll: 1, showComment: false });
} else if (this.state.commentType == 2) {
let { id } = this.props.location.query;
let param = {
trainingProjectId: id,
tpCommentId: this.state.replyCommentTypeId,
content: this.state.commitContent,
};
this.props.reviewReplyCommit(param, () => {
this.setState({ commitContent: "" });
let params = {
id: id,
};
this.props.reviewListData(
{ ...params, pageNo: 1, pageSize: 10 },
false,
() => {
this.setState({
isLoading: false,
});
}
);
Toast.info(intl.get("CommentSuccess") || "评论成功");
});
this.setState({ showEnroll: 1, showComment: false });
}
};
render() {
let { reviewListData, isMore } = this.props.TrainingStepsReducer;
let loadMore = isMore ? (
<button className="load-more" onClick={() => this.onLoadMore()}>
{intl.get("PublishKey74") || "点击加载更多"}
</button>
) : (
<button className="load-more">
{intl.get("PublishKey30") || "没有更多数据"}
</button>
);
this.state.dataSource = this.state.dataSource.cloneWithRows(
this.props.TrainingStepsReducer.reviewListData
);
return (
<div
className="train-contain"
style={{ backgroundColor: "#f4f4f4", width: "100%", height: "100%" }}
>
<div style={{ width: "100%", marginTop: 0 }}>
<Fragment>{this.renderComment(reviewListData, loadMore)}</Fragment>
</div>
</div>
);
}
//评论
renderComment = (reviewListData, loadMore) => {
let { reviewPageNo, reviewListTotle } = this.props.TrainingStepsReducer;
let row = (item, section, row) => {
let imgsrc = item.userAvatar == "" ? myIcon : item.userAvatar;
const imageStyle = {
backgroundImage: `url(${imgsrc})`,
backgroundPosition: "center",
backgroundRepeat: "no-repeat",
backgroundSize: "contain",
};
return (
<div className="list-item-div">
<div className="list-item-img-box">
<div className="list-item-img" style={imageStyle} />
</div>
<div className="list-item-content">
<h2 className="item-title-style">{item.commentator}</h2>
<p
className="item-text-style"
dangerouslySetInnerHTML={{
__html: item.content.replace(/\r?\n/g, "</br>"),
}}
/>
<div className="item-footer-box">
<p className="item-time-style">
{item.createTime.length > 16
? item.createTime.substring(0, 16)
: item.createTime}{" "}
</p>
<span
className="item-zhan-style"
style={{ marginLeft: "2rem" }}
onClick={() => this.reviewDetail(item)}
>
<span>{item.replys == "0" ? "0" : item.replys}</span>
<img
src={trainCommentReplay}
style={{ marginTop: 10 }}
className="cell-left-icon"
alt=""
/>
</span>
<span
className="item-zhan-style"
onClick={() => this.laudClick(item, row)}
>
<span>{item.thumbsUps}</span>
<img
src={String(item.status) === "1" ? alreadyzan : zan}
alt=""
/>
</span>
</div>
{item.tpCommentReplies.length > 0 ? (
<div className="train-comment-replay">
<div>{item.tpCommentReplies[0].createByName}:</div>
<div
dangerouslySetInnerHTML={{
__html: item.tpCommentReplies[0].content.replace(
/\r?\n/g,
"</br>"
),
}}
/>
{item.tpCommentReplies.length > 1 ? (
<div onClick={() => this.reviewDetail(item)}>
{`${intl.get("PublishKey83") || "查看全部"}${item.replys}${
intl.get("PublishKey84") || "条回复"
}>`}
</div>
) : (
""
)}
</div>
) : (
""
)}
</div>
</div>
);
};
return (
<div
className="train-comment"
style={{ paddingBottom: "1rem", backgroundColor: "#F4F4F4" }}
>
<div className="train-comment-contain">
<img src={trainComment} className="cell-left-icon" alt="" />
<div className="comment-slider" onClick={() => this.commentShow(1)}>
{" "}
{intl.get("PublishKey85") || "说点什么吧~"}
</div>
</div>
<p style={{ padding: "0.3rem 0.2rem", fontSize: "0.3rem" }}>
{intl.get("all_comment") || "全部评论"}
</p>
{/* */}
<SecListView
key={this.state.refreshTrainComment}
dataSource={this.state.dataSource}
renderRow={row.bind(this)}
onEndReached={this.onLoadMore}
listStyle={50}
isLoading={this.state.isLoading}
page={{
pageTotal: reviewListTotle,
pageNo: reviewPageNo,
pageSize: 10,
}}
footText={intl.get("PublishKey47") || "没有更多了"}
/>
<Modal
title={intl.get("Comment") || "评论"}
visible={this.state.showComment}
transparent
maskClosable={false}
className={"train-comment-input"}
onClose={this.commentHidden}
footer={[
{
text: intl.get("Cancel") || "取消",
onPress: () => {
this.commentHidden();
},
},
{
text: intl.get("Yes") || "确定",
onPress: () => {
this.trainCommitVerb(1, 0);
},
},
]}
>
<div className="comment-body">
<TextareaItem
maxLength={800}
placeholder={intl.get("WriteComment") || "写评论"}
rows={4}
value={this.state.commitContent}
style={{ backgroundColor: "clear" }}
onChange={(txt) => {
let value = txt;
if (value.length > 800) {
value = value.slice(0, 800);
}
this.setState({ commitContent: value });
}}
ref={(el) => (this.autoFocusInst = el)}
/>
</div>
</Modal>
</div>
);
};
reachEnd = () => {};
commentShow = (type, id) => {
//type=1为项目评论，2为项目评论回复
this.setState({
showComment: true,
commentType: type,
replyCommentTypeId: id,
});
};
commentHidden = () => {
this.setState({
showComment: false,
commitContent: "",
});
};
reviewDetail = (item) => {
console.log(item);
// let time = moment(item.createTime).format("YYYY-MM-DD HH:hh:SS");
let time = moment(item.createTime).format("YYYY-MM-DD HH:mm");
hashHistory.push({
pathname: func.routerBefore() + "/train/trainingReview",
query: {
targeId: this.props.location.query.id,
commentId: item.id,
headsrc: item.userAvatar,
time: time,
title: item.commentator,
content: item.content,
lauNumber: item.thumbsUps,
status: item.status,
},
});
};
//点赞
laudClick = (item, index) => {
let params = {
tpCommentId: item.id,
};
let { id } = this.props.location.query;
let param = { id: id };
let _this = this;
if (String(item.status) === "0") {
// item.thumbsUps++;
// this.props.TrainingStepsReducer.reviewListData[index].thumbsUps++;
this.props.laudSaveEnrollEvent(params, () => {
Toast.info(intl.get("LikeSuccess") || "点赞成功");
this.props.reviewListData(
{ ...param, pageNo: 1, pageSize: 10 },
false,
() => {
_this.setState({
refreshTrainComment: new Date().getTime(),
});
}
);
});
} else {
// this.props.TrainingStepsReducer.reviewListData[index].thumbsUps--;
// item.thumbsUps--;
this.props.laudDeleEnrollEvent(params, () => {
Toast.info(intl.get("Unlike") || "取消点赞");
this.props.reviewListData(
{ ...param, pageNo: 1, pageSize: 10 },
false,
() => {
_this.setState({
refreshTrainComment: new Date().getTime(),
});
}
);
});
}
};
}
export default connect((state) => {
let { TrainingStepsReducer } = state;
return {
TrainingStepsReducer,
};
}, TrainingStepsAction)(TrainingSteps);
src/components/Training/TrainingSteps/index.css
...@@ -10,6 +10,10 @@ ...@@ -10,6 +10,10 @@
width: 40px; width: 40px;
height: 40px; height: 40px;
} }
.train-info-view {
background-color: #fff;
padding: 15px 0;
}
.train-info-view .tp-icon { .train-info-view .tp-icon {
width: 24px !important; width: 24px !important;
height: 24px; height: 24px;
...@@ -393,7 +397,6 @@ ...@@ -393,7 +397,6 @@
font-size: 0.31rem; font-size: 0.31rem;
width: 92%; width: 92%;
margin: 0 auto; margin: 0 auto;
background-color: #fff;
border-radius: 12px; border-radius: 12px;
padding-top: 30px; padding-top: 30px;
padding-bottom: 30px; padding-bottom: 30px;
...@@ -406,9 +409,8 @@ ...@@ -406,9 +409,8 @@
background-color: #fff; background-color: #fff;
border-radius: 12px; border-radius: 12px;
margin-bottom: 30px; margin-bottom: 30px;
padding-left: 40px; padding-left: 14px;
padding-top: 30px; padding-top: 15px;
padding-bottom: 30px;
} }
.train-up-info p { .train-up-info p {
line-height: 0.46rem; line-height: 0.46rem;
...@@ -431,7 +433,7 @@ ...@@ -431,7 +433,7 @@
.train-up-info p span { .train-up-info p span {
color: #888; color: #888;
} }
.train-info { .train-info-header {
font-size: 0.31rem; font-size: 0.31rem;
color: #fff; color: #fff;
width: 100%; width: 100%;
...@@ -441,26 +443,54 @@ ...@@ -441,26 +443,54 @@
justify-content: space-between; justify-content: space-between;
padding-left: 40px; padding-left: 40px;
} }
.train-info .enroll { .train-info-header .enroll {
width: 120px; width: 140px;
background-color: #53af5c; background-color: #53af5c;
color: #fff; color: #fff;
text-align: center; text-align: center;
padding: 8px 10px; padding: 4px 0px;
border-radius: 4px;
} }
.train-info .enrolled { .train-info-header .enrolled {
width: 120px; width: 140px;
background-color: #ffba19; background-color: #ffba19;
color: #fff; color: #fff;
text-align: center; text-align: center;
padding: 8px 10px; padding: 4px 0px;
border-radius: 4px;
} }
.train-info .overed { .train-info-header .overed {
width: 120px; width: 140px;
background-color: #e5e6e8; background-color: #e5e6e8;
color: #a1a1a1; color: #a1a1a1;
text-align: center; text-align: center;
padding: 8px 10px; padding: 4px 0px;
border-radius: 4px;
}
.train-info-header p {
color: #fff;
line-height: 0.48rem;
margin: 0;
word-break: break-all;
text-overflow: ellipsis;
display: -webkit-box;
/** 对象作为伸缩盒子模型显示 **/
-webkit-box-orient: vertical;
/** 设置或检索伸缩盒对象的子元素的排列方式 **/
-webkit-line-clamp: 2;
/** 显示的行数 **/
overflow: hidden;
/** 隐藏超出的内容 **/
font-size: 40px;
}
.train-info {
font-size: 0.31rem;
color: #fff;
width: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
padding-left: 40px;
} }
.train-info p { .train-info p {
color: #fff; color: #fff;
...@@ -499,7 +529,7 @@ ...@@ -499,7 +529,7 @@
color: blue; color: blue;
} }
.train-info .train-info-contain p { .train-info .train-info-contain p {
font-size: 24px !important; font-size: 30px !important;
padding: 0 !important; padding: 0 !important;
color: #4a4a4a !important; color: #4a4a4a !important;
} }
......
src/components/Training/TrainingSteps/index.less
...@@ -8,6 +8,8 @@ ...@@ -8,6 +8,8 @@
//margin-right: 16px; //margin-right: 16px;
} }
.train-info-view { .train-info-view {
background-color: #fff;
padding: 15px 0;
.tp-icon { .tp-icon {
width: 24px !important; width: 24px !important;
height: 24px; height: 24px;
...@@ -555,7 +557,6 @@ ...@@ -555,7 +557,6 @@
font-size: 0.31rem; font-size: 0.31rem;
width: 92%; width: 92%;
margin: 0 auto; margin: 0 auto;
background-color: #fff;
border-radius: 12px; border-radius: 12px;
padding-top: 30px; padding-top: 30px;
padding-bottom: 30px; padding-bottom: 30px;
...@@ -572,9 +573,8 @@ ...@@ -572,9 +573,8 @@
background-color: #fff; background-color: #fff;
border-radius: 12px; border-radius: 12px;
margin-bottom: 30px; margin-bottom: 30px;
padding-left: 40px; padding-left: 14px;
padding-top: 30px; padding-top: 15px;
padding-bottom: 30px;
p { p {
line-height: 0.46rem; line-height: 0.46rem;
.line-hidden; .line-hidden;
...@@ -587,8 +587,7 @@ ...@@ -587,8 +587,7 @@
} }
} }
} }
.train-info-header {
.train-info {
font-size: 0.31rem; font-size: 0.31rem;
color: #fff; color: #fff;
width: 100%; width: 100%;
...@@ -598,25 +597,28 @@ ...@@ -598,25 +597,28 @@
justify-content: space-between; justify-content: space-between;
padding-left: 40px; padding-left: 40px;
.enroll { .enroll {
width: 120px; width: 140px;
background-color: #53af5c; background-color: #53af5c;
color: #fff; color: #fff;
text-align: center; text-align: center;
padding: 8px 10px; padding: 4px 0px;
border-radius: 4px;
} }
.enrolled { .enrolled {
width: 120px; width: 140px;
background-color: #ffba19; background-color: #ffba19;
color: #fff; color: #fff;
text-align: center; text-align: center;
padding: 8px 10px; padding: 4px 0px;
border-radius: 4px;
} }
.overed { .overed {
width: 120px; width: 140px;
background-color: #e5e6e8; background-color: #e5e6e8;
color: #a1a1a1; color: #a1a1a1;
text-align: center; text-align: center;
padding: 8px 10px; padding: 4px 0px;
border-radius: 4px;
} }
p { p {
color: #fff; color: #fff;
...@@ -624,7 +626,22 @@ ...@@ -624,7 +626,22 @@
.line-hidden; .line-hidden;
font-size: 40px; font-size: 40px;
} }
}
.train-info {
font-size: 0.31rem;
color: #fff;
width: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
padding-left: 40px;
p {
color: #fff;
line-height: 0.48rem;
.line-hidden;
font-size: 40px;
}
.descr { .descr {
p { p {
-webkit-line-clamp: unset; -webkit-line-clamp: unset;
...@@ -654,7 +671,7 @@ ...@@ -654,7 +671,7 @@
} }
p { p {
font-size: 24px !important; font-size: 30px !important;
padding: 0 !important; padding: 0 !important;
color: #4a4a4a !important; color: #4a4a4a !important;
} }
...@@ -897,8 +914,8 @@ ...@@ -897,8 +914,8 @@
text-align: center; text-align: center;
} }
.signup-modal { .signup-modal {
.am-modal-content{ .am-modal-content {
background: linear-gradient(180deg,#ffe2e2 0%,#fff 25%); background: linear-gradient(180deg, #ffe2e2 0%, #fff 25%);
} }
.am-modal-title { .am-modal-title {
color: #16181a; color: #16181a;
...@@ -908,14 +925,14 @@ ...@@ -908,14 +925,14 @@
text-align: left; text-align: left;
margin: 28px 0; margin: 28px 0;
} }
.am-modal-button{ .am-modal-button {
width: 45% !important; width: 45% !important;
height: 80px !important; height: 80px !important;
line-height: 80px !important; line-height: 80px !important;
margin: 0 auto; margin: 0 auto;
color: #fff !important; color: #fff !important;
margin-bottom: 25px; margin-bottom: 25px;
background:linear-gradient(270deg,#eb6c53, #d23a29); background: linear-gradient(270deg, #eb6c53, #d23a29);
} }
} }
.train-pay-button-container { .train-pay-button-container {
......
src/components/common/carousel.jsx
...@@ -25,96 +25,68 @@ export default class carousel extends Component { ...@@ -25,96 +25,68 @@ export default class carousel extends Component {
render() { render() {
let { data, carouselparam } = this.props; let { data, carouselparam } = this.props;
if (data.length == 1) { return (
return ( <div
<div style={{ width: "100%", padding: "0 30px" }}> className={this.props.isIndex ? "carousel-index-container" : ""}
<a style={{ width: "100%" }}
key={data[0].id} >
style={{ display: "inline-block", width: "100%", padding: 0 }} <Carousel
onClick={() => this.imageClick(data[0])} className="my-index-carousel"
className={this.props.isIndex ? "carousel-container" : ""} autoplay={true}
> infinite={true}
<img dots={false}
swipeSpeed={35}
afterChange={this.autoSlideListen}
>
{data.map((item, index) => (
<a
key={index}
style={{ style={{
height: carouselparam.height, display: "block",
borderRadius: carouselparam.radius, height: '34%',
width: "100%", overflow: "hidden",
}} position: "relative",
src={data[0].imageSrc}
alt="icon"
onLoad={() => {
// fire window resize event to change height
window.dispatchEvent(new Event("resize"));
this.setState({
initialHeight: null,
});
}} }}
/> onClick={() => this.imageClick(item)}
</a> >
</div> <img
); style={{
} else { height: '34%',
return ( width: "100%",
<div }}
className={this.props.isIndex ? "carousel-index-container" : ""} src={item.imageSrc}
style={{ width: "100%" }} alt="icon"
> onLoad={() => {
<Carousel // fire window resize event to change height
className="my-index-carousel" window.dispatchEvent(new Event("resize"));
autoplay={true} this.setState({
infinite={true} initialHeight: null,
dots={false} });
swipeSpeed={35} }}
afterChange={this.autoSlideListen} />
> <div
{data.map((item, index) => (
<a
key={index}
style={{ style={{
display: "block", width: "100%",
height: carouselparam.height + 80, textAlign: "center",
borderRadius: carouselparam.radius, color: "#fff",
fontSize: "26px",
position: "absolute",
bottom: "0px",
textOverflow: "ellipsis",
whiteSpace: "nowrap",
overflow: "hidden", overflow: "hidden",
position: "relative", padding: "12px 0",
textIndent: "1em",
background:
"linear-gradient(180deg,rgba(0,0,0,0.00), rgba(0,0,0,0.50) 50%, #000000 100%)",
}} }}
onClick={() => this.imageClick(item)}
> >
<img {item.imgTitle}
style={{ </div>
height: carouselparam.height + 80, </a>
borderRadius: carouselparam.radius, ))}
width: "100%", </Carousel>
}} </div>
src={item.imageSrc} );
alt="icon"
onLoad={() => {
// fire window resize event to change height
window.dispatchEvent(new Event("resize"));
this.setState({
initialHeight: null,
});
}}
/>
<div
style={{
width: "100%",
textAlign: "center",
color: "#fff",
fontSize: "26px",
position: "absolute",
bottom: "20px",
textOverflow: "ellipsis",
whiteSpace: "nowrap",
overflow: "hidden",
}}
>
{item.imgTitle}
</div>
</a>
))}
</Carousel>
</div>
);
}
} }
} }
src/components/exam/less/examquestion.css
.singleLineOverflow {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
word-break: break-all;
}
.question-block { .question-block {
width: 100%; width: 90%;
margin: 0 auto;
padding-top: 20px;
background-color: #fff; background-color: #fff;
transform: translateY(60px);
border-radius: 15px;
} }
.question-block .exam-media { .question-block .exam-media {
padding: 0; padding: 10px 30px;
} }
.question-block .am-list-item { .question-block .am-list-item {
padding-left: 0 !important; padding-left: 0 !important;
...@@ -16,27 +26,26 @@ ...@@ -16,27 +26,26 @@
} }
.separator { .separator {
height: 0.3rem; height: 0.3rem;
border-top: 1px solid #E4E4E4; border-top: 1px solid #e4e4e4;
border-bottom: 1px solid #E4E4E4; border-bottom: 1px solid #e4e4e4;
overflow: hidden; overflow: hidden;
} }
.question-topic { .question-topic {
width: 100%; width: 100%;
padding: 0.1rem 0.3rem; padding: 0.1rem 0.3rem;
text-align: justify;
position: relative; position: relative;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
} }
.question-topic h4 { .question-topic h4 {
margin-bottom: 32px;
font-size: 0.34rem; font-size: 0.34rem;
padding-top: 0.3rem; padding-top: 0.3rem;
color: #030303; color: #030303;
} }
.question-topic h4 .item-type { .question-topic h4 .item-type {
color: #67512C; color: #67512c;
margin-bottom: 32px;
display: inline-block; display: inline-block;
} }
.question-topic .daying-icon { .question-topic .daying-icon {
...@@ -104,8 +113,8 @@ ...@@ -104,8 +113,8 @@
} }
.exam-question { .exam-question {
width: 100%; width: 100%;
padding-top: 0.88rem; height: 100%;
padding-bottom: 0.98rem; background: linear-gradient(0deg, #ff9286 0%, #d23a29), linear-gradient(180deg, rgba(255, 255, 255, 0) 59%, #f5f5f5 100%), linear-gradient(0deg, rgba(210, 58, 41, 0) 0%, #d23a29);
} }
.exam-question .btn-flex { .exam-question .btn-flex {
background-color: #fff; background-color: #fff;
......
src/components/exam/less/examquestion.less
@import "config"; @import "config";
.question-block { .question-block {
width: 100%; width: 90%;
margin: 0 auto;
padding-top: 20px;
background-color: #fff; background-color: #fff;
.exam-media{ transform: translateY(60px);
padding: 0; border-radius: 15px;
.exam-media {
padding: 10px 30px;
} }
.am-list-item{ .am-list-item {
padding-left: 0 !important; padding-left: 0 !important;
} }
.am-textarea-control textarea{ .am-textarea-control textarea {
border: 1px solid gray; border: 1px solid gray;
border-radius: 0.12rem; border-radius: 0.12rem;
text-indent: 0.1rem; text-indent: 0.1rem;
...@@ -19,9 +23,9 @@ ...@@ -19,9 +23,9 @@
.separator { .separator {
height: 0.3rem; height: 0.3rem;
border-top: 1px solid #E4E4E4; border-top: 1px solid #e4e4e4;
border-bottom: 1px solid #E4E4E4; border-bottom: 1px solid #e4e4e4;
overflow: hidden overflow: hidden;
} }
.question-topic { .question-topic {
...@@ -38,11 +42,11 @@ ...@@ -38,11 +42,11 @@
padding-top: 0.3rem; padding-top: 0.3rem;
color: #030303; color: #030303;
.item-type { .item-type {
color: #67512C; color: #67512c;
display: inline-block; display: inline-block;
} }
} }
.daying-icon{ .daying-icon {
position: absolute; position: absolute;
top: 20px; top: 20px;
right: 20px; right: 20px;
...@@ -59,41 +63,41 @@ ...@@ -59,41 +63,41 @@
} }
} }
.question-ans{ .question-ans {
margin: 0.1rem 0.3rem; margin: 0.1rem 0.3rem;
.ans-wrong{ .ans-wrong {
font-size: 28px; font-size: 28px;
width: 172px; width: 172px;
height: 60px; height: 60px;
border-radius: 2px; border-radius: 2px;
color: rgba(255,255,255,1); color: rgba(255, 255, 255, 1);
text-align: center; text-align: center;
line-height: 60px; line-height: 60px;
background: rgba(234,85,78,1); background: rgba(234, 85, 78, 1);
}
.ans {
padding: 20px;
font-size: 32px;
font-weight: 600;
color: rgba(51, 51, 51, 1);
background: rgba(250, 250, 250, 1);
border-radius: 6px;
span {
color: rgba(66, 133, 244, 1);
} }
.ans{
padding: 20px;
font-size: 32px;
font-weight: 600;
color: rgba(51,51,51,1);
background:rgba(250,250,250,1);
border-radius:6px;
span{
color:rgba(66,133,244,1);
}
} }
.ans-ringht{ .ans-ringht {
font-size: 28px; font-size: 28px;
width: 172px; width: 172px;
height: 60px; height: 60px;
border-radius: 2px; border-radius: 2px;
color: rgba(255,255,255,1); color: rgba(255, 255, 255, 1);
text-align: center; text-align: center;
line-height: 60px; line-height: 60px;
background:rgb(108, 191, 112) background: rgb(108, 191, 112);
} }
} }
.question-analysis{ .question-analysis {
width: 100%; width: 100%;
padding: 0.1rem 0.3rem; padding: 0.1rem 0.3rem;
text-align: justify; text-align: justify;
...@@ -102,29 +106,32 @@ ...@@ -102,29 +106,32 @@
.exam-media { .exam-media {
width: 100%; width: 100%;
padding: 30px; padding: 30px;
img,video,audio { img,
video,
audio {
width: 100%; width: 100%;
} }
} }
.exam-question { .exam-question {
width: 100%; width: 100%;
padding-top: 44*@len; height: 100%;
padding-bottom: .98rem; background: linear-gradient(0deg, #ff9286 0%, #d23a29),
// background-color: #f6f6f6; linear-gradient(180deg, rgba(255, 255, 255, 0) 59%, #f5f5f5 100%),
.btn-flex{ linear-gradient(0deg, rgba(210, 58, 41, 0) 0%, #d23a29);
.btn-flex {
background-color: #fff; background-color: #fff;
padding: .2rem .3rem .3rem .3rem; padding: 0.2rem 0.3rem 0.3rem 0.3rem;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
a:hover{ a:hover {
color: #fff; color: #fff;
text-decoration:none; text-decoration: none;
} }
} }
.top-header { .top-header {
width: 100%; width: 100%;
height: 44*@len; height: 44 * @len;
position: fixed; position: fixed;
left: 0; left: 0;
top: 0; top: 0;
...@@ -134,11 +141,11 @@ ...@@ -134,11 +141,11 @@
.header { .header {
width: 100%; width: 100%;
justify-content: center; justify-content: center;
line-height: 44*@len; line-height: 44 * @len;
text-align: center; text-align: center;
font-size: 15*@len; font-size: 15 * @len;
color: #4a4a4a; color: #4a4a4a;
padding:0; padding: 0;
span { span {
color: #000; color: #000;
} }
...@@ -149,106 +156,101 @@ ...@@ -149,106 +156,101 @@
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding: 0 0.2rem; padding: 0 0.2rem;
height: 44*@len; height: 44 * @len;
span { span {
font-size: 15*@len; font-size: 15 * @len;
} }
span.mark { span.mark {
color: @common-blue;
color: @common-blue
} }
} }
} }
.top-header1 {
.top-header1{
// position: fixed; // position: fixed;
margin: 30px; margin: 30px;
height: 390px; height: 390px;
/* width: 100%; */ /* width: 100%; */
background: rgba(255,255,255,1); background: rgba(255, 255, 255, 1);
box-shadow: 0px -2px 17px 0px rgba(0,0,0,0.08); box-shadow: 0px -2px 17px 0px rgba(0, 0, 0, 0.08);
border-radius: 10px; border-radius: 10px;
padding: 40px; padding: 40px;
.paperName{ .paperName {
font-size:32px; font-size: 32px;
font-weight:400; font-weight: 400;
color:rgba(74,74,74,1); color: rgba(74, 74, 74, 1);
text-align: center; text-align: center;
display: -webkit-box; display: -webkit-box;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
-webkit-line-clamp: 2; -webkit-line-clamp: 2;
overflow: hidden; overflow: hidden;
} }
.qus-total{ .qus-total {
font-size: 24px; font-size: 24px;
font-weight: 400; font-weight: 400;
color: rgba(66,133,244,1); color: rgba(66, 133, 244, 1);
} }
.mark1{ .mark1 {
font-size: 48px; font-size: 48px;
font-weight: 600; font-weight: 600;
color: rgba(66,133,244,1); color: rgba(66, 133, 244, 1);
line-height: 64px; line-height: 64px;
text-align: center; text-align: center;
.score{ .score {
font-size: 128px; font-size: 128px;
line-height: 1; line-height: 1;
} }
.underLineImg{ .underLineImg {
width: 136px; width: 136px;
height: 34px; height: 34px;
margin-top: -100px; margin-top: -100px;
} }
.fen{ .fen {
font-size:28px; font-size: 28px;
font-weight:600; font-weight: 600;
color:rgba(66,133,244,1); color: rgba(66, 133, 244, 1);
} }
} }
} }
.no-course{ .no-course {
margin-bottom: -98px; margin-bottom: -98px;
font-size:24px; font-size: 24px;
background-color: #fff; background-color: #fff;
} }
.count-time { .count-time {
font-size: 15*@len; font-size: 15 * @len;
line-height: 44*@len; line-height: 44 * @len;
//color: #dd4457; //color: #dd4457;
color: rgba(0, 0, 0, 0.65); color: rgba(0, 0, 0, 0.65);
height: 44*@len; height: 44 * @len;
position: fixed; position: fixed;
top: 0; top: 0;
left: 32px; left: 32px;
z-index: 101; z-index: 101;
} }
.submit-exam-paper-btn{ .submit-exam-paper-btn {
font-size: 24px; font-size: 24px;
color: #333; color: #333;
height: 44*@len; height: 44 * @len;
line-height: 44*@len; line-height: 44 * @len;
position: fixed; position: fixed;
top: 0; top: 0;
right: 30px; right: 30px;
z-index: 101; z-index: 101;
img{ img {
width: 24px; width: 24px;
margin-right: 8px; margin-right: 8px;
margin-top: -5px; margin-top: -5px;
} }
} }
.occupy { .occupy {
width: 100%; width: 100%;
height: 44*@len; height: 44 * @len;
} }
.commonBtn { .commonBtn {
width: 100%; width: 100%;
height: .98rem; height: 0.98rem;
border-top: 2px solid #e4e4e4; border-top: 2px solid #e4e4e4;
position: fixed; position: fixed;
bottom: 0; bottom: 0;
...@@ -256,19 +258,19 @@ ...@@ -256,19 +258,19 @@
background: #fff; background: #fff;
.flex-item-style { .flex-item-style {
flex: 1; flex: 1;
height: .98rem; height: 0.98rem;
display: flex; display: flex;
justify-content: flex-start justify-content: flex-start;
} }
.flex-item-btn { .flex-item-btn {
flex: 3; flex: 3;
height: .98rem; height: 0.98rem;
padding-top: 14px; padding-top: 14px;
} }
button.submit { button.submit {
width: 100%; width: 100%;
height: .98rem; height: 0.98rem;
line-height: .98rem; line-height: 0.98rem;
border: 0; border: 0;
background-color: #999; background-color: #999;
font-size: 0.32rem; font-size: 0.32rem;
...@@ -276,14 +278,14 @@ ...@@ -276,14 +278,14 @@
} }
button.active-submit { button.active-submit {
width: 100%; width: 100%;
height: .98rem; height: 0.98rem;
line-height: .98rem; line-height: 0.98rem;
border: 0; border: 0;
background-color: @common-blue; background-color: @common-blue;
font-size: 0.32rem; font-size: 0.32rem;
color: #fff; color: #fff;
} }
button.click-to-next{ button.click-to-next {
width: 212px; width: 212px;
height: 70px; height: 70px;
line-height: 68px; line-height: 68px;
...@@ -297,24 +299,24 @@ ...@@ -297,24 +299,24 @@
border: 0; border: 0;
} }
.questionCard { .questionCard {
padding-left: .26rem; padding-left: 0.26rem;
font-size: .24rem; font-size: 0.24rem;
color: #636363; color: #636363;
-ms-text-align-last: right; -ms-text-align-last: right;
background-color: #fff; background-color: #fff;
text-align: left; text-align: left;
border: 0; border: 0;
line-height: .98rem; line-height: 0.98rem;
} }
} }
} }
.question-score-result{ .question-score-result {
font-size: 36px; font-size: 36px;
margin-left: .2rem; margin-left: 0.2rem;
color: @common-blue; color: @common-blue;
position: relative; position: relative;
top: -10px; top: -10px;
.sub-info{ .sub-info {
position: inherit; position: inherit;
top: -4px; top: -4px;
font-size: 24px; font-size: 24px;
...@@ -340,23 +342,24 @@ ...@@ -340,23 +342,24 @@
border-top: 0.02rem solid #eee; border-top: 0.02rem solid #eee;
} }
.exam-question{ .exam-question {
// padding-top: 60px; // padding-top: 60px;
// background: rgba(243,243,243,1); // background: rgba(243,243,243,1);
} }
.sep-bottom{ .sep-bottom {
height:20px; height: 20px;
background-color: #fff; background-color: #fff;
} }
.exam-list-display-container,.am-list-view-scrollview{ .exam-list-display-container,
.sep-bottom{ .am-list-view-scrollview {
height:20px; .sep-bottom {
background-color:rgba(243, 243, 243, 1); height: 20px;
background-color: rgba(243, 243, 243, 1);
margin-bottom: -2px; margin-bottom: -2px;
} }
.question-block:last-child{ .question-block:last-child {
.sep-bottom{ .sep-bottom {
background-color: #fff; background-color: #fff;
} }
} }
......
src/components/exam/showAnwser/ShowAnswer.jsx
import React, {Component} from 'react'; import React, { Component } from "react";
import {ListView} from 'antd-mobile'; import { ListView } from "antd-mobile";
import AnswerItem from './AnswerItem/AnswerItem'; import AnswerItem from "./AnswerItem/AnswerItem";
import * as ShowAnswerAction from './ShowAnswerAction'; import * as ShowAnswerAction from "./ShowAnswerAction";
import blackBg from "../../../common/mediaDisplay/black-bg.png"; import blackBg from "../../../common/mediaDisplay/black-bg.png";
import {connect} from 'react-redux'; import { connect } from "react-redux";
//import './ShowAnswer.less'; //import './ShowAnswer.less';
import '../less/examquestion.less'; import "../less/examquestion.less";
import underLineImg from '../../../static/image/exam/underline.png' import underLineImg from "../../../static/image/exam/underline.png";
import intl from "react-intl-universal"; import intl from "react-intl-universal";
class ShowAnswer extends Component { class ShowAnswer extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.timer = null; this.timer = null;
let dataSource = new ListView.DataSource({rowHasChanged: (row1, row2) => row1 !== row2}); let dataSource = new ListView.DataSource({
let {id, type,state} = this.props.location.query; rowHasChanged: (row1, row2) => row1 !== row2,
let {isAnswer} = this.props.ShowAnswerReducer; });
this.state = { let { id, type, state } = this.props.location.query;
questions: dataSource, let { isAnswer } = this.props.ShowAnswerReducer;
timeStr: "00:00:00", this.state = {
index: 0, questions: dataSource,
examId: id, timeStr: "00:00:00",
type: type, index: 0,
pageNo: 1, examId: id,
pageSize: 10, type: type,
height: document.documentElement.clientHeight - (Number.parseFloat(document.documentElement.style.fontSize) * 0.84), pageNo: 1,
isUpMount: true, pageSize: 10,
isAnswer: 0, height:
isAnalysis: 0, document.documentElement.clientHeight -
refreshKey: '', Number.parseFloat(document.documentElement.style.fontSize) * 0.84,
isLoading: true, isUpMount: true,
isMore:true, isAnswer: 0,
paperName: '', isAnalysis: 0,
isAnswerPaper:'', refreshKey: "",
}; isLoading: true,
this.questionItem = this.questionItem.bind(this); isMore: true,
} paperName: "",
isAnswerPaper: "",
componentDidMount() {
let {examId, type, pageNo, pageSize} = this.state;
let params = {
answerId: examId,
pageNo: pageNo,
pageSize: pageSize,
type: type
};
let _this = this;
this.props.showAnswerAction(params, false, () => {
let {isAnswer, isAnalysis,isMore,paperName,isAnswerPaper} = _this.props.ShowAnswerReducer;
_this.setState({
isAnswer: isAnswer,
isAnalysis: isAnalysis,
isLoading: false,
refreshKey: new Date().getTime(),
isMore,
paperName,
isAnswerPaper,
})
});
}
componentWillReceiveProps = (nextProps) => {
if (nextProps.ShowAnswerReducer.questions !== this.props.ShowAnswerReducer.questions) {
this.setState({
questions: this.state.questions.cloneWithRows(nextProps.ShowAnswerReducer.questions),
});
}
}; };
timeDuration = (time) => { this.questionItem = this.questionItem.bind(this);
let h = this.addZero(Number.parseInt(time / 3600 % 24)); }
let m = this.addZero(Number.parseInt(time / 60 % 60));
let s = this.addZero(Number.parseInt(time % 60)); componentDidMount() {
return h + ":" + m + ":" + s; let { examId, type, pageNo, pageSize } = this.state;
let params = {
answerId: examId,
pageNo: pageNo,
pageSize: pageSize,
type: type,
}; };
addZero = (n) => n < 10 ? '0' + n : n; let _this = this;
this.props.showAnswerAction(params, false, () => {
let { isAnswer, isAnalysis, isMore, paperName, isAnswerPaper } =
_this.props.ShowAnswerReducer;
_this.setState({
isAnswer: isAnswer,
isAnalysis: isAnalysis,
isLoading: false,
refreshKey: new Date().getTime(),
isMore,
paperName,
isAnswerPaper,
});
});
}
componentWillUnmount() { componentWillReceiveProps = (nextProps) => {
this.props.showAnswerInitialReducer(); if (
nextProps.ShowAnswerReducer.questions !==
this.props.ShowAnswerReducer.questions
) {
this.setState({
questions: this.state.questions.cloneWithRows(
nextProps.ShowAnswerReducer.questions
),
});
} }
};
timeDuration = (time) => {
let h = this.addZero(Number.parseInt((time / 3600) % 24));
let m = this.addZero(Number.parseInt((time / 60) % 60));
let s = this.addZero(Number.parseInt(time % 60));
return h + ":" + m + ":" + s;
};
addZero = (n) => (n < 10 ? "0" + n : n);
render() { componentWillUnmount() {
let {questions, height,type,paperName,isAnswerPaper} = this.state; this.props.showAnswerInitialReducer();
let { isMore,duration, score, pageTotal,isScore=0} = this.props.ShowAnswerReducer; }
let {isLookAnswer}= this.props.location.query;
let separator = (sectionID, rowID) => ( render() {
let { questions, height, type, paperName, isAnswerPaper } = this.state;
let {
isMore,
duration,
score,
pageTotal,
isScore = 0,
} = this.props.ShowAnswerReducer;
let { isLookAnswer } = this.props.location.query;
let separator = (sectionID, rowID) => (
<div
key={`${sectionID}-${rowID}`}
style={{
height: 0,
borderTop: "1px solid #ECECED",
overflow: "hidden",
}}
/>
);
return (
<div className="exam-question">
<div className="top-header1" style={{ marginTop: "-40px" }}>
<div className="finish-answer-header1">
<div <div
key={`${sectionID}-${rowID}`} className="paperName"
style={{height: 0, borderTop: '1px solid #ECECED', overflow: "hidden"}} style={{ WebkitBoxOrient: "vertical" }}
/> >{`${paperName}`}</div>
); <div className="qus-total">{`${
return ( intl.get("total1") || "共"
<div className="exam-question" style={{backgroundColor:"rgba(243,243,243,1)"}}> } ${pageTotal} ${intl.get("questions") || "题"}`}</div>
{/* <div className="top-header"> <div className="mark1">
<div className="finish-answer-header"> {type == 0 ? (
<span>{`共 ${pageTotal} 题`}</span> <span style={{ fontSize: "92px", lineHeight: "184px" }}>
<span>{`用时${this.timeDuration(duration)}`}</span> {intl.get("PublishKey5") || "批阅中"}
<span className="mark">{`${score} 分`}</span> </span>
) : isLookAnswer == 0 || isAnswerPaper == 3 ? (
intl.get("ExamContentClosedNotice") || "管理员已关闭试卷显示"
) : isLookAnswer == 2 ? (
intl.get("ExamedShowJuan") || "考试结束后显示试卷"
) : (
<div>
{isScore == 0 ? ( // bug12412答卷详情分数显示策略zhouzhongyang20200720
<div className="mark-end">
{intl.get("ResultClosedNotice") || "本场考试成绩不显示"}
</div>
) : isScore == 2 ? (
<div className="mark-end">
{intl.get("ResultShowNotice") || "本场考试后显示成绩"}
</div> </div>
</div> */} ) : (
<div className="top-header1" style={{marginTop:"-40px"}}> <div className="score">
<div className="finish-answer-header1"> <span>{score && score.toFixed(1)}</span>
<div className="paperName" style={{WebkitBoxOrient:"vertical"}}>{`${paperName}`}</div> <span className="fen">{intl.get("Pts") || "分"}</span>
<div className="qus-total">{`${intl.get("total1") || "共"} ${pageTotal} ${intl.get("questions") || "题"}`}</div> <br />
<div className="mark1"> <img className="underLineImg" src={underLineImg} alt="" />
{type==0? <span style={{fontSize:"92px",lineHeight:"184px"}}>{intl.get("PublishKey5") || "批阅中"}</span> :
(isLookAnswer==0||isAnswerPaper==3)?(intl.get("ExamContentClosedNotice") || "管理员已关闭试卷显示"):
isLookAnswer==2?(intl.get("ExamedShowJuan") || "考试结束后显示试卷"):
<div>
{ isScore == 0 ? // bug12412答卷详情分数显示策略zhouzhongyang20200720
<div className="mark-end">{intl.get("ResultClosedNotice") || "本场考试成绩不显示"}</div> :
isScore== 2 ?
<div className="mark-end">{intl.get("ResultShowNotice") || "本场考试后显示成绩"}</div> :
<div className="score">
<span>{score&&score.toFixed(1)}</span>
<span className="fen" >{intl.get("Pts") || "分"}</span>
<br/>
<img className="underLineImg" src={underLineImg} alt=""/>
</div>
}
</div>}
</div>
</div> </div>
)}
</div> </div>
)}
{ ( isLookAnswer==0||isLookAnswer==2 || isAnswerPaper==3)?
"没有相关内容"
:
<ListView
key={this.state.refreshKey}
dataSource={questions}
renderFooter={() => (<div style={{padding: 30, textAlign: 'center'}}>
{this.state.isLoading ? (intl.get("PublishKey23") || '加载中...') : (!isMore ? (intl.get("PublishKey30") || '没有更多数据') : (intl.get("PublishKey23") || '加载中...'))}
</div>)}
style={{width: "100%"}}
useBodyScroll={true}
pageSize={1}
renderRow={(rowData, sectionID, rowID) => this.questionItem(rowData, sectionID, rowID)}
renderSeparator={separator}
scrollRenderAheadDistance={500}
onEndReached={() => this.onEndReached()}
onEndReachedThreshold={10}
/>}
</div> </div>
); </div>
} </div>
onEndReached = () => { {isLookAnswer == 0 || isLookAnswer == 2 || isAnswerPaper == 3 ? (
if (this.state.isLoading || !this.state.isMore) { "没有相关内容"
return; ) : (
} <ListView
let _this = this; key={this.state.refreshKey}
this.setState({ dataSource={questions}
isLoading: true renderFooter={() => (
}); <div style={{ padding: 30, textAlign: "center" }}>
let {pageNo} = this.props.ShowAnswerReducer; {this.state.isLoading
let {examId, type, pageSize} = this.state; ? intl.get("PublishKey23") || "加载中..."
let params = { : !isMore
answerId: examId, ? intl.get("PublishKey30") || "没有更多数据"
pageNo: pageNo, : intl.get("PublishKey23") || "加载中..."}
pageSize: pageSize, </div>
type: type )}
}; style={{ width: "100%" }}
this.props.showAnswerAction(params, true, () => { useBodyScroll={true}
_this.setState({ pageSize={1}
isLoading: false renderRow={(rowData, sectionID, rowID) =>
}) this.questionItem(rowData, sectionID, rowID)
}); }
}; renderSeparator={separator}
scrollRenderAheadDistance={500}
onEndReached={() => this.onEndReached()}
onEndReachedThreshold={10}
/>
)}
</div>
);
}
renderExamMedia(mediaUrl) { onEndReached = () => {
if (!mediaUrl) { if (this.state.isLoading || !this.state.isMore) {
return; return;
} }
var mediaType = mediaUrl.split(".")[mediaUrl.split(".").length - 1]; let _this = this;
switch (mediaType) { this.setState({
case "jpg" || "jpeg" || "png" || "gif": isLoading: true,
return <img src={mediaUrl} alt=""/>; });
case "mp4": let { pageNo } = this.props.ShowAnswerReducer;
return <video src={mediaUrl} poster={blackBg} style={{maxHeight: 500}} controls preload/>; let { examId, type, pageSize } = this.state;
case "mp3": let params = {
return <audio src={mediaUrl} controls preload/>; answerId: examId,
default: pageNo: pageNo,
return ""; pageSize: pageSize,
} type: type,
}; };
this.props.showAnswerAction(params, true, () => {
_this.setState({
isLoading: false,
});
});
};
questionItem(item, sectionId, rowId) { renderExamMedia(mediaUrl) {
let {isAnswer, isAnalysis} = this.state; if (!mediaUrl) {
return;
}
var mediaType = mediaUrl.split(".")[mediaUrl.split(".").length - 1];
switch (mediaType) {
case "jpg" || "jpeg" || "png" || "gif":
return <img src={mediaUrl} alt="" />;
case "mp4":
return ( return (
<div className="question-block" key={rowId}> <video
<div className="question-topic" style={{marginBottom: "-60px"}}> src={mediaUrl}
<h4 > poster={blackBg}
{`${Number.parseInt(rowId) + 1}`}. style={{ maxHeight: 500 }}
<span className={"item-type"}>{`${this.itemType(item.type)}`}({item.fullScore}{intl.get("Pts") ||"分"})</span> controls
</h4> preload
<div className="question-score-result"> />
{ parseFloat(item.score)>=0?<span>{item.score}<span className="sub-info">{intl.get("Scores") ||"得分"}</span></span>: );
<span className="sub-info"> case "mp3":
{item.score == "readOver001" ? return <audio src={mediaUrl} controls preload />;
intl.get("readOver001") || "批阅中" default:
: return "";
item.score }
} }
</span>
}
</div>
</div>
<div className="question-topic">
<h4 style={{marginBottom:"0", whiteSpace: 'pre-wrap'}}>{`${item.stem}`}</h4>
</div>
<div className="exam-media">
{this.renderExamMedia(item.stemAppendixUrl)}
</div>
<AnswerItem isAnswer={isAnswer} data={item.options} isType={item.type}/>
{isAnswer==1 && item.type !=4?
<div className="question-ans">
{item.isTrue==1?
<p>
<p className="ans-ringht" >{intl.get("Correct") || "回答正确"}
</p>
<div style={{height:0, borderTop:"2px dashed rgba(239, 239, 244, 1)", margin: "30px 0"}}></div>
</p>
:item.isTrue==0?
<p>
<p className="ans-wrong" >{intl.get("Wrong") || "回答错误"}</p>
<div style={{height:0, borderTop:"2px dashed rgba(239, 239, 244, 1)", margin: "30px 0"}}></div>
{item.type==4?
<p className="ans">{intl.get("Answers") || "答案"}：<span>{item.rightAnswers&&item.rightAnswers[0]}</span></p>
:
<p className="ans">{intl.get("Answers") || "答案"}：<span>{item.rightAnswers&&item.rightAnswers.map((el,index)=>{
return ((intl.get("Option") || "选项 ")+el+"; ")
})}</span></p>}
</p>:""
}
</div>:"" questionItem(item, sectionId, rowId) {
} let { isAnswer, isAnalysis } = this.state;
{ return (
isAnalysis == 1 ? <div className="question-block" key={rowId}>
<div className="question-analysis"> <div style={{ backgroundColor: "#fff" }}>
<p <div className="question-topic" style={{ marginBottom: "-60px" }}>
style={{fontSize: 30, color: "rgba(3, 3, 3, 1)"}} <h4>
> {`${Number.parseInt(rowId) + 1}`}.
{intl.get("PublishKey32") || "题目解析"}: <br/><span style={{fontSize: 30, color: "#9b9b9b", whiteSpace: 'pre-wrap'}}>{item.analysis?item.analysis:(intl.get("NoDataYet") || "暂无数据")}</span> <span className={"item-type"}>
</p> {`${this.itemType(item.type)}`}({item.fullScore}
</div> : null {intl.get("Pts") || "分"})
} </span>
<div className="sep-bottom" ></div> </h4>
<div className="question-score-result">
{parseFloat(item.score) >= 0 ? (
<span>
{item.score}
<span className="sub-info">
{intl.get("Scores") || "得分"}
</span>
</span>
) : (
<span className="sub-info">
{item.score == "readOver001"
? intl.get("readOver001") || "批阅中"
: item.score}
</span>
)}
</div> </div>
); </div>
}; <div className="question-topic">
<h4
style={{ marginBottom: "0", whiteSpace: "pre-wrap" }}
>{`${item.stem}`}</h4>
</div>
<div className="exam-media">
{this.renderExamMedia(item.stemAppendixUrl)}
</div>
<AnswerItem
isAnswer={isAnswer}
data={item.options}
isType={item.type}
/>
{isAnswer == 1 && item.type != 4 ? (
<div className="question-ans">
{item.isTrue == 1 ? (
<p>
<p className="ans-ringht">
{intl.get("Correct") || "回答正确"}
</p>
<div
style={{
height: 0,
borderTop: "2px dashed rgba(239, 239, 244, 1)",
margin: "30px 0",
}}
></div>
</p>
) : item.isTrue == 0 ? (
<p>
<p className="ans-wrong">{intl.get("Wrong") || "回答错误"}</p>
<div
style={{
height: 0,
borderTop: "2px dashed rgba(239, 239, 244, 1)",
margin: "30px 0",
}}
></div>
{item.type == 4 ? (
<p className="ans">
{intl.get("Answers") || "答案"}：
<span>{item.rightAnswers && item.rightAnswers[0]}</span>
</p>
) : (
<p className="ans">
{intl.get("Answers") || "答案"}：
<span>
{item.rightAnswers &&
item.rightAnswers.map((el, index) => {
return (intl.get("Option") || "选项 ") + el + "; ";
})}
</span>
</p>
)}
</p>
) : (
""
)}
</div>
) : (
""
)}
{isAnalysis == 1 ? (
<div className="question-analysis">
<p style={{ fontSize: 30, color: "rgba(3, 3, 3, 1)" }}>
{intl.get("PublishKey32") || "题目解析"}: <br />
<span
style={{
fontSize: 30,
color: "#9b9b9b",
whiteSpace: "pre-wrap",
}}
>
{item.analysis
? item.analysis
: intl.get("NoDataYet") || "暂无数据"}
</span>
</p>
</div>
) : null}
<div className="sep-bottom"></div>
</div>
</div>
);
}
itemType = (type) => { itemType = (type) => {
switch (Number.parseInt(type)) { switch (Number.parseInt(type)) {
case 1: case 1:
return intl.get("SingleChoice") || "单选题"; return intl.get("SingleChoice") || "单选题";
case 2: case 2:
return intl.get("MultipleChoice") || '多选题'; return intl.get("MultipleChoice") || "多选题";
case 3: case 3:
return intl.get("TrueFalse") || '判断题'; return intl.get("TrueFalse") || "判断题";
case 4: case 4:
return intl.get("Essay") || '问答题'; return intl.get("Essay") || "问答题";
default: default:
return ''; return "";
}
} }
};
} }
export default connect(state => { export default connect((state) => {
let {ShowAnswerReducer} = state; let { ShowAnswerReducer } = state;
return { return {
ShowAnswerReducer ShowAnswerReducer,
} };
}, ShowAnswerAction)(ShowAnswer); }, ShowAnswerAction)(ShowAnswer);
\ No newline at end of file
src/components/globalsearch/component/GlobalSearchList/index.jsx
...@@ -588,8 +588,6 @@ class GlobalSearchResultListItem extends Component { ...@@ -588,8 +588,6 @@ class GlobalSearchResultListItem extends Component {
return intl.get("Research") || '调研'; return intl.get("Research") || '调研';
case 'lecturer': case 'lecturer':
return intl.get("Lecturer") || '讲师'; return intl.get("Lecturer") || '讲师';
case 'marketingCourse':
return intl.get("PublishKey131") || '营销';
case 'studentCase': case 'studentCase':
return intl.get("case") || '作品'; return intl.get("case") || '作品';
case 'albums': case 'albums':
......
src/components/globalsearch/component/GlobalSearchList/marketItem.jsx
...@@ -19,9 +19,7 @@ class MarketItem extends Component { ...@@ -19,9 +19,7 @@ class MarketItem extends Component {
case 3: case 3:
sourceText = intl.get("globalsearch5") || '外部采购'; sourceText = intl.get("globalsearch5") || '外部采购';
break; break;
case 4:
sourceText = intl.get("globalsearch6") || '课程营销';
break;
} }
console.log(rowData) console.log(rowData)
let accountId = sessionStorage.getItem("accountId"); let accountId = sessionStorage.getItem("accountId");
......
src/components/globalsearch/index.jsx
...@@ -46,7 +46,6 @@ class GlobalSearch extends Component { ...@@ -46,7 +46,6 @@ class GlobalSearch extends Component {
}, },
searchResultTabs: [ searchResultTabs: [
{ key: 'course', title: intl.get("Course") || '课程' }, { key: 'course', title: intl.get("Course") || '课程' },
{ key: 'marketingCourse', title: intl.get("PublishKey131") || '营销' },
{ key: 'trainingProject', title: intl.get("TrainingProgram2") || '项目' }, { key: 'trainingProject', title: intl.get("TrainingProgram2") || '项目' },
{ key: 'exam', title: intl.get("Exam") || '考试' }, { key: 'exam', title: intl.get("Exam") || '考试' },
{ key: 'assignment', title: intl.get("Assignment") || '作业' }, { key: 'assignment', title: intl.get("Assignment") || '作业' },
...@@ -115,12 +114,6 @@ class GlobalSearch extends Component { ...@@ -115,12 +114,6 @@ class GlobalSearch extends Component {
searchResultTabs.push({ key: 'course', title: intl.get("Course") || '课程' }); searchResultTabs.push({ key: 'course', title: intl.get("Course") || '课程' });
} }
if ( if (
searchResult.marketingCourses &&
searchResult.marketingCourses.length > 0
) {
searchResultTabs.push({ key: 'marketingCourse', title: intl.get("globalsearch1") || '营销' });
}
if (
searchResult.trainingProjects && searchResult.trainingProjects &&
searchResult.trainingProjects.length > 0 searchResult.trainingProjects.length > 0
) { ) {
......
src/components/indexComponent/indexBtnScroll/style.css
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
} }
.index-btn-scroll-container { .index-btn-scroll-container {
width: 100%; width: 100%;
padding: 16px 30px 0 30px; padding: 40px 10px 0 10px;
background-color: #f5f5f5; background-color: #f5f5f5;
} }
.index-btn-scroll-container .index-simple-scroll-bar-wrap { .index-btn-scroll-container .index-simple-scroll-bar-wrap {
......
src/components/indexComponent/indexBtnScroll/style.less
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
.index-btn-scroll-container { .index-btn-scroll-container {
width: 100%; width: 100%;
padding: 16px 30px 0 30px; padding: 40px 10px 0 10px;
background-color: @indexBgColor; background-color: @indexBgColor;
.index-simple-scroll-bar-wrap{ .index-simple-scroll-bar-wrap{
width: 100%; width: 100%;
......
src/components/indexComponent/indexComponent/index.jsx
...@@ -19,7 +19,6 @@ import moment from "moment"; ...@@ -19,7 +19,6 @@ import moment from "moment";
const IndexTitle = ({ title, onClick, hasMore, hasExchange }) => { const IndexTitle = ({ title, onClick, hasMore, hasExchange }) => {
return ( return (
<div className="index-module-title-container"> <div className="index-module-title-container">
<div className="index-module-title-text">{title}</div>
{hasMore ? ( {hasMore ? (
<div className="index-module-title-more-btn" onClick={onClick}> <div className="index-module-title-more-btn" onClick={onClick}>
{intl.get("course27")} {intl.get("course27")}
...@@ -138,7 +137,6 @@ const IndexModuleBg = ({ bgColor, children }) => { ...@@ -138,7 +137,6 @@ const IndexModuleBg = ({ bgColor, children }) => {
<div className="index-module-bg-container"> <div className="index-module-bg-container">
<div <div
className="index-module-inside-bg-container" className="index-module-inside-bg-container"
style={{ backgroundColor: bgColor ? bgColor : "#fff" }}
> >
{children} {children}
</div> </div>
...@@ -234,7 +232,7 @@ const IndexLiveItem = ({ data, onClick }) => { ...@@ -234,7 +232,7 @@ const IndexLiveItem = ({ data, onClick }) => {
// 首页新闻模块单项 // 首页新闻模块单项
const IndexNewsItem = ({ data, onClick }) => { const IndexNewsItem = ({ data, onClick }) => {
let imageWidth = Math.floor(document.body.clientWidth * (220 / 750)); let imageWidth = Math.floor(document.body.clientWidth * (55 / 187));
let imageHeight = Math.floor(imageWidth * (132 / 220)); let imageHeight = Math.floor(imageWidth * (132 / 220));
imageWidth = imageWidth < 220 ? 220 : imageWidth; imageWidth = imageWidth < 220 ? 220 : imageWidth;
imageHeight = imageHeight < 132 ? 132 : imageHeight; imageHeight = imageHeight < 132 ? 132 : imageHeight;
...@@ -246,7 +244,7 @@ const IndexNewsItem = ({ data, onClick }) => { ...@@ -246,7 +244,7 @@ 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: imageHeight }} style={{ width: imageWidth, height: '180px' }}
/> />
<div <div
className="index-module-news-info-container" className="index-module-news-info-container"
......
src/components/indexComponent/indexComponent/style.css
...@@ -130,14 +130,11 @@ ...@@ -130,14 +130,11 @@
background-color: #f0f0f0; background-color: #f0f0f0;
} }
.index-module-bg-container { .index-module-bg-container {
width: 100%; width: 94%;
padding: 0 30px; margin: 0 auto;
} }
.index-module-bg-container .index-module-inside-bg-container { .index-module-bg-container .index-module-inside-bg-container {
background-color: #fff;
border-radius: 10px;
width: 100%; width: 100%;
padding: 8px 0;
} }
.index-module-scroll-bg-container { .index-module-scroll-bg-container {
width: 100%; width: 100%;
...@@ -303,7 +300,8 @@ ...@@ -303,7 +300,8 @@
} }
.index-module-news-item-container { .index-module-news-item-container {
width: 100%; width: 100%;
padding: 24px 30px; padding: 20px 30px;
padding-bottom: 16px;
} }
.index-module-news-item-container .index-module-news-item-content-container { .index-module-news-item-container .index-module-news-item-content-container {
width: 100%; width: 100%;
...@@ -311,7 +309,7 @@ ...@@ -311,7 +309,7 @@
justify-content: space-between; justify-content: space-between;
} }
.index-module-news-item-container .index-module-news-item-content-container .index-module-news-info-container { .index-module-news-item-container .index-module-news-item-content-container .index-module-news-info-container {
width: 60%; width: 64%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
...@@ -348,7 +346,7 @@ ...@@ -348,7 +346,7 @@
margin-top: -5px; margin-top: -5px;
} }
.index-module-news-item-container .index-module-news-item-content-container .index-module-news-item-image { .index-module-news-item-container .index-module-news-item-content-container .index-module-news-item-image {
border-radius: 10px; border-radius: 0px;
} }
.index-module-train-item-one-container { .index-module-train-item-one-container {
width: 100%; width: 100%;
......
src/components/indexComponent/indexComponent/style.less
...@@ -137,14 +137,11 @@ ...@@ -137,14 +137,11 @@
} }
.index-module-bg-container { .index-module-bg-container {
width: 100%; width: 94%;
padding: 0 30px; margin: 0 auto;
.index-module-inside-bg-container { .index-module-inside-bg-container {
background-color: #fff;
border-radius: 10px;
width: 100%; width: 100%;
padding: 8px 0;
} }
} }
...@@ -319,7 +316,8 @@ ...@@ -319,7 +316,8 @@
.index-module-news-item-container { .index-module-news-item-container {
width: 100%; width: 100%;
padding: 24px 30px; padding: 20px 30px;
padding-bottom: 16px;
.index-module-news-item-content-container { .index-module-news-item-content-container {
width: 100%; width: 100%;
...@@ -327,7 +325,7 @@ ...@@ -327,7 +325,7 @@
justify-content: space-between; justify-content: space-between;
.index-module-news-info-container { .index-module-news-info-container {
width: 60%; width: 64%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
...@@ -361,7 +359,7 @@ ...@@ -361,7 +359,7 @@
} }
.index-module-news-item-image { .index-module-news-item-image {
border-radius: 10px; border-radius: 0px;
} }
} }
} }
......
src/components/login/login.css
...@@ -41,41 +41,43 @@ ...@@ -41,41 +41,43 @@
} }
.login .login-container .login-form { .login .login-container .login-form {
width: 100%; width: 100%;
margin-top: 240px; margin-top: 240px !important;
padding-left: 40px; padding-left: 40px;
padding-right: 40px; padding-right: 40px;
} }
.login .login-container .login-form .login-form-item { .login .login-container .login-form .login-form-item {
width: 100%; width: 96%;
margin: 0 auto;
} }
.login .login-container .login-form .login-form-item .login-form-top-logo { .login .login-container .login-form .login-form-item .login-form-top-logo {
margin-bottom: 20px; margin-bottom: 60px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.login .login-container .login-form .login-form-item .login-form-top-logo .login-input-top-icon { .login .login-container .login-form .login-form-item .login-form-top-logo .login-input-top-icon {
width: 120px; width: 150px;
height: 120px; height: 150px;
margin-bottom: 60px; margin-bottom: 60px;
} }
.login .login-container .login-form .login-form-item .login-form-top-logo .login-input-top-font { .login .login-container .login-form .login-form-item .login-form-top-logo .login-input-top-font {
color: #F5222D; color: #f5222d;
font-weight: 600; font-weight: 600;
} }
.login .login-container .login-form .login-form-item .login-form-input-container { .login .login-container .login-form .login-form-item .login-form-input-container {
width: 100%; width: 100%;
margin: 0 auto;
border-radius: 12px; border-radius: 12px;
} }
.login .login-container .login-form .login-form-item .login-form-input-container .login-form-single-label { .login .login-container .login-form .login-form-item .login-form-input-container .login-form-single-label {
font-size: 36px; font-size: 32px;
font-weight: bold; font-weight: bold;
} }
.login .login-container .login-form .login-form-item .login-form-input-container .login-form-single-container { .login .login-container .login-form .login-form-item .login-form-input-container .login-form-single-container {
width: 100%; width: 100%;
padding: 30px 20px 20px 30px; padding: 30px 20px 20px 30px;
border: 1px solid #D23A29; border: 1px solid #d23a29;
border-radius: 5px; border-radius: 5px;
margin-top: 15px; margin-top: 15px;
background-color: #fff; background-color: #fff;
...@@ -93,7 +95,7 @@ ...@@ -93,7 +95,7 @@
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
color: #D23A29; color: #d23a29;
} }
.login .login-container .login-form .login-form-item .login-form-input-container .login-form-single-container .form-item input { .login .login-container .login-form .login-form-item .login-form-input-container .login-form-single-container .form-item input {
height: 47px; height: 47px;
...@@ -114,7 +116,7 @@ ...@@ -114,7 +116,7 @@
.login .login-container .login-form .login-form-item button { .login .login-container .login-form .login-form-item button {
width: 100%; width: 100%;
height: 96px; height: 96px;
margin-top: 56px; margin-top: 60px;
border-radius: 6px; border-radius: 6px;
font-size: 40px; font-size: 40px;
} }
...@@ -146,3 +148,13 @@ ...@@ -146,3 +148,13 @@
position: absolute; position: absolute;
top: 0.1rem; top: 0.1rem;
} }
.login .login-bot-text {
font-size: 28px;
position: fixed;
bottom: 60px;
left: 31%;
z-index: 99999;
padding: 8px 80px;
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%);
}
src/components/login/login.jsx
import React, { Component } from 'react'; import React, { Component } from "react";
import { Icon, Spin } from 'antd'; import { Icon, Spin } from "antd";
import './login.less'; import "./login.less";
import LoginForm from './loginForm'; import LoginForm from "./loginForm";
import defaultLoginBg from '../../static/image/login-bg.png'; import defaultLoginBg from "../../static/image/login-bg.png";
import { connect } from 'react-redux'; import { connect } from "react-redux";
import func from '../../util/commonFunc'; import func from "../../util/commonFunc";
import {hashHistory} from "react-router"; import { hashHistory } from "react-router";
import { import {
getLoginConfig, getLoginConfig,
getWechatAuthen as getWechatToken, getWechatAuthen as getWechatToken,
} from '../../redux/action/login'; } from "../../redux/action/login";
import intl from "react-intl-universal"; import intl from "react-intl-universal";
import loginTopLogoImg from "../../common/iconImage/a-danghuikaobei.png"; import loginTopLogoImg from "../../common/iconImage/a-danghuikaobei.png";
...@@ -32,46 +32,46 @@ class Login extends Component { ...@@ -32,46 +32,46 @@ class Login extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
loginBg: '', loginBg: "",
isLoading: true, isLoading: true,
loginInfo: {}, loginInfo: {},
username: '', username: "",
password: '', password: "",
autoLogin: false, autoLogin: false,
fullScreenHeight: 0, fullScreenHeight: 0,
loginNameDesc: '', loginNameDesc: "",
loginPwdDesc: '', loginPwdDesc: "",
bgContainGroup: ["/aia/home"] bgContainGroup: ["/aia/home"],
}; };
this.bgLoaded = this.bgLoaded.bind(this); this.bgLoaded = this.bgLoaded.bind(this);
} }
componentWillMount() { componentWillMount() {
console.log('~~~~~~~10001') console.log("~~~~~~~10001");
sessionStorage.setItem("dontAPI", "no"); sessionStorage.setItem("dontAPI", "no");
//邮储上分企业值传递openid 实现免登陆 cwj //邮储上分企业值传递openid 实现免登陆 cwj
let getWechatAuthen = sessionStorage.getItem('getWechatAuthen') || ''; let getWechatAuthen = sessionStorage.getItem("getWechatAuthen") || "";
//邮储上风企业值传递openid 实现免登陆 cwj //邮储上风企业值传递openid 实现免登陆 cwj
if (getWechatAuthen && getWechatAuthen != 'undefined') { if (getWechatAuthen && getWechatAuthen != "undefined") {
console.log('getWechatAuthen---------if',getWechatAuthen) console.log("getWechatAuthen---------if", getWechatAuthen);
//存储重定向 地址 //存储重定向 地址
let redirectHash = sessionStorage.getItem('yourejecthash') || ''; let redirectHash = sessionStorage.getItem("yourejecthash") || "";
// console.log('检测打印变量=location.host ',location.host ); // console.log('检测打印变量=location.host ',location.host );
// console.log('检测打印变量=redirectHash ',redirectHash ); // console.log('检测打印变量=redirectHash ',redirectHash );
let _this = this; let _this = this;
getWechatToken(getWechatAuthen, (res, url) => { getWechatToken(getWechatAuthen, (res, url) => {
console.log('getWechatToken----回调') console.log("getWechatToken----回调");
//存储token //存储token
sessionStorage.setItem(companyCode + 'daying', res.data.Authorization); sessionStorage.setItem(companyCode + "daying", res.data.Authorization);
//用来做心跳包使用 //用来做心跳包使用
sessionStorage.setItem('accountId', res.data.userInfo.id); sessionStorage.setItem("accountId", res.data.userInfo.id);
localStorage.setItem('accountId', res.data.userInfo.id);//xmly-liyuan localStorage.setItem("accountId", res.data.userInfo.id); //xmly-liyuan
let token = sessionStorage.getItem(func.getSiteCode()); let token = sessionStorage.getItem(func.getSiteCode());
console.log('getWechatToken----token') console.log("getWechatToken----token");
if (token) { if (token) {
console.log('getWechatToken----token----token') console.log("getWechatToken----token----token");
location.replace('//' + location.host + '/' + redirectHash); location.replace("//" + location.host + "/" + redirectHash);
_this.state.isLoading = false; _this.state.isLoading = false;
return; return;
} }
...@@ -80,52 +80,50 @@ class Login extends Component { ...@@ -80,52 +80,50 @@ class Login extends Component {
//邮储上风企业值传递openid 实现免登陆 end //邮储上风企业值传递openid 实现免登陆 end
//token验证 //token验证
var token = sessionStorage.getItem(func.getSiteCode()); var token = sessionStorage.getItem(func.getSiteCode());
console.log('xxxxxxxxxxx此处============') console.log("xxxxxxxxxxx此处============");
if (token) { if (token) {
console.log('xxxxxxxxxxx此处重定向============') console.log("xxxxxxxxxxx此处重定向============");
companyCode = func.companyCode(); companyCode = func.companyCode();
siteCode = func.siteCode(); siteCode = func.siteCode();
hashHistory.replace({ hashHistory.replace({
pathname:func.routerBefore()+"/" pathname: func.routerBefore() + "/",
}) });
this.state.isLoading = false; this.state.isLoading = false;
} }
console.log('xxxxxxxxxxx重定向============之后') console.log("xxxxxxxxxxx重定向============之后");
let _this = this; let _this = this;
let code = func.routerBefore(); let code = func.routerBefore();
let username = ''; let username = "";
let password = ''; let password = "";
if (code == '/guotouxinda/home') { if (code == "/guotouxinda/home") {
username = 'guanliyuan'; username = "guanliyuan";
password = '123456'; password = "123456";
} else { } else {
//从location.state中取出url的值实现免登陆重定向 //从location.state中取出url的值实现免登陆重定向
console.log('从location.state中取出url的值实现免登陆重定向') console.log("从location.state中取出url的值实现免登陆重定向");
console.log('vvvvvvvvv',this.props.location.state) console.log("vvvvvvvvv", this.props.location.state);
if (this.props.location.state) { if (this.props.location.state) {
console.log('if进来了') console.log("if进来了");
const { const { linkUsername = "", linkPassword = "" } =
linkUsername = '', this.props.location.state;
linkPassword = '',
} = this.props.location.state;
if (linkUsername || linkPassword) { if (linkUsername || linkPassword) {
username = linkUsername; username = linkUsername;
password = linkPassword; password = linkPassword;
} else { } else {
//从url取出 //从url取出
username = func.getUrlParam('username'); username = func.getUrlParam("username");
password = func.getUrlParam('password'); password = func.getUrlParam("password");
} }
} else { } else {
console.log('else--进来了') console.log("else--进来了");
//从url取出 //从url取出
username = func.getUrlParam('username'); username = func.getUrlParam("username");
password = func.getUrlParam('password'); password = func.getUrlParam("password");
} }
} }
//自动登录 //自动登录
if (username && password) { if (username && password) {
console.log('走进自动登录'); console.log("走进自动登录");
this.setState({ this.setState({
username: username, username: username,
password: password, password: password,
...@@ -133,9 +131,9 @@ class Login extends Component { ...@@ -133,9 +131,9 @@ class Login extends Component {
}); });
return; return;
} }
console.log('没走进--==自动登录'); console.log("没走进--==自动登录");
//微信端登录页配置 type:3 //微信端登录页配置 type:3
this.props.getLoginConfig(3, loginBg => { this.props.getLoginConfig(3, (loginBg) => {
if (loginBg.bgimgPath) { if (loginBg.bgimgPath) {
_this.setState({ _this.setState({
loginBg: loginBg.bgimgPath, loginBg: loginBg.bgimgPath,
...@@ -164,20 +162,20 @@ class Login extends Component { ...@@ -164,20 +162,20 @@ class Login extends Component {
} }
componentDidMount() { componentDidMount() {
document.body.style = 'height:' + window.innerHeight + 'px'; document.body.style = "height:" + window.innerHeight + "px";
document.getElementById('example').style = document.getElementById("example").style =
'height:' + window.innerHeight + 'px'; "height:" + window.innerHeight + "px";
let style = document.getElementById('login-bg-div').style; let style = document.getElementById("login-bg-div").style;
document.getElementById('login-bg-div').style = document.getElementById("login-bg-div").style =
'height:' + document.body.clientHeight + 'px;' + style; "height:" + document.body.clientHeight + "px;" + style;
let _this = this; let _this = this;
_this.setState({ _this.setState({
fullScreenHeight: window.innerHeight, fullScreenHeight: window.innerHeight,
}); });
} }
componentWillUnmount() { componentWillUnmount() {
document.body.style = ''; document.body.style = "";
document.getElementById('example').style = ''; document.getElementById("example").style = "";
} }
bgLoaded() { bgLoaded() {
...@@ -190,54 +188,55 @@ class Login extends Component { ...@@ -190,54 +188,55 @@ class Login extends Component {
} }
render() { render() {
const token = sessionStorage.getItem("wechartToken");
const token = sessionStorage.getItem('wechartToken'); console.log("111~~~~~~~~", token);
console.log('111~~~~~~~~',token)
const { isLoading, bgContainGroup } = this.state; const { isLoading, bgContainGroup } = this.state;
const loginSiteCode = func.routerBefore(); const loginSiteCode = func.routerBefore();
let loginFormTop = document.body.clientHeight*(240/1334); let loginFormTop = document.body.clientHeight * (240 / 1334);
if (token != 'loading') { if (token != "loading") {
return ( return (
<div className="login"> <div className="login">
<div <div
style={{ style={{
width: '100%', width: "100%",
height: '100%', height: "100%",
textAlign: 'center', textAlign: "center",
paddingTop: '30%', paddingTop: "30%",
overflow: 'auto', overflow: "auto",
display: isLoading ? 'block' : 'none', display: isLoading ? "block" : "none",
}} }}
> >
<Spin indicator={antIcon} style={{ marginLeft: '-40px' }} /> <Spin indicator={antIcon} style={{ marginLeft: "-40px" }} />
</div> </div>
{ {bgContainGroup.includes(loginSiteCode) ? (
bgContainGroup.includes(loginSiteCode) ? <div
<div id={"login-bg-div"}
id={'login-bg-div'} className="login-bg login-aia-bg-image"
className="login-bg login-aia-bg-image" style={{
style={{ display: !isLoading ? 'block' : 'none',backgroundImage:"url("+(this.state.loginBg || defaultLoginBg)+")"}} display: !isLoading ? "block" : "none",
> backgroundImage:
</div> : "url(" + (this.state.loginBg || defaultLoginBg) + ")",
<div }}
id={'login-bg-div'} ></div>
className="login-bg" ) : (
style={{ display: !isLoading ? 'block' : 'none' }} <div
> id={"login-bg-div"}
<img className="login-bg"
onLoad={this.bgLoaded} style={{ display: !isLoading ? "block" : "none" }}
src={this.state.loginBg || defaultLoginBg} >
alt="" <img
/> onLoad={this.bgLoaded}
</div> src={this.state.loginBg || defaultLoginBg}
} alt=""
/>
</div>
)}
<div <div
className="login-container" className="login-container"
style={{ display: !isLoading ? 'block' : 'none' }} style={{ display: !isLoading ? "block" : "none" }}
> >
<div className="login-form" style={{ marginTop: loginFormTop }}>
<div className="login-form" style={{marginTop:loginFormTop}} >
<LoginForm <LoginForm
autoLogin={this.state.autoLogin} autoLogin={this.state.autoLogin}
username={this.state.username} username={this.state.username}
...@@ -253,19 +252,11 @@ class Login extends Component { ...@@ -253,19 +252,11 @@ class Login extends Component {
</div> </div>
</div> </div>
<div style={{ bottom: '60px', <div className="login-bot-text">机电信息保障部</div>
fontSize: '26px',
position: 'fixed',
textAlign: 'center',
zIndex:99999,
width: '100%',
color:'#fff'}}>
机电信息保障部
</div>
</div> </div>
); );
} else { } else {
return <div>{Intl.get("authLogining")}</div>; return <div>{Intl.get("authLogining")}</div>;
} }
} }
} }
......
src/components/login/login.less
@import "../../static/theme.less"; @import "../../static/theme.less";
.login{ .login {
width: 100%; width: 100%;
height: 100%; height: 100%;
.login-bg{ .login-bg {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
z-index: 1; z-index: 1;
img{ img {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
} }
.login-aia-bg-image{ .login-aia-bg-image {
background-size: 100%; background-size: 100%;
} }
.login-container{ .login-container {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
z-index: 2; z-index: 2;
.logo{ .logo {
width: 100%; width: 100%;
margin-top: 105px; margin-top: 105px;
text-align: center; text-align: center;
img{ img {
width: 160px; width: 160px;
} }
} }
.login-form{ .login-form {
width: 100%; width: 100%;
margin-top: 240px; margin-top: 240px !important;
padding-left: 40px; padding-left: 40px;
padding-right: 40px; padding-right: 40px;
.login-form-item{ .login-form-item {
width: 100%; width: 96%;
.login-form-top-logo{ margin: 0 auto;
margin-bottom: 20px; .login-form-top-logo {
margin-bottom: 60px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
.login-input-top-icon{ .login-input-top-icon {
width: 120px; width: 150px;
height: 120px; height: 150px;
margin-bottom: 60px; margin-bottom: 60px;
} }
.login-input-top-font{ .login-input-top-font {
color:#F5222D; color: #f5222d;
font-weight: 600; font-weight: 600;
} }
} }
.login-form-input-container{ .login-form-input-container {
width: 100%; width: 100%;
margin: 0 auto;
border-radius: 12px; border-radius: 12px;
.login-form-single-label{ .login-form-single-label {
font-size:36px; font-size: 32px;
font-weight: bold; font-weight: bold;
} }
.login-form-single-container{ .login-form-single-container {
width: 100%; width: 100%;
padding: 30px 20px 20px 30px; padding: 30px 20px 20px 30px;
border: 1px solid #D23A29; border: 1px solid #d23a29;
border-radius: 5px; border-radius: 5px;
margin-top: 15px; margin-top: 15px;
background-color: #fff; background-color: #fff;
.form-item{ .form-item {
width: 100%; width: 100%;
height: 44px; height: 44px;
padding-left: 88px; padding-left: 88px;
padding-right: 44px; padding-right: 44px;
position: relative; position: relative;
.login-input-item-icon{ .login-input-item-icon {
width: 40px; width: 40px;
height: 40px; height: 40px;
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
color:#D23A29 ; color: #d23a29;
} }
input{ input {
height: 47px; height: 47px;
line-height: 1; line-height: 1;
font-size: 36px; font-size: 36px;
color:#333; color: #333;
background: transparent; background: transparent;
border:0; border: 0;
width: 100%; width: 100%;
} }
.login-password-eye{ .login-password-eye {
color: #c5c5c5; color: #c5c5c5;
font-size: 32px; font-size: 32px;
position: absolute; position: absolute;
...@@ -102,49 +104,62 @@ ...@@ -102,49 +104,62 @@
} }
} }
} }
} }
button {
button{
width: 100%; width: 100%;
height: 96px; height: 96px;
margin-top: 56px; margin-top: 60px;
border-radius: 6px; border-radius: 6px;
font-size: 40px; font-size: 40px;
} }
.remember-password{ .remember-password {
width: 100%; width: 100%;
margin-top: 40px; margin-top: 40px;
// display: flex; // display: flex;
.language-change{ .language-change {
line-height: 0.42rem; line-height: 0.42rem;
font-size: 0.28rem; font-size: 0.28rem;
color: #666; color: #666;
white-space: nowrap; white-space: nowrap;
} }
} }
} }
} }
.login-forget{ .login-forget {
width: 100%; width: 100%;
text-align: center; text-align: center;
margin-top: 74px; margin-top: 74px;
.forget-psd{ .forget-psd {
font-size: 28px; font-size: 28px;
color:@themeColor; color: @themeColor;
} }
} }
.paswDiv { .paswDiv {
position: relative; position: relative;
} }
.eye{ .eye {
font-size: 0.3rem; font-size: 0.3rem;
right: 0.2rem; right: 0.2rem;
position: absolute; position: absolute;
top: 0.1rem; top: 0.1rem;
} }
} }
}
\ No newline at end of file .login-bot-text {
font-size: 28px;
position: fixed;
bottom: 60px;
left: 31%;
z-index: 99999;
padding: 8px 80px;
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%
);
}
}
src/components/login/loginForm.jsx
...@@ -459,15 +459,15 @@ class LoginForm extends Component { ...@@ -459,15 +459,15 @@ class LoginForm extends Component {
<div className="login-form-item"> <div className="login-form-item">
<div className="login-form-top-logo"> <div className="login-form-top-logo">
<img src={loginTopLogoImg} alt="" className="login-input-top-icon" /> <img src={loginTopLogoImg} alt="" className="login-input-top-icon" />
<div className="login-input-top-font" style={{ fontSize: "52px" }}> <div className="login-input-top-font" style={{ fontSize: "56px" }}>
机电e先锋 机电e先锋
</div> </div>
<div className="login-input-top-font" style={{ fontSize: "32px" }}> <div className="login-input-top-font" style={{ fontSize: "34px" }}>
智慧党建平台 智慧党建平台
</div> </div>
</div> </div>
<div className="login-form-input-container"> <div className="login-form-input-container">
<div className="login-form-single-label">用户名：</div> <div className="login-form-single-label">用户名</div>
<div <div
className="login-form-single-container" className="login-form-single-container"
onClick={this.usernameInputClick} onClick={this.usernameInputClick}
...@@ -483,19 +483,15 @@ class LoginForm extends Component { ...@@ -483,19 +483,15 @@ class LoginForm extends Component {
value={this.state.account} value={this.state.account}
onChange={this.getAccount} onChange={this.getAccount}
style={{ fill: "unset" }} style={{ fill: "unset" }}
placeholder={ placeholder='请输入用户名'
loginNameDesc
? loginNameDesc
: intl.get("pleaseInputUsername")
}
/> />
</div> </div>
</div> </div>
<div <div
className="login-form-single-label" className="login-form-single-label"
style={{ marginTop: "15px" }} style={{ marginTop: "15px",marginTop:'40px' }}
> >
密码： 密码
</div> </div>
<div <div
className="login-form-single-container" className="login-form-single-container"
...@@ -513,9 +509,7 @@ class LoginForm extends Component { ...@@ -513,9 +509,7 @@ class LoginForm extends Component {
value={this.state.password} value={this.state.password}
type={passwordType} type={passwordType}
onChange={this.getPassword} onChange={this.getPassword}
placeholder={ placeholder='请输入密码'
loginPwdDesc ? loginPwdDesc : intl.get("Password")
}
/> />
</div> </div>
{passwordType === "text" ? ( {passwordType === "text" ? (
...@@ -544,7 +538,7 @@ class LoginForm extends Component { ...@@ -544,7 +538,7 @@ class LoginForm extends Component {
> >
{intl.get("LogIn")} {intl.get("LogIn")}
</Button> </Button>
<div className="remember-password"> {/* <div className="remember-password">
<CheckBox <CheckBox
rememberPassword={this.state.rememberPassword} rememberPassword={this.state.rememberPassword}
onRememberPassword={this.onRememberPassword} onRememberPassword={this.onRememberPassword}
...@@ -552,7 +546,7 @@ class LoginForm extends Component { ...@@ -552,7 +546,7 @@ class LoginForm extends Component {
<div className="language-change"> <div className="language-change">
<PickerCommon tipFalg={1} /> <PickerCommon tipFalg={1} />
</div> </div>
</div> </div> */}
</div> </div>
); );
} }
......
src/components/menulearn/menulearn.jsx
...@@ -37,6 +37,8 @@ import IndexFirstEnter from "../indexComponent/indexFirstEnter"; ...@@ -37,6 +37,8 @@ import IndexFirstEnter from "../indexComponent/indexFirstEnter";
import IndexTips from "./indexTip"; import IndexTips from "./indexTip";
import MessageIcon from './message-icon.png'
function mapStateToProps(state, ownProps) { function mapStateToProps(state, ownProps) {
return { return {
showInfo: state.home.homeShowInfo, showInfo: state.home.homeShowInfo,
...@@ -297,7 +299,7 @@ class Menulearn extends React.Component { ...@@ -297,7 +299,7 @@ class Menulearn extends React.Component {
}); });
}; };
render() { render() {
let bannerHeight = (document.body.clientWidth - 60) * (540 / 1125); let bannerHeight = (document.body.clientWidth) * (212 / 726);
//轮播图参数 //轮播图参数
const carouselparam = { const carouselparam = {
...@@ -331,7 +333,7 @@ class Menulearn extends React.Component { ...@@ -331,7 +333,7 @@ class Menulearn extends React.Component {
isFetching={this.state.isLoading} isFetching={this.state.isLoading}
imageUrl={OccupyIndexImage} imageUrl={OccupyIndexImage}
> >
<div style={{ width: "100%", overflowX: "hidden" }}> <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} />
...@@ -348,7 +350,7 @@ class Menulearn extends React.Component { ...@@ -348,7 +350,7 @@ class Menulearn extends React.Component {
{/* 轮播图 */} {/* 轮播图 */}
<div className="carouseldiv"> <div className="carouseldiv">
<div style={{ height: bannerHeight + 80, position: "relative" }}> <div style={{ height: '34%', position: "relative" }}>
{carouselData && carouselData.length > 0 ? ( {carouselData && carouselData.length > 0 ? (
<Mycarousel <Mycarousel
carouselparam={carouselparam} carouselparam={carouselparam}
...@@ -383,10 +385,11 @@ class Menulearn extends React.Component { ...@@ -383,10 +385,11 @@ class Menulearn extends React.Component {
style={{ style={{
display: "inline-block", display: "inline-block",
width: "9px", width: "9px",
height: "34px", height: "28px",
background: "linear-gradient(180deg,#fe742b, #fc5b2b 100%)", background: 'linear-gradient(180deg,#fe742b, #fc5b2b 100%)',
marginLeft: "4%", borderRadius:'8px',
marginRight: "1%", marginLeft: "40px",
marginRight: "15px",
}} }}
></span> ></span>
精选资讯 精选资讯
...@@ -396,6 +399,14 @@ class Menulearn extends React.Component { ...@@ -396,6 +399,14 @@ class Menulearn extends React.Component {
) : ( ) : (
"" ""
)} )}
{/* 新消息icon */}
<div style={{
position:'fixed',
top:'47%',
right:'0'
}}>
<img style={{width:'180px'}} src={MessageIcon} alt="" />
</div>
{/* 通知 :6月1号版本，隐藏首页的公告字段*/} {/* 通知 :6月1号版本，隐藏首页的公告字段*/}
{this.state.announceList && this.state.announceList.length > 0 ? ( {this.state.announceList && this.state.announceList.length > 0 ? (
<NoticeBlock <NoticeBlock
...@@ -446,7 +457,7 @@ class Menulearn extends React.Component { ...@@ -446,7 +457,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"> <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,
...@@ -492,16 +503,16 @@ const IndexNewsItem = ({ data, onClick }) => { ...@@ -492,16 +503,16 @@ 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: imageHeight }} style={{ width: imageWidth, height: '180px' }}
/> />
<div <div
className="index-module-news-info-container" className="index-module-news-info-container"
style={{ height: imageHeight }} 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>
</div> </div>
......
src/components/menutrain/MenuTrain.css 0 → 100644
.train-index-container {
width: 100%;
height: 100%;
overflow-x: hidden;
overflow-y: auto;
}
.train-index-container .train-container {
flex: 1;
width: 100%;
overflow-y: auto;
}
.train-index-container .train-container .am-list-header {
padding: 0;
}
.train-index-container .train-container .my-carousel .slider-frame {
height: 230px !important;
}
.train-index-container .train-container .am-list-view-scrollview-content {
position: static !important;
}
.train-index-container .train-container .separator-box {
height: 0.2rem;
overflow: hidden;
}
.train-index-container .train-container .carousel {
padding: 16px 20px 0px 20px;
background-color: #ffffff;
}
.train-index-container .train-container .hotenroll {
padding: 0;
background-color: #ffffff;
overflow: hidden;
}
.train-index-container .train-container .train-item-card {
margin-left: 0.2rem;
height: 3.2rem;
width: 45.333%;
float: left;
}
.train-index-container .train-container .train-item-card-image {
height: 2.04rem;
width: 100%;
border-radius: 0.1rem;
}
.train-index-container .train-container .train-item-card-text {
margin-left: 0.16rem;
margin-top: 0.1rem;
width: 90.58%;
height: 0.4rem;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
font-size: 0.28rem;
color: #4A4A4A;
}
.train-index-container .train-container .train-item-card-time {
margin-top: 0.1rem;
height: 0.32rem;
margin-left: 0.16rem;
color: #9B9B9B;
}
.train-index-container .train-container .train-item-cardt {
margin-left: 0.3rem;
height: 3.2rem;
width: 45.333%;
float: left;
}
.train-index-container .train-container .enrolling {
padding: 0;
background-color: #ffffff;
}
.train-index-container .train-container .moreBtn {
width: 100%;
height: 0.4rem;
font-Size: 0.12rem;
background-color: #00aaff;
color: #fff;
}
src/components/menutrain/MenuTrain.jsx
...@@ -37,6 +37,7 @@ class MenuTrain extends Component { ...@@ -37,6 +37,7 @@ class MenuTrain extends Component {
refreshList: "", refreshList: "",
activeId: "", activeId: "",
activeList: [], activeList: [],
taskList:[],
nowData: "", nowData: "",
}; };
} }
...@@ -108,13 +109,14 @@ class MenuTrain extends Component { ...@@ -108,13 +109,14 @@ class MenuTrain extends Component {
this.props.getActiveList("", () => { this.props.getActiveList("", () => {
const { MenuTrainReducer } = _this.props; const { MenuTrainReducer } = _this.props;
let allClassify = MenuTrainReducer.activityType; let allClassify = MenuTrainReducer.activityType;
let taskList = MenuTrainReducer.theDay;
if (allClassify && allClassify.length > 0) { if (allClassify && allClassify.length > 0) {
allClassify.unshift({ allClassify.unshift({
activityType: "", activityType: "",
activityName: intl.get("AllActive"), activityName: intl.get("AllActive"),
}); });
} }
this.setState({ activeList: allClassify }); this.setState({ activeList: allClassify,taskList:taskList });
}); });
}; };
//更改日期,每次更改日期去获取新的任务列表,默认打开课程，第一页 //更改日期,每次更改日期去获取新的任务列表,默认打开课程，第一页
...@@ -133,14 +135,12 @@ class MenuTrain extends Component { ...@@ -133,14 +135,12 @@ class MenuTrain extends Component {
if (trainDataList.length > 0) { if (trainDataList.length > 0) {
_this.props.trainListData(params, () => { _this.props.trainListData(params, () => {
const { MenuTrainReducer } = _this.props; const { MenuTrainReducer } = _this.props;
console.log(MenuTrainReducer.trainList, "获取数据展示1111");
_this.setState({ _this.setState({
isLoading: false, isLoading: false,
pageNo: page, pageNo: page,
refreshList: new Date().getTime(), refreshList: new Date().getTime(),
trainDataList: MenuTrainReducer.trainList, trainDataList: MenuTrainReducer.trainList,
}); });
console.log(this.state.trainDataList,'33333')
}); });
} }
}; };
...@@ -167,11 +167,10 @@ class MenuTrain extends Component { ...@@ -167,11 +167,10 @@ class MenuTrain extends Component {
const { MenuTrainReducer } = _this.props; const { MenuTrainReducer } = _this.props;
trainDataList[thisMonth] = res; trainDataList[thisMonth] = res;
_this.setState({ _this.setState({
trainDataList:MenuTrainReducer.trainList, trainDataList: MenuTrainReducer.trainList,
isLoading: false, isLoading: false,
}); });
}); });
console.log(this.state.trainDataList,'33333')
} }
}; };
//获取年月信息 //获取年月信息
...@@ -183,37 +182,40 @@ class MenuTrain extends Component { ...@@ -183,37 +182,40 @@ class MenuTrain extends Component {
return thisMonth; return thisMonth;
}; };
render() { render() {
let { trainDataList, isLoading, refreshList, activeList, activeId } = let { trainDataList,taskList, isLoading, refreshList, activeList, activeId } =
this.state; this.state;
return ( return (
<div className="train-index-container" onScroll={this.listScroll}> <div className="train-index-container" onScroll={this.listScroll}>
<div className="train-container" id="train-scroll-listen-container"> <div className="train-container" id="train-scroll-listen-container">
<div style={{ backgroundColor: "#fff" }}> {/* 滚动页签 */}
<div>
<NewsClassifyList <NewsClassifyList
list={activeList} list={activeList}
activeId={activeId} activeId={activeId}
onClick={this.newsClassifyClick} onClick={this.newsClassifyClick}
/> />
</div> </div>
<div className="taskView"> {/* 日历 */}
<div className="taskView" style={{ backgroundColor: "#fff" }}>
<div className={"taskCalendarView moveDown"} id="taskCalendarView"> <div className={"taskCalendarView moveDown"} id="taskCalendarView">
<TaskCalendar <TaskCalendar
timestamp={this.state.today} timestamp={this.state.today}
onChangeDateListener={this.onChangeDateListener} onChangeDateListener={this.onChangeDateListener}
getCalendarTaskNum={this.getCalendarTaskNum} getCalendarTaskNum={this.getCalendarTaskNum}
isLoading={this.state.isLoading} isLoading={this.state.isLoading}
taskList={trainDataList} taskList={taskList}
/> />
</div> </div>
</div> </div>
{/* 数据列表 */}
<TrainIndexList <div style={{marginTop:'20px'}}>
key={refreshList} <TrainIndexList
list={trainDataList} key={refreshList}
itemClick={this.itemClick} list={trainDataList}
isLoading={isLoading} itemClick={this.itemClick}
/> isLoading={isLoading}
/>
</div>
</div> </div>
<div style={{ width: "100%", height: 100 }}></div> <div style={{ width: "100%", height: 100 }}></div>
</div> </div>
...@@ -233,13 +235,13 @@ class MenuTrain extends Component { ...@@ -233,13 +235,13 @@ class MenuTrain extends Component {
//list item //list item
itemClick = (item) => { itemClick = (item) => {
console.log(item,'555555555555'); console.log(item, "555555555555");
hashHistory.push({ hashHistory.push({
pathname: func.routerBefore() + "/trainingsteps", pathname: func.routerBefore() + "/trainingsteps",
query: { query: {
id: item.id, id: item.id,
finished: item.finished, finished: item.finished,
activityStateCode: item.activityStateCode activityStateCode: item.activityStateCode,
}, },
}); });
}; };
...@@ -277,6 +279,9 @@ const NewsClassifyItem = ({ data, isActive, onClick }) => { ...@@ -277,6 +279,9 @@ const NewsClassifyItem = ({ data, isActive, onClick }) => {
return ( return (
<div className="news-classify-item-container" onClick={onClick}> <div className="news-classify-item-container" onClick={onClick}>
{isActive ? <span>{data.activityName}</span> : data.activityName} {isActive ? <span>{data.activityName}</span> : data.activityName}
{
isActive ? <div className="active"></div> :''
}
</div> </div>
); );
}; };
src/components/menutrain/MenuTrain.less
...@@ -7,9 +7,6 @@ ...@@ -7,9 +7,6 @@
.train-container { .train-container {
flex: 1; flex: 1;
width: 100%; width: 100%;
background-color: #fff;
.am-list-header { .am-list-header {
padding: 0; padding: 0;
......
src/components/menutrain/MenuTrainAction.js
...@@ -60,7 +60,9 @@ function itemList(item) { ...@@ -60,7 +60,9 @@ function itemList(item) {
activityStateName:item.activityStateName, activityStateName:item.activityStateName,
period: item.period, period: item.period,
trainingDurationShow: item.trainingDurationShow, trainingDurationShow: item.trainingDurationShow,
enablePay: item.enablePay enablePay: item.enablePay,
canNumber: item.canNumber,
joinNumber: item.joinNumber,
}) })
}); });
return newItem; return newItem;
......
src/components/menutrain/TaskCalendar/CalenderMain.jsx
...@@ -36,17 +36,16 @@ class CalenderMain extends React.Component { ...@@ -36,17 +36,16 @@ class CalenderMain extends React.Component {
rowsInMonth.push(current_month_data.slice(index, index + 7)); rowsInMonth.push(current_month_data.slice(index, index + 7));
} }
}); });
let currentMonth = this.props.year + "_" + this.props.month; let currentTaskList = this.props.taskList;
let currentTaskList = this.props.taskList
? this.props.taskList[currentMonth]
: null;
if (currentTaskList) { if (currentTaskList) {
rowsInMonth.map((list, index) => { rowsInMonth.map((list, index) => {
if (list.length) { if (list.length) {
list.map((data) => { list.map((data) => {
if (currentTaskList[data.All_date] > 0) { currentTaskList.map((item) => {
data.hasTask = true; if (data.All_date == item) {
} data.hasTask = true;
}
});
}); });
} }
}); });
...@@ -55,6 +54,12 @@ class CalenderMain extends React.Component { ...@@ -55,6 +54,12 @@ class CalenderMain extends React.Component {
return rowsInMonth; return rowsInMonth;
}; };
// containsDate = (datesArray, dateToCheck) => {
// const formattedDateToCheck = dateToCheck.replace(/-/g, ""); // 将日期转换为字符串，如'20230325'
// return datesArray.some(
// (date) => date.replace(/-/g, "") === formattedDateToCheck
// );
// };
//获取当前日期在第几行 //获取当前日期在第几行
getCurrentRowIndex = () => { getCurrentRowIndex = () => {
let current_month_data = this.getCurrentMonth(); let current_month_data = this.getCurrentMonth();
......
src/components/menutrain/TaskCalendar/style/index.css
...@@ -86,9 +86,9 @@ ...@@ -86,9 +86,9 @@
color: #4285f4; color: #4285f4;
} }
.calendar_box_click_blue { .calendar_box_click_blue {
background: linear-gradient(135deg, #3666a6 0%, #454f5e 100%);
color: #ffffff;
border-radius: 50%; border-radius: 50%;
border: 2px solid #d23a29;
color: #d23a29;
} }
.calendar_box_other_gray { .calendar_box_other_gray {
color: #333333; color: #333333;
...@@ -98,18 +98,18 @@ ...@@ -98,18 +98,18 @@
} }
.calendar_today_pot { .calendar_today_pot {
display: block; display: block;
margin: 0.02rem auto; margin: 0.1rem auto;
width: 0.08rem; width: 0.1rem;
height: 0.08rem; height: 0.1rem;
background: #4285f4; background: #d23a29;
border-radius: 50%; border-radius: 50%;
} }
.calendar_pot { .calendar_pot {
display: block; display: block;
margin: 0.02rem auto; margin: 0.1rem auto;
width: 0.08rem; width: 0.1rem;
height: 0.08rem; height: 0.1rem;
background: #4285f4; background: #d23a29;
opacity: 0.5; opacity: 0.5;
border-radius: 50%; border-radius: 50%;
} }
......
src/components/menutrain/TaskCalendar/style/index.less
...@@ -99,9 +99,9 @@ ...@@ -99,9 +99,9 @@
} }
.calendar_box_click_blue { .calendar_box_click_blue {
background: linear-gradient(135deg, rgba(54, 102, 166, 1) 0%, rgba(69, 79, 94, 1) 100%);
color: rgba(255, 255, 255, 1);
border-radius: 50%; border-radius: 50%;
border: 2px solid #d23a29;
color: #d23a29;
} }
.calendar_box_other_gray { .calendar_box_other_gray {
...@@ -114,19 +114,19 @@ ...@@ -114,19 +114,19 @@
.calendar_today_pot { .calendar_today_pot {
display: block; display: block;
margin: 0.02rem auto; margin: 0.1rem auto;
width: 0.08rem; width: 0.1rem;
height: 0.08rem; height: 0.1rem;
background: rgba(66, 133, 244, 1); background: #d23a29;
border-radius: 50%; border-radius: 50%;
} }
.calendar_pot { .calendar_pot {
display: block; display: block;
margin: 0.02rem auto; margin: 0.1rem auto;
width: 0.08rem; width: 0.1rem;
height: 0.08rem; height: 0.1rem;
background: rgba(66, 133, 244, 1); background: #d23a29;
opacity: 0.5; opacity: 0.5;
border-radius: 50%; border-radius: 50%;
} }
......
src/components/menutrain/style.css
...@@ -10,35 +10,31 @@ ...@@ -10,35 +10,31 @@
} }
.news-classify-list-container { .news-classify-list-container {
width: 100%; width: 100%;
height: 88px; height: 90px;
position: sticky;
background-color: #fff; background-color: #fff;
left: 0;
top: 0;
z-index: 9;
overflow-y: hidden; overflow-y: hidden;
overflow-x: auto; overflow-x: auto;
} }
.news-classify-list-container .news-classify-list-container-bg { .news-classify-list-container .news-classify-list-container-bg {
width: 100%; width: 100%;
height: 88px; height: 90px;
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
background-color: #D23A29; background-color: #d23a29;
z-index: 1; z-index: 1;
} }
.news-classify-list-container .news-classify-list-scroll-container { .news-classify-list-container .news-classify-list-scroll-container {
width: max-content; width: max-content;
height: 88px; height: 90px;
position: relative; position: relative;
z-index: 2; z-index: 2;
padding: 0 10px; padding: 0 10px;
} }
.news-classify-list-container .news-classify-list-scroll-container .news-classify-item-container { .news-classify-list-container .news-classify-list-scroll-container .news-classify-item-container {
max-width: 324px; max-width: 364px;
height: 88px; height: 90px;
line-height: 88px; line-height: 90px;
text-align: center; text-align: center;
margin: 0 25px; margin: 0 25px;
display: inline-block; display: inline-block;
...@@ -46,14 +42,18 @@ ...@@ -46,14 +42,18 @@
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-classify-list-container .news-classify-list-scroll-container .news-classify-item-container span { .news-classify-list-container .news-classify-list-scroll-container .news-classify-item-container span {
border-bottom: 4px solid #fff;
padding-bottom: 12px; padding-bottom: 12px;
font-size: 36px;
}
.news-classify-list-container .news-classify-list-scroll-container .news-classify-item-container .active {
width: 65%;
margin: 0 auto;
margin-top: -13px;
height: 5px;
background-color: #fff;
border-radius: 5px;
} }
.news-classify-list-container .news-third-classify-list-scroll-container { .news-classify-list-container .news-third-classify-list-scroll-container {
width: max-content; width: max-content;
......
src/components/menutrain/style.less
@import "../../static/theme.less"; @import "../../static/theme.less";
.news-banner-carsouel-container { .news-banner-carsouel-container {
width: 100%; width: 100%;
padding: 24px 30px; padding: 24px 30px;
} }
.news-classify-list-container { .news-classify-list-container {
width: 100%;
height: 90px;
background-color: #fff;
overflow-y: hidden;
overflow-x: auto;
.news-classify-list-container-bg {
width: 100%; width: 100%;
height: 88px; height: 90px;
position: sticky; position: absolute;
background-color: #fff;
left: 0; left: 0;
top: 0; top: 0;
z-index: 9; background-color: #d23a29;
overflow-y: hidden; z-index: 1;
overflow-x: auto; }
.news-classify-list-scroll-container {
.news-classify-list-container-bg { width: max-content;
width: 100%; height: 90px;
height: 88px; position: relative;
position: absolute; z-index: 2;
left: 0; padding: 0 10px;
top: 0; .news-classify-item-container {
background-color: #D23A29; max-width: 364px;
z-index: 1; height: 90px;
line-height: 90px;
text-align: center;
margin: 0 25px;
display: inline-block;
vertical-align: middle;
font-size: 32px;
color: #fff;
font-weight: 400;
span {
padding-bottom: 12px;
font-size: 36px;
}
.active {
width: 65%;
margin: 0 auto;
margin-top: -13px;
height: 5px;
background-color: #fff;
border-radius: 5px;
}
} }
.news-classify-list-scroll-container{ }
width: max-content; .news-third-classify-list-scroll-container {
height: 88px; width: max-content;
position: relative; height: 60px;
z-index: 2; position: relative;
padding: 0 10px; z-index: 2;
.news-classify-item-container{ padding: 0 10px;
max-width: 324px; .news-third-classify-item-container {
height: 88px; max-width: 324px;
line-height: 88px; height: 60px;
text-align: center; line-height: 60px;
margin: 0 25px; text-align: center;
display: inline-block; margin: 0 25px;
vertical-align: middle; display: inline-block;
font-size: 32px; vertical-align: middle;
color:#fff; font-size: 30px;
font-weight:400; color: #666;
.singleLineOverflow; font-weight: 400;
span{ .singleLineOverflow;
border-bottom: 4px solid #fff; span {
padding-bottom: 12px; color: @themeColor;
} }
}
}
.news-third-classify-list-scroll-container{
width: max-content;
height: 60px;
position: relative;
z-index: 2;
padding: 0 10px;
.news-third-classify-item-container{
max-width: 324px;
height: 60px;
line-height: 60px;
text-align: center;
margin: 0 25px;
display: inline-block;
vertical-align: middle;
font-size: 30px;
color:#666;
font-weight:400;
.singleLineOverflow;
span{
color: @themeColor;
}
}
} }
}
} }
.news-item-list-container{ .news-item-list-container {
width: 100%; width: 100%;
} }
\ No newline at end of file
src/components/menutrain/trainIndexList/index.jsx
...@@ -3,13 +3,11 @@ import "./style.less"; ...@@ -3,13 +3,11 @@ import "./style.less";
import intl from "react-intl-universal"; import intl from "react-intl-universal";
import { import {
IndexTitle,
IndexModuleBg, IndexModuleBg,
IndexNotMore, IndexNotMore,
} from "../../indexComponent/indexComponent"; } from "../../indexComponent/indexComponent";
import IconfontD from "../../../common/iconfontd"; import peopleIcon from "./people-icon.png";
import TrigleTagComponent from "../../../common/trigleTag"; import timeIcon from "./time-icon.png";
class TrainIndexList extends Component { class TrainIndexList extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
...@@ -40,14 +38,13 @@ class TrainIndexList extends Component { ...@@ -40,14 +38,13 @@ class TrainIndexList extends Component {
if (day < 10) { if (day < 10) {
day = "0" + day; day = "0" + day;
} }
return year + "-" + month + "-" + day; return year + "." + month + "." + day;
}; };
render() { render() {
const { isLoading } = this.props; const { isLoading } = this.props;
return ( return (
<div className="train-index-list-container"> <div className="train-index-list-container">
<IndexTitle title={intl.get("studyActivity")} />
<IndexModuleBg>{this.renderTrainItemByItemList()}</IndexModuleBg> <IndexModuleBg>{this.renderTrainItemByItemList()}</IndexModuleBg>
<div style={{ width: "100%", backgroundColor: "#f5f5f5" }}> <div style={{ width: "100%", backgroundColor: "#f5f5f5" }}>
<IndexNotMore text={isLoading ? intl.get("PublishKey66") : ""} /> <IndexNotMore text={isLoading ? intl.get("PublishKey66") : ""} />
...@@ -61,16 +58,72 @@ export default TrainIndexList; ...@@ -61,16 +58,72 @@ export default TrainIndexList;
const TrainItem = ({ data, onClick }) => { const TrainItem = ({ data, onClick }) => {
return ( return (
<div className="train-index-list-item-container" onClick={onClick}> <div className="train-index-list-item-container" onClick={onClick}>
<img src={data.image} alt="" className="train-index-list-item-image" /> <div style={{ display: "flex", justifyContent: "space-between" }}>
<div style={{ display: "flex", alignItems: "end" }}> <img src={data.image} alt="" className="train-index-list-item-image" />
<div className="train-index-list-item-info" style={{display:'flex',flexDirection:'column',justifyContent:'space-between'}}>
<div className="train-index-list-item-info-name">{data.text}</div> <div
<div className="train-index-list-item-info"
className="train-index-list-item-info-text" style={{
> display: "flex",
<span style={{marginRight:'10px'}}>{data.activityName}</span> {data.trainTimeStr} flexDirection: "column",
justifyContent: "space-between",
}}
>
<div className="train-index-list-item-info-name">
<span
className={
data.activityName == "其他"
? "qt"
: data.activityName == "特色活动"
? "tshd"
: data.activityName == "献计献策"
? "xjxc"
: data.activityName == "支部主题党日"
? "ztdr"
: ""
}
>
{data.activityName}
</span>
{data.text}
</div>
<div className="train-index-list-item-info-text">
<span>
<img style={{ width: "24px" }} src={timeIcon} alt="" />{" "}
{data.trainTimeStr}
</span>
</div> </div>
</div> </div>
</div>
<div
style={{
marginTop: "25px",
paddingTop: "25px",
borderTop: "1px solid #e5e6e8",
display: "flex",
justifyContent: "space-between",
}}
>
<div
style={{
display: "flex",
alignItems: "center",
}}
>
<img
style={{ width: "28px", marginRight: "8px" }}
src={peopleIcon}
alt=""
/>
{data.canNumber != 0 ? (
<span style={{ fontSize: "28px", color: "#9E9E9E" }}>
{data.joinNumber} / {data.canNumber}
</span>
) : (
<span style={{ fontSize: "28px", color: "#9E9E9E" }}>无限制</span>
)}
</div>
<div <div
className={ className={
data.activityStateCode == 4 data.activityStateCode == 4
......
src/components/menutrain/trainIndexList/style.css
...@@ -9,23 +9,17 @@ ...@@ -9,23 +9,17 @@
} }
.train-index-list-container .train-index-list-item-container { .train-index-list-container .train-index-list-item-container {
width: 100%; width: 100%;
height: 160px; padding: 30px;
padding-left: 266px; background-color: #fff;
position: relative; margin-bottom: 25px;
margin-bottom: 32px;
} }
.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: 266px; width: 220px;
height: 160px; height: 180px;
border-radius: 10px; border-radius: 20px;
position: absolute;
left: 0;
top: 0;
} }
.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: 100%; width: 66%;
height: 160px;
padding-left: 20px;
} }
.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%;
...@@ -33,41 +27,65 @@ ...@@ -33,41 +27,65 @@
line-height: 40px; line-height: 40px;
font-size: 32px; font-size: 32px;
color: #333; color: #333;
font-weight: 400; font-weight: 500;
overflow: hidden; }
text-overflow: ellipsis; .train-index-list-container .train-index-list-item-container .train-index-list-item-info .train-index-list-item-info-name .qt {
white-space: nowrap; padding: 8px 20px;
word-break: break-all; background-color: #e7f7e8;
margin-right: 10px;
color: #53af5c;
font-size: 24px;
}
.train-index-list-container .train-index-list-item-container .train-index-list-item-info .train-index-list-item-info-name .tshd {
padding: 8px 20px;
background-color: #fff5ed;
margin-right: 10px;
color: #f5912a;
font-size: 24px;
}
.train-index-list-container .train-index-list-item-container .train-index-list-item-info .train-index-list-item-info-name .xjxc {
padding: 8px 20px;
background-color: #fef5ff;
margin-right: 10px;
color: #e943ff;
font-size: 24px;
}
.train-index-list-container .train-index-list-item-container .train-index-list-item-info .train-index-list-item-info-name .ztdr {
padding: 8px 20px;
background-color: #ffebeb;
margin-right: 10px;
color: #e65858;
font-size: 24px;
} }
.train-index-list-container .train-index-list-item-container .train-index-list-item-info .train-index-list-item-info-text { .train-index-list-container .train-index-list-item-container .train-index-list-item-info .train-index-list-item-info-text {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%; width: 100%;
height: 32px; height: 40px;
line-height: 32px; line-height: 40px;
font-size: 24px; font-size: 24px;
color: #999; color: #999;
font-weight: 400; font-weight: 400;
margin-top: 24px; margin-top: 24px;
} }
.train-index-list-container .train-index-list-item-container .train-status { .train-index-list-container .train-index-list-item-container .train-status {
width: 150px;
border-radius: 50px; border-radius: 50px;
padding: 5px 15px; padding: 8px 30px;
font-size: 30px; font-size: 30px;
text-align: center; text-align: center;
} }
.train-index-list-container .train-index-list-item-container .train-enroll-status { .train-index-list-container .train-index-list-item-container .train-enroll-status {
width: 160px;
border-radius: 50px; border-radius: 50px;
padding: 5px 15px; padding: 8px 30px;
font-size: 30px; font-size: 30px;
text-align: center; text-align: center;
border: 1px solid #d23a29; border: 1px solid #d23a29;
color: #d23a29; color: #d23a29;
} }
.train-index-list-container .train-index-list-item-container .train-sign-status { .train-index-list-container .train-index-list-item-container .train-sign-status {
width: 160px;
border-radius: 50px; border-radius: 50px;
padding: 5px 15px; padding: 8px 30px;
font-size: 30px; font-size: 30px;
text-align: center; text-align: center;
background: linear-gradient(90deg, #d23a29, #eb6c53 100%); background: linear-gradient(90deg, #d23a29, #eb6c53 100%);
......
src/components/menutrain/trainIndexList/style.less
...@@ -3,35 +3,59 @@ ...@@ -3,35 +3,59 @@
width: 100%; width: 100%;
.train-index-list-item-container { .train-index-list-item-container {
width: 100%; width: 100%;
height: 160px; padding: 30px;
padding-left: 266px; background-color: #fff;
position: relative; margin-bottom: 25px;
margin-bottom: 32px;
.train-index-list-item-image { .train-index-list-item-image {
width: 266px; width: 220px;
height: 160px; height: 180px;
border-radius: 10px; border-radius: 20px;
position: absolute;
left: 0;
top: 0;
} }
.train-index-list-item-info { .train-index-list-item-info {
width: 100%; width: 66%;
height: 160px;
padding-left: 20px;
.train-index-list-item-info-name { .train-index-list-item-info-name {
width: 100%; width: 100%;
height: 40px; height: 40px;
line-height: 40px; line-height: 40px;
font-size: 32px; font-size: 32px;
color: #333; color: #333;
font-weight: 400; font-weight: 500;
.singleLineOverflow; .qt {
padding: 8px 20px;
background-color: #e7f7e8;
margin-right: 10px;
color: #53af5c;
font-size: 24px;
}
.tshd {
padding: 8px 20px;
background-color: #fff5ed;
margin-right: 10px;
color: #f5912a;
font-size: 24px;
}
.xjxc {
padding: 8px 20px;
background-color: #fef5ff;
margin-right: 10px;
color: #e943ff;
font-size: 24px;
}
.ztdr {
padding: 8px 20px;
background-color: #ffebeb;
margin-right: 10px;
color: #e65858;
font-size: 24px;
}
} }
.train-index-list-item-info-text { .train-index-list-item-info-text {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%; width: 100%;
height: 32px; height: 40px;
line-height: 32px; line-height: 40px;
font-size: 24px; font-size: 24px;
color: #999; color: #999;
font-weight: 400; font-weight: 400;
...@@ -39,25 +63,22 @@ ...@@ -39,25 +63,22 @@
} }
} }
.train-status { .train-status {
width: 150px;
border-radius: 50px; border-radius: 50px;
padding: 5px 15px; padding: 8px 30px;
font-size: 30px; font-size: 30px;
text-align: center; text-align: center;
} }
.train-enroll-status { .train-enroll-status {
width: 160px;
border-radius: 50px; border-radius: 50px;
padding: 5px 15px; padding: 8px 30px;
font-size: 30px; font-size: 30px;
text-align: center; text-align: center;
border: 1px solid #d23a29; border: 1px solid #d23a29;
color: #d23a29; color: #d23a29;
} }
.train-sign-status { .train-sign-status {
width: 160px;
border-radius: 50px; border-radius: 50px;
padding: 5px 15px; padding: 8px 30px;
font-size: 30px; font-size: 30px;
text-align: center; text-align: center;
background: linear-gradient(90deg, #d23a29, #eb6c53 100%); background: linear-gradient(90deg, #d23a29, #eb6c53 100%);
...@@ -69,8 +90,8 @@ ...@@ -69,8 +90,8 @@
padding: 5px 15px; padding: 5px 15px;
font-size: 30px; font-size: 30px;
text-align: center; text-align: center;
background: #f2f2f4; background: #f2f2f4;
color: #999; color: #999;
} }
} }
} }
src/components/nav/less/nav.css
...@@ -5,9 +5,12 @@ ...@@ -5,9 +5,12 @@
right: -9px; right: -9px;
} }
#hometitle .am-search-input { #hometitle .am-search-input {
background-color: #f5f5f5; background: #Eb7568;
border-radius: 56px; border-radius: 56px;
} }
#hometitle .am-search-input .am-search-value::placeholder {
color: #fff !important;
}
#example .am-search-input .am-search-synthetic-ph { #example .am-search-input .am-search-synthetic-ph {
text-align: left; text-align: left;
margin-left: 20px; margin-left: 20px;
...@@ -20,7 +23,7 @@ ...@@ -20,7 +23,7 @@
align-items: center; align-items: center;
} }
.menuhomeNav .am-search { .menuhomeNav .am-search {
background-color: #fff; background-color: #Eb7568;
border-radius: 45px; border-radius: 45px;
height: 70px !important; height: 70px !important;
line-height: 70px !important; line-height: 70px !important;
......
src/components/nav/less/nav.less
...@@ -7,8 +7,11 @@ ...@@ -7,8 +7,11 @@
} }
.am-search-input { .am-search-input {
background-color: #f5f5f5; background: #Eb7568;
border-radius: 56px; border-radius: 56px;
.am-search-value::placeholder{
color: #fff !important;
}
} }
} }
#example .am-search-input .am-search-synthetic-ph { #example .am-search-input .am-search-synthetic-ph {
...@@ -22,9 +25,10 @@ ...@@ -22,9 +25,10 @@
display: flex; display: flex;
align-items: center; align-items: center;
.am-search { .am-search {
background-color: #fff; background-color: #Eb7568;
border-radius: 45px; border-radius: 45px;
height: 70px !important; height: 70px !important;
line-height: 70px !important; line-height: 70px !important;
} }
} }
src/components/nav/menuCourseNav.jsx
...@@ -57,7 +57,7 @@ class mehomeNav extends React.Component { ...@@ -57,7 +57,7 @@ class mehomeNav extends React.Component {
type:"course" type:"course"
} }
})} > })} >
<SearchBar placeholder={intl.get('Search')||"搜索"} <SearchBar placeholder='搜索'
style={{ width: "100%", float: 'left', marginLeft: ".1rem",paddingRight:100 }} /> style={{ width: "100%", float: 'left', marginLeft: ".1rem",paddingRight:100 }} />
</div> </div>
<span style={{ <span style={{
......
src/components/nav/menuhomeNav.jsx
...@@ -130,11 +130,11 @@ class mehomeNav extends React.Component { ...@@ -130,11 +130,11 @@ class mehomeNav extends React.Component {
// }); // });
// } // }
// } // }
// closeSignResultModal() { // closeSignResultModal() {
// this.setState({ // this.setState({
// signResultVisible: false, // signResultVisible: false,
// }); // });
// } // }
render() { render() {
return ( return (
...@@ -150,7 +150,12 @@ class mehomeNav extends React.Component { ...@@ -150,7 +150,12 @@ class mehomeNav extends React.Component {
> >
<div id="hometitle" iconname={""} className="menuhomeNav"> <div id="hometitle" iconname={""} className="menuhomeNav">
<div <div
style={{ width: "25%", fontSize: "36px", marginRight: "20px",paddingLeft:'40px' }} style={{
width: "25%",
fontSize: "36px",
marginRight: "20px",
paddingLeft: "20px",
}}
> >
智慧党建 智慧党建
</div> </div>
...@@ -163,36 +168,7 @@ class mehomeNav extends React.Component { ...@@ -163,36 +168,7 @@ class mehomeNav extends React.Component {
maxLength={8} maxLength={8}
/> />
</div> </div>
{/* <div
style={{
textAlign: "center",
width: "10%",
alignSelf: "center",
marginRight: ".2rem",
}}
onClick={() =>
hashHistory.push(func.routerBefore() + "/sendmessage")
}
>
{this.state.noreadCount == 0 ||
isNaN(parseInt(this.state.noreadCount)) ? (
<Badge>
<img style={{ width: 50, height: 50 }} src={xiaoxi} />
</Badge>
) : (
<Badge dot>
<img style={{ width: 50, height: 50 }} src={xiaoxi} />
</Badge>
)}
</div> */}
</div> </div>
{/* <SignResultModal
visible={this.state.signResultVisible}
status={this.state.signResultCode}
reasonFromApi={this.state.reasonFromApi}
closeSignResultModal={this.closeSignResultModal}
/> */}
</div> </div>
<div style={{ width: "100%", height: 90 }}></div> <div style={{ width: "100%", height: 90 }}></div>
</Fragment> </Fragment>
......
src/components/newsMessage/NewsMessageResult.css
...@@ -444,7 +444,7 @@ ...@@ -444,7 +444,7 @@
color: blue; color: blue;
} }
.train-info .train-info-contain p { .train-info .train-info-contain p {
font-size: 24px !important; font-size: 32px !important;
padding: 0 !important; padding: 0 !important;
color: #4A4A4A !important; color: #4A4A4A !important;
} }
......
src/components/newsMessage/NewsMessageResult.less
...@@ -623,7 +623,7 @@ ...@@ -623,7 +623,7 @@
} }
p { p {
font-size: 24px !important; font-size: 32px !important;
padding: 0 !important; padding: 0 !important;
color: #4A4A4A !important; color: #4A4A4A !important;
} }
......
src/index.css
.singleLineOverflow {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
word-break: break-all;
}
html, html,
body { body {
height: 100%; height: 100%;
...@@ -5,11 +11,28 @@ body { ...@@ -5,11 +11,28 @@ body {
margin: 0; margin: 0;
padding: 0; padding: 0;
position: relative; position: relative;
-webkit-text-size-adjust: 100% !important;
} }
body { body {
overflow: auto !important; overflow: auto;
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
background-color: #f4f4f4; background-color: #f5f5f5;
}
body .am-toast-notice-content .am-toast-text div {
word-break: break-all;
}
::-webkit-scrollbar {
width: 0;
height: 0;
background-color: transparent;
}
@font-face {
font-family: "ruizizhenyanti";
src: url("/icon/RuiZiZhenYanTiMianFeiShangYong.ttf");
}
@font-face {
font-family: "happyCool";
src: url("/icon/happyzcool.ttf");
} }
#example { #example {
position: absolute; position: absolute;
...@@ -19,9 +42,13 @@ body { ...@@ -19,9 +42,13 @@ body {
height: 100%; height: 100%;
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
} }
#example .am-tabs-default-bar-underline {
border: 2px solid #4285f4;
}
#example, #example,
.container { .container {
height: 100%; height: 100%;
background-color: #f5f5f5;
} }
* { * {
box-sizing: border-box; box-sizing: border-box;
...@@ -131,29 +158,6 @@ p { ...@@ -131,29 +158,6 @@ p {
font-size: 0.2rem; font-size: 0.2rem;
color: #ddd; color: #ddd;
} }
.am-tabs-bar {
background: #ffffff;
border-bottom: 1PX solid #ddd;
padding: 0 0.9rem;
font-size: 0.32rem;
z-index: 1;
}
.am-tabs-bar .tabspan {
font-size: 0.33rem !important;
}
.am-tabs-bar .list-tab-view {
padding: 0;
border: 0;
}
.am-tabs-bar .ant-list-bordered .ant-list-header {
padding: 0;
}
.am-tabs-bar .am-tabs-tab {
border-bottom: none !important;
}
.am-tabs-tab-active {
color: #4285F4;
}
.am-list-body { .am-list-body {
border: none; border: none;
background-color: white; background-color: white;
...@@ -213,3 +217,1899 @@ p { ...@@ -213,3 +217,1899 @@ p {
:global .am-modal-header { :global .am-modal-header {
padding: 0.2rem 0.3rem !important; padding: 0.2rem 0.3rem !important;
} }
#wmy-root-body {
/* 默认搜索bar */
}
#wmy-root-body .am-toast {
position: fixed;
width: 100%;
z-index: 1999;
font-size: 0.28rem;
text-align: center;
}
#wmy-root-body .am-toast > span {
max-width: 50%;
}
#wmy-root-body .am-toast.am-toast-mask {
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
left: 0;
top: 0;
}
#wmy-root-body .am-toast.am-toast-nomask {
position: fixed;
max-width: 50%;
width: auto;
left: 50%;
top: 50%;
}
#wmy-root-body .am-toast.am-toast-nomask .am-toast-notice {
-webkit-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
#wmy-root-body .am-toast-notice-content .am-toast-text {
min-width: 1.2rem;
border-radius: 0.06rem;
color: #fff;
background-color: rgba(58, 58, 58, 0.9);
line-height: 1.5;
padding: 0.18rem 0.3rem;
}
#wmy-root-body .am-toast-notice-content .am-toast-text.am-toast-text-icon {
border-radius: 0.1rem;
padding: 0.3rem 0.3rem;
}
#wmy-root-body .am-toast-notice-content .am-toast-text.am-toast-text-icon .am-toast-text-info {
margin-top: 0.12rem;
}
#wmy-root-body .am-accordion {
position: relative;
border-top: 1PX solid #ddd;
}
#wmy-root-body .am-accordion-anim-active {
-webkit-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
}
#wmy-root-body .am-accordion .am-accordion-item .am-accordion-header {
position: relative;
color: #000;
font-size: 0.34rem;
height: 0.88rem;
line-height: 0.88rem;
background-color: #fff;
box-sizing: content-box;
padding-left: 0.3rem;
padding-right: 0.6rem;
width: auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
#wmy-root-body .am-accordion .am-accordion-item .am-accordion-header:after {
display: block;
position: absolute;
content: '';
left: 0;
bottom: 0;
right: auto;
top: auto;
width: 100%;
border-bottom: 1PX solid #ddd;
}
#wmy-root-body .am-accordion .am-accordion-item .am-accordion-header i {
position: absolute;
display: block;
top: 0.3rem;
right: 0.3rem;
width: 0.3rem;
height: 0.3rem;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2216%22%20height%3D%2226%22%20viewBox%3D%220%200%2016%2026%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%3Cg%20id%3D%22UI-KIT_%E5%9F%BA%E7%A1%80%E5%85%83%E4%BB%B6%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Cg%20id%3D%229.9%E5%9F%BA%E7%A1%80%E5%85%83%E4%BB%B6%22%20transform%3D%22translate(-5809.000000%2C%20-8482.000000)%22%20fill%3D%22%23C7C7CC%22%3E%3Cpolygon%20id%3D%22Disclosure-Indicator%22%20points%3D%225811%208482%205809%208484%205820.5%208495%205809%208506%205811%208508%205825%208495%22%3E%3C%2Fpolygon%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E");
background-size: contain;
background-repeat: no-repeat;
background-position: 50% 50%;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
#wmy-root-body .am-accordion .am-accordion-item .am-accordion-header[aria-expanded~="true"] i {
-webkit-transform: rotate(270deg);
-ms-transform: rotate(270deg);
transform: rotate(270deg);
}
#wmy-root-body .am-accordion .am-accordion-item .am-accordion-content {
overflow: hidden;
background: #fff;
}
#wmy-root-body .am-accordion .am-accordion-item .am-accordion-content .am-accordion-content-box {
font-size: 0.3rem;
color: #333;
position: relative;
}
#wmy-root-body .am-accordion .am-accordion-item .am-accordion-content .am-accordion-content-box:after {
display: block;
position: absolute;
content: '';
left: 0;
bottom: 0;
right: auto;
top: auto;
width: 100%;
border-bottom: 1PX solid #ddd;
}
#wmy-root-body .am-accordion .am-accordion-item .am-accordion-content.am-accordion-content-inactive {
display: none;
}
#wmy-root-body .am-search {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
height: 0.88rem;
padding: 0 0.16rem;
overflow: hidden;
}
#wmy-root-body .am-search-input {
-webkit-box-flex: 1;
-ms-flex: 1;
-webkit-flex: 1;
flex: 1;
position: relative;
width: 100%;
height: 0.56rem;
overflow: hidden;
background-color: #fff;
background-clip: padding-box;
border-radius: 0.06rem;
}
#wmy-root-body .am-search-input .am-search-synthetic-ph,
#wmy-root-body .am-search-input input[type="search"] {
position: absolute;
top: 0;
left: 0;
}
#wmy-root-body .am-search-input .am-search-synthetic-ph {
z-index: 1;
height: 0.56rem;
line-height: 0.56rem;
width: 100%;
-webkit-transition: width 0.3s;
transition: width 0.3s;
display: block;
text-align: center;
}
#wmy-root-body .am-search-input .am-search-synthetic-ph-icon {
display: inline-block;
margin-right: 0.1rem;
width: 0.3rem;
height: 0.3rem;
overflow: hidden;
vertical-align: -0.05rem;
background-repeat: no-repeat;
background-size: 0.3rem auto;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'38'%20height%3D'36'%20viewBox%3D'0%200%2038%2036'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M29.05%2025.23a15.81%2015.81%200%200%200%203.004-9.294c0-8.8-7.17-15.934-16.017-15.934C7.192.002.02%207.136.02%2015.936c0%208.802%207.172%2015.937%2016.017%2015.937%204.148%200%207.928-1.569%2010.772-4.143l8.873%208.232%202.296-2.45-8.927-8.282zM16.2%2028.933c-7.19%200-13.04-5.788-13.04-12.903%200-7.113%205.85-12.904%2013.04-12.904%207.19%200%2012.9%205.79%2012.9%2012.904%200%207.115-5.71%2012.903-12.9%2012.903z'%20fill%3D'%23bbb'%20fill-rule%3D'evenodd'%2F%3E%3C%2Fsvg%3E");
}
#wmy-root-body .am-search-input .am-search-synthetic-ph-placeholder {
color: #bbb;
font-size: 0.3rem;
}
#wmy-root-body .am-search-input input[type="search"] {
z-index: 2;
opacity: 0;
width: 100%;
text-align: left;
display: block;
color: #000;
height: 0.56rem;
font-size: 0.3rem;
background-color: transparent;
border: 0;
}
#wmy-root-body .am-search-input input[type="search"]::-webkit-input-placeholder {
background: none;
text-align: left;
color: transparent;
}
#wmy-root-body .am-search-input input[type="search"]:-ms-input-placeholder {
background: none;
text-align: left;
color: transparent;
}
#wmy-root-body .am-search-input input[type="search"]::placeholder {
background: none;
text-align: left;
color: transparent;
}
#wmy-root-body .am-search-input input[type="search"]::-webkit-search-cancel-button {
-webkit-appearance: none;
}
#wmy-root-body .am-search-input .am-search-clear {
position: absolute;
display: none;
z-index: 3;
width: 0.3rem;
height: 0.3rem;
padding: 0.13rem;
border-radius: 50%;
top: 0;
right: 0;
background-color: transparent;
background-position: center;
background-repeat: no-repeat;
background-size: 0.3rem 0.3rem;
-webkit-transition: all 0.3s;
transition: all 0.3s;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2028%2028'%3E%3Ccircle%20cx%3D'14'%20cy%3D'14'%20r%3D'14'%20fill%3D'%23ccc'%2F%3E%3Cline%20stroke%3D'%23ffffff'%20stroke-width%3D'2'%20stroke-miterlimit%3D'10'%20x1%3D'8'%20y1%3D'8'%20x2%3D'20'%20y2%3D'20'%2F%3E%3Cline%20fill%3D'none'%20stroke%3D'%23ffffff'%20stroke-width%3D'2'%20stroke-miterlimit%3D'10'%20x1%3D'20'%20y1%3D'8'%20x2%3D'8'%20y2%3D'20'%2F%3E%3C%2Fsvg%3E");
}
#wmy-root-body .am-search-input .am-search-clear:active {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2028%2028'%3E%3Ccircle%20cx%3D'14'%20cy%3D'14'%20r%3D'14'%20fill%3D'%23108ee9'%2F%3E%3Cline%20stroke%3D'%23ffffff'%20stroke-width%3D'2'%20stroke-miterlimit%3D'10'%20x1%3D'8'%20y1%3D'8'%20x2%3D'20'%20y2%3D'20'%2F%3E%3Cline%20fill%3D'none'%20stroke%3D'%23ffffff'%20stroke-width%3D'2'%20stroke-miterlimit%3D'10'%20x1%3D'20'%20y1%3D'8'%20x2%3D'8'%20y2%3D'20'%2F%3E%3C%2Fsvg%3E");
}
#wmy-root-body .am-search-input .am-search-clear-show {
display: block;
}
#wmy-root-body .am-search-cancel {
-webkit-box-flex: 0;
-ms-flex: none;
-webkit-flex: none;
flex: none;
opacity: 0;
padding-left: 0.16rem;
height: 0.88rem;
line-height: 0.88rem;
font-size: 0.32rem;
color: #108ee9;
text-align: right;
}
#wmy-root-body .am-search-cancel-anim {
-webkit-transition: margin-right 0.3s, opacity 0.3s;
transition: margin-right 0.3s, opacity 0.3s;
-webkit-transition-delay: 0.1s;
transition-delay: 0.1s;
}
#wmy-root-body .am-search-cancel-show {
opacity: 1;
}
#wmy-root-body .am-search.am-search-start .am-search-input input[type="search"] {
opacity: 1;
padding-left: 0.7rem;
}
#wmy-root-body .am-search.am-search-start .am-search-input input[type="search"]::-webkit-input-placeholder {
color: transparent;
}
#wmy-root-body .am-search.am-search-start .am-search-input input[type="search"]:-ms-input-placeholder {
color: transparent;
}
#wmy-root-body .am-search.am-search-start .am-search-input input[type="search"]::placeholder {
color: transparent;
}
#wmy-root-body .am-search.am-search-start .am-search-input .am-search-synthetic-ph {
padding-left: 0.3rem;
width: auto;
}
#wmy-root-body .am-tab-bar {
overflow: hidden;
}
#wmy-root-body .am-tab-bar-bar {
box-sizing: border-box;
height: 1rem;
border-top: 1PX solid #ddd;
position: fixed;
bottom: 0;
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-transition: bottom 0.2s;
transition: bottom 0.2s;
z-index: 100;
}
#wmy-root-body .am-tab-bar-bar.am-tab-bar-bar-hidden {
bottom: -1rem;
}
#wmy-root-body .am-tab-bar-bar .am-tab-bar-tab {
-webkit-box-flex: 1;
-ms-flex: 1;
-webkit-flex: 1;
flex: 1;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
-webkit-flex-direction: column;
flex-direction: column;
text-align: center;
}
#wmy-root-body .am-tab-bar-bar .am-tab-bar-tab-image {
width: 0.44rem;
height: 0.44rem;
vertical-align: middle;
}
#wmy-root-body .am-tab-bar-bar .am-tab-bar-tab-title {
font-size: 0.2rem;
margin: 0.06rem 0 0 0;
margin-top: -4px;
line-height: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex: 1;
width: 100px;
}
#wmy-root-body .am-tab-bar-bar .am-tab-bar-tab-icon {
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
margin-top: -20px;
}
#wmy-root-body .am-tab-bar-bar .am-tab-bar-tab-icon .tab-badge :last-child {
margin-top: 0.08rem;
left: 0.44rem;
}
#wmy-root-body .am-tab-bar-bar .am-tab-bar-tab-icon .tab-dot :last-child {
margin-top: 0.08rem;
left: 0.44rem;
}
#wmy-root-body .am-tab-bar-content {
zoom: 1;
}
#wmy-root-body .am-tab-bar-content .am-tab-bar-tabpane {
overflow: auto;
}
#wmy-root-body .am-tab-bar-content-animated {
transition: -webkit-transform 0.3s cubic-bezier(0.86, 0, 0.07, 1);
-webkit-transition: -webkit-transform 0.3s cubic-bezier(0.86, 0, 0.07, 1);
transition: transform 0.3s cubic-bezier(0.86, 0, 0.07, 1);
transition: transform 0.3s cubic-bezier(0.86, 0, 0.07, 1), -webkit-transform 0.3s cubic-bezier(0.86, 0, 0.07, 1);
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
will-change: transform;
}
#wmy-root-body .am-tab-bar-content-animated .am-tab-bar-tabpane {
box-sizing: border-box;
width: 100%;
-ms-flex-negative: 0;
-webkit-flex-shrink: 0;
flex-shrink: 0;
}
#wmy-root-body .am-tab-bar-content-no-animated .am-tab-bar-tabpane-inactive {
display: none;
}
#wmy-root-body .cso-header {
height: 1.04rem;
}
#wmy-root-body .cso-title {
margin-top: 0.28rem;
height: 0.5rem;
position: absolute;
}
#wmy-root-body .cso-titleicon {
font-size: 0.36rem;
color: #E0A300;
}
#wmy-root-body .cso-titlefont {
margin-left: 0.26rem;
color: #030301;
font-size: 0.36rem;
}
#wmy-root-body .cso-image {
height: 2rem;
}
#wmy-root-body .cso-foot {
margin-left: 0.2rem;
margin-top: 0.2rem;
font-size: 0.28rem;
color: #000000;
}
#wmy-root-body .am-accordion {
position: relative;
border-top: 1PX solid #ddd;
}
#wmy-root-body .am-accordion-anim-active {
-webkit-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
}
#wmy-root-body .am-accordion .am-accordion-item .am-accordion-header {
position: relative;
color: #000;
font-size: 0.34rem;
height: 0.88rem;
line-height: 0.88rem;
background-color: #fff;
box-sizing: content-box;
padding-left: 0.3rem;
padding-right: 0.6rem;
width: auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
#wmy-root-body .am-accordion .am-accordion-item .am-accordion-header:after {
display: block;
position: absolute;
content: '';
left: 0;
bottom: 0;
right: auto;
top: auto;
width: 100%;
border-bottom: 1PX solid #ddd;
}
#wmy-root-body .am-accordion .am-accordion-item .am-accordion-header i {
position: absolute;
display: block;
top: 0.3rem;
right: 0.3rem;
width: 0.3rem;
height: 0.3rem;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2216%22%20height%3D%2226%22%20viewBox%3D%220%200%2016%2026%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%3Cg%20id%3D%22UI-KIT_%E5%9F%BA%E7%A1%80%E5%85%83%E4%BB%B6%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Cg%20id%3D%229.9%E5%9F%BA%E7%A1%80%E5%85%83%E4%BB%B6%22%20transform%3D%22translate(-5809.000000%2C%20-8482.000000)%22%20fill%3D%22%23C7C7CC%22%3E%3Cpolygon%20id%3D%22Disclosure-Indicator%22%20points%3D%225811%208482%205809%208484%205820.5%208495%205809%208506%205811%208508%205825%208495%22%3E%3C%2Fpolygon%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E");
background-size: contain;
background-repeat: no-repeat;
background-position: 50% 50%;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
#wmy-root-body .am-accordion .am-accordion-item .am-accordion-header[aria-expanded~="true"] i {
-webkit-transform: rotate(270deg);
-ms-transform: rotate(270deg);
transform: rotate(270deg);
}
#wmy-root-body .am-accordion .am-accordion-item .am-accordion-content {
overflow: hidden;
background: #fff;
}
#wmy-root-body .am-accordion .am-accordion-item .am-accordion-content .am-accordion-content-box {
font-size: 0.3rem;
color: #333;
position: relative;
}
#wmy-root-body .am-accordion .am-accordion-item .am-accordion-content .am-accordion-content-box:after {
display: block;
position: absolute;
content: '';
left: 0;
bottom: 0;
right: auto;
top: auto;
width: 100%;
border-bottom: 1PX solid #ddd;
}
#wmy-root-body .am-accordion .am-accordion-item .am-accordion-content.am-accordion-content-inactive {
display: none;
}
#wmy-root-body .am-list-header {
font-size: 0.28rem;
color: #888;
display: inline-block;
width: 100%;
box-sizing: border-box;
}
#wmy-root-body .am-list {
position: unset !important;
}
#wmy-root-body .am-list-footer {
padding: 0;
font-size: 0.28rem;
color: #888;
}
#wmy-root-body .am-list-body {
position: relative;
background-color: #fff;
}
#wmy-root-body .am-list-body:after {
display: block;
position: absolute;
content: '';
width: 100%;
}
#wmy-root-body .am-list-body div:not(:last-child) .am-list-line:after {
display: block;
position: absolute;
content: '';
left: 0;
bottom: 0;
right: auto;
top: auto;
width: 100%;
border-bottom: 1PX solid #ddd;
}
#wmy-root-body .am-list-item {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
padding-left: 0.3rem;
min-height: 0.88rem;
background-color: #fff;
vertical-align: middle;
overflow: hidden;
-webkit-transition: background-color 200ms;
transition: background-color 200ms;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
/* list左图片显示*/
}
#wmy-root-body .am-list-item .am-list-ripple {
position: absolute;
background: transparent;
display: inline-block;
overflow: hidden;
will-change: box-shadow, transform;
-webkit-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
outline: none;
cursor: pointer;
border-radius: 100%;
-webkit-transform: scale(0);
-ms-transform: scale(0);
transform: scale(0);
}
#wmy-root-body .am-list-item .am-list-ripple.am-list-ripple-animate {
background-color: rgba(158, 158, 158, 0.2);
-webkit-animation: ripple 1s linear;
animation: ripple 1s linear;
}
#wmy-root-body .am-list-item.am-list-item-top .am-list-line {
-webkit-box-align: start;
-ms-flex-align: start;
-webkit-align-items: flex-start;
align-items: flex-start;
}
#wmy-root-body .am-list-item.am-list-item-top .am-list-line .am-list-arrow {
margin-top: 0.04rem;
}
#wmy-root-body .am-list-item.am-list-item-middle .am-list-line {
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
#wmy-root-body .am-list-item.am-list-item-bottom .am-list-line {
-webkit-box-align: end;
-ms-flex-align: end;
-webkit-align-items: flex-end;
align-items: flex-end;
}
#wmy-root-body .am-list-item.am-list-item-error .am-list-line .am-list-extra {
color: #f50;
}
#wmy-root-body .am-list-item.am-list-item-error .am-list-line .am-list-extra .am-list-brief {
color: #f50;
}
#wmy-root-body .am-list-item.am-list-item-active {
background-color: #ddd;
}
#wmy-root-body .am-list-item.am-list-item-disabled .am-list-line .am-list-content,
#wmy-root-body .am-list-item.am-list-item-disabled .am-list-line .am-list-extra {
color: #bbb;
}
#wmy-root-body .am-list-item img {
width: 0.44rem;
height: 0.44rem;
vertical-align: middle;
}
#wmy-root-body .am-list-item .am-list-thumb:first-child {
margin-right: 0.3rem;
}
#wmy-root-body .am-list-item .am-list-thumb:last-child {
margin-left: 0.16rem;
}
#wmy-root-body .am-list-item .am-list-line {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-flex: 1;
-ms-flex: 1;
-webkit-flex: 1;
flex: 1;
-ms-flex-item-align: stretch;
-webkit-align-self: stretch;
align-self: stretch;
padding-right: 0.3rem;
min-height: 0.88rem;
overflow: hidden;
/* list左侧主内容*/
/* list右补充内容*/
/* 辅助性文字*/
/* list右侧箭头*/
}
#wmy-root-body .am-list-item .am-list-line .am-list-content {
-webkit-box-flex: 1;
-ms-flex: 1;
-webkit-flex: 1;
flex: 1;
color: #000;
font-size: 0.34rem;
line-height: 1.5;
text-align: left;
width: auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding-top: 0.14rem;
padding-bottom: 0.14rem;
}
#wmy-root-body .am-list-item .am-list-line .am-list-extra {
-ms-flex-preferred-size: 36%;
-webkit-flex-basis: 36%;
flex-basis: 36%;
color: #888;
font-size: 0.32rem;
line-height: 1.5;
text-align: right;
width: auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding-top: 0.14rem;
padding-bottom: 0.14rem;
}
#wmy-root-body .am-list-item .am-list-line .am-list-title {
width: auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
#wmy-root-body .am-list-item .am-list-line .am-list-brief {
color: #888;
font-size: 0.3rem;
line-height: 1.5;
margin-top: 0.12rem;
width: auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
#wmy-root-body .am-list-item .am-list-line .am-list-arrow {
display: block;
width: 0.3rem;
height: 0.3rem;
margin-left: 0.16rem;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2216%22%20height%3D%2226%22%20viewBox%3D%220%200%2016%2026%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%3Cg%20id%3D%22UI-KIT_%E5%9F%BA%E7%A1%80%E5%85%83%E4%BB%B6%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Cg%20id%3D%229.9%E5%9F%BA%E7%A1%80%E5%85%83%E4%BB%B6%22%20transform%3D%22translate(-5809.000000%2C%20-8482.000000)%22%20fill%3D%22%23C7C7CC%22%3E%3Cpolygon%20id%3D%22Disclosure-Indicator%22%20points%3D%225811%208482%205809%208484%205820.5%208495%205809%208506%205811%208508%205825%208495%22%3E%3C%2Fpolygon%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E");
background-size: contain;
background-repeat: no-repeat;
background-position: 50% 50%;
visibility: hidden;
}
#wmy-root-body .am-list-item .am-list-line .am-list-arrow-horizontal {
visibility: visible;
}
#wmy-root-body .am-list-item .am-list-line .am-list-arrow-vertical {
visibility: visible;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
#wmy-root-body .am-list-item .am-list-line .am-list-arrow-vertical-up {
visibility: visible;
-webkit-transform: rotate(270deg);
-ms-transform: rotate(270deg);
transform: rotate(270deg);
}
#wmy-root-body .am-list-item .am-list-line-multiple {
padding: 0.25rem 0.3rem 0.25rem 0;
}
#wmy-root-body .am-list-item .am-list-line-multiple .am-list-content {
padding-top: 0;
padding-bottom: 0;
}
#wmy-root-body .am-list-item .am-list-line-multiple .am-list-extra {
padding-top: 0;
padding-bottom: 0;
}
#wmy-root-body .am-list-item .am-list-line-wrap .am-list-content {
white-space: normal;
}
#wmy-root-body .am-list-item .am-list-line-wrap .am-list-extra {
white-space: normal;
}
#wmy-root-body .am-list-item select {
position: relative;
display: block;
width: 100%;
height: 100%;
padding: 0;
border: 0;
font-size: 0.34rem;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: transparent;
}
@-webkit-keyframes ripple {
100% {
opacity: 0;
-webkit-transform: scale(2.5);
transform: scale(2.5);
}
}
@keyframes ripple {
100% {
opacity: 0;
-webkit-transform: scale(2.5);
transform: scale(2.5);
}
}
#wmy-root-body .am-tabs-default-bar {
height: 88px;
}
#wmy-root-body .am-tabs-default-bar .am-tabs-default-bar-tab {
height: 88px;
line-height: 86px;
}
#wmy-root-body .am-tabs-default-bar .am-tabs-default-bar-tab .tab-custom-style-spans {
font-size: 0.32rem !important;
line-height: 0.35rem;
white-space: nowrap;
color: #000;
}
#wmy-root-body .am-tabs-default-bar .am-tabs-default-bar-tab-active .tab-custom-style-spans {
color: #4285f4;
}
#wmy-root-body .am-tabs-default-bar .tabspan {
font-size: 32px;
}
#wmy-root-body button {
border: 0;
}
#wmy-root-body .am-picker-col {
display: block;
position: relative;
height: 4.76rem;
overflow: hidden;
width: 100%;
}
#wmy-root-body .am-picker-col-content {
position: absolute;
left: 0;
top: 0;
width: 100%;
z-index: 1;
padding: 2.04rem 0;
}
#wmy-root-body .am-picker-col-item {
-ms-touch-action: manipulation;
touch-action: manipulation;
text-align: center;
font-size: 0.32rem;
height: 0.68rem;
line-height: 0.68rem;
color: #000;
white-space: nowrap;
text-overflow: ellipsis;
}
#wmy-root-body .am-picker-col-item-selected {
font-size: 0.34rem;
}
#wmy-root-body .am-picker-col-mask {
position: absolute;
left: 0;
top: 0;
height: 100%;
margin: 0 auto;
width: 100%;
z-index: 3;
background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.6)), -webkit-linear-gradient(bottom, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.6));
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.6)), linear-gradient(to top, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.6));
background-position: top, bottom;
background-size: 100% 2.04rem;
background-repeat: no-repeat;
}
#wmy-root-body .am-picker-col-indicator {
box-sizing: border-box;
width: 100%;
height: 0.68rem;
position: absolute;
left: 0;
top: 2.04rem;
z-index: 3;
border-top: 1PX solid #ddd;
border-bottom: 1PX solid #ddd;
}
#wmy-root-body .am-picker {
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
#wmy-root-body .am-picker-item {
-webkit-box-flex: 1;
-ms-flex: 1;
-webkit-flex: 1;
flex: 1;
text-align: center;
}
#wmy-root-body .am-picker-popup {
left: 0;
bottom: 0;
position: fixed;
width: 100%;
background-color: #fff;
}
#wmy-root-body .am-picker-popup-wrap {
position: fixed;
overflow: auto;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1000;
-webkit-overflow-scrolling: touch;
outline: 0;
}
#wmy-root-body .am-picker-popup-mask {
position: fixed;
top: 0;
right: 0;
left: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.4);
height: 100%;
z-index: 1000;
}
#wmy-root-body .am-picker-popup-mask-hidden {
display: none;
}
#wmy-root-body .am-picker-popup-header {
background-image: -webkit-linear-gradient(top, #e7e7e7, #e7e7e7, transparent, transparent);
background-image: linear-gradient(to bottom, #e7e7e7, #e7e7e7, transparent, transparent);
background-position: bottom;
background-size: 100% 0.01rem;
background-repeat: no-repeat;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
position: relative;
}
#wmy-root-body .am-picker-popup-header:after {
display: block;
position: absolute;
content: '';
left: 0;
bottom: 0;
right: auto;
top: auto;
width: 100%;
border-bottom: 1PX solid #ddd;
}
#wmy-root-body .am-picker-popup-header .am-picker-popup-header-right {
text-align: right;
}
#wmy-root-body .am-picker-popup-item {
color: #108ee9;
font-size: 0.34rem;
padding: 0.18rem 0.3rem;
height: 0.84rem;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
#wmy-root-body .am-picker-popup-item-active {
background-color: #ddd;
}
#wmy-root-body .am-picker-popup-title {
-webkit-box-flex: 1;
-ms-flex: 1;
-webkit-flex: 1;
flex: 1;
text-align: center;
color: #000;
}
#wmy-root-body .am-picker-popup .am-picker-popup-close {
display: none;
}
#wmy-root-body .am-picker-col {
-webkit-box-flex: 1;
-ms-flex: 1;
-webkit-flex: 1;
flex: 1;
}
#wmy-root-body .listcard {
height: 1.8rem;
}
#wmy-root-body .listcard-image {
margin-left: 0.2rem;
width: 40%;
height: 1.8rem;
float: left;
}
#wmy-root-body .listcard-info {
margin-left: 0.2rem;
width: 50.67%;
height: 1.8rem;
float: left;
}
#wmy-root-body .listcard-text {
margin-top: 0.18rem;
height: 0.4rem;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
font-size: 0.32rem;
color: #4A4A4A;
width: 100%;
display: inline-block;
}
#wmy-root-body .listcard-teacher {
margin-top: 0.06rem;
color: #999999;
font-size: 0.24rem;
height: 0.34rem;
}
#wmy-root-body .listcard-people {
margin-top: 0.28rem;
color: #999999;
font-size: 0.24rem;
height: 0.34rem;
}
#wmy-root-body .listcard-star {
font-size: 0.24rem;
color: #fadb14;
margin-left: 0.1rem;
}
@font-face {
font-family: 'anticon';
src: url('https://at.alicdn.com/t/font_148784_v4ggb6wrjmkotj4i.eot');
/* IE9*/
src: url('https://at.alicdn.com/t/font_148784_v4ggb6wrjmkotj4i.woff') format('woff'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/ url('https://at.alicdn.com/t/font_148784_v4ggb6wrjmkotj4i.ttf') format('truetype'), /* iOS 4.1- */ url('https://at.alicdn.com/t/font_148784_v4ggb6wrjmkotj4i.svg#iconfont') format('svg');
}
#wmy-root-body .anticon {
display: inline-block;
font-style: normal;
vertical-align: middle;
text-align: center;
text-transform: none;
line-height: 1;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
#wmy-root-body .anticon:before {
display: block;
font-family: "anticon" !important;
}
#wmy-root-body .anticon-star:before {
content: "";
}
#wmy-root-body .anticon-star-o:before {
content: "\E661";
content: "";
}
#wmy-root-body .ant-rate {
font-family: "Monospaced Number", "Chinese Quote", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 0.14rem;
line-height: 1.5;
color: rgba(0, 0, 0, 0.65);
box-sizing: border-box;
line-height: unset;
margin: 0;
padding: 0;
list-style: none;
font-size: 0.2rem;
display: inline-block;
color: #fadb14;
outline: none;
}
#wmy-root-body .ant-rate-disabled .ant-rate-star {
cursor: not-allowed;
}
#wmy-root-body .ant-rate-disabled .ant-rate-star:hover {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
#wmy-root-body .ant-rate-star {
margin: 0;
padding: 0;
display: inline-block;
margin-right: 0.04rem;
position: relative;
-webkit-transition: all 0.3s;
transition: all 0.3s;
color: inherit;
cursor: pointer;
}
#wmy-root-body .ant-rate-star-first,
#wmy-root-body .ant-rate-star-second {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-transition: all 0.3s;
transition: all 0.3s;
color: #e8e8e8;
}
#wmy-root-body .ant-rate-star-focused,
#wmy-root-body .ant-rate-star:hover {
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
#wmy-root-body .ant-rate-star-first {
position: absolute;
left: 0;
top: 0;
width: 50%;
height: 100%;
overflow: hidden;
opacity: 0;
}
#wmy-root-body .ant-rate-star-half .ant-rate-star-first,
#wmy-root-body .ant-rate-star-half .ant-rate-star-second {
opacity: 1;
}
#wmy-root-body .ant-rate-star-half .ant-rate-star-first,
#wmy-root-body .ant-rate-star-full .ant-rate-star-second {
color: inherit;
}
#wmy-root-body .ant-rate-text {
margin-left: 0.08rem;
display: inline-block;
font-size: 0.14rem;
}
#wmy-root-body .am-button {
display: block;
outline: 0 none;
-webkit-appearance: none;
box-sizing: border-box;
padding: 0;
text-align: center;
font-size: 0.36rem;
height: 0.94rem;
line-height: 0.94rem;
border-radius: 0.1rem;
overflow: hidden;
text-overflow: ellipsis;
word-break: break-word;
white-space: nowrap;
color: #000;
background-color: #fff;
border: 1PX solid #ddd;
}
#wmy-root-body .am-button.am-button-active {
background-color: #ddd;
}
#wmy-root-body .am-button-primary {
color: #fff;
background-color: #EB6C53;
border: 1PX solid #EB6C53;
}
#wmy-root-body .am-button-primary.am-button-active {
background-color: #1284d6;
}
#wmy-root-body .am-button-ghost {
color: #108ee9;
background-color: transparent;
border: 1PX solid #108ee9;
}
#wmy-root-body .am-button-ghost.am-button-active {
color: #fff;
background-color: #1284d6;
border: 1PX solid #108ee9;
}
#wmy-root-body .am-button-inline {
display: inline-block;
padding: 0 0.3rem;
}
#wmy-root-body .am-button-small {
font-size: 0.26rem;
height: 0.6rem;
line-height: 0.6rem;
padding: 0 0.3rem;
border-radius: 0.1rem;
}
#wmy-root-body .am-button-warning {
color: #f86e21;
background-color: #fff;
}
#wmy-root-body .am-button.am-button-across,
#wmy-root-body .am-button-primary.am-button-across,
#wmy-root-body .am-button-ghost.am-button-across,
#wmy-root-body .am-button-warning.am-button-across {
border-radius: 0;
border-left: 0;
border-right: 0;
}
#wmy-root-body .am-button.am-button-disabled,
#wmy-root-body .am-button-primary.am-button-disabled,
#wmy-root-body .am-button-ghost.am-button-disabled,
#wmy-root-body .am-button-warning.am-button-disabled {
color: #bbb;
background-color: #ddd;
border: 0;
}
#wmy-root-body .am-button-icon {
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
#wmy-root-body .am-button > .am-icon {
margin-right: 0.5em;
}
#wmy-root-body .am-modal {
position: relative;
}
#wmy-root-body .am-modal-mask {
position: fixed;
top: 0;
right: 0;
left: 0;
bottom: 0;
height: 100%;
z-index: 999;
background-color: rgba(0, 0, 0, 0.4);
}
#wmy-root-body .am-modal-mask-hidden {
display: none;
}
#wmy-root-body .am-modal-wrap {
position: fixed;
overflow: auto;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 100%;
z-index: 999;
-webkit-overflow-scrolling: touch;
outline: 0;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
#wmy-root-body .am-modal.am-modal-transparent {
width: 540px;
}
#wmy-root-body .am-modal.am-modal-transparent .am-modal-content {
border-radius: 0.14rem;
height: auto;
padding-top: 0.3rem;
}
#wmy-root-body .am-modal.am-modal-transparent .am-modal-content .am-modal-body {
padding: 0 0.3rem 0.3rem;
}
#wmy-root-body .am-modal-title {
margin: 0;
font-size: 0.36rem;
line-height: 1;
color: #000;
text-align: center;
}
#wmy-root-body .am-modal-header {
padding: 0.12rem 0.3rem 0.3rem;
}
#wmy-root-body .am-modal-content {
position: relative;
border: 0;
background-clip: padding-box;
text-align: center;
height: 100%;
overflow: hidden;
}
#wmy-root-body .am-modal-close {
border: 0;
padding: 0;
background-color: transparent;
outline: none;
position: absolute;
right: 0.3rem;
z-index: 999;
height: 0.42rem;
width: 0.42rem;
}
#wmy-root-body .am-modal-close-x {
display: inline-block;
width: 0.3rem;
height: 0.3rem;
background-repeat: no-repeat;
background-size: cover;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'30'%20height%3D'30'%20viewBox%3D'0%200%2030%2030'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%20%3Cdefs%3E%3C%2Fdefs%3E%20%3Cg%20id%3D'ALL-ICON'%20stroke%3D'none'%20stroke-width%3D'1'%20fill%3D'none'%20fill-rule%3D'evenodd'%3E%20%3Cg%20id%3D'Rectangle-283-%2B-Rectangle-283'%20fill%3D'%23888888'%3E%20%3Crect%20id%3D'Rectangle-283'%20transform%3D'translate(14.849242%2C%2014.849242)%20rotate(-315.000000)%20translate(-14.849242%2C%20-14.849242)%20'%20x%3D'-5.1507576'%20y%3D'13.8492424'%20width%3D'40'%20height%3D'2'%3E%3C%2Frect%3E%20%3Crect%20id%3D'Rectangle-283'%20transform%3D'translate(14.849242%2C%2014.849242)%20scale(-1%2C%201)%20rotate(-315.000000)%20translate(-14.849242%2C%20-14.849242)%20'%20x%3D'-5.1507576'%20y%3D'13.8492424'%20width%3D'40'%20height%3D'2'%3E%3C%2Frect%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E");
}
#wmy-root-body .am-modal-body {
font-size: 0.3rem;
color: #888;
height: 100%;
line-height: 1.5;
overflow: auto;
}
#wmy-root-body .am-modal-button-group-h {
border-top: 1PX solid #ddd;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
}
#wmy-root-body .am-modal-button-group-h .am-modal-button {
-webkit-touch-callout: none;
-webkit-box-flex: 1;
-ms-flex: 1;
-webkit-flex: 1;
flex: 1;
box-sizing: border-box;
text-align: center;
text-decoration: none;
outline: none;
color: #108ee9;
font-size: 0.36rem;
height: 1rem;
line-height: 1rem;
display: block;
width: auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
#wmy-root-body .am-modal-button-group-h .am-modal-button:first-child {
color: #000;
border-right: 1PX solid #ddd;
}
#wmy-root-body .am-modal-button-group-v .am-modal-button {
-webkit-touch-callout: none;
border-top: 1PX solid #ddd;
box-sizing: border-box;
text-align: center;
text-decoration: none;
outline: none;
color: #108ee9;
font-size: 0.36rem;
height: 1rem;
line-height: 1rem;
display: block;
width: auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
#wmy-root-body .am-modal-button-active {
background-color: #ddd;
}
#wmy-root-body .am-modal-input {
height: 0.72rem;
line-height: 1;
border-left: 1PX solid #ddd;
border-right: 1PX solid #ddd;
border-bottom: 1PX solid #ddd;
}
#wmy-root-body .am-modal-input:first-child {
margin-top: 0.18rem;
border-top: 1PX solid #ddd;
border-top-left-radius: 0.06rem;
border-top-right-radius: 0.06rem;
}
#wmy-root-body .am-modal-input:last-child {
border-bottom-left-radius: 0.06rem;
border-bottom-right-radius: 0.06rem;
}
#wmy-root-body .am-modal-input input {
border: 0;
width: 98%;
height: 100%;
box-sizing: border-box;
margin: 0;
padding: 0.06rem 0;
}
#wmy-root-body .am-modal-input input::-webkit-input-placeholder {
font-size: 0.28rem;
color: #ccc;
padding-left: 0.16rem;
}
#wmy-root-body .am-modal-input input:-ms-input-placeholder {
font-size: 0.28rem;
color: #ccc;
padding-left: 0.16rem;
}
#wmy-root-body .am-modal-input input::placeholder {
font-size: 0.28rem;
color: #ccc;
padding-left: 0.16rem;
}
#wmy-root-body .am-modal.am-modal-transparent.am-modal-android .am-modal-content {
border-radius: 0;
}
#wmy-root-body .am-modal.am-modal-transparent.am-modal-android .am-modal-content .am-modal-header {
padding: 0.18rem 0.48rem 0.24rem;
}
#wmy-root-body .am-modal.am-modal-transparent.am-modal-android .am-modal-content .am-modal-header .am-modal-title {
text-align: left;
font-size: 0.42rem;
color: #000;
}
#wmy-root-body .am-modal.am-modal-transparent.am-modal-android .am-modal-content .am-modal-body {
color: #000;
text-align: left;
padding: 0 0.48rem 0.3rem;
}
#wmy-root-body .am-modal.am-modal-transparent.am-modal-android .am-modal-content .am-modal-body .am-modal-input {
border-left: 0;
border-right: 0;
border-radius: 0;
}
#wmy-root-body .am-modal.am-modal-transparent.am-modal-android .am-modal-content .am-modal-body .am-modal-input:first-child {
border-top: 0;
}
#wmy-root-body .am-modal.am-modal-transparent.am-modal-android .am-modal-content .am-modal-footer {
padding-bottom: 0.24rem;
}
#wmy-root-body .am-modal.am-modal-transparent.am-modal-android .am-modal-content .am-modal-footer .am-modal-button-group-h {
overflow: hidden;
border-top: 0;
-webkit-box-pack: end;
-ms-flex-pack: end;
-webkit-justify-content: flex-end;
justify-content: flex-end;
padding: 0 0.24rem;
}
#wmy-root-body .am-modal.am-modal-transparent.am-modal-android .am-modal-content .am-modal-footer .am-modal-button-group-h .am-modal-button {
-webkit-box-flex: initial;
-ms-flex: initial;
-webkit-flex: initial;
flex: initial;
margin-left: 0.06rem;
padding: 0 0.3rem;
height: 0.96rem;
box-sizing: border-box;
}
#wmy-root-body .am-modal.am-modal-transparent.am-modal-android .am-modal-content .am-modal-footer .am-modal-button-group-h .am-modal-button:first-child {
border-right: 0;
color: #777;
}
#wmy-root-body .am-modal.am-modal-transparent.am-modal-android .am-modal-content .am-modal-footer .am-modal-button-group-v.am-modal-button-group-normal {
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: end;
-ms-flex-pack: end;
-webkit-justify-content: flex-end;
justify-content: flex-end;
overflow: hidden;
padding: 0 0.24rem;
}
#wmy-root-body .am-modal.am-modal-transparent.am-modal-android .am-modal-content .am-modal-footer .am-modal-button-group-v.am-modal-button-group-normal .am-modal-button {
border-top: 0;
padding: 0 0.3rem;
margin-left: 0.06rem;
height: 0.96rem;
box-sizing: border-box;
}
#wmy-root-body .am-modal.am-modal-transparent.am-modal-android .am-modal-content .am-modal-footer .am-modal-button-group-operation .am-modal-button {
text-align: start;
padding-left: 0.3rem;
}
#wmy-root-body .am-modal.am-modal-operation .am-modal-content {
border-radius: 0.14rem;
height: auto;
padding-top: 0;
}
#wmy-root-body .am-modal.am-modal-operation .am-modal-content .am-modal-body {
padding: 0 !important;
}
#wmy-root-body .am-modal.am-modal-operation .am-modal-content .am-modal-button {
color: #000;
text-align: center;
}
#wmy-root-body .am-textarea-item {
border: 2px solid #eee;
}
#wmy-root-body .am-list .am-list-item.am-textarea-item {
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
-webkit-align-items: flex-start;
align-items: flex-start;
box-sizing: border-box;
min-height: 0.88rem;
padding-left: 0.3rem;
padding-right: 0.3rem;
}
#wmy-root-body .am-list .am-list-item.am-textarea-item:after {
display: block;
position: absolute;
content: '';
left: 0.3rem;
bottom: 0;
right: auto;
top: auto;
width: 100%;
border-bottom: 1PX solid #ddd;
}
#wmy-root-body .am-list .am-list-item.am-textarea-item.am-textarea-item-single-line {
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
#wmy-root-body .am-list .am-list-item.am-textarea-item.am-textarea-item-single-line .am-textarea-label {
-ms-flex-item-align: center;
-ms-grid-row-align: center;
-webkit-align-self: center;
align-self: center;
}
#wmy-root-body .am-list .am-list-item.am-textarea-item.am-textarea-item-single-line .am-textarea-control {
padding-top: 0;
padding-bottom: 0;
}
#wmy-root-body .am-list .am-list-item.am-textarea-item.am-textarea-item-single-line .am-textarea-control textarea {
line-height: 0.51rem;
}
#wmy-root-body .am-list .am-list-item.am-textarea-item.am-textarea-item-single-line .am-textarea-clear {
margin-top: 0;
}
#wmy-root-body .am-list .am-list-item.am-textarea-item.am-textarea-item-single-line.am-textarea-error .am-textarea-error-extra {
margin-top: 0;
}
#wmy-root-body .am-textarea-label {
-ms-flex-item-align: start;
-webkit-align-self: flex-start;
align-self: flex-start;
color: #000;
text-align: left;
min-height: 0.88rem;
font-size: 0.34rem;
line-height: 0.88rem;
margin-left: 0;
margin-right: 0.1rem;
white-space: nowrap;
overflow: hidden;
}
#wmy-root-body .am-textarea-label.am-textarea-label-2 {
width: 0.68rem;
}
#wmy-root-body .am-textarea-label.am-textarea-label-3 {
width: 1.02rem;
}
#wmy-root-body .am-textarea-label.am-textarea-label-4 {
width: 1.36rem;
}
#wmy-root-body .am-textarea-label.am-textarea-label-5 {
width: 1.7rem;
}
#wmy-root-body .am-textarea-label.am-textarea-label-6 {
width: 2.04rem;
}
#wmy-root-body .am-textarea-label.am-textarea-label-7 {
width: 2.38rem;
}
#wmy-root-body .am-textarea-control {
-webkit-box-flex: 1;
-ms-flex: 1;
-webkit-flex: 1;
flex: 1;
padding-top: 0.23rem;
padding-bottom: 0.21rem;
}
#wmy-root-body .am-textarea-control textarea {
color: #000;
font-size: 0.34rem;
line-height: 0.51rem;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 100%;
padding: 0;
border: 0;
background-color: transparent;
overflow: visible;
display: block;
resize: none;
word-break: break-all;
word-wrap: break-word;
}
#wmy-root-body .am-textarea-control textarea::-webkit-input-placeholder {
color: #bbb;
}
#wmy-root-body .am-textarea-control textarea:-ms-input-placeholder {
color: #bbb;
}
#wmy-root-body .am-textarea-control textarea::placeholder {
color: #bbb;
}
#wmy-root-body .am-textarea-control textarea:disabled {
color: #bbb;
background-color: #fff;
}
#wmy-root-body .am-textarea-clear {
display: none;
width: 0.42rem;
height: 0.42rem;
margin-top: 0.24rem;
border-radius: 50%;
overflow: hidden;
font-style: normal;
color: #fff;
background-color: #ccc;
background-repeat: no-repeat;
background-size: 0.42rem auto;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23fff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M19%206.41L17.59%205%2012%2010.59%206.41%205%205%206.41%2010.59%2012%205%2017.59%206.41%2019%2012%2013.41%2017.59%2019%2019%2017.59%2013.41%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
}
#wmy-root-body .am-textarea-clear:active {
background-color: #108ee9;
}
#wmy-root-body .am-textarea-focus .am-textarea-clear {
display: block;
}
#wmy-root-body .am-textarea-count {
position: absolute;
bottom: 0.12rem;
right: 0.1rem;
color: #bbb;
font-size: 0.28rem;
}
#wmy-root-body .am-textarea-count span {
color: #000;
}
#wmy-root-body .am-textarea-error .am-textarea-control textarea {
color: #f50;
}
#wmy-root-body .am-textarea-error .am-textarea-error-extra {
margin-top: 0.24rem;
width: 0.42rem;
height: 0.42rem;
margin-left: 0.16rem;
background-size: 0.42rem 0.42rem;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'18'%20height%3D'18'%20viewBox%3D'0%200%2018%2018'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cg%20stroke%3D'none'%20stroke-width%3D'1'%20fill%3D'none'%20fill-rule%3D'evenodd'%3E%3Cg%20transform%3D'translate(-300.000000%2C%20-1207.000000)'%20fill%3D'%23FF5500'%3E%3Cg%20id%3D'exclamation-circle-o'%20transform%3D'translate(300.000000%2C%201207.000000)'%3E%3Cpath%20d%3D'M9%2C16.734375%20C10.0441406%2C16.734375%2011.0566406%2C16.5304688%2012.009375%2C16.1279297%20C12.9304688%2C15.7376953%2013.7566406%2C15.1804687%2014.4685547%2C14.4703125%20C15.1787109%2C13.7601563%2015.7376953%2C12.9322266%2016.1261719%2C12.0111328%20C16.5304688%2C11.0566406%2016.734375%2C10.0441406%2016.734375%2C9%20C16.734375%2C7.95585938%2016.5304688%2C6.94335938%2016.1279297%2C5.990625%20C15.7376953%2C5.06953125%2015.1804687%2C4.24335938%2014.4703125%2C3.53144531%20C13.7601563%2C2.82128906%2012.9322266%2C2.26230469%2012.0111328%2C1.87382813%20C11.0566406%2C1.46953125%2010.0441406%2C1.265625%209%2C1.265625%20C7.95585938%2C1.265625%206.94335938%2C1.46953125%205.990625%2C1.87207031%20C5.06953125%2C2.26230469%204.24335938%2C2.81953125%203.53144531%2C3.5296875%20C2.82128906%2C4.23984375%202.26230469%2C5.06777344%201.87382813%2C5.98886719%20C1.46953125%2C6.94335938%201.265625%2C7.95585938%201.265625%2C9%20C1.265625%2C10.0441406%201.46953125%2C11.0566406%201.87207031%2C12.009375%20C2.26230469%2C12.9304688%202.81953125%2C13.7566406%203.5296875%2C14.4685547%20C4.23984375%2C15.1787109%205.06777344%2C15.7376953%205.98886719%2C16.1261719%20C6.94335938%2C16.5304688%207.95585938%2C16.734375%209%2C16.734375%20L9%2C16.734375%20Z%20M9%2C18%20C4.02890625%2C18%200%2C13.9710937%200%2C9%20C0%2C4.02890625%204.02890625%2C0%209%2C0%20C13.9710937%2C0%2018%2C4.02890625%2018%2C9%20C18%2C13.9710937%2013.9710937%2C18%209%2C18%20L9%2C18%20L9%2C18%20Z%20M9%2C6.75%20C8.61152344%2C6.75%208.296875%2C7.06464844%208.296875%2C7.453125%20L8.296875%2C13.9394531%20C8.296875%2C14.3279297%208.61152344%2C14.6425781%209%2C14.6425781%20C9.38847656%2C14.6425781%209.703125%2C14.3279297%209.703125%2C13.9394531%20L9.703125%2C7.453125%20C9.703125%2C7.06464844%209.38847656%2C6.75%209%2C6.75%20L9%2C6.75%20Z%20M8.20898438%2C4.83398438%20C8.20898438%2C5.27085024%208.56313413%2C5.625%209%2C5.625%20C9.43686587%2C5.625%209.79101562%2C5.27085024%209.79101562%2C4.83398438%20C9.79101562%2C4.39711851%209.43686587%2C4.04296875%209%2C4.04296875%20C8.56313413%2C4.04296875%208.20898438%2C4.39711851%208.20898438%2C4.83398438%20L8.20898438%2C4.83398438%20Z'%20id%3D'Shape'%20transform%3D'translate(9.000000%2C%209.000000)%20scale(1%2C%20-1)%20translate(-9.000000%2C%20-9.000000)%20'%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
#wmy-root-body .am-textarea-disabled .am-textarea-label {
color: #bbb;
}
#wmy-root-body .am-list-item .am-input-control {
-webkit-box-flex: 1;
-ms-flex: 1;
-webkit-flex: 1;
flex: 1;
width: auto;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
#wmy-root-body .am-list-item .am-input-control .fake-input-container {
height: 0.6rem;
line-height: 0.6rem;
position: relative;
}
#wmy-root-body .am-list-item .am-input-control .fake-input-container .fake-input {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
margin-right: 0.1rem;
text-decoration: rtl;
text-align: right;
color: #000;
font-size: 0.34rem;
}
#wmy-root-body .am-list-item .am-input-control .fake-input-container .fake-input.fake-input-disabled {
color: #bbb;
}
#wmy-root-body .am-list-item .am-input-control .fake-input-container .fake-input.focus {
-webkit-transition: color 0.2s;
transition: color 0.2s;
}
#wmy-root-body .am-list-item .am-input-control .fake-input-container .fake-input.focus:after {
content: "";
position: absolute;
right: 0;
top: 10%;
height: 80%;
border-right: 0.03rem solid #108ee9;
-webkit-animation: keyboard-cursor infinite 1s step-start;
animation: keyboard-cursor infinite 1s step-start;
}
#wmy-root-body .am-list-item .am-input-control .fake-input-container .fake-input-placeholder {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
color: #bbb;
text-align: right;
}
#wmy-root-body .am-number-keyboard-wrapper {
position: fixed;
bottom: 0;
left: 0;
right: 0;
width: 100%;
height: 4rem;
z-index: 10000;
font-family: 'PingFang SC';
background-color: #f6f6f7;
-webkit-transition-duration: 0.2s;
transition-duration: 0.2s;
transition-property: -webkit-transform display;
-webkit-transition-property: -webkit-transform display;
transition-property: transform display;
transition-property: transform display, -webkit-transform display;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
#wmy-root-body .am-number-keyboard-wrapper.am-number-keyboard-wrapper-hide {
bottom: -10rem;
}
#wmy-root-body .am-number-keyboard-wrapper table {
width: 100%;
padding: 0;
margin: 0;
border-collapse: collapse;
border-top: 1Px solid #ccc;
}
#wmy-root-body .am-number-keyboard-wrapper table tr {
width: 100%;
padding: 0;
margin: 0;
}
#wmy-root-body .am-number-keyboard-wrapper table tr .am-number-keyboard-item {
width: 25%;
padding: 0;
margin: 0;
height: 1rem;
text-align: center;
border-left: 1Px solid #ccc;
border-bottom: 1Px solid #ccc;
font-size: 0.51rem;
color: #2a2b2c;
position: relative;
}
#wmy-root-body .am-number-keyboard-wrapper table tr .am-number-keyboard-item.am-number-keyboard-item-active {
background-color: #ddd;
}
#wmy-root-body .am-number-keyboard-wrapper table tr .am-number-keyboard-item.keyboard-confirm {
color: #fff;
font-size: 0.42rem;
background-color: #108ee9;
}
#wmy-root-body .am-number-keyboard-wrapper table tr .am-number-keyboard-item.keyboard-confirm.am-number-keyboard-item-active {
background-color: #1284d6;
}
#wmy-root-body .am-number-keyboard-wrapper table tr .am-number-keyboard-item.keyboard-confirm.am-number-keyboard-item-disabled {
background-color: #1284d6;
color: rgba(255, 255, 255, 0.45);
}
#wmy-root-body .am-number-keyboard-wrapper table tr .am-number-keyboard-item.keyboard-delete {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22204%22%20height%3D%22148%22%20viewBox%3D%220%200%20153.000000%20111.000000%22%3E%3Cpath%20d%3D%22M46.9%204.7c-2.5%202.6-14.1%2015.5-25.8%2028.6L-.1%2057l25.6%2027%2025.7%2027.1%2047.4-.3%2047.4-.3%203.2-3.3%203.3-3.2V7l-3.3-3.2L146%20.5%2098.7.2%2051.5-.1l-4.6%204.8zm97.9%203.5c1.7%201.7%201.7%2092.9%200%2094.6-.9.9-12.6%201.2-46.3%201.2H53.4L31.2%2080.4%209%2056.9l5.1-5.7c2.8-3.1%2012.8-14.4%2022.2-24.9L53.5%207h45c33.8%200%2045.4.3%2046.3%201.2z%22%2F%3E%3Cpath%20d%3D%22M69.5%2031c-1.9%202.1-1.7%202.2%209.3%2013.3L90%2055.5%2078.8%2066.7%2067.5%2078l2.3%202.2%202.2%202.3%2011.3-11.3L94.5%2060l11.2%2011.2L117%2082.5l2.2-2.3%202.3-2.2-11.3-11.3L99%2055.5l11.2-11.2L121.5%2033l-2.3-2.2-2.2-2.3-11.3%2011.3L94.5%2051l-11-11c-6-6-11.2-11-11.6-11-.3%200-1.4.9-2.4%202z%22%2F%3E%3C%2Fsvg%3E");
background-size: 0.51rem 0.37rem;
background-position: 50% 50%;
background-repeat: no-repeat;
}
#wmy-root-body .am-number-keyboard-wrapper table tr .am-number-keyboard-item.keyboard-hide {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22260%22%20height%3D%22188%22%20viewBox%3D%220%200%20195.000000%20141.000000%22%3E%3Cpath%20d%3D%22M0%2057v57h195V0H0v57zm183%200v45H12V12h171v45z%22%2F%3E%3Cpath%20d%3D%22M21%2031.5V39h15V24H21v7.5zM48%2031.5V39h15V24H48v7.5zM75%2031.5V39h15V24H75v7.5zM102%2031.5V39h15V24h-15v7.5zM129%2031.5V39h15V24h-15v7.5zM156%2031.5V39h15V24h-15v7.5zM36%2055.5V63h15V48H36v7.5zM63%2055.5V63h15V48H63v7.5zM90%2055.5V63h15V48H90v7.5zM117%2055.5V63h15V48h-15v7.5zM144%2055.5V63h15V48h-15v7.5zM27%2079.5V87h15V72H27v7.5zM48%2079.5V87h96V72H48v7.5zM150%2079.5V87h15V72h-15v7.5zM81%20124.5c0%20.8.7%201.5%201.5%201.5s1.5.7%201.5%201.5.7%201.5%201.5%201.5%201.5.7%201.5%201.5.7%201.5%201.5%201.5%201.5.7%201.5%201.5.7%201.5%201.5%201.5%201.5.7%201.5%201.5.7%201.5%201.5%201.5%201.5.7%201.5%201.5.7%201.5%201.5%201.5%201.5-.7%201.5-1.5.7-1.5%201.5-1.5%201.5-.7%201.5-1.5.7-1.5%201.5-1.5%201.5-.7%201.5-1.5.7-1.5%201.5-1.5%201.5-.7%201.5-1.5.7-1.5%201.5-1.5%201.5-.7%201.5-1.5.7-1.5%201.5-1.5%201.5-.7%201.5-1.5c0-1.3-2.5-1.5-16.5-1.5s-16.5.2-16.5%201.5z%22%2F%3E%3C%2Fsvg%3E");
background-size: 0.65rem 0.47rem;
background-position: 50% 50%;
background-repeat: no-repeat;
}
@-webkit-keyframes keyboard-cursor {
0% {
opacity: 1;
}
50% {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes keyboard-cursor {
0% {
opacity: 1;
}
50% {
opacity: 0;
}
to {
opacity: 1;
}
}
#wmy-root-body .am-list-item.am-input-item {
height: 0.88rem;
padding-left: 0.3rem;
padding-right: 0.3rem;
}
#wmy-root-body .am-list-item.am-input-item:after {
display: block;
position: absolute;
content: '';
left: 0.3rem;
bottom: 0;
right: auto;
top: auto;
width: 100%;
border-bottom: 1PX solid #ddd;
}
#wmy-root-body .am-list-item .am-input-label {
color: #000;
font-size: 0.34rem;
margin-left: 0;
margin-right: 0.1rem;
text-align: left;
white-space: nowrap;
overflow: hidden;
padding: 0.04rem 0;
}
#wmy-root-body .am-list-item .am-input-label.am-input-label-2 {
width: 0.68rem;
}
#wmy-root-body .am-list-item .am-input-label.am-input-label-3 {
width: 1.02rem;
}
#wmy-root-body .am-list-item .am-input-label.am-input-label-4 {
width: 1.36rem;
}
#wmy-root-body .am-list-item .am-input-label.am-input-label-5 {
width: 1.7rem;
}
#wmy-root-body .am-list-item .am-input-label.am-input-label-6 {
width: 2.04rem;
}
#wmy-root-body .am-list-item .am-input-label.am-input-label-7 {
width: 2.38rem;
}
#wmy-root-body .am-list-item .am-input-control {
font-size: 0.34rem;
-webkit-box-flex: 1;
-ms-flex: 1;
-webkit-flex: 1;
flex: 1;
}
#wmy-root-body .am-list-item .am-input-control input {
color: #000;
font-size: 0.34rem;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 100%;
padding: 0.04rem 0;
border: 0;
background-color: transparent;
line-height: 1;
box-sizing: border-box;
}
#wmy-root-body .am-list-item .am-input-control input::-webkit-input-placeholder {
color: #bbb;
line-height: 1.2;
}
#wmy-root-body .am-list-item .am-input-control input:-ms-input-placeholder {
color: #bbb;
line-height: 1.2;
}
#wmy-root-body .am-list-item .am-input-control input::placeholder {
color: #bbb;
line-height: 1.2;
}
#wmy-root-body .am-list-item .am-input-control input:disabled {
color: #bbb;
background-color: #fff;
}
#wmy-root-body .am-list-item .am-input-clear {
display: none;
width: 0.42rem;
height: 0.42rem;
border-radius: 50%;
overflow: hidden;
font-style: normal;
color: #fff;
background-color: #ccc;
background-repeat: no-repeat;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23fff'%20viewBox%3D'0%200%2030%2030'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M19%206.41L17.59%205%2012%2010.59%206.41%205%205%206.41%2010.59%2012%205%2017.59%206.41%2019%2012%2013.41%2017.59%2019%2019%2017.59%2013.41%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
background-size: 0.42rem auto;
background-position: 0.04rem 0.04rem;
}
#wmy-root-body .am-list-item .am-input-clear:active {
background-color: #108ee9;
}
#wmy-root-body .am-list-item.am-input-focus .am-input-clear {
display: block;
}
#wmy-root-body .am-list-item .am-input-extra {
-webkit-box-flex: initial;
-ms-flex: initial;
-webkit-flex: initial;
flex: initial;
min-width: 0;
max-height: 0.42rem;
overflow: hidden;
padding-right: 0;
line-height: 1;
color: #888;
font-size: 0.3rem;
margin-left: 0.1rem;
}
#wmy-root-body .am-list-item.am-input-error .am-input-control input {
color: #f50;
}
#wmy-root-body .am-list-item.am-input-error .am-input-error-extra {
height: 0.42rem;
width: 0.42rem;
margin-left: 0.12rem;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'18'%20height%3D'18'%20viewBox%3D'0%200%2018%2018'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cg%20stroke%3D'none'%20stroke-width%3D'1'%20fill%3D'none'%20fill-rule%3D'evenodd'%3E%3Cg%20transform%3D'translate(-300.000000%2C%20-1207.000000)'%20fill%3D'%23FF5500'%3E%3Cg%20id%3D'exclamation-circle-o'%20transform%3D'translate(300.000000%2C%201207.000000)'%3E%3Cpath%20d%3D'M9%2C16.734375%20C10.0441406%2C16.734375%2011.0566406%2C16.5304688%2012.009375%2C16.1279297%20C12.9304688%2C15.7376953%2013.7566406%2C15.1804687%2014.4685547%2C14.4703125%20C15.1787109%2C13.7601563%2015.7376953%2C12.9322266%2016.1261719%2C12.0111328%20C16.5304688%2C11.0566406%2016.734375%2C10.0441406%2016.734375%2C9%20C16.734375%2C7.95585938%2016.5304688%2C6.94335938%2016.1279297%2C5.990625%20C15.7376953%2C5.06953125%2015.1804687%2C4.24335938%2014.4703125%2C3.53144531%20C13.7601563%2C2.82128906%2012.9322266%2C2.26230469%2012.0111328%2C1.87382813%20C11.0566406%2C1.46953125%2010.0441406%2C1.265625%209%2C1.265625%20C7.95585938%2C1.265625%206.94335938%2C1.46953125%205.990625%2C1.87207031%20C5.06953125%2C2.26230469%204.24335938%2C2.81953125%203.53144531%2C3.5296875%20C2.82128906%2C4.23984375%202.26230469%2C5.06777344%201.87382813%2C5.98886719%20C1.46953125%2C6.94335938%201.265625%2C7.95585938%201.265625%2C9%20C1.265625%2C10.0441406%201.46953125%2C11.0566406%201.87207031%2C12.009375%20C2.26230469%2C12.9304688%202.81953125%2C13.7566406%203.5296875%2C14.4685547%20C4.23984375%2C15.1787109%205.06777344%2C15.7376953%205.98886719%2C16.1261719%20C6.94335938%2C16.5304688%207.95585938%2C16.734375%209%2C16.734375%20L9%2C16.734375%20Z%20M9%2C18%20C4.02890625%2C18%200%2C13.9710937%200%2C9%20C0%2C4.02890625%204.02890625%2C0%209%2C0%20C13.9710937%2C0%2018%2C4.02890625%2018%2C9%20C18%2C13.9710937%2013.9710937%2C18%209%2C18%20L9%2C18%20L9%2C18%20Z%20M9%2C6.75%20C8.61152344%2C6.75%208.296875%2C7.06464844%208.296875%2C7.453125%20L8.296875%2C13.9394531%20C8.296875%2C14.3279297%208.61152344%2C14.6425781%209%2C14.6425781%20C9.38847656%2C14.6425781%209.703125%2C14.3279297%209.703125%2C13.9394531%20L9.703125%2C7.453125%20C9.703125%2C7.06464844%209.38847656%2C6.75%209%2C6.75%20L9%2C6.75%20Z%20M8.20898438%2C4.83398438%20C8.20898438%2C5.27085024%208.56313413%2C5.625%209%2C5.625%20C9.43686587%2C5.625%209.79101562%2C5.27085024%209.79101562%2C4.83398438%20C9.79101562%2C4.39711851%209.43686587%2C4.04296875%209%2C4.04296875%20C8.56313413%2C4.04296875%208.20898438%2C4.39711851%208.20898438%2C4.83398438%20L8.20898438%2C4.83398438%20Z'%20id%3D'Shape'%20transform%3D'translate(9.000000%2C%209.000000)%20scale(1%2C%20-1)%20translate(-9.000000%2C%20-9.000000)%20'%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E");
background-size: 0.42rem auto;
}
#wmy-root-body .am-list-item.am-input-disabled .am-input-label {
color: #bbb;
}
#wmy-root-body .am-list-body .am-list-item:last-child {
border-bottom: 0;
}
#wmy-root-body .am-list-body .am-list-item:last-child:after {
display: none;
}
src/index.less
...@@ -1544,8 +1544,8 @@ p { ...@@ -1544,8 +1544,8 @@ p {
.am-button-primary { .am-button-primary {
color: #fff; color: #fff;
background-color: #108ee9; background-color: #EB6C53;
border: 1PX solid #108ee9; border: 1PX solid #EB6C53;
} }
.am-button-primary.am-button-active { .am-button-primary.am-button-active {
......
src/main.js
...@@ -168,6 +168,10 @@ const DataPreView = LazyLoad(() => ...@@ -168,6 +168,10 @@ const DataPreView = LazyLoad(() =>
import('./components/common/dataPreView/index') import('./components/common/dataPreView/index')
) )
//详情中转页面
const AllDescribe = LazyLoad(() =>
import('./components/AllDescribe/index')
)
const MediaPreview = LazyLoad(() => const MediaPreview = LazyLoad(() =>
import('./common/preview/preview') import('./common/preview/preview')
...@@ -342,6 +346,8 @@ class AppRouter extends React.Component { ...@@ -342,6 +346,8 @@ class AppRouter extends React.Component {
<Route path="/*/*/dataView" component={DataPreView} /> <Route path="/*/*/dataView" component={DataPreView} />
<Route path="/*/*/mediapreview" component={MediaPreview} /> <Route path="/*/*/mediapreview" component={MediaPreview} />
{/* 详情中转页面 AllDescribe*/}
<Route path="/*/*/allDescribe" component={AllDescribe} />
{/*empty*/} {/*empty*/}
<Route path="/*/*/empty" component={Empty} /> <Route path="/*/*/empty" component={Empty} />
......
src/static/icon/demo_index 2.html deleted 100644 → 0
This source diff could not be displayed because it is too large. You can view the blob instead.
src/util/urlconfig.js
...@@ -441,5 +441,7 @@ const url = { ...@@ -441,5 +441,7 @@ const url = {
practiceStartSave: `${baseUrl}${CHATPRACTICE}student/chat/start/practice/save`, //陪练开始,新增一条陪练记录 practiceStartSave: `${baseUrl}${CHATPRACTICE}student/chat/start/practice/save`, //陪练开始,新增一条陪练记录
practiceChatEnd: `${baseUrl}${CHATPRACTICE}student/chat/end/save`, //陪练，获取结果评分 practiceChatEnd: `${baseUrl}${CHATPRACTICE}student/chat/end/save`, //陪练，获取结果评分
practiceTabIndex: `${baseUrl}${CHATPRACTICE}student/practice/list/tab/index/get`, //陪练列表，默认显示哪个tab(未开始,进行中,已结束) practiceTabIndex: `${baseUrl}${CHATPRACTICE}student/practice/list/tab/index/get`, //陪练列表，默认显示哪个tab(未开始,进行中,已结束)
//进入详情页面
allDescribeUrl:`${baseUrl}${WEBSTUDENT}api/research/details`,
}; };
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