import codes

This commit is contained in:
Qiuxia Fan
2021-12-08 16:06:25 +08:00
commit ffcdd1939a
118 changed files with 27480 additions and 0 deletions

View File

@@ -0,0 +1,23 @@
<!-- Licensed to the Apache Software Foundation (ASF) under one or more
contributor license agreements. See the NOTICE file distributed with
this work for additional information regarding copyright ownership.
The ASF licenses this file to You under the Apache License, Version 2.0
(the "License"); you may not use this file except in compliance with
the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License. -->
<template>
<div class="enpoints">This is a enpoint page</div>
</template>
<script lang="ts" setup></script>
<style lang="scss" scoped>
div {
padding: 15px;
}
</style>

View File

@@ -0,0 +1,24 @@
<!-- Licensed to the Apache Software Foundation (ASF) under one or more
contributor license agreements. See the NOTICE file distributed with
this work for additional information regarding copyright ownership.
The ASF licenses this file to You under the Apache License, Version 2.0
(the "License"); you may not use this file except in compliance with
the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License. -->
<template>
<div>This is the Metrics page</div>
</template>
<script lang="ts" setup></script>
<style lang="scss" scoped>
div {
padding: 15px;
text-align: center;
}
</style>

101
src/views/service/Panel.vue Normal file
View File

@@ -0,0 +1,101 @@
<!-- Licensed to the Apache Software Foundation (ASF) under one or more
contributor license agreements. See the NOTICE file distributed with
this work for additional information regarding copyright ownership.
The ASF licenses this file to You under the Apache License, Version 2.0
(the "License"); you may not use this file except in compliance with
the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License. -->
<template>
<div class="service-detail">
<div class="title">
<span>{{ state.serviceID }}</span>
<span>Types</span>
<span>Technologies</span>
</div>
<div class="tabs">
<router-link
class="tab cp"
v-for="tab in tabs"
:key="tab"
@click="handleClick(tab)"
:class="{ active: tab === activeName }"
:to="`${state.path}/${state.serviceID}/${tab}`"
>
{{ t(tab) }}
</router-link>
</div>
<Endpoints v-if="state.type === tabs[2]" />
<Metrics v-else-if="state.type === tabs[0]" />
<Topology
v-else-if="state.type === tabs[1]"
msg="This is the Topology page"
/>
<Traces v-else-if="state.type === tabs[3]" msg="This is the Trace page" />
<Profiles v-else msg="This is the Profiles page" />
</div>
</template>
<script lang="ts" setup>
import { ref, reactive } from "vue";
import { useI18n } from "vue-i18n";
import { useRoute } from "vue-router";
import Metrics from "./Metrics.vue";
import Endpoints from "./Endpoints.vue";
import Topology from "./Topology.vue";
import Traces from "./Traces.vue";
import Profiles from "./Profiles.vue";
const route = useRoute();
const { t } = useI18n();
const tabs = ["metrics", "topologies", "endpoints", "traces", "profiles"];
const activeName = ref<string>(tabs[0]);
const state = reactive({
serviceID: route.params.id,
type: route.params.type,
path: route.meta.headPath,
});
function handleClick(tab: string) {
activeName.value = tab;
state.type = tab;
}
</script>
<style lang="scss" scoped>
.service-detail {
text-align: left;
}
.tabs {
padding: 15px 15px 0 15px;
border-bottom: 1px solid var(--el-border-color-light);
}
.tab {
display: inline-block;
margin-right: 30px;
font-size: 13px;
font-weight: 400;
height: 30px;
&:hover {
color: var(--el-color-primary);
}
&.active {
color: var(--el-color-primary);
border-bottom: 1px solid var(--el-color-primary);
}
}
.title {
padding: 5px 0 5px 15px;
font-size: 14px;
font-weight: 400;
border-bottom: 1px solid #dfe4e8;
background-color: #c4c8e133;
span {
display: inline-block;
margin-right: 10px;
}
}
</style>

View File

@@ -0,0 +1,31 @@
<!-- Licensed to the Apache Software Foundation (ASF) under one or more
contributor license agreements. See the NOTICE file distributed with
this work for additional information regarding copyright ownership.
The ASF licenses this file to You under the Apache License, Version 2.0
(the "License"); you may not use this file except in compliance with
the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License. -->
<template>
<div>{{ msg }}</div>
</template>
<script lang="ts" setup>
import { defineProps } from "vue";
defineProps({
msg: { type: String },
});
// props.msg
</script>
<style scoped>
div {
padding: 15px;
}
</style>

View File

@@ -0,0 +1,30 @@
<!-- Licensed to the Apache Software Foundation (ASF) under one or more
contributor license agreements. See the NOTICE file distributed with
this work for additional information regarding copyright ownership.
The ASF licenses this file to You under the Apache License, Version 2.0
(the "License"); you may not use this file except in compliance with
the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License. -->
<template>
<div>Topology</div>
</template>
<script lang="ts" setup>
import { defineProps } from "vue";
defineProps({
msg: { type: String },
});
// props.msg
</script>
<style scoped>
div {
padding: 15px;
}
</style>

View File

@@ -0,0 +1,31 @@
<!-- Licensed to the Apache Software Foundation (ASF) under one or more
contributor license agreements. See the NOTICE file distributed with
this work for additional information regarding copyright ownership.
The ASF licenses this file to You under the Apache License, Version 2.0
(the "License"); you may not use this file except in compliance with
the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License. -->
<template>
<div>Traces</div>
</template>
<script lang="ts" setup>
import { defineProps } from "vue";
defineProps({
msg: { type: String },
});
// props.msg
</script>
<style scoped>
div {
padding: 15px;
}
</style>

41
src/views/service/data.ts Normal file
View File

@@ -0,0 +1,41 @@
/**
* Licensed to the Apache Software Foundation (ASF) under one or more
* contributor license agreements. See the NOTICE file distributed with
* this work for additional information regarding copyright ownership.
* The ASF licenses this file to You under the Apache License, Version 2.0
* (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
export const TabsConfig: { [key: string]: any } = {
GeneralService: [
{ name: "metrics", path: "/generalService/metrics" },
{ name: "traces", path: "/generalService/traces" },
{ name: "profiles", path: "/generalService/profiles" },
{ name: "services", path: "/generalService" },
],
ServiceMesh: [
{ name: "services", path: "/serviceMesh" },
{ name: "metrics", path: "/serviceMesh/metrics" },
{ name: "traces", path: "/serviceMesh/traces" },
{ name: "profiles", path: "/serviceMesh/profiles" },
],
};
export const PagesConfig = [
{ label: "generalService", name: "GeneralService" },
{ label: "serviceMesh", name: "ServiceMesh" },
{ label: "virtualMachine", name: "VirtualMachine" },
{ label: "dashboardHome", name: "DashboardHome" },
{ label: "dashboardList", name: "DashboardList" },
{ label: "logs", name: "Logs" },
{ label: "settings", name: "Settings" },
{ label: "events", name: "Events" },
{ label: "alerts", name: "Alerts" },
];