FastWeb之商務月曆(WEB)

1. 說明

  本示例使用日曆與資料庫結合的方式，將資料庫中的事項附加至日曆上實現事項月曆的功能。在使用此示例前，請先檢查 節點資料庫 中的 FastWeb 連線設定是否有效。

  通過本範例學習，可以掌握 TUgFullCalendar 的使用方法，並結合實體實現商務月曆展示的功能。

2. 設計明細

  開啟FastWeb設計器，分別加入下插圖之控制元件。或者點選左上角的[匯入]選擇模板檔案來打開對應模板。

  1：TUgPageControl元件，控制元件名稱為UgPageControl01。

  2：TUgPanel元件，控制元件名稱為 UgPanel01。

  3：TUgButton元件，控制元件名稱為 btnAddEvent。

  4：TUgButton元件，控制元件名稱為 btnEditEvent。

  5：TUgButton元件，控制元件名稱為 btnDeleteEvent。

  6：TUgButton元件，控制元件名稱為 btnCreateCalendar。

  7：TUgDBGrid元件，控制元件名稱為 UgDBGrid01。

  8：TUgClientDataSet元件，控制元件名稱為 cdsEvent。

  9：TUgDataSource元件，控制元件名稱為 dsEvent。

  10：在另一個標籤頁中的 TUgFullCalendar元件，控制元件名稱為 FullCalendar01。

• UgWebRunFrame屬性設定

  • Height：設定頁面高度=600。
  • Width：設定頁面寬度=800。

• 1： UgPageControl01屬性設定

  • Align：設定控制元件的對齊方式，設定為alClient。

    點選窗體結構與檢視器中的此控制元件，點選其左上角的新增圖示按鈕新增兩項 TabSheet。分別設定其 Caption 屬性為 事項 與 日曆。

• 2：UgPanel01屬性設定

    此控制元件是按鈕控制元件的容器。其位於第一個 TabSheet 中。

  • Align：設定控制元件的對齊方式，設定為 alTop 。
  • Height：設定控制元件的高度，設定為 40。

• 3：btnAddEvent屬性設定

  • Caption：設定顯示的字幕內容，設定為新增事項。

• 4：btnEditEvent屬性設定

  • Caption：設定顯示的字幕內容，設定為編輯事項。

• 5：btnDeleteEvent屬性設定

  • Caption：設定顯示的字幕內容，設定為刪除事項。

• 6：btnCreateCalendar屬性設定

  • Caption：設定顯示的字幕內容，設定為產生月曆。

• 7：UgDBGrid01屬性設定

  UgDBGrid01 位於第一個 TabSheet 中。雙擊表格打開欄位編輯器，編輯以下的欄位內容。

  

  • Align：設定對齊方式，設定為alClient。
  • DataSource：設定數據來源，設定為 dsEvent。
  • ReadOnly：設定表格是否為只讀，設定為 True。

• 9：dsEvent屬性設定

  • DataSet：設定繫結的數據集，設定為 cdsEvent。

• 10：UgFullCalendar01屬性設定

    此控制元件位於第二個 TabSheet 中。

  • Align：設定對齊方式，設定為 alClient。
  • CalendarOptions：設定日曆的外觀顯示選項，其中修改 AspectRatio 為 1.527，修改 DisplayEventEnd 為 True，修改 DisplayEventTime 為 True，修改 EventLimit 為 True，修改 EventTimeFormat 為 H:mm。

3. 程式設計

  點選程式設計界面右下角的按鈕，切換至單元選擇界面，勾選需要使用的單元。該程式的程式不需要引用單元。

3.1. 程式初始設定

  設定一個自定義函式，用於產生表單。

