知識ベース

テキストフィールド

• "inputType": "テキスト入力"
  • 説明: 単純なフリーテキストフィールド
  • 例：

"text_input": {
    "title": "テキスト入力",
    "inputType": "textinput",
    "value": "フリーテキスト値",
    "info": "フリーテキストフィールド"
}

テキスト領域

• "inputType": "テキストエリア"
  • 説明: 長いテキスト入力用のテキストボックス。
  • 例：

"textarea_input": {
    "title": "テキストエリア",
    "inputType": "textarea",
    "value": "チェックしてください",
    "info": "エッセイのスペースが20%増えました。

複数のテキストフィールド

• "inputType": "複数テキスト入力"
  • 説明: ユーザーは、個別の値を持つ複数の入力テキストフィールドを追加できます。入力できる値の最大数を定義するために使用します maxValue 。
  • 例：

"multiple_text_input": {
    "title": "複数のテキスト入力",
    "inputType": "multiple-text-input",
    "value": [
        {
            "element": "Hello"
        },
        {
            "element": "World"
        }
    ],
    "maxValue": 4,
    "info": "最大 4 つの値が許可されます"
}

ドロップダウンフィールド

• "inputType": "ドロップダウン入力"
  • 説明: 選択可能なオプションを含むドロップダウンフィールド。 elements 特定の属性として使用して、ドロップダウン・オプションを表す匿名のJSO要素として目的の値を追加します。各要素には、名前と値が含まれている必要があります。
  • 例：

"bluetooth_connect_mode": {
    "title": "接続モード",
    "inputType": "dropdown-input",
    "value": "search",
    "elements": [
        {
            "name": "検索と検索",
            "value": "search"
        },
        {
            "name": "スキャンコード",
            "value": "scan"
        }
    ],
    "showIfComputed": true,
    "info": "『検索と検索』は、使用可能なすべてのデバイスを検出し、タイプに応じてフィルタリングします。「コードスキャン」を使用すると、デバイスのMACアドレスまたは名前をスキャンできます。

複数のドロップダウンフィールド

• "inputType": "複数のドロップダウン入力"
  • 説明: マルチレベルのドロップダウン入力フィールドを使用すると、ユーザーは同じドロップダウンフィールドの複数のインスタンスを追加して、注文に複数の値を選択できます。具体的な属性は次のとおりです。
    • maxValue を選択して、選択できる値の最大数を定義します
    • elements: ドロップダウン オプションを表す匿名の JSON 要素を追加します (各要素には名前と値が含まれている必要があります)。
  • 例：

"multiple_dropdown_input": {
            "title": "複数のドロップダウン入力",
            "inputType": "multiple-dropdown-input",
            "value": [
                {
                    "name": "表示値"
                },
                {
                     "name": "表示値 2"
                },
            ],
            "elements": [
                {
                    "name": "表示値"
                },
                {
                    "name": "表示値 2"
                },
                {
                    "name": "表示値 3"
                }
            ],
            "maxValue": 2
        }

チェックボックス

• "inputType": "チェックボックス入力"
  • 説明: ブール値のトグル入力
  • 例：

"checkbox_input": {
    "title": "チェックボックス入力",
    "inputType": "チェックボックス入力",
    "value": "true"
}

番号範囲

• "inputType": "範囲"
  • 説明: 数値範囲の入力
  • 例：

"range": {
    "title": "読み取り範囲",
    "inputType": "range",
    "rangeMin": "1",
    "rangeMax": "20",
    "value": 15
}

ファイルのアップロード

• "inputType": "ファイルのアップロード"
  • 説明: ユーザーが画像ファイルをアップロードできるようにします。
  • 例：

"sensor_type": {
    "inputType": "file-upload",
    "title": "アイコン",
    "accept": "image/png",
    "multiple": false,
    "showIf": "root.Value_1.sensor_shown.value"、
    "value": "xai:/ wf-editor / 2c639f9c-a3d5-4830-9e55-092fe98d92a4 / component_sensor_1563203048508_image001.png?version = 1"、
    "showIfComputed":true
}

カラーピッカー

• "inputType": "カラー入力"
  • 説明: 色を選択するための入力。ユーザーは、16進数のリストを定義して選択するか、完全なカラーピッカーを使用できます。
  • 例：

"color": {
    "inputType": "color-input",
    "title": "カラーピッカー",
    "list": [
        "#fcba03",
        "#1d6280"
    ],
    "showIfComputed": true,
    "value": "#fcba03"
}

マップ入力

• "inputType": "マップ入力"
  • 説明: マップのようにキーと値を関連付けるテキスト入力フィールド。デフォルトでは、テキストフィールドのプレースホルダーは「キー」と「値」になります。これらは、以下の例に示すように変更できます。
  • 例：

"headers": {
    "title": "HTTP ヘッダー",
    "inputType": "map-input",
    "placeholder": {
        "key": "ヘッダー名",
        "value": "ヘッダー値"
    },
    "value":
        [{
            "key": "Content-Type",
            "value": "application/json"
        },
        {
            "key": "Accept",
            "value": "application/json"
        }
    ]
}

マップ入力データを実際の Javascript マップに保存するには、次の方法に従います。

<setvar id="save_headers">
    <context_of>workflow</context_of>
    <context_update><
        param name="headers" type="object"><![CDATA[?{ var headers = { §{#each configuration.headers.value}§'§{key}§': '§{value}§',§{/each}§ }; headers }?]]></param>      
    </context_update>
</setvar です>

データソース入力

• "inputType": "データソースの選択"
  • 説明: Frontline Command Center にアップロードされたすべてのデータ ソースから選択できるドロップダウン フィールド。これにより、コンポーネントをさまざまなデータソースに動的に関連付けることができます。
  • 例：

"datasource": {
            "noOptionsInfo": "データソースが見つかりません!",
            "title": "データソース",
            "inputType": "datasource-selection",
            "revisionSelection": true,
            "required": true,
            "info": "使用するデータソースを選択してください。",
            "value": null
        }