fix：修复部分空间样式和交互问题 (#2718)

* fix：修复在新服务中点击跳转问题

* fix：修复导入变量样式

* feat：服务密钥关联配置添加前端校验

* feat：查询被引用配置文件 添加脚本类型展示

bcs-services/bcs-bscp/ui/src/components/code-editor/index.vue

@@ -51,7 +51,7 @@ const props = withDefaults(
     editable: true,
     lfEol: true,
     language: '',
-  }
+  },
 );
 
 const emit = defineEmits(['update:modelValue', 'change', 'enter']);
@@ -72,21 +72,21 @@ watch(
     if (val !== localVal.value) {
       editor.setValue(val);
     }
-  }
+  },
 );
 
 watch(
   () => props.language,
   (val) => {
     monaco.editor.setModelLanguage(editor.getModel() as monaco.editor.ITextModel, val);
-  }
+  },
 );
 
 watch(
   () => props.editable,
   (val) => {
     editor.updateOptions({ readOnly: !val });
-  }
+  },
 );
 
 watch(
@@ -95,14 +95,14 @@ watch(
     if (Array.isArray(val) && val.length > 0) {
       editorHoverProvider = useEditorVariableReplace(editor, val);
     }
-  }
+  },
 );
 
 watch(
   () => props.errorLine,
   () => {
     setErrorLine();
-  }
+  },
 );
 
 onMounted(() => {
@@ -167,9 +167,9 @@ const handleVariableList = async () => {
     getVariableList(bkBizId.value, { start: 0, limit: 1000 }),
     getUnReleasedAppVariables(bkBizId.value, appId.value),
   ]);
-  variableNameList.value = variableList.details.map((item: any) => item.spec.name);
-  privateVariableNameList.value = privateVariableList.details.map((item: any) => item.name);
-  variableNameList.value?.filter((item) => !privateVariableNameList.value!.includes(item));
+  variableNameList.value = variableList.details.map((item: any) => `.${item.spec.name}`);
+  privateVariableNameList.value = privateVariableList.details.map((item: any) => `.${item.name}`);
+  variableNameList.value?.filter(item => !privateVariableNameList.value!.includes(item));
 };
 
 // 注册自定义语言
@@ -208,22 +208,18 @@ const aotoCompletion = () => {
       const lineContent = model.getLineContent(position.lineNumber);
       const charBeforeCursor = lineContent.charAt(position.column - 2);
       // 根据当前的文本内容和光标位置，返回自动补全的候选项列表
-      const variableSuggestions = variableNameList.value!.map((item: string) => {
-        return {
-          label: item, // 候选项的显示文本
-          kind: monaco.languages.CompletionItemKind.Variable, // 候选项的类型
-          insertText: item, // 插入光标后的文本
-          range: new monaco.Range(position.lineNumber, position.column, position.lineNumber, position.column),
-        };
-      });
-      const privateVariableSuggestions = privateVariableNameList.value!.map((item: string) => {
-        return {
-          label: item,
-          kind: monaco.languages.CompletionItemKind.Variable,
-          insertText: item,
-          range: new monaco.Range(position.lineNumber, position.column, position.lineNumber, position.column),
-        };
-      });
+      const variableSuggestions = variableNameList.value!.map((item: string) => ({
+        label: item, // 候选项的显示文本
+        kind: monaco.languages.CompletionItemKind.Variable, // 候选项的类型
+        insertText: item, // 插入光标后的文本
+        range: new monaco.Range(position.lineNumber, position.column, position.lineNumber, position.column),
+      }));
+      const privateVariableSuggestions = privateVariableNameList.value!.map((item: string) => ({
+        label: item,
+        kind: monaco.languages.CompletionItemKind.Variable,
+        insertText: item,
+        range: new monaco.Range(position.lineNumber, position.column, position.lineNumber, position.column),
+      }));
       const suggestions = [...variableSuggestions, ...privateVariableSuggestions];
       if (charBeforeCursor === '{') {
         return {
@@ -234,9 +230,7 @@ const aotoCompletion = () => {
         suggestions: [],
       };
     },
-    resolveCompletionItem: (item: any) => {
-      return item;
-    },
+    resolveCompletionItem: (item: any) => item,
   });
 };
 

bcs-services/bcs-bscp/ui/src/components/diff/text.vue

@@ -59,7 +59,7 @@ const props = withDefaults(
     currentVariables: () => [],
     currentLanguage: '',
     baseVariables: () => [],
-  }
+  },
 );
 
 const textDiffRef = ref();
@@ -76,23 +76,23 @@ watch(
   () => {
     updateModel();
     replaceDiffVariables();
-  }
+  },
 );
 
 watch(
   () => [props.baseLanguage, props.currentLanguage],
   () => {
     updateModel();
     replaceDiffVariables();
-  }
+  },
 );
 
 watch(
   () => [props.basePermission, props.currentPermission],
   () => {
     updateModel();
     replaceDiffVariables();
-  }
+  },
 );
 
 onMounted(() => {
@@ -182,7 +182,7 @@ const replaceDiffVariables = () => {
     permissionDiffEditorHoverProvider = useDiffEditorVariableReplace(
       permissionEditor,
       props.currentVariables,
-      props.baseVariables
+      props.baseVariables,
     );
   }
 };

bcs-services/bcs-bscp/ui/src/components/footer.vue

@@ -12,7 +12,7 @@
 import { defineComponent } from 'vue';
 
 export default defineComponent({
-  name: 'app-footer',
+  name: 'AppFooter',
   setup() {
     return {
       // @ts-ignore

bcs-services/bcs-bscp/ui/src/components/permission-input-picker.vue

@@ -78,14 +78,14 @@ watch(
     privilegeInputVal.value = val;
     localVal.value = val;
   },
-  { immediate: true }
+  { immediate: true },
 );
 
 // 将权限数字拆分成三个分组配置
 const privilegeGroupsValue = computed(() => {
   const data: { [index: string]: number[] } = { 0: [], 1: [], 2: [] };
   if (typeof localVal.value === 'string' && localVal.value.length > 0) {
-    const valArr = localVal.value.split('').map((i) => parseInt(i, 10));
+    const valArr = localVal.value.split('').map(i => parseInt(i, 10));
     valArr.forEach((item, index) => {
       data[index as keyof typeof data] = PRIVILEGE_VALUE_MAP[item as keyof typeof PRIVILEGE_VALUE_MAP];
     });

bcs-services/bcs-bscp/ui/src/views/space/credentials/associate-config-items/index.vue

@@ -74,7 +74,7 @@ watch(
         alter_scope: [],
       };
     }
-  }
+  },
 );
 
 const loadRules = async () => {