//JScript
function GetEditorForm(){
  Result = new TUgWebForm(UniApplication);
  Result.FreeOnClose = false;
  Result.Width = 400;
  Result.Height = 350;
  Result.Bordericons = biSystemMenu;
  
  var edId = new TUgNumberEdit(Result);
  edId.Name = "edId";
  edId.Height = 22;
  edId.Enabled = true;
  edId.Parent = Result;
  edId.FieldLabel = UGMM.LT("事項ID");
  edId.FieldLabelSeparator = "";
  edId.FieldLabelAlign = laLeft;
  edId.Align = alTop;
  edId.Margins.Left = 8;
  edId.Margins.Right = 8;
  edId.AlignWithMargins = true;
  edId.EmptyText = "Id";

  var edTitle = new TUgEdit(Result);
  edTitle.Name = "edTitle";
  edTitle.Height = 22;
  edTitle.Enabled = true;
  edTitle.Parent = Result;
  edTitle.FieldLabel = UGMM.LT("事項名稱");
  edTitle.FieldLabelSeparator = "";
  edTitle.FieldLabelAlign = laLeft;
  edTitle.Align = alTop;
  edTitle.Margins.Left = 8;
  edTitle.Margins.Right = 8;
  edTitle.AlignWithMargins = true;
  edTitle.EmptyText = UGMM.LT("請輸入事項名稱");

  var edAllDay = new TUgCheckBox(Result);
  edAllDay.Name = "edAllDay";
  edAllDay.Height = 22;
  edAllDay.Parent = Result;
  edAllDay.FieldLabel = UGMM.LT("全天事項？");
  edAllDay.FieldLabelAlign = laLeft;
  edAllDay.Align = alTop;
  edAllDay.Margins.Left = 8;
  edAllDay.Margins.Right = 8;
  edAllDay.AlignWithMargins = true;

  var edStartStr = new TUgDateTimePicker(Result);
  edStartStr.Name = "edStartStr";
  edStartStr.Height = 22;
  edStartStr.Parent = Result;
  edStartStr.FieldLabel = UGMM.LT("事項開始日期");
  edStartStr.FieldLabelSeparator = "";
  edStartStr.FieldLabelAlign = laLeft;
  edStartStr.Align = alTop;
  edStartStr.Margins.Left = 8;
  edStartStr.Margins.Right = 8;
  edStartStr.AlignWithMargins = true;
  edStartStr.DateTime = StrToDateTime(FormatdateTime("yyyy-mm-dd",now()) + " 00:00:00");
  edStartStr.Kind = tUniDateTime; 
  
  var edEndStr = new TUgDateTimePicker(Result);
  edEndStr.Name = "edEndStr";
  edEndStr.Height = 22;
  edEndStr.Parent = Result;
  edEndStr.FieldLabel = UGMM.LT("事項結束日期");
  edEndStr.FieldLabelSeparator = "";
  edEndStr.FieldLabelAlign = laLeft;
  edEndStr.Align = alTop;
  edEndStr.Margins.Left = 8;
  edEndStr.Margins.Right = 8;
  edEndStr.AlignWithMargins = true;
  edEndStr.DateTime = StrToDateTime(FormatdateTime("yyyy-mm-dd",now()) + " 23:59:59");
  edEndStr.Kind = tUniDateTime; 

  var edUrl = new TUgEdit(Result);
  edUrl.Name = "edUrl";
  edUrl.Height = 22;
  edUrl.Enabled = true;
  edUrl.Parent = Result;
  edUrl.FieldLabel = UGMM.LT("鏈接");
  edUrl.FieldLabelSeparator = "";
  edUrl.FieldLabelAlign = laLeft;
  edUrl.Align = alTop;
  edUrl.Margins.Left = 8;
  edUrl.Margins.Right = 8;
  edUrl.AlignWithMargins = true;
  edUrl.EmptyText = UGMM.LT("請輸入鏈接");

  var edBackgroundColor = new TUgEdit(Result);
  edBackgroundColor.Name = "edBackgroundColor";
  edBackgroundColor.Height = 22;
  edBackgroundColor.Enabled = true;
  edBackgroundColor.Parent = Result;
  edBackgroundColor.FieldLabel = UGMM.LT("背景顏色");
  edBackgroundColor.FieldLabelSeparator = "";
  edBackgroundColor.FieldLabelAlign = laLeft;
  edBackgroundColor.Align = alTop;
  edBackgroundColor.Margins.Left = 8;
  edBackgroundColor.Margins.Right = 8;
  edBackgroundColor.AlignWithMargins = true;
  edBackgroundColor.EmptyText = UGMM.LT("背景顏色(css)");
  
  var edBorderColor = new TUgEdit(Result);
  edBorderColor.Name = "edBorderColor";
  edBorderColor.Height = 22;
  edBorderColor.Enabled = true;
  edBorderColor.Parent = Result;
  edBorderColor.FieldLabel = UGMM.LT("邊框顏色");
  edBorderColor.FieldLabelSeparator = "";
  edBorderColor.FieldLabelAlign = laLeft;
  edBorderColor.Align = alTop;
  edBorderColor.Margins.Left = 8;
  edBorderColor.Margins.Right = 8;
  edBorderColor.AlignWithMargins = true;
  edBorderColor.EmptyText = UGMM.LT("邊框顏色(css)");
  
  var edTextColor = new TUgEdit(Result);
  edTextColor.Name = "edTextColor";
  edTextColor.Height = 22;
  edTextColor.Enabled = true;
  edTextColor.Parent = Result;
  edTextColor.FieldLabel = UGMM.LT("文字顏色");
  edTextColor.FieldLabelSeparator = "";
  edTextColor.FieldLabelAlign = laLeft;
  edTextColor.Align = alTop;
  edTextColor.Margins.Left = 8;
  edTextColor.Margins.Right = 8;
  edTextColor.AlignWithMargins = True;
  edTextColor.EmptyText = UGMM.LT("文字顏色(css)");
  
  var btOk = new TUgButton(Result);
  btOk.Name = "btOk";
  btOk.Height = 32;
  btOk.Parent = Result;
  btOk.Margins.Bottom = 6;
  btOk.Margins.Left = 8;
  btOk.Margins.Right = 8;
  btOk.Align = alBottom;
  btOk.Caption = UGMM.LT("儲存");
  btOk.ModalResult = mrOK;
  btOk.AlignWithMargins = true;  
}

