perf: 阿里云部分插件优化 @nicheng-he

1.新增RemoteAutoComplete插件 2.阿里云OSS部署插件支持自动获取BucketList 3.阿里云ESA支持选择上传到阿里云CAS产物 4.解决阿里云OSS默认接入点配置错误问题
2026-04-24 04:17:25 +08:00 · 2025-07-23 15:45:40 +08:00
parent f7b7d3d65e
commit e3738f6422
4 changed files with 195 additions and 2 deletions
@@ -0,0 +1,162 @@
+<template>
+  <div class="remote-auto-complete">
+    <div class="flex flex-row">
+      <a-auto-complete class="remote-auto-complete-input" :filter-option="filterOption" :options="optionsRef" :value="value" v-bind="attrs" @click="onClick" @update:value="emit('update:value', $event)">
+      </a-auto-complete>
+      <div class="ml-5">
+        <fs-button :loading="loading" title="刷新选项" icon="ion:refresh-outline" @click="refreshOptions"></fs-button>
+      </div>
+    </div>
+    <div class="helper" :class="{ error: hasError }">
+      {{ message }}
+    </div>
+  </div>
+</template>
+<script setup lang="ts">
+import { ComponentPropsType, doRequest } from "/@/components/plugins/lib";
+import { defineComponent, inject, ref, useAttrs, watch, Ref } from "vue";
+import { PluginDefine } from "@certd/pipeline";
+
+defineOptions({
+  name: "RemoteAutoComplete",
+});
+
+const props = defineProps<
+  {
+    watches: string[];
+  } & ComponentPropsType
+>();
+
+const emit = defineEmits<{
+  "update:value": any;
+}>();
+
+const attrs = useAttrs();
+
+const getCurrentPluginDefine: any = inject("getCurrentPluginDefine", () => {
+  return {};
+});
+const getScope: any = inject("get:scope", () => {
+  return {};
+});
+const getPluginType: any = inject("get:plugin:type", () => {
+  return "plugin";
+});
+
+const optionsRef = ref([]);
+const message = ref("");
+const hasError = ref(false);
+const loading = ref(false);
+
+const getOptions = async () => {
+  if (loading.value) {
+    return;
+  }
+
+  if (!getCurrentPluginDefine) {
+    return;
+  }
+
+  const define: PluginDefine = getCurrentPluginDefine()?.value;
+  if (!define) {
+    return;
+  }
+  const pluginType = getPluginType();
+  const { form } = getScope();
+  const input = (pluginType === "plugin" ? form?.input : form) || {};
+
+  for (let key in define.input) {
+    const inWatches = props.watches.includes(key);
+    const inputDefine = define.input[key];
+    if (inWatches && inputDefine.required) {
+      const value = input[key];
+      if (value == null || value === "") {
+        console.log("remote-select required", key);
+        return;
+      }
+    }
+  }
+
+  message.value = "";
+  hasError.value = false;
+  loading.value = true;
+  try {
+    const res = await doRequest(
+      {
+        type: pluginType,
+        typeName: form.type,
+        action: props.action,
+        input,
+        data: {},
+      },
+      {
+        onError(err: any) {
+          hasError.value = true;
+          message.value = `获取选项出错：${err.message}`;
+        },
+        showErrorNotify: false,
+      }
+    );
+    const list = res?.list || res || [];
+    if (list.length > 0) {
+      message.value = "获取数据成功，请从下拉框中选择";
+    }
+    optionsRef.value = list;
+
+    return res;
+  } finally {
+    loading.value = false;
+  }
+};
+
+const filterOption = (input: string, option: any) => {
+  return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0 || String(option.value).toLowerCase().indexOf(input.toLowerCase());
+};
+
+async function onClick() {
+  if (optionsRef.value?.length === 0) {
+    await refreshOptions();
+  }
+}
+
+async function refreshOptions() {
+  await getOptions();
+}
+
+watch(
+  () => {
+    const pluginType = getPluginType();
+    const { form, key } = getScope();
+    const input = (pluginType === "plugin" ? form?.input : form) || {};
+    const watches = {};
+    for (const key of props.watches) {
+      //@ts-ignore
+      watches[key] = input[key];
+    }
+    return {
+      form: watches,
+      key,
+    };
+  },
+  async (value, oldValue) => {
+    const { form } = value;
+    const oldForm: any = oldValue?.form;
+    let changed = oldForm == null || optionsRef.value.length == 0;
+    for (const key of props.watches) {
+      //@ts-ignore
+      if (oldForm && form[key] != oldForm[key]) {
+        changed = true;
+        break;
+      }
+    }
+    if (changed) {
+      await getOptions();
+    }
+  },
+  {
+    immediate: true,
+  }
+);
+</script>
+
+<style lang="less"></style>