fix: select components used in modal pop-ups cannot be selected (#4368)

* fix: select components used in modal pop-ups cannot be selected

* chore: update ci

* chore: update css

packages/@core/ui-kit/popup-ui/src/modal/modal-api.ts

@@ -41,6 +41,7 @@ export class ModalApi {
       isOpen: false,
       loading: false,
       modal: true,
+      openAutoFocus: false,
       showCancelButton: true,
       showConfirmButton: true,
       title: '',

packages/@core/ui-kit/popup-ui/src/modal/modal.ts

@@ -75,6 +75,10 @@ export interface ModalProps {
    * @default true
    */
   modal?: boolean;
+  /**
+   * 是否自动聚焦
+   */
+  openAutoFocus?: boolean;
   /**
    * 是否显示取消按钮
    * @default true

packages/@core/ui-kit/popup-ui/src/modal/modal.vue

@@ -68,6 +68,7 @@ const {
   header,
   loading: showLoading,
   modal,
+  openAutoFocus,
   showCancelButton,
   showConfirmButton,
   title,
@@ -133,6 +134,13 @@ function escapeKeyDown(e: KeyboardEvent) {
     e.preventDefault();
   }
 }
+
+function handerOpenAutoFocus(e: Event) {
+  if (!openAutoFocus.value) {
+    e?.preventDefault();
+  }
+}
+
 // pointer-down-outside
 function pointerDownOutside(e: Event) {
   const target = e.target as HTMLElement;
@@ -166,6 +174,7 @@ function pointerDownOutside(e: Event) {
       close-class="top-3"
       @escape-key-down="escapeKeyDown"
       @interact-outside="interactOutside"
+      @open-auto-focus="handerOpenAutoFocus"
       @pointer-down-outside="pointerDownOutside"
     >
       <DialogHeader