Skip to content

X
xiaomai-cloud-class-web
Commit 8ee8d992 by zangsuyun
Options

Merge branch 'master' into feature/zangsuyun/20210315/knowledge

parents c3995bdb e54e0359
Showing with 672 additions and 77 deletions
package.json
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
"babel-plugin-jsx-control-statements": "^4.1.0", "babel-plugin-jsx-control-statements": "^4.1.0",
"babel-plugin-named-asset-import": "^0.3.6", "babel-plugin-named-asset-import": "^0.3.6",
"babel-preset-react-app": "^9.1.2", "babel-preset-react-app": "^9.1.2",
"bizcharts": "^4.1.7", "bizcharts": "^3.3.0",
"camelcase": "^5.3.1", "camelcase": "^5.3.1",
"case-sensitive-paths-webpack-plugin": "2.3.0", "case-sensitive-paths-webpack-plugin": "2.3.0",
"classnames": "^2.2.6", "classnames": "^2.2.6",
......
src/common/less/icon-font.less
@font-face { @font-face {
font-family: 'iconfont'; /* project id 2223403 */ font-family: 'iconfont'; /* project id 2223403 */
src: url('//at.alicdn.com/t/font_2223403_7mf3fh1rzmo.eot'); src: url('//at.alicdn.com/t/font_2223403_vzf1rkr5ya.eot');
src: url('//at.alicdn.com/t/font_2223403_7mf3fh1rzmo.eot?#iefix') format('embedded-opentype'), src: url('//at.alicdn.com/t/font_2223403_vzf1rkr5ya.eot?#iefix') format('embedded-opentype'),
url('//at.alicdn.com/t/font_2223403_7mf3fh1rzmo.woff2') format('woff2'), url('//at.alicdn.com/t/font_2223403_vzf1rkr5ya.woff2') format('woff2'),
url('//at.alicdn.com/t/font_2223403_7mf3fh1rzmo.woff') format('woff'), url('//at.alicdn.com/t/font_2223403_vzf1rkr5ya.woff') format('woff'),
url('//at.alicdn.com/t/font_2223403_7mf3fh1rzmo.ttf') format('truetype'), url('//at.alicdn.com/t/font_2223403_vzf1rkr5ya.ttf') format('truetype'),
url('//at.alicdn.com/t/font_2223403_7mf3fh1rzmo.svg#iconfont') format('svg'); url('//at.alicdn.com/t/font_2223403_vzf1rkr5ya.svg#iconfont') format('svg');
} }
.iconfont{ .iconfont{
font-family:"iconfont" !important; font-family:"iconfont" !important;
......
src/core/xmTD.js 0 → 100644
/*
* @Author: wufan
* @Date: 2021-03-26 15:40:49
* @LastEditors: wufan
* @LastEditTime: 2021-03-26 16:27:52
* @Description: 阿里云埋点
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
window.WEBTRACING = (eventKey, eventName, content) => {
if (!window.logger) {
return
}
const { xmState } = window.ctx;
const {storeList = []} = xmState;
const {id:storeId, storeUserId, storeName, storeType} = storeList[0] || {};
logger.push("platform", "pc");
logger.push("event", eventKey);
logger.push("eventName", eventName);
logger.push("device", navigator.userAgent);
logger.push("storeId", storeId);
logger.push("storeName", storeName);
logger.push("storeType", storeType);
logger.push("storeUserId", storeUserId);
logger.push('env', process.env.DEPLOY_ENV || 'local'); // 哪个环境的埋点
const _content = Object.assign({}, content, {
店铺名称: storeName,
店铺类型: storeType,
storeId,
storeUserId,
});
logger.push("content", JSON.stringify(_content));
// 记录日志
logger.logger();
}
src/domains/basic-domain/constants.ts
/* /*
* @Author: 陈剑宇 * @Author: 陈剑宇
* @Date: 2020-05-07 14:43:01 * @Date: 2020-05-07 14:43:01
* @LastEditTime: 2021-03-27 10:03:44 * @LastEditTime: 2021-03-26 14:05:25
* @LastEditors: zangsuyun * @LastEditors: zhangleyuan
* @Description: * @Description:
* @FilePath: /wheat-web-demo/src/domains/basic-domain/constants.ts * @FilePath: /wheat-web-demo/src/domains/basic-domain/constants.ts
*/ */
......
src/h5.html
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2020-08-24 12:20:57 * @Date: 2020-08-24 12:20:57
* @LastEditors: zangsuyun * @LastEditors: zangsuyun
* @LastEditTime: 2021-03-27 10:14:23 * @LastEditTime: 2021-04-02 14:58:57
* @Description: * @Description:
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
--> -->
...@@ -25,7 +25,7 @@ ...@@ -25,7 +25,7 @@
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/ user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
--> -->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" /> <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<link rel="stylesheet" href="//at.alicdn.com/t/font_2223403_1zfzctj7oe5.css"> <link rel="stylesheet" href="//at.alicdn.com/t/font_2223403_vzf1rkr5ya.css">
<!-- <!--
Notice the use of %PUBLIC_URL% in the tags above. Notice the use of %PUBLIC_URL% in the tags above.
......
src/index.html
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2020-08-24 12:20:57 * @Date: 2020-08-24 12:20:57
* @LastEditors: zangsuyun * @LastEditors: zangsuyun
* @LastEditTime: 2021-03-27 10:23:17 * @LastEditTime: 2021-04-02 14:59:11
* @Description: * @Description:
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
--> -->
...@@ -25,7 +25,7 @@ ...@@ -25,7 +25,7 @@
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/ user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
--> -->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" /> <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<link rel="stylesheet" href="//at.alicdn.com/t/font_2223403_1zfzctj7oe5.js"> <link rel="stylesheet" href="//at.alicdn.com/t/font_2223403_vzf1rkr5ya.css">
<!-- <!--
Notice the use of %PUBLIC_URL% in the tags above. Notice the use of %PUBLIC_URL% in the tags above.
...@@ -42,6 +42,7 @@ ...@@ -42,6 +42,7 @@
<script type="text/javascript" src="https://image.xiaomaiketang.com/xm/lrz.all.bundle.js"></script> <script type="text/javascript" src="https://image.xiaomaiketang.com/xm/lrz.all.bundle.js"></script>
<script type="text/javascript" src="https://image.xiaomaiketang.com/xm/PhotoClip.js"></script> <script type="text/javascript" src="https://image.xiaomaiketang.com/xm/PhotoClip.js"></script>
<script type="text/javascript" charset="utf-8" src="//g.alicdn.com/sd/ncpc/nc.js?t=2015052012"></script> <script type="text/javascript" charset="utf-8" src="//g.alicdn.com/sd/ncpc/nc.js?t=2015052012"></script>
<script type="text/javascript" src="https://xiaomai-js.oss-cn-hangzhou.aliyuncs.com/loghub-xm-0.0.1-beta.js"></script>
</head> </head>
<body> <body>
<noscript>You need to enable JavaScript to run this app.</noscript> <noscript>You need to enable JavaScript to run this app.</noscript>
......
src/index.tsx
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2020-04-27 20:35:34 * @Date: 2020-04-27 20:35:34
* @LastEditors: wufan * @LastEditors: wufan
* @LastEditTime: 2020-12-23 19:38:35 * @LastEditTime: 2021-03-26 16:14:09
* @Description: * @Description:
*/ */
...@@ -18,6 +18,7 @@ import 'antd/dist/antd.less'; ...@@ -18,6 +18,7 @@ import 'antd/dist/antd.less';
import 'video-react/dist/video-react.css'; import 'video-react/dist/video-react.css';
import '@/common/less/index.less'; import '@/common/less/index.less';
import '@/core/function'; import '@/core/function';
import '@/core/xmTD';
import User from '@/common/js/user'; import User from '@/common/js/user';
import Service from "@/common/js/service"; import Service from "@/common/js/service";
......
src/modules/course-manage/components/AddLiveBasic.jsx
/* /*
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2020-07-15 17:29:12 * @Date: 2020-07-15 17:29:12
* @Last Modified by: 吴文洁 * @Last Modified by: chenshu
* @Last Modified time: 2020-07-15 18:16:05 * @Last Modified time: 2021-03-29 16:19:49
* @Description: 新建/编辑直播课-基本信息 * @Description: 新建/编辑直播课-基本信息
*/ */
...@@ -241,7 +241,7 @@ class AddLiveBasic extends React.Component { ...@@ -241,7 +241,7 @@ class AddLiveBasic extends React.Component {
className={`default-btn ${isDefaultCover ? 'disabled' : ''}`} className={`default-btn ${isDefaultCover ? 'disabled' : ''}`}
onClick={this.handleResetCoverUrl} onClick={this.handleResetCoverUrl}
>使用默认图</span> >使用默认图</span>
<div className="tips">建议尺寸1280*720像素，图片支持jpg、jpeg、png格式。</div> <div className="tips">建议尺寸1280*720px，图片支持jpg、jpeg、png格式。</div>
</div> </div>
</div> </div>
</div> </div>
......
src/modules/course-manage/components/GraphicsEditor.jsx
...@@ -156,7 +156,6 @@ class GraphicsEditor extends React.Component { ...@@ -156,7 +156,6 @@ class GraphicsEditor extends React.Component {
const videoCount = ((html || '').match(/<iframe/g) || []).length; const videoCount = ((html || '').match(/<iframe/g) || []).length;
const imageCount = ((html || '').match(/<img/g) || []).length; const imageCount = ((html || '').match(/<img/g) || []).length;
const textLength = this.editorInt.txt.text().replace(/\&nbsp\;/ig, ' ').length + videoCount + imageCount; const textLength = this.editorInt.txt.text().replace(/\&nbsp\;/ig, ' ').length + videoCount + imageCount;
console.log(html, 777777)
this.setState({ textLength }, () => { this.setState({ textLength }, () => {
onChange(html, this.state.textLength); onChange(html, this.state.textLength);
}) })
......
src/modules/course-manage/components/GraphicsEditor.less
...@@ -17,13 +17,13 @@ ...@@ -17,13 +17,13 @@
} }
.editor-box { .editor-box {
height: 100%; height: 100%;
width: 100%;
} }
.w-e-toolbar { .w-e-toolbar {
background-color: #fff !important; background-color: #fff !important;
border: none !important; border: none !important;
border-bottom: 1px solid #E8E8E8 !important; border-bottom: 1px solid #E8E8E8 !important;
width: 700px;
} }
.w-e-text-container { .w-e-text-container {
......
src/modules/course-manage/graphics-course/AddGraphicsCourse.jsx
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2020-08-05 10:07:47 * @Date: 2020-08-05 10:07:47
* @LastEditors: zhangleyuan * @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-04 10:26:07 * @LastEditTime: 2021-03-29 14:08:47
* @Description: 图文课新增/编辑页 * @Description: 图文课新增/编辑页
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -215,11 +215,15 @@ class AddGraphicsCourse extends React.Component { ...@@ -215,11 +215,15 @@ class AddGraphicsCourse extends React.Component {
cancelText: '留在本页', cancelText: '留在本页',
icon: <span className="icon iconfont default-confirm-icon">&#xe6f4;</span>, icon: <span className="icon iconfont default-confirm-icon">&#xe6f4;</span>,
onOk: () => { onOk: () => {
RCHistory.goBack(); window.RCHistory.push({
pathname: `/graphics-course`,
});
} }
}); });
}else{ }else{
RCHistory.goBack(); window.RCHistory.push({
pathname: `/graphics-course`,
});
} }
} }
...@@ -484,7 +488,9 @@ class AddGraphicsCourse extends React.Component { ...@@ -484,7 +488,9 @@ class AddGraphicsCourse extends React.Component {
Service.Hades('public/hades/createMediaCourse', commonParams).then((res) => { Service.Hades('public/hades/createMediaCourse', commonParams).then((res) => {
if (!res) return; if (!res) return;
message.success("新建成功"); message.success("新建成功");
window.RCHistory.goBack(); window.RCHistory.push({
pathname: `/graphics-course`,
});
}) })
} else { } else {
const editParams = { const editParams = {
...@@ -494,7 +500,9 @@ class AddGraphicsCourse extends React.Component { ...@@ -494,7 +500,9 @@ class AddGraphicsCourse extends React.Component {
Service.Hades('public/hades/editMediaCourse', editParams).then((res) => { Service.Hades('public/hades/editMediaCourse', editParams).then((res) => {
if (!res) return; if (!res) return;
message.success("保存成功"); message.success("保存成功");
window.RCHistory.goBack(); window.RCHistory.push({
pathname: `/graphics-course`,
});
}); });
} }
} }
......
src/modules/course-manage/graphics-course/components/GraphicsCourseList.jsx
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2020-08-05 10:12:45 * @Date: 2020-08-05 10:12:45
* @LastEditors: zhangleyuan * @LastEditors: zhangleyuan
* @LastEditTime: 2021-02-01 16:34:11 * @LastEditTime: 2021-03-27 16:24:47
* @Description: 视频课-列表模块 * @Description: 视频课-列表模块
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -33,7 +33,9 @@ class GraphicsCourseList extends React.Component { ...@@ -33,7 +33,9 @@ class GraphicsCourseList extends React.Component {
super(props); super(props);
this.state = { this.state = {
id: '', // 视频课ID id: '', // 视频课ID
studentIds:[] studentIds:[],
RelatedPlanModalVisible:false,
selectPlanList:{}
} }
} }
...@@ -61,6 +63,17 @@ class GraphicsCourseList extends React.Component { ...@@ -61,6 +63,17 @@ class GraphicsCourseList extends React.Component {
this.setState({ watchDataModal }); this.setState({ watchDataModal });
} }
handlePlanName = (planArray)=>{
let planStr = "";
planArray.map((item,index)=>{
if(index < planArray.length-1){
planStr = planStr + item.planName + '、';
}else{
planStr = planStr + item.planName
}
})
return planStr
}
// 请求表头 // 请求表头
parseColumns = () => { parseColumns = () => {
const columns = [ const columns = [
...@@ -91,7 +104,7 @@ class GraphicsCourseList extends React.Component { ...@@ -91,7 +104,7 @@ class GraphicsCourseList extends React.Component {
title: '课程分类', title: '课程分类',
key: 'categoryName', key: 'categoryName',
dataIndex: 'categoryName', dataIndex: 'categoryName',
width: '20%', width: 120,
render: (val, record) => { render: (val, record) => {
return ( return (
<div className="record__item"> <div className="record__item">
...@@ -104,7 +117,7 @@ class GraphicsCourseList extends React.Component { ...@@ -104,7 +117,7 @@ class GraphicsCourseList extends React.Component {
title: '创建人', title: '创建人',
key: 'createName', key: 'createName',
dataIndex: 'createName', dataIndex: 'createName',
width: '10%', width: 100,
render: (val) => { render: (val) => {
return ( return (
<div> <div>
...@@ -126,7 +139,7 @@ class GraphicsCourseList extends React.Component { ...@@ -126,7 +139,7 @@ class GraphicsCourseList extends React.Component {
<span>店铺展示</span> <span>店铺展示</span>
<Tooltip title={<div>开启后，用户可在店铺内查看到此课程。若课程“未成功开课”，则系统会自动“关闭”店铺展示。<br/>关闭后，店铺内不再展示此课程，但用户仍可通过分享的海报/链接查看此课程。</div>}><i className="icon iconfont" style={{ marginLeft: '5px',cursor:'pointer',color:'#bfbfbf',fontSize:'14px'}}>&#xe61d;</i></Tooltip> <Tooltip title={<div>开启后，用户可在店铺内查看到此课程。若课程“未成功开课”，则系统会自动“关闭”店铺展示。<br/>关闭后，店铺内不再展示此课程，但用户仍可通过分享的海报/链接查看此课程。</div>}><i className="icon iconfont" style={{ marginLeft: '5px',cursor:'pointer',color:'#bfbfbf',fontSize:'14px'}}>&#xe61d;</i></Tooltip>
</span>, </span>,
width: '12%', width: 120,
dataIndex: "courseware", dataIndex: "courseware",
render: (val, item, index) => { render: (val, item, index) => {
return ( return (
...@@ -166,6 +179,28 @@ class GraphicsCourseList extends React.Component { ...@@ -166,6 +179,28 @@ class GraphicsCourseList extends React.Component {
} }
}, },
{ {
title: '关联项',
width: 200,
key: "planList",
dataIndex: "planList",
render: (val, record) => {
return (
<div className="related-task">
{ record.relatedPlanList ?
<Tooltip title={this.handlePlanName(record.relatedPlanList)} placement="top" arrowPointAtCenter>
{ record.relatedPlanList.map((item,index)=>{
return <span>{item.planName} { (index < record.relatedPlanList.length-1)&&(<span> 、</span>)} </span>
})
}
</Tooltip>
:
<span></span>
}
</div>
)
}
},
{
title: '操作', title: '操作',
key: 'operate', key: 'operate',
dataIndex: 'operate', dataIndex: 'operate',
...@@ -236,7 +271,7 @@ class GraphicsCourseList extends React.Component { ...@@ -236,7 +271,7 @@ class GraphicsCourseList extends React.Component {
renderMoreOperate = (item) => { renderMoreOperate = (item) => {
return ( return (
<div className="live-course-more-menu"> <div className="live-course-more-menu">
{/* {(User.getUserRole() === "CloudManager" || User.getUserRole() === "StoreManager") && {(User.getUserRole() === "CloudManager" || User.getUserRole() === "StoreManager") &&
<div <div
className="operate__item" className="operate__item"
key="plan" key="plan"
...@@ -244,7 +279,7 @@ class GraphicsCourseList extends React.Component { ...@@ -244,7 +279,7 @@ class GraphicsCourseList extends React.Component {
this.handleRelatedModalShow(item); this.handleRelatedModalShow(item);
}} }}
>关联培训计划</div> >关联培训计划</div>
} */} }
<div <div
className="operate__item" className="operate__item"
key="edit" key="edit"
...@@ -362,7 +397,37 @@ class GraphicsCourseList extends React.Component { ...@@ -362,7 +397,37 @@ class GraphicsCourseList extends React.Component {
}; };
this.props.onChange(_query); this.props.onChange(_query);
} }
handleRelatedModalShow = (item)=>{
const selectPlanList = {};
if(item.relatedPlanList){
item.relatedPlanList.map((item,index)=>{
selectPlanList[item.planId] = {}
selectPlanList[item.planId].planId = item.planId;
selectPlanList[item.planId].taskBaseVOList = [{taskId:item.taskId}];
return item
})
}
this.setState({
RelatedPlanModalVisible:true,
selectCourseId:item.id,
selectPlanList:selectPlanList
})
}
closeRelatedPlanModalVisible = ()=>{
this.setState({
RelatedPlanModalVisible:false
})
}
onChangeSelectPlanList = (selectPlanList)=>{
this.setState({
selectPlanList:selectPlanList
})
}
onConfirmSelectPlanList = ()=>{
this.setState({
RelatedPlanModalVisible:false
},()=>{this.props.onChange();})
}
render() { render() {
const { RelatedPlanModalVisible, selectCourseId, selectPlanList } = this.state; const { RelatedPlanModalVisible, selectCourseId, selectPlanList } = this.state;
const { dataSource = [], totalCount, query } = this.props; const { dataSource = [], totalCount, query } = this.props;
...@@ -402,6 +467,16 @@ class GraphicsCourseList extends React.Component { ...@@ -402,6 +467,16 @@ class GraphicsCourseList extends React.Component {
onConfirm={this.onConfirmSelectPlanList} onConfirm={this.onConfirmSelectPlanList}
/> />
} }
{ RelatedPlanModalVisible &&
<RelatedPlanModal
onClose={this.closeRelatedPlanModalVisible}
visible={RelatedPlanModalVisible}
selectCourseId={selectCourseId}
selectPlanList={selectPlanList}
onChange={this.onChangeSelectPlanList}
onConfirm={this.onConfirmSelectPlanList}
/>
}
{ this.state.shareLiveModal } { this.state.shareLiveModal }
{ this.state.watchDataModal } { this.state.watchDataModal }
</div> </div>
......
src/modules/home/Home.jsx
import React from 'react'; import React from 'react';
import { Select, Tooltip } from 'antd'; import { Select, Tooltip } from 'antd';
import { Chart } from '@antv/g2'; import DataSet from "@antv/data-set";
import { Chart as G2Chart } from '@antv/g2';
import {
G2,
Chart,
Geom,
Axis,
Tooltip as G2Tooltip,
Coord,
Label,
Legend,
View,
Guide,
Shape,
Facet,
Util
} from "bizcharts";
import moment from 'moment' import moment from 'moment'
import Service from "@/common/js/service"; import Service from "@/common/js/service";
import User from '@/common/js/user'; import User from '@/common/js/user';
...@@ -21,8 +37,11 @@ class Home extends React.Component { ...@@ -21,8 +37,11 @@ class Home extends React.Component {
liveCourseNum: 0, liveCourseNum: 0,
totalCustomerNum: 0, totalCustomerNum: 0,
videoCourseNum: 0, videoCourseNum: 0,
pictureCourseNum: 0,
timeRange: '7', timeRange: '7',
studyTimeRange: '7', studyTimeRange: '7',
completeNum: 0,
unfinishedNum: 0,
} }
this._chart = null; this._chart = null;
} }
...@@ -31,6 +50,15 @@ class Home extends React.Component { ...@@ -31,6 +50,15 @@ class Home extends React.Component {
this.getPanelInfo(); this.getPanelInfo();
this.getStudyInfo(); this.getStudyInfo();
this.getHotCourse(); this.getHotCourse();
this.getTrainingInfo();
}
getTrainingInfo() {
Service.Hades('public/hades/planOverview', { storeId: User.getStoreId() }).then((res) => {
if (res.success) {
this.setState(res.result)
}
});
} }
getHotCourse() { getHotCourse() {
...@@ -72,10 +100,12 @@ class Home extends React.Component { ...@@ -72,10 +100,12 @@ class Home extends React.Component {
incLiveCourseNum: res.result.incLiveCourseNum, incLiveCourseNum: res.result.incLiveCourseNum,
incVideoCourseNum: res.result.incVideoCourseNum, incVideoCourseNum: res.result.incVideoCourseNum,
incPictureCourseNum: res.result.incPictureCourseNum, incPictureCourseNum: res.result.incPictureCourseNum,
incTrainingPlanNum: res.result.incTrainingPlanNum,
liveCourseNum: res.result.liveCourseNum, liveCourseNum: res.result.liveCourseNum,
totalCustomerNum: res.result.totalCustomerNum, totalCustomerNum: res.result.totalCustomerNum,
videoCourseNum: res.result.videoCourseNum, videoCourseNum: res.result.videoCourseNum,
pictureCourseNum: res.result.pictureCourseNum, pictureCourseNum: res.result.pictureCourseNum,
trainingPlanNum: res.result.trainingPlanNum,
}) })
} }
}) })
...@@ -97,7 +127,7 @@ class Home extends React.Component { ...@@ -97,7 +127,7 @@ class Home extends React.Component {
createChart = (data) => { createChart = (data) => {
if (!this._chart) { if (!this._chart) {
this._chart = new Chart({ this._chart = new G2Chart({
container: 'chart-id', container: 'chart-id',
forceFit: true, forceFit: true,
height: 290, height: 290,
...@@ -192,7 +222,39 @@ class Home extends React.Component { ...@@ -192,7 +222,39 @@ class Home extends React.Component {
timeRange, timeRange,
scheduleType, scheduleType,
studyTimeRange, studyTimeRange,
trainingPlanNum,
incTrainingPlanNum,
unfinishedNum,
completeNum,
planCustomerNum,
} = this.state; } = this.state;
const data = [
{
item: '已完成培训',
count: completeNum,
}, {
item: '未完成培训',
count: unfinishedNum,
}
];
const { DataView } = DataSet;
const { Html } = Guide;
const sum = data[0].count + data[1].count;
const dv = new DataView();
sum && dv.source(data).transform({
type: "percent",
field: "count",
dimension: "item",
as: "percent"
});
const cols = {
percent: {
formatter: val => {
val = val * 100 + "%";
return val;
}
}
};
return ( return (
<div className="home-page"> <div className="home-page">
<div className="home-title">数据概况</div> <div className="home-title">数据概况</div>
...@@ -269,13 +331,13 @@ class Home extends React.Component { ...@@ -269,13 +331,13 @@ class Home extends React.Component {
<img className="header-icon" src="https://image.xiaomaiketang.com/xm/jZf3GNY5tY.png" /> <img className="header-icon" src="https://image.xiaomaiketang.com/xm/jZf3GNY5tY.png" />
<span className="header-word">培训计划总数 (个)</span> <span className="header-word">培训计划总数 (个)</span>
</div> </div>
<div className="data-number">0</div> <div className="data-number">{trainingPlanNum}</div>
<div className="data-footer"> <div className="data-footer">
<span className="footer-word">本月新增</span> <span className="footer-word">本月新增</span>
{false && {incTrainingPlanNum > 0 &&
<span className="icon iconfont">&#xe635;</span> <span className="icon iconfont">&#xe635;</span>
} }
<span className="footer-number">0</span> <span className="footer-number">{incTrainingPlanNum}</span>
</div> </div>
</div> </div>
<div className="data-item"> <div className="data-item">
...@@ -358,24 +420,78 @@ class Home extends React.Component { ...@@ -358,24 +420,78 @@ class Home extends React.Component {
</Tooltip> </Tooltip>
<span className="tip">(本月)</span> <span className="tip">(本月)</span>
</div> </div>
<div className="circle-box"> {(unfinishedNum || completeNum) ?
<div
className="left-graph-container"
id="mountNode"
style={{ width: '100%', marginLeft: '-20%', marginTop: -30 }}
ref={e => e && (this.width = e.clientWidth)}
>
{this.width && <div>
<Chart
height={400}
width={this.width}
data={dv}
scale={cols}
padding={20}
>
<Coord type={"theta"} radius={0.75} innerRadius={0.6} />
<Axis name="percent" />
<G2Tooltip
showTitle={false}
itemTpl="<li><span style=&quot;background-color:{color};&quot; class=&quot;g2-tooltip-marker&quot;></span>{name}: {value}</li>"
/>
<Guide>
<Html
position={['50%', "50%"]}
html={`<div style="color:#8c8c8c;font-size:14px;text-align: center;width: ${this.width}px;"><span style="color:#333;font-size:20px">${planCustomerNum}人</span><br>新增培训人数</div>`}
alignX="middle"
alignY="middle"
/>
</Guide>
<Geom
type="intervalStack"
position="percent"
color={['item', ['#FDB513', '#5289FA']]}
tooltip={[
"item*percent",
(item, percent) => {
percent = Math.round(percent * 100) + "%";
return {
name: item,
value: percent,
};
}
]}
style={{
lineWidth: 1,
stroke: "#fff"
}}
>
</Geom>
</Chart>
</div>
}
</div>
: <div className="circle-box">
<div className="big-circle"> <div className="big-circle">
<div className="small-circle"> <div className="small-circle">
<div className="tip-box"> <div className="tip-box">
<div style={{ color: '#333', fontSize: '20px', marginBottom: 4 }}>0人</div> <div style={{ color: '#333', fontSize: '20px', marginBottom: 4 }}>{planCustomerNum}人</div>
<div style={{ color: '#999' }}>新增培训人数</div> <div style={{ color: '#999' }}>新增培训人数</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
}
<div className="circle-tip unfinished"> <div className="circle-tip unfinished">
<div className="spot"></div> <div className="spot"></div>
<div className="number">0人</div> <div className="number">{unfinishedNum}人</div>
<div className="word">未完成培训</div> <div className="word">未完成培训</div>
</div> </div>
<div className="circle-tip finished"> <div className="circle-tip finished">
<div className="spot"></div> <div className="spot"></div>
<div className="number">0人</div> <div className="number">{completeNum}人</div>
<div className="word">完成培训</div> <div className="word">完成培训</div>
</div> </div>
</div> </div>
...@@ -406,6 +522,10 @@ class Home extends React.Component { ...@@ -406,6 +522,10 @@ class Home extends React.Component {
<div>人均学习时长(分钟)</div> <div>人均学习时长(分钟)</div>
</div> </div>
<div id="chart-id"></div> <div id="chart-id"></div>
<div className="chart-bottom-tip">
<div className="tip-item" style={{ marginRight: 100 }}><span className="student-dot"></span>学习人数</div>
<div className="tip-item"><span className="time-dot"></span>人均学习时长</div>
</div>
</div> </div>
</div> </div>
) )
......
src/modules/home/Home.less
.home-page { .home-page {
padding: 0 16px 16px; padding: 0 16px 16px;
min-width: 1100px; min-width: 1100px;
.g2-tooltip-marker {
border-radius: 50% !important;
}
.home-title { .home-title {
height: 44px; height: 44px;
line-height: 44px; line-height: 44px;
...@@ -282,10 +285,11 @@ ...@@ -282,10 +285,11 @@
} }
.study-chart { .study-chart {
width: 100%; width: 100%;
height: 396px; height: 432px;
background: #fff; background: #fff;
padding: 16px; padding: 16px;
margin-top: 16px; margin-top: 16px;
padding-bottom: 32px;
.study-title { .study-title {
font-size: 16px; font-size: 16px;
color: #333; color: #333;
...@@ -315,6 +319,29 @@ ...@@ -315,6 +319,29 @@
} }
} }
} }
.chart-bottom-tip {
display: flex;
justify-content: center;
.tip-item {
display: flex;
align-items: center;
color: #666;
.student-dot {
background: #5289FA;
height: 8px;
width: 8px;
border-radius: 50%;
margin-right: 8px;
}
.time-dot {
background: #FEB613;
height: 8px;
width: 8px;
border-radius: 50%;
margin-right: 8px;
}
}
}
} }
} }
......
src/modules/plan-manage/AddPlan.jsx
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: zhangleyuan * @Author: zhangleyuan
* @Date: 2021-02-20 16:13:39 * @Date: 2021-02-20 16:13:39
* @LastEditors: zhangleyuan * @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-16 11:27:06 * @LastEditTime: 2021-03-30 18:07:11
* @Description: 描述一下 * @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -28,6 +28,7 @@ const defaultBasicData = { ...@@ -28,6 +28,7 @@ const defaultBasicData = {
operateType:'All_Operate', operateType:'All_Operate',
percentCompleteLive:80, percentCompleteLive:80,
percentCompleteVideo:80, percentCompleteVideo:80,
percentCompletePicture:100
} }
const defaultTaskList = []; const defaultTaskList = [];
...@@ -64,6 +65,7 @@ function AddPlan() { ...@@ -64,6 +65,7 @@ function AddPlan() {
operateIds, operateIds,
percentCompleteLive, percentCompleteLive,
percentCompleteVideo, percentCompleteVideo,
percentCompletePicture,
courseMediaVOS, courseMediaVOS,
trainingTaskList trainingTaskList
} = res.result; } = res.result;
...@@ -102,7 +104,8 @@ function AddPlan() { ...@@ -102,7 +104,8 @@ function AddPlan() {
instro, instro,
operateType, operateType,
percentCompleteLive, percentCompleteLive,
percentCompleteVideo percentCompleteVideo,
percentCompletePicture
}) })
setHasGetDetail(true); setHasGetDetail(true);
}) })
...@@ -119,7 +122,7 @@ function AddPlan() { ...@@ -119,7 +122,7 @@ function AddPlan() {
} }
function submitInfo(){ function submitInfo(){
const {planName,enableState,selectOperatorList,instro,operateType,percentCompleteLive,percentCompleteVideo,coverId,coverUrl} = basicData; const {planName,enableState,selectOperatorList,instro,operateType,percentCompleteLive,percentCompleteVideo,percentCompletePicture,coverId,coverUrl} = basicData;
let input = /^[\s]*$/; let input = /^[\s]*$/;
if(!planName || input.test(planName)){ if(!planName || input.test(planName)){
message.warning('请输入的培训计划名称'); message.warning('请输入的培训计划名称');
...@@ -137,6 +140,10 @@ function AddPlan() { ...@@ -137,6 +140,10 @@ function AddPlan() {
message.warning('请输入完成标准'); message.warning('请输入完成标准');
return; return;
} }
if(!percentCompletePicture && percentCompletePicture !==0 ){
message.warning('请输入完成标准');
return;
}
if(taskList.length === 0){ if(taskList.length === 0){
message.warning('请输入培训计划内容'); message.warning('请输入培训计划内容');
return; return;
...@@ -183,6 +190,7 @@ function AddPlan() { ...@@ -183,6 +190,7 @@ function AddPlan() {
operateType, operateType,
percentCompleteLive, percentCompleteLive,
percentCompleteVideo, percentCompleteVideo,
percentCompletePicture,
planName, planName,
scheduleMediaRequests, scheduleMediaRequests,
storeId:User.getStoreId(), storeId:User.getStoreId(),
......
src/modules/plan-manage/LearningData.jsx
...@@ -77,7 +77,7 @@ class LearningData extends React.Component { ...@@ -77,7 +77,7 @@ class LearningData extends React.Component {
<div className="plan-info"> <div className="plan-info">
<div className="plan-intro"> <div className="plan-intro">
<div className="plan-img-con"> <div className="plan-img-con">
<img src="https://image.xiaomaiketang.com/xm/YNfi45JwFA.png"/> <img src={coverUrl} />
</div> </div>
<div> <div>
<div className="plan-name"> <div className="plan-name">
......
src/modules/plan-manage/components/BasicInfo.jsx
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: zhangleyuan * @Author: zhangleyuan
* @Date: 2021-02-20 16:45:51 * @Date: 2021-02-20 16:45:51
* @LastEditors: zhangleyuan * @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-15 17:01:47 * @LastEditTime: 2021-03-27 11:20:27
* @Description: 描述一下 * @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -210,7 +210,7 @@ class BasicInfo extends React.Component{ ...@@ -210,7 +210,7 @@ class BasicInfo extends React.Component{
render(){ render(){
const { operatorModalVisible ,showSelectFileModal,visible,hasImgReady,cutImageBlob} = this.state; const { operatorModalVisible ,showSelectFileModal,visible,hasImgReady,cutImageBlob} = this.state;
const { data} = this.props; const { data} = this.props;
const { planName,coverUrl,instro,enableState,operateType,selectOperatorList,percentCompleteLive,percentCompleteVideo} = data; const { planName,coverUrl,instro,enableState,operateType,selectOperatorList,percentCompleteLive,percentCompleteVideo,percentCompletePicture} = data;
// 当前是否使用的是默认图片 // 当前是否使用的是默认图片
const isDefaultCover = coverUrl === defaultCover; const isDefaultCover = coverUrl === defaultCover;
return ( return (
...@@ -337,6 +337,19 @@ class BasicInfo extends React.Component{ ...@@ -337,6 +337,19 @@ class BasicInfo extends React.Component{
%，即视为"已完成"学习 %，即视为"已完成"学习
</span> </span>
</div> </div>
<div className="live-standard-info">
<span className="icon iconfont">&#xe601;</span>
<span className="instro">图文课单个课程，用户学习进度达到
<Input
width="40"
value={percentCompletePicture}
onChange={(e) => { this.props.onChange('percentCompletePicture', e.target.value.replace(/\D/g,'')) }}
onBlur={(e)=>this.percentCompleteBlur(e,'percentCompletePicture')}
className="input-box"
/>
%，即视为"已完成"学习
</span>
</div>
{/* <div className="video-standard-info"> {/* <div className="video-standard-info">
<span className="icon iconfont">&#xe864;</span> <span className="icon iconfont">&#xe864;</span>
<span>图文课单个课程，用户学习进度达到 <span>图文课单个课程，用户学习进度达到
......
src/modules/plan-manage/components/TrainingTask.jsx
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: zhangleyuan * @Author: zhangleyuan
* @Date: 2021-02-20 16:45:51 * @Date: 2021-02-20 16:45:51
* @LastEditors: zhangleyuan * @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-16 11:36:36 * @LastEditTime: 2021-03-27 14:43:17
* @Description: 描述一下 * @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -25,6 +25,9 @@ const CourseType = { ...@@ -25,6 +25,9 @@ const CourseType = {
}, },
RECORD : { RECORD : {
text:'录播课' text:'录播课'
},
PICTURE:{
text:'图文课'
} }
}; };
const courseStateShow = { const courseStateShow = {
...@@ -218,6 +221,7 @@ class TrainingTask extends React.Component { ...@@ -218,6 +221,7 @@ class TrainingTask extends React.Component {
}) })
} }
confirmSelectCourse = (selectList) =>{ confirmSelectCourse = (selectList) =>{
console.log("selectList",selectList);
const {selectedTaskIndex}= this.state; const {selectedTaskIndex}= this.state;
const { dataSource } = this.state const { dataSource } = this.state
const newData=[...dataSource]; const newData=[...dataSource];
......
src/modules/plan-manage/modal/UserLearnDetailModal.jsx
...@@ -16,6 +16,9 @@ const CourseType = { ...@@ -16,6 +16,9 @@ const CourseType = {
}, },
RECORD : { RECORD : {
text:'录播课' text:'录播课'
},
PICTURE:{
text:'图文课'
} }
}; };
const courseStateShow = { const courseStateShow = {
......
src/modules/plan-manage/modal/relatedCourseModal.jsx
...@@ -3,6 +3,7 @@ import {Table, Modal,Input,message,Button,Tooltip} from 'antd'; ...@@ -3,6 +3,7 @@ import {Table, Modal,Input,message,Button,Tooltip} from 'antd';
import { PageControl } from "@/components"; import { PageControl } from "@/components";
import CourseService from "@/domains/course-domain/CourseService"; import CourseService from "@/domains/course-domain/CourseService";
import User from '@/common/js/user'; import User from '@/common/js/user';
import Service from '@/common/js/service';
import { Tabs } from 'antd'; import { Tabs } from 'antd';
import './relatedCourseModal.less'; import './relatedCourseModal.less';
import _ from "underscore"; import _ from "underscore";
...@@ -45,6 +46,7 @@ class SelectOperatorModal extends React.Component { ...@@ -45,6 +46,7 @@ class SelectOperatorModal extends React.Component {
selectLive:[],//弹窗内已选择的直播课程 selectLive:[],//弹窗内已选择的直播课程
currentCourseListData:[], currentCourseListData:[],
currentLiveCourseListData:[], //页面中已关联的直播课程 currentLiveCourseListData:[], //页面中已关联的直播课程
videoDataSource:[], videoDataSource:[],
videoSize:10, videoSize:10,
videoQuery: { videoQuery: {
...@@ -53,6 +55,16 @@ class SelectOperatorModal extends React.Component { ...@@ -53,6 +55,16 @@ class SelectOperatorModal extends React.Component {
videoTotalCount:0, videoTotalCount:0,
selectVideo:[], //弹窗内已选择的视频课程 selectVideo:[], //弹窗内已选择的视频课程
currentVideoCourseListData:[], //页面中已关联的视频课程 currentVideoCourseListData:[], //页面中已关联的视频课程
pictureDataSource:[],
pictureSize:10,
pictureQuery: {
current: 1,
},
pictureTotalCount:0,
selectPicture:[], //弹窗内已选择的视频课程
currentPictureCourseListData:[], //页面中已关联的视频课程
activeKey:'video', activeKey:'video',
currentTaskCourseData:this.props.data[this.props.selectedTaskIndex].courseList || [] currentTaskCourseData:this.props.data[this.props.selectedTaskIndex].courseList || []
} }
...@@ -61,7 +73,7 @@ class SelectOperatorModal extends React.Component { ...@@ -61,7 +73,7 @@ class SelectOperatorModal extends React.Component {
componentDidMount() { componentDidMount() {
this.handleFetchLiveDataList(); this.handleFetchLiveDataList();
this.handleFetchVideoDataList(); this.handleFetchVideoDataList();
this.handleFetchPictureDataList();
} }
// 获取直播课列表 // 获取直播课列表
...@@ -128,6 +140,40 @@ class SelectOperatorModal extends React.Component { ...@@ -128,6 +140,40 @@ class SelectOperatorModal extends React.Component {
}); });
} }
// 获取图文课列表
handleFetchPictureDataList = () => {
const {pictureQuery,pictureSize} = this.state;
const { selectedTaskIndex } =this.props;
const _data = [...this.props.data];
let currentPictureCourseListData = [];
_data.map((item,index) => {
item.courseList.map((childItem,childIndex)=>{
if(childItem.courseType ==="PICTURE"){
currentPictureCourseListData.push(childItem.courseId)
}
return childItem
})
return item
});
const params ={
...pictureQuery,
size:pictureSize,
courseType:"PICTURE",
storeId:User.getStoreId(),
excludeCourseIdList:currentPictureCourseListData
}
Service.Hades('public/hades/mediaCoursePage', params).then((res) => {
const { result = {} } = res ;
const { records = [], total = 0 } = result;
this.setState({
pictureDataSource: records,
pictureTotalCount: Number(total),
currentPictureCourseListData
});
});
}
handleChangVideoCourseName = (value)=>{ handleChangVideoCourseName = (value)=>{
const { videoQuery } = this.state; const { videoQuery } = this.state;
videoQuery.courseName = value; videoQuery.courseName = value;
...@@ -136,6 +182,7 @@ class SelectOperatorModal extends React.Component { ...@@ -136,6 +182,7 @@ class SelectOperatorModal extends React.Component {
videoQuery videoQuery
}) })
} }
handleChangLiveCourseName = (value)=>{ handleChangLiveCourseName = (value)=>{
const { liveQuery } = this.state; const { liveQuery } = this.state;
liveQuery.courseName = value; liveQuery.courseName = value;
...@@ -144,6 +191,16 @@ class SelectOperatorModal extends React.Component { ...@@ -144,6 +191,16 @@ class SelectOperatorModal extends React.Component {
liveQuery liveQuery
}) })
} }
handleChangPictureCourseName = (value)=>{
const { pictureQuery } = this.state;
pictureQuery.courseName = value;
pictureQuery.current = 1;
this.setState({
pictureQuery
})
}
onShowLiveSizeChange = (current, size) => { onShowLiveSizeChange = (current, size) => {
if (current == size) { if (current == size) {
return return
...@@ -162,6 +219,15 @@ class SelectOperatorModal extends React.Component { ...@@ -162,6 +219,15 @@ class SelectOperatorModal extends React.Component {
},()=>{this.handleFetchLiveDataList()}) },()=>{this.handleFetchLiveDataList()})
} }
onShowPictureSizeChange = (current, size) => {
if (current == size) {
return
}
this.setState({
pictureSize:size
},()=>{this.handleFetchPictureDataList()})
}
// 请求表头 // 请求表头
parseLiveColumns = () => { parseLiveColumns = () => {
const columns = [ const columns = [
...@@ -280,15 +346,67 @@ class SelectOperatorModal extends React.Component { ...@@ -280,15 +346,67 @@ class SelectOperatorModal extends React.Component {
]; ];
return columns; return columns;
} }
// 请求表头
parsePictureColumns = () => {
const columns = [
{
title: <span><span>课程信息</span><Tooltip title="仅显示未关联课程，已关联课程不支持重复选择"><i className="icon iconfont" style={{ marginLeft: '5px',cursor:'pointer',color:'#bfbfbf',fontSize:'14px'}}>&#xe61d;</i></Tooltip></span>,
key: 'course',
dataIndex: 'course',
width:'55%',
render: (val, record) => {
const { coverUrl } = record;
return (
<div className="course-info">
{/* 上传了封面的话就用上传的封面, 没有的话就取视频的第一帧 */}
<img className="course-cover" src={coverUrl || 'https://image.xiaomaiketang.com/xm/YNfi45JwFA.png'}/>
<div className="course-name">{record.courseName}</div>
</div>
)
}
},
{
title: '更新时间',
key: 'updated',
dataIndex: 'updated',
width:'25%',
render: (val, record) => {
return (
<span className="course-status">{formatDate('YYYY-MM-DD',record.updated)}</span>
)
}
},
{
title: '店铺展示',
key: 'shelfState',
dataIndex: 'shelfState',
width:'20%',
render: (val, record) => {
return (
<span>
{record.shelfState==="YES"?
<span>开启</span>
:
<span>关闭</span>
}
</span>
)
}
}
];
return columns;
}
selectLiveList = (record,selected) =>{ selectLiveList = (record,selected) =>{
const {selectVideo,currentTaskCourseData,selectLive} = this.state; const {selectVideo,currentTaskCourseData,selectLive,selectPicture} = this.state;
let _list = []; let _list = [];
if (selected || !_.find(selectLive, (item) => item.liveCourseId == record.liveCourseId)) { if (selected || !_.find(selectLive, (item) => item.liveCourseId == record.liveCourseId)) {
_list = _.uniq(selectLive.concat([record]), false, (item) => item.liveCourseId); _list = _.uniq(selectLive.concat([record]), false, (item) => item.liveCourseId);
} else { } else {
_list = _.reject(selectLive, (item) => item.liveCourseId === record.liveCourseId); _list = _.reject(selectLive, (item) => item.liveCourseId === record.liveCourseId);
} }
if(_list.length + currentTaskCourseData.length + selectVideo.length> 20){ if(_list.length + currentTaskCourseData.length + selectVideo.length + selectPicture.length > 20){
message.warning('无法继续选择，一个任务最多关联20个课程'); message.warning('无法继续选择，一个任务最多关联20个课程');
return; return;
} }
...@@ -296,23 +414,40 @@ class SelectOperatorModal extends React.Component { ...@@ -296,23 +414,40 @@ class SelectOperatorModal extends React.Component {
} }
selectVideoList = (record,selected) =>{ selectVideoList = (record,selected) =>{
const {selectVideo,currentTaskCourseData,selectLive} = this.state; const {selectVideo,currentTaskCourseData,selectLive,selectPicture} = this.state;
let _list = []; let _list = [];
if (selected || !_.find(selectVideo, (item) => item.id == record.id)) { if (selected || !_.find(selectVideo, (item) => item.id == record.id)) {
_list = _.uniq(selectVideo.concat([record]), false, (item) => item.id); _list = _.uniq(selectVideo.concat([record]), false, (item) => item.id);
} else { } else {
_list = _.reject(selectVideo, (item) => item.id === record.id); _list = _.reject(selectVideo, (item) => item.id === record.id);
} }
if(_list.length + currentTaskCourseData.length + selectLive.length> 20){ if(_list.length + currentTaskCourseData.length + selectLive.length + selectPicture.length > 20){
message.warning('无法继续选择，一个任务最多关联20个课程'); message.warning('无法继续选择，一个任务最多关联20个课程');
return; return;
} }
this.setState({selectVideo:_list}); this.setState({selectVideo:_list});
} }
selectPictureList = (record,selected) =>{
const {selectVideo,currentTaskCourseData,selectLive,selectPicture} = this.state;
let _list = [];
if (selected || !_.find(selectPicture, (item) => item.id == record.id)) {
_list = _.uniq(selectPicture.concat([record]), false, (item) => item.id);
} else {
_list = _.reject(selectPicture, (item) => item.id === record.id);
}
if(_list.length + currentTaskCourseData.length + selectLive.length + selectVideo.length > 20){
message.warning('无法继续选择，一个任务最多关联20个课程');
return;
}
this.setState({selectPicture:_list});
}
clearSelectCourse = ()=>{ clearSelectCourse = ()=>{
this.setState({ this.setState({
selectLive:[], selectLive:[],
selectVideo:[] selectVideo:[],
selectPicture:[]
}) })
} }
handleSelectVideo = (selectVideo)=>{ handleSelectVideo = (selectVideo)=>{
...@@ -334,10 +469,57 @@ class SelectOperatorModal extends React.Component { ...@@ -334,10 +469,57 @@ class SelectOperatorModal extends React.Component {
_item.courseState = item.courseState; _item.courseState = item.courseState;
return _item; return _item;
}) })
} }
handleSelectPicture = (selectPicture)=>{
return selectPicture.map((item,index)=>{
let _item = {};
_item.courseId = item.id;
_item.courseType = "PICTURE";
_item.courseName = item.courseName;
return _item;
})
}
renderFooter = ()=>{
const { activeKey } = this.state;
let href = '';
switch (activeKey){
case 'live':
href = <a target='_blank' className="link-create-course" href={window.location.origin + window.location.pathname + '#/create-live-course?type=add'} onClick={this.props.onClose}>没有找到需要的直播课？<span>去创建</span></a>
break;
case 'video':
href = <a target='_blank' className="link-create-course" href={window.location.origin + window.location.pathname + '#/create-video-course?type=add'} onClick={this.props.onClose}>没有找到需要的视频课？<span>去创建</span></a>
break;
case 'picture':
href = <a target='_blank' className="link-create-course" href={window.location.origin + window.location.pathname + '#/create-graphics-course?type=add'} onClick={this.props.onClose}>没有找到需要的图文课？<span>去创建</span></a>
break;
}
return href;
}
render() { render() {
const { visible } = this.props; const { visible } = this.props;
const { liveDataSource,liveSize,liveQuery,liveTotalCount,selectLive,videoDataSource,videoSize,videoQuery,videoTotalCount,selectVideo,currentTaskCourseData,activeKey} = this.state; const {
liveDataSource,
liveSize,
liveQuery,
liveTotalCount,
selectLive,
videoDataSource,
videoSize,
videoQuery,
videoTotalCount,
selectVideo,
currentTaskCourseData,
activeKey,
selectPicture,
pictureDataSource,
pictureSize,
pictureQuery,
pictureTotalCount,
} = this.state;
return ( return (
<Modal <Modal
...@@ -348,13 +530,9 @@ class SelectOperatorModal extends React.Component { ...@@ -348,13 +530,9 @@ class SelectOperatorModal extends React.Component {
className="related-course-modal" className="related-course-modal"
closable={true} closable={true}
width={800} width={800}
onOk={() => this.props.onSelect([...this.handleSelectVideo(selectVideo),...this.handleSelectLive(selectLive)]) }
closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>} closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
footer={[ footer={[
activeKey ==='live'? this.renderFooter()
<a target='_blank' className="link-create-course" href={window.location.origin + window.location.pathname + '#/create-live-course?type=add'} onClick={this.props.onClose}>没有找到需要的直播课？<span>去创建</span></a>
:
<a target='_blank' className="link-create-course" href={window.location.origin + window.location.pathname + '#/create-video-course?type=add'} onClick={this.props.onClose}>没有找到需要的视频课？<span>去创建</span></a>
, ,
<Button <Button
onClick={() => { onClick={() => {
...@@ -363,7 +541,7 @@ class SelectOperatorModal extends React.Component { ...@@ -363,7 +541,7 @@ class SelectOperatorModal extends React.Component {
> >
取消 取消
</Button>, </Button>,
<Button type="primary" onClick={() => this.props.onSelect([...this.handleSelectVideo(selectVideo),...this.handleSelectLive(selectLive)]) }> <Button type="primary" onClick={() => this.props.onSelect([...this.handleSelectVideo(selectVideo),...this.handleSelectLive(selectLive),...this.handleSelectPicture(selectPicture)]) }>
确定 确定
</Button> </Button>
]} ]}
...@@ -379,7 +557,7 @@ class SelectOperatorModal extends React.Component { ...@@ -379,7 +557,7 @@ class SelectOperatorModal extends React.Component {
<div className="select-box"> <div className="select-box">
<div> <div>
<span className="icon iconfont tip-icon">&#xe61d;</span> <span className="icon iconfont tip-icon">&#xe61d;</span>
<span className="select-num">已选择{selectVideo.length + selectLive.length}个</span> <span className="select-num">已选择{selectVideo.length + selectLive.length + selectPicture.length }个</span>
</div> </div>
<div> <div>
<span className="clear-btn" onClick={this.clearSelectCourse}>清空</span> <span className="clear-btn" onClick={this.clearSelectCourse}>清空</span>
...@@ -407,10 +585,9 @@ class SelectOperatorModal extends React.Component { ...@@ -407,10 +585,9 @@ class SelectOperatorModal extends React.Component {
} else { } else {
_list = _.reject(selectVideo, (item) => _.find(changeRows, (data) => data.id === item.id)); _list = _.reject(selectVideo, (item) => _.find(changeRows, (data) => data.id === item.id));
} }
if(_list.length + currentTaskCourseData.length + selectLive.length> 20){ if(_list.length + currentTaskCourseData.length + selectLive.length + selectPicture.length> 20){
message.warning('无法继续选择，一个任务最多关联20个课程'); message.warning('无法继续选择，一个任务最多关联20个课程');
console.log('1111'); const extraLength = (_list.length + currentTaskCourseData.length + selectLive.length + selectPicture.length) -20;
const extraLength = (_list.length + currentTaskCourseData.length + selectLive.length) -20;
_list.splice(_list.length - extraLength,extraLength); _list.splice(_list.length - extraLength,extraLength);
} }
this.setState({selectVideo:_list}); this.setState({selectVideo:_list});
...@@ -445,7 +622,7 @@ class SelectOperatorModal extends React.Component { ...@@ -445,7 +622,7 @@ class SelectOperatorModal extends React.Component {
<div className="select-box"> <div className="select-box">
<div> <div>
<span className="icon iconfont tip-icon">&#xe61d;</span> <span className="icon iconfont tip-icon">&#xe61d;</span>
<span className="select-num">已选择{selectVideo.length + selectLive.length}个</span> <span className="select-num">已选择{selectVideo.length + selectLive.length + selectPicture.length}个</span>
</div> </div>
<div> <div>
<span className="clear-btn" onClick={this.clearSelectCourse}>清空</span> <span className="clear-btn" onClick={this.clearSelectCourse}>清空</span>
...@@ -473,11 +650,10 @@ class SelectOperatorModal extends React.Component { ...@@ -473,11 +650,10 @@ class SelectOperatorModal extends React.Component {
} else { } else {
_list = _.reject(selectLive, (item) => _.find(changeRows, (data) => data.liveCourseId === item.liveCourseId)); _list = _.reject(selectLive, (item) => _.find(changeRows, (data) => data.liveCourseId === item.liveCourseId));
} }
if(_list.length + currentTaskCourseData.length + selectVideo.length> 20){ if(_list.length + currentTaskCourseData.length + selectVideo.length + selectPicture.length> 20){
message.warning('无法继续选择，一个任务最多关联20个课程'); message.warning('无法继续选择，一个任务最多关联20个课程');
const extraLength = (_list.length + currentTaskCourseData.length + selectVideo.length) -20; const extraLength = (_list.length + currentTaskCourseData.length + selectVideo.length + selectPicture.length) -20;
_list.splice(_list.length - extraLength,extraLength); _list.splice(_list.length - extraLength,extraLength);
console.log('_list',_list);
} }
this.setState({selectLive:_list}); this.setState({selectLive:_list});
...@@ -503,6 +679,72 @@ class SelectOperatorModal extends React.Component { ...@@ -503,6 +679,72 @@ class SelectOperatorModal extends React.Component {
} }
</div> </div>
</TabPane> </TabPane>
<TabPane tab="图文课" key="picture">
<div className="search-container">
<Search enterButton={<span className="icon iconfont">&#xe832;</span>} placeholder="搜索课程名称" style={{ width: 200 }} onChange={(e) => { this.handleChangPictureCourseName(e.target.value)}} onSearch={ () => { this.handleFetchPictureDataList()}} />
</div>
<div className="select-area">
<div className="select-box">
<div>
<span className="icon iconfont tip-icon">&#xe61d;</span>
<span className="select-num">已选择{selectVideo.length + selectLive.length + selectPicture.length }个</span>
</div>
<div>
<span className="clear-btn" onClick={this.clearSelectCourse}>清空</span>
</div>
</div>
<div className="related-box">该任务已关联{currentTaskCourseData.length}个课程，可继续选择{20- currentTaskCourseData.length }个</div>
</div>
<div>
<Table
rowKey={record => record.id}
dataSource={pictureDataSource}
columns={this.parsePictureColumns()}
pagination={false}
bordered
rowSelection={{
type: 'checkbox',
selectedRowKeys: _.pluck(selectPicture, 'id'),
onSelect: (record, selected) => {
this.selectPictureList(record, selected)
},
onSelectAll: (selected, _selectedRows, changeRows) => {
let _list = [];
if (selected) {
_list = _.uniq(selectPicture.concat(changeRows), false, (item) => item.id);
} else {
_list = _.reject(selectPicture, (item) => _.find(changeRows, (data) => data.id === item.id));
}
if(_list.length + currentTaskCourseData.length + selectVideo.length + selectLive.length> 20){
message.warning('无法继续选择，一个任务最多关联20个课程');
const extraLength = (_list.length + currentTaskCourseData.length + selectVideo.length + selectLive.length) -20;
_list.splice(_list.length - extraLength,extraLength);
}
this.setState({selectPicture:_list});
},
}}
/>
{pictureDataSource.length >0 &&
<div className="box-footer">
<PageControl
current={pictureQuery.current - 1}
pageSize={pictureSize}
size="small"
total={pictureTotalCount}
toPage={(page) => {
const _query = {...pictureQuery, current: page + 1};
this.setState({
pictureQuery:_query
},()=>{ this.handleFetchPictureDataList()})
}}
onShowSizeChange={this.onShowPictureSizeChange}
/>
</div>
}
</div>
</TabPane>
</Tabs> </Tabs>
</div> </div>
</Modal> </Modal>
......
src/modules/prepare-lesson/components/FolderList.jsx
...@@ -60,6 +60,29 @@ class FolderList extends React.Component { ...@@ -60,6 +60,29 @@ class FolderList extends React.Component {
} }
} }
// 埋点
handleDataDot = (folderFormat) => {
switch (folderFormat) {
case 'PDF':
window.WEBTRACING('resource_disk_file_preview_pdf', '资料云盘_点击预览_pdf');
break;
case 'WORD':
case 'DOCX':
case 'DOC':
window.WEBTRACING('resource_disk_file_preview_word', '资料云盘_点击预览_word');
break;
case 'EXCEL':
window.WEBTRACING('resource_disk_file_preview_excel', '资料云盘_点击预览_excel');
break;
case 'PPT':
case 'PPTX':
window.WEBTRACING('resource_disk_file_preview_ppt', '资料云盘_点击预览_ppt');
break;
default:
break;
}
}
// 预览文件 // 预览文件
handleScanFile = (folder) => { handleScanFile = (folder) => {
const { folderFormat, folderSize, ossUrl } = folder; const { folderFormat, folderSize, ossUrl } = folder;
...@@ -119,6 +142,9 @@ class FolderList extends React.Component { ...@@ -119,6 +142,9 @@ class FolderList extends React.Component {
this.setState({ scanFileModal }); this.setState({ scanFileModal });
break; break;
} }
// 预览文件埋点
this.handleDataDot(folderFormat);
} }
// 选择文件夹 // 选择文件夹
......
src/modules/resource-disk/components/FolderList.jsx
...@@ -73,6 +73,29 @@ class FolderList extends React.Component { ...@@ -73,6 +73,29 @@ class FolderList extends React.Component {
} }
} }
// 埋点
handleDataDot = (folderFormat) => {
switch (folderFormat) {
case 'PDF':
window.WEBTRACING('resource_disk_file_preview_pdf', '资料云盘_点击预览_pdf');
break;
case 'WORD':
case 'DOCX':
case 'DOC':
window.WEBTRACING('resource_disk_file_preview_word', '资料云盘_点击预览_word');
break;
case 'EXCEL':
window.WEBTRACING('resource_disk_file_preview_excel', '资料云盘_点击预览_excel');
break;
case 'PPT':
case 'PPTX':
window.WEBTRACING('resource_disk_file_preview_ppt', '资料云盘_点击预览_ppt');
break;
default:
break;
}
}
// 预览文件 // 预览文件
handleScanFile = (folder) => { handleScanFile = (folder) => {
const { folderFormat, folderSize, ossUrl } = folder; const { folderFormat, folderSize, ossUrl } = folder;
...@@ -132,6 +155,9 @@ class FolderList extends React.Component { ...@@ -132,6 +155,9 @@ class FolderList extends React.Component {
this.setState({ scanFileModal }); this.setState({ scanFileModal });
break; break;
} }
// 预览文件埋点
this.handleDataDot(folderFormat);
} }
// 选择文件夹 // 选择文件夹
......
src/modules/root/App.tsx
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2019-07-10 10:30:49 * @Date: 2019-07-10 10:30:49
* @LastEditors: wufan * @LastEditors: wufan
* @LastEditTime: 2021-03-11 17:22:01 * @LastEditTime: 2021-03-26 16:13:48
* @Description: * @Description:
*/ */
import React, { useContext, useEffect, useState } from 'react'; import React, { useContext, useEffect, useState } from 'react';
...@@ -17,6 +17,7 @@ import BaseService from "@/domains/basic-domain/baseService"; ...@@ -17,6 +17,7 @@ import BaseService from "@/domains/basic-domain/baseService";
import { XMContext } from '@/store/context'; import { XMContext } from '@/store/context';
import { setStoreGroupPermission, setStorePermission, setStoreGroupList, setStoreList } from '@/store/actions/index'; import { setStoreGroupPermission, setStorePermission, setStoreGroupList, setStoreList } from '@/store/actions/index';
import Bus from '@/core/tbus'; import Bus from '@/core/tbus';
declare var window: any; declare var window: any;
const App: React.FC = (props: any) => { const App: React.FC = (props: any) => {
...@@ -29,9 +30,11 @@ const App: React.FC = (props: any) => { ...@@ -29,9 +30,11 @@ const App: React.FC = (props: any) => {
useEffect(() => { useEffect(() => {
getStoreAndUserInfo(); getStoreAndUserInfo();
// window.RCHistory.push({ if (window.location.hash === "#/") {
// pathname: `/switch-route`, window.RCHistory.replace({
// }) pathname: '/home',
})
}
}, []) }, [])
async function getStoreAndUserInfo() { async function getStoreAndUserInfo() {
......
src/modules/store-manage/StoreH5DecorationTab.jsx
...@@ -377,7 +377,7 @@ class StoreH5Decoration extends React.Component { ...@@ -377,7 +377,7 @@ class StoreH5Decoration extends React.Component {
<div className="banner-setting"> <div className="banner-setting">
<div className="title">banner设置</div> <div className="title">banner设置</div>
<div className="tip"> <div className="tip">
图片支持bmp、jpeg、jpg、png、gif格式，最大5M，最多可添加5张，拖动可排序。建议尺寸750x252像素。 图片支持bmp、jpeg、jpg、png、gif格式，最大5M，最多可添加5张，拖动可排序。建议尺寸750*252px。
</div> </div>
</div> </div>
<Button <Button
......
src/modules/store-manage/StoreWebDecorationTab.jsx
...@@ -375,7 +375,7 @@ class StoreWebDecoration extends React.Component { ...@@ -375,7 +375,7 @@ class StoreWebDecoration extends React.Component {
<div className="banner-setting"> <div className="banner-setting">
<div className="title">banner设置</div> <div className="title">banner设置</div>
<div className="tip"> <div className="tip">
图片支持bmp、jpeg、jpg、png、gif格式，最大5M，最多可添加5张，拖动可排序。建议尺寸1232*212像素。 图片支持bmp、jpeg、jpg、png、gif格式，最大5M，最多可添加5张，拖动可排序。建议尺寸1232*212px。
</div> </div>
</div> </div>
<Button <Button
......
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