chore:

packages/ui/certd-client/src/views/framework/login/captcha.vue

@@ -0,0 +1,46 @@
+<template>
+  <div class="captcha"></div>
+</template>
+<script setup lang="ts">
+import { doRequest } from "/@/components/plugins/lib";
+import { createAddonApi } from "/src/api/modules/addon";
+import { useSettingStore } from "/@/store/settings";
+const props = defineProps<{
+  modelValue?: any;
+}>();
+const emit = defineEmits(["update:modelValue", "change"]);
+
+const addonApi = createAddonApi();
+const settingStore = useSettingStore();
+async function getCaptchaAddonDefine() {
+  const type = settingStore.public.captchaType;
+  const define = addonApi.getDefineByType("captcha", type);
+
+  const res = await doRequest(
+    {
+      addonId: settingStore.public.captchaAddonId
+      type: "captcha",
+      typeName: type,
+      action: "onGetParams",
+    },
+  );
+}
+
+function init() {
+  // @ts-ignore
+  initGeetest4(
+    {
+      captchaId: "您的captchaId",
+    },
+    (captcha: any) => {
+      // captcha为验证码实例
+      captcha.appendTo(".captcha"); // 调用appendTo将验证码插入到页的某一个元素中，这个元素用户可以自定义
+    }
+  );
+}
+
+function onChange(value: string) {
+  emit("update:modelValue", value);
+  emit("change", value);
+}
+</script>

packages/ui/certd-client/src/views/framework/login/index.vue

@@ -20,6 +20,10 @@
                 </template>
               </a-input-password>
             </a-form-item>
+
+            <a-form-item required name="captcha">
+              <captcha v-model:model-value="formState.captcha"></captcha>
+            </a-form-item>
           </template>
         </a-tab-pane>
         <a-tab-pane v-if="sysPublicSettings.smsLoginEnabled === true" key="sms" :tab="t('authentication.smsTab')">
@@ -111,6 +115,7 @@ export default defineComponent({
       imgCode: "",
       smsCode: "",
       randomStr: "",
+      captcha: {},
     });
 
     const rules = {