<script setup lang="ts">
import { ref, onMounted } from "vue";
import ActionTable from "./components/action-table.vue";
import { useUserStoreHook } from "/@/store/modules/user";
import EditModal from "./components/edit-dialog.vue";

const actionTableRef = ref<InstanceType<typeof ActionTable>>(null);
const modelRef = ref<InstanceType<typeof EditModal>>(null);
const powers = ref([]);
//新建/编辑/查看
function handleAddChangeCheck(item: any, id: string, type: string) {
  modelRef.value.show(item, id, type);
}

function handleReload({ data }) {
  const { pid } = data || {};
  Number(pid) === 0
    ? actionTableRef.value.onSearch()
    : actionTableRef.value.reloadTree(pid);
}

onMounted(() => {
  powers.value = useUserStoreHook().getMenuActions("menuOperator");
  if (powers.value.some(i => i == "3")) {
    actionTableRef.value.onSearch();
  }
});
</script>

<template>
  <div class="main">
    <PagePower :isShow="powers.some(i => i == '3')">
      <ActionTable
        :powers="powers"
        showOverflowTooltip
        ref="actionTableRef"
        @edit="handleAddChangeCheck"
        @view="handleAddChangeCheck"
        @create="handleAddChangeCheck"
      />
      <edit-modal ref="modelRef" @reload="handleReload" />
    </PagePower>
  </div>
</template>
