@blueking/bk-user-selector 0.0.6 → 0.0.8

package/vue3/index.es.min.js

@@ -1,5 +1,5 @@
-import { ref, onBeforeMount, defineComponent, createBlock, openBlock, unref, withModifiers, normalizeClass, withCtx, createElementVNode, createElementBlock, createCommentVNode, toDisplayString, watch, nextTick, onMounted, withDirectives, createVNode, Fragment, renderList, isRef, vModelText, createTextVNode, computed, pushScopeId, popScopeId } from "vue";
-import { Tag, Popover, Loading, clickoutside } from "bkui-vue";
+import { ref, onBeforeMount, defineComponent, createElementBlock, createCommentVNode, openBlock, withModifiers, normalizeClass, computed, createBlock, unref, withCtx, createVNode, createElementVNode, toDisplayString, Fragment, renderList, watch, nextTick, onMounted, withDirectives, isRef, vModelText, createTextVNode, pushScopeId, popScopeId } from "vue";
+import { Popover, Loading, Tag, bkTooltips, clickoutside } from "bkui-vue";
 const getTenants = async (apiBaseUrl, tenantId) => {
   if (!apiBaseUrl || !tenantId) {
     console.warn("获取租户信息需要提供有效的apiBaseUrl和租户ID");
@@ -2960,6 +2960,270 @@ const useUserSearch = (apiBaseUrl, tenantId) => {
     clearSearch
   };
 };
+const _sfc_main$5 = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "MeTag"
+  },
+  __name: "me-tag",
+  props: {
+    /**
+     * 当前用户ID
+     */
+    currentUserId: {
+      type: String,
+      default: ""
+    },
+    /**
+     * 是否禁用
+     */
+    isDisabled: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ["click"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const handleClick = () => {
+      if (props.isDisabled) return;
+      emit("click");
+    };
+    return (_ctx, _cache) => {
+      return __props.currentUserId ? (openBlock(), createElementBlock(
+        "div",
+        {
+          key: 0,
+          class: normalizeClass(["me-tag", { disabled: __props.isDisabled }]),
+          onClick: withModifiers(handleClick, ["stop"])
+        },
+        " 我 ",
+        2
+        /* CLASS */
+      )) : createCommentVNode("v-if", true);
+    };
+  }
+});
+const _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+const MeTag = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-887b7c44"]]);
+const _hoisted_1$4 = {
+  key: 0,
+  class: "no-data"
+};
+const _hoisted_2$3 = { class: "group-name" };
+const _hoisted_3$3 = { class: "group-count" };
+const _hoisted_4$1 = ["onMousedown"];
+const _hoisted_5 = {
+  key: 0,
+  class: "tenant-name"
+};
+const _sfc_main$4 = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "SelectionPopover"
+  },
+  __name: "selection-popover",
+  props: {
+    /**
+     * 是否显示下拉菜单
+     */
+    isShow: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * 容器宽度
+     */
+    containerWidth: {
+      type: [Number, String],
+      default: "auto"
+    },
+    /**
+     * 是否加载中
+     */
+    loading: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * 搜索结果选项
+     */
+    options: {
+      type: Array,
+      default: () => []
+    },
+    /**
+     * 搜索关键词
+     */
+    searchQuery: {
+      type: String,
+      default: ""
+    },
+    /**
+     * 当前租户ID
+     */
+    tenantId: {
+      type: String,
+      default: ""
+    },
+    /**
+     * 租户信息映射
+     */
+    tenants: {
+      type: Object,
+      default: () => ({})
+    },
+    /**
+     * 用户组
+     */
+    userGroup: {
+      type: Array,
+      default: () => []
+    },
+    /**
+     * 用户组名称
+     */
+    userGroupName: {
+      type: String,
+      default: "用户群组"
+    }
+  },
+  emits: ["select-user"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const groupedUsers = computed(() => {
+      const groups = {};
+      console.log("props.options", props.options);
+      if (Array.isArray(props.userGroup) && props.userGroup.length > 0) {
+        groups[props.userGroupName] = props.userGroup.map((group) => ({
+          id: group.id,
+          name: group.name,
+          tenantId: ""
+        }));
+      }
+      props.options.forEach((user) => {
+        const groupName = user.data_source_type === "real" ? "用户" : "虚拟账号";
+        if (!groups[groupName]) {
+          groups[groupName] = [];
+        }
+        groups[groupName].push(user);
+      });
+      return groups;
+    });
+    const selectUser = (user) => {
+      emit("select-user", user);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Popover), {
+        "ext-cls": "bk-user-selector-popover",
+        arrow: false,
+        "is-show": __props.isShow,
+        width: __props.containerWidth,
+        placement: "bottom-start",
+        theme: "light",
+        trigger: "manual"
+      }, {
+        content: withCtx(() => [
+          createVNode(unref(Loading), {
+            class: "dropdown-content",
+            loading: __props.loading,
+            size: "mini",
+            mode: "spin"
+          }, {
+            default: withCtx(() => [
+              __props.options.length === 0 && __props.userGroup.length === 0 ? (openBlock(), createElementBlock("div", _hoisted_1$4, [
+                createElementVNode(
+                  "span",
+                  null,
+                  toDisplayString(__props.searchQuery.length > 1 ? "未找到匹配用户" : "请输入关键词搜索"),
+                  1
+                  /* TEXT */
+                )
+              ])) : (openBlock(true), createElementBlock(
+                Fragment,
+                { key: 1 },
+                renderList(groupedUsers.value, (group, groupName) => {
+                  return openBlock(), createElementBlock("div", {
+                    class: "user-group",
+                    key: groupName
+                  }, [
+                    createElementVNode(
+                      "div",
+                      {
+                        class: "group-header",
+                        onMousedown: _cache[0] || (_cache[0] = withModifiers(() => {
+                        }, ["prevent"]))
+                      },
+                      [
+                        createElementVNode(
+                          "span",
+                          _hoisted_2$3,
+                          toDisplayString(groupName),
+                          1
+                          /* TEXT */
+                        ),
+                        createElementVNode(
+                          "span",
+                          _hoisted_3$3,
+                          "(" + toDisplayString(group.length) + ")",
+                          1
+                          /* TEXT */
+                        )
+                      ],
+                      32
+                      /* NEED_HYDRATION */
+                    ),
+                    (openBlock(true), createElementBlock(
+                      Fragment,
+                      null,
+                      renderList(group, (user) => {
+                        return openBlock(), createElementBlock("div", {
+                          class: "user-option",
+                          key: user.id,
+                          onMousedown: withModifiers(($event) => selectUser(user), ["prevent"])
+                        }, [
+                          createElementVNode(
+                            "span",
+                            null,
+                            toDisplayString(user.name),
+                            1
+                            /* TEXT */
+                          ),
+                          user.tenantId !== __props.tenantId && user.tenantId && __props.tenants[user.tenantId] ? (openBlock(), createElementBlock(
+                            "span",
+                            _hoisted_5,
+                            "@" + toDisplayString(__props.tenants[user.tenantId]),
+                            1
+                            /* TEXT */
+                          )) : createCommentVNode("v-if", true)
+                        ], 40, _hoisted_4$1);
+                      }),
+                      128
+                      /* KEYED_FRAGMENT */
+                    ))
+                  ]);
+                }),
+                128
+                /* KEYED_FRAGMENT */
+              ))
+            ]),
+            _: 1
+            /* STABLE */
+          }, 8, ["loading"])
+        ]),
+        _: 1
+        /* STABLE */
+      }, 8, ["is-show", "width"]);
+    };
+  }
+});
+const SelectionPopover = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-c68dfcac"]]);
 const _hoisted_1$3 = { class: "tag-content" };
 const _hoisted_2$2 = { class: "user-name" };
 const _hoisted_3$2 = {
@@ -3019,26 +3283,10 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _export_sfc = (sfc, props) => {
-  const target = sfc.__vccOpts || sfc;
-  for (const [key, val] of props) {
-    target[key] = val;
-  }
-  return target;
-};
 const UserTag = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-203c36cb"]]);
 const _hoisted_1$2 = ["onClick"];
 const _hoisted_2$1 = ["placeholder"];
 const _hoisted_3$1 = ["placeholder"];
-const _hoisted_4$1 = {
-  key: 0,
-  class: "no-data"
-};
-const _hoisted_5$1 = ["onMousedown"];
-const _hoisted_6$1 = {
-  key: 0,
-  class: "tenant-name"
-};
 const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   ...{
     name: "BkUserSelectorMultiple"
@@ -3107,6 +3355,20 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     exactSearchKey: {
       type: String,
       default: "bk_username"
+    },
+    /**
+     * 用户组
+     */
+    userGroup: {
+      type: Array,
+      default: () => []
+    },
+    /**
+     * 用户组名称
+     */
+    userGroupName: {
+      type: String,
+      default: "用户群组"
     }
   },
   emits: ["update:selectedUsers", "add-user", "remove-user"],
@@ -3132,6 +3394,9 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     const sortableInstance = ref(null);
     const visibleUsers = ref([]);
     const hiddenCount = ref(0);
+    const options = computed(() => {
+      return searchResults.value.filter((user) => !props.selectedUsers.some((selectedUser) => selectedUser.id === user.id));
+    });
     const initSortable = () => {
       if (!props.draggable || !sortableContainerRef.value) return;
       if (sortableInstance.value) {
@@ -3169,7 +3434,11 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     };
     const handleFocus = () => {
       isFocused.value = true;
-      showDropdown.value = false;
+      if (props.userGroup.length > 0) {
+        showDropdown.value = true;
+      } else {
+        showDropdown.value = false;
+      }
       activeTagIndex.value = -1;
       nextTick(() => {
         if (lastInputRef.value) {
@@ -3420,17 +3689,11 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
                   [vModelText, unref(searchQuery)]
                 ]) : createCommentVNode("v-if", true),
                 createCommentVNode(' "我"标签 '),
-                __props.currentUserId ? (openBlock(), createElementBlock(
-                  "div",
-                  {
-                    key: 1,
-                    class: normalizeClass(["me-tag", { disabled: __props.currentUserId && __props.selectedUsers.some((user) => user.id === __props.currentUserId) }]),
-                    onClick: _cache[2] || (_cache[2] = withModifiers(($event) => addCurrentUser(), ["stop"]))
-                  },
-                  " 我 ",
-                  2
-                  /* CLASS */
-                )) : createCommentVNode("v-if", true)
+                createVNode(MeTag, {
+                  "current-user-id": __props.currentUserId,
+                  "is-disabled": !!__props.currentUserId && __props.selectedUsers.some((user) => user.id === __props.currentUserId),
+                  onClick: addCurrentUser
+                }, null, 8, ["current-user-id", "is-disabled"])
               ],
               512
               /* NEED_PATCH */
@@ -3470,7 +3733,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
                   /* KEYED_FRAGMENT */
                 )),
                 createCommentVNode(" 显示折叠标签数量 "),
-                hiddenCount.value > 0 ? (openBlock(), createBlock(unref(Tag), {
+                hiddenCount.value > 0 ? withDirectives((openBlock(), createBlock(unref(Tag), {
                   key: 0,
                   onClick: withModifiers(handleFocus, ["stop"])
                 }, {
@@ -3483,30 +3746,29 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
                   ]),
                   _: 1
                   /* STABLE */
-                })) : createCommentVNode("v-if", true),
+                })), [
+                  [unref(bkTooltips), {
+                    content: __props.selectedUsers.slice(visibleUsers.value.length).map((user) => user.display_name).join(","),
+                    placement: "top"
+                  }]
+                ]) : createCommentVNode("v-if", true),
                 createCommentVNode(" 搜索输入框 "),
                 withDirectives(createElementVNode("input", {
                   ref_key: "collapsedInputRef",
                   ref: collapsedInputRef,
                   class: "search-input collapsed",
-                  "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => isRef(searchQuery) ? searchQuery.value = $event : null),
+                  "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isRef(searchQuery) ? searchQuery.value = $event : null),
                   placeholder: !__props.selectedUsers.length ? __props.placeholder : "",
                   onFocus: handleFocus
                 }, null, 40, _hoisted_3$1), [
                   [vModelText, unref(searchQuery)]
                 ]),
                 createCommentVNode(' 未聚焦状态下的"我"标签 '),
