愛招飛幫助手冊 愛招飛幫助手冊
  • FastERP-1
  • Smart
  • PinToo
  • FastWeb
  • FastERP-2 企業管理系統 (opens new window)
  • 印染業ERP (opens new window)
  • 工廠終端機 (opens new window)
  • TARS
  • MARS
  • TaskRunner
  • Flying
  • FastDesk
  • HiDesk
  • HiNAT
  • FastBPM
  • 設備故障診斷 (opens new window)
  • 設備最佳運轉效益 (opens new window)
  • 企業智能助手SmeGPT (opens new window)
  • 燈號管理 (opens new window)
  • 戰情室 (opens new window)
  • 能源管理 (opens new window)
  • 人車定位 (opens new window)
  • 戰情指揮系統 (opens new window)
  • FastERP-1
  • FastWeb
  • Smart
  • PinToo
  • Flying
  • TARS
  • 通用功能

    • Report
    • Script
    • Echarts
    • Chart
    • DB Install
  • FastERP-1
  • Smart
  • PinToo
  • FastWeb
  • FastERP-2 企業管理系統 (opens new window)
  • 印染業ERP (opens new window)
  • 工廠終端機 (opens new window)
  • TARS
  • MARS
  • TaskRunner
  • Flying
  • FastDesk
  • HiDesk
  • HiNAT
  • FastBPM
  • 設備故障診斷 (opens new window)
  • 設備最佳運轉效益 (opens new window)
  • 企業智能助手SmeGPT (opens new window)
  • 燈號管理 (opens new window)
  • 戰情室 (opens new window)
  • 能源管理 (opens new window)
  • 人車定位 (opens new window)
  • 戰情指揮系統 (opens new window)
  • FastERP-1
  • FastWeb
  • Smart
  • PinToo
  • Flying
  • TARS
  • 通用功能

    • Report
    • Script
    • Echarts
    • Chart
    • DB Install
  • FastWeb幫助主頁
  • 學習手冊

  • 開發手冊

    • 通訊協議

    • 互動輸出

      • 列印

      • 條碼

      • 圖表

        • Google圖表(WEB)
        • 甘特圖展示(WEB)
        • 商務月曆(WEB)
        • 時間線(WEB)
          • 1. 說明
          • 2. 設計明細
          • 3. 程式設計
            • 3.1. 程式初始設定
            • 3.2. 事件設定
          • 4. 運行結果
    • 媒體存取

    • 人工智慧

    • 實體運用

目录

時間線(WEB)

# FastWeb之時間線(WEB)

# 1. 說明

  本示例採用與資料庫結合的方式,將資料庫中的時間線事項顯示在時間線上從而實現時間線顯示的功能。在使用此示例前,請先檢查 節點資料庫 中的 FastWeb 連線設定是否有效。

  通過本範例學習,可以掌握 TUgTimeLine 的使用方法,並結合實體實現時間線展示的功能。

