@voicenter-team/voicenter-ui-plus 3.0.0 → 3.0.1

package/library/entity/components/Tabs/VcEntityEditableTabs.vue2.mjs

@@ -1,288 +0,0 @@
-import { defineComponent, ref, computed, watch, openBlock, createBlock, isRef, unref, withCtx, createElementBlock, Fragment, renderList, renderSlot, createCommentVNode } from "vue";
-import { LIST_TAB_QUERY_VALUE, CREATE_TAB_QUERY_VALUE } from "../../../enum/constants.mjs";
-import _sfc_main$1 from "../../../components/VcTabs/VcTabs.vue.mjs";
-import '../../../assets/components/VcTabs/VcTabPane.css';import '../../../assets/components/VcTabs/VcTabs.css';/* empty css                                      */
-import { useVModel } from "@vueuse/core";
-import { isEqual } from "lodash-es";
-import { useTabsEditableDataProvide } from "../../composable/useEntityTabsProvideInject.mjs";
-import _sfc_main$2 from "../../../components/VcTabs/VcTabPane.vue.mjs";
-/* empty css                                         */
-import { Plus, Pencil, List } from "@lucide/vue";
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "VcEntityEditableTabs",
-  props: {
-    entity: {},
-    entityMethodDataType: { default: void 0 },
-    hideCreateTab: { type: Boolean, default: false },
-    lazyLoad: { type: Boolean, default: false },
-    modelValue: { default: LIST_TAB_QUERY_VALUE },
-    queryTabName: { default: "" },
-    confirmClose: { type: Function, default: void 0 },
-    tabListIcon: { default: () => List },
-    tabEditIcon: { default: () => Pencil },
-    tabCreateIcon: { default: () => Plus }
-  },
-  emits: ["update:modelValue", "close-tab", "tab-change", "permission-error"],
-  setup(__props, { expose: __expose, emit: __emit }) {
-    const TAB_ICONS = {
-      list: List,
-      edit: Pencil,
-      add: Plus
-    };
-    const props = __props;
-    const emit = __emit;
-    const vcTabs = ref(null);
-    const editTabs = ref([]);
-    const activeTabModel = useVModel(
-      props,
-      "modelValue",
-      emit
-    );
-    const editableTabsData = ref({});
-    const dataTabs = computed(() => {
-      const listTab = {
-        name: LIST_TAB_QUERY_VALUE,
-        icon: props.tabListIcon ?? TAB_ICONS.list,
-        label: props.entity.entityTypeListLabelTranslations
-      };
-      const editTabsList = [
-        ...editTabs.value
-      ];
-      const tabs = [
-        listTab,
-        ...editTabsList
-      ];
-      if (!props.hideCreateTab) {
-        return [
-          ...tabs,
-          {
-            name: CREATE_TAB_QUERY_VALUE,
-            icon: props.tabCreateIcon ?? TAB_ICONS.add,
-            label: "",
-            navClass: "create-nav-tab",
-            disabled: !props.entity.canCreate()
-          }
-        ];
-      } else {
-        return tabs;
-      }
-    });
-    function isTabActive(tabName) {
-      return activeTabModel.value === tabName;
-    }
-    function setActiveTabByRouteQueryValue() {
-      const queryTabName = props.queryTabName;
-      if (typeof queryTabName !== "string") {
-        return;
-      }
-      const tabFromOpened = dataTabs.value.find(({ name }) => name === queryTabName);
-      if (tabFromOpened) {
-        if (queryTabName === CREATE_TAB_QUERY_VALUE && !props.entity.canCreate()) {
-          return;
-        }
-        activeTabModel.value = tabFromOpened.name;
-      } else {
-        try {
-          const parsedQueryTabName = parseInt(queryTabName);
-          if (isNaN(parsedQueryTabName)) return;
-          props.entity.info(parsedQueryTabName).then((res) => {
-            const _res = res;
-            if (!_res) {
-              return;
-            }
-            if (props.entity.canEdit(_res)) {
-              openEditTab(_res);
-            } else {
-              emit("permission-error", {
-                tabName: queryTabName,
-                response: _res
-              });
-            }
-          });
-        } catch {
-          console.error("Error while trying to load data for id:", queryTabName);
-        }
-      }
-    }
-    function onActiveTabChange(tabName) {
-      emit("tab-change", tabName);
-    }
-    function openEditTab(entityData) {
-      if (!entityData) {
-        return;
-      }
-      const entityName = props.entity.getEntityName(entityData) || "";
-      const tabName = createTabName(entityData);
-      if (!tabName) {
-        console.error("Cannot extract name from", entityData);
-        return;
-      }
-      const isTabOpened = dataTabs.value.find(({ name }) => name === tabName);
-      if (!isTabOpened) {
-        const newTab = {
-          entityData,
-          label: entityName,
-          name: tabName
-        };
-        editTabs.value.push(newTab);
-      }
-      activeTabModel.value = tabName;
-    }
-    function checkTabDataIsUpdated(tabName, entityTabData) {
-      const editableData = editableTabsData.value[+tabName];
-      let isEditable = false;
-      if (entityTabData && editableData) {
-        const _entityTabData = entityTabData;
-        Object.keys(_entityTabData).forEach((key) => {
-          const _key = key;
-          const _objectValue = _entityTabData[_key];
-          if (!Array.isArray(_objectValue)) {
-            if (typeof _objectValue === "object") {
-              if (!isEqual(_objectValue, _entityTabData[_key])) {
-                isEditable = true;
-              }
-            } else {
-              if (_objectValue !== _entityTabData[_key]) {
-                isEditable = true;
-              }
-            }
-          }
-        });
-      }
-      return isEditable;
-    }
-    function onTabRemove(tabName) {
-      const tabIndex = editTabs.value.findIndex(({ name }) => name === tabName);
-      const _entityTabData = editTabs.value[tabIndex].entityData;
-      const isUpdated = checkTabDataIsUpdated(tabName, _entityTabData);
-      if (isUpdated && props.confirmClose) {
-        props.confirmClose(_entityTabData).then((res) => {
-          if (res) {
-            removeTab(tabName);
-          }
-        });
-      } else {
-        removeTab(tabName);
-      }
-    }
-    function clearEditableData(tabName) {
-      if (editableTabsData.value[tabName]) {
-        delete editableTabsData.value[tabName];
-      }
-    }
-    function createTabName(entity) {
-      if (!entity) return void 0;
-      const entityId = props.entity.getEntityId(entity);
-      return entityId == null ? void 0 : entityId.toString();
-    }
-    function removeTab(tabName) {
-      const tabIndex = editTabs.value.findIndex(({ name }) => name === tabName);
-      if (tabIndex !== -1) {
-        if (isTabActive(tabName)) {
-          openListTab();
-        }
-        editTabs.value.splice(tabIndex, 1);
-        clearEditableData(tabName);
-      }
-      emit("close-tab", tabName);
-    }
-    function closeActiveTab() {
-      onTabRemove(activeTabModel.value);
-    }
-    function getTabIcon(tab) {
-      if (tab.name === CREATE_TAB_QUERY_VALUE || tab.name === LIST_TAB_QUERY_VALUE) {
-        return tab.icon;
-      }
-      return props.tabEditIcon ?? TAB_ICONS.edit;
-    }
-    function openListTab() {
-      activeTabModel.value = LIST_TAB_QUERY_VALUE;
-    }
-    function openCreateTab() {
-      activeTabModel.value = CREATE_TAB_QUERY_VALUE;
-    }
-    function setFirstActiveTab() {
-      var _a;
-      (_a = vcTabs.value) == null ? void 0 : _a.setFirstActiveTab();
-    }
-    function setLastActiveTab() {
-      var _a;
-      (_a = vcTabs.value) == null ? void 0 : _a.setLastActiveTab();
-    }
-    function togglePreviousTab() {
-      var _a;
-      (_a = vcTabs.value) == null ? void 0 : _a.togglePreviousTab();
-    }
-    function toggleNextTab() {
-      var _a;
-      (_a = vcTabs.value) == null ? void 0 : _a.toggleNextTab();
-    }
-    watch(activeTabModel, onActiveTabChange);
-    setActiveTabByRouteQueryValue();
-    useTabsEditableDataProvide({
-      editableModels: editableTabsData,
-      updateEditableModel: (data) => {
-        const _id = props.entity.getEntityId(data.value);
-        if (_id !== void 0) {
-          editableTabsData.value[_id] = data;
-        }
-      }
-    });
-    __expose({
-      createTabName,
-      removeTab,
-      closeActiveTab,
-      openEditTab,
-      openListTab,
-      openCreateTab,
-      setFirstActiveTab,
-      setLastActiveTab,
-      togglePreviousTab,
-      toggleNextTab,
-      getActiveTab: () => activeTabModel.value
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(_sfc_main$1, {
-        ref_key: "vcTabs",
-        ref: vcTabs,
-        modelValue: unref(activeTabModel),
-        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(activeTabModel) ? activeTabModel.value = $event : null),
-        class: "vc-editable-tabs",
-        "open-by-form-validate": false,
-        "nav-scrollable": "",
-        onTabRemove
-      }, {
-        default: withCtx(() => [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(dataTabs.value, (tabItem, index) => {
-            return openBlock(), createBlock(_sfc_main$2, {
-              key: tabItem.name || `edit-tab-${index + 1}`,
-              name: tabItem.name,
-              index,
-              label: tabItem.label,
-              closable: tabItem.name !== "list" && tabItem.name !== "create",
-              icon: getTabIcon(tabItem),
-              lazy: __props.lazyLoad,
-              disabled: tabItem.disabled,
-              "nav-class": tabItem.navClass,
-              class: "pt-3"
-            }, {
-              default: withCtx(() => [
-                tabItem.name === "list" ? renderSlot(_ctx.$slots, "tab-list", { key: 0 }, void 0, true) : tabItem.name === "create" ? renderSlot(_ctx.$slots, "tab-create", { key: 1 }, void 0, true) : tabItem.entityData ? renderSlot(_ctx.$slots, "tab-edit", {
-                  key: 2,
-                  index,
-                  tabData: tabItem,
-                  entity: tabItem.entityData
-                }, void 0, true) : createCommentVNode("", true)
-              ]),
-              _: 2
-            }, 1032, ["name", "index", "label", "closable", "icon", "lazy", "disabled", "nav-class"]);
-          }), 128))
-        ]),
-        _: 3
-      }, 8, ["modelValue"]);
-    };
-  }
-});
-export {
-  _sfc_main as default
-};