Skip to content

X
xiaomai-cloud-class-web
Commit eb0afa1e by chenshu
Options

Merge branch 'feature/zhangleyuan/20200220/training-program' into feature/chenshu/graphics

parents 94f36a3e 84ed76f5
Showing with 729 additions and 470 deletions
package.json
...@@ -68,7 +68,6 @@ ...@@ -68,7 +68,6 @@
"mini-css-extract-plugin": "0.9.0", "mini-css-extract-plugin": "0.9.0",
"moment": "^2.27.0", "moment": "^2.27.0",
"optimize-css-assets-webpack-plugin": "5.0.3", "optimize-css-assets-webpack-plugin": "5.0.3",
"photoclip": "^3.4.8",
"pnp-webpack-plugin": "1.6.4", "pnp-webpack-plugin": "1.6.4",
"postcss-flexbugs-fixes": "4.1.0", "postcss-flexbugs-fixes": "4.1.0",
"postcss-loader": "3.0.0", "postcss-loader": "3.0.0",
......
src/bu-components/ChooseMembersModal.jsx
...@@ -290,7 +290,6 @@ class ChooseMembersModal extends React.Component { ...@@ -290,7 +290,6 @@ class ChooseMembersModal extends React.Component {
onSearch={this.handleSearch} onSearch={this.handleSearch}
onChange={this.handleChangeSearchKey} onChange={this.handleChangeSearchKey}
className='search search-input' className='search search-input'
enterButton={<span className="icon iconfont">&#xe832;</span>} enterButton={<span className="icon iconfont">&#xe832;</span>}
/> />
<div className='container-left-body-table'> <div className='container-left-body-table'>
......
src/components/ImgCutModalNew.jsx
...@@ -3,7 +3,7 @@ import PropTypes from 'prop-types'; ...@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
import { Modal, Button } from 'antd'; import { Modal, Button } from 'antd';
import Service from '@/common/js/service'; import Service from '@/common/js/service';
import User from '@/common/js/user'; import User from '@/common/js/user';
import PhotoClip from 'photoclip' // import PhotoClip from 'photoclip'
let cutFlag = false; let cutFlag = false;
class ImgCutModalNew extends React.Component { class ImgCutModalNew extends React.Component {
......
src/core/antd.less
...@@ -131,6 +131,7 @@ ...@@ -131,6 +131,7 @@
.ant-input { .ant-input {
font-size: 14px !important; font-size: 14px !important;
border-color: #d9d9d9;
} }
.ant-input[disabled] { .ant-input[disabled] {
...@@ -616,8 +617,17 @@ mr0 { ...@@ -616,8 +617,17 @@ mr0 {
.ant-table-thead > tr > th{ .ant-table-thead > tr > th{
font-weight:normal !important; font-weight:normal !important;
} }
td.ant-table-column-sort{
background: none;
}
.ant-modal-content .ant-table-thead > tr > th{
padding:9px 24px;
}
.ant-modal-content tr > td{
padding:14px 24px !important;
}
//弹框里的table样式的处理
//按钮的样式的公共处理 //按钮的样式的公共处理
...@@ -784,4 +794,6 @@ mr0 { ...@@ -784,4 +794,6 @@ mr0 {
.ant-table-column-sorter { .ant-table-column-sorter {
margin-left: 2px!important; margin-left: 2px!important;
} }
.ant-table-column-sorter-full{
margin-top:-0.32rem !important;
}
src/h5.html
...@@ -37,7 +37,10 @@ ...@@ -37,7 +37,10 @@
Learn how to configure a non-root public URL by running `npm run build`. Learn how to configure a non-root public URL by running `npm run build`.
--> -->
<title>小麦企培</title> <title>小麦企培</title>
<script type="text/javascript" src="https://image.xiaomaiketang.com/xm/iscroll-zoom-min.js"></script>
<script type="text/javascript" src="https://image.xiaomaiketang.com/xm/hammer.min.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" 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>
</head> </head>
<body> <body>
......
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: zhangleyuan * @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-02 15:16:11 * @LastEditTime: 2021-03-11 15:28:14
* @Description: * @Description:
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
--> -->
...@@ -37,7 +37,10 @@ ...@@ -37,7 +37,10 @@
Learn how to configure a non-root public URL by running `npm run build`. Learn how to configure a non-root public URL by running `npm run build`.
--> -->
<title>小麦企培</title> <title>小麦企培</title>
<script type="text/javascript" src="https://image.xiaomaiketang.com/xm/iscroll-zoom-min.js"></script>
<script type="text/javascript" src="https://image.xiaomaiketang.com/xm/hammer.min.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" 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>
</head> </head>
<body> <body>
......
src/modules/course-manage/AddLive.jsx
...@@ -237,17 +237,6 @@ handleChangeBasicInfo = (field, value) => { ...@@ -237,17 +237,6 @@ handleChangeBasicInfo = (field, value) => {
assistantStoreUserId:type==='assistantType'?_.pluck(optionValue, "key"):assistantStoreUserId, assistantStoreUserId:type==='assistantType'?_.pluck(optionValue, "key"):assistantStoreUserId,
} }
}); });
// 批量开始时间改变，结束时间自动同步一致
// if (field === 'startTime') {
// this.setState({
// addLiveClassInfo: {
// ...this.state.addLiveClassInfo,
// [field]: _value,
// endTime: _value,
// }
// });
// }
} }
// 修改简介 // 修改简介
...@@ -346,7 +335,9 @@ handleChangeBasicInfo = (field, value) => { ...@@ -346,7 +335,9 @@ handleChangeBasicInfo = (field, value) => {
CourseService.createLiveCloudCourse(params).then((res) => { CourseService.createLiveCloudCourse(params).then((res) => {
if (res.success){ if (res.success){
message.success("新建成功"); message.success("新建成功");
window.RCHistory.goBack(); window.RCHistory.push({
pathname: `/live-course`,
});
} }
}); });
...@@ -359,7 +350,9 @@ handleChangeBasicInfo = (field, value) => { ...@@ -359,7 +350,9 @@ handleChangeBasicInfo = (field, value) => {
CourseService.updateLiveCloudCourse(params).then((res) => { CourseService.updateLiveCloudCourse(params).then((res) => {
if (res.success){ if (res.success){
message.success("更新成功"); message.success("更新成功");
window.RCHistory.goBack(); window.RCHistory.push({
pathname: `/live-course`,
});
} }
}); });
} }
...@@ -493,11 +486,15 @@ handleChangeBasicInfo = (field, value) => { ...@@ -493,11 +486,15 @@ handleChangeBasicInfo = (field, value) => {
cancelText: '留在本页', cancelText: '留在本页',
icon: <span className="icon iconfont default-confirm-icon">&#xe6f4;</span>, icon: <span className="icon iconfont default-confirm-icon">&#xe6f4;</span>,
onOk: () => { onOk: () => {
window.RCHistory.goBack(); window.RCHistory.push({
pathname: `/live-course`,
});
} }
}) })
} else { } else {
window.RCHistory.goBack(); window.RCHistory.push({
pathname: `/live-course`,
});
} }
} }
......
src/modules/course-manage/components/AddLiveBasic.jsx
...@@ -13,7 +13,7 @@ import { ImgCutModalNew } from '@/components'; ...@@ -13,7 +13,7 @@ import { ImgCutModalNew } from '@/components';
import StoreService from "@/domains/store-domain/storeService"; import StoreService from "@/domains/store-domain/storeService";
import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepareFileModal'; import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepareFileModal';
import Upload from '@/core/upload'; import Upload from '@/core/upload';
import PhotoClip from 'photoclip' // import PhotoClip from 'photoclip'
import './AddLiveBasic.less'; import './AddLiveBasic.less';
......
src/modules/course-manage/components/LiveCourseList.jsx
...@@ -292,15 +292,18 @@ class LiveCourseList extends React.Component { ...@@ -292,15 +292,18 @@ class LiveCourseList extends React.Component {
dataIndex: "planList", dataIndex: "planList",
render: (val, record) => { render: (val, record) => {
return ( return (
<span> <div className="related-task">
{ record.relatedPlanList ? { record.relatedPlanList ?
record.relatedPlanList.map((item,index)=>{ <Tooltip title={this.handlePlanName(record.relatedPlanList)} placement="top" arrowPointAtCenter>
return <span>{item.planName} { (index < record.relatedPlanList.length-1)&&(<span> 、</span>)} </span> { record.relatedPlanList.map((item,index)=>{
}) return <span>{item.planName} { (index < record.relatedPlanList.length-1)&&(<span> 、</span>)} </span>
})
}
</Tooltip>
: :
<span></span> <span></span>
} }
</span> </div>
) )
}, },
}, },
...@@ -509,15 +512,18 @@ class LiveCourseList extends React.Component { ...@@ -509,15 +512,18 @@ class LiveCourseList extends React.Component {
dataIndex: "planList", dataIndex: "planList",
render: (val, record) => { render: (val, record) => {
return ( return (
<span> <div className="related-task">
{ record.relatedPlanList ? { record.relatedPlanList ?
record.relatedPlanList.map((item,index)=>{ <Tooltip title={this.handlePlanName(record.relatedPlanList)} placement="top" arrowPointAtCenter>
return <span>{item.planName} { (index < record.relatedPlanList.length-1)&&(<span> 、</span>)} </span> { record.relatedPlanList.map((item,index)=>{
}) return <span>{item.planName} { (index < record.relatedPlanList.length-1)&&(<span> 、</span>)} </span>
})
}
</Tooltip>
: :
<span></span> <span></span>
} }
</span> </div>
) )
}, },
}, },
...@@ -536,6 +542,19 @@ class LiveCourseList extends React.Component { ...@@ -536,6 +542,19 @@ class LiveCourseList extends React.Component {
}) })
return adminStr return adminStr
} }
handlePlanName = (planArray)=>{
let planStr = "";
planArray.map((item,index)=>{
if(index < planArray.length-1){
planStr = planStr + item.planName + '、';
}else{
planStr = planStr + item.planName
}
})
return planStr
}
renderMoreOperate = (item) => { renderMoreOperate = (item) => {
return ( return (
<div className="live-course-more-menu"> <div className="live-course-more-menu">
......
src/modules/course-manage/components/LiveCourseList.less
...@@ -67,6 +67,15 @@ ...@@ -67,6 +67,15 @@
} }
.related-task{
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
}
.categoryName{ .categoryName{
font-size: 14px; font-size: 14px;
color: #666666; color: #666666;
......
src/modules/course-manage/modal/RelatedPlanModal.jsx
...@@ -122,7 +122,9 @@ class RelatedPlanModal extends React.Component { ...@@ -122,7 +122,9 @@ class RelatedPlanModal extends React.Component {
item.taskId = selectPlanList[key].taskBaseVOList[0].taskId; item.taskId = selectPlanList[key].taskBaseVOList[0].taskId;
} }
} }
_selectPlanList.push(item) if(item.taskId){
_selectPlanList.push(item)
}
} }
return _selectPlanList; return _selectPlanList;
} }
...@@ -140,7 +142,7 @@ class RelatedPlanModal extends React.Component { ...@@ -140,7 +142,7 @@ class RelatedPlanModal extends React.Component {
getSelectLength = (selectList)=>{ getSelectLength = (selectList)=>{
let num = 0; let num = 0;
for(let key in selectList ){ for(let key in selectList ){
if(selectList[key].taskBaseVOList){ if(selectList[key].taskBaseVOList.length > 0){
num = num + 1 num = num + 1
} }
} }
...@@ -173,10 +175,16 @@ class RelatedPlanModal extends React.Component { ...@@ -173,10 +175,16 @@ class RelatedPlanModal extends React.Component {
enterButton={<span className="icon iconfont">&#xe832;</span>} enterButton={<span className="icon iconfont">&#xe832;</span>}
/> />
</div> </div>
<div className="select-container"> <div className="select-container">
<span className="icon iconfont tip">&#xe6f2;</span> <span className="con">
<span className="text">已选择{this.getSelectLength(selectPlanList)}个任务</span> <div>
<span className="clear" onClick={this.clearSelect}>清空</span> <span className="icon iconfont tip">&#xe6f2;</span>
<span className="text">已选择{this.getSelectLength(selectPlanList)}个任务</span>
</div>
<div>
<span className="clear" onClick={this.clearSelect}>清空</span>
</div>
</span>
</div> </div>
<div> <div>
<Table <Table
...@@ -212,13 +220,6 @@ class RelatedPlanModal extends React.Component { ...@@ -212,13 +220,6 @@ class RelatedPlanModal extends React.Component {
this.selectPlanList(record,selected,_record.planId); this.selectPlanList(record,selected,_record.planId);
}, },
onSelectAll: (selected, _selectedRows, changeRows) => { onSelectAll: (selected, _selectedRows, changeRows) => {
// let _list = [];
// if (selected) {
// _list = _.uniq(selectVideo.concat(changeRows), false, (item) => item.id);
// } else {
// _list = _.reject(selectVideo, (item) => _.find(changeRows, (data) => data.id === item.id));
// }
// this.setState({selectVideo:_list});
}, },
}} }}
/> />
...@@ -233,6 +234,7 @@ class RelatedPlanModal extends React.Component { ...@@ -233,6 +234,7 @@ class RelatedPlanModal extends React.Component {
current={query.current - 1} current={query.current - 1}
pageSize={size} pageSize={size}
total={totalCount} total={totalCount}
size="small"
toPage={(page) => { toPage={(page) => {
const _query = {...query, current: page + 1}; const _query = {...query, current: page + 1};
this.setState({ this.setState({
......
src/modules/course-manage/modal/RelatedPlanModal.less
...@@ -4,26 +4,30 @@ ...@@ -4,26 +4,30 @@
} }
.select-container{ .select-container{
margin-bottom:12px; margin-bottom:12px;
background: #FFF4DD; .con{
border-radius: 4px; background: #FFF4DD;
padding:6px 16px; border-radius: 4px;
width: 207px; padding:6px 16px;
height: 32px; display: inline-flex;
.tip{ align-items: center;
font-size:14px; justify-content: space-between;
color:#FF9D14; .tip{
margin-right:8px; font-size:14px;
} color:#FF9D14;
.text{ margin-right:8px;
font-size:14px; }
color:#666; .text{
margin-right:30px; font-size:14px;
} color:#666;
.clear{ margin-right:30px;
color:#5289FA; }
font-size:14px; .clear{
color:#5289FA;
} font-size:14px;
}
}
} }
.plan-table{ .plan-table{
.taskName{ .taskName{
...@@ -39,7 +43,8 @@ ...@@ -39,7 +43,8 @@
.course-type{ .course-type{
font-size:11px; font-size:11px;
color:#666666; color:#666666;
padding:1px 8px; padding:0px 6px;
line-height: 16px;
border: 1px solid #999999; border: 1px solid #999999;
margin-right:4px; margin-right:4px;
border-radius: 2px; border-radius: 2px;
......
src/modules/course-manage/video-course/AddVideoCourse.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-08 15:24:25 * @LastEditTime: 2021-03-12 10:12:23
* @Description: 视频课新增/编辑页 * @Description: 视频课新增/编辑页
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -24,7 +24,7 @@ import CourseService from "@/domains/course-domain/CourseService"; ...@@ -24,7 +24,7 @@ import CourseService from "@/domains/course-domain/CourseService";
import User from '@/common/js/user'; import User from '@/common/js/user';
import _ from "underscore"; import _ from "underscore";
import Upload from '@/core/upload'; import Upload from '@/core/upload';
import PhotoClip from 'photoclip'; // import PhotoClip from 'photoclip';
import './AddVideoCourse.less'; import './AddVideoCourse.less';
const EDIT_BOX_KEY = Math.random(); const EDIT_BOX_KEY = Math.random();
...@@ -200,11 +200,15 @@ class AddVideoCourse extends React.Component { ...@@ -200,11 +200,15 @@ class AddVideoCourse 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: `/video-course`,
});
} }
}); });
}else{ }else{
RCHistory.goBack(); window.RCHistory.push({
pathname: `/video-course`,
});
} }
} }
...@@ -349,7 +353,9 @@ class AddVideoCourse extends React.Component { ...@@ -349,7 +353,9 @@ class AddVideoCourse extends React.Component {
CourseService.createVideoSchedule(commonParams).then((res) => { CourseService.createVideoSchedule(commonParams).then((res) => {
if (!res) return; if (!res) return;
message.success("新建成功"); message.success("新建成功");
window.RCHistory.goBack(); window.RCHistory.push({
pathname: `/video-course`,
});
}) })
} else { } else {
const editParams = { const editParams = {
...@@ -359,7 +365,9 @@ class AddVideoCourse extends React.Component { ...@@ -359,7 +365,9 @@ class AddVideoCourse extends React.Component {
CourseService.editVideoSchedule(editParams).then((res) => { CourseService.editVideoSchedule(editParams).then((res) => {
if (!res) return; if (!res) return;
message.success("保存成功"); message.success("保存成功");
window.RCHistory.goBack(); window.RCHistory.push({
pathname: `/video-course`,
});
}); });
} }
}); });
......
src/modules/course-manage/video-course/components/VideoCourseList.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-03-10 15:53:11 * @LastEditTime: 2021-03-16 15:20:35
* @Description: 视频课-列表模块 * @Description: 视频课-列表模块
* @Copyright: 杭州杰竞科技有限公司 版权所有 * @Copyright: 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -93,7 +93,7 @@ class VideoCourseList extends React.Component { ...@@ -93,7 +93,7 @@ class VideoCourseList extends React.Component {
title: '课程分类', title: '课程分类',
key: 'categoryName', key: 'categoryName',
dataIndex: 'categoryName', dataIndex: 'categoryName',
width: '20%', width: 200,
render: (val, record) => { render: (val, record) => {
return ( return (
<div className="record__item"> <div className="record__item">
...@@ -106,7 +106,7 @@ class VideoCourseList extends React.Component { ...@@ -106,7 +106,7 @@ class VideoCourseList 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>
...@@ -128,7 +128,7 @@ class VideoCourseList extends React.Component { ...@@ -128,7 +128,7 @@ class VideoCourseList 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 (
...@@ -174,15 +174,18 @@ class VideoCourseList extends React.Component { ...@@ -174,15 +174,18 @@ class VideoCourseList extends React.Component {
dataIndex: "planList", dataIndex: "planList",
render: (val, record) => { render: (val, record) => {
return ( return (
<span> <div className="related-task">
{ record.relatedPlanList ? { record.relatedPlanList ?
record.relatedPlanList.map((item,index)=>{ <Tooltip title={this.handlePlanName(record.relatedPlanList)} placement="top" arrowPointAtCenter>
return <span>{item.planName} { (index < record.relatedPlanList.length-1)&&(<span> 、</span>)} </span> { record.relatedPlanList.map((item,index)=>{
}) return <span>{item.planName} { (index < record.relatedPlanList.length-1)&&(<span> 、</span>)} </span>
: })
<span></span> }
} </Tooltip>
</span> :
<span></span>
}
</div>
) )
} }
}, },
...@@ -217,7 +220,7 @@ class VideoCourseList extends React.Component { ...@@ -217,7 +220,7 @@ class VideoCourseList extends React.Component {
]; ];
return columns; return columns;
} }
renderMoreOperate = (item) => { renderMoreOperate = (item) => {
return ( return (
<div className="live-course-more-menu"> <div className="live-course-more-menu">
...@@ -240,7 +243,19 @@ class VideoCourseList extends React.Component { ...@@ -240,7 +243,19 @@ class VideoCourseList extends React.Component {
</div> </div>
) )
} }
//改变上架状态
handlePlanName = (planArray)=>{
let planStr = "";
planArray.map((item,index)=>{
if(index < planArray.length-1){
planStr = planStr + item.planName + '、';
}else{
planStr = planStr + item.planName
}
})
return planStr
}
//改变上架状态
changeShelfState = (item) =>{ changeShelfState = (item) =>{
let _shelfState = item.shelfState let _shelfState = item.shelfState
if(_shelfState==='NO'){ if(_shelfState==='NO'){
......
src/modules/course-manage/video-course/components/VideoCourseList.less
...@@ -70,7 +70,15 @@ ...@@ -70,7 +70,15 @@
height:48px; height:48px;
} }
} }
.related-task{
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
}
} }
.video-course-more-menu { .video-course-more-menu {
......
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-10 16:51:57 * @LastEditTime: 2021-03-16 11:27:06
* @Description: 描述一下 * @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -28,7 +28,6 @@ const defaultBasicData = { ...@@ -28,7 +28,6 @@ const defaultBasicData = {
operateType:'All_Operate', operateType:'All_Operate',
percentCompleteLive:80, percentCompleteLive:80,
percentCompleteVideo:80, percentCompleteVideo:80,
} }
const defaultTaskList = []; const defaultTaskList = [];
...@@ -38,6 +37,8 @@ function AddPlan() { ...@@ -38,6 +37,8 @@ function AddPlan() {
const [basicData,setBasicData] = useState(defaultBasicData); const [basicData,setBasicData] = useState(defaultBasicData);
const [taskList,setTaskList] = useState(defaultTaskList); const [taskList,setTaskList] = useState(defaultTaskList);
const [expiredCourseList,setExpiredCourseList] = useState([]); const [expiredCourseList,setExpiredCourseList] = useState([]);
const [hasGetDetail,setHasGetDetail]= useState(false);
const [submitDisabled,setSubmitDisabled] = useState(false);
useEffect(()=>{ useEffect(()=>{
if(type==='edit'){ if(type==='edit'){
getPlanDetail(); getPlanDetail();
...@@ -91,6 +92,7 @@ function AddPlan() { ...@@ -91,6 +92,7 @@ function AddPlan() {
return _item return _item
}) })
} }
setTaskList(trainingTaskList);
setBasicData({ setBasicData({
planName, planName,
coverUrl:coverUrl || defaultCover, coverUrl:coverUrl || defaultCover,
...@@ -102,10 +104,10 @@ function AddPlan() { ...@@ -102,10 +104,10 @@ function AddPlan() {
percentCompleteLive, percentCompleteLive,
percentCompleteVideo percentCompleteVideo
}) })
setTaskList(trainingTaskList) setHasGetDetail(true);
}) })
} }
function handleChangeBasicInfo(field, value){ function handleChangeBasicInfo(field, value,option){
setBasicData( { setBasicData( {
...basicData, ...basicData,
[field]: value, [field]: value,
...@@ -118,7 +120,8 @@ function AddPlan() { ...@@ -118,7 +120,8 @@ 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,coverId,coverUrl} = basicData;
if(!planName){ let input = /^[\s]*$/;
if(!planName || input.test(planName)){
message.warning('请输入的培训计划名称'); message.warning('请输入的培训计划名称');
return; return;
} }
...@@ -138,6 +141,22 @@ function AddPlan() { ...@@ -138,6 +141,22 @@ function AddPlan() {
message.warning('请输入培训计划内容'); message.warning('请输入培训计划内容');
return; return;
} }
for(let i=0;i<taskList.length;i++){
if(input.test(taskList[i].taskName)){
message.warning('培训任务名称不能为空');
return false;
}
if(taskList[i].courseList.length === 0){
Modal.confirm({
title: '保存失败',
content: '每个任务下至少关联一个课程',
okText: '确定',
cancelText: '取消',
icon: <span className="icon iconfont default-confirm-icon">&#xe6f4;</span>,
})
return false;
}
}
let scheduleMediaRequests = []; let scheduleMediaRequests = [];
let coverObj ={ let coverObj ={
contentType:'COVER', contentType:'COVER',
...@@ -173,6 +192,7 @@ function AddPlan() { ...@@ -173,6 +192,7 @@ function AddPlan() {
PlanService.createTrainingPlan(params).then((res) => { PlanService.createTrainingPlan(params).then((res) => {
if (res.success){ if (res.success){
message.success("新建成功"); message.success("新建成功");
setSubmitDisabled(true);
window.RCHistory.goBack(); window.RCHistory.goBack();
} }
}); });
...@@ -244,7 +264,7 @@ function AddPlan() { ...@@ -244,7 +264,7 @@ function AddPlan() {
</div> </div>
<div className="basic-info__wrap"> <div className="basic-info__wrap">
<div className="title">培训任务</div> <div className="title">培训任务</div>
{ (type==='edit' && taskList.length>0) && { (type==='edit' && hasGetDetail) &&
<TrainingTask data={taskList} onChange={handleChangeTaskInfo} /> <TrainingTask data={taskList} onChange={handleChangeTaskInfo} />
} }
{ type==='add' && { type==='add' &&
...@@ -261,7 +281,7 @@ function AddPlan() { ...@@ -261,7 +281,7 @@ function AddPlan() {
</div> </div>
<div className="footer"> <div className="footer">
<Button onClick={handleGoBack}>取消</Button> <Button onClick={handleGoBack}>取消</Button>
<Button type="primary" onClick={submitInfo}>保存</Button> <Button type="primary" onClick={submitInfo} disabled={submitDisabled}>保存</Button>
</div> </div>
</div> </div>
) )
......
src/modules/plan-manage/LearningData.jsx
...@@ -27,6 +27,7 @@ class LearningData extends React.Component { ...@@ -27,6 +27,7 @@ class LearningData extends React.Component {
createName:"" createName:""
} }
} }
componentDidMount(){ componentDidMount(){
this.getPlanDetail(); this.getPlanDetail();
Bus.bind('watchDataView',() =>{this.setState({activeKey:"userLearningData"}) }) Bus.bind('watchDataView',() =>{this.setState({activeKey:"userLearningData"}) })
...@@ -62,6 +63,7 @@ class LearningData extends React.Component { ...@@ -62,6 +63,7 @@ class LearningData extends React.Component {
}) })
}) })
} }
render() { render() {
const {planName,coverUrl,courseNum,created,cultureCustomerNum,activeKey,createName} = this.state; const {planName,coverUrl,courseNum,created,cultureCustomerNum,activeKey,createName} = this.state;
return ( return (
...@@ -97,10 +99,10 @@ class LearningData extends React.Component { ...@@ -97,10 +99,10 @@ class LearningData extends React.Component {
<div className="box"> <div className="box">
{ (User.getUserRole() === "CloudManager" || User.getUserRole() === "StoreManager")? { (User.getUserRole() === "CloudManager" || User.getUserRole() === "StoreManager")?
(<Tabs activeKey={activeKey} onChange={(activeKey)=>{this.setState({activeKey})}}> (<Tabs activeKey={activeKey} onChange={(activeKey)=>{this.setState({activeKey})}}>
<Tabs.TabPane tab="员工分享数据" key="employeeShareData"> <Tabs.TabPane tab="员工分享数据" key="employeeShareData" forceRender="true">
<EmployeeShareData/> <EmployeeShareData/>
</Tabs.TabPane> </Tabs.TabPane>
<Tabs.TabPane tab="用户学习数据" key="userLearningData"> <Tabs.TabPane tab="用户学习数据" key="userLearningData" forceRender="true">
<UserLearningData/> <UserLearningData/>
</Tabs.TabPane> </Tabs.TabPane>
</Tabs>) </Tabs>)
......
src/modules/plan-manage/LearningData.less
.plan-learn-data-list{ .plan-learn-data-list{
.ant-tabs-tab.ant-tabs-tab-active{
font-weight:normal;
}
.ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn{
font-weight:normal;
}
.plan-info{ .plan-info{
margin:16px; margin:16px;
padding:16px; padding:16px;
......
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-10 19:03:09 * @LastEditTime: 2021-03-15 17:01:47
* @Description: 描述一下 * @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -13,9 +13,10 @@ import SelectOperatorModal from '../modal/SelectOperatorModal'; ...@@ -13,9 +13,10 @@ import SelectOperatorModal from '../modal/SelectOperatorModal';
import { ImgCutModalNew } from '@/components'; import { ImgCutModalNew } from '@/components';
import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepareFileModal'; import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepareFileModal';
import Upload from '@/core/upload'; import Upload from '@/core/upload';
import PhotoClip from 'photoclip' // import PhotoClip from 'photoclip'
import './BasicInfo.less'; import './BasicInfo.less';
const { TextArea } = Input; const { TextArea } = Input;
const defaultCover = 'https://image.xiaomaiketang.com/xm/YNfi45JwFA.png'; const defaultCover = 'https://image.xiaomaiketang.com/xm/YNfi45JwFA.png';
let cutFlag = false; let cutFlag = false;
...@@ -218,7 +219,7 @@ class BasicInfo extends React.Component{ ...@@ -218,7 +219,7 @@ class BasicInfo extends React.Component{
<span className="label"><span className="require">*</span>培训计划名称：</span> <span className="label"><span className="require">*</span>培训计划名称：</span>
<Input <Input
value={planName} value={planName}
placeholder="请输入培训计划名称,最多20字" placeholder="请输入培训计划名称(20字以内)"
maxLength={20} maxLength={20}
style={{ width: 240 }} style={{ width: 240 }}
onChange={(e)=>this.props.onChange('planName', e.target.value)} onChange={(e)=>this.props.onChange('planName', e.target.value)}
...@@ -252,7 +253,7 @@ class BasicInfo extends React.Component{ ...@@ -252,7 +253,7 @@ class BasicInfo extends React.Component{
<TextArea <TextArea
placeholder="请输入培训计划简介" placeholder="请输入培训计划简介"
maxLength={200} maxLength={200}
style={{ width: 480 }} style={{ width: '552px',height:'110px'}}
className="instro-textarea" className="instro-textarea"
value={instro} value={instro}
onChange={(e)=>this.props.onChange('instro', e.target.value)} onChange={(e)=>this.props.onChange('instro', e.target.value)}
...@@ -308,28 +309,32 @@ class BasicInfo extends React.Component{ ...@@ -308,28 +309,32 @@ class BasicInfo extends React.Component{
</div> </div>
</div> </div>
<div className="done-standard"> <div className="done-standard">
<span className="label"><span className="require">*</span>完成标准：</span> <span className="label standard-label"><span className="require">*</span>完成标准：</span>
<div> <div>
<div className="live-standard-info"> <div className="live-standard-info">
<span className="icon iconfont">&#xe865;</span> <span className="icon iconfont">&#xe865;</span>
<span>直播课单个课程，用户学习进度达到 <span className="instro">直播课单个课程，用户学习进度达到
<Input <Input
width="40" width="40"
value={percentCompleteLive} value={percentCompleteLive}
onChange={(e) => { this.props.onChange('percentCompleteLive', e.target.value.replace(/\D/g,'')) }} onChange={(e) => { this.props.onChange('percentCompleteLive', e.target.value.replace(/\D/g,'')) }}
onBlur={(e)=>this.percentCompleteBlur(e,'percentCompleteLive')} onBlur={(e)=>this.percentCompleteBlur(e,'percentCompleteLive')}
/>% className="input-box"
即视为“已完成”学习 />%，即视为"已完成"学习
</span> </span>
</div> </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 className="instro">视频课单个课程，用户学习进度达到
<Input width="40" <Input
value={percentCompleteVideo} width="40"
onChange={(e) => { this.props.onChange('percentCompleteVideo', e.target.value.replace(/\D/g,'')) }} value={percentCompleteVideo}
onBlur={(e)=>this.percentCompleteBlur(e,'percentCompleteVideo')}/> onChange={(e) => { this.props.onChange('percentCompleteVideo', e.target.value.replace(/\D/g,'')) }}
%即视为“已完成”学习 onBlur={(e)=>this.percentCompleteBlur(e,'percentCompleteVideo')}
className="input-box"
/>
%，即视为"已完成"学习
</span> </span>
</div> </div>
<div className="video-standard-info"> <div className="video-standard-info">
......
src/modules/plan-manage/components/BasicInfo.less
...@@ -3,6 +3,8 @@ ...@@ -3,6 +3,8 @@
width: 110px; width: 110px;
text-align: right; text-align: right;
display:inline-block; display:inline-block;
font-size:14px;
color:#666;
.require { .require {
color: #EC4B35; color: #EC4B35;
} }
...@@ -16,6 +18,7 @@ ...@@ -16,6 +18,7 @@
margin-top: 16px; margin-top: 16px;
&__wrap { &__wrap {
position: relative; position: relative;
display: flex;
.tag { .tag {
border-radius: 2px; border-radius: 2px;
background: #D6D6D6; background: #D6D6D6;
...@@ -29,16 +32,10 @@ ...@@ -29,16 +32,10 @@
left: 8px; left: 8px;
} }
} }
.cover__wrap {
display: flex;
flex-direction: row;
}
.img-content { .img-content {
margin-right: 20px; margin-right: 20px;
width: 299px; width: 299px;
height: 169px; height: 169px;
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
...@@ -46,6 +43,22 @@ ...@@ -46,6 +43,22 @@
border: 1px solid #E8e8e8; border: 1px solid #E8e8e8;
} }
} }
.opt-btns{
.default-btn {
margin:0 8px;
color: #5289FA;
cursor: pointer;
&.disabled {
color: #CCC;
cursor: not-allowed;
}
}
.tips{
margin-top:8px;
font-size:14px;
color:#999;
}
}
} }
.introduction{ .introduction{
margin-top:16px; margin-top:16px;
...@@ -67,6 +80,9 @@ ...@@ -67,6 +80,9 @@
.view-range{ .view-range{
display:flex; display:flex;
margin-top:16px; margin-top:16px;
.label{
margin-top:2px;
}
.instro-text{ .instro-text{
color:#999; color:#999;
margin-left:12px; margin-left:12px;
...@@ -74,10 +90,17 @@ ...@@ -74,10 +90,17 @@
.choose-business{ .choose-business{
margin-top:16px; margin-top:16px;
} }
.playback__text{
margin-left:12px;
color:#999999;
}
} }
.done-standard{ .done-standard{
display: flex; display: flex;
margin-top:22px; margin-top:22px;
.standard-label{
margin-top:3px;
}
.live-standard-info{ .live-standard-info{
margin-bottom:10px; margin-bottom:10px;
} }
...@@ -86,7 +109,24 @@ ...@@ -86,7 +109,24 @@
width:90px; width:90px;
height:32px; height:32px;
} }
.icon{
color:#A0A0A0;
font-size:14px;
margin-right:4px;
}
.instro{
color:#333333;
font-size:14px;
}
.input-box{
width: 60px;
height: 32px;
border-radius: 4px;
border: 1px solid #E8E8E8;
color:#333333;
font-size:14px;
margin:0 2px;
}
} }
} }
src/modules/plan-manage/components/EmployeeShareData.jsx
...@@ -105,7 +105,7 @@ class EmployeeShareData extends React.Component { ...@@ -105,7 +105,7 @@ class EmployeeShareData extends React.Component {
}) })
} }
watchDataView = (record)=>{ watchDataView = (record)=>{
Bus.trigger('watchDataView',record.storeUserId); Bus.trigger('watchDataView',record);
} }
// 请求表头 // 请求表头
parselumns = () => { parselumns = () => {
...@@ -150,6 +150,7 @@ class EmployeeShareData extends React.Component { ...@@ -150,6 +150,7 @@ class EmployeeShareData extends React.Component {
title: '最近分享成功时间', title: '最近分享成功时间',
key: 'recentlyForwardTime', key: 'recentlyForwardTime',
dataIndex: 'recentlyForwardTime', dataIndex: 'recentlyForwardTime',
width:240,
render: (val, record) => { render: (val, record) => {
return ( return (
<div> <div>
...@@ -162,41 +163,44 @@ class EmployeeShareData extends React.Component { ...@@ -162,41 +163,44 @@ class EmployeeShareData extends React.Component {
title: '学习人数', title: '学习人数',
key: 'learnNum', key: 'learnNum',
dataIndex: 'learnNum', dataIndex: 'learnNum',
width:110,
sorter:true, sorter:true,
render: (val, record) => { render: (val, record) => {
return ( return (
<div> <div className="learn-num">
{val}
</div>
)
}
},
{
title: '已学完',
key: 'learnFinishNum',
dataIndex: 'learnFinishNum',
sorter:true,
render: (val, record) => {
return (
<div>
{val}
</div>
)
}
},
{
title: '未学完',
key: 'learnNoFinishNum',
dataIndex: 'learnNoFinishNum',
sorter:true,
render: (val, record) => {
return (
<div>
{val} {val}
</div> </div>
) )
} }
}, },
// {
// title: '已学完',
// key: 'learnFinishNum',
// dataIndex: 'learnFinishNum',
// width:110,
// sorter:true,
// render: (val, record) => {
// return (
// <div className="learn-finish-num">
// {val}
// </div>
// )
// }
// },
// {
// title: '未学完',
// key: 'learnNoFinishNum',
// dataIndex: 'learnNoFinishNum',
// width:110,
// sorter:true,
// render: (val, record) => {
// return (
// <div className="learn-no-finish-num">
// {val}
// </div>
// )
// }
// },
{ {
title: '操作', title: '操作',
key: 'operate', key: 'operate',
...@@ -216,7 +220,7 @@ class EmployeeShareData extends React.Component { ...@@ -216,7 +220,7 @@ class EmployeeShareData extends React.Component {
return ( return (
<div className="employee-share-data"> <div className="employee-share-data">
<div className="search-container"> <div className="search-container">
<Search placeholder="搜索员工姓名手机号" onChange={(e) => { this.handleChangNickname(e.target.value)}} onSearch={ () => { this.handleFetchDataList()}} style={{ width: 200 }} enterButton={<span className="icon iconfont">&#xe832;</span>}/> <Search placeholder="搜索员工姓名或手机号" onChange={(e) => { this.handleChangNickname(e.target.value)}} onSearch={ () => { this.handleFetchDataList()}} style={{ width: 200 }} enterButton={<span className="icon iconfont">&#xe832;</span>}/>
</div> </div>
<div> <div>
<Table <Table
...@@ -225,6 +229,7 @@ class EmployeeShareData extends React.Component { ...@@ -225,6 +229,7 @@ class EmployeeShareData extends React.Component {
columns={this.parselumns()} columns={this.parselumns()}
pagination={false} pagination={false}
onChange={this.handleChangeTable} onChange={this.handleChangeTable}
showSorterTooltip={false}
bordered bordered
/> />
{dataSource.length >0 && {dataSource.length >0 &&
......
src/modules/plan-manage/components/EmployeeShareData.less
...@@ -7,4 +7,16 @@ ...@@ -7,4 +7,16 @@
color:#5289FA; color:#5289FA;
cursor: pointer; cursor: pointer;
} }
.learn-num{
text-align:right;
margin-right:20px;
}
.learn-finish-num{
text-align:right;
margin-right:30px;
}
.learn-no-finish-num{
text-align:right;
margin-right:35px;
}
} }
\ No newline at end of file
src/modules/plan-manage/components/ExpiredCourseList.less
.expired-course-list{ .expired-course-list{
margin:18px 10px 16px; margin:8px 10px 0px;
.course-item{ .course-item{
display:flex; display:flex;
padding:16px 0; padding:16px 0;
border-bottom:1px solid #E8E8E8; border-bottom:1px dotted #E8E8E8;
justify-content: space-between; justify-content: space-between;
&:last-child{
border-bottom:none;
padding-bottom:0px;
}
.course-left{ .course-left{
display:flex; display:flex;
...@@ -19,11 +22,12 @@ ...@@ -19,11 +22,12 @@
.course-type{ .course-type{
margin-right:16px; margin-right:16px;
span{ span{
padding:2px 8px; padding:0px 6px;
color:#666666; color:#666666;
font-size:11px; font-size:11px;
border-radius: 2px; border-radius: 2px;
border: 1px solid #999999; border: 1px solid #999999;
line-height: 16px;
} }
} }
.course-instro{ .course-instro{
......
src/modules/plan-manage/components/PlanFilter.jsx
...@@ -39,7 +39,7 @@ function PlanFilter(props) { ...@@ -39,7 +39,7 @@ function PlanFilter(props) {
useEffect(() => { useEffect(() => {
getCreatorList(); getCreatorList();
}, [creatorQuery]); }, []);
// 改变搜索条件 // 改变搜索条件
function handleChangeQuery(field, value){ function handleChangeQuery(field, value){
...@@ -98,6 +98,9 @@ function PlanFilter(props) { ...@@ -98,6 +98,9 @@ function PlanFilter(props) {
const container = e.target; const container = e.target;
const scrollToBottom = container && container.scrollHeight <= container.clientHeight + container.scrollTop; const scrollToBottom = container && container.scrollHeight <= container.clientHeight + container.scrollTop;
if (scrollToBottom && hasNext) { if (scrollToBottom && hasNext) {
const _creatorQuery = {...creatorQuery};
_creatorQuery.current = creatorQuery.current + 1;
setCreatorQuery(_creatorQuery);
getCreatorList(creatorQuery.current + 1); getCreatorList(creatorQuery.current + 1);
} }
} }
......
src/modules/plan-manage/components/PlanList.jsx
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: zhangleyuan * @Author: zhangleyuan
* @Date: 2021-02-20 16:46:46 * @Date: 2021-02-20 16:46:46
* @LastEditors: zhangleyuan * @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-10 15:51:26 * @LastEditTime: 2021-03-16 15:53:59
* @Description: 描述一下 * @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -28,10 +28,10 @@ function PlanList(props) { ...@@ -28,10 +28,10 @@ function PlanList(props) {
title: '培训计划', title: '培训计划',
key: 'planName', key: 'planName',
dataIndex: 'planName', dataIndex: 'planName',
width:'15%', width:'18%',
render: (val, record) => { render: (val, record) => {
return ( return (
<div className="plan__name"> <div className="plan-name">
{val} {val}
</div> </div>
) )
...@@ -41,7 +41,7 @@ function PlanList(props) { ...@@ -41,7 +41,7 @@ function PlanList(props) {
title: '课程总数量', title: '课程总数量',
key: 'courseNum', key: 'courseNum',
dataIndex: 'courseNum', dataIndex: 'courseNum',
width: '10%', width: 110,
render: (val, record) => { render: (val, record) => {
return ( return (
<div className="course-number"> <div className="course-number">
...@@ -75,7 +75,7 @@ function PlanList(props) { ...@@ -75,7 +75,7 @@ function PlanList(props) {
}, },
{ {
title: '创建时间', title: '创建时间',
width: "10%", width: "12.5%",
key: 'created', key: 'created',
dataIndex: 'created', dataIndex: 'created',
sorter: true, sorter: true,
...@@ -95,7 +95,7 @@ function PlanList(props) { ...@@ -95,7 +95,7 @@ function PlanList(props) {
}, },
{ {
title: '参培人数', title: '参培人数',
width: "10%", width:76,
key: 'cultureCustomerNum', key: 'cultureCustomerNum',
dataIndex: 'cultureCustomerNum', dataIndex: 'cultureCustomerNum',
sorter: true, sorter: true,
...@@ -111,7 +111,8 @@ function PlanList(props) { ...@@ -111,7 +111,8 @@ function PlanList(props) {
title: '操作', title: '操作',
key: 'operate', key: 'operate',
dataIndex: 'operate', dataIndex: 'operate',
width: '25%', fixed: 'right',
width: 176,
render: (val, record) => { render: (val, record) => {
return ( return (
<div className="operate"> <div className="operate">
...@@ -145,6 +146,7 @@ function PlanList(props) { ...@@ -145,6 +146,7 @@ function PlanList(props) {
]; ];
return columns; return columns;
} }
function renderMoreOperate(item){ function renderMoreOperate(item){
return ( return (
<div className="live-course-more-menu"> <div className="live-course-more-menu">
...@@ -158,6 +160,7 @@ function PlanList(props) { ...@@ -158,6 +160,7 @@ function PlanList(props) {
</div> </div>
) )
} }
function handleChangeTable(pagination, filters, sorter){ function handleChangeTable(pagination, filters, sorter){
const { columnKey, order } = sorter; const { columnKey, order } = sorter;
const { query } = props; const { query } = props;
...@@ -224,49 +227,6 @@ function PlanList(props) { ...@@ -224,49 +227,6 @@ function PlanList(props) {
props.onChange(); props.onChange();
} }
}) })
// let _enableState = record.enableState
// if(_enableState==='NO'){
// // _enableState = "YES";
// const params={
// "planId": record.planId,
// "enableState":"YES"
// }
// PlanService.updateStateTrainingPlan(params).then((res)=>{
// if(res.success){
// // if(_enableState === "YES"){
// record.enableState = "YES";
// message.success("已启用此计划");
// // }
// }
// })
// }else{
// // _enableState = "NO";
// // item.enableState = "YES";
// return confirm({
// title: "确定要禁用培训计划吗？",
// content: "禁用后，培训计划不再支持新用户加入，已参与培训的用户可继续培训",
// icon: (
// <span className="icon iconfont default-confirm-icon">&#xe839; </span>
// ),
// okText: "确定",
// okType: "danger",
// cancelText: "取消",
// onOk: () => {
// const params={
// "planId": record.planId,
// "enableState":"NO"
// }
// PlanService.updateStateTrainingPlan(params).then((res)=>{
// if(res.success){
// // if(_enableState === "NO"){
// record.enableState = "NO";
// message.success("已禁用此计划");
// // }
// }
// })
// },
// });
// }
} }
function toEditPlanPage(item){ function toEditPlanPage(item){
...@@ -325,11 +285,15 @@ function PlanList(props) { ...@@ -325,11 +285,15 @@ function PlanList(props) {
<div className="plan-list"> <div className="plan-list">
<Table <Table
rowKey={record => record.id} rowKey={record => record.id}
showSorterTooltip={false}
dataSource={props.planListData} dataSource={props.planListData}
columns={ parseColumns() } columns={ parseColumns() }
pagination={false} pagination={false}
onChange={handleChangeTable} onChange={handleChangeTable}
bordered bordered
size="middle"
scroll={{ x: 1400}}
className="plan-list-table"
/> />
<div className="box-footer"> <div className="box-footer">
<PageControl <PageControl
......
src/modules/plan-manage/components/PlanList.less
.plan-list{ .plan-list{
margin-top:12px; margin-top:12px;
.course-number{
text-align:right;
margin-right:45px;
}
.plan-list-table{
tbody {
tr{
&:nth-child(even){
background: transparent !important;
td{
background:#FFF !important;
}
}
&:nth-child(odd){
background: #FAFAFA !important;
td{
background: #FAFAFA !important;
}
}
&:hover{
td{
background:#F3f6fa !important;
}
}
}
}
}
.plan-name{
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
}
.operate-text { .operate-text {
color: #5289FA;
cursor: pointer;
}
.operate {
display: flex;
&__item {
color: #5289FA; color: #5289FA;
cursor: pointer; cursor: pointer;
}
.operate { &.split {
display: flex; margin: 0 8px;
color: #BFBFBF;
&__item {
color: #5289FA;
cursor: pointer;
&.split {
margin: 0 8px;
color: #BFBFBF;
}
} }
} }
}
.join-number{
text-align:right;
margin-right:12px;
}
.more-operate{
line-height:20px;
}
} }
\ No newline at end of file
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-11 14:02:25 * @LastEditTime: 2021-03-16 11:36:36
* @Description: 描述一下 * @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -41,6 +41,7 @@ const courseStateShow = { ...@@ -41,6 +41,7 @@ const courseStateShow = {
title: "未成功开课", title: "未成功开课",
}, },
}; };
const DragHandle = sortableHandle(() => ( const DragHandle = sortableHandle(() => (
<span className="operate__item" > <span className="operate__item" >
<span className="icon iconfont">&#xe7cd;</span> <span className="icon iconfont">&#xe7cd;</span>
...@@ -245,6 +246,7 @@ class TrainingTask extends React.Component { ...@@ -245,6 +246,7 @@ class TrainingTask extends React.Component {
} }
return Promise.resolve() return Promise.resolve()
} }
handleValidatorCourseName = (rule,value)=>{ handleValidatorCourseName = (rule,value)=>{
let input = /^[\s]*$/; let input = /^[\s]*$/;
if (input.test(value) || !value){ if (input.test(value) || !value){
...@@ -252,8 +254,9 @@ class TrainingTask extends React.Component { ...@@ -252,8 +254,9 @@ class TrainingTask extends React.Component {
} }
return Promise.resolve() return Promise.resolve()
} }
renderTaskItem = (record,index)=>{ renderTaskItem = (record,index)=>{
return <div className="task-item"> return <div className="plan-sort-task-item">
<div className="task-con"> <div className="task-con">
<div className="task-instro"> <div className="task-instro">
<span onClick={()=>this.openOrCloseTask(index)}> <span onClick={()=>this.openOrCloseTask(index)}>
...@@ -287,9 +290,9 @@ class TrainingTask extends React.Component { ...@@ -287,9 +290,9 @@ class TrainingTask extends React.Component {
</div> </div>
<div className="operate"> <div className="operate">
<DragHandle /> <DragHandle />
<span className="operate__item"> <span className="operate__item" onClick={()=>{const { dataSource }= this.state; record.type="input";this.setState({dataSource})}}>
<span className="icon iconfont">&#xe6f5;</span> <span className="icon iconfont">&#xe6f5;</span>
<span className="text" onClick={()=>{const { dataSource }= this.state; record.type="input";this.setState({dataSource})}}>重命名</span> <span className="text">重命名</span>
</span> </span>
<span className="operate__item" onClick={()=>{this.handleDeleteTask(index)}} > <span className="operate__item" onClick={()=>{this.handleDeleteTask(index)}} >
<span className="icon iconfont">&#xe6f6;</span> <span className="icon iconfont">&#xe6f6;</span>
...@@ -323,7 +326,7 @@ class TrainingTask extends React.Component { ...@@ -323,7 +326,7 @@ class TrainingTask extends React.Component {
</div> </div>
} }
renderCourseItem = (record,index,parentIndex)=>{ renderCourseItem = (record,index,parentIndex)=>{
return <div className="course-item"> return <div className="plan-course-sort-item">
<div className="course-info"> <div className="course-info">
<span className="course-type">{CourseType[record.courseType].text}</span> <span className="course-type">{CourseType[record.courseType].text}</span>
{record.type==='input'? {record.type==='input'?
...@@ -339,7 +342,7 @@ class TrainingTask extends React.Component { ...@@ -339,7 +342,7 @@ class TrainingTask extends React.Component {
<Input className="course-name-input" defaultValue={record.courseName} style={{ width: 300 }} placeholder="请输入课程名称（40字以内）" maxLength={40} onChange={(e) => { this.handleRenameCourseName(e,record)}} onBlur={(e)=>{this.handleCourseNameBlur(e,record)}}/></Form.Item> <Input className="course-name-input" defaultValue={record.courseName} style={{ width: 300 }} placeholder="请输入课程名称（40字以内）" maxLength={40} onChange={(e) => { this.handleRenameCourseName(e,record)}} onBlur={(e)=>{this.handleCourseNameBlur(e,record)}}/></Form.Item>
</Form> </Form>
: :
<span className="course-name">{parentIndex + 1}.{index + 1}{record.courseName}</span> <span className="course-name">{parentIndex + 1}.{index + 1} {record.courseName}</span>
} }
{record.courseState === "EXPIRED" && {record.courseState === "EXPIRED" &&
<span className="icon iconfont tip">&#xe834;</span> <span className="icon iconfont tip">&#xe834;</span>
...@@ -349,12 +352,12 @@ class TrainingTask extends React.Component { ...@@ -349,12 +352,12 @@ class TrainingTask extends React.Component {
} }
</div> </div>
<div className="operate"> <div className="course-operate">
<DragHandle /> <DragHandle />
<span className="operate__item"> {/* <span className="operate__item">
<span className="icon iconfont">&#xe6f5;</span> <span className="icon iconfont">&#xe6f5;</span>
<span className="text" onClick={(e)=>{const { dataSource } = this.state; record.type="input";this.setState({dataSource})}}>重命名</span> <span className="text" onClick={(e)=>{const { dataSource } = this.state; record.type="input";this.setState({dataSource})}}>重命名</span>
</span> </span> */}
<span className="operate__item" onClick={()=>{this.handleDeleteCourse(parentIndex,index)}}> <span className="operate__item" onClick={()=>{this.handleDeleteCourse(parentIndex,index)}}>
<span className="icon iconfont">&#xe6f6;</span> <span className="icon iconfont">&#xe6f6;</span>
<span className="text">删除</span> <span className="text">删除</span>
...@@ -373,6 +376,7 @@ class TrainingTask extends React.Component { ...@@ -373,6 +376,7 @@ class TrainingTask extends React.Component {
disableAutoscroll disableAutoscroll
helperClass="row-dragging" helperClass="row-dragging"
onSortEnd={this.onTaskSortEnd} onSortEnd={this.onTaskSortEnd}
className="plan-task-sort-container"
> >
{dataSource.map((item, index) => {dataSource.map((item, index) =>
<SortableTaskItem taskItem={this.renderTaskItem(item,index)} index={index}> <SortableTaskItem taskItem={this.renderTaskItem(item,index)} index={index}>
......
src/modules/plan-manage/components/TrainingTask.less
...@@ -5,103 +5,7 @@ ...@@ -5,103 +5,7 @@
.ant-form-item{ .ant-form-item{
margin-bottom:0 !important; margin-bottom:0 !important;
} }
.task-item{
.task-con{
display:flex;
padding:16px;
background: #F7F8F9;
border-radius: 2px;
justify-content: space-between;
align-items: center;
.task-instro{
display:flex;
align-items: center;
.open-icon{
color:#999999;
font-size:10px;
}
.task-name-con{
display:flex;
align-items: center;
color:#333333;
font-size:14px;
.number{
margin-right:10px;
margin-left:10px;
}
.task-name-input{
width: 300px;
height: 32px;
background: #FFFFFF;
border-radius: 4px;
}
}
}
}
.operate{
.operate__item{
cursor:pointer;
margin-left:16px;
color:#666666;
font-size:14px;
.icon{
color:#999;
}
.text{
margin-left:8px;
}
}
}
.course-box{
.course-item{
display:flex;
padding:16px 16px 16px 51px;
justify-content: space-between;
align-items: center;
.course-info{
.ant-form{
display:inline-block;
}
.course-name-input{
margin-right:8px;
}
.course-type{
font-size:11px;
color:#666666;
padding:1px 8px;
border: 1px solid #999999;
margin-right:4px;
border-radius: 2px;
}
.course-name{
color:#666666;
font-size:14px;
margin-right:8px;
}
.tip{
font-size:14px;
color:#FF4F4F;
margin-right:2px;
}
.course-state{
color:#999;
font-size:14px;
}
}
}
.add-course-con{
padding:16px 51px;
color: #5289FA;
font-size:14px;
.add-course-btn-disabled{
font-size:14px;
color:#ccc;
}
}
}
}
.add-task-con{ .add-task-con{
height: 52px; height: 52px;
background: #F7F8F9; background: #F7F8F9;
...@@ -118,3 +22,132 @@ ...@@ -118,3 +22,132 @@
} }
} }
} }
.plan-sort-task-item{
.task-con{
display:flex;
padding:16px;
background: #F7F8F9;
border-radius: 2px;
justify-content: space-between;
align-items: center;
.task-instro{
display:flex;
align-items: center;
.open-icon{
color:#999999;
font-size:10px;
}
.task-name-con{
display:flex;
align-items: center;
color:#333333;
font-size:14px;
.number{
margin-right:10px;
margin-left:10px;
}
.task-name-input{
width: 300px;
height: 32px;
background: #FFFFFF;
border-radius: 4px;
}
}
}
.operate{
display: none;
.operate__item{
cursor:pointer;
margin-left:16px;
color:#666666;
font-size:14px;
.icon{
font-size:14px;
color:#999;
}
.text{
margin-left:8px;
}
}
}
&:hover{
.operate{
display:block;
}
}
}
.course-box{
.add-course-con{
padding:16px 51px;
color: #5289FA;
font-size:14px;
.add-course-btn-disabled{
font-size:14px;
color:#ccc;
}
}
}
}
.plan-course-sort-item{
display:flex;
padding:16px 16px 16px 0px;
margin-left:51px;
justify-content: space-between;
align-items: center;
border-bottom:1px dotted #E8E8E8;
&:hover{
.course-operate{
display:block;
}
}
.course-operate{
display: none;
.operate__item{
cursor:pointer;
margin-left:16px;
color:#666666;
font-size:14px;
.icon{
font-size:14px;
color:#999;
}
.text{
margin-left:8px;
}
}
}
.course-info{
.ant-form{
display:inline-block;
}
.course-name-input{
margin-right:8px;
}
.course-type{
font-size:11px;
color:#666666;
padding:0px 6px;
border: 1px solid #999999;
margin-right:4px;
border-radius: 2px;
line-height: 16px;
}
.course-name{
color:#666666;
font-size:14px;
margin-right:8px;
}
.tip{
font-size:14px;
color:#FF4F4F;
margin-right:2px;
}
.course-state{
color:#999;
font-size:14px;
}
}
}
src/modules/plan-manage/components/UserLearningData.jsx
...@@ -36,7 +36,7 @@ class UserLearningData extends React.Component { ...@@ -36,7 +36,7 @@ class UserLearningData extends React.Component {
}, },
totalCount:0, totalCount:0,
userLearnDetailModalSHow:false, userLearnDetailModalSHow:false,
unbundEmployeeModalVisible:false unbundEmployeeModalVisible:false,
} }
} }
componentDidMount(){ componentDidMount(){
...@@ -182,7 +182,7 @@ class UserLearningData extends React.Component { ...@@ -182,7 +182,7 @@ class UserLearningData extends React.Component {
{ {
title: <span> title: <span>
<span>负责人</span> <span>负责人</span>
<Tooltip title="用户加入学习时，培训计划的分享者"><i className="icon iconfont" style={{ marginLeft: '5px',cursor:'pointer',color:'#bfbfbf',fontSize:'14px'}}>&#xe61d;</i></Tooltip> <Tooltip title="培训计划的分享者/跟进人"><i className="icon iconfont" style={{ marginLeft: '5px',cursor:'pointer',color:'#bfbfbf',fontSize:'14px'}}>&#xe61d;</i></Tooltip>
</span>, </span>,
key: 'userNameList', key: 'userNameList',
dataIndex: 'userNameList', dataIndex: 'userNameList',
...@@ -201,11 +201,10 @@ class UserLearningData extends React.Component { ...@@ -201,11 +201,10 @@ class UserLearningData extends React.Component {
key: 'latelyLearnTime', key: 'latelyLearnTime',
dataIndex: 'latelyLearnTime', dataIndex: 'latelyLearnTime',
sorter:true, sorter:true,
width:240,
render: (val, record) => { render: (val, record) => {
return ( return (
<div> `${formatDate('YYYY-MM-DD H:i',parseInt(record.latelyLearnTime))}`
{formatDate('YYYY-MM-DD H:i', val)}
</div>
) )
} }
}, },
...@@ -213,6 +212,7 @@ class UserLearningData extends React.Component { ...@@ -213,6 +212,7 @@ class UserLearningData extends React.Component {
title: '开始学习时间', title: '开始学习时间',
key: 'startLearnTime', key: 'startLearnTime',
dataIndex: 'startLearnTime', dataIndex: 'startLearnTime',
width:240,
sorter:true, sorter:true,
render: (val, record) => { render: (val, record) => {
return ( return (
...@@ -229,10 +229,11 @@ class UserLearningData extends React.Component { ...@@ -229,10 +229,11 @@ class UserLearningData extends React.Component {
</span>, </span>,
key: 'learnNum', key: 'learnNum',
dataIndex: 'learnNum', dataIndex: 'learnNum',
width:130,
sorter:true, sorter:true,
render: (val, record) => { render: (val, record) => {
return ( return (
<div> <div className="learn-num">
<span>{record.courseFinishNum}</span> <span>{record.courseFinishNum}</span>
<span>/</span> <span>/</span>
<span>{record.courseNum}</span> <span>{record.courseNum}</span>
...@@ -354,12 +355,13 @@ class UserLearningData extends React.Component { ...@@ -354,12 +355,13 @@ class UserLearningData extends React.Component {
</div> </div>
<div> <div>
<Table <Table
rowKey={record => record.id} rowKey={record => record.storeCustomerId}
dataSource={dataSource} dataSource={dataSource}
columns={this.parselumns()} columns={this.parselumns()}
pagination={false} pagination={false}
className="user-learning-table" className="user-learning-table"
onChange={this.handleChangeTable} onChange={this.handleChangeTable}
showSorterTooltip={false}
bordered bordered
/> />
{dataSource.length >0 && {dataSource.length >0 &&
......
src/modules/plan-manage/components/UserLearningData.less
...@@ -13,4 +13,8 @@ ...@@ -13,4 +13,8 @@
color: #BFBFBF; color: #BFBFBF;
} }
} }
.learn-num{
text-align:right;
margin-right:20px;
}
} }
\ No newline at end of file
src/modules/plan-manage/components/UserLearningDataFilter.jsx
...@@ -24,7 +24,7 @@ const DEFAULT_QUERY = { ...@@ -24,7 +24,7 @@ const DEFAULT_QUERY = {
startTime: null, startTime: null,
endTime:null, endTime:null,
learnState:null, learnState:null,
operateId: null operateId: null,
} }
const defaultCreatorQuery = { const defaultCreatorQuery = {
size: 10, size: 10,
...@@ -35,30 +35,35 @@ function UserLearningDataFilter(props) { ...@@ -35,30 +35,35 @@ function UserLearningDataFilter(props) {
const [expandFilter, setExpandFilter] = useState(false); const [expandFilter, setExpandFilter] = useState(false);
const [query,setQuery] = useState(DEFAULT_QUERY); const [query,setQuery] = useState(DEFAULT_QUERY);
const [operateName,setOperateName] = useState(null)
const [hasNext,setHasNext] = useState(false); const [hasNext,setHasNext] = useState(false);
const [creatorQuery,setCreatorQuery] = useState(defaultCreatorQuery); const [creatorQuery,setCreatorQuery] = useState(defaultCreatorQuery);
const [creatorList,setCreatorList] = useState([]); const [creatorList,setCreatorList] = useState([]);
useEffect(() => { useEffect(() => {
Bus.bind('watchDataView',(value) => handleChangeCreatorQuery(value)) Bus.bind('watchDataView',(record) => handleChangeCreatorQuery(record))
}, []); });
useEffect(() => { useEffect(() => {
getCreatorList(); getCreatorList();
}, [creatorQuery]); }, []);
function handleChangeCreatorQuery (value){ function handleChangeCreatorQuery (record){
const _creatorQuery = {...creatorQuery}; const _creatorQuery = {...creatorQuery};
_creatorQuery.operateId = value; _creatorQuery.operateId = record.storeUserId;
setCreatorQuery(_creatorQuery); setCreatorQuery(_creatorQuery);
handleChangeQuery('operateId', record.storeUserId,record.storeUserName)
} }
// 改变搜索条件 // 改变搜索条件
function handleChangeQuery(field, value){ function handleChangeQuery(field,value,optionValue){
const _query ={ const _query ={
...query, ...query,
[field]: value, [field]: value,
current: 1, current: 1,
} }
setQuery(_query); setQuery(_query);
if(field === 'operateId'){
setOperateName(optionValue)
}
if (field === 'customerName') return; if (field === 'customerName') return;
props.onChange( _query); props.onChange( _query);
} }
...@@ -108,6 +113,9 @@ function UserLearningDataFilter(props) { ...@@ -108,6 +113,9 @@ function UserLearningDataFilter(props) {
const container = e.target; const container = e.target;
const scrollToBottom = container && container.scrollHeight <= container.clientHeight + container.scrollTop; const scrollToBottom = container && container.scrollHeight <= container.clientHeight + container.scrollTop;
if (scrollToBottom && hasNext) { if (scrollToBottom && hasNext) {
const _creatorQuery = {...creatorQuery};
_creatorQuery.current = creatorQuery.current + 1;
setCreatorQuery(_creatorQuery);
getCreatorList(creatorQuery.current + 1); getCreatorList(creatorQuery.current + 1);
} }
} }
...@@ -133,16 +141,21 @@ function UserLearningDataFilter(props) { ...@@ -133,16 +141,21 @@ function UserLearningDataFilter(props) {
<span className="label lead-label">负责人：</span> <span className="label lead-label">负责人：</span>
<Select <Select
id="leadSelect" id="leadSelect"
placeholder="请选择创建人" placeholder="请选择员工"
style={{width:"calc(100% - 70px)"}} style={{width:"calc(100% - 70px)"}}
showSearch showSearch
allowClear allowClear
filterOption={(input, option) => option} filterOption={(input, option) => option}
suffixIcon={<span className="icon iconfont" style={{fontSize:'12px',color:'#BFBFBF'}}>&#xe835;</span>} suffixIcon={<span className="icon iconfont" style={{fontSize:'12px',color:'#BFBFBF'}}>&#xe835;</span>}
onPopupScroll={handleScrollCreatorList} onPopupScroll={handleScrollCreatorList}
value={query.operateId} value={operateName}
onChange={(value) => { onChange={(value,option) => {
handleChangeQuery('operateId', value) if(option){
handleChangeQuery('operateId',value,option.children)
}else{
handleChangeQuery('operateId',value,"")
}
}} }}
onSearch={(value) => { onSearch={(value) => {
creatorQuery.nickName = value creatorQuery.nickName = value
......
src/modules/plan-manage/modal/SelectOperatorModal.jsx
...@@ -107,7 +107,12 @@ class SelectOperatorModal extends React.Component { ...@@ -107,7 +107,12 @@ class SelectOperatorModal extends React.Component {
closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>} closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
> >
<div className="search-container"> <div className="search-container">
<Search placeholder="搜索运营师/手机号" style={{ width: 200 }} onChange={(e) => { this.handleChangNickname(e.target.value)}} onSearch={ () => { this.handleFetchDataList()}} /> <Search placeholder="搜索运营师/手机号"
enterButton={<span className="icon iconfont">&#xe832;</span>}
style={{ width: 200 }}
onChange={(e) => { this.handleChangNickname(e.target.value)}}
onSearch={ () => { this.handleFetchDataList()}}
/>
</div> </div>
<div> <div>
<Table <Table
...@@ -115,6 +120,7 @@ class SelectOperatorModal extends React.Component { ...@@ -115,6 +120,7 @@ class SelectOperatorModal extends React.Component {
dataSource={dataSource} dataSource={dataSource}
columns={this.parseColumns()} columns={this.parseColumns()}
pagination={false} pagination={false}
bordered
rowSelection={{ rowSelection={{
type: 'checkbox', type: 'checkbox',
selectedRowKeys: _.pluck(selectOperatorList, 'id'), selectedRowKeys: _.pluck(selectOperatorList, 'id'),
...@@ -135,6 +141,7 @@ class SelectOperatorModal extends React.Component { ...@@ -135,6 +141,7 @@ class SelectOperatorModal extends React.Component {
{dataSource.length >0 && {dataSource.length >0 &&
<div className="box-footer"> <div className="box-footer">
<PageControl <PageControl
size="small"
current={query.current - 1} current={query.current - 1}
pageSize={size} pageSize={size}
total={totalCount} total={totalCount}
......
src/modules/plan-manage/modal/SharePlanModal.jsx
...@@ -142,8 +142,7 @@ class ShareLiveModal extends React.Component { ...@@ -142,8 +142,7 @@ class ShareLiveModal extends React.Component {
<div className="share-url right__item"> <div className="share-url right__item">
<div className="title">② 链接分享</div> <div className="title">② 链接分享</div>
<div className="sub-title">用户可通过微信或浏览器打开以下链接，查看培训计划</div>
<div className="sub-title">用户可通过微信打开以下链接，查看培训计划</div>
<div className="content url-content"> <div className="content url-content">
<div className="share-url" id="shareUrl">{shareUrl}</div> <div className="share-url" id="shareUrl">{shareUrl}</div>
<Button type="primary" onClick={this.handleCopy}>复制</Button> <Button type="primary" onClick={this.handleCopy}>复制</Button>
......
src/modules/plan-manage/modal/UnbundEmployeeModal.jsx
...@@ -84,6 +84,10 @@ class UnbundEmployeeModal extends React.Component { ...@@ -84,6 +84,10 @@ class UnbundEmployeeModal extends React.Component {
} }
confirmUnbund = ()=>{ confirmUnbund = ()=>{
const { selectOperatorList } = this.state; const { selectOperatorList } = this.state;
if(selectOperatorList.length ===0){
message.warning('请选择需要解绑的员工');
return false;
}
const params = { const params = {
planId:getParameterByName("id"), planId:getParameterByName("id"),
removeUserIds:_.pluck(selectOperatorList, 'storeUserId'), removeUserIds:_.pluck(selectOperatorList, 'storeUserId'),
...@@ -129,7 +133,7 @@ class UnbundEmployeeModal extends React.Component { ...@@ -129,7 +133,7 @@ class UnbundEmployeeModal extends React.Component {
if (selected) { if (selected) {
_list = _.uniq(selectOperatorList.concat(changeRows), false, (item) => item.storeUserId); _list = _.uniq(selectOperatorList.concat(changeRows), false, (item) => item.storeUserId);
} else { } else {
_list = _.reject(selectOperatorList, (item) => _.find(changeRows, (data) => data.id === item.storeUserId)); _list = _.reject(selectOperatorList, (item) => _.find(changeRows, (data) => data.storeUserId === item.storeUserId));
} }
this.setState({selectOperatorList:_list}); this.setState({selectOperatorList:_list});
} }
......
src/modules/plan-manage/modal/UserLearnDetailModal.jsx
...@@ -36,7 +36,7 @@ class UserLearnDetailModal extends React.Component { ...@@ -36,7 +36,7 @@ class UserLearnDetailModal extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
planDataSource:[], planDataSource:{},
taskDataSource:[], taskDataSource:[],
taskSize:10, taskSize:10,
taskQuery: { taskQuery: {
...@@ -72,52 +72,19 @@ class UserLearnDetailModal extends React.Component { ...@@ -72,52 +72,19 @@ class UserLearnDetailModal extends React.Component {
} }
return item; return item;
}) })
const planDataSource = [{ const planDataSource = {
planName, planName,
learnFinishPercentage, learnFinishPercentage,
coverUrl:coverUrl || defaultCover coverUrl:coverUrl || defaultCover
}] }
this.setState({ this.setState({
storeCustomerName, storeCustomerName,
storeCustomerPhone, storeCustomerPhone,
planDataSource, planDataSource,
taskDataSource:taskCustomerVOList taskDataSource:taskCustomerVOList
}) })
}) })
} }
parsePlanColumns = () => {
const columns = [
{
title: '培训计划名称',
key: 'planInfo',
dataIndex: 'planInfo',
render: (val, record) => {
return (
<div className="plan-instro">
<div className="img-con">
<img src={record.coverUrl}/>
</div>
<div className="plan-name">{record.planName}</div>
</div>
)
}
},
{
title: '学习进度',
key: 'learnFinishPercentage',
dataIndex: 'learnFinishPercentage',
width:167,
render: (val, record) => {
return (
<div className="plan-learn-percentage">
{val}%
</div>
)
}
}
];
return columns;
}
parseTaskColumns = () => { parseTaskColumns = () => {
const columns = [ const columns = [
...@@ -158,14 +125,16 @@ class UserLearnDetailModal extends React.Component { ...@@ -158,14 +125,16 @@ class UserLearnDetailModal extends React.Component {
render: (val, record,index) => { render: (val, record,index) => {
return ( return (
<div className="course-info"> <div className="course-info">
<span className="course-type">{CourseType[record.courseType].text}</span> <div>
<span className="course-name">{parentIndex + 1}.{index + 1}{record.courseName}</span> <span className="course-type">{CourseType[record.courseType].text}</span>
{record.courseState === "EXPIRED" && <span>{parentIndex + 1}.{index + 1}&nbsp;</span>
<span className="icon iconfont tip">&#xe834;</span> </div>
} <div className="name-and-state">
{ record.courseType==="LIVE" && <span className="course-name">{record.courseName}</span>
<span className="course-state">{courseStateShow[record.courseState].title}</span> { record.courseType==="LIVE" &&
} <span className="course-state">{courseStateShow[record.courseState].title}</span>
}
</div>
</div> </div>
) )
} }
...@@ -193,6 +162,7 @@ class UserLearnDetailModal extends React.Component { ...@@ -193,6 +162,7 @@ class UserLearnDetailModal extends React.Component {
<Modal <Modal
title="用户学习详情" title="用户学习详情"
onCancel={this.props.onClose} onCancel={this.props.onClose}
onOk={this.props.onClose}
maskClosable={false} maskClosable={false}
visible={visible} visible={visible}
className="user-Learn-modal" className="user-Learn-modal"
...@@ -210,15 +180,18 @@ class UserLearnDetailModal extends React.Component { ...@@ -210,15 +180,18 @@ class UserLearnDetailModal extends React.Component {
<span>{storeCustomerPhone}</span> <span>{storeCustomerPhone}</span>
</span> </span>
</div> </div>
<div> <div className="plan-instro">
<Table <div className="img-con">
dataSource={planDataSource} <img src={planDataSource.coverUrl}/>
columns={this.parsePlanColumns()} </div>
pagination={false} <div>
bordered <div className="plan-name">{planDataSource.planName}</div>
className="plan-table" <div className="task-learn-percentage">
/> <span>学习进度: {planDataSource.learnFinishPercentage}%</span>
</div>
</div>
</div> </div>
<div> <div>
<Table <Table
rowKey={(record) => record.taskId} rowKey={(record) => record.taskId}
......
src/modules/plan-manage/modal/UserLearnDetailModal.less
.user-Learn-modal{ .user-Learn-modal{
.customer-info{ .customer-info{
margin-bottom:16px; margin-bottom:16px;
.customer-name{ .customer-name{
...@@ -11,62 +12,84 @@ ...@@ -11,62 +12,84 @@
color:#333; color:#333;
} }
} }
.plan-table{ .plan-instro{
margin-bottom:8px; display: flex;
.plan-instro{ align-items: center;
display: flex; margin-bottom:16px;
align-items: center; .img-con{
.img-con{ margin-right:8px;
margin-right:8px; img{
img{ width: 97px;
width: 97px; height: 54px;
height: 55px; display: inline-block;
display: inline-block; border-radius:4px;
border-radius:4px;
}
}
.plan-name{
color:#666666;
font-size:14px;
}
.plan-learn-percentage{
color:#666666;
font-size:14px;
} }
} }
.plan-name{
color:#333;
font-size:16px;
}
.plan-learn-percentage{
color:#333;
font-size:14px;
}
} }
.task-table{ .task-table{
.ant-table-thead{
tr {
th{
padding:9px 16px;
}
}
}
tr{
td{
padding:14px 16px;
}
}
.taskName{ .taskName{
color:#666666; color:#333;
font-size:14px; font-size:14px;
} }
.task-learn-percentage{ .task-learn-percentage{
color:#666666; color:#333;
font-size:14px; font-size:14px;
} }
.course-info{ .course-info{
display:flex;
margin-left:57px; margin-left:57px;
align-items: center;
.course-type{ .course-type{
font-size:11px; font-size:11px;
color:#666666; color:#666666;
padding:1px 8px; padding:0px 6px;
border: 1px solid #999999; border: 1px solid #999999;
margin-right:4px; margin-right:4px;
border-radius: 2px; border-radius: 2px;
line-height: 16px;
} }
.course-name{ .name-and-state{
color:#666666; flex:1;
font-size:14px; .course-name{
margin-right:8px; color:#666666;
} font-size:14px;
.tip{ margin-right:8px;
font-size:14px; }
color:#FF4F4F; .tip{
margin-right:2px; font-size:14px;
color:#FF4F4F;
margin-right:2px;
}
.course-state{
color:#999;
font-size:14px;
}
} }
.course-state{
color:#999; }
font-size:14px; .ant-table-expanded-row{
td{
padding:0 16px;
} }
} }
.ant-table-content{ .ant-table-content{
...@@ -76,13 +99,18 @@ ...@@ -76,13 +99,18 @@
border:none; border:none;
} }
.child-table{ .child-table{
.ant-table-content{ .ant-table-content{
border:none; border:none;
thead{ thead{
display:none; display:none;
} }
tbody tr td{ tbody tr {
border-bottom:none; td{
border-bottom:none;
padding:14px 16px;
}
} }
} }
......
src/modules/plan-manage/modal/relatedCourseModal.jsx
...@@ -161,14 +161,15 @@ class SelectOperatorModal extends React.Component { ...@@ -161,14 +161,15 @@ class SelectOperatorModal extends React.Component {
videoSize:size videoSize:size
},()=>{this.handleFetchLiveDataList()}) },()=>{this.handleFetchLiveDataList()})
} }
// 请求表头 // 请求表头
parseLiveColumns = () => { parseLiveColumns = () => {
const columns = [ 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>, 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', key: 'course',
dataIndex: 'course', dataIndex: 'course',
width:'45%', width:'40%',
render: (val, record) => { render: (val, record) => {
let hasCover = false; let hasCover = false;
return ( return (
...@@ -199,7 +200,10 @@ class SelectOperatorModal extends React.Component { ...@@ -199,7 +200,10 @@ class SelectOperatorModal extends React.Component {
width:'40%', width:'40%',
render: (val, record) => { render: (val, record) => {
return ( return (
<span>{formatDate('YYYY-MM-DD H:i', record.startTime)}</span> <div>
<div>{formatDate('YYYY-MM-DD', record.startTime)}</div>
<div>{formatDate('H:i', record.startTime)}~{formatDate('H:i', record.endTime)}</div>
</div>
) )
} }
}, },
...@@ -207,7 +211,7 @@ class SelectOperatorModal extends React.Component { ...@@ -207,7 +211,7 @@ class SelectOperatorModal extends React.Component {
title: '店铺展示', title: '店铺展示',
key: 'shelfState', key: 'shelfState',
dataIndex: 'shelfState', dataIndex: 'shelfState',
width:'15%', width:'20%',
render: (val, record) => { render: (val, record) => {
return ( return (
<span> <span>
...@@ -229,7 +233,7 @@ class SelectOperatorModal extends React.Component { ...@@ -229,7 +233,7 @@ class SelectOperatorModal extends React.Component {
parseVideoColumns = () => { parseVideoColumns = () => {
const columns = [ 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>, 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', key: 'course',
dataIndex: 'course', dataIndex: 'course',
width:'60%', width:'60%',
...@@ -348,9 +352,9 @@ class SelectOperatorModal extends React.Component { ...@@ -348,9 +352,9 @@ class SelectOperatorModal extends React.Component {
closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>} closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
footer={[ footer={[
activeKey ==='live'? activeKey ==='live'?
<a target='_blank' className="link-create-course" href="https://dev.xiaomai5.com/xiaomai-cloud-class-web/index.html#/create-live-course?type=add">没有找到需要的直播课？<span>去创建</span></a> <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="https://dev.xiaomai5.com/xiaomai-cloud-class-web/index.html#/create-video-course?type=add">没有找到需要的视频课？<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={() => {
......
src/modules/plan-manage/modal/relatedCourseModal.less
...@@ -5,6 +5,9 @@ ...@@ -5,6 +5,9 @@
.ant-tabs-nav-list{ .ant-tabs-nav-list{
margin:0 auto; margin:0 auto;
} }
.ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn{
font-weight:normal;
}
.ant-tabs-nav .ant-tabs-tab{ .ant-tabs-nav .ant-tabs-tab{
padding:6px 12px !important; padding:6px 12px !important;
margin:0; margin:0;
...@@ -19,9 +22,10 @@ ...@@ -19,9 +22,10 @@
border-radius: 0px 4px 4px 0px; border-radius: 0px 4px 4px 0px;
} }
} }
.ant-tabs-nav .ant-tabs-tab-active{ .ant-tabs-nav .ant-tabs-tab-active{
border: 1px solid #FFB714; border: 1px solid #FFB714;
color:#FFB714; color:#FFB714;
} }
.ant-tabs-top .ant-tabs-ink-bar-animated:after{ .ant-tabs-top .ant-tabs-ink-bar-animated:after{
......
src/modules/root/App.tsx
/* /*
* @Author: 吴文洁 * @Author: 吴文洁
* @Date: 2019-07-10 10:30:49 * @Date: 2019-07-10 10:30:49
* @LastEditors: zhangleyuan * @LastEditors: wufan
* @LastEditTime: 2021-03-09 18:23:29 * @LastEditTime: 2021-03-11 17:22:01
* @Description: * @Description:
*/ */
import React, { useContext, useEffect, useState } from 'react'; import React, { useContext, useEffect, useState } from 'react';
...@@ -29,9 +29,9 @@ const App: React.FC = (props: any) => { ...@@ -29,9 +29,9 @@ const App: React.FC = (props: any) => {
useEffect(() => { useEffect(() => {
getStoreAndUserInfo(); getStoreAndUserInfo();
window.RCHistory.push({ // window.RCHistory.push({
pathname: `/switch-route`, // pathname: `/switch-route`,
}) // })
}, []) }, [])
async function getStoreAndUserInfo() { async function getStoreAndUserInfo() {
......
src/modules/root/Header.less
...@@ -182,6 +182,7 @@ ...@@ -182,6 +182,7 @@
height: 49px; height: 49px;
display: flex; display: flex;
position: relative; position: relative;
align-items: center;
.store-name { .store-name {
font-size: 14px; font-size: 14px;
color: #666; color: #666;
...@@ -191,16 +192,13 @@ ...@@ -191,16 +192,13 @@
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
max-width: 230px; max-width: 230px;
margin-right: 32px; margin-right: 16px;
} }
.line { .line {
width: 1px; width: 1px;
height: 16px; height: 16px;
background-color: #f4f4f4; background-color: #f4f4f4;
position: absolute; margin-right:16px;
left: 122px;
top: 50%;
transform: translateY(-50%);
} }
.link-to-store { .link-to-store {
display: flex; display: flex;
......
src/modules/store-manage/EmployeeAddOrEditModal.less
.employee-add-modal { .employee-add-modal {
.ant-modal-body {
height: 247px;
}
.mt-4 { .mt-4 {
margin-bottom:-6px !important margin-bottom:-6px !important
} }
......
src/modules/store-manage/StoreH5DecorationTab.jsx
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
import React from "react"; import React from "react";
import { withRouter } from "react-router-dom"; import { withRouter } from "react-router-dom";
import _ from "underscore"; import _ from "underscore";
import PhotoClip from 'photoclip' // import PhotoClip from 'photoclip'
import { Table, Modal, message, Button } from "antd"; import { Table, Modal, message, Button } from "antd";
import StoreService from "@/domains/store-domain/storeService"; import StoreService from "@/domains/store-domain/storeService";
import { import {
......
src/modules/store-manage/StoreInfo.jsx
...@@ -4,7 +4,7 @@ import { Form, Input, Button, Checkbox ,Select,Modal,message} from 'antd'; ...@@ -4,7 +4,7 @@ import { Form, Input, Button, Checkbox ,Select,Modal,message} from 'antd';
import {industryList,childIndustryList} from '@/domains/store-domain/constants' import {industryList,childIndustryList} from '@/domains/store-domain/constants'
import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepareFileModal'; import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepareFileModal';
import Upload from '@/core/upload'; import Upload from '@/core/upload';
import PhotoClip from 'photoclip'; // import PhotoClip from 'photoclip';
import StoreService from "@/domains/store-domain/storeService"; import StoreService from "@/domains/store-domain/storeService";
import User from "@/common/js/user"; import User from "@/common/js/user";
import Bus from '@/core/tbus'; import Bus from '@/core/tbus';
...@@ -15,11 +15,11 @@ class StoreInfo extends React.Component { ...@@ -15,11 +15,11 @@ class StoreInfo extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
storeName:'', storeName:null,
storeFullName:'', storeFullName:null,
subjectType:'', subjectType:null,
corpIndustry:'', corpIndustry:null,
corpSubIndustry:'', corpSubIndustry:null,
logo:'', logo:'',
showSelectFileModal:false, showSelectFileModal:false,
cutImageBlob: null, cutImageBlob: null,
...@@ -196,8 +196,8 @@ class StoreInfo extends React.Component { ...@@ -196,8 +196,8 @@ class StoreInfo extends React.Component {
message.warning('请选择店铺类型'); message.warning('请选择店铺类型');
return; return;
} }
if(!subjectType){ if(!corpIndustry){
message.warning('店铺所属行业'); message.warning('请选择店铺所属行业');
return; return;
} }
const params= { const params= {
...@@ -248,9 +248,11 @@ class StoreInfo extends React.Component { ...@@ -248,9 +248,11 @@ class StoreInfo extends React.Component {
{ logo ? <img src={logo} className="logo-img"/> : <div className="logo-box"><span className="text">Logo</span></div>} { logo ? <img src={logo} className="logo-img"/> : <div className="logo-box"><span className="text">Logo</span></div>}
</div> </div>
<div className="operate-con"> <div className="operate-con">
<div><span onClick={() => {this.setState({ showSelectFileModal:true })}} className="upload-btn">上传</span></div> <div><span onClick={() => {this.setState({ showSelectFileModal:true })}} className="upload-btn">
{logo ? <span>重新上传</span> : <span>上传</span> }
</span></div>
<div className="tip">建议尺寸702*180px。最大2M，支持jpg、jpeg和png。</div> <div className="tip">建议尺寸702*180px。最大2M，支持jpg、jpeg和png。</div>
</div> </div>
</div> </div>
</Form.Item> </Form.Item>
<Form.Item <Form.Item
......
src/modules/store-manage/StoreWebDecorationTab.jsx
/* /*
* @Author: wufan * @Author: wufan
* @Date: 2020-11-30 10:47:38 * @Date: 2020-11-30 10:47:38
* @LastEditors: wufan * @LastEditors: zhangleyuan
* @LastEditTime: 2021-01-18 14:59:57 * @LastEditTime: 2021-03-11 15:30:00
* @Description: web店铺banner页面 * @Description: web店铺banner页面
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
import React from "react"; import React from "react";
import { withRouter } from "react-router-dom"; import { withRouter } from "react-router-dom";
import _ from "underscore"; import _ from "underscore";
import PhotoClip from 'photoclip' // import PhotoClip from 'photoclip'
import { Table, Modal, message, Button } from "antd"; import { Table, Modal, message, Button } from "antd";
import StoreService from "@/domains/store-domain/storeService"; import StoreService from "@/domains/store-domain/storeService";
import { import {
......
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