Skip to content

X
xiaomai-cloud-class-web
Commit a34a356e by wufan
Options

Merge branch 'master' into refactor/wufan/20210702/teach-tool-empty-picture

parents 6f9accee 63a84197
Showing with 2733 additions and 2492 deletions
package.json
......@@ -22,7 +22,7 @@
"@typescript-eslint/eslint-plugin": "^2.10.0",
"@typescript-eslint/parser": "^2.10.0",
"ali-oss": "^6.12.0",
"antd": "^4.9.4",
"antd": "^4.16.3",
"array-move": "^3.0.1",
"axios": "^0.20.0",
"babel-eslint": "10.1.0",
......@@ -34,7 +34,7 @@
"bizcharts": "^3.3.0",
"camelcase": "^5.3.1",
"case-sensitive-paths-webpack-plugin": "2.3.0",
"classnames": "^2.2.6",
"classnames": "^2.3.1",
"cropper": "^3.1.4",
"cross-env": "^7.0.3",
"css-loader": "3.4.2",
......@@ -80,6 +80,7 @@
"react": "^16.13.1",
"react-app-polyfill": "^1.0.6",
"react-async-component": "^2.0.0",
"react-cropper": "^2.1.8",
"react-dev-utils": "^10.2.1",
"react-dom": "^16.13.1",
"react-infinite-scroller": "^1.2.4",
......
src/common/js/axios.ts
......@@ -7,11 +7,12 @@
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
import axios, { AxiosInstance, AxiosRequestConfig, AxiosResponse, AxiosPromise, AxiosError } from 'axios';
import { message } from 'antd';
import { message, Modal } from 'antd';
import { BASIC_HOST, TIME_OUT, USER_TYPE, VERSION, PROJECT } from '@/domains/basic-domain/constants';
import User from './user';
import { content } from 'html2canvas/dist/types/css/property-descriptors/content';
interface FetchParams {
url: string,
......@@ -27,7 +28,8 @@ interface HeadersType{
storeId?:any,
storeUserId?:any,
userId?:any,
xmtoken?:any
xmtoken?:any,
enterpriseId?:string|null
}
class Axios {
static post(
......@@ -51,6 +53,9 @@ class Axios {
if(User.getToken()){
headerObject.xmtoken = User.getToken();
}
if (User.getEnterpriseId()) {
headerObject.enterpriseId = User.getEnterpriseId();
}
const instance: AxiosInstance = axios.create({
timeout: TIME_OUT,
responseType: 'json',
......@@ -84,8 +89,14 @@ class Axios {
})
instance.interceptors.response.use((response: AxiosResponse): AxiosResponse | AxiosPromise => {
const { message: ResMessage, success, resultMsg, resultCode,code} = response.data;
if (success || resultCode === 0) {
const { message: ResMessage, success, resultMsg, code: resultCode } = response.data;
if (resultCode === "CROP_DEPLOY_PAST_BETTER") {
Modal.warning({
title:"服务已到期",
content: "当前企业购买的小麦企学院服务已到期，如需继续使用学院功能，请尽快续费购买",
okText: "我知道了"
})
} else if (success || resultCode === 0) {
return response;
} else if (!options.reject) {
message.error(ResMessage || resultMsg);
......
src/common/js/user.ts
......@@ -12,6 +12,10 @@ import { PREFIX, USER_PREFIX } from '@/domains/basic-domain/constants';
declare var window:any;
class User {
getExpirationTime() {
return Storage.get(`${PREFIX}_expiration_time`)
}
getVersion() {
return Storage.getObj(`${PREFIX}_version`)
}
......@@ -56,8 +60,16 @@ class User {
return Storage.get(`${PREFIX}_isAdmin`);
}
setStoreId(value: any) {
return Storage.set(`${PREFIX}_storeId`, value);
setExpirationTime(value:number) {
return Storage.set(`${PREFIX}_expiration_time`,value)
}
setVersion(value:any) {
return Storage.setObj(`${PREFIX}_version`,value)
}
setStoreId(value:any){
return Storage.set(`${PREFIX}_storeId`,value)
}
setEnterpriseId(value: any) {
......
src/common/less/antd-override.less
......@@ -10,4 +10,7 @@
height: 100vh;
padding: 16px;
background-color: #F0F2F5;
}
.ant-tooltip-inner {
max-width: 1000px;
}
\ No newline at end of file
src/components/ContactWidget.less 0 → 100644
.ant-popover .ant-popover-content .ant-popover-inner {
box-shadow: 0px 2px 20px 0px rgba(0, 0, 0, 0.06);
.ant-popover-inner-content {
padding: 0;
}
}
.contact-widget {
width: 276px;
height: 294px;
overflow: hidden;
background-color: white;
background-image: url(https://image.xiaomaiketang.com/xm/CZ4a752jzi.png);
background-repeat: no-repeat;
background-size: cover;
text-align: center;
font-size: 14px;
font-weight: 400;
color: #333333;
line-height: 22px;
.qrcode {
width: 182px;
height: 204px;
background-color: white;
margin: 28px auto 16px auto;
img {
width: 150px;
height: 150px;
margin: 16px 16px 8px 16px;
}
}
}
\ No newline at end of file
src/components/ContactWidget.tsx 0 → 100644
import React, { ReactElement } from "react";
import { Popover } from "antd";
import { TooltipPlacement } from "antd/lib/tooltip";
import { ActionType } from "rc-trigger/lib/interface";
import "./ContactWidget.less"
interface ContactWidgetProps {
placement: TooltipPlacement
children: React.ReactElement
visible?: boolean
trigger: ActionType | ActionType[]
}
function Content() {
return (
<div className="contact-widget">
<div className="qrcode">
<img src="https://cdn.xiaomai5.com/qixueyuankehu.png" alt=""></img>
<div className="des">微信/企业微信扫码咨询</div>
</div>
<div className="phone"><svg style={{position:"relative",top:"2px",marginRight:"4px"}} viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path d="M512.651 3.78c-281.433 0-509.21 228.324-509.21 509.209 0 281.43 228.325 509.203 509.21 509.203 281.427 0 509.202-228.317 509.202-509.203 0.55-280.885-227.775-509.21-509.202-509.21z m198.205 743.553c-36.14 36.136-169.737 1.641-302.24-130.312-131.953-131.959-165.902-266.104-129.768-301.695 31.211-31.21 68.99-85.417 125.939-14.782 56.943 70.629 29.016 90.34-3.291 122.647-22.449 22.448 24.642 79.392 73.37 128.125 49.283 48.73 105.678 95.818 128.126 73.368 32.306-32.305 52.017-60.23 122.646-3.288 71.182 56.949 16.426 95.276-14.782 125.937z" p-id="4409" fill="#999999"></path></svg>
咨询电话：19157875632</div>
</div>
)
}
export default function ContactWidget(props:ContactWidgetProps) {
return <Popover
placement={props.placement}
arrowPointAtCenter
content={Content}
visible={props.visible}
trigger={props.trigger}
>
{props.children}
</Popover>
}
\ No newline at end of file
src/components/ImgClipModal.jsx 0 → 100644
import React from 'react';
import { Modal, Button } from 'antd';
import Cropper from 'react-cropper';
import 'cropperjs/dist/cropper.css';
import './ImgClipModal.less';
import { isNull } from 'underscore';
class ImgClipModal extends React.Component {
constructor(props) {
super(props);
this.state = {
hasImgReady: false, // 图片是否上传成功
cropperInstace:null,
}
}
render() {
const {
imgUrl,
title = "设置图片",
modalWidth=1080,
visible,
clipContentWidth='500px',
clipContentHeight='430px',
aspectRatio=16/9,
cropBoxWidth=500,
cropBoxHeight=282,
previewBoxWidth='500px',
previewBoxHeight='282px',
onConfirm,
onClose,
} = this.props;
const { hasImgReady,cropperInstace} = this.state;
return (
<Modal
className="img-clip-modal"
title={title}
width={modalWidth}
visible={visible}
maskClosable={false}
closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
onCancel={() => {
onClose();
}}
zIndex={10001}
footer={[
<Button
key="back"
onClick={() => {
onClose();
}}
>
重新上传
</Button>,
<Button
key="submit"
type="primary"
disabled={!hasImgReady}
onClick={() => {
const cutImg = this.state.cropperInstace.getCroppedCanvas().toDataURL();
const cutImageBlob = window.convertBase64ToBlob(cutImg);
onConfirm(cutImageBlob);
}}
>
确定
</Button>,
]}
>
<div className="clip-box">
<div
style={{
width:clipContentWidth,
height:clipContentHeight,
marginBottom: 0,
}}
>
<Cropper
style={{ height:clipContentHeight, width:clipContentWidth}}
className="cropper__box"
zoomTo={2}
aspectRatio={aspectRatio}
preview=".preview-url-box"
src={imgUrl}
viewMode={1}
guides={true}
background={false}
responsive={true}
autoCropArea={1}
checkOrientation={false}
cropBoxResizable={false}
center={true}
cropBoxMovable={false}
dragMode='move'
onInitialized={(instance) => {
this.setState({
cropperInstace:instance
})
}}
ready={()=>{
this.setState({
hasImgReady:true
})
this.state.cropperInstace.setCropBoxData({width:Number(cropBoxWidth),height:Number(cropBoxHeight),top:(215 - cropBoxHeight/2)});
console.log("height++++",this.state.cropperInstace.getImageData().height);
console.log("width++++",this.state.cropperInstace.getImageData().width);
const ratio = (this.state.cropperInstace.getImageData().width/2)/500;
console.log("ratio++++",ratio);
this.state.cropperInstace.setCanvasData({width:500});
const that = this;
document.querySelector('.cropper__box').addEventListener('dblclick', function (e) {
that.state.cropperInstace.rotate(90)
});
}}
/>
</div>
<div id="clipBtn" style={{ display: "none" }} ref="hiddenBtn"></div>
<div className="preview-img">
<div className="title">效果预览</div>
<div id="preview-url-box" style={{width:previewBoxWidth,height:previewBoxHeight}} className="preview-url-box">
</div>
<div className="tip-box">
<div className="tip">温馨提示</div>
<div className="tip">①预览效果图时可能存在延迟，单击左侧图片刷新即可</div>
<div className="tip">②设置图片时双击可旋转图片，滚动可放大或缩小图片</div>
</div>
</div>
</div>
</Modal>
)
}
}
export default ImgClipModal;
\ No newline at end of file
src/components/ImgClipModal.less 0 → 100644
.img-clip-modal{
.preview-url-box{
overflow: hidden;
}
}
src/core/downloads.js 0 → 100644
/*
* @Author: your name
* @Date: 2021-07-02 17:15:50
* @LastEditTime: 2021-07-04 18:10:34
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: /xiaomai-cloud-class-web/src/core/downLoad.js
*/
window.download = function download(data, strFileName, strMimeType) {
var self = window, // this script is only for browsers anyway...
defaultMime = 'application/octet-stream', // this default mime also triggers iframe downloads
mimeType = strMimeType || defaultMime,
payload = data,
url = !strFileName && !strMimeType && payload,
anchor = document.createElement('a'),
toString = function (a) {
return String(a);
},
myBlob = self.Blob || self.MozBlob || self.WebKitBlob || toString,
fileName = strFileName || 'download',
blob,
reader;
myBlob = myBlob.call ? myBlob.bind(self) : Blob;
if (String(this) === 'true') {
//reverse arguments, allowing download.bind(true, "text/xml", "export.xml") to act as a callback
payload = [payload, mimeType];
mimeType = payload[0];
payload = payload[1];
}
if (url && url.length < 2048) {
// if no filename and no mime, assume a url was passed as the only argument
fileName = url.split('/').pop().split('?')[0];
anchor.href = url; // assign href prop to temp anchor
if (anchor.href.indexOf(url) !== -1) {
// if the browser determines that it's a potentially valid url path:
var ajax = new XMLHttpRequest();
ajax.open('GET', url, true);
ajax.responseType = 'blob';
ajax.onload = function (e) {
download(e.target.response, fileName, defaultMime);
};
setTimeout(function () {
ajax.send();
}, 0); // allows setting custom ajax headers using the return:
return ajax;
} // end if valid url?
} // end if url?
//go ahead and download dataURLs right away
if (/^data\:[\w+\-]+\/[\w+\-]+[,;]/.test(payload)) {
if (payload.length > 1024 * 1024 * 1.999 && myBlob !== toString) {
payload = dataUrlToBlob(payload);
mimeType = payload.type || defaultMime;
} else {
return navigator.msSaveBlob // IE10 can't do a[download], only Blobs:
? navigator.msSaveBlob(dataUrlToBlob(payload), fileName)
: saver(payload); // everyone else can save dataURLs un-processed
}
} //end if dataURL passed?
blob = payload instanceof myBlob ? payload : new myBlob([payload], { type: mimeType });
function dataUrlToBlob(strUrl) {
var parts = strUrl.split(/[:;,]/),
type = parts[1],
decoder = parts[2] == 'base64' ? atob : decodeURIComponent,
binData = decoder(parts.pop()),
mx = binData.length,
i = 0,
uiArr = new Uint8Array(mx);
for (i; i < mx; ++i) uiArr[i] = binData.charCodeAt(i);
return new myBlob([uiArr], { type: type });
}
function saver(url, winMode) {
if ('download' in anchor) {
//html5 A[download]
anchor.href = url;
anchor.setAttribute('download', fileName);
anchor.className = 'download-js-link';
anchor.innerHTML = 'downloading...';
anchor.style.display = 'none';
document.body.appendChild(anchor);
setTimeout(function () {
anchor.click();
document.body.removeChild(anchor);
if (winMode === true) {
setTimeout(function () {
self.URL.revokeObjectURL(anchor.href);
}, 250);
}
}, 66);
return true;
}
// handle non-a[download] safari as best we can:
if (/(Version)\/(\d+)\.(\d+)(?:\.(\d+))?.*Safari\//.test(navigator.userAgent)) {
url = url.replace(/^data:([\w\/\-\+]+)/, defaultMime);
if (!window.open(url)) {
// popup blocked, offer direct download:
if (window.confirm('Displaying New Document\n\nUse Save As... to download, then click back to return to this page.')) {
window.location.href = url;
}
}
return true;
}
//do iframe dataURL download (old ch+FF):
var f = document.createElement('iframe');
document.body.appendChild(f);
if (!winMode) {
// force a mime that will download:
url = 'data:' + url.replace(/^data:([\w\/\-\+]+)/, defaultMime);
}
f.src = url;
setTimeout(function () {
document.body.removeChild(f);
}, 333);
} //end saver
if (navigator.msSaveBlob) {
// IE10+ : (has Blob, but not a[download] or URL)
return navigator.msSaveBlob(blob, fileName);
}
if (self.URL) {
// simple fast and modern way using Blob and URL:
saver(self.URL.createObjectURL(blob), true);
} else {
// handle non-Blob()+non-URL browsers:
if (typeof blob === 'string' || blob.constructor === toString) {
try {
return saver('data:' + mimeType + ';base64,' + self.btoa(blob));
} catch (y) {
return saver('data:' + mimeType + ',' + encodeURIComponent(blob));
}
}
// Blob but not URL support:
reader = new FileReader();
reader.onload = function (e) {
saver(this.result);
};
reader.readAsDataURL(blob);
}
return true;
}; /* end download() */
\ No newline at end of file
src/core/page.less
......@@ -12,6 +12,7 @@
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
min-height: 100%;
overflow: hidden;
.page {
position: fixed;
top: 60px;
......@@ -21,6 +22,7 @@
z-index: 102;
overflow: auto;
margin: 0 16px;
.box {
&:first-child {
margin-bottom: 8px;
......
src/data-source/base/request-apis.ts
......@@ -7,7 +7,9 @@
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
import Service from "@/common/js/service";
import User from "@/common/js/user";
import axios from 'axios';
export function sendLoginAuthCode(params: object) {
return Service.Hades("anon/hades/sendLoginAuthCode", params);
}
......@@ -47,6 +49,9 @@ export function getEnterpriseUser(params: object) {
export function getWXWorkLoginNoCheck(params: object) {
return Service.Hades('anon/hades/getWXWorkLoginNoCheck', params);
}
export function getLesseeVersionMsg() {
return Service.Hades("public/customerHades/getLesseeVersionMsg",{enterpriseId:User.getEnterpriseId()})
}
export function getYoZoSign(params: object) {
return Service.Apollo('public/apollo/getYoZoSign', params);
......
src/data-source/store/request-apis.ts
......@@ -7,6 +7,7 @@
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
import Service from "@/common/js/service";
import User from "@/common/js/user"
export function getEmployeeList(params: object) {
return Service.Hades("public/hades/getStoreUserPage", params);
......@@ -76,3 +77,4 @@ export function getStoreDetail(params: object) {
}
src/domains/basic-domain/baseService.ts
......@@ -7,7 +7,7 @@
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
import { getUserStore, getUserPermission ,logout,getStoreUser,sendBizAuthCode,editUserPhone,checkBizAuthCode,sendNewPhoneAuthCode,sendLoginAuthCode,login,getLastedVersion, getEnterpriseUser,getWXWorkLoginNoCheck,getYoZoSign,saveYoZoFileVersionId,yoZoUpload} from '@/data-source/base/request-apis';
import { getUserStore, getUserPermission ,logout,getStoreUser,sendBizAuthCode,editUserPhone,checkBizAuthCode,sendNewPhoneAuthCode,sendLoginAuthCode,login,getLastedVersion, getEnterpriseUser,getWXWorkLoginNoCheck,getLesseeVersionMsg,getYoZoSign,saveYoZoFileVersionId,yoZoUpload} from '@/data-source/base/request-apis';
export default class StoreService {
// 获取员工列表
......@@ -55,6 +55,10 @@ export default class StoreService {
static getWXWorkLoginNoCheck(params: any){
return getWXWorkLoginNoCheck(params);
}
//获取企业配置的版本信息
static getLesseeVersionMsg() {
return getLesseeVersionMsg();
}
static getYoZoSign(params:any){
return new Promise((resolve) => {
getYoZoSign(params).then(res => {
......
src/index.html
<!--
* @Author: 吴文洁
* @Date: 2020-08-24 12:20:57
* @LastEditors: fusanqiasng
* @LastEditTime: 2021-06-21 15:06:27
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-07-08 19:38:52
* @Description:
* @Copyright: 杭州杰竞科技有限公司 版权所有
-->
......@@ -51,6 +51,7 @@
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
......@@ -61,166 +62,6 @@
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
<script>
(function (root, factory) {
if (typeof define === 'function' && define.amd) {
// AMD. Register as an anonymous module.
define([], factory);
} else if (typeof exports === 'object') {
// Node. Does not work with strict CommonJS, but
// only CommonJS-like environments that support module.exports,
// like Node.
module.exports = factory();
} else {
// Browser globals (root is window)
root.download = factory();
}
})(this, function () {
return function download(data, strFileName, strMimeType) {
var self = window, // this script is only for browsers anyway...
defaultMime = 'application/octet-stream', // this default mime also triggers iframe downloads
mimeType = strMimeType || defaultMime,
payload = data,
url = !strFileName && !strMimeType && payload,
anchor = document.createElement('a'),
toString = function (a) {
return String(a);
},
myBlob = self.Blob || self.MozBlob || self.WebKitBlob || toString,
fileName = strFileName || 'download',
blob,
reader;
myBlob = myBlob.call ? myBlob.bind(self) : Blob;
if (String(this) === 'true') {
//reverse arguments, allowing download.bind(true, "text/xml", "export.xml") to act as a callback
payload = [payload, mimeType];
mimeType = payload[0];
payload = payload[1];
}
if (url && url.length < 2048) {
// if no filename and no mime, assume a url was passed as the only argument
fileName = url.split('/').pop().split('?')[0];
anchor.href = url; // assign href prop to temp anchor
if (anchor.href.indexOf(url) !== -1) {
// if the browser determines that it's a potentially valid url path:
var ajax = new XMLHttpRequest();
ajax.open('GET', url, true);
ajax.responseType = 'blob';
ajax.onload = function (e) {
download(e.target.response, fileName, defaultMime);
};
setTimeout(function () {
ajax.send();
}, 0); // allows setting custom ajax headers using the return:
return ajax;
} // end if valid url?
} // end if url?
//go ahead and download dataURLs right away
if (/^data\:[\w+\-]+\/[\w+\-]+[,;]/.test(payload)) {
if (payload.length > 1024 * 1024 * 1.999 && myBlob !== toString) {
payload = dataUrlToBlob(payload);
mimeType = payload.type || defaultMime;
} else {
return navigator.msSaveBlob // IE10 can't do a[download], only Blobs:
? navigator.msSaveBlob(dataUrlToBlob(payload), fileName)
: saver(payload); // everyone else can save dataURLs un-processed
}
} //end if dataURL passed?
blob = payload instanceof myBlob ? payload : new myBlob([payload], { type: mimeType });
function dataUrlToBlob(strUrl) {
var parts = strUrl.split(/[:;,]/),
type = parts[1],
decoder = parts[2] == 'base64' ? atob : decodeURIComponent,
binData = decoder(parts.pop()),
mx = binData.length,
i = 0,
uiArr = new Uint8Array(mx);
for (i; i < mx; ++i) uiArr[i] = binData.charCodeAt(i);
return new myBlob([uiArr], { type: type });
}
function saver(url, winMode) {
if ('download' in anchor) {
//html5 A[download]
anchor.href = url;
anchor.setAttribute('download', fileName);
anchor.className = 'download-js-link';
anchor.innerHTML = 'downloading...';
anchor.style.display = 'none';
document.body.appendChild(anchor);
setTimeout(function () {
anchor.click();
document.body.removeChild(anchor);
if (winMode === true) {
setTimeout(function () {
self.URL.revokeObjectURL(anchor.href);
}, 250);
}
}, 66);
return true;
}
// handle non-a[download] safari as best we can:
if (/(Version)\/(\d+)\.(\d+)(?:\.(\d+))?.*Safari\//.test(navigator.userAgent)) {
url = url.replace(/^data:([\w\/\-\+]+)/, defaultMime);
if (!window.open(url)) {
// popup blocked, offer direct download:
if (confirm('Displaying New Document\n\nUse Save As... to download, then click back to return to this page.')) {
location.href = url;
}
}
return true;
}
//do iframe dataURL download (old ch+FF):
var f = document.createElement('iframe');
document.body.appendChild(f);
if (!winMode) {
// force a mime that will download:
url = 'data:' + url.replace(/^data:([\w\/\-\+]+)/, defaultMime);
}
f.src = url;
setTimeout(function () {
document.body.removeChild(f);
}, 333);
} //end saver
if (navigator.msSaveBlob) {
// IE10+ : (has Blob, but not a[download] or URL)
return navigator.msSaveBlob(blob, fileName);
}
if (self.URL) {
// simple fast and modern way using Blob and URL:
saver(self.URL.createObjectURL(blob), true);
} else {
// handle non-Blob()+non-URL browsers:
if (typeof blob === 'string' || blob.constructor === toString) {
try {
return saver('data:' + mimeType + ';base64,' + self.btoa(blob));
} catch (y) {
return saver('data:' + mimeType + ',' + encodeURIComponent(blob));
}
}
// Blob but not URL support:
reader = new FileReader();
reader.onload = function (e) {
saver(this.result);
};
reader.readAsDataURL(blob);
}
return true;
}; /* end download() */
});
</script>
</body>
</html>
src/index.tsx
......@@ -2,7 +2,7 @@
* @Author: 吴文洁
* @Date: 2020-04-27 20:35:34
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-06-28 16:15:59
* @LastEditTime: 2021-07-08 19:22:18
* @Description:
*/
......@@ -17,6 +17,7 @@ import { RootRouter } from './routes/index';
import 'antd/dist/antd.less';
import 'video-react/dist/video-react.css';
import '@/common/less/index.less';
import '@/core/downloads';
import '@/core/function';
import '@/core/xmTD';
import User from '@/common/js/user';
......
src/modules/college-manage/CollegeInfoPage.jsx
......@@ -6,6 +6,7 @@ import Upload from '@/core/upload';
import StoreService from "@/domains/store-domain/storeService";
import User from "@/common/js/user";
import Bus from '@/core/tbus';
import ImgClipModal from '@/components/ImgClipModal'
import "./CollegeInfoPage.less";
let cutFlag = false;
class CollegeInfoPage extends React.Component {
......@@ -17,6 +18,7 @@ class CollegeInfoPage extends React.Component {
logo:'',
showSelectFileModal:false,
cutImageBlob: null,
imageFile: null, // 需要被截取的图片
}
}
componentWillMount() {
......@@ -51,85 +53,13 @@ class CollegeInfoPage extends React.Component {
})
}
handleSelectCover = (file)=> {
this.uploadImage(file);
this.setState({
visible: true,
imageFile:file
});
}
//上传图片
uploadImage = (imageFile) => {
const { folderName } = imageFile;
const fileName = window.random_string(16) + folderName.slice(folderName.lastIndexOf("."));
const self = this;
this.setState(
{
visible: true,
},
() => {
setTimeout(() => {
const okBtnDom = document.querySelector("#headPicModal");
const options = {
size: [500, 128],
ok: okBtnDom,
maxZoom: 3,
style: {
jpgFillColor: "transparent",
},
done: function (dataUrl) {
clearTimeout(self.timer);
self.timer = setTimeout(() => {
if ((self.state.rotate != this.rotate()) || (self.state.scale != this.scale())) {
console.log(this.scale(), 'scale')
const _dataUrl = this.clip()
const cutImageBlob = self.convertBase64UrlToBlob(_dataUrl);
self.setState({
cutImageBlob,
dataUrl: _dataUrl,
rotate: this.rotate(),
scale: this.scale()
})
}
}, 500)
const cutImageBlob = self.convertBase64UrlToBlob(dataUrl);
self.setState({
cutImageBlob,
dataUrl
})
setTimeout(() => {
cutFlag = false;
}, 2000);
},
fail: (failInfo) => {
message.error("图片上传失败了，请重新上传");
},
loadComplete: function (img) {
setTimeout(() => {
const _dataUrl = this.clip()
self.setState({
dataUrl: _dataUrl,
hasImgReady: true
})
}, 100)
},
};
const imgUrl = `${imageFile.ossUrl}?${new Date().getTime()}`
if (!this.state.photoclip) {
const _photoclip = new PhotoClip("#headPicModal", options);
_photoclip.load(imgUrl);
this.setState({
photoclip: _photoclip,
});
} else {
this.state.photoclip.clear();
this.state.photoclip.load(imgUrl);
}
}, 200);
}
);
};
//获取resourceId
getSignature = (blob, fileName) => {
Upload.uploadBlobToOSS(blob, 'cover' + (new Date()).valueOf(),null,'signInfo').then((signInfo) => {
......@@ -150,16 +80,7 @@ class CollegeInfoPage extends React.Component {
logo:coverClicpPath
})
}
// base64转换成blob
convertBase64UrlToBlob = (urlData) => {
const bytes = window.atob(urlData.split(",")[1]);
const ab = new ArrayBuffer(bytes.length);
const ia = new Uint8Array(ab);
for (let i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
}
return new Blob([ab], { type: "image/png" });
};
updateInfo=()=>{
const { storeName, logo } = this.state;
if(!storeName){
......@@ -175,6 +96,7 @@ class CollegeInfoPage extends React.Component {
User.setStoreName(storeName);
Bus.trigger('storeNameChange',storeName);
message.success('保存成功');
Bus.trigger("updateCollegeInfo")
});
}
render() {
......@@ -185,6 +107,7 @@ class CollegeInfoPage extends React.Component {
hasImgReady,
logo,
cutImageBlob,
imageFile
} = this.state;
return (
<div className="page college-info-page">
......@@ -242,65 +165,9 @@ class CollegeInfoPage extends React.Component {
onSelect={this.handleSelectCover}
/>
}
<Modal
title="设置图片"
width={1080}
visible={visible}
maskClosable={false}
closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
onCancel={() => {
this.setState({ visible: false });
}}
zIndex={10001}
footer={[
<Button
key="back"
onClick={() => {
this.setState({ visible: false });
}}
>
重新上传
</Button>,
<Button
key="submit"
type="primary"
disabled={!hasImgReady}
onClick={() => {
if (!cutFlag) {
cutFlag = true;
this.refs.hiddenBtn.click();
}
this.getSignature(cutImageBlob);
}}
>
确定
</Button>,
]}
>
<div className="clip-box">
<div
id="headPicModal"
ref="headPicModal"
style={{
width: "500px",
height: "430px",
marginBottom: 0,
}}
></div>
<div id="clipBtn" style={{ display: "none" }} ref="hiddenBtn"></div>
<div className="preview-img">
<div className="title">效果预览</div>
<div id="preview-url-box" style={{width:500,height:128}}>
<img src={this.state.dataUrl} style={{ width: '100%' }} alt="" />
</div>
<div className="tip-box">
<div className="tip">温馨提示</div>
<div className="tip">①预览效果图时可能存在延迟，单击左侧图片刷新即可</div>
<div className="tip">②设置图片时双击可旋转图片，滚动可放大或缩小图片</div>
</div>
</div>
</div>
</Modal>
{ visible &&
<ImgClipModal visible={visible} imgUrl={imageFile.ossUrl} aspectRatio='125/32' cropBoxHeight='128' onConfirm={this.getSignature} onClose={()=>{this.setState({ visible: false });}}/>
}
<div><Button type="primary" onClick={this.updateInfo} htmlType="submit" className="submit-btn">更新信息</Button></div>
</div>
......
src/modules/college-manage/EmployeeManage.tsx
......@@ -15,6 +15,7 @@ import college from '@/common/lottie/college.json';
import StoreService from "@/domains/store-domain/storeService";
import EmployeeAddOrEditModal from "../store-manage/EmployeeAddOrEditModal";
import User from "@/common/js/user";
import LimitTip from "./LimitTip";
import "./EmployeeManage.less";
import ChooseMembersModal from "./modal/ChooseMembersModal";
......@@ -68,6 +69,7 @@ function EmployeeManage() {
});
const [total, setTotal] = useState(0);
const [realTotal, setRealTotal] = useState(0)
const [model, setModel] = useState<React.ReactNode>(null);
const [employeeModal, setEmployeeModal] = useState(false);
const [choosedItem, setChooseItem] = useState<ChoosedItemType>({
......@@ -85,6 +87,17 @@ function EmployeeManage() {
if (!User.getEnterpriseId()) {
window.RCHistory.replace('/employees-manage');
}
//获取员工数
const _query = {
current: 0,
size: 10,
nickName: "",
phone: "",
roleCodes: [],
}
StoreService.getEmployeeList(_query).then((res: any) => {
setRealTotal(res.result.total);
});
}, [])
useEffect(() => {
......@@ -362,6 +375,7 @@ function EmployeeManage() {
</Button>
}
</div>
<LimitTip type="员工" total={realTotal} tip={()=>{return (<div>数据为当前学院的员工数，若员工存在多个学院，企业人数只统计为1人</div>)}}/>
<div className="box-body">
<XMTable
renderEmpty={{
......
src/modules/college-manage/LimitTip.less 0 → 100644
.limit-tip {
background: #E9EFFF;
border-radius: 2px;
margin-bottom: 13px;
.always {
display: inline-block;
font-size: 14px;
line-height: 32px;
font-weight: 400;
color: #666666;
margin-left: 16px;
.renew-text {
display: inline-block;
color: #2966FF;
cursor: pointer;
}
}
}
\ No newline at end of file
src/modules/college-manage/LimitTip.tsx 0 → 100644
import React, { useContext, useEffect, useState } from "react";
import { Tooltip } from "antd"
import { VersionContext } from "@/store/context";
import ContactWidget from "@/components/ContactWidget";
import "./LimitTip.less"
export default function LimitTip(props:{total:number,type:string,tip:() => React.ReactNode}) {
const [isOver, setIsOver] = useState(false)
const [limitUser, setLimitUser] = useState("0")
const versionInfo = useContext(VersionContext)
useEffect(()=> {
if (versionInfo) {
setIsOver(versionInfo.userNum === -1 ? false : versionInfo.whetherReachUserNum)
setLimitUser(versionInfo.userNum === -1 ? "不限人数" : String(versionInfo.userNum))
}
},[versionInfo])
return (
<div className="limit-tip">
<div className="always">本学院{props.type}共<span style={{color:"#333333",fontWeight:"bold"}}>{props.total}</span>人
<Tooltip overlayStyle={{maxWidth:"587px",width:"fit-content"}} placement="topLeft" arrowPointAtCenter title={props.tip}>
<span className="icon iconfont" style={{cursor:"pointer",marginLeft:"4px",color:"#bfbfbf"}}>&#59449;</span>
</Tooltip>
{
isOver ? (
<>
<div style={{marginLeft:"14px",display:"inline-block"}}>当前企业使用人数已达到上限 (<span style={{color:"#333333",fontWeight:"bold"}}>{limitUser}</span>人)，将无法添加新员工、新学员，如需增加人数限制，请联系小麦企学院服务平台。</div>
<ContactWidget trigger="hover" placement="bottom">
<div className="renew-text">立即续费<span className="icon iconfont" style={{fontSize:"10px"}}>&#59291;</span></div>
</ContactWidget>
</>
) : ("")
}
</div>
</div>
)
}
\ No newline at end of file
src/modules/college-manage/UserManagePage.less
......@@ -17,4 +17,5 @@
margin-left: 4px;
}
}
}
\ No newline at end of file
src/modules/college-manage/UserManagePage.tsx
......@@ -15,6 +15,8 @@ import { Input, DatePicker, Select, Button, message } from "antd";
import StoreService from "@/domains/store-domain/storeService";
import User from "@/common/js/user";
import ChooseMembersModal from "./modal/ChooseMembersModal";
import LimitTip from "./LimitTip"
import { XMTable } from '@/components';
import college from '@/common/lottie/college.json';
import "./UserManagePage.less";
......@@ -26,6 +28,8 @@ const { RangePicker } = DatePicker;
declare var window: any;
function UserManagePage() {
const [userList, setUserList] = useState([]);
const [model, setModel] = useState<React.ReactNode>(null);
......@@ -39,11 +43,25 @@ function UserManagePage() {
sourceEnum: undefined,
});
const [total, setTotal] = useState(0);
const [realTotal, setRealTotal] = useState(0)
useEffect(() => {
if (!User.getEnterpriseId()) {
window.RCHistory.replace('/user-manage');
}
//获取学员数
const _query = {
current: 0,
size: 10,
nickName: "",
phone: "",
registerBegin: null,
registerEnd: null,
sourceEnum: undefined,
}
StoreService.getUserList(_query).then((res: any) => {
setRealTotal(res.result.total);
});
}, [])
useEffect(() => {
......@@ -125,9 +143,6 @@ function UserManagePage() {
<div className="header-item">
<span className="item-name">搜索学员：</span>
<Search
style={{
width: 300,
}}
placeholder="搜索学员姓名/手机号"
onSearch={(value) => {
const _query = { ...query };
......@@ -199,6 +214,7 @@ function UserManagePage() {
}}
>添加学员</Button>
}
<LimitTip type="学员" total={realTotal} tip={()=>{ return (<div><div>1、数据为当前学院的员工数，若学员存在多个学院，企业人数只统计为1人；</div><div>2、若一个学员既用「企业微信」登录学习又用「微信」登录学习，企业人数将统计为2人。</div></div>)}}/>
<div className="box-body">
<XMTable
renderEmpty={{
......
src/modules/college-manage/modal/ChooseMembersModal.jsx
......@@ -285,6 +285,10 @@ class ChooseMembersModal extends React.Component {
visible={isOpen}
onCancel={() => this.handleClose()}
onOk={() => {
if (User.getVersion() && User.getVersion().whetherReachUserNum) {
message.error("添加失败，企业使用人数超出限制")
return
}
if (_.isEmpty(selectUserList)) {
message.warning(type === 'USER' ? '请选择员工' : '请选择学员')
return null;
......
src/modules/course-manage/AddLive.jsx
......@@ -269,6 +269,15 @@ handleChangeBasicInfo = (field, value) => {
// 完成创建/编辑
handleSubmit = () => {
//过期判断
if (User.getExpirationTime() && moment().valueOf() > Number(User.getExpirationTime())) {
Modal.warning({
title:"服务已到期",
content: "当前企业购买的小麦企学院服务已到期，如需继续使用学院功能，请尽快续费购买",
okText: "我知道了"
})
return
}
const { addLiveBasicInfo, addLiveClassInfo, addLiveIntroInfo, id, isEdit, type } = this.state;
const {liveDate, timeHorizonStart} = addLiveClassInfo;
const _liveDate = moment(liveDate).format("YYYY-MM-DD");
......
src/modules/course-manage/LiveCoursePage.jsx
......@@ -22,6 +22,13 @@ class LiveCoursePage extends React.Component {
componentWillMount() {
this.handleFetchLiveList(this.state.query);
}
changeShelfState = (index, shelfState) => {
const { courseList } = this.state;
courseList[index].shelfState = shelfState;
this.setState({
courseList,
});
};
// 获取直播课列表
handleFetchLiveList = (_query) => {
const { query } = this.state;
......@@ -54,6 +61,7 @@ class LiveCoursePage extends React.Component {
total={total}
courseList={courseList}
onChange={this.handleFetchLiveList}
changeShelfState={this.changeShelfState}
/>
</div>
</div>
......
src/modules/course-manage/components/AddLiveBasic.jsx
......@@ -13,8 +13,9 @@ import { ImgCutModalNew } from '@/components';
import StoreService from "@/domains/store-domain/storeService";
import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepareFileModal';
import Upload from '@/core/upload';
// import PhotoClip from 'photoclip'
import Cropper from 'react-cropper';
import ImgClipModal from '@/components/ImgClipModal'
import 'cropperjs/dist/cropper.css';
import './AddLiveBasic.less';
const defaultCover = 'https://image.xiaomaiketang.com/xm/Yip2YtFDwH.png';
......@@ -31,7 +32,8 @@ class AddLiveBasic extends React.Component {
courseCatalogList:[],
showSelectFileModal: false,
cutImageBlob: null,
hasImgReady: false // 图片是否上传成功
hasImgReady: false, // 图片是否上传成功
cropperInstace:null
}
}
componentWillUnmount() {
......@@ -49,16 +51,6 @@ class AddLiveBasic extends React.Component {
});
}
// 上传封面图
handleShowImgCutModal = (event) => {
const imageFile = event.target.files[0];
if (!imageFile) return;
this.setState({
imageFile,
showCutModal: true,
});
}
// 使用默认封面图
handleResetCoverUrl = () => {
const { data: { coverUrl } } = this.props;
......@@ -87,85 +79,13 @@ class AddLiveBasic extends React.Component {
}
}
handleSelectCover = (file) => {
this.uploadImage(file);
this.setState({
visible: true,
imageFile:file
});
}
//上传图片
uploadImage = (imageFile) => {
const { folderName } = imageFile;
const fileName =
window.random_string(16) + folderName.slice(folderName.lastIndexOf("."));
const self = this;
this.setState(
{
visible: true,
},
() => {
setTimeout(() => {
const okBtnDom = document.querySelector("#headPicModal");
const options = {
size: [500, 282],
ok: okBtnDom,
maxZoom: 3,
style: {
jpgFillColor: "transparent",
},
done: function (dataUrl) {
clearTimeout(self.timer);
self.timer = setTimeout(() => {
if ((self.state.rotate != this.rotate()) || (self.state.scale != this.scale())) {
console.log(this.scale(), 'scale')
const _dataUrl = this.clip()
const cutImageBlob = self.convertBase64UrlToBlob(_dataUrl);
self.setState({
cutImageBlob,
dataUrl: _dataUrl,
rotate: this.rotate(),
scale: this.scale()
})
}
}, 500)
const cutImageBlob = self.convertBase64UrlToBlob(dataUrl);
self.setState({
cutImageBlob,
dataUrl
})
setTimeout(() => {
cutFlag = false;
}, 2000);
},
fail: (failInfo) => {
message.error("图片上传失败了，请重新上传");
},
loadComplete: function (img) {
setTimeout(() => {
const _dataUrl = this.clip()
self.setState({
dataUrl: _dataUrl,
hasImgReady: true
})
}, 100)
},
};
const imgUrl = `${imageFile.ossUrl}?${new Date().getTime()}`
if (!this.state.photoclip) {
const _photoclip = new PhotoClip("#headPicModal", options);
_photoclip.load(imgUrl);
this.setState({
photoclip: _photoclip,
});
} else {
this.state.photoclip.clear();
this.state.photoclip.load(imgUrl);
}
}, 200);
}
);
};
//获取resourceId
getSignature = (blob, fileName) => {
......@@ -179,16 +99,6 @@ class AddLiveBasic extends React.Component {
});
};
// base64转换成blob
convertBase64UrlToBlob = (urlData) => {
const bytes = window.atob(urlData.split(",")[1]);
const ab = new ArrayBuffer(bytes.length);
const ia = new Uint8Array(ab);
for (let i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
}
return new Blob([ab], { type: "image/png" });
};
updateCover = () =>{
const {coverClicpPath,coverId} = this.state
this.setState({
......@@ -254,24 +164,6 @@ class AddLiveBasic extends React.Component {
<Cascader disabled={!isEdit ? true: false} defaultValue={[categoryName]} options={courseCatalogList} displayRender={ label => label.join('-')} fieldNames={fieldNames} onChange={this.catalogChange} style={{ width: 240 }} placeholder="请选择课程分类" suffixIcon={<span className="icon iconfont" style={{fontSize:'12px',color:'#BFBFBF'}}>&#xe835;</span>} />
}
</div>
<ImgCutModalNew
title="裁剪"
width={530}
cutWidth={500}
cutHeight={282}
cutContentWidth={500}
cutContentHeight={300}
visible={showCutModal}
imageFile={imageFile}
bizCode='LIVE_COURSE_MEDIA'
onOk={(urlStr, resourceId) => {
this.setState({ showCutModal: false });
this.props.onChange('coverId', resourceId, urlStr);
this.state.currentInputFile.value = '';
}}
onClose={() => this.setState({ showCutModal: false })}
reUpload={() => { this.state.currentInputFile.click() }}
/>
{showSelectFileModal &&
<SelectPrepareFileModal
key="basic"
......@@ -287,66 +179,9 @@ class AddLiveBasic extends React.Component {
onSelect={this.handleSelectCover}
/>
}
<Modal
title="设置图片"
width={1080}
visible={visible}
maskClosable={false}
closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
onCancel={() => {
this.setState({ visible: false });
}}
zIndex={10001}
footer={[
<Button
key="back"
onClick={() => {
this.setState({ visible: false });
}}
>
重新上传
</Button>,
<Button
key="submit"
type="primary"
disabled={!hasImgReady}
onClick={() => {
if (!cutFlag) {
cutFlag = true;
this.refs.hiddenBtn.click();
}
this.getSignature(cutImageBlob);
}}
>
确定
</Button>,
]}
>
<div className="clip-box">
<div
id="headPicModal"
ref="headPicModal"
style={{
width: "500px",
height: "430px",
marginBottom: 0,
}}
></div>
<div id="clipBtn" style={{ display: "none" }} ref="hiddenBtn"></div>
<div className="preview-img">
<div className="title">效果预览</div>
{/* <img src={previewUrl} alt="图片预览" className="preview-url" /> */}
<div id="preview-url-box" style={{width:500,height:282}}>
<img src={this.state.dataUrl} style={{ width: '100%' }} alt="" />
</div>
<div className="tip-box">
<div className="tip">温馨提示</div>
<div className="tip">①预览效果图时可能存在延迟，单击左侧图片刷新即可</div>
<div className="tip">②设置图片时双击可旋转图片，滚动可放大或缩小图片</div>
</div>
</div>
</div>
</Modal>
{ visible &&
<ImgClipModal visible={visible} imgUrl={imageFile.ossUrl} onConfirm={this.getSignature} onClose={()=>{this.setState({ visible: false });}}/>
}
</div>
)
}
......
src/modules/course-manage/components/AddLiveBasic.less
......@@ -81,4 +81,7 @@
#imgCutModalNew {
width: 500px;
height: 300px;
}
.preview-url-box{
overflow: hidden;
}
\ No newline at end of file
src/modules/course-manage/components/LiveCourseList.jsx
......@@ -11,7 +11,7 @@ import college from '@/common/lottie/college';
import { PageControl, XMTable } from '@/components';
import DownloadLiveModal from '@/components/DownloadLiveModal';
import BaseService from '@/domains/basic-domain/baseService';
import { appId, LIVE_SHARE } from '@/domains/course-domain/constants';
import { LIVE_SHARE } from '@/domains/course-domain/constants';
import CourseService from '@/domains/course-domain/CourseService';
import { QuestionCircleOutlined } from '@ant-design/icons';
import { Dropdown, message, Modal, Switch, Tooltip } from 'antd';
......@@ -66,7 +66,6 @@ class LiveCourseList extends React.Component {
}
// 显示分享弹窗
handleShowShareModal = (item, needStr = false) => {
const _appId = appId;
const { liveCourseId } = item;
const htmlUrl = `${LIVE_SHARE}live_detail/${liveCourseId}?id=${User.getStoreId()}`;
......@@ -93,15 +92,8 @@ class LiveCourseList extends React.Component {
};
//改变上架状态
changeShelfState = (item) => {
let _shelfState = item.shelfState;
if (_shelfState === 'NO') {
_shelfState = 'YES';
item.shelfState = 'YES';
} else {
_shelfState = 'NO';
item.shelfState = 'NO';
}
changeShelfState = (index, item, checked) => {
let _shelfState = checked ? 'YES' : 'NO';
const params = {
liveCourseId: item.liveCourseId,
shelfState: _shelfState,
......@@ -113,6 +105,7 @@ class LiveCourseList extends React.Component {
} else {
message.success('已取消展示');
}
this.props.changeShelfState(index, _shelfState);
}
});
};
......@@ -126,25 +119,15 @@ class LiveCourseList extends React.Component {
});
};
parseColumns = () => {
const menu = (item) => (
<div className='live-course-more-menu'>
<div>上课记录</div>
<div
onClick={() => {
this.handleShowRepeatModal(item);
}}>
回放记录
</div>
</div>
);
let columns;
const userRole = User.getUserRole();
if (userRole !== 'CloudLecturer') {
columns = [
{
title: '直播课',
width: '23%',
key: 'course',
fixed: 'left',
dataIndex: 'courseName',
render: (val, record) => {
let hasCover = false;
......@@ -153,21 +136,28 @@ class LiveCourseList extends React.Component {
{record.courseMediaVOS.map((item, index) => {
if (item.contentType === 'COVER') {
hasCover = true;
return <img className='course-cover' src={item.mediaUrl} />;
return <img key={item.mediaContent + index} className='course-cover' src={item.mediaUrl} alt='' />;
} else {
return null;
}
})}
{!hasCover && <img className='course-cover' src={'https://image.xiaomaiketang.com/xm/Yip2YtFDwH.png'} />}
{!hasCover && <img className='course-cover' src={'https://image.xiaomaiketang.com/xm/Yip2YtFDwH.png'} alt='' />}
<div>
{record.courseName.length > 17 ? (
<Tooltip title={record.courseName}>
<Choose>
<When condition={record.courseName.length > 14}>
<Tooltip title={record.courseName}>
<div className='course-name'>{record.courseName}</div>
</Tooltip>
</When>
<Otherwise>
{' '}
<div className='course-name'>{record.courseName}</div>
</Tooltip>
) : (
<div className='course-name'>{record.courseName}</div>
)}
</Otherwise>
</Choose>
<div>
<span className='course-time'>
{formatDate('YYYY-MM-DD H:i', parseInt(record.startTime))}~{formatDate('H:i', parseInt(record.endTime))}
{window.formatDate('YYYY-MM-DD H:i', parseInt(record.startTime))}~{window.formatDate('H:i', parseInt(record.endTime))}
</span>
<span
className='course-status'
......@@ -176,31 +166,35 @@ class LiveCourseList extends React.Component {
</span>
</div>
<div className='teacher-assistant'>
{record.teacherName && record.teacherName.length > 4 ? (
<Tooltip title={record.teacherName}>
<Choose>
<When condition={record.teacherName && record.teacherName.length > 4}>
<Tooltip title={record.teacherName}>
<span className='teacher'>讲师：{record.teacherName}</span>
</Tooltip>
</When>
<Otherwise>
<span className='teacher'>讲师：{record.teacherName}</span>
</Tooltip>
) : (
<span className='teacher'>讲师：{record.teacherName}</span>
)}
</Otherwise>
</Choose>
{record.admins.length > 0 && (
<>
<span className='split'> | </span>
{this.handleAdminName(record.admins).length > 4 ? (
<If condition={record.admins.length > 0}>
<span className='split'> | </span>
<Choose>
<When condition={this.handleAdminName(record.admins).length > 4}>
<Tooltip title={this.handleAdminName(record.admins)}>
<span className='assistant'>
助教：
{record.admins.map((item, index) => {
return (
<span>
<span key={item.adminId + index}>
{item.adminName} {index < record.admins.length - 1 && <span> 、</span>}{' '}
</span>
);
})}
</span>
</Tooltip>
) : (
</When>
<Otherwise>
<span className='assistant'>
助教：
{record.admins.map((item, index) => {
......@@ -211,9 +205,9 @@ class LiveCourseList extends React.Component {
);
})}
</span>
)}
</>
)}
</Otherwise>
</Choose>
</If>
</div>
</div>
</div>
......@@ -288,7 +282,13 @@ class LiveCourseList extends React.Component {
key: 'shelfState',
dataIndex: 'shelfState',
render: (val, item, index) => {
return <Switch defaultChecked={item.shelfState === 'YES' ? true : false} onChange={() => this.changeShelfState(item)} />;
return (
<Switch
checked={item.shelfState === 'YES'}
defaultChecked={item.shelfState === 'YES' ? true : false}
onChange={(checked) => this.changeShelfState(index, item, checked)}
/>
);
},
},
{
......@@ -299,7 +299,7 @@ class LiveCourseList extends React.Component {
sorter: true,
render: (val, item) => {
// -29000：与后端约定 在初始化学院时，创建时间（标志位-29000）默认展示为'-'
return <span>{val === -29000 ? '-' : formatDate('YYYY-MM-DD H:i', val)}</span>;
return <span style={{ whiteSpace: 'nowrap' }}>{val === -29000 ? '-' : window.formatDate('YYYY-MM-DD H:i', val)}</span>;
},
},
{
......@@ -310,27 +310,31 @@ class LiveCourseList extends React.Component {
render: (val, record) => {
return (
<div className='related-task'>
{record.relatedPlanList ? (
<Tooltip title={this.handlePlanName(record.relatedPlanList)} placement='top' arrowPointAtCenter>
{record.relatedPlanList.map((item, index) => {
return (
<span>
{item.planName} {index < record.relatedPlanList.length - 1 && <span> 、</span>}{' '}
</span>
);
})}
</Tooltip>
) : (
<span></span>
)}
<Choose>
<When condition={record.relatedPlanLis}>
<Tooltip title={this.handlePlanName(record.relatedPlanList)} placement='top' arrowPointAtCenter>
{record.relatedPlanList.map((item, index) => {
return (
<span>
{item.planName} {index < record.relatedPlanList.length - 1 && <span> 、</span>}{' '}
</span>
);
})}
</Tooltip>
</When>
<Otherwise>
<span></span>
</Otherwise>
</Choose>
</div>
);
},
},
{
title: '操作',
width: '15%',
width: 210,
key: 'operate',
fixed: 'right',
dataIndex: 'operate',
render: (val, item) => {
return (
......@@ -422,21 +426,25 @@ class LiveCourseList extends React.Component {
{record.courseMediaVOS.map((item, index) => {
if (item.contentType === 'COVER') {
hasCover = true;
return <img className='course-cover' src={item.mediaUrl} />;
return <img className='course-cover' src={item.mediaUrl} alt='' />;
}
})}
{!hasCover && <img className='course-cover' src={'https://image.xiaomaiketang.com/xm/Yip2YtFDwH.png'} />}
{!hasCover && <img className='course-cover' src={'https://image.xiaomaiketang.com/xm/Yip2YtFDwH.png'} alt='' />}
<div>
{record.courseName.length > 17 ? (
<Tooltip title={record.courseName}>
<Choose>
<When condition={record.courseName.length > 17}>
<Tooltip title={record.courseName}>
<div className='course-name'>{record.courseName}</div>
</Tooltip>
</When>
<Otherwise>
<div className='course-name'>{record.courseName}</div>
</Tooltip>
) : (
<div className='course-name'>{record.courseName}</div>
)}
</Otherwise>
</Choose>
<div>
<span className='course-time'>
{formatDate('YYYY-MM-DD H:i', parseInt(record.startTime))}~{formatDate('H:i', parseInt(record.endTime))}
{window.formatDate('YYYY-MM-DD H:i', parseInt(record.startTime))}~{window.formatDate('H:i', parseInt(record.endTime))}
</span>
<span
className='course-status'
......@@ -445,18 +453,21 @@ class LiveCourseList extends React.Component {
</span>
</div>
<div className='teacher-assistant'>
{record.teacherName && record.teacherName.length > 4 ? (
<Tooltip title={record.teacherName}>
<Choose>
<When condition={record.teacherName && record.teacherName.length > 4}>
<Tooltip title={record.teacherName}>
<span className='teacher'>讲师：{record.teacherName}</span>
</Tooltip>
</When>
<Otherwise>
<span className='teacher'>讲师：{record.teacherName}</span>
</Tooltip>
) : (
<span className='teacher'>讲师：{record.teacherName}</span>
)}
</Otherwise>
</Choose>
{record.admins.length > 0 && (
<>
<span className='split'> | </span>
{this.handleAdminName(record.admins).length > 4 ? (
<If condition={record.admins.length > 0}>
<span className='split'> | </span>
<Choose>
<When condition={this.handleAdminName(record.admins).length > 4}>
<Tooltip title={this.handleAdminName(record.admins)}>
<span className='assistant'>
助教：
......@@ -469,7 +480,8 @@ class LiveCourseList extends React.Component {
})}
</span>
</Tooltip>
) : (
</When>
<Otherwise>
<span className='assistant'>
助教：
{record.admins.map((item, index) => {
......@@ -480,9 +492,9 @@ class LiveCourseList extends React.Component {
);
})}
</span>
)}
</>
)}
</Otherwise>
</Choose>
</If>
</div>
</div>
</div>
......@@ -542,7 +554,7 @@ class LiveCourseList extends React.Component {
dataIndex: 'created',
sorter: true,
render: (val, item) => {
return <span>{formatDate('YYYY-MM-DD H:i', val)}</span>;
return <span>{window.formatDate('YYYY-MM-DD H:i', val)}</span>;
},
},
{
......@@ -553,19 +565,22 @@ class LiveCourseList extends React.Component {
render: (val, record) => {
return (
<div className='related-task'>
{record.relatedPlanList ? (
<Tooltip title={this.handlePlanName(record.relatedPlanList)} placement='top' arrowPointAtCenter>
{record.relatedPlanList.map((item, index) => {
return (
<span>
{item.planName} {index < record.relatedPlanList.length - 1 && <span> 、</span>}{' '}
</span>
);
})}
</Tooltip>
) : (
<span></span>
)}
<Choose>
<When condition={record.relatedPlanList}>
<Tooltip title={this.handlePlanName(record.relatedPlanList)} placement='top' arrowPointAtCenter>
{record.relatedPlanList.map((item, index) => {
return (
<span>
{item.planName} {index < record.relatedPlanList.length - 1 && <span> 、</span>}{' '}
</span>
);
})}
</Tooltip>
</When>
<Otherwise>
<span></span>
</Otherwise>
</Choose>
</div>
);
},
......@@ -576,7 +591,7 @@ class LiveCourseList extends React.Component {
};
handleAdminName = (adminArray) => {
let adminStr = '';
adminArray.map((item, index) => {
adminArray.forEach((item, index) => {
if (index < adminArray.length - 1) {
adminStr = adminStr + item.adminName + '、';
} else {
......@@ -588,7 +603,7 @@ class LiveCourseList extends React.Component {
handlePlanName = (planArray) => {
let planStr = '';
planArray.map((item, index) => {
planArray.forEach((item, index) => {
if (index < planArray.length - 1) {
planStr = planStr + item.planName + '、';
} else {
......@@ -685,7 +700,7 @@ class LiveCourseList extends React.Component {
}
};
onShowSizeChange = (current, size) => {
if (current == size) {
if (current === size) {
return;
}
let _query = this.props.query;
......@@ -793,6 +808,7 @@ class LiveCourseList extends React.Component {
size='middle'
pagination={false}
columns={columns}
scroll={{ x: 1300 }}
loading={loading}
dataSource={courseList}
onChange={this.handleChangeTable}
......@@ -816,7 +832,6 @@ class LiveCourseList extends React.Component {
{openCoursewareModal && (
<ManageCoursewareModal
data={editData}
type={type}
onCancel={() => {
this.props.onChange();
this.setState({ openCoursewareModal: false });
......@@ -844,7 +859,7 @@ class LiveCourseList extends React.Component {
onConfirm={this.onConfirmSelectPlanList}
/>
)}
<iframe src={url} style={{ display: 'none' }} />
<iframe src={url} style={{ display: 'none' }} title='navigation' />
<Route path={`${match.url}/live-course-data`} component={DataList} />
</div>
);
......
src/modules/course-manage/components/LiveCourseList.less
.live-course-list {
margin-top: 12px;
.record__item {
overflow: hidden;
display: flex;
align-items: center;
.course-cover {
......@@ -11,63 +11,61 @@
border-radius: 2px;
margin-right: 8px;
}
.course-name{
.course-name {
font-size: 14px;
font-weight: 500;
color: #333333;
line-height: 20px;
font-weight: bold;
max-width:244px;
max-width: 200px;
overflow: hidden;
text-overflow:ellipsis;
text-overflow: ellipsis;
white-space: nowrap;
}
.course-time{
.course-time {
font-size: 12px;
font-weight: 400;
color: #666666;
line-height: 20px;
}
.course-status {
font-size:12px;
line-height:18px;
display:inline-block;
border-radius:2px;
padding:0 8px;
margin-left:4px;
font-size: 12px;
line-height: 18px;
display: inline-block;
border-radius: 2px;
padding: 0 8px;
margin-left: 4px;
}
.teacher-assistant{
display:flex;
.teacher{
.teacher-assistant {
display: flex;
.teacher {
font-size: 12px;
color: #666666;
max-width: 96px;
overflow: hidden;
text-overflow:ellipsis;
text-overflow: ellipsis;
white-space: nowrap;
display:inline-block;
padding-top:2px;
display: inline-block;
padding-top: 2px;
}
.assistant{
.assistant {
font-size: 12px;
color: #666666;
max-width: 96px;
overflow: hidden;
text-overflow:ellipsis;
text-overflow: ellipsis;
white-space: nowrap;
display:inline-block;
padding-top:2px;
display: inline-block;
padding-top: 2px;
}
.split {
margin: 0 4px;
color: #BFBFBF;
color: #bfbfbf;
display: inline-blcok;
}
}
}
.related-task{
.related-task {
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
......@@ -76,37 +74,37 @@
line-clamp: 2;
-webkit-box-orient: vertical;
}
.categoryName{
.categoryName {
font-size: 14px;
color: #666666;
line-height: 20px;
}
.courseware{
.courseware {
font-size: 14px;
color: #2966FF;
color: #2966ff;
line-height: 20px;
text-align:right;
cursor:pointer;
text-align: right;
cursor: pointer;
}
.quota-icon{
color:#2966FF;
cursor:pointer;
.quota-icon {
color: #2966ff;
cursor: pointer;
}
.operate {
display: flex;
align-items: center;
flex-wrap: wrap;
.operate__item {
color: #2966FF;
color: #2966ff;
cursor: pointer;
&.split {
margin: 0 8px;
color: #BFBFBF;
color: #bfbfbf;
}
}
}
.operate-text {
color: #2966FF;
color: #2966ff;
cursor: pointer;
}
.course-start-end {
......@@ -135,7 +133,27 @@
font-size: 12px;
}
}
tbody {
tr {
&:nth-child(even) {
background: transparent !important;
td {
background: #fff !important;
}
}
&:nth-child(odd) {
background: #fafafa !important;
td {
background: #fafafa !important;
}
}
&:hover {
td {
background: #f3f6fa !important;
}
}
}
}
}
.live-course-more-menu {
background: white;
......@@ -155,4 +173,4 @@
.type {
font-weight: 700;
}
}
\ No newline at end of file
}
src/modules/course-manage/components/LiveCourseOpt.jsx
......@@ -53,7 +53,7 @@ class LiveCourseOpt extends React.Component {
{ userRole !== "CloudLecturer" &&
<Button type="primary" onClick={this.handleCreateLiveCouese}>新建直播课</Button>
}
{!this.state.isMac && <Button onClick={this.handleDownloadClient}>下载直播客户端</Button>}
<Button onClick={this.handleDownloadClient}>下载直播客户端</Button>
</div>
</div>
)
......
src/modules/course-manage/graphics-course/AddGraphicsCourse.jsx
/*
* @Author: 吴文洁
* @Date: 2020-08-05 10:07:47
* @LastEditors: fusanqiasng
* @LastEditTime: 2021-06-16 18:16:14
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-07-08 19:32:50
* @Description: 图文课新增/编辑页
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
......@@ -10,7 +10,7 @@
import React from 'react';
import { Button, Input, Radio, message, Modal, Cascader } from 'antd';
import $ from 'jquery';
import moment from 'moment';
import { DISK_MAP, FileTypeIcon, FileVerifyMap } from '@/common/constants/academic/lessonEnum';
import { ImgCutModalNew } from '@/components';
import ShowTips from '@/components/ShowTips';
......@@ -25,6 +25,7 @@ import { randomString } from '@/domains/basic-domain/utils';
import User from '@/common/js/user';
import _ from 'underscore';
import Upload from '@/core/upload';
import ImgClipModal from '@/components/ImgClipModal'
import './AddGraphicsCourse.less';
const EDIT_BOX_KEY = Math.random();
......@@ -279,79 +280,10 @@ class AddGraphicsCourse extends React.Component {
};
handleSelectCover = (file) => {
this.uploadCoverImage(file);
};
//上传图片
uploadCoverImage = (imageFile) => {
const { folderName } = imageFile;
const fileName = window.random_string(16) + folderName.slice(folderName.lastIndexOf('.'));
const self = this;
this.setState(
{
visible: true,
},
() => {
setTimeout(() => {
const okBtnDom = document.querySelector('#headPicModal');
const options = {
size: [500, 282],
ok: okBtnDom,
maxZoom: 3,
style: {
jpgFillColor: 'transparent',
},
done: function (dataUrl) {
clearTimeout(self.timer);
self.timer = setTimeout(() => {
if (self.state.rotate != this.rotate() || self.state.scale != this.scale()) {
const _dataUrl = this.clip();
const cutImageBlob = self.convertBase64UrlToBlob(_dataUrl);
self.setState({
cutImageBlob,
dataUrl: _dataUrl,
rotate: this.rotate(),
scale: this.scale(),
});
}
}, 500);
const cutImageBlob = self.convertBase64UrlToBlob(dataUrl);
self.setState({
cutImageBlob,
dataUrl,
});
setTimeout(() => {
cutFlag = false;
}, 2000);
},
fail: (failInfo) => {
message.error('图片上传失败了，请重新上传');
},
loadComplete: function (img) {
setTimeout(() => {
const _dataUrl = this.clip();
self.setState({
dataUrl: _dataUrl,
hasImgReady: true,
});
}, 100);
},
};
const imgUrl = `${imageFile.ossUrl}?${new Date().getTime()}`;
if (!this.state.photoclip) {
const _photoclip = new PhotoClip('#headPicModal', options);
_photoclip.load(imgUrl);
this.setState({
photoclip: _photoclip,
});
} else {
this.state.photoclip.clear();
this.state.photoclip.load(imgUrl);
}
}, 200);
}
);
this.setState({
visible: true,
imageFile:file
});
};
//获取resourceId
......@@ -377,19 +309,17 @@ class AddGraphicsCourse extends React.Component {
});
};
// base64转换成blob
convertBase64UrlToBlob = (urlData) => {
const bytes = window.atob(urlData.split(',')[1]);
const ab = new ArrayBuffer(bytes.length);
const ia = new Uint8Array(ab);
for (let i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
}
return new Blob([ab], { type: 'image/png' });
};
// 保存
handleSubmit = () => {
//过期判断
if (User.getExpirationTime() && moment().valueOf() > Number(User.getExpirationTime())) {
Modal.warning({
title:"服务已到期",
content: "当前企业购买的小麦企学院服务已到期，如需继续使用学院功能，请尽快续费购买",
okText: "我知道了"
})
return
}
const { id, coverId, pageType, courseName, courseMedia, introduce, categoryId, shelfState, whetherVisitorsJoin } = this.state;
const commonParams = {
......@@ -610,61 +540,9 @@ class AddGraphicsCourse extends React.Component {
onSelect={this.handleSelectCover}
/>
)}
<Modal
title='设置图片'
width={1080}
visible={visible}
maskClosable={false}
closeIcon={<span className='icon iconfont modal-close-icon'>&#xe6ef;</span>}
onCancel={() => {
this.setState({ visible: false });
}}
zIndex={10001}
footer={[
<Button
key='back'
onClick={() => {
this.setState({ visible: false });
}}>
重新上传
</Button>,
<Button
key='submit'
type='primary'
disabled={!hasImgReady}
onClick={() => {
if (!cutFlag) {
cutFlag = true;
this.refs.hiddenBtn.click();
}
this.getSignature(cutImageBlob);
}}>
确定
</Button>,
]}>
<div className='clip-box'>
<div
id='headPicModal'
ref='headPicModal'
style={{
width: '500px',
height: '430px',
marginBottom: 0,
}}></div>
<div id='clipBtn' style={{ display: 'none' }} ref='hiddenBtn'></div>
<div className='preview-img'>
<div className='title'>效果预览</div>
<div id='preview-url-box' style={{ width: 500, height: 282 }}>
<img src={this.state.dataUrl} style={{ width: '100%' }} alt='' />
</div>
<div className='tip-box'>
<div className='tip'>温馨提示</div>
<div className='tip'>①预览效果图时可能存在延迟，单击左侧图片刷新即可</div>
<div className='tip'>②设置图片时双击可旋转图片，滚动可放大或缩小图片</div>
</div>
</div>
</div>
</Modal>
{ visible &&
<ImgClipModal visible={visible} imgUrl={imageFile.ossUrl} onConfirm={this.getSignature} onClose={()=>{this.setState({ visible: false });}}/>
}
{this.state.previewGraphicsModal}
</div>
);
......
src/modules/course-manage/graphics-course/components/GraphicsCourseList.jsx
......@@ -144,7 +144,12 @@ class GraphicsCourseList extends React.Component {
width: 120,
dataIndex: 'courseware',
render: (val, item, index) => {
return <Switch defaultChecked={item.shelfState === 'YES' ? true : false} onChange={() => this.changeShelfState(item)} />;
return (
<Switch
checked={item.shelfState === "YES"}
defaultChecked={item.shelfState==="YES"?true:false}
onChange={(checked)=>this.changeShelfState(index,item,checked)}/>
)
},
},
{
......@@ -300,19 +305,17 @@ class GraphicsCourseList extends React.Component {
删除
</div>
</div>
);
};
//改变上架状态
changeShelfState = (item) => {
let _shelfState = item.shelfState;
if (_shelfState === 'NO') {
_shelfState = 'YES';
item.shelfState = 'YES';
} else {
_shelfState = 'NO';
item.shelfState = 'NO';
}
const params = {
)
}
//改变上架状态
changeShelfState = (index,item,checked) =>{
let _shelfState = checked ? "YES" : "NO"
// if(_shelfState==='NO'){
// _shelfState = "YES";
// }else{
// _shelfState = "NO"
// }
const params={
courseId: item.id,
shelfState: _shelfState,
};
......@@ -323,6 +326,7 @@ class GraphicsCourseList extends React.Component {
} else {
message.success('已取消展示');
}
this.props.changeShelfState(index,_shelfState)
}
});
};
......
src/modules/course-manage/graphics-course/index.jsx
......@@ -27,6 +27,13 @@ class GraphicsCourse extends React.Component {
this.handleFetchScheduleList();
}
changeShelfState = (index, shelfState) => {
const { dataSource } = this.state;
dataSource[index].shelfState = shelfState;
this.setState({
dataSource,
});
};
// 获取视频课列表
handleFetchScheduleList = (_query = {}) => {
const query = {
......@@ -75,6 +82,7 @@ class GraphicsCourse extends React.Component {
dataSource={dataSource}
totalCount={totalCount}
onChange={this.handleFetchScheduleList}
changeShelfState={this.changeShelfState}
/>
</div>
</div>
......
src/modules/course-manage/offline-course/AddOfflineCourse.jsx
/*
* @Author: 吴文洁
* @Date: 2020-08-05 10:07:47
* @LastEditors: yuananting
* @LastEditTime: 2021-06-07 15:06:26
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-07-06 14:47:23
* @Description: 线下课新增/编辑页
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
......@@ -38,6 +38,7 @@ import moment from 'moment';
import Upload from '@/core/upload';
import GraphicsEditor from '../components/GraphicsEditor';
import MultipleDatePicker from '@/components/MultipleDatePicker';
import ImgClipModal from '@/components/ImgClipModal'
import './AddOfflineCourse.less';
const { Option } = Select;
......@@ -355,83 +356,12 @@ class AddOfflineCourse extends React.Component {
}
handleSelectCover = (file)=> {
this.uploadCoverImage(file);
this.setState({
visible: true,
imageFile:file
});
}
//上传图片
uploadCoverImage = (imageFile) => {
const { folderName } = imageFile;
const fileName = window.random_string(16) + folderName.slice(folderName.lastIndexOf("."));
const self = this;
this.setState(
{
visible: true,
},
() => {
setTimeout(() => {
const okBtnDom = document.querySelector("#headPicModal");
const options = {
size: [500, 282],
ok: okBtnDom,
maxZoom: 3,
style: {
jpgFillColor: "transparent",
},
done: function (dataUrl) {
clearTimeout(self.timer);
self.timer = setTimeout(() => {
if ((self.state.rotate != this.rotate()) || (self.state.scale != this.scale())) {
const _dataUrl = this.clip()
const cutImageBlob = self.convertBase64UrlToBlob(_dataUrl);
self.setState({
cutImageBlob,
dataUrl: _dataUrl,
rotate: this.rotate(),
scale: this.scale()
})
}
}, 500)
const cutImageBlob = self.convertBase64UrlToBlob(dataUrl);
self.setState({
cutImageBlob,
dataUrl
})
setTimeout(() => {
cutFlag = false;
}, 2000);
},
fail: (failInfo) => {
message.error("图片上传失败了，请重新上传");
},
loadComplete: function (img) {
setTimeout(() => {
const _dataUrl = this.clip()
self.setState({
dataUrl: _dataUrl,
hasImgReady: true
})
}, 100)
},
};
const imgUrl = `${imageFile.ossUrl}?${new Date().getTime()}`
if (!this.state.photoclip) {
const _photoclip = new PhotoClip("#headPicModal", options);
_photoclip.load(imgUrl);
this.setState({
photoclip: _photoclip,
});
} else {
this.state.photoclip.clear();
this.state.photoclip.load(imgUrl);
}
}, 200);
}
);
};
//获取resourceId
getSignature = (blob, fileName) => {
......@@ -454,18 +384,16 @@ class AddOfflineCourse extends React.Component {
})
}
// base64转换成blob
convertBase64UrlToBlob = (urlData) => {
const bytes = window.atob(urlData.split(",")[1]);
const ab = new ArrayBuffer(bytes.length);
const ia = new Uint8Array(ab);
for (let i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
}
return new Blob([ab], { type: "image/png" });
};
preSubmit = () => {
//过期判断
if (User.getExpirationTime() && moment().valueOf() > Number(User.getExpirationTime())) {
Modal.warning({
title:"服务已到期",
content: "当前企业购买的小麦企学院服务已到期，如需继续使用学院功能，请尽快续费购买",
okText: "我知道了"
})
return
}
const { courseId } = this.state;
if (courseId) {
this.checkDetail(courseId).then(bool => bool ? this.handleSubmit() : message.warning('课程已开始，无法继续编辑'))
......@@ -777,6 +705,7 @@ class AddOfflineCourse extends React.Component {
quota,
offlinePlace,
isEditDisablie,
imageFile,
} = this.state;
const isDefaultCover = coverUrl === defaultCoverUrl;
return (
......@@ -1292,65 +1221,9 @@ class AddOfflineCourse extends React.Component {
onSelect={this.handleSelectCover}
/>
}
<Modal
title="设置图片"
width={1080}
visible={visible}
maskClosable={false}
closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
onCancel={() => {
this.setState({ visible: false });
}}
zIndex={10001}
footer={[
<Button
key="back"
onClick={() => {
this.setState({ visible: false });
}}
>
重新上传
</Button>,
<Button
key="submit"
type="primary"
disabled={!hasImgReady}
onClick={() => {
if (!cutFlag) {
cutFlag = true;
this.refs.hiddenBtn.click();
}
this.getSignature(cutImageBlob);
}}
>
确定
</Button>,
]}
>
<div className="clip-box">
<div
id="headPicModal"
ref="headPicModal"
style={{
width: "500px",
height: "430px",
marginBottom: 0,
}}
></div>
<div id="clipBtn" style={{ display: "none" }} ref="hiddenBtn"></div>
<div className="preview-img">
<div className="title">效果预览</div>
<div id="preview-url-box" style={{width:500,height:282}}>
<img src={this.state.dataUrl} style={{ width: '100%' }} alt="" />
</div>
<div className="tip-box">
<div className="tip">温馨提示</div>
<div className="tip">①预览效果图时可能存在延迟，单击左侧图片刷新即可</div>
<div className="tip">②设置图片时双击可旋转图片，滚动可放大或缩小图片</div>
</div>
</div>
</div>
</Modal>
{ visible &&
<ImgClipModal visible={visible} imgUrl={imageFile.ossUrl} onConfirm={this.getSignature} onClose={()=>{this.setState({ visible: false });}}/>
}
{ this.state.previewOfflineModal }
</div>
)
......
src/modules/course-manage/offline-course/components/OfflineCourseList.jsx
......@@ -10,7 +10,7 @@ import Service from '@/common/js/service';
import User from '@/common/js/user';
import college from '@/common/lottie/college';
import { PageControl, XMTable } from '@/components';
import { appId, LIVE_SHARE } from '@/domains/course-domain/constants';
import { LIVE_SHARE } from '@/domains/course-domain/constants';
import CourseService from '@/domains/course-domain/CourseService';
import ShareLiveModal from '@/modules/course-manage/modal/ShareLiveModal';
import OfflineCourseData from '@/modules/course-manage/offline-course/OfflineCourseData';
......@@ -78,7 +78,7 @@ class OfflineCourseList extends React.Component {
} ${moment(startTime).format('HH:mm')} ~ ${moment(endTime).format('HH:mm')}`;
return (
<div className='record__item'>
<img className='course-cover' src={coverUrl || defaultCoverUrl} />
<img className='course-cover' src={coverUrl || defaultCoverUrl} alt='' />
<div style={{ width: 175 }}>
<Tooltip title={courseName}>
<div className='course-name'>{courseName}</div>
......@@ -152,14 +152,14 @@ class OfflineCourseList extends React.Component {
},
{
title: '报名时间',
width: 181,
width: 200,
key: 'apply',
dataIndex: 'apply',
sorter: true,
render: (val, item) => {
return (
<div>
{item.startTimeApply ? `${formatDate('MM-DD H:i', item.startTimeApply)} ~ ${formatDate('MM-DD H:i', item.endTimeApply)}` : '-'}
<div style={{ whiteSpace: 'nowrap' }}>
{item.startTimeApply ? `${window.formatDate('MM-DD H:i', item.startTimeApply)} ~ ${window.formatDate('MM-DD H:i', item.endTimeApply)}` : '-'}
{item.whetherApplyFull === 'YES' && (
<span
style={{
......@@ -185,7 +185,7 @@ class OfflineCourseList extends React.Component {
dataIndex: 'created',
sorter: true,
render: (val) => {
return formatDate('YYYY-MM-DD H:i', val);
return <span style={{ whiteSpace: 'nowrap' }}>{window.formatDate('YYYY-MM-DD H:i', val)}</span>;
},
},
{
......@@ -360,8 +360,6 @@ class OfflineCourseList extends React.Component {
// 显示分享弹窗
handleShowShareModal = (record, needStr = false) => {
const { courseId } = record;
const _appId = appId;
const htmlUrl = `${LIVE_SHARE}offline_detail/${courseId}?id=${User.getStoreId()}`;
const longUrl = htmlUrl;
const { courseName, courseMediaVOS } = record;
......@@ -437,7 +435,7 @@ class OfflineCourseList extends React.Component {
columns={this.parseColumns()}
onChange={this.handleChangeTable}
pagination={false}
scroll={{ x: 1500 }}
scroll={{ x: 1300 }}
bordered
className='offline-list-table'
/>
......
src/modules/course-manage/video-course/AddVideoCourse.jsx
/*
* @Author: 吴文洁
* @Date: 2020-08-05 10:07:47
* @LastEditors: wufan
* @LastEditTime: 2021-05-30 20:35:49
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-07-08 19:34:10
* @Description: 视频课新增/编辑页
* @Copyright: 杭州杰竞科技有限公司 版权所有
*/
......@@ -11,10 +11,9 @@ import React from 'react'
import { Button, Input, Radio, message, Modal, Cascader } from 'antd'
import { DISK_MAP, FileTypeIcon, FileVerifyMap } from '@/common/constants/academic/lessonEnum'
import { ImgCutModalNew } from '@/components'
import ShowTips from '@/components/ShowTips'
import Breadcrumbs from '@/components/Breadcrumbs'
import moment from 'moment'
import AddVideoIntro from './components/AddVideoIntro'
import SelectStudent from '../modal/select-student'
import SelectPrepareFileModal from '../../prepare-lesson/modal/SelectPrepareFileModal'
......@@ -26,8 +25,8 @@ import User from '@/common/js/user'
import _ from 'underscore'
import Upload from '@/core/upload'
import { randomString } from '@/domains/basic-domain/utils'
import ImgClipModal from '@/components/ImgClipModal'
import $ from 'jquery'
// import PhotoClip from 'photoclip';
import './AddVideoCourse.less'
const EDIT_BOX_KEY = Math.random()
......@@ -262,7 +261,6 @@ class AddVideoCourse extends React.Component {
_.each(studentIds, (item) => {
studentList.push({ studentId: item })
})
// this.setState({ studentModal: null });
this.setState({ studentList })
this.setState({ studentModal: false })
}
......@@ -321,6 +319,15 @@ class AddVideoCourse extends React.Component {
// 保存
handleSubmit = () => {
//过期判断
if (User.getExpirationTime() && moment().valueOf() > Number(User.getExpirationTime())) {
Modal.warning({
title:"服务已到期",
content: "当前企业购买的小麦企学院服务已到期，如需继续使用学院功能，请尽快续费购买",
okText: "我知道了"
})
return
}
const { instId, adminId } = window.currentUserInstInfo
const {
......@@ -419,81 +426,11 @@ class AddVideoCourse extends React.Component {
})
}
handleSelectCover = (file) => {
this.uploadImage(file)
}
//上传图片
uploadImage = (imageFile) => {
const { folderName } = imageFile
const fileName = window.random_string(16) + folderName.slice(folderName.lastIndexOf('.'))
const self = this
this.setState(
{
visible: true
},
() => {
setTimeout(() => {
const okBtnDom = document.querySelector('#headPicModal')
const options = {
size: [500, 282],
ok: okBtnDom,
maxZoom: 3,
style: {
jpgFillColor: 'transparent'
},
done: function (dataUrl) {
clearTimeout(self.timer)
self.timer = setTimeout(() => {
if (self.state.rotate != this.rotate() || self.state.scale != this.scale()) {
const _dataUrl = this.clip()
const cutImageBlob = self.convertBase64UrlToBlob(_dataUrl)
self.setState({
cutImageBlob,
dataUrl: _dataUrl,
rotate: this.rotate(),
scale: this.scale()
})
}
}, 500)
const cutImageBlob = self.convertBase64UrlToBlob(dataUrl)
self.setState({
cutImageBlob,
dataUrl
})
setTimeout(() => {
cutFlag = false
}, 2000)
},
fail: (failInfo) => {
message.error('图片上传失败了，请重新上传')
},
loadComplete: function (img) {
setTimeout(() => {
const _dataUrl = this.clip()
self.setState({
dataUrl: _dataUrl,
hasImgReady: true
})
}, 100)
}
}
const imgUrl = `${imageFile.ossUrl}?${new Date().getTime()}`
if (!this.state.photoclip) {
const _photoclip = new PhotoClip('#headPicModal', options)
_photoclip.load(imgUrl)
this.setState({
photoclip: _photoclip
})
} else {
this.state.photoclip.clear()
this.state.photoclip.load(imgUrl)
}
}, 200)
}
)
this.setState({
visible: true,
imageFile:file
});
}
//获取resourceId
getSignature = (blob, fileName) => {
Upload.uploadBlobToOSS(blob, 'cover' + new Date().valueOf(), null, 'signInfo').then((signInfo) => {
......@@ -515,16 +452,6 @@ class AddVideoCourse extends React.Component {
coverId: coverId
})
}
// base64转换成blob
convertBase64UrlToBlob = (urlData) => {
const bytes = window.atob(urlData.split(',')[1])
const ab = new ArrayBuffer(bytes.length)
const ia = new Uint8Array(ab)
for (let i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i)
}
return new Blob([ab], { type: 'image/png' })
}
render() {
const {
pageType,
......@@ -727,61 +654,9 @@ class AddVideoCourse extends React.Component {
onSelect={this.handleSelectCover}
/>
)}
<Modal
title='设置图片'
width={1080}
visible={visible}
maskClosable={false}
closeIcon={<span className='icon iconfont modal-close-icon'>&#xe6ef;</span>}
onCancel={() => {
this.setState({ visible: false })
}}
zIndex={10001}
footer={[
<Button
key='back'
onClick={() => {
this.setState({ visible: false })
}}>
重新上传
</Button>,
<Button
key='submit'
type='primary'
disabled={!hasImgReady}
onClick={() => {
if (!cutFlag) {
cutFlag = true
this.refs.hiddenBtn.click()
}
this.getSignature(cutImageBlob)
}}>
确定
</Button>
]}>
<div className='clip-box'>
<div
id='headPicModal'
ref='headPicModal'
style={{
width: '500px',
height: '430px',
marginBottom: 0
}}></div>
<div id='clipBtn' style={{ display: 'none' }} ref='hiddenBtn'></div>
<div className='preview-img'>
<div className='title'>效果预览</div>
<div id='preview-url-box' style={{ width: 500, height: 282 }}>
<img src={this.state.dataUrl} style={{ width: '100%' }} alt='' />
</div>
<div className='tip-box'>
<div className='tip'>温馨提示</div>
<div className='tip'>①预览效果图时可能存在延迟，单击左侧图片刷新即可</div>
<div className='tip'>②设置图片时双击可旋转图片，滚动可放大或缩小图片</div>
</div>
</div>
</div>
</Modal>
{ visible &&
<ImgClipModal visible={visible} imgUrl={imageFile.ossUrl} onConfirm={this.getSignature} onClose={()=>{this.setState({ visible: false });}}/>
}
{this.state.previewCourseModal}
</div>
)
......
src/modules/course-manage/video-course/components/VideoCourseList.jsx
import { Dropdown, message, Modal, Switch, Table, Tooltip } from 'antd';
import { Dropdown, message, Modal, Switch, Tooltip } from 'antd';
import User from '@/common/js/user';
import { PageControl } from '@/components';
import { LIVE_SHARE } from '@/domains/course-domain/constants';
......@@ -185,7 +185,7 @@ class VideoCourseList extends React.Component {
dataIndex: 'created',
sorter: true,
render: (val) => {
return formatDate('YYYY-MM-DD H:i', val);
return window.formatDate('YYYY-MM-DD H:i', val);
},
},
{
......@@ -195,7 +195,7 @@ class VideoCourseList extends React.Component {
dataIndex: 'updated',
sorter: true,
render: (val) => {
return formatDate('YYYY-MM-DD H:i', val);
return window.formatDate('YYYY-MM-DD H:i', val);
},
},
{
......@@ -211,7 +211,7 @@ class VideoCourseList extends React.Component {
<Tooltip title={this.handlePlanName(record.relatedPlanList)} placement='top' arrowPointAtCenter>
{record.relatedPlanList.map((item, index) => {
return (
<span>
<span key={item.planId}>
{item.planName} {index < record.relatedPlanList.length - 1 && <span> 、</span>}
</span>
);
......@@ -296,7 +296,7 @@ class VideoCourseList extends React.Component {
handlePlanName = (planArray) => {
let planStr = '';
planArray.map((item, index) => {
planArray.forEach((item, index) => {
if (index < planArray.length - 1) {
planStr = planStr + item.planName + '、';
} else {
......
src/modules/home/Home.jsx
import React from 'react';
import { Select, Tooltip } from 'antd';
import React, { useEffect, useState } from 'react';
import { Select, Tooltip, Carousel, Popover } from 'antd';
import DataSet from "@antv/data-set";
import { Chart as G2Chart } from '@antv/g2';
import {
......@@ -20,6 +20,8 @@ import {
import moment from 'moment'
import Service from "@/common/js/service";
import User from '@/common/js/user';
import HomeTip from './HomeTip';
import './Home.less';
const Option = Select.Option;
......@@ -42,7 +44,11 @@ class Home extends React.Component {
studyTimeRange: '7',
completeNum: 0,
unfinishedNum: 0,
}
weekVisitCustomerNum: 0,
incWeekVisitCustomerNum: 0,
courseNum: 0, //课程总数
inCourseNum: 0, //本月新增课程总数
};
this._chart = null;
}
......@@ -56,7 +62,7 @@ class Home extends React.Component {
getTrainingInfo() {
Service.Hades('public/hades/planOverview', { storeId: User.getStoreId() }).then((res) => {
if (res.success) {
this.setState(res.result)
this.setState(res.result);
}
});
}
......@@ -68,25 +74,25 @@ class Home extends React.Component {
scheduleType,
storeId: User.getStoreId(),
timeRange,
}
};
Service.Hades('public/courseCloud/hotCourse', data).then((res) => {
if (res.success) {
this.setState({
list: res.result
})
list: res.result,
});
}
})
});
}
getStudyInfo() {
const { studyTimeRange } = this.state;
Service.Hades('public/hades/studyInfo', { storeId: User.getStoreId(), timeRange: studyTimeRange }).then((res) => {
if (res.success) {
const dataList = res.result.map(item => ({
const dataList = res.result.map((item) => ({
time: moment(item.dateline).format('MM-DD'),
studyNum: item.studyNum,
studyTime: Math.round(item.studyTime / 6) / 10,
}))
}));
this.createChart(dataList);
}
});
......@@ -110,9 +116,13 @@ class Home extends React.Component {
pictureCourseNum: res.result.pictureCourseNum,
offlineCourseNum: res.result.offlineCourseNum,
trainingPlanNum: res.result.trainingPlanNum,
})
weekVisitCustomerNum: res.result.weekVisitCustomerNum,
incWeekVisitCustomerNum: res.result.incWeekVisitCustomerNum,
courseNum: res.result.videoCourseNum + res.result.liveCourseNum + res.result.pictureCourseNum + res.result.offlineCourseNum,
inCourseNum: res.result.incLiveCourseNum + res.result.incVideoCourseNum + res.result.incPictureCourseNum + res.result.incOfflineCourseNum,
});
}
})
});
}
showNumber(index) {
......@@ -123,97 +133,109 @@ class Home extends React.Component {
return 'https://image.xiaomaiketang.com/xm/Qfib4mnGJT.png';
case 2:
return 'https://image.xiaomaiketang.com/xm/8jKXHyrDaG.png';
default:
return 'https://image.xiaomaiketang.com/xm/D64QhNn74S.png';
}
}
createChart = (data) => {
if (!this._chart) {
this._chart = new G2Chart({
container: 'chart-id',
forceFit: true,
height: 290,
padding: [48, 64]
})
padding: [48, 64],
});
}
this._chart.clear();
this._chart.source(data, {
studyTime: {
formatter: (val) => {
return val
},
this._chart.clear();
this._chart.source(data, {
studyTime: {
formatter: (val) => {
return val;
},
tickCount: 5,
},
time: {
formatter: (val) => {
return `${val}`;
},
},
studyNum: {
formatter: (val) => {
return val;
},
tickCount: 5,
},
time: {
formatter: (val) => {
return `${val}`
},
},
studyNum: {
formatter: (val) => {
return val
},
tickCount: 5,
}
});
this._chart.axis('time', {
label: {
offset: 20,
textStyle: {
fill: '#666666',
fontSize: 14
}
},
line: {
stroke: '#E8E8E8'
},
tickLine: {
stroke: '#E8E8E8'
}
})
this._chart.axis('submitCount', {
label: {
textStyle: {
fill: '#666666',
fontSize: 14
}
}
})
this._chart.axis('studyTime', {
label: {
textStyle: {
fill: '#666666',
fontSize: 14
}
}
})
this._chart.line().position('time*studyNum').color('#2966FF').tooltip('time*studyNum', function( time, studyNum){
return {
name: '学习人数',
value: studyNum + '人'
}
});
this._chart.line().position('time*studyTime').color('#FFBB54').tooltip('time*studyTime', function( time, studyTime){
return {
name: '人均学习时长',
value: studyTime + '分钟'
}
});
},
});
this._chart.axis('time', {
label: {
offset: 20,
textStyle: {
fill: '#666666',
fontSize: 14,
},
},
line: {
stroke: '#E8E8E8',
},
tickLine: {
stroke: '#E8E8E8',
},
});
this._chart.axis('submitCount', {
label: {
textStyle: {
fill: '#666666',
fontSize: 14,
},
},
});
this._chart.axis('studyTime', {
label: {
textStyle: {
fill: '#666666',
fontSize: 14,
},
},
});
this._chart
.line()
.position('time*studyNum')
.color('#2966FF')
.tooltip('time*studyNum', function (time, studyNum) {
return {
name: '学习人数',
value: studyNum + '人',
};
});
this._chart
.line()
.position('time*studyTime')
.color('#FFBB54')
.tooltip('time*studyTime', function (time, studyTime) {
return {
name: '人均学习时长',
value: studyTime + '分钟',
};
});
this._chart.legend(false);
this._chart.tooltip({
containerTpl: '<div class="g2-tooltip" style="background: #fff !important;">'
+ '<div class="g2-tooltip-title" style="margin:10px 0;"></div>'
+ '<ul class="g2-tooltip-list"></ul></div>', // tooltip 容器模板
itemTpl: '<li data-index={index}><span style="background-color:{color};width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:8px;"></span>{name}<span style="display: inline-block; float: right; margin-left: 30px;">{value}</span></li>', // tooltip 每项记录的默认模板
})
this._chart.render();
}
this._chart.legend(false);
this._chart.tooltip({
containerTpl:
'<div class="g2-tooltip" style="background: #fff !important;">' +
'<div class="g2-tooltip-title" style="margin:10px 0;"></div>' +
'<ul class="g2-tooltip-list"></ul></div>', // tooltip 容器模板
itemTpl:
'<li data-index={index}><span style="background-color:{color};width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:8px;"></span>{name}<span style="display: inline-block; float: right; margin-left: 30px;">{value}</span></li>', // tooltip 每项记录的默认模板
});
this._chart.render();
};
render() {
const {
courseNum,
inCourseNum,
examNum,
incExamNum,
list,
......@@ -235,314 +257,347 @@ class Home extends React.Component {
planCustomerNum,
incOfflineCourseNum,
offlineCourseNum,
weekVisitCustomerNum,
incWeekVisitCustomerNum,
} = this.state;
const data = [
{
item: '已完成培训',
count: completeNum,
}, {
},
{
item: '未完成培训',
count: unfinishedNum,
}
},
];
const { DataView } = DataSet;
const { Html } = Guide;
const sum = data[0].count + data[1].count;
const dv = new DataView();
sum && dv.source(data).transform({
type: "percent",
field: "count",
dimension: "item",
as: "percent"
});
sum &&
dv.source(data).transform({
type: 'percent',
field: 'count',
dimension: 'item',
as: 'percent',
});
const cols = {
percent: {
formatter: val => {
val = val * 100 + "%";
formatter: (val) => {
val = val * 100 + '%';
return val;
}
}
},
},
};
return (
<div className="home-page">
<div className="data-wrap">
<div className="home-title">数据概况</div>
<div className="data-box">
<div className="data-item">
<div className="header">
<img className="header-icon" src="https://image.xiaomaiketang.com/xm/wAaFtjeRsM.png" />
<span className="header-word">学员总数 (人)</span>
</div>
<div className="data-number">{totalCustomerNum}</div>
<div className="data-footer">
<span className="footer-word">本月新增</span>
{incCustomerNum > 0 &&
<span className="icon iconfont">&#xe635;</span>
}
<span className="footer-number">{incCustomerNum}</span>
<div className='home-page'>
<HomeTip />
<div className='data-wrap'>
<div className='home-title'>数据概况</div>
<div className='data-box'>
<div className='data-item'>
<div className='header'>
<img className='header-icon' src='https://image.xiaomaiketang.com/xm/wAaFtjeRsM.png' alt='' />
<span className='header-word'>学员总数 (人)</span>
</div>
<div className='data-number'>{totalCustomerNum}</div>
<div className='data-footer'>
<span className='footer-word'>本月新增</span>
{incCustomerNum > 0 && <span className='icon iconfont'>&#xe635;</span>}
<span className='footer-number'>{incCustomerNum > 0 ? incCustomerNum : 0}</span>
</div>
</div>
</div>
<div className="data-item course-data">
<div className="header">
<img className="header-icon" src="https://image.xiaomaiketang.com/xm/jPrRhw8EMF.png" />
<span className="header-word">课程总数 (个)</span>
<div className='data-item'>
<div className='header'>
<img className='header-icon' src='https://image.xiaomaiketang.com/xm/nXYAHExPrX.png' alt='' />
<span className='header-word'>学员周活跃 (人)</span>
</div>
<div className='data-number'>{weekVisitCustomerNum || 0}</div>
<div className='data-footer'>
<span className='footer-word'>本周新增</span>
{incWeekVisitCustomerNum > 0 && <span className='icon iconfont'>&#xe635;</span>}
<span className='footer-number'>{incWeekVisitCustomerNum > 0 ? incWeekVisitCustomerNum : 0}</span>
</div>
</div>
<div className="data-number">{videoCourseNum + liveCourseNum + pictureCourseNum}</div>
<div className="course-box">
<div className="course-item">
<div className="course-title">直播课</div>
<div className="data">
<span className="course-number">{liveCourseNum}</span>
<span className="course-word">本月新增</span>
{incLiveCourseNum > 0 &&
<span className="icon iconfont">&#xe635;</span>
}
<span className="add-number">{incLiveCourseNum}</span>
</div>
<div className='data-item course-data'>
<div className='header'>
<img className='header-icon' src='https://image.xiaomaiketang.com/xm/jPrRhw8EMF.png' alt='' />
<span className='header-word'>课程总数 (个)</span>
</div>
<div className="course-item">
<div className="course-title">视频课</div>
<div className="data">
<span className="course-number">{videoCourseNum}</span>
<span className="course-word">本月新增</span>
{incVideoCourseNum > 0 &&
<span className="icon iconfont">&#xe635;</span>
}
<span className="add-number">{incVideoCourseNum}</span>
</div>
<div className='data-number'>{courseNum}</div>
<div className='data-footer'>
<span className='footer-word'>本月新增</span>
{inCourseNum > 0 && <span className='icon iconfont'>&#xe635;</span>}
<span className='footer-number'>{inCourseNum > 0 ? inCourseNum : 0}</span>
</div>
<div className="course-item">
<div className="course-title">图文课</div>
<div className="data">
<span className="course-number">{pictureCourseNum}</span>
<span className="course-word">本月新增</span>
{incPictureCourseNum > 0 &&
<span className="icon iconfont">&#xe635;</span>
}
<span className="add-number">{incPictureCourseNum}</span>
<div className='course-box'>
<div className='course-item'>
<div className='course-title'>直播课</div>
<div className='data'>
<span className='course-number'>{liveCourseNum}</span>
{incLiveCourseNum > 0 && <span className='icon iconfont'>&#xe635;</span>}
<span className='add-number'>{incLiveCourseNum > 0 ? incLiveCourseNum : 0}</span>
</div>
</div>
</div>
<div className="course-item">
<div className="course-title">线下课</div>
<div className="data">
<span className="course-number">{offlineCourseNum}</span>
<span className="course-word">本月新增</span>
{incOfflineCourseNum > 0 &&
<span className="icon iconfont">&#xe635;</span>
}
<span className="add-number">{incOfflineCourseNum}</span>
<div className='course-item'>
<div className='course-title'>视频课</div>
<div className='data'>
<span className='course-number'>{videoCourseNum}</span>
{incVideoCourseNum > 0 && <span className='icon iconfont'>&#xe635;</span>}
<span className='add-number'>{incVideoCourseNum > 0 ? incVideoCourseNum : 0}</span>
</div>
</div>
<div className='course-item'>
<div className='course-title'>图文课</div>
<div className='data'>
<span className='course-number'>{pictureCourseNum}</span>
{incPictureCourseNum > 0 && <span className='icon iconfont'>&#xe635;</span>}
<span className='add-number'>{incPictureCourseNum > 0 ? incPictureCourseNum : 0}</span>
</div>
</div>
<div className='course-item'>
<div className='course-title'>线下课</div>
<div className='data'>
<span className='course-number'>{offlineCourseNum}</span>
{incOfflineCourseNum > 0 && <span className='icon iconfont'>&#xe635;</span>}
<span className='add-number'>{incOfflineCourseNum > 0 ? incOfflineCourseNum : 0}</span>
</div>
</div>
</div>
</div>
</div>
<div className="data-item">
<div className="header">
<img className="header-icon" src="https://image.xiaomaiketang.com/xm/jZf3GNY5tY.png" />
<span className="header-word">培训计划总数 (个)</span>
</div>
<div className="data-number">{trainingPlanNum}</div>
<div className="data-footer">
<span className="footer-word">本月新增</span>
{incTrainingPlanNum > 0 &&
<span className="icon iconfont">&#xe635;</span>
}
<span className="footer-number">{incTrainingPlanNum}</span>
<div className='data-item'>
<div className='header'>
<img className='header-icon' src='https://image.xiaomaiketang.com/xm/jZf3GNY5tY.png' alt='' />
<span className='header-word'>培训计划总数 (个)</span>
</div>
<div className='data-number'>{trainingPlanNum}</div>
<div className='data-footer'>
<span className='footer-word'>本月新增</span>
{incTrainingPlanNum > 0 && <span className='icon iconfont'>&#xe635;</span>}
<span className='footer-number'>{incTrainingPlanNum > 0 ? incTrainingPlanNum : 0}</span>
</div>
</div>
</div>
<div className="data-item">
<div className="header">
<img className="header-icon" src="https://image.xiaomaiketang.com/xm/3CfrPs23Re.png" />
<span className="header-word">考试总数 (个)</span>
</div>
<div className="data-number">{examNum}</div>
<div className="data-footer">
<span className="footer-word">本月新增</span>
{incExamNum > 0 &&
<span className="icon iconfont">&#xe635;</span>
}
<span className="footer-number">{incExamNum}</span>
<div className='data-item'>
<div className='header'>
<img className='header-icon' src='https://image.xiaomaiketang.com/xm/3CfrPs23Re.png' alt='' />
<span className='header-word'>考试总数 (个)</span>
</div>
<div className='data-number'>{examNum}</div>
<div className='data-footer'>
<span className='footer-word'>本月新增</span>
{incExamNum > 0 && <span className='icon iconfont'>&#xe635;</span>}
<span className='footer-number'>{incExamNum > 0 ? incExamNum : 0}</span>
</div>
</div>
</div>
</div>
</div>
<div className="study-wrap">
<div className="home-title">学习概况</div>
<div className="study-box">
<div className="study-item">
<div className="study-title">课程学习排行榜</div>
<div className="study-header">
<div className="study-tab">
<span
<div className='study-wrap'>
<div className='home-title'>学习概况</div>
<div className='study-box'>
<div className='study-item'>
<div className='study-title'>课程学习排行榜</div>
<div className='study-header'>
<div className='study-tab'>
<span
className={`tab${scheduleType === 'LIVE' ? ' selected' : ''}`}
onClick={() => this.setState({ scheduleType: 'LIVE' }, () => this.getHotCourse())}
>直播课</span>
<span
onClick={() => this.setState({ scheduleType: 'LIVE' }, () => this.getHotCourse())}>
直播课
</span>
<span
className={`tab${scheduleType === 'VOICE' ? ' selected' : ''}`}
onClick={() => this.setState({ scheduleType: 'VOICE' }, () => this.getHotCourse())}
>视频课</span>
<span
onClick={() => this.setState({ scheduleType: 'VOICE' }, () => this.getHotCourse())}>
视频课
</span>
<span
className={`tab${scheduleType === 'PICTURE' ? ' selected' : ''}`}
onClick={() => this.setState({ scheduleType: 'PICTURE' }, () => this.getHotCourse())}
>图文课</span>
onClick={() => this.setState({ scheduleType: 'PICTURE' }, () => this.getHotCourse())}>
图文课
</span>
</div>
<div className="study-select">
<span className="select-word">（{moment().subtract(timeRange - 1, 'day').format('MM.DD')} ~ {moment().format('MM.DD')}）</span>
<div className='study-select'>
<span className='select-word'>
（
{moment()
.subtract(timeRange - 1, 'day')
.format('MM.DD')}{' '}
~ {moment().format('MM.DD')}）
</span>
<Select
style={{ width: 88 }}
value={timeRange}
onChange={(value) => {
this.setState({ timeRange: value }, () => this.getHotCourse());
}}
>
<Option value="7">近7天</Option>
<Option value="15">近15天</Option>
<Option value="30">近30天</Option>
}}>
<Option value='7'>近7天</Option>
<Option value='15'>近15天</Option>
<Option value='30'>近30天</Option>
</Select>
</div>
</div>
{_.isEmpty(list) ?
<div className="study-empty">
<img src="https://image.xiaomaiketang.com/xm/52dmait5Bx.png" />
<div>暂无课程上榜</div>
</div>
: list.map((item, index) => (
<div className={`table-item${index % 2 ? '' : ' odd'}`} key={item.id}>
{index < 3 ?
<span className="table-number"><img src={this.showNumber(index)} className="table-image" /></span>
: <span className="table-number">{index + 1}</span>
}
<div className="table-data">
<div className="table-name">
<Tooltip title={item.courseName}>
{item.courseName}
</Tooltip>
<Choose>
<When condition={_.isEmpty(list)}>
<div className='study-empty'>
<img src='https://image.xiaomaiketang.com/xm/52dmait5Bx.png' alt='' />
<div>暂无课程上榜</div>
</div>
</When>
<Otherwise>
{list.map((item, index) => (
<div className={`table-item${index % 2 ? '' : ' odd'}`} key={item.id}>
<Choose>
<When condition={index < 3}>
<span className='table-number'>
<img src={this.showNumber(index)} className='table-image' alt='' />
</span>
</When>
<Otherwise>
<span className='table-number'>{index + 1}</span>
</Otherwise>
</Choose>
<div className='table-data'>
<div className='table-name'>
<Tooltip title={item.courseName}>{item.courseName}</Tooltip>
</div>
<div className='table-tag'>{item.categoryName}</div>
</div>
<div className="table-tag">{item.categoryName}</div>
<span className='table-study'>{item.studyNum || 0}人已学习</span>
</div>
<span className="table-study">{item.studyNum || 0}人已学习</span>
</div>
))
}
))}
</Otherwise>
</Choose>
</div>
<div className="study-item">
<div className="study-title">培训计划完成情况
<Tooltip overlayClassName="data-plan-tooltip" title="若某人加入多个培训计划，则需完成所有已加入的培训计划后，才视为已完成培训">
<span className="iconfont icon">&#xe61d;</span>
</Tooltip>
<span className="tip">(本月)</span>
</div>
{(unfinishedNum || completeNum) ?
<div
className="left-graph-container"
id="mountNode"
style={{ width: '100%', marginLeft: '-20%', marginTop: -30 }}
ref={e => e && (this.width = e.clientWidth)}
>
{this.width && <div>
<Chart
height={400}
width={this.width}
data={dv}
scale={cols}
padding={20}
>
<Coord type={"theta"} radius={0.75} innerRadius={0.6} />
<Axis name="percent" />
<G2Tooltip
showTitle={false}
itemTpl="<li><span style=&quot;background-color:{color};&quot; class=&quot;g2-tooltip-marker&quot;></span>{name}: {value}</li>"
/>
<Guide>
<Html
position={['50%', "50%"]}
html={`<div style="color:#8c8c8c;font-size:14px;text-align: center;width: ${this.width}px;"><span style="color:#333;font-size:20px">${planCustomerNum}人</span><br>新增培训人数</div>`}
alignX="middle"
alignY="middle"
/>
</Guide>
<Geom
type="intervalStack"
position="percent"
color={['item', ['#FFBB54', '#2966FF']]}
tooltip={[
"item*percent",
(item, percent) => {
percent = Math.round(percent * 100) + "%";
return {
name: item,
value: percent,
};
}
]}
style={{
lineWidth: 1,
stroke: "#fff"
}}
>
</Geom>
</Chart>
</div>
}
<div className='study-item'>
<div className='study-title'>
培训计划完成情况
<Tooltip overlayClassName='data-plan-tooltip' title='若某人加入多个培训计划，则需完成所有已加入的培训计划后，才视为已完成培训'>
<span className='iconfont icon'>&#xe61d;</span>
</Tooltip>
<span className='tip'>(本月)</span>
</div>
: <div className="circle-box">
<div className="big-circle">
<div className="small-circle">
<div className="tip-box">
<div style={{ color: '#333', fontSize: '20px', marginBottom: 4 }}>{planCustomerNum}人</div>
<div style={{ color: '#999' }}>新增培训人数</div>
<Choose>
<When condition={unfinishedNum || completeNum}>
<div
className='left-graph-container'
id='mountNode'
style={{ width: '100%', marginLeft: '-20%', marginTop: -30 }}
ref={(e) => e && (this.width = e.clientWidth)}>
{this.width && (
<div>
<Chart height={400} width={this.width} data={dv} scale={cols} padding={20}>
<Coord type={'theta'} radius={0.75} innerRadius={0.6} />
<Axis name='percent' />
<G2Tooltip
showTitle={false}
itemTpl='<li><span style="background-color:{color};" class="g2-tooltip-marker"></span>{name}: {value}</li>'
/>
<Guide>
<Html
position={['50%', '50%']}
html={`<div style="color:#8c8c8c;font-size:14px;text-align: center;width: ${this.width}px;"><span style="color:#333;font-size:20px">${planCustomerNum}人</span><br>新增培训人数</div>`}
alignX='middle'
alignY='middle'
/>
</Guide>
<Geom
type='intervalStack'
position='percent'
color={['item', ['#FFBB54', '#2966FF']]}
tooltip={[
'item*percent',
(item, percent) => {
percent = Math.round(percent * 100) + '%';
return {
name: item,
value: percent,
};
},
]}
style={{
lineWidth: 1,
stroke: '#fff',
}}></Geom>
</Chart>
</div>
)}
</div>
</When>
<Otherwise>
<div className='circle-box'>
<div className='big-circle'>
<div className='small-circle'>
<div className='tip-box'>
<div style={{ color: '#333', fontSize: '20px', marginBottom: 4 }}>{planCustomerNum}人</div>
<div style={{ color: '#999' }}>新增培训人数</div>
</div>
</div>
</div>
</div>
</div>
</Otherwise>
</Choose>
<div className='circle-tip unfinished'>
<div className='spot'></div>
<div className='number'>{unfinishedNum}人</div>
<div className='word'>未完成培训</div>
</div>
<div className='circle-tip finished'>
<div className='spot'></div>
<div className='number'>{completeNum}人</div>
<div className='word'>完成培训</div>
</div>
}
<div className="circle-tip unfinished">
<div className="spot"></div>
<div className="number">{unfinishedNum}人</div>
<div className="word">未完成培训</div>
</div>
<div className="circle-tip finished">
<div className="spot"></div>
<div className="number">{completeNum}人</div>
<div className="word">完成培训</div>
</div>
</div>
</div>
</div>
<div className="study-chart">
<div className="study-title">学习人数与时长
<div className="study-select">
<span className="select-word">（{moment().subtract(studyTimeRange - 1, 'day').format('MM.DD')} ~ {moment().format('MM.DD')}）</span>
<div className='study-chart'>
<div className='study-title'>
学习人数与时长
<div className='study-select'>
<span className='select-word'>
（
{moment()
.subtract(studyTimeRange - 1, 'day')
.format('MM.DD')}{' '}
~ {moment().format('MM.DD')}）
</span>
<Select
style={{ width: 88 }}
value={studyTimeRange}
onChange={(value) => {
this.setState({ studyTimeRange: value }, () => this.getStudyInfo());
}}
>
<Option value="7">近7天</Option>
<Option value="15">近15天</Option>
<Option value="30">近30天</Option>
}}>
<Option value='7'>近7天</Option>
<Option value='15'>近15天</Option>
<Option value='30'>近30天</Option>
</Select>
</div>
</div>
<div className="chart-tip">
<div>学习人数(人)
<Tooltip title="参与任意课程进行学习的人数">
<span className="iconfont icon">&#xe61d;</span>
<div className='chart-tip'>
<div>
学习人数(人)
<Tooltip title='参与任意课程进行学习的人数'>
<span className='iconfont icon'>&#xe61d;</span>
</Tooltip>
</div>
<div>人均学习时长(分钟)</div>
</div>
<div id="chart-id"></div>
<div className="chart-bottom-tip">
<div className="tip-item" style={{ marginRight: 100 }}><span className="student-dot"></span>学习人数</div>
<div className="tip-item"><span className="time-dot"></span>人均学习时长</div>
<div id='chart-id'></div>
<div className='chart-bottom-tip'>
<div className='tip-item' style={{ marginRight: 100 }}>
<span className='student-dot'></span>学习人数
</div>
<div className='tip-item'>
<span className='time-dot'></span>人均学习时长
</div>
</div>
</div>
</div>
)
);
}
}
export default Home;
\ No newline at end of file
export default Home;
src/modules/home/Home.less
......@@ -2,34 +2,35 @@
// padding: 0 16px 16px;
min-width: 1100px;
position: relative;
z-index:3;
z-index: 3;
.g2-tooltip-marker {
border-radius: 50% !important;
}
.home-title {
color: #333;
padding-left:28px;
font-size:16px;
font-weight:bold;
padding-left: 28px;
font-size: 16px;
font-weight: bold;
position: relative;
padding-top:16px;
&::before{
width:4px;
height:12px;
content:'';
background-image: linear-gradient(#2966FF 83.5%, #0ACCA4 16.5%);
display:inline-block;
padding-top: 16px;
&::before {
width: 4px;
height: 12px;
content: '';
background-image: linear-gradient(#2966ff 83.5%, #0acca4 16.5%);
display: inline-block;
position: absolute;
left:16px;
top:22px;
left: 16px;
top: 22px;
}
}
@font-face {
font-family: 'number';
src: url('https://image.xiaomaiketang.com/xm/n2sADd2jY6.TTF');
}
.data-wrap{
background: #FFF;
.data-wrap {
background: #fff;
padding-bottom: 25px;
.data-box {
display: flex;
justify-content: space-between;
......@@ -41,7 +42,7 @@
width: ~'calc(16.67% - 8px)';
padding: 16px;
&.course-data {
width: ~'calc(50% - 24px)';
width: 33%;
}
.header {
display: flex;
......@@ -55,7 +56,7 @@
font-size: 14px;
line-height: 18px;
color: #333;
font-weight:500;
font-weight: 500;
}
}
.data-number {
......@@ -74,7 +75,7 @@
.iconfont {
font-size: 12px;
margin-right: 4px;
color: #EC4B35;
color: #ec4b35;
}
.footer-number {
font-size: 12px;
......@@ -83,17 +84,17 @@
}
.course-box {
border-radius: 4px;
background: #FAFAFA;
background: #fafafa;
height: 124px;
width: 66%;
width: 60%;
position: absolute;
right: 16px;
top: 16px;
padding: 8px 24px 0;
top: 28px;
padding: 8px 0 0;
.course-item {
display: inline-block;
width: 50%;
padding: 4px 0 12px;
padding: 4px 24px 12px;
.course-title {
font-size: 12px;
color: #999;
......@@ -105,6 +106,7 @@
font-size: 16px;
font-family: 'number';
margin-right: 16px;
white-space: nowrap;
}
.course-word {
font-size: 12px;
......@@ -114,11 +116,12 @@
.iconfont {
font-size: 12px;
margin-right: 4px;
color: #EC4B35;
color: #ec4b35;
}
.add-number {
font-size: 12px;
color: #999;
white-space: nowrap;
}
}
}
......@@ -126,9 +129,9 @@
}
}
}
.study-wrap{
background: #FFF;
margin-top:16px;
.study-wrap {
background: #fff;
margin-top: 16px;
.study-box {
display: flex;
justify-content: space-between;
......@@ -148,7 +151,7 @@
margin-bottom: 12px;
.iconfont {
font-size: 14px;
color: #BFBFBF;
color: #bfbfbf;
margin-left: 4px;
}
.tip {
......@@ -169,13 +172,13 @@
color: #666;
cursor: pointer;
&.selected {
color: #2966FF;
color: #2966ff;
&::after {
position: absolute;
width: 24px;
height: 2px;
content: '';
background: #2966FF;
background: #2966ff;
border-radius: 1px;
left: 9px;
bottom: -4px;
......@@ -196,7 +199,7 @@
display: flex;
align-items: center;
&.odd {
background: #FAFAFA;
background: #fafafa;
}
.table-image {
width: 24px;
......@@ -257,7 +260,7 @@
width: 204px;
height: 204px;
border-radius: 102px;
background: #F1F3F6;
background: #f1f3f6;
margin-top: -20px;
.small-circle {
display: flex;
......@@ -280,13 +283,13 @@
&.unfinished {
top: 152px;
.spot {
background: #2966FF;
background: #2966ff;
}
}
&.finished {
top: 232px;
.spot {
background: #FFBB54;
background: #ffbb54;
}
}
.spot {
......@@ -309,7 +312,7 @@
}
}
}
.study-chart {
width: 100%;
height: 432px;
......@@ -352,14 +355,14 @@
align-items: center;
color: #666;
.student-dot {
background: #2966FF;
background: #2966ff;
height: 8px;
width: 8px;
border-radius: 50%;
margin-right: 8px;
}
.time-dot {
background: #FEB613;
background: #feb613;
height: 8px;
width: 8px;
border-radius: 50%;
......@@ -382,7 +385,8 @@
font-size: 14px;
}
.g2-tooltip-list {
li,span {
li,
span {
display: flex;
align-items: center;
font-size: 14px;
......@@ -397,4 +401,4 @@
white-space: nowrap;
max-width: none !important;
}
}
\ No newline at end of file
}
src/modules/home/HomeTip.less 0 → 100644
.home-tip {
.tip {
height: 40px;
background: #FFE7E7;
margin-bottom: 16px;
.content {
font-size: 14px;
color: #666666;
font-weight: 400;
line-height: 40px;
padding-left: 16px;
.renew-btn {
display: inline-block;
width: 80px;
height: 28px;
background: #FF4F4F;
border-radius: 2px;
color: #ffffff;
font-size: 14px;
font-weight: 400;
line-height: 28px;
text-align: center;
cursor: pointer;
margin-left: 8px;
}
}
}
}
\ No newline at end of file
src/modules/home/HomeTip.tsx 0 → 100644
import React, { useContext, useEffect, useState, version } from "react";
import "./HomeTip.less"
import { VersionContext } from "@/store/context";
import ContactWidget from '@/components/ContactWidget';
import { Carousel } from "antd";
import moment from "moment";
export default function HomeTip() {
const [isOverNum, setIsOverNum] = useState<boolean>(false)
const [tipType, setTipType] = useState(0) //0不显示1即将过期2已过期
const [expirationTime, setExpirationTime] = useState("")
const [surplusDay, setSurplusDay] = useState(0)
const versionInfo = useContext(VersionContext)
useEffect(()=> {
if (versionInfo) {
setIsOverNum(versionInfo.userNum === -1 ? false : versionInfo.whetherReachUserNum)
setSurplusDay(versionInfo.surplusDayTime)
setExpirationTime(versionInfo.validEndTime)
if (versionInfo.stateEnum === "NO") {
setTipType(2)
} else if (versionInfo.surplusDayTime === 30 || versionInfo.surplusDayTime <= 7) {
setTipType(1)
}
}
},[versionInfo])
return (
<div className="home-tip">
{
(isOverNum || tipType !== 0) &&
<div className="tip">
<Carousel dotPosition="left" dots={false} autoplay={true} autoplaySpeed={5000}>
{
isOverNum && (
<div className="content">
<span className="icon iconfont" style={{color:"#FF4F4F",marginRight:"8px"}}>&#xe61d;</span>温馨提示：企业使用人数已达上限，将无法新增员工、学员，如需增加人数限制，请联系小麦企学院服务平台。
<ContactWidget placement="bottom" trigger="hover"><div className="renew-btn">立即续费</div></ContactWidget>
</div>
)
}
{
tipType === 2 && (
<div className="content">
<span className="icon iconfont" style={{color:"#FF4F4F",marginRight:"8px"}}>&#xe61d;</span>版本到期提醒：当前企业购买的小麦企学院服务已于{moment(versionInfo?.validEndTimeST).format("YYYY-MM-DD HH:mm:ss")}到期，到期后仍可访问，但功能不可使用，建议尽快续费购买哦~
<ContactWidget placement="bottom" trigger="hover"><div className="renew-btn">立即续费</div></ContactWidget>
</div>
)
}
{
tipType === 1 && (
<div className="content">
<span className="icon iconfont" style={{color:"#FF4F4F",marginRight:"8px"}}>&#xe61d;</span>当前企业购买的小麦企学院服务仅剩{surplusDay}天（于{expirationTime}到期），为了不影响使用，建议尽快续费购买哦~
<ContactWidget placement="bottom" trigger="hover"><div className="renew-btn">立即续费</div></ContactWidget>
</div>
)
}
</Carousel>
</div>
}
</div>
)
}
\ No newline at end of file
src/modules/plan-manage/components/BasicInfo.jsx
/*
* @Author: zhangleyuan
* @Date: 2021-02-20 16:45:51
* @LastEditors: fusanqiasng
* @LastEditTime: 2021-06-01 15:20:33
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-07-06 14:48:54
* @Description: 描述一下
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......@@ -12,7 +12,7 @@ import { withRouter } from 'react-router-dom';
import SelectOperatorModal from '../modal/SelectOperatorModal';
import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepareFileModal';
import Upload from '@/core/upload';
// import PhotoClip from 'photoclip'
import ImgClipModal from '@/components/ImgClipModal'
import './BasicInfo.less';
const { TextArea } = Input;
......@@ -22,6 +22,7 @@ class BasicInfo extends React.Component {
constructor(props) {
super(props);
this.state = {
imageFile: null, // 需要被截取的图片
operatorModalVisible: false,
showSelectFileModal: false,
cutImageBlob: null,
......@@ -71,80 +72,11 @@ class BasicInfo extends React.Component {
}, 1000);
};
handleSelectCover = (file) => {
this.uploadImage(file);
};
//上传图片
uploadImage = (imageFile) => {
const self = this;
this.setState(
{
visible: true,
},
() => {
setTimeout(() => {
const okBtnDom = document.querySelector('#headPicModal');
const options = {
size: [500, 282],
ok: okBtnDom,
maxZoom: 3,
style: {
jpgFillColor: 'transparent',
},
done: function (dataUrl) {
clearTimeout(self.timer);
self.timer = setTimeout(() => {
if (self.state.rotate !== this.rotate() || self.state.scale !== this.scale()) {
console.log(this.scale(), 'scale');
const _dataUrl = this.clip();
const cutImageBlob = self.convertBase64UrlToBlob(_dataUrl);
self.setState({
cutImageBlob,
dataUrl: _dataUrl,
rotate: this.rotate(),
scale: this.scale(),
});
}
}, 500);
const cutImageBlob = self.convertBase64UrlToBlob(dataUrl);
self.setState({
cutImageBlob,
dataUrl,
});
setTimeout(() => {
cutFlag = false;
}, 2000);
},
fail: (failInfo) => {
message.error('图片上传失败了，请重新上传');
},
loadComplete: function (img) {
setTimeout(() => {
const _dataUrl = this.clip();
self.setState({
dataUrl: _dataUrl,
hasImgReady: true,
});
}, 100);
},
};
const imgUrl = `${imageFile.ossUrl}?${new Date().getTime()}`;
if (!this.state.photoclip) {
const _photoclip = new PhotoClip('#headPicModal', options);
_photoclip.load(imgUrl);
this.setState({
photoclip: _photoclip,
});
} else {
this.state.photoclip.clear();
this.state.photoclip.load(imgUrl);
}
}, 200);
}
);
this.setState({
visible: true,
imageFile:file
});
};
//获取resourceId
getSignature = (blob, fileName) => {
Upload.uploadBlobToOSS(blob, 'cover' + new Date().valueOf(), null, 'signInfo').then((signInfo) => {
......@@ -168,16 +100,6 @@ class BasicInfo extends React.Component {
this.props.onChange('coverId', coverId);
}, 1000);
};
// base64转换成blob
convertBase64UrlToBlob = (urlData) => {
const bytes = window.atob(urlData.split(',')[1]);
const ab = new ArrayBuffer(bytes.length);
const ia = new Uint8Array(ab);
for (let i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
}
return new Blob([ab], { type: 'image/png' });
};
limitNumber = (value) => {
if (typeof value === 'string') {
return !isNaN(Number(value)) ? value.replace(/^(0+)|[^\d]/g, '') : '';
......@@ -203,7 +125,7 @@ class BasicInfo extends React.Component {
};
render() {
const { operatorModalVisible, showSelectFileModal, visible, hasImgReady, cutImageBlob } = this.state;
const { operatorModalVisible, showSelectFileModal, visible, hasImgReady, cutImageBlob,imageFile} = this.state;
const { data } = this.props;
const { planName, coverUrl, instro, enableState, operateType, selectOperatorList, percentCompleteLive, percentCompleteVideo, percentCompletePicture } =
data;
......@@ -403,61 +325,9 @@ class BasicInfo extends React.Component {
onSelect={this.handleSelectCover}
/>
)}
<Modal
title='设置图片'
width={1080}
visible={visible}
maskClosable={false}
closeIcon={<span className='icon iconfont modal-close-icon'>&#xe6ef;</span>}
onCancel={() => {
this.setState({ visible: false });
}}
zIndex={10001}
footer={[
<Button
key='back'
onClick={() => {
this.setState({ visible: false });
}}>
重新上传
</Button>,
<Button
key='submit'
type='primary'
disabled={!hasImgReady}
onClick={() => {
if (!cutFlag) {
cutFlag = true;
this.refs.hiddenBtn.click();
}
this.getSignature(cutImageBlob);
}}>
确定
</Button>,
]}>
<div className='clip-box'>
<div
id='headPicModal'
ref='headPicModal'
style={{
width: '500px',
height: '430px',
marginBottom: 0,
}}></div>
<div id='clipBtn' style={{ display: 'none' }} ref='hiddenBtn'></div>
<div className='preview-img'>
<div className='title'>效果预览</div>
<div id='preview-url-box' style={{ width: 500, height: 282 }}>
<img src={this.state.dataUrl} style={{ width: '100%' }} alt='' />
</div>
<div className='tip-box'>
<div className='tip'>温馨提示</div>
<div className='tip'>①预览效果图时可能存在延迟，单击左侧图片刷新即可</div>
<div className='tip'>②设置图片时双击可旋转图片，滚动可放大或缩小图片</div>
</div>
</div>
</div>
</Modal>
{ visible &&
<ImgClipModal visible={visible} imgUrl={imageFile.ossUrl} onConfirm={this.getSignature} onClose={()=>{this.setState({ visible: false });}}/>
}
</div>
);
}
......
src/modules/plan-manage/components/PlanList.jsx
......@@ -8,9 +8,9 @@
*/
import React, { useState } from 'react';
import { Table, Modal, message, Tooltip, Switch, Dropdown } from 'antd';
import { Modal, message, Tooltip, Switch, Dropdown } from 'antd';
import { withRouter } from 'react-router-dom';
import { PageControl, XMTable } from "@/components";
import { PageControl, XMTable } from '@/components';
import PlanService from '@/domains/plan-domain/planService';
import SharePlanModal from '../modal/SharePlanModal';
import { LIVE_SHARE } from '@/domains/course-domain/constants';
......@@ -29,6 +29,7 @@ function PlanList(props) {
key: 'planName',
dataIndex: 'planName',
width: '18%',
fixed: 'left',
render: (val, record) => {
return (
<div className='plan_name_item'>
......@@ -86,7 +87,7 @@ function PlanList(props) {
dataIndex: 'created',
sorter: true,
render: (val) => {
return window.formatDate('YYYY-MM-DD H:i', val);
return <span style={{ whiteSpace: 'nowrap' }}>{window.formatDate('YYYY-MM-DD H:i', val)}</span>;
},
},
{
......@@ -96,12 +97,12 @@ function PlanList(props) {
dataIndex: 'updated',
sorter: true,
render: (val) => {
return window.formatDate('YYYY-MM-DD H:i', val);
return <span style={{ whiteSpace: 'nowrap' }}>{window.formatDate('YYYY-MM-DD H:i', val)}</span>;
},
},
{
title: '参培人数',
width: 76,
width: '10%',
key: 'cultureCustomerNum',
dataIndex: 'cultureCustomerNum',
sorter: true,
......@@ -114,7 +115,7 @@ function PlanList(props) {
key: 'operate',
dataIndex: 'operate',
fixed: 'right',
width: 176,
width: '14.5%',
render: (val, record) => {
return (
<div className='operate'>
......@@ -317,7 +318,7 @@ function PlanList(props) {
scroll={{ x: 1400 }}
className='plan-list-table'
renderEmpty={{
description: <span style={{ display: 'block', paddingBottom: 24 }}>暂无数据</span>
description: <span style={{ display: 'block', paddingBottom: 24 }}>暂无数据</span>,
}}
/>
<div className='box-footer'>
......
src/modules/plan-manage/components/TrainingTask.less
.training-task{
thead{
display:none;
}
.ant-form-item{
margin-bottom:0 !important;
}
.training-task {
thead {
display: none;
}
.ant-form-item {
margin-bottom: 0 !important;
}
.add-task-con{
height: 52px;
background: #F7F8F9;
border-radius: 2px;
padding:16px;
margin-top:16px;
.add-task-btn-disabled{
color:#CCCCCC;
font-size:14px;
}
.add-task-btn{
color: #2966FF;
font-size:14px;
}
.add-task-con {
height: 52px;
background: #f7f8f9;
border-radius: 2px;
padding: 16px;
margin-top: 16px;
.add-task-btn-disabled {
color: #cccccc;
font-size: 14px;
}
.add-task-btn {
color: #2966ff;
font-size: 14px;
}
}
}
.plan-sort-task-item{
.task-con{
display:flex;
padding:16px;
background: #F7F8F9;
.plan-sort-task-item {
.task-con {
display: flex;
padding: 16px;
background: #f7f8f9;
border-radius: 2px;
justify-content: space-between;
align-items: center;
.task-instro{
display:flex;
.task-instro {
display: flex;
align-items: center;
.open-icon{
color:#999999;
font-size:10px;
.open-icon {
color: #999999;
font-size: 10px;
}
.task-name-con{
display:flex;
.task-name-con {
display: flex;
align-items: center;
color:#333333;
font-size:14px;
.number{
margin-right:10px;
margin-left:10px;
color: #333333;
font-size: 14px;
.number {
margin-right: 10px;
margin-left: 10px;
}
.task-name-input{
.task-name-input {
width: 300px;
height: 32px;
background: #FFFFFF;
background: #ffffff;
border-radius: 4px;
}
}
}
}
.operate{
.operate {
display: none;
.operate__item{
cursor:pointer;
margin-left:16px;
color:#666666;
font-size:14px;
.icon{
font-size:14px;
color:#999;
.operate__item {
cursor: pointer;
margin-left: 16px;
color: #666666;
font-size: 14px;
.icon {
font-size: 14px;
color: #999;
}
.text{
margin-left:8px;
.text {
margin-left: 8px;
}
}
}
&:hover{
.operate{
display:block;
&:hover {
.operate {
display: block;
}
}
}
.course-box{
.add-course-con{
padding:16px 51px;
color: #2966FF;
font-size:14px;
.add-course-btn-disabled{
font-size:14px;
color:#ccc;
}
.course-box {
.add-course-con {
padding: 16px 51px;
color: #2966ff;
font-size: 14px;
.add-course-btn-disabled {
font-size: 14px;
color: #ccc;
pointer-events: none;
}
}
}
}
.plan-course-sort-item{
display:flex;
padding:16px 16px 16px 0px;
margin-left:51px;
.plan-course-sort-item {
display: flex;
padding: 16px 16px 16px 0px;
margin-left: 51px;
justify-content: space-between;
align-items: center;
border-bottom:1px dotted #E8E8E8;
&:hover{
.course-operate{
display:block;
border-bottom: 1px dotted #e8e8e8;
&:hover {
.course-operate {
display: block;
}
}
.course-operate{
.course-operate {
display: none;
.operate__item{
cursor:pointer;
margin-left:16px;
color:#666666;
font-size:14px;
.icon{
font-size:14px;
color:#999;
.operate__item {
cursor: pointer;
margin-left: 16px;
color: #666666;
font-size: 14px;
.icon {
font-size: 14px;
color: #999;
}
.text{
margin-left:8px;
.text {
margin-left: 8px;
}
}
}
.course-info{
.ant-form{
display:inline-block;
.course-info {
.ant-form {
display: inline-block;
}
.course-name-input{
margin-right:8px;
.course-name-input {
margin-right: 8px;
}
.course-type{
font-size:11px;
color:#666666;
padding:0px 6px;
border: 1px solid #999999;
margin-right:4px;
border-radius: 2px;
line-height: 16px;
.course-type {
font-size: 11px;
color: #666666;
padding: 0px 6px;
border: 1px solid #999999;
margin-right: 4px;
border-radius: 2px;
line-height: 16px;
}
.course-name{
color:#666666;
font-size:14px;
margin-right:8px;
.course-name {
color: #666666;
font-size: 14px;
margin-right: 8px;
}
.tip{
font-size:14px;
color:#FF4F4F;
margin-right:2px;
.tip {
font-size: 14px;
color: #ff4f4f;
margin-right: 2px;
}
.course-state{
color:#999;
font-size:14px;
.course-state {
color: #999;
font-size: 14px;
}
}
}
src/modules/plan-manage/modal/relatedCourseModal.jsx
......@@ -494,7 +494,7 @@ class SelectOperatorModal extends React.Component {
} else {
_list = _.reject(selectLive, (item) => item.liveCourseId === record.liveCourseId);
}
if (_list.length + currentTaskCourseData.length + selectVideo.length + selectPicture.length > 20) {
if (_list.length + currentTaskCourseData.length + selectVideo.internal.length + selectVideo.external.length + selectPicture.length > 20) {
message.warning('无法继续选择，一个任务最多关联20个课程');
return;
}
......@@ -505,14 +505,14 @@ class SelectOperatorModal extends React.Component {
const { selectVideo, currentTaskCourseData, selectLive, selectPicture, videoCourseDivision } = this.state;
let { [videoCourseDivision]: selectList } = selectVideo;
let otherVideoCourseDivision = videoCourseDivision === 'internal' ? 'external' : 'internal';
let _list = [];
if (selected || !_.find(selectList, (item) => item.id === record.id)) {
_list = _.uniq(selectList.concat([record]), false, (item) => item.id);
} else {
_list = _.reject(selectList, (item) => item.id === record.id);
}
if (_list.length + currentTaskCourseData.length + selectLive.length + selectPicture.length > 20) {
if (_list.length + selectVideo[otherVideoCourseDivision]?.length + currentTaskCourseData.length + selectLive.length + selectPicture.length > 20) {
message.warning('无法继续选择，一个任务最多关联20个课程');
return;
}
......@@ -532,7 +532,7 @@ class SelectOperatorModal extends React.Component {
} else {
_list = _.reject(selectPicture, (item) => item.id === record.id);
}
if (_list.length + currentTaskCourseData.length + selectLive.length + selectVideo.length > 20) {
if (_list.length + currentTaskCourseData.length + selectLive.length + selectVideo.internal.length + selectVideo.external.length > 20) {
message.warning('无法继续选择，一个任务最多关联20个课程');
return;
}
......@@ -757,9 +757,10 @@ class SelectOperatorModal extends React.Component {
} else {
_list = _.reject(selectLive, (item) => _.find(changeRows, (data) => data.liveCourseId === item.liveCourseId));
}
if (_list.length + currentTaskCourseData.length + selectVideo.length + selectPicture.length > 20) {
if (_list.length + currentTaskCourseData.length + selectVideo.internal.length + selectVideo.external.length + selectPicture.length > 20) {
message.warning('无法继续选择，一个任务最多关联20个课程');
const extraLength = _list.length + currentTaskCourseData.length + selectVideo.length + selectPicture.length - 20;
const extraLength =
_list.length + currentTaskCourseData.length + selectVideo.internal.length + selectVideo.external.length + +selectPicture.length - 20;
_list.splice(_list.length - extraLength, extraLength);
}
this.setState({ selectLive: _list });
......@@ -847,14 +848,24 @@ class SelectOperatorModal extends React.Component {
},
onSelectAll: (selected, _selectedRows, changeRows) => {
let _list = [];
let otherVideoCourseDivision = videoCourseDivision === 'internal' ? 'external' : 'internal';
if (selected) {
_list = _.uniq(selectVideo[videoCourseDivision].concat(changeRows), false, (item) => item.id);
} else {
_list = _.reject(selectVideo[videoCourseDivision], (item) => _.find(changeRows, (data) => data.id === item.id));
}
if (_list.length + currentTaskCourseData.length + selectLive.length + selectPicture.length > 20) {
if (
_list.length + selectVideo[otherVideoCourseDivision]?.length + currentTaskCourseData.length + selectLive.length + selectPicture.length >
20
) {
message.warning('无法继续选择，一个任务最多关联20个课程');
const extraLength = _list.length + currentTaskCourseData.length + selectLive.length + selectPicture.length - 20;
const extraLength =
_list.length +
selectVideo[otherVideoCourseDivision]?.length +
currentTaskCourseData.length +
selectLive.length +
selectPicture.length -
20;
_list.splice(_list.length - extraLength, extraLength);
}
this.setState({
......@@ -951,9 +962,10 @@ class SelectOperatorModal extends React.Component {
} else {
_list = _.reject(selectPicture, (item) => _.find(changeRows, (data) => data.id === item.id));
}
if (_list.length + currentTaskCourseData.length + selectVideo.length + selectLive.length > 20) {
if (_list.length + currentTaskCourseData.length + selectVideo.internal.length + selectVideo.external.length + selectLive.length > 20) {
message.warning('无法继续选择，一个任务最多关联20个课程');
const extraLength = _list.length + currentTaskCourseData.length + selectVideo.length + selectLive.length - 20;
const extraLength =
_list.length + currentTaskCourseData.length + selectVideo.internal.length + selectVideo.external.length + selectLive.length - 20;
_list.splice(_list.length - extraLength, extraLength);
}
this.setState({ selectPicture: _list });
......
src/modules/prepare-lesson/modal/SelectPrepareFileModal.jsx
......@@ -436,7 +436,7 @@ class SelectPrepareFileModal extends React.Component {
selectType,
multiple,
accept = ".ppt,.pptx,.doc,.docx,.pdf,.jpg,.jpeg,.png,.mp3,.mp4,.xlsx,.xls",
tooltip = '支持文件类型：ppt、word、excel、pdf、jpg、jpeg、png、mp3、mp4'
tooltip = '支持文件类型：ppt、word、excel、pdf、jpg、jpeg、png、mp3、mp4，支持批量上传文件'
} = this.props;
const selectedFileLength = selectedFileList.length;
......
src/modules/resource-disk/components/FolderList.jsx
......@@ -809,7 +809,7 @@ class FolderList extends React.Component {
<Choose>
<When condition={hasManagementAuthority}>
<div className="lottie-icon-title">你还没有上传文件，点击
<Tooltip title="支持文件类型：ppt、word、excel、pdf、jpg、mp3、mp4">
<Tooltip title="支持文件类型：ppt、word、excel、pdf、jpg、mp3、mp4，上传后默认私密，可邀请其他成员协作，支持批量上传文件">
<span
className="upload-btn"
onClick={this.handleChooseFile}
......
src/modules/resource-disk/components/OperateArea.jsx
......@@ -314,7 +314,7 @@ class OperateArea extends React.Component {
accept=".ppt,.pptx,.doc,.docx,.pdf,.jpg,.jpeg,.png,.mp3,.mp4,.xlsx,.xls"
onChange={(e) => this.handleUpload(e)}
/>
<Tooltip title="支持文件类型：ppt、word、excel、pdf、jpg、mp3、mp4，上传后默认私密，可邀请其他成员协作">
<Tooltip title="支持文件类型：ppt、word、excel、pdf、jpg、mp3、mp4，上传后默认私密，可邀请其他成员协作，支持批量上传文件">
<Button
type={!showResultPage?"primary":""}
disabled={showResultPage}
......
src/modules/root/App.tsx
......@@ -14,7 +14,8 @@ import Main from './Main'
import zhCN from 'antd/es/locale/zh_CN'
import User from '@/common/js/user';
import BaseService from "@/domains/basic-domain/baseService";
import { XMContext } from '@/store/context';
import moment from 'moment';
import { VersionContext, VersionInfo, XMContext } from '@/store/context';
import { setStoreGroupPermission, setStorePermission, setStoreGroupList, setStoreList } from '@/store/actions/index';
import Service from "@/common/js/service";
import Bus from '@/core/tbus';
......@@ -27,6 +28,7 @@ declare var window: any;
const App: React.FC = (props: any) => {
const [storeUserId, setStoreUserId] = useState('')
const ctx: any = useContext(XMContext);
const [versionInfo, setVersionInfo] = useState<VersionInfo|null>(null)
const userId = User.getUserId();
const [menuType, setMenuType] = useState(true);
const enterpriseId = User.getEnterpriseId();
......@@ -35,6 +37,7 @@ const App: React.FC = (props: any) => {
useEffect(() => {
getStoreAndUserInfo();
getVersion();
if (window.location.hash === "#/") {
window.RCHistory.replace({
pathname: '/home',
......@@ -58,6 +61,26 @@ const App: React.FC = (props: any) => {
}
});
}
function getVersion() {
BaseService.getLesseeVersionMsg().then((res) => {
let version = res.result;
User.setVersion(version);
User.setExpirationTime(res.result.validEndTime)
let versioninfo:VersionInfo = {
dayTime: version.dayTime,
stateEnum: version.stateEnum,
userNum: version.userNum === -1 ? '不限人数' : version.userNum,
surplusUserNum: version.userNum === -1 ? '不限人数' : version.surplusUserNum,
surplusDayTime: version.surplusDayTime,
validEndTime: moment(version.validEndTime).format('YYYY-MM-DD'),
validStartTime: moment(version.validStartTime).format('YYYY-MM-DD'),
validEndTimeST: version.validEndTime,
validStartTimeST: version.validStartTime,
whetherReachUserNum: version.whetherReachUserNum,
};
setVersionInfo(versioninfo)
});
}
async function getStoreAndUserInfo() {
await (enterpriseId ? getStoreInfo() : getStoreGroupAndStoreList());
......@@ -147,10 +170,13 @@ const App: React.FC = (props: any) => {
</Layout>
</Layout> */}
<Header id="app" handleMenuType={handleMenuType} menuType={menuType} />
<ConfigProvider locale={zhCN} autoInsertSpaceInButton={false}>
<Main menuType={menuType} />
</ConfigProvider>
<Menu menuType={menuType} handleMenuType={handleMenuType} />
<VersionContext.Provider value={versionInfo}>
<ConfigProvider locale={zhCN} autoInsertSpaceInButton={false}>
<Main menuType={menuType} />
</ConfigProvider>
<Menu menuType={menuType} handleMenuType={handleMenuType} />
</VersionContext.Provider>
</div>
)
}
......
src/modules/root/CollegeManagePage.jsx
import React from 'react';
import React, { useEffect, useState } from 'react';
import moment from "moment"
import Service from "@/common/js/service";
import BaseService from "@/domains/basic-domain/baseService";
import User from "@/common/js/user";
import { LIVE_SHARE } from "@/domains/course-domain/constants";
import moment from 'moment';
import { Modal, message } from 'antd';
import './CollegeManagePage.less';
import storage from '@/common/js/storage';
const roleMap = {
CloudManager: "管理员",
......@@ -14,6 +15,97 @@ const roleMap = {
CloudOperator: '运营师',
};
function ExpirationPopover(props) {
const [showType, setShowType] = useState(0); //0不显示，1剩余30天，2小于等于7天，3已过期
useEffect(()=> {
if (props.surplusDayTime === 0 ) {
//已过期
let loginflag = storage.get("expiration_tip_login")
if (loginflag === null || loginflag === "true") {
//只有登陆进来的时候提示一次
setShowType(3)
}
return
}
//即将过期
if (props.surplusDayTime === 30 || props.surplusDayTime <= 7) {
let daysflag = storage.get("expiration_tip"+User.getUserId()+"_days")
if (daysflag === null || daysflag !== moment().format("YYYYMMDD")) {
setShowType(2)
}
}
// if (props.surplusDayTime === 30) {
// if (storage.get("expiration_tip"+User.getUserId()+"_thirty") == null || storage.get("expiration_tip"+User.getUserId()+"_thirty") === "true") {
// setShowType(1)
// }
// return
// }
// if (props.surplusDayTime <= 7) {
// let daysflag = storage.getObj("expiration_tip"+User.getUserId()+"_7day");
// if (!daysflag) {
// setShowType(2)
// return
// }
// if (daysflag[props.surplusDayTime - 1] === 0) {
// setShowType(2)
// }
// }
},[props.endTime,props.surplusDayTime])
function iknow() {
storage.set("expiration_tip_login",false)
storage.set("expiration_tip"+User.getUserId()+"_days",moment().format("YYYYMMDD"))
/*
if (props.surplusDayTime === 0 ) {
//已过期
storage.set("expiration_tip_login",false)
} else if (props.surplusDayTime === 30) {
storage.set("expiration_tip"+User.getUserId()+"_thirty",false)
} else if (props.surplusDayTime <= 7) {
let daysflag = [0,0,0,0,0,0,0]
daysflag[props.surplusDayTime - 1] = 1
storage.setObj("expiration_tip"+User.getUserId()+"_7day",daysflag)
}
*/
setShowType(0)
}
if (props.surplusDayTime > 30) {
return ("")
}
return (
<>
{
showType === 0 ? ("") :(
<div className="expirationpopover">
<div className="dialog">
<div className="title">{props.surplusDayTime === 0 ? "服务已到期":"服务到期提醒"}</div>
{
showType === 3 ? (
<div className="tip-text">当前企业购买的小麦企学院服务已于<span style={{color:"#FF4F4F"}}>{moment(props.endTime).format("YYYY-MM-DD HH:mm:ss")}</span>到期，到期后仍可访问，但功能不可使用，建议尽快续费购买哦~</div>
) : (
<div className="tip-text">当前企业购买的小麦企学院服务 <span style={{color:"#FF4F4F"}}>仅剩{props.surplusDayTime}天</span>（于<span>{moment(props.endTime).format("YYYY-MM-DD")}</span>到期），为了不影响使用，建议尽快续费购买哦~</div>
)
}
<div className="qrcode">
<img src="https://cdn.xiaomai5.com/qixueyuankehu.png" alt=""></img>
<div className="des">微信/企业微信扫码咨询</div>
</div>
<div className="phone"><svg style={{position:"relative",top:"2px",marginRight:"4px"}} viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path d="M512.651 3.78c-281.433 0-509.21 228.324-509.21 509.209 0 281.43 228.325 509.203 509.21 509.203 281.427 0 509.202-228.317 509.202-509.203 0.55-280.885-227.775-509.21-509.202-509.21z m198.205 743.553c-36.14 36.136-169.737 1.641-302.24-130.312-131.953-131.959-165.902-266.104-129.768-301.695 31.211-31.21 68.99-85.417 125.939-14.782 56.943 70.629 29.016 90.34-3.291 122.647-22.449 22.448 24.642 79.392 73.37 128.125 49.283 48.73 105.678 95.818 128.126 73.368 32.306-32.305 52.017-60.23 122.646-3.288 71.182 56.949 16.426 95.276-14.782 125.937z" p-id="4409" fill="#999999"></path></svg>
咨询电话：19157875632</div>
<div className="button" onClick={iknow}>我知道了</div>
</div>
</div>
)
}
</>
)
}
export default class CollegeManagePage extends React.Component {
constructor(props) {
super(props);
......@@ -24,13 +116,16 @@ export default class CollegeManagePage extends React.Component {
enterpriseId: User.getEnterpriseId(),
isAdmin: false,
createStoreList:[],
joinStoreList:[]
joinStoreList:[],
surplusDayTime:365, //剩余天数
endTime: 0, //有效截至时间
};
}
componentDidMount() {
this.getStoreList();
this.getEnterpriseUser();
this.getVersion()
}
getEnterpriseUser() {
......@@ -44,6 +139,18 @@ export default class CollegeManagePage extends React.Component {
this.setState({ name, avatar, isAdmin })
});
}
getVersion() {
BaseService.getLesseeVersionMsg()
.then(res=> {
User.setVersion(res.result)
User.setExpirationTime(res.result.validEndTime)
this.setState({
surplusDayTime: res.result.stateEnum === "NO" ? 0 : res.result.surplusDayTime,
endTime: res.result.validEndTime
})
})
}
getStoreList() {
const { enterpriseId } = this.state;
......@@ -132,6 +239,7 @@ export default class CollegeManagePage extends React.Component {
} = this.state;
return (
<div className="college-manage-page">
<ExpirationPopover surplusDayTime={this.state.surplusDayTime} endTime={this.state.endTime}/>
<div className="college-header">
<div className="box">
<img className="box-image" src="https://image.xiaomaiketang.com/xm/fe4NCjr7XF.png" />
......
src/modules/root/CollegeManagePage.less
......@@ -183,4 +183,78 @@
}
}
}
.expirationpopover {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: rgba(0,0,0,0.7);
z-index: 1000;
.dialog {
width: 560px;
height: 486px;
background: #FFFFFF;
border-radius: 4px;
.title {
text-align: center;
font-size: 20px;
color: #333333;
font-weight: 500;
margin-top: 40px;
}
.tip-text {
font-size: 16px;
color: #666666;
font-weight: 400;
margin-top: 16px;
margin-right: 40px;
margin-left: 40px;
}
.qrcode {
width: 182px;
height: 204px;
background: #F1F3F6;
border-radius: 2px;
margin-top: 16px;
margin-left: auto;
margin-right: auto;
img {
width: 150px;
height: 150px;
margin: 16px 16px 8px 16px;
}
.des {
text-align: center;
font-size: 14px;
color: #333333;
font-weight: 400;
}
}
.phone {
text-align: center;
font-size: 14px;
color: #333333;
font-weight: 400;
margin-top: 16px;
}
.button {
width: 80px;
height: 32px;
background: #2966FF;
cursor: pointer;
margin-left: auto;
margin-right: auto;
margin-top: 24px;
font-size: 14px;
font-weight: 400;
color: #ffffff;
line-height: 32px;
text-align: center;
}
}
}
}
\ No newline at end of file
src/modules/root/CreateCollege.jsx
......@@ -5,6 +5,7 @@ import Service from "@/common/js/service";
import BaseService from "@/domains/basic-domain/baseService";
import User from "@/common/js/user";
import Breadcrumbs from "@/components/Breadcrumbs";
import ImgClipModal from '@/components/ImgClipModal'
import './CreateCollege.less';
let cutFlag = false;
......@@ -18,6 +19,7 @@ export default class CreateCollege extends React.Component {
logo: 'https://image.xiaomaiketang.com/xm/fe4NCjr7XF.png',
name: '',
enterpriseId: User.getEnterpriseId(),
imageFile: null, // 需要被截取的图片
};
this.loginInputRef = React.createRef()
}
......@@ -46,95 +48,14 @@ export default class CreateCollege extends React.Component {
handleSelectCover = (e) => {
const imageFile = e.target.files[0];
Upload.uploadBlobToOSS(imageFile, 'cover' + (new Date()).valueOf()).then((url) => {
this.uploadImage({ folderName: imageFile.name, ossUrl: url });
this.setState({
visible: true,
imageFile:{ folderName: imageFile.name, ossUrl: url }
});
// this.uploadImage({ folderName: imageFile.name, ossUrl: url });
})
}
//上传图片
uploadImage = (imageFile) => {
const { folderName } = imageFile;
const fileName = window.random_string(16) + folderName.slice(folderName.lastIndexOf("."));
const self = this;
this.setState(
{
visible: true,
},
() => {
setTimeout(() => {
const okBtnDom = document.querySelector("#headPicModal");
const options = {
size: [500, 128],
ok: okBtnDom,
maxZoom: 3,
style: {
jpgFillColor: "transparent",
},
done: function (dataUrl) {
clearTimeout(self.timer);
self.timer = setTimeout(() => {
if ((self.state.rotate != this.rotate()) || (self.state.scale != this.scale())) {
const _dataUrl = this.clip()
const cutImageBlob = self.convertBase64UrlToBlob(_dataUrl);
self.setState({
cutImageBlob,
dataUrl: _dataUrl,
rotate: this.rotate(),
scale: this.scale()
})
}
}, 500)
const cutImageBlob = self.convertBase64UrlToBlob(dataUrl);
self.setState({
cutImageBlob,
dataUrl
})
setTimeout(() => {
cutFlag = false;
}, 2000);
},
fail: (failInfo) => {
message.error("图片上传失败了，请重新上传");
},
loadComplete: function (img) {
setTimeout(() => {
const _dataUrl = this.clip()
self.setState({
dataUrl: _dataUrl,
hasImgReady: true
})
}, 100)
},
};
const imgUrl = `${imageFile.ossUrl}?${new Date().getTime()}`
if (!this.state.photoclip) {
const _photoclip = new PhotoClip("#headPicModal", options);
_photoclip.load(imgUrl);
this.setState({
photoclip: _photoclip,
});
} else {
this.state.photoclip.clear();
this.state.photoclip.load(imgUrl);
}
}, 200);
}
);
};
// base64转换成blob
convertBase64UrlToBlob = (urlData) => {
const bytes = window.atob(urlData.split(",")[1]);
const ab = new ArrayBuffer(bytes.length);
const ia = new Uint8Array(ab);
for (let i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
}
return new Blob([ab], { type: "image/png" });
};
//获取resourceId
getSignature = (blob, fileName) => {
......@@ -184,6 +105,7 @@ export default class CreateCollege extends React.Component {
hasImgReady,
cutImageBlob,
showError,
imageFile
} = this.state;
return (
<div className="college-manage-page">
......@@ -247,65 +169,9 @@ export default class CreateCollege extends React.Component {
style={{ display: "none" }}
onChange={this.handleSelectCover}
/>
<Modal
title="设置图片"
width={1080}
visible={visible}
maskClosable={false}
closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
onCancel={() => {
this.setState({ visible: false });
}}
zIndex={10001}
footer={[
<Button
key="back"
onClick={() => {
this.setState({ visible: false });
}}
>
重新上传
</Button>,
<Button
key="submit"
type="primary"
disabled={!hasImgReady}
onClick={() => {
if (!cutFlag) {
cutFlag = true;
this.refs.hiddenBtn.click();
}
this.getSignature(cutImageBlob);
}}
>
确定
</Button>,
]}
>
<div className="clip-box">
<div
id="headPicModal"
ref="headPicModal"
style={{
width: "500px",
height: "430px",
marginBottom: 0,
}}
></div>
<div id="clipBtn" style={{ display: "none" }} ref="hiddenBtn"></div>
<div className="preview-img">
<div className="title">效果预览</div>
<div id="preview-url-box" style={{width:500,height:128}}>
<img src={this.state.dataUrl} style={{ width: '100%' }} alt="" />
</div>
<div className="tip-box">
<div className="tip">温馨提示</div>
<div className="tip">①预览效果图时可能存在延迟，单击左侧图片刷新即可</div>
<div className="tip">②设置图片时双击可旋转图片，滚动可放大或缩小图片</div>
</div>
</div>
</div>
</Modal>
{ visible &&
<ImgClipModal visible={visible} imgUrl={imageFile.ossUrl} aspectRatio='125/32' cropBoxHeight='128' onConfirm={this.getSignature} onClose={()=>{this.setState({ visible: false });}}/>
}
</div>
)
}
......
src/modules/root/Header.jsx
/*
* @Author: 吴文洁
* @Date: 2019-09-10 18:26:03
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-06-24 19:28:14
* @LastEditors: yuananting
* @LastEditTime: 2021-07-06 14:37:49
* @Description:
*/
import React, { useRef, useContext, useEffect, useState } from 'react';
......@@ -271,14 +271,14 @@ function Header(props) {
onChange={(e) => {
setStoreId(e.target.value);
User.setStoreId(e.target.value);
list.map((item)=>{
if(item.id === e.target.value){
list.map((item) => {
if (item.id === e.target.value) {
User.setStoreUserId(item.storeUserId);
}
})
});
User.setUserId(User.getUserId());
User.setToken(User.getToken());
User.setEnterpriseId(User.getEnterpriseId())
User.setEnterpriseId(User.getEnterpriseId());
window.RCHistory.push('/home');
window.location.reload();
}}
......@@ -320,10 +320,10 @@ function Header(props) {
</div>
)}
<div className='right-box'>
<div className='right-bg-img'>
<img src='https://image.xiaomaiketang.com/xm/WCwjyyXYda.png'></img>
</div>
<div className='link-to-store'>
<div className='right-bg-img'>
<img src='https://image.xiaomaiketang.com/xm/WCwjyyXYda.png'></img>
</div>
<div className='link'>
<span className='link-btn'>
<span className='icon iconfont tool-tip-right'>&#xe85d;</span>
......
src/modules/root/Header.less
......@@ -196,7 +196,6 @@
margin-left: 62px;
.college-container {
position: relative;
width: 360px;
height: 50px;
display: flex;
align-items: center;
......@@ -310,13 +309,9 @@
display: flex;
align-items: center;
}
.right-bg-img {
img {
width: 277px;
height: 60px;
}
}
.link-to-store {
position: relative;
display: flex;
height: 49px;
line-height: 49px;
......@@ -329,6 +324,14 @@
.iconfont {
color: #fff;
}
.right-bg-img {
position: absolute;
right: 347px;
img {
width: 277px;
height: 60px;
}
}
.link {
cursor: pointer;
position: relative;
......@@ -346,7 +349,7 @@
width: 216px;
height: 260px;
top: 49px;
left: 0;
left: -50px;
background-color: #fff;
flex-wrap: wrap;
box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1);
......
src/modules/root/Login.jsx
......@@ -7,6 +7,7 @@ import User from '@/common/js/user';
import WechatLogin from './WechatLogin';
import BaseService from '@/domains/basic-domain/baseService';
import axios from 'axios';
import storage from '@/common/js/storage';
import _ from 'underscore';
import user from '@/common/js/user';
const { TabPane } = Tabs;
......@@ -34,6 +35,7 @@ function Login(props) {
User.removeUserId();
User.removeToken();
User.removeEnterpriseId();
storage.set("expiration_tip_login",true)
}, []);
function getWXWorkLoginNoCheck(enterpriseId, userId) {
const params = {
......
src/modules/root/Menu.less
......@@ -5,7 +5,7 @@
@active-color: #2966ff;
.left-container {
position: absolute;
z-index: 2;
z-index: 10;
top: @top-height;
left: 0;
bottom: 0;
......@@ -51,12 +51,13 @@
display: -webkit-flex;
flex-direction: column;
-webkit-flex-direction: column;
height: calc(~'100% - 60px');
.nav {
-webkit-flex: 1;
cursor: default;
font-size: 16px;
height: calc(~'100% - 72px');
height: calc(~'100% - 84px');
overflow: auto;
&::-webkit-scrollbar {
display: none;
......@@ -134,6 +135,121 @@
color: #5e606a;
}
}
.version-info {
// position: absolute;
height: 84px;
bottom: 0;
width: 180px;
cursor: pointer;
// z-index: 10;
padding-top: 10px;
background-color: white;
.row-1 {
width: fit-content;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
line-height: 20px;
margin: 0 auto;
.version-name {
display: inline-block;
width: 58px;
text-align: center;
color: #333333;
margin: 0 auto;
border-radius: 2px;
border: 1px solid #E8E8E8;
}
.renew {
display: inline-block;
width: 58px;
color: #2966FF;
margin-left: 8px;
}
}
.expiration-time {
height: 24px;
text-align: center;
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
line-height: 22px;
margin: 6px auto 0 auto;
}
.popover {
display: none;
position: absolute;
z-index: 100;
padding: 16px 22px;
bottom: 22px;
width: 352px;
height: 198px;
right: -342px;
background: #FFFFFF;
box-shadow: 0px 2px 15px 0px rgba(0, 0, 0, 0.06);
.title {
display: inline-block;
width: 68px;
height: 22px;
font-size: 16px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
line-height: 22px;
margin-right: 8px;
}
.expiration-tag {
display: inline-block;
width: 52px;
height: 18px;
background: #EEEEEE;
border-radius: 2px;
text-align: center;
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
line-height: 17px;
}
&::before {
position: absolute;
content: "";
width: 16px;
height: 16px;
left: -8px;
top: 80%;
border: 8px solid transparent;
box-shadow: 0px 2px 15px 0px rgba(0, 0, 0, 0.06);
}
.content {
margin-top: 24px;
.widget {
display: inline-block;
}
.lable {
font-size: 14px;
font-weight: 400;
color: #999999;
line-height: 22px;
}
.lable-text {
margin-top: 4px;
font-size: 16px;
font-weight: 500;
color: #333333;
line-height: 22px;
}
}
}
.popover-show {
display: block;
}
}
}
&.left-container-vertical {
......@@ -155,7 +271,9 @@
// display:inline-block;
// }
// }
}
.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
background: @active-color !important;
}
......
src/modules/root/Menu.tsx
import User from '@/common/js/user';
import React, { Key, useContext, useEffect, useRef, useState, useMemo } from 'react';
import {
withRouter,
} from 'react-router-dom';
import { Menu, Popover, Tooltip } from 'antd';
import { RightOutlined } from '@ant-design/icons';
import { menuList } from '../../routes//config/menuList';
import { XMContext, VersionContext } from '../../store/context';
import BaseService from '@/domains/basic-domain/baseService';
import StoreService from '@/domains/store-domain/storeService';
import { Menu } from 'antd';
import React, { Key, useContext, useEffect, useMemo, useState } from 'react';
import { withRouter } from 'react-router-dom';
import classNames from 'classnames';
import User from "@/common/js/user"
import _ from 'underscore';
import { menuList } from '../../routes//config/menuList';
import { XMContext } from '../../store/context';
import './Menu.less';
import tBus from '@/core/tbus'
import "./Menu.less";
import { display } from 'html2canvas/dist/types/css/property-descriptors/display';
import ContactWidget from '@/components/ContactWidget';
const { SubMenu } = Menu;
function VersionPanel(props: any) {
const [versionName, setVersionName] = useState('标准版');
const [showVersionPopover, setShowVersionPopover] = useState(false);
const [showRenewPopover, setShowRenewPopover] = useState(false);
const versionInfo = useContext(VersionContext);
function onVersionEnter() {
setShowVersionPopover(true)
}
function onVersionLeave() {
setShowVersionPopover(false)
setShowRenewPopover(false)
}
function onRenewClick() {
setShowRenewPopover(true)
setShowVersionPopover(false)
}
const versionPopoverClass = classNames({
'popover':true,
'popover-show':showVersionPopover
})
return (
<div className='version-info' onMouseEnter={onVersionEnter} onMouseLeave={onVersionLeave}>
<div className='row-1'>
<div className='version-name'>{versionName}</div>
<ContactWidget trigger='click' placement='rightBottom' visible={showRenewPopover}>
<div className='renew' onClick={onRenewClick}>
去续费
<span className='icon iconfont' style={{ fontSize: '10px' }}>
&#59291;
</span>
</div>
</ContactWidget>
</div>
<div className='expiration-time'>
有效期至{versionInfo?.validEndTime}
{versionInfo?.stateEnum === "NO" ? '(已过期)' : ''}
</div>
<div className={versionPopoverClass}>
<div className='title'>版本信息</div>
{versionInfo?.stateEnum === "NO" ? <div className='expiration-tag'>已过期</div> : ''}
<div className='content'>
<div className='widget' style={{ marginRight: '26px', marginBottom: '16px', width: '70px' }}>
<div className='lable'>剩余天数</div>
<div className='lable-text'>{versionInfo?.surplusDayTime}</div>
</div>
<div className='widget' style={{ marginBottom: '16px', width:"212px"}}>
<div className='lable'>有效起止日期</div>
<div className='lable-text'>
{versionInfo?.validStartTimeST === versionInfo?.validEndTimeST ? "-" : `${versionInfo?.validStartTime}~${versionInfo?.validEndTime}`}
</div>
</div>
<div className='widget' style={{ marginRight: '26px', marginBottom: '8px', width: '70px' }}>
<div className='lable'>剩余人数</div>
<div className='lable-text'>{versionInfo?.surplusUserNum}</div>
</div>
<div className='widget' style={{ marginBottom: '8px' }}>
<div className='lable' style={{ display: 'inline-block' }}>
人数限制
</div>
<Tooltip
overlayStyle={{ maxWidth: '587px', width: '587px' }}
placement='topLeft'
arrowPointAtCenter
title={() => {
return (
<div>
<div>1、若员工/学员存在多个学院，企业人数只统计为1人；</div>
<div>2、若一个学员既用「企业微信」登录学习又用「微信」登录学习，企业人数将统计为2人。</div>
</div>
);
}}>
<div style={{ display: 'inline-block', position: 'relative', top: '2px', marginLeft: '4px' }}>
<span>
<svg viewBox='0 0 1024 1024' version='1.1' xmlns='http://www.w3.org/2000/svg' p-id='1026' width='14' height='14'>
<path
d='M512 68.266667c245.111467 0 443.733333 198.656 443.733333 443.733333s-198.621867 443.733333-443.733333 443.733333C266.922667 955.733333 68.266667 757.077333 68.266667 512S266.922667 68.266667 512 68.266667z m29.320533 596.548266c0.477867-27.989333 2.4576-48.196267 5.802667-60.654933 3.413333-12.458667 8.567467-23.4496 15.633067-33.0752 6.997333-9.557333 21.9136-24.507733 44.714666-44.714667 33.928533-30.037333 56.797867-55.637333 68.437334-76.5952a139.1616 139.1616 0 0 0 17.5104-68.846933c0-43.008-16.5888-79.701333-49.800534-110.011733-33.1776-30.378667-77.6192-45.533867-133.358933-45.533867-52.6336 0-94.958933 14.1312-126.976 42.3936-31.9488 28.2624-51.268267 68.949333-57.685333 122.094933l71.8848 8.533334c6.212267-39.6288 19.3536-68.778667 39.3216-87.483734 19.933867-18.6368 44.817067-27.989333 74.6496-27.989333 30.788267 0 56.900267 10.308267 78.165333 30.9248 21.265067 20.5824 31.880533 44.544 31.880533 71.748267 0 15.018667-3.618133 28.910933-10.922666 41.608533-7.168 12.731733-22.971733 29.764267-47.240534 51.131733-24.200533 21.367467-41.028267 37.649067-50.346666 48.810667-12.6976 15.291733-21.9136 30.481067-27.613867 45.533867-7.748267 19.933867-11.639467 43.690667-11.639467 71.133866 0 4.676267 0.1024 11.707733 0.341334 21.026134h67.242666z m8.192 140.3904v-79.735466h-79.701333v79.735466h79.701333z'
fill='#bfbfbf'
p-id='1027'></path>
</svg>
</span>
</div>
</Tooltip>
<div className='lable-text'>{versionInfo?.userNum}</div>
</div>
</div>
</div>
</div>
)
}
function Aside(props: any) {
const { menuType, handleMenuType } = props;
const ctx: any = useContext(XMContext);
......@@ -35,11 +139,20 @@ function Aside(props: any) {
});
}
return item;
});
}, [props.location.pathname]);
useEffect(() => {
getTopLeftLogo();
}, []);
})
}, [props.location.pathname])
useEffect(()=> {
getTopLeftLogo()
tBus.bind("updateCollegeInfo",updateCollegeInfo)
return ()=> {
tBus.unbind("updateCollegeInfo",updateCollegeInfo)
}
},[])
function updateCollegeInfo() {
getTopLeftLogo()
}
function getTopLeftLogo() {
if (User.getToken()) {
......@@ -178,7 +291,11 @@ function Aside(props: any) {
})}
</Menu>
</div>
</div>
{
menuType ? <VersionPanel /> : ""
}
</div>
</div>
);
}
......
src/modules/store-manage/StoreH5DecorationTab.jsx
/*
* @Author: wufan
* @Date: 2020-11-30 10:47:38
* @LastEditors: wufan
* @LastEditTime: 2021-06-21 11:16:21
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-07-08 19:35:17
* @Description: web学院banner页面
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......@@ -25,6 +25,7 @@ import "./StoreDecorationPage.less";
import Upload from "@/core/upload";
import { XMTable } from '@/components';
import college from '@/common/lottie/college';
import ImgClipModal from '@/components/ImgClipModal'
const { confirm } = Modal;
const DragHandle = sortableHandle(() => (
......@@ -51,7 +52,8 @@ class StoreH5Decoration extends React.Component {
photoclip: null,
preview: "",
cutImageBlob: null,
hasImgReady: false // 图片是否上传成功
hasImgReady: false, // 图片是否上传成功
imageFile: null // 需要被截取的图片
};
}
......@@ -208,88 +210,16 @@ class StoreH5Decoration extends React.Component {
// 选择云盘资源
handleSelectImg = (file) => {
this.setState({
showSelectFileModal: false,
});
this.uploadImage(file);
};
//上传图片
uploadImage = (imageFile) => {
const self = this;
this.setState(
{
if(file){
this.setState({
visible: true,
},
() => {
setTimeout(() => {
const okBtnDom = document.querySelector("#headPicModal");
const options = {
size: [500, 172],
ok: okBtnDom,
maxZoom: 3,
style: {
jpgFillColor: "transparent",
},
done: function (dataUrl) {
clearTimeout(self.timer);
self.timer = setTimeout(() => {
if ((self.state.rotate != this.rotate()) || (self.state.scale != this.scale())) {
console.log(this.scale(), 'scale')
const _dataUrl = this.clip()
const cutImageBlob = self.convertBase64UrlToBlob(_dataUrl);
self.setState({
cutImageBlob,
dataUrl: _dataUrl,
rotate: this.rotate(),
scale: this.scale()
})
}
}, 500)
const cutImageBlob = self.convertBase64UrlToBlob(dataUrl);
self.setState({
cutImageBlob,
dataUrl
})
setTimeout(() => {
cutFlag = false;
}, 2000);
},
fail: (failInfo) => {
message.error("图片上传失败了，请重新上传");
},
loadComplete: function (img) {
setTimeout(() => {
const _dataUrl = this.clip()
self.setState({
dataUrl: _dataUrl,
hasImgReady: true
})
}, 100)
},
};
const imgUrl = `${imageFile.ossUrl}?${new Date().getTime()}`
if (!this.state.photoclip) {
const _photoclip = new PhotoClip("#headPicModal", options);
_photoclip.load(imgUrl);
this.setState({
photoclip: _photoclip,
});
} else {
this.state.photoclip.clear();
this.state.photoclip.load(imgUrl);
}
}, 200);
}
);
imageFile:file
});
}
};
//获取resourceId
getSignature = (blob) => {
Upload.uploadBlobToOSS(blob, "avatar" + new Date().valueOf()).then(
......@@ -344,16 +274,6 @@ class StoreH5Decoration extends React.Component {
});
};
// base64转换成blob
convertBase64UrlToBlob = (urlData) => {
const bytes = window.atob(urlData.split(",")[1]);
const ab = new ArrayBuffer(bytes.length);
const ia = new Uint8Array(ab);
for (let i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
}
return new Blob([ab], { type: "image/png" });
};
render() {
const {
......@@ -362,7 +282,8 @@ class StoreH5Decoration extends React.Component {
diskList,
visible,
cutImageBlob,
hasImgReady
hasImgReady,
imageFile,
} = this.state;
const DraggableContainer = (props) => (
<SortableContainer
......@@ -423,65 +344,9 @@ class StoreH5Decoration extends React.Component {
}}
onSelect={this.handleSelectImg}
/>
<Modal
title="设置图片"
width={1080}
visible={visible}
onCancel={() => {
this.setState({ visible: false });
}}
maskClosable={false}
closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
footer={[
<Button
key="back"
onClick={() => {
this.setState({ visible: false });
this.state.choosedBannerId ? this.handleReplaceDecoration(this.state.choosedBannerItem):this.handleToAddStoreDecoration();
}}
>
重新上传
</Button>,
<Button
key="submit"
type="primary"
disabled={!hasImgReady}
onClick={() => {
if (!cutFlag) {
cutFlag = true;
this.refs.hiddenBtn.click();
}
this.getSignature(cutImageBlob);
}}
>
确定
</Button>,
]}
>
<div className="clip-box">
<div
id="headPicModal"
ref="headPicModal"
style={{
width: "500px",
height: "430px",
marginBottom: 0,
}}
></div>
<div id="clipBtn" style={{ display: "none" }} ref="hiddenBtn"></div>
<div className="preview-img">
<div className="title">效果预览</div>
<div id="H5-preview-url-box">
<img src={this.state.dataUrl} style={{ width: '100%' }} alt="" />
</div>
<div className="tip-box">
<div className="tip">温馨提示</div>
<div className="tip">①预览效果图时可能存在延迟，单击左侧图片刷新即可</div>
<div className="tip">②设置图片时双击可旋转图片，滚动可放大或缩小图片</div>
</div>
</div>
</div>
</Modal>
{ visible &&
<ImgClipModal visible={visible} imgUrl={imageFile.ossUrl} aspectRatio='500/172' cropBoxHeight='172' onConfirm={this.getSignature} onClose={()=>{this.setState({ visible: false });}}/>
}
</div>
);
}
......
src/modules/store-manage/StoreInfo.jsx
......@@ -4,10 +4,10 @@ import { Form, Input, Button, Checkbox ,Select,Modal,message} from 'antd';
import {industryList,childIndustryList} from '@/domains/store-domain/constants'
import SelectPrepareFileModal from '@/modules/prepare-lesson/modal/SelectPrepareFileModal';
import Upload from '@/core/upload';
// import PhotoClip from 'photoclip';
import StoreService from "@/domains/store-domain/storeService";
import User from "@/common/js/user";
import Bus from '@/core/tbus';
import ImgClipModal from '@/components/ImgClipModal'
import "./StoreInfo.less";
let cutFlag = false;
class StoreInfo extends React.Component {
......@@ -23,6 +23,7 @@ class StoreInfo extends React.Component {
logo:'',
showSelectFileModal:false,
cutImageBlob: null,
imageFile: null, // 需要被截取的图片
}
}
componentWillMount(){
......@@ -73,85 +74,12 @@ class StoreInfo extends React.Component {
})
}
handleSelectCover = (file)=> {
this.uploadImage(file);
this.setState({
visible: true,
imageFile:file
});
}
//上传图片
uploadImage = (imageFile) => {
const { folderName } = imageFile;
const fileName = window.random_string(16) + folderName.slice(folderName.lastIndexOf("."));
const self = this;
this.setState(
{
visible: true,
},
() => {
setTimeout(() => {
const okBtnDom = document.querySelector("#headPicModal");
const options = {
size: [500, 128],
ok: okBtnDom,
maxZoom: 3,
style: {
jpgFillColor: "transparent",
},
done: function (dataUrl) {
clearTimeout(self.timer);
self.timer = setTimeout(() => {
if ((self.state.rotate != this.rotate()) || (self.state.scale != this.scale())) {
console.log(this.scale(), 'scale')
const _dataUrl = this.clip()
const cutImageBlob = self.convertBase64UrlToBlob(_dataUrl);
self.setState({
cutImageBlob,
dataUrl: _dataUrl,
rotate: this.rotate(),
scale: this.scale()
})
}
}, 500)
const cutImageBlob = self.convertBase64UrlToBlob(dataUrl);
self.setState({
cutImageBlob,
dataUrl
})
setTimeout(() => {
cutFlag = false;
}, 2000);
},
fail: (failInfo) => {
message.error("图片上传失败了，请重新上传");
},
loadComplete: function (img) {
setTimeout(() => {
const _dataUrl = this.clip()
self.setState({
dataUrl: _dataUrl,
hasImgReady: true
})
}, 100)
},
};
const imgUrl = `${imageFile.ossUrl}?${new Date().getTime()}`
if (!this.state.photoclip) {
const _photoclip = new PhotoClip("#headPicModal", options);
_photoclip.load(imgUrl);
this.setState({
photoclip: _photoclip,
});
} else {
this.state.photoclip.clear();
this.state.photoclip.load(imgUrl);
}
}, 200);
}
);
};
//获取resourceId
getSignature = (blob, fileName) => {
Upload.uploadBlobToOSS(blob, 'cover' + (new Date()).valueOf(),null,'signInfo').then((signInfo) => {
......@@ -172,16 +100,6 @@ class StoreInfo extends React.Component {
logo:coverClicpPath
})
}
// base64转换成blob
convertBase64UrlToBlob = (urlData) => {
const bytes = window.atob(urlData.split(",")[1]);
const ab = new ArrayBuffer(bytes.length);
const ia = new Uint8Array(ab);
for (let i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
}
return new Blob([ab], { type: "image/png" });
};
updateInfo=()=>{
const {storeName,storeFullName,logo,subjectType,corpIndustry,corpSubIndustry} = this.state;
if(!storeName){
......@@ -216,7 +134,7 @@ class StoreInfo extends React.Component {
});
}
render() {
const {storeName,storeFullName,subjectType,corpIndustry,corpSubIndustry,showSelectFileModal,visible,hasImgReady,logo,cutImageBlob } = this.state;
const {storeName,storeFullName,subjectType,corpIndustry,corpSubIndustry,showSelectFileModal,visible,hasImgReady,logo,cutImageBlob,imageFile} = this.state;
return (
<div className="page store-info-page">
<div className="content-header">学院基本信息</div>
......@@ -330,65 +248,9 @@ class StoreInfo extends React.Component {
onSelect={this.handleSelectCover}
/>
}
<Modal
title="设置图片"
width={1080}
visible={visible}
maskClosable={false}
closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
onCancel={() => {
this.setState({ visible: false });
}}
zIndex={10001}
footer={[
<Button
key="back"
onClick={() => {
this.setState({ visible: false });
}}
>
重新上传
</Button>,
<Button
key="submit"
type="primary"
disabled={!hasImgReady}
onClick={() => {
if (!cutFlag) {
cutFlag = true;
this.refs.hiddenBtn.click();
}
this.getSignature(cutImageBlob);
}}
>
确定
</Button>,
]}
>
<div className="clip-box">
<div
id="headPicModal"
ref="headPicModal"
style={{
width: "500px",
height: "430px",
marginBottom: 0,
}}
></div>
<div id="clipBtn" style={{ display: "none" }} ref="hiddenBtn"></div>
<div className="preview-img">
<div className="title">效果预览</div>
<div id="preview-url-box" style={{width:500,height:128}}>
<img src={this.state.dataUrl} style={{ width: '100%' }} alt="" />
</div>
<div className="tip-box">
<div className="tip">温馨提示</div>
<div className="tip">①预览效果图时可能存在延迟，单击左侧图片刷新即可</div>
<div className="tip">②设置图片时双击可旋转图片，滚动可放大或缩小图片</div>
</div>
</div>
</div>
</Modal>
{ visible &&
<ImgClipModal visible={visible} imgUrl={imageFile.ossUrl} aspectRatio='125/32' cropBoxHeight='128' onConfirm={this.getSignature} onClose={()=>{this.setState({ visible: false });}}/>
}
<div><Button type="primary" onClick={this.updateInfo} htmlType="submit" className="submit-btn">更新信息</Button></div>
</div>
......
src/modules/store-manage/StoreWebDecorationTab.jsx
/*
* @Author: wufan
* @Date: 2020-11-30 10:47:38
* @LastEditors: wufan
* @LastEditTime: 2021-06-21 11:16:31
* @LastEditors: Please set LastEditors
* @LastEditTime: 2021-07-08 19:35:27
* @Description: web学院banner页面
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
......@@ -25,6 +25,7 @@ import "./StoreDecorationPage.less";
import Upload from "@/core/upload";
import { XMTable } from '@/components';
import college from '@/common/lottie/college';
import ImgClipModal from '@/components/ImgClipModal'
const { confirm } = Modal;
const DragHandle = sortableHandle(() => (
......@@ -51,7 +52,8 @@ class StoreWebDecoration extends React.Component {
photoclip: null,
preview: "",
cutImageBlob: null,
hasImgReady: false // 图片是否上传成功
hasImgReady: false,// 图片是否上传成功
imageFile: null // 需要被截取的图片
};
}
......@@ -207,87 +209,14 @@ class StoreWebDecoration extends React.Component {
// 选择云盘资源
handleSelectImg = (file) => {
this.setState({
showSelectFileModal: false,
});
this.uploadImage(file);
};
//上传图片
uploadImage = (imageFile) => {
const self = this;
this.setState(
{
if(file){
this.setState({
visible: true,
},
() => {
setTimeout(() => {
const okBtnDom = document.querySelector("#headPicModal");
const options = {
size: [500, 73],
ok: okBtnDom,
maxZoom: 3,
style: {
jpgFillColor: "transparent",
},
done: function (dataUrl) {
clearTimeout(self.timer);
self.timer = setTimeout(() => {
if ((self.state.rotate != this.rotate()) || (self.state.scale != this.scale())) {
console.log(this.scale(), 'scale')
const _dataUrl = this.clip()
const cutImageBlob = self.convertBase64UrlToBlob(_dataUrl);
self.setState({
cutImageBlob,
dataUrl: _dataUrl,
rotate: this.rotate(),
scale: this.scale()
})
}
}, 500)
const cutImageBlob = self.convertBase64UrlToBlob(dataUrl);
self.setState({
cutImageBlob,
dataUrl
})
setTimeout(() => {
cutFlag = false;
}, 2000);
},
fail: (failInfo) => {
message.error("图片上传失败了，请重新上传");
},
loadComplete: function (img) {
setTimeout(() => {
const _dataUrl = this.clip()
self.setState({
dataUrl: _dataUrl,
hasImgReady: true
})
}, 100)
},
};
const imgUrl = `${imageFile.ossUrl}?${new Date().getTime()}`
if (!this.state.photoclip) {
const _photoclip = new PhotoClip("#headPicModal", options);
_photoclip.load(imgUrl);
this.setState({
photoclip: _photoclip,
});
} else {
this.state.photoclip.clear();
this.state.photoclip.load(imgUrl);
}
}, 200);
}
);
imageFile:file
});
}
};
//获取resourceId
getSignature = (blob) => {
Upload.uploadBlobToOSS(blob, "avatar" + new Date().valueOf()).then(
......@@ -342,16 +271,7 @@ class StoreWebDecoration extends React.Component {
});
};
// base64转换成blob
convertBase64UrlToBlob = (urlData) => {
const bytes = window.atob(urlData.split(",")[1]);
const ab = new ArrayBuffer(bytes.length);
const ia = new Uint8Array(ab);
for (let i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
}
return new Blob([ab], { type: "image/png" });
};
render() {
const {
......@@ -360,7 +280,8 @@ class StoreWebDecoration extends React.Component {
diskList,
visible,
cutImageBlob,
hasImgReady
hasImgReady,
imageFile
} = this.state;
const DraggableContainer = (props) => (
<SortableContainer
......@@ -421,65 +342,9 @@ class StoreWebDecoration extends React.Component {
}}
onSelect={this.handleSelectImg}
/>
<Modal
title="设置图片"
width={1080}
visible={visible}
onCancel={() => {
this.setState({ visible: false });
}}
maskClosable={false}
closeIcon={<span className="icon iconfont modal-close-icon">&#xe6ef;</span>}
footer={[
<Button
key="back"
onClick={() => {
this.setState({ visible: false });
this.state.choosedBannerId ? this.handleReplaceDecoration(this.state.choosedBannerItem):this.handleToAddStoreDecoration();
}}
>
重新上传
</Button>,
<Button
key="submit"
type="primary"
disabled={!hasImgReady}
onClick={() => {
if (!cutFlag) {
cutFlag = true;
this.refs.hiddenBtn.click();
}
this.getSignature(cutImageBlob);
}}
>
确定
</Button>,
]}
>
<div className="clip-box">
<div
id="headPicModal"
ref="headPicModal"
style={{
width: "500px",
height: "430px",
marginBottom: 0,
}}
></div>
<div id="clipBtn" style={{ display: "none" }} ref="hiddenBtn"></div>
<div className="preview-img">
<div className="title">效果预览</div>
<div id="H5-preview-url-box">
<img src={this.state.dataUrl} style={{ width: '100%' }} alt="" />
</div>
<div className="tip-box">
<div className="tip">温馨提示</div>
<div className="tip">①预览效果图时可能存在延迟，单击左侧图片刷新即可</div>
<div className="tip">②设置图片时双击可旋转图片，滚动可放大或缩小图片</div>
</div>
</div>
</div>
</Modal>
{ visible &&
<ImgClipModal visible={visible} imgUrl={imageFile.ossUrl} aspectRatio='500/73' cropBoxHeight='73' onConfirm={this.getSignature} onClose={()=>{this.setState({ visible: false });}}/>
}
</div>
);
}
......
src/modules/teach-tool/examination-manager/Index.tsx
......@@ -136,11 +136,12 @@ function ExaminationManager(props: any) {
},
{
title: '创建时间',
width: 150,
dataIndex: 'examCreateTime',
align: fixStr.right,
sorter: true,
sortOrder: field === 'examCreateTime' ? order : sortStatus.type,
render: (text: any, record: any) => <span>{moment(text).format('YYYY-MM-DD HH:mm')}</span>,
render: (text: any, record: any) => <span style={{ whiteSpace: 'nowrap' }}>{moment(text).format('YYYY-MM-DD HH:mm')}</span>,
},
{
title: '操作',
......
src/modules/teach-tool/paper-manage/OperatePaper.jsx
......@@ -21,7 +21,8 @@ import Bus from '@/core/bus';
import _ from 'underscore';
import { Route, withRouter } from 'react-router-dom';
import * as paperEmpty from '../../lottie/paperEmpty/data.json';
import AddExam from '@/modules/teach-tool/examination-manager/AddExam';
import AddExam from "@/modules/teach-tool/examination-manager/AddExam";
import BatchScore from "./components/BatchScore";
const questionTypeEnum = {
SINGLE_CHOICE: '单选题',
......@@ -59,7 +60,8 @@ class OperatePaper extends Component {
},
selectQuestionModal: null,
paperPreviewModal: null,
quickSortModalVisible: false, // 快捷排序弹窗显隐
quickSortModalVisible: false, // 快捷排序弹窗显隐
batchSetScoreVisible: false, //批量设置题型分数
selectQuestionList: [],
currentOperate: '',
currentNav: '',
......@@ -85,6 +87,38 @@ class OperatePaper extends Component {
typeKey: 'INDEFINITE_CHOICE',
},
],
scoreRule: [
{
typeKey: "SINGLE_CHOICE",
score: 2,
portionScore: 0,
totalQuestion: 0,
},
{
typeKey: "MULTI_CHOICE",
score: 2,
portionScore: 0,
totalQuestion: 0,
},
{
typeKey: "JUDGE",
score: 2,
portionScore: 0,
totalQuestion: 0,
},
{
typeKey: "GAP_FILLING",
score: 2,
portionScore: 0,
totalQuestion: 0,
},
{
typeKey: "INDEFINITE_CHOICE",
score: 2,
portionScore: 0,
totalQuestion: 0,
},
]
};
}
......@@ -191,6 +225,29 @@ class OperatePaper extends Component {
}, 0);
const passScore = Math.round(totalScore * formData.passRate * 0.01);
let _scorerule = _.map(this.state.scoreRule,(item)=> {
switch(item.typeKey) {
case "SINGLE_CHOICE":
item.totalQuestion = singleQuestion.length;
break;
case "MULTI_CHOICE":
item.totalQuestion = multiQuestion.length;
break;
case "JUDGE":
item.totalQuestion = judgeQuestion.length;
break;
case "GAP_FILLING":
item.totalQuestion = gapQuestion.length;
break;
case "INDEFINITE_CHOICE":
item.totalQuestion = indefiniteQuestion.length;
break;
default:
item.totalQuestion = 0
break;
}
return item
})
this.setState({
formData: {
...formData,
......@@ -208,6 +265,7 @@ class OperatePaper extends Component {
questionCnt: _selectQuestionList.length,
totalScore,
},
scoreRule:_scorerule,
});
};
......@@ -218,9 +276,11 @@ class OperatePaper extends Component {
<SelectQuestionModal
getSelectedQuestion={selectQuestionList}
setSelectedQuestion={(list) => {
//按分数规则给每一题重新设置分数（只对新增题目有效）
let _list = this.setScoreByRule(list)
this.setState({ selectQuestionModal: null }, () => {
this.setFormData(list);
this.quickSorter(list, sorterMethod, sorterBy);
this.setFormData(_list);
this.quickSorter(_list, sorterMethod, sorterBy);
});
}}
close={() => {
......@@ -233,6 +293,25 @@ class OperatePaper extends Component {
this.setState({ selectQuestionModal: m });
};
setScoreByRule = (list) => {
//按批量设置分数规则给每一题重新设置分数（只对新增题目有效）
return _.map(list, (item)=> {
let exist = _.find(this.state.selectQuestionList, (q)=> {
return q.questionId === item.questionId
})
if (exist) {
return item
}
let rule = _.find(this.state.scoreRule,(g)=> {
return g.typeKey === item.questionType
})
if (rule) {
item.score = rule.score
item.portionScore = rule.portionScore
}
return item
})
}
// 移动已选题目
handleMoveItem = (index, moveLength) => {
const selectQuestionList = [...this.state.selectQuestionList];
......@@ -499,7 +578,13 @@ class OperatePaper extends Component {
min={1}
max={100}
value={record.score || 2}
formatter={value => parseInt(value)}
parser={value => parseInt(value)}
onChange={(value) => {
value = Math.round(value)
if (value <= record.portionScore) {
return
}
const _selectQuestionList = [...selectQuestionList];
this.setState(
{
......@@ -523,9 +608,12 @@ class OperatePaper extends Component {
{record.questionType === 'GAP_FILLING' ? <span>半对得</span> : <span>漏选得</span>}{' '}
<InputNumber
min={0}
max={record.score - 1}
max={ record.score <= 0 ? 0 : record.score - 1}
formatter={value => parseInt(value)}
parser={value => parseInt(value)}
value={record.portionScore || 0}
onChange={(value) => {
value = Math.round(value)
const _selectQuestionList = [...selectQuestionList];
this.setState(
{
......@@ -581,6 +669,52 @@ class OperatePaper extends Component {
return columns;
};
//
onBatchScoreOK = (rules) => {
this.setState({
batchSetScoreVisible:false,
scoreRule:rules
},()=> {
let questionList = _.map(this.state.selectQuestionList,(item)=> {
let rule = _.find(this.state.scoreRule,(s)=> {
return s.typeKey === item.questionType
})
if (rule) {
item.score = rule.score
item.portionScore = rule.portionScore
}
return item
})
// 各类型题目总分值
const { formData, scoreRule } = this.state
const {singleChoiceCnt, multiChoiceCnt, judgeCnt, gapFillingCnt, indefiniteChoiceCnt} = formData
const singleChoiceScore = singleChoiceCnt*scoreRule.find((item)=> {return item.typeKey === "SINGLE_CHOICE"}).score
const multiChoiceScore = multiChoiceCnt*scoreRule.find((item)=> {return item.typeKey === "MULTI_CHOICE"}).score
const judgeScore = judgeCnt*scoreRule.find((item)=> {return item.typeKey === "JUDGE"}).score
const gapFillingScore = gapFillingCnt*scoreRule.find((item)=> {return item.typeKey === "GAP_FILLING"}).score
const indefiniteChoiceScore = indefiniteChoiceCnt*scoreRule.find((item)=> {return item.typeKey === "INDEFINITE_CHOICE"}).score
const totalScore = questionList.reduce((prev, cur) => {
return prev + Number(cur.score) || 0;
}, 0);
const passScore = Math.round(totalScore * formData.passRate * 0.01);
this.setState({
selectQuestionList:questionList,
formData: {
...formData,
singleChoiceScore,
multiChoiceScore,
judgeScore,
gapFillingScore,
indefiniteChoiceScore,
totalScore,
passScore,
}
})
message.success("设置成功")
})
}
// 上下移题型
handleMoveTypeSorter = (index, moveLength) => {
const sorterTypeList = [...this.state.sorterTypeList];
......@@ -719,6 +853,7 @@ class OperatePaper extends Component {
max={100}
value={passRate}
onChange={(value) => {
value = Math.round(value)
this.setState(
{
formData: {
......@@ -752,22 +887,36 @@ class OperatePaper extends Component {
}}>
快捷排序
</Button>
<Button
className="choose-btn"
onClick={() => {
this.setState({
batchSetScoreVisible: true,
});
}}
>
批量设置分数
</Button>
</Space>
{questionCnt > 0 && (
<div className='paper-info-tip' style={{ margin: '0 auto 12px' }}>
总计<span>{totalScore}</span>分，共
<span>{questionCnt}</span>
题。 {singleChoiceCnt > 0 && `单选题${singleChoiceCnt}题，共${singleChoiceScore}分；`}
{multiChoiceCnt > 0 && `多选题${multiChoiceCnt}题，共${multiChoiceScore}分；`}
{judgeCnt > 0 && `判断题${judgeCnt}题，共${judgeScore}分，`}
{gapFillingCnt > 0 && `填空题${gapFillingCnt}题，共${gapFillingScore}分，`}
{indefiniteChoiceCnt > 0 && `不定项选择题${indefiniteChoiceCnt}题，共${indefiniteChoiceScore}分`}
题。{" "}
{singleChoiceCnt > 0 &&
`单选题${singleChoiceCnt}题，共${singleChoiceScore}分；`}
{multiChoiceCnt > 0 &&
`多选题${multiChoiceCnt}题，共${multiChoiceScore}分；`}
{judgeCnt > 0 && `判断题${judgeCnt}题，共${judgeScore}分；`}
{gapFillingCnt > 0 &&
`填空题${gapFillingCnt}题，共${gapFillingScore}分；`}
{indefiniteChoiceCnt > 0 &&
`不定项选择题${indefiniteChoiceCnt}题，共${indefiniteChoiceScore}分；`}
</div>
)}
<XMTable
className='table-style'
scroll={{ y: 350 }}
columns={this.parseColumns()}
dataSource={selectQuestionList}
pagination={false}
......@@ -829,6 +978,13 @@ class OperatePaper extends Component {
/>
)}
</Modal>
{/* 批量设置分数规则 */}
<BatchScore
visible={this.state.batchSetScoreVisible}
onOK={this.onBatchScoreOK}
onCancel={()=> this.setState({batchSetScoreVisible:false})}
rules={this.state.scoreRule}
/>
</div>
<Route
path={`${match.url}/exam-operate-page`}
......
src/modules/teach-tool/paper-manage/OperatePaper.less
......@@ -7,6 +7,8 @@
.table-style {
border: 1px solid #f0f0f0 !important;
margin-bottom: 70px;
max-height: calc(~'100vh - 465px');
overflow: scroll;
}
.ant-tabs {
color: #666666;
......
src/modules/teach-tool/paper-manage/components/BatchScore.less 0 → 100644
.batchscore {
.content {
.item {
display: flex;
width: 612px;
height: 48px;
background: #F7F8F9;
font-size: 14px;
line-height: 48px;
font-weight: 400;
color: #333333;
padding-left: 16px;
.type {
width: 112px;
}
.score {
margin-left: 8px;
margin-right: 29px;
width: 258px;
}
}
.item:not(:last-of-type) {
margin-bottom: 8px;
}
}
}
\ No newline at end of file
src/modules/teach-tool/paper-manage/components/BatchScore.tsx 0 → 100644
import React, { useEffect, useState} from "react";
import { Modal, Button, InputNumber, message } from 'antd';
import "./BatchScore.less"
import _ from "underscore";
interface Rule {
typeKey: "GAP_FILLING"|"INDEFINITE_CHOICE"| "JUDGE"|"MULTI_CHOICE"|"SINGLE_CHOICE",
score: number,
portionScore: number,
totalQuestion: number,
}
interface BatchScoreProps {
visible:boolean,
rules: Rule[],
onOK: (rules:Rule[]) => void,
onCancel: () => void,
}
export default function BatchScore(props:BatchScoreProps) {
const [rules, setRules] = useState<Rule[]>(_.sortBy(props.rules,"typeKey"))
const [singleCount, setSingleCount] = useState<number[]>([0])
const [multiCount, setMultiCount] = useState<number[]>([0])
const [judgeCount, setJudgeCount] = useState<number[]>([0])
const [gapCount, setgapCount] = useState<number[]>([0])
const [indefiniteCount, setIndefiniteCount] = useState<number[]>([0])
useEffect(()=> {
_.map(props.rules,(item)=> {
//更新分数统计
switch(item.typeKey) {
case "SINGLE_CHOICE":
setSingleCount([item.totalQuestion,item.totalQuestion*item.score])
break;
case "MULTI_CHOICE":
setMultiCount([item.totalQuestion,item.totalQuestion*item.score])
break;
case "JUDGE":
setJudgeCount([item.totalQuestion,item.totalQuestion*item.score])
break;
case "GAP_FILLING":
setgapCount([item.totalQuestion,item.totalQuestion*item.score])
break;
case "INDEFINITE_CHOICE":
setIndefiniteCount([item.totalQuestion,item.totalQuestion*item.score])
break;
default:
break;
}
})
},[props.rules,rules])
if (!props.visible) {
return ("")
}
function onOk() {
for (let i = 0;i < rules.length;++i) {
if (rules[i].score <= 0 || rules[i].score > 100) {
message.error("分值设置错误")
return;
}
}
props.onOK(rules)
}
function onCancel() {
props.onCancel()
}
const inputNumberStyle = {width:"57px",margin:"0 8px"}
return (
<Modal
className="batchscore"
title="批量设置分数"
onCancel={onCancel}
onOk={onOk}
visible={props.visible}
maskClosable={false}
width={660}
>
<div className="content">
<div className="item">
<span className="type">【单选题】</span>
<span className="score">每题
<InputNumber
min={1}
max={100}
value={rules[4].score}
defaultValue={rules[4].score}
style={inputNumberStyle}
formatter={(value:number|undefined) => String(value)}
parser={(value:string|undefined) => parseInt(String(value))}
onChange={(v)=> {
v = Math.round(v)
let _rules = [...rules]
rules[4].score = v
setRules(_rules)
}}
/>
分</span>
<span className="total">共<span style={{color:"#2966FF"}}>{singleCount[0]}</span>题，合计<span style={{color:"#2966FF"}}>{singleCount[1]}</span>分</span>
</div>
<div className="item">
<span className="type">【多选题】</span>
<span className="score">每题
<InputNumber
min={1}
max={100}
defaultValue={rules[3].score}
value={rules[3].score}
style={inputNumberStyle}
formatter={(value:number|undefined) => String(value)}
parser={(value:string|undefined) => parseInt(String(value))}
onChange={(v)=> {
v = Math.round(v)
if (v <= rules[3].portionScore) {
return
}
let _r = [...rules]
_r[3].score = v
setRules(_r)
}}
/>
分，漏选得
<InputNumber
min={0}
max={rules[3].score <= 0 ? 0 : rules[3].score-1}
defaultValue={rules[3].portionScore}
value={rules[3].portionScore}
style={inputNumberStyle}
formatter={(value:number|undefined) => String(value)}
parser={(value:string|undefined) => parseInt(String(value))}
onChange={(v)=> {
v = Math.round(v)
let _r = [...rules]
_r[3].portionScore = v
setRules(_r)
}}
/>
分</span>
<span className="total">共<span style={{color:"#2966FF"}}>{multiCount[0]}</span>题，合计<span style={{color:"#2966FF"}}>{multiCount[1]}</span>分</span>
</div>
<div className="item">
<span className="type">【不定项选择题】</span>
<span className="score">每题
<InputNumber
min={1}
max={100}
defaultValue={rules[1].score}
value={rules[1].score}
style={inputNumberStyle}
formatter={(value:number|undefined) => String(value)}
parser={(value:string|undefined) => parseInt(String(value))}
onChange={(v)=> {
v = Math.round(v)
if (v <= rules[1].portionScore) {
return
}
let _r = [...rules]
_r[1].score = v
setRules(_r)
}}
/>
分，漏选得
<InputNumber
min={0}
max={rules[1].score <= 0 ? 0 : rules[1].score-1}
defaultValue={rules[1].portionScore}
value={rules[1].portionScore}
style={inputNumberStyle}
formatter={(value:number|undefined) => String(value)}
parser={(value:string|undefined) => parseInt(String(value))}
onChange={(v)=> {
v = Math.round(v)
let _r = [...rules]
_r[1].portionScore = v
setRules(_r)
}}
/>分</span>
<span className="total">共<span style={{color:"#2966FF"}}>{indefiniteCount[0]}</span>题，合计<span style={{color:"#2966FF"}}>{indefiniteCount[1]}</span>分</span>
</div>
<div className="item">
<span className="type">【判断题】</span>
<span className="score">每题
<InputNumber
min={1}
max={100}
defaultValue={rules[2].score}
value={rules[2].score}
style={inputNumberStyle}
formatter={(value:number|undefined) => String(value)}
parser={(value:string|undefined) => parseInt(String(value))}
onChange={(v)=> {
v = Math.round(v)
let _r = [...rules]
_r[2].score = v
setRules(_r)
}}
/>
分</span>
<span className="total">共<span style={{color:"#2966FF"}}>{judgeCount[0]}</span>题，合计<span style={{color:"#2966FF"}}>{judgeCount[1]}</span>分</span>
</div>
<div className="item">
<span className="type">【填空题】</span>
<span className="score">每题
<InputNumber
min={1}
max={100}
defaultValue={rules[0].score}
value={rules[0].score}
style={inputNumberStyle}
formatter={(value:number|undefined) => String(value)}
parser={(value:string|undefined) => parseInt(String(value))}
onChange={(v)=> {
v = Math.round(v)
if (v <= rules[0].portionScore) {
return
}
let _r = [...rules]
_r[0].score = v
setRules(_r)
}}
/>
分，半对得<InputNumber
min={0}
max={rules[0].score <= 0 ? 0 : rules[0].score-1}
defaultValue={rules[0].portionScore}
value={rules[0].portionScore}
style={inputNumberStyle}
formatter={(value:number|undefined) => String(value)}
parser={(value:string|undefined) => parseInt(String(value))}
onChange={(v)=> {
v = Math.round(v)
let _r = [...rules]
_r[0].portionScore = v
setRules(_r)
}}
/>
分</span>
<span className="total">共<span style={{color:"#2966FF"}}>{gapCount[0]}</span>题，合计<span style={{color:"#2966FF"}}>{gapCount[1]}</span>分</span>
</div>
</div>
</Modal>
)
}
\ No newline at end of file
src/modules/teach-tool/paper-manage/components/PaperList.less
......@@ -2,38 +2,38 @@
.select-box {
display: flex;
align-items: center;
.select-container{
.select-container {
margin-right: 24px;
.con{
background: #E9EFFF;
.con {
background: #e9efff;
border-radius: 4px;
padding: 3px 16px;
display: inline-flex;
align-items: center;
justify-content: space-between;
.tip{
font-size:14px;
color:#2966FF;
margin-right:8px;
.tip {
font-size: 14px;
color: #2966ff;
margin-right: 8px;
}
.text{
font-size:14px;
color:#666;
margin-right:30px;
.text {
font-size: 14px;
color: #666;
margin-right: 30px;
}
.clear{
color:#5289FA;
font-size:14px;
.clear {
color: #5289fa;
font-size: 14px;
}
}
}
}
}
.ant-radio-wrapper{
.ant-radio-wrapper {
left: -10px;
}
.paper-list-filter {
position: relative;
.search-condition {
width: calc(100% - 80px);
display: flex;
......@@ -75,8 +75,10 @@
.paper-list-content {
position: relative;
margin-top: 12px;
height: calc(100vh - 260px);
overflow: scroll;
.empty-list-tip {
color: #2966FF;
color: #2966ff;
cursor: pointer;
}
.record-name {
......@@ -88,7 +90,7 @@
display: flex;
&__item {
color: #2966FF;
color: #2966ff;
cursor: pointer;
&.split {
......@@ -98,7 +100,7 @@
}
}
}
&.modal-select{
&.modal-select {
.search-condition {
width: calc(100% - 80px);
display: flex;
......
src/modules/teach-tool/question-manage/Index.less
......@@ -7,7 +7,10 @@
.content {
width: 100%;
margin-left: 24px;
height: calc(100vh - 160px);
.question-list-content {
height: calc(100vh - 260px);
overflow: scroll;
}
}
}
}
src/modules/teach-tool/question-manage/modal/BatchImportQuestionModal.jsx
......@@ -11,6 +11,7 @@ import { Modal, Button, message, Spin } from "antd";
import "./BatchImportQuestionModal.less";
import SelectPrepareFileModal from "@/modules/prepare-lesson/modal/SelectPrepareFileModal";
import User from "@/common/js/user";
import moment from "moment";
import AidToolService from "@/domains/aid-tool-domain/AidToolService";
import { LoadingOutlined } from "@ant-design/icons";
class BatchImportQuestionModal extends Component {
......@@ -48,6 +49,15 @@ class BatchImportQuestionModal extends Component {
// 导入
handleImport = async () => {
//过期判断
if (User.getExpirationTime() && moment().valueOf() > Number(User.getExpirationTime())) {
Modal.warning({
title:"服务已到期",
content: "当前企业购买的小麦企学院服务已到期，如需继续使用学院功能，请尽快续费购买",
okText: "我知道了"
})
return
}
const { uploadFile } = this.state;
if (!uploadFile) {
message.warning("请选择要导入的文件");
......
src/store/context.ts
......@@ -7,4 +7,19 @@
* @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
*/
import React from 'react';
export const XMContext: any = React.createContext(null);
\ No newline at end of file
export interface VersionInfo {
dayTime: number; //有效时长
stateEnum: string; //"NO"已过期,"YES"未过期
surplusDayTime: number; //剩余有效天数
surplusUserNum: number; //剩余限制人数
userNum: number; //限制人数
validEndTime: string;
validStartTime: string;
validEndTimeST: number;
validStartTimeST: number;
whetherReachUserNum: boolean;
}
export const XMContext: any = React.createContext(null);
export const VersionContext = React.createContext<VersionInfo|null>(null)
\ No newline at end of file
yarn.lock
......@@ -2451,10 +2451,10 @@ ansi-styles@^4.0.0, ansi-styles@^4.1.0:
"@types/color-name" "^1.1.1"
color-convert "^2.0.1"
antd@^4.9.4:
version "4.15.6"
resolved "https://registry.yarnpkg.com/antd/-/antd-4.15.6.tgz#bc4359b8f232c8bbb073d7236446edc9aa658d38"
integrity sha512-uXn1uRFlPLrAmjfkyxKc3avMVO5N30o3YoSMSJPRw5OLNjOfWsnZDPKvZwinn+QQE9N7dRXylcMfNvl11LH2gA==
antd@4.16.5:
version "4.16.5"
resolved "https://registry.nlark.com/antd/download/antd-4.16.5.tgz#6105bd848fb2e468e0d1d3ec024c82d2516587ef"
integrity sha1-YQW9hI+y5Gjg0dPsAkyC0lFlh+8=
dependencies:
"@ant-design/colors" "^6.0.0"
"@ant-design/icons" "^4.6.2"
......@@ -2474,10 +2474,10 @@ antd@^4.9.4:
rc-field-form "~1.20.0"
rc-image "~5.2.4"
rc-input-number "~7.1.0"
rc-mentions "~1.5.0"
rc-menu "~8.10.0"
rc-mentions "~1.6.1"
rc-menu "~9.0.12"
rc-motion "^2.4.0"
rc-notification "~4.5.2"
rc-notification "~4.5.7"
rc-pagination "~3.1.6"
rc-picker "~2.5.10"
rc-progress "~3.1.0"
......@@ -2487,15 +2487,15 @@ antd@^4.9.4:
rc-slider "~9.7.1"
rc-steps "~4.1.0"
rc-switch "~3.2.0"
rc-table "~7.13.0"
rc-tabs "~11.7.0"
rc-table "~7.15.1"
rc-tabs "~11.9.1"
rc-textarea "~0.3.0"
rc-tooltip "~5.1.1"
rc-tree "~4.1.0"
rc-tree-select "~4.3.0"
rc-trigger "^5.2.1"
rc-upload "~4.3.0"
rc-util "^5.9.4"
rc-util "^5.13.1"
scroll-into-view-if-needed "^2.2.25"
warning "^4.0.3"
......@@ -3552,6 +3552,11 @@ classnames@2.x, classnames@^2.2.1, classnames@^2.2.3, classnames@^2.2.5, classna
resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.2.6.tgz#43935bffdd291f326dad0a205309b38d00f650ce"
integrity sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q==
classnames@^2.3.1:
version "2.3.1"
resolved "https://registry.npm.taobao.org/classnames/download/classnames-2.3.1.tgz#dfcfa3891e306ec1dad105d0e88f4417b8535e8e"
integrity sha1-38+jiR4wbsHa0QXQ6I9EF7hTXo4=
clean-css@^4.2.3:
version "4.2.3"
resolved "https://registry.yarnpkg.com/clean-css/-/clean-css-4.2.3.tgz#507b5de7d97b48ee53d84adb0160ff6216380f78"
......@@ -3927,6 +3932,17 @@ cosmiconfig@^6.0.0:
path-type "^4.0.0"
yaml "^1.7.2"
cosmiconfig@^7.0.0:
version "7.0.0"
resolved "https://registry.npm.taobao.org/cosmiconfig/download/cosmiconfig-7.0.0.tgz?cache=0&sync_timestamp=1596310773001&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcosmiconfig%2Fdownload%2Fcosmiconfig-7.0.0.tgz#ef9b44d773959cae63ddecd122de23853b60f8d3"
integrity sha1-75tE13OVnK5j3ezRIt4jhTtg+NM=
dependencies:
"@types/parse-json" "^4.0.0"
import-fresh "^3.2.1"
parse-json "^5.0.0"
path-type "^4.0.0"
yaml "^1.10.0"
create-ecdh@^4.0.0:
version "4.0.3"
resolved "https://registry.yarnpkg.com/create-ecdh/-/create-ecdh-4.0.3.tgz#c9111b6f33045c4697f144787f9254cdc77c45ff"
......@@ -5750,12 +5766,20 @@ find-up@^3.0.0:
dependencies:
locate-path "^3.0.0"
find-versions@^3.2.0:
version "3.2.0"
resolved "https://registry.yarnpkg.com/find-versions/-/find-versions-3.2.0.tgz#10297f98030a786829681690545ef659ed1d254e"
integrity sha512-P8WRou2S+oe222TOCHitLy8zj+SIsVJh52VP4lvXkaFVnOFFdoWv1H1Jjvel1aI6NCFOAaeAVm8qrI0odiLcww==
find-up@^5.0.0:
version "5.0.0"
resolved "https://registry.npm.taobao.org/find-up/download/find-up-5.0.0.tgz#4c92819ecb7083561e4f4a240a86be5198f536fc"
integrity sha1-TJKBnstwg1YeT0okCoa+UZj1Nvw=
dependencies:
semver-regex "^2.0.0"
locate-path "^6.0.0"
path-exists "^4.0.0"
find-versions@^4.0.0:
version "4.0.0"
resolved "https://registry.nlark.com/find-versions/download/find-versions-4.0.0.tgz?cache=0&sync_timestamp=1619599444272&other_urls=https%3A%2F%2Fregistry.nlark.com%2Ffind-versions%2Fdownload%2Ffind-versions-4.0.0.tgz#3c57e573bf97769b8cb8df16934b627915da4965"
integrity sha1-PFflc7+XdpuMuN8Wk0tieRXaSWU=
dependencies:
semver-regex "^3.1.2"
flat-cache@^2.0.1:
version "2.0.1"
......@@ -6352,7 +6376,7 @@ hmac-drbg@^1.0.0:
minimalistic-assert "^1.0.0"
minimalistic-crypto-utils "^1.0.1"
hoist-non-react-statics@^3.1.0, hoist-non-react-statics@^3.3.2:
hoist-non-react-statics@^3.1.0:
version "3.3.2"
resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"
integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==
......@@ -6554,18 +6578,18 @@ humanize-ms@^1.2.0, humanize-ms@^1.2.1:
dependencies:
ms "^2.0.0"
husky@^4.2.5:
version "4.2.5"
resolved "https://registry.yarnpkg.com/husky/-/husky-4.2.5.tgz#2b4f7622673a71579f901d9885ed448394b5fa36"
integrity sha512-SYZ95AjKcX7goYVZtVZF2i6XiZcHknw50iXvY7b0MiGoj5RwdgRQNEHdb+gPDPCXKlzwrybjFjkL6FOj8uRhZQ==
husky@^4.3.0:
version "4.3.8"
resolved "https://registry.npm.taobao.org/husky/download/husky-4.3.8.tgz?cache=0&sync_timestamp=1617004245593&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fhusky%2Fdownload%2Fhusky-4.3.8.tgz#31144060be963fd6850e5cc8f019a1dfe194296d"
integrity sha1-MRRAYL6WP9aFDlzI8Bmh3+GUKW0=
dependencies:
chalk "^4.0.0"
ci-info "^2.0.0"
compare-versions "^3.6.0"
cosmiconfig "^6.0.0"
find-versions "^3.2.0"
cosmiconfig "^7.0.0"
find-versions "^4.0.0"
opencollective-postinstall "^2.0.2"
pkg-dir "^4.2.0"
pkg-dir "^5.0.0"
please-upgrade-node "^3.2.0"
slash "^3.0.0"
which-pm-runs "^1.0.0"
......@@ -6649,6 +6673,14 @@ import-fresh@^3.0.0, import-fresh@^3.1.0:
parent-module "^1.0.0"
resolve-from "^4.0.0"
import-fresh@^3.2.1:
version "3.3.0"
resolved "https://registry.npm.taobao.org/import-fresh/download/import-fresh-3.3.0.tgz?cache=0&sync_timestamp=1608469579940&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fimport-fresh%2Fdownload%2Fimport-fresh-3.3.0.tgz#37162c25fcb9ebaa2e6e53d5b4d88ce17d9e0c2b"
integrity sha1-NxYsJfy566oublPVtNiM4X2eDCs=
dependencies:
parent-module "^1.0.0"
resolve-from "^4.0.0"
import-from@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/import-from/-/import-from-2.1.0.tgz#335db7f2a7affd53aaa471d4b8021dee36b7f3b1"
......@@ -8088,6 +8120,13 @@ locate-path@^5.0.0:
dependencies:
p-locate "^4.1.0"
locate-path@^6.0.0:
version "6.0.0"
resolved "https://registry.npm.taobao.org/locate-path/download/locate-path-6.0.0.tgz#55321eb309febbc59c4801d931a72452a681d286"
integrity sha1-VTIeswn+u8WcSAHZMackUqaB0oY=
dependencies:
p-locate "^5.0.0"
lodash._reinterpolate@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz#0ccf2d89166af03b3663c796538b75ac6e114d9d"
......@@ -8406,14 +8445,6 @@ mini-css-extract-plugin@0.9.0:
schema-utils "^1.0.0"
webpack-sources "^1.1.0"
mini-store@^3.0.1:
version "3.0.6"
resolved "https://registry.yarnpkg.com/mini-store/-/mini-store-3.0.6.tgz#44b86be5b2877271224ce0689b3a35a2dffb1ca9"
integrity sha512-YzffKHbYsMQGUWQRKdsearR79QsMzzJcDDmZKlJBqt5JNkqpyJHYlK6gP61O36X+sLf76sO9G6mhKBe83gIZIQ==
dependencies:
hoist-non-react-statics "^3.3.2"
shallowequal "^1.0.2"
minimalistic-assert@^1.0.0, minimalistic-assert@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz#2e194de044626d4a10e7f7fbc00ce73e83e4d5c7"
......@@ -9083,6 +9114,13 @@ p-limit@^2.3.0:
dependencies:
p-try "^2.0.0"
p-limit@^3.0.2:
version "3.1.0"
resolved "https://registry.nlark.com/p-limit/download/p-limit-3.1.0.tgz#e1daccbe78d0d1388ca18c64fea38e3e57e3706b"
integrity sha1-4drMvnjQ0TiMoYxk/qOOPlfjcGs=
dependencies:
yocto-queue "^0.1.0"
p-locate@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-2.0.0.tgz#20a0103b222a70c8fd39cc2e580680f3dde5ec43"
......@@ -9104,6 +9142,13 @@ p-locate@^4.1.0:
dependencies:
p-limit "^2.2.0"
p-locate@^5.0.0:
version "5.0.0"
resolved "https://registry.nlark.com/p-locate/download/p-locate-5.0.0.tgz#83c8315c6785005e3bd021839411c9e110e6d834"
integrity sha1-g8gxXGeFAF470CGDlBHJ4RDm2DQ=
dependencies:
p-limit "^3.0.2"
p-map@^2.0.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/p-map/-/p-map-2.1.0.tgz#310928feef9c9ecc65b68b17693018a665cea175"
......@@ -9439,13 +9484,20 @@ pkg-dir@^3.0.0:
dependencies:
find-up "^3.0.0"
pkg-dir@^4.1.0, pkg-dir@^4.2.0:
pkg-dir@^4.1.0:
version "4.2.0"
resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-4.2.0.tgz#f099133df7ede422e81d1d8448270eeb3e4261f3"
integrity sha512-HRDzbaKjC+AOWVXxAU/x54COGeIv9eb+6CkDSQoNTt4XyWoIJvuPsXizxu/Fr23EiekbtZwmh1IcIG/l/a10GQ==
dependencies:
find-up "^4.0.0"
pkg-dir@^5.0.0:
version "5.0.0"
resolved "https://registry.nlark.com/pkg-dir/download/pkg-dir-5.0.0.tgz#a02d6aebe6ba133a928f74aec20bafdfe6b8e760"
integrity sha1-oC1q6+a6EzqSj3Suwguv3+a452A=
dependencies:
find-up "^5.0.0"
pkg-up@3.1.0, pkg-up@^3.1.0:
version "3.1.0"
resolved "https://registry.yarnpkg.com/pkg-up/-/pkg-up-3.1.0.tgz#100ec235cc150e4fd42519412596a28512a0def5"
......@@ -10518,7 +10570,7 @@ rc-drawer@~4.3.0:
classnames "^2.2.6"
rc-util "^5.7.0"
rc-dropdown@^3.1.3, rc-dropdown@~3.2.0:
rc-dropdown@^3.2.0, rc-dropdown@~3.2.0:
version "3.2.0"
resolved "https://registry.yarnpkg.com/rc-dropdown/-/rc-dropdown-3.2.0.tgz#da6c2ada403842baee3a9e909a0b1a91ba3e1090"
integrity sha512-j1HSw+/QqlhxyTEF6BArVZnTmezw2LnSmRk6I9W7BCqNCKaRwleRmMMs1PHbuaG8dKHVqP6e21RQ7vPBLVnnNw==
......@@ -10555,30 +10607,29 @@ rc-input-number@~7.1.0:
classnames "^2.2.5"
rc-util "^5.9.8"
rc-mentions@~1.5.0:
version "1.5.3"
resolved "https://registry.yarnpkg.com/rc-mentions/-/rc-mentions-1.5.3.tgz#b92bebadf8ad9fb3586ba1af922d63b49d991c67"
integrity sha512-NG/KB8YiKBCJPHHvr/QapAb4f9YzLJn7kDHtmI1K6t7ZMM5YgrjIxNNhoRKKP9zJvb9PdPts69Hbg4ZMvLVIFQ==
rc-mentions@~1.6.1:
version "1.6.1"
resolved "https://registry.nlark.com/rc-mentions/download/rc-mentions-1.6.1.tgz?cache=0&sync_timestamp=1621867143484&other_urls=https%3A%2F%2Fregistry.nlark.com%2Frc-mentions%2Fdownload%2Frc-mentions-1.6.1.tgz#46035027d64aa33ef840ba0fbd411871e34617ae"
integrity sha1-RgNQJ9ZKoz74QLoPvUEYceNGF64=
dependencies:
"@babel/runtime" "^7.10.1"
classnames "^2.2.6"
rc-menu "^8.0.1"
rc-menu "^9.0.0"
rc-textarea "^0.3.0"
rc-trigger "^5.0.4"
rc-util "^5.0.1"
rc-menu@^8.0.1, rc-menu@^8.6.1, rc-menu@~8.10.0:
version "8.10.8"
resolved "https://registry.yarnpkg.com/rc-menu/-/rc-menu-8.10.8.tgz#c3eb2158b3983e42a67192babad9c8128755d26a"
integrity sha512-0gnSR0nmR/60NnK+72EGd+QheHyPSQ3wYg1TwX1zl0JJ9Gm0purFFykCXVv/G0Jynpt0QySPAos+bpHpjMZdoQ==
rc-menu@^9.0.0, rc-menu@~9.0.12:
version "9.0.12"
resolved "https://registry.nlark.com/rc-menu/download/rc-menu-9.0.12.tgz#492c4bb07a596e2ce07587c669b27ee28c3810c5"
integrity sha1-SSxLsHpZbizgdYfGabJ+4ow4EMU=
dependencies:
"@babel/runtime" "^7.10.1"
classnames "2.x"
mini-store "^3.0.1"
rc-motion "^2.0.1"
rc-motion "^2.4.3"
rc-overflow "^1.2.0"
rc-trigger "^5.1.2"
rc-util "^5.7.0"
resize-observer-polyfill "^1.5.0"
rc-util "^5.12.0"
shallowequal "^1.1.0"
rc-motion@^2.0.0, rc-motion@^2.0.1, rc-motion@^2.2.0, rc-motion@^2.3.0, rc-motion@^2.3.4, rc-motion@^2.4.0:
......@@ -10590,10 +10641,19 @@ rc-motion@^2.0.0, rc-motion@^2.0.1, rc-motion@^2.2.0, rc-motion@^2.3.0, rc-motio
classnames "^2.2.1"
rc-util "^5.2.1"
rc-notification@~4.5.2:
version "4.5.5"
resolved "https://registry.yarnpkg.com/rc-notification/-/rc-notification-4.5.5.tgz#9660a495d5f20bd677686e4f7fc00e4f0c1a3849"
integrity sha512-YIfhTSw+h5GsSdgMnuMx24wqiPlg3FeamuOlkh9RkyHx+SeZVAKzQ0juy2NGvPEF2hDWi5xTqxUqLdo0L2AmGg==
rc-motion@^2.4.3:
version "2.4.4"
resolved "https://registry.nlark.com/rc-motion/download/rc-motion-2.4.4.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.nlark.com%2Frc-motion%2Fdownload%2Frc-motion-2.4.4.tgz#e995d5fa24fc93065c24f714857cf2677d655bb0"
integrity sha1-6ZXV+iT8kwZcJPcUhXzyZ31lW7A=
dependencies:
"@babel/runtime" "^7.11.1"
classnames "^2.2.1"
rc-util "^5.2.1"
rc-notification@~4.5.7:
version "4.5.7"
resolved "https://registry.nlark.com/rc-notification/download/rc-notification-4.5.7.tgz#265e6e6a0c1a0fac63d6abd4d832eb8ff31522f1"
integrity sha1-Jl5uagwaD6xj1qvU2DLrj/MVIvE=
dependencies:
"@babel/runtime" "^7.10.1"
classnames "2.x"
......@@ -10610,6 +10670,16 @@ rc-overflow@^1.0.0:
rc-resize-observer "^1.0.0"
rc-util "^5.5.1"
rc-overflow@^1.2.0:
version "1.2.2"
resolved "https://registry.nlark.com/rc-overflow/download/rc-overflow-1.2.2.tgz#95b0222016c0cdbdc0db85f569c262e7706a5f22"
integrity sha1-lbAiIBbAzb3A24X1acJi53BqXyI=
dependencies:
"@babel/runtime" "^7.11.1"
classnames "^2.2.1"
rc-resize-observer "^1.0.0"
rc-util "^5.5.1"
rc-pagination@~3.1.6:
version "3.1.6"
resolved "https://registry.yarnpkg.com/rc-pagination/-/rc-pagination-3.1.6.tgz#db3c06e50270b52fe272ac527c1fdc2c8d28af1f"
......@@ -10700,26 +10770,26 @@ rc-switch@~3.2.0:
classnames "^2.2.1"
rc-util "^5.0.1"
rc-table@~7.13.0:
version "7.13.3"
resolved "https://registry.yarnpkg.com/rc-table/-/rc-table-7.13.3.tgz#25d5f5ec47ee2d8a293aff18c4c4b8876f78c22b"
integrity sha512-oP4fknjvKCZAaiDnvj+yzBaWcg+JYjkASbeWonU1BbrLcomkpKvMUgPODNEzg0QdXA9OGW0PO86h4goDSW06Kg==
rc-table@~7.15.1:
version "7.15.2"
resolved "https://registry.nlark.com/rc-table/download/rc-table-7.15.2.tgz#f6ab73b2cfb1c76f3cf9682c855561423c6b5b22"
integrity sha1-9qtzss+xx288+WgshVVhQjxrWyI=
dependencies:
"@babel/runtime" "^7.10.1"
classnames "^2.2.5"
rc-resize-observer "^1.0.0"
rc-util "^5.4.0"
rc-util "^5.13.0"
shallowequal "^1.1.0"
rc-tabs@~11.7.0:
version "11.7.3"
resolved "https://registry.yarnpkg.com/rc-tabs/-/rc-tabs-11.7.3.tgz#32a30e59c6992d60fb58115ba0bf2652b337ed43"
integrity sha512-5nd2NVss9TprPRV9r8N05SjQyAE7zDrLejxFLcbJ+BdLxSwnGnk3ws/Iq0smqKZUnPQC0XEvnpF3+zlllUUT2w==
rc-tabs@~11.9.1:
version "11.9.1"
resolved "https://registry.nlark.com/rc-tabs/download/rc-tabs-11.9.1.tgz?cache=0&sync_timestamp=1621867452307&other_urls=https%3A%2F%2Fregistry.nlark.com%2Frc-tabs%2Fdownload%2Frc-tabs-11.9.1.tgz#5b2e74da9a276978c2172ef9a05ae8af14da74cb"
integrity sha1-Wy502ponaXjCFy75oFrorxTadMs=
dependencies:
"@babel/runtime" "^7.11.2"
classnames "2.x"
rc-dropdown "^3.1.3"
rc-menu "^8.6.1"
rc-dropdown "^3.2.0"
rc-menu "^9.0.0"
rc-resize-observer "^1.0.0"
rc-util "^5.5.0"
......@@ -10800,6 +10870,15 @@ rc-util@^5.0.1:
react-is "^16.12.0"
shallowequal "^1.1.0"
rc-util@^5.12.0, rc-util@^5.13.0, rc-util@^5.13.1:
version "5.13.1"
resolved "https://registry.nlark.com/rc-util/download/rc-util-5.13.1.tgz#03e74955b5c46a58cbc6236e4d30dd462c755290"
integrity sha1-A+dJVbXEaljLxiNuTTDdRix1UpA=
dependencies:
"@babel/runtime" "^7.12.5"
react-is "^16.12.0"
shallowequal "^1.1.0"
rc-virtual-list@^3.0.1, rc-virtual-list@^3.2.0:
version "3.2.6"
resolved "https://registry.yarnpkg.com/rc-virtual-list/-/rc-virtual-list-3.2.6.tgz#2c92a40f4425e19881b38134d6bd286a11137d2d"
......@@ -11551,10 +11630,10 @@ semver-compare@^1.0.0:
resolved "https://registry.yarnpkg.com/semver-compare/-/semver-compare-1.0.0.tgz#0dee216a1c941ab37e9efb1788f6afc5ff5537fc"
integrity sha1-De4hahyUGrN+nvsXiPavxf9VN/w=
semver-regex@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/semver-regex/-/semver-regex-2.0.0.tgz#a93c2c5844539a770233379107b38c7b4ac9d338"
integrity sha512-mUdIBBvdn0PLOeP3TEkMH7HHeUP3GjsXCwKarjv/kGmUFOYg1VqEemKhoQpWMu6X2I8kHeuVdGibLGkVK+/5Qw==
semver-regex@^3.1.2:
version "3.1.2"
resolved "https://registry.nlark.com/semver-regex/download/semver-regex-3.1.2.tgz#34b4c0d361eef262e07199dbef316d0f2ab11807"
integrity sha1-NLTA02Hu8mLgcZnb7zFtDyqxGAc=
"semver@2 || 3 || 4 || 5", semver@^5.0.1, semver@^5.4.1, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0:
version "5.7.1"
......@@ -11673,7 +11752,7 @@ shallow-clone@^0.1.2:
lazy-cache "^0.2.3"
mixin-object "^2.0.1"
shallowequal@^1.0.2, shallowequal@^1.1.0:
shallowequal@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/shallowequal/-/shallowequal-1.1.0.tgz#188d521de95b9087404fd4dcb68b13df0ae4e7f8"
integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
......@@ -13026,17 +13105,17 @@ vary@~1.1.2:
resolved "https://registry.yarnpkg.com/vary/-/vary-1.1.2.tgz#2299f02c6ded30d4a5961b0b9f74524a18f634fc"
integrity sha1-IpnwLG3tMNSllhsLn3RSShj2NPw=
vconsole-webpack-plugin@^1.5.2:
version "1.5.2"
resolved "https://registry.yarnpkg.com/vconsole-webpack-plugin/-/vconsole-webpack-plugin-1.5.2.tgz#4c25b6cc51add03bb4e1562c4d3653431c89af60"
integrity sha512-v3goAnjsurFUy+qUmJCGjW+tzeKzlkrlbY8YnctSbhbrKiyC40hDeVFdGJvv7Drvd+w4xCQ1hJFZa5ESadmljQ==
vconsole-webpack-plugin@^1.6.1:
version "1.6.1"
resolved "https://registry.nlark.com/vconsole-webpack-plugin/download/vconsole-webpack-plugin-1.6.1.tgz#7a9ee82c0a90d58964034f6d6bd349242ce65a70"
integrity sha1-ep7oLAqQ1YlkA09ta9NJJCzmWnA=
dependencies:
vconsole "^3.3.4"
vconsole "^3.6"
vconsole@^3.3.4:
version "3.6.0"
resolved "https://registry.yarnpkg.com/vconsole/-/vconsole-3.6.0.tgz#3affe6082271014f8a169ea429b85c148c2cc796"
integrity sha512-vNyB9AwO0gqGub3BLbj4FtwQjlQ8EwhrD1zfcaAwToP/wKcfAoozJiD+6kAzL85FIklgptERcM+c621IEPuItQ==
vconsole@^3.6:
version "3.7.0"
resolved "https://registry.nlark.com/vconsole/download/vconsole-3.7.0.tgz#7b347fc635eb09646bb50f0ce0cbfba1852af1b1"
integrity sha1-ezR/xjXrCWRrtQ8M4Mv7oYUq8bE=
dependencies:
copy-text-to-clipboard "^3.0.1"
core-js "^3.11.0"
......@@ -13650,6 +13729,11 @@ yallist@^4.0.0:
resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72"
integrity sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==
yaml@^1.10.0:
version "1.10.2"
resolved "https://registry.nlark.com/yaml/download/yaml-1.10.2.tgz#2301c5ffbf12b467de8da2333a459e29e7920e4b"
integrity sha1-IwHF/78StGfejaIzOkWeKeeSDks=
yaml@^1.7.2:
version "1.8.2"
resolved "https://registry.yarnpkg.com/yaml/-/yaml-1.8.2.tgz#a29c03f578faafd57dcb27055f9a5d569cb0c3d9"
......@@ -13698,3 +13782,8 @@ yauzl@^2.4.2:
dependencies:
buffer-crc32 "~0.2.3"
fd-slicer "~1.1.0"
yocto-queue@^0.1.0:
version "0.1.0"
resolved "https://registry.nlark.com/yocto-queue/download/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b"
integrity sha1-ApTrPe4FAo0x7hpfosVWpqrxChs=
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