feat: controhub/configmaps secrets service serviceacounts edit

beclab · Jun 17, 2024 · 7543cf7 · 7543cf7
1 parent a118bd9
commit 7543cf7
Show file tree

Hide file tree

Showing 12 changed files with 419 additions and 38 deletions.
diff --git a/apps/adminConsole/src/containers/Yaml.vue b/apps/adminConsole/src/containers/Yaml.vue
@@ -11,7 +11,8 @@
 			useWorker: true,
 			keyboardHandler: 'vscode',
 			wrapEnabled: true,
-			tabSize: 2
+			tabSize: 2,
+			wrap: true
 		}"
 	/>
 </template>

diff --git a/apps/adminConsole/src/pages/ApplicationSpaces/Configurations/Configmaps.vue b/apps/adminConsole/src/pages/ApplicationSpaces/Configurations/Configmaps.vue
@@ -1,5 +1,10 @@
 <template>
 	<MyContentPage>
+		<template #extra>
+			<div class="col-auto">
+				<MoreSelection :options="options" size="md"></MoreSelection>
+			</div>
+		</template>
 		<MyPage>
 			<my-card square flat animated :title="t('DETAILS')">
 				<DetailPage :data="detail"></DetailPage>
@@ -13,6 +18,7 @@
 			<q-inner-loading :showing="loading"> </q-inner-loading>
 		</MyPage>
 	</MyContentPage>
+	<Yaml ref="yamlRef" :name="t('EDIT_YAML')" module="configmaps"></Yaml>
 </template>
 
 <script setup lang="ts">
@@ -29,11 +35,25 @@ import MyCard from '@packages/ui/src/components/MyCard2.vue';
 import MyPage from '@packages/ui/src/containers/MyPage.vue';
 import MyContentPage from 'src/components/MyContentPage.vue';
 import DataDetail from '@packages/ui/src/containers/DataDetail.vue';
+import MoreSelection from '@packages/ui/src/components/MoreSelection.vue';
+import Yaml from 'src/pages/NamespacePods/Yaml3.vue';
 
 let loading = ref(false);
 const detail = ref();
 const route = useRoute();
 const configmapsData = ref<{ [key: string]: string }>({});
