10 changed files with 102 additions and 203 deletions
@ -1,59 +0,0 @@ |
|||||
import React from 'react' |
|
||||
import DataView from '../logView' |
|
||||
import { ConsoleType } from '../store' |
|
||||
|
|
||||
interface Props { |
|
||||
logList: ConsoleType[] |
|
||||
} |
|
||||
|
|
||||
const Log: React.FC<Props> = (props) => { |
|
||||
const renderLogList = (logList: ConsoleType[]) => { |
|
||||
return logList.map((log: ConsoleType, index: number) => { |
|
||||
const dataView = log.infos.map((info: any, i: number) => { |
|
||||
return typeof info !== 'object' || info === null ? |
|
||||
<div key={i}>{`${info}`}</div> : |
|
||||
<DataView data={info} key={i} /> |
|
||||
}) |
|
||||
let ele = null |
|
||||
|
|
||||
// 根据不同console类型展示不同的样式
|
|
||||
switch (log.logType) { |
|
||||
case 'warn': |
|
||||
ele = <div |
|
||||
key={index} |
|
||||
style={{ |
|
||||
background: '#fffacd', |
|
||||
color: 'orange', |
|
||||
border: '1px solid #ffb930' |
|
||||
}} |
|
||||
> |
|
||||
{dataView} |
|
||||
</div> |
|
||||
break |
|
||||
case 'log': |
|
||||
ele = <div key={index}> |
|
||||
{dataView} |
|
||||
</div> |
|
||||
break |
|
||||
case 'error': |
|
||||
ele = <div |
|
||||
key={index} |
|
||||
style={{ |
|
||||
background: '#ffe4e1', |
|
||||
border: '1px solid #f4a0ab' |
|
||||
}} |
|
||||
> |
|
||||
<div style={{ color: '#dc143c' }}>{dataView}</div> |
|
||||
</div> |
|
||||
break |
|
||||
} |
|
||||
return ele |
|
||||
}) |
|
||||
} |
|
||||
|
|
||||
return ( |
|
||||
<div style={{ height: '100%', overflow: 'auto' }}>{renderLogList(props.logList)}</div> |
|
||||
) |
|
||||
} |
|
||||
|
|
||||
export default Log |
|
@ -1,35 +0,0 @@ |
|||||
export interface ConsoleType { |
|
||||
logType: string |
|
||||
infos: any[] |
|
||||
} |
|
||||
|
|
||||
export class ConsoleStore { |
|
||||
logList: ConsoleType[] = [] |
|
||||
logType: string = 'All' |
|
||||
|
|
||||
addLog(log: ConsoleType) { |
|
||||
this.logList.push(log) |
|
||||
} |
|
||||
|
|
||||
clearLog() { |
|
||||
this.logList = [] |
|
||||
} |
|
||||
|
|
||||
get computeLogList() { |
|
||||
let ret: ConsoleType[] = [] |
|
||||
if (this.logType === 'All') { |
|
||||
ret = this.logList |
|
||||
} else { |
|
||||
ret = this.logList.filter((item) => { |
|
||||
return item.logType === this.logType.toLowerCase() |
|
||||
}) |
|
||||
} |
|
||||
return ret |
|
||||
} |
|
||||
|
|
||||
changeLogType(type: string) { |
|
||||
this.logType = type |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
export default new ConsoleStore() |
|
Loading…
Reference in new issue