Center Tabs Creation

CenterTabs.js

Ext.define("AlliBilli.view.main.center.Center", {
  extend: "Ext.tab.Panel",
  requires: ["Ext.ux.TabReorderer"],
  xtype: "reorderable-tabs",
  region: "center",
  activeTab: 0,
  width: "100%",
  header: false,

  plugins: {
    tabreorderer: true,
  },

  defaults: {
    bodyPadding: 10,
    scrollable: true,
    closable: true,
  },

  items: [
    {
      title: "Think Special",
      iconCls: 'fas fa-cat',
      html:
        "The tabs in this example are reorderable. Drag any tab to change the order.",
      reorderable: false,
      closable: false
    },
    {
      title: "Shout At Me",
      reorderable: false,
      iconCls: 'far fa-clock',
      
      closable: false
    },
    {
      title: "Tab 3",
      
    },
    {
      title: "Non Reorderable",
      html: "I can't be moved",
      reorderable: true
    },
    {
      title: "Tab 4",
      reorderable: true
    },
  ],

  dockedItems: {
    dock: "bottom",
    xtype: "toolbar",
    items: [
      {
        text: "Add a Tab",
        glyph: 43,
        listeners: {
          click: "onAddTabClick",
        },
      },
    ],
  },
});