@blueking/bk-user-selector 0.0.29-beta.8 → 0.0.30

package/README.md

@@ -124,24 +124,25 @@ export default {
 
 ### 属性
 
-| 参数                 | 说明                                                                    | 类型                           | 默认值             |
-| -------------------- | ----------------------------------------------------------------------- | ------------------------------ | ------------------ |
-| modelValue / v-model | 绑定值，单选为字符串，多选为数组                                        | String / Array                 | '' / []            |
-| apiBaseUrl           | API 基础 URL                                                            | String                         | ''                 |
-| tenantId             | 租户 ID                                                                 | String                         | ''                 |
-| label                | 文本标签                                                                | String                         | 人员选择           |
-| placeholder          | 占位文本                                                                | String                         | 请输入人员名称搜索 |
-| multiple             | 是否多选                                                                | Boolean                        | false              |
-| draggable            | 是否可拖拽（仅多选模式有效）                                            | Boolean                        | false              |
-| exactSearchKey       | 精确查找key,可选值为 bk_username、login_name、full_name, 多个以逗号分隔 | String                         | bk_username        |
-| currentUserId        | 当前用户ID（用于快速选择"我"）                                          | String                         | ''                 |
-| userGroup            | 用户组列表，用于在下拉列表中显示用户组                                  | Array                          | []                 |
-| userGroupName        | 用户组名称，用于在下拉列表中显示用户组名称                              | String                         | 用户群组           |
-| emptyText            | 无匹配人员时的提示文本                                                  | String                         | 无匹配人员         |
-| disabled             | 是否禁用                                                                | Boolean                        | false              |
-| renderTag            | 渲染标签                                                                | Function(h, userInfo) => VNode | -                  |
-| renderListItem       | 渲染列表项                                                              | Function(h, userInfo) => VNode | -                  |
-| excludeUserIds       | 排除的用户ID列表                                                        | Array                          | []                 |
+| 参数                  | 说明                                                                    | 类型                           | 默认值             |
+| --------------------- | ----------------------------------------------------------------------- | ------------------------------ | ------------------ |
+| modelValue / v-model  | 绑定值，单选为字符串，多选为数组                                        | String / Array                 | '' / []            |
+| apiBaseUrl            | API 基础 URL                                                            | String                         | ''                 |
+| tenantId              | 租户 ID                                                                 | String                         | ''                 |
+| label                 | 文本标签                                                                | String                         | 人员选择           |
+| placeholder           | 占位文本                                                                | String                         | 请输入人员名称搜索 |
+| multiple              | 是否多选                                                                | Boolean                        | false              |
+| draggable             | 是否可拖拽（仅多选模式有效）                                            | Boolean                        | false              |
+| exactSearchKey        | 精确查找key,可选值为 bk_username、login_name、full_name, 多个以逗号分隔 | String                         | bk_username        |
+| currentUserId         | 当前用户ID（用于快速选择"我"）                                          | String                         | ''                 |
+| userGroup             | 用户组列表，用于在下拉列表中显示用户组                                  | Array                          | []                 |
+| userGroupName         | 用户组名称，用于在下拉列表中显示用户组名称                              | String                         | 用户群组           |
+| emptyText             | 无匹配人员时的提示文本                                                  | String                         | 无匹配人员         |
+| disabled              | 是否禁用                                                                | Boolean                        | false              |
+| renderTag             | 渲染标签                                                                | Function(h, userInfo) => VNode | -                  |
+| renderListItem        | 渲染列表项                                                              | Function(h, userInfo) => VNode | -                  |
+| excludeUserIds        | 排除的用户ID列表                                                        | Array                          | []                 |
+| enableMultiTenantMode | 是否启用多租户模式，关闭后则使用原有用户管理接口查询                    | Boolean                        | true               |
 
 ### 事件
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blueking/bk-user-selector",
-  "version": "0.0.29-beta.8",
+  "version": "0.0.30",
   "description": "蓝鲸用户选择器",
   "license": "MIT",
   "author": "Tencent BlueKing",

package/typings/hooks/use-i18n.d.ts

@@ -0,0 +1,5 @@
+declare const _default: () => {
+    local: "en-US" | "zh-CN";
+    t: (path: string, variable?: any) => any;
+};
+export default _default;

package/typings/locale/en-us.d.ts

@@ -0,0 +1,7 @@
+declare const _default: {
+    我: string;
+    请输入人员名称搜索: string;
+    用户群组: string;
+    无匹配人员: string;
+};
+export default _default;

package/typings/locale/zh-cn.d.ts

@@ -0,0 +1,7 @@
+declare const _default: {
+    我: string;
+    请输入人员名称搜索: string;
+    用户群组: string;
+    无匹配人员: string;
+};
+export default _default;

package/vue2/index.es.min.js

@@ -1,5 +1,5 @@
 import * as __WEBPACK_EXTERNAL_MODULE_vue__ from "@blueking/bkui-library";
-import { unref, ref, onBeforeMount, defineComponent, createElementBlock, createCommentVNode, openBlock, withModifiers, normalizeClass, h as h$1, computed, createBlock, withCtx, renderSlot, createVNode, createElementVNode, toDisplayString, Fragment, renderList, watch, nextTick, onMounted, withDirectives, isRef, vModelText, createTextVNode, createApp } from "@blueking/bkui-library";
+import { unref, ref, onBeforeMount, defineComponent, createElementBlock, createCommentVNode, openBlock, withModifiers, normalizeClass, toDisplayString, h as h$1, computed, createBlock, withCtx, renderSlot, createVNode, createElementVNode, Fragment, renderList, watch, nextTick, onMounted, withDirectives, isRef, vModelText, createTextVNode, createApp } from "@blueking/bkui-library";
 var top = "top";
 var bottom = "bottom";
 var right = "right";
@@ -11529,7 +11529,7 @@ const lookupUsers = async (params) => {
     }).catch(() => {
       return [];
     });