//PasScript
Function GetEditorForm:TUgWebForm;
Var
  edId: TUgNumberEdit;
  edTitle:TUgEdit;
  edAllDay:TUgCheckBox;
  edStartStr:TUgDateTimePicker;
  edEndStr:TUgDateTimePicker;
  edUrl: TUgEdit;
  edBackgroundColor: TUgEdit;
  edBorderColor: TUgEdit;
  edTextColor: TUgEdit;
  btOk: TUgButton;
Begin
  Result := TUgWebForm.Create(UniApplication);
  Result.FreeOnClose := False;
  Result.Width := 400;
  Result.Height := 350;
  Result.Bordericons :=biSystemMenu;
  
  edId:=TUgNumberEdit.Create(Result);
  edId.Name := 'edId';
  edId.Height := 22;
  edId.Enabled := true;
  edId.Parent := Result;
  edId.FieldLabel := UGMM.LT('事項ID');
  edId.FieldLabelSeparator := '';
  edId.FieldLabelAlign := laLeft;
  edId.Align := alTop;
  edId.Margins.Left := 8;
  edId.Margins.Right := 8;
  edId.AlignWithMargins := True;
  edId.EmptyText:='Id';

  edTitle:=TUgEdit.Create(Result);
  edTitle.Name := 'edTitle';
  edTitle.Height := 22;
  edTitle.Enabled := true;
  edTitle.Parent := Result;
  edTitle.FieldLabel := UGMM.LT('事項名稱');
  edTitle.FieldLabelSeparator := '';
  edTitle.FieldLabelAlign := laLeft;
  edTitle.Align := alTop;
  edTitle.Margins.Left := 8;
  edTitle.Margins.Right := 8;
  edTitle.AlignWithMargins := True;
  edTitle.EmptyText:= UGMM.LT('請輸入事項名稱');

  edAllDay := TUgCheckBox.Create(Result);
  edAllDay.Name := 'edAllDay';
  edAllDay.Height := 22;
  edAllDay.Parent := Result;
  edAllDay.FieldLabel := UGMM.LT('全天事項？');
  edAllDay.FieldLabelAlign := laLeft;
  edAllDay.Align := alTop;
  edAllDay.Margins.Left := 8;
  edAllDay.Margins.Right := 8;
  edAllDay.AlignWithMargins := True;

  edStartStr:=TUgDateTimePicker.Create(Result);
  edStartStr.Name := 'edStartStr';
  edStartStr.Height := 22;
  edStartStr.Parent := Result;
  edStartStr.FieldLabel := UGMM.LT('事項開始日期');
  edStartStr.FieldLabelSeparator := '';
  edStartStr.FieldLabelAlign := laLeft;
  edStartStr.Align := alTop;
  edStartStr.Margins.Left := 8;
  edStartStr.Margins.Right := 8;
  edStartStr.AlignWithMargins := True;
  edStartStr.DateTime := StrToDateTime(FormatdateTime('yyyy-mm-dd',now()) + ' 00:00:00');
  edStartStr.Kind := tUniDateTime; 
  
  edEndStr:=TUgDateTimePicker.Create(Result);
  edEndStr.Name := 'edEndStr';
  edEndStr.Height := 22;
  edEndStr.Parent := Result;
  edEndStr.FieldLabel := UGMM.LT('事項結束日期');
  edEndStr.FieldLabelSeparator := '';
  edEndStr.FieldLabelAlign := laLeft;
  edEndStr.Align := alTop;
  edEndStr.Margins.Left := 8;
  edEndStr.Margins.Right := 8;
  edEndStr.AlignWithMargins := True;
  edEndStr.DateTime := StrToDateTime(FormatdateTime('yyyy-mm-dd',now()) + ' 23:59:59');
  edEndStr.Kind := tUniDateTime; 

  edUrl:=TUgEdit.Create(Result);
  edUrl.Name := 'edUrl';
  edUrl.Height := 22;
  edUrl.Enabled := true;
  edUrl.Parent := Result;
  edUrl.FieldLabel := UGMM.LT('鏈接');
  edUrl.FieldLabelSeparator := '';
  edUrl.FieldLabelAlign := laLeft;
  edUrl.Align := alTop;
  edUrl.Margins.Left := 8;
  edUrl.Margins.Right := 8;
  edUrl.AlignWithMargins := True;
  edUrl.EmptyText:= UGMM.LT('請輸入鏈接');

  edBackgroundColor:=TUgEdit.Create(Result);
  edBackgroundColor.Name := 'edBackgroundColor';
  edBackgroundColor.Height := 22;
  edBackgroundColor.Enabled := true;
  edBackgroundColor.Parent := Result;
  edBackgroundColor.FieldLabel := UGMM.LT('背景顏色');
  edBackgroundColor.FieldLabelSeparator := '';
  edBackgroundColor.FieldLabelAlign := laLeft;
  edBackgroundColor.Align := alTop;
  edBackgroundColor.Margins.Left := 8;
  edBackgroundColor.Margins.Right := 8;
  edBackgroundColor.AlignWithMargins := True;
  edBackgroundColor.EmptyText:= UGMM.LT('背景顏色(css)');
  
  edBorderColor:=TUgEdit.Create(Result);
  edBorderColor.Name := 'edBorderColor';
  edBorderColor.Height := 22;
  edBorderColor.Enabled := true;
  edBorderColor.Parent := Result;
  edBorderColor.FieldLabel := UGMM.LT('邊框顏色');
  edBorderColor.FieldLabelSeparator := '';
  edBorderColor.FieldLabelAlign := laLeft;
  edBorderColor.Align := alTop;
  edBorderColor.Margins.Left := 8;
  edBorderColor.Margins.Right := 8;
  edBorderColor.AlignWithMargins := True;
  edBorderColor.EmptyText:= UGMM.LT('邊框顏色(css)');
  
  edTextColor:=TUgEdit.Create(Result);
  edTextColor.Name := 'edTextColor';
  edTextColor.Height := 22;
  edTextColor.Enabled := true;
  edTextColor.Parent := Result;
  edTextColor.FieldLabel := UGMM.LT('文字顏色');
  edTextColor.FieldLabelSeparator := '';
  edTextColor.FieldLabelAlign := laLeft;
  edTextColor.Align := alTop;
  edTextColor.Margins.Left := 8;
  edTextColor.Margins.Right := 8;
  edTextColor.AlignWithMargins := True;
  edTextColor.EmptyText:= UGMM.LT('文字顏色(css)');
  
  btOk:=TUgButton.Create(Result);
  btOk.Name := 'btOk';
  btOk.Height := 32;
  btOk.Parent := Result;
  btOk.Margins.Bottom:= 6;
  btOk.Margins.Left := 8;
  btOk.Margins.Right := 8;
  btOk.Align := alBottom;
  btOk.Caption:= UGMM.LT('儲存');
  btOk.ModalResult := mrOK;
  btOk.AlignWithMargins := True;  
