1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-26 07:22:34 +00:00

[audio file view] fixup & improvements for inner/history/trash/shared file view (#7940)

This commit is contained in:
llj
2025-06-17 18:16:16 +08:00
committed by GitHub
parent 96a6f60e2a
commit 2b9fe4acc8
4 changed files with 16 additions and 18 deletions

View File

@@ -1,18 +1,25 @@
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types';
import AudioPlayer from '../audio-player'; import AudioPlayer from '../audio-player';
import '../../css/audio-file-view.css'; import '../../css/audio-file-view.css';
const propTypes = {
src: PropTypes.string
};
const { rawPath } = window.app.pageOptions; const { rawPath } = window.app.pageOptions;
class FileContent extends React.Component { class AudioFileContent extends React.Component {
render() { render() {
const { src = rawPath } = this.props;
const videoJsOptions = { const videoJsOptions = {
autoplay: false, autoplay: false,
controls: true, controls: true,
preload: 'auto', preload: 'auto',
sources: [{ sources: [{
src: rawPath src: src
}] }]
}; };
return ( return (
@@ -23,4 +30,6 @@ class FileContent extends React.Component {
} }
} }
export default FileContent; AudioFileContent.propTypes = propTypes;
export default AudioFileContent;

View File

@@ -1,4 +1,5 @@
.audio-file-view .video-js { .audio-file-view .video-js {
display: block; /* for the current video.js(v8.22.0) */
width: calc(100% - 40px); width: calc(100% - 40px);
max-width: 500px; max-width: 500px;
height: 3em; height: 3em;

View File

@@ -110,7 +110,7 @@ body {
font-size: .8125rem; font-size: .8125rem;
} }
.file-view-content { .file-view-body .file-view-content {
padding: 30px 0; padding: 30px 0;
background: #f4f4f4; background: #f4f4f4;
border-right: 4px solid transparent; border-right: 4px solid transparent;

View File

@@ -2,9 +2,7 @@ import React from 'react';
import { createRoot } from 'react-dom/client'; import { createRoot } from 'react-dom/client';
import SharedFileView from './components/shared-file-view/shared-file-view'; import SharedFileView from './components/shared-file-view/shared-file-view';
import SharedFileViewTip from './components/shared-file-view/shared-file-view-tip'; import SharedFileViewTip from './components/shared-file-view/shared-file-view-tip';
import AudioPlayer from './components/audio-player'; import Audio from './components/file-content-view/audio';
import './css/audio-file-view.css';
const { rawPath, err } = window.shared.pageOptions; const { rawPath, err } = window.shared.pageOptions;
@@ -20,19 +18,9 @@ class FileContent extends React.Component {
return <SharedFileViewTip />; return <SharedFileViewTip />;
} }
const videoJsOptions = {
autoplay: false,
controls: true,
preload: 'auto',
sources: [{
src: rawPath
}]
};
return ( return (
<div className="shared-file-view-body d-flex"> <div className="shared-file-view-body d-flex">
<div className="flex-1"> <Audio src={rawPath} />
<AudioPlayer { ...videoJsOptions } />
</div>
</div> </div>
); );
} }