Commit 99ed4231 by zhangleyuan

Merge branch 'feature/zhangleyuan/20200220/training-program' into dev

parents 39b0451b 1a754a5a
......@@ -616,7 +616,9 @@ mr0 {
.ant-table-thead > tr > th{
font-weight:normal !important;
}
td.ant-table-column-sort{
background: none;
}
......
......@@ -293,9 +293,12 @@ class LiveCourseList extends React.Component {
return (
<div className="related-task">
{ record.relatedPlanList ?
record.relatedPlanList.map((item,index)=>{
<Tooltip title={this.handlePlanName(record.relatedPlanList)} >
{ record.relatedPlanList.map((item,index)=>{
return <span>{item.planName} { (index < record.relatedPlanList.length-1)&&(<span></span>)} </span>
})
}
</Tooltip>
:
<span></span>
}
......@@ -510,9 +513,12 @@ class LiveCourseList extends React.Component {
return (
<div className="related-task">
{ record.relatedPlanList ?
record.relatedPlanList.map((item,index)=>{
<Tooltip title={this.handlePlanName(record.relatedPlanList)} >
{ record.relatedPlanList.map((item,index)=>{
return <span>{item.planName} { (index < record.relatedPlanList.length-1)&&(<span></span>)} </span>
})
}
</Tooltip>
:
<span></span>
}
......@@ -535,6 +541,19 @@ class LiveCourseList extends React.Component {
})
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) => {
return (
<div className="live-course-more-menu">
......
......@@ -220,13 +220,6 @@ class RelatedPlanModal extends React.Component {
this.selectPlanList(record,selected,_record.planId);
},
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});
},
}}
/>
......@@ -241,6 +234,7 @@ class RelatedPlanModal extends React.Component {
current={query.current - 1}
pageSize={size}
total={totalCount}
size="small"
toPage={(page) => {
const _query = {...query, current: page + 1};
this.setState({
......
......@@ -43,7 +43,8 @@
.course-type{
font-size:11px;
color:#666666;
padding:1px 8px;
padding:0px 6px;
line-height: 16px;
border: 1px solid #999999;
margin-right:4px;
border-radius: 2px;
......
......@@ -2,7 +2,7 @@
* @Author: 吴文洁
* @Date: 2020-08-05 10:12:45
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-11 17:16:20
* @LastEditTime: 2021-03-15 17:05:01
* @Description: 视频课-列表模块
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
......@@ -176,9 +176,12 @@ class VideoCourseList extends React.Component {
return (
<div className="related-task">
{ record.relatedPlanList ?
record.relatedPlanList.map((item,index)=>{
<Tooltip title={this.handlePlanName(record.relatedPlanList)} >
{ record.relatedPlanList.map((item,index)=>{
return <span>{item.planName} { (index < record.relatedPlanList.length-1)&&(<span></span>)} </span>
})
}
</Tooltip>
:
<span></span>
}
......@@ -240,6 +243,18 @@ class VideoCourseList extends React.Component {
</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) =>{
let _shelfState = item.shelfState
......
......@@ -2,7 +2,7 @@
* @Author: zhangleyuan
* @Date: 2021-02-20 16:13:39
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-15 14:19:22
* @LastEditTime: 2021-03-16 11:27:06
* @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......@@ -120,7 +120,8 @@ function AddPlan() {
function submitInfo(){
const {planName,enableState,selectOperatorList,instro,operateType,percentCompleteLive,percentCompleteVideo,coverId,coverUrl} = basicData;
if(!planName){
let input = /^[\s]*$/;
if(!planName || input.test(planName)){
message.warning('请输入的培训计划名称');
return;
}
......@@ -140,7 +141,6 @@ function AddPlan() {
message.warning('请输入培训计划内容');
return;
}
let input = /^[\s]*$/;
for(let i=0;i<taskList.length;i++){
if(input.test(taskList[i].taskName)){
message.warning('培训任务名称不能为空');
......
.plan-learn-data-list{
.ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {
.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{
......
......@@ -2,7 +2,7 @@
* @Author: zhangleyuan
* @Date: 2021-02-20 16:45:51
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-15 14:47:39
* @LastEditTime: 2021-03-15 17:01:47
* @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......@@ -219,7 +219,7 @@ class BasicInfo extends React.Component{
<span className="label"><span className="require">*</span>培训计划名称:</span>
<Input
value={planName}
placeholder="请输入培训计划名称,最多20字"
placeholder="请输入培训计划名称(20字以内)"
maxLength={20}
style={{ width: 240 }}
onChange={(e)=>this.props.onChange('planName', e.target.value)}
......@@ -253,7 +253,7 @@ class BasicInfo extends React.Component{
<TextArea
placeholder="请输入培训计划简介"
maxLength={200}
style={{ width: '552px',height:'90px'}}
style={{ width: '552px',height:'110px'}}
className="instro-textarea"
value={instro}
onChange={(e)=>this.props.onChange('instro', e.target.value)}
......
......@@ -80,6 +80,9 @@
.view-range{
display:flex;
margin-top:16px;
.label{
margin-top:2px;
}
.instro-text{
color:#999;
margin-left:12px;
......
......@@ -162,41 +162,44 @@ class EmployeeShareData extends React.Component {
title: '学习人数',
key: 'learnNum',
dataIndex: 'learnNum',
width:110,
sorter:true,
render: (val, record) => {
return (
<div>
{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>
<div className="learn-num">
{val}
</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: '操作',
key: 'operate',
......
......@@ -7,4 +7,16 @@
color:#5289FA;
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
.expired-course-list{
margin:18px 10px 16px;
margin:8px 10px 16px;
.course-item{
display:flex;
padding:16px 0;
border-bottom:1px solid #E8E8E8;
border-bottom:1px dotted #E8E8E8;
justify-content: space-between;
&:last-child{
border-bottom:none;
}
.course-left{
display:flex;
......@@ -19,11 +21,12 @@
.course-type{
margin-right:16px;
span{
padding:2px 8px;
padding:0px 6px;
color:#666666;
font-size:11px;
border-radius: 2px;
border: 1px solid #999999;
line-height: 16px;
}
}
.course-instro{
......
......@@ -2,7 +2,7 @@
* @Author: zhangleyuan
* @Date: 2021-02-20 16:46:46
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-13 18:00:15
* @LastEditTime: 2021-03-15 16:19:53
* @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......@@ -85,7 +85,7 @@ function PlanList(props) {
},
{
title: '更新时间',
width: "12.5%",
width: "10%",
key: 'updated',
dataIndex: 'updated',
sorter: true,
......@@ -95,7 +95,7 @@ function PlanList(props) {
},
{
title: '参培人数',
width: "10%",
width:76,
key: 'cultureCustomerNum',
dataIndex: 'cultureCustomerNum',
sorter: true,
......@@ -227,49 +227,6 @@ function PlanList(props) {
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){
......@@ -336,6 +293,7 @@ function PlanList(props) {
bordered
size="middle"
scroll={{ x: 1400}}
className="plan-list-table"
/>
<div className="box-footer">
<PageControl
......
.plan-list{
margin-top:12px;
.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;
......@@ -26,6 +49,10 @@
}
}
}
.join-number{
text-align:right;
margin-right:12px;
}
.more-operate{
line-height:20px;
}
......
......@@ -2,7 +2,7 @@
* @Author: zhangleyuan
* @Date: 2021-02-20 16:45:51
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-12 16:49:01
* @LastEditTime: 2021-03-16 11:36:36
* @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......@@ -41,6 +41,7 @@ const courseStateShow = {
title: "未成功开课",
},
};
const DragHandle = sortableHandle(() => (
<span className="operate__item" >
<span className="icon iconfont">&#xe7cd;</span>
......@@ -341,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>
</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" &&
<span className="icon iconfont tip">&#xe834;</span>
......@@ -351,7 +352,7 @@ class TrainingTask extends React.Component {
}
</div>
<div className="operate">
<div className="course-operate">
<DragHandle />
{/* <span className="operate__item">
<span className="icon iconfont">&#xe6f5;</span>
......
......@@ -55,8 +55,8 @@
}
}
}
}
.operate{
display: none;
.operate__item{
cursor:pointer;
margin-left:16px;
......@@ -71,6 +71,13 @@
}
}
}
&:hover{
.operate{
display:block;
}
}
}
.course-box{
.add-course-con{
padding:16px 51px;
......@@ -85,10 +92,18 @@
}
.plan-course-sort-item{
display:flex;
padding:16px 16px 16px 51px;
padding:16px 16px 16px 0px;
margin-left:51px;
justify-content: space-between;
align-items: center;
.operate{
border-bottom:1px dotted #E8E8E8;
&:hover{
.course-operate{
display:block;
}
}
.course-operate{
display: none;
.operate__item{
cursor:pointer;
margin-left:16px;
......@@ -103,6 +118,7 @@
}
}
}
.course-info{
.ant-form{
display:inline-block;
......@@ -113,10 +129,11 @@
.course-type{
font-size:11px;
color:#666666;
padding:1px 8px;
padding:0px 6px;
border: 1px solid #999999;
margin-right:4px;
border-radius: 2px;
line-height: 16px;
}
.course-name{
color:#666666;
......
......@@ -229,10 +229,11 @@ class UserLearningData extends React.Component {
</span>,
key: 'learnNum',
dataIndex: 'learnNum',
width:130,
sorter:true,
render: (val, record) => {
return (
<div>
<div className="learn-num">
<span>{record.courseFinishNum}</span>
<span>/</span>
<span>{record.courseNum}</span>
......
......@@ -13,4 +13,8 @@
color: #BFBFBF;
}
}
.learn-num{
text-align:right;
margin-right:20px;
}
}
\ No newline at end of file
......@@ -42,12 +42,15 @@ function UserLearningDataFilter(props) {
useEffect(() => {
Bus.bind('watchDataView',(record) => handleChangeCreatorQuery(record))
}, []);
});
useEffect(() => {
getCreatorList();
}, []);
function handleChangeCreatorQuery (record){
console.log('11');
const _creatorQuery = {...creatorQuery};
_creatorQuery.operateId = record.storeUserId;
setCreatorQuery(_creatorQuery);
......
......@@ -142,8 +142,7 @@ class ShareLiveModal extends React.Component {
<div className="share-url right__item">
<div className="title">② 链接分享</div>
<div className="sub-title">用户可通过微信打开以下链接,查看培训计划</div>
<div className="sub-title">用户可通过微信或浏览器打开以下链接,查看培训计划</div>
<div className="content url-content">
<div className="share-url" id="shareUrl">{shareUrl}</div>
<Button type="primary" onClick={this.handleCopy}>复制</Button>
......
......@@ -36,7 +36,7 @@ class UserLearnDetailModal extends React.Component {
constructor(props) {
super(props);
this.state = {
planDataSource:[],
planDataSource:{},
taskDataSource:[],
taskSize:10,
taskQuery: {
......@@ -72,11 +72,11 @@ class UserLearnDetailModal extends React.Component {
}
return item;
})
const planDataSource = [{
const planDataSource = {
planName,
learnFinishPercentage,
coverUrl:coverUrl || defaultCover
}]
}
this.setState({
storeCustomerName,
storeCustomerPhone,
......@@ -85,39 +85,6 @@ class UserLearnDetailModal extends React.Component {
})
})
}
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 = () => {
const columns = [
......@@ -158,9 +125,12 @@ class UserLearnDetailModal extends React.Component {
render: (val, record,index) => {
return (
<div className="course-info">
<div className="course-type">{CourseType[record.courseType].text}</div>
<div>
<span className="course-type">{CourseType[record.courseType].text}</span>
<span>{parentIndex + 1}.{index + 1}&nbsp;</span>
</div>
<div className="name-and-state">
<span className="course-name">{parentIndex + 1}.{index + 1}{record.courseName}</span>
<span className="course-name">{record.courseName}</span>
{ record.courseType==="LIVE" &&
<span className="course-state">{courseStateShow[record.courseState].title}</span>
}
......@@ -210,15 +180,18 @@ class UserLearnDetailModal extends React.Component {
<span>{storeCustomerPhone}</span>
</span>
</div>
<div className="plan-instro">
<div className="img-con">
<img src={planDataSource.coverUrl}/>
</div>
<div>
<Table
dataSource={planDataSource}
columns={this.parsePlanColumns()}
pagination={false}
bordered
className="plan-table"
/>
<div className="plan-name">{planDataSource.planName}</div>
<div className="task-learn-percentage">
<span>学习进度: {planDataSource.learnFinishPercentage}%</span>
</div>
</div>
</div>
<div>
<Table
rowKey={(record) => record.taskId}
......
......@@ -12,23 +12,10 @@
color:#333;
}
}
.plan-table{
margin-bottom:8px;
.ant-table-thead{
tr {
th{
padding:9px 24px;
}
}
}
tr{
td{
padding:8px 24px;
}
}
.plan-instro{
display: flex;
align-items: center;
margin-bottom:16px;
.img-con{
margin-right:8px;
img{
......@@ -39,15 +26,14 @@
}
}
.plan-name{
color:#666666;
font-size:14px;
color:#333;
font-size:16px;
}
.plan-learn-percentage{
color:#666666;
color:#333;
font-size:14px;
}
}
}
.task-table{
.ant-table-thead{
tr {
......@@ -62,11 +48,11 @@
}
}
.taskName{
color:#666666;
color:#333;
font-size:14px;
}
.task-learn-percentage{
color:#666666;
color:#333;
font-size:14px;
}
.course-info{
......@@ -74,14 +60,13 @@
margin-left:57px;
align-items: center;
.course-type{
width:54px;
height: 22px;
font-size:11px;
color:#666666;
padding:1px 8px;
padding:0px 6px;
border: 1px solid #999999;
margin-right:4px;
border-radius: 2px;
line-height: 16px;
}
.name-and-state{
flex:1;
......
......@@ -352,9 +352,9 @@ class SelectOperatorModal extends React.Component {
closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
footer={[
activeKey ==='live'?
<a target='_blank' className="link-create-course" href={window.location.origin + window.location.pathname + '#/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={window.location.origin + window.location.pathname + '#/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
onClick={() => {
......
......@@ -5,6 +5,9 @@
.ant-tabs-nav-list{
margin:0 auto;
}
.ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn{
font-weight:normal;
}
.ant-tabs-nav .ant-tabs-tab{
padding:6px 12px !important;
margin:0;
......@@ -19,6 +22,7 @@
border-radius: 0px 4px 4px 0px;
}
}
.ant-tabs-nav .ant-tabs-tab-active{
border: 1px solid #FFB714;
color:#FFB714;
......
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