End;

// Make sure to add code blocks to your code group

//JScript
  btnAddEvent.OnClick = &btnAddEventOnClick;
  btnEditEvent.OnClick = &btnEditEventOnClick;
  btnDeleteEvent.OnClick = &btnDeleteEventOnClick;
  btnCreateCalendar.OnClick = &btnCreateCalendarOnClick;

  UGMM.LC(Self);
  UgFullCalendar01.CalendarOptions.Locale = UGMM.LT("zh-cn");
  
  UgPageControl01.TabIndex = 0;
  cdsEvent.DataNodeName = "FastWeb";
  cdsEvent.CommandText = "Select * from Task_FullCalendar Order By Id";
  cdsEvent.Open;

//PasScript
procedure UgWebRunFrameOnAfterRunScript(const sender: tobject);
begin
  UGMM.LC(Self);
  UgFullCalendar01.CalendarOptions.Locale := UGMM.LT('zh-cn');
end;

Begin
  UgPageControl01.TabIndex := 0;
  cdsEvent.DataNodeName := 'FastWeb';
  cdsEvent.CommandText := 'Select * from Task_FullCalendar Order By Id';
  cdsEvent.Open;
End.

// Make sure to add code blocks to your code group

3.2. 事件設定

• 3：btnAddEvent-OnClick事件

  點選以新增事項。

