<script setup>
import Forge from "@/components/forge/Forge.vue";
import DashboardForgeOptionButton from "@/views/dashboard/components/DashboardForgeOptionButton.vue";
import { getDashboardInit } from "@/apis/dashboard";
import { onMounted, ref, provide, watch } from "vue";
import ProductSettingBtn from "./components/ProducSettingBtn.vue";

const initialData = ref(null);
// const forgeData = ref([]);
const init = async () => {
  const res = await getDashboardInit("PS");
  initialData.value = res.data;
};

onMounted(() => {
  init();
});

// const openModal = (type) => {
//   production_setting_modal.showModal();
// };

provide("productSetting_items", {
  initialData,
  // forgeData,
  // openModal,
});
</script>

<template>
  <div class="flex justify-between my-10">
    <ProductSettingBtn />
    <DashboardForgeOptionButton :initialData="initialData" />
    <Forge
      :fullScreen="true"
      :cubeStyle="{ right: 5, top: 5 }"
      :initialData="initialData"
    />
  </div>
</template>

<style lang="css" scoped>
.border-dashboard {
  @apply border border-light-info bg-dark-info bg-opacity-70 p-3  first:mt-0 last:mb-0;
}
</style>
