6.5.1.1 アクションのスクリプト(UIバージョン1.0)
Scriptのマニフェストファイル内のキー"file"で指定するスクリプトをあらかじめ作成する必要があります。スクリプトはJavaScriptで記述してください。以下に各コンポーネントでアクションが実行されるタイミングおよび呼び出される関数名の一覧を示します。お客様はスクリプト内に該当する関数名を定義し、アクションの内容を記述してください。
(表)各コンポーネントでの実行タイミングおよび関数名一覧(UIバージョン1.0)
| コンポーネント | アクションが実行される タイミング |
スクリプト内で 呼び出される関数名 |
関数の引数 | |
|---|---|---|---|---|
| データ形式 | 設定する値 | |||
| Grid | 画面の表示時 | handleLoad | - | - |
| Button | ボタンのクリック時 | handleClick | - | - |
| Form | 値の変更時 | handleChange | Object | 変更後の値 |
| 選択肢の変更時 | handleChange | Object | 変更後の値 | |
| チェックボックスのチェック変更時 | handleChange | boolean | 変更後の値 | |
| フォーカスを外した時 | handleBlur※ | - | - | |
| Table | セル値の変更時 | handleCellValueChange | string | 変更後の値 |
| 選択行の変更時 | handleSelectionModelChange | Array<string> | 選択行のID | |
以下に、アクションの内容を記述する際に使用可能である関数名の一覧を示します。
(表)アクションの内容を記述する際に使用可能である関数名一覧(UIバージョン1.0)
| クラス名 | 関数名 | 説明 |
|---|---|---|
| OIWindow | open | ページ、またはUIを開く。 |
| showMessage | スナックバー、またはメッセージダイアログを表示する。 | |
| refresh | フォーム、テーブルの表示データをリフレッシュする。 | |
| OIData | insertCurrentRecord | Ops I REST API graphqlを使用して、データベースの任意のテーブルにレコードを挿入する。 |
| getRecords | Ops I REST API graphqlを使用して、データベースの任意のテーブルのレコードを取得する。 | |
| updateCurrentRecord | Ops I REST API graphqlを使用して、データベースのテーブルの任意のレコードを更新する。 | |
| deleteCurrentRecord | Ops I REST API graphqlを使用して、データベースのテーブルの任意のレコードを削除する。 | |
| query | Ops I REST API graphqlを使用して、任意のGraphQLクエリを実行する。 | |
| OIApi | call | REST APIを実行する。 |
| OIForm | setStatus | フォームのフィールドのステータスを設定する。 |
| setHelperText | フォームのフィールドのヘルパーテキストを設定する。 | |
| removeHelperText | フォームのフィールドのヘルパーテキストを削除する。 | |
| OICommon | show | コンポーネントを表示する。 |
| hide | コンポーネントを隠す。 | |
| enable | コンポーネントを使用可能にする。 | |
| disable | コンポーネントを使用不可にする。 | |
| getComponent | 指定したコンポーネントの情報を取得する。 | |
| setComponent | 指定したコンポーネントの情報を更新する。 | |
| getUserProfile | ログインユーザーのプロファイルを取得する。 | |
| getDateWithUserTimezone | 現在日時をログインユーザーのタイムゾーンで取得する。 | |
| showLoadingScreen | ローディング画面を表示する。 | |
| hideLoadingScreen | ローディング画面の表示を解除する。 | |
| getLocation | 現在の文書の現在位置についての情報をWindow.locationで取得する。 | |
| OIWorkflow | respond | ワークフローに応答する。 |
| start | 指定されたコンテキストIDに関連するワークフローを実行する。 |
(1)OIWindow
OIWindowクラスの関数の詳細は以下の通りです。
(a)OIWindow.open
ページ、またはUIを開きます。
引数は下表の通りです。
(表)OIWindow.openの引数(UIバージョン1.0)
| データ形式 | 変数名 | 設定する値 | |
|---|---|---|---|
| string | type | "move"、"new_window"、"new_tab"のいずれかを指定する。
|
|
| Object | options | - | |
| string | url | typeが"move"、"new_window"、"new_tab"の場合、urlに表示するページのURLを指定する。 例){url:'/sys_task'} |
|
<戻り値>
戻り値はありません。
(b)OIWindow.showMessage
スナックバー、またはメッセージダイアログを表示します。
引数は下表の通りです。
(表)OIWindow.showMessageの引数(UIバージョン1.0)
| データ形式 | 変数名 | 設定する値 | |
|---|---|---|---|
| string | type | メッセージをスナックバーで表示する場合は"snackbar"、ダイアログで表示する場合は"modal"を指定する。 | |
| Object | options | - | |
| string | typeMess | typeが"snackbar"の場合、"error"、"warning"、"info"、"success"のいずれかを指定する。 typeが"modal"の場合は、ボタンを2つ表示し、どちらがクリックされたかを戻り値で受け取ることができる。 |
|
| string | content | 表示するメッセージを指定する。 | |
| string | title | typeが"modal"の場合、タイトルを指定する。 | |
| Object | btnOk | typeが"modal"の場合、第1ボタンのラベルに表示する内容を設定する。 | |
| string | btnCancel | typeが"modal"の場合、第2ボタンのラベルに表示する内容を設定する。 btnOk,btnCancelをどちらも省略した場合は[OK]ボタンが表示される。 |
|
<戻り値>
Typeに"modal"を指定した場合、第1ボタンがクリックされたときは"ok"、第2ボタンがクリックされたときは"cancel"を戻り値にPromise<string>型で設定します。
(c)OIWindow.refresh
フォーム、テーブルの表示データをリフレッシュします。
OIData.insertCurrentRecordで登録したデータやOIData.deleteCurrentRecordによるデータの削除をフォームやテーブルに反映する場合に使用します。
引数は下表の通りです。
(表)OIWindow.refreshの引数(UIバージョン1.0)
| データ形式 | 変数名 | 設定する値 | |
|---|---|---|---|
| string | type | リフレッシュするデータを"form"、"table"のいずれかで指定する。 | |
| string | name | リフレッシュする対象のコンポーネント名を指定する。 | |
<戻り値>
戻り値はありません。
(2)OIData
OIDataクラスの関数の詳細は以下の通りです。
(a)OIData.insertCurrentRecord
Ops I REST API graphqlを使用して、データベースの任意のテーブルにレコードを挿入します。
引数は下表の通りです。
(表)OIData.insertCurrentRecordの引数(UIバージョン1.0)
| データ形式 | 変数名 | 設定する値 | |
|---|---|---|---|
| Object | currentRecord | - | |
| string | table | レコードを挿入するテーブル名を指定する。 設定は必須である。 |
|
| Object | 挿入レコードのフィールド名 | 挿入レコードのフィールドに設定する値を指定する。 任意の数を指定できるが、挿入先テーブルのフィールド名と対応している必要がある。フィールドが文字列型の場合はstring、数値型の場合はnumberなど、設定する値はフィールドの型に合わせる。 |
|
| string | ctxId | 挿入するレコードと関連付けるコンテキストIDを指定する。 設定は必須である。 |
|
<戻り値>
Response BodyをPromise<Object>型で設定します。
(b)OIData.getRecords
Ops I REST API graphqlを使用して、データベースの任意のテーブルのレコードを取得します。
引数は下表の通りです。
(表)OIData.getRecordsの引数(UIバージョン1.0)
| データ形式 | 変数名 | 設定する値 | |
|---|---|---|---|
| string | tableName | 取得するレコードのテーブル名を指定する。 | |
| string | obj | レコード取得条件のGraphQLクエリを指定する。 例1)取得するフィールドを指定する場合:'{field1 field2}' 例2)指定したレコードIDと同じレコードのfield1, field2を取得する場合:'( where: { id: {_eq: "レコードID" } }){field1 field2}' |
|
<戻り値>
Response BodyをPromise<Object>型で設定します。
(c)OIData.updateCurrentRecord
Ops I REST API graphqlを使用して、データベースのテーブルの任意のレコードを更新します。
引数は下表の通りです。
(表)OIData.updateCurrentRecordの引数(UIバージョン1.0)
| データ形式 | 変数名 | 設定する値 | |
|---|---|---|---|
| Object | currentRecord | - | |
| string | table | 更新するレコードのテーブル名を指定する。 設定は必須である。 |
|
| string | id | 更新するレコードのIDを指定する。 設定は必須である。 |
|
| Object | 更新レコードのフィールド名 | 更新するレコードのフィールドに設定する値を指定する。 任意の数を指定できるが、更新先テーブルのフィールド名と対応している必要がある。フィールドが文字列型の場合はstring、数値型の場合はnumberなど、設定する値をフィールドの型に合わせる。 |
|
<戻り値>
Response BodyをPromise<Object>型で設定します。
(d)OIData.deleteCurrentRecord
Ops I REST API graphqlを使用して、データベースのテーブルの任意のレコードを削除します。
引数は下表の通りです。
(表)OIData.deleteCurrentRecordの引数(UIバージョン1.0)
| データ形式 | 変数名 | 設定する値 | |
|---|---|---|---|
| string | tableName | 削除するレコードのテーブル名を指定する。 | |
| string | currentId | 削除するレコードのIDを指定する。 | |
<戻り値>
Response BodyをPromise<Object>型で設定します。
(e)OIData.query
Ops I REST API graphqlを使用して、任意のGraphQLクエリを実行します。
引数は下表の通りです。
(表)OIData.queryの引数(UIバージョン1.0)
| データ形式 | 変数名 | 設定する値 | |
|---|---|---|---|
| Object | query | - | |
| string | query | 実行するGraphQLクエリを文字列で指定する。 | |
| Object | variables | GraphQLクエリに埋め込まれる変数を指定する。 | |
<戻り値>
Response BodyをPromise<Object>型で設定します。
(3)OIApi
OIApiクラスの関数の詳細は以下の通りです。
(a)OIApi.call
REST APIを実行します。
引数は下表の通りです。
| データ形式 | 変数名 | 設定する値 | |
|---|---|---|---|
| string | url | 実行するREST APIのURLを指定する。 指定するREST APIはResponse Bodyがjson形式である必要がある。 |
|
| Object | option | パラメータを指定する。 省略時は波括弧({})が設定される。 例){method: 'GET', headers: {'Content-Type': 'application/json'}} |
|
| boolean | showError | REST APIでエラーが発生した場合、エラー内容を画面に表示するか否かを指定する。 省略した場合、"true"が設定される。 |
|
<戻り値>
Response BodyをPromise<Object>型で設定します。
(4)OIForm
OIFormクラスの関数の詳細は以下の通りです。
(a)OIForm.setStatus
フォームのフィールドのステータスを設定します。
バリデーションエラーを出す機能があるフィールドタイプのみ対応します。
引数は下表の通りです。
(表)OIForm.setStatusの引数(UIバージョン1.0)
| データ形式 | 変数名 | 設定する値 | |
|---|---|---|---|
| string | field | ステータスを設定する対象のフィールド名を指定する。 | |
| string | status | ステータスを設定する。 "error"を設定するとエラー状態となり、それ以外はエラー状態が解除される。 |
|
<戻り値>
戻り値はありません。
(b)OIForm.setHelperText
フォームのフィールドのヘルパーテキストを設定します。
バリデーションエラーメッセージを出す機能があるフィールドタイプのみ対応します。
引数は下表の通りです。
(表)OIForm.setHelperTextの引数(UIバージョン1.0)
| データ形式 | 変数名 | 設定する値 | |
|---|---|---|---|
| string | field | ヘルパーテキストを設定する対象のフィールド名を指定する。 | |
| string | helperText | ヘルパーテキストを設定する。 | |
<戻り値>
戻り値はありません。
(c)OIForm.removeHelperText
フォームのフィールドのヘルパーテキストを削除します。
バリデーションエラーメッセージを出す機能があるフィールドタイプのみ対応します。
引数は下表の通りです。
(表)OIForm.removeHelperTextの引数(UIバージョン1.0)
| データ形式 | 変数名 | 設定する値 | |
|---|---|---|---|
| string | field | ヘルパーテキストを削除するフィールドの名前を指定する。 | |
<戻り値>
戻り値はありません。
(5)OICommon
OICommonクラスの関数の詳細は以下の通りです。
ただし「(a)OICommon.show」~「(f)OICommon.setComponent」では、対象コンポーネント名をOICommonクラスのコンストラクタの引数で指定します。
(a)OICommon.show
コンポーネントを表示します。
引数はありません。
<戻り値>
戻り値はありません。
(b)OICommon.hide
コンポーネントを隠します。
引数はありません。
<戻り値>
戻り値はありません。
(c)OICommon.enable
コンポーネントを使用可能にします。
引数はありません。
<戻り値>
戻り値はありません。
(d)OICommon.disable
コンポーネントを使用不可にします。
引数はありません。
<戻り値>
戻り値はありません。
(e)OICommon.getComponent
指定したコンポーネントの情報を取得します。
引数は下表の通りです。
(表)OICommon.getComponentの引数(UIバージョン1.0)
| データ形式 | 変数名 | 設定する値 | |
|---|---|---|---|
| Object | options | - | |
| boolean | allForm | "true"を指定した場合、OICommon(コンポーネント名)で指定したコンポーネントに加えて全フォームを取得する。 | |
<戻り値>
戻り値にPromise<Object>型で設定します。
コンポーネントが"form"の場合はワークフローの情報を設定し、"table"の場合は選択行のUUIDを設定します。
詳細は下表の通りです。
(表)OICommon.getComponentの戻り値(UIバージョン1.0)
| 指定した コンポーネント |
型 | 変数名 | 設定する値 |
|---|---|---|---|
| form | array | activities | 実行中または実行されたステップの情報(説明やステータス、定義など)のリスト 一度も実行されていないステップの情報は含まれない。 |
| Object | activitySelected | activitiesのうち、ステータスがPendingのステップの情報(説明やステータス、定義など) | |
| Object | context | ワークフローの情報(ステップやアサインされたユーザーなど) | |
| Object | current.table | formに表示しているレコードのデータ 辞書形式でkeyにテーブル名、valueにフィールドとデータの辞書が設定される。 |
|
| Object | currentActivity | 予約フィールド 常にnullが設定される。 |
|
| Object | schedule | ワークフローのスケジュールの情報 | |
| Object | workflow | manifest.yamlで定義したワークフローの情報 | |
| table | string | rowSelected | 選択しているテーブルの行のデータを識別するuuid |
(f)OICommon.setComponent
指定したコンポーネントの情報を更新します。
コンポーネントが"form"の場合のみ使用できます。valueにはgetComponentで取得できる戻り値のobjectを更新した値を指定します。
また更新できる値はobject.current.tableに設定されるレコードのデータの値のみです。それ以外の値は更新しません。
引数は下表の通りです。
(表)OICommon.setComponentの引数(UIバージョン1.0)
| データ形式 | 変数名 | 設定する値 | |
|---|---|---|---|
| Object | value | 更新する値を指定する。 | |
<戻り値>
戻り値はありません。
(g)OICommon.getUserProfile
ログインユーザーのプロファイルを取得するstatic関数です。
引数はありません。
<戻り値>
ログインユーザーのプロファイルをPromise<Object>型で設定します。
(h)OICommon.getDateWithUserTimezone
現在日時(YYYY-MM-DDTHH:mm:ssZ形式)をログインユーザーのタイムゾーンで取得するstatic関数です。
例)2022-09-21T15:36:20+09:00
引数はありません。
<戻り値>
ログインユーザーのタイムゾーンで取得した現在日時をstring型で設定します。
(i)OICommon.showLoadingScreen
ローディング画面を表示するstatic関数です。
表示されているローディング画面を解除する場合、showLoadingScreenの呼び出し回数と同数のhideLoadingScreenの呼び出しが必要です。
ボタンなどのユーザーによる操作の処理でOIData.insertCurrentRecord、OIWorkflow.respond、OIWorkflow.startなどデータ変更や実行を行う場合は、showLoadingScreenを実行して多重実行を防ぐ必要があります。
引数はありません。
<戻り値>
戻り値はありません。
(j)OICommon.hideLoadingScreen
ローディング画面の表示を解除するstatic関数です。
表示されているローディング画面を解除する場合、showLoadingScreenの呼び出し回数と同数のhideLoadingScreenの呼び出しが必要となります。
try-finally節など使用して、エラー時でもhideLoadingScreenが必ず呼ばれるようしてください。呼ばれない場合、ローディング画面のままとなり画面操作ができなくなります。
このメソッドを呼び出した際に、ローディング画面が表示されていない場合、このメソッドは画面に一切の影響を及ぼさず、正常に終了します。
引数はありません。
<戻り値>
戻り値はありません。
(k)OICommon.getLocation
現在の文書の現在位置についての情報をWindow.location(ブラウザー組み込みのWeb API)で取得するstatic関数です。
引数はありません。
<戻り値>
Window.locationで取得した情報をPromise<Object>型で設定します。
戻り値には以下の情報を設定します。戻り値の詳細はWindow.locationの仕様を確認してください。
- hash
- host
- hostname
- href
- origin
- pathname
- port
- protocol
- search
(6)OIWorkflow
OIWorkflowクラスの関数の詳細は以下の通りです。
(a)OIWorkflow.respond
ワークフローに応答します。
引数は下表の通りです。
(表)OIWorkflow.respondの引数(UIバージョン1.0)
| データ形式 | 変数名 | 設定する値 | |
|---|---|---|---|
| string | contextID | コンテキストID | |
| string | activityName | 返答するactivityName(ワークフロー定義中のtasksで指定されているタスク名) | |
| Object | params | 返答するアクションの内容として、"accept"、"reject"、"pull_back"、"cancel"のいずれかを指定する。 例) { "oi_response": "accept" } |
|
<戻り値>
実行結果をPromise<Object>型で設定します。
(b)OIWorkflow.start
指定されたコンテキストIDに関連するワークフローを実行します。
引数は下表の通りです。
(表)OIWorkflow.startの引数(UIバージョン1.0)
| データ形式 | 変数名 | 設定する値 | |
|---|---|---|---|
| string | contextID | コンテキストID | |
| Object | body | ワークフローに設定するパラメータの内容を指定する。 例) { "params": { "param1": "string", "param2": "string", "param3": "string" } } |
|
<戻り値>
実行結果をPromise<Object>型で設定します。
<定義例>
function handleClick() {
(async () => {
const oiCommon = new OICommon('lend_vm_form');
const formContext = await oiCommon.getComponent();
// 1. Update current record.
const table = formContext?.lend_vm_form?.current.table;
const tableName = Object.keys(table)[0];
const currentRecord = { …table[tableName]};
currentRecord.table = 'u_' + tableName;
const now = new Date();
const nowString
= now.getFullYear()
+ (now.getMonth() + 1).toString().padStart(2,"0")
+ now.getDate().toString().padStart(2,"0")
+ now.getHours().toString().padStart(2,"0")
+ now.getMinutes().toString().padStart(2,"0")
+ now.getSeconds().toString().padStart(2,"0");
var prefix = "";
if(currentRecord.sys_name == "order_mgt_sys"){
prefix= "XXX";
}else if(currentRecord.sys_name == "customer_mgt_sys"){
prefix= "YYY";
}
else{
prefix="ZZZ";
}
currentRecord.vm_name = prefix + nowString;
currentRecord.log_result = "VM生成時のログ結果を出力";
await OIData.updateCurrentRecord(currentRecord);
// 2.Respond to task.
const currentTaskname = formContext?.lend_vm_form?.activitySelected?.name;
const contextID = formContext?.lend_vm_form?.context?.id;
await OIWorkflow.respond(contextID,currentTaskname,
{
'oi_response': 'accept',
});
// 3.Transition to workflow list.
OIWindow.open('move', {'url': '/sys_task/workflow/workflow_list'});
})();
}