//JScript
function btnAddEventOnClick(sender){
  var F = GetEditorForm();
  Try{
    F.Caption = UGMM.LT("新增事項");
    var e = "";
    var b = true;
    While (b){
      if (e != "") 
        MessageDlg(e,mtError,mbOK);
        if (F.ShowModal == mrOK){ 
        Try{
          if (TUgNumberEdit(F.FindComponent("edId")).Value == 0)
            RaiseException(UGMM.LT("事項ID"));
          //新增到記憶體表
          cdsEvent.Append;
          var v = TUgNumberEdit(F.FindComponent("edID")).Value;
          cdsEvent.FieldByName("Id").AsString = v;
          cdsEvent.FieldByName("Title").AsString   = TUgEdit(F.FindComponent("edTitle")).Text;
          cdsEvent.FieldByName("AllDay").AsBoolean = TUgCheckBox(F.FindComponent("edAllDay")).Checked;
          cdsEvent.FieldByName("StartStr").AsDateTime  = TUgDateTimePicker(F.FindComponent("edStartStr")).DateTime;
          cdsEvent.FieldByName("EndStr").AsDateTime    = TUgDateTimePicker(F.FindComponent("edEndStr")).DateTime;
          cdsEvent.FieldByName("Url").AsString  = TUgEdit(F.FindComponent("edUrl")).Text;
          cdsEvent.FieldByName("BackgroundColor").AsString = TUgEdit(F.FindComponent("edBackgroundColor")).Text;
          cdsEvent.FieldByName("BorderColor").AsString = TUgEdit(F.FindComponent("edBorderColor")).Text;
          cdsEvent.FieldByName("TextColor").AsString = TUgEdit(F.FindComponent("edTextColor")).Text;
          cdsEvent.Post;
          
          cdsEvent.SubmitUpdates;
          b = false;
        }
        Except{
          RaiseException(ExceptionMessage);
          }
        } else{
        b = false;
        }
      }
    }
  Finally{
    F.Free;
  }
}

//PasScript
procedure btnAddEventOnClick(sender: tobject);
//新增事項
Var
  F:TUgWebForm;
  b:Boolean;
  e:string;
  s:String;
  v:variant;
