github/skywalking-booster-ui
2
0
Fork 1
mirror of https://github.com/apache/skywalking-booster-ui.git synced 2025-07-18 14:45:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: update instance topology

Browse Source
This commit is contained in:
Qiuxia Fan 2022-02-14 22:10:10 +08:00
parent 4badfffac8
commit b4de2bd230
5 changed files with 77 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

78
package-lock.json generated
View File

@ -12,7 +12,7 @@
"d3": "^7.3.0", "d3": "^7.3.0",
"d3-tip": "^0.9.1", "d3-tip": "^0.9.1",
"echarts": "^5.2.2", "echarts": "^5.2.2",
"element-plus": "^2.0.1", "element-plus": "^2.0.2",
"pinia": "^2.0.5", "pinia": "^2.0.5",
"three": "^0.131.3", "three": "^0.131.3",
"three-orbit-controls": "^82.1.0", "three-orbit-controls": "^82.1.0",
@ -3324,6 +3324,21 @@
"integrity": "sha512-qcUXuemtEu+E5wZSJHNxUXeCZhAfXKQ41D+duX+VYPde7xyEVZci+/oXKJL13tnRs9lR2pr4fod59GT6/X1/yQ==", "integrity": "sha512-qcUXuemtEu+E5wZSJHNxUXeCZhAfXKQ41D+duX+VYPde7xyEVZci+/oXKJL13tnRs9lR2pr4fod59GT6/X1/yQ==",
"dev": true "dev": true
}, },
"node_modules/@types/lodash": {
"version": "4.14.178",
"resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.178.tgz",
"integrity": "sha512-0d5Wd09ItQWH1qFbEyQ7oTQ3GZrMfth5JkbN3EvTKLXcHLRDSXeLnlvlOn0wvxVIwK5o2M8JzP/OWz7T3NRsbw==",
"peer": true
},
"node_modules/@types/lodash-es": {
"version": "4.17.6",
"resolved": "https://registry.npmjs.org/@types/lodash-es/-/lodash-es-4.17.6.tgz",
"integrity": "sha512-R+zTeVUKDdfoRxpAryaQNRKk3105Rrgx2CFRClIgRGaqDTdjsm8h6IYA8ir584W3ePzkZfst5xIgDwYrlh9HLg==",
"peer": true,
"dependencies": {
"@types/lodash": "*"
}
},
"node_modules/@types/mime": { "node_modules/@types/mime": {
"version": "1.3.2", "version": "1.3.2",
"resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.2.tgz", "resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.2.tgz",
@ -10323,17 +10338,19 @@
} }
}, },
"node_modules/element-plus": { "node_modules/element-plus": {
"version": "2.0.1", "version": "2.0.2",
"resolved": "https://registry.npmjs.org/element-plus/-/element-plus-2.0.1.tgz", "resolved": "https://registry.npmjs.org/element-plus/-/element-plus-2.0.2.tgz",
"integrity": "sha512-Cdx3JhbMNGwVsU12DUewIltJ1hUYVSgx2iBB8AuNzzOxAqcxSA9e7p2lfNp8oCBQeh4ThRSaOkdLnJyO4mS3qQ==", "integrity": "sha512-URjC0HwwiqtlLxqTmHXQ31WXrdAq4ChWyyn52OcQs3PRsnMPfahGVq2AWnfzzlzlhVeI5lY3HQiuB1zDathS+g==",
"dependencies": { "dependencies": {
"@ctrl/tinycolor": "^3.4.0", "@ctrl/tinycolor": "^3.4.0",
"@element-plus/icons-vue": "^0.2.6", "@element-plus/icons-vue": "^0.2.6",
"@popperjs/core": "^2.11.2", "@popperjs/core": "^2.11.2",
"@vueuse/core": "^7.5.5", "@vueuse/core": "^7.6.0",
"async-validator": "^4.0.7", "async-validator": "^4.0.7",
"dayjs": "^1.10.7", "dayjs": "^1.10.7",
"lodash": "^4.17.21", "lodash": "^4.17.21",
"lodash-es": "^4.17.21",
"lodash-unified": "^1.0.1",
"memoize-one": "^6.0.0", "memoize-one": "^6.0.0",
"normalize-wheel-es": "^1.1.1" "normalize-wheel-es": "^1.1.1"
}, },
@ -17473,6 +17490,21 @@
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==" "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
}, },
"node_modules/lodash-es": {
"version": "4.17.21",
"resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
"integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
},
"node_modules/lodash-unified": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/lodash-unified/-/lodash-unified-1.0.1.tgz",
"integrity": "sha512-Py+twfpWn+2dFQWCuGcp21WiQRwZwnm1cyE3piSt/VtBVKVyxlR58WgOVRzXtmdmDRGJKH8F8GPaA29WK/yK8g==",
"peerDependencies": {
"@types/lodash-es": "*",
"lodash": "*",
"lodash-es": "*"
}
},
"node_modules/lodash.debounce": { "node_modules/lodash.debounce": {
"version": "4.0.8", "version": "4.0.8",
"resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
@ -31273,6 +31305,21 @@
"integrity": "sha512-qcUXuemtEu+E5wZSJHNxUXeCZhAfXKQ41D+duX+VYPde7xyEVZci+/oXKJL13tnRs9lR2pr4fod59GT6/X1/yQ==", "integrity": "sha512-qcUXuemtEu+E5wZSJHNxUXeCZhAfXKQ41D+duX+VYPde7xyEVZci+/oXKJL13tnRs9lR2pr4fod59GT6/X1/yQ==",
"dev": true "dev": true
}, },
"@types/lodash": {
"version": "4.14.178",
"resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.178.tgz",
"integrity": "sha512-0d5Wd09ItQWH1qFbEyQ7oTQ3GZrMfth5JkbN3EvTKLXcHLRDSXeLnlvlOn0wvxVIwK5o2M8JzP/OWz7T3NRsbw==",
"peer": true
},
"@types/lodash-es": {
"version": "4.17.6",
"resolved": "https://registry.npmjs.org/@types/lodash-es/-/lodash-es-4.17.6.tgz",
"integrity": "sha512-R+zTeVUKDdfoRxpAryaQNRKk3105Rrgx2CFRClIgRGaqDTdjsm8h6IYA8ir584W3ePzkZfst5xIgDwYrlh9HLg==",
"peer": true,
"requires": {
"@types/lodash": "*"
}
},
"@types/mime": { "@types/mime": {
"version": "1.3.2", "version": "1.3.2",
"resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.2.tgz", "resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.2.tgz",
@ -36877,17 +36924,19 @@
"dev": true "dev": true
}, },
"element-plus": { "element-plus": {
"version": "2.0.1", "version": "2.0.2",
"resolved": "https://registry.npmjs.org/element-plus/-/element-plus-2.0.1.tgz", "resolved": "https://registry.npmjs.org/element-plus/-/element-plus-2.0.2.tgz",
"integrity": "sha512-Cdx3JhbMNGwVsU12DUewIltJ1hUYVSgx2iBB8AuNzzOxAqcxSA9e7p2lfNp8oCBQeh4ThRSaOkdLnJyO4mS3qQ==", "integrity": "sha512-URjC0HwwiqtlLxqTmHXQ31WXrdAq4ChWyyn52OcQs3PRsnMPfahGVq2AWnfzzlzlhVeI5lY3HQiuB1zDathS+g==",
"requires": { "requires": {
"@ctrl/tinycolor": "^3.4.0", "@ctrl/tinycolor": "^3.4.0",
"@element-plus/icons-vue": "^0.2.6", "@element-plus/icons-vue": "^0.2.6",
"@popperjs/core": "^2.11.2", "@popperjs/core": "^2.11.2",
"@vueuse/core": "^7.5.5", "@vueuse/core": "^7.6.0",
"async-validator": "^4.0.7", "async-validator": "^4.0.7",
"dayjs": "^1.10.7", "dayjs": "^1.10.7",
"lodash": "^4.17.21", "lodash": "^4.17.21",
"lodash-es": "^4.17.21",
"lodash-unified": "^1.0.1",
"memoize-one": "^6.0.0", "memoize-one": "^6.0.0",
"normalize-wheel-es": "^1.1.1" "normalize-wheel-es": "^1.1.1"
} }
@ -42443,6 +42492,17 @@
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==" "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
}, },
"lodash-es": {
"version": "4.17.21",
"resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
"integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
},
"lodash-unified": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/lodash-unified/-/lodash-unified-1.0.1.tgz",
"integrity": "sha512-Py+twfpWn+2dFQWCuGcp21WiQRwZwnm1cyE3piSt/VtBVKVyxlR58WgOVRzXtmdmDRGJKH8F8GPaA29WK/yK8g==",
"requires": {}
},
"lodash.debounce": { "lodash.debounce": {
"version": "4.0.8", "version": "4.0.8",
"resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",

2
package.json
View File

@ -14,7 +14,7 @@
"d3": "^7.3.0", "d3": "^7.3.0",
"d3-tip": "^0.9.1", "d3-tip": "^0.9.1",
"echarts": "^5.2.2", "echarts": "^5.2.2",
"element-plus": "^2.0.1", "element-plus": "^2.0.2",
"pinia": "^2.0.5", "pinia": "^2.0.5",
"three": "^0.131.3", "three": "^0.131.3",
"three-orbit-controls": "^82.1.0", "three-orbit-controls": "^82.1.0",

4
src/components/Selector.vue
View File

@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License. --> limitations under the License. -->
<template> <template>
<el-select <el-select
size :size="size"
v-model="selected" v-model="selected"
:placeholder="placeholder" :placeholder="placeholder"
@change="changeSelected" @change="changeSelected"
@ -54,7 +54,7 @@ const props = defineProps({
type: [Array, String] as PropType<string[] | string>, type: [Array, String] as PropType<string[] | string>,
default: () => [], default: () => [],
}, },
size: { type: String, default: "default" }, size: { type: [], default: "default" },
placeholder: { type: String, default: "Select a option" }, placeholder: { type: String, default: "Select a option" },
borderRadius: { type: Number, default: 3 }, borderRadius: { type: Number, default: 3 },
multiple: { type: Boolean, default: false }, multiple: { type: Boolean, default: false },

2
src/views/dashboard/New.vue
View File

@ -28,7 +28,6 @@ limitations under the License. -->
<Selector <Selector
v-model="states.selectedLayer" v-model="states.selectedLayer"
:options="states.layers" :options="states.layers"
size="default"
placeholder="Select a layer" placeholder="Select a layer"
@change="changeLayer" @change="changeLayer"
class="selectors" class="selectors"
@ -39,7 +38,6 @@ limitations under the License. -->
<Selector <Selector
v-model="states.entity" v-model="states.entity"
:options="EntityType" :options="EntityType"
size="default"
placeholder="Select a entity" placeholder="Select a entity"
@change="changeEntity" @change="changeEntity"
class="selectors" class="selectors"

10
src/views/dashboard/related/topology/Graph.vue
View File

@ -49,7 +49,7 @@ limitations under the License. -->
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref, onMounted, onBeforeUnmount, reactive, watch } from "vue"; import { ref, onMounted, onBeforeUnmount, reactive } from "vue";
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
import * as d3 from "d3"; import * as d3 from "d3";
import d3tip from "d3-tip"; import d3tip from "d3-tip";
@ -341,7 +341,7 @@ function handleGoAlarm() {
} }
async function backToTopology() { async function backToTopology() {
svg.value.selectAll(".topo-svg-graph").remove(); svg.value.selectAll(".topo-svg-graph").remove();
const resp = await topologyStore.getServicesTopology(); const resp = await getTopology();
if (resp.errors) { if (resp.errors) {
ElMessage.error(resp.errors); ElMessage.error(resp.errors);
@ -365,7 +365,7 @@ async function getTopology() {
case EntityType[2].value: case EntityType[2].value:
resp = await topologyStore.getEndpointTopology(); resp = await topologyStore.getEndpointTopology();
break; break;
case EntityType[3].value: case EntityType[4].value:
resp = await topologyStore.getInstanceTopology(); resp = await topologyStore.getInstanceTopology();
break; break;
} }
@ -423,8 +423,8 @@ onBeforeUnmount(() => {
.setting { .setting {
position: absolute; position: absolute;
top: 20px; top: 70px;
right: 20px; right: 0;
width: 360px; width: 360px;
height: 700px; height: 700px;
background-color: #2b3037; background-color: #2b3037;