新增功能:pod（包括statefulsets+headless service情况下的域名）和service明细页面显示域名 (#272)

web/dashboard/src/api/statefulsets.js

@@ -6,6 +6,9 @@ const statefulsetUrl = (cluster_name) => {
 const statefulsetUrlWithNs = (cluster_name, namespace) => {
   return `/api/v1/proxy/${cluster_name}/k8s/apis/apps/v1/namespaces/${namespace}/statefulsets`;
 };
+const statefulsetUrlWithNsAndName = (cluster_name, namespace ,name) => {
+  return `/api/v1/proxy/${cluster_name}/k8s/apis/apps/v1/namespaces/${namespace}/statefulsets/${name}`;
+};
 
 export function listStatefulSets(cluster_name,  search, keywords, pageNum, pageSize) {
   let url = statefulsetUrl(cluster_name);
@@ -23,6 +26,12 @@ export function listStatefulSets(cluster_name,  search, keywords, pageNum, pageS
   return get(url,params);
 }
 
+export function getStatefulSet(cluster_name,  namespace ,name) {
+  let url = statefulsetUrlWithNsAndName(cluster_name,  namespace ,name);
+  const params = {}
+  return get(url,params);
+}
+
 export function scaleStatefulset(cluster_name, namespace, statefulset, data) {
   return patch(`${statefulsetUrlWithNs(cluster_name, namespace)}/${statefulset}/scale`, data);
 }

web/dashboard/src/business/network/services/detail/index.vue

@@ -38,6 +38,18 @@
                   </div>
                 </td>
               </tr>
+              <tr v-if="this.cluster_domain && this.cluster_domain!=''">
+                <td>{{ $t("business.network.service_whole_domain") }}</td>
+                <td colspan="4">{{ item.metadata.name+"."+item.metadata.namespace+".svc."+this.cluster_domain }}</td>
+              </tr>
+              <tr>
+                <td>{{ $t("business.network.service_simple_domain") }}</td>
+                <td colspan="4">{{ item.metadata.name+"."+item.metadata.namespace}}</td>
+              </tr>
+              <tr>
+                <td>{{ $t("business.network.service_domain_same_namespace") }}</td>
+                <td colspan="4">{{ item.metadata.name}}</td>
+              </tr>
             </table>
           </el-card>
         </el-col>
@@ -73,6 +85,7 @@ import {getService} from "@/api/services"
 import ResourcePod from "@/components/detail/detail-pods"
 import ResourcePorts from "@/components/detail/detail-ports"
 import KoDetailBasic from "@/components/detail/detail-basic"
+import {get_cluster_domain} from "@/utils/cluster_domain"
 
 export default {
   name: "ServiceDetail",
@@ -91,17 +104,16 @@ export default {
       yamlShow: false,
       cluster: "",
       yaml: {},
+      cluster_domain: "",
     }
   },
   methods: {
-    getDetail () {
+    async getDetail () {
       this.loading = true
-      getService(this.cluster, this.namespace, this.name).then((res) => {
-        this.item = res
-        this.yaml = JSON.parse(JSON.stringify(this.item))
-      }).finally(() => {
-        this.loading = false
-      })
+      const res =await getService(this.cluster, this.namespace, this.name)
+      this.item = res
+      this.yaml = JSON.parse(JSON.stringify(this.item))
+      this.loading = false
     },
     getSelector (selector) {
       let result = ""
@@ -122,10 +134,12 @@ export default {
       })
     },
   },
-  created () {
+  async created () {
     this.cluster = this.$route.query.cluster
     this.yamlShow = this.$route.query.yamlShow === "true"
-    this.getDetail()
+    this.cluster_domain= await get_cluster_domain(this.cluster)
+    
+    await this.getDetail()
   },
 }
 </script>

web/dashboard/src/business/workloads/pods/detail/index.vue

@@ -35,6 +35,16 @@
                 <td>{{ $t("commons.table.status") }}</td>
                 <td colspan="4">{{ $t("commons.status." + form.status.phase) }}</td>
               </tr>
+              <tr >
+                <td>{{ $t("business.workload.pod_whole_domain") }}</td>
+                <td colspan="4" v-if="this.controller== 'StatefulSet' && this.pod_st_name != '' ">{{this.pod_st_name}}.{{this.form.metadata.namespace}}.svc.{{this.cluster_domain}}</td>
+                <td colspan="4" v-else-if="this.ip!='' ">{{this.ip}}.pod.{{this.cluster_domain}}</td>
+              </tr>
+              <tr>
+                <td>{{ $t("business.workload.pod_simple_domain") }}</td>
+                <td colspan="4" v-if="this.controller== 'StatefulSet' && this.pod_st_name != '' ">{{this.pod_st_name}}.{{this.form.metadata.namespace}}.svc</td>
+                <td colspan="4" v-else-if="this.ip!='' ">{{this.ip}}.pod</td>
+              </tr>
             </table>
             <div class="bottom-button">
               <el-button @click="yamlShow=!yamlShow">{{ $t("commons.button.view_yaml") }}</el-button>
@@ -119,7 +129,9 @@ import KoDetailVolume from "@/components/detail/pod/detail-volume"
 import KoDetailToleration from "@/components/detail/pod/detail-toleration"
 import { listEventsWithPodSelector } from "@/api/events"
 import ComplexTable from "@/components/complex-table"
-
+import {get_cluster_domain} from "@/utils/cluster_domain"
+import { getStatefulSet } from "@/api/statefulsets"
+import { getService } from "@/api/services"
 export default {
   name: "PodDetail",
   components: { LayoutContent, YamlEditor, ComplexTable, KoDetailGeneral, KoDetailContainers, KoDetailVolume, KoDetailToleration },
@@ -129,7 +141,7 @@ export default {
   },
   data() {
     return {
-sourceYaml:{},
+      sourceYaml:{},
       form: {
         metadata: {},
         spec: {
@@ -145,29 +157,56 @@ sourceYaml:{},
       loading: false,
       clusterName: "",
       eventList: [],
+      cluster_domain: "",
+      pod_st_name:"",
+      ip:"",
+      controller: "",
+      pod_st_name: "" ,
     }
   },
   methods: {
-    getDetail() {
+    async  getDetail() {
       this.loading = true
-      getWorkLoadByName(this.clusterName, "pods", this.namespace, this.name).then((res) => {
-        this.sourceYaml= structuredClone(res)
-        this.form = res
-        this.loadEvents()
-        this.loading = false
-      })
+      const res=await getWorkLoadByName(this.clusterName, "pods", this.namespace, this.name)
+      this.sourceYaml= structuredClone(res)
+      this.form = res
+      await this.loadEvents()
+      await this.get_pod_domain()
+      this.loading = false
     },
-    loadEvents() {
+    async   loadEvents() {
       let selects = "involvedObject.name={PodName}&involvedObject.namespace={Namespace}&involvedObject.uid={Uid}&limit=500"
       selects = selects.replace("{PodName}", this.form.metadata.name).replace("{Namespace}", this.form.metadata.namespace).replace("{Uid}", this.form.metadata.uid)
-      listEventsWithPodSelector(this.clusterName, this.namespace, selects).then((res) => {
-        this.eventList = res.items
-      })
+      const res=await listEventsWithPodSelector(this.clusterName, this.namespace, selects)
+      this.eventList = res.items
+      
     },
+    async get_pod_domain(){
+      let ip = "";
+      if (this.form.status.podIPs.length > 0) {
+         ip = this.form.status.podIP.replaceAll(".", "-");
+      }
+      this.ip=ip
+      if(this.form.metadata.ownerReferences && this.form.metadata.ownerReferences.length>0 ){
+        const owner = this.form.metadata.ownerReferences[0];
+	
+        this.controller = owner.kind;
+        if (this.controller == "StatefulSet") {
+           const st =await getStatefulSet(this.clusterName, this.namespace,owner.name)
+           if (st.spec.serviceName && st.spec.serviceName != ""){
+            const headless_service=await getService(this.clusterName, st.metadata.namespace,st.spec.serviceName)
+            if(headless_service.spec.clusterIP=="None"){
+              this.pod_st_name = this.form.metadata.name + "." + st.spec.serviceName;
+            }
+           }
+        }
+      }
+    }
   },
-  created() {
+  async created() {
     this.clusterName = this.$route.query.cluster
-    this.getDetail()
+    this.cluster_domain= await get_cluster_domain(this.clusterName)
+    await this.getDetail()
   },
 }
 </script>

web/dashboard/src/i18n/lang/en-US.js

@@ -507,6 +507,9 @@ actions:{
       single_read_write: "Single-Node(Read/Write)",
       many_read_only: "Many-Node(Read-Only)",
       many_read_write: "Many-Node(Read/Write)",
+
+      pod_whole_domain: "Pod whole domain",
+      pod_simple_domain: "Pod simple domain",
     },
     network: {
       service_discovery: "Service Discovery",
@@ -536,6 +539,9 @@ actions:{
       api_group: "API Group",
       node_port: "Node Port",
       relationship_chart: "Relationship Chart",
+service_whole_domain: "Service whole domain",
+      service_simple_domain: "Service simple domain",
+      service_domain_same_namespace: "Service domain in the same namespace",
     },
     storage: {
       provisioner: "Provisioner",

web/dashboard/src/i18n/lang/zh-CN.js

@@ -509,6 +509,9 @@ actions:{
       many_read_only: "多节点只读",
       many_read_write: "多节点读写",
 
+      pod_whole_domain: "完整域名",
+      pod_simple_domain: "域名简称",
+
     },
     network: {
       service_discovery: "服务发现",
@@ -538,6 +541,9 @@ actions:{
       api_group: "API 组",
       node_port: "节点端口",
       relationship_chart: "关系图",
+      service_whole_domain: "完整域名",
+      service_simple_domain: "域名简称",
+      service_domain_same_namespace: "同一命名空间下域名",
     },
     storage: {
       provisioner: "提供商",

web/dashboard/src/utils/cluster_domain.js

@@ -0,0 +1,26 @@
+import {getConfigMap} from "@/api/configmaps"
+
+export async function get_cluster_domain(clusterName){
+    try{
+       const cm = await getConfigMap(clusterName, "kube-system","coredns")
+
+       const Corefile = cm.data["Corefile"];
+
+       const Corefiles = Corefile.split(/[(\r\n)\r\n]+/); // 根据换行或者回车进行识别
+    
+       let clusterdomain=null;
+       Corefiles.forEach((item, index) => {
+        // 删除空项
+        if (item && item != "") {
+          if (item.trim().startsWith("kubernetes ")) {
+            clusterdomain = item.trim().split(" ")[1];
+          }
+        }
+       });
+       return clusterdomain
+      
+    }catch(e){
+        console.log(e)
+        return null
+    }
+}