Begin
  F:=GetEditorForm;
  Try
    F.Caption := UGMM.LT('新增事項');
    e:='';
    b:=True;
    While b do
    Begin
      if e<>'' then
      MessageDlg(e,mtError,mbOK);
      if F.ShowModal = mrOK then 
      Begin
        Try
          if TUgNumberEdit(F.FindComponent('edID')).Value = 0 then
            RaiseException(UGMM.LT('事項ID'));
          //新增到記憶體表
          cdsEvent.Append;
          v := TUgNumberEdit(F.FindComponent('edID')).Value;
          cdsEvent.FieldByName('Id').AsString := v;
          cdsEvent.FieldByName('Title').AsString   := TUgEdit(F.FindComponent('edTitle')).Text;
          cdsEvent.FieldByName('AllDay').AsBoolean := TUgCheckBox(F.FindComponent('edAllDay')).Checked;
          cdsEvent.FieldByName('StartStr').AsDateTime  := TUgDateTimePicker(F.FindComponent('edStartStr')).DateTime;
          cdsEvent.FieldByName('EndStr').AsDateTime    := TUgDateTimePicker(F.FindComponent('edEndStr')).DateTime;
          cdsEvent.FieldByName('Url').AsString  := TUgEdit(F.FindComponent('edUrl')).Text;
          cdsEvent.FieldByName('BackgroundColor').AsString := TUgEdit(F.FindComponent('edBackgroundColor')).Text;
          cdsEvent.FieldByName('BorderColor').AsString := TUgEdit(F.FindComponent('edBorderColor')).Text;
          cdsEvent.FieldByName('TextColor').AsString := TUgEdit(F.FindComponent('edTextColor')).Text;
          cdsEvent.Post;
          
          cdsEvent.SubmitUpdates;
          b := False;
        Except{ExceptionMessage}
          e:=ExceptionMessage;
        end;
      End else
        b:=False;
    End;
  Finally
    F.Free;
  end;
end;

// Make sure to add code blocks to your code group

• 4：btnEditTask-OnClick事件

  點選按鈕以打開編輯事項的界面。

//JScript
function btnEditEventOnClick(sender){
  var F=GetEditorForm;
  Try{
    F.Caption = UGMM.LT("修改任務");
    var e = "";
    var b = True;
    TUgNumberEdit(F.FindComponent("edId")).Value = cdsEvent.FieldByName("Id").AsInteger;
    TUgEdit(F.FindComponent("edTitle")).Text = cdsEvent.FieldByName("Title").AsString;
    TUgCheckBox(F.FindComponent("edAllDay")).Checked = cdsEvent.FieldByName("AllDay").AsBoolean;
    TUgDateTimePicker(F.FindComponent("edStartStr")).DateTime  = cdsEvent.FieldByName("StartStr").AsDateTime;
    TUgDateTimePicker(F.FindComponent("edEndStr")).DateTime    = cdsEvent.FieldByName("EndStr").AsDateTime;
    TUgEdit(F.FindComponent("edUrl")).Text  = cdsEvent.FieldByName("Url").AsString;
    TUgEdit(F.FindComponent("edBackgroundColor")).Text = cdsEvent.FieldByName("BackgroundColor").AsString;
    TUgEdit(F.FindComponent("edBorderColor")).Text = cdsEvent.FieldByName("BorderColor").AsString;
    TUgEdit(F.FindComponent("edTextColor")).Text = cdsEvent.FieldByName("TextColor").AsString;
    While (b){
      if (e != ""){
        MessageDlg(e,mtError,mbOK);
        }
      if (F.ShowModal == mrOK){ 
      Try{
          if (TUgNumberEdit(F.FindComponent("edId")).Value == 0)
            RaiseException(UGMM.LT("事項ID"));
          //新增到記憶體表
          cdsEvent.Edit;
          var v = TUgNumberEdit(F.FindComponent("edId")).Value;
          cdsEvent.FieldByName("Id").AsString = v;
          cdsEvent.FieldByName("Title").AsString   = TUgEdit(F.FindComponent("edTitle")).Text;
          cdsEvent.FieldByName("AllDay").AsBoolean = TUgCheckBox(F.FindComponent("edAllDay")).Checked;
          cdsEvent.FieldByName("StartStr").AsDateTime  = TUgDateTimePicker(F.FindComponent("edStartStr")).DateTime;
          cdsEvent.FieldByName("EndStr").AsDateTime    = TUgDateTimePicker(F.FindComponent("edEndStr")).DateTime;
          cdsEvent.FieldByName("Url").AsString  = TUgEdit(F.FindComponent("edUrl")).Text;
          cdsEvent.FieldByName("BackgroundColor").AsString = TUgEdit(F.FindComponent("edBackgroundColor")).Text;
          cdsEvent.FieldByName("BorderColor").AsString = TUgEdit(F.FindComponent("edBorderColor")).Text;
          cdsEvent.FieldByName("TextColor").AsString = TUgEdit(F.FindComponent("edTextColor")).Text;
          cdsEvent.Post;
          
          cdsEvent.SubmitUpdates;
          b = False;
        }
        Except{RaiseException(ExceptionMessage);}
        }else{
        b = False;
        }
      }
  }
  Finally{
    F.Free;
  }
}

