9、Gantt 全屏&取消全屏操作

const ganttData = reactive<{
  // 全屏开启状态
  fullScreenStatus: boolean;
}>({
  fullScreenStatus: false,
});

function collapseExpandFullFuc() {
  ganttData.fullScreenStatus = gantt.getState().fullscreen;
}

/**
 * 开启关闭 & 关闭全屏
 */
function handleFullscreen() {
  if (!gantt.getState().fullscreen) {
    // expanding the gantt to full screen
    gantt.expand();
    ganttData.fullScreenStatus = true;
  } else {
    // collapsing the gantt to the normal mode
    gantt.collapse();
    ganttData.fullScreenStatus = false;
  }
}

gantt.plugins({
    fullscreen: true
});

1. 将甘特图扩展为全屏模式
   https://docs.dhtmlx.com/gantt/api__gantt_expand.html

gantt.attachEvent('onExpand', function () {
  collapseExpandFullFuc();
});

2. 将甘特图从全屏模式折叠到正常模式
   https://docs.dhtmlx.com/gantt/api__gantt_collapse.html

gantt.attachEvent('onCollapse', function () {
  collapseExpandFullFuc();
});

3. 全屏扩展
   https://docs.dhtmlx.com/gantt/desktop__fullscreen_ext.html