Commit 2b03989c by yanglang123

首页活动

parent 7139b9a3
......@@ -25,6 +25,7 @@
"react-html5video": "^2.5.1",
"react-infinite-scroller": "^1.2.4",
"react-photo-view": "^0.5.2",
"react-player": "^2.16.0",
"react-redux": "^4.4.6",
"react-router": "^3.2.6",
"react-router-redux": "^4.0.7",
......@@ -85,7 +86,6 @@
"svg-sprite-loader": "^0.3.1",
"terser-webpack-plugin": "^2.2.1",
"thread-loader": "^2.1.3",
"url-loader": "^0.5.9",
"video-react": "^0.11.2",
"webpack": "^4.44.2",
"webpack-bundle-analyzer": "^2.8.1",
......
......@@ -446,7 +446,6 @@ class App extends React.Component {
let companyCode = location.hash.split("/")[1];
let siteCode = location.hash.split("/")[2];
console.log(this.state.selectedTab, companyCode, siteCode, location, '当前选定tab');
let { showTab, tabInfo } = this.state;
// if (this.props.showInfo.portalBlockList) {
// this.props.showInfo.portalBlockList.map((rowData) => {
......
.singleLineOverflow {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
word-break: break-all;
}
.carousel-index-container {
position: relative;
overflow: hidden;
}
.carousel-index-container .slider-decorator-0 {
bottom: 15px!important;
}
.carousel-index-container .my-index-carousel {
background-color: #f5f5f5;
}
.carousel-index-container .slider-frame {
height: auto;
}
.my-index-carousel .am-carousel-wrap {
text-align: right;
padding-right: 50px;
}
.my-index-carousel .am-carousel-wrap-dot > span {
width: 16px;
height: 16px;
background: #fff;
opacity: 0.45;
}
.my-index-carousel .am-carousel-wrap-dot-active > span {
background: #fff;
opacity: 1;
width: 32px;
border-radius: 16px;
}
@import "../../../static/theme.less";
.carousel-index-container {
position: relative;
padding: 0 30px;
overflow: hidden;
.slider-decorator-0{
bottom: 15px!important;
......
import * as actions from './MyExamReduxType';
import Network from '../../util/fetchUtil';
import API from '../../util/urlconfig';
export const myExamList=(params, isUpData)=>{
return dispatch=>{
Network.post(API.myExamListLink, params,
response=>{
import * as actions from "./MyExamReduxType";
import Network from "../../util/fetchUtil";
import excute from '../../util/fetchUtil';
import API from "../../util/urlconfig";
export const myExamList = (params, isUpData) => {
return (dispatch) => {
Network.post(API.myExamListLink, params, (response) => {
try {
if(Number.parseInt(response.code)===1000){
if(Number.parseInt(params.state)===0){
//未开始
let offPageNumber=Number.parseInt(response.page.pageNo)+1;
let isOffMore=JSON.stringify(response.data)==='[]' || response.data.length<params.pageSize;
dispatch({
type:actions.MY_EXAMS_LIST_OFF,
offExamList:response.data,
offPageNumber:offPageNumber,
isOffMore:isOffMore,
isUpData:isUpData
});
}else if(Number.parseInt(params.state)===1){
//进行中
console.log("我的考试1");
console.log(response);
let inPageNumber=Number.parseInt(response.page.pageNo)+1;
let isInMore=JSON.stringify(response.data)==='[]' || response.data.length<params.pageSize;
if (Number.parseInt(response.code) === 1000) {
let inPageNumber = Number.parseInt(response.page.pageNo) + 1;
let isInMore =
JSON.stringify(response.data) === "[]" ||
response.data.length < params.pageSize;
dispatch({
type:actions.MY_EXAMS_LIST_IN,
inExamList:response.data,
inPageNumber:inPageNumber,
isInMore:isInMore,
isUpData:isUpData
type: actions.MY_EXAMS_LIST_IN,
inExamList: response.data,
inPageNumber: inPageNumber,
isInMore: isInMore,
isUpData: isUpData,
});
}else if(Number.parseInt(params.state)===2){
//己完成
console.log("我的考试2");
console.log(response);
let fulPageNumber=Number.parseInt(response.page.pageNo)+1;
let isFulMore=JSON.stringify(response.data)==='[]'|| response.data.length<params.pageSize;
dispatch({
type:actions.MY_EXAMS_LIST_DONE,
doneExamList:response.data,
fulPageNumber:fulPageNumber,
isFulMore:isFulMore,
isUpData:isUpData
} else {
console.log(response.code);
}
} catch (e) {
console.log(e);
}
});
}else if(Number.parseInt(params.state)===3){
//己完成
console.log("我的考试3");
let diePageNumber=Number.parseInt(response.page.pageNo)+1;
let isDieMore=JSON.stringify(response.data)==='[]'|| response.data.length<params.pageSize;
};
};
export const myTrainingList = (params, isUpData) => {
return (dispatch) => {
Network.post(API.trainList, params, (response) => {
try {
if (Number.parseInt(response.code) === 1000) {
//未开始
let offPageNumber = Number.parseInt(response.page.pageNo) + 1;
let isOffMore =
JSON.stringify(response.data) === "[]" ||
response.data.length < params.pageSize;
dispatch({
type:actions.MY_EXAMS_LIST_DIE,
dieExamList:response.data,
diePageNumber:diePageNumber,
isDieMore:isDieMore,
isUpData:isUpData
type: actions.MY_EXAMS_LIST_OFF,
offExamList: response.data.records,
offPageNumber: offPageNumber,
isOffMore: isOffMore,
isUpData: isUpData,
});
}
}else{
} else {
console.log(response.code);
}
} catch (e){
} catch (e) {
console.log(e);
}
})
});
};
};
export function myBannerList(callback) {
return (dispatch) => {
return excute.post(
API.banner,
{
bannerName: "TRAIN_EXAM",
terminalName: "WECHAT",
},
(response) => {
if (callback) {
callback(response.data);
}
}
);
};
}
import * as actions from './MyExamReduxType';
const initial={
offExamList:[],
inExamList:[],
doneExamList:[],
dieExamList:[],
isInMore:false,
isInFirst:true,
isOffMore:false,
isOffFirst:true,
offPageNumber:1,
inPageNumber:1,
fulPageNumber:1,
diePageNumber:1,
isFulMore:false,
isFulFirst:true,
isDieMore:false,
isDieFirst:true,
import * as actions from "./MyExamReduxType";
const initial = {
offExamList: [],
inExamList: [],
doneExamList: [],
dieExamList: [],
bannerList: [],
isInMore: false,
isInFirst: true,
isOffMore: false,
isOffFirst: true,
offPageNumber: 1,
inPageNumber: 1,
fulPageNumber: 1,
diePageNumber: 1,
isFulMore: false,
isFulFirst: true,
isDieMore: false,
isDieFirst: true,
};
export default (state=initial, action)=>{
switch (action.type){
export default (state = initial, action) => {
switch (action.type) {
case actions.MY_EXAMS_LIST_OFF:
let offExamList=null;
if(!action.isUpData){
offExamList=action.offExamList;
}else{
offExamList=state.offExamList.concat(action.offExamList);
let offExamList = null;
if (!action.isUpData) {
offExamList = action.offExamList;
} else {
offExamList = state.offExamList.concat(action.offExamList);
}
return {
...state,
offExamList:offExamList,
offPageNumber:action.offPageNumber,
isOffMore:action.isOffMore,
isOffFirst:false,
offExamList: offExamList,
offPageNumber: action.offPageNumber,
isOffMore: action.isOffMore,
isOffFirst: false,
};
case actions.MY_EXAMS_LIST_IN:
let inExamList=null;
if(!action.isUpData){
inExamList=action.inExamList;
}else{
inExamList=state.inExamList.concat(action.inExamList);
let inExamList = null;
if (!action.isUpData) {
inExamList = action.inExamList;
} else {
inExamList = state.inExamList.concat(action.inExamList);
}
return {
...state,
inExamList:inExamList,
inPageNumber:action.inPageNumber,
isInMore:action.isInMore,
isInFirst:false,
inExamList: inExamList,
inPageNumber: action.inPageNumber,
isInMore: action.isInMore,
isInFirst: false,
};
case actions.MY_EXAMS_LIST_DONE:
let doneExamList=null;
if(!action.isUpData){
doneExamList=action.doneExamList;
}else{
doneExamList=state.doneExamList.concat(action.doneExamList);
let doneExamList = null;
if (!action.isUpData) {
doneExamList = action.doneExamList;
} else {
doneExamList = state.doneExamList.concat(action.doneExamList);
}
return {
...state,
doneExamList:doneExamList,
fulPageNumber:action.fulPageNumber,
isFulMore:action.isFulMore,
isFulFirst:false,
doneExamList: doneExamList,
fulPageNumber: action.fulPageNumber,
isFulMore: action.isFulMore,
isFulFirst: false,
};
case actions.MY_EXAMS_LIST_DIE:
let dieExamList=null;
if(!action.isUpData){
dieExamList=action.dieExamList;
}else{
dieExamList=state.dieExamList.concat(action.dieExamList);
let dieExamList = null;
if (!action.isUpData) {
dieExamList = action.dieExamList;
} else {
dieExamList = state.dieExamList.concat(action.dieExamList);
}
return {
...state,
dieExamList:dieExamList,
diePageNumber:action.diePageNumber,
isDieMore:action.isDieMore,
isDieFirst:false,
dieExamList: dieExamList,
diePageNumber: action.diePageNumber,
isDieMore: action.isDieMore,
isDieFirst: false,
};
default :
case actions.MY_TRAINING_BANNER:
return {
bannerList: bannerList,
};
default:
return state;
}
}
};
// 我的考试列表 - 未开始
export const MY_EXAMS_LIST_OFF="MY_EXAMS_LIST_OFF";
//培训header banner图
export const MY_TRAINING_BANNER="MY_TRAINING_BANNER";
// 我的考试列表 - 处理中
export const MY_EXAMS_LIST_IN="MY_EXAMS_LIST_IN";
......
.singleLineOverflow {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
word-break: break-all;
}
.am-list-header {
padding: 0 !important;
}
.load-more {
border: 0;
width: 100%;
height: 0.7rem;
background-color: #f6f6f6;
color: #999;
font-size: 0.26rem;
line-height: 0.7rem;
text-align: center;
}
.tab-box {
width: 100%;
height: 100%;
}
.tab-header-box {
height: 46px;
overflow: hidden;
}
.separator-box {
height: 0.2rem;
overflow: hidden;
}
.list-view-box {
padding-top: 0.2rem;
background-color: #f6f6f6;
}
.exam-item-box {
padding: 0 0.2rem;
overflow: hidden;
}
.examItem {
width: 100%;
background: #fff;
border-radius: 0.08rem;
border-radius: 0.2rem;
padding: 0.4rem 0.3rem;
position: relative;
}
.examItem .exam-title {
color: #000000;
font-size: 0.4rem;
line-height: 0.4rem;
margin-bottom: 0.2rem;
}
.examItem .exam-project {
color: #9b9b9b;
font-size: 0.24rem;
line-height: 0.28rem;
}
.examItem .exam-time {
color: #9b9b9b;
font-size: 0.32rem;
line-height: 0.28rem;
margin-bottom: 0.5rem;
}
.examItem .exam-tag {
position: absolute;
top: 0;
left: 0;
font-size: 0.2rem;
text-align: center;
border-top-left-radius: 0.14rem;
border-bottom-right-radius: 0.14rem;
color: #fff;
padding: 0 0.2rem;
}
.examItem .no {
background: #fe3824;
}
.examItem .yes {
background: #47d5b5;
}
.examItem .ing {
background: #e48600;
}
.examItem .exam-statu-icon {
width: 1.6rem;
height: 0.56rem;
padding: 0.04rem;
text-align: center;
background: rgba(253, 63, 52, 0.05);
border: 1px solid #f3ab9f;
border-radius: 45px;
color: #e6624a;
font-size: 0.3rem;
}
.examItem .exam-statu-icon1 {
width: 1.6rem;
height: 0.56rem;
padding: 0.04rem;
text-align: center;
background: linear-gradient(90deg, #ff8058, #ffb865 100%);
border-radius: 45px;
color: #fff;
font-size: 0.3rem;
}
.examItem .exam-statu-icon2 {
width: 1.6rem;
height: 0.56rem;
padding: 0.04rem;
text-align: center;
background: #cbeecd;
border: 1px solid #cbeecd;
border-radius: 45px;
color: #53af5c;
font-size: 0.3rem;
}
.examItem .exam-score {
margin-left: 0.1rem;
font-size: 0.36rem;
color: #53AF5C;
}
.examItem .exam-score1 {
margin-left: 0.1rem;
font-size: 0.36rem;
color: #FC7A43;
}
.top-search-div {
width: 100%;
height: 44px;
padding: 5px 20px;
background-color: #fff;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
.top-search-div .top-search-btn {
width: 100%;
height: 100%;
background-color: #f6f6f6;
border-radius: 1rem;
border: 0;
}
@import "../less/config";
.am-list-header{
padding:0 !important;
.am-list-header {
padding: 0 !important;
}
.load-more{
border:0;
width:100%;
height:0.7rem;
background-color:#f6f6f6;
color:#999;
font-size:0.26rem;
line-height:0.7rem;
text-align:center;
.load-more {
border: 0;
width: 100%;
height: 0.7rem;
background-color: #f6f6f6;
color: #999;
font-size: 0.26rem;
line-height: 0.7rem;
text-align: center;
}
.tab-box{
width:100%;
height:100%;
.tab-box {
width: 100%;
height: 100%;
}
.tab-header-box{
height:46px;
overflow:hidden;
.tab-header-box {
height: 46px;
overflow: hidden;
}
.separator-box{
height:0.2rem;
overflow:hidden;
.separator-box {
height: 0.2rem;
overflow: hidden;
}
.list-view-box{
padding-top:0.2rem;
.list-view-box {
padding-top: 0.2rem;
background-color: #f6f6f6;
}
.exam-item-box{
padding:0 0.2rem;
overflow:hidden;
.exam-item-box {
padding: 0 0.2rem;
overflow: hidden;
}
.examItem {
width: 100%;
background: #fff;
border-radius:4*@len;
border-radius:0.2rem;
padding:0.4rem 0.3rem;
position:relative;
border-radius: 4 * @len;
border-radius: 0.2rem;
padding: 0.4rem 0.3rem;
position: relative;
.exam-title {
color: #505050;
font-size: 17*@len;
line-height: 20*@len;
padding-bottom:0.5rem;
color: #000000;
font-size: 20 * @len;
line-height: 20 * @len;
margin-bottom: 0.2rem;
}
.exam-project{
.exam-project {
color: #9b9b9b;
font-size: 12*@len;
line-height: 14*@len;
font-size: 12 * @len;
line-height: 14 * @len;
}
.exam-time{
.exam-time {
color: #9b9b9b;
font-size: 12*@len;
line-height: 14*@len;
font-size: 16 * @len;
line-height: 14 * @len;
margin-bottom: 0.5rem;
}
.exam-tag{
.exam-tag {
position: absolute;
top: 0; left: 0;
font-size: 10*@len;
top: 0;
left: 0;
font-size: 10 * @len;
text-align: center;
border-top-left-radius: 7*@len;
border-bottom-right-radius: 7*@len;
border-top-left-radius: 7 * @len;
border-bottom-right-radius: 7 * @len;
color: #fff;
padding:0 0.2rem;
padding: 0 0.2rem;
}
.no{
.no {
background: #fe3824;
}
.yes{
.yes {
background: #47d5b5;
}
.ing{
background:#e48600
.ing {
background: #e48600;
}
.exam-statu-icon {
width: 80 * @len;
height: 28 * @len;
padding: 0.04rem;
text-align: center;
background: rgba(253, 63, 52, 0.05);
border: 1px solid #f3ab9f;
border-radius: 45px;
color: #e6624a;
font-size: 15 * @len;
}
.exam-statu-icon1 {
width: 80 * @len;
height: 28 * @len;
padding: 0.04rem;
text-align: center;
background: linear-gradient(90deg, #ff8058, #ffb865 100%);
border-radius: 45px;
color: #fff;
font-size: 15 * @len;
}
.exam-statu-icon2 {
width: 80 * @len;
height: 28 * @len;
padding: 0.04rem;
text-align: center;
background: #cbeecd;
border: 1px solid #cbeecd;
border-radius: 45px;
color: #53af5c;
font-size: 15 * @len;
}
.exam-score {
margin-left: 5 * @len;
font-size: 18 * @len;
color: #53AF5C;
}
.exam-score1 {
margin-left: 5 * @len;
font-size: 18 * @len;
color: #FC7A43;
}
}
.top-search-div{
width:100%;
height:44px;
padding:5px 20px;
background-color:#fff;
.top-search-div {
width: 100%;
height: 44px;
padding: 5px 20px;
background-color: #fff;
display: flex;
flex-direction:row;
flex-direction: row;
justify-content: center;
align-items:center;
.top-search-btn{
width:100%;
height:100%;
background-color:#f6f6f6;
border-radius:1rem;
border:0;
align-items: center;
.top-search-btn {
width: 100%;
height: 100%;
background-color: #f6f6f6;
border-radius: 1rem;
border: 0;
}
}
.myExamBody .am-list-body::before {
height: 0 !important;
}
.myExamBody .am-list-body::after {
height: 0 !important;
}
.list-view-header {
width: 96%;
margin: 0 auto;
margin-bottom: 20px;
}
.list-view-header .list-view-bg {
width: 100%;
height: 4rem;
}
.list-view-header h3 {
color: #4a4a4a;
margin: 15px 0;
}
.list-view-header .list-view-header-cont {
display: flex;
align-items: center;
}
.list-view-header .list-view-header-cont img {
width: 28px;
height: 28px;
}
.list-view-header .list-view-header-cont p {
font-size: 30px;
margin-right: 20px;
}
......@@ -7,3 +7,28 @@
height: 0 !important;
}
}
.list-view-header{
width:96%;
margin: 0 auto;
margin-bottom: 20px;
.list-view-bg{
width: 100%;
height: 4rem;
}
h3{
color:#4a4a4a;
margin: 15px 0;
}
.list-view-header-cont{
display: flex;
align-items: center;
img{
width: 28px;
height: 28px;
}
p{
font-size: 30px;
margin-right: 20px;
}
}
}
\ No newline at end of file
......@@ -54,7 +54,7 @@ class IndexBtnScroll extends Component {
<div
className="index-btn-scroll-item-container"
id="index-simple-scroll-bar-id"
autoHide={false}
// autoHide={false}
>
<div
className="index-btn-scroll-single-wrap-container"
......
......@@ -56,9 +56,9 @@
align-items: center;
}
.login .login-container .login-form .login-form-item .login-form-top-logo .login-input-top-icon {
width: 160px;
height: 160px;
margin-bottom: 20px;
width: 120px;
height: 120px;
margin-bottom: 60px;
}
.login .login-container .login-form .login-form-item .login-form-top-logo .login-input-top-font {
color: #F5222D;
......@@ -69,7 +69,8 @@
border-radius: 12px;
}
.login .login-container .login-form .login-form-item .login-form-input-container .login-form-single-label {
font-size: 36px ;
font-size: 36px;
font-weight: bold;
}
.login .login-container .login-form .login-form-item .login-form-input-container .login-form-single-container {
width: 100%;
......
......@@ -254,12 +254,13 @@ class Login extends Component {
</div>
<div style={{ bottom: '60px',
fontSize: '21px',
fontSize: '26px',
position: 'fixed',
textAlign: 'center',
zIndex:99999,
width: '100%'}}>
备案号:<a href="https://beian.miit.gov.cn" target="_blank" rel="noopener" >沪ICP备11042121号-5</a>
width: '100%',
color:'#fff'}}>
机电信息保障部
</div>
</div>
);
......
......@@ -47,9 +47,9 @@
justify-content: center;
align-items: center;
.login-input-top-icon{
width: 160px;
height: 160px;
margin-bottom: 20px;
width: 120px;
height: 120px;
margin-bottom: 60px;
}
.login-input-top-font{
color:#F5222D;
......@@ -60,7 +60,8 @@
width: 100%;
border-radius: 12px;
.login-form-single-label{
font-size:36px ;
font-size:36px;
font-weight: bold;
}
.login-form-single-container{
width: 100%;
......
......@@ -396,7 +396,7 @@ class Menulearn extends React.Component {
display: "inline-block",
width: "9px",
height: "34px",
backgroundColor: "#FC5B2B",
background: 'linear-gradient(180deg,#fe742b, #fc5b2b 100%)',
marginLeft: "4%",
marginRight: "1%",
}}
......
......@@ -280,13 +280,13 @@ class Menume extends React.Component {
return
}
this.props.getMyStudyInfo2(param, (res) => {
this.setState({
myStudyInfo2: res.data,
currentParam: param,
PickerView: false,
})
});
// this.props.getMyStudyInfo2(param, (res) => {
// this.setState({
// myStudyInfo2: res.data,
// currentParam: param,
// PickerView: false,
// })
// });
}
numFormat = (num) => {
let newNum = num;
......
import Network from '../../util/fetchUtil';
import excute from '../../util/fetchUtil';
import API from '../../util/urlconfig';
import * as actions from "./TrainReduxTypes";
export const trainTabData=(params)=>{
return dispatch=>{
Network.post(API.banner, params,
response => {
export const getActiveList = (data,callback) => {
return dispatch => {
excute.get(API.activeList + '?bizType=1',
(res) => {
if (String(res.code) == "1000") {
dispatch({
type: actions.TRAIN_PAGE_DATA_EVENTS,
bannerList: response.data
});
type: actions.TRAIN_ACTIVE_LIST,
activityType: res.data.activityType,
theDay:res.data.theDay
})
if (callback) {
callback();
}
);
}
};
//火热报名中.....
export const hotEnrollData=(params)=>{
return dispatch=>{
Network.post(API.hotEnrolling, params,
response=>{
dispatch({
type:actions.HOT_ENROLL_DATA_EVENT,
hotEnroll:response.data.records
})
}
)
}
};
//培训列表
export const trainListData=(params, isUpData ,callBack)=>{
return dispatch=>{
export const trainListData = (params, callBack) => {
return dispatch => {
Network.post(API.trainList, params,
response=>{
let pageNo=Number.parseInt(response.data.current)+1;
let isMore=pageNo > response.data.pages?false:true;
response => {
let pageNo = Number.parseInt(response.data.current) + 1;
let isMore = pageNo > response.data.pages ? false : true;
dispatch({
type:actions.TRAIN_LIST_DATAS,
trainList:itemList(response.data.records),
isUpData:isUpData,
isMore:isMore,
pageNo:pageNo,
pageTotle:response.data.total,
type: actions.TRAIN_LIST_DATAS,
trainList: itemList(response.data.records),
isMore: isMore,
pageNo: pageNo,
pageTotle: response.data.total,
});
if(callBack){
if (callBack) {
callBack();
}
}
)
}
};
function itemList(item){
let newItem=[];
item.map(item=>{
function itemList(item) {
let newItem = [];
item.map(item => {
newItem.push({
image:item.logoImg,
text:item.name,
image: item.logoImg,
text: item.name,
people: item.joinNumber,
start:item.startTime,
end:item.endTime,
id:item.id,
finished:item.finished,
activitieNum:item.activitieNum,
period:item.period,
trainingDurationShow:item.trainingDurationShow,
enablePay:item.enablePay
start: item.startTime,
end: item.endTime,
id: item.id,
finished: item.finished,
activitieNum: item.activitieNum,
activityStateCode:item.activityStateCode,
period: item.period,
trainingDurationShow: item.trainingDurationShow,
enablePay: item.enablePay
})
});
return newItem;
}
//初始化
export const initialTrainReducer=()=>{
export const initialTrainReducer = () => {
return {
type:actions.INITIAL_TRAIN_REDUCER
type: actions.INITIAL_TRAIN_REDUCER
}
}
\ No newline at end of file
......@@ -3,6 +3,8 @@ const initial={
bannerList:[],
trainList:[],
hotEnroll:[],
activityType:[],
theDay:[],
pageNo:1,
isMore:false,
pageTotle:0,
......@@ -19,14 +21,14 @@ export default (state=initial, action)=>{
...state,
hotEnroll:action.hotEnroll
};
case actions.TRAIN_ACTIVE_LIST:
return {
activityType:action.activityType,
theDay:action.theDay
};
case actions.TRAIN_LIST_DATAS:
let dataList=[];
dataList=action.trainList
return {
...state,
trainList:dataList,
trainList:action.trainList,
pageNo:action.pageNo,
isMore:action.isMore,
pageTotle:action.pageTotle
......
import React, { Component } from 'react';
import './style/index.less';
import { Icon } from 'antd';
import intl from "react-intl-universal";
export default class CalendarHeader extends Component {
constructor(props) {
super(props);
this.state = {
monthArr: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]
}
}
render() {
let { month, currentMonth, year } = this.props;
const { monthArr } = this.state;
let preDisabled = month == currentMonth + 1 || (month == 1 && currentMonth == 12);
let monthStr = intl.get(monthArr[month - 1])
return (
<div className="calendarHeader">
<div className="monthTitle">
{year}{intl.get('year')}{monthStr}
</div>
<div className="leftArrow">
<Icon type="left" className={preDisabled ? "prevBtn" : "prevBtn disabled"} onClick={this.props.prevMonth} />
</div>
<div>
<Icon type="right" className={month == currentMonth ? "nextBtn" : "nextBtn disabled"} onClick={this.props.nextMonth} />
</div>
</div>
)
}
}
import React from "react";
// import {PanResponder} from 'react-native';
import "./style/index.less";
import $ from "jquery";
// import {Motion, spring, presets} from 'react-motion'
import intl from "react-intl-universal";
class CalenderMain extends React.Component {
constructor(props) {
super(props);
this.state = {
current_day:
this.props.year + "" + this.props.month + "" + this.props.day,
week_names: [
intl.get("Sunday"),
intl.get("One"),
intl.get("Two"),
intl.get("Three"),
intl.get("Four"),
intl.get("Five"),
intl.get("Six"),
],
current_rowIndex: "row_" + this.getCurrentRowIndex(),
};
}
//当调用者的state发生改变时
componentWillReceiveProps() {}
//获取当前月显示数据
getCurrentMonth = () => {
let view_data = this.props.viewData;
let current_month_data = view_data.months[this.props.month - 1].days;
let rowsInMonth = [];
current_month_data.forEach((day, index) => {
if (index % 7 === 0) {
rowsInMonth.push(current_month_data.slice(index, index + 7));
}
});
let currentMonth = this.props.year + "_" + this.props.month;
let currentTaskList = this.props.taskList
? this.props.taskList[currentMonth]
: null;
if (currentTaskList) {
rowsInMonth.map((list, index) => {
if (list.length) {
list.map((data) => {
if (currentTaskList[data.All_date] > 0) {
data.hasTask = true;
}
});
}
});
}
return rowsInMonth;
};
//获取当前日期在第几行
getCurrentRowIndex = () => {
let current_month_data = this.getCurrentMonth();
for (let [index, data] of current_month_data.entries()) {
for (let value of data) {
if (value.day === this.props.day && value.month === this.props.month) {
return index;
}
}
}
};
//选择日期
onDatePickListener = (data, rowindex, evn) => {
evn.preventDefault();
if (this.props.isLoading) {
return;
}
let days = data.year + "" + data.month + "" + data.day;
if (this.checkDateStatus(data)) {
this.props.onDatePickListener(data.day);
if (data.isHaveData) {
this.props.onChangeDateListener(data);
}
this.setState({
current_day: days,
current_rowIndex: rowindex,
});
this.props.onChangeDateListener(data);
}
};
//星期标题
_renderWeekHeader = () => {
return (
<div className="calendar_header_row" ref="header">
{this.state.week_names.map((name, index) => {
return (
<div className="calendar_box" key={index}>
{name}
</div>
);
})}
</div>
);
};
componentDidMount() {}
//其他日期的效果
_renderViewItem = (data) => {
let showFlag =
data.hasTask &&
(data.month != this.props.defaultDate.getMonth() + 1 ||
data.day >= this.props.defaultDate.getDate())
? true
: false;
if (data.isGetReport) {
return (
<div
style={{
backgroundImage: `url('${getImg("birthday_icon")}')`,
backgroundSize: "contain",
}}
className="calendar_box_hava_data"
>
<span style={{ color: "#fff" }}>{data.day}</span>
</div>
);
}
switch (data.flag) {
//不可以修改
case 1:
if (data.isTodays) {
return <div className="calendar_box_click_red">{data.day}</div>;
} else {
return (
<div
style={{
backgroundImage: `url('${getImg("hava_data")}')`,
backgroundSize: "contain",
}}
className="calendar_box_hava_data"
></div>
);
}
case 2:
if (data.isTodays) {
return <div className="calendar_box_click_red">{data.day}</div>;
} else {
return <div className="calendar_box_other_gray">{data.day}</div>;
}
//显示补
case 3:
case 4:
case 6:
case 7:
return (
<div
style={{
backgroundImage: `url('${getImg("no_hava_data")}')`,
backgroundSize: "contain",
}}
className="calendar_box_hava_data"
></div>
);
//显示对勾
case 5:
case 8:
return (
<div
style={{
backgroundImage: `url('${getImg("hava_data")}')`,
backgroundSize: "contain",
}}
className="calendar_box_hava_data"
></div>
);
//显示未来
case 9:
return <div className="calendar_box_furture">{data.day}</div>;
default:
if (data.isTodays) {
return (
<div className="calendar_box_click_blue_two calendar_box_item">
{data.day}
{data.hasTask ? <span className="calendar_today_pot"></span> : ""}
</div>
);
} else {
return (
<div
className={
this.checkDateStatus(data)
? "calendar_box_other_gray calendar_box_item"
: "calendar_box_other_disabled calendar_box_item"
}
>
{data.day}
{showFlag ? <span className="calendar_pot"></span> : ""}
</div>
);
}
}
};
checkDateStatus = (data) => {
var nowMonth = this.props.defaultDate.getMonth() + 1;
var nowDay = this.props.defaultDate.getDate();
var flag = false;
if (nowMonth == data.month) {
if (data.day >= nowDay) {
flag = true;
} else {
if ((nowMonth == 12 && data.month == 1) || nowMonth + 1 == data.month) {
flag = true;
} else {
flag = false;
}
}
} else {
if ((nowMonth == 12 && data.month == 1) || nowMonth + 1 == data.month) {
flag = true;
} else {
flag = false;
}
}
return flag;
};
_renderViewCurrentDay = (data) => {
if (
this.state.current_day ===
data.year + "" + data.month + "" + data.day
) {
if (data.isTodays) {
return (
<div className="calendar_box_click_red calendar_box_item">
{data.day}
{data.hasTask ? <span className="calendar_today_pot"></span> : ""}
</div>
);
}
switch (data.flag) {
case 3:
case 4:
case 6:
case 7:
return (
<div className="calendar_box_click_red calendar_box_item">
{data.day}
</div>
);
default:
return (
<div className="calendar_box_click_blue calendar_box_item">
{data.day}
{data.hasTask ? <span className="calendar_pot"></span> : ""}
</div>
);
}
} else {
return this._renderViewItem(data);
}
};
_renderMain = () => {
let current_month_data = this.getCurrentMonth();
return (
<div className="main">
<div className="mainContainer" ref="main">
{current_month_data.map((row, rowindex) => {
return (
<div
key={rowindex}
className="calendar_box_row"
ref={"row_" + rowindex}
>
{row.map((data, index) => {
return (
<div
className={
data.isCurrentMonth && !data._isFutureTime
? "calendar_box_current_month"
: "calendar_box_other_month"
}
key={data.All_date}
onClick={this.onDatePickListener.bind(
this,
data,
"row_" + rowindex
)}
>
{this._renderViewCurrentDay(data)}
</div>
);
})}
</div>
);
})}
</div>
</div>
);
};
render() {
let view_data = this.props.viewData;
return <div className="calendar_layout">{this._renderMain()}</div>;
}
}
export default CalenderMain;
/**
* 年的对象
* @param year
* @returns {{year: *, months: Array}}
*/
const getYearInstance = (year) => {
return { year, months: [] }
}
/**
*
* @param month 月
* @param year 年
* @returns {{month: *, days: Array}}
*/
const getMonthInstance = (month, year) => {
return { month, year, days: [] };
}
/**
* 日对象
* @param day 日
* @param month 月 已加1
* @param year 年
* @param timestamp 时间戳
* @param isCurrentMonth 是否是当前月,只有当前月份的日期可以点击
* @parm flag -1 默认值
* @returns {{day: *, month: *, year: *, week: number, isOnClick: boolean}}
*/
const getDayInstance = (day, month, year, isCurrentMonth = false, isPost = false) => {
year = getYear(month, year);
month = getMonth(month);
let date = new Date();
let hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
let minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
let second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
let time = " " + hour + ":" + minute + ":" + second;
let current_date = year + '-' + month + '-' + day;
let current_timestamp = parseInt(getTimestamp(current_date + time, 1));
let timestamp = parseInt(getTimestamp(current_date, 1));
let start_timestamp = parseInt(getTimestamp(current_date + " 00:00:00", 1));
let end_timestamp = parseInt(getTimestamp(current_date + " 23:59:59", 1));
let week = new Date(year, month, day).getDay();
let months = month;
let days = day;
let flag = -1;
let _isFutureTime = isFutureTime(timestamp);
let isTodays = isToday(year, month, day);
let hasTask = false;
if (month < 10) {
months = '0' + month;
}
if (day < 10) {
days = '0' + day;
}
let All_date = year + '-' + months + '-' + days;
return { day, month, year, week, current_timestamp, timestamp, start_timestamp, end_timestamp, isCurrentMonth, All_date, isPost, flag, isTodays, _isFutureTime, hasTask };
}
//获取month
const getMonth = (month) => {
if (month == 0) {
return 12;
} else if (month == 13) {
return 1;
}
return month;
}
//获取year
const getYear = (month, year) => {
if (month == 0) {
return --year;
} else if (month == 13) {
return ++year;
}
return year;
}
//获取一年的数据
export const displayDaysPerMonth = (year) => {
//定义每个月的天数,如果是闰年第二月改为29天
let daysInMonth = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
if ((year % 4 === 0 && year % 100 !== 0) || year % 400 === 0) {
daysInMonth[1] = 29
}
let daysInPreviousMonth = [].concat(daysInMonth);
daysInPreviousMonth.unshift(daysInPreviousMonth.pop());
//获取每一个月显示数据中需要补足上个月的天数
let addDaysFromPreMonth = new Array(12)
.fill(null)
.map((item, index) => {
let day = new Date(year, index, 1).getDay();
if (day === 0) {
return 7
} else {
return day
}
});
let year_bean = getYearInstance(year);
for (let monthIndex = 0; monthIndex < 12; monthIndex++) {
let addDays = addDaysFromPreMonth[monthIndex],
daysCount = daysInMonth[monthIndex],
daysCountPrevious = daysInPreviousMonth[monthIndex],
monthData = [];
//定义当前月的对象,以保存当前月中日的数据
let month_bean = getMonthInstance(monthIndex + 1, year);
//添加上个月补齐的数据
for (; addDays > 0; addDays--) {
let day_bean = getDayInstance(daysCountPrevious--, monthIndex, year, false);
monthData.unshift(day_bean)
}
//添加当月的数据
for (let i = 1; i <= daysCount; i++) {
let day_bean = getDayInstance(i, monthIndex + 1, year, true);
monthData.push(day_bean)
}
//补足下一个月
for (let i = 42 - monthData.length, j = 0; j < i;) {
let day_bean = getDayInstance(++j, monthIndex + 2, year, false);
monthData.push(day_bean)
}
month_bean.days.push(...monthData);
year_bean.months.push(month_bean);
}
return year_bean;
}
/**
* 切换月份的日期切换,month和year是切换前的
* @param month
* @param year
* @param isNext true 下一个月 false 上一个月
*/
export const changeMonthToDate = (year, month, day, isNext = false) => {
if (isNext) {
if (month === 12) {
month = 1;
year++;
} else {
month++;
}
} else {
if (month === 1) {
month = 12;
year--;
} else {
month--;
}
}
day = handleDay(day, month, year);
return getDayInstance(day, month, year);
}
/**
* 获取当前数据
* @param year
* @param month
* @param day
* @returns {{year: *, month: *, day: *, timestamp: Number}}
*/
export const getCurrentData = (year, month, day) => {
return getDayInstance(day, month, year);
}
/**
*
* @param day
* @param oldMonth 切换前的月
* @param newMonth 切换后的月
* @param year 切换后的年
* @returns {*}
*/
export const handleDay = (day, newMonth, year) => {
let daysInMonth = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
if ((year % 4 === 0 && year % 100 !== 0) || year % 400 === 0) {
daysInMonth[1] = 29
}
if (daysInMonth.indexOf(day) !== -1) {
day = daysInMonth[--newMonth];
}
return day;
}
//是否是今天
export const isToday = (year, month, day) => {
let all_date = year + '-' + month + '-' + day;
let todaysDate = new Date();
let years = todaysDate.getFullYear();
let months = todaysDate.getMonth() + 1;
let days = todaysDate.getDate();
let all_dates = years + '-' + months + '-' + days;
return all_dates === all_date;
}
//是否是同一天
export const isToday_V2 = (all_date, date) => {
let _date = date.toString().replace(/-/g, "/");
_date = new Date(_date);
let years = _date.getFullYear();
let months = _date.getMonth() + 1;
let days = _date.getDate();
let all_dates = years + '' + months + '' + days;
return all_date === all_dates;
}
//判断时间是否是未来
export const isFutureTime = (timestamp) => {
return timestamp > getTimestamp();
}
export const getDate = (timestamp) => {
let todaysDate = new Date(timestamp);
return todaysDate
}
export const getTimestamp = (date) => {
if (date) {
return date.valueOf();
} else {
return new Date().valueOf();
}
}
\ No newline at end of file
/**
* 1.建立数据
* 2.render
* 3.提供接口
*/
import React, { Component } from 'react';
import CalenderMain from './CalenderMain';
import './style/index.less'
import { displayDaysPerMonth, changeMonthToDate, getCurrentData, getDate, getTimestamp } from './DayUtils';
class TaskCalendar extends Component {
constructor(props) {
super(props)
const default_date = getDate(this.props.timestamp);
this.state = {
defaultDate: default_date,
year: default_date.getFullYear(),
month: default_date.getMonth() + 1,
day: default_date.getDate(),
viewData: this.props.viewData ? this.props.viewData : displayDaysPerMonth(default_date.getFullYear()),
up_img_url: 'up_month',
}
}
//当调用者的state发生改变时
componentWillReceiveProps(nextProps) {
if (nextProps.default_date) {
const default_date = getDate(getTimestamp(nextProps.default_date));
this.setState({
year: default_date.getFullYear(),
month: default_date.getMonth() + 1,
day: default_date.getDate(),
});
}
//判断是否有购买日期,如果有,则获取购买日期的年和月,在购买日期之前的按钮是不可以切换的
if (nextProps.purchasing_date) {
let purchasing_date = nextProps.purchasing_date;
purchasing_date = getDate(getTimestamp(purchasing_date));
let month = purchasing_date.getMonth() + 1;
let year = purchasing_date.getFullYear();
if (year === this.state.year && month === (this.state.month)) {
this.setState({ up_img_url: 'up_month_gray' });
} else {
this.setState({ up_img_url: 'up_month' });
}
}
}
//初始化获取当前数据
componentDidMount() {
let data = getCurrentData(this.state.year, this.state.month, this.state.day);
this.onChangeDateListener(data);
}
//获取日历状态
getReportDailyStatus = (data) => {
// this.props.getReportDailyStatus(data,this.state.viewData);
}
//当时间发生改变时
onChangeDateListener = (data) => {
this.getReportDailyStatus(data);
let viewData = displayDaysPerMonth(data.year);
if (!this.props.taskList[data.year + "_" + data.month]) {
this.props.getCalendarTaskNum(new Date(data.year, data.month - 1).getTime());
}
this.setState({
year: data.year,
month: data.month,
day: data.day,
viewData: viewData
}, () => {
this.props.onChangeDateListener(data, this.state.viewData);
})
}
//切换到下一个月(只限当月和下一个月可翻页)
nextMonth = () => {
let { year, month, day, defaultDate } = this.state;
let currentMonth = defaultDate.getMonth() + 1;
if (month == currentMonth) {
let data = changeMonthToDate(year, month, day, true);
let viewData = displayDaysPerMonth(data.year);
this.setState({
year: data.year,
month: data.month,
day: data.day,
viewData: viewData
}, () => {
this.onChangeDateListener(data);
})
}
}
//切换到上一个月(只限当月和下一个月可翻页)
prevMonth = () => {
let { year, month, day, defaultDate } = this.state;
let currentMonth = defaultDate.getMonth() + 1;
if (month == currentMonth + 1 || (month == 1 && currentMonth == 12)) {
let data = changeMonthToDate(year, month, day, false);
if (data.day < defaultDate.getDate()) {
data.day = defaultDate.getDate()
}
let viewData = displayDaysPerMonth(data.year);
this.setState({
year: data.year,
month: data.month,
day: data.day,
viewData: viewData
}, () => {
this.onChangeDateListener(data);
})
}
}
//选择日期
onDatePickListener = (day) => {
this.setState({ day })
}
datePickerToggle = () => {
let row_data = ['row_0', 'row_1', 'row_2', 'row_3', 'row_4', 'row_5'];
//确定是在哪一行
for (let row of row_data) {
if (row !== this.state.current_rowIndex) {
this.refs[row].style.height = this.refs[row].style.height === '45px' ? '0px' : '45px';
}
}
if (this.state.current_status === 'bottom_arrow') {
this.setState({ current_status: 'top_arrow' });
} else {
this.setState({ current_status: 'bottom_arrow' });
}
}
render() {
let props = {
viewData: this.state.viewData
};
return (
<div className="calendarContainer">
<CalenderMain {...props}
ref='CalendarMain'
onDatePickListener={this.onDatePickListener.bind(this)}
onChangeDateListener={this.onChangeDateListener.bind(this)}
year={this.state.year}
month={this.state.month}
day={this.state.day}
viewData={this.state.viewData}
defaultDate={this.state.defaultDate}
prevMonth={this.prevMonth}
nextMonth={this.nextMonth}
taskList={this.props.taskList}
isLoading = {this.state.isLoading}
moveUp = {this.props.moveUp}
changeCalendarState ={this.props.changeCalendarState}
/>
</div>
);
}
}
export default TaskCalendar;
\ No newline at end of file
@import "../../../../static/theme.less";
.calendarContainer {
width: 100%;
height: 100%;
padding-left: 0.2rem;
padding-right: 0.2rem;
border-bottom: 1px solid rgba(229, 229, 229, 1);
.calendarHeader {
margin: 0.36rem auto;
// padding: 0.36rem 0;
width: 90%;
height: 0.5rem;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
.leftArrow {
position: absolute;
right: 150px;
}
.prevBtn {
height: 0.26rem;
color: @themeColor;
font-size: 0.36rem;
font-weight: 600;
line-height: 0.26rem;
}
.prevBtn.disabled {
color: #E3E3E3
}
.nextBtn {
height: 0.26rem;
color: @themeColor;
font-size: 0.36rem;
font-weight: 600;
line-height: 0.26rem;
}
.nextBtn.disabled {
color: #E3E3E3;
}
.monthTitle {
width: 2rem;
height: 0.5rem;
text-align: center;
font-size: 0.36rem;
font-weight: bold;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: rgba(51, 51, 51, 1);
line-height: 0.5rem;
}
}
}
.calendar_header_row {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-around;
}
.calendar_box {
height: 0.36rem;
font-size: 0.26rem;
font-family: AvenirNext-DemiBold, AvenirNext;
font-weight: 600;
color: rgba(152, 157, 179, 1);
line-height: 0.36rem;
}
.calendar_box_row {
width: 100%;
height: 1.04rem;
display: flex;
align-items: center;
justify-content: space-around;
}
.calendar_box_click_red {
// background: linear-gradient(135deg, rgba(115, 174, 252, 1) 0%, rgba(63, 117, 246, 1) 100%);
background: #4285F4;
color: rgba(255, 255, 255, 1);
border-radius: 50%;
}
.calendar_box_click_blue_two {
color: rgba(66, 133, 244, 1);
}
.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%;
}
.calendar_box_other_gray {
color: rgba(51, 51, 51, 1);
}
.calendar_box_other_disabled {
color: rgba(153, 153, 153, 1);
}
.calendar_today_pot {
display: block;
margin: 0.02rem auto;
width: 0.08rem;
height: 0.08rem;
background: rgba(66, 133, 244, 1);
border-radius: 50%;
}
.calendar_pot {
display: block;
margin: 0.02rem auto;
width: 0.08rem;
height: 0.08rem;
background: rgba(66, 133, 244, 1);
opacity: 0.5;
border-radius: 50%;
}
.calendar_box_item {
width: 0.64rem;
height: 0.64rem;
font-size: 0.28rem;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 600;
line-height: 0.64rem;
text-align: center;
margin: 0 auto;
cursor: pointer;
}
.calendar_bottom {
width: 100%;
padding-top: 0.2rem;
height: 0.46rem;
}
.calendar_bottom_line {
margin: 0rem auto;
width: 0.64rem;
height: 0.06rem;
background: rgba(218, 222, 240, 1);
border-radius: 2px;
}
\ No newline at end of file
......@@ -6,6 +6,7 @@ export const HOT_ENROLL_DATA_EVENT="HOT_ENROLL_DATA_EVENT";
export const TRAIN_LIST_DATAS="TRAIN_LIST_DATAS";
//初始化
export const INITIAL_TRAIN_REDUCER="INITIAL_TRAIN_REDUCER";
//活动list
export const TRAIN_ACTIVE_LIST="TRAIN_ACTIVE_LIST";
//搜索
export const TRAIN_SEARCH_DATA="TRAIN_SEARCH_DATA";
\ No newline at end of file
.singleLineOverflow {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
word-break: break-all;
}
.news-banner-carsouel-container {
width: 100%;
padding: 24px 30px;
}
.news-classify-list-container {
width: 100%;
height: 88px;
position: sticky;
background-color: #fff;
left: 0;
top: 0;
z-index: 9;
overflow-y: hidden;
overflow-x: auto;
}
.news-classify-list-container .news-classify-list-container-bg {
width: 100%;
height: 88px;
position: absolute;
left: 0;
top: 0;
background-color: #D23A29;
z-index: 1;
}
.news-classify-list-container .news-classify-list-scroll-container {
width: max-content;
height: 88px;
position: relative;
z-index: 2;
padding: 0 10px;
}
.news-classify-list-container .news-classify-list-scroll-container .news-classify-item-container {
max-width: 324px;
height: 88px;
line-height: 88px;
text-align: center;
margin: 0 25px;
display: inline-block;
vertical-align: middle;
font-size: 32px;
color: #fff;
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 {
border-bottom: 4px solid #fff;
padding-bottom: 12px;
}
.news-classify-list-container .news-third-classify-list-scroll-container {
width: max-content;
height: 60px;
position: relative;
z-index: 2;
padding: 0 10px;
}
.news-classify-list-container .news-third-classify-list-scroll-container .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;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
word-break: break-all;
}
.news-classify-list-container .news-third-classify-list-scroll-container .news-third-classify-item-container span {
color: #4285f4;
}
.news-item-list-container {
width: 100%;
}
@import "../../static/theme.less";
.news-banner-carsouel-container {
width: 100%;
padding: 24px 30px;
}
.news-classify-list-container {
width: 100%;
height: 88px;
position: sticky;
background-color: #fff;
left: 0;
top: 0;
z-index: 9;
overflow-y: hidden;
overflow-x: auto;
.news-classify-list-container-bg {
width: 100%;
height: 88px;
position: absolute;
left: 0;
top: 0;
background-color: #D23A29;
z-index: 1;
}
.news-classify-list-scroll-container{
width: max-content;
height: 88px;
position: relative;
z-index: 2;
padding: 0 10px;
.news-classify-item-container{
max-width: 324px;
height: 88px;
line-height: 88px;
text-align: center;
margin: 0 25px;
display: inline-block;
vertical-align: middle;
font-size: 32px;
color:#fff;
font-weight:400;
.singleLineOverflow;
span{
border-bottom: 4px solid #fff;
padding-bottom: 12px;
}
}
}
.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{
width: 100%;
}
\ No newline at end of file
import React, { Component } from 'react';
import React, { Component } from "react";
import "./style.less";
import intl from "react-intl-universal";
import { IndexTitle, IndexModuleBg, IndexNotMore } from "../../indexComponent/indexComponent";
import {
IndexTitle,
IndexModuleBg,
IndexNotMore,
} from "../../indexComponent/indexComponent";
import IconfontD from "../../../common/iconfontd";
import TrigleTagComponent from "../../../common/trigleTag";
class TrainIndexList extends Component {
constructor(props) {
super(props)
super(props);
}
renderTrainItemByItemList = () => {
const { list, itemClick } = this.props;
let _this = this;
return list.map((item, index) => {
item.trainTimeStr = _this.formatTimeToStr(item.start) + "~" + _this.formatTimeToStr(item.end);
return <TrainItem
key={index}
data={item}
onClick={() => itemClick(item)}
/>;
})
}
item.trainTimeStr =
_this.formatTimeToStr(item.start) +
"~" +
_this.formatTimeToStr(item.end);
return (
<TrainItem key={index} data={item} onClick={() => itemClick(item)} />
);
});
};
formatTimeToStr = (timeStr) => {
let dateObj = new Date(timeStr);
let year = dateObj.getFullYear();
......@@ -39,47 +41,78 @@ class TrainIndexList extends Component {
day = "0" + day;
}
return year + "-" + month + "-" + day;
}
};
render() {
const { isLoading } = this.props;
return <div className="train-index-list-container">
return (
<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" }}>
<IndexNotMore text={isLoading ? intl.get("PublishKey66") : ""} />
</div>
</div>;
</div>
);
}
}
export default TrainIndexList;
const TrainItem = ({ data, onClick }) => {
return <div className="train-index-list-item-container" onClick={onClick}>
return (
<div className="train-index-list-item-container" onClick={onClick}>
<img src={data.image} alt="" className="train-index-list-item-image" />
<div style={{ display: "flex", alignItems: "end" }}>
<div className="train-index-list-item-info">
<div className="train-index-list-item-info-name">
{data.text}
</div>
<div className="train-index-list-item-info-name">{data.text}</div>
<div className="train-index-list-item-info-text">
<IconfontD code={"iconnumberofactivities"} style={{ fontSize: 28, marginRight: 6 }} />
{data.activitieNum}{intl.get("AtLeastFinish2")}
{
parseInt(data.enablePay) == 1 ?
<TrigleTagComponent text={intl.get("payTheBill") || "付费"} /> : ""
}
<IconfontD
code={"iconnumberofactivities"}
style={{ fontSize: 28, marginRight: 6 }}
/>
{data.activitieNum}
{intl.get("AtLeastFinish2")}
{parseInt(data.enablePay) == 1 ? (
<TrigleTagComponent text={intl.get("payTheBill") || "付费"} />
) : (
""
)}
</div>
<div className="train-index-list-item-info-text" style={{ marginTop: 16 }}>
<div
className="train-index-list-item-info-text"
style={{ marginTop: 16 }}
>
{data.trainTimeStr}
</div>
</div>
</div>;
}
\ No newline at end of file
<div
className={
data.activityStateCode == 4
? "train-sign-status"
: data.activityStateCode == 6
? "train-end-status"
: "train-enroll-status"
}
>
{data.activityStateCode == 1
? " 待报名"
: data.activityStateCode == 2
? "待签到"
: data.activityStateCode == 3
? "正在报名"
: data.activityStateCode == 4
? "已报名"
: data.activityStateCode == 5
? "进行中"
: data.activityStateCode == 6
? "结束"
: data.activityStateCode == 7
? "未报名"
: data.activityStateCode == 8
? "未签到"
: ""}
</div>
</div>
</div>
);
};
.singleLineOverflow {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
word-break: break-all;
}
.train-index-list-container {
width: 100%;
}
.train-index-list-container .train-index-list-item-container {
width: 100%;
height: 160px;
padding-left: 266px;
position: relative;
margin-bottom: 32px;
}
.train-index-list-container .train-index-list-item-container .train-index-list-item-image {
width: 266px;
height: 160px;
border-radius: 10px;
position: absolute;
left: 0;
top: 0;
}
.train-index-list-container .train-index-list-item-container .train-index-list-item-info {
width: 100%;
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 {
width: 100%;
height: 40px;
line-height: 40px;
font-size: 32px;
color: #333;
font-weight: 400;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
word-break: break-all;
}
.train-index-list-container .train-index-list-item-container .train-index-list-item-info .train-index-list-item-info-text {
width: 100%;
height: 32px;
line-height: 32px;
font-size: 24px;
color: #999;
font-weight: 400;
margin-top: 24px;
}
.train-index-list-container .train-index-list-item-container .train-status {
width: 150px;
border-radius: 50px;
padding: 5px 15px;
font-size: 30px;
text-align: center;
}
.train-index-list-container .train-index-list-item-container .train-enroll-status {
width: 150px;
border-radius: 50px;
padding: 5px 15px;
font-size: 30px;
text-align: center;
border: 1px solid #d23a29;
color: #d23a29;
}
.train-index-list-container .train-index-list-item-container .train-sign-status {
width: 150px;
border-radius: 50px;
padding: 5px 15px;
font-size: 30px;
text-align: center;
background: linear-gradient(90deg, #d23a29, #eb6c53 100%);
color: #fff;
}
.train-index-list-container .train-index-list-item-container .train-end-status {
width: 150px;
border-radius: 50px;
padding: 5px 15px;
font-size: 30px;
text-align: center;
background: #f2f2f4;
color: #999;
}
@import "../../../static/theme.less";
.train-index-list-container{
.train-index-list-container {
width: 100%;
.train-index-list-item-container{
.train-index-list-item-container {
width: 100%;
height: 160px;
padding-left: 266px;
position: relative;
margin-bottom: 32px;
.train-index-list-item-image{
.train-index-list-item-image {
width: 266px;
height: 160px;
border-radius: 10px;
position: absolute;
left: 0;
top: 0;
}
.train-index-list-item-info{
.train-index-list-item-info {
width: 100%;
height: 160px;
padding-left: 20px;
.train-index-list-item-info-name{
.train-index-list-item-info-name {
width: 100%;
height: 40px;
line-height: 40px;
......@@ -29,7 +28,7 @@
font-weight: 400;
.singleLineOverflow;
}
.train-index-list-item-info-text{
.train-index-list-item-info-text {
width: 100%;
height: 32px;
line-height: 32px;
......@@ -38,7 +37,40 @@
font-weight: 400;
margin-top: 24px;
}
}
.train-status {
width: 150px;
border-radius: 50px;
padding: 5px 15px;
font-size: 30px;
text-align: center;
}
.train-enroll-status {
width: 150px;
border-radius: 50px;
padding: 5px 15px;
font-size: 30px;
text-align: center;
border: 1px solid #d23a29;
color: #d23a29;
}
.train-sign-status {
width: 150px;
border-radius: 50px;
padding: 5px 15px;
font-size: 30px;
text-align: center;
background: linear-gradient(90deg, #d23a29, #eb6c53 100%);
color: #fff;
}
.train-end-status {
width: 150px;
border-radius: 50px;
padding: 5px 15px;
font-size: 30px;
text-align: center;
background: #f2f2f4;
color: #999;
}
}
}
......@@ -144,7 +144,6 @@ class TaskCalendar extends Component {
let props = {
viewData: this.state.viewData
};
console.log("currentDay:"+this.state.day);
return (
<div className="calendarContainer">
<CalendarHeader
......
......@@ -55,15 +55,10 @@ class SurveyAnswer extends Component {
if (String(isExam) == 1) {
this.props.examQuestionListData({...params, answerId: answerId}, false, isExam);
}
// else {
// // this.props.examQuestionListData({...params}, false, isExam);
// this.props.examQuestionListData({...params}, false, 0);
// }
}
componentWillReceiveProps = (nextProps) => {
console.log(nextProps)
//if (JSON.stringify(nextProps.DetailReducer.questions) != JSON.stringify(this.props.DetailReducer.questions)) {
this.setState({
questions: this.state.questions.cloneWithRows(nextProps.DetailReducer.questions),
});
......@@ -73,33 +68,7 @@ class SurveyAnswer extends Component {
componentWillUnmount() {
this.props.questionIntialReducer();
this._timer && clearInterval(this._timer);
// let {isUpMount}=this.state;
// let {questionsKey}=this.props.DetailReducer;
// if (JSON.stringify(questionsKey.epList) !== '[]' && isUpMount) {
// this.props.evolveSave(questionsKey)
// }
}
// timeDuration = (time) => {
// if (this._timer) return;
// this._timer = setInterval(() => {
// time--;
// if (time <= 0) {
// clearInterval(this._timer);
// this.setState({timeStr: "考试结束"});
// return false;
// }
// 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));
// this.setState({
// timeStr: h + ":" + m + ":" + s,
// });
// }, 1000);
// };
// addZero = (n) => {
// return n < 10 ? '0' + n : n;
// };
timeDuration=(time)=>{
let h=this.addZero(Number.parseInt(time/3600%24));
let m=this.addZero(Number.parseInt(time/60%60));
......@@ -108,9 +77,8 @@ class SurveyAnswer extends Component {
};
addZero=(n)=> n<10? '0'+n : n;
render() {
let {questions, height, timeStr}=this.state;
let {isMore, pageIndex, duration, questionsKey ,submitTime}=this.props.DetailReducer;
//if (Number.parseFloat(duration) > 0) this.timeDuration(Number.parseFloat(duration) * 60);
let {questions, height}=this.state;
let {isMore}=this.props.DetailReducer;
let separator = (sectionID, rowID) => (
<div
className="separator"
......
......@@ -80,7 +80,7 @@ class details extends Component {
}
})
}
//单选题其他txt回现
//单选题其他txt回现1
if (data.question && data.question.type == 1) {
console.log('danxuan', data.question.options)
data.question.options.map((v, i) => {
......@@ -183,9 +183,7 @@ class details extends Component {
{item.isFrist == 1 && item.remark !== '' ?
<div style={{ fontSize: '.28rem', padding: ' 0.1rem 0.3rem', borderBottom: '5px solid rgba(248,248,248,1)' }} >
<div >
<h4 style={{ float: 'left', padding: '15px 0', fontSize: '32px' }}>{intl.get('Info')||'调研说明'}</h4><span style={{ float: 'right', color: 'rgba(93,168,225,1)', padding: '15px 0' }}
onClick={() => this.open()}>{this.state.open ? intl.get('More')||'展开' : intl.get('Hide')||'收起'}{this.state.open ? <Icon type="down" /> : <Icon type="up" />}
</span>
<h4 style={{ float: 'left', padding: '15px 0', fontSize: '32px' }}>投票</h4>
</div>
<div style={{ clear: 'both' }}></div>
{/** task-1133-jmy 修改文字颜色 #ccc --> #4A4A4A */}
......
#hometitle .am-badge-dot {
width: 20px;
height: 20px;
top: 2px;
right: -9px;
}
#hometitle .am-search-input {
background-color: #f5f5f5;
border-radius: 56px;
}
#example .am-search-input .am-search-synthetic-ph {
text-align: left;
margin-left: 20px;
}
.menuhomeNav {
background: #d23a29;
color: #fff;
padding: 20px;
display: flex;
align-items: center;
}
.menuhomeNav .am-search {
background-color: #fff;
border-radius: 45px;
height: 70px !important;
line-height: 70px !important;
}
#hometitle{
.am-badge-dot{
#hometitle {
.am-badge-dot {
width: 20px;
height: 20px;
top: 2px;
right: -9px;
}
.am-search-input{
.am-search-input {
background-color: #f5f5f5;
border-radius: 56px;
}
}
#example .am-search-input .am-search-synthetic-ph{
#example .am-search-input .am-search-synthetic-ph {
text-align: left;
margin-left: 20px;
}
.menuhomeNav{
background: #FCFCFC;
color: #4A4A4A;
background-color: rgba(255,255,255,1);
height: 0.9rem;
width: 100%;
.menuhomeNav {
background: #d23a29;
color: #fff;
padding: 20px;
display: flex;
flex-direction: row;
justify-content: space-between;
.am-search{background-color: #fff}
align-items: center;
.am-search {
background-color: #fff;
border-radius: 45px;
height: 70px !important;
line-height: 70px !important;
}
}
......@@ -243,7 +243,7 @@ function mapDispatchToProps(dispatch) {
export default connect(mapStateToProps, mapDispatchToProps)(NewsListPage);
const NewsClassifyList = ({ list, currentClassifyId, onClick }) => {
let bgWidth = func.getDomOffsetWidthById("news-classify-list-scroll-id");
return (
<div className="news-classify-list-container">
<div
......
......@@ -307,6 +307,7 @@ module.exports = {
"Hours": "hrs",
"News": "News",
"AllNews": "All News",
"AllActive": "All Active",
"ReleaseTime": "Time",
"Author": "Author",
"Messages": "Messages",
......
......@@ -1232,6 +1232,7 @@
"LatestReply": "最新回复",
"item": "条",
"AllNews": "所有新闻",
"AllActive": "所有活动",
"hasSelectOption": "已选条件",
"studyNum": "学习人数",
"QuizGotIt": "我知道了",
......
......@@ -305,6 +305,7 @@
"Hours": "小时",
"News": "新闻",
"AllNews": "所有新闻",
"AllActive": "所有活动",
"ReleaseTime": "发布时间",
"Author": "作者",
"Notices": "公告",
......
......@@ -427,6 +427,7 @@ module.exports = {
"LatestReply": "最新回复",
"item": "条",
"AllNews": "所有新闻",
"AllActive": "所有活动",
"hasSelectOption": "已选条件",
"studyNum": "学习人数",
"QuizGotIt": "我知道了",
......@@ -1237,6 +1238,7 @@ module.exports = {
"Hours": "小时",
"News": "新闻",
"AllNews": "所有新闻",
"AllActive": "所有活动",
"ReleaseTime": "发布时间",
"Author": "作者",
"Notices": "公告",
......
......@@ -69,11 +69,13 @@ const linkMap = {
name: '我的项目',
list: '/train/mytraining',
detail: '/mytraining/trainingsteps',
}, myhome: {
},
myhome: {
name: '我的',
list: '/menume',
detail: '/menume',
}, mycourse: {
},
mycourse: {
name: '我的课程',
list: '/mycourse',
detail: '/mycourse/course',
......@@ -139,7 +141,7 @@ const linkMap = {
},
case_upload: {
name: '作品上传',
list:'/UploadMyCase',
list: '/UploadMyCase',
detail: false,
},
course: {
......@@ -213,65 +215,65 @@ const linkMap = {
list: "/signplaycard",
detail: false,
},
lecturer:{
name:"讲师库",
list:"/teachers/list",
detail:false
},
mytask:{
name:'日历任务',
list:"/myCalendarTask",
detail:false,
},
course_classify_group:{
name:"分类组",
list:"/classifygroup",
detail:false
},
album:{
name:"专辑",
list:"/AlbumList",
detail:false
},
album_detail:{
name:"专辑详情",
list:"/AlbumDetail",
detail:'/AlbumDetail'
},
myalbum:{
name:"我的专辑",
list:"/MyAlbumList",
detail:false
},
mysubscriptions:{
name:"我的订阅",
list:"/MySubscribeList",
detail:false
},
forum:{
name:"论坛",
list:"/forumIndex",
detail:"/postDetail",
},
myforum:{
name:"我的论坛",
list:"/MyForum",
detail:false,
},
practice:{
name:"我的陪练",
list:"/smart/smartPractices",
detail:false
},
boutique:{
name:"精品内容",
list:"/boutiqueContent",
detail:false
},
wallet:{
name:"我的钱包",
list:"/myWallet",
detail:false
lecturer: {
name: "讲师库",
list: "/teachers/list",
detail: false
},
mytask: {
name: '日历任务',
list: "/myCalendarTask",
detail: false,
},
course_classify_group: {
name: "分类组",
list: "/classifygroup",
detail: false
},
album: {
name: "专辑",
list: "/AlbumList",
detail: false
},
album_detail: {
name: "专辑详情",
list: "/AlbumDetail",
detail: '/AlbumDetail'
},
myalbum: {
name: "我的专辑",
list: "/MyAlbumList",
detail: false
},
mysubscriptions: {
name: "我的订阅",
list: "/MySubscribeList",
detail: false
},
forum: {
name: "论坛",
list: "/forumIndex",
detail: "/postDetail",
},
myforum: {
name: "我的论坛",
list: "/MyForum",
detail: false,
},
practice: {
name: "我的陪练",
list: "/smart/smartPractices",
detail: false
},
boutique: {
name: "精品内容",
list: "/boutiqueContent",
detail: false
},
wallet: {
name: "我的钱包",
list: "/myWallet",
detail: false
}
}
......@@ -287,10 +289,10 @@ const fnNavigate = (item, jumpType) => {
// 根据type判断跳转
const { type, kind, relationId } = item;
let clearTime="";//bug-12616-cwj
console.log('kind',kind);
console.log('type',type);
console.log('item',item);
let clearTime = "";//bug-12616-cwj
console.log('kind', kind);
console.log('type', type);
console.log('item', item);
let url = '';
let queryId = '';
/*跳转规则:
......@@ -314,7 +316,7 @@ const fnNavigate = (item, jumpType) => {
queryId = item.relaId;
}
console.log(url,'url')
console.log(url, 'url')
window.directorType = type;
window.directorUrl = url;
if (type == 'outerchain') {
......@@ -359,58 +361,58 @@ const fnNavigate = (item, jumpType) => {
if (type == "course" && relationId != "0") {
hashHistory.push({
pathname: routerBefore + "/courseClassifylist",
query:{
id:relationId
query: {
id: relationId
}
});
} else if(type=="case_upload"){
} else if (type == "case_upload") {
hashHistory.push({
pathname: routerBefore + url,
query:{
id:relationId
query: {
id: relationId
}
});
}else if(type=="course_classify_group"){
} else if (type == "course_classify_group") {
hashHistory.push({
pathname: routerBefore + url,
query:{
id:relationId
query: {
id: relationId
}
});
}else if(type=="rankinglist"&&item.relationNum){
} else if (type == "rankinglist" && item.relationNum) {
hashHistory.push({
pathname: routerBefore + url,
query:{
relationNum:item.relationNum
query: {
relationNum: item.relationNum
}
});
}else if(type=="album_detail"){
} else if (type == "album_detail") {
hashHistory.push({
pathname: routerBefore + url,
query:{
id:relationId
query: {
id: relationId
}
});
}else if(type=="album"&& relationId != "0"){
} else if (type == "album" && relationId != "0") {
hashHistory.push({
pathname: routerBefore + "/AlbumClaList",
query:{
id:relationId
query: {
id: relationId
}
});
}else if(type=="album"&& relationId == "0") {
} else if (type == "album" && relationId == "0") {
hashHistory.push({
pathname: routerBefore + url,
});
}
else {
clearTimeout(clearTime)//bug-12616-cwj
clearTime= setTimeout(() => {//bug-12616-cwj
clearTime = setTimeout(() => {//bug-12616-cwj
hashHistory.push({
pathname: routerBefore + url,
query:{
id:relationId
query: {
id: relationId
}
});
}, 10);
......@@ -421,7 +423,7 @@ const fnNavigate = (item, jumpType) => {
hashHistory.push({
pathname: routerBefore + url,
query: type == "course" ? { id: queryId} : { id: queryId, accountId: accountId }
query: type == "course" ? { id: queryId } : { id: queryId, accountId: accountId }
});
......
......@@ -427,6 +427,7 @@ export default {
"LatestReply": "最新回复",
"item": "条",
"AllNews": "所有新闻",
"AllActive": "所有活动",
"hasSelectOption": "已选条件",
"studyNum": "学习人数",
"QuizGotIt": "我知道了",
......
......@@ -112,7 +112,8 @@ const url = {
COURSE_MAIN: `${baseUrl}${WEBSTUDENT}api/course/homePage/list`,
// banner
banner: `${baseUrl}${WEBSTUDENT}api/banner/home/image/list`,
//活动list
activeList:`${baseUrl}${WEBSTUDENT}api/trainingProject/getTrainingActivity`,
//火热报名中
hotEnrolling: `${baseUrl}${WEBSTUDENT}api/trainingProject/hot/page/list`,
//项目列表
......
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