<script setup lang="ts">
import { nextTick, ref, watch } from "vue";
import { useUserInfo } from "/@/hooks/core/useUser";
import NormalUser from "./normal-user.vue";
import SuperAdmin from "./super-admin.vue";

const props = defineProps<{
  notInitial?: Boolean
  disabled?: Boolean;
}>()

const SuperAdminRef = ref<InstanceType<typeof SuperAdmin> | null>(null);
const NormalUserRef = ref<InstanceType<typeof NormalUser> | null>(null);

const { isSuperUser } = useUserInfo();
const emit = defineEmits(["change", "update:modelValue"]);

function handleChange(value) {
  emit("update:modelValue", value);
  nextTick(() => emit("change", value));
}

watch(
  () => isSuperUser.value,
  () => {
    nextTick(() => {
      if (props.notInitial) return
      isSuperUser.value ? SuperAdminRef.value?.intialData() : NormalUserRef.value?.intialData();
    });
  },
  {
    immediate: true
  }
);

defineExpose({
  initialData(value: string) {
    isSuperUser.value ? SuperAdminRef.value?.intialData(value) : NormalUserRef.value?.intialData(value);
   }
})
</script>

<template>
  <div class="business-permission" style="width: 100%">
    <template v-if="isSuperUser">
      <super-admin :disabled="disabled" @change="handleChange" ref="SuperAdminRef" />
    </template>
    <template v-else>
      <normal-user :disabled="disabled" @change="handleChange" ref="NormalUserRef" />
    </template>
  </div>
</template>