-                __props.currentUserId ? (openBlock(), createElementBlock(
-                  "div",
-                  {
-                    key: 1,
-                    class: normalizeClass(["me-tag", { disabled: __props.currentUserId && __props.selectedUsers.some((user) => user[props.exactSearchKey] === __props.currentUserId) }]),
-                    onClick: _cache[4] || (_cache[4] = withModifiers(($event) => addCurrentUser(), ["stop"]))
-                  },
-                  " 我 ",
-                  2
-                  /* CLASS */
-                )) : createCommentVNode("v-if", true)
+                createVNode(MeTag, {
+                  "current-user-id": __props.currentUserId,
+                  "is-disabled": !!__props.currentUserId && __props.selectedUsers.some((user) => user[props.exactSearchKey] === __props.currentUserId),
+                  onClick: addCurrentUser
+                }, null, 8, ["current-user-id", "is-disabled"])
               ],
               512
               /* NEED_PATCH */
@@ -3516,75 +3778,26 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
           /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
         )),
         createCommentVNode(" 下拉选项列表 "),
-        createVNode(unref(Popover), {
-          "ext-cls": "bk-user-selector-popover",
-          arrow: false,
+        createVNode(SelectionPopover, {
+          "container-width": containerRef.value ? containerRef.value.offsetWidth : "auto",
           "is-show": showDropdown.value,
-          width: containerRef.value ? containerRef.value.offsetWidth : "auto",
-          placement: "bottom-start",
-          theme: "light",
-          trigger: "manual"
-        }, {
-          content: withCtx(() => [
-            createVNode(unref(Loading), {
-              class: "dropdown-content",
-              loading: unref(searchLoading),
-              size: "mini",
-              mode: "spin"
-            }, {
-              default: withCtx(() => [
-                unref(searchResults).length === 0 ? (openBlock(), createElementBlock("div", _hoisted_4$1, [
-                  createElementVNode(
-                    "span",
-                    null,
-                    toDisplayString(unref(searchQuery).length > 1 ? "未找到匹配用户" : "请输入关键词搜索"),
-                    1
-                    /* TEXT */
-                  )
-                ])) : (openBlock(true), createElementBlock(
-                  Fragment,
-                  { key: 1 },
-                  renderList(unref(searchResults), (user) => {
-                    return openBlock(), createElementBlock("div", {
-                      class: "user-option",
-                      key: user.id,
-                      onMousedown: withModifiers(($event) => addUser(user), ["prevent"])
-                    }, [
-                      createElementVNode(
-                        "span",
-                        null,
-                        toDisplayString(user.name),
-                        1
-                        /* TEXT */
-                      ),
-                      user.tenantId !== __props.tenantId && user.tenantId && __props.tenants[user.tenantId] ? (openBlock(), createElementBlock(
-                        "span",
-                        _hoisted_6$1,
-                        "@" + toDisplayString(__props.tenants[user.tenantId]),
-                        1
-                        /* TEXT */
-                      )) : createCommentVNode("v-if", true)
-                    ], 40, _hoisted_5$1);
-                  }),
-                  128
-                  /* KEYED_FRAGMENT */
-                ))
-              ]),
-              _: 1
-              /* STABLE */
-            }, 8, ["loading"])
-          ]),
-          _: 1
-          /* STABLE */
-        }, 8, ["is-show", "width"])
+          loading: unref(searchLoading),
+          options: options.value,
+          "search-query": unref(searchQuery),
+          "tenant-id": __props.tenantId,
+          tenants: __props.tenants,
+          "user-group": __props.userGroup,
+          "user-group-name": __props.userGroupName,
+          onSelectUser: addUser
+        }, null, 8, ["container-width", "is-show", "loading", "options", "search-query", "tenant-id", "tenants", "user-group", "user-group-name"])
       ])), [
         [unref(clickoutside), handleClickOutside]
       ]);
     };
   }
 });
