diff --git a/src/Common/Utils.ts b/src/Common/Utils.ts index 3b8ff2435..0ec050916 100644 --- a/src/Common/Utils.ts +++ b/src/Common/Utils.ts @@ -241,3 +241,16 @@ export function Uint8ArrayToBase64(bytes: Uint8Array) binary += String.fromCharCode(bytes[i]); return window.btoa(binary); } + +/**转换服务端获取的文件大小 */ +export function getFileSize(size: number) +{ + let units = ["B", "KB", "MB", "GB"]; + for (let u of units) + { + if (size > 1 && size < 1024) + return FixedNotZero(size, 2) + u; + else + size /= 1024; + } +} diff --git a/src/UI/Components/SourceManage/FileList.tsx b/src/UI/Components/SourceManage/FileList.tsx index 2ec8e5c41..6c730e042 100644 --- a/src/UI/Components/SourceManage/FileList.tsx +++ b/src/UI/Components/SourceManage/FileList.tsx @@ -6,7 +6,7 @@ import { CURRENT_HOST } from '../../../Common/HostUrl'; import { MouseKey } from '../../../Common/KeyEnum'; import { FileServer } from '../../../DatabaseServices/FileServer'; import { TopPanelStore } from '../../Store/TopPanelStore'; -import { FixedNotZero } from '../../../Common/Utils'; +import { getFileSize } from '../../../Common/Utils'; export interface IFileListProps { @@ -18,17 +18,6 @@ export interface IFileListProps info: { fid: string, name: string }; } -function getFileSize(size: number) -{ - let units = ["B", "KB", "MB", "GB"]; - for (let u of units) - { - if (size > 1 && size < 1024) - return FixedNotZero(size, 2) + u; - else - size /= 1024; - } -} @inject('store') @observer diff --git a/src/UI/Components/SourceManage/ImgList.tsx b/src/UI/Components/SourceManage/ImgList.tsx index b1541baa7..355ca3ac4 100644 --- a/src/UI/Components/SourceManage/ImgList.tsx +++ b/src/UI/Components/SourceManage/ImgList.tsx @@ -3,6 +3,8 @@ import { inject, observer } from 'mobx-react'; import * as React from 'react'; import { MaterialStore } from '../../Store/MaterialStore'; import { CURRENT_HOST } from '../../../Common/HostUrl'; +import { getFileSize } from '../../../Common/Utils'; +import { observable } from 'mobx'; export interface IImgListProps { @@ -15,6 +17,7 @@ export interface IImgListProps @inject('store') @observer export class ImgList extends React.Component { + @observable private isShowSize = false; renderEditorPanel(pic) { return ( @@ -66,46 +69,63 @@ export class ImgList extends React.Component { const isMatStore = this.props.store instanceof MaterialStore; return ( - + this.isShowSize = !this.isShowSize} + /> + ); } } diff --git a/src/UI/Components/SourceManage/MaterialList.tsx b/src/UI/Components/SourceManage/MaterialList.tsx index 478f08b87..3575173d3 100644 --- a/src/UI/Components/SourceManage/MaterialList.tsx +++ b/src/UI/Components/SourceManage/MaterialList.tsx @@ -6,6 +6,8 @@ import { appUi } from '../../Layout/ApplicationLayout'; import { AppToaster } from '../Toaster'; import { inflate, MaterialIn, MaterialInAndAppendAppData } from '../../../Common/SerializeMaterial'; import { MaterialUrls, CURRENT_HOST } from '../../../Common/HostUrl'; +import { observable } from 'mobx'; +import { getFileSize } from '../../../Common/Utils'; export interface IImgListProps { @@ -17,6 +19,7 @@ export interface IImgListProps @observer export class MaterialList extends React.Component { + @observable private isShowSize = false; private readyMtl; private handleGetMtlJson = async (mat: { material_id: string }): Promise => { @@ -71,60 +74,77 @@ export class MaterialList extends React.Component { public render() { return ( -
    - { - this.props.dataList.map(mtl => + <> +
      { - return ( -
    • this.handleDragStart(mtl)} - > -
      this.handleDbClick(mtl)} + this.props.dataList.map(mtl => + { + return ( +
    • this.handleDragStart(mtl)} > - - -

      {mtl.name}

      - -

      确认删除材质

      -
      -
      - - } - target={
    • - ) - }) - } -
    + this.isShowSize && +
    {getFileSize(parseFloat(mtl.size))}
    + } +

    {mtl.name}

    + +

    确认删除材质

    +
    +
    + + } + target={
+ this.isShowSize = !this.isShowSize} + /> + ); } }