//PasScript
procedure btnEditEventOnClick(sender: tobject);
//編輯事項
Var
  F:TUgWebForm;
  b:Boolean;
  e:string;
  s:String;
  v:variant;
Begin
  F:=GetEditorForm;
  Try
    F.Caption := UGMM.LT('修改任務');
    e:='';
    b:=True;
    TUgNumberEdit(F.FindComponent('edId')).Value := cdsEvent.FieldByName('Id').AsInteger;
    TUgEdit(F.FindComponent('edTitle')).Text := cdsEvent.FieldByName('Title').AsString;
    TUgCheckBox(F.FindComponent('edAllDay')).Checked := cdsEvent.FieldByName('AllDay').AsBoolean;
    TUgDateTimePicker(F.FindComponent('edStartStr')).DateTime  := cdsEvent.FieldByName('StartStr').AsDateTime;
    TUgDateTimePicker(F.FindComponent('edEndStr')).DateTime    := cdsEvent.FieldByName('EndStr').AsDateTime;
    TUgEdit(F.FindComponent('edUrl')).Text  := cdsEvent.FieldByName('Url').AsString;
    TUgEdit(F.FindComponent('edBackgroundColor')).Text := cdsEvent.FieldByName('BackgroundColor').AsString;
    TUgEdit(F.FindComponent('edBorderColor')).Text := cdsEvent.FieldByName('BorderColor').AsString;
    TUgEdit(F.FindComponent('edTextColor')).Text := cdsEvent.FieldByName('TextColor').AsString;
    While b do
    Begin
      if e<>'' then
      MessageDlg(e,mtError,mbOK);
      if F.ShowModal = mrOK then 
      Begin
        Try
          if TUgNumberEdit(F.FindComponent('edId')).Value = 0 then
            RaiseException(UGMM.LT('事項ID'));
          //新增到記憶體表
          cdsEvent.Edit;
          v := TUgNumberEdit(F.FindComponent('edId')).Value;
          cdsEvent.FieldByName('Id').AsString := v;
          cdsEvent.FieldByName('Title').AsString   := TUgEdit(F.FindComponent('edTitle')).Text;
          cdsEvent.FieldByName('AllDay').AsBoolean := TUgCheckBox(F.FindComponent('edAllDay')).Checked;
          cdsEvent.FieldByName('StartStr').AsDateTime  := TUgDateTimePicker(F.FindComponent('edStartStr')).DateTime;
          cdsEvent.FieldByName('EndStr').AsDateTime    := TUgDateTimePicker(F.FindComponent('edEndStr')).DateTime;
          cdsEvent.FieldByName('Url').AsString  := TUgEdit(F.FindComponent('edUrl')).Text;
          cdsEvent.FieldByName('BackgroundColor').AsString := TUgEdit(F.FindComponent('edBackgroundColor')).Text;
          cdsEvent.FieldByName('BorderColor').AsString := TUgEdit(F.FindComponent('edBorderColor')).Text;
          cdsEvent.FieldByName('TextColor').AsString := TUgEdit(F.FindComponent('edTextColor')).Text;
          cdsEvent.Post;
          
          cdsEvent.SubmitUpdates;
          b := False;
        Except{ExceptionMessage}
          e:=ExceptionMessage;
        end;
      End else
        b:=False;
    End;
  Finally
    F.Free;
  end;