-const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-50540b99"]]);
-const _withScopeId = (n) => (pushScopeId("data-v-308925e9"), n = n(), popScopeId(), n);
+const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-a09f11c3"]]);
+const _withScopeId = (n) => (pushScopeId("data-v-8b8dd0fd"), n = n(), popScopeId(), n);
 const _hoisted_1$1 = { class: "input-container" };
 const _hoisted_2 = {
   key: 0,
@@ -3598,15 +3811,6 @@ const _hoisted_3 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElem
   /* HOISTED */
 ));
 const _hoisted_4 = ["placeholder"];
-const _hoisted_5 = {
-  key: 0,
-  class: "no-data"
-};
-const _hoisted_6 = ["onMousedown"];
-const _hoisted_7 = {
-  key: 0,
-  class: "tenant-name"
-};
 const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   ...{
     name: "BkUserSelectorSingle"
@@ -3614,12 +3818,14 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   __name: "single-selector",
   props: {
     modelValue: {},
-    placeholder: {},
+    tenants: {},
     apiBaseUrl: {},
     tenantId: {},
-    tenants: {},
+    placeholder: {},
     currentUserId: {},
-    exactSearchKey: {}
+    exactSearchKey: {},
+    userGroup: {},
+    userGroupName: {}
   },
   emits: ["update:modelValue", "change"],
   setup(__props, { emit: __emit }) {
@@ -3633,7 +3839,15 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     const searchQuery = ref("");
     const showDropdown = ref(false);
     const selectedUserInfo = computed(() => {
-      return options.value.find((user) => user.id === selectedUser.value);
+      const userGroup = (props.userGroup || []).map((group) => ({
+        id: group.id,
+        name: group.name,
+        tenantId: ""
+      }));
+      const list = [...options.value, ...userGroup];
+      const selectedUserInfo2 = list.find((user) => user.id === selectedUser.value);
+      emit("change", selectedUserInfo2 || null);
+      return selectedUserInfo2;
     });
     onBeforeMount(async () => {
       if (typeof props.modelValue === "string" && props.modelValue) {
@@ -3657,7 +3871,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
         const formattedResults = formatUsers(result);
         if (formattedResults.length > 0) {
           options.value = formattedResults;
-          selectUser(formattedResults[0]);
+          addUser(formattedResults[0]);
         }
       } catch (error) {
         console.error("获取当前用户信息失败:", error);
@@ -3671,7 +3885,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
       isLoading.value = true;
       try {
         const result = await searchUsers(props.apiBaseUrl, props.tenantId, keyword);
-        options.value = formatUsers(result);
+        options.value = formatUsers(result).filter((user) => !selectedUser.value || user.id !== selectedUser.value);
         console.log("options.value", options.value);
       } catch (error) {
         console.error("获取用户列表失败:", error);
@@ -3680,7 +3894,8 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
         isLoading.value = false;
       }
     };
-    const selectUser = (user) => {
+    const addUser = (user) => {
+      console.log("addUser", user);
       selectedUser.value = user.id;
       searchQuery.value = "";
       showDropdown.value = false;
@@ -3690,7 +3905,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
       searchQuery.value = "";
     };
     const handleInputFocus = () => {
-      if (searchQuery.value.length >= 2) {
+      if (searchQuery.value.length >= 2 || Array.isArray(props.userGroup) && props.userGroup.length > 0) {
         showDropdown.value = true;
       }
     };
@@ -3703,12 +3918,10 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
       showDropdown.value = false;
     };
     watch(selectedUser, (newVal) => {
+      console.log("selectedUser", newVal);
       emit("update:modelValue", newVal);
-      const selectedUserInfo2 = options.value.find((user) => user.id === newVal);
-      emit("change", selectedUserInfo2 || null);
     });
     return (_ctx, _cache) => {
-      var _a;
       return withDirectives((openBlock(), createElementBlock("div", {
         ref_key: "containerRef",
         ref: containerRef,
@@ -3750,87 +3963,32 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
             [vModelText, searchQuery.value]
           ]),
           createCommentVNode(' "我"标签 '),
-          _ctx.currentUserId ? (openBlock(), createElementBlock(
-            "div",
-            {
-              key: 1,
-              class: normalizeClass(["me-tag", { disabled: _ctx.currentUserId && ((_a = selectedUserInfo.value) == null ? void 0 : _a[_ctx.exactSearchKey]) === _ctx.currentUserId }]),
-              onClick: _cache[1] || (_cache[1] = ($event) => addCurrentUser())
-            },
-            " 我 ",
-            2
-            /* CLASS */
-          )) : createCommentVNode("v-if", true)
+          createVNode(MeTag, {
+            "is-disabled": !!_ctx.currentUserId && !!selectedUserInfo.value && selectedUserInfo.value[_ctx.exactSearchKey || "bk_username"] === _ctx.currentUserId,
+            "current-user-id": _ctx.currentUserId,
+            onClick: addCurrentUser
+          }, null, 8, ["is-disabled", "current-user-id"])
         ]),
-        createCommentVNode(" 下拉选项列表 "),
-        createVNode(unref(Popover), {
-          "ext-cls": "bk-user-selector-popover",
-          arrow: false,
+        createCommentVNode(" 使用新的公共下拉选项组件 "),
+        createVNode(SelectionPopover, {
+          "container-width": containerRef.value ? containerRef.value.offsetWidth : "auto",
           "is-show": showDropdown.value,
-          width: containerRef.value ? containerRef.value.offsetWidth : "auto",
-          placement: "bottom-start",
-          theme: "light",
-          trigger: "manual"
-        }, {
-          content: withCtx(() => [
-            createVNode(unref(Loading), {
-              class: "dropdown-content",
-              loading: isLoading.value,
-              size: "mini",
-              mode: "spin"
-            }, {
-              default: withCtx(() => [
-                options.value.length === 0 ? (openBlock(), createElementBlock("div", _hoisted_5, [
-                  createElementVNode(
-                    "span",
-                    null,
-                    toDisplayString(searchQuery.value.length > 1 ? "未找到匹配用户" : "请输入关键词搜索"),
-                    1
-                    /* TEXT */
-                  )
-                ])) : (openBlock(true), createElementBlock(
-                  Fragment,
-                  { key: 1 },
-                  renderList(options.value, (user) => {
-                    return openBlock(), createElementBlock("div", {
-                      class: "user-option",
-                      key: user.id,
-                      onMousedown: withModifiers(($event) => selectUser(user), ["prevent"])
-                    }, [
-                      createElementVNode(
-                        "span",
-                        null,
-                        toDisplayString(user.name),
-                        1
-                        /* TEXT */
-                      ),
-                      user.tenantId !== _ctx.tenantId && user.tenantId && _ctx.tenants[user.tenantId] ? (openBlock(), createElementBlock(
-                        "span",
-                        _hoisted_7,
-                        "@" + toDisplayString(_ctx.tenants[user.tenantId]),
-                        1
-                        /* TEXT */
-                      )) : createCommentVNode("v-if", true)
-                    ], 40, _hoisted_6);
-                  }),
-                  128
-                  /* KEYED_FRAGMENT */
-                ))
-              ]),
-              _: 1
-              /* STABLE */
-            }, 8, ["loading"])
-          ]),
-          _: 1
-          /* STABLE */
-        }, 8, ["is-show", "width"])
+          loading: isLoading.value,
+          options: options.value,
+          "search-query": searchQuery.value,
+          "tenant-id": _ctx.tenantId,
+          tenants: _ctx.tenants,
+          "user-group": _ctx.userGroup,
+          "user-group-name": _ctx.userGroupName,
+          onSelectUser: addUser
+        }, null, 8, ["container-width", "is-show", "loading", "options", "search-query", "tenant-id", "tenants", "user-group", "user-group-name"])
       ])), [
         [unref(clickoutside), handleClickOutside]
       ]);
     };
   }
 });
