Skip to content

X
xiaomai-cloud-class-web
Commit 2880c6ac by chenshu
Options

fix:merge

parents 3a8933e8 7d2d9fcd
Showing with 901 additions and 526 deletions
CHANGE_LOG.md
......@@ -2,7 +2,7 @@
* @Author: zhangleyuan
* @Date: 2020-12-15 19:58:31
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-01-04 20:10:06
* @LastEditTime: 2021-01-27 19:54:58
* @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
-->
......@@ -18,4 +18,8 @@
`2020-01-04`
+ 播种计划一期第二阶段初上线
`2021-01-27`
+ 播种计划一期第二阶段初上线
\ No newline at end of file
config/webpack.config.js
......@@ -20,6 +20,7 @@ const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin');
const getCSSModuleLocalIdent = require('react-dev-utils/getCSSModuleLocalIdent');
const paths = require('./paths');
const modules = require('./modules');
const vConsolePlugin = require('vconsole-webpack-plugin');
const getClientEnvironment = require('./env');
const ModuleNotFoundPlugin = require('react-dev-utils/ModuleNotFoundPlugin');
const ForkTsCheckerWebpackPlugin = require('react-dev-utils/ForkTsCheckerWebpackPlugin');
......@@ -610,6 +611,7 @@ module.exports = function (webpackEnv) {
}),
// Moment.js is an extremely popular library that bundles large locale files
// by default due to how webpack interprets its code. This is a practical
// solution that requires the user to opt into importing specific locales.
......@@ -661,6 +663,9 @@ module.exports = function (webpackEnv) {
// The formatter is invoked directly in WebpackDevServerUtils during development
formatter: isEnvProduction ? typescriptFormatter : undefined,
}),
new vConsolePlugin({
enable: (process.env.DEPLOY_ENV === 'prod' || process.env.DEPLOY_ENV === 'beta') ? false : true
})
].filter(Boolean),
// Some libraries import Node modules but don't use them in the browser.
// Tell webpack to provide empty mocks for them so importing them works.
......
package.json
......@@ -4,6 +4,8 @@
"private": true,
"homepage": "./",
"dependencies": {
"@antv/data-set": "^0.11.8",
"@antv/g2": "^3.5.13",
"@babel/core": "7.9.0",
"@babel/plugin-transform-typescript": "^7.11.0",
"@babel/preset-typescript": "^7.10.4",
......@@ -29,6 +31,7 @@
"babel-plugin-jsx-control-statements": "^4.1.0",
"babel-plugin-named-asset-import": "^0.3.6",
"babel-preset-react-app": "^9.1.2",
"bizcharts": "^4.1.7",
"camelcase": "^5.3.1",
"case-sensitive-paths-webpack-plugin": "2.3.0",
"classnames": "^2.2.6",
......@@ -60,9 +63,10 @@
"jquery": "^3.4.1",
"less": "^3.12.2",
"less-loader": "^6.2.0",
"lottie-web": "^5.7.6",
"microevent": "^1.0.0",
"mini-css-extract-plugin": "0.9.0",
"moment": "^2.20.1",
"moment": "^2.27.0",
"optimize-css-assets-webpack-plugin": "5.0.3",
"photoclip": "^3.4.8",
"pnp-webpack-plugin": "1.6.4",
......@@ -79,6 +83,7 @@
"react-dev-utils": "^10.2.1",
"react-dom": "^16.13.1",
"react-infinite-scroller": "^1.2.4",
"react-lottie": "^1.2.3",
"react-router-dom": "^5.2.0",
"react-sortable-hoc": "^1.11.0",
"resolve": "1.15.0",
......@@ -133,6 +138,7 @@
"@types/ali-oss": "^6.0.5",
"@types/jquery": "^3.5.4",
"ali-oss": "^6.12.0",
"react-sortable-hoc": "^1.11.0"
"react-sortable-hoc": "^1.11.0",
"vconsole-webpack-plugin": "^1.5.2"
}
}
public/h5.html
......@@ -28,7 +28,7 @@
display: flex;
align-items: center;
justify-content: center;
background:rgba(244, 246, 250, 1) ;
background: rgba(244, 246, 250, 1);
}
......@@ -78,7 +78,15 @@
dev1: 'https://dev1-heimdall.xiaomai5.com/',
rc: 'https://rc-heimdall.xiaomai5.com/',
gray: 'https://gray-heimdall.xiaomai5.com/',
prod: 'https://gateway-heimdall.xiaomai5.com/'
prod: 'https://gateway.xiaomai5.com/'
};
var APPID_MAP = {
dev: 'ww80fd6928a46cf33a',
dev1: 'ww80fd6928a46cf33a',
rc: 'ww2009937c82bc57bd',
gray: 'ww2009937c82bc57bd',
prod: 'ww2009937c82bc57bd'
};
......@@ -96,26 +104,22 @@
const appTermEnum = getParameterByName('appTermEnum');
const code = getParameterByName('code');
const ticket = getParameterByName('ticket');
console.log(appTermEnum, code, ticket);
if (!code) {
postJSON('hades/anon/hades/getCorpTrainSuiteId', {}, (res) => {
const url = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${res.result}&redirect_uri=${encodeURIComponent(location.href)}&response_type=code&scope=snsapi_privateinfo&state=STATE#wechat_redirect`
location.href = url
})
const url = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=ww80fd6928a46cf33a&redirect_uri=${encodeURIComponent(location.href)}&response_type=code&scope=snsapi_privateinfo&state=STATE#wechat_redirect`
location.href = url
return
}
const ajaxOptions = {
data: JSON.stringify({
} else {
postJSON("hades/anon/hades/wXWorkUserTicketLogin", {
appTermEnum: appTermEnum,
code: code,
ticket: ticket
}),
type: 'POST',
url: BASIC_HOST_MAP[env] + "hades/anon/hades/wXWorkUserTicketLogin",
contentType: 'application/json; charset=UTF-8',
timeout: 20000,
dataType: 'json',
success(res, status, xhr) {
}, (res) => {
if (res.code == 200) {
$('#success').show()
} else {
......@@ -125,10 +129,33 @@
$('#message').html(message)
}
},
};
})
}
function postJSON(url, data, callback) {
const ajaxOptions = {
data: JSON.stringify(data),
type: 'POST',
url: BASIC_HOST_MAP[env] + url,
contentType: 'application/json; charset=UTF-8',
timeout: 20000,
dataType: 'json',
success(res, status, xhr) {
callback(res)
},
};
$.ajax(ajaxOptions)
}
$.ajax(ajaxOptions)
});
</script>
......
src/bu-components/ChooseMembersModal.jsx
......@@ -203,8 +203,10 @@ class ChooseMembersModal extends React.Component {
title: '全选', // 实际为头像，但在表格上这行要求显示为全选
key: 'avatar',
dataIndex: 'avatar',
width: '30px',
width: '40%',
render: (value, record) => {
const { adminName } = record;
return (
<div className='avatar'>
{
......@@ -212,23 +214,12 @@ class ChooseMembersModal extends React.Component {
[<img className='avatar-img' src={ value } key='avatar' alt=""/>]
: [<img className='avatar-img' src='https://image.xiaomaiketang.com/xm/dEyxDRKwFw.png' key='avatar' alt=""/>]
}
<span className='userImg'>
{ adminName }
</span>
</div>
)
}
},{
title: '',
key: 'adminNameLeft',
dataIndex: 'adminName',
width: '30%',
align: 'left',
render: (value, record) => {
const { adminName } = record;
return (
<span className='userImg'>
{ adminName }
</span>
)
}
}
]
return selectColumns
......@@ -309,7 +300,7 @@ class ChooseMembersModal extends React.Component {
// bordered={true}
size={'small'}
rowSelection={{
columnWidth : 30,
columnWidth : 24,
selectedRowKeys,
onChange : this.onChangeRow,
getCheckboxProps : this.getCheckboxProps,
......
src/bu-components/ChooseMembersModal.less
......@@ -50,6 +50,7 @@
height: 23px;
width: 23px;
border-radius: 50%;
margin-right: 8px;
}
}
}
......@@ -68,9 +69,9 @@
.span-right{
float: right;
margin-right: 10px;
color:#5289FA;
color: #999;
.span-right-l{
color: #FD9A6A;
color: #5289FA;
cursor: pointer;
}
}
......
src/bu-components/CopyFileModal.jsx
......@@ -251,12 +251,6 @@ class CopyFileModal extends React.Component {
</Button>
]}
>
{/* <div className='copy-header'>
<Radio.Group>
<Radio.Button value={'MYSELF'} onClick={() => this.getFileList('MYSELF')}>我的文件</Radio.Button>
<Radio.Button onClick={() => this.getFileList('COMMON')}>公共文件</Radio.Button>
</Radio.Group>
</div> */}
<div className='copy-body'>
{/* 面包屑 */}
<div className="bread-crumbs">
......
src/bu-components/CopyFileModal.less
......@@ -59,6 +59,7 @@
.lottie-box {
border:1px solid #E8E8E8;
border-radius:4px;
height: 320px;
}
.lottie-icon{
......
src/bu-components/ManagingMembersModal.jsx
......@@ -194,7 +194,7 @@ class ManagingMembersModal extends React.Component {
title : '头像',
key : 'avatar',
dataIndex : 'avatar',
width : '20%',
width : '8%',
align : 'right',
render : (value, record) => {
return (
......@@ -224,7 +224,7 @@ class ManagingMembersModal extends React.Component {
title : '权限',
key : 'rights',
dataIndex : 'rights',
width : '40%',
width : '50%',
align :'right',
render : (value, record) => {
const imgSrcList = ['https://image.xiaomaiketang.com/xm/Th5cKisf6f.png', 'https://image.xiaomaiketang.com/xm/nzAcc6ryTp.png'];
......
src/bu-components/ManagingMembersModal.less
......@@ -15,7 +15,7 @@
.managing-right{
float: right;
color: #FFB714;
color: #5289FA;
cursor: pointer;
.tool-tip-right{
margin-right: 4px;
......
src/bu-components/SelectPrepareFileModal.less
......@@ -50,9 +50,14 @@
}
.file-list {
// border: 1px solid #E8E8E8;
// border-radius: 4px;
height: 100%;
border-top: 1px solid #E8E8E8;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
border: 1px solid #E8E8E8;
border-radius: 4px;
overflow: auto;
.file-item {
display: flex;
align-items: center;
......
src/components/CourseSearchSelect.jsx
......@@ -72,9 +72,7 @@ class CourseSelect extends React.Component {
loading: false,
totalCount: Number(total),
});
}).finally((res) => {
this.setState({ loading: false });
});
})
}
handleCourseSelect = (course) => {
......
src/components/ImgCutModalNew.jsx
......@@ -67,6 +67,7 @@ class ImgCutModalNew extends React.Component {
})
}
};
if (!photoclip) {
const _photoclip = new PhotoClip('#imgCutModalNew', options);
_photoclip.load(imageFile);
......
src/components/MultipleDatePicker.jsx
......@@ -244,13 +244,14 @@ class MultipleDatePicker extends React.Component {
</div>
)}
<ul className="week">
<li>日</li>
<li>一</li>
<li>二</li>
<li>三</li>
<li>四</li>
<li>五</li>
<li>六</li>
<li>日</li>
</ul>
<ul className="calendar" id="multiCalendar">
{this.state.calendar}
......
src/components/MultipleDatePicker.less
......@@ -55,7 +55,9 @@
cursor: pointer;
vertical-align: top;
&:hover {
background: #e8e8e8;
background: #FFB714;
opacity:0.2;
border-radius:4px;
}
&.before-disabled {
color: #e8e8e8;
......
src/core/antd.less
......@@ -41,6 +41,8 @@
}
.ant-btn-primary {
text-shadow: none !important;
box-shadow: none !important;
i {
color: #fff !important;
}
......@@ -225,11 +227,7 @@
line-height:20px !important;
font-weight: 400 !important;
border: 1px solid #e8e8e8;
&:focus,
:active {
border: 1px solid #ffb000 !important;
color: #ffb000 !important;
}
box-shadow: none !important;
}
.ant-input-search-button {
......@@ -382,13 +380,6 @@ mr0 {
background-color: #fdb089 !important;
border-color: #fdb089 !important;
}
&:focus,
:active {
border: 1px solid @xm-color-text-select-primary !important;
background-color: @xm-color-text-select-primary !important;
}
span {
color: #fff !important;
}
......@@ -641,4 +632,17 @@ mr0 {
.row-dragging .drag-visible {
visibility: visible;
}
.ant-select-dropdown .rc-virtual-list-scrollbar .rc-virtual-list-scrollbar-thumb{
background: #D6D6D6 !important;
}
.ant-table.ant-table-bordered > .ant-table-container > .ant-table-content > table > thead > tr > .ant-table-cell-fix-right-first::after,
.ant-table.ant-table-bordered > .ant-table-container > .ant-table-content > table > tbody > tr > .ant-table-cell-fix-right-first::after
{
border-right:none !important;
}
.ant-table tbody tr:nth-child(2n) td{
background: #FAFAFA !important;
}
\ No newline at end of file
src/core/global.less
......@@ -2,10 +2,12 @@
html {
color: rgba(0, 0, 0, 0.65);
p {
margin-bottom: 0px;
}
body {
font-family: 'PingFang SC', 'Source Han Sans', 'Microsoft YaHei', 'Alibaba Sans';
}
}
span {
......@@ -1344,16 +1346,6 @@ input:focus {
}
}
.g2-tooltip {
background: rgba(0, 0, 0, 0.7) !important;
.g2-tooltip-list {
li {
color: #fff !important;
}
}
}
.BMap_cpyCtrl {
display: none;
}
......
src/domains/basic-domain/constants.ts
/*
* @Author: 陈剑宇
* @Date: 2020-05-07 14:43:01
* @LastEditTime: 2021-01-16 18:00:10
* @LastEditTime: 2021-01-27 19:52:58
* @LastEditors: zhangleyuan
* @Description:
* @FilePath: /wheat-web-demo/src/domains/basic-domain/constants.ts
......@@ -16,7 +16,7 @@ const BASIC_HOST_MAP: MapInterface = {
dev1: 'https://dev1-heimdall.xiaomai5.com/',
rc: 'https://rc-heimdall.xiaomai5.com/',
gray: 'https://gray-heimdall.xiaomai5.com/',
prod: 'https://gateway-heimdall.xiaomai5.com/'
prod: 'https://gateway.xiaomai5.com/'
};
// axios headers config
......
src/domains/course-domain/constants.ts
......@@ -2,12 +2,12 @@
* @Author: 吴文洁
* @Date: 2020-08-20 09:21:40
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-01-16 18:00:18
* @LastEditTime: 2021-01-27 19:53:17
* @Description:
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
import { MapInterface } from '@/domains/basic-domain/interface'
const ENV: string = process.env.DEPLOY_ENV || 'dev';
const ENV: string = process.env.DEPLOY_ENV || 'prod';
const appIdMap: MapInterface = {
dev: 'wx3ea60e78ddfa277e',
......
src/h5.html
......@@ -25,7 +25,7 @@
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<link rel="stylesheet" href="//at.alicdn.com/t/font_2223403_qb6r10go4s.css">
<link rel="stylesheet" href="//at.alicdn.com/t/font_2223403_80qwxi5x2ed.css">
<!--
Notice the use of %PUBLIC_URL% in the tags above.
......
src/index.html
<!--
* @Author: 吴文洁
* @Date: 2020-08-24 12:20:57
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-01-12 21:13:37
* @LastEditors: wufan
* @LastEditTime: 2021-01-18 21:18:43
* @Description:
* @Copyright: 杭州杰竞科技有限公司 版权所有
-->
......@@ -25,7 +25,7 @@
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<link rel="stylesheet" href="//at.alicdn.com/t/font_2223403_qb6r10go4s.css">
<link rel="stylesheet" href="//at.alicdn.com/t/font_2223403_80qwxi5x2ed.css">
<!--
Notice the use of %PUBLIC_URL% in the tags above.
......
src/index.tsx
......@@ -49,7 +49,14 @@ function mount() {
document.getElementById('root'));
}
if (getParameterByName('code')) {
function isWeiXin() {
const ua = navigator.userAgent.toLowerCase();
return ua.indexOf('micromessenger') > 0;
}
console.log(isWeiXin(), 'isWeiXin()')
if (getParameterByName('code') && isWeiXin()) {
Service.Hades('anon/hades/wXWorkUserLogin', {
appTermEnum: 'XIAOMAI_CLOUD_CLASS_PC_WEB_ADMIN',
code: getParameterByName('code')
......
src/modules/common/CourseSearchSelect.jsx
......@@ -106,9 +106,7 @@ class CourseSelect extends React.Component {
loading: false
});
}).finally((res) => {
this.setState({ loading: false });
});
})
}
......
src/modules/common/DateRangePicker.jsx
......@@ -27,6 +27,7 @@ class DateRangePicker extends React.Component {
this.props.onChange(date)
}}
{...showTime}
suffixIcon={<span class="icon iconfont">&#xe838;</span>}
/>
)
}
......
src/modules/course-manage/AddLive.less
.add-live-page {
position:relative !important;
.box {
margin-bottom: 66px !important;
}
......@@ -37,7 +38,7 @@
}
.add-live__intro-info {
margin-left: 0;
padding-left: 24px;
padding-left: 16px;
.label {
width: 100px;
text-align: right;
......
src/modules/course-manage/DataList/CourseData.jsx
......@@ -219,7 +219,7 @@ class DataList extends React.Component {
<Table
columns={this.getVisiterColumns()}
dataSource={this.state.teacherData.visitorInfoVOList}
scroll={{ y: 75 }}
scroll={{ y: 80 }}
size={"small"}
style={{ width: 450 }}
pagination={false}
......
src/modules/course-manage/LiveCoursePage.jsx
......@@ -28,7 +28,7 @@ class LiveCoursePage extends React.Component {
const params = {
...query,
..._query,
storeId:User.getStoreId()
storeId: User.getStoreId()
};
this.setState({ query: params });
CourseService.getLiveCloudCoursePage(params).then((res) => {
......@@ -37,9 +37,7 @@ class LiveCoursePage extends React.Component {
total,
courseList: records
});
}) .finally(() => {
this.setState({ loading: false });
});
})
}
render() {
const { query, total, courseList } = this.state;
......@@ -56,7 +54,7 @@ class LiveCoursePage extends React.Component {
total={total}
courseList={courseList}
onChange={this.handleFetchLiveList}
/>
/>
</div>
</div>
)
......
src/modules/course-manage/components/AddLiveBasic.jsx
......@@ -150,15 +150,16 @@ class AddLiveBasic extends React.Component {
},
};
const imgUrl = `${imageFile.ossUrl}?${new Date().getTime()}`
if (!this.state.photoclip) {
const _photoclip = new PhotoClip("#headPicModal", options);
_photoclip.load(imageFile.ossUrl);
_photoclip.load(imgUrl);
this.setState({
photoclip: _photoclip,
});
} else {
this.state.photoclip.clear();
this.state.photoclip.load(imageFile.ossUrl);
this.state.photoclip.load(imgUrl);
}
}, 200);
......
src/modules/course-manage/components/AddLiveClass.jsx
......@@ -49,7 +49,8 @@ class AddLiveClass extends React.Component {
this.getAssistantList();
}
componentWillReceiveProps(nextProps) {
if(nextProps.data.assistantStoreUserId.length > 0) {
if(nextProps.data.assistantStoreUserId.sort().toString() !== this.props.data.assistantStoreUserId.sort().toString()) {
console.log('我在改变')
// 获取助教老师列表
this.getAssistantList(1, nextProps.data.assistantStoreUserId);
}
......@@ -73,6 +74,9 @@ class AddLiveClass extends React.Component {
}
// 获取助教老师列表
getAssistantList = (current = 1, selectList) => {
console.log('zhujiao',current);
const { assistantQuery,assistantList} = this.state;
const { assistantStoreUserId } = this.props.data;
const idList = selectList ? selectList : assistantStoreUserId;
......@@ -87,6 +91,7 @@ class AddLiveClass extends React.Component {
const { records = [], total = 0, hasNext} = result;
const { teacherId } = this.props.data
let list = current > 1 ? assistantList.concat(records) : records;
console.log("hasNext",typeof(hasNext),hasNext)
this.setState({
assistantHasNext:hasNext,
assistantList: list,
......@@ -101,7 +106,11 @@ class AddLiveClass extends React.Component {
const scrollToBottom = container && container.scrollHeight <= container.clientHeight + container.scrollTop;
if (scrollToBottom && hasNext) {
const { teacherQuery } = this.state;
this.getTeacherList(teacherQuery.current + 1);
let _teacherQuery = teacherQuery;
_teacherQuery.current = _teacherQuery.current + 1
this.setState({
assistantQuery:{..._teacherQuery}
},()=>{this.getTeacherList(_teacherQuery.current)})
}
}
......@@ -112,7 +121,11 @@ class AddLiveClass extends React.Component {
const scrollToBottom = container && container.scrollHeight <= container.clientHeight + container.scrollTop;
if (scrollToBottom && assistantHasNext) {
const { assistantQuery } = this.state;
this.getAssistantList(assistantQuery.current + 1);
let _assistantQuery = assistantQuery;
_assistantQuery.current = _assistantQuery.current + 1
this.setState({
assistantQuery:{..._assistantQuery}
},()=>{this.getAssistantList(_assistantQuery.current)})
}
}
......
src/modules/course-manage/components/AddLiveIntro.jsx
......@@ -52,7 +52,7 @@ class AddLiveIntro extends React.Component {
if(selectType === 'WARMUP'){
const liveCourseWarmMedia = {
contentType: 'WARMUP',
mediaType: folderFormat === 'MP4' ? 'VIDEO' : 'PICTURE',
mediaType: folderFormat === 'MP4' || folderFormat === 'video/mp4' ? 'VIDEO' : 'PICTURE',
mediaContent: resourceId,
mediaUrl: ossUrl,
mediaName: folderName,
......@@ -82,19 +82,7 @@ class AddLiveIntro extends React.Component {
}
}
// 获取机构可见的磁盘
// handleFetchDiskList = () => {
// axios.Apollo('public/apollo/getUserDisk', {}).then((res) => {
// const { result = [] } = res;
// const diskList = result.map((item) => {
// return {
// ...item,
// folderName: DISK_MAP[item.disk]
// }
// });
// this.setState({ diskList });
// });
// }
// 删除简介
handleDeleteIntro = (index) => {
......@@ -174,56 +162,6 @@ class AddLiveIntro extends React.Component {
showSelectFileModal: true,
selectType:'INTRO'
})
// 最多添加九图片
// const { liveCourseMediaRequests } = this.props.data;
// const list = _.filter(liveCourseMediaRequests, (item) => {
// return item.mediaType == "PICTURE";
// });
// if (list.length > 8) {
// message.warning("最多添加9张图片");
// return;
// }
// const { instId } = window.currentUserInstInfo;
// const { name, size } = Blob;
// const resourceName = window.random_string(16) + name.slice(name.lastIndexOf('.'));
// const params = {
// resourceName,
// accessTypeEnum: 'PUBLIC',
// bizCode: 'LIVE_COURSE_MEDIA',
// instId:User.getStoreId(),
// }
// Service.Hades("public/hades/commonOssAuthority", params).then((res) => {
// const { resourceId } = res.result;
// const signInfo = res.result;
// // 构建上传的表单
// const xhr = new XMLHttpRequest();
// const formData = new FormData();
// formData.append("OSSAccessKeyId", signInfo.accessId);
// formData.append("policy", signInfo.policy);
// formData.append("callback", signInfo.callback);
// formData.append("Signature", signInfo.signature);
// formData.append("key", signInfo.key);
// formData.append("file", Blob);
// formData.append("success_action_status", 200);
// xhr.open("POST", signInfo.host);
// xhr.onload = () => {
// liveCourseMediaRequests.push({
// size,
// mediaName: name,
// mediaContent: resourceId,
// mediaType: 'PICTURE',
// mediaUrl: window.URL.createObjectURL(Blob),
// });
// this.props.onChange('liveCourseMediaRequests', liveCourseMediaRequests);
// };
// xhr.onerror = () => {
// xhr.abort();
// };
// xhr.send(formData);
// this.setState({ xhr })
// });
}
whetherVisitorsJoinChange = ()=>{
if(this.props.data.whetherVisitorsJoin==="NO"){
......@@ -233,12 +171,8 @@ class AddLiveIntro extends React.Component {
}
}
componentWillMount() {
// this.handleFetchDiskList();
}
// componentWillUnmount() {
// const { xhr } = this.state;
// xhr && xhr.abort();
// }
render() {
const {liveType, isXiaomai, isEdit, data: { introduction, needRecord,whetherVisitorsJoin,liveCourseMediaRequests = [], liveCourseWarmMedia = {} } } = this.props;
......@@ -370,19 +304,6 @@ class AddLiveIntro extends React.Component {
<span className="icon iconfont">&#xe63b;</span>
<span className="text">图片</span>
</div>
{/* <Upload
fileList={[]}
accept="image/jpeg, image/png, image/jpg, image/gif"
beforeUpload={(Blob) => {
this.handleUpload(Blob);
return false;
}}
>
<div className="operate__item">
<span className="icon iconfont">&#xe63b;</span>
<span className="text">图片</span>
</div>
</Upload> */}
</div>
<div className="tips">
• 图片支持jpeg、jpg、png、gif格式
......
src/modules/course-manage/components/LiveCourseFilter.jsx
......@@ -175,7 +175,6 @@ class LiveCourseFilter extends React.Component {
format={"YYYY-MM-DD"}
onChange={(dates) => { this.handleChangeDates(dates) }}
style={{ width: "calc(100% - 70px)" }}
/>
</div>
{ User.getUserRole()!=="CloudLecturer" &&
......
src/modules/course-manage/components/LiveCourseFilter.less
......@@ -36,6 +36,7 @@
line-height: 20px;
.fold-icon {
font-size: 12px;
margin-left:4px;
}
}
}
......
src/modules/course-manage/components/LiveCourseList.jsx
......@@ -32,7 +32,7 @@ const courseStateShow = {
UN_START: {
code: 1,
title: "待开课",
color: "#FDBE31",
color: "#FFB714",
},
STARTING: {
code: 2,
......@@ -147,7 +147,7 @@ class LiveCourseList extends React.Component {
columns = [
{
title: "直播课",
width: "25%",
width: "23%",
key: "course",
dataIndex: "courseName",
render: (val, record) => {
......@@ -259,9 +259,9 @@ class LiveCourseList extends React.Component {
{
title: <span>
<span>店铺展示</span>
<Tooltip title={<div>开启后，用户可在店铺内查看到此课程。若课程“未成功开课”，则系统会自动“关闭”店铺展示。<br/>关闭后，店铺内不再展示此课程，但用户仍可通过分享的海报/链接查看此课程。</div>}><i className="icon iconfont" style={{ marginLeft: '5px',cursor:'pointer',color:'#bfbfbf'}}>&#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>,
width: "7%",
width: "9%",
dataIndex: "courseware",
render: (val, item, index) => {
return (
......
src/modules/course-manage/modal/ManageCoursewareModal.jsx
......@@ -9,7 +9,7 @@ import { Modal, Button, Table, Progress, message, Tooltip, Spin, Popconfirm } fr
import { QuestionCircleOutlined,LoadingOutlined} from "@ant-design/icons";
import _ from 'underscore';
import moment from 'moment';
// import User from '@/core/user';
import Lottie from "lottie-web";
import User from '@/common/js/user';
import { suffixType, DEFAULT_SIZE_UNIT, SupportFileType } from '@/common/constants/academic/liveEnum';
import { FileVerifyMap, FileTypeIcon, DISK_MAP } from '@/common/constants/academic/lessonEnum';
......@@ -20,6 +20,7 @@ import './ManageCoursewareModal.less';
class ManageCoursewareModal extends React.Component {
constructor(props) {
super(props)
......@@ -38,21 +39,17 @@ class ManageCoursewareModal extends React.Component {
componentDidMount() {
this.getCoursewareList();
// this.handleFetchDiskList();
// if (teacherId) {
// this.judgeLessonPermisson();
// }
var animation = Lottie.loadAnimation({
path: "https://image.xiaomaiketang.com/xm/MQwp2aJaxf.json",
name: "test",
renderer: "svg",
loop: true,
autoplay: true,
container: document.getElementById("lottie-box")
});
}
// 判断资料云盘权限
// judgeLessonPermisson = () => {
// const query = {
// permissionCode: "2001"
// };
// axios.Apollo("public/apollo/judgeLessonPermission", query).then(res => {
// this.setState({ isLessonPermission: res.result })
// });
// };
// 获取课件列表
getCoursewareList(id) {
......@@ -104,25 +101,10 @@ class ManageCoursewareModal extends React.Component {
})
}
// 获取机构可见的磁盘目录
// handleFetchDiskList = () => {
// Service.Hades('public/apollo/getUserDisk', {}).then((res) => {
// const { result = [] } = res;
// const diskList = result.map((item) => {
// return {
// ...item,
// folderName: DISK_MAP[item.disk]
// }
// });
// this.setState({
// diskList,
// });
// });
// }
// 上传文件
addFile() {
// 判断是否早于开课前45分钟
// 判断是否早于开课前30分钟
const { startTime } = this.props.data;
const currentTime = new Date().getTime();
if (currentTime >= startTime - 30 * 60 * 1000) {
......@@ -233,27 +215,6 @@ class ManageCoursewareModal extends React.Component {
}
};
// 校验余额
// handleCheckBalance = async () => {
// const { type } = this.props;
// const balanceRes = await axios.Business("public/liveAssets/query", { });
// // 判断是否欠费，旗舰版用户不需要校验余额
// const ultimateRes = await axios.Business('public/inst/checkInstProduct', {
// productCodeList: ['ULTIMATESELL', 'PIP_TO_ULTIMATE', 'HIGH_TO_ULTIMATE']
// });
// const { result } = balanceRes;
// // balance小于0表示已经欠费
// if ((!result || result.balance <= 0) && !ultimateRes.result && type === 'interactive') {
// Modal.info({
// title: '无法继续操作',
// content: '直播服务已升级，请联系运营老师。',
// icon: <span className="icon iconfont default-confirm-icon">&#xe6f4;</span>
// })
// return false;
// }
// return true;
// };
render() {
const columns = [
......@@ -313,7 +274,7 @@ class ManageCoursewareModal extends React.Component {
const uploadFail = failObject[item.id];
// 上课前45分钟/上课中/已结束的情况下都不可操作
if (this.props.data.startTime < Date.now() + 2700000 || item.progress || uploadFail) {
if (this.props.data.startTime < Date.now() + 1800000 || item.progress || uploadFail) {
return <span>-</span>
}
return (
......@@ -351,15 +312,17 @@ class ManageCoursewareModal extends React.Component {
>
{_.isEmpty(_list) ?
<div className="empty-body">
<img className="empty-image" src="https://image.xiaomaiketang.com/xm/s8xkAPCDex.png" alt="" />
<div id="lottie-box" className="empty-image">
</div>
<Button
className="empty-button"
type="primary"
onClick={() => this.addFile()}
>上传课件</Button>
<p className="empty-tip">提前上传直播需要的课件和素材，直播将会变得更便捷！</p>
<p className="empty-tip">提前上传直播需要的课件和素材，直播将会变得更便捷！</p>
</div>
: <div className="manage-body">
<div id="lottie-box" className="empty-image" style={{display:'none'}}></div>
<div className="header">
<Button
className="header-button"
......
src/modules/course-manage/modal/ManageCoursewareModal.less
......@@ -8,6 +8,8 @@
.empty-image {
display: block;
margin: 24px auto 12px;
width:100px;
height:100px;
}
.empty-button {
display: block;
......@@ -58,7 +60,7 @@
}
&:hover {
.name {
color: #FF7519;
color: #FFB714;
}
}
}
......
src/modules/course-manage/modal/ShareLiveModal.jsx
......@@ -24,6 +24,7 @@ class ShareLiveModal extends React.Component {
constructor(props) {
super(props);
this.state = {
shareUrl: 'https://xiaomai5.com/liveShare?courseId=12'
}
......@@ -32,6 +33,43 @@ class ShareLiveModal extends React.Component {
componentDidMount() {
// 获取短链接
this.handleConvertShortUrl();
// const { needStr, data, type } = this.props;
// const { courseName, coverUrl = DEFAULT_COVER, scheduleVideoUrl } = data;
// const { shareUrl ,time} = this.state;
// // 判断是否是默认图, 默认图不需要在URL后面增加字符串
// const isDefaultCover = coverUrl === DEFAULT_COVER;
// let coverImgSrc = coverUrl;
// if(type === 'videoClass'){
// if(!coverUrl || isDefaultCover){
// coverImgSrc = `${scheduleVideoUrl}?x-oss-process=video/snapshot,t_0,m_fast&anystring=anystring`
// }
// }else{
// data.courseMediaVOS.map((item,index)=>{
// if( item.contentType === "COVER"){
// coverImgSrc = item.mediaUrl;
// }
// })
// }
// let image = new Image()
// image.src =coverImgSrc + '?v=' + Math.random()
// image.crossOrigin = "*"
// image.onload = ()=>{
// let imgData = getBase64Image(image)
// this.setState({imgData})
// }
// function getBase64Image (img) {
// let canvas = document.createElement("canvas")
// canvas.width = img.width
// canvas.height = img.height
// let ctx = canvas.getContext("2d")
// ctx.drawImage(img, 0, 0, img.width, img.height)
// let dataURL = canvas.toDataURL("image/png")
// return dataURL
// }
}
handleConvertShortUrl = () => {
......@@ -42,6 +80,7 @@ class ShareLiveModal extends React.Component {
urls: [longUrl]
}).then((res) => {
const { result = [] } = res;
this.setState({
shareUrl: result[0].shortUrl
}, () => {
......@@ -62,15 +101,24 @@ class ShareLiveModal extends React.Component {
// 下载海报
handleDownloadPoster = () => {
const dom = document.querySelector('#poster');
html2canvas(dom, {
useCORS: true,
}).then(canvas => {
const download = document.createElement('a');
const { courseName } = this.props.data;
const dataUrl = canvas.toDataURL('image/png');
$(download).attr('href', dataUrl).attr('download', `${courseName}.png`).get(0).click();
this.setState({
showImg:true,
time:new Date().valueOf()
},()=>{
this.setState({time:new Date().valueOf()},()=>{
let node = document.getElementById('poster');
domtoimage.toPng(node)
.then((imgData) => {
console.log(imgData)
const download = document.createElement('a');
const { courseName } = this.props.data;
$(download).attr('href', imgData).attr('download', `${courseName}.png`).get(0).click();
// this.props.close()
})
})
})
}
// 复制分享链接
......@@ -84,17 +132,23 @@ class ShareLiveModal extends React.Component {
render() {
const { needStr, data, type } = this.props;
const { courseName, coverUrl = DEFAULT_COVER, scheduleVideoUrl } = data;
const { shareUrl } = this.state;
const { shareUrl ,imgData,showImg,time} = this.state;
// 判断是否是默认图, 默认图不需要在URL后面增加字符串
const isDefaultCover = coverUrl === DEFAULT_COVER;
const coverImgSrc = type === 'videoClass'
// 如果是默认图, 显示视频的第一帧, 否则显示上传的视频封面
? ((!coverUrl || isDefaultCover)
? `${scheduleVideoUrl}?x-oss-process=video/snapshot,t_0,m_fast&anystring=anystring`
: `${coverUrl}`)
: `${coverUrl}`
let coverImgSrc = coverUrl;
if(type === 'videoClass'){
if(!coverUrl || isDefaultCover){
coverImgSrc = `${scheduleVideoUrl}?x-oss-process=video/snapshot,t_0,m_fast&anystring=anystring`
}
}else{
data.courseMediaVOS.map((item,index)=>{
if( item.contentType === "COVER"){
coverImgSrc = item.mediaUrl;
}
})
}
return (
......@@ -107,7 +161,8 @@ class ShareLiveModal extends React.Component {
className="share-live-modal"
onCancel={this.props.close}
>
<div className="left" id="poster">
<div className="left">
<div id="poster">
<div className="store-name">
<span className="text">{storeName}</span>
</div>
......@@ -117,13 +172,16 @@ class ShareLiveModal extends React.Component {
type === "liveClass" &&
<div class="live-couse-name">{courseName}</div>
}
<img
src={coverImgSrc}
className="course-cover"
/>
{
showImg ? <img
crossOrigin='*'
src={coverImgSrc+`?=${time}`}
className="course-cover"
/>: <img
src={coverImgSrc+`?=${time}`}
className="course-cover"
/>
}
<div className="qrcode-wrap">
<div className="qrcode-wrap__left">
<div className="text">长按识别二维码进入观看</div>
......@@ -132,38 +190,35 @@ class ShareLiveModal extends React.Component {
<div className="qrcode-wrap__right" id="qrcodeWrap">
</div>
</div>
</div>
<div className="right">
<div className="share-poster right__item">
<div className="title">① 海报分享</div>
{ type === "liveClass" &&
<div className="sub-title">用户可通过微信扫描海报二维码，观看直播</div>
}
{ type === "videoClass" &&
<div className="sub-title">用户可通过微信识别二维码，报名观看视频</div>
}
</div>
<div className="right">
<div className="share-poster right__item">
<div className="title">① 海报分享</div>
{ type === "liveClass" &&
<div className="sub-title">用户可通过微信扫描海报二维码，观看直播</div>
}
{ type === "videoClass" &&
<div className="sub-title">用户可通过微信识别二维码，报名观看视频</div>
}
<div className="content" onClick={this.handleDownloadPoster}>下载海报</div>
</div>
<div className="content" onClick={this.handleDownloadPoster}>下载海报</div>
</div>
<div className="share-url right__item">
<div className="title">② 链接分享</div>
{ type === "liveClass" &&
<div className="sub-title">用户可通过微信打开以下链接，观看直播</div>
}
{ type === "videoClass" &&
<div className="sub-title">用户可通过打开链接，报名观看视频</div>
}
<div className="content">
<div className="share-url" id="shareUrl">{shareUrl}</div>
<Button type="primary" onClick={this.handleCopy}>复制</Button>
</div>
<div className="share-url right__item">
<div className="title">② 链接分享</div>
{ type === "liveClass" &&
<div className="sub-title">用户可通过微信打开以下链接，观看直播</div>
}
{ type === "videoClass" &&
<div className="sub-title">用户可通过打开链接，报名观看视频</div>
}
<div className="content">
<div className="share-url" id="shareUrl">{shareUrl}</div>
<Button type="primary" onClick={this.handleCopy}>复制</Button>
</div>
</div>
</div>
</Modal>
)
}
......
src/modules/course-manage/modal/ShareLiveModal.less
.share-live-modal {
.ant-modal-body {
display: flex;
#poster{
background: #FFF;
margin:0;
padding: 20px;
}
.left {
width: 303px;
padding: 20px;
margin: 0 32px 0 16px;
box-shadow:0px 2px 10px 0px rgba(0,0,0,0.05);
border-radius: 12px;
.course-name-title {
font-size: 14px;
color: #333;
......
src/modules/course-manage/video-course/AddVideoCourse.jsx
......@@ -2,7 +2,7 @@
* @Author: 吴文洁
* @Date: 2020-08-05 10:07:47
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-01-14 18:59:12
* @LastEditTime: 2021-01-25 13:46:13
* @Description: 视频课新增/编辑页
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
......@@ -510,8 +510,8 @@ class AddVideoCourse extends React.Component {
</div>
</div>
</div>
<div className="course-catalog">
<span className="label"><span className="require">*</span>课程分类：</span>
<div className="course-catalog required">
<span className="label">课程分类：</span>
{ (pageType === 'add') &&
<Cascader defaultValue={[categoryName]} options={courseCatalogList} displayRender={ label => label.join('-')} fieldNames={fieldNames} onChange={this.catalogChange} style={{ width: 240 }} placeholder="请选择课程分类" />
}
......@@ -540,24 +540,25 @@ class AddVideoCourse extends React.Component {
</div>
{/* 选择备课文件弹窗 */}
<SelectPrepareFileModal
operateType="select"
selectTypeList={['MP4']}
accept="video/mp4"
confirm={{
title: '文件过大，无法上传',
content: '为保障学员的观看体验，上传的视频大小不能超过500M',
}}
tooltip={'格式支持mp4，大小不超过500M'}
isOpen={showSelectFileModal}
diskList={diskList}
addVideo={true}
onClose={() => {
this.setState({ showSelectFileModal: false })
}}
onSelect={this.handleSelectVideo}
/>
{ showSelectFileModal &&
<SelectPrepareFileModal
operateType="select"
selectTypeList={['MP4']}
accept="video/mp4"
confirm={{
title: '文件过大，无法上传',
content: '为保障学员的观看体验，上传的视频大小不能超过500M',
}}
tooltip={'格式支持mp4，大小不超过500M'}
isOpen={showSelectFileModal}
diskList={diskList}
addVideo={true}
onClose={() => {
this.setState({ showSelectFileModal: false })
}}
onSelect={this.handleSelectVideo}
/>
}
<ImgCutModalNew
title="裁剪"
width={550}
......
src/modules/course-manage/video-course/AddVideoCourse.less
.add-video-course-page {
position:relative !important;
.box{
margin-bottom:66px !important;
}
.ant-radio-group {
display: flex;
flex-direction: column;
......@@ -25,7 +28,11 @@
.form {
margin-top: 16px;
padding: 0 16px;
.label{
display:inline-block;
text-align:right;
width:85px;
}
.required {
position: relative;
......@@ -33,7 +40,7 @@
position: absolute;
content: '*';
color: red;
left: -10px;
left: 5px;
top: 6px;
}
......@@ -110,7 +117,7 @@
}
.sub-content {
margin-left: 70px;
margin-left: 85px;
margin-top: 4px;
.tips {
......
src/modules/course-manage/video-course/components/AddVideoIntro.jsx
......@@ -187,17 +187,15 @@ class AddVideoIntro extends React.Component {
<div className="allow-tourist-join">
<span className="label">观看设置：</span>
<div className="content">
<Row>
<Col span={3}>
<Switch checked={whetherVisitorsJoin==="YES"? true:false} onChange={this.whetherVisitorsJoinChange}/>
</Col>
<Col span={21}>
<div className="desc">
<div>开启：允许未绑定手机号的用户进入直播间观看直播</div>
<div>关闭：仅限绑定了手机号的用户可以进入直播间观看直播</div>
</div>
</Col>
</Row>
<div>
<Switch checked={whetherVisitorsJoin==="YES"? true:false} onChange={this.whetherVisitorsJoinChange}/>
</div>
<div>
<div className="desc">
<div>开启：允许未绑定手机号的用户观看</div>
<div>关闭：仅限绑定了手机号的用户可以进入观看视频</div>
</div>
</div>
</div>
</div>
<div className="store-show">
......@@ -217,7 +215,7 @@ class AddVideoIntro extends React.Component {
</div>
</div>
<div className="introduce">
<span className="label">视频课简介:</span>
<span className="label">视频课简介：</span>
<div className="content">
<div className="intro-list">
{
......@@ -266,18 +264,19 @@ class AddVideoIntro extends React.Component {
</div>
</div>
{/* 选择暖场图文件弹窗 */}
<SelectPrepareFileModal
operateType="select"
accept={selectType==="INTRO"?"image/jpeg,image/png,image/jpg":"video/mp4,image/jpeg,image/png,image/jpg"}
selectTypeList={ selectType==="INTRO" ? ['JPG', 'JPEG', 'PNG']: ['MP4', 'JPG', 'JPEG', 'PNG'] }
tooltip={ selectType==="INTRO"?'支持文件类型：jpg、jpeg、png':'支持文件类型：jpg、jpeg、png、mp4'}
isOpen={showSelectFileModal}
onClose={() => {
this.setState({ showSelectFileModal: false })
}}
onSelect={this.handleSelectVideo}
/>
{ showSelectFileModal &&
<SelectPrepareFileModal
operateType="select"
accept={selectType==="INTRO"?"image/jpeg,image/png,image/jpg":"video/mp4,image/jpeg,image/png,image/jpg"}
selectTypeList={ selectType==="INTRO" ? ['JPG', 'JPEG', 'PNG']: ['MP4', 'JPG', 'JPEG', 'PNG'] }
tooltip={ selectType==="INTRO"?'支持文件类型：jpg、jpeg、png':'支持文件类型：jpg、jpeg、png、mp4'}
isOpen={showSelectFileModal}
onClose={() => {
this.setState({ showSelectFileModal: false })
}}
onSelect={this.handleSelectVideo}
/>
}
</div>
)
}
......
src/modules/course-manage/video-course/components/AddVideoIntro.less
.add-video__intro-info {
.playback {
margin-bottom: 10px;
.require {
......@@ -9,7 +8,11 @@
color: #999;
}
}
.label{
display:inline-block;
text-align:right;
width:85px;
}
.playback,
.introduce {
display: flex;
......@@ -17,10 +20,14 @@
}
.allow-tourist-join{
display:flex;
.content{
display:flex;
}
.desc{
margin-left:16px;
font-size:14px;
color:#999;
display:inline-block;
}
}
.store-show{
......@@ -31,6 +38,7 @@
margin-left:16px;
font-size:14px;
color:#999;
display:inline-block;
}
}
.radio {
......
src/modules/course-manage/video-course/components/VideoCourseFilter.less
......@@ -37,6 +37,7 @@
line-height: 20px;
.fold-icon {
font-size: 12px;
margin-left:4px;
}
}
}
......
src/modules/course-manage/video-course/components/VideoCourseList.jsx
......@@ -2,7 +2,7 @@
* @Author: 吴文洁
* @Date: 2020-08-05 10:12:45
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-01-15 19:58:12
* @LastEditTime: 2021-01-27 19:53:30
* @Description: 视频课-列表模块
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
......@@ -23,7 +23,7 @@ import User from '@/common/js/user'
import './VideoCourseList.less';
const ENV = process.env.DEPLOY_ENV || 'dev';
const ENV = process.env.DEPLOY_ENV || 'prod';
class VideoCourseList extends React.Component {
......@@ -68,7 +68,8 @@ class VideoCourseList extends React.Component {
title: '视频课',
key: 'scheduleName',
dataIndex: 'scheduleName',
width:'15%',
width:321,
fixed: 'left',
render: (val, record) => {
const { coverUrl, scheduleVideoUrl } = record;
return (
......@@ -90,7 +91,7 @@ class VideoCourseList extends React.Component {
title: '课程分类',
key: 'categoryName',
dataIndex: 'categoryName',
width: '10%',
width: '20%',
render: (val, record) => {
return (
<div className="record__item">
......@@ -103,7 +104,7 @@ class VideoCourseList extends React.Component {
title: '创建人',
key: 'createName',
dataIndex: 'createName',
width: '8%',
width: '10%',
render: (val) => {
return (
<div>
......@@ -123,7 +124,7 @@ class VideoCourseList extends React.Component {
{
title: <span>
<span>店铺展示</span>
<Tooltip title={<div>开启后，用户可在店铺内查看到此课程。若课程“未成功开课”，则系统会自动“关闭”店铺展示。<br/>关闭后，店铺内不再展示此课程，但用户仍可通过分享的海报/链接查看此课程。</div>}><i className="icon iconfont" style={{ marginLeft: '5px',cursor:'pointer',color:'#bfbfbf'}}>&#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>,
width: '12%',
dataIndex: "courseware",
......@@ -135,7 +136,7 @@ class VideoCourseList extends React.Component {
},
{
title: "观看用户数",
width: "10%",
width: 110,
key: "watchUserCount",
dataIndex: "watchUserCount",
render: (val, item) => {
......@@ -168,7 +169,8 @@ class VideoCourseList extends React.Component {
title: '操作',
key: 'operate',
dataIndex: 'operate',
width: "20%",
width: 210,
fixed: 'right',
render: (val, record) => {
return (
<div className="operate">
......@@ -325,6 +327,8 @@ class VideoCourseList extends React.Component {
columns={this.parseColumns()}
onChange={this.handleChangeTable}
pagination={false}
scroll={{ x: 1500}}
bordered
/>
<div className="box-footer">
......
src/modules/course-manage/video-course/components/VideoCourseList.less
.video-course-list {
margin-top: 12px;
.watchUserCount{
text-align:right;
padding:16px;
}
.operate-text {
color: #5289FA;
cursor: pointer;
}
.operate {
display: flex;
......
src/modules/course-manage/video-course/components/VideoCourseOpt.less
.video-course-opt {
margin-top: 16px;
.link {
color: #FF8534;
}
......
src/modules/course-manage/video-course/modal/WatchDataModal.jsx
......@@ -119,7 +119,7 @@ class WatchDataModal extends React.Component {
}
render() {
const { visible,size,dataSource,totalCount,query,current } = this.state;
const { visible,size,dataSource,totalCount,query} = this.state;
return (
<Modal
title="视频课观看数据"
......@@ -129,7 +129,7 @@ class WatchDataModal extends React.Component {
maskClosable={false}
className="watch-data-modal"
closable={true}
width={720}
width={800}
>
<div className="search-container">
<Search placeholder="搜索用户姓名/手机号" style={{ width: 200 }} onChange={(e) => { this.handleChangNickname(e.target.value)}} onSearch={ () => { this.handleFetchDataList()}} />
......@@ -144,7 +144,7 @@ class WatchDataModal extends React.Component {
{dataSource.length >0 &&
<div className="box-footer">
<PageControl
current={current - 1}
current={query.current - 1}
pageSize={size}
total={totalCount}
toPage={(page) => {
......
src/modules/home/Home.less 0 → 100644
.home-page {
padding: 0 16px 16px;
min-width: 1100px;
.home-title {
height: 44px;
line-height: 44px;
color: #999;
}
@font-face {
font-family: 'number';
src: url('https://image.xiaomaiketang.com/xm/n2sADd2jY6.TTF');
}
.data-box {
display: flex;
justify-content: space-between;
.data-item {
position: relative;
height: 156px;
background: #fff;
width: ~'calc(16.67% - 8px)';
padding: 16px;
&.course-data {
width: ~'calc(50% - 24px)';
}
.header {
display: flex;
.header-icon {
width: 18px;
height: 18px;
margin-right: 4px;
}
.header-word {
display: inline-block;
font-size: 12px;
line-height: 18px;
color: #999;
}
}
.data-number {
font-family: 'number';
font-size: 28px;
color: #333;
margin-top: 24px;
}
.data-footer {
margin-top: 12px;
.footer-word {
font-size: 12px;
color: #999;
margin-right: 8px;
}
.iconfont {
font-size: 12px;
margin-right: 4px;
color: #EC4B35;
}
.footer-number {
font-size: 12px;
color: #999;
}
}
.course-box {
border-radius: 4px;
background: #FAFAFA;
height: 124px;
width: 66%;
position: absolute;
right: 16px;
top: 16px;
padding: 8px 24px 0;
.course-item {
display: inline-block;
width: 50%;
padding: 4px 0 12px;
.course-title {
font-size: 12px;
color: #999;
}
.data {
display: flex;
align-items: center;
.course-number {
font-size: 16px;
font-family: 'number';
margin-right: 16px;
}
.course-word {
font-size: 12px;
color: #999;
margin-right: 8px;
}
.iconfont {
font-size: 12px;
margin-right: 4px;
color: #EC4B35;
}
.add-number {
font-size: 12px;
color: #999;
}
}
}
}
}
}
.study-box {
display: flex;
justify-content: space-between;
.study-item {
position: relative;
height: 414px;
background: #fff;
width: ~'calc(50% - 8px)';
padding: 16px;
.study-title {
font-size: 16px;
color: #333;
font-weight: 500;
line-height: 22px;
margin-bottom: 12px;
.iconfont {
font-size: 14px;
color: #BFBFBF;
margin-left: 4px;
}
.tip {
font-size: 14px;
color: #999999;
margin-left: 8px;
}
}
.study-header {
display: flex;
justify-content: space-between;
margin-bottom: 16px;
.study-tab {
.tab {
position: relative;
padding-right: 24px;
color: #666;
cursor: pointer;
&.selected {
color: #FDB513;
&::after {
position: absolute;
width: 24px;
height: 2px;
content: '';
background: #FDB513;
border-radius: 1px;
left: 9px;
bottom: -4px;
}
}
}
}
.study-select {
.select-word {
color: #999;
margin-right: 8px;
}
}
}
.table-item {
width: 100%;
height: 60px;
display: flex;
align-items: center;
&.odd {
background: #FAFAFA;
}
.table-image {
width: 24px;
height: 24px;
margin: 0 16px;
}
.table-number {
width: 10%;
color: #999;
padding: 0 16px;
}
.table-data {
width: 60%;
padding: 0 16px;
.table-name {
color: #333;
line-height: 20px;
margin-bottom: 2px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.table-tag {
line-height: 17px;
color: #999;
font-size: 12px;
}
}
.table-study {
width: 30%;
color: #999;
padding: 0 16px;
}
}
.study-empty {
margin-top: 102px;
img {
display: block;
width: 100px;
height: 100px;
margin: 0 auto 8px;
}
div {
text-align: center;
color: #333;
}
}
.circle-box {
width: 70%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
.big-circle {
display: flex;
align-items: center;
justify-content: center;
width: 204px;
height: 204px;
border-radius: 102px;
background: #F1F3F6;
.small-circle {
display: flex;
align-items: center;
justify-content: center;
width: 124px;
height: 124px;
border-radius: 62px;
background: #fff;
.tip-box {
text-align: center;
}
}
}
}
.circle-tip {
position: absolute;
left: 70%;
padding-left: 16px;
&.unfinished {
top: 152px;
.spot {
background: #5289FA;
}
}
&.finished {
top: 232px;
.spot {
background: #FFBB54;
}
}
.spot {
position: absolute;
width: 8px;
height: 8px;
border-radius: 4px;
top: 20px;
left: 0;
}
.number {
color: #333;
font-size: 16px;
margin-bottom: 2px;
}
.word {
color: #999;
}
}
}
}
.study-chart {
width: 100%;
height: 396px;
background: #fff;
padding: 16px;
margin-top: 16px;
.study-title {
font-size: 16px;
color: #333;
font-weight: 500;
line-height: 22px;
margin-bottom: 12px;
display: flex;
justify-content: space-between;
.study-select {
font-weight: 400;
font-size: 14px;
.select-word {
color: #999;
margin-right: 8px;
}
}
}
.chart-tip {
display: flex;
justify-content: space-between;
div {
color: #999;
.iconfont {
color: #999;
font-size: 14px;
margin-left: 4px;
}
}
}
}
}
.g2-tooltip {
background-color: #fff !important;
}
\ No newline at end of file
src/modules/personalInfo/index.tsx
......@@ -2,7 +2,7 @@
* @Author: zhangleyuan
* @Date: 2020-11-27 15:06:31
* @LastEditors: wufan
* @LastEditTime: 2021-01-11 19:19:03
* @LastEditTime: 2021-01-18 21:22:16
* @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......
src/modules/root/App.tsx
......@@ -2,7 +2,7 @@
* @Author: 吴文洁
* @Date: 2019-07-10 10:30:49
* @LastEditors: wufan
* @LastEditTime: 2021-01-09 15:06:50
* @LastEditTime: 2021-01-18 21:22:33
* @Description:
*/
import React, { useContext, useEffect, useState } from 'react';
......@@ -28,6 +28,9 @@ const App: React.FC = (props: any) => {
useEffect(() => {
getStoreAndUserInfo();
window.RCHistory.push({
pathname: `/switch-route`,
})
}, [])
async function getStoreAndUserInfo() {
......
src/modules/root/Header.jsx
......@@ -2,7 +2,7 @@
* @Author: 吴文洁
* @Date: 2019-09-10 18:26:03
* @LastEditors: wufan
* @LastEditTime: 2021-01-12 17:25:20
* @LastEditTime: 2021-01-25 20:40:53
* @Description:
*/
import React, { useContext, useEffect, useState } from "react";
......@@ -163,9 +163,7 @@ function Header(props) {
</div>
</div>
<div className="share" onClick={handleCopy}>
<Tooltip title="分享店铺" placement="bottom">
<span className="icon iconfont tool-tip-right">&#xe85e;</span>
</Tooltip>
<span className="icon iconfont tool-tip-right">&#xe85e;</span>
<div className="text">分享店铺</div>
</div>
......
src/modules/root/Header.less
......@@ -251,7 +251,6 @@
}
.url-link {
color: #5289fa;
width: 70px;
font-size: 14px;
line-height: 20px;
}
......
src/modules/root/Login.jsx
......@@ -122,7 +122,7 @@ function Login(props) {
<div className="login-box">
<div className="login">
<div className="r">
<Tabs defaultActiveKey="1" >
<Tabs defaultActiveKey="1">
<TabPane tab="企业微信登录" key="1">
<WechatLogin></WechatLogin>
</TabPane>
......
src/modules/root/Menu.less
......@@ -76,12 +76,6 @@
&.left-container-vertical {
width: 62px;
.left {
// .ant-menu-item {
// text-align: center;
// }
// .icon {
// margin-right: 0px;
// }
.ant-menu-submenu-arrow{
display:none !important;
}
......@@ -96,50 +90,50 @@
background: @menu-bakg !important;
}
// .ant-menu-submenu-popup>.ant-menu {
// background: @menu-bakg !important;
// color: #9A9DA7;
// padding-left: 15px;
// width: 132px;
// min-width: auto;
.ant-menu-submenu-popup>.ant-menu {
background: @menu-bakg !important;
color: #9A9DA7;
padding-left: 15px;
width: 132px;
min-width: auto;
// li {
// padding-left: 22px;
// padding-right: 0;
// width: 117px;
// }
li {
padding-left: 22px;
padding-right: 0;
width: 117px;
}
// .listType {
// width: 5px;
// height: 5px;
// background: #9A9DA7;
// border-radius: 50%;
// top: 18px;
// left: 5px;
// position: absolute;
// }
.listType {
width: 5px;
height: 5px;
background: #9A9DA7;
border-radius: 50%;
top: 18px;
left: 10px;
position: absolute;
}
// .ant-menu-item-selected {
// background: @menu-bakg;
// color: #fff;
.ant-menu-item-selected {
background: @menu-bakg;
color: #fff;
// .listType {
// background: @active-color;
// }
// }
.listType {
background: @active-color;
}
}
// &:hover {
// .ant-menu-item-active {
// color: #fff;
// .listType {
// background: #fff;
// }
// }
&:hover {
.ant-menu-item-active {
color: #fff;
.listType {
background: #fff;
}
}
// .ant-menu-item-selected {
// .listType {
// background: @active-color;
// }
// }
// }
// }
.ant-menu-item-selected {
.listType {
background: @active-color;
}
}
}
}
src/modules/root/WechatLogin.less
......@@ -7,7 +7,6 @@
margin-top: 12px;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
line-height: 20px;
}
......
src/modules/root/WechatLogin.tsx
......@@ -26,7 +26,7 @@ export default function WechatLogin(props: any) {
if (status === 0) {
Service.Hades("anon/hades/getTicket", {}).then((res: any) => {
setTicket(res.result)
const redirect = `${location.origin + location.pathname.replace('index.html', 'h5.html')}?ticket=${res.result}&appTermEnum=XIAOMAI_CLOUD_CLASS_PC_WEB_ADMIN&env=${process.env.DEPLOY_ENV || 'dev'}`
const redirect = `${location.origin + location.pathname.replace('index.html', '') + 'h5.html'}?ticket=${res.result}&appTermEnum=XIAOMAI_CLOUD_CLASS_PC_WEB_ADMIN&env=${process.env.DEPLOY_ENV || 'prod'}`
// console.log(redirect)
// const url = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=ww409ccf9c6e31f19e&redirect_uri=${encodeURIComponent(redirect)}&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect`
// console.log(url)
......@@ -73,7 +73,7 @@ export default function WechatLogin(props: any) {
User.setToken(_res.result.loginInfo.xmToken);
window.RCHistory.push({
pathname: `/switch-route`,
})
})
})
}
......
src/modules/store-manage/EmployeeAddOrEditModal.less
.employee-add-modal {
.mt-4 {
margin-bottom:-6px !important
}
.mt-10 {
margin-bottom:-10px !important
}
.mt-26 {
margin-bottom:-26px !important
}
.mb10 {
margin-top: 5px !important;
}
.radio-tip {
padding-left: 24px;
font-size: 14px;
......
src/modules/store-manage/EmployeeAddOrEditModal.tsx
......@@ -2,7 +2,7 @@
* @Author: wufan
* @Date: 2020-11-27 16:21:49
* @LastEditors: wufan
* @LastEditTime: 2021-01-09 16:32:41
* @LastEditTime: 2021-01-25 21:14:48
* @Description: Description
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......@@ -223,6 +223,8 @@ function AddEmployeeModal(props: AddEmployeeModalProps) {
rules={[{ required: true }]}
validateStatus={nameStatus}
help={nameErrorMsg}
style={{marginBottom:'-2px !important'}}
className="mt-4"
>
<Input
style={{ width: 200 }}
......@@ -236,6 +238,8 @@ function AddEmployeeModal(props: AddEmployeeModalProps) {
<Form.Item
label="企业微信账号"
name="weChatAccount"
style={{marginBottom:'-2px !important'}}
className="mt-10"
>
<div>{props.choosedItem.weChatAccount}</div>
</Form.Item>
......@@ -246,6 +250,8 @@ function AddEmployeeModal(props: AddEmployeeModalProps) {
rules={[{ required: true }]}
validateStatus={phoneStatus}
help={phoneErrorMessage}
style={{marginBottom:'-2px !important'}}
className="mt-10"
>
<Input
style={{ width: 200 }}
......@@ -268,13 +274,17 @@ function AddEmployeeModal(props: AddEmployeeModalProps) {
label="员工身份"
name="role"
rules={[{ required: false }]}
style={{marginBottom:'-2px !important'}}
className="mt-26"
>
<RadioGroup
onChange={(e) => {
handleChangeValues("role", e.target.value);
}}
className="mt5"
>
<Radio value={"CloudLecturer"}>
<Radio value={"CloudLecturer"} className="mt-4"
>
<span style={{ color: "#333" }}>普通讲师</span>
<p className="radio-tip">
仅可查看/使用与自己相关的文件和课表，并进行上课
......
src/modules/store-manage/StoreH5DecorationTab.jsx
......@@ -2,7 +2,7 @@
* @Author: wufan
* @Date: 2020-11-30 10:47:38
* @LastEditors: wufan
* @LastEditTime: 2021-01-03 22:37:32
* @LastEditTime: 2021-01-18 21:22:44
* @Description: web店铺banner页面
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......@@ -269,15 +269,18 @@ class StoreH5Decoration extends React.Component {
},
};
const imgUrl = `${imageFile.ossUrl}?${new Date().getTime()}`
if (!this.state.photoclip) {
const _photoclip = new PhotoClip("#headPicModal", options);
_photoclip.load(imageFile.ossUrl);
_photoclip.load(imgUrl);
this.setState({
photoclip: _photoclip,
});
} else {
this.state.photoclip.clear();
this.state.photoclip.load(imageFile.ossUrl);
this.state.photoclip.load(imgUrl);
}
}, 200);
......
src/modules/store-manage/StoreWebDecorationTab.jsx
......@@ -2,7 +2,7 @@
* @Author: wufan
* @Date: 2020-11-30 10:47:38
* @LastEditors: wufan
* @LastEditTime: 2021-01-04 11:11:38
* @LastEditTime: 2021-01-18 14:59:57
* @Description: web店铺banner页面
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......@@ -268,15 +268,17 @@ class StoreWebDecoration extends React.Component {
},
};
const imgUrl = `${imageFile.ossUrl}?${new Date().getTime()}`
if (!this.state.photoclip) {
const _photoclip = new PhotoClip("#headPicModal", options);
_photoclip.load(imageFile.ossUrl);
_photoclip.load(imgUrl);
this.setState({
photoclip: _photoclip,
});
} else {
this.state.photoclip.clear();
this.state.photoclip.load(imageFile.ossUrl);
this.state.photoclip.load(imgUrl);
}
}, 200);
......
src/routes/config/mainRoutes.tsx
/*
* @Author: 吴文洁
* @Date: 2020-04-29 10:26:32
* @LastEditors: zhangleyuan
* @LastEditTime: 2021-01-08 11:24:22
* @LastEditors: wufan
* @LastEditTime: 2021-01-18 21:23:08
* @Description: 内容线路由配置
*/
import Home from '@/modules/home/Home';
import EmployeesManagePage from '@/modules/store-manage/EmployeesManagePage';
import personalInfoPage from '@/modules/personalInfo';
import UserManagePage from '@/modules/store-manage/UserManagePage';
......@@ -21,6 +22,11 @@ import SwitchRoute from '@/modules/root/SwitchRoute';
const mainRoutes = [
{
path: '/home',
component: Home,
name: '中心首页'
},
{
path: '/employees-manage',
component: EmployeesManagePage,
name: '员工管理'
......@@ -70,7 +76,6 @@ const mainRoutes = [
component:ResourceDisk,
name: '资料云盘'
},
{
path: '/switch-route',
component: SwitchRoute,
......
src/routes/config/menuList.tsx
export const menuList: any = [
{
groupName: "中心首页",
groupCode: "CloudPage",
icon: '&#xe6b7;',
link: '/home'
},
{
groupName: "课程管理",
groupCode: "CloudCourse",
icon: '&#xe831;',
......
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