refactor(erp): 将文件上传字段从 fileUrl 改为 blobIds 并支持多附件上传

云

16 分钟以前 3f7a1f34aff16f12de093a9579201e518b0c309b

 src/views/im/home/components/group/group-member-item.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,84 @@
<script lang="ts" setup>
import type { GroupMemberLite } from './group-member.vue'

import { computed } from 'vue'

import { DICT_TYPE } from '#/packages/constants/src'
import { getDictLabel } from '#/packages/effects/hooks/src'

import { ImGroupMemberRole } from '../../../utils/constants'
import { UserAvatar } from '../user'

defineOptions({ name: 'ImGroupMemberItem' })

const props = withDefaults(
  defineProps<{
    active?: boolean
    height?: number
    member: GroupMemberLite
  }>(),
  {
    height: 50,
    active: false
  }
)

defineEmits<{
  click: [member: GroupMemberLite]
}>()

const avatarSize = computed(() => Math.ceil(props.height * 0.75))

/** è§’色标签文案：普通成员不显示，其余取 im_group_member_role å­—å…¸ label */
const roleLabel = computed(() => {
  if (props.member.role == null || props.member.role === ImGroupMemberRole.NORMAL) {
    return ''
  }
  return getDictLabel(DICT_TYPE.IM_GROUP_MEMBER_ROLE, props.member.role)
})

/** è§’色标签样式：群主用主色；管理员用次要色 */
const roleLabelClass = computed(() => {
  if (props.member.role === ImGroupMemberRole.OWNER) {
    return 'text-[var(--ant-color-primary)] bg-[var(--ant-color-primary-bg)]'
  }
  return 'text-[var(--ant-color-info)] bg-[var(--ant-color-fill)]'
})
</script>

<template>
  <!--
    ç¾¤æˆå‘˜è¡Œå½¢æ€
    - æ¨ªæŽ’、带 hover æ€ï¼›slot æ”¾ checkbox / æ“ä½œæŒ‰é’®ç­‰
    - ä¸Ž GroupMember çš„差别：带 hover æ€ + slot æ‰©å±•ç‚¹ï¼Œé€‚合 selector / admin åˆ—表
  -->
  <div
    class="relative flex gap-2.5 items-center mx-px px-4 box-border whitespace-nowrap rounded cursor-pointer transition-colors hover:bg-[var(--ant-color-fill)]"
    :class="{ '!bg-[#e1eaf7] dark:!bg-[var(--ant-color-primary-bg-hover)]': active }"
    :style="{ height: `${height }px` }"
    @click="$emit('click', member)"
  >
    <UserAvatar
      :id="member.userId"
      :url="member.avatar"
      :name="member.nickname"
      :size="avatarSize"
      :clickable="false"
    />
    <div
      class="flex-1 h-full pl-1 overflow-hidden text-sm truncate text-[var(--ant-color-text)]"
      :style="{ lineHeight: `${height }px` }"
    >
      {{ member.showName }}
    </div>
    <!-- è§’色标签：群主 / ç®¡ç†å‘˜ï¼›æ™®é€šæˆå‘˜ä¸æ˜¾ç¤ºã€‚仅在传入 member.role æ—¶ç”Ÿæ•ˆ -->
    <span
      v-if="roleLabel"
      class="px-1.5 py-px rounded text-xs whitespace-nowrap"
      :class="roleLabelClass"
    >
      {{ roleLabel }}
    </span>
    <slot></slot>
  </div>
</template>