import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, unref, createElementVNode, createVNode, toDisplayString, createBlock, createCommentVNode, Fragment, renderList } from "vue";
import Avatar from "../../common/Avatar.vue.mjs";
import { useBasicStore } from "../../../stores/basic.mjs";
import { useRoomStore } from "../../../stores/room.mjs";
import { storeToRefs } from "pinia";
import SvgIcon from "../../common/base/SvgIcon.vue.mjs";
import VideoOpenIcon from "../../common/icons/VideoOpenIcon.vue.mjs";
import VideoCloseIcon from "../../common/icons/VideoCloseIcon.vue.mjs";
import AudioOpenIcon from "../../common/icons/AudioOpenIcon.vue.mjs";
import AudioCloseIcon from "../../common/icons/AudioCloseIcon.vue.mjs";
import ScreenOpenIcon from "../../common/icons/ScreenOpenIcon.vue.mjs";
import ApplyActiveIcon from "../../common/icons/ApplyActiveIcon.vue.mjs";
import { useI18n } from "../../../locales/index.mjs";
import { isMobile } from "../../../utils/environment.mjs";
import UserIcon from "../../common/icons/UserIcon.vue.mjs";
import { TUIRole } from "@tencentcloud/tuiroom-engine-js";
import "../../../services/main.mjs";
import { roomService } from "../../../services/roomService.mjs";
import "mitt";
import "../../../services/manager/roomActionManager.mjs";
import "@tencentcloud/tui-core";
const _hoisted_1 = { class: "user-name" };
const _hoisted_2 = { class: "role-info" };
const _hoisted_3 = {
  key: 0,
  class: "member-av-state"
};
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "MemberInfo",
  props: {
    userInfo: {},
    showStateIcon: { type: Boolean }
  },
  setup(__props) {
    const { t } = useI18n();
    const props = __props;
    const basicStore = useBasicStore();
    const roomStore = useRoomStore();
    const { isMaster, isSpeakAfterTakingSeatMode } = storeToRefs(roomStore);
    const isMe = computed(() => basicStore.userId === props.userInfo.userId);
    const isTargetUserRoomOwner = computed(
      () => props.userInfo.userRole === TUIRole.kRoomOwner
    );
    const isTargetUserAdmin = computed(
      () => props.userInfo.userRole === TUIRole.kAdministrator
    );
    const extraInfo = computed(() => {
      if (isMaster.value && isMe.value) {
        return `${t("Host")}, ${t("Me")}`;
      }
      if (isTargetUserRoomOwner.value) {
        return t("Host");
      }
      if (isTargetUserAdmin.value && isMe.value) {
        return `${t("Admin")}, ${t("Me")}`;
      }
      if (isTargetUserAdmin.value) {
        return t("Admin");
      }
      if (isMe.value) {
        return t("Me");
      }
      return "";
    });
    const isAudienceRole = computed(
      () => isSpeakAfterTakingSeatMode.value && !props.userInfo.onSeat
    );
    const iconList = computed(() => {
      const list = [];
      if (props.userInfo.hasScreenStream) {
        list.push({ icon: ScreenOpenIcon });
      }
      if (!isAudienceRole.value) {
        list.push({
          icon: props.userInfo.hasAudioStream ? AudioOpenIcon : AudioCloseIcon
        });
        list.push({
          icon: props.userInfo.hasVideoStream ? VideoOpenIcon : VideoCloseIcon
        });
      }
      if (isAudienceRole.value && !props.userInfo.isUserApplyingToAnchor) {
        list.push({ icon: AudioCloseIcon, disable: true });
        list.push({ icon: VideoCloseIcon, disable: true });
      }
      if (isAudienceRole.value && props.userInfo.isUserApplyingToAnchor) {
        list.push({ icon: ApplyActiveIcon, size: 20 });
      }
      return list;
    });
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", {
        class: normalizeClass([unref(isMobile) ? "member-info-mobile" : "member-info"])
      }, [
        createElementVNode("div", {
          class: normalizeClass(
            !_ctx.showStateIcon && isTargetUserAdmin.value ? "member-basic-info-admin" : "member-basic-info"
          )
        }, [
          createVNode(Avatar, {
            class: "avatar-url",
            "img-src": _ctx.userInfo.avatarUrl
          }, null, 8, ["img-src"]),
          createElementVNode("div", _hoisted_1, toDisplayString(unref(roomService).getDisplayName(_ctx.userInfo)), 1),
          createElementVNode("div", _hoisted_2, [
            isTargetUserRoomOwner.value || isTargetUserAdmin.value ? (openBlock(), createBlock(SvgIcon, {
              key: 0,
              icon: UserIcon,
              color: isTargetUserAdmin.value ? "#F06C4B" : "#4791FF",
              class: normalizeClass(isTargetUserAdmin.value ? "admin-icon" : "master-icon")
            }, null, 8, ["color", "class"])) : createCommentVNode("", true),
            createElementVNode("div", {
              class: normalizeClass(`user-extra-info ${isTargetUserAdmin.value ? "user-extra-info-admin" : ""}`)
            }, toDisplayString(extraInfo.value), 3)
          ])
        ], 2),
        _ctx.showStateIcon ? (openBlock(), createElementBlock("div", _hoisted_3, [
          (openBlock(true), createElementBlock(Fragment, null, renderList(iconList.value, (item, index) => {
            return openBlock(), createBlock(SvgIcon, {
              key: index,
              icon: item.icon,
              class: normalizeClass(["state-icon", { "disable-icon": item.disable }]),
              size: item.size
            }, null, 8, ["icon", "class", "size"]);
          }), 128))
        ])) : createCommentVNode("", true)
      ], 2);
    };
  }
});
export {
  _sfc_main as default
};
