디자이너 권한 지원

디자이너는 보기 모드(View Mode) 권한 제어를 지원합니다. 워크북의 권한이 보기 모드로 설정되면 기본 컨텍스트 메뉴 항목은 숨겨지고, 리본 항목은 비활성화됩니다.

핵심 기능

현재 워크북의 권한이 보기 모드로 설정되어 있으면 디자이너의 리본과 컨텍스트 메뉴는 해당 상태에 맞게 자동으로 조정됩니다.

워크북 권한이 보기 모드일 때 기본적으로 컨텍스트 메뉴 항목은 숨겨지고 리본 항목은 비활성화됩니다.

사용자가 보기 모드에서도 사용자 정의 컨텍스트 메뉴 항목이나 리본 항목을 사용하려면 ICommand에 다음 속성을 추가해야 합니다.

• 리본 항목: viewModeEnableContext 속성 설정 필요

• 컨텍스트 메뉴 항목: viewModeVisibleContext 속성 설정 필요

• metaData: 항목이 실행하는 Command에 metaData 속성을 추가하고, 그 안에서 viewModePermission 속성을 설정하여 해당 명령이 어떤 권한 유형에서 사용 가능한지 제어

기본적으로 워크북 권한이 보기 전용일 때 기본 제공 리본 항목과 컨텍스트 메뉴 항목은 다음과 같이 동작합니다.

• 리본

  • 권한에 따라 리본 항목이 사용 불가 상태로 설정됩니다.

  • 기본적으로 복사(Copy), 찾기(Find), 찾기…(Find…), 이동…(Go To…)만 활성화됩니다.

    
    

    
    

• 워크북의 viewModePermission에 allowNonDataModifyingOperations가 포함된 경우, 리본에서 복사, 찾기, 찾기…, 이동…이 활성화됩니다.

• 워크북의 viewModePermission에 allowHideRowsOrColumns가 포함된 경우, 리본에서 복사, 찾기, 찾기…, 이동…이 활성화됩니다.

• 워크북의 viewModePermission에 allowResizeRowsOrColumns가 포함된 경우, 리본에서 복사, 찾기, 찾기…, 이동…이 활성화됩니다.

• 워크북의 viewModePermission에 allowFilter가 포함된 경우, 리본에서 복사, 찾기, 찾기…, 이동…, 정렬 및 필터(Sort & Filter), 필터(Filter), 필터 지우기(Clear Filter), 다시 적용(Reapply)이 활성화됩니다.

  
  

  
  

• 워크북의 viewModePermission에 allowSort가 포함된 경우, 리본에서 복사, 찾기, 찾기…, 이동…, 정렬 및 필터, 오름차순 정렬(Sort A to Z), 내림차순 정렬(Sort Z to A), 사용자 지정 정렬(Custom Sort…)이 활성화됩니다.

  
  

  
  

• 컨텍스트 메뉴

  • 권한에 따라 메뉴 항목이 숨겨집니다.

  • 워크북의 viewModePermission에 allowNonDataModifyingOperations가 포함된 경우, 컨텍스트 메뉴에 복사(Copy)가 표시됩니다.

    
    

  • 워크북의 viewModePermission에 allowHideRowsOrColumns가 포함된 경우, 컨텍스트 메뉴에 복사, 숨기기(Hide), 숨김 취소(Unhide)가 표시됩니다.

    designer_permission_support8

  • 워크북의 viewModePermission에 allowResizeRowsOrColumns가 포함된 경우, 컨텍스트 메뉴에 복사, 행 높이(Row Height…), 열 너비(Column Width…)가 표시됩니다.

    
    

  • 워크북의 viewModePermission에 allowFilter가 포함된 경우, 컨텍스트 메뉴에 복사, 필터(Filter)가 표시됩니다.

    
    

  • 워크북의 viewModePermission에 allowSort가 포함된 경우, 컨텍스트 메뉴에 복사, 정렬(Sort), 오름차순 정렬(Sort A to Z), 내림차순 정렬(Sort Z to A)이 표시됩니다.

    
    

인터페이스

interface GC.Spread.Sheets.Designer.ICommand {
  ...,
  viewModeVisibleContext?: string; // 컨텍스트 메뉴 항목에서 사용
  viewModeEnableContext?: string; // 리본 항목에서 사용
}

샘플 코드

디자이너 리본에 새로운 리본 항목 “AutoFitAll”을 추가한다고 가정합니다.

이 항목을 클릭하면 현재 시트의 모든 행과 열을 자동 맞춤(AutoFit)합니다.

이 항목은 워크북이 편집 모드이거나, 보기 모드이면서 allowResizeRowsOrColumns 권한이 있는 경우에만 사용 가능합니다.

이를 구현하기 위한 절차는 다음과 같습니다.

1. 워크북의 권한 정보를 가져와 allowResizeRowsOrColumns 허용 여부를 기록합니다.

2. config의 commandMap에 Command를 추가합니다. 이때 viewModeEnableContext 속성을 반드시 설정해야 합니다.

3. Command 그룹을 생성하고 해당 Command를 그룹에 추가한 뒤, 이 그룹을 리본 설정에 추가합니다.

4. 설정(config)을 디자이너에 적용합니다.

// 워크북 권한 정보 업데이트
// 1. 워크북 권한 정보를 가져와 allowResizeRowsOrColumns 허용 여부를 기록
const permission = spread.collaboration.getPermission();
const browsingMode = permission && permission.mode, viewModePermissions = permission && permission.viewModePermissions;
const AllowViewModeResizeRowsOrColumnsFlag = "allowViewModeResizeRowsOrColumns";
if (browsingMode === GC.Spread.Sheets.Collaboration.BrowsingMode.view && viewModePermissions & GC.Spread.Sheets.Collaboration.PermissionTypes.allowResizeRowsOrColumns) {
  designer.setData(AllowViewModeResizeRowsOrColumnsFlag , true);
}

// 사용자 정의 Command "AutoFitAll" 추가
// 2. config의 commandMap에 Command 추가 (viewModeEnableContext 설정 필요)
const autoFitAllCommand = {
    text: "AutoFitAll",
    commandName: "autoFitAll",
    iconClass: "ribbon-button-autofit-all",
    bigButton: true,
    viewModeEnableContext: AllowViewModeResizeRowsOrColumnsFlag, // 보기 모드가 아니거나, 보기 모드이면서 allowResizeRowsOrColumns 권한이 있는 경우
    execute: (context) => {
        const spread = context.Spread, sheet = spread.getActiveSheet(), rowCount = sheet.getRowCount(), colCount = sheet.getColumnCount();
        spread.collaboration.startBatchOp();
        sheet.suspendPaint();
        for (let i = 0; i < rowCount; i++) {
          sheet.autoFitRow(i);
        }
        for (let i = 0; i < colCount; i++) {
            sheet.autoFitColumn(i);
        }
        sheet.resumePaint();
        spread.collaboration.endBatchOp();
    }
}
const config = GC.Spread.Sheets.Designer.DefaultConfig;
config.commandMap = {
  autoFitAll: autoFitAllCommand
};

// 3. Command 그룹 생성 후 리본 설정에 추가
const autoFitCommandGroup = {
  label: "AutoFit",
  thumbnailClass: "AutoFit",
  commandGroup: {
    children: [{
      direction: "vertical",
      commands: ["autoFitAll"]
    }]
  }
}
config.ribbon[0].buttonGroups.unshift(autoFitCommandGroup);

// 4. 디자이너에 설정 적용
designer.setConfig(config);