WDA学习(25):DateNavigator使用

1.18 UI Element:Date Navigator使用

本实例测试创建Date Navigator;

1.创建Component,View: V_DATE_NAVIGATOR;

2.创建Context节点；

创建NODE: NODE_DATENAV, Cardinality:1..1;

创建Attribute:SELECTION_MODE,类型WDUI_DATE_SELECTION_MODE；

创建Attribute: FIRST_DAY_OF_WEEK,类型WDUI_DAY_OF_WEEK；

创建Attribute: FIRST_SELECTED_DATE,类型D;

创建Attribute:LAST_SELECTED_DATE,类型D;

创建Attribute: MONTH_PER_COLUMN,类型I;

创建Attribute: MONTH_PER_ROW,类型I;

创建Attribute: START_WITH，类型D;

创建NODE:NODE_MARKING,Cardinality:0..n;

创建Attribute:DATE,类型D;

 

3.创建Layout UI Element;

创建UI Element:Tray,ID:TRAY1,包含一些输入参数UI Element;

创建UI Element:Toolbar;

创建UI Element:ToolbarButton,绑定Action:APPLY;

创建UI Element:Label;

创建UI Element:DropDownByKey,ID: INP,selectedKey绑定Context的Attribute: V_DATE_NAVIGATOR.NODE_DATENAV.FIRST_DAY_OF_WEEK;

创建UI Element:InputField,ID:INP1,value绑定Context的Attribute: V_DATE_NAVIGATOR.NODE_DATENAV.FIRST_SELECTED_DATE;

创建UI Element:InputField,ID:INP2,value绑定Context的Attribute: V_DATE_NAVIGATOR.NODE_DATENAV.LAST_SELECTED_DATE;

创建UI Element:InputField,ID:INP3,value绑定Context的Attribute: V_DATE_NAVIGATOR.NODE_DATENAV.MONTH_PER_COLUMN;

创建UI Element:InputField,ID:INP4,value绑定Context的Attribute:

V_DATE_NAVIGATOR.NODE_DATENAV.MONTH_PER_ROW;

创建UI Element:DropDownByKey,ID:INP5,selectedKey绑定Context的Attribute:

V_DATE_NAVIGATOR.NODE_DATENAV.SELECTION_MODE;

创建UI Element:InputField,ID:INP6,value绑定Context的Attribute: V_DATE_NAVIGATOR.NODE_DATENAV.START_WITH;

创建UI Element:DateNavigator;

设置Properties

firstDayOfWeek:绑定Attribute,V_DATE_NAVIGATOR.NODE_DATENAV.FIRST_DAY_OF_WEEK;

firstSelectedDate:绑定Attribute,V_DATE_NAVIGATOR.NODE_DATENAV.FIRST_SELECTED_DATE;

lastSelectedDate:绑定Attribute,V_DATE_NAVIGATOR.NODE_DATENAV.LAST_SELECTED_DATE;

monthsPerColumn:绑定Attribute,V_DATE_NAVIGATOR.NODE_DATENAV.MONTH_PER_COLUMN;

monthsPerRow:绑定Attribute,V_DATE_NAVIGATOR.NODE_DATENAV.MONTH_PER_ROW;

selectionMode:绑定Attribute,V_DATE_NAVIGATOR.NODE_DATENAV.SELECTION_MODE;

startsWith:绑定Attribute,V_DATE_NAVIGATOR.NODE_DATENAV.START_WITH;

onDaySelect：绑定Action，SEL_DAY;

onMonthSelect:绑定Action,SEL_MONTH;

onStartDateChanged:绑定Action,CHANGE_START_DAY;

onWeekSelect:绑定Action，SEL_WEEK;

创建UI Element:DateNavigatorMarking;

设置Properties

dataSource:绑定V_DATE_NAVIGATOR.NODE_MARKING；

date：绑定NODE_MARKING.DATE;

 

4.创建Method页签方法；

创建INIT_PROPER方法，初始化DateNavigator的属性参数，WDDOINIT方法中调用；

代码实例：

 DATA:lo_node TYPE REF TO if_wd_context_node.
  DATA:lo_element TYPE REF TO if_wd_context_element.
  DATA:lv_date TYPE D.

  lv_date = sy-datum.
  "获取节点
  lo_node = wd_context->get_child_node( wd_this->wdctx_node_datenav ).
  lo_element = lo_node->get_element( ).
  lo_element->set_attribute(
    EXPORTING
      name = 'FIRST_SELECTED_DATE'
      value = lv_date
  ).
  lo_element->set_attribute(
    EXPORTING
      name = 'LAST_SELECTED_DATE'
      value = lv_date
  ).
  lo_element->set_attribute(
    EXPORTING
      name = 'MONTH_PER_COLUMN'
      value = 1
  ).
  lo_element->set_attribute(
    EXPORTING
      name = 'MONTH_PER_ROW'
      value = 2
  ).
  lo_element->set_attribute(
    EXPORTING
      name = 'START_WITH'
      value = lv_date
  ).

实现Action: SEL_DAY,日期选择;

  DATA:lo_node TYPE REF TO if_wd_context_node.
  DATA:lo_element TYPE REF TO if_wd_context_element.
  DATA:lt_marking TYPE wd_this->elements_node_marking.
  DATA:ls_marking TYPE wd_this->element_node_marking.
  DATA:lv_date TYPE string.
  "获取选择的日期
  lv_date = wdevent->get_string( name = 'DAY' ).
  "获取节点
  lo_node = wd_context->get_child_node( wd_this->wdctx_node_marking ).
  lo_node->get_static_attributes_table( IMPORTING table = lt_marking ).

  READ TABLE lt_marking INTO ls_marking WITH KEY date = lv_date.
  IF sy-subrc = 0.
    DELETE TABLE lt_marking FROM ls_marking.
  ELSE.
    ls_marking-date = lv_date.
    APPEND ls_marking TO lt_marking.
  ENDIF.
  lo_node->bind_table( new_items = lt_marking set_initial_elements = abap_true ).

实现Action:SEL_MONTH,选择月份；

  DATA:lo_event TYPE REF TO cl_wd_custom_event.
  DATA:lv_year TYPE string.
  DATA:lv_month TYPE string.
  lo_event = wdevent.
  lv_year = wdevent->get_string( name = 'YEAR' ).
  lv_month = wdevent->get_string( name = 'MONTH' ).
  lv_year = 'select month:' && lv_year && lv_month.
  wd_comp_controller->show_msg( msg = lv_year msg_type = 'S' ).

实现Action: SEL_WEEK,选择周；

  DATA:lo_event TYPE REF TO cl_wd_custom_event.
  DATA:lv_year TYPE string.
  DATA:lv_week TYPE string.
  DATA:lv_first_day TYPE string.

  lo_event = wdevent.
  lv_year = wdevent->get_string( name = 'YEAR' ).
  lv_week = wdevent->get_string( name = 'WEEK' ).
  lv_first_day = wdevent->get_string( name = 'FIRST_DAY' ).
  lv_year = 'select week:' && lv_year && '年第' && lv_week && '周' && 'first day:' && lv_first_day.
  wd_comp_controller->show_msg( msg = lv_year msg_type = 'S' ).

实现Action:CHANGE_START_DAY,修改start day;

代码实例：

  DATA:lo_event TYPE REF TO cl_wd_custom_event.
  DATA:lv_date TYPE string.

  lv_date = wdevent->get_string( name = 'START_DATE' ).
  lv_date = 'change start date:' && lv_date.
  wd_comp_controller->show_msg( msg = lv_date msg_type = 'S' ).

5.执行显示