database/doris
2
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

Solve the situation that the hardware information of the Web UI home page cannot be loaded (#5585)

Browse Source 
Solve the situation that the hardware information of the Web UI home page cannot be loaded

Co-authored-by: zhangjf@shuhaisc.com <zhangfeng800729>
This commit is contained in:
张家锋
2021-04-08 09:10:56 +08:00
committed by GitHub
parent 79544d39cb
commit 771cb64290
1 changed files with 61 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

118
ui/src/pages/home/index.tsx
View File

@ -17,61 +17,65 @@
* under the License.
*/
import React, {useState, useEffect} from 'react';
import {Typography, Divider, BackTop, Spin} from 'antd';
const {Title, Paragraph, Text} = Typography;
import {getHardwareInfo} from 'Src/api/api';
export default function Home(params: any) {
const [hardwareData , setHardwareData] = useState({});
const getConfigData = function(){
getHardwareInfo().then(res=>{
if (res && res.msg === 'success') {
setHardwareData(res.data);
}
})
.catch(err=>{
setHardwareData({
VersionInfo:{},
HarewareInfo:{},
});
});
};
function getItems(data, flag){
let arr = [];
for (const i in data) {
if (flag) {
arr.push(
<p key={i} dangerouslySetInnerHTML={createMarkup(i,data[i])} ></p>
)
} else {
arr.push(
<p key={i}>{i + ' : ' + data[i]}</p>
)
}
}
return arr;
}
function createMarkup(key,data) {
return {__html:key + ' : ' + String(data)};
}
useEffect(() => {
getConfigData();
}, []);
return(
<Typography style={{padding:'30px'}}>
<Title>Version</Title>
<Paragraph style={{background: '#f9f9f9',padding: '20px'}}>
{...getItems(hardwareData.VersionInfo, false)}
</Paragraph>
<Divider/>
<Title>Hardware Info</Title>
<Paragraph style={{background: '#f9f9f9',padding: '20px'}}>
{...getItems(hardwareData.HarewareInfo, true)}
</Paragraph>
<BackTop></BackTop>
{hardwareData.HarewareInfo?'':<Spin style={{'position':'relative','top':'50%','left':'50%'}}/>}
</Typography>
);
}
import React, {useState, useEffect} from 'react';
import {Typography, Divider, BackTop, Spin} from 'antd';
const {Title, Paragraph, Text} = Typography;
import {getHardwareInfo} from 'Src/api/api';
export default function Home(params: any) {
const [hardwareData , setHardwareData] = useState({});
const getConfigData = function(){
getHardwareInfo().then(res=>{
if (res && res.msg === 'success') {
console.log(res.data)
setHardwareData(res.data);
}
})
.catch(err=>{
setHardwareData({
VersionInfo:{},
HardwareInfo:{},
});
});
};
function getItems(data, flag){
let arr = [];
for (const i in data) {
if (flag) {
const dt = data[i].replace(/\&nbsp;/g, "")
dt = dt.replace(/\<br>/g, "\n")
arr.push(<p key={i} dangerouslySetInnerHTML={createMarkup(i,dt)} ></p>
)
} else {
const dt = data[i].replace(/\&nbsp;/g, "")
dt = dt.replace(/\<br>/g, "\n")
arr.push(<p key={i}>{i + ' : ' + dt}</p>
)
}
}
return arr;
}
function createMarkup(key,data) {
return {__html:key + ' : ' + String(data)};
}
useEffect(() => {
getConfigData();
}, []);
return(
<Typography style={{padding:'30px'}}>
<Title>Version</Title>
<Paragraph style={{background: '#f9f9f9',padding: '20px'}}>
{...getItems(hardwareData.VersionInfo, false)}
</Paragraph>
<Divider/>
<Title>Hardware Info</Title>
<Paragraph style={{background: '#f9f9f9',padding: '20px'}}>
{...getItems(hardwareData.HardwareInfo, false)}
</Paragraph>
<BackTop></BackTop>
{hardwareData.HarewareInfo ?'':<Spin style={{'position':'relative','top':'50%','left':'50%'}}/>}
</Typography>
);
}