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 @@
* @Author: zhangleyuan
* @Date: 2021-02-21 16:08:38
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-04 19:42:21
* @LastEditTime: 2021-03-05 14:04:52
* @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......@@ -41,3 +41,6 @@ export function getPlanCustomerAboutUser(params: object) {
export function removePlanCustomer(params: object) {
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 @@
* @Author: zhangleyuan
* @Date: 2021-02-21 16:15:38
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-04 19:42:52
* @LastEditTime: 2021-03-05 14:04:25
* @Description: 描述一下
* @@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 {
// 获取员工列表
static getTrainingPlanPage(params: any) {
......@@ -42,4 +42,7 @@ export default class PlanService {
static removePlanCustomer(params: any) {
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 {
},
},
{
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: "操作",
width: "15%",
key: "operate",
......@@ -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 {
renderMoreOperate = (item) => {
return (
<div className="live-course-more-menu">
<div
className="operate__item"
>关联培训计划</div>
<div
className="operate__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";
import EmployeeShareData from './components/EmployeeShareData';
import UserLearningData from './components/UserLearningData';
import PlanService from '@/domains/plan-domain/planService';
import User from '@/common/js/user'
import Bus from '@/core/bus';
import './LearningData.less';
const userRole = User.getUserRole();
const defaultCover = 'https://image.xiaomaiketang.com/xm/YNfi45JwFA.png';
class LearningData extends React.Component {
constructor(props) {
super(props);
......@@ -89,14 +92,18 @@ class LearningData extends React.Component {
</div>
</div>
<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">
<EmployeeShareData/>
</Tabs.TabPane>
<Tabs.TabPane tab="用户学习数据" key="userLearningData">
<UserLearningData/>
</Tabs.TabPane>
</Tabs>
</Tabs>)
:
(<UserLearningData/>)
}
</div>
</div>
......
src/modules/plan-manage/components/PlanList.jsx
......@@ -2,7 +2,7 @@
* @Author: zhangleyuan
* @Date: 2021-02-20 16:46:46
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-03-04 15:37:31
* @LastEditTime: 2021-03-05 10:31:11
* @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......@@ -118,8 +118,10 @@ function PlanList(props) {
<div className="operate__item" onClick={()=>toLearningDataPage(record)}>学习数据</div>
<span className="operate__item split"> | </span>
<div className="operate__item" onClick={() => {handleShowShareModal(record); }}>分享</div>
<span className="operate__item split"> | </span>
{(userRole === "CloudManager" || userRole === "StoreManager") &&
<>
<span className="operate__item split"> | </span>
<Dropdown overlay={renderMoreOperate(record)}>
<span className="more-operate">
<span className="operate-text">更多</span>
......@@ -131,6 +133,7 @@ function PlanList(props) {
</span>
</span>
</Dropdown>
</>
}
</div>
)
......
src/modules/plan-manage/components/UserLearningDataFilter.jsx
......@@ -12,11 +12,13 @@ import { Row, Input, Select ,Tooltip} from 'antd';
import RangePicker from "@/modules/common/DateRangePicker";
import moment from 'moment';
import StoreService from "@/domains/store-domain/storeService";
import User from '@/common/js/user'
import Bus from '@/core/bus';
import './UserLearningDataFilter.less';
const { Search } = Input;
const { Option } = Select;
const userRole = User.getUserRole();
const DEFAULT_QUERY = {
customerName: null,
startTime: null,
......@@ -126,45 +128,46 @@ function UserLearningDataFilter(props) {
enterButton={<span className="icon iconfont">&#xe832;</span>}
/>
</div>
<div className="search-condition__item">
<span className="label lead-label">负责人：</span>
<Select
id="leadSelect"
placeholder="请选择创建人"
style={{width:"calc(100% - 70px)"}}
showSearch
allowClear
filterOption={(input, option) => option}
suffixIcon={<span className="icon iconfont" style={{fontSize:'12px',color:'#BFBFBF'}}>&#xe835;</span>}
onPopupScroll={handleScrollCreatorList}
value={query.operateId}
onChange={(value) => {
handleChangeQuery('operateId', value)
}}
onSearch={(value) => {
creatorQuery.nickName = value
setCreatorQuery(creatorQuery)
getCreatorList();
{(userRole === "CloudManager" || userRole === "StoreManager")&&
<div className="search-condition__item">
<span className="label lead-label">负责人：</span>
<Select
id="leadSelect"
placeholder="请选择创建人"
style={{width:"calc(100% - 70px)"}}
showSearch
allowClear
filterOption={(input, option) => option}
suffixIcon={<span className="icon iconfont" style={{fontSize:'12px',color:'#BFBFBF'}}>&#xe835;</span>}
onPopupScroll={handleScrollCreatorList}
value={query.operateId}
onChange={(value) => {
handleChangeQuery('operateId', value)
}}
onSearch={(value) => {
creatorQuery.nickName = value
setCreatorQuery(creatorQuery)
getCreatorList();
}
}
onClear ={(value)=>{
setCreatorQuery({
size: 10,
current: 1,
nickName:null
})
getCreatorList()
}
}
onClear ={(value)=>{
setCreatorQuery({
size: 10,
current: 1,
nickName:null
})
getCreatorList()
}
}
>
{_.map(creatorList, (item, index) => {
return (
<Select.Option value={item.id} key={item.id}>{item.nickName}</Select.Option>
);
})}
</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">
<span className="label learn-date-label">最近学习日期：</span>
<RangePicker
......@@ -176,7 +179,7 @@ function UserLearningDataFilter(props) {
style={{ width: "calc(100% - 98px)" }}
/>
</div>
{ expandFilter &&
{ ((expandFilter && (userRole === "CloudManager" || userRole === "StoreManager")) || userRole === "CloudOperator")&&
<div className="search-condition__item">
<span className="label learn-status-label">学习状态：</span>
<Select
......@@ -192,13 +195,14 @@ function UserLearningDataFilter(props) {
</div>
}
</div>
<div className="reset-fold-area">
<Tooltip title="清空筛选"><span className="resetBtn iconfont icon" onClick={handleReset}>&#xe61b; </span></Tooltip>
<span style={{ cursor: 'pointer' }} className="fold-btn" onClick={() => {
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>
</div>
{(userRole === "CloudManager" || userRole === "StoreManager")&&
<div className="reset-fold-area">
<Tooltip title="清空筛选"><span className="resetBtn iconfont icon" onClick={handleReset}>&#xe61b; </span></Tooltip>
<span style={{ cursor: 'pointer' }} className="fold-btn" onClick={() => {
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>
</div>
}
</Row>
</div>
)
......
src/modules/plan-manage/modal/UnbundEmployeeModal.jsx
import React from 'react';
import {Table, Modal,Input} from 'antd';
import {Table, Modal,Input,message} from 'antd';
import { PageControl } from "@/components";
import PlanService from '@/domains/plan-domain/planService'
import User from '@/common/js/user'
import './UnbundEmployeeModal.less';
import _ from "underscore";
const { Search } = Input;
const UserRole = {
StoreManager: {
text: "店铺管理员"
},
CloudManager: {
text:"管理员"
},
CloudOperator: {
text:'运营师'
},
Cloud_Lecture: {
text:"讲师"
},
};
class UnbundEmployeeModal extends React.Component {
constructor(props) {
super(props);
......@@ -39,12 +53,16 @@ class UnbundEmployeeModal extends React.Component {
{
title: '员工',
key: 'storeUserName',
dataIndex: 'storeUserName'
dataIndex: 'storeUserName',
},
{
title: '角色',
key: '',
dataIndex: ''
key: 'role',
dataIndex: 'role',
render:(val,record)=>{
return <span>{UserRole[val].text}</span>
}
},
{
title: '手机号',
......@@ -55,18 +73,20 @@ class UnbundEmployeeModal extends React.Component {
return columns;
}
selectOperator = (record,selected) =>{
// console.log('selected',selected);
this.setState({selectOperatorList:record});
const {selectOperatorList} = this.state;
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 = ()=>{
const { selectOperatorList } = this.state;
console.log('selectOperatorList',selectOperatorList);
const params = {
planId:getParameterByName("id"),
removeUserId:_.pluck(selectOperatorList, 'storeUserId'),
removeUserIds:_.pluck(selectOperatorList, 'storeUserId'),
storeCustomerId:this.props.storeCustomerId,
storeId:User.getStoreId(),
storeUserId:User.getStoreUserId()
......@@ -100,11 +120,18 @@ class UnbundEmployeeModal extends React.Component {
bordered
rowSelection={{
type: 'checkbox',
selectedRowKeys: _.pluck(selectOperatorList, 'storeUserId'),
onSelect: (record, selected) => {
this.selectOperator(record, selected)
},
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 {
render: (val, record) => {
return (
<div className="task-learn-percentage">
{val}%
{ val === 100 ?<span>已完成</span>:<span>{val}%</span>}
</div>
)
}
......@@ -159,7 +159,7 @@ class UserLearnDetailModal extends React.Component {
return (
<div className="course-info">
<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" &&
<span className="icon iconfont tip">&#xe834;</span>
}
......@@ -176,7 +176,7 @@ class UserLearnDetailModal extends React.Component {
render: (val, record) => {
return (
<div className="course-learn-percentage">
{val}%
{ record.learnState === "FINISH" ?<span>已完成</span>:<span>{val}%</span>}
</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