|
|
|
export default {
|
|
|
|
name: 'pingIndex',
|
|
|
|
template: '',
|
|
|
|
components: {
|
|
|
|
'pingDetail': Vue.defineAsyncComponent(
|
|
|
|
() => myImport('views/ping/pingDetail/index')
|
|
|
|
)
|
|
|
|
},
|
|
|
|
props: [],
|
|
|
|
setup(props, {attrs, slots, emit}) {
|
|
|
|
const {proxy} = Vue.getCurrentInstance();
|
|
|
|
let height = Vue.ref(window.innerHeight);
|
|
|
|
let resId=Vue.ref('');
|
|
|
|
let dateTime=Vue.ref([]);
|
|
|
|
let kpiIdent=Vue.ref('');
|
|
|
|
let search = Vue.ref({
|
|
|
|
kpiId:'',
|
|
|
|
sortBy:'dbTime',
|
|
|
|
scopeBy:'dbTimeStr.keyword',
|
|
|
|
keyword: '',
|
|
|
|
type:'syslog',
|
|
|
|
pageNum: 1,
|
|
|
|
pageSize: 20,
|
|
|
|
dateTime:[],
|
|
|
|
resType:'',
|
|
|
|
});
|
|
|
|
let dialog = Vue.ref({
|
|
|
|
title : "ping详情",
|
|
|
|
show:false,
|
|
|
|
esId : ''
|
|
|
|
});
|
|
|
|
//表格字段
|
|
|
|
let tableData = Vue.ref({
|
|
|
|
count:0,
|
|
|
|
dataList: [],
|
|
|
|
columns: [
|
|
|
|
{
|
|
|
|
prop: 'collTime',
|
|
|
|
label: '采集时间',
|
|
|
|
sortable: true,
|
|
|
|
align: 'center',
|
|
|
|
width: '250',
|
|
|
|
},
|
|
|
|
{
|
|
|
|
prop: 'dbTime',
|
|
|
|
label: '入库时间',
|
|
|
|
sortable: true,
|
|
|
|
align: 'center',
|
|
|
|
width: '250'
|
|
|
|
},
|
|
|
|
{
|
|
|
|
prop: 'kpiValue',
|
|
|
|
label: '采集值',
|
|
|
|
sortable: true,
|
|
|
|
align: 'center',
|
|
|
|
width: '200'
|
|
|
|
},
|
|
|
|
{
|
|
|
|
prop: 'taskName',
|
|
|
|
label: '采集任务',
|
|
|
|
sortable: true,
|
|
|
|
align: 'center',
|
|
|
|
width: '200'
|
|
|
|
},
|
|
|
|
{
|
|
|
|
prop: 'templateName',
|
|
|
|
label: '采集模板',
|
|
|
|
sortable: true,
|
|
|
|
align: 'center',
|
|
|
|
width: '200'
|
|
|
|
},
|
|
|
|
{
|
|
|
|
prop: 'directiveName',
|
|
|
|
label: '指令名称',
|
|
|
|
sortable: true,
|
|
|
|
align: 'center',
|
|
|
|
width: '200'
|
|
|
|
}, {
|
|
|
|
prop: 'ext',
|
|
|
|
label: '扩展信息',
|
|
|
|
sortable: true,
|
|
|
|
align: 'center',
|
|
|
|
width: '200',
|
|
|
|
render:function (row){
|
|
|
|
return `<pre>${row.ext}</pre>`
|
|
|
|
}
|
|
|
|
}, {
|
|
|
|
prop: 'message',
|
|
|
|
label: '异常信息',
|
|
|
|
sortable: true,
|
|
|
|
align: 'center',
|
|
|
|
render:function (row){
|
|
|
|
return `<pre>${row.message}</pre>`
|
|
|
|
}
|
|
|
|
}
|
|
|
|
]
|
|
|
|
})
|
|
|
|
let resTypeArr = Vue.ref([]);
|
|
|
|
let getResType = (arr) => {
|
|
|
|
var types = arr.map(function (v) {
|
|
|
|
return v.id;
|
|
|
|
});
|
|
|
|
resTypeArr.value = types;
|
|
|
|
search.value.resType=resTypeArr.value.join(',');
|
|
|
|
// getDataList();
|
|
|
|
}
|
|
|
|
//获取时间点 转年月日的方法
|
|
|
|
const getDateTime=(newDate)=>{
|
|
|
|
let dateTime='';
|
|
|
|
let year=newDate.getFullYear();//获取当前年
|
|
|
|
let month1=(newDate.getMonth()+1)+'';
|
|
|
|
let month=timeFormat(month1);//获取当前月
|
|
|
|
let day=timeFormat(newDate.getDate());//获取当前日
|
|
|
|
let hours=timeFormat(newDate.getHours()+'');//获取当前时
|
|
|
|
let minutes=timeFormat(newDate.getMinutes()+'');//获取当前分
|
|
|
|
let seconds=timeFormat(newDate.getSeconds()+'');//获取当前秒
|
|
|
|
dateTime= year+'-'+month+'-'+day;//' '+hours+':'+minutes+':'+seconds;
|
|
|
|
return dateTime;
|
|
|
|
}
|
|
|
|
//转换个位数为 00
|
|
|
|
let timeFormat =(number)=> {
|
|
|
|
return number.length == 1 ? ('0' + number) : number
|
|
|
|
}
|
|
|
|
// 获取列表
|
|
|
|
let getDataList = () => {
|
|
|
|
let nowDate=getDateTime(new Date());
|
|
|
|
let dateStr='';
|
|
|
|
if(kpiIdent.value==1){
|
|
|
|
dateStr='monitor-performance_';
|
|
|
|
}else{
|
|
|
|
dateStr='monitor-collector_';
|
|
|
|
}
|
|
|
|
if(search.value.dateTime){
|
|
|
|
dateStr+=search.value.dateTime;
|
|
|
|
}else {
|
|
|
|
dateStr+=nowDate;
|
|
|
|
}
|
|
|
|
|
|
|
|
let params={
|
|
|
|
resId:resId.value,
|
|
|
|
kpiId:search.value.kpiId,
|
|
|
|
flag:search.value.flag,
|
|
|
|
indexName:dateStr,
|
|
|
|
pageNum: search.value.pageNum,
|
|
|
|
pageSize: search.value.pageSize,
|
|
|
|
type:search.value.type,
|
|
|
|
sortBy:search.value.sortBy,
|
|
|
|
scopeBy:search.value.scopeBy,
|
|
|
|
resType:search.value.resType,
|
|
|
|
param:{}
|
|
|
|
}
|
|
|
|
if(search.value.keyword){
|
|
|
|
params.param={
|
|
|
|
'resName.keyword': search.value.keyword,
|
|
|
|
'host.keyword':search.value.keyword,
|
|
|
|
'message.keyword':search.value.keyword,
|
|
|
|
}
|
|
|
|
}
|
|
|
|
if(search.value.kpiId){
|
|
|
|
params['param']['kpiId.keyword']=search.value.kpiId;
|
|
|
|
}
|
|
|
|
proxy.$http.post(`/api-web/esData/list`, params, function (res) {
|
|
|
|
if (res && res.object) {
|
|
|
|
let dataList=res.object.content;
|
|
|
|
let arr=[];
|
|
|
|
dataList.map(item=>{
|
|
|
|
arr.push(item[0])
|
|
|
|
})
|
|
|
|
tableData.value.dataList = arr;
|
|
|
|
tableData.value.count = parseInt(res.object.total);
|
|
|
|
} else {
|
|
|
|
tableData.value.dataList = [];
|
|
|
|
tableData.value.count = 0;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
let loaddata = ({page, limit}) => {
|
|
|
|
search.value.pageNum = page;
|
|
|
|
search.value.pageSize = limit;
|
|
|
|
getDataList();
|
|
|
|
}
|
|
|
|
|
|
|
|
let hideDialog = (flg) => {
|
|
|
|
dialog.value.show = flg;
|
|
|
|
}
|
|
|
|
|
|
|
|
// 处理弹框
|
|
|
|
let handle = (row) =>{
|
|
|
|
hideDialog(true);
|
|
|
|
dialog.value.detail = row;
|
|
|
|
}
|
|
|
|
|
|
|
|
//查看详情
|
|
|
|
let handleView = (row) =>{
|
|
|
|
handle(row);
|
|
|
|
}
|
|
|
|
//查看资源详情
|
|
|
|
let goResDetail=(resId,resName,resType)=>{
|
|
|
|
proxy.$global.openDetail(resId, resType, proxy);
|
|
|
|
|
|
|
|
}
|
|
|
|
//指标数据
|
|
|
|
let kpiData=Vue.ref([]);
|
|
|
|
let getKpiData=()=>{
|
|
|
|
proxy.$http.post(`/api-web/manage/ddic/findSucDdics/LOG_SOURCE_TYPE`, {}, function (res) {
|
|
|
|
if (res && res.data) {
|
|
|
|
kpiData.value = res.data;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
//flag数据
|
|
|
|
let flagData=Vue.ref([]);
|
|
|
|
let getFlagData=()=>{
|
|
|
|
proxy.$http.post(`/api-web/manage/ddic/findSucDdics/LOG_SOURCE_TYPE?kpiId=`+search.kpiId+'&resId='+resId.value, {}, function (res) {
|
|
|
|
if (res && res.data) {
|
|
|
|
flagData.value = res.data;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
//指标改变事件
|
|
|
|
let kpiChange=(val)=>{
|
|
|
|
getFlagData();
|
|
|
|
}
|
|
|
|
let detail=Vue.ref({})
|
|
|
|
//获取resId
|
|
|
|
let getResId=()=>{
|
|
|
|
detail.value=proxy.$route.query;
|
|
|
|
resId.value=proxy.$route.query.resId;
|
|
|
|
|
|
|
|
}
|
|
|
|
// 挂载完
|
|
|
|
Vue.onMounted(() => {
|
|
|
|
getResId();
|
|
|
|
getDataList();
|
|
|
|
getKpiData();
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
return {
|
|
|
|
resId,
|
|
|
|
getResId,
|
|
|
|
detail,
|
|
|
|
kpiData,
|
|
|
|
kpiIdent,
|
|
|
|
getKpiData,
|
|
|
|
flagData,
|
|
|
|
getFlagData,
|
|
|
|
kpiChange,
|
|
|
|
dateTime,
|
|
|
|
height,
|
|
|
|
search,
|
|
|
|
dialog,
|
|
|
|
hideDialog,
|
|
|
|
handle,
|
|
|
|
loaddata,
|
|
|
|
tableData,
|
|
|
|
getDataList,
|
|
|
|
resTypeArr,
|
|
|
|
getResType,
|
|
|
|
handleView,
|
|
|
|
goResDetail,
|
|
|
|
getDateTime
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
} |
...
|
...
|
|
