boke-devops 0.0.30 → 0.0.38

package/packages/boke-devops-vue/src/{AegisUser → UserAvatar}/user-avatar.vue

@@ -1,49 +1,56 @@
 <template>
-  <div style="display:inline-flex">
-    <ATag class="boke-useravator-wrapper" :class="{
-      'wrapper-only-name': props.onlyName,
-      is_tag: props.tag && !props.color,
-      is_highlight: isHigh(),
-      disabled: props.disabled,
-      'only-icon-style': props.onlyIcon
-    }" v-bind="attrs" :style="{ padding: '2px', paddingRight: '12px', borderRadius: '50px' }" v-if="data"
-      :color="props.color || 'default'" :title="data?.[DEPT_KEY]">
-      <div class="left-icon" ref="targetRef" @mouseenter="onShowPopover()" @mousemove="onShowPopover()"
-        @mouseleave="onClosePopover()">
-        <AAvatar v-if="!props.onlyName" :src="user_icon" :class="'avator-icon'" :size="props.size">
-        </AAvatar>
-        <span v-else>
-          <span v-if="props.linkType == 'text'">
-            {{ user_name }}
+  <a-popover placement="bottomLeft" v-model:open="popoverVisible" :arrow="false" :mouseEnterDelay="0.1"
+    :mouseLeaveDelay="0.3" transitionName="ant-zoom-big"
+    :trigger="props.disabledPopover || props.disabled || global_disabled_avatar_card ? 'contextmenu' : 'hover'"
+    :overlayStyle="{ zIndex: '9999', }">
+    <template #content>
+      <userAvatarCard :userinfo="{ user_name, dept_name, user_id, user_icon }" @pinCard="popoverVisible = true">
+      </userAvatarCard>
+    </template>
+    <div style="display:inline-flex" ref="avatarRef">
+      <ATag class="boke-useravator-wrapper" :class="{
+        'wrapper-only-name': props.onlyName,
+        is_tag: props.tag && !props.color,
+        is_highlight: isHigh(),
+        disabled: props.disabled,
+        'only-icon-style': props.onlyIcon
+      }" :style="{ padding: '2px', paddingRight: '12px', borderRadius: '50px' }" v-bind="attrs"  v-if="data"
+        :color="props.color || 'default'" :title="data?.[DEPT_KEY]">
+        <div class="left-icon" ref="targetRef">
+          <AAvatar v-if="!props.onlyName" :src="user_icon" :class="'avator-icon'" :size="props.size"></AAvatar>
+          <span v-else>
+            <span v-if="props.linkType == 'text'">
+              {{ user_name }}
+            </span>
+            <el-link v-else :type="props.linkType" :underline="false">
+              {{ user_name }}
+            </el-link>
           </span>
-          <el-link v-else :type="props.linkType" :underline="false">
-            {{ user_name }}
-          </el-link>
-        </span>
-      </div>
-      <slot name="prefix"></slot>
-      <div class="label" v-if="!props.onlyIcon && !props.onlyName">
-        <span class="realname">
-          {{
-      isLoading
-        ? "加载中..."
-        : user_name
-    }}
-        </span>
-        <span class="id" v-if="!props.noID">
-          <span>{{ dept_name }}</span>
-        </span>
-      </div>
-      <div v-if="props.suffix">{{ props.suffix }}</div>
-      <AButton size="small" v-if="props.closable" @click.stop.prevent="onClose" :color="props.color" type="text"
-        shape="circle" style="margin-left: 3px; transform: translateY(0) scale(0.6); opacity: 0.8">
-        <template #icon>
-          <CloseOutlined />
-        </template>
-      </AButton>
-      <slot name="default" :scoped="data"></slot>
-    </ATag>
-  </div>
+        </div>
+        <slot name="prefix"></slot>
+        <div class="label" v-if="!props.onlyIcon && !props.onlyName">
+          <span class="realname">
+            {{
+              isLoading
+                ? "加载中..."
+                : user_name
+            }}
+          </span>
+          <span class="id" v-if="!props.noID">
+            <span>{{ dept_name }}</span>
+          </span>
+        </div>
+        <div v-if="props.suffix">{{ props.suffix }}</div>
+        <AButton size="small" v-if="props.closable" @click.stop.prevent="onClose" :color="props.color" type="text"
+          shape="circle" style="margin-left: 3px; transform: translateY(0) scale(0.6); opacity: 0.8">
+          <template #icon>
+            <CloseOutlined />
+          </template>
+        </AButton>
+        <slot name="default" :scoped="data"></slot>
+      </ATag>
+    </div>
+  </a-popover>
 </template>
 
 <script lang="jsx">
