load captcha image only when tenant selected

src/views/login.vue

@@ -10,11 +10,11 @@
       <el-form-item prop="tenant">
         <paged-select
             v-model="loginForm.tenant"
+            :default-label="defaultTenantNamt"
             :prop="{
             label: 'companyName',
             value: 'tenantId',
           }"
-          :default-label="defaultTenantNamt"
             :query="{
             page: 'pageNum',
             size: 'pageSize',
@@ -66,7 +66,7 @@
           </template>
         </el-input>
       </el-form-item>
-      <el-form-item v-if="captchaEnabled" prop="code">
+      <el-form-item v-if="captchaEnabled && loginForm.tenant" prop="code">
         <el-input
             v-model="loginForm.code"
             auto-complete="off"
@@ -122,6 +122,7 @@ import Cookies from "js-cookie";
 import {decrypt, encrypt} from "@/utils/jsencrypt";
 import useUserStore from "@/store/modules/user";
 import PagedSelect from "@/components/InfiniteSelect";
+import {getCurrentInstance, ref, watchEffect} from "vue";
 
 const userStore = useUserStore();
 const router = useRouter();
@@ -229,7 +230,11 @@ const handleTenantConfirm = (option) => {
   useUserStore().setTempTenant(option);
 };
 
+watchEffect(() => {
+  if (loginForm.value.tenant) {
     getCode();
+  }
+})
 getCookie();
 defaultTenantNamt.value = useUserStore().tempTenantName;
 </script>