+const yamlRef = ref();
+
+const options = [
+	{
+		label: t('EDIT_YAML'),
+		value: 'edit',
+		icon: 'sym_r_edit',
+		onClick: () => {
+			yamlRef.value.show();
+		}
+	}
+];
 
 const getAttrs = (detail: any) => {
 	const { cluster, namespace }: any = route.params;

diff --git a/apps/adminConsole/src/pages/ApplicationSpaces/Configurations/Secrets.vue b/apps/adminConsole/src/pages/ApplicationSpaces/Configurations/Secrets.vue
@@ -1,5 +1,10 @@
 <template>
 	<MyContentPage>
+		<template #extra>
+			<div class="col-auto">
+				<MoreSelection :options="options" size="md"></MoreSelection>
+			</div>
+		</template>
 		<MyPage>
 			<my-card square flat animated :title="t('DETAILS')">
 				<DetailPage :data="detail"></DetailPage>
@@ -29,6 +34,7 @@
 			<q-inner-loading :showing="loading"> </q-inner-loading>
 		</MyPage>
 	</MyContentPage>
+	<Yaml ref="yamlRef" :name="t('EDIT_YAML')" module="secrets"></Yaml>
 </template>
 
 <script setup lang="ts">
@@ -47,12 +53,26 @@ import MyPage from '@packages/ui/src/containers/MyPage.vue';
 import MyContentPage from 'src/components/MyContentPage.vue';
 import { safeBtoa } from '@packages/ui/src/utils/base64';
 import DataDetail from '@packages/ui/src/containers/DataDetail.vue';
+import MoreSelection from '@packages/ui/src/components/MoreSelection.vue';
+import Yaml from 'src/pages/NamespacePods/Yaml3.vue';
 
 let loading = ref(false);
 const secretValueVisible = ref(false);
 const detail = ref();
 const route = useRoute();
 const secretsData = ref<{ [key: string]: string }>({});
+const yamlRef = ref();
+
+const options = [
+	{
+		label: t('EDIT_YAML'),
+		value: 'edit',
+		icon: 'sym_r_edit',
+		onClick: () => {
+			yamlRef.value.show();
+		}
+	}
+];
 
 const getAttrs = (detail: any) => {
 	const { cluster, namespace } = route.params;

diff --git a/apps/adminConsole/src/pages/ApplicationSpaces/Configurations/ServiceAccounts.vue b/apps/adminConsole/src/pages/ApplicationSpaces/Configurations/ServiceAccounts.vue
@@ -1,5 +1,10 @@
 <template>
 	<MyContentPage>
+		<template #extra>
+			<div class="col-auto">
+				<MoreSelection :options="options" size="md"></MoreSelection>
+			</div>
+		</template>
 		<MyPage>
 			<my-card square flat animated :title="t('DETAILS')">
 				<DetailPage :data="detail"></DetailPage>
@@ -13,6 +18,7 @@
 			></Detail>
 			<q-inner-loading :showing="loading"> </q-inner-loading>
 		</MyPage>
+		<Yaml ref="yamlRef" :name="t('EDIT_YAML')" module="serviceaccounts"></Yaml>
 	</MyContentPage>
 </template>
 
@@ -29,14 +35,27 @@ import { getLocalTime } from 'src/utils';
 import MyCard from '@packages/ui/src/components/MyCard2.vue';
 import MyPage from '@packages/ui/src/containers/MyPage.vue';
 import MyContentPage from 'src/components/MyContentPage.vue';
+import MoreSelection from '@packages/ui/src/components/MoreSelection.vue';
+import Yaml from 'src/pages/NamespacePods/Yaml3.vue';
 
 const loading = ref(false);
 const secrets = ref();
 const data = ref();
 const detail = ref();
 const route = useRoute();
 const serviceAccountName = ref();
+const yamlRef = ref();
 
+const options = [
+	{
+		label: t('EDIT_YAML'),
+		value: 'edit',
+		icon: 'sym_r_edit',
+		onClick: () => {
+			yamlRef.value.show();
+		}
+	}
+];
 const getAttrs = (detail: any) => {
 	const { cluster, namespace } = route.params;
 

diff --git a/apps/adminConsole/src/pages/ApplicationSpaces/Services/Detail.vue b/apps/adminConsole/src/pages/ApplicationSpaces/Services/Detail.vue
@@ -2,23 +2,7 @@
 	<MyContentPage>
 		<template #extra>
 			<div class="col-auto">
-				<q-btn color="grey-7" round flat icon="more_vert">
-					<q-menu cover auto-close>
-						<q-list>
-							<q-item
-								clickable
-								v-close-popup
-								v-for="item in options"
-								:key="item.key"
-								@click="item.onClick"
-							>
-								<q-item-section>
-									<q-item-label>{{ item.text }}</q-item-label>
-								</q-item-section>
-							</q-item>
-						</q-list>
-					</q-menu>
-				</q-btn>
+				<MoreSelection :options="options" size="md"></MoreSelection>
 			</div>
 		</template>
 		<MyPage>
@@ -62,6 +46,7 @@
 			</MyCard>
 			<q-inner-loading :showing="loading"> </q-inner-loading>
 		</MyPage>
+		<Yaml ref="yamlRef" :name="t('EDIT_YAML')" module="services"></Yaml>
 	</MyContentPage>
 </template>
 
@@ -93,6 +78,8 @@ import WorkloadPanel from '@packages/ui/src/containers/WorkloadPanel.vue';
 import MyContentPage from 'src/components/MyContentPage.vue';
 import MyCard from '@packages/ui/src/components/MyCard2.vue';
 import QButtonStyle from '@packages/ui/src/components/QButtonStyle.vue';
+import MoreSelection from '@packages/ui/src/components/MoreSelection.vue';
+import Yaml from 'src/pages/NamespacePods/Yaml3.vue';
 
 const $q = useQuasar();
 let loading = ref(false);
@@ -103,6 +90,8 @@ const detail = ref();
 const PodContainerRef = ref();
 const workloads = ref([]);
 const pods = ref([]);
+const yamlRef = ref();
+
 const options = [
 	// {
 	//   key: 'edit',
@@ -124,9 +113,9 @@ const options = [
 	// },
 	{
 		key: 'editGateway',
-		icon: 'ip',
-		text: t('EDIT_EXTERNAL_ACCESS'),
-		action: 'edit',
+		icon: 'edit',
+		label: t('EDIT_EXTERNAL_ACCESS'),
+		value: 'editGateway',
 		// show: this.store.detail.type === SERVICE_TYPES.VirtualIP,
 		onClick: () => {
 			console.log('editGateway');
@@ -147,7 +136,7 @@ const options = [
 					console.log('Cancel');
 				});
 		}
-	}
+	},
 	// {
 	//   key: 'serviceMonitor',
 	//   icon: 'linechart',
@@ -157,15 +146,14 @@ const options = [
 	//     console.log('serviceMonitor');
 	//   },
 	// },
-	// {
-	//   key: 'editYaml',
-	//   icon: 'pen',
-	//   text: t('EDIT_YAML'),
-	//   action: 'edit',
-	//   onClick: () => {
-	//     console.log('editYaml');
-	//   },
-	// },
+	{
+		label: t('EDIT_YAML'),
+		value: 'edit',
+		icon: 'sym_r_edit',
+		onClick: () => {
+			yamlRef.value.show();
+		}
+	}
 	// {
 	//   key: 'delete',
 	//   icon: 'trash',

diff --git a/apps/adminConsole/src/pages/NamespacePods/Yaml.vue b/apps/adminConsole/src/pages/NamespacePods/Yaml.vue
@@ -26,7 +26,7 @@
 					<q-space />
 					<q-btn icon="close" flat round dense v-close-popup />
 				</div>
-				<div class="relative-position" style="height: calc(100vh - 154px)">
+				<div class="relative-position" style="height: calc(100vh - 158px)">
 					<div
 						style="
 							height: calc(100%);
@@ -65,7 +65,8 @@
 								useWorker: true,
 								keyboardHandler: 'vscode',
 								wrapEnabled: true,
-								tabSize: 2
+								tabSize: 2,
+								wrap: true
 							}"
 						/>
 					</div>
@@ -257,6 +258,7 @@ const update = async (
 		//
 	}
 	loading2.value = false;
+	loading.value = false;
 };
 
 const handleFileAdded = (file: any) => {

diff --git a/apps/adminConsole/src/pages/NamespacePods/Yaml2.vue b/apps/adminConsole/src/pages/NamespacePods/Yaml2.vue
@@ -26,7 +26,7 @@
 					<q-space />
 					<q-btn icon="close" flat round dense v-close-popup />
 				</div>
-				<div class="relative-position" style="height: calc(100vh - 154px)">
+				<div class="relative-position" style="height: calc(100vh - 158px)">
 					<div
 						style="
 							height: calc(100%);
@@ -65,7 +65,8 @@
 								useWorker: true,
 								keyboardHandler: 'vscode',
 								wrapEnabled: true,
-								tabSize: 2
+								tabSize: 2,
+								wrap: true
 							}"
 						/>
 					</div>
@@ -256,6 +257,7 @@ const update = async (
 		//
 	}
 	loading2.value = false;
+	loading.value = false;
 };
 
 const handleFileAdded = (file: any) => {