Skip to content

X
xiaomai-cloud-class-web
Commit 39d9230d by zhangleyuan
Options

feat:处理课程列表关联计划

parent f00935b4
Showing with 540 additions and 169 deletions
src/data-source/plan/request-apis.ts
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
* @Author: zhangleyuan * @Author: zhangleyuan
* @Date: 2021-02-21 16:08:38 * @Date: 2021-02-21 16:08:38
* @LastEditors: zhangleyuan * @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-04 19:42:21 * @LastEditTime: 2021-03-05 14:04:52
* @Description: 描述一下 * @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -41,3 +41,6 @@ export function getPlanCustomerAboutUser(params: object) { ...@@ -41,3 +41,6 @@ export function getPlanCustomerAboutUser(params: object) {
export function removePlanCustomer(params: object) { export function removePlanCustomer(params: object) {
return Service.Hades("public/hades/removePlanCustomer", params); return Service.Hades("public/hades/removePlanCustomer", params);
} }
export function getStorePlanAll(params: object) {
return Service.Hades("public/hades/getStorePlanAll", params);
}
\ No newline at end of file
src/domains/plan-domain/planService.ts
...@@ -2,11 +2,11 @@ ...@@ -2,11 +2,11 @@
* @Author: zhangleyuan * @Author: zhangleyuan
* @Date: 2021-02-21 16:15:38 * @Date: 2021-02-21 16:15:38
* @LastEditors: zhangleyuan * @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-04 19:42:52 * @LastEditTime: 2021-03-05 14:04:25
* @Description: 描述一下 * @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
import {getTrainingPlanPage,createTrainingPlan,updateStateTrainingPlan,getTrainingPlanDetail,updateTrainingPlan,deleteTrainingPlan,getPlanUserRecordPage,getPlanCustomerRecordPage,getPlanCustomerDetail,getPlanCustomerAboutUser,removePlanCustomer} from '@/data-source/plan/request-apis'; import {getTrainingPlanPage,createTrainingPlan,updateStateTrainingPlan,getTrainingPlanDetail,updateTrainingPlan,deleteTrainingPlan,getPlanUserRecordPage,getPlanCustomerRecordPage,getPlanCustomerDetail,getPlanCustomerAboutUser,removePlanCustomer,getStorePlanAll} from '@/data-source/plan/request-apis';
export default class PlanService { export default class PlanService {
// 获取员工列表 // 获取员工列表
static getTrainingPlanPage(params: any) { static getTrainingPlanPage(params: any) {
...@@ -42,4 +42,7 @@ export default class PlanService { ...@@ -42,4 +42,7 @@ export default class PlanService {
static removePlanCustomer(params: any) { static removePlanCustomer(params: any) {
return removePlanCustomer(params); return removePlanCustomer(params);
} }
static getStorePlanAll(params: any) {
return getStorePlanAll(params);
}
} }
\ No newline at end of file
src/modules/course-manage/components/LiveCourseList.jsx
...@@ -271,6 +271,37 @@ class LiveCourseList extends React.Component { ...@@ -271,6 +271,37 @@ class LiveCourseList extends React.Component {
}, },
}, },
{ {
title: '创建时间',
width: "9%",
key: "created",
dataIndex: "created",
sorted:true,
render: (val, item) => {
return (
<span>{formatDate('YYYY-MM-DD H:i', val)}</span>
);
},
},
{
title: '关联项',
width: "15%",
key: "planList",
dataIndex: "planList",
render: (val, record) => {
return (
<span>
{ record.relatedPlanList ?
record.relatedPlanList.map((item,index)=>{
return <span>{item.planName} { (index < record.relatedPlanList.length-1)&&(<span> 、</span>)} </span>
})
:
<span></span>
}
</span>
)
},
},
{
title: "操作", title: "操作",
width: "15%", width: "15%",
key: "operate", key: "operate",
...@@ -456,6 +487,37 @@ class LiveCourseList extends React.Component { ...@@ -456,6 +487,37 @@ class LiveCourseList extends React.Component {
); );
}, },
}, },
{
title: '创建时间',
width: "9%",
key: "created",
dataIndex: "created",
sorted:true,
render: (val, item) => {
return (
<span>{formatDate('YYYY-MM-DD H:i', val)}</span>
);
},
},
{
title: '关联项',
width: "15%",
key: "planList",
dataIndex: "planList",
render: (val, record) => {
return (
<span>
{ record.relatedPlanList ?
record.relatedPlanList.map((item,index)=>{
return <span>{item.planName} { (index < record.relatedPlanList.length-1)&&(<span> 、</span>)} </span>
})
:
<span></span>
}
</span>
)
},
},
]; ];
} }
...@@ -477,6 +539,10 @@ class LiveCourseList extends React.Component { ...@@ -477,6 +539,10 @@ class LiveCourseList extends React.Component {
renderMoreOperate = (item) => { renderMoreOperate = (item) => {
return ( return (
<div className="live-course-more-menu"> <div className="live-course-more-menu">
<div
className="operate__item"
>关联培训计划</div>
<div <div
className="operate__item" className="operate__item"
onClick={()=>this.toEditCoursePage(item)} onClick={()=>this.toEditCoursePage(item)}
......
src/modules/course-manage/modal/RelatedPlanModal.jsx 0 → 100644
import React from 'react';
import {Table, Modal,Input} from 'antd';
import { PageControl } from "@/components";
import PlanService from '@/domains/plan-domain/planService'
import User from '@/common/js/user'
import './SelectOperatorModal.less';
import _ from "underscore";
const { Search } = Input;
class RelatedPlanModal extends React.Component {
constructor(props) {
super(props);
this.state = {
dataSource:[],
size:10,
query: {
current: 1,
},
totalCount:0,
};
}
componentDidMount() {
this.handleFetchDataList();
}
// 获取运营师列表
handleFetchDataList = () => {
const {query,size,totalCount} = this.state
const params ={
...query,
size,
roleCodes:['CloudOperator']
}
PlanService.getStorePlanAll(params).then((res) => {
const { result = {} } = res ;
const { records = [], total = 0 } = result;
this.setState({
dataSource: records,
totalCount: Number(total)
});
});
}
handleChangePlanName = (value)=>{
const isPhone = (value || '').match(/^\d+$/);
const { query } = this.state;
if(isPhone){
query.phone = value;
query.nickName = null;
}else{
query.nickName = value;
query.phone = null;
}
query.current = 1;
this.setState({
query
})
}
onShowSizeChange = (current, size) => {
if (current == size) {
return
}
this.setState({
size
},()=>{this.handleFetchDataList()})
}
// 请求表头
parseColumns = () => {
const columns = [
{
title: '姓名',
key: 'nickName',
dataIndex: 'nickName'
},
{
title: '手机号',
key: 'phone',
dataIndex: 'phone'
}
];
return columns;
}
render() {
const { size,dataSource,totalCount,query,selectOperatorList} = this.state;
const { visible } = this.props;
return (
<Modal
title="关联培训计划"
onCancel={this.props.onClose}
maskClosable={false}
visible={visible}
className="related-plan-modal"
closable={true}
width={800}
onOk={() => this.props.onSelect(selectOperatorList) }
closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
>
<div className="search-container">
<Search placeholder="搜索培训计划名称" style={{ width: 200 }} onChange={(e) => { this.handleChangePlanName(e.target.value)}} onSearch={ () => { this.handleFetchDataList()}} />
</div>
<div>
<Table
rowKey={record => record.id}
dataSource={dataSource}
columns={this.parseColumns()}
pagination={false}
/>
{dataSource.length >0 &&
<div className="box-footer">
<PageControl
current={query.current - 1}
pageSize={size}
total={totalCount}
toPage={(page) => {
const _query = {...query, current: page + 1};
this.setState({
query:_query
},()=>{ this.handleFetchDataList()})
}}
onShowSizeChange={this.onShowSizeChange}
/>
</div>
}
</div>
</Modal>
)
}
}
export default SelectOperatorModal;
\ No newline at end of file
src/modules/plan-manage/LearningData.jsx
...@@ -5,10 +5,13 @@ import Breadcrumbs from "@/components/Breadcrumbs"; ...@@ -5,10 +5,13 @@ import Breadcrumbs from "@/components/Breadcrumbs";
import EmployeeShareData from './components/EmployeeShareData'; import EmployeeShareData from './components/EmployeeShareData';
import UserLearningData from './components/UserLearningData'; import UserLearningData from './components/UserLearningData';
import PlanService from '@/domains/plan-domain/planService'; import PlanService from '@/domains/plan-domain/planService';
import User from '@/common/js/user'
import Bus from '@/core/bus'; import Bus from '@/core/bus';
import './LearningData.less'; import './LearningData.less';
const userRole = User.getUserRole();
const defaultCover = 'https://image.xiaomaiketang.com/xm/YNfi45JwFA.png'; const defaultCover = 'https://image.xiaomaiketang.com/xm/YNfi45JwFA.png';
class LearningData extends React.Component { class LearningData extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
...@@ -89,14 +92,18 @@ class LearningData extends React.Component { ...@@ -89,14 +92,18 @@ class LearningData extends React.Component {
</div> </div>
</div> </div>
<div className="box"> <div className="box">
<Tabs activeKey={activeKey} onChange={(activeKey)=>{this.setState({activeKey})}}> { (userRole === "CloudManager" || userRole === "StoreManager")?
(<Tabs activeKey={activeKey} onChange={(activeKey)=>{this.setState({activeKey})}}>
<Tabs.TabPane tab="员工分享数据" key="employeeShareData"> <Tabs.TabPane tab="员工分享数据" key="employeeShareData">
<EmployeeShareData/> <EmployeeShareData/>
</Tabs.TabPane> </Tabs.TabPane>
<Tabs.TabPane tab="用户学习数据" key="userLearningData"> <Tabs.TabPane tab="用户学习数据" key="userLearningData">
<UserLearningData/> <UserLearningData/>
</Tabs.TabPane> </Tabs.TabPane>
</Tabs> </Tabs>)
:
(<UserLearningData/>)
}
</div> </div>
</div> </div>
......
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-04 15:37:31 * @LastEditTime: 2021-03-05 10:31:11
* @Description: 描述一下 * @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/ */
...@@ -118,8 +118,10 @@ function PlanList(props) { ...@@ -118,8 +118,10 @@ function PlanList(props) {
<div className="operate__item" onClick={()=>toLearningDataPage(record)}>学习数据</div> <div className="operate__item" onClick={()=>toLearningDataPage(record)}>学习数据</div>
<span className="operate__item split"> | </span> <span className="operate__item split"> | </span>
<div className="operate__item" onClick={() => {handleShowShareModal(record); }}>分享</div> <div className="operate__item" onClick={() => {handleShowShareModal(record); }}>分享</div>
<span className="operate__item split"> | </span>
{(userRole === "CloudManager" || userRole === "StoreManager") && {(userRole === "CloudManager" || userRole === "StoreManager") &&
<>
<span className="operate__item split"> | </span>
<Dropdown overlay={renderMoreOperate(record)}> <Dropdown overlay={renderMoreOperate(record)}>
<span className="more-operate"> <span className="more-operate">
<span className="operate-text">更多</span> <span className="operate-text">更多</span>
...@@ -131,6 +133,7 @@ function PlanList(props) { ...@@ -131,6 +133,7 @@ function PlanList(props) {
</span> </span>
</span> </span>
</Dropdown> </Dropdown>
</>
} }
</div> </div>
) )
......
src/modules/plan-manage/components/UserLearningDataFilter.jsx
...@@ -12,11 +12,13 @@ import { Row, Input, Select ,Tooltip} from 'antd'; ...@@ -12,11 +12,13 @@ import { Row, Input, Select ,Tooltip} from 'antd';
import RangePicker from "@/modules/common/DateRangePicker"; import RangePicker from "@/modules/common/DateRangePicker";
import moment from 'moment'; import moment from 'moment';
import StoreService from "@/domains/store-domain/storeService"; import StoreService from "@/domains/store-domain/storeService";
import User from '@/common/js/user'
import Bus from '@/core/bus'; import Bus from '@/core/bus';
import './UserLearningDataFilter.less'; import './UserLearningDataFilter.less';
const { Search } = Input; const { Search } = Input;
const { Option } = Select; const { Option } = Select;
const userRole = User.getUserRole();
const DEFAULT_QUERY = { const DEFAULT_QUERY = {
customerName: null, customerName: null,
startTime: null, startTime: null,
...@@ -126,45 +128,46 @@ function UserLearningDataFilter(props) { ...@@ -126,45 +128,46 @@ function UserLearningDataFilter(props) {
enterButton={<span className="icon iconfont">&#xe832;</span>} enterButton={<span className="icon iconfont">&#xe832;</span>}
/> />
</div> </div>
{(userRole === "CloudManager" || userRole === "StoreManager")&&
<div className="search-condition__item"> <div className="search-condition__item">
<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={query.operateId}
onChange={(value) => { onChange={(value) => {
handleChangeQuery('operateId', value) handleChangeQuery('operateId', value)
}} }}
onSearch={(value) => { onSearch={(value) => {
creatorQuery.nickName = value creatorQuery.nickName = value
setCreatorQuery(creatorQuery) setCreatorQuery(creatorQuery)
getCreatorList(); getCreatorList();
}
}
onClear ={(value)=>{
setCreatorQuery({
size: 10,
current: 1,
nickName:null
})
getCreatorList()
} }
} }
onClear ={(value)=>{ >
setCreatorQuery({ {_.map(creatorList, (item, index) => {
size: 10, return (
current: 1, <Select.Option value={item.id} key={item.id}>{item.nickName}</Select.Option>
nickName:null );
}) })}
getCreatorList() </Select>
} </div>
} }
>
{_.map(creatorList, (item, index) => {
return (
<Select.Option value={item.id} key={item.id}>{item.nickName}</Select.Option>
);
})}
</Select>
</div>
<div className="search-condition__item"> <div className="search-condition__item">
<span className="label learn-date-label">最近学习日期：</span> <span className="label learn-date-label">最近学习日期：</span>
<RangePicker <RangePicker
...@@ -176,7 +179,7 @@ function UserLearningDataFilter(props) { ...@@ -176,7 +179,7 @@ function UserLearningDataFilter(props) {
style={{ width: "calc(100% - 98px)" }} style={{ width: "calc(100% - 98px)" }}
/> />
</div> </div>
{ expandFilter && { ((expandFilter && (userRole === "CloudManager" || userRole === "StoreManager")) || userRole === "CloudOperator")&&
<div className="search-condition__item"> <div className="search-condition__item">
<span className="label learn-status-label">学习状态：</span> <span className="label learn-status-label">学习状态：</span>
<Select <Select
...@@ -192,13 +195,14 @@ function UserLearningDataFilter(props) { ...@@ -192,13 +195,14 @@ function UserLearningDataFilter(props) {
</div> </div>
} }
</div> </div>
{(userRole === "CloudManager" || userRole === "StoreManager")&&
<div className="reset-fold-area"> <div className="reset-fold-area">
<Tooltip title="清空筛选"><span className="resetBtn iconfont icon" onClick={handleReset}>&#xe61b; </span></Tooltip> <Tooltip title="清空筛选"><span className="resetBtn iconfont icon" onClick={handleReset}>&#xe61b; </span></Tooltip>
<span style={{ cursor: 'pointer' }} className="fold-btn" onClick={() => { <span style={{ cursor: 'pointer' }} className="fold-btn" onClick={() => {
setExpandFilter(!expandFilter) setExpandFilter(!expandFilter)
}}>{expandFilter ? <span><span>收起</span><span className="iconfont icon fold-icon" >&#xe82d; </span> </span> : <span>展开<span className="iconfont icon fold-icon" >&#xe835; </span></span>}</span> }}>{expandFilter ? <span><span>收起</span><span className="iconfont icon fold-icon" >&#xe82d; </span> </span> : <span>展开<span className="iconfont icon fold-icon" >&#xe835; </span></span>}</span>
</div> </div>
}
</Row> </Row>
</div> </div>
) )
......
src/modules/plan-manage/modal/UnbundEmployeeModal.jsx
import React from 'react'; import React from 'react';
import {Table, Modal,Input} from 'antd'; import {Table, Modal,Input,message} from 'antd';
import { PageControl } from "@/components"; import { PageControl } from "@/components";
import PlanService from '@/domains/plan-domain/planService' import PlanService from '@/domains/plan-domain/planService'
import User from '@/common/js/user' import User from '@/common/js/user'
import './UnbundEmployeeModal.less'; import './UnbundEmployeeModal.less';
import _ from "underscore"; import _ from "underscore";
const { Search } = Input; const { Search } = Input;
const UserRole = {
StoreManager: {
text: "店铺管理员"
},
CloudManager: {
text:"管理员"
},
CloudOperator: {
text:'运营师'
},
Cloud_Lecture: {
text:"讲师"
},
};
class UnbundEmployeeModal extends React.Component { class UnbundEmployeeModal extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
...@@ -39,12 +53,16 @@ class UnbundEmployeeModal extends React.Component { ...@@ -39,12 +53,16 @@ class UnbundEmployeeModal extends React.Component {
{ {
title: '员工', title: '员工',
key: 'storeUserName', key: 'storeUserName',
dataIndex: 'storeUserName' dataIndex: 'storeUserName',
}, },
{ {
title: '角色', title: '角色',
key: '', key: 'role',
dataIndex: '' dataIndex: 'role',
render:(val,record)=>{
return <span>{UserRole[val].text}</span>
}
}, },
{ {
title: '手机号', title: '手机号',
...@@ -55,18 +73,20 @@ class UnbundEmployeeModal extends React.Component { ...@@ -55,18 +73,20 @@ class UnbundEmployeeModal extends React.Component {
return columns; return columns;
} }
selectOperator = (record,selected) =>{ selectOperator = (record,selected) =>{
// console.log('selected',selected); const {selectOperatorList} = this.state;
this.setState({selectOperatorList:record}); let _list = [];
if (selected || !_.find(selectOperatorList, (item) => item.storeUserId == record.storeUserId)) {
_list = _.uniq(selectOperatorList.concat([record]), false, (item) => item.storeUserId);
} else {
_list = _.reject(selectOperatorList, (item) => item.storeUserId === record.storeUserId);
}
this.setState({selectOperatorList:_list});
} }
confirmUnbund = ()=>{ confirmUnbund = ()=>{
const { selectOperatorList } = this.state; const { selectOperatorList } = this.state;
console.log('selectOperatorList',selectOperatorList);
const params = { const params = {
planId:getParameterByName("id"), planId:getParameterByName("id"),
removeUserId:_.pluck(selectOperatorList, 'storeUserId'), removeUserIds:_.pluck(selectOperatorList, 'storeUserId'),
storeCustomerId:this.props.storeCustomerId, storeCustomerId:this.props.storeCustomerId,
storeId:User.getStoreId(), storeId:User.getStoreId(),
storeUserId:User.getStoreUserId() storeUserId:User.getStoreUserId()
...@@ -100,11 +120,18 @@ class UnbundEmployeeModal extends React.Component { ...@@ -100,11 +120,18 @@ class UnbundEmployeeModal extends React.Component {
bordered bordered
rowSelection={{ rowSelection={{
type: 'checkbox', type: 'checkbox',
selectedRowKeys: _.pluck(selectOperatorList, 'storeUserId'),
onSelect: (record, selected) => { onSelect: (record, selected) => {
this.selectOperator(record, selected) this.selectOperator(record, selected)
}, },
onSelectAll: (selected, _selectedRows, changeRows) => { onSelectAll: (selected, _selectedRows, changeRows) => {
this.setState({selectOperatorList:selected}); let _list = [];
if (selected) {
_list = _.uniq(selectOperatorList.concat(changeRows), false, (item) => item.storeUserId);
} else {
_list = _.reject(selectOperatorList, (item) => _.find(changeRows, (data) => data.id === item.storeUserId));
}
this.setState({selectOperatorList:_list});
} }
}} }}
/> />
......
src/modules/plan-manage/modal/UserLearnDetailModal.jsx
...@@ -141,7 +141,7 @@ class UserLearnDetailModal extends React.Component { ...@@ -141,7 +141,7 @@ class UserLearnDetailModal extends React.Component {
render: (val, record) => { render: (val, record) => {
return ( return (
<div className="task-learn-percentage"> <div className="task-learn-percentage">
{val}% { val === 100 ?<span>已完成</span>:<span>{val}%</span>}
</div> </div>
) )
} }
...@@ -159,7 +159,7 @@ class UserLearnDetailModal extends React.Component { ...@@ -159,7 +159,7 @@ class UserLearnDetailModal extends React.Component {
return ( return (
<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>
<span className="course-name">{parentIndex + 1}.{index + 1}从入门到精通</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>
} }
...@@ -176,7 +176,7 @@ class UserLearnDetailModal extends React.Component { ...@@ -176,7 +176,7 @@ class UserLearnDetailModal extends React.Component {
render: (val, record) => { render: (val, record) => {
return ( return (
<div className="course-learn-percentage"> <div className="course-learn-percentage">
{val}% { record.learnState === "FINISH" ?<span>已完成</span>:<span>{val}%</span>}
</div> </div>
) )
} }
......
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