import { defineComponent, ref, watch, openBlock, createBlock, unref, withCtx, createElementVNode, createVNode, createTextVNode, toDisplayString } from "vue";
import { storeToRefs } from "pinia";
import "../../services/main.mjs";
import { roomService } from "../../services/roomService.mjs";
import { EventType } from "../../services/types.mjs";
import { useI18n } from "../../locales/index.mjs";
import "@tencentcloud/tuiroom-engine-js";
import "mitt";
import "../../services/manager/roomActionManager.mjs";
import "@tencentcloud/tui-core";
import Dialog from "../common/base/Dialog/index.mjs";
import TuiButton from "../common/base/Button.vue.mjs";
import Input from "../common/base/Input/index.mjs";
import CloseInputIcon from "../common/icons/CloseInputIcon.vue.mjs";
import { isDigitsOnly } from "../../utils/utils.mjs";
import renderMsg from "../common/base/Message/Message.mjs";
import { MESSAGE_DURATION } from "../../constants/message.mjs";
import { useBasicStore } from "../../stores/basic.mjs";
import { PASSWORD_MAX_LENGTH_LIMIT } from "../../constants/room.mjs";
import SvgIcon from "../common/base/SvgIcon.vue.mjs";
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "PasswordDialog",
  props: {
    visible: { type: Boolean }
  },
  setup(__props) {
    const basicStore = useBasicStore();
    const { roomId } = storeToRefs(basicStore);
    const { t } = useI18n();
    const inputPassword = ref("");
    const props = __props;
    const isShowPasswordContainer = ref(false);
    watch(
      () => props.visible,
      (val) => {
        isShowPasswordContainer.value = val;
      },
      {
        immediate: true
      }
    );
    async function joinRoom() {
      if (!isDigitsOnly(inputPassword.value) || inputPassword.value.length < PASSWORD_MAX_LENGTH_LIMIT) {
        renderMsg({
          type: "warning",
          message: t("Your room password format is incorrect, please check it"),
          duration: MESSAGE_DURATION.NORMAL
        });
        return;
      }
      await roomService.join(roomId.value, {
        isOpenCamera: false,
        isOpenMicrophone: true,
        password: inputPassword.value
      });
      roomService.emit(EventType.ROOM_JOIN);
    }
    function cancelInputPassword() {
      inputPassword.value = "";
      roomService.emit(EventType.ROOM_ERROR);
    }
    return (_ctx, _cache) => {
      return openBlock(), createBlock(unref(Dialog), {
        modelValue: isShowPasswordContainer.value,
        "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => isShowPasswordContainer.value = $event),
        title: unref(t)("The room is encrypted"),
        modal: true,
        "show-close": false,
        "close-on-click-modal": false,
        width: "420px",
        "append-to-body": true,
        "confirm-button": unref(t)("Join"),
        "cancel-button": unref(t)("Cancel"),
        onConfirm: joinRoom,
        onCancel: cancelInputPassword
      }, {
        footer: withCtx(() => [
          createElementVNode("span", null, [
            createVNode(TuiButton, {
              class: "button",
              size: "default",
              disabled: inputPassword.value.length === 0,
              onClick: joinRoom
            }, {
              default: withCtx(() => [
                createTextVNode(toDisplayString(unref(t)("Join")), 1)
              ]),
              _: 1
            }, 8, ["disabled"]),
            createVNode(TuiButton, {
              class: "button",
              size: "default",
              type: "primary",
              onClick: cancelInputPassword
            }, {
              default: withCtx(() => [
                createTextVNode(toDisplayString(unref(t)("Cancel")), 1)
              ]),
              _: 1
            })
          ])
        ]),
        default: withCtx(() => [
          createVNode(unref(Input), {
            "model-value": inputPassword.value,
            onInput: _cache[1] || (_cache[1] = ($event) => inputPassword.value = $event),
            placeholder: unref(t)("Please enter your room password"),
            type: "password",
            maxlength: "6"
          }, {
            suffixIcon: withCtx(() => [
              createVNode(SvgIcon, {
                class: "svg-icon",
                onClick: _cache[0] || (_cache[0] = ($event) => inputPassword.value = ""),
                icon: CloseInputIcon
              })
            ]),
            _: 1
          }, 8, ["model-value", "placeholder"])
        ]),
        _: 1
      }, 8, ["modelValue", "title", "confirm-button", "cancel-button"]);
    };
  }
});
export {
  _sfc_main as default
};
