fix: update minichart tooltip

apps/adminConsole/src/containers/EnvironmentVariables.vue

@@ -41,29 +41,7 @@
 			<PortsTable :ports="ports"></PortsTable>
 		</MyCard>
 		<MyCard no-content-gap square flat :title="t('ENVIRONMENT_VARIABLE_PL')">
-			<div class="q-gutter-y-md">
-				<div
-					class="environments-wrapper q-px-lg q-py-md"
-					v-for="item in envlist"
-					:key="item.name"
-				>
-					<MyExpansion
-						:label="item.name"
-						:default-opened="!loading && !item.env"
-					>
-						<MyChipList
-							v-if="envFilter(item.env).length > 0"
-							:data="envFilter(item.env)"
-							dense-toggle
-						>
-						</MyChipList>
-						<div v-else>
-							<Empty></Empty>
-						</div>
-					</MyExpansion>
-				</div>
-			</div>
-			<q-inner-loading :showing="loading"> </q-inner-loading>
+			<EnvironmentsLayout :detail="detail"></EnvironmentsLayout>
 		</MyCard>
 		<Metadata v-if="detail" :detail="detail" :data="detail"></Metadata>
 		<MyCard no-content-gap square flat animated :title="t('EVENT_PL')">
@@ -96,22 +74,19 @@ import { safeAtob } from '@packages/ui/src/utils/base64';
 import axios from 'axios';
 import MyCard from '@packages/ui/src/components/MyCard2.vue';
 import { t } from 'src/boot/i18n';
-import MyChipList from '@packages/ui/src/containers/MyChipList.vue';
 import { joinSelector } from 'src/utils';
 import { ObjectMapper } from 'src/utils/object.mapper';
 import Event from '@packages/ui/src/containers/Event.vue';
 import Metadata from '@packages/ui/src/containers/Metadata.vue';
 import ReplicaCard from './ReplicaCard.vue';
-import Empty from '@packages/ui/src/components/Empty.vue';
 import RevisionControl from './RevisionControl/IndexPage.vue';
 import MyQDialog from 'src/components/MyQDialog.vue';
 import PodContainer from '@packages/ui/src/containers/PodsList/PodContainer.vue';
-import SocketClient from 'src/utils/socket.client';
 import PortsTable from '@packages/ui/src/containers/PortsTable.vue';
-import MyExpansion from '@packages/ui/src/components/MyExpansion.vue';
 import MyPage from '@packages/ui/src/containers/MyPage.vue';
 import QButtonStyle from '@packages/ui/src/components/QButtonStyle.vue';
 import Refresh from '@packages/ui/src/components/Refresh.vue';
