Add the preview config and engine model.

This commit is contained in:
lishuang
2020-06-21 02:41:36 +08:00
parent 2f76483d05
commit 92eb82e207
10 changed files with 246 additions and 32 deletions
+1 -1
View File
@@ -165,7 +165,7 @@ let LangEn = {
systemCleanup: "System Cleanup",
systemCleanupDescription: "This operation will cleanup everything except administrators' data",
systemCleanupPrompt: "This operation will cleanup everything except administrators' account data, please input login password.",
officeUrl: "Office Preview Url",
previewConfig: "File Preview Config",
editPreference: "Edit Preference",
enterWebsiteName: "Please enter website name!",
enterZipMaxNumLimit: "Please enter zip max num!",
+1 -1
View File
@@ -167,7 +167,7 @@ let LangZh = {
systemCleanup: "重置系统",
systemCleanupDescription: "重置系统将清空除管理员账号外所有数据",
systemCleanupPrompt: "重置系统将清空除管理员账号外所有数据,事关重大,请输入登录密码",
officeUrl: "Office预览链接",
previewConfig: "文件预览配置",
editPreference: "设置网站偏好",
enterWebsiteName: "请输入网站名称!",
enterZipMaxNumLimit: "zip最大数量限制必填!",
+7 -3
View File
@@ -1,5 +1,7 @@
import SafeUtil from '../../util/SafeUtil';
import BaseEntity from '../base/BaseEntity';
import PreviewConfig from "./model/PreviewConfig";
import JsonUtil from "../../util/JsonUtil";
export default class Preference extends BaseEntity {
@@ -27,8 +29,8 @@ export default class Preference extends BaseEntity {
defaultTotalSizeLimit: number = -1
//是否允许自主注册
allowRegister: boolean = false
//Office预览链接
officeUrl: string | null = null
//预览配置
previewConfig: PreviewConfig = new PreviewConfig()
//后台版本
version: string | null = null
@@ -47,6 +49,8 @@ export default class Preference extends BaseEntity {
assign(obj: any) {
super.assign(obj);
this.assignEntity("previewConfig", PreviewConfig)
}
getForm(): any {
@@ -60,7 +64,7 @@ export default class Preference extends BaseEntity {
downloadDirMaxSize: this.downloadDirMaxSize,
defaultTotalSizeLimit: this.defaultTotalSizeLimit,
allowRegister: this.allowRegister,
officeUrl: this.officeUrl
previewConfig: JsonUtil.toJson(this.previewConfig.getForm())
};
}
@@ -0,0 +1,47 @@
/**
* 预览配置
* 支持自定义不同的文件预览类型
*/
import Base from "../../base/Base";
import PreviewEngine from "./PreviewEngine";
/**
* 预览配置
*/
export default class PreviewConfig extends Base {
/**
* 预览引擎
*/
previewEngines: PreviewEngine[] = []
constructor() {
super()
}
assign(obj: any) {
super.assign(obj);
this.assignList("previewEngines", PreviewEngine)
}
getForm(): any {
let forms = this.previewEngines.map((item: PreviewEngine, index: number) => {
return item.getForm()
})
return {
previewEngines: forms
};
}
}
@@ -0,0 +1,37 @@
/**
* 预览配置
* 支持自定义不同的文件预览类型
*/
import Base from "../../base/Base";
export default class PreviewEngine extends Base {
/**
* 此预览引擎的url
*/
url: string = ""
/**
* 此预览引擎支持的文件后缀名。
* 逗号分隔,不带. 例如: xls,doc,ppt,xlsx,docx,pptx
*/
extensions: string = ""
constructor() {
super()
}
getForm(): any {
return {
url: this.url,
extensions: this.extensions,
};
}
}
+32 -27
View File
@@ -1,24 +1,27 @@
import React from "react";
import { RouteComponentProps } from "react-router-dom";
import {RouteComponentProps} from "react-router-dom";
import "./Edit.less";
import TankComponent from "../../common/component/TankComponent";
import User from "../../common/model/user/User";
import Moon from "../../common/model/global/Moon";
import TankTitle from "../widget/TankTitle";
import { Button, Form, Input, InputNumber, Switch } from "antd";
import { SaveOutlined } from "@ant-design/icons";
import {Button, Form, Input, InputNumber, Switch} from "antd";
import {SaveOutlined} from "@ant-design/icons";
import TankContentCard from "../widget/TankContentCard";
import Preference from "../../common/model/preference/Preference";
import FileUtil from "../../common/util/FileUtil";
import { FormInstance } from "antd/lib/form";
import {FormInstance} from "antd/lib/form";
import MessageBoxUtil from "../../common/util/MessageBoxUtil";
import Sun from "../../common/model/global/Sun";
import Lang from "../../common/model/global/Lang";
import MatterImage from "../matter/widget/MatterImage";
import PreviewConfigPanel from "./widget/PreviewConfigPanel";
interface IProps extends RouteComponentProps {}
interface IProps extends RouteComponentProps {
}
interface IState {}
interface IState {
}
export default class Edit extends TankComponent<IProps, IState> {
formRef = React.createRef<FormInstance>();
@@ -77,15 +80,15 @@ export default class Edit extends TankComponent<IProps, IState> {
let preference = that.preference;
const layout = {
labelCol: { span: 6 },
wrapperCol: { span: 18 },
labelCol: {span: 6},
wrapperCol: {span: 18},
};
let initialValues: any = preference.getForm();
return (
<div className="page-preference-edit">
<TankTitle name={Lang.t("preference.editPreference")}></TankTitle>
<TankTitle name={Lang.t("preference.editPreference")}/>
<TankContentCard loading={preference.detailLoading}>
<Form
@@ -107,11 +110,11 @@ export default class Edit extends TankComponent<IProps, IState> {
},
]}
>
<Input />
<Input/>
</Form.Item>
<Form.Item label="logo" name="logoUrl">
<MatterImage uploadHint={Lang.t("preference.logoSquare")} />
<MatterImage uploadHint={Lang.t("preference.logoSquare")}/>
</Form.Item>
<Form.Item label="favicon" name="faviconUrl">
@@ -123,15 +126,11 @@ export default class Edit extends TankComponent<IProps, IState> {
</Form.Item>
<Form.Item label={Lang.t("preference.copyright")} name="copyright">
<Input />
<Input/>
</Form.Item>
<Form.Item label={Lang.t("preference.extraInfo")} name="record">
<Input />
</Form.Item>
<Form.Item label={Lang.t("preference.officeUrl")} name="officeUrl">
<Input />
<Input/>
</Form.Item>
<Form.Item
@@ -144,7 +143,7 @@ export default class Edit extends TankComponent<IProps, IState> {
},
]}
>
<InputNumber min={-1} max={1000} className="w150" />
<InputNumber min={-1} max={1000} className="w150"/>
</Form.Item>
<Form.Item
@@ -161,15 +160,15 @@ export default class Edit extends TankComponent<IProps, IState> {
]}
noStyle
>
<InputNumber min={-1} className="w150" />
<InputNumber min={-1} className="w150"/>
</Form.Item>
<span className="pl10">
{" "}
{Lang.t("preference.current")}:
{this.formRef && this.formRef.current
? FileUtil.humanFileSize(
this.formRef.current.getFieldValue("downloadDirMaxSize")
)
this.formRef.current.getFieldValue("downloadDirMaxSize")
)
: FileUtil.humanFileSize(preference.defaultTotalSizeLimit)}
</span>
</Form.Item>
@@ -188,17 +187,17 @@ export default class Edit extends TankComponent<IProps, IState> {
]}
noStyle
>
<InputNumber min={-1} className="w150" />
<InputNumber min={-1} className="w150"/>
</Form.Item>
<span className="pl10">
{" "}
{Lang.t("preference.current")}:
{this.formRef && this.formRef.current
? FileUtil.humanFileSize(
this.formRef.current.getFieldValue(
"defaultTotalSizeLimit"
)
this.formRef.current.getFieldValue(
"defaultTotalSizeLimit"
)
)
: FileUtil.humanFileSize(preference.defaultTotalSizeLimit)}
</span>
</Form.Item>
@@ -209,11 +208,17 @@ export default class Edit extends TankComponent<IProps, IState> {
required={true}
valuePropName="checked"
>
<Switch />
<Switch/>
</Form.Item>
<Form.Item label={Lang.t("preference.previewConfig")}>
<PreviewConfigPanel previewConfig={preference.previewConfig}/>
</Form.Item>
<div className="text-right">
<Button type="primary" htmlType="submit" icon={<SaveOutlined />}>
<Button type="primary" htmlType="submit" icon={<SaveOutlined/>}>
{Lang.t("save")}
</Button>
</div>
@@ -0,0 +1,4 @@
.widget-preview-config-panel {
}
@@ -0,0 +1,66 @@
import React from 'react';
import "./PreviewConfigPanel.less"
import TankComponent from "../../../common/component/TankComponent";
import PreviewConfig from "../../../common/model/preference/model/PreviewConfig";
import PreviewEngine from "../../../common/model/preference/model/PreviewEngine";
import PreviewEngineCell from "./PreviewEngineCell";
import {Button} from "antd";
import {PlusOutlined} from '@ant-design/icons';
interface IProps {
previewConfig: PreviewConfig
}
interface IState {
}
export default class PreviewConfigPanel extends TankComponent <IProps, IState> {
constructor(props: IProps) {
super(props)
this.state = {}
}
componentDidMount() {
}
addEngine() {
let previewConfig: PreviewConfig = this.props.previewConfig
let engine: PreviewEngine = new PreviewEngine()
previewConfig.previewEngines.push(engine)
this.updateUI()
}
render() {
let that = this
let previewConfig: PreviewConfig = this.props.previewConfig
return (
<div className="widget-preview-config-panel">
{previewConfig.previewEngines.map((previewEngine: PreviewEngine, index: number) => {
return <PreviewEngineCell key={index} previewEngine={previewEngine}/>
})}
<Button type="dashed" block={true} icon={<PlusOutlined/>} onClick={this.addEngine.bind(this)}>
</Button>
</div>
)
}
}
@@ -0,0 +1,7 @@
.widget-preview-engine-cell {
}
@@ -0,0 +1,44 @@
import React from 'react';
import "./PreviewEngineCell.less"
import TankComponent from "../../../common/component/TankComponent";
import PreviewEngine from "../../../common/model/preference/model/PreviewEngine";
interface IProps {
previewEngine: PreviewEngine
}
interface IState {
}
export default class PreviewEngineCell extends TankComponent <IProps, IState> {
constructor(props: IProps) {
super(props)
this.state = {}
}
componentDidMount() {
}
render() {
let that = this
let previewEngine: PreviewEngine = this.props.previewEngine
return (
<div className="widget-preview-engine-cell">
URL: {previewEngine.url}
extension: {previewEngine.extensions}
</div>
)
}
}