4.3.4. ワークフロー画面の修正¶
「シンプルなワークフロー」テンプレートから作成した画面はワークフローで利用する１つの画面で作られています。しかし、テンプレートから生成された画面では、申請時で承認コメントや承認者が入力できてしまいます。そのままでも画面の利用は可能ですが、申請画面や処理画面などを判定し必要な項目のみを表示するように本章では、画面を修正していきます。アプリケーションの全体図だと、以下の色が塗られた箇所が対象です。
4.3.4.1. 入力、表示項目の修正¶
画面の入力、表示項目の修正を行います。修正前にをクリックし、生成された画面を確認します。
4.3.4.1.1. 入力項目の修正¶
まずは、 「承認コメント」と「承認者」の項目を申請時は非表示にするように修正します。画面上部の「Input Area」タブを選択します。画面左側の「レイアウト」 - 「ボックス」を選択し、一番下に追加します。画面右側に表示されている「画面構成」タブを選択します。
画面構成の一番下に先ほど追加した「ボックス」が追加されています。その、追加したボックスの配下に「承認コメント」、「承認者」のフィールドをドラッグ＆ドロップで移動します。
画面構成でボックスを選択した状態で「プロパティ」タブを開きます。「共通」 - 「表示/非表示」のラジオボタンで変数値を選択し、下記を入力します。「= $input.imwPageType != $constant.pageType.apply」
次に承認時のみ入力ができるように修正を行います。承認コメントのテキストエリア要素を選択します。「エレメント固有」 - 「readonly」を選択し、下記を入力します。「= $input.imwPageType != $constant.pageType.process」
承認者のテキスト入力要素を選択します。「エレメント固有」 - 「static」を変数値から固定値に変更します。「エレメント固有」 - 「readonly」を選択し、下記を入力します。「 = $input.imwPageType != $constant.pageType.process 」
4.3.4.1.2. 手動入力を制限する修正¶
次に、「提出日」、「申請者」の項目の手動入力を制限します。提出日の日付入力要素を選択し、プロパティタブを開きます。「エレメント固有」 - 「readonly」のラジオボタンで「固定値」を選択します。下部に表示されたチェックボックスにチェックを入れます。
申請者のテキスト入力要素を選択し、プロパティタブを開きます。「エレメント固有」 - 「readonly」のラジオボタンで固定値を選択します。下部に表示されたチェックボックスにチェックを入れます。
「プレビュー」をクリックし、 提出日、申請者が入力を受け付けなくなっていることを確認します。
4.3.4.2. アクションの修正¶
画面に動きをつけることのできるアクションの修正を行います。
4.3.4.2.1. 提出日の自動入力アクションを追加¶
提出日を自動で入力するように修正します。画面右側に表示されているアクションタブを選択します。をクリックします。
アクション名に「提出日の自動入力」と入力します。「標準」 - 「カスタムスクリプト」を右側のスペースへドラッグ＆ドロップします。下記を入力します。$variable.state.optionalParameter.userParameter.submission_date = new Date();次に、申請時のみ動作するように実行条件を追加します。アクションエディタ画面上部の実行条件タブを開きます。「標準」 - 「変数〇が〇のとき」を先ほど追加したカスタムスクリプトにドラッグ＆ドロップします。変数の右側にあるをクリックし、セレクタを表示させます。
「入力」の「$input > imwPageType」を選択します。右辺の「abc▼」をクリックし、変数値を選択します。表示された「定数」の「$constant > pageType > apply」を選択します。
4.3.4.2.2. 申請者の自動入力アクションを追加¶
申請者を自動で入力するように修正します。画面右側に表示されているアクションタブを選択します。
アクション名に「申請者の自動入力」と入力します。「標準」 - 「変数〇に〇を代入する」を右側のスペースへドラッグ＆ドロップします。変数の右側にある申請者の入力フォームに紐づいている「$variable > state > optionalParameter > userParameter > applicant」を選択します。右辺の「abc▼」をクリックし、変数値を選択します。表示された「環境」 から 「$env > userContext > userProfile > userName」 を選択します。次に、申請時のみ動作するように実行条件を追加します。アクションエディタ画面上部の実行条件タブを開きます。「標準」 - 「変数〇が〇のとき」を先ほど追加したカスタムスクリプトにドラッグ＆ドロップします。変数の右側にある「入力」の「$input > imwPageType」を選択します。右辺の「abc▼」をクリックし、変数値を選択します。表示された「定数」の「$constant > pageType > apply」を選択します。
4.3.4.2.3. Initializeアクションの修正¶
作成した2つのアクションを画面表示時に実行されるInitializeアクションに追加します。画面右側に表示されているアクションタブを選択します。Initializeアクションのをクリックします。
「標準」 - 「アクション〇を実行する」を右側下部のスペースへドラッグ＆ドロップします。作成した「提出日の自動入力」の「標準」 - 「アクション〇を実行する」を右側下部のスペースへドラッグ＆ドロップします。作成した「申請者の自動入力」の