+import EnvironmentsLayout from '@packages/ui/src/containers/EnvironmentsLayout.vue';
 
 interface Props {
 	module?: string;
@@ -121,7 +96,6 @@ const loading = ref(false);
 const route = useRoute();
 const envDetail = ref();
 const detail = ref();
-const envlist = ref();
 const params = ref();
 const variables = ref();
 const childComponentRef = ref();
@@ -130,13 +104,6 @@ const PodContainerRef = ref();
 
 const props = withDefaults(defineProps<Props>(), {});
 
-const envFilter = (data: any[]) => {
-	const newData = data || [];
-	const temp = newData.filter((item) => item.value);
-	console.log('bbbbb', data, temp);
-	return temp;
-};
-
 const getPath = ({ cluster, namespace }: { [key: string]: string } = {}) => {
 	let path = '';
 	if (cluster) {
@@ -215,30 +182,6 @@ const etchVariables = async (container: any) => {
 	return container;
 };
 
-const containers = computed(() => {
-	const data = envDetail.value || {};
-	const { spec, containers = [] } = data;
-
-	if (props.module === 'containers') return [data];
-
-	if (!isEmpty(containers)) return containers;
-	if (!isEmpty(spec)) return get(spec, 'template.spec.containers', []);
-
-	return [];
-});
-
-const initContainers = computed(() => {
-	const data = envDetail.value || {};
-	const { spec, initContainers: initContainersData = [] } = data;
-
-	if (props.module === 'containers') return [data];
-
-	if (!isEmpty(initContainersData)) return initContainersData;
-	if (!isEmpty(spec)) return get(spec, 'template.spec.initContainers', []);
-
-	return [];
-});
-
 const fetchList2 = async ({
 	cluster,
 	namespace,
@@ -263,16 +206,6 @@ const fetchList2 = async ({
 	return data;
 };
 
-const fetchData = async () => {
-	const { namespace, cluster }: { [key: string]: any } = route.params;
-	envlist.value = await fetchList2({
-		namespace: namespace,
-		cluster: cluster,
-		containers: containers.value,
-		initContainers: initContainers.value
-	});
-};
-
 const fetchEnv = async () => {
 	const { namespace, kind, name }: { [key: string]: any } = route.params;
 	loading.value = true;
@@ -281,8 +214,6 @@ const fetchEnv = async () => {
 	loading.value = false;
 
 	params.value = getParams('default');
-
-	fetchData();
 };
 
 function updateDetail(data: any) {

apps/adminConsole/src/pages/ApplicationSpaces/Workloads/Workloads.vue

@@ -99,7 +99,7 @@ const menuOptions = {
 const route = useRoute();
 const list = ref<any[]>([]);
 const loading = ref(false);
-const defaultActive = ref(route.params.uid);
+const defaultActive = ref();
 const workloadChildren = ref([]);
 const shouldExecuteResponseHandler = ref(true);
 let firstListIndexs: [number, number] | undefined = undefined;
@@ -124,7 +124,7 @@ const fetchData = async () => {
 		sortBy: 'createTime',
 		namespace
 	};
-	// defaultActive.value = undefined;
+	defaultActive.value = undefined;
 	searchText.value = '';
 	loading.value = true;
 	const [workloadData, configurationsData, servicesData] = await Promise.all([
@@ -180,7 +180,7 @@ const workloadsDataFormatter = (
 			id: child.value,
 			selectable: false,
 			children: childData.map((item: any, childIndex: number) => {
-				path = `/application-spaces/workloads/${child.value}/${namespace}/detail/${item.metadata.name}/${item.metadata.creationTimestamp}/${item.metadata.uid}`;
+				path = `/application-spaces/workloads/${child.value}/${namespace}/detail/${item.metadata.name}/${item.metadata.creationTimestamp}`;
 				id = item.metadata.uid;
 				if (!firstPath) {
 					firstPath = path;
@@ -267,18 +267,11 @@ const tabList = (item: any, node: string) => {
 	});
 };
 
-watch(
-	() => route.params.uid,
-	() => {
-		const { namespace, name, kind, uid }: { [key: string]: any } = route.params;
-		defaultActive.value = uid;
-	}
-);
-
 watch(
 	() => route.query.type,
 	(type) => {
-		const { namespace, name, kind, uid }: { [key: string]: any } = route.params;
+		const { namespace, name, kind }: { [key: string]: any } = route.params;
+
 		if (type === 'pod') {
 			myTreeRef.value.setExpanded(`${route.query.uid}`, true);
 			layzLoadData(route.query.uid as string, PodListData.data);

apps/adminConsole/yarn.lock

@@ -3220,9 +3220,9 @@ electron-to-chromium@^1.4.668:
   integrity sha512-LYLXyEUsZ3nNSwiOWjI88N1PJUAMU2QphQSgGLVkFnb3FxZxNui2Vzi2PaKPgPWbsWbZstZnh6BMf/VQJamjiQ==
 
 element-plus@^2.2.32:
-  version "2.7.7"
-  resolved "https://registry.yarnpkg.com/element-plus/-/element-plus-2.7.7.tgz#317a4b826d577f4572ca040f2568eb751edd891d"
-  integrity sha512-7ucUiDAxevyBE8JbXBTe9ofHhS047VmWMLoksE45zZ08XSnhnyG7WUuk3gmDbAklfVMHedb9sEV3OovPUWt+Sw==
+  version "2.7.8"
+  resolved "https://registry.yarnpkg.com/element-plus/-/element-plus-2.7.8.tgz#5de53bbcb455653a27b43418e3569a22ead59866"
+  integrity sha512-h6dx2XihAbQaud0v+6O7Fy0b0G3YNplNVH7QnK3csTcvQd4y4raiyMRQpf9EKbRbTMdNrFsqAZrs9ok9DMcJHg==
   dependencies:
     "@ctrl/tinycolor" "^3.4.1"
     "@element-plus/icons-vue" "^2.3.1"

apps/common/src/components/Charts/MylineChartMini2.vue

@@ -1,5 +1,5 @@
 <template>
-	<ListItem size="lg">
+	<ListItem size="lg" :ellipsis="false">
 		<template #title>
 			<v-chart
 				class="chart"

apps/common/src/components/MyListItem/ListItem.vue

@@ -1,5 +1,5 @@
 <template>
-	<div class="title-contianer row no-wrap items-center overflow-hidden">
+	<div class="title-contianer row no-wrap items-center">
 		<template v-if="$slots.avatar">
 			<div
 				class="title-avatra"
@@ -9,11 +9,15 @@
 				<slot name="avatar"></slot>
 			</div>
 		</template>
-		<div class="column justify-between full-width ellipsis">
-			<MyTitle v-bind="props" v-if="$slots.title">
+		<div
+			class="column justify-between full-width"
+			:class="[ellipsis ? 'ellipsis' : '']"
+		>
+			<MyTitle v-bind="props" :ellipsis="ellipsis" v-if="$slots.title">
 				<slot name="title"></slot>
 			</MyTitle>
-			<MyTitle v-bind="props" v-else :title="title"> </MyTitle>
+			<MyTitle v-bind="props" v-else :ellipsis="ellipsis" :title="title">
+			</MyTitle>
 			<MySubTitle class="q-mt-xs" v-bind="props" v-if="$slots.subTitle">
 				<slot name="subTitle"></slot>
 			</MySubTitle>
@@ -36,12 +40,14 @@ interface Props {
 	iconSize: 'sm' | 'md' | 'lg';
 	titleClass?: string;
 	titleStyle?: CSSProperties | undefined;
+	ellipsis?: boolean;
 }
 
 const props = withDefaults(defineProps<Props>(), {
 	bolder: true,
 	size: 'md',
-	iconSize: 'md'
+	iconSize: 'md',
+	ellipsis: true
 });
 
 const listItemTitleSize = computed(() => `title-avatra-${props.iconSize}`);

apps/common/src/components/MyListItem/MyTitle.vue

@@ -1,7 +1,7 @@
 <template>
 	<div
-		class="my-title-container ellipsis full-width text-ink-1"
-		:class="sizeClass"
+		class="my-title-container full-width text-ink-1"
+		:class="[sizeClass, ellipsis ? 'ellipsis' : '']"
 		:style="{ fontWeight: bold ? '500' : 'normal' }"
 	>
 		<template v-if="$slots.default">
@@ -20,11 +20,13 @@ interface Props {
 	title?: string;
 	bolder?: boolean;
 	size?: 'sm' | 'md' | 'lg';
+	ellipsis?: boolean;
 }
 
 const props = withDefaults(defineProps<Props>(), {
 	bolder: true,
-	size: 'md'
+	size: 'md',
+	ellipsis: true
 });
 
 const { bolder: bold } = toRefs(props);

apps/common/src/components/MyLoading.vue

@@ -1,5 +1,5 @@
 <template>
-	<div class="relative-position">
+	<div>
 		<slot></slot>
 		<q-inner-loading v-bind="$attrs" />
 	</div>