# 2. 設計明細

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

  1:TUgPageControl元件,控制元件名稱為UgPageControl01。

  2:TUgPanel元件,控制元件名稱為 UgPanel01。

  3:TUgButton元件,控制元件名稱為 btnAddLine。

  4:TUgButton元件,控制元件名稱為 btnEditLine。

  5:TUgButton元件,控制元件名稱為 btnDeleteLine。

  6:TUgButton元件,控制元件名稱為 btnCreateLine。

  7:TUgDBGrid元件,控制元件名稱為 UgDBGrid01。

  8:TUgClientDataSet元件,控制元件名稱為 cdsLine。

  9:TUgDataSource元件,控制元件名稱為 dsLine。

  10:在另一個標籤頁中的 TUgTimeLine元件,控制元件名稱為 UgTimeLine01。

  • UgWebRunFrame屬性設定

    • Height:設定頁面高度=600。
    • Width:設定頁面寬度=800。
  • 1: UgPageControl01屬性設定

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

      點選窗體結構與檢視器中的此控制元件,點選其左上角的新增圖示按鈕新增兩項 TabSheet。分別設定其 Caption 屬性為 時間線專案 與 時間線展示。

  • 2:UgPanel01屬性設定

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

    • Align:設定控制元件的對齊方式,設定為 alTop 。
    • Height:設定控制元件的高度,設定為 40。
  • 3:btnAddLine屬性設定

    • Caption:設定顯示的字幕內容,設定為新增時間線專案。
  • 4:btnEditLine屬性設定

    • Caption:設定顯示的字幕內容,設定為編輯時間線專案。
  • 5:btnDeleteLine屬性設定

    • Caption:設定顯示的字幕內容,設定為刪除時間線專案。
  • 6:btnCreateLine屬性設定

    • Caption:設定顯示的字幕內容,設定為產生時間線。
  • 7:UgDBGrid01屬性設定

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

    • Align:設定對齊方式,設定為alClient。
    • DataSource:設定數據來源,設定為 dsLine。
    • ReadOnly:設定表格是否為只讀,設定為 True。
  • 9:dsLine屬性設定

    • DataSet:設定繫結的數據集,設定為 cdsLine。
  • 10:UgTimeLine屬性設定

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

    • Align:設定對齊方式,設定為 alClient。

# 3. 程式設計

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

