Skip to content

S
saas-weichat
Commit e327c4ff by yanglang123
Options

优化文件

parent 2b03989c
Showing with 44 additions and 4899 deletions
build/cors.js
......@@ -3,7 +3,7 @@ var {createProxyMiddleware} = require('http-proxy-middleware');
var app = express();
app.all('*',function(req,res,next){
res.header("Access-Control-Allow-Origin", "http://localhost:8003");
res.header("Access-Control-Allow-Origin", "http://192.168.1.117:8003");
// res.header("Access-Control-Allow-Credentials", "true");
res.header("Access-Control-Allow-Headers", "X-Requested-With");
res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");
......
build/server.dev.js
......@@ -31,7 +31,7 @@ for (var i in ifaces) {
var app = express();
console.log('IP',IP);
console.log( `启动项目访问在： ${IP}:8003/#/shyz/shyz/login, waiting for compile`);
console.log( `启动项目访问在： ${IP}:8003/#/zhdj/edu/login, waiting for compile`);
var compiler = webpack(config);
compiler.apply(new webpack.ProgressPlugin());
app.all("*", function(req, res, next) {
......@@ -60,7 +60,7 @@ app.get("*", function(req, res) {
res.send(htmlBuffer.toString());
});
app.listen(8003,[IP, "localhost"], function(err) {
app.listen(8003,[IP, "192.168.1.117"], function(err) {
if (err) {
return console.error(err,'server.dev.js');
}
......
src/common/AbuList/abuList.jsx deleted 100644 → 0
import React, { Component } from "react";
import $ from "jquery";
import "./abuList.less";
import Footer from "../footer/footer";
import NoData from "../../components/course/nocourse/nocourse";
import intl from "react-intl-universal";
class DayingList extends Component {
constructor(props) {
super(props);
this.state = {
};
this.listScroll = this.listScroll.bind(this);
this.renderRow = this.renderRow.bind(this)
}
listScroll() {
const { distanceToEnd, reachToEnd, isLoading, id } = this.props;
let containerScrollTop = $("#dayingListId" + id).scrollTop();
let containerHeight = $("#dayingListId" + id)[0].offsetHeight;
let contentHeight = $("#dayingListContainerId" + id)[0].offsetHeight;
// console.log("containerScrollTop", containerScrollTop);
// console.log("containerHeight", containerHeight);
// console.log("contentHeight", contentHeight);
if (contentHeight - containerHeight - containerScrollTop < distanceToEnd && !isLoading) {
reachToEnd();
}
}
renderRow() {
const { dataSource, renderRow, isLoading, noFooter,noDataText } = this.props;
if (dataSource.length > 0) {
let result = dataSource.map((item, index) => {
return renderRow(item, index);
});
return result;
} else if (!isLoading && !noFooter) {
return <NoData text={noDataText || intl.get('NoDataYet')||"暂无数据"} />;
} else {
return <div></div>;
}
}
render() {
const { id, hasMore, dataSource, isLoading, noFooter, customBackgroundColor } = this.props;
return (
<div className="daying-list-component" id={"dayingListId" + id} onScroll={this.listScroll}
style={{ height: this.props.height, overflowY: "auto",backgroundColor: customBackgroundColor ? customBackgroundColor : "#f3f3f3" }}>
<div className="daying-list-component-container" id={"dayingListContainerId" + id}
style={{backgroundColor:dataSource.length>0?"#fff":"#f3f3f3"}}
>
{this.renderRow()}
</div>
{
noFooter ? "" :
isLoading ?
<div style={{ width: "100%", height: 100, fontSize: 24, color: "#929292", textAlign: "center" }}>
{intl.get('PublishKey23')||'加载中......'}
</div> :
!hasMore && dataSource.length > 0 ?
<Footer footText={intl.get('PublishKey47')||"没有更多了"} /> : ""
}
</div>
);
}
}
export default DayingList;
//示例
{/* <DyList
id={"global-search-" + type + "-list"}
height={(height - 80)}
isLoading={isLoading}
dataSource={globalSearchResultList}
renderRow={this.renderRow}
reachToEnd={this.reachToEnd}
hasMore={this.state.hasMore}
distanceToEnd={100}
/> */}
\ No newline at end of file
src/common/AbuList/abuList.less deleted 100644 → 0
.daying-list-component{
width: 100%;
height: 100%;
overflow-x: hidden;
overflow-y: auto;
.daying-list-component-container{
width: 100%;
}
}
\ No newline at end of file
src/common/DyList/dyList.jsx deleted 100644 → 0
import React, { Component } from "react";
import $ from "jquery";
import "./dyList.less";
import Footer from "../footer/footer";
import NoData from "../../components/course/nocourse/nocourse";
import intl from "react-intl-universal";
class DayingList extends Component {
constructor(props) {
super(props);
this.state = {
};
this.listScroll = this.listScroll.bind(this);
this.renderRow = this.renderRow.bind(this)
}
listScroll() {
const { distanceToEnd, reachToEnd, isLoading, id } = this.props;
let containerScrollTop = $("#dayingListId" + id).scrollTop();
let containerHeight = $("#dayingListId" + id)[0].offsetHeight;
let contentHeight = $("#dayingListContainerId" + id)[0].offsetHeight;
// console.log("containerScrollTop", containerScrollTop);
// console.log("containerHeight", containerHeight);
// console.log("contentHeight", contentHeight);
if (contentHeight - containerHeight - containerScrollTop < distanceToEnd && !isLoading) {
reachToEnd();
}
}
renderRow() {
const { dataSource, renderRow, isLoading, noFooter, noDataText, noDataNode } = this.props;
if (dataSource.length > 0) {
let result = dataSource.map((item, index) => {
return renderRow(item, index);
});
return result;
} else if (!isLoading && !noFooter) {
if (noDataNode) {
return noDataNode();
}
return <NoData footerTextStyle={this.props.footerTextStyle} text={noDataText || intl.get('NoDataYet') || "暂无数据"} />;
} else {
return <div></div>;
}
}
render() {
const { id, hasMore, dataSource, isLoading, noFooter, customBackgroundColor, itemBackground } = this.props;
// console.log(dataSource)
return (
<div className="daying-list-component" id={"dayingListId" + id} onScroll={this.listScroll}
style={{ height: this.props.height, overflowY: "auto", backgroundColor: customBackgroundColor ? customBackgroundColor : "#fff" }}>
<div className="daying-list-component-container" id={"dayingListContainerId" + id}
style={{ backgroundColor: itemBackground ? itemBackground : dataSource.length > 0 ? "#fff" : "#fff" }}
>
{this.renderRow()}
</div>
{
noFooter ? "" :
isLoading ?
<div style={{ width: "100%", height: 100, fontSize: 24, color: "#929292", textAlign: "center" }}>
{intl.get('PublishKey66') || '加载中'}......
</div> :
!hasMore && dataSource.length > 0 ?
<Footer footText={intl.get('PublishKey47') || "没有更多了"} /> : ""
}
</div>
);
}
}
export default DayingList;
//示例
{/* <DyList
id={"global-search-" + type + "-list"}
height={(height - 80)}
isLoading={isLoading}
dataSource={globalSearchResultList}
renderRow={this.renderRow}
reachToEnd={this.reachToEnd}
hasMore={this.state.hasMore}
distanceToEnd={100}
/> */}
\ No newline at end of file
src/common/DyList/dyList.less deleted 100644 → 0
.daying-list-component{
width: 100%;
height: 100%;
overflow-x: hidden;
overflow-y: auto;
.daying-list-component-container{
width: 100%;
}
}
\ No newline at end of file
src/common/audio/audio.jsx
......@@ -4,7 +4,6 @@ import { Icon, Slider } from 'antd';
import $ from 'jquery';
import func from '../../util/commonFunc';
import { connect } from 'react-redux';
import { getPolyvToken } from '../../redux/action/course/courseplay';
import './audio.less';
import audioImage from './image/audioImage.jpg';
import audioCookies from "js-cookie";
......@@ -49,17 +48,7 @@ class AudioPlayer extends Component {
componentDidMount() {
let _this = this;
const {isPublic} = this.props;
let audioId = this.props.getAudioId();
this.props.getPolyvToken(audioId, audioToken => {
let audioPluginTimer = setInterval(() => {
if (PlvAudioPlayer) {
_this.initAudioPlayer(PlvAudioPlayer, audioToken);
clearInterval(audioPluginTimer);
}
});
},isPublic);
}
componentWillMount(){
......@@ -375,7 +364,6 @@ const mapStateToProps = (state) => {
}
const mapDispatchToProps = (dispatch) => {
return {
getPolyvToken: (id, callback,isPublic) => dispatch(getPolyvToken(id, callback,isPublic)),
};
}
......
src/common/chapterCourse/chapterCoursePlay/index.jsx deleted 100644 → 0
import React, { Component } from 'react';
import "./style.less";
import AudioPlayer from "../../audio/audio";
import VideoPlayer from "../../polyvVideo/polyvVideo";
import DocImageList from "../../../components/course/courseplay/plugin/docImageList";
import MediaDisplay from "../../mediaDisplay/index";
import commonFetch from "../../../util/fetchUtil";
import url from "../../../util/urlconfig";
class MarketChapterCoursePlayer extends Component {
constructor(props) {
super(props)
this.state = {
id: "",
playType: "media",
randomKey: "",
occupyHeight: 422,
videoHeight: document.body.clientWidth * (9 / 16),
videoPlayMode: 0,
materialData: {},
imageList: [],
content: ''
}
this.loadPlayerByType = this.loadPlayerByType.bind(this);
this.occupyHeightToggle = this.occupyHeightToggle.bind(this);
this.loadPlayerOccupyByType = this.loadPlayerOccupyByType.bind(this);
this.getVideoId = this.getVideoId.bind(this);
this.audioRefresh = this.audioRefresh.bind(this);
}
componentDidMount() {
const { location } = this.props;
const { query, state } = location;
this.setState({
id: query.id,
playType: this.getPlayType(query.type),
name: decodeURIComponent(query.name)
});
if (query.browseRecordsId) {
clearInterval(window.marketViewTimer);
window.marketViewTimer = setInterval(() => {
commonFetch.normalGet(url.viewTime + '?browseRecordId=' + query.browseRecordsId);
}, 5000);
}
if (state && state.materialData) {
this.setState({
materialData: state.materialData,
videoId: state.materialData.polyVid,
imageList: this.getDocImages(this.getPlayType(query.type), state.materialData.docPages),
content: state.materialData.content
})
}
}
getPlayType(type) {
switch (parseInt(type)) {
case 2:
return "video";
case 1:
return "audio";
case 3:
return "doc";
case 4:
return "media";
}
}
getDocImages(playType, list) {
if (playType == "doc") {
return list.map(item => {
return item.imageUrl;
})
} else {
return [];
}
}
getVideoId() {
// return "e6563d65b032c48b2967895cbc93a23c_e";
return this.state.materialData.polyVid;
}
occupyHeightToggle(height) {
this.setState({
occupyHeight: height,
});
}
audioRefresh(){
this.setState({
randomKey:new Date().getTime()
})
}
loadPlayerByType() {
const { playType } = this.state;
switch (playType) {
case "audio":
return <div
className="audio-player-container"
style={{ height: this.state.occupyHeight }}
>
<AudioPlayer
key={this.state.randomKey}
audioText={""}
audioImage={""}
autoplay={false}
canDrag={true}
start={() => { }}
complete={this.audioRefresh}
getAudioPlayer={() => { }}
occupyHeightChange={this.occupyHeightToggle}
getChapterId={() => { }}
simpleVersion={true}
getAudioId={this.getVideoId}
isPublic={true}
/>
</div>;
case "video":
return <div
className="video-player"
style={{
height: this.state.videoHeight,
position: this.state.videoPlayMode == 1
? 'relative'
: 'fixed',
}}
>
<VideoPlayer
key={this.state.randomKey}
getVideoRef={() => { }}
height={this.state.videoHeight}
poster={""}
courseId={""}
chapterId={""}
videoId={this.state.videoId}
autoplay={false}
hideProgress={
false
}
start={() => { }}
complete={() => { }}
videoHorseLamp={false}
videoHorseText={""}
isCommenting={false}
getChapterId={() => { }}
getVideoId={this.getVideoId}
getVideoProgress={() => { return 0; }}
simpleVersion={true}
isPublic={true}
/>
</div>;
case "doc":
return <DocImageList key={this.state.randomKey} list={this.state.imageList} />;
case "media":
return <div className="market-media-container" >
<MediaDisplay key={this.state.randomKey} content={this.state.content} />
</div>;
default:
return <div></div>;
}
}
loadPlayerOccupyByType() {
const { playType } = this.state;
switch (playType) {
case "audio":
return <div
className="audio-player-occupy"
style={{ height: this.state.occupyHeight }}
/>;
case "video":
if (this.state.videoPlayMode == 0) {
return <div
className="video-player-occupy"
style={{ height: this.state.videoHeight }}
/>;
} else {
return <div></div>;
}
default:
return <div></div>;
}
}
render() {
const { playType, name } = this.state;
return (
<div className="market-chapter-course-player-container">
{
playType == "doc" || playType == "media" ?
<div className="market-chapter-course-name">
{name}
</div> : ""
}
{
this.loadPlayerByType()
}
{
this.loadPlayerOccupyByType()
}
{
playType == "audio" || playType == "video" ?
<div className="market-chapter-course-name">
{name}
</div> : ""
}
</div>
)
}
}
export default MarketChapterCoursePlayer;
\ No newline at end of file
src/common/chapterCourse/chapterCoursePlay/style.less deleted 100644 → 0
@import "../../../static/theme.less";
.market-chapter-course-player-container {
width: 100%;
height: 100%;
background-color: #f2f2f2;
.audio-player-container {
width: 100%;
height: 532px;
background-color: #ccc;
position: fixed;
left: 0;
top: 0;
z-index: 101;
}
.audio-player-occupy {
width: 100%;
height: 532px;
}
.video-player {
width: 100%;
height: 500px;
background-color: #ccc;
position: fixed;
left: 0;
top: 0;
z-index: 101;
}
.video-player-occupy {
width: 100%;
height: 500px;
}
.market-media-container{
padding: 0 15px;
a{
color: @themeColor!important;
}
}
.market-chapter-course-name {
width: 100%;
background-color:#fff ;
border-bottom: 2px solid #f2f2f2;
padding: 26px 30px;
font-size: 40px;
color: #000;
font-weight: 400;
letter-spacing: 2px;
.singleLineOverflow;
}
}
\ No newline at end of file
src/common/chapterCourse/index.jsx deleted 100644 → 0
import React, { Component } from 'react';
import "./style.less";
import FooterLine from "../footer/footer";
import defaultLogo from "./default-chapter-logo.png";
class MarketChapterCourse extends Component {
render() {
const imgWidth = document.body.clientWidth - (30 * 2);
const imgHeight = imgWidth * (230 / 690);
const { name, image, chapters, marketContentClick } = this.props;
return (
<div className="market-chapter-course-container">
<div className="market-chapter-logo">
<img src={image || defaultLogo} alt="" style={{ height: imgHeight }} />
</div>
<div className="market-course-title">
{name}
</div>
<MarketChapterCourseMenu chapters={chapters || []} marketContentClick={marketContentClick} />
</div>
)
}
}
export default MarketChapterCourse;
class MarketChapterCourseMenu extends Component {
constructor(props) {
super(props)
this.marketContentClick = this.marketContentClick.bind(this);
}
marketContentClick(item){
this.props.marketContentClick({ id: item.materialId, type: item.materialType,name:item.name });
}
render() {
const { chapters, marketContentClick } = this.props;
return (
<div className="market-chapter-course-menu-container">
{
chapters.map((item, index) => {
if (item.materialId) {
return <MarketCourseMenuSection
key={index}
item={item}
type={parseInt(item.materialType)}
onClick={() => this.marketContentClick(item)}
/>
} else {
return <MarketCourseMenuChapter key={index} item={item} />
}
})
}
<FooterLine />
</div>
)
}
}
class MarketCourseMenuChapter extends Component {
render() {
const { item } = this.props;
return (
<div className="market-course-menu-chapter">
{item.name}
</div>
)
}
}
import videoIcon from "./play-icon-video.png";
import audioIcon from "./play-icon-audio.png";
import pdfIcon from "./play-icon-pdf.png";
import mediaIcon from "./play-icon-media.png";
class MarketCourseMenuSection extends Component {
constructor(props) {
super(props)
this.getIconByType = this.getIconByType.bind(this);
}
getIconByType(){
const {type} = this.props;
switch(type){
case 2:
return videoIcon;
case 1:
return audioIcon;
case 3:
return pdfIcon;
case 4:
return mediaIcon;
}
}
render() {
const { item, onClick } = this.props;
return (
<div className="market-course-menu-section" onClick={onClick}>
<img src={this.getIconByType()} className="market-course-menu-section-icon" alt=""/>
{item.name}
</div>
)
}
}
src/common/chapterCourse/style.less deleted 100644 → 0
@import "../../static/theme.less";
.market-chapter-course-container{
width: 100%;
.market-chapter-logo{
width: 100%;
padding: 24px 30px;
img{
width: 100%;
border-radius: 10px;
}
}
.market-course-title{
width: 100%;
padding: 26px 30px;
font-size: 40px;
color: #000;
font-weight: 400;
letter-spacing: 2px;
}
.market-chapter-course-menu-container{
width: 100%;
.market-course-menu-chapter{
width: 100%;
background-color: #f4f4f4;
padding: 38px 30px;
line-height: 44px;
font-size: 36px;
color: #333;
font-weight: 400;
.singleLineOverflow;
}
.market-course-menu-section{
width: 100%;
background-color: #fff;
padding: 32px 30px;
line-height: 36px;
font-size: 28px;
color: #333;
font-weight: 400;
.singleLineOverflow;
.market-course-menu-section-icon{
width: 36px;
height: 36px;
vertical-align: text-top;
margin-right: 10px;
}
}
}
}
\ No newline at end of file
src/common/preview/preview.jsx
import React, {Component} from 'react';
import MediaDisplay from '../mediaDisplay/index';
import {Icon} from "antd";
import './preview.less';
import React, { Component } from "react";
import MediaDisplay from "../mediaDisplay/index";
import { Icon } from "antd";
import "./preview.less";
// import database from '../../components/image/databaseload'
class MediaPreview extends Component {
constructor (props) {
super (props);
this.getItemType = this.getItemType.bind (this);
this.fileLook = this.fileLook.bind (this);
constructor(props) {
super(props);
this.getItemType = this.getItemType.bind(this);
this.fileLook = this.fileLook.bind(this);
}
getItemType (title) {
let arr = title.split ('.');
getItemType(title) {
let arr = title.split(".");
let type = arr[arr.length - 1];
type = type.toLocaleLowerCase ();
const imageType = ['jpg', 'jpeg', 'png','gif'];
const videoType = ['mp4'];
if (imageType.indexOf (type) != -1) {
return 'image';
} else if (videoType.indexOf (type) != -1) {
return 'video';
type = type.toLocaleLowerCase();
const imageType = ["jpg", "jpeg", "png", "gif"];
const videoType = ["mp4"];
if (imageType.indexOf(type) != -1) {
return "image";
} else if (videoType.indexOf(type) != -1) {
return "video";
} else {
return 'audio';
return "audio";
}
}
fileLook (url) {
console.log(url,'url');
if(url===""){
return <img src={require('../../components/image/databaseload.png')} style={{width: '100%'}} alt="" />;
}else{
if (this.getItemType (url) == 'image') {
return <img src={url} style={{width: '100%'}} alt="" />;
} else if (this.getItemType (url) == 'video') {
return <MediaDisplay content={'<video src=' + url + ' />'} />;
} else {
return (
<MediaDisplay mode="preview" content={'<audio src=' + url + ' />'} />
);
}
fileLook(url) {
console.log(url, "url");
if (this.getItemType(url) == "image") {
return <img src={url} style={{ width: "100%" }} alt="" />;
} else if (this.getItemType(url) == "video") {
return <MediaDisplay content={"<video src=" + url + " />"} />;
} else {
return (
<MediaDisplay mode="preview" content={"<audio src=" + url + " />"} />
);
}
}
back () {
history.back ();
back() {
history.back();
}
render () {
const {state} = this.props.location;
render() {
const { state } = this.props.location;
return (
<div className="media-daying-preview">
<div className="media-daying-preview-bg" />
<div className="close" onClick={this.back}>
<Icon type="close" />
</div>
<div className="media-daying-play" >
{this.fileLook (state)}
</div>
<div className="media-daying-play">{this.fileLook(state)}</div>
</div>
);
}
......
src/common/sourcePdf/index.jsx
import React, { Component } from 'react';
import "./style.less";
import $ from "jquery";
import DocImageList from "../../components/course/courseplay/plugin/docImageList";
class SourcePdfList extends Component {
constructor(props) {
......@@ -37,10 +36,7 @@ class SourcePdfList extends Component {
<div className="source-pdf-container">
<div id="source-pdf-image-list" dangerouslySetInnerHTML={{ __html: url }}>
</div>
{
this.state.imageList.length > 0 ?
<DocImageList list={this.state.imageList} /> : ""
}
</div>
)
......
src/components/App.jsx
......@@ -505,7 +505,6 @@ class App extends React.Component {
}
{/* 底部五个tab页 */}
{
showTab == 0 ?
null
......
src/components/DataBaseActivityDetail/index.jsx deleted 100644 → 0
import React, { Component } from 'react';
import NetWork from '../../util/fetchUtil';
import API from '../../util/urlconfig';
import './index.less';
import {Toast} from 'antd-mobile';
import intl from "react-intl-universal";
class DataBaseActivityDetail extends Component {
constructor(props) {
super(props);
this.state = {
pdfAry:[],
pdfState:false,
polyv:false,
imgv:false,
audioV:false,
}
}
// componentWillMount(){
// let scriptDom = document.createElement ('script');
// scriptDom.type = 'text/javascript';
// scriptDom.src = '//player.polyv.net/script/player.js';
// scriptDom.id = 'polyvScriptId';
// if (document.getElementById ('polyvScriptId') == null) {
// document.body.appendChild (scriptDom);
// }
// }
componentDidMount(){
// let scriptDom = document.createElement ('script');
// scriptDom.type = 'text/javascript';
// scriptDom.src = '//player.polyv.net/script/player.js';
// scriptDom.id = 'polyvScriptId';
// if (document.getElementById ('polyvScriptId') == null) {
// document.body.appendChild (scriptDom);
// }
let pdfUrl = this.props.location.query.pdfUrl || "databasedetailapi"
let param = {
id:this.props.location.query.id,
type:0,//0 移动端，1 pc
}
if(this.props.location.query.pdfUrl){
param = {
id: this.props.location.query.id,
termialType: 2
}
}
console.log("&&&&&&&&&&&&", pdfUrl, param)
NetWork.getNetwork(API[pdfUrl], param,res => {
if(res.code==='1000'){
const {data}=res;
const suffixName=data.suffixName;
let mp3Name=['mp3','wma','wav','ape','flac','ogg','aac'];
let mp4Name=['mp4','wmv','vob','mpg','mov', 'mkv','flv','3gp','f4v','rmvb','avi'];
if(data.suffixName==='pdf'){
let pdfAry = data.pdfPage.map((item, index) => {
return <img style={{width: document.body.clientWidth}} key={index} src={item.imageUrl} alt="" />
})
this.setState({pdfAry,pdfState:true})
}else if(mp4Name.includes(data.suffixName)){
if(data.videoSd){
location.replace(data.videoSd)
}else{
location.replace( 'https://wmy-transcoding-origin.oss-cn-shanghai.aliyuncs.com/exerciseBook/o_1dq6odhe71ekh13vs1qo6cnprn27.png')
}
}else if(mp3Name.includes(data.suffixName)){
if(data.videoSd){
location.replace(data.videoSd)
}else{
location.replace( 'https://wmy-transcoding-origin.oss-cn-shanghai.aliyuncs.com/exerciseBook/o_1dq6odhe71ekh13vs1qo6cnprn27.png')
}
} else{
// this.setState({
// imgv:true,
// imgURL:data.url
// })
location.replace(data.url)
}
}else{
Toast.info(intl.get(res.data.subMsg))
}
});
}
render() {
const {pdfAry,pdfState,polyv,imgv,imgURL}=this.state;
const pdfAryImg=<div className={'data-Base-pdf-box'} dangerouslySetInnerHTML = {{ __html: pdfAry }} />
return ( <div>
{
pdfState?<div className={'data-Base-pdf-box'}>{pdfAry.map(item => {return item})}</div>:polyv?<div></div>:imgv?<div><img style={{width:"100%"}} src={imgURL} alt={intl.get("DataBaseActivityDetail1") || "项目图"}/></div>:<div>
{/* 网络环境不好刷新一下... */}
<div className='database-loading-box'>
<img src={require('./loading.png')}/>
</div>
</div>}
</div>);
}
}
export default DataBaseActivityDetail;
\ No newline at end of file
src/components/DataBaseActivityDetail/index.less deleted 100644 → 0
.data-Base-pdf-box{
p{
img{
width: 100%;
}
}
}
.database-loading-box{
img{
width: 100%;
height: 100%;
}
}
\ No newline at end of file
src/components/Tests/Tests.jsx deleted 100644 → 0
import React from 'react'
import {Upload, Modal} from 'antd'
export default class Tests extends React.Component{
state = {
preview: "",
visible: false,
imageList: [],
token: {}
}
render() {
const props = {
onRemove: (file) => {
this.setState(({ imageList }) => {
const index = imageList.indexOf(file);
const newFileList = imageList.slice();
newFileList.splice(index, 1);
return {imageList: newFileList};
});
},
beforeUpload: this.beforeUpload,
fileList: this.state.imageList,
onPreview: this.handlePreview,
accept: "image/*",
listType: "picture-card"
};
const {preview, visible, imageList} = this.state
return(
<div>
<Upload {...props}>
{
imageList.length >= 1 ? null :"上传"
}
</Upload>
<Modal visible={visible} footer={null} onCancel={this.handleCancel}>
<img alt="example" style={{ width: '100%' }} src={preview} />
</Modal>
</div>
)
}
//因为我们需要与表单一起上传,所以默认是不去上传到后台服务器.
beforeUpload = file => {
let reader = new FileReader();
reader.readAsDataURL(file);
reader.onloadend = () => {
UploadToOss(this, DRIVER_LICENSE_PATH, file).then(data => {
this.setState(({ imageList }) => ({
imageList: [{
uid: file.uid,
name: file.name,
status: file.status,
type: file.type,
result: data.name,
url: reader.result
}],
}));
})
}
return false;
}
handlePreview = (file) => {
this.setState({
preview: file.url || file.thumbUrl,
visible: true,
});
}
componentDidMount(){
//使用的sts,向后台服务器请求获取token.
// setState({token: "you get result"})
}
}
const client = (self) => {
const {token} = self.state
return new window.OSS.Wrapper({
accessKeyId: token.access_key_id,
accessKeySecret: token.access_key_secret,
stsToken: token.security_token,
region: OSS_ENDPOINT, //常量,你可以自己定义
bucket: OSS_BUCKET,
});
}
const uploadPath = (path, file) => {
return `${path}/${file.name.split(".")[0]}-${file.uid}.${file.type.split("/")[1]}`
}
const UploadToOss = (self, path, file) => {
const url = uploadPath(path, file)
return new Promise((resolve, reject) => {
client(self).multipartUpload(url, file).then(data => {
resolve(data);
}).catch(error => {
reject(error)
})
})
}
src/components/Tests/Tw.jsx deleted 100644 → 0
import React ,{ Component} from "react";
export default class Tw extends Component{
render(){
return(
<div>
Tw
</div>
)
}
}
src/components/Training/Training.jsx
import React, { Component } from "react";
import { Tabs } from "antd-mobile";
import "./Training.less";
import '../../components/course/less/mycourse.less';
import TrainSingleList from "./trainList/list";
import intl from "react-intl-universal";
......
src/components/Training/TrainingSteps/TrainingSteps copy.jsx
......@@ -30,7 +30,6 @@ 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 '../../menumarketing/MarketingDetail.less';
import inCompleteIcon from './train-in-complete-icon.png';
import progressIcon from './train-progress-icon.png';
import completeIcon from './train-complete-icon.png';
......@@ -343,16 +342,6 @@ class TrainingSteps extends Component {
});
}
jumpToSigningLocation = () => {
let { id } = this.props.location.query;
hashHistory.push({
pathname: func.routerBefore() + '/signingLocation',
query: {
id
}
});
}
renderTabBar = (props) => {
return <Tabs.DefaultTabBar {...props} />;
}
......@@ -1865,44 +1854,6 @@ class TrainingSteps extends Component {
query: { id: item.relationId, type: 2, tpId: id },
});
break;
case 11:
// 作品
hashHistory.push({
pathname: func.routerBefore() + '/MyCaseSubmittingRecord',
query: {
caseLibraryId: item.relationId,
tpId: id,
isFromTraining: 1,
},
});
break;
case 12:
const requestUrl = API.pickOutCaseDetail;
const requestParams = {
studentCaseId: item.relationId,
type: 1,
};
this.props.validatePickOutCaseDetail(
requestUrl,
requestParams,
function (response) {
if (response.code == 1000) {
//精选作品
hashHistory.push({
pathname: func.routerBefore() + '/CaseLibraryDetail',
query: {
id: item.relationId,
type: 1,
tpId: id,
},
});
} else {
Toast.info(intl.get(response.subMsg), 1);
}
}
);
break;
case 13:
//资料任务-872-cwj
hashHistory.push({
......
src/components/Training/TrainingSteps/TrainingSteps.jsx
......@@ -13,7 +13,6 @@ import { Sticky, StickyContainer } from "react-sticky";
import MediaDisplay from "../../../common/mediaDisplay/index";
import blackPage from "../../../common/mediaDisplay/black-bg.png";
import "../../menumarketing/MarketingDetail.less";
import trainComment from "./comment-icon.jpg";
import trainCommentReplay from "../../../image/train-comment.png";
......@@ -356,7 +355,6 @@ class TrainingSteps extends Component {
}
//简介
renderIntroduction = (introductionVo) => {
console.log(introductionVo, "~~~~~~~~~~~!!!!!!!!!!!!!");
let introStartTime = moment(
introductionVo && introductionVo.enroll.startTime
).format("YYYY-MM-DD HH:mm");
......
src/components/Training/TrainingSteps/TrainingSteps111.jsx
import React, { Component, Fragment } from "react";
import { ListView, Modal, TextareaItem, Toast } from "antd-mobile";
import "../../menumarketing/MarketingDetail.less";
import trainCommentReplay from "../../../image/train-comment.png";
import intl, { init } from "react-intl-universal";
......
src/components/Training/TrainingSteps/TrainingStepsAction.jsx
......@@ -297,17 +297,3 @@ export const trainCertificateGet = (data, callback) => {
};
};
/**
* 请求精选作品详情接口，验证是否可进入
* @param {*} requestUrl
* @param {*} requestData
* @param {*} callback
*/
export function validatePickOutCaseDetail(requestUrl, requestData, callback) {
return (dispatch) => {
NetWork.getNetwork(requestUrl, requestData, (response) => {
console.log("trainingStepsAction-response", response);
callback(response);
});
};
}
src/components/Training/TrainingSteps/trainningDataLibrary/DataLibraryList.jsx deleted 100644 → 0
import React, {Component} from 'react';
import {Toast} from 'antd-mobile';
import DyList from '../../../../common/DyList/dyList';
import func from '../../../../util/commonFunc';
import API from '../../../../util/urlconfig';
import {hashHistory} from "react-router";
import intl from 'react-intl-universal';
import NoCourse from '../../../../components/course/nocourse/nocourse';
import './DataLibraryListCss.less';
import NetWork from '../../../../util/fetchUtil';
import Footer from '../../../../common/footer/footer';
class DataLibraryList extends Component {
constructor (props) {
super (props);
console.log ('DataLibraryList-constructor');
// document.title = '资料'; fix bug7652
this.state = {
dataLibraryList: [],
isLoading: false,
hasMore: true,
pageNo: 1,
pageSize: 20,
downloadingDataUrl: '',
pdfUrl: '',
};
this.reachToEnd = this.reachToEnd.bind (this);
this.downloadData = this.downloadData.bind (this);
}
componentDidMount () {
console.log ('DataLibraryList-componentDidMount');
const {pageNo, pageSize} = this.state;
const {relationId} = this.props;
console.log ('DataLibraryList-componentDidMount-relationId', relationId);
this.setState ({isLoading: true});
let paramsData = {
relationId: relationId,
relationType: 2,
pageNo: pageNo,
pageSize: pageSize,
};
NetWork.getNetwork (API.dataLibraryList, paramsData, response => {
let hasMore = response.data.records.length == 20 ? true : false;
this.setState ({
dataLibraryList: response.data.records,
isLoading: false,
hasMore: hasMore,
});
console.log ('trainingDataLibraryList-didMount-hasMore', hasMore);
console.log (
'trainingDataLibraryList-didMount-dataLibraryList',
response.data.records
);
});
}
reachToEnd () {
console.log ('-------------------------');
const {relationId} = this.props;
const {pageNo, pageSize, isLoading, hasMore, dataLibraryList} = this.state;
if (isLoading || !hasMore || dataLibraryList.length == 0) {
return;
} else {
this.setState ({isLoading: true});
let paramsData = {
relationId: relationId,
relationType: 2,
pageNo: pageNo + 1,
pageSize: pageSize,
};
NetWork.getNetwork (API.dataLibraryList, paramsData, response => {
let hasMoreData = response.data.records.length == 20 ? true : false;
let newDataList = [];
newDataList = dataLibraryList.concat(response.data.records);
this.setState ({
dataLibraryList: newDataList,
isLoading: false,
hasMore: hasMoreData,
});
console.log ('trainingDataLibraryList-reachToEnd-hasMore', hasMoreData);
console.log (
'trainingDataLibraryList-reachToEnd-dataLibraryList',
response.data.records
);
});
}
}
downloadData (data, itemId, fileType,fileUrl) {
/* feature1123资料的预览或下载统一处理，zhouzhongyan20200526 start*/
/* if(fileType === 'pdf'){ 跳转前要做项目的状态判断，故不应在此跳转;
hashHistory.push ({
pathname: func.routerBefore () + '/DataBaseActivityDetail',
query: {
id: itemId,
pdfUrl: 'dataLibraryDataDownload'
},
});
return
} */
console.log ('DataLibraryList-downloadData-data', data);
console.log ('DataLibraryList-downloadData-itemId', itemId);
console.log ('DataLibraryList-downloadData-fileType', fileType);
console.log ('DataLibraryList-downloadData-fileUrl', fileUrl);
let needEnroll = data.needEnroll;
let hasEnrolled = data.hasEnrolled;
let startTime = data.startTime;
let endTime = data.endTime;
let needAudit = data.needAudit;
let auditStatus = data.auditStatus;
let hasFinished = data.hasFinished ? data.hasFinished : false;
let enrollLimit = data.enrollLimit;
let hasEnrolledNum = data.hasEnrolledNum;
let enrollStartTime = data.enroll.startTime;
let enrollEndTime = data.enroll.endTime;
let paramsData = {
needEnroll: needEnroll,
hasEnroll: hasEnrolled,
needAudit: needAudit,
auditStatus: auditStatus,
hasFinished: hasFinished,
enrollLimit: enrollLimit,
hasEnrollNum: hasEnrolledNum,
enrollStartTime: enrollStartTime,
enrollEndTime: enrollEndTime,
projectStartTime: startTime,
projectEndTime: endTime,
termialType: 2
};
// if (fileType == 'mp3' || fileType == 'mp4' || fileType == 'jpg' || fileType == 'jpeg' || fileType == 'png' || fileType == 'gif') {
NetWork.post(API.trainDataLibraryDataStatus, paramsData,
response1 => {
if (response1.code == 1000) {
hashHistory.push({
pathname: func.routerBefore() + '/dataView',
query: {
id: itemId,
pdfUrl: 'dataLibraryDataDownload'
},
});
} else {
Toast.info(intl.get(response1.subMsg), 1);
}
});
/* feature1123资料的预览或下载统一处理，zhouzhongyan20200526 end*/
}
render () {
console.log ('DataLibraryList-render');
const {relationId, data} = this.props;
const {dataLibraryList, hasMore, isLoading} = this.state;
let screenHeight = document.body.clientHeight;
let dataLibraryHeight = screenHeight - 488;
console.log ('DataLibraryList-screenHeight', screenHeight);
console.log ('DataLibraryList-dataLibraryList', dataLibraryList);
console.log ('DataLibraryList-hasMore', hasMore);
let row = (rowData, sectionID, rowID) => {
console.log ('DataLibraryList-rowData', rowData);
let dataName = rowData.name;
console.log("DataLibraryList-rowData-dataName", dataName);
let fileName = rowData.fileName;
let index = fileName.lastIndexOf(".");
let fileType = fileName.substring(index+1, fileName.length);
let copyFileType = fileName.substring(index+1, fileName.length);
console.log("DataLibraryList-rowData-fileType", fileType);
if (dataName) {
if (dataName.length >= 16) {
dataName = dataName.substring (0, 16) + '....';
} else {
fileType = "." + fileType;
}
} else {
dataName = '';
}
return (
<div>
<div
className="data_library_list_row_container"
onClick={() => this.downloadData (data, rowData.id, copyFileType,rowData.url)}
>
<div className="data_library_list_row_description_item" >
{`${dataName}${fileType}`}
<div className="data_library_list_row_sub_item">
{` / ${rowData.fileSizeName}`}
</div>
</div>
{/*<div className="data_library_list_row_download_item">查看</div>*/}
</div>
</div>
);
};
return (
<div className="data_library_list_container">
<div className="data_library_list_header">{`${intl.get('currentDocNum')||'当前资料数'}(${dataLibraryList.length})`}</div>
<div className="data_library_list_body">
{dataLibraryList && dataLibraryList.length > 0
? <DyList
id={'data_library_list'}
height={dataLibraryHeight}
isLoading={isLoading}
dataSource={dataLibraryList}
renderRow={row}
reachToEnd={this.reachToEnd}
hasMore={hasMore}
distanceToEnd={100}
noFooter={false}
/>
: <div>
<div className="no_data_library">{intl.get('noDocument')||'无相关资料'}</div>
</div>}
</div>
{
dataLibraryList && dataLibraryList.length > 0
? "" :
<Footer page={{pageTotle: 5}} currentNumber={10} isLoading={false} isEnd={true} footText={intl.get('PublishKey47')||'没有更多了'}/>
}
</div>
);
}
}
export default DataLibraryList;
src/components/Training/TrainingSteps/trainningDataLibrary/DataLibraryListCss.less deleted 100644 → 0
@import "../../../../static/theme.less";
.data_library_list_container {
width: 100%;
height: 100%;
}
.data_library_list_header {
width: 100%;
height: 1.2rem;
display: flex;
flex: 1;
align-items: center;
font-size: 0.36rem;
line-height: 0.52rem;
color: #4A4A4A;
padding-left: 0.3rem;
}
.data_library_list_header_item {
font-size: 0.36rem;
line-height: 0.52rem;
color: #4A4A4A;
}
.data_library_list_row_container {
width: 100%;
height: 1.0rem;
display: flex;
flex: 1;
align-items: center;
margin-top: 0.02rem;
padding-left: 0.3rem;
padding-right: 0.3rem;
border-bottom: 0.02rem solid #e3e5e8;
}
.data_library_list_body {
display: flex;
flex: 1;
justify-content: space-between;
background-color: #FFFFFF;
}
.data_library_list_row_description_item {
width: 100%;
height: 0.36rem;
font-size: 0.24rem;
color: #666666;
}
.data_library_list_row_sub_item {
display: inline;
color: #999999;
}
.data_library_list_row_download_item {
width: 1.0rem;
height: 0.52rem;
font-size: 0.24rem;
line-height: 0.32rem;
color: @themeColor;
border: 0.02rem solid @themeColor;
border-radius: 0.1rem;
text-align: center;
padding-top: 0.04rem;
padding-bottom: 0.04rem;
}
.data_library_list_row_download_item_disabled {
width: 1.0rem;
height: 0.52rem;
font-size: 0.24rem;
line-height: 0.32rem;
color: #999999;
border: 0.02rem solid #999999;
border-radius: 0.1rem;
text-align: center;
padding-top: 0.04rem;
padding-bottom: 0.04rem;
}
.no_data_library {
height: 4.64rem;
font-size: 0.28rem;
text-align: left;
color: #666666;
padding-top: 0.34rem;
padding-left: 0.3rem;
}
.pdfUrl-box{
img{
width: 100%;
}
}
\ No newline at end of file
src/components/Training/trainList/list.jsx
......@@ -2,10 +2,8 @@ import React, { Component } from "react";
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import { hashHistory } from "react-router";
import DyList from "../../../common/DyList/dyList";
import func from "../../../util/commonFunc";
import { getTrainList } from "../../../redux/action/mytrain";
import NoData from '../../course/nocourse/nocourse'
import moment from 'moment';
import "./index.less";
import intl, { init } from "react-intl-universal";
......@@ -137,19 +135,8 @@ class TrainSingleList extends Component {
render() {
const { height,type } = this.props;
if (this.state.trainList.length == 0) {
return <NoData text={intl.get("NoDataYet")||"暂无数据"} />;
} else {
return <DyList
id={"trainList"+type}
height={height}
hasMore={this.state.hasMore}
isLoading={this.state.isLoading}
dataSource={this.state.trainList}
renderRow={this.renderRow}
reachToEnd={this.reachToEnd}
distanceToEnd={100}
/>
}
return <div text={intl.get("NoDataYet")||"暂无数据"}></div>;
}
}
}
......
src/components/album/AlbumClassifys.jsx deleted 100644 → 0
import React, { Component } from 'react';
import './style.less';
import intl from 'react-intl-universal';
import { bindActionCreators } from 'redux';
import { Icon } from 'antd';
import moment from 'moment';
import AbuList from '../../common/AbuList/abuList';
import FontAwesome from 'react-fontawesome';
import { connect } from 'react-redux';
import { course_list } from '../course/redux/CourseActions';
import { album_search_page, get_album_get_strategy, getAlbumClassifyName } from '../../redux/action/album/albumList';
import { getCourseClassifyName } from "../../redux/action/course/courseClassify";
import borderImg from './image/borderImg.png'
import { hashHistory } from 'react-router';
import func from '../../util/commonFunc.js';
class CourseIndex extends Component {
constructor(props) {
super(props);
this.state = {
banner: [],
courseList: [],
courseTotal: 0,
isLoading: false,
hasMore: true,
pageNo: 1,
pageSize: 10,
classifyId: '',
};
this.getCourseList = this.getCourseList.bind(this);
this.reachToEnd = this.reachToEnd.bind(this);
this.renderRow = this.renderRow.bind(this);
this.toCourseSearch = this.toCourseSearch.bind(this);
}
componentDidMount() {
this.props.getAlbumClassifyName({ id: this.props.location.query.id },
(res) => {
if (res.code == "1000") {
document.title = res.data;
} else {
document.title = intl.get("Album") || "专辑";
}
})
this.setState({
classifyId: this.props.location.query.id
}, () => {
this.getCourseList(1);
})
}
getCourseList(pageNo) {
let _this = this;
let { courseList, classifyId } = this.state;
this.setState({ isLoading: true });
this.props.album_search_page({ classifyId, pageNo, pageSize: 10 }, () => {
let { albumSearchPage } = _this.props;
_this.setState(
{
courseList: pageNo == 1
? albumSearchPage.records
: courseList.concat(albumSearchPage.records),
courseTotal: albumSearchPage.total || 0,
pageNo,
isLoading: false,
},
() => {
const { courseList, courseTotal, pageNo, pageSize } = _this.state;
_this.setState({
hasMore: courseList.length < courseTotal
? true
: false,
});
}
);
});
}
reachToEnd() {
const { pageNo, isLoading, hasMore } = this.state;
if (isLoading || !hasMore) {
return;
}
this.getCourseList(pageNo + 1);
}
courseitemClick(id) {
hashHistory.push({
pathname: func.routerBefore() + '/AlbumDetail',
query: {
id: id,
},
});
}
toCourseSearch() {
const { classifyId } = this.state;
hashHistory.push({
pathname: func.routerBefore() + '/search',
query: {
type: 'album',
classifyId
},
});
}
//跳转到分类页面
toCourseClassify() {
hashHistory.push({
pathname: func.routerBefore() + '/albumClassify',
});
}
//加载长列表项
renderRow(rowData) {
return (
<AlbumIndexItem
item={rowData}
itemClick={() => this.courseitemClick(rowData.id)}
/>
);
}
render() {
const carouselparam = {
height: '2.88rem',
radius: '0.2rem',
};
const { isLoading, hasMore, courseList } = this.state;
let dyListHeight = document.body.clientHeight - 88;
return (
<div className="course-classify-index-container">
<CourseIndexHeader
toCourseSearch={this.toCourseSearch}
toCourseClassify={this.toCourseClassify}
/>
<AbuList
id={'course-index-list'}
height={dyListHeight}
isLoading={false}
dataSource={courseList}
renderRow={this.renderRow}
reachToEnd={this.reachToEnd}
hasMore={hasMore}
distanceToEnd={100}
noDataText={intl.get("PublishKey47") || '没有更多了'}
/>
</div>
);
}
}
const mapStateToProps = state => {
const { CourseReducer = {} } = state;
// 新增 pageTotal 用来判断是否还有数据
const { banner, list } = CourseReducer;
const { albumList } = state;
const { albumSearchPage } = albumList;
return {
banner,
list,
albumSearchPage
};
};
const mapDispatchToProps = dispatch => {
return {
album_search_page: bindActionCreators(album_search_page, dispatch),
get_album_get_strategy: bindActionCreators(get_album_get_strategy, dispatch),
course_list: bindActionCreators(course_list, dispatch),
getCourseClassifyName: bindActionCreators(getCourseClassifyName, dispatch),
getAlbumClassifyName: bindActionCreators(getAlbumClassifyName, dispatch),
};
};
export default connect(mapStateToProps, mapDispatchToProps)(CourseIndex);
class CourseIndexHeader extends Component {
render() {
return (
<div className="course-album-index-header">
{/* <div className="course-index-header"> */}
<div className="header-search-input" onClick={this.props.toCourseSearch}>
<Icon style={{ fontSize: '0.42rem', color: '#B7B7B7', position: 'absolute', top: '.1rem', left: '.2rem' }} type="search" />
<span className="header-search-hold">{intl.get("Album1") || "请输入专辑名称"}</span>
</div>
</div>
// </div>
);
}
}
class AlbumIndexItem extends Component {
constructor(props) {
super(props);
}
render() {
const { item, itemClick } = this.props;
let { duration } = item;
let durationTime = `${Math.floor(duration / 3600)} 时 ${Math.floor(duration / 60)} 分 ${Math.floor(duration % 60)} 秒`
return (
<div className="album-index-item" onClick={itemClick}>
<img src={item.image} className="item-image" />
<img src={borderImg} className="borderImg" />
<div className="course-info-div">
<div className="info-title">
{item.name}
</div>
{
item.overed == 0 ?
<div className="overed-block-cancel">{intl.get("overedLoading") || "连载中"}</div>
:
<div className="overed-block-ok">{intl.get("overedDone") || "已完结"}</div>
}
<div className="icon-index-studyNum"><FontAwesome name="" className="iconfont icon-liebiaoicon-renshu" />&nbsp;<span style={{ verticalAlign: "top" }}>{item.studyNum || 0}</span></div>
{/* {
item.overed == 0 ?
<div className="overed-block-cancel">{intl.get("overedLoading") || "连载中"}</div>
:
// <div className="overed-block-ok">{intl.get("overedDone") || "已完结"}</div>
<div className="album-index-duration"><div className="item-complete-icons">{item.courseNum}{intl.get("albumActivityDoneText")||"门全"}</div></div>
} */}
{
item.overed == 0 ?
<div className="album-index-duration"><div className="item-complete-icons">{intl.get("unLockTime") || "更新至"} {moment(item.unLockTime).format('YYYY-MM-DD')}</div></div>
:
<div className="album-index-duration"><div className="item-complete-icons">{item.courseNum}{intl.get("albumActivityDoneText")||"门全"}</div></div>
// <div className="tip-item-title"><div className="item-complete-icons">{intl.get("overedDone") || "已完结"}</div></div>
}
{/* <div className="album-index-duration">{`${intl.get("courseTime") || "时长"}: ${durationTime}`}</div> */}
</div>
</div>
);
}
}
src/components/album/classify/style.css deleted 100644 → 0
.course-classify-list-container {
width: 100%;
height: 100%;
}
.course-classify-list-container .course-classify-tab-container {
width: 200px;
height: 100%;
background-color: #F5F8FD;
overflow-x: hidden;
overflow-y: scroll;
float: left;
}
.course-classify-list-container .course-classify-tab-container .tab-list {
width: 220px;
padding-right: 20px;
}
.course-classify-list-container .course-classify-tab-container .tab-list .course-classify-tab-item {
width: 200px;
padding: 32px 40px 32px 20px;
position: relative;
}
.course-classify-list-container .course-classify-tab-container .tab-list .course-classify-tab-item .tab-item-text {
width: 100%;
text-align: left;
display: -webkit-box;
-webkit-line-clamp: 2;
overflow: hidden;
line-height: 36px;
word-break: break-all;
font-size: 28px;
color: #4a4a4a;
}
.course-classify-list-container .course-classify-tab-container .tab-list .course-classify-tab-item .has-child-icon {
font-size: 26px;
width: 32px;
color: #000;
text-align: left;
position: absolute;
right: 0;
top: 0;
}
.course-classify-list-container .course-classify-tab-container .tab-list .course-classify-tab-item .has-child-icon i {
position: absolute;
left: 0;
top: 50%;
margin-top: -13px;
}
.course-classify-list-container .course-classify-tab-container .tab-list .item-active {
background-color: #fff;
}
.course-classify-list-container .course-classify-tab-container .tab-list .item-active .active-left-border {
position: absolute;
left: 0;
top: 0;
width: 6px;
background-color: #4285f4;
}
.course-classify-list-container .course-classify-children-container {
height: 100%;
float: right;
padding: 0 40px;
overflow-y: auto;
}
.course-classify-list-container .course-classify-children-container .children-container {
width: 100%;
}
.course-classify-list-container .course-classify-children-container .children-container .classify-children-all {
width: 100%;
height: 80px;
background-color: #F5F8FD;
margin-top: 20px;
font-size: 28px;
color: #4a4a4a;
line-height: 78px;
text-align: center;
border-radius: 10px;
}
.course-classify-list-container .course-classify-children-container .children-container .classify-children-title {
width: 100%;
height: 40px;
margin-top: 20px;
font-size: 32px;
color: #030303;
line-height: 38px;
text-align: left;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.course-classify-list-container .course-classify-children-container .children-container .classify-children-half-container {
width: 100%;
}
.course-classify-list-container .course-classify-children-container .children-container .classify-children-half-container .classify-children-half {
height: 120px;
background-color: #F5F8FD;
margin-top: 20px;
padding-left: 26px;
padding-right: 26px;
padding-top: 24px;
}
.course-classify-list-container .course-classify-children-container .children-container .classify-children-half-container .classify-children-half .half-text {
font-size: 28px;
color: #4a4a4a;
text-align: center;
line-height: 36px;
width: 100%;
display: -webkit-box;
-webkit-line-clamp: 2;
overflow: hidden;
word-break: break-all;
}
.course-classify-list-container .course-classify-children-container .recommend-title {
width: 100%;
height: 84px;
padding-top: 20px;
line-height: 44px;
font-size: 32px;
color: #030303;
}
.course-classify-list-container .course-classify-children-container .recommend-course-item {
width: 100%;
height: 172px;
padding: 20px 0;
padding-left: 220px;
position: relative;
}
.course-classify-list-container .course-classify-children-container .recommend-course-item .recommend-course-item-image {
width: 220px;
height: 132px;
border-radius: 14px;
position: absolute;
left: 0;
top: 20px;
}
.course-classify-list-container .course-classify-children-container .recommend-course-item .recommend-course-item-title {
width: 100%;
padding-left: 20px;
font-size: 28px;
color: #333;
height: 80px;
line-height: 40px;
display: -webkit-box;
-webkit-line-clamp: 2;
overflow: hidden;
word-break: break-all;
}
src/components/album/classify/style.less deleted 100644 → 0
@import "../../../static/theme.less";
.course-classify-list-container {
width: 100%;
height: 100%;
.course-classify-tab-container {
width: 200px;
height: 100%;
background-color: #F5F8FD;
overflow-x: hidden;
overflow-y: scroll;
float: left;
.tab-list {
width: 220px;
padding-right: 20px;
.course-classify-tab-item {
width: 200px;
padding: 32px 40px 32px 20px;
position: relative;
.tab-item-text {
width: 100%;
text-align: left;
display: -webkit-box;
-webkit-line-clamp: 2;
overflow: hidden;
line-height: 36px;
word-break: break-all;
font-size: 28px;
color: #4a4a4a;
}
.has-child-icon {
font-size: 26px;
width: 32px;
color: #000;
text-align: left;
position: absolute;
right: 0;
top: 0;
i {
position: absolute;
left: 0;
top: 50%;
margin-top: -13px;
}
}
}
.item-active {
background-color: #fff;
.active-left-border {
position: absolute;
left: 0;
top: 0;
width: 6px;
background-color: @themeColor;
}
}
}
}
.course-classify-children-container {
height: 100%;
float: right;
padding: 0 40px;
overflow-y: auto;
.children-container {
width: 100%;
.classify-children-all {
width: 100%;
height: 80px;
background-color: #F5F8FD;
margin-top: 20px;
font-size: 28px;
color: #4a4a4a;
line-height: 78px;
text-align: center;
border-radius: 10px;
.singleLineOverflow;
}
.classify-children-title {
width: 100%;
height: 40px;
margin-top: 20px;
font-size: 32px;
color: #030303;
line-height: 38px;
text-align: left;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.classify-children-half-container {
width: 100%;
.classify-children-half {
height: 120px;
background-color: #F5F8FD;
margin-top: 20px;
padding-left: 26px;
padding-right: 26px;
padding-top: 24px;
.half-text {
font-size: 28px;
color: #4a4a4a;
text-align: center;
line-height: 36px;
width: 100%;
display: -webkit-box;
-webkit-line-clamp: 2;
overflow: hidden;
word-break: break-all;
}
}
}
}
.recommend-title {
width: 100%;
height: 84px;
padding-top: 20px;
line-height: 44px;
font-size: 32px;
color: #030303;
}
.recommend-course-item {
width: 100%;
height: 172px;
padding: 20px 0;
padding-left: 220px;
position: relative;
.recommend-course-item-image {
width: 220px;
height: 132px;
border-radius: 14px;
position: absolute;
left: 0;
top: 20px;
}
.recommend-course-item-title {
width: 100%;
padding-left: 20px;
font-size: 28px;
color: #333;
height: 80px;
line-height: 40px;
display: -webkit-box;
-webkit-line-clamp: 2;
overflow: hidden;
word-break: break-all;
}
}
}
}
\ No newline at end of file
src/components/album/style.css deleted 100644 → 0
.course-classify-index-container {
width: 100%;
height: 100%;
}
.course-classify-index-container .course-index-header {
width: 100%;
height: 88px;
box-shadow: 0px 0px 0px 0px rgba(199, 199, 199, 0.5);
border-bottom: 2px solid #c7c7c7;
position: relative;
}
.course-classify-index-container .course-index-header .header-text {
width: 100%;
height: 88px;
line-height: 86px;
font-size: 28px;
color: #333;
padding-left: 70px;
}
.course-classify-index-container .course-index-header .header-left-icon {
position: absolute;
width: 32px;
height: 32px;
top: 28px;
left: 30px;
}
.course-classify-index-container .course-index-header .header-right-icon {
position: absolute;
width: 32px;
height: 32px;
top: 28px;
right: 30px;
}
.course-classify-index-container .course-index-carousel {
width: 100%;
padding: 20px;
}
.course-classify-index-container .course-index-item {
width: 100%;
height: 192px;
padding: 30px 20px;
position: relative;
}
.course-classify-index-container .course-index-item .item-image {
width: 220px;
height: 132px;
position: absolute;
top: 30px;
left: 20px;
border-radius: 10px;
}
.course-classify-index-container .course-index-item .course-info-div {
width: 100%;
padding-left: 260px;
}
.course-classify-index-container .course-index-item .course-info-div .info-title {
width: 100%;
height: 40px;
line-height: 38px;
font-size: 32px;
color: #333;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.course-classify-index-container .course-index-item .course-info-div .info-rate {
font-size: 16px;
color: #F79A58;
margin-top: 22px;
position: relative;
}
.course-classify-index-container .course-index-item .course-info-div .info-rate span {
font-size: 20px;
position: absolute;
top: 2px;
left: 152px;
}
.course-classify-index-container .course-index-item .course-info-div .info-duration-num {
width: 100%;
height: 28px;
margin-top: 16px;
}
.course-classify-index-container .course-index-item .course-info-div .info-duration-num .info-duration,
.course-classify-index-container .course-index-item .course-info-div .info-duration-num .info-num {
height: 28px;
line-height: 28px;
font-size: 20px;
color: #9b9b9b;
}
.course-classify-index-container .course-index-item .course-info-div .info-duration-num .info-duration {
float: left;
}
.course-classify-index-container .course-index-item .course-info-div .info-duration-num .info-num {
float: right;
}
src/components/album/style.less deleted 100644 → 0
.course-classify-index-container {
width: 100%;
height: 100%;
background-color: #fff;
.daying-list-component{
background-color: #fff !important;
}
.course-album-index-header {
width: 100%;
height: 88px;
box-shadow: 0px 0px 0px 0px rgba(199, 199, 199, 0.5);
// border-bottom: 2px solid #c7c7c7;
padding: .14rem .2rem;
display: flex;
overflow-y: auto;
.header-search-input {
width: 86%;
flex: 1;
background-color: #F3F3F3;
border-radius: 35px;
position: relative;
.header-search-hold {
letter-spacing: 3px;
color: #B7B7B7;
font-size: 28px;
line-height: 56px;
margin-left: 80px;
}
}
.header-sao-icon {
margin-top: 10px;
line-height: 50px;
display: block;
width: 50px;
margin-right: .2rem;
}
.header-text {
width: fit-content;
height: 88px;
line-height: 86px;
font-size: 28px;
color: #333;
padding-left: 70px;
}
.header-right-icon {
position: absolute;
width: 32px;
height: 32px;
top: 28px;
right: 30px;
}
}
.course-index-carousel {
width: 100%;
padding: 20px;
}
}
.album-index-item {
width: 100%;
height: 260px;
padding: 10px;
position: relative;
margin: 10px 0;
.item-image {
width: 240px;
height: 240px;
position: absolute;
top: 10px;
left: 20px;
border-radius: 10px;
z-index: 99;
}
.borderImg {
width: 200px;
height: 200px;
position: absolute;
top: 30px;
left: 85px;
z-index: 0;
}
.image-shadow-first {
width: 14px;
height: 192px;
position: absolute;
top: 34px;
left: 260px;
box-sizing: border-box;
border: 1px solid #DCDCDC;
border-left: none;
border-radius: 0 6px 6px 0;
background-color: #F1F2F3;
}
.image-shadow-second {
width: 10px;
height: 144px;
position: absolute;
top: 58px;
left: 274px;
box-sizing: border-box;
border: 1px solid #DCDCDC;
border-left: none;
border-radius: 0 6px 6px 0;
background-color: #F1F2F3;
}
.tip-item-title {
width: 240px;
height: 240px;
position: absolute;
top: 10px;
left: 10px;
.item-complete-icons {
position: absolute;
bottom: 3px;
right: 8px;
z-index: 1000;
color: white;
font-size: .20rem;
}
}
.course-info-div {
width: 100%;
padding-left: 294px;
.info-title {
width: 100%;
height: 40px;
line-height: 38px;
font-size: 32px;
color: #333;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding-right: 12px;
}
.info-rate {
font-size: 16px;
color: #F79A58;
margin-top: 22px;
position: relative;
span {
font-size: 20px;
position: absolute;
top: 2px;
left: 152px;
}
}
.info-duration-num {
width: 100%;
height: 28px;
margin-top: 16px;
.info-duration,
.info-num {
height: 28px;
line-height: 28px;
font-size: 20px;
color: #9b9b9b;
}
.info-duration {
float: left;
}
.info-num {
float: right;
}
}
.overed-block-cancel {
background-color: #E2FEF2;
color: #56D39C;
width: 1rem;
height: 0.36rem;
font-size: 0.24rem;
text-align: center;
line-height: 0.36rem;
border-radius: .1rem;
margin-top: 0.16rem;
}
.overed-block-ok {
background-color: #F1F1F9;
color: #999999;
width: 1rem;
height: 0.36rem;
font-size: 0.24rem;
text-align: center;
line-height: 0.36rem;
border-radius: .1rem;
margin-top: 0.16rem;
}
.album-index-duration {
height: 0.32rem;
margin-top: 0.16rem;
width: 100%;
color: #999999;
font-size: 0.24rem;
line-height: 0.32rem;
}
.icon-index-studyNum {
height: 0.38rem;
margin-top: 0.16rem;
width: 100%;
color: #999999;
font-size: 0.26rem;
line-height: 0.32rem;
// vertical-align: text-top;
}
}
}
\ No newline at end of file
src/components/albumClassify/classify/index.jsx deleted 100644 → 0
import React, {Component} from 'react';
import {Icon} from 'antd';
import './style.less';
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import { getAlbumClassify } from '../../../redux/action/album/albumClassify.js';
import { get_album_get_strategy } from '../../../redux/action/album/albumList';
import Iconfont from '../../../common/iconfontcomponent/index'
import {hashHistory} from 'react-router';
import func from '../../../util/commonFunc.js';
import intl from 'react-intl-universal';
class CourseClassifyList extends Component {
constructor (props) {
super (props);
this.state = {
tabTip: "0", //0平铺式 1展开式
classifyData: []
};
}
componentDidMount () {
const _this = this;
_this.props.get_album_get_strategy((res)=>{
if(res.code == 1000){
if(res.data.status == 1){ //0为不显示 1为显示
_this.setState({
tabTip: res.data.type
}, () => {
_this.handleClassify();
})
}
}
})
}
handleClassify = () => {
const _this = this;
this.props.getAlbumClassify((res)=>{
_this.setState({
classifyData: res
})
})
}
render () {
const { tabTip, classifyData } = this.state;
return (
<div className="course-classify-list-container">
{
tabTip == 1 ? //0平铺式 1展开式
<CourseClassifyTab data={classifyData}/>
:
<AlbumUnfold data={classifyData}/>
}
<div style={{clear: 'both'}} />
</div>
);
}
}
const mapStateToProps = state => {
const {albumList={}, albumClassify={}} = state;
const { albumClassifyList, albumGetStrategy } = albumList;
const { albumUpdateStrategyId } = albumClassify;
return {
albumClassifyList,
albumGetStrategy,
albumUpdateStrategyId
};
};
const mapDispatchToProps = dispatch => {
return {
getAlbumClassify: bindActionCreators (getAlbumClassify, dispatch),
get_album_get_strategy: bindActionCreators (get_album_get_strategy, dispatch),
};
};
export default connect (mapStateToProps, mapDispatchToProps) (
CourseClassifyList
);
class CourseClassifyTab extends Component {
constructor (props) {
super (props);
this.state = {
data: props.data,
spaceData: [],
activeDataId: "",
mainData: {}
}
}
componentDidMount(){
}
componentWillReceiveProps(nextProps){
if(this.props.data !== nextProps.data){
let menuList = [];
menuList = nextProps.data.filter(item=>{
return item.layer == 1
})
menuList.forEach((item)=>{
nextProps.data.map((itsCh)=>{
if(itsCh.layer == 2 && itsCh.rootId == item.id){
item.children.push(itsCh)
}
})
})
menuList.forEach((item)=>{
item.children.forEach((itsTwo)=>{
nextProps.data.map((itsThree)=>{
if(itsThree.layer == 3 && itsThree.parentId == itsTwo.id){
itsTwo.children.push(itsThree)
}
})
})
})
this.setState({
data: menuList,
activeDataId: menuList[0]['id']
})
}
}
blockContent = () => {
let mainArr = this.state.data.filter((item)=>{
return item.id == this.state.activeDataId
})
if(mainArr.length != 0){
let mainData = mainArr[0].children;
if(mainData.length == 0){
return null;
} else {
let classifyBlock = mainData.map((item)=>{
return (
<div className="main-content-item-album-classify">
<div className="main-content-item-title">
{/* <Icon style={{marginRight: '10px', color: '#4285F4', position: 'relative', top: '-0.09rem'}} type="qrcode" /> */}
<Iconfont style={{fontSize: 30, marginRight: '5px', display: 'block', float: 'left', marginTop: '6px'}} type='icon-album-classificationmark'/>
<span className="title-content">{item.name}</span>
<div onClick={()=>this.handleClassifysChange(item)} className="item-title-right">
<span>{intl.get("all") || "全部"}</span>
<Icon type="right" />
</div>
</div>
<div className="item-content-continer-album"
style={{
display: 'flex',
justifyContent: 'flex-start',
flexDirection: 'row',
flexWrap: 'wrap'
}}>
{this.handleClassify(item)}
</div>
</div>
)
})
return classifyBlock;
}
} else {
return null;
}
}
handleClassify = (item) => {
let classifyClassify = [];
classifyClassify = item.children.length != 0 && item.children.map((its, index)=>
(<div onClick={()=>this.handleClassifysChange(its)} className="main-item-btn-classify">
<span className="album-classify-span" style={{WebkitBoxOrient: 'vertical'}}>
{
its.name
}
</span>
</div>)
)
return classifyClassify
}
handleClassifysChange = (item) => {
hashHistory.push({
pathname: func.routerBefore() + '/AlbumClaList',
query:{
id: item.id
}
})
}
siderClick = (data) => {
this.setState({
activeDataId: data
})
}
siderItem = () => {
const { data } =this.state;
if(data.length == 0){
return null;
}
let cache = data.map((item, index)=>{
return(
<div onClick={()=>this.siderClick(item.id)} className={item.id == this.state.activeDataId ? "album-sider-item item-active" : "album-sider-item"}>
<span>{item.name.length>10?`${item.name.substring(0, 9)}...`:`${item.name}`}</span>
</div>
)
})
return cache;
}
render () {
const { activeDataId } = this.state;
return (
<div className="course-classify-connect">
<div className="course-classify-tab-sider">
{this.siderItem()}
</div>
<div className="course-classify-tab-main">
<div className="course-classify-tab-main-header">
<div onClick={()=>this.handleClassifysChange({id: activeDataId})} className="header-btn">{intl.get("all") || "全部"}</div>
</div>
{this.blockContent()}
</div>
</div>
);
}
}
class AlbumUnfold extends Component {
constructor (props) {
super (props);
}
handleClassChange = (item) => {
hashHistory.push({
pathname: func.routerBefore() + '/AlbumClaList',
query:{
id: item.id
}
})
}
render(){
const { data } = this.props;
let cacheList = [];
cacheList = data && data.length != 0 ? data.map((item)=>{
return (
<div onClick={()=>this.handleClassChange(item)} className="album-classify-fold-item">{item.name.length > 12 ? `${item.name.substring(0, 10)}...`:item.name}</div>
)
})
:[];
return(
<div>
<div className="album-classify-fold-header">{intl.get("Album2") || "专辑分类"}</div>
{cacheList.length != 0 && <div className={(cacheList.length)%3 == 0 ? "album-classify-fold-content" : "album-classify-fold-content album-classify-fold-after"}>
{cacheList}
{(cacheList.length)%3 != 0 && <div style={{background: 'none'}} className="album-classify-fold-item"></div>}
</div>}
</div>
)
}
}
src/components/albumClassify/classify/style.css deleted 100644 → 0
.course-classify-list-container {
width: 100%;
height: 100%;
}
.course-classify-list-container .course-classify-tab-container {
width: 200px;
height: 100%;
background-color: #F5F8FD;
overflow-x: hidden;
overflow-y: scroll;
float: left;
}
.course-classify-list-container .course-classify-tab-container .tab-list {
width: 220px;
padding-right: 20px;
}
.course-classify-list-container .course-classify-tab-container .tab-list .course-classify-tab-item {
width: 200px;
padding: 32px 40px 32px 20px;
position: relative;
}
.course-classify-list-container .course-classify-tab-container .tab-list .course-classify-tab-item .tab-item-text {
width: 100%;
text-align: left;
display: -webkit-box;
-webkit-line-clamp: 2;
overflow: hidden;
line-height: 36px;
word-break: break-all;
font-size: 28px;
color: #4a4a4a;
}
.course-classify-list-container .course-classify-tab-container .tab-list .course-classify-tab-item .has-child-icon {
font-size: 26px;
width: 32px;
color: #000;
text-align: left;
position: absolute;
right: 0;
top: 0;
}
.course-classify-list-container .course-classify-tab-container .tab-list .course-classify-tab-item .has-child-icon i {
position: absolute;
left: 0;
top: 50%;
margin-top: -13px;
}
.course-classify-list-container .course-classify-tab-container .tab-list .item-active {
background-color: #fff;
}
.course-classify-list-container .course-classify-tab-container .tab-list .item-active .active-left-border {
position: absolute;
left: 0;
top: 0;
width: 6px;
background-color: #4285f4;
}
.course-classify-list-container .course-classify-children-container {
height: 100%;
float: right;
padding: 0 40px;
overflow-y: auto;
}
.course-classify-list-container .course-classify-children-container .children-container {
width: 100%;
}
.course-classify-list-container .course-classify-children-container .children-container .classify-children-all {
width: 100%;
height: 80px;
background-color: #F5F8FD;
margin-top: 20px;
font-size: 28px;
color: #4a4a4a;
line-height: 78px;
text-align: center;
border-radius: 10px;
}
.course-classify-list-container .course-classify-children-container .children-container .classify-children-title {
width: 100%;
height: 40px;
margin-top: 20px;
font-size: 32px;
color: #030303;
line-height: 38px;
text-align: left;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.course-classify-list-container .course-classify-children-container .children-container .classify-children-half-container {
width: 100%;
}
.course-classify-list-container .course-classify-children-container .children-container .classify-children-half-container .classify-children-half {
height: 120px;
background-color: #F5F8FD;
margin-top: 20px;
padding-left: 26px;
padding-right: 26px;
padding-top: 24px;
}
.course-classify-list-container .course-classify-children-container .children-container .classify-children-half-container .classify-children-half .half-text {
font-size: 28px;
color: #4a4a4a;
text-align: center;
line-height: 36px;
width: 100%;
display: -webkit-box;
-webkit-line-clamp: 2;
overflow: hidden;
word-break: break-all;
}
.course-classify-list-container .course-classify-children-container .recommend-title {
width: 100%;
height: 84px;
padding-top: 20px;
line-height: 44px;
font-size: 32px;
color: #030303;
}
.course-classify-list-container .course-classify-children-container .recommend-course-item {
width: 100%;
height: 172px;
padding: 20px 0;
padding-left: 220px;
position: relative;
}
.course-classify-list-container .course-classify-children-container .recommend-course-item .recommend-course-item-image {
width: 220px;
height: 132px;
border-radius: 14px;
position: absolute;
left: 0;
top: 20px;
}
.course-classify-list-container .course-classify-children-container .recommend-course-item .recommend-course-item-title {
width: 100%;
padding-left: 20px;
font-size: 28px;
color: #333;
height: 80px;
line-height: 40px;
display: -webkit-box;
-webkit-line-clamp: 2;
overflow: hidden;
word-break: break-all;
}
src/components/albumClassify/classify/style.less deleted 100644 → 0
@import "../../../static/theme.less";
.course-classify-list-container {
width: 100%;
height: 100%;
.album-classify-fold-header {
width: 100%;
font-size: .28rem;
color: #666666;
padding: .32rem;
}
.album-classify-fold-content {
background: #fff;
width: 100%;
margin-top: -10px;
padding: 0 0.1rem;
display: flex;
flex-direction:row;
flex-wrap: wrap;
justify-content: space-around;
.album-classify-fold-item{
text-align: center;
display: flex;
align-items: center;
justify-content: center;
width: 220px;
height: 0.92rem;
background-color: #F7F8F9;
padding-left: 0.3rem;
padding-right: 0.3rem;
margin-top: 0.16rem;
font-size: 0.24rem;
word-break: break-all;
}
}
.album-classify-fold-after::after{
content: '';
width: 220px;
}
.course-classify-connect{
width: 100%;
height: 100%;
display: flex;
.course-classify-tab-sider{
width: 2rem;
height: 100%;
background-color: #F7F8F9;
overflow-x: hidden;
overflow-y: scroll;
color: #4A4A4A;
font-size: 28px;
.album-sider-item{
width: 100%;
height: 1.2rem;
text-align: center;
line-height: 1.2rem;
box-sizing: border-box;
display: flex;
// align-items: center;
justify-content: center;
// overflow: hidden;
// text-overflow:ellipsis;
// display: -webkit-box;
// -webkit-line-clamp: 2;
// -webkit-box-orient: vertical;
padding: 0 8px;
flex-direction: column;
span{
display: block;
width: 100%;
line-height: 0.5rem;
padding: 0 10px 0 10px;
}
}
.item-active{
box-sizing: border-box;
border-left: 6px solid @themeColor;
color: @themeColor;
background-color: #fff;
}
}
.course-classify-tab-main{
flex: 1;
height: 100%;
overflow-x: scroll;
overflow-y: scroll;
.course-classify-tab-main-header{
width: 100%;
padding: .3rem .2rem;
.header-btn{
background-color: #ECF3FE;
width: 240px;
height: 92px;
border-radius: 10px;
font-size: .24rem;
text-align: center;
line-height: 92px;
color: @themeColor;
}
}
.main-content-item-album-classify{
padding: 0 .2rem;
margin-top: .32rem;
.main-content-item-title{
width: 100%;
height: .4rem;
font-size: 28px;
color: #666666;
margin-bottom: .3rem;
font-weight: bold;
.item-title-right{
float: right;
height: 100%;
padding: 0;
font-size: 24px;
color: #999999;
}
.title-content{
height: .4rem;
width: 76%;
display: inline-block;
overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
}
}
.item-content-continer-album{
display: flex;
// justify-content: flex-start;
justify-content: space-around;
flex-direction: row;
flex-wrap: wrap;
.main-item-btn-classify{
width: 50%;
height: 1.2rem;
background-color: #F7F8F9;
color: #4A4A4A;
line-height: 1.2rem;
padding: 10px;
border: 1px solid #E7E8E9;
border-radius: 10px;
font-size: 24px;
display: flex;
justify-content: center;
flex-direction: column;
text-align: center;
span.album-classify-span{
// line-height: 0.5rem;
// overflow: hidden;
// text-overflow:ellipsis;
// display: -webkit-box;
// -webkit-box-orient: vertical;
// -webkit-line-clamp: 2;
// padding: 0 20px;
line-height: .5rem;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
padding: 0 20px;
/* autoprefixer: ignore next */
-webkit-box-orient: vertical;
}
}
}
}
}
}
}
\ No newline at end of file
src/components/albumClassify/index.jsx deleted 100644 → 0
import React, { Component } from 'react';
import './style.less';
import intl from 'react-intl-universal';
import { bindActionCreators } from 'redux';
import { Rate } from 'antd';
import Mycarousel from '../common/courseCarousel';
import DyList from '../../common/DyList/dyList';
import { connect } from 'react-redux';
import { course_main_banner, course_list } from '../course/redux/CourseActions';
import {getCourseClassifyName} from "../../redux/action/course/courseClassify";
import { hashHistory } from 'react-router';
import func from '../../util/commonFunc.js';
class CourseIndex extends Component {
constructor(props) {
super(props);
this.state = {
banner: [],
courseList: [],
courseTotal: 0,
isLoading: false,
hasMore: true,
pageMode: 'list',
pageNo: 1,
pageSize: 10,
classifyId: '',
hasFootTab:true
};
this.getCourseList = this.getCourseList.bind(this);
this.reachToEnd = this.reachToEnd.bind(this);
this.renderRow = this.renderRow.bind(this);
this.toCourseSearch = this.toCourseSearch.bind(this);
}
componentDidMount() {
alert("@#@")
//上线后删除原menucourse模块
let _this = this;
if(document.getElementsByClassName("index-tab-bar-container").length>0){
this.setState({
hasFootTab:true
});
}else{
this.setState({
hasFootTab:false
});
}
if (location.hash.includes('/courseindex') || location.hash.includes('/menucourse')) {
this.props.course_main_banner(() => {
const { banner } = _this.props;
_this.setState({
banner,
});
});
this.getCourseList(1);
this.setState({ pageMode: location.hash.includes('/menucourse') ? 'menuindex' : 'index' });
} else {
const { classifyName, id } = this.props.location.query;
if(classifyName){
document.title = decodeURIComponent(classifyName);
}else{
this.props.getCourseClassifyName(id,(data)=>{
document.title = data;
})
}
this.setState(
{
classifyId: id,
},
() => {
_this.getCourseList(1);
}
);
}
}
getCourseList(pageNo) {
let _this = this;
let { courseList, classifyId } = this.state;
this.setState({ isLoading: true });
this.props.course_list({ type: 1, classifyId, pageNo, pageSize: 10 }, () => {
const { list } = _this.props;
_this.setState(
{
courseList: pageNo == 1
? list.records
: courseList.concat(list.records),
courseTotal: list.total || 0,
pageNo,
isLoading: false,
},
() => {
const { courseList, courseTotal, pageNo, pageSize } = _this.state;
_this.setState({
hasMore: courseList.length < courseTotal
? true
: false,
});
}
);
});
}
reachToEnd() {
const { pageNo, isLoading, hasMore } = this.state;
if (isLoading || !hasMore) {
return;
}
this.getCourseList(pageNo + 1);
}
courseitemClick(id) {
hashHistory.push({
pathname: func.routerBefore() + '/courseplay',
query: {
id: id,
},
});
}
toCourseSearch() {
const {classifyId} = this.state;
hashHistory.push({
pathname: func.routerBefore() + '/search',
query: {
type: 'course',
classifyId
},
});
}
toCourseClassify() {
hashHistory.push({
pathname: func.routerBefore() + '/courseClassify',
});
}
renderRow(rowData) {
let courseInfo = {
image: rowData.image,
name: rowData.name,
rate: rowData.level || 5,
duration: rowData.duration || 0,
studyNum: rowData.totalDuration || 0,
courseDurationShow: rowData.courseDurationShow,
studentStatus:parseInt(rowData.studentStatus)
};
return (
<CourseIndexItem
item={courseInfo}
itemClick={() => this.courseitemClick(rowData.courseId)}
/>
);
}
render() {
const carouselparam = {
height: '2.88rem',
radius: '0.2rem',
};
const { banner, isLoading, hasMore, courseList, pageMode,hasFootTab } = this.state;
let dyListHeight = document.body.clientHeight - 88;
let footerTabHeight = hasFootTab?99:0;
if (pageMode == 'index' && banner && banner.length > 0) {
dyListHeight = dyListHeight - 328;
}
if (pageMode == "menuindex" && banner && banner.length > 0) {
dyListHeight = dyListHeight - 328 - footerTabHeight;
} else if (pageMode == "menuindex" && banner && banner.length == 0) {
dyListHeight = dyListHeight - footerTabHeight;
}
return (
<div className="course-classify-index-container">
<CourseIndexHeader
toCourseSearch={this.toCourseSearch}
toCourseClassify={this.toCourseClassify}
/>
{banner && banner.length > 0
? <div className="course-index-carousel">
<Mycarousel carouselparam={carouselparam} data={banner || []} />
</div>
: ''}
<DyList
id={'course-index-list'}
height={dyListHeight}
isLoading={isLoading}
dataSource={courseList}
renderRow={this.renderRow}
reachToEnd={this.reachToEnd}
hasMore={hasMore}
distanceToEnd={100}
noDataText={intl.get("PublishKey47") || '没有更多了'}
/>
</div>
);
}
}
const mapStateToProps = state => {
const { CourseReducer = {} } = state;
// 新增 pageTotal 用来判断是否还有数据
const { banner, list } = CourseReducer;
return {
banner,
list,
};
};
const mapDispatchToProps = dispatch => {
return {
course_main_banner: bindActionCreators(course_main_banner, dispatch),
course_list: bindActionCreators(course_list, dispatch),
getCourseClassifyName:bindActionCreators(getCourseClassifyName,dispatch)
};
};
export default connect(mapStateToProps, mapDispatchToProps)(CourseIndex);
import courseClassifyHeaderIcon from './image/course-classify-icon.png';
import courseHeaderSearchIcon from './image/course-header-search-icon.png';
class CourseIndexHeader extends Component {
render() {
return (
<div className="course-index-header">
<img
src={courseClassifyHeaderIcon}
className="header-left-icon"
onClick={this.props.toCourseClassify}
/>
<div className="header-text" onClick={this.props.toCourseClassify}>
{intl.get('courseClassify')}
</div>
<img
src={courseHeaderSearchIcon}
className="header-right-icon"
onClick={this.props.toCourseSearch}
/>
</div>
);
}
}
class CourseIndexItem extends Component {
constructor(props) {
super(props);
}
rateSolve(rate) {
let floatRate = parseFloat(rate);
let pointBehind = floatRate * 10 % 10;
return Math.floor(floatRate) + (pointBehind > 0 ? 0.5 : 0.0);
}
render() {
const { item, itemClick } = this.props;
return (
<div className="course-index-item" onClick={itemClick}>
<img src={item.image} className="item-image" />
{
item.studentStatus == 1 ?
<div className="item-complete-icon">{intl.get("finished") || "已完成"}</div> : ""
}
<div className="course-info-div">
<div className="info-title">
{item.name}
</div>
<div className="info-rate">
<Rate
style={{ color: '#F79A58' }}
allowHalf
defaultValue={this.rateSolve(item.rate)}
/>
<span>{item.rate}</span>
</div>
<div className="info-duration-num">
<div className="info-duration">
{intl.get('courseTime') || "时长"}：{func.timeFormat(item.duration)}
</div>
{item.courseDurationShow
? <div className="info-num">
{intl.get('period') || "学时"}：{item.studyNum}
</div>
: ''}
</div>
</div>
</div>
);
}
}
src/components/albumClassify/style.css deleted 100644 → 0
.course-classify-index-container {
width: 100%;
height: 100%;
}
.course-classify-index-container .course-index-header {
width: 100%;
height: 88px;
box-shadow: 0px 0px 0px 0px rgba(199, 199, 199, 0.5);
border-bottom: 2px solid #c7c7c7;
position: relative;
}
.course-classify-index-container .course-index-header .header-text {
width: 100%;
height: 88px;
line-height: 86px;
font-size: 28px;
color: #333;
padding-left: 70px;
}
.course-classify-index-container .course-index-header .header-left-icon {
position: absolute;
width: 32px;
height: 32px;
top: 28px;
left: 30px;
}
.course-classify-index-container .course-index-header .header-right-icon {
position: absolute;
width: 32px;
height: 32px;
top: 28px;
right: 30px;
}
.course-classify-index-container .course-index-carousel {
width: 100%;
padding: 20px;
}
.course-classify-index-container .course-index-item {
width: 100%;
height: 192px;
padding: 30px 20px;
position: relative;
}
.course-classify-index-container .course-index-item .item-image {
width: 220px;
height: 132px;
position: absolute;
top: 30px;
left: 20px;
border-radius: 10px;
}
.course-classify-index-container .course-index-item .course-info-div {
width: 100%;
padding-left: 260px;
}
.course-classify-index-container .course-index-item .course-info-div .info-title {
width: 100%;
height: 40px;
line-height: 38px;
font-size: 32px;
color: #333;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.course-classify-index-container .course-index-item .course-info-div .info-rate {
font-size: 16px;
color: #F79A58;
margin-top: 22px;
position: relative;
}
.course-classify-index-container .course-index-item .course-info-div .info-rate span {
font-size: 20px;
position: absolute;
top: 2px;
left: 152px;
}
.course-classify-index-container .course-index-item .course-info-div .info-duration-num {
width: 100%;
height: 28px;
margin-top: 16px;
}
.course-classify-index-container .course-index-item .course-info-div .info-duration-num .info-duration,
.course-classify-index-container .course-index-item .course-info-div .info-duration-num .info-num {
height: 28px;
line-height: 28px;
font-size: 20px;
color: #9b9b9b;
}
.course-classify-index-container .course-index-item .course-info-div .info-duration-num .info-duration {
float: left;
}
.course-classify-index-container .course-index-item .course-info-div .info-duration-num .info-num {
float: right;
}
src/components/albumClassify/style.less deleted 100644 → 0
.course-classify-index-container {
width: 100%;
height: 100%;
.course-index-header {
width: 100%;
height: 88px;
box-shadow: 0px 0px 0px 0px rgba(199, 199, 199, 0.5);
border-bottom: 2px solid #c7c7c7;
position: relative;
.header-text {
width: fit-content;
height: 88px;
line-height: 86px;
font-size: 28px;
color: #333;
padding-left: 70px;
}
.header-left-icon {
position: absolute;
width: 32px;
height: 32px;
top: 28px;
left: 30px;
}
.header-right-icon {
position: absolute;
width: 32px;
height: 32px;
top: 28px;
right: 30px;
}
}
.course-index-carousel {
width: 100%;
padding: 20px;
}
.course-index-item {
width: 100%;
height: 192px;
padding: 30px 20px;
position: relative;
.item-image{
width: 220px;
height: 132px;
position: absolute;
top: 30px;
left: 20px;
border-radius: 10px;
}
.item-complete-icon{
position: absolute;
left: 20px;
top: 30px;
height: 32px;
line-height: 30px;
width: 108px;
background-color: #ffb53e;
color: #fff;
text-align: center;
font-size: 20px;
padding: 0 12px;
border-top-left-radius: 10px;
border-bottom-right-radius: 10px;
}
.course-info-div {
width: 100%;
padding-left: 260px;
.info-title {
width: 100%;
height: 40px;
line-height: 38px;
font-size: 32px;
color: #333;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.info-rate{
font-size: 16px;
color: #F79A58;
margin-top: 22px;
position: relative;
span{
font-size: 20px;
position: absolute;
top: 2px;
left: 152px;
}
}
.info-duration-num{
width: 100%;
height: 28px;
margin-top: 16px;
.info-duration,.info-num{
height: 28px;
line-height: 28px;
font-size: 20px;
color: #9b9b9b;
}
.info-duration{
float: left;
}
.info-num{
float: right;
}
}
}
}
}
\ No newline at end of file
src/components/albumCommentDetail/style.less deleted 100644 → 0
.comment-commet{
width: 100%;
.detail-content-main{
width: 100%;
font-size: 30px;
color: #4A4A4A;
font-weight: 6px;
padding: 22px 30px;
.header-time{
font-size: 24px;
color: #9B9B9B;
}
}
.comment-detail-main-header{
height: 92px;
width: 100%;
padding: 22px 30px;
font-size: 32px;
color: #4A4A4A;
}
.comment-detail-footer{
width: 100%;
height: 100px;
border-top: 1px solid #4A4A4A;
position: fixed;
left: 0;
bottom: 0;
background-color: #fff;
border-bottom: 10px solid #fff;
.comment-detail-footer-input{
width: 90%;
height: 60px;
margin-top: 20px;
margin-left: 5%;
background-color: #F4F4F4;
border-radius: 30px;
padding-left: 36px;
font-size: 28px;
color: #9B9B9B;
line-height: 60px;
}
}
.left{float: left;}
.right{float: right;}
.both{clear: both;}
}
.reply-continer{
width: 100%;
height: 355px;
background-color: #fff;
.reply-continer-header{
width: 100%;
height: 60px;
font-size: 34px;
color: #4A4A4A;
padding-top: 10px;
padding-left: 28px;
}
.reply-continer-main{
width: 100%;
height: 295px;
.reply-continer-main-input{
background-color: #F4F4F4;
width: 90%;
margin-top: 20px;
margin-left: 5%;
color: #333333;
font-size: 28px;
border: none !important;
}
.reply-continer-main-btn{
width: 90%;
margin-left: 5%;
margin-top: 22px;
position: relative;
.reply-right{
// float: right;
display: inline-block;
position: absolute !important;
right: 0 !important;
top: 0;
font-size: 28px !important;
color: #fff;
.ant-btn{
line-height: 0.66rem;
height: 0.66rem;
padding: 0 0.5rem;
font-size: 0.28rem;
border-radius: 0.15rem;
}
}
}
}
}
.more-button-modal {
position: absolute!important;
}
\ No newline at end of file
src/components/albumDetail/IntroTab.jsx deleted 100644 → 0
import React, { Component } from 'react';
import NoCourse from '../../components/course/nocourse/nocourse';
import './introTab.less';
import intl from "react-intl-universal";
class IntroTab extends Component{
render(){
const { dangerousHtml } =this.props;
let showContent = dangerousHtml ? false : true;
return(
<div className="detail-content-intro">
<div className="detail-content-intro-sentence">
<div dangerouslySetInnerHTML = {{__html:dangerousHtml}} ></div>
</div>
{showContent && <NoCourse text={intl.get("NoDataYet")} />}
</div>
)
}
}
export default IntroTab;
\ No newline at end of file
src/components/albumDetail/ProductTab.jsx deleted 100644 → 0
import React, { Component } from 'react';
import DyList from '../../common/DyList/dyList';
import func from '../../util/commonFunc';
import API from '../../util/urlconfig';
import NoCourse from '../../components/course/nocourse/nocourse';
import NetWork from '../../util/fetchUtil';
import { hashHistory } from "react-router";
import './productTab.less';
import intl from 'react-intl-universal';
import noData from './noData.png'
class ContentTab extends Component {
constructor(props) {
super(props)
this.state = {
albumDataList: [],
isLoading: false,
hasMore: true,
pageNo: 1,
pageSize: 20,
pdfUrl: "",
}
}
componentDidMount() {
console.log('DataLibraryList-componentDidMount');
const { pageNo, pageSize } = this.state;
const albumDetailId = this.props.albumDetailId;
this.setState({ isLoading: true });
let paramsData = {
relationId: albumDetailId,
relationType: 3,
pageNo: pageNo,
pageSize: pageSize,
};
NetWork.getNetwork(API.dataLibraryList, paramsData, response => {
console.log('didmount-response', response)
let hasMore = response.data.records.length == 20 ? true : false;
this.setState({
albumDataList: response.data.records,
isLoading: false,
hasMore: hasMore,
});
});
}
reachToEnd = () => {
const albumDetailId = this.props.albumDetailId;
const { pageNo, pageSize, isLoading, hasMore, albumDataList } = this.state;
if (isLoading || !hasMore || albumDataList.length == 0) {
return;
} else {
this.setState({ isLoading: true });
let paramsData = {
relationId: albumDetailId,
relationType: 3,
pageNo: pageNo + 1,
pageSize: pageSize,
};
NetWork.getNetwork(API.dataLibraryList, paramsData, response => {
let hasMoreData = response.data.records.length == 20 ? true : false;
let newDataList = [];
newDataList = albumDataList.concat(response.data.records);
this.setState({
albumDataList: newDataList,
isLoading: false,
hasMore: hasMoreData,
});
});
}
};
downloadData = (itemId, fileType, fileUrl) => {
// console.log ('DataLibraryList-downloadData-itemId', fileUrl);
/* feature1123资料的预览或下载统一处理，zhouzhongyan20200526 start*/
// if(fileType === 'pdf'){
hashHistory.push({
pathname: func.routerBefore() + '/dataView',
query: {
id: itemId,
pdfUrl: 'dataLibraryDataDownload'
},
});
return
// }
let params = {
id: itemId, // 资料id
termialType: 2, //终端类型：1、PC；2、weixin；3、app；4、manage
};
// 957
// Toast.info("该文件格式不支持手机端在线预览，请登录PC端查看或下载。", 1);
NetWork.getNetwork(API.dataLibraryDataDownload, params, response => {
this.setState({ downloadingDataUrl: response.data });
// 是否转码isVideo=1是转码的
if (response.data.isVideo) {
if (response.data.videoSd) {
window.location.href = response.data.videoSd;
} else {
window.location.href = 'https://wmy-transcoding-origin.oss-cn-shanghai.aliyuncs.com/exerciseBook/o_1dq6odhe71ekh13vs1qo6cnprn27.png';
}
} else if (response.data.suffixName === 'pdf') {
this.setState({ pdfUrl: response.data.pdfUrl })
} else {
hashHistory.push({
pathname: func.routerBefore() + '/browserdownload',
query: {
fileUrl: encodeURIComponent(fileUrl),
},
});
}
});
/* feature1123资料的预览或下载统一处理，zhouzhongyan20200526 end*/
};
render() {
const bodyHeight = document.body.clientHeight;
const { albumDataList, hasMore, isLoading } = this.state;
let screenHeight = document.body.clientHeight;
let dataLibraryHeight = screenHeight;
const row = (rowData, sectionID, rowID) => {
let dataName = rowData.name;
let fileName = rowData.fileName;
let index = fileName.lastIndexOf('.');
let fileType = fileName.substring(index + 1, fileName.length);
let copyFileType = fileName.substring(index + 1, fileName.length);
if (dataName) {
if (dataName.length >= 16) {
dataName = dataName.substring(0, 16) + '....';
} else {
fileType = '.' + fileType;
}
} else {
dataName = '';
}
return (
<div
className="data_library_list_row_container1"
onClick={() =>
this.downloadData(rowData.id, copyFileType, rowData.url)}
>
<div className="data_library_list_row_description_item">
{`${dataName}${fileType}`}
<div className="data_library_list_row_sub_item">
{` / ${rowData.fileSizeName}`}
</div>
</div>
<div className="data_library_list_line"></div>
</div>
);
};
if (this.state.pdfUrl) {
return <div className={'pdfUrl-box'} dangerouslySetInnerHTML={{ __html: this.state.pdfUrl }}>
</div>
} else {
return (
<div className="data_library_list_container_product" style={{ minHeight: bodyHeight - 412 + 'px', borderBottom: albumDataList && albumDataList.length > 0 ? 'border-bottom: 0.02rem solid #e3e5e8' : 'none' }}>
{albumDataList && albumDataList.length > 0
? <div className="data_library_list_header_product">{`${intl.get("currentDocNum") || "当前资料数"}(${albumDataList.length})`}</div>
: ''}
<div className="data_library_list_body">
{albumDataList && albumDataList.length > 0
? <DyList
id={'data_library_list'}
height={dataLibraryHeight}
isLoading={isLoading}
dataSource={albumDataList}
renderRow={row}
reachToEnd={this.reachToEnd}
customBackgroundColor={'#ffffff'}
hasMore={hasMore}
distanceToEnd={100}
noFooter={true}
/>
:
<div className="data_library_list_nodata">
<div>
{/* <img src={noData} alt="" /> */}
<NoCourse />
</div>
<div>
{intl.get("noDocument") || "无相关资料"}
</div>
</div>
}
</div>
</div>
);
}
}
}
export default ContentTab;
src/components/albumDetail/commentTab.less deleted 100644 → 0
@import "../../static/theme.less";
.detail-content-commet{
width: 100%;
word-break: break-all;
.content-commet-write{
width: 100%;
height: 162px;
padding: 52px 10px 52px 20px;
border-bottom: 1px solid #F3F3F3;
.write-content{
width: 100%;
height: 60px;
display: flex;
.commet-write-image{
margin-left: 20px;
width: 60px;
height: 60px;
text-align: center;
line-height: 60px;
img{
width: 40px;
height: 40px;
}
}
.commet-write-input{
height: 60px;
flex: 1;
margin-left: 10px;
margin-right: 26px;
background-color: #F4F4F4;
color: #999999;
font-size: 24px;
border-radius: 30px;
padding-left: 36px;
line-height: 60px;
}
}
}
.detail-content-main{
width: 100%;
height: 92px;
font-size: 32px;
color: #4A4A4A;
font-weight: 6px;
padding: 22px 30px;
}
.reply-content{
line-height: 40px;
max-height: 240px;
overflow: hidden;
text-overflow:ellipsis;
display: -webkit-box;
-webkit-line-clamp: 6;
-webkit-box-orient: vertical;
}
.left{float: left;}
.right{float: right;}
.both{clear: both;}
}
.text-over-style{
line-height: 36px;
max-height: 216px;
overflow: hidden;
text-overflow:ellipsis;
display: -webkit-box;
-webkit-line-clamp: 6;
-webkit-box-orient: vertical;
}
.showAllLabel{
float: right;
margin-right: 0.2rem;
color: @themeColor;
}
.album-comment-modal{
.am-modal-content{
background-color: #FCFCFC !important;
.ant-input{
background-color: #FCFCFC !important;
border: none !important;
}
.ant-input:focus{
box-shadow: none !important;
}
}
.am-modal-footer{
background-color: #F4F4F4;
}
}
src/components/albumDetail/contentTab.less deleted 100644 → 0
.content-tab{
width: 100%;
padding: 0 20px;
.content-tab-header{
width: 100%;
height: 88px;
font-size: 24px;
color: #666666;
line-height: 88px;
.content-tab-header-left{
float: left;
}
.content-tab-header-right{
float: right;
.ant-divider-vertical{
width: 0.02rem;
height: 0.24rem;
}
}
.both{
clear: both;
}
}
.content-tab-content{
width: 100%;
// height: 300px;
background-color: #FAFAFA;
border-radius: 20px;
}
.no-auth-confirm-album {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
.no-auth-confirm-bg-album {
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.4);
}
.no-auth-confirm-modal-album {
width: 100%;
height: 270px;
background-color: #fff;
position: absolute;
left: 0;
top: 400px;
.confirm-header{
width: 100%;
height: 88px;
font-size: 24px;
color: #666666;
padding: 30px;
border-bottom: 1px solid #F3F3F3;
.content-tab-header-left{
float: left;
}
.content-tab-header-right{
float: right;
}
.both{
clear: both;
}
}
.confirm-content{
width: 100%;
height: 88px;
font-size: 24px;
color: #666666;
padding: 30px;
.menu{
margin-right: 16px;
}
div:first-child{
margin-bottom: 16px;
}
div:nth-child(2){
margin-bottom: 12px;
}
}
}
}
.contentContainer{
margin-left: 0.3rem;
margin-right: 0.3rem;
padding-top: 0.24rem;
padding-bottom: 0.24rem;
}
.rowNameHeader{
// display: flex;
// align-items: center;
// justify-content: space-between;
font-size: 0.28rem;
// line-height: 0.36rem;
color: #333333;
margin-right: 30px;
height: 82px;
line-height: 82px;
.album-theme-name{
float: left;
}
.isNew-icon{
margin-left: 20px;
width: 40px;
height: 40px;
position: relative;
top: -2px;
}
.album-theme-icon{
float: right;
}
}
.rowItemContainer{
display: flex;
align-items: center;
margin-left: 0.3rem;
margin-right: 0.3rem;
padding-top: 0.24rem;
padding-bottom: 0.24rem;
font-size: 0.28rem;
// line-height: 0.36rem;
color: #333333;
position: relative;
height: 104px;
.album-course-duration{
display: block;
position: absolute;
top: 76px;
left: 66px;
color:rgba(155,155,155,1);
font-size: 20px;
}
}
.rowItemContainer{
display: flex;
align-items: center;
margin-left: 0.3rem;
margin-right: 0.3rem;
padding-top: 0.24rem;
padding-bottom: 0.24rem;
font-size: 0.28rem;
line-height: 0.36rem;
color: #333333;
}
.itemName{
margin-left: 0.3rem;
max-width: 70%;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.displayNew{
margin-left: 0.06rem;
}
}
src/components/albumDetail/introTab.less deleted 100644 → 0
.detail-content-intro{
width: 100%;
padding: 30px 20px;
.detail-content-intro-img{
width: 710px;
margin-bottom: 30px;
}
.detail-content-intro-sentence{
font-size: 24px;
line-height: 36px;
p{
img,audio,video{
width: 100%;
}
}
}
}
\ No newline at end of file
src/components/albumDetail/productTab.less deleted 100644 → 0
.data_library_list_container_product {
width: 100%;
height: 100%;
background-color: #fff;
.data_library_list_row_container1 {
width: 100%;
height: 1.0rem;
margin-top: 0.02rem;
padding-left:30px;
padding-right:30px;
// border-bottom:1px solid #E3E5E8;
background-color:#fff;
}
.data_library_list_row_description_item {
width: 100%;
height: 100px;
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
line-height: 100px;
}
.data_library_list_row_sub_item {
display: inline-block;
height: 100px;
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
line-height: 100px;
}
.data_library_list_line{
height:1px;
width:100%;
background-color: #E3E5E8;
}
}
.data_library_list_header_product {
width: 100%;
height: 1.2rem;
display: flex;
flex: 1;
align-items: center;
font-size: 0.36rem;
line-height: 0.52rem;
color: #4A4A4A;
padding-left: 0.3rem;
padding-right: 0.3rem;
background: #F4F4F4;
}
.data_library_list_nodata {
width: 100%;
height: 100%;
font-size: 28px;
color: #666666;
margin: 40px 0px;
background: #fff;
text-align: center;
img {
margin-bottom: 60px;
}
}
.data_library_list_row_description_item {
width: 100%;
height: 0.36rem;
font-size: 0.24rem;
color: #666666;
}
.data_library_list_row_sub_item {
display: inline;
color: #999999;
}
\ No newline at end of file
src/components/albumDetail/style.less deleted 100644 → 0
@import "../../static/theme.less";
.detail-container{
width: 100%;
height: 100%;
background-color: #fff;
overflow-x: hidden;
overflow-y: scroll;
.detail-header{
width: 100%;
height: 328px;
padding: 38px 20px;
display: flex;
position: relative;
.detail-img{
width: 230px;
height: 230px;
border-radius: 10px;
}
.image-shadow-first{
width: 14px;
height: 182px;
position: absolute;
top: 62px;
left: 250px;
box-sizing: border-box;
border: 1px solid #DCDCDC;
border-left: none;
border-radius: 0 6px 6px 0;
background-color: #F1F2F3;
}
.image-shadow-second{
width: 10px;
height: 134px;
position: absolute;
top: 86px;
left: 264px;
box-sizing: border-box;
border: 1px solid #DCDCDC;
border-left: none;
border-radius: 0 6px 6px 0;
background-color: #F1F2F3;
}
.detail-titles{
flex: 1;
margin-left: 44px;
position: relative;
p{
min-height: 72px;
.someLineOverflow(2)
}
.detail-tip{
display: inline-block;
height: 36px;
width: 100px;
background-color: #E2FEF2;
font-size: 24px;
color: #54D39B;
line-height: 36px;
text-align: center;
border-radius: 10px;
margin-right: 20px;
}
.detail-tip-over{
background-color: #F1F1F9 !important;
color: #B7BAC0;
}
.detail-title-name{
line-height: 40px;
font-size: 32px;
font-weight: bold;
position: relative;
top: 5px;
}
.detail-header-content{
width: 100%;
height: 32px;
margin-top: 16px;
display: flex;
.detail-header-icon{
margin-right: 3px;
}
.detail-header-content-first{
display: inline-block;
// min-width: 90px;
color: #9B9B9B;
font-size: 24px;
margin-right: 10px;
}
// .detail-header-content-second{
// display: inline-block;
// // min-width: 90px;
// color: #9B9B9B;
// font-size: 24px;
// margin-right: 10px;
// margin-left: 80px;
// }
}
}
.detail-header-btn{
height: 60px;
width: 100%;
position: absolute;
right: 20px;
bottom: 60px;
text-align: center;
top: 170px;
div{
width: 380px;
height: 60px;
border-radius: 30px;
background-color: @themeColor;
font-size: 24px;
line-height: 60px;
margin: 0 auto;
color: #fff;
}
}
}
.detail-content{
width: 100%;
.tab-title{
width: 100%;
height: 84px;
display: flex;
flex-direction: row;
justify-content: space-around;
color: #666666;
border: 1px solid #F3F3F3;
border-left: none;
border-right: none;
padding: 0 20px 0 20px;
.tab-title-item{
flex: 1;
max-width: 1.6rem;
height: 84px;
text-align: center;
box-sizing: border-box;
font-size: 32px;
font-weight: 3px;
line-height: 84px;
letter-spacing: 3px;
}
.title-active{
border-bottom: 5px solid @themeColor;
color: @themeColor;
}
}
}
}
.album_detail_modal{
.am-modal-content{
border-radius: 30px !important;
.am-modal-footer{
height: 100px;
.am-modal-button-group-h{
border-top: 1px solid #ddd !important;
display: flex;
height: 100px;
a{
display: block !important;
flex: 1 !important;
height: 100%;
margin: 0;
};
a:first-child{
border-right: 1px solid #ddd !important;
}
}
}
}
}
src/components/browsingHistory/index.jsx
......@@ -3,15 +3,11 @@ import { ListView, SearchBar, Tabs } from 'antd-mobile';
import { Rate, Select, Popover, Icon } from 'antd';
import { hashHistory } from 'react-router';
import func from '../../util/commonFunc';
import DyList from '../../common/DyList/dyList';
import NoCourse from '../course/nocourse/nocourse';
import { connect } from 'react-redux';
import { bindActionCreators } from "redux";
import { myCollectionSearchAction, myCollectionMoreAction, myCaseCollectionList, myCaseCollectionListMore } from './action';
import './index.less'
import moment from 'moment';
import personImg from '../caselibrary/image/person.png';
import likeRawImg from '../caselibrary/image/like_raw.png';
import intl from 'react-intl-universal';
import Iconfont from '../../common/iconfontcomNew/index'
......@@ -122,9 +118,7 @@ class MyCollection extends React.Component {
</div>
<div className="case-favorite-right-bottom-container">
<div className="case-favorite-submit-time">{submitTime}</div>
<div className="case-favorite-study-img-div">
<img className="case-favorite-study-img" src={personImg} />
</div>
<div className="case-favorite-study-num">{rowData.studyNum}</div>
<div className="case-favorite-admire-img-div">
<Iconfont type='icon-numberoflikes' className='case-favorite-admire-img' />
......@@ -140,9 +134,7 @@ class MyCollection extends React.Component {
<div className="case-favorite-right-bottom-container">
<div className="case-favorite-item-author-name" style={{ margin: '0', width: '220px' }}>{rowData.authorFullName}</div>
<div className="case-favorite-submit-time">{submitTime}</div>
<div className="case-favorite-study-img-div">
<img className="case-favorite-study-img" src={personImg} />
</div>
<div className="case-favorite-study-num">{rowData.studyNum}</div>
<div className="case-favorite-admire-img-div">
<Iconfont type='icon-numberoflikes' className='case-favorite-admire-img' />
......@@ -194,30 +186,10 @@ class MyCollection extends React.Component {
onEndReachedThreshold={10}
/>
:
<NoCourse text={intl.get("mycaselibrary55") || "我还没有浏览过内容"} />
"我还没有浏览过内容"
}
</div>
case "2":
return <div>
{
caseList && caseList.length > 0 ?
<DyList
id={"case-favorite-list"}
isLoading={false}
height={this.state.height}
dataSource={caseList}
renderRow={caseRow}
reachToEnd={this.reachToEnd}
customBackgroundColor={"#F4F4F4"}
hasMore={hasCaseMore}
distanceToEnd={100}
noFooter={false}
/>
:
<NoCourse text={intl.get("mycaselibrary55") || "我还没有浏览过内容"} />
}
</div>
}
}
......
src/components/caselibrary/CaseCategoryViewLayout.less deleted 100644 → 0
.CaseCategoryViewLayout {
position: absolute;
top: 1.70rem;
left: 0;
right: 0;
bottom: 0;
height: 100%;
background: rgba(0, 0, 0, 0.65);
}
.CaseCategoryViewLayout_searchStyle {
top: 0.70rem;
}
\ No newline at end of file
src/components/caselibrary/CaseLibraryDetailCSS.css deleted 100644 → 0
.commentBody .am-list-item {
padding-left: 0.2rem;
background-color: #f4f4f4;
}
.commentBody .am-textarea-control textarea {
font-size: 0.28rem;
text-align: left;
color: #333333;
}
.tip-off-reason-label {
height: 0.36rem;
margin-bottom: 0.2rem;
line-height: 0.36rem;
font-size: 0.28rem;
text-align: left;
color: #333333;
}
.tip-off-reason-container .am-list-item {
padding-left: 0.16rem;
border: 0.02rem solid #dddddd;
border-radius: 0.04rem;
}
.tip-off-reason-container .am-textarea-control textarea {
height: 0.86rem;
line-height: 0.32rem;
font-size: 0.24rem;
text-align: left;
color: #000000;
}
.tip-off-img-container {
width: 0.92rem;
height: 0.92rem;
}
.file-upload-img-container {
position: relative;
}
.fileUploadedImgDiv {
display: flex;
align-items: center;
justify-content: center;
width: 0.92rem;
height: 0.92rem;
background-color: #ffffff;
border: 0.01rem solid #000000;
}
.fileUploadDeleteCover {
position: absolute;
top: 0.02rem;
right: 0.02rem;
width: 0.32rem;
height: 0.32rem;
}
.tip-off-img-label {
height: 0.32rem;
margin-top: 0.2rem;
line-height: 0.32rem;
font-size: 0.24rem;
text-align: left;
color: #333333;
}
.tip-off-icon-container {
display: flex;
align-items: center;
justify-content: center;
margin-top: 0.2rem;
width: 0.92rem;
height: 0.92rem;
border: solid 0.01rem #c6c6c6;
}
.tip-off-modal-upload-container {
height: 1.5rem;
line-height: 1.5rem;
}
.headerBanner {
width: 100%;
height: 4.5rem;
}
.caseTitleContainer {
display: flex;
}
.caseScoreImgContainer {
margin-left: 0.98rem;
margin-top: 0.24rem;
position: relative;
}
.caseScoreImg {
width: 1.08rem;
height: 1.08rem;
}
.caseScoreDiv {
position: absolute;
top: 0.15rem;
left: 0.1rem;
right: 0.1rem;
font-size: 0.48rem;
color: #4285f4;
}
.caseScoreDivSubContainer {
display: flex;
justify-content: center;
}
.titleContainerDiv {
margin-top: 0.3rem;
margin-left: 0.3rem;
width: 64%;
height: 0.8rem;
line-height: 0.4rem;
font-size: 0.32rem;
text-align: left;
color: #333333;
}
.titleContainerDivWithoutScore {
margin-top: 0.3rem;
margin-left: 0.3rem;
width: 92%;
height: 0.8rem;
line-height: 0.4rem;
font-size: 0.32rem;
text-align: left;
color: #333333;
}
.authorContainerDiv {
margin-left: 0.3rem;
display: flex;
align-items: center;
justify-content: flex-start;
height: 0.4rem;
line-height: 0.4rem;
font-size: 0.24rem;
text-align: left;
color: #333333;
}
.authorContainerDivWithoutScore {
margin-left: 0.3rem;
margin-top: 0.24rem;
display: flex;
align-items: center;
justify-content: flex-start;
height: 0.4rem;
line-height: 0.4rem;
font-size: 0.24rem;
text-align: left;
color: #333333;
}
.headerSeparatorLine {
margin-left: 0.3rem;
margin-right: 0.3rem;
margin-bottom: 0.26rem;
margin-top: 0.24rem;
display: flex;
flex: 1;
height: 0.02rem;
background-color: #efeff4;
}
.renderContent {
margin-bottom: 0.46rem;
margin-left: 0.3rem;
margin-right: 0.3rem;
}
.renderContent img,
.renderContent video,
.renderContent audio {
width: 100%;
}
.separator {
width: 100%;
height: 0.2rem;
background-color: #eeeeee;
}
.attachmentHeader {
width: 100%;
height: 1rem;
padding-left: 0.3rem;
padding-top: 0.3rem;
padding-bottom: 0.3rem;
font-size: 0.32rem;
text-align: left;
color: #000000;
}
.attachmentItem {
display: flex;
align-items: center;
height: 1rem;
margin-left: 0.3rem;
margin-right: 0.3rem;
font-size: 0.28rem;
text-align: left;
color: #666666;
border-top: 0.01rem solid #e3e5d8;
}
.attachmentItemInlineDiv {
display: inline;
line-height: 0.36rem;
font-size: 0.28rem;
text-align: left;
color: #999999;
}
/*评论*/
.commentsHeader {
width: 100%;
height: 1rem;
padding-left: 0.3rem;
padding-top: 0.3rem;
padding-bottom: 0.3rem;
font-size: 0.32rem;
text-align: left;
color: #4a4a4a;
border-bottom: 0.02rem solid #eeeeee;
}
.commentsBody {
display: flex;
align-items: flex-start;
justify-content: flex-start;
}
.commenterContainer {
margin-left: 0.3rem;
margin-top: 0.3rem;
}
.commenterImage {
width: 0.78rem;
height: 0.78rem;
border-radius: 0.39rem;
}
.commentsRightPartsContainer {
margin-left: 0.1rem;
margin-top: 0.3rem;
}
.commenter {
height: 0.34rem;
line-height: 0.34rem;
font-size: 0.24rem;
text-align: left;
color: #333333;
}
.content {
margin-top: 0.44rem;
font-size: 0.24rem;
text-align: justify;
color: #333333;
}
.commentsSubContainer {
display: flex;
align-items: flex-start;
justify-content: flex-start;
margin-top: 0.2rem;
}
.commentTime {
height: 0.34rem;
font-size: 0.24rem;
text-align: left;
color: #9b9b9b;
}
.commentsCount {
height: 0.34rem;
margin-left: 1.42rem;
font-size: 0.24rem;
text-align: right;
color: #333333;
opacity: 0.65;
}
.commentRevertImgContainer {
height: 0.34rem;
display: flex;
align-items: flex-end;
margin-left: 0.08rem;
}
.commentRevertImgStyle {
width: 0.28rem;
height: 0.26rem;
}
.commentsThumbUpCount {
height: 0.34rem;
margin-left: 0.6rem;
font-size: 0.24rem;
color: #333333;
opacity: 0.65;
}
.commentLaudImgContainer {
height: 0.34rem;
display: flex;
align-items: center;
margin-left: 0.08rem;
}
.commentLaudImgStyle {
width: 0.26rem;
height: 0.28rem;
}
.commentsEmpty {
display: flex;
height: 1rem;
align-items: center;
justify-content: center;
font-size: 0.24rem;
text-align: left;
color: #929292;
}
.commentSeparator {
display: flex;
flex: 1;
height: 0.04rem;
margin-left: 0.3rem;
margin-top: 0.2rem;
margin-right: 0.3rem;
background-color: #f6f6f6;
}
.replyContainer {
margin-left: 1.18rem;
margin-top: 0.3rem;
margin-right: 0.3rem;
padding-bottom: 0.2rem;
background-color: #f4f4f4;
border-radius: 0.04rem;
}
.replier {
height: 0.34rem;
margin-left: 0.2rem;
margin-top: 0.1rem;
margin-right: 0.2rem;
font-size: 0.24rem;
text-align: left;
color: #4a90e2;
}
.replyContent {
margin-left: 0.2rem;
margin-top: 0.1rem;
margin-right: 0.2rem;
font-size: 0.26rem;
text-align: left;
color: #333333;
}
.moreReplies {
height: 0.32rem;
margin-left: 0.2rem;
margin-top: 0.1rem;
margin-right: 0.2rem;
font-size: 0.22rem;
text-align: left;
color: #999999;
}
.upload-container {
width: 0.92rem;
height: 0.92rem;
}
.upload-icon-div {
width: 0.92rem;
height: 0.92rem;
border-radius: 0.04rem;
box-shadow: 0 0 10px 0 #000000;
opacity: 0.1;
}
.case-library-detail-list {
margin-bottom: 1rem;
}
.case-library-detail-footer {
position: fixed;
left: 0;
right: 0;
bottom: 0;
height: 1rem;
background-color: #ffffff;
}
.footer-body-container {
display: flex;
flex: 1;
}
.footer-body {
display: flex;
flex: 1;
align-items: center;
}
.footer-image-style {
display: flex;
flex: 1;
}
.footer-text-div {
margin-top: 0.08rem;
}
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