@@ -53,10 +60,11 @@ import {
   defineEmits,
   computed,
 } from "vue";
-import { Avatar as AAvatar, Button as AButton, Tag as ATag } from "ant-design-vue/es"
-import { useCustomProps } from "./store"
+import { Avatar as AAvatar, Button as AButton, Tag as ATag, Popover as APopover, BadgeRibbon as ABadgeRibbon } from "ant-design-vue/es"
+import { useCustomProps } from "./avatar.store"
 import { isFunction } from "lodash-es"
-import {CloseOutlined} from "@ant-design/icons-vue"
+import { CloseOutlined } from "@ant-design/icons-vue"
+import userAvatarCard from "./user-avatar-card.vue";
 
 export default defineComponent({
   inheritAttrs: false,
@@ -65,7 +73,10 @@ export default defineComponent({
     'AAvatar': AAvatar,
     "AButton": AButton,
     "ATag": ATag,
-    CloseOutlined
+    CloseOutlined,
+    APopover,
+    userAvatarCard,
+    'ABadgeRibbon': ABadgeRibbon
   },
   props: {
     size: {
@@ -88,6 +99,11 @@ export default defineComponent({
       required: false,
       default: false
     },
+    noID: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
     linkType: {
       type: null,
       required: false,
@@ -103,17 +119,7 @@ export default defineComponent({
       required: false,
       default: "circle"
     },
-    insidePopover: {
-      type: Boolean,
-      required: false,
-      default: false
-    },
-    noID: {
-      type: Boolean,
-      required: false,
-      default: false
-    },
-    noDialogDetail: {
+    disabledPopover: {
       type: Boolean,
       required: false,
       default: false
@@ -151,14 +157,11 @@ export default defineComponent({
   },
   emits: ['close'],
   setup(props, { attrs, emit }) {
-    const { NAME_KEY, AVATAR_KEY, DEPT_KEY, USERID_KEY, global_always_avatar_is_hihglight } = useCustomProps()
+    const { NAME_KEY, AVATAR_KEY, DEPT_KEY, USERID_KEY, global_always_avatar_is_hihglight, global_disabled_avatar_card } = useCustomProps()
     const appVersion = "1.0.0";
-    console.log(emit,"emits")
     const targetRef = ref();
-    const onShowPopover = () => { };
     const showViewer = ref(false);
 
-    const onClosePopover = () => { };
     const isMyself = ref(false);
 
     const user_name = computed(() => {
@@ -172,7 +175,7 @@ export default defineComponent({
     const user_id = computed(() => {
       return props.data[USERID_KEY.value] || "未知用户";
     });
-    const data = ref<any>(props.data);
+    const data = ref(props.data);
     const user_icon = ref(props.data[AVATAR_KEY.value]);
     const isLoading = ref(false);
 
@@ -183,9 +186,15 @@ export default defineComponent({
       return isFunction(props.is_highlight) ? props?.is_highlight(data.value) : props.is_highlight
     }
 
-    const onClose= ()=> {
+    const onClose = () => {
       emit("close")
     }
+    const avatarRef = ref()
+    const getPopupContainer = () => {
+      console.log(avatarRef.value, "targetRef.value")
+      return avatarRef.value
+    }
+    const popoverVisible = ref(false)
     return {
       user_name,
       dept_name,
@@ -195,11 +204,13 @@ export default defineComponent({
       isLoading,
       isHigh,
       props,
-      onShowPopover,
-      onClosePopover,
       attrs,
       emit,
-      onClose
+      onClose,
+      global_disabled_avatar_card,
+      targetRef,
+      avatarRef,
+      popoverVisible
     }
   }
 })

package/packages/boke-devops-vue/src/{AegisUser → UserSelect}/multiple-user-select.vue

@@ -19,7 +19,8 @@
     v-bind="$attrs"
   >
     <template #tagRender="{ label, closable, onClose, option }">
-      <userAvatar
+      <slot name="tagRender" v-bind="{label, closable, onClose, option}">
+        <BokeUserAvatar
         v-if="option?.data"
         :data="option?.data"
         :size="18"
@@ -31,8 +32,10 @@
         :closable="closable"
         @close="onClose"
         :customProps="$attrs.customProps"
+        v-bind="props.tagRenderProps"
       >
-      </userAvatar>
+      </BokeUserAvatar>
+      </slot>
     </template>
     <template #placeholder>
       <div
@@ -86,33 +89,30 @@ import {
 
 import {find as _find} from "lodash-es";
 import { Select as ASelect, Avatar as AAvatar} from "ant-design-vue/es";
-import userAvatar from "./user-avatar.vue";
+import {BokeUserAvatar, avatarStore} from "./../index";
 import { UserOutlined } from "@ant-design/icons-vue";
 
-import {useCustomProps} from "./store"
 import { onErrorCaptured } from "vue";
+const {useCustomProps} = avatarStore;
 
 const props = defineProps([
   "modelValue",
   "options",
   "disabled",
-  "userSource",
   "optionDisabledProp",
   "hideValues",
   "placeholder",
   "maxTagCount",
+  "tagRenderProps"
 ]);
 
+const emits = defineEmits(["update:modelValue", "blur", "focus", "change"]);
+
 const  {NAME_KEY, AVATAR_KEY, DEPT_KEY,USERID_KEY } =useCustomProps()
 
-const emits = defineEmits(["update:modelValue", "blur", "focus", "change"]);
-// userSelectOptionsAll
-const projUserTreeOptions = computed(
-  () => null
-);
 const innerdata = ref(null);
 const options = computed(() => {
-  const target = props.options || projUserTreeOptions.value;
+  const target = props.options ;
   return target
     ?.map((item) => {
       item.disabled = props.optionDisabledProp
@@ -124,17 +124,15 @@ const options = computed(() => {
       return !props.hideValues?.includes(user.value);
     });
 });
+
 const onNodeClick = (e) => {
-  const target = _find(projUserTreeOptions.value, (item: any) => item.value == e);
+  const target = _find(options.value, (item: any) => item.value == e);
   emits("change", target);
   emits("update:modelValue", e);
   nextTick(() => {
     innerdata.value = e;
   });
 };
-const onFocus = () => {
-  // userCenter.refreshUserCenter()
-};
 
 const onFilterOption = (inputValue, option) => {
   const description = option.label
@@ -143,13 +141,6 @@ const onFilterOption = (inputValue, option) => {
   return option.label.toLowerCase().includes(inputValue.toLowerCase());
 };
 
-watch(
-  props.userSource,
-  (val) => {
-    innerdata.value = props.modelValue;
-  },
-  { immediate: true }
-);
 onUpdated(() => {
   innerdata.value = props.modelValue;
 });

package/packages/boke-devops-vue/src/index.ts

@@ -1,39 +1,39 @@
 
-import BokeUserAvatar from './AegisUser/user-avatar.vue'
-import BokeUserAvatarGroup from './AegisUser/user-avatar-group.vue'
-
+import BokeUserAvatar from './UserAvatar/user-avatar.vue'
+import BokeUserAvatarGroup from './UserAvatar/user-avatar-group.vue'
 import BokeProvider from './Provider/Provider.vue'
-import BokeUserSelect from './AegisUser/multiple-user-select.vue'
-import { Tag as BokeTag } from "ant-design-vue/es"
-import { Button as BokeButton } from "ant-design-vue/es"
-import { Segmented as BokeSegmented } from "ant-design-vue/es"
-import BokeMicroAppProvider from "./Microapp/MicroAppProvider.vue"
-import "./style/variables.less"
-
+import BokeUserSelect from './UserSelect/multiple-user-select.vue'
+import { Tag as BokeTag } from 'ant-design-vue/es'
+import { Button as BokeButton } from 'ant-design-vue/es'
+import { Segmented as BokeSegmented } from 'ant-design-vue/es'
+import BokeMicroAppProvider from './Microapp/MicroAppProvider.vue'
+// 导入样式变量
+import './style.global.less'
+// STORE
+export * as avatarStore from './UserAvatar/avatar.store'
+// 支持ESM导出,可以直接在VUE项目中导入使用.
 export {
   BokeUserAvatar,
   BokeProvider,
   BokeUserSelect,
-  BokeTag,
-  BokeButton,
   BokeUserAvatarGroup,
   BokeMicroAppProvider,
+  BokeTag,
+  BokeButton,
+  BokeSegmented
 }
-
+// 支持到VUE的全局安装
 export default {
-  install(app: any, customOptions = {
-  }) {
- 
+  install(app: any) {
     app.component('boke-provider', BokeProvider);
     app.component('boke-micro-app-provider', BokeMicroAppProvider);
 
     app.component('boke-user-avatar', BokeUserAvatar);
     app.component('boke-user-avatar-group', BokeUserAvatarGroup);
-    app.component("boke-user-select", BokeUserSelect);
-    
-    app.component("boke-tag", BokeTag);
-    app.component("boke-button", BokeButton);
-    app.component("boke-segmented", BokeSegmented);
-    
+    app.component('boke-user-select', BokeUserSelect);
+
+    app.component('boke-tag', BokeTag);
+    app.component('boke-button', BokeButton);
+    app.component('boke-segmented', BokeSegmented);
   },
 }

package/packages/boke-devops-vue/src/utils/encode.ts

@@ -0,0 +1,132 @@
+var hexcase = 0; /* 十六进制输出格式。0 -小写；1 -大写 */
+var b64pad = ""; /* base- 64填充字符。“=”表示严格的RFC合规性 */
+var chrsz = 8; /* 每个输入字符的位数。8 - ASCII；16 -统一码 */
+export function hex_sha1(s) {
+    return binb2hex(core_sha1(str2binb(s), s.length * chrsz));
+}
+
+function b64_sha1(s) {
+    return binb2b64(core_sha1(str2binb(s), s.length * chrsz));
+}
+
+function str_sha1(s) {
+    return binb2str(core_sha1(str2binb(s), s.length * chrsz));
+}
+
+function hex_hmac_sha1(key, data) {
+    return binb2hex(core_hmac_sha1(key, data));
+}
+
+function b64_hmac_sha1(key, data) {
+    return binb2b64(core_hmac_sha1(key, data));
+}
+
+function str_hmac_sha1(key, data) {
+    return binb2str(core_hmac_sha1(key, data));
+}
+function sha1_vm_test() {
+    return hex_sha1("abc") == "a9993e364706816aba3e25717850c26c9cd0d89d";
+}
+function core_sha1(x, len) {
+    x[len >> 5] |= 0x80 << (24 - len % 32);
+    x[((len + 64 >> 9) << 4) + 15] = len;
+
+    var w = Array(80);
+    var a = 1732584193;
+    var b = -271733879;
+    var c = -1732584194;
+    var d = 271733878;
+    var e = -1009589776;
+
+    for (var i = 0; i < x.length; i += 16) {
+        var olda = a;
+        var oldb = b;
+        var oldc = c;
+        var oldd = d;
+        var olde = e;
+
+        for (var j = 0; j < 80; j++) {
+            if (j < 16) w[j] = x[i + j];
+            else w[j] = rol(w[j - 3] ^ w[j - 8] ^ w[j - 14] ^ w[j - 16], 1);
+            var t = safe_add(safe_add(rol(a, 5), sha1_ft(j, b, c, d)), safe_add(safe_add(e, w[j]), sha1_kt(j)));
+            e = d;
+            d = c;
+            c = rol(b, 30);
+            b = a;
+            a = t;
+        }
+
+        a = safe_add(a, olda);
+        b = safe_add(b, oldb);
+        c = safe_add(c, oldc);
+        d = safe_add(d, oldd);
+        e = safe_add(e, olde);
+    }
+    return Array(a, b, c, d, e);
+
+}
+function sha1_ft(t, b, c, d) {
+    if (t < 20) return (b & c) | ((~b) & d);
+    if (t < 40) return b ^ c ^ d;
+    if (t < 60) return (b & c) | (b & d) | (c & d);
+    return b ^ c ^ d;
+}
+function sha1_kt(t) {
+    return (t < 20) ? 1518500249 : (t < 40) ? 1859775393 : (t < 60) ? -1894007588 : -899497514;
+}
+function core_hmac_sha1(key, data) {
+    var bkey = str2binb(key);
+    if (bkey.length > 16) bkey = core_sha1(bkey, key.length * chrsz);
+
+    var ipad = Array(16),
+        opad = Array(16);
+    for (var i = 0; i < 16; i++) {
+        ipad[i] = bkey[i] ^ 0x36363636;
+        opad[i] = bkey[i] ^ 0x5C5C5C5C;
+    }
+
+    var hash = core_sha1(ipad.concat(str2binb(data)), 512 + data.length * chrsz);
+    return core_sha1(opad.concat(hash), 512 + 160);
+}
+function safe_add(x, y) {
+    var lsw = (x & 0xFFFF) + (y & 0xFFFF);
+    var msw = (x >> 16) + (y >> 16) + (lsw >> 16);
+    return (msw << 16) | (lsw & 0xFFFF);
+}
+function rol(num, cnt) {
+    return (num << cnt) | (num >>> (32 - cnt));
+}
+function str2binb(str) {
+    var bin = Array();
+    var mask = (1 << chrsz) - 1;
+    for (var i = 0; i < str.length * chrsz; i += chrsz)
+        bin[i >> 5] |= (str.charCodeAt(i / chrsz) & mask) << (24 - i % 32);
+    return bin;
+}
+function binb2str(bin) {
+    var str = "";
+    var mask = (1 << chrsz) - 1;
+    for (var i = 0; i < bin.length * 32; i += chrsz)
+        str += String.fromCharCode((bin[i >> 5] >>> (24 - i % 32)) & mask);
+    return str;
+}
+function binb2hex(binarray) {
+    var hex_tab = hexcase ? "0123456789ABCDEF" : "0123456789abcdef";
+    var str = "";
+    for (var i = 0; i < binarray.length * 4; i++) {
+        str += hex_tab.charAt((binarray[i >> 2] >> ((3 - i % 4) * 8 + 4)) & 0xF) + hex_tab.charAt((binarray[i >> 2] >> ((3 - i % 4) * 8)) & 0xF);
+    }
+    return str;
+}
+function binb2b64(binarray) {
+    var tab = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
+    var str = "";
+    for (var i = 0; i < binarray.length * 4; i += 3) {
+        var triplet = (((binarray[i >> 2] >> 8 * (3 - i % 4)) & 0xFF) << 16) | (((binarray[i + 1 >> 2] >> 8 * (3 - (i + 1) % 4)) & 0xFF) << 8) | ((binarray[i + 2 >> 2] >> 8 * (3 - (i + 2) % 4)) & 0xFF);
+        for (var j = 0; j < 4; j++) {
+            if (i * 8 + j * 6 > binarray.length * 32) str += b64pad;
+            else str += tab.charAt((triplet >> 6 * (3 - j)) & 0x3F);
+        }
+    }
+    return str;
+}

package/packages/boke-devops-vue/types/Provider/store.d.ts

@@ -5,6 +5,10 @@ export declare const globalConfig: {
         user_avatar: string;
         user_id: string;
     };
+    avatarCard: {
+        api_url: string;
+        enabled: boolean;
+    };
 };
 export declare const globalState: {
     global_always_avatar_is_hihglight: null;

package/packages/boke-devops-vue/types/UserAvatar/avatar.store.d.ts

@@ -0,0 +1,9 @@
+export declare const useCustomProps: () => {
+    NAME_KEY: import("vue").Ref<any>;
+    AVATAR_KEY: import("vue").Ref<any>;
+    DEPT_KEY: import("vue").Ref<any>;
+    USERID_KEY: import("vue").Ref<any>;
+    global_always_avatar_is_hihglight: any;
+    global_disabled_avatar_card: boolean;
+    AVATAR_CARD_URL: any;
+};

package/packages/boke-devops-vue/types/UserAvatar/encode.d.ts

@@ -0,0 +1 @@
+export declare function hex_sha1(s: any): string;

package/packages/boke-devops-vue/types/UserAvatar/user-avatar-card.vue.d.ts

@@ -0,0 +1,24 @@
+declare const _default: import("vue").DefineComponent<Readonly<{
+    userinfo?: any;
+}>, any, {
+    showViewer: boolean;
+    spacer: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }>;
+    isDark: boolean;
+    extraInfo: null;
+    seeAllProjects: boolean;
+    seeAllRoles: boolean;
+}, {
+    projectslist(): any;
+    projectslistCount(): any;
+    extraInfogroups(): any;
+    extraInfogroupsCount(): any;
+}, {
+    onChat(account: any): void;
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<Readonly<{
+    userinfo?: any;
+}>>>, {
+    readonly userinfo?: any;
+}, {}>;
+export default _default;

package/packages/boke-devops-vue/types/UserAvatar/user-avatar-group.vue.d.ts

@@ -0,0 +1,44 @@
+declare const _default: {
+    new (...args: any[]): import("vue").CreateComponentPublicInstance<Readonly<import("vue").ExtractPropTypes<{}>>, {
+        $props: {
+            readonly size?: string | undefined;
+            readonly data?: unknown[] | undefined;
+            readonly placeholder?: string | undefined;
+            readonly tag?: boolean | undefined;
+            readonly is_highlight?: Function | undefined;
+            readonly showText?: boolean | undefined;
+            readonly max?: number | undefined;
+        };
+    }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & Readonly<import("vue").ExtractPropTypes<{}>>, {}, true, {}, {}, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import("vue").ExtractPropTypes<{}>>, {
+        $props: {
+            readonly size?: string | undefined;
+            readonly data?: unknown[] | undefined;
+            readonly placeholder?: string | undefined;
+            readonly tag?: boolean | undefined;
+            readonly is_highlight?: Function | undefined;
+            readonly showText?: boolean | undefined;
+            readonly max?: number | undefined;
+        };
+    }, {}, {}, {}, {}>;
+    __isFragment?: undefined;
+    __isTeleport?: undefined;
+    __isSuspense?: undefined;
+} & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{}>>, {
+    $props: {
+        readonly size?: string | undefined;
+        readonly data?: unknown[] | undefined;
+        readonly placeholder?: string | undefined;
+        readonly tag?: boolean | undefined;
+        readonly is_highlight?: Function | undefined;
+        readonly showText?: boolean | undefined;
+        readonly max?: number | undefined;
+    };
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {}, {}, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps;
+export default _default;