diff --git a/src/client/web/src/components/browser.tsx b/src/client/web/src/components/browser.tsx index aa10c30..2266460 100644 --- a/src/client/web/src/components/browser.tsx +++ b/src/client/web/src/components/browser.tsx @@ -9,6 +9,7 @@ import { ICoreState, MsgProps } from "./core_state"; import { MetadataResp, UploadInfo } from "../client"; import { Up } from "../worker/upload_mgr"; import { UploadEntry } from "../worker/interface"; +import { Flexbox } from "./layout/flexbox"; export interface Item { name: string; @@ -556,13 +557,18 @@ export class Browser extends React.Component { {this.props.browser.uploadings.size === 0 ? null : (
-
- - - {this.props.msg.pkg.get("browser.upload.title")} - - -
+ + + + {this.props.msg.pkg.get("browser.upload.title")} + + , + , + ])} + /> + {uploadingList}
)} diff --git a/src/client/web/src/components/layout/flexbox.tsx b/src/client/web/src/components/layout/flexbox.tsx new file mode 100644 index 0000000..709f693 --- /dev/null +++ b/src/client/web/src/components/layout/flexbox.tsx @@ -0,0 +1,48 @@ +import * as React from "react"; +import { List } from "immutable"; + +export interface Props { + children: List; + childrenStyles?: List; + style?: React.CSSProperties; + className?: string; +} + +const containerStyle = { + display: "flex", + "flex-direction": "row", + "flex-wrap": "nowrap", + "align-items": "center", + "justify-content": "flex-start", +}; + +const childrenStyle = { + flex: "50%", + display: "flex", + "align-items": "flex-start", + "justify-content": "flex-start", +}; + +export const Flexbox = (props: Props) => { + const childrenCount = props.children.size; + const children = props.children.map( + (child: JSX.Element, i: number): JSX.Element => { + return ( +
+ {child} +
+ ); + } + ); + + return
{children}
; +}; diff --git a/src/client/web/src/i18n/en_US.ts b/src/client/web/src/i18n/en_US.ts index 5ac7232..7acdcff 100644 --- a/src/client/web/src/i18n/en_US.ts +++ b/src/client/web/src/i18n/en_US.ts @@ -11,6 +11,7 @@ export const msgs: Map = Map({ "browser.share.del": "Stop sharing", "browser.share.add": "Share it", "browser.share.title": "Sharings", + "browser.upload.title": "Uploadings", "browser.folder.name": "Folder name", "browser.folder.add": "Add Folder", "browser.upload": "Upload", diff --git a/src/client/web/src/i18n/zh_CN.ts b/src/client/web/src/i18n/zh_CN.ts index efe88ea..795bf57 100644 --- a/src/client/web/src/i18n/zh_CN.ts +++ b/src/client/web/src/i18n/zh_CN.ts @@ -3,7 +3,6 @@ import { Map } from "immutable"; export const msgs: Map = Map({ "stateMgr.cap.fail": "获取captcha id失败", "browser.upload.del.fail": "删除上传失败", - "browser.upload.title": "正在上传", "browser.folder.add.fail": "文件夹名不可为空", "browser.del.fail": "至少选择一个文件或文件夹", "browser.move.fail": "源与目标相同", @@ -12,6 +11,7 @@ export const msgs: Map = Map({ "browser.share.del": "停止共享", "browser.share.add": "开始共享", "browser.share.title": "共享列表", + "browser.upload.title": "上传列表", "browser.folder.name": "文件夹名", "browser.folder.add": "添加文件夹", "browser.upload": "上传",