import {Htape, WidgetType, Vtape, Left} from '@ui';
import LeftList from './left/left';
import linkSetModel from './link_set.model';
import Select from './select/select';
import Right from './right/right';
import {TAB_LINK_SET} from '@private/constants';
const className = 'dec.dcm.linkset';
const Widget: WidgetType = {
  _store() {
    return BI.Models.getModel(linkSetModel);
  },
  watch: {
    tab(tab: string) {
      this.setVisible(tab === TAB_LINK_SET);
    },
  },
  render() {
    return {
      type: Htape,
      cls: 'dcm-link-group',
      items: [{
        el: {
          type: Vtape,
          cls: 'dcm-link-left bi-border-right',
          items: [
            {
              el: {
                type: Left,
                cls: 'bi-border-bottom',
                items: [
                  {
                    type: Select,
                    hgap: 10,
                    tgap: 10,
                  },
                ],
              },
              height: 40,
            }, {
              type: LeftList,
              cls: 'left-list',
              vgap: 10,
              hgap: 10,
            },
          ],
        },
        width: 280,
      }, {
        type: Right,
      }],
    };
  },
};
BI.shortcut(className, BI.inherit(BI.Widget, Widget));

export default className;