# 3.1. 程式初始設定

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

    //JScript
    function GetEditorForm(){
      Result = new TUgWebForm(UniApplication);
      Result.FreeOnClose = false;
      Result.Width = 530;
      Result.Height = 550;
      Result.Bordericons = biSystemMenu;
      
      var edId = new TUgEdit(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";
      edId.Enabled = false;
    
      var edTime = new TUgDateTimePicker(Result);
      edTime.Name = "edTime";
      edTime.Height = 22;
      edTime.Parent = Result;
      edTime.FieldLabel = UGMM.LT("日期");
      edTime.FieldLabelSeparator = "";
      edTime.FieldLabelAlign = laLeft;
      edTime.Align = alTop;
      edTime.Margins.Left = 8;
      edTime.Margins.Right = 8;
      edTime.AlignWithMargins = true;
      edTime.DateTime = StrToDateTime(FormatdateTime("yyyy-mm-dd",now()) + " 00:00:00");
      edTime.Kind = tUniDate; 
    
      var edHeader = new TUgEdit(Result);
      edHeader.Name = "edHeader";
      edHeader.Height = 22;
      edHeader.Enabled = true;
      edHeader.Parent = Result;
      edHeader.FieldLabel = UGMM.LT("標題");
      edHeader.FieldLabelSeparator = "";
      edHeader.FieldLabelAlign = laLeft;
      edHeader.Align = alTop;
      edHeader.Margins.Left = 8;
      edHeader.Margins.Right = 8;
      edHeader.AlignWithMargins = true;
      edHeader.EmptyText = UGMM.LT("請輸入標題");
    
      var edImg = new TUgEdit(Result);
      edImg.Name = "edImg";
      edImg.Height = 22;
      edImg.Enabled = true;
      edImg.Parent = Result;
      edImg.FieldLabel = UGMM.LT("圖片");
      edImg.FieldLabelSeparator = "";
      edImg.FieldLabelAlign = laLeft;
      edImg.Align = alTop;
      edImg.Margins.Left = 8;
      edImg.Margins.Right = 8;
      edImg.AlignWithMargins = true;
      edImg.EmptyText = UGMM.LT("請輸入圖片地址");
    
      var edDescr = new TUgHTMLMemo(Result);
      edDescr.Name = "edDescr";
      edDescr.Height = 315;
      edDescr.Enabled = true;
      edDescr.Parent = Result;
      edDescr.FieldLabel = UGMM.LT("描述");
      edDescr.FieldLabelSeparator = "";
      edDescr.FieldLabelAlign = laLeft;
      edDescr.Align = alTop;
      edDescr.Margins.Left = 8;
      edDescr.Margins.Right = 8;
      edDescr.AlignWithMargins = true;
      //edDescr.EmptyText:= UGMM.LT('背景顏色(css)');
      
      var edDir = TUgComboBox.Create(Result);
      edDir.Name = "edDir";
      edDir.Height = 22;
      edDir.Parent = Result;
      edDir.FieldLabel = UGMM.LT("方位");
      edDir.FieldLabelSeparator = "";
      edDir.FieldLabelAlign = laLeft;
      edDir.Align = alTop;
      edDir.Margins.Left = 8;
      edDir.Margins.Right = 8;
      edDir.AlignWithMargins = True;
      edDir.EmptyText = UGMM.LT("請選擇...");
      edDir.Items.CommaText = "left,right";
      edDir.Style = csDropDownList;
      
      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;  
    }
    
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    //PasScript
    Function GetEditorForm:TUgWebForm;
    Var
      edId: TUgEdit;
      edTime:TUgDateTimePicker;
      edHeader: TUgEdit;
      edImg: TUgEdit;
      edDescr: TUgHTMLMemo;
      edDir: TUgComboBox;
      btOk: TUgButton;
    Begin
      Result := TUgWebForm.Create(UniApplication);
      Result.FreeOnClose := False;
      Result.Width := 530;
      Result.Height := 550;
      Result.Bordericons :=biSystemMenu;
      
      edId:=TUgEdit.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';
      edId.Enabled := False;
    
      edTime:=TUgDateTimePicker.Create(Result);
      edTime.Name := 'edTime';
      edTime.Height := 22;
      edTime.Parent := Result;
      edTime.FieldLabel := UGMM.LT('日期');
      edTime.FieldLabelSeparator := '';
      edTime.FieldLabelAlign := laLeft;
      edTime.Align := alTop;
      edTime.Margins.Left := 8;
      edTime.Margins.Right := 8;
      edTime.AlignWithMargins := True;
      edTime.DateTime := StrToDateTime(FormatdateTime('yyyy-mm-dd',now()) + ' 00:00:00');
      edTime.Kind := tUniDate; 
    
      edHeader:=TUgEdit.Create(Result);
      edHeader.Name := 'edHeader';
      edHeader.Height := 22;
      edHeader.Enabled := true;
      edHeader.Parent := Result;
      edHeader.FieldLabel := UGMM.LT('標題');
      edHeader.FieldLabelSeparator := '';
      edHeader.FieldLabelAlign := laLeft;
      edHeader.Align := alTop;
      edHeader.Margins.Left := 8;
      edHeader.Margins.Right := 8;
      edHeader.AlignWithMargins := True;
      edHeader.EmptyText:= UGMM.LT('請輸入標題');
    
      edImg:=TUgEdit.Create(Result);
      edImg.Name := 'edImg';
      edImg.Height := 22;
      edImg.Enabled := true;
      edImg.Parent := Result;
      edImg.FieldLabel := UGMM.LT('圖片');
      edImg.FieldLabelSeparator := '';
      edImg.FieldLabelAlign := laLeft;
      edImg.Align := alTop;
      edImg.Margins.Left := 8;
      edImg.Margins.Right := 8;
      edImg.AlignWithMargins := True;
      edImg.EmptyText:= UGMM.LT('請輸入圖片地址');
    
      edDescr := TUgHTMLMemo.Create(Result);
      edDescr.Name := 'edDescr';
      edDescr.Height := 315;
      edDescr.Enabled := true;
      edDescr.Parent := Result;
      edDescr.FieldLabel := UGMM.LT('描述');
      edDescr.FieldLabelSeparator := '';
      edDescr.FieldLabelAlign := laLeft;
      edDescr.Align := alTop;
      edDescr.Margins.Left := 8;
      edDescr.Margins.Right := 8;
      edDescr.AlignWithMargins := True;
      
      edDir:=TUgComboBox.Create(Result);
      edDir.Name := 'edDir';
      edDir.Height := 22;
      edDir.Parent := Result;
      edDir.FieldLabel := UGMM.LT('方位');
      edDir.FieldLabelSeparator := '';
      edDir.FieldLabelAlign := laLeft;
      edDir.Align := alTop;
      edDir.Margins.Left := 8;
      edDir.Margins.Right := 8;
      edDir.AlignWithMargins := True;
      edDir.EmptyText:= UGMM.LT('請選擇...');
      edDir.Items.CommaText := 'left,right';
      edDir.Style := csDropDownList;
      
      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;
    
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    // Make sure to add code blocks to your code group

      初始化設定的相關程式。

      //JScript
        UGMM.LC(Self);
        UgPageControl01.TabIndex = 0;
        cdsLine.DataNodeName = "FastWeb";
        cdsLine.CommandText = "Select * from Task_TimeLine Order By Time DESC,header,dir";
        cdsLine.Open; 
        
        btnAddLine.OnClick = &btnAddLineOnClick;
        btnEditLine.OnClick = &btnEditLineOnClick;
        btnDeleteLine.OnClick = &btnDeleteLineOnClick;
        btnCreateLine.OnClick = &btnCreateLineOnClick;
      
      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      //PasScript
      procedure UgWebRunFrameOnAfterRunScript(const sender: tobject);
      begin
        UGMM.LC(Self);
      end;
      
      Begin
        UgPageControl01.TabIndex := 0;
        cdsLine.DataNodeName := 'FastWeb';
        cdsLine.CommandText := 'Select * from Task_TimeLine Order By Time DESC,header,dir';
        cdsLine.Open;  
      End.
      
      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      // Make sure to add code blocks to your code group

      # 3.2. 事件設定

      • 3:btnAddLine-OnClick事件

        點選以新增時間線專案。

        //JScript
        function btnAddLineOnClick(sender){
          var F = GetEditorForm;
          Try{
            F.Caption = UGMM.LT("新增時間線專案");
            var e = "";
            var b = true;
            While (b) {
              if (e != "") 
              MessageDlg(e,mtError,mbOK);
              TUgEdit(F.FindComponent("edID")).Text = UGMM.CreateGuid;
              if (F.ShowModal == mrOK){ 
              	Try{
                 if (TUgEdit(F.FindComponent("edID")).Text == "")
                    RaiseException(UGMM.LT("事項ID"));
                    
                  //新增到記憶體表
                  cdsLine.Append;
                  cdsLine.FieldByName("Id").AsString = TUgEdit(F.FindComponent("edId")).Text;
                  cdsLine.FieldByName("Time").AsDateTime  = TUgDateTimePicker(F.FindComponent("edTime")).DateTime;
                  cdsLine.FieldByName("Header").AsString  = TUgEdit(F.FindComponent("edHeader")).Text;
                  cdsLine.FieldByName("Img").AsString = TUgEdit(F.FindComponent("edImg")).Text;
                  cdsLine.FieldByName("Descr").AsString = TUgHTMLMemo(F.FindComponent("edDescr")).Lines.Text;
                  cdsLine.FieldByName("Dir").AsString = TUgComboBox(F.FindComponent("edDir")).Text;
                  cdsLine.Post;
                  
                  cdsLine.SubmitUpdates;
                  b = False;
                  }
                Except{RaiseException(ExceptionMessage);}
                }else
                b = False;
              }
          }
          Finally{
            F.Free;
          }
          cdsLine.Close;
          cdsLine.Open;
        }
        
        1
        2
        3
        4
        5
        6
        7
        8
        9
        10
        11
        12
        13
        14
        15
        16
        17
        18
        19
        20
        21
        22
        23
        24
        25
        26
        27
        28
        29
        30
        31
        32
        33
        34
        35
        36
        37
        38
        39
        40
        //PasScript
        procedure btnAddLineOnClick(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);
              TUgEdit(F.FindComponent('edID')).Text := UGMM.CreateGuid;
              if F.ShowModal = mrOK then 
              Begin
                Try
                  if TUgEdit(F.FindComponent('edID')).Text = '' then
                    RaiseException(UGMM.LT('事項ID'));
                  //新增到記憶體表
                  cdsLine.Append;
                  //v := UGMM.CreateGuid;
                  cdsLine.FieldByName('Id').AsString := TUgEdit(F.FindComponent('edId')).Text;
                  cdsLine.FieldByName('Time').AsDateTime  := TUgDateTimePicker(F.FindComponent('edTime')).DateTime;
                  cdsLine.FieldByName('Header').AsString  := TUgEdit(F.FindComponent('edHeader')).Text;
                  cdsLine.FieldByName('Img').AsString := TUgEdit(F.FindComponent('edImg')).Text;
                  cdsLine.FieldByName('Descr').AsString := TUgHTMLMemo(F.FindComponent('edDescr')).Lines.Text;
                  cdsLine.FieldByName('Dir').AsString := TUgComboBox(F.FindComponent('edDir')).Text;
                  cdsLine.Post;
                  
                  cdsLine.SubmitUpdates;
                  b := False;
                Except{ExceptionMessage}
                  e:=ExceptionMessage;
                end;
              End else
                b:=False;
            End;
          Finally
            F.Free;
          end;
          cdsLine.Close;
          cdsLine.Open;
        end;
        
        1
        2
        3
        4
        5
        6
        7
        8
        9
        10
        11
        12
        13
        14
        15
        16
        17
        18
        19
        20
        21
        22
        23
        24
        25
        26
        27
        28
        29
        30
        31
        32
        33
        34
        35
        36
        37
        38
        39
        40
        41
        42
        43
        44
        45
        46
        47
        48
        49
        50
        // Make sure to add code blocks to your code group
        • 4:btnEditLine-OnClick事件

          點選以打開選擇的專案的編輯時間線視窗。

          //JScript
          function btnEditLineOnClick(sender){
            var F = GetEditorForm;
            Try{
              F.Caption = UGMM.LT("修改時間線");
              var e = "";
              var b = true;
              TUgEdit(F.FindComponent("edId")).Text = cdsLine.FieldByName("Id").AsString;
              TUgEdit(F.FindComponent("edId")).Text = cdsLine.FieldByName("Id").AsString;
              TUgDateTimePicker(F.FindComponent("edTime")).DateTime = cdsLine.FieldByName("Time").AsDateTime;
              TUgEdit(F.FindComponent("edHeader")).Text = cdsLine.FieldByName("Header").AsString;
              TUgEdit(F.FindComponent("edImg")).Text = cdsLine.FieldByName("Img").AsString;
              TUgHTMLMemo(F.FindComponent("edDescr")).Lines.Text = cdsLine.FieldByName("Descr").AsString;
              TUgComboBox(F.FindComponent("edDir")).Text = cdsLine.FieldByName("Dir").AsString;
              While (b){
                if (e != "")
                MessageDlg(e,mtError,mbOK);
                if (F.ShowModal == mrOK){
                  Try{
                    if (TUgEdit(F.FindComponent("edId")).Text == "")
                      RaiseException(UGMM.LT("事項ID"));
                    //新增到記憶體表
                    cdsLine.Edit;
                    var v = TUgEdit(F.FindComponent("edId")).Text;
                    cdsLine.FieldByName("Id").AsString = v;
                    cdsLine.FieldByName("Time").AsDateTime  = TUgDateTimePicker(F.FindComponent("edTime")).DateTime;
                    cdsLine.FieldByName("Header").AsString  = TUgEdit(F.FindComponent("edHeader")).Text;
                    cdsLine.FieldByName("Img").AsString = TUgEdit(F.FindComponent("edImg")).Text;
                    cdsLine.FieldByName("Descr").AsString = TUgHTMLMemo(F.FindComponent("edDescr")).Lines.Text;
                    cdsLine.FieldByName("Dir").AsString = TUgComboBox(F.FindComponent("edDir")).Text;
                    cdsLine.Post;
                    
                    cdsLine.SubmitUpdates;
                    b = False;
                    }
                  Except{RaiseException(ExceptionMessage);}
                  } else
                  b = false;
                }
              }
            Finally{
              F.Free;
            }
            cdsLine.Close;
            cdsLine.Open;
          }
          
          1
          2
          3
          4
          5
          6
          7
          8
          9
          10
          11
          12
          13
          14
          15
          16
          17
          18
          19
          20
          21
          22
          23
          24
          25
          26
          27
          28
          29
          30
          31
          32
          33
          34
          35
          36
          37
          38
          39
          40
          41
          42
          43
          44
          45
          46
          //PasScript
          procedure btnEditLineOnClick(sender: tobject);
          //編輯時間線
          Var
            F:TUgWebForm;
            b:Boolean;
            e:string;
            s:String;
            v:variant;
          Begin
            F:=GetEditorForm;
            Try
              F.Caption := UGMM.LT('修改時間線');
              e:='';
              b:=True;
              TUgEdit(F.FindComponent('edId')).Text := cdsLine.FieldByName('Id').AsString;
              TUgEdit(F.FindComponent('edId')).Text := cdsLine.FieldByName('Id').AsString;
              TUgDateTimePicker(F.FindComponent('edTime')).DateTime  := cdsLine.FieldByName('Time').AsDateTime;
              TUgEdit(F.FindComponent('edHeader')).Text  := cdsLine.FieldByName('Header').AsString;
              TUgEdit(F.FindComponent('edImg')).Text := cdsLine.FieldByName('Img').AsString;
              TUgHTMLMemo(F.FindComponent('edDescr')).Lines.Text := cdsLine.FieldByName('Descr').AsString;
              TUgComboBox(F.FindComponent('edDir')).Text := cdsLine.FieldByName('Dir').AsString;
              While b do
              Begin
                if e<>'' then
                MessageDlg(e,mtError,mbOK);
                if F.ShowModal = mrOK then 
                Begin
                  Try
                    if TUgEdit(F.FindComponent('edId')).Text = '' then
                      RaiseException(UGMM.LT('事項ID'));
                    //新增到記憶體表
                    cdsLine.Edit;
                    v := TUgEdit(F.FindComponent('edId')).Text;
                    cdsLine.FieldByName('Id').AsString := v;
                    cdsLine.FieldByName('Time').AsDateTime  := TUgDateTimePicker(F.FindComponent('edTime')).DateTime;
                    cdsLine.FieldByName('Header').AsString  := TUgEdit(F.FindComponent('edHeader')).Text;
                    cdsLine.FieldByName('Img').AsString := TUgEdit(F.FindComponent('edImg')).Text;
                    cdsLine.FieldByName('Descr').AsString := TUgHTMLMemo(F.FindComponent('edDescr')).Lines.Text;
                    cdsLine.FieldByName('Dir').AsString := TUgComboBox(F.FindComponent('edDir')).Text;
                    cdsLine.Post;
                    
                    cdsLine.SubmitUpdates;
                    b := False;
                  Except{ExceptionMessage}
                    e:=ExceptionMessage;
                  end;
                End else
                  b:=False;
              End;
            Finally
              F.Free;
            end;
            cdsLine.Close;
            cdsLine.Open;
          end;
          
          1
          2
          3
          4
          5
          6
          7
          8
          9
          10
          11
          12
          13
          14
          15
          16
          17
          18
          19
          20
          21
          22
          23
          24
          25
          26
          27
          28
          29
          30
          31
          32
          33
          34
          35
          36
          37
          38
          39
          40
          41
          42
          43
          44
          45
          46
          47
          48
          49
          50
          51
          52
          53
          54
          55
          56
          // Make sure to add code blocks to your code group
          • 5:btnDeleteLine-OnClick事件

            點選以刪除選擇的時間線專案。

            //JScript
            function btnDeleteLineOnClick(sender){
              if (cdsLine.IsEmpty)
              RaiseException(UGMM.LT("沒有記錄無法刪除"));
              
              if (MessageDlg(UGMM.LT("注意:是否刪除該事項?"),mtWarning,mbYes + mbNo) == mrYes){
                 cdsLine.Delete;
                 cdsLine.SubmitUpdates;
              }
              cdsLine.Close;
              cdsLine.Open;
            }
            
            1
            2
            3
            4
            5
            6
            7
            8
            9
            10
            11
            12
            //PasScript
            procedure btnDeleteLineOnClick(sender: tobject);
            //刪除時間線
            begin
              if cdsLine.IsEmpty then
              RaiseException(UGMM.LT('沒有記錄無法刪除'));
              
              if MessageDlg(UGMM.LT('注意:是否刪除該事項?'),mtWarning,mbYes + mbNo) = mrYes then
              Begin
                 cdsLine.Delete;
                 cdsLine.SubmitUpdates;
              end;
              cdsLine.Close;
              cdsLine.Open;
            end;
            
            1
            2
            3
            4
            5
            6
            7
            8
            9
            10
            11
            12
            13
            14
            15
            // Make sure to add code blocks to your code group
            • 6:btnCreateLine-OnClick事件

              點選以建立時間線。

              //JScript
              function btnCreateLineOnClick(sender){
                UgTimeLine01.TimeLineHTML.Clear;
                Try{
                  var cdsLineCount = new TUgClientDataSet(nil);
                  cdsLineCount.DataNodeName = "FastWeb";
                  cdsLine.First;
                  while (!(cdsLine.Eof)){
                    //檢查是否為同一天的型別,如有則合併同類在一個線中進行顯示,否則就分開獨立顯示
                    LastDate = cdsLine.FieldByName("time").AsDateTime;
                    cdsLineCount.Close;
                    cdsLineCount.CommandText = "SELECT * FROM Task_TimeLine WHERE time = '" 
                    + cdsLine.FieldByName("time").AsString + "' and header = '" 
                    + cdsLine.FieldByName("header").AsString + "' and dir = '"
                    + cdsLine.FieldByName("dir").AsString + "'";
                    cdsLineCount.Open;
                    //ShowMessage(IntToStr(cdsLineCount.RecordCount));
                    if (cdsLineCount.RecordCount == 1){ 
                      UgTimeLine01.AddDD(FormatdateTime("mm-dd",cdsLine.FieldByName("time").AsDateTime),
                      cdsLine.FieldByName("header").AsString,
                      cdsLine.FieldByName("img").AsString,
                      cdsLine.FieldByName("descr").AsString,
                      cdsLine.FieldByName("dir").AsString);
                      cdsLine.Next;
                    }
                    if (cdsLineCount.RecordCount > 1 ){
                      UgTimeLine01.AddDD_Begin(FormatdateTime("mm-dd",cdsLine.FieldByName("time").AsDateTime),
                      cdsLine.FieldByName("header").AsString,
                      cdsLine.FieldByName("dir").AsString);
                      rcount = cdsLineCount.RecordCount;
                      while (rcount != 0){
                        UgTimeLine01.AddROW(cdsLine.FieldByName("img").AsString,
                        cdsLine.FieldByName("descr").AsString);
                        cdsLine.Next;
                        rcount = rcount - 1;
                        }
                      UgTimeline01.AddDD_End;
                      }
                    
                    //如果更新的月份與年份不同,則增加一個時間節點
                    if ((MonthOf(LastDate) != MonthOf(cdsLine.FieldByName("time").AsDateTime)) || 
                    (YearOf(LastDate) != YearOf(cdsLine.FieldByName("time").AsDateTime))){
                      UgTimeLine01.AddDT(FormatdateTime("yyyy-mm",LastDate));
                    }
                    }
                  UgTimeLine01.AddDT(FormatdateTime("yyyy-mm",LastDate));
                  UgTimeline01.LoadTimeLine;
                  UgPageControl01.TabIndex = 1;
                }
                Finally{
                  cdsLineCount.Free;
                }
              }
              
              1
              2
              3
              4
              5
              6
              7
              8
              9
              10
              11
              12
              13
              14
              15
              16
              17
              18
              19
              20
              21
              22
              23
              24
              25
              26
              27
              28
              29
              30
              31
              32
              33
              34
              35
              36
              37
              38
              39
              40
              41
              42
              43
              44
              45
              46
              47
              48
              49
              50
              51
              52
              53
              //PasScript
              procedure btnCreateLineOnClick(sender: tobject);
              //產生時間線的圖形
              var
                LastDate: TDateTime;
                cdsLineCount: TUgClientDataSet;
                rcount: Integer;
              begin
                UgTimeLine01.TimeLineHTML.Clear;
                Try
                  cdsLineCount := TUgClientDataSet.Create(nil);
                  cdsLineCount.DataNodeName := 'FastWeb';
                  cdsLine.First;
                  while not cdsLine.Eof do
                  Begin
                    //檢查是否為同一天的型別,如有則合併同類在一個線中進行顯示,否則就分開獨立顯示
                    LastDate := cdsLine.FieldByName('time').AsDateTime;
                    cdsLineCount.Close;
                    cdsLineCount.CommandText := 'SELECT * FROM Task_TimeLine WHERE time = ''' 
                    + cdsLine.FieldByName('time').AsString + ''' and header = ''' 
                    + cdsLine.FieldByName('header').AsString + ''' and dir = '''
                    + cdsLine.FieldByName('dir').AsString + '''';
                    cdsLineCount.Open;
                    //ShowMessage(IntToStr(cdsLineCount.RecordCount));
                    if cdsLineCount.RecordCount = 1 then 
                    Begin
                      UgTimeLine01.AddDD(FormatdateTime('mm-dd',cdsLine.FieldByName('time').AsDateTime),
                      cdsLine.FieldByName('header').AsString,
                      cdsLine.FieldByName('img').AsString,
                      cdsLine.FieldByName('descr').AsString,
                      cdsLine.FieldByName('dir').AsString);
                      cdsLine.Next;
                    End;
                    if cdsLineCount.RecordCount > 1 Then
                    Begin
                      UgTimeLine01.AddDD_Begin(FormatdateTime('mm-dd',cdsLine.FieldByName('time').AsDateTime),
                      cdsLine.FieldByName('header').AsString,
                      cdsLine.FieldByName('dir').AsString);
                      rcount := cdsLineCount.RecordCount;
                      while rcount <> 0 do
                      Begin
                        UgTimeLine01.AddROW(cdsLine.FieldByName('img').AsString,
                        cdsLine.FieldByName('descr').AsString);
                        cdsLine.Next;
                        rcount := rcount - 1;
                      End;
                      UgTimeline01.AddDD_End;
                    End;
                    
                    //如果更新的月份與年份不同,則增加一個時間節點
                    if (MonthOf(LastDate) <> MonthOf(cdsLine.FieldByName('time').AsDateTime)) or 
                    (YearOf(LastDate) <> YearOf(cdsLine.FieldByName('time').AsDateTime))  Then
                    Begin
                      UgTimeLine01.AddDT(FormatdateTime('yyyy-mm',LastDate));
                    End;
                  End;
                  UgTimeLine01.AddDT(FormatdateTime('yyyy-mm',LastDate));
                  UgTimeline01.LoadTimeLine;
                  UgPageControl01.TabIndex := 1;
                Finally
                  cdsLineCount.Free;
                end;
              end;
              
              1
              2
              3
              4
              5
              6
              7
              8
              9
              10
              11
              12
              13
              14
              15
              16
              17
              18
              19
              20
              21
              22
              23
              24
              25
              26
              27
              28
              29
              30
              31
              32
              33
              34
              35
              36
              37
              38
              39
              40
              41
              42
              43
              44
              45
              46
              47
              48
              49
              50
              51
              52
              53
              54
              55
              56
              57
              58
              59
              60
              61
              62
              63
              // Make sure to add code blocks to your code group

              # 4. 運行結果

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

                在時間線專案標籤頁中,可對時間線專案進行新增、編輯、刪除等操作,點選 [建立時間線],在時間線展示中可顯示對應的時間線。

              商務月曆(WEB)
              網路文件瀏覽(WEB)

              ← 商務月曆(WEB) 網路文件瀏覽(WEB)→

              Copyright © 2021-2025 愛招飛IsoFace | ALL Rights Reserved
              • 跟随系统
              • 浅色模式
              • 深色模式
              • 阅读模式