-const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-308925e9"]]);
+const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-8b8dd0fd"]]);
 const _hoisted_1 = { class: "bk-user-selector" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{
@@ -3838,14 +3996,16 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   __name: "user-selector",
   props: {
-    apiBaseUrl: { default: "" },
-    tenantId: { default: "" },
-    placeholder: { default: "请输入人员名称搜索" },
     modelValue: { default: "" },
     draggable: { type: Boolean, default: false },
     multiple: { type: Boolean, default: false },
+    apiBaseUrl: { default: "" },
+    tenantId: { default: "" },
+    placeholder: { default: "请输入人员名称搜索" },
     currentUserId: { default: "" },
-    exactSearchKey: { default: "" }
+    exactSearchKey: { default: "bk_username" },
+    userGroup: { default: () => [] },
+    userGroupName: { default: "用户群组" }
   },
   emits: ["update:modelValue", "change"],
   setup(__props, { emit: __emit }) {
@@ -3905,8 +4065,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           placeholder: _ctx.placeholder,
           "tenant-id": _ctx.tenantId,
           tenants: unref(tenants),
+          "user-group": _ctx.userGroup,
+          "user-group-name": _ctx.userGroupName,
           onChange: handleUpdateUser
-        }, null, 8, ["modelValue", "api-base-url", "current-user-id", "exact-search-key", "placeholder", "tenant-id", "tenants"])) : (openBlock(), createElementBlock(
+        }, null, 8, ["modelValue", "api-base-url", "current-user-id", "exact-search-key", "placeholder", "tenant-id", "tenants", "user-group", "user-group-name"])) : (openBlock(), createElementBlock(
           Fragment,
           { key: 1 },
           [
@@ -3922,8 +4084,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               "selected-users": selectedUsers.value,
               "tenant-id": _ctx.tenantId,
               tenants: unref(tenants),
+              "user-group": _ctx.userGroup,
+              "user-group-name": _ctx.userGroupName,
               "onUpdate:selectedUsers": handleUpdateSelectedUsers
-            }, null, 8, ["modelValue", "api-base-url", "current-user-id", "draggable", "exact-search-key", "placeholder", "selected-users", "tenant-id", "tenants"])
+            }, null, 8, ["modelValue", "api-base-url", "current-user-id", "draggable", "exact-search-key", "placeholder", "selected-users", "tenant-id", "tenants", "user-group", "user-group-name"])
           ],
           2112
           /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
@@ -3932,7 +4096,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const BkUserSelector = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-fe084750"]]);
+const BkUserSelector = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-bc7b4ccd"]]);
 export {
   BkUserSelector,
   BkUserSelector as default