사용자 지정 대화형 필터 예제

  • 릴리스 버전: Yokohama
  • 업데이트 날짜 2025년 01월 30일
  • 읽기11분
  • 관리자는 사용자 지정 대화형 필터 위젯을 생성하여 대시보드에서 고급 필터링 옵션을 제공할 수 있습니다.

    사용 케이스

    이 예제에서는 작업 테이블 또는 해당 하위 테이블에서 보고서를 필터링하는 사용자 지정 필터를 만드는 방법을 자세히 설명합니다. 필터는 현재 사용자가 호출자인 기록만 표시합니다. 필터는 사용자에게 두 개의 버튼을 노출하는데, 하나는 필터를 추가하는 버튼이고 다른 하나는 필터를 제거하는 버튼입니다.

    사용자 지정 대화형 필터 위젯 만들기

    대시보드에서 고급 필터링 옵션을 제공하는 사용자 지정 대화형 필터 위젯을 생성합니다.

    시작하기 전에

    필요한 역할: 관리자

    프로시저

    1. 사용자 지정 대화형 필터를 추가할 대시보드를 엽니다.
    2. 컨텐트 추가 아이콘( 컨텐트 추가 아이콘)을 클릭합니다.
    3. 위젯 범주 목록에서 콘텐츠 블록을 선택합니다.
      콘텐츠 블록이 선택된 위젯 범주 메뉴
    4. 콘텐츠 블록 목록에서 새 동적 콘텐츠를 선택합니다.
    5. New Dynamic Content(새 동적 콘텐츠) 패널에서 Add(추가)를 클릭합니다.
      새로운 동적 컨텐츠 위젯 옵션
      새 동적 컨텐츠 블록이 대시보드에 추가됩니다.
    6. 대시보드에서 Click here to configure this reusable Dynamic Content block(재사용 가능한 동적 콘텐츠 블록을 구성하려면 여기를 클릭)이라는 링크를 클릭합니다.
      새로운 동적 컨텐츠 위젯 옵션
    7. 동적 콘텐츠 필드에서 필터링 논리를 정의합니다.
      동적 컨텐츠 - 새 기록

    다음에 수행할 작업

    필터링 논리를 정의합니다.

    사용자 지정 날짜/시간 필터 옵션 만들기

    표준 날짜/시간 필터 옵션 선택이 필요에 맞지 않으면 사용자 지정 옵션을 만들 수 있습니다.

    시작하기 전에

    다음 단계에 따라 대시보드에서 사용할 날짜/시간 기반 대화형 필터에 포함할 수 있는 사용자 지정 날짜/시간 필터 옵션을 만듭니다. 이 예에서는 2주, 2주 기간에 대한 필터 옵션을 생성합니다.

    필요한 역할: admin.

    프로시저

    1. 다음으로 이동 모두 > 시스템 정의 > 비즈니스 규칙.
    2. 비즈니스 규칙 날짜 필터에 대한 날짜 필터 옵션 가져오기를 엽니다.
      이 규칙은 새 날짜 유형 또는 기존 날짜 유형 대화형 필터의 양식에서 선택 가능한 옵션 목록을 채웁니다.
    3. 고급 탭에서 새 옵션을 추가하는 데 필요한 JavaScript를 포함하도록 스크립트 필드를 수정합니다.
      다음 줄을 추가합니다.
      answer.add('<Time_Period_Name>@javascript:<Beginning_Time_Period>@javascript:<Ending_Time_Period>', gs.getMessage('<Textual_Representation_Of_Time_Period>'));
    4. 추가한 줄에서 다음과 같이 대체합니다.
      옵션설명
      <Time_Period_Name> 선택한 기간의 고유한 이름입니다. 이 문자열은 시스템에서 옵션을 식별하기 위해 내부적으로 사용되며 설명된 기간을 설명할 수 있는 것으로 설정됩니다.

      Fortnight 112_Last 값을 입력합니다.

      <Beginning_Time_Period> 이 필터가 시작되는 특정 날짜 및 시간입니다. 이 값은 절대 값 또는 상대 값을 사용할 수 있습니다. JavaScript URL 구문을 사용하는 상대 값을 사용하는 것이 훨씬 더 일반적입니다.

      gs.daysAgoStart(14) 값을 입력하여 이 선택에 대한 시간 간격이 정확히 2주 전이어야 함을 나타냅니다.

      <Ending_Time_Period> 이 필터 옵션의 기간이 종료되어야 하는 특정 날짜 및 시간입니다. 이 값은 절대 값 또는 상대 값을 사용할 수도 있습니다. 이와 유사하게 Beginning_Time_Period 이 값은 일반적으로 JavaScript URL 구문을 사용하는 상대 기간입니다.

      gs.daysAgoStart(0) 값을 입력하여 기간이 현재 날짜 및 시간에 종료됨을 나타냅니다.

      <Textual_Representation_Of_Time_Period> 알파벳 오름차순으로 표시되는 날짜/시간 필터 옵션 목록에 표시되는 짧은 텍스트 문자열입니다.

      지난 2주를 입력하여 이 선택 항목이 현재 날짜 및 시간보다 2주 전의 기간을 지정함을 나타냅니다.

      이제 전체 성명서는 다음과 같습니다.
      answer.add('112_Last Fortnight@javascript:gs.daysAgoStart(14)@javascript:gs.daysAgoEnd(0)', gs.getMessage('Last fortnight'));
    5. 업데이트를 선택하여 비즈니스 규칙에 대한 변경 내용을 저장합니다.
    6. 날짜/시간 필터를 편집하거나 만들 때 새 옵션을 사용할 수 있는지 확인합니다.
      1. 다음으로 이동 모두 > 보고서 > 관리 > 대화형 필터.
      2. 날짜 필터를 선택합니다.
        사용 가능한 필터는 지난 2주입니다.
        지난 2주를 포함한 사용 가능한 날짜 필터 옵션
    7. 새 값을 포함하도록 날짜 필터를 편집하고 대시보드에 필터를 추가합니다.
      마지막 2주 옵션을 사용할 수 있는 날짜 필터

    필터링 논리 정의 - 예시

    대화형 필터를 만든 후 필터링 논리를 추가합니다.

    시작하기 전에

    필요한 역할: 관리자

    필터는 DashboardMessageHandler 클래스를 사용하여 활성 필터를 관리합니다. 고유 값을 사용하여 DashboardMessageHandler 를 인스턴스화합니다.
    주:
    사용자 지정 대화형 필터의 ID는 고유해야 합니다. 다른 대화형 필터 또는 사용자 지정 대화형 필터와 ID가 같으면 필터링 논리가 제대로 작동합니다.

    프로시저

    1. 동적 컨텐츠 기록에서 필터링 논리를 동적 컨텐츠 XML 블록에 추가합니다.
    2. 마이닝 전용 단추는 인코딩된 쿼리 caller_idDYNAMIC90d1921e5f510100a9ad2572f2b477fe 사용하여 작업 테이블 보고서에 필터를 게시합니다.
      모든 작업 버튼을 누르면 필터가 제거됩니다.
    3. 그런 다음 동적 콘텐츠에 버튼이나 다른 인터페이스 요소를 추가할 수 있습니다. 이 예제에서는 clearFilter() 함수에 대한 코드와 필터의 버튼이 publishFilter() 함수 아래에 추가됩니다.
      <?xml version="1.0" encoding="utf-8" ?>
      <j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
       <script>
           var my_dashboardMessageHandler = new DashboardMessageHandler("my_unique_id");
          
          function publishFilter () {
              var filter_message = {};
              filter_message.id = "my_unique_id";
              filter_message.table = "task";
          
          <!--     Add your own filter query logic here -->
              filter_message.filter = "assigned_toDYNAMIC90d1921e5f510100a9ad2572f2b477fe";
              SNC.canvas.interactiveFilters.setDefaultValue({
                      id: filter_message.id,
                      filters: [filter_message]
                  }, false);
              my_dashboardMessageHandler.publishFilter(filter_message.table, filter_message.filter);
          }
          
          function clearFilter() {
              var filter_message = {};
              filter_message.id = "my_unique_id";
              filter_message.table = "task";
              filter_message.filter = "";
              SNC.canvas.interactiveFilters.setDefaultValue({
                      id: filter_message.id,
                      filters: [filter_message]
                  }, false);
              my_dashboardMessageHandler.removeFilter();
          }
       </script>   
       
      Example of a filter that generates a static filter on 'task' table reports, or removes it <br/>
          <input id="allTasks" type="button" value="All tasks" onclick="clearFilter();" />
          <input id="onlyMine" type="button" value="Only mine" onclick="publishFilter();" />
          
      </j:jelly>
    4. 제출을 선택합니다.

    결과

    동적 컨텐츠 블록을 추가한 대시보드에 사용자 지정 대화형 필터가 나타납니다. 또한 위젯 추가 패널의 콘텐츠 블록 목록에도 표시됩니다.

    사용자 지정 대화형 필터 예 - 여러 보고서

    사용자 지정 대화형 필터를 사용하면 서로 다른 테이블을 사용하여 여러 보고서를 필터링할 수 있습니다. 단일 테이블 또는 여러 테이블에 대한 대화형 필터를 게시하는 두 가지 API가 있습니다. 이 예에서는 사용자 지정 대화형 필터를 사용하여 인시던트 및 문제 테이블에 대한 보고서를 할당 그룹별로 필터링합니다.

    여러 테이블의 사용자 지정 대화형 필터 정보

    사용자 지정 대화형 필터를 생성할 때는 다음 사항에 유의하십시오.
    • 하나의 테이블에만 적용되는 사용자 지정 대화형 필터는 DashboardMessageHandler.publishFilter() 함수를 사용합니다.
    • 여러 테이블에 적용되는 사용자 지정 대화형 필터는 DashboardMessageHandler.publishMessage() 함수를 사용합니다.
    • 게시하기 전에 SNC.canvas.interactiveFilters.setDefaultValue() 함수에 대한 대화형 필터 호출이 필요합니다.
    • 필터를 재설정하기 전에 SNC.canvas.interactiveFilters.removeDefaultValue() 또는 DashboardMessageHandler.removeFilter() 함수를 호출해야 합니다.

    publishFilter() 메서드를 여러 번 호출하는 사용자 지정 대화형 필터는 연결된 보고서를 동일한 횟수만큼 새로 고칩니다. 이 메서드를 반복적으로 호출하면 성능 문제가 발생할 수 있습니다.

    여러 테이블에 사용자 지정 대화형 필터를 적용하는 방법

    다음 예에서는 인시던트 [incident] 및 문제 [problem] 테이블에서 할당 그룹별로 보고서를 필터링합니다.

    DashboardMessageHandler.publishMessage() 는 여러 필터를 배열로 허용합니다. 필터 배열을 생성한 다음 DashboardMessageHandler.publishMessage([filters])를 호출하는 DashboardMessageHandler의 단일 인스턴스를 생성합니다. 이 메서드는 위젯을 한 번만 새로 고칩니다.

    <?xml version="1.0" encoding="UTF-8"?>
    <j:jelly xmlns:j="jelly:core" xmlns:g="glide" xmlns:g2="null" xmlns:j2="null" trim="false">
       <script>
          var my_dashboardMessageHandler = new DashboardMessageHandler("my_unique_id");
    
    function publishMultipleFilter() {
          <!-- Mutliple filters can be passed as an array -->
          var finalFilter = [{"table":"incident","filter":"assignment_group=6fcd3b573b331300ad3cc9bb34efc447"}, {"table":"problem","filter":"assignment_group=6fcd3b573b331300ad3cc9bb34efc447"}];
          <!-- call setDefaultValue first -->
          SNC.canvas.interactiveFilters.setDefaultValue({
    id: my_dashboardMessageHandler._unique_id,
    filters: finalFilter,
    }, false);
          <!-- then call Publishmessage to publish filters-->
          my_dashboardMessageHandler.publishMessage(finalFilter);
    }
    
    function clearFilter() {
    SNC.canvas.interactiveFilters.removeDefaultValue(my_dashboardMessageHandler._unique_id, false);
    my_dashboardMessageHandler.removeFilter();
    }
       </script>
       
    Example of a filter that filters incident and problem table where the assignment group is Problem solving
       <input id="allTasks" type="button" value="All" onclick="clearFilter();" />
       <input id="onlyMine" type="button" value="Assignment group is [Problem solving]" onclick="publishMultipleFilter();" />
    </j:jelly>