-    return userList;
+    return users.map((user) => userList.find((u2) => u2.username === user)).filter(Boolean);
   }
   if (users.length === 0 || !apiBaseUrl || !tenantId) {
     console.warn("批量查找用户需要提供有效的apiBaseUrl、租户ID和至少一个用户名");
@@ -11584,6 +11584,163 @@ const getUserList = async (url, params) => {
   });
   return (data2 == null ? void 0 : data2.results) || [];
 };
+/*! js-cookie v3.0.5 | MIT */
+function assign(target) {
+  for (var i2 = 1; i2 < arguments.length; i2++) {
+    var source = arguments[i2];
+    for (var key in source) {
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
+var defaultConverter = {
+  read: function(value) {
+    if (value[0] === '"') {
+      value = value.slice(1, -1);
+    }
+    return value.replace(/(%[\dA-F]{2})+/gi, decodeURIComponent);
+  },
+  write: function(value) {
+    return encodeURIComponent(value).replace(
+      /%(2[346BF]|3[AC-F]|40|5[BDE]|60|7[BCD])/g,
+      decodeURIComponent
+    );
+  }
+};
+function init(converter, defaultAttributes) {
+  function set(name, value, attributes) {
+    if (typeof document === "undefined") {
+      return;
+    }
+    attributes = assign({}, defaultAttributes, attributes);
+    if (typeof attributes.expires === "number") {
+      attributes.expires = new Date(Date.now() + attributes.expires * 864e5);
+    }
+    if (attributes.expires) {
+      attributes.expires = attributes.expires.toUTCString();
+    }
+    name = encodeURIComponent(name).replace(/%(2[346B]|5E|60|7C)/g, decodeURIComponent).replace(/[()]/g, escape);
+    var stringifiedAttributes = "";
+    for (var attributeName in attributes) {
+      if (!attributes[attributeName]) {
+        continue;
+      }
+      stringifiedAttributes += "; " + attributeName;
+      if (attributes[attributeName] === true) {
+        continue;
+      }
+      stringifiedAttributes += "=" + attributes[attributeName].split(";")[0];
+    }
+    return document.cookie = name + "=" + converter.write(value, name) + stringifiedAttributes;
+  }
+  function get(name) {
+    if (typeof document === "undefined" || arguments.length && !name) {
+      return;
+    }
+    var cookies = document.cookie ? document.cookie.split("; ") : [];
+    var jar = {};
+    for (var i2 = 0; i2 < cookies.length; i2++) {
+      var parts = cookies[i2].split("=");
+      var value = parts.slice(1).join("=");
+      try {
+        var found = decodeURIComponent(parts[0]);
+        jar[found] = converter.read(value, found);
+        if (name === found) {
+          break;
+        }
+      } catch (e) {
+      }
+    }
+    return name ? jar[name] : jar;
+  }
+  return Object.create(
+    {
+      set,
+      get,
+      remove: function(name, attributes) {
+        set(
+          name,
+          "",
+          assign({}, attributes, {
+            expires: -1
+          })
+        );
+      },
+      withAttributes: function(attributes) {
+        return init(this.converter, assign({}, this.attributes, attributes));
+      },
+      withConverter: function(converter2) {
+        return init(assign({}, this.converter, converter2), this.attributes);
+      }
+    },
+    {
+      attributes: { value: Object.freeze(defaultAttributes) },
+      converter: { value: Object.freeze(converter) }
+    }
+  );
+}
+var api = init(defaultConverter, { path: "/" });
+const enUS = {
+  我: "Me",
+  请输入人员名称搜索: "Please enter the name of the user to search",
+  用户群组: "User Group",
+  无匹配人员: "No matching users"
+};
+const zhCN = {
+  我: "我",
+  请输入人员名称搜索: "请输入人员名称搜索",
+  用户群组: "用户群组",
+  无匹配人员: "无匹配人员"
+};
+const BLUEKINNG_LANGUAGE = "blueking_language";
+const languageMap = {
+  "en-US": enUS,
+  "zh-CN": zhCN
+};
+const getPath = (obj, path, variables) => {
+  const pathStack = /^\w/.test(path) ? path.split(".") : [path];
+  const { length } = pathStack;
+  let target = obj;
+  let i2 = 0;
+  while (i2 <= length && target) {
+    if (typeof target === "string") {
+      return target;
+    }
+    if (variables) {
+      target = target[pathStack[i2]];
+      Object.keys(variables).forEach((key) => {
+        target = target.replace(`{${key}}`, variables[key]);
+      });
+    } else {
+      target = target[pathStack[i2]];
+    }
+    i2 = i2 + 1;
+    if (!target) {
+      return target;
+    }
+  }
+  return target;
+};
+const useI18n = () => {
+  let localeLanguage = "zh-CN";
+  const bluekingLanguage = api.get(BLUEKINNG_LANGUAGE);
+  if (bluekingLanguage && bluekingLanguage.toLowerCase() === "en") {
+    localeLanguage = "en-US";
+  }
+  const languagePackage = languageMap[localeLanguage];
+  const t2 = (path, variable) => {
+    const value = getPath(languagePackage, path, variable);
+    if (value === void 0) {
+      console.warn(`缺少索引 * ${path} *`);
+    }
+    return value;
+  };
+  return {
+    local: localeLanguage,
+    t: t2
+  };
+};
 const useTenantData = (apiBaseUrl, tenantId, enableMultiTenantMode = true) => {
   const tenants = ref({});
   const loading2 = ref(false);
@@ -14490,6 +14647,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
   },
   emits: ["click"],
   setup(__props, { emit: __emit }) {
+    const { t: t2 } = useI18n();
     const props2 = __props;
     const emit = __emit;
     const handleClick = () => {
@@ -14504,9 +14662,9 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
           class: normalizeClass(["me-tag", { disabled: __props.isDisabled }]),
           onClick: withModifiers(handleClick, ["stop"])
         },
-        " 我 ",
-        2
-        /* CLASS */
+        toDisplayString(unref(t2)("我")),
+        3
+        /* TEXT, CLASS */
       )) : createCommentVNode("v-if", true);
     };
   }
