Compare commits
1 Commits
master
...
auto-71079
Author | SHA1 | Date |
---|---|---|
剑子仙机 | 644efbcfcd |
|
@ -7,7 +7,7 @@ export default {
|
||||||
'menu.monitor.': '监控中心',
|
'menu.monitor.': '监控中心',
|
||||||
'menu.monitor.dashboard': '系统监控',
|
'menu.monitor.dashboard': '系统监控',
|
||||||
'menu.monitor.netinfo': 'NetInfo',
|
'menu.monitor.netinfo': 'NetInfo',
|
||||||
'menu.vmcore': '宕机分析',
|
'menu.vmcore': '宕机中心',
|
||||||
'menu.vmcore.list': '宕机列表',
|
'menu.vmcore.list': '宕机列表',
|
||||||
'menu.vmcore.search': '宕机查询',
|
'menu.vmcore.search': '宕机查询',
|
||||||
'menu.vmcore.match': '宕机匹配',
|
'menu.vmcore.match': '宕机匹配',
|
||||||
|
|
|
@ -8,7 +8,7 @@ const { Header, Content } = Layout;
|
||||||
|
|
||||||
const imgBanner = [
|
const imgBanner = [
|
||||||
{key:1,banner:"#1a2933",title:"主机管理",urls:'/host',des:""},
|
{key:1,banner:"#1a2933",title:"主机管理",urls:'/host',des:""},
|
||||||
{key:2,banner:"#1a2933",title:"宕机分析",urls:'/vmcore',des:""},
|
{key:2,banner:"#1a2933",title:"宕机中心",urls:'/vmcore',des:""},
|
||||||
{key:4,banner:"#1a2933",title:"监控中心",urls:'/monitor',des:""},
|
{key:4,banner:"#1a2933",title:"监控中心",urls:'/monitor',des:""},
|
||||||
{key:3,banner:"#1a2933",title:"诊断中心",urls:'/diagnose',des:""},
|
{key:3,banner:"#1a2933",title:"诊断中心",urls:'/diagnose',des:""},
|
||||||
{key:5,banner:"#1a2933",title:"安全中心",urls:'/security',des:""},
|
{key:5,banner:"#1a2933",title:"安全中心",urls:'/security',des:""},
|
||||||
|
@ -28,7 +28,7 @@ const Welcome = () => {
|
||||||
<SubMenu key="monitor" title="监控中心">
|
<SubMenu key="monitor" title="监控中心">
|
||||||
<Menu.Item key="dashboard"><a href="/monitor/dashboard">系统监控</a></Menu.Item>
|
<Menu.Item key="dashboard"><a href="/monitor/dashboard">系统监控</a></Menu.Item>
|
||||||
</SubMenu>
|
</SubMenu>
|
||||||
<SubMenu key="vmcore" title="宕机分析">
|
<SubMenu key="vmcore" title="宕机中心">
|
||||||
<Menu.Item key="vmlist"><a href="/vmcore/list">宕机列表</a></Menu.Item>
|
<Menu.Item key="vmlist"><a href="/vmcore/list">宕机列表</a></Menu.Item>
|
||||||
<Menu.Item key="vmmatch"><a href="/vmcore/match">宕机匹配</a></Menu.Item>
|
<Menu.Item key="vmmatch"><a href="/vmcore/match">宕机匹配</a></Menu.Item>
|
||||||
</SubMenu>
|
</SubMenu>
|
||||||
|
|
|
@ -1,13 +1,18 @@
|
||||||
import React, { useState, useRef } from "react";
|
import React, { useState, useRef } from "react";
|
||||||
import { Button, message, Descriptions } from "antd";
|
import { Button, message, Descriptions, Popover } from "antd";
|
||||||
import { Link, useIntl, useRequest } from "umi";
|
import { Link, useIntl, useRequest, request } from "umi";
|
||||||
import moment from "moment";
|
|
||||||
import ProCard from "@ant-design/pro-card";
|
import ProCard from "@ant-design/pro-card";
|
||||||
import ProDescriptions from "@ant-design/pro-descriptions";
|
import ProDescriptions from "@ant-design/pro-descriptions";
|
||||||
import { PageContainer } from "@ant-design/pro-layout";
|
import { PageContainer } from "@ant-design/pro-layout";
|
||||||
import { ModalForm, ProFormTextArea } from "@ant-design/pro-form";
|
import { ModalForm, ProFormTextArea } from "@ant-design/pro-form";
|
||||||
import VmcoreTableList from "../components/VmcoreTableList";
|
import VmcoreTableList from "../components/VmcoreTableList";
|
||||||
import { getSolution, addIssue, getSimilarPanic, getVmcoreDetail } from "../service";
|
import { QuestionCircleOutlined } from "@ant-design/icons";
|
||||||
|
import {
|
||||||
|
getSolution,
|
||||||
|
addIssue,
|
||||||
|
getSimilarPanic,
|
||||||
|
getVmcoreDetail,
|
||||||
|
} from "../service";
|
||||||
|
|
||||||
const { Divider } = ProCard;
|
const { Divider } = ProCard;
|
||||||
|
|
||||||
|
@ -30,9 +35,91 @@ const VmcoreDetail = (props) => {
|
||||||
const [createModalIssue, handleModalIssue] = useState(false);
|
const [createModalIssue, handleModalIssue] = useState(false);
|
||||||
const actionRef = useRef();
|
const actionRef = useRef();
|
||||||
const intl = useIntl();
|
const intl = useIntl();
|
||||||
|
const [similarPanicData, setSimilarPanicData] = useState(0);
|
||||||
const { data, error, loading } = useRequest(() => {
|
const { data, error, loading } = useRequest(() => {
|
||||||
return getVmcoreDetail({vmcore_id: props.match.params.id})
|
return getVmcoreDetail({ vmcore_id: props.match.params.id });
|
||||||
})
|
});
|
||||||
|
|
||||||
|
const { datalist } = useRequest(() => {
|
||||||
|
return getVMcoreDetailList();
|
||||||
|
});
|
||||||
|
|
||||||
|
const getVMcoreDetailList = async () => {
|
||||||
|
const msg = await request("/api/v1/vmcore/", {
|
||||||
|
params: { vmcore_id: props.match.params.id, similar: 1 },
|
||||||
|
});
|
||||||
|
setSimilarPanicData({ rawData: msg.data });
|
||||||
|
};
|
||||||
|
|
||||||
|
const firstStackTips = (
|
||||||
|
<div>
|
||||||
|
<div>一层调用栈相似宕机列表,显示只匹配到一层调用栈相似的宕机,</div>
|
||||||
|
<div>如果匹配到有二或三层调用栈相似,将不在此表格显示</div>
|
||||||
|
<div>如无数据,将不显示此表格</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
const secondStackTips = (
|
||||||
|
<div>
|
||||||
|
<div>二层调用栈相似宕机列表,显示只匹配到二层调用栈相似的宕机,</div>
|
||||||
|
<div>如果匹配到有三层调用栈相似,将不在此表格显示</div>
|
||||||
|
<div>如无数据,将不显示此表格</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
const thirdStackTips = (
|
||||||
|
<div>
|
||||||
|
<div>三层调用栈相似宕机列表,显示只匹配到三层调用栈相似的宕机,</div>
|
||||||
|
<div>如无数据,将不显示此表格</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
const issueTips = (
|
||||||
|
<div>
|
||||||
|
<div>如果发现解决此宕机的网址、分析过程或者补丁方案可直接录入,</div>
|
||||||
|
<div>后续一样的宕机问题将会关联到同一个解决方案。</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
|
||||||
|
const HeaderTitleCommon = (props) => {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
{props.title}
|
||||||
|
<Popover content={props.data}>
|
||||||
|
<QuestionCircleOutlined />
|
||||||
|
</Popover>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
const SimilarPanicTable = (props) => {
|
||||||
|
if (props.calltraceLength > 0) {
|
||||||
|
return (
|
||||||
|
<VmcoreTableList
|
||||||
|
headerTitle={[
|
||||||
|
<HeaderTitleCommon
|
||||||
|
title={props.title}
|
||||||
|
data={props.tips}
|
||||||
|
key={props.childKey}
|
||||||
|
/>,
|
||||||
|
]}
|
||||||
|
pagination={{ pageSize: 5 }}
|
||||||
|
params={props.params}
|
||||||
|
request={props.request}
|
||||||
|
postData={props.postData}
|
||||||
|
search={false}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
return (
|
||||||
|
<ProCard>
|
||||||
|
无
|
||||||
|
<HeaderTitleCommon
|
||||||
|
title={props.title}
|
||||||
|
data={props.tips}
|
||||||
|
key={props.childKey}
|
||||||
|
/>
|
||||||
|
</ProCard>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<PageContainer>
|
<PageContainer>
|
||||||
|
@ -59,7 +146,13 @@ const VmcoreDetail = (props) => {
|
||||||
</ModalForm>
|
</ModalForm>
|
||||||
<ProDescriptions
|
<ProDescriptions
|
||||||
actionRef={actionRef}
|
actionRef={actionRef}
|
||||||
title="解决方案"
|
title={[
|
||||||
|
<HeaderTitleCommon
|
||||||
|
title="解决方案"
|
||||||
|
data={issueTips}
|
||||||
|
key="issueTips"
|
||||||
|
/>,
|
||||||
|
]}
|
||||||
params={{ vmcore_id: props.match.params.id }}
|
params={{ vmcore_id: props.match.params.id }}
|
||||||
request={getSolution}
|
request={getSolution}
|
||||||
>
|
>
|
||||||
|
@ -77,63 +170,73 @@ const VmcoreDetail = (props) => {
|
||||||
录入解决方案
|
录入解决方案
|
||||||
</Button>
|
</Button>
|
||||||
<Button type="primary">
|
<Button type="primary">
|
||||||
<Link
|
<Link
|
||||||
target="_blank"
|
target="_blank"
|
||||||
to={{
|
to={{
|
||||||
pathname: '/vmcore/analyse',
|
pathname: "/vmcore/analyse",
|
||||||
search: `kernel_version=${data?.ver}&vmcore_file=${data?.vmcore_file}`,
|
search: `kernel_version=${data?.ver}&vmcore_file=${data?.vmcore_file}`,
|
||||||
}}>
|
}}
|
||||||
在线分析Vmcore
|
>
|
||||||
</Link>
|
在线分析Vmcore
|
||||||
|
</Link>
|
||||||
</Button>
|
</Button>
|
||||||
</ProDescriptions.Item>
|
</ProDescriptions.Item>
|
||||||
</ProDescriptions>
|
</ProDescriptions>
|
||||||
</ProCard>
|
</ProCard>
|
||||||
<Divider />
|
<Divider />
|
||||||
<VmcoreTableList
|
<ProCard>
|
||||||
headerTitle="一层调用栈相似宕机列表"
|
<Descriptions column={2} title="宕机详情">
|
||||||
pagination={{ pageSize: 5 }}
|
<Descriptions.Item label="hostname">
|
||||||
|
{data?.hostname}
|
||||||
|
</Descriptions.Item>
|
||||||
|
<Descriptions.Item label="IP">{data?.ip}</Descriptions.Item>
|
||||||
|
<Descriptions.Item label="RIP">{data?.func_name}</Descriptions.Item>
|
||||||
|
<Descriptions.Item label="当前进程">{data?.comm}</Descriptions.Item>
|
||||||
|
<Descriptions.Item label="内核版本">{data?.ver}</Descriptions.Item>
|
||||||
|
<Descriptions.Item label="宕机时间">
|
||||||
|
{data?.core_time}{" "}
|
||||||
|
</Descriptions.Item>
|
||||||
|
<Descriptions.Item label="dmesg">
|
||||||
|
<pre>{data?.dmesg}</pre>
|
||||||
|
</Descriptions.Item>
|
||||||
|
</Descriptions>
|
||||||
|
</ProCard>
|
||||||
|
<Divider />
|
||||||
|
<SimilarPanicTable
|
||||||
|
title="一层相似调用栈"
|
||||||
|
childKey="similarCalltrace1"
|
||||||
|
tips={firstStackTips}
|
||||||
params={{ vmcore_id: props.match.params.id, similar: 1 }}
|
params={{ vmcore_id: props.match.params.id, similar: 1 }}
|
||||||
request={getSimilarPanic}
|
request={getSimilarPanic}
|
||||||
postData={(data) => {
|
postData={(data) => {
|
||||||
return data?.calltrace_1;
|
return data?.calltrace_1;
|
||||||
}}
|
}}
|
||||||
search={false}
|
calltraceLength={similarPanicData.rawData?.calltrace_1?.length}
|
||||||
/>
|
/>
|
||||||
<Divider />
|
<Divider />
|
||||||
<VmcoreTableList
|
<SimilarPanicTable
|
||||||
headerTitle="二层调用栈相似宕机列表"
|
title="二层相似调用栈"
|
||||||
pagination={{ pageSize: 5 }}
|
childKey="similarCalltrace2"
|
||||||
|
tips={secondStackTips}
|
||||||
params={{ vmcore_id: props.match.params.id, similar: 1 }}
|
params={{ vmcore_id: props.match.params.id, similar: 1 }}
|
||||||
request={getSimilarPanic}
|
request={getSimilarPanic}
|
||||||
postData={(data) => {
|
postData={(data) => {
|
||||||
return data?.calltrace_2;
|
return data?.calltrace_2;
|
||||||
}}
|
}}
|
||||||
search={false}
|
calltraceLength={similarPanicData.rawData?.calltrace_2?.length}
|
||||||
/>
|
/>
|
||||||
<Divider />
|
<Divider />
|
||||||
<VmcoreTableList
|
<SimilarPanicTable
|
||||||
headerTitle="三层调用栈相似宕机列表"
|
title="三层相似调用栈"
|
||||||
pagination={{ pageSize: 5 }}
|
childKey="similarCalltrace3"
|
||||||
|
tips={thirdStackTips}
|
||||||
params={{ vmcore_id: props.match.params.id, similar: 1 }}
|
params={{ vmcore_id: props.match.params.id, similar: 1 }}
|
||||||
request={getSimilarPanic}
|
request={getSimilarPanic}
|
||||||
postData={(data) => {
|
postData={(data) => {
|
||||||
return data?.calltrace_3;
|
return data?.calltrace_3;
|
||||||
}}
|
}}
|
||||||
search={false}
|
calltraceLength={similarPanicData.rawData?.calltrace_3?.length}
|
||||||
/>
|
/>
|
||||||
<Divider />
|
|
||||||
<ProCard>
|
|
||||||
<Descriptions column={2} title="宕机详情" >
|
|
||||||
<Descriptions.Item label="hostname">{data?.hostname}</Descriptions.Item>
|
|
||||||
<Descriptions.Item label="IP" >{data?.ip}</Descriptions.Item>
|
|
||||||
<Descriptions.Item label="RIP" >{data?.func_name}</Descriptions.Item>
|
|
||||||
<Descriptions.Item label="当前进程" >{data?.comm}</Descriptions.Item>
|
|
||||||
<Descriptions.Item label="内核版本" >{data?.ver}</Descriptions.Item>
|
|
||||||
<Descriptions.Item label="宕机时间" >{data?.core_time} </Descriptions.Item>
|
|
||||||
<Descriptions.Item label="dmesg" ><pre>{data?.dmesg}</pre></Descriptions.Item>
|
|
||||||
</Descriptions>
|
|
||||||
</ProCard>
|
|
||||||
</PageContainer>
|
</PageContainer>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
Loading…
Reference in New Issue