fix: bug#12338、12350、12362
* fix: bug#12637 * fix: 修复右上角通知文件notification兼容处理 * fix: bug#12637、12632 * fix: bug#12460 * fix: bug#12362 * fix: bug#12350 * fix: bug#12338
This commit is contained in:
parent
3f80c9b693
commit
df525770f4
|
@ -45,47 +45,43 @@ const subscribeNotice = () => {
|
||||||
total.value += 1;
|
total.value += 1;
|
||||||
notification.open({
|
notification.open({
|
||||||
message: resp?.payload?.topicName,
|
message: resp?.payload?.topicName,
|
||||||
description: () => (
|
description: () =>
|
||||||
<div
|
h(
|
||||||
class="ellipsis"
|
'div',
|
||||||
style={{ cursor: 'pointer' }}
|
{
|
||||||
onClick={() => {
|
class: "ellipsis",
|
||||||
{
|
style: {
|
||||||
/* changeStatus_api('_read', [resp.id]); */
|
cursor: 'pointer'
|
||||||
}
|
},
|
||||||
read('', resp);
|
onClick: () => {
|
||||||
}}
|
read('', resp);
|
||||||
>
|
}
|
||||||
{resp?.payload?.message}
|
},
|
||||||
</div>
|
{
|
||||||
),
|
default: () => resp?.payload?.message
|
||||||
|
}
|
||||||
|
)
|
||||||
|
,
|
||||||
onClick: () => {
|
onClick: () => {
|
||||||
// changeStatus_api('_read', [resp.id])
|
// changeStatus_api('_read', [resp.id])
|
||||||
read('', resp);
|
read('', resp);
|
||||||
},
|
},
|
||||||
key: resp.payload.id,
|
key: resp.payload.id,
|
||||||
btn: (
|
btn: () =>
|
||||||
<Button
|
h(
|
||||||
type="primary"
|
Button,
|
||||||
size="small"
|
{
|
||||||
onClick={(e) => {
|
type: "primary",
|
||||||
{
|
size: "small",
|
||||||
/* changeStatus_api('_read', [resp.id]).then(
|
onClick: (e: Event) => {
|
||||||
(resp: any) => {
|
e.stopPropagation();
|
||||||
if (resp.status === 200) {
|
read('_read', resp);
|
||||||
notification.close(resp.payload.id);
|
}
|
||||||
getList();
|
},
|
||||||
}
|
{
|
||||||
},
|
default: () => "标记已读"
|
||||||
); */
|
}
|
||||||
}
|
),
|
||||||
e.stopPropagation();
|
|
||||||
read('_read', resp);
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
标记已读
|
|
||||||
</Button>
|
|
||||||
),
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
|
@ -62,9 +62,9 @@
|
||||||
/>
|
/>
|
||||||
</j-form-item>
|
</j-form-item>
|
||||||
<p style="color: #616161" v-if="formData.configuration.function">
|
<p style="color: #616161" v-if="formData.configuration.function">
|
||||||
PLC地址:{{
|
PLC地址: {{
|
||||||
InitAddress[formData.configuration.function] +
|
InitAddress[formData.configuration.function] +
|
||||||
formData.pointKey || 0
|
Number(formData.pointKey) || 0
|
||||||
}}
|
}}
|
||||||
</p>
|
</p>
|
||||||
<j-form-item
|
<j-form-item
|
||||||
|
|
|
@ -376,7 +376,8 @@ const defaultParams = ref({
|
||||||
terms: [
|
terms: [
|
||||||
{
|
{
|
||||||
column: 'collectorId',
|
column: 'collectorId',
|
||||||
value: props.data.id,
|
termType: 'eq',
|
||||||
|
value: !props.data?.id ? 'undefined' : (props.data.id === '*' ? undefined : props.data.id),
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
@ -468,7 +469,7 @@ const columns = [
|
||||||
|
|
||||||
const subRef = ref();
|
const subRef = ref();
|
||||||
const propertyValue = ref(new Map());
|
const propertyValue = ref(new Map());
|
||||||
|
const cacheIds = ref<string>()
|
||||||
const showBatch = ref(false);
|
const showBatch = ref(false);
|
||||||
|
|
||||||
const clickBatch = () => {
|
const clickBatch = () => {
|
||||||
|
@ -628,10 +629,10 @@ const handleSubscribeValue = throttle((payload: any) => {
|
||||||
const subscribeProperty = (value: any) => {
|
const subscribeProperty = (value: any) => {
|
||||||
const list = value.map((item: any) => item.id);
|
const list = value.map((item: any) => item.id);
|
||||||
const id = `collector-${props.data?.channelId || 'channel'}-${
|
const id = `collector-${props.data?.channelId || 'channel'}-${
|
||||||
props.data?.id || 'point'
|
(props.data?.id || (props.data && props.data.id === '*')) ? 'point' : props.data?.id
|
||||||
}-data-${list.join('-')}`;
|
}-data-${list.join('-')}`;
|
||||||
const topic = `/collector/${props.data?.channelId || '*'}/${
|
const topic = `/collector/${props.data?.channelId || '*'}/${
|
||||||
props.data?.id || '*'
|
(props.data?.id || (props.data && props.data.id === '*')) ? '*' : props.data?.id
|
||||||
}/data`;
|
}/data`;
|
||||||
subRef.value = getWebSocket(id, topic, {
|
subRef.value = getWebSocket(id, topic, {
|
||||||
pointId: list.join(','),
|
pointId: list.join(','),
|
||||||
|
@ -657,15 +658,18 @@ const onCheckAllChange = (e: any) => {
|
||||||
watch(
|
watch(
|
||||||
() => tableRef?.value?._dataSource,
|
() => tableRef?.value?._dataSource,
|
||||||
(value) => {
|
(value) => {
|
||||||
|
subRef.value?.unsubscribe();
|
||||||
if (value.length !== 0) {
|
if (value.length !== 0) {
|
||||||
subscribeProperty(value);
|
setTimeout(() => {
|
||||||
value.forEach((item: any) => {
|
subscribeProperty(value);
|
||||||
item?.accessModes?.forEach((i: any) => {
|
value.forEach((item: any) => {
|
||||||
if (i?.value === 'read') {
|
item?.accessModes?.forEach((i: any) => {
|
||||||
ReadIdMap.set(item.id, item);
|
if (i?.value === 'read') {
|
||||||
}
|
ReadIdMap.set(item.id, item);
|
||||||
});
|
}
|
||||||
});
|
});
|
||||||
|
});
|
||||||
|
}, 100)
|
||||||
}
|
}
|
||||||
cancelSelect();
|
cancelSelect();
|
||||||
checkAll.value = false;
|
checkAll.value = false;
|
||||||
|
@ -691,7 +695,7 @@ watch(
|
||||||
label: '订阅',
|
label: '订阅',
|
||||||
value: 'subscribe',
|
value: 'subscribe',
|
||||||
});
|
});
|
||||||
defaultParams.value.terms[0].terms[0].value = value.id;
|
defaultParams.value.terms[0].terms[0].value = !value.id ? 'undefined' : (value.id === '*' ? undefined : value.id);
|
||||||
tableRef?.value?.reload && tableRef?.value?.reload();
|
tableRef?.value?.reload && tableRef?.value?.reload();
|
||||||
cancelSelect();
|
cancelSelect();
|
||||||
checkAll.value = false;
|
checkAll.value = false;
|
||||||
|
@ -701,9 +705,7 @@ watch(
|
||||||
);
|
);
|
||||||
|
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
if (subRef.value) {
|
subRef.value?.unsubscribe();
|
||||||
subRef.value?.unsubscribe();
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
|
@ -224,12 +224,12 @@ const handleOk = async () => {
|
||||||
|
|
||||||
loading.value = true;
|
loading.value = true;
|
||||||
const response = !id
|
const response = !id
|
||||||
? await save(params)
|
? await save(params).catch(() => { success: false })
|
||||||
: await update(id, { ...props.data, ...params });
|
: await update(id, { ...props.data, ...params }).catch(() => { success: false });
|
||||||
if (response.status === 200) {
|
loading.value = false;
|
||||||
|
if (response.success) {
|
||||||
emit('change', true);
|
emit('change', true);
|
||||||
}
|
}
|
||||||
loading.value = false;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const getTypeTooltip = (value: string) =>
|
const getTypeTooltip = (value: string) =>
|
||||||
|
|
|
@ -25,8 +25,8 @@
|
||||||
v-model:selected-keys="selectedKeys"
|
v-model:selected-keys="selectedKeys"
|
||||||
:fieldNames="{ key: 'id' }"
|
:fieldNames="{ key: 'id' }"
|
||||||
v-if="
|
v-if="
|
||||||
defualtDataSource.length !== 0 ||
|
!(defualtDataSource.length === 0 ||
|
||||||
defualtDataSource?.[0]?.children?.length !== 0
|
defualtDataSource?.[0]?.children?.length === 0)
|
||||||
"
|
"
|
||||||
:height="660"
|
:height="660"
|
||||||
defaultExpandAll
|
defaultExpandAll
|
||||||
|
@ -247,7 +247,7 @@ const handleSearch = async (value: any) => {
|
||||||
collectorAll.value = res.result;
|
collectorAll.value = res.result;
|
||||||
|
|
||||||
if (selectedKeys.value.length === 0) {
|
if (selectedKeys.value.length === 0) {
|
||||||
selectedKeys.value = ['*'];
|
selectedKeys.value = res.result.length ? ['*'] : [];
|
||||||
}
|
}
|
||||||
|
|
||||||
//激活change事件
|
//激活change事件
|
||||||
|
@ -259,8 +259,8 @@ const handleSearch = async (value: any) => {
|
||||||
}
|
}
|
||||||
spinning.value = false;
|
spinning.value = false;
|
||||||
};
|
};
|
||||||
|
|
||||||
const getChannelNoPaging = async () => {
|
const getChannelNoPaging = async () => {
|
||||||
|
|
||||||
const res = await queryChannelNoPaging();
|
const res = await queryChannelNoPaging();
|
||||||
Store.set('channelListAll', res.result);
|
Store.set('channelListAll', res.result);
|
||||||
};
|
};
|
||||||
|
@ -275,8 +275,14 @@ watch(
|
||||||
(n, p) => {
|
(n, p) => {
|
||||||
const key = _.isArray(n) ? n[0] : n;
|
const key = _.isArray(n) ? n[0] : n;
|
||||||
if (key) {
|
if (key) {
|
||||||
|
if (key !== "*") {
|
||||||
const row = collectorAll.value.find((i: any) => i.id === key);
|
const row = collectorAll.value.find((i: any) => i.id === key);
|
||||||
emits('change', row);
|
emits('change', row);
|
||||||
|
} else {
|
||||||
|
emits('change', {
|
||||||
|
id: '*'
|
||||||
|
});
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
selectedKeys.value = p; // 防止取消
|
selectedKeys.value = p; // 防止取消
|
||||||
}
|
}
|
||||||
|
|
|
@ -19,7 +19,7 @@ import Tree from './Tree/index.vue';
|
||||||
import Point from './Point/index.vue';
|
import Point from './Point/index.vue';
|
||||||
|
|
||||||
const data = ref();
|
const data = ref();
|
||||||
const spinning = ref(true);
|
const spinning = ref(false);
|
||||||
|
|
||||||
const changeTree = (row: any) => {
|
const changeTree = (row: any) => {
|
||||||
spinning.value = true;
|
spinning.value = true;
|
||||||
|
|
|
@ -21,9 +21,11 @@
|
||||||
<j-form layout="vertical" ref="formRef" :model="modelRef">
|
<j-form layout="vertical" ref="formRef" :model="modelRef">
|
||||||
<template v-for="(item, index) in (props.config || [])" :key="index">
|
<template v-for="(item, index) in (props.config || [])" :key="index">
|
||||||
<j-form-item
|
<j-form-item
|
||||||
:name="item.property"
|
|
||||||
v-for="i in item.properties"
|
v-for="i in item.properties"
|
||||||
|
:name="i.property"
|
||||||
:key="i.property"
|
:key="i.property"
|
||||||
|
:required='!!i.type.expands?.required'
|
||||||
|
:rules='!!i.type.expands?.required ? [{ required: true, message: `请输入${i.name}`}] :[]'
|
||||||
>
|
>
|
||||||
<template #label>
|
<template #label>
|
||||||
<span style="margin-right: 5px">{{ i.name }}</span>
|
<span style="margin-right: 5px">{{ i.name }}</span>
|
||||||
|
@ -90,7 +92,8 @@ const onClose = () => {
|
||||||
};
|
};
|
||||||
|
|
||||||
const saveBtn = () => {
|
const saveBtn = () => {
|
||||||
formRef.value.validate().then(async () => {
|
formRef.value.validate().then(async (res) => {
|
||||||
|
if (res) {
|
||||||
const values = toRaw(modelRef);
|
const values = toRaw(modelRef);
|
||||||
const resp = await modify(instanceStore.current?.id || '', {
|
const resp = await modify(instanceStore.current?.id || '', {
|
||||||
id: instanceStore.current?.id,
|
id: instanceStore.current?.id,
|
||||||
|
@ -100,6 +103,7 @@ const saveBtn = () => {
|
||||||
message.success('操作成功!')
|
message.success('操作成功!')
|
||||||
emit('save');
|
emit('save');
|
||||||
}
|
}
|
||||||
|
}
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
|
@ -54,7 +54,7 @@ const handleCancel = () => {
|
||||||
};
|
};
|
||||||
|
|
||||||
const _percent = computed(() => {
|
const _percent = computed(() => {
|
||||||
return ((errCount.value + count.value) / total.value * 100).toFixed(2)
|
return total.value ? ((errCount.value + count.value) / total.value * 100).toFixed(2) : 0
|
||||||
})
|
})
|
||||||
|
|
||||||
const getData = (api: string) => {
|
const getData = (api: string) => {
|
||||||
|
@ -82,6 +82,12 @@ const getData = (api: string) => {
|
||||||
default:
|
default:
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
if ((count.value + errCount.value) >= total.value) {
|
||||||
|
setTimeout(() => {
|
||||||
|
_source.close();
|
||||||
|
flag.value = false;
|
||||||
|
}, 500)
|
||||||
|
}
|
||||||
};
|
};
|
||||||
_source.onerror = () => {
|
_source.onerror = () => {
|
||||||
_source.close();
|
_source.close();
|
||||||
|
|
|
@ -12,7 +12,7 @@
|
||||||
<pro-search
|
<pro-search
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
target="deviceModal"
|
target="deviceModal"
|
||||||
@search="search"
|
@search="handleSearch"
|
||||||
type="simple"
|
type="simple"
|
||||||
/>
|
/>
|
||||||
<JProTable
|
<JProTable
|
||||||
|
@ -27,7 +27,7 @@
|
||||||
{ name: 'createTime', order: 'desc' },
|
{ name: 'createTime', order: 'desc' },
|
||||||
] : [{ name: 'createTime', order: 'desc' }],
|
] : [{ name: 'createTime', order: 'desc' }],
|
||||||
}"
|
}"
|
||||||
:params="queryParams"
|
:params="params"
|
||||||
@cancelSelect="cancelSelect"
|
@cancelSelect="cancelSelect"
|
||||||
:gridColumn="2"
|
:gridColumn="2"
|
||||||
:gridColumns="[2]"
|
:gridColumns="[2]"
|
||||||
|
@ -164,6 +164,7 @@ const params = ref<Record<string, any>>({
|
||||||
pageSize: 4,
|
pageSize: 4,
|
||||||
terms: [],
|
terms: [],
|
||||||
})
|
})
|
||||||
|
|
||||||
const selectedRowKeys = ref<string[]>(props.accessId ? [props.accessId] : [])
|
const selectedRowKeys = ref<string[]>(props.accessId ? [props.accessId] : [])
|
||||||
|
|
||||||
const getDescription = (slotProps: Record<string, any>) =>
|
const getDescription = (slotProps: Record<string, any>) =>
|
||||||
|
@ -289,7 +290,7 @@ const cancel = () => {
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleSearch = (e: any) => {
|
const handleSearch = (e: any) => {
|
||||||
params.value = e;
|
params.value.terms = e.terms;
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleClick = (data: any) => {
|
const handleClick = (data: any) => {
|
||||||
|
|
|
@ -655,7 +655,7 @@ const saveData = () => {
|
||||||
if (route.query.save) {
|
if (route.query.save) {
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
window?.onTabSaveSuccess(resp);
|
window?.onTabSaveSuccess(resp);
|
||||||
window.close();
|
setTimeout(() => window.close(), 300);
|
||||||
} else {
|
} else {
|
||||||
history.back();
|
history.back();
|
||||||
}
|
}
|
||||||
|
|
|
@ -125,7 +125,7 @@ const onFinish = async (values: any) => {
|
||||||
if (route.query.save) {
|
if (route.query.save) {
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
window?.onTabSaveSuccess(resp.result);
|
window?.onTabSaveSuccess(resp.result);
|
||||||
window.close();
|
setTimeout(() => window.close(), 300);
|
||||||
} else {
|
} else {
|
||||||
history.back();
|
history.back();
|
||||||
}
|
}
|
||||||
|
|
|
@ -61,6 +61,13 @@ import {
|
||||||
} from './tool.ts';
|
} from './tool.ts';
|
||||||
import { DataType } from '../typings';
|
import { DataType } from '../typings';
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
serviceId: {
|
||||||
|
type: String,
|
||||||
|
default: undefined
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
const chartRef = ref<Record<string, any>>({});
|
const chartRef = ref<Record<string, any>>({});
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const data = ref<DataType>({
|
const data = ref<DataType>({
|
||||||
|
@ -79,7 +86,8 @@ const getCPUEcharts = async (val: any) => {
|
||||||
const _cpuOptions = {};
|
const _cpuOptions = {};
|
||||||
const _cpuXAxis = new Set();
|
const _cpuXAxis = new Set();
|
||||||
if (res.result?.length) {
|
if (res.result?.length) {
|
||||||
res.result.forEach((item: any) => {
|
const filterArray = res.result.filter((item : any) => item.data?.clusterNodeId === props.serviceId)
|
||||||
|
filterArray.forEach((item: any) => {
|
||||||
const value = item.data.value;
|
const value = item.data.value;
|
||||||
const nodeID = item.data.clusterNodeId;
|
const nodeID = item.data.clusterNodeId;
|
||||||
_cpuXAxis.add(
|
_cpuXAxis.add(
|
||||||
|
@ -168,16 +176,14 @@ watch(
|
||||||
},
|
},
|
||||||
{ immediate: true, deep: true },
|
{ immediate: true, deep: true },
|
||||||
);
|
);
|
||||||
watch(
|
|
||||||
() => data.value,
|
watchEffect(() => {
|
||||||
(val) => {
|
const time = data.value.time
|
||||||
const { time } = val;
|
if (time && Array.isArray(time) && time.length === 2 && time[0] && props.serviceId) {
|
||||||
if (time && Array.isArray(time) && time.length === 2 && time[0]) {
|
getCPUEcharts(data.value);
|
||||||
getCPUEcharts(val);
|
}
|
||||||
}
|
})
|
||||||
},
|
|
||||||
{ immediate: true, deep: true },
|
|
||||||
);
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
|
|
|
@ -61,6 +61,13 @@ import {
|
||||||
} from './tool.ts';
|
} from './tool.ts';
|
||||||
import { DataType } from '../typings';
|
import { DataType } from '../typings';
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
serviceId: {
|
||||||
|
type: String,
|
||||||
|
default: undefined
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
const chartRef = ref<Record<string, any>>({});
|
const chartRef = ref<Record<string, any>>({});
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const data = ref<DataType>({
|
const data = ref<DataType>({
|
||||||
|
@ -79,7 +86,8 @@ const getJVMEcharts = async (val: any) => {
|
||||||
const _jvmOptions = {};
|
const _jvmOptions = {};
|
||||||
const _jvmXAxis = new Set();
|
const _jvmXAxis = new Set();
|
||||||
if (res.result?.length) {
|
if (res.result?.length) {
|
||||||
res.result.forEach((item: any) => {
|
const filterArray = res.result.filter((item : any) => item.data?.clusterNodeId === props.serviceId)
|
||||||
|
filterArray.forEach((item: any) => {
|
||||||
const value = item.data.value;
|
const value = item.data.value;
|
||||||
const memoryJvmHeapFree = value.memoryJvmHeapFree;
|
const memoryJvmHeapFree = value.memoryJvmHeapFree;
|
||||||
const memoryJvmHeapTotal = value.memoryJvmHeapTotal;
|
const memoryJvmHeapTotal = value.memoryJvmHeapTotal;
|
||||||
|
@ -172,16 +180,14 @@ watch(
|
||||||
},
|
},
|
||||||
{ immediate: true, deep: true },
|
{ immediate: true, deep: true },
|
||||||
);
|
);
|
||||||
watch(
|
|
||||||
() => data.value,
|
watchEffect(() => {
|
||||||
(val) => {
|
const time = data.value.time
|
||||||
const { time } = val;
|
if (time && Array.isArray(time) && time.length === 2 && time[0] && props.serviceId) {
|
||||||
if (time && Array.isArray(time) && time.length === 2 && time[0]) {
|
getJVMEcharts(data.value);
|
||||||
getJVMEcharts(val);
|
}
|
||||||
}
|
})
|
||||||
},
|
|
||||||
{ immediate: true, deep: true },
|
|
||||||
);
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
|
|
|
@ -69,6 +69,13 @@ import dayjs from 'dayjs';
|
||||||
import * as echarts from 'echarts';
|
import * as echarts from 'echarts';
|
||||||
import { DataType } from '../typings.d';
|
import { DataType } from '../typings.d';
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
serviceId: {
|
||||||
|
type: String,
|
||||||
|
default: undefined
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
const chartRef = ref<Record<string, any>>({});
|
const chartRef = ref<Record<string, any>>({});
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const data = ref<DataType>({
|
const data = ref<DataType>({
|
||||||
|
@ -90,7 +97,8 @@ const getNetworkEcharts = async (val: any) => {
|
||||||
const _networkOptions = {};
|
const _networkOptions = {};
|
||||||
const _networkXAxis = new Set();
|
const _networkXAxis = new Set();
|
||||||
if (resp.result.length) {
|
if (resp.result.length) {
|
||||||
resp.result.forEach((item: any) => {
|
const filterArray = resp.result.filter((item : any) => item.data?.clusterNodeId === props.serviceId)
|
||||||
|
filterArray.forEach((item: any) => {
|
||||||
const value = item.data.value;
|
const value = item.data.value;
|
||||||
const _data: Array<any> = [];
|
const _data: Array<any> = [];
|
||||||
const nodeID = item.data.clusterNodeId;
|
const nodeID = item.data.clusterNodeId;
|
||||||
|
@ -191,18 +199,14 @@ watch(
|
||||||
},
|
},
|
||||||
{ immediate: true, deep: true },
|
{ immediate: true, deep: true },
|
||||||
);
|
);
|
||||||
watch(
|
|
||||||
() => data.value,
|
watchEffect(() => {
|
||||||
(value) => {
|
const time = data.value.time.time
|
||||||
const {
|
if (time && Array.isArray(time) && time.length === 2 && time[0] && props.serviceId) {
|
||||||
time: { time },
|
getNetworkEcharts(data.value);
|
||||||
} = value;
|
}
|
||||||
if (time && Array.isArray(time) && time.length === 2 && time[0]) {
|
})
|
||||||
getNetworkEcharts(value);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{ immediate: true, deep: true },
|
|
||||||
);
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
|
|
|
@ -60,15 +60,26 @@ const topValues = ref({
|
||||||
systemUsage: 0,
|
systemUsage: 0,
|
||||||
systemUsageTotal: 0,
|
systemUsageTotal: 0,
|
||||||
});
|
});
|
||||||
|
const wsRef = ref<any>()
|
||||||
|
|
||||||
|
const emit = defineEmits(['serviceChange'])
|
||||||
|
|
||||||
const serverIdChange = (val: string) => {
|
const serverIdChange = (val: string) => {
|
||||||
serverId.value = val;
|
serverId.value = val;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const unSub = () => {
|
||||||
|
if (wsRef.value) {
|
||||||
|
wsRef.value.unsubscribe()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const getData = () => {
|
const getData = () => {
|
||||||
const id = 'operations-statistics-system-info-realTime';
|
const id = 'operations-statistics-system-info-realTime';
|
||||||
const topic = '/dashboard/systemMonitor/stats/info/realTime';
|
const topic = '/dashboard/systemMonitor/stats/info/realTime';
|
||||||
getWebSocket(id, topic, {
|
unSub()
|
||||||
|
|
||||||
|
wsRef.value = getWebSocket(id, topic, {
|
||||||
type: 'all',
|
type: 'all',
|
||||||
serverNodeId: serverId.value,
|
serverNodeId: serverId.value,
|
||||||
interval: '1s',
|
interval: '1s',
|
||||||
|
@ -118,10 +129,16 @@ onMounted(() => {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
onUnmounted(() => {
|
||||||
|
unSub()
|
||||||
|
})
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
() => serverId.value,
|
() => serverId.value,
|
||||||
(val) => {
|
(val) => {
|
||||||
val && getData();
|
val && getData();
|
||||||
|
emit('serviceChange', val)
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -2,10 +2,10 @@
|
||||||
<page-container>
|
<page-container>
|
||||||
<div>
|
<div>
|
||||||
<j-row :gutter="[24, 24]">
|
<j-row :gutter="[24, 24]">
|
||||||
<j-col :span="24"><TopCard /> </j-col>
|
<j-col :span="24"><TopCard @serviceChange='serviceChange' /> </j-col>
|
||||||
<j-col :span="24"><Network /></j-col>
|
<j-col :span="24"><Network :serviceId='serviceId' /></j-col>
|
||||||
<j-col :span="12"><Cpu /></j-col>
|
<j-col :span="12"><Cpu :serviceId='serviceId'/></j-col>
|
||||||
<j-col :span="12"><Jvm /></j-col>
|
<j-col :span="12"><Jvm :serviceId='serviceId'/></j-col>
|
||||||
</j-row>
|
</j-row>
|
||||||
</div>
|
</div>
|
||||||
</page-container>
|
</page-container>
|
||||||
|
@ -16,6 +16,13 @@ import TopCard from './components/TopCard.vue';
|
||||||
import Network from './components/Network.vue';
|
import Network from './components/Network.vue';
|
||||||
import Cpu from './components/Cpu.vue';
|
import Cpu from './components/Cpu.vue';
|
||||||
import Jvm from './components/Jvm.vue';
|
import Jvm from './components/Jvm.vue';
|
||||||
|
|
||||||
|
const serviceId = ref<string | undefined>()
|
||||||
|
|
||||||
|
const serviceChange = (id: string) => {
|
||||||
|
serviceId.value = id
|
||||||
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped></style>
|
<style lang="less" scoped></style>
|
||||||
|
|
|
@ -188,7 +188,7 @@ function delDepartment(id: string) {
|
||||||
function refresh(id: string) {
|
function refresh(id: string) {
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
window?.onTabSaveSuccess && window.onTabSaveSuccess(id);
|
window?.onTabSaveSuccess && window.onTabSaveSuccess(id);
|
||||||
window.close();
|
setTimeout(() => window.close(), 300);
|
||||||
getTree();
|
getTree();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -65,7 +65,7 @@ const confirm = () => {
|
||||||
if (route.query.save) {
|
if (route.query.save) {
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
window?.onTabSaveSuccess(resp.result.id);
|
window?.onTabSaveSuccess(resp.result.id);
|
||||||
window.close();
|
setTimeout(() => window.close(), 300);
|
||||||
} else jumpPage(`system/Role/Detail`, { id: resp.result.id });
|
} else jumpPage(`system/Role/Detail`, { id: resp.result.id });
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
@ -95,8 +95,8 @@ export default defineConfig(({ mode}) => {
|
||||||
// target: 'http://192.168.32.226:8844',
|
// target: 'http://192.168.32.226:8844',
|
||||||
// target: 'http://192.168.32.244:8881',
|
// target: 'http://192.168.32.244:8881',
|
||||||
target: 'http://120.77.179.54:8844', // 120测试
|
target: 'http://120.77.179.54:8844', // 120测试
|
||||||
// target: 'http://192.168.33.46:8844', // 本地开发环境
|
// target: 'http://192.168.33.46:8844', // 本地开发环境
|
||||||
ws: 'ws://192.168.33.46:8844',
|
ws: 'ws://120.77.179.54:8844',
|
||||||
changeOrigin: true,
|
changeOrigin: true,
|
||||||
rewrite: (path) => path.replace(/^\/api/, '')
|
rewrite: (path) => path.replace(/^\/api/, '')
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue