Add project files.

SysApp/wwwroot/js/libs/js-ATab.js

@@ -0,0 +1,68 @@
+import AAnimation from '/js/libs/js-AAnimation.js'
+export default class ATab extends window.AObject {
+    constructor(tabs, content, type = true) {
+        super();
+        this.selTab = null;
+        this.lockTabs = Array.from([]);
+        this.tabContents = content;
+        this.setAnimation("Slide");
+        this.ctabs = Array.from(this.tabContents.children);
+        this.aAnimation = new AAnimation();
+        this.aAnimation.setType(this.typeAnimation, { "parent": this.tabContents });
+        this.type = type;
+        if (type) {
+            this.tabs = tabs.querySelectorAll(".item");
+            this.tabs.forEach((e, i) => {
+                if (e.classList.contains("active")) {
+                    //   this.ctabs[i].classList.add("show");
+                    this.selectedTab(i);
+                }
+
+                this.ctabs[i].classList.add("fade");
+                e.addEventListener("click", this.eventTabClick.bind(this, e, i));
+            });
+
+        } else {
+            this.selectedTab(0);
+            this.ctabs.forEach((el) => { el.classList.add("fade"); });
+        }
+    }
+    setAnimation(type) {
+        this.typeAnimation = type;
+    }
+    eventTabClick(e, num) {
+        if (e.hasAttribute("disabled") || e.classList.contains("active")) {
+            return;
+        }
+        this.selectedTab(num);
+    }
+    selectedTab(id) {
+        if (this.selTab != null) {
+            if (this.lockTabs.length > 0) {
+                if (this.lockTabs.includes(this.selTab)) {
+                    this.disableTab(this.selTab);
+                }
+            }
+            if (this.type) this.tabs[this.selTab].classList.remove("active");
+            this.aAnimation.element = this.ctabs[this.selTab];
+
+            this.aAnimation.once("endAnimation", ((ev) => { this.setTab(id); }).bind(this));
+            this.aAnimation.animation();
+        } else {
+            this.setTab(id);
+        }
+    }
+    setTab(id) {
+        this.aAnimation.element = this.ctabs[id];
+        this.aAnimation.animation();
+        this.aAnimation.once("endAnimation", ((ev) => { this.trigger("changed", { "tabIndex": id }) }).bind(this));
+        if (this.type) this.tabs[id].classList.add("active");
+        this.selTab = id;
+    }
+    enableTab(id) {
+        this.tabs[id].removeAttribute("disabled");
+    }
+    disableTab(id) {
+        this.tabs[id].setAttribute("disabled", "");
+    }
+}