end;

// Make sure to add code blocks to your code group

• 5：btnDeleteEvent-OnClick事件

  點選按鈕以刪除選擇的事項。

//JScript
function btnDeleteEventOnClick(sender){
  if (cdsEvent.IsEmpty) 
    RaiseException(UGMM.LT("沒有記錄無法刪除"));
  
  if (MessageDlg(UGMM.LT("注意：是否刪除該事項？"),mtWarning,mbYes + mbNo) == mrYes){
     cdsEvent.Delete;
     cdsEvent.SubmitUpdates;
  }
}

//PasScript
procedure btnDeleteEventOnClick(sender: tobject);
//刪除事項
begin
  if cdsEvent.IsEmpty then
  RaiseException(UGMM.LT('沒有記錄無法刪除'));
  
  if MessageDlg(UGMM.LT('注意：是否刪除該事項？'),mtWarning,mbYes + mbNo) = mrYes then
  Begin
     cdsEvent.Delete;
     cdsEvent.SubmitUpdates;
  end;
end;

// Make sure to add code blocks to your code group

• 6：btnCreateCalendar-OnClick事件

  點選以建立日曆。

//JScript
function btnCreateCalendarOnClick(sender){
  var EventObject = new TEventObject();
  UgFullCalendar01.RemoveEvents("");
  cdsEvent.First;
  while (!(cdsEvent.Eof)){ 
    EventObject.Id = cdsEvent.FieldByName("Id").AsString;
    EventObject.Title = cdsEvent.FieldByName("Title").AsString;
    EventObject.AllDay = cdsEvent.FieldByName("AllDay").AsBoolean;
    EventObject.StartStr = cdsEvent.FieldByName("StartStr").AsString;
    EventObject.EndStr = cdsEvent.FieldByName("EndStr").AsString;
    EventObject.Url = cdsEvent.FieldByName("Url").AsString;
    EventObject.BackgroundColor = cdsEvent.FieldByName("BackgroundColor").AsString;
    EventObject.BorderColor = cdsEvent.FieldByName("BorderColor").AsString;
    EventObject.TextColor = cdsEvent.FieldByName("TextColor").AsString;
    
    UgFullCalendar01.AddEvent(EventObject);
    cdsEvent.Next;
  }
  UgPageControl01.TabIndex = 1;
}

//PasScript
procedure btnCreateCalendarOnClick(sender: tobject);
//建立日曆
var
  EventObject: TEventObject;
begin
  EventObject := TEventObject.Create;
  UgFullCalendar01.RemoveEvents('');
  cdsEvent.First;
  while not cdsEvent.Eof do
  Begin
    EventObject.Id := cdsEvent.FieldByName('Id').AsString;
    EventObject.Title := cdsEvent.FieldByName('Title').AsString;
    EventObject.AllDay := cdsEvent.FieldByName('AllDay').AsBoolean;
    EventObject.StartStr := cdsEvent.FieldByName('StartStr').AsString;
    EventObject.EndStr := cdsEvent.FieldByName('EndStr').AsString;
    EventObject.Url := cdsEvent.FieldByName('Url').AsString;
    EventObject.BackgroundColor := cdsEvent.FieldByName('BackgroundColor').AsString;
    EventObject.BorderColor := cdsEvent.FieldByName('BorderColor').AsString;
    EventObject.TextColor := cdsEvent.FieldByName('TextColor').AsString;
    
    UgFullCalendar01.AddEvent(EventObject);
    cdsEvent.Next;
  End;
  UgPageControl01.TabIndex := 1;
end;

// Make sure to add code blocks to your code group

4. 運行結果

  使用滑鼠在FastWeb功能表，點選[儲存至資料庫]按鈕，將其儲存至資料庫，點選[除錯運行]確認能夠正常打開。

  在事項編輯的界面，可進行事項的新增、編輯、刪除等操作。點選 [產生月曆]，可看到事項在月曆中的展示情況。