Commit 4b11a84c authored by haiyoucuv's avatar haiyoucuv

init

parent 253abefb
......@@ -116,9 +116,6 @@ importers:
tailwindcss:
specifier: ^4.1.4
version: 4.1.4
video.js:
specifier: ^8.22.0
version: 8.22.0
devDependencies:
'@assetpack/core':
specifier: ^1.4.0
......@@ -159,9 +156,6 @@ importers:
'@types/react-dom':
specifier: ^18.3.0
version: 18.3.5(@types/react@18.3.18)
'@types/video.js':
specifier: ^7.3.58
version: 7.3.58
'@vitejs/plugin-legacy':
specifier: ^5.4.2
version: 5.4.3(terser@5.39.0)(vite@6.3.3(@types/node@22.13.4)(jiti@2.4.2)(less@4.3.0)(lightningcss@1.29.1)(terser@5.39.0))
......@@ -1863,9 +1857,6 @@ packages:
'@types/svg2ttf@5.0.3':
resolution: {integrity: sha512-hL+/A4qMISvDbDTtdY73R0zuvsdc7YRYnV5FyAfKVGk8OsluXu/tCFxop7IB5Sgr+ZCS0hHtFxylD0REmm+abA==}
'@types/video.js@7.3.58':
resolution: {integrity: sha512-1CQjuSrgbv1/dhmcfQ83eVyYbvGyqhTvb2Opxr0QCV+iJ4J6/J+XWQ3Om59WiwCd1MN3rDUHasx5XRrpUtewYQ==, tarball: http://npm.dui88.com:80/@types%2fvideo.js/-/video.js-7.3.58.tgz}
'@typescript-eslint/eslint-plugin@8.24.1':
resolution: {integrity: sha512-ll1StnKtBigWIGqvYDVuDmXJHVH4zLVot1yQ4fJtLpL7qacwkxJc1T0bptqw+miBQ/QfUbhl1TcQ4accW5KUyA==}
engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
......@@ -1913,19 +1904,6 @@ packages:
resolution: {integrity: sha512-EwVHlp5l+2vp8CoqJm9KikPZgi3gbdZAtabKT9KPShGeOcJhsv4Zdo3oc8T8I0uKEmYoU4ItyxbptjF08enaxg==}
engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
'@videojs/http-streaming@3.17.0':
resolution: {integrity: sha512-Ch1P3tvvIEezeZXyK11UfWgp4cWKX4vIhZ30baN/lRinqdbakZ5hiAI3pGjRy3d+q/Epyc8Csz5xMdKNNGYpcw==}
engines: {node: '>=8', npm: '>=5'}
peerDependencies:
video.js: ^8.19.0
'@videojs/vhs-utils@4.1.1':
resolution: {integrity: sha512-5iLX6sR2ownbv4Mtejw6Ax+naosGvoT9kY+gcuHzANyUZZ+4NpeNdKMUhb6ag0acYej1Y7cmr/F2+4PrggMiVA==}
engines: {node: '>=8', npm: '>=5'}
'@videojs/xhr@2.7.0':
resolution: {integrity: sha512-giab+EVRanChIupZK7gXjHy90y3nncA2phIOyG3Ne5fvpiMJzvqYwiTOnEVW2S4CoYcuKJkomat7bMXA/UoUZQ==}
'@vitejs/plugin-legacy@5.4.3':
resolution: {integrity: sha512-wsyXK9mascyplcqvww1gA1xYiy29iRHfyciw+a0t7qRNdzX6PdfSWmOoCi74epr87DujM+5J+rnnSv+4PazqVg==}
engines: {node: ^18.0.0 || >=20.0.0}
......@@ -1964,9 +1942,6 @@ packages:
resolution: {integrity: sha512-4B/qKCfeE/ODUaAUpSwfzazo5x29WD4r3vXiWsB7I2mSDAihwEqKO+g8GELZUQSSAo5e1XTYh3ZVfLyxBc12nA==}
engines: {node: '>= 10.0.0'}
aes-decrypter@4.0.2:
resolution: {integrity: sha512-lc+/9s6iJvuaRe5qDlMTpCFjnwpkeOXp8qP3oiZ5jsj1MRg+SBVUmmICrhxHvc8OELSmc+fEyyxAuppY6hrWzw==}
agentkeepalive@3.5.3:
resolution: {integrity: sha512-yqXL+k5rr8+ZRpOAntkaaRgWgE5o8ESAj5DyRmVTCSoZxXmqemb9Dd7T4i5UzwuERdLAJUy6XzR9zFVuf0kzkw==}
engines: {node: '>= 4.0.0'}
......@@ -3271,9 +3246,6 @@ packages:
lru-cache@5.1.1:
resolution: {integrity: sha1-HaJ+ZxAnGUdpXa9oSOhH8B2EuSA=}
m3u8-parser@7.2.0:
resolution: {integrity: sha512-CRatFqpjVtMiMaKXxNvuI3I++vUumIXVVT/JpCpdU/FynV/ceVw1qpPyyBNindL+JlPMSesx+WX1QJaZEJSaMQ==}
magic-string@0.30.17:
resolution: {integrity: sha512-sNPKHvyjVf7gyjwS4xGTaW/mCnF8wnjtifKBEhxfZ7E/S8tQ0rssrwGNn6q8JH/ohItJfSQp9mBtQYuTlH5QnA==}
......@@ -3412,10 +3384,6 @@ packages:
moment@2.30.1:
resolution: {integrity: sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==}
mpd-parser@1.3.1:
resolution: {integrity: sha512-1FuyEWI5k2HcmhS1HkKnUAQV7yFPfXPht2DnRRGtoiiAAW+ESTbtEXIDpRkwdU+XyrQuwrIym7UkoPKsZ0SyFw==}
hasBin: true
ms@2.0.0:
resolution: {integrity: sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=}
......@@ -3426,11 +3394,6 @@ packages:
resolution: {integrity: sha512-L/I6VFAk/vCZKh0T2eyc73lDOUpQvj4QS2XKG1I1msZo6qHabe2OinBrA0KDjHvKnliVZJxGV4eohC4asicOZg==}
hasBin: true
mux.js@7.1.0:
resolution: {integrity: sha512-NTxawK/BBELJrYsZThEulyUMDVlLizKdxyAsMuzoCD1eFj97BVaA8D/CvKsKu6FOLYkFojN5CbM9h++ZTZtknA==}
engines: {node: '>=8', npm: '>=5'}
hasBin: true
mz@2.7.0:
resolution: {integrity: sha1-lQCAV6Vsr63CvGPd5/n/aVWUjjI=}
......@@ -3666,10 +3629,6 @@ packages:
pixi.js@8.9.1:
resolution: {integrity: sha512-2vF5Yu9WC/83ly2tCGkjb+ZGnrr+vlKtZezmD0AmJEQoYZO5nL94806l+PVcJBKW6qrF0YHtbh0ubb6CB7/8Rg==}
pkcs7@1.0.4:
resolution: {integrity: sha1-YJC55xFg2r9pIJ1xnLr6U4sAocs=}
hasBin: true
platform@1.3.6:
resolution: {integrity: sha1-SLTOmDFksgnC1FoQetsx9HOm56c=}
......@@ -4276,7 +4235,7 @@ packages:
typescript: '>=4.8.4'
tslib@2.8.1:
resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==, tarball: http://npm.dui88.com:80/tslib/-/tslib-2.8.1.tgz}
resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==}
tweedle.js@2.1.0:
resolution: {integrity: sha512-0ReQgVjepoZkE6t0upWNgCRbplHkQJQYk1LStXugwSR728GLFmGDRuaQJlxeC/iBlxud6+P1RdODjaO25vHAqw==}
......@@ -4409,21 +4368,6 @@ packages:
utrie@1.0.2:
resolution: {integrity: sha512-1MLa5ouZiOmQzUbjbu9VmjLzn1QLXBhwpUa7kdLUQK+KQ5KA9I1vk5U4YHe/X2Ch7PYnJfWuWT+VbuxbGwljhw==}
video.js@8.22.0:
resolution: {integrity: sha512-xge2kpjsvC0zgFJ1cqt+wTqsi21+huFswlonPFh7qiplypsb4FN/D2Rz6bWdG/S9eQaPHfWHsarmJL/7D3DHoA==}
videojs-contrib-quality-levels@4.1.0:
resolution: {integrity: sha512-TfrXJJg1Bv4t6TOCMEVMwF/CoS8iENYsWNKip8zfhB5kTcegiFYezEA0eHAJPU64ZC8NQbxQgOwAsYU8VXbOWA==}
engines: {node: '>=16', npm: '>=8'}
peerDependencies:
video.js: ^8
videojs-font@4.2.0:
resolution: {integrity: sha512-YPq+wiKoGy2/M7ccjmlvwi58z2xsykkkfNMyIg4xb7EZQQNwB71hcSsB3o75CqQV7/y5lXkXhI/rsGAS7jfEmQ==}
videojs-vtt.js@0.15.5:
resolution: {integrity: sha512-yZbBxvA7QMYn15Lr/ZfhhLPrNpI/RmCSCqgIff57GC2gIrV5YfyzLfLyZMj0NnZSAz8syB4N0nHXpZg9MyrMOQ==}
vite-plugin-mock@3.0.2:
resolution: {integrity: sha512-bD//HvkTygGmk+LsIAdf0jGNlCv4iWv0kZlH9UEgWT6QYoUwfjQAE4SKxHRw2tfLgVhbPQVv/+X3YlNWvueGUA==}
engines: {node: '>=16.0.0'}
......@@ -4516,7 +4460,7 @@ packages:
engines: {node: '>=8'}
wrap-ansi@7.0.0:
resolution: {integrity: sha1-Z+FFz/UQpqaYS98RUpEdadLrnkM=, tarball: http://npm.dui88.com:80/wrap-ansi/-/wrap-ansi-7.0.0.tgz}
resolution: {integrity: sha1-Z+FFz/UQpqaYS98RUpEdadLrnkM=}
engines: {node: '>=10'}
wrap-ansi@8.1.0:
......@@ -6265,8 +6209,6 @@ snapshots:
'@types/svg2ttf@5.0.3': {}
'@types/video.js@7.3.58': {}
'@typescript-eslint/eslint-plugin@8.24.1(@typescript-eslint/parser@8.24.1(eslint@9.20.1(jiti@2.4.2))(typescript@5.5.4))(eslint@9.20.1(jiti@2.4.2))(typescript@5.5.4)':
dependencies:
'@eslint-community/regexpp': 4.12.1
......@@ -6344,28 +6286,6 @@ snapshots:
'@typescript-eslint/types': 8.24.1
eslint-visitor-keys: 4.2.0
'@videojs/http-streaming@3.17.0(video.js@8.22.0)':
dependencies:
'@babel/runtime': 7.26.9
'@videojs/vhs-utils': 4.1.1
aes-decrypter: 4.0.2
global: 4.4.0
m3u8-parser: 7.2.0
mpd-parser: 1.3.1
mux.js: 7.1.0
video.js: 8.22.0
'@videojs/vhs-utils@4.1.1':
dependencies:
'@babel/runtime': 7.26.9
global: 4.4.0
'@videojs/xhr@2.7.0':
dependencies:
'@babel/runtime': 7.26.9
global: 4.4.0
is-function: 1.0.2
'@vitejs/plugin-legacy@5.4.3(terser@5.39.0)(vite@6.3.3(@types/node@22.13.4)(jiti@2.4.2)(less@4.3.0)(lightningcss@1.29.1)(terser@5.39.0))':
dependencies:
'@babel/core': 7.26.9
......@@ -6406,13 +6326,6 @@ snapshots:
address@1.2.2: {}
aes-decrypter@4.0.2:
dependencies:
'@babel/runtime': 7.26.9
'@videojs/vhs-utils': 4.1.1
global: 4.4.0
pkcs7: 1.0.4
agentkeepalive@3.5.3:
dependencies:
humanize-ms: 1.2.1
......@@ -7816,12 +7729,6 @@ snapshots:
dependencies:
yallist: 3.1.1
m3u8-parser@7.2.0:
dependencies:
'@babel/runtime': 7.26.9
'@videojs/vhs-utils': 4.1.1
global: 4.4.0
magic-string@0.30.17:
dependencies:
'@jridgewell/sourcemap-codec': 1.5.0
......@@ -7929,13 +7836,6 @@ snapshots:
moment@2.30.1: {}
mpd-parser@1.3.1:
dependencies:
'@babel/runtime': 7.26.9
'@videojs/vhs-utils': 4.1.1
'@xmldom/xmldom': 0.8.10
global: 4.4.0
ms@2.0.0: {}
ms@2.1.3: {}
......@@ -7956,11 +7856,6 @@ snapshots:
transitivePeerDependencies:
- debug
mux.js@7.1.0:
dependencies:
'@babel/runtime': 7.26.9
global: 4.4.0
mz@2.7.0:
dependencies:
any-promise: 1.3.0
......@@ -8178,10 +8073,6 @@ snapshots:
ismobilejs: 1.1.1
parse-svg-path: 0.1.2
pkcs7@1.0.4:
dependencies:
'@babel/runtime': 7.26.9
platform@1.3.6: {}
pngjs@3.4.0: {}
......@@ -8972,32 +8863,6 @@ snapshots:
dependencies:
base64-arraybuffer: 1.0.2
video.js@8.22.0:
dependencies:
'@babel/runtime': 7.26.9
'@videojs/http-streaming': 3.17.0(video.js@8.22.0)
'@videojs/vhs-utils': 4.1.1
'@videojs/xhr': 2.7.0
aes-decrypter: 4.0.2
global: 4.4.0
m3u8-parser: 7.2.0
mpd-parser: 1.3.1
mux.js: 7.1.0
videojs-contrib-quality-levels: 4.1.0(video.js@8.22.0)
videojs-font: 4.2.0
videojs-vtt.js: 0.15.5
videojs-contrib-quality-levels@4.1.0(video.js@8.22.0):
dependencies:
global: 4.4.0
video.js: 8.22.0
videojs-font@4.2.0: {}
videojs-vtt.js@0.15.5:
dependencies:
global: 4.4.0
vite-plugin-mock@3.0.2(esbuild@0.25.3)(mockjs@1.1.0)(vite@6.3.3(@types/node@22.13.4)(jiti@2.4.2)(less@4.3.0)(lightningcss@1.29.1)(terser@5.39.0)):
dependencies:
bundle-require: 4.2.1(esbuild@0.25.3)
......
......@@ -57,6 +57,7 @@ const API = generateAPI({
completeGuide: "main/completeGuide.do",
sign: "main/sign.do",
receiveBubble: "main/receiveBubble.do",
startVideo: "main/startVideo.do",
})
......
......@@ -42,8 +42,6 @@ class HomePage extends React.Component<any, any> {
// if (getUrlParam('inviteCode')) {
// store.doAssist()
// }
ModalCtrl.showModal(VideoPanel);
}
clickPrize = () => {
......
......@@ -18,6 +18,43 @@
height: 1148px;
}
.cd {
border: 4px solid rgba(255, 255, 255, 0.4);
border-radius: 50%;
background-color: white;
position: absolute;
left: 535px;
top: 127px;
width: 112px;
height: 112px;
display: flex;
align-items: center;
justify-content: center;
font-size: 37px;
font-weight: bold;
}
.progressBar {
background-color: rgb(196, 196, 196);
position: absolute;
left: 522px;
top: 225px;
width: 146px;
height: 33px;
border-radius: 33px;
overflow: hidden;
}
.progressFill {
background-color: #e51f29;
position: absolute;
left: 0;
top: 0;
width: 146px;
height: 33px;
border-radius: 33px;
}
.close {
position: absolute;
left: 336px;
......
......@@ -4,53 +4,73 @@ import styles from "./VideoPanel.module.less";
import { Button } from "@grace/ui";
import { _asyncThrottle } from "@/utils/utils.ts";
import { ModalCtrl } from "@/core/ctrls/ModalCtrl.tsx";
import { SvgaPlayer } from "@grace/svgaplayer";
import bgEffectSvga from "@/assets/svga/2输出签到成功弹窗.svga";
import classNames from "classnames";
import API from "@/api";
export interface IVideoPanelProps {
signCredits: number;
extraCredits: number;
boolLimit: boolean;
multipleValue: number;
url: string;
taskId: string;
newLuckCreditsNum: number;
}
@observer
class VideoPanel extends React.Component<IVideoPanelProps> {
state = {
cd: 15,
}
video: HTMLVideoElement;
componentDidMount() {
this.video.onpause = this.onPause;
this.video.play();
this.startCd();
}
clickClose = () => {
ModalCtrl.closeModal();
};
intervalId: number = 0;
startCd = () => {
this.intervalId = window.setInterval(() => {
const cd = this.state.cd - 1;
this.setState({ cd });
if (this.state.cd <= 0) {
clearInterval(this.intervalId);
this.finishVideoTask();
return;
}
}, 1000);
}
clickVideo = _asyncThrottle(async () => {
const { signCredits, extraCredits, boolLimit, multipleValue, url, taskId, newLuckCreditsNum } = this.props;
finishVideoTask = _asyncThrottle(async () => {
const { taskId } = this.props;
const { success, data } = await API.startVideo({ taskId });
if (!success) return;
const { creditsNum } = data;
})
onPause = () => {
}
clickClose = () => {
ModalCtrl.closeModal();
});
};
render() {
const { signCredits, extraCredits, multipleValue } = this.props;
const { url } = this.props;
const { cd } = this.state;
return <div className={classNames(styles.VideoPanel, "modal_center")}>
<video
ref={(el) => this.video = el}
id="my-player"
className={styles.video}
controls
preload="auto"
poster="//yun.duiba.com.cn/polaris/001_WC-EditVideo_1(1).dccd6a9094aedb735c584900034c13aad52dd45e.mp4?x-oss-process=video/snapshot,t_1000,f_jpg,w_648,h_1148,m_fast"
controls={true}
poster={`${url}?x-oss-process=video/snapshot,t_1000,f_jpg,w_648,h_1148,m_fast`}
>
<source
src="//yun.duiba.com.cn/polaris/001_WC-EditVideo_1(1).dccd6a9094aedb735c584900034c13aad52dd45e.mp4"
type="video/mp4"
/>
<source src={url} type="video/mp4"/>
<p className="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a
web browser that
......@@ -60,6 +80,13 @@ class VideoPanel extends React.Component<IVideoPanelProps> {
</p>
</video>
<div className={styles.cd}>{cd ? `${cd}s` : "已完成"}</div>
<div className={styles.progressBar}>
<div className={styles.progressFill} style={{
width: `${100 - cd / 15 * 100}%`,
}}/>
</div>
<div className="com_banner"/>
<Button className={styles.close} onClick={this.clickClose}/>
......
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