diff --git a/package-lock.json b/package-lock.json index 1c5d1e406..be44b4288 100644 --- a/package-lock.json +++ b/package-lock.json @@ -18762,6 +18762,33 @@ "extsprintf": "^1.2.0" } }, + "video-react": { + "version": "0.14.1", + "resolved": "https://registry.npm.taobao.org/video-react/download/video-react-0.14.1.tgz", + "integrity": "sha1-Sax7GfHQOcCz6+yC+BIkvC+ovfE=", + "requires": { + "@babel/runtime": "^7.4.5", + "classnames": "^2.2.6", + "lodash.throttle": "^4.1.1", + "prop-types": "^15.7.2", + "redux": "^4.0.1" + }, + "dependencies": { + "@babel/runtime": { + "version": "7.11.2", + "resolved": "https://registry.npm.taobao.org/@babel/runtime/download/@babel/runtime-7.11.2.tgz?cache=0&sync_timestamp=1596637887062&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40babel%2Fruntime%2Fdownload%2F%40babel%2Fruntime-7.11.2.tgz", + "integrity": "sha1-9UnBPHVMxAuHZEufqfCaapX+BzY=", + "requires": { + "regenerator-runtime": "^0.13.4" + } + }, + "regenerator-runtime": { + "version": "0.13.7", + "resolved": "https://registry.npm.taobao.org/regenerator-runtime/download/regenerator-runtime-0.13.7.tgz?cache=0&sync_timestamp=1595456367497&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fregenerator-runtime%2Fdownload%2Fregenerator-runtime-0.13.7.tgz", + "integrity": "sha1-ysLazIoepnX+qrrriugziYrkb1U=" + } + } + }, "vm-browserify": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-1.1.2.tgz", diff --git a/package.json b/package.json index 0bcaa7fce..c126f6454 100644 --- a/package.json +++ b/package.json @@ -14,7 +14,6 @@ "babel-eslint": "7.2.3", "babel-jest": "20.0.3", "babel-loader": "7.1.2", - "code-prettify": "^0.1.0", "babel-plugin-syntax-dynamic-import": "^6.18.0", "babel-preset-react-app": "^3.1.1", "babel-runtime": "6.26.0", @@ -24,6 +23,7 @@ "chalk": "1.1.3", "classnames": "^2.2.5", "clipboard": "^2.0.6", + "code-prettify": "^0.1.0", "codemirror": "^5.53.0", "connected-react-router": "4.4.1", "css-loader": "^3.5.2", @@ -107,6 +107,7 @@ "styled-components": "^4.4.1", "sw-precache-webpack-plugin": "0.11.4", "url-loader": "0.6.2", + "video-react": "^0.14.1", "webpack-cli": "^3.3.11", "webpack-dev-server": "^3.10.3", "webpack-manifest-plugin": "^2.2.0", diff --git a/src/AppConfig.js b/src/AppConfig.js index dadadc5f3..153780b3f 100644 --- a/src/AppConfig.js +++ b/src/AppConfig.js @@ -64,8 +64,8 @@ export function initAxiosInterceptors(props) { initOnlineOfflineListener() // TODO 避免重复的请求 https://github.com/axios/axios#cancellation var - proxy = "http://localhost:3000" - proxy = "https://testforgeplus.trustie.net" + // proxy = "http://localhost:3000" + proxy = "https://forgeplus.trustie.net" const requestMap = {}; window.setfalseInRequestMap = function (keyName) { diff --git a/src/forge/Upload/attachment.js b/src/forge/Upload/attachment.js index 664fa15cd..26f932a70 100644 --- a/src/forge/Upload/attachment.js +++ b/src/forge/Upload/attachment.js @@ -1,82 +1,164 @@ -import React, { Component } from 'react'; -import {Link} from 'react-router-dom'; +import React, { Component } from "react"; +import { Link } from "react-router-dom"; import axios from "axios"; -import {Popconfirm} from "antd"; -class Attachment extends Component{ - constructor(props){ +import { Popconfirm, Modal, Button, Icon } from "antd"; +import Videos from "./videos"; +class Attachment extends Component { + constructor(props) { super(props); - this.state={ + this.state = { canDelete: false, - Deleted:[] - } + show_video: false, + video_url: undefined, + video_title: undefined, + Deleted: [], + }; } - componentDidMount=()=>{ + componentDidMount = () => { this.getDetail(); - } + }; - getDetail=()=>{ + getDetail = () => { this.setState({ - canDelete: this.props.canDelete - }) - } + canDelete: this.props.canDelete, + }); + }; + + show_video_modal = (item) => { + this.setState({ + show_video: true, + video_url: item.url, + video_title: item.title, + }); + }; + hide_video_modal = () => { + this.setState({ + show_video: false, + video_url: undefined, + video_title: undefined, + }); + }; + + is_video = (name) => { + const video_names = ["mp4", "flv", "mkv", "3gp"]; + return video_names.indexOf(name.split(".").pop()) > -1; + }; deleteAttachment = (id) => { - const url = `/attachments/${id}.json` - axios.delete(url, { - }).then((response) => { - if (response.data) { - if (response.data.status === 0) { - this.setState({ - Deleted: this.state.Deleted.concat(id) - }); - this.props.showNotification("附件删除成功") - }else{ - this.props.showNotification(response.data.message) + const url = `/attachments/${id}.json`; + axios + .delete(url, {}) + .then((response) => { + if (response.data) { + if (response.data.status === 0) { + this.setState({ + Deleted: this.state.Deleted.concat(id), + }); + this.props.showNotification("附件删除成功"); + } else { + this.props.showNotification(response.data.message); + } } - } - }).catch(function (error) { - console.log(error); - }); - } + }) + .catch(function (error) { + console.log(error); + }); + }; - render(){ - const { Deleted , canDelete } = this.state; - const { attachments }= this.props - return( + render() { + const { + Deleted, + canDelete, + show_video, + video_url, + video_title, + } = this.state; + const { attachments } = this.props; + return (
- { - attachments ? -
- { - attachments.map((item,key)=>{ - return( -
0 && Deleted.indexOf(item.id) !== -1) ? "none" : "block"}} className="pd510 attachment-list-div" > - - - {item.title} - {item.filesize} - - { - canDelete ? - this.deleteAttachment(item.id)}> - - - : - "" - } -
+ {attachments ? ( +
+ {attachments.map((item, key) => { + return ( +
0 && Deleted.indexOf(item.id) !== -1 + ? "none" + : "block", + }} + className="pd510 attachment-list-div" + > + {this.is_video(item.title) ? ( + this.show_video_modal(item)} + className="attachment-list-a" + > + + {item.title} + {item.filesize} + + + ) : ( + + + {item.title} + {item.filesize} + + )} - ) - }) - } -
- - : - "" - } + {canDelete ? ( + this.deleteAttachment(item.id)} + > + + + + + ) : ( + "" + )} +
+ ); + })} +
+ ) : ( + "" + )} + {show_video ? ( + + + + ) : ( + "" + )}
- ) + ); } } -export default Attachment; \ No newline at end of file +export default Attachment; diff --git a/src/forge/Upload/videos.js b/src/forge/Upload/videos.js new file mode 100644 index 000000000..1bf68ec4f --- /dev/null +++ b/src/forge/Upload/videos.js @@ -0,0 +1,41 @@ +import React, { useEffect, useState, Fragment } from "react"; +import "../../../node_modules/video-react/dist/video-react.css"; +import { + Player, + ControlBar, + PlayToggle, // PlayToggle 播放/暂停按钮 若需禁止加 disabled + ReplayControl, // 后退按钮 + ForwardControl, // 前进按钮 + CurrentTimeDisplay, + TimeDivider, + PlaybackRateMenuButton, // 倍速播放选项 + VolumeMenuButton, + BigPlayButton, +} from "video-react"; +function videos(video_url) { + const [VideUrl, setUrl] = useState(null); //用户的内容 + useEffect(() => { + setUrl(video_url); + }, []); + + return ( + +
+ + + + + + + + + + + + + +
+ + ); +} +export default videos;