@@ -14518,7 +14676,7 @@ const _export_sfc = (sfc, props2) => {
   }
   return target;
 };
-const MeTag = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-9ccd9029"]]);
+const MeTag = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-ce388fae"]]);
 const UserRender = defineComponent({
   name: "UserRender",
   props: {
@@ -14646,14 +14804,14 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
      */
     userGroupName: {
       type: String,
-      default: "用户群组"
+      default: ""
     },
     /**
      * 无匹配人员时的提示文本
      */
     emptyText: {
       type: String,
-      default: "无匹配人员"
+      default: ""
     },
     /**
      * 渲染列表项
@@ -14792,7 +14950,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const SelectionPopover = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-6380faf5"]]);
+const SelectionPopover = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-61e98a47"]]);
 const _sfc_main$3 = /* @__PURE__ */ defineComponent({
   ...{
     name: "UserTag"
@@ -14854,12 +15012,12 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     tenants: { default: () => ({}) },
     apiBaseUrl: { default: "" },
     tenantId: { default: "" },
-    placeholder: { default: "请输入人员名称搜索" },
+    placeholder: { default: "" },
     currentUserId: { default: "" },
     exactSearchKey: { default: "bk_username" },
     userGroup: { default: () => [] },
-    userGroupName: { default: "用户群组" },
-    emptyText: { default: "无匹配人员" },
+    userGroupName: { default: "" },
+    emptyText: { default: "" },
     disabled: { type: Boolean },
     renderListItem: {},
     renderTag: {},
@@ -14894,7 +15052,14 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
       return searchResults.value.filter((user) => !props2.selectedUsers.some((selectedUser) => selectedUser.id === user.id)).filter((user) => !props2.excludeUserIds.includes(user.id));
     });
     const userGroupFilter = computed(() => {
-      return props2.userGroup.filter((group) => !props2.selectedUsers.some((user) => user.id === group.id) && !group.hidden);
+      return props2.userGroup.filter((group) => {
+        var _a, _b;
+        const filtered = !props2.selectedUsers.some((user) => user.id === group.id) && !group.hidden;
+        if (filtered) {
+          return ((_a = group.id) == null ? void 0 : _a.includes(searchQuery.value)) || ((_b = group.name) == null ? void 0 : _b.includes(searchQuery.value));
+        }
+        return false;
+      });
     });
     const initSortable = () => {
       if (!props2.draggable || !sortableContainerRef.value) return;
@@ -15350,7 +15515,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-bbacd5b7"]]);
+const MultipleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-1c358144"]]);
 const _hoisted_1 = { class: "input-container" };
 const _hoisted_2 = ["placeholder"];
 const _sfc_main$1 = /* @__PURE__ */ defineComponent({
@@ -15363,12 +15528,12 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     tenants: {},
     apiBaseUrl: { default: "" },
     tenantId: { default: "" },
-    placeholder: { default: "请输入人员名称搜索" },
+    placeholder: { default: "" },
     currentUserId: { default: "" },
     exactSearchKey: { default: "bk_username" },
     userGroup: { default: () => [] },
-    userGroupName: { default: "用户群组" },
-    emptyText: { default: "无匹配人员" },
+    userGroupName: { default: "" },
+    emptyText: { default: "" },
     disabled: { type: Boolean },
     renderListItem: {},
     renderTag: {},
@@ -15387,7 +15552,14 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     const searchQuery = ref("");
     const showDropdown = ref(false);
     const userGroupFilter = computed(() => {
-      return props2.userGroup.filter((group) => group.id !== selectedUser.value && !group.hidden);
+      return props2.userGroup.filter((group) => {
+        var _a, _b;
+        const filtered = group.id !== selectedUser.value && !group.hidden;
+        if (filtered) {
+          return ((_a = group.id) == null ? void 0 : _a.includes(searchQuery.value)) || ((_b = group.name) == null ? void 0 : _b.includes(searchQuery.value));
+        }
+        return false;
+      });
     });
     const selectedUserInfo = computed(() => {
       const userGroup = (props2.userGroup || []).map((group) => ({
@@ -15575,7 +15747,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-48822637"]]);
+const SingleSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-7080eb2b"]]);
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{
     name: "BkUserSelector"
@@ -15587,12 +15759,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     multiple: { type: Boolean, default: false },
     apiBaseUrl: { default: "" },
     tenantId: { default: "" },
-    placeholder: { default: "请输入人员名称搜索" },
+    placeholder: { default: "" },
     currentUserId: { default: "" },
     exactSearchKey: { default: "bk_username" },
     userGroup: { default: () => [] },
-    userGroupName: { default: "用户群组" },
-    emptyText: { default: "无匹配人员" },
+    userGroupName: { default: "" },
+    emptyText: { default: "" },
     disabled: { type: Boolean, default: false },
     renderListItem: {},
     renderTag: {},
@@ -15601,6 +15773,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   emits: ["update:modelValue", "change"],
   setup(__props, { emit: __emit }) {
+    const { t: t2 } = useI18n();
     __webpack_exports__provideGlobalConfig({
       prefix: "bk-user-selector"
     });
@@ -15612,6 +15785,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const selectedUserIds = computed(() => {
       return props2.multiple ? selectedUsers.value.map((user) => user.id) : [];
     });
+    const placeholder = computed(() => props2.placeholder || t2("请输入人员名称搜索"));
+    const userGroupName = computed(() => props2.userGroupName || t2("用户群组"));
+    const emptyText = computed(() => props2.emptyText || t2("无匹配人员"));
     const initSelectedUsers = async () => {
       if (props2.multiple) {
         const ids = Array.isArray(props2.modelValue) ? props2.modelValue : [];
@@ -15633,7 +15809,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               usersList: ids,
               enableMultiTenantMode: props2.enableMultiTenantMode
             });
-            selectedUsers.value = [...selected, ...formatUsers(result, props2.enableMultiTenantMode)];
+            const selectedList = [...selected, ...formatUsers(result, props2.enableMultiTenantMode)];
+            selectedUsers.value = ids.map((id) => selectedList.find((user) => user.id === id)).filter(Boolean);
           } catch (error3) {
             console.error("获取选中用户信息失败:", error3);
           }
@@ -15691,17 +15868,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             "api-base-url": _ctx.apiBaseUrl,
             "current-user-id": _ctx.currentUserId,
             disabled: _ctx.disabled,
-            "empty-text": _ctx.emptyText,
+            "empty-text": emptyText.value,
             "enable-multi-tenant-mode": _ctx.enableMultiTenantMode,
             "exact-search-key": _ctx.exactSearchKey,
             "exclude-user-ids": _ctx.excludeUserIds,
-            placeholder: _ctx.placeholder,
+            placeholder: placeholder.value,
             "render-list-item": _ctx.renderListItem,
             "render-tag": _ctx.renderTag,
             "tenant-id": _ctx.tenantId,
             tenants: unref(tenants),
             "user-group": _ctx.userGroup,
-            "user-group-name": _ctx.userGroupName,
+            "user-group-name": userGroupName.value,
             onChange: handleUpdateUser
           }, null, 8, ["modelValue", "api-base-url", "current-user-id", "disabled", "empty-text", "enable-multi-tenant-mode", "exact-search-key", "exclude-user-ids", "placeholder", "render-list-item", "render-tag", "tenant-id", "tenants", "user-group", "user-group-name"])) : (openBlock(), createElementBlock(
             Fragment,
@@ -15715,18 +15892,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 "current-user-id": _ctx.currentUserId,
                 disabled: _ctx.disabled,
                 draggable: _ctx.draggable,
-                "empty-text": _ctx.emptyText,
+                "empty-text": emptyText.value,
                 "enable-multi-tenant-mode": _ctx.enableMultiTenantMode,
                 "exact-search-key": _ctx.exactSearchKey,
                 "exclude-user-ids": _ctx.excludeUserIds,
-                placeholder: _ctx.placeholder,
+                placeholder: placeholder.value,
                 "render-list-item": _ctx.renderListItem,
                 "render-tag": _ctx.renderTag,
                 "selected-users": selectedUsers.value,
                 "tenant-id": _ctx.tenantId,
                 tenants: unref(tenants),
                 "user-group": _ctx.userGroup,
-                "user-group-name": _ctx.userGroupName,
+                "user-group-name": userGroupName.value,
                 "onUpdate:selectedUsers": handleUpdateSelectedUsers
               }, null, 8, ["modelValue", "api-base-url", "current-user-id", "disabled", "draggable", "empty-text", "enable-multi-tenant-mode", "exact-search-key", "exclude-user-ids", "placeholder", "render-list-item", "render-tag", "selected-users", "tenant-id", "tenants", "user-group", "user-group-name"])
             ],
@@ -15740,7 +15917,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const BkUserSelector = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-7ce51f9c"]]);
+const BkUserSelector = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c4574ead"]]);
 const vue2 = {
   model: {
     prop: "modelValue",