日付範囲
概要
Avonni Date Range コンポーネントは、開始日と終了日、または開始日時と終了日時を選択できる直感的なインターフェースを提供し、特定の期間を定義できます。これは一般的に、データのフィルタリング、レポートのパラメーター設定、スケジューリング、または特定の時間枠が必要なあらゆるシナリオで使用されます。
このコンポーネントは2つの入力フィールドを提示します。1つは希望する範囲の開始用、もう1つは終了用です。主な機能は次のとおりです。
日付および日付/時刻の選択： 完全な日付または特定の日付と時刻の値の選択をサポートします。
明確な範囲定義： ユーザーは選択した期間の開始と終了を簡単に確認・変更できます。
カスタマイズ可能な書式設定： 日付と時刻の表示スタイルを制御します。
カスタマイズ可能な入力ラベル： 開始と終了の入力フィールドのラベルを調整します。
ユースケース
データテーブル、リスト、またはチャートをフィルタリングして、選択した期間内のレコードを表示（例：「今四半期にクローズした商談」「先週作成されたケース」）。
レポート生成のための日付パラメーターを設定。
イベントやタスクをスケジュールするための開始・終了時刻を定義。
活動やプロジェクトの期間を記録。
プロモーションやオファーの有効期間を設定。
設定
キャンバス上の Date Range コンポーネントを選択すると、右側のプロパティパネルにそのプロパティが表示されます。
基本プロパティ
これらはラベリングと識別を扱います。
API名
AccountId equals {!inputAccountId}
コンポーネントインスタンスの一意の識別子。
ReportDateRange
ラベル
AccountId equals {!inputAccountId}
コンポーネントの上部または横に表示されるメインラベル。
「日付範囲を選択：」
フィールドレベルのヘルプ
テキスト（オプション）
ラベルの横に表示される追加のヘルプテキスト。
「フィルタリングする期間を選択してください。」
コア機能とデータバインディング
これらの設定は範囲の種類とデータの取得方法を定義します。
タイプ
選択：
日付：開始日/終了日を選択。 datetime：開始日時/終了日時を選択。 注： これは下記のアクティブな値プロパティに影響します。
開始日 値
日付変数（有効対象： 日付)
初期の開始日。ユーザーの選択を取得するために日付変数へバインドします。
終了日 値
日付変数（有効対象： 日付)
初期の終了日。ユーザーの選択を取得するために日付変数へバインドします。
開始日時 値
Datetime 変数（有効対象： datetime)
初期の開始日時。日付/時刻変数へバインドします。
終了日時 値
Datetime 変数（有効対象： datetime)
初期の終了日時。日付/時刻変数へバインドします。
外観と書式設定
これらのプロパティは視覚的な表示を制御します。
バリアント
選択：
ラベルの配置。
standard （上）、 label-hidden.
日付スタイル
選択：
日付の表示形式。
short (5/29/2025), medium （2025年5月29日）、 long （2025年5月29日 木曜日）。
時刻スタイル
選択（有効対象： datetime)
時刻の表示形式。
short （午前9:43）、 medium （午前9:43:00）、 long （午前9:43:00 EDT）。
日付/時刻入力ラベル
テキスト（開始/終了で別々）
入力フィールド用のカスタムラベル。
開始：「From:」、終了：「To:」。
動作プロパティ
これらの設定はユーザー操作とコンポーネントの状態に影響します。
無効（Disabled）
Boolean
コンポーネントを無効化（操作不可）。
読み取り専用（Read Only）
Boolean
値は表示するが変更は不可。
必須
Boolean
開始/終了の選択を必須にする。フォーム検証と連携。
Visible
Boolean
表示/非表示を切り替え。動的制御のためにブール変数へバインド。
例
データテーブルを商談のクローズ日でフィルタリング
商談をクローズ日でフィルタリングする手順：
データテーブルコンポーネントを追加
選択した日付に基づいて商談をフィルタリングして表示するため、Date Range コンポーネントの下にデータテーブルを統合する手順です。
コンポーネントをドラッグ： コンポーネントライブラリ（左パネル）から「Data Table」をキャンバスにドラッグし、Date Range コンポーネントの下に配置します。
クエリを作成： データテーブルのプロパティパネルで Avonni Query データソースを設定し、商談レコードを取得します（例：オブジェクトに「Opportunity」を選択）。
クエリフィルターを追加： Date Range の日付を使用するようにクエリのフィルターを設定：
フィルター1：CloseDate >= {!DateRange1.startDate}
フィルター2：CloseDate <= {!DateRange1.endDate}
ヒント： AND ロジックを使用し、日付が設定されている場合にのみ両方のフィルターが適用されるようにします。
列を追加： プロパティパネルの Columns セクションで、商談クエリからフィールド（例：Name、Amount、Stage、Close Date）を選択してテーブルに表示します。
結果： データテーブルはユーザーの日付選択でフィルタリングされた商談を表示し、変更に応じて動的に更新されます。
データテーブルの表示ルールを設定
（開始日または終了日が欠けていてフィルターが不完全な場合など）クエリエラーを伴うデータテーブルの表示を防ぐため、 表示ルールを構成します。これにより、Date Range コンポーネントで両方の日付が選択された場合にのみテーブルが表示されます。
結果： ユーザーの選択が変数を更新し、テーブルがリフレッシュされてフィルタ済みの商談を表示します。
結果： ユーザーが Date Range コンポーネントで新しい開始日または終了日を選択すると、その値によりデータテーブルのクエリが再フィルタリングをトリガーし、選択されたクローズ日範囲内の商談のみを表示します。
主な注意点
型の一致： 必ず
タイププロパティ（日付または datetime）が、値プロパティにバインドする変数のデータ型と一致していることを確認してください。タイムゾーン： を使用する場合は、
datetimeSalesforce がタイムゾーンをどのように処理するかに注意してください。選択された値は通常、ユーザーのローカルタイムゾーンになります。明確なラベル： メインの
ラベルとカスタム日付/時刻入力ラベルを効果的に使用して、ユーザーを案内してください。
まとめ
Avonni Date Range コンポーネントは、日付または日付/時刻の期間を選択するための使いやすい方法を提供します。開始値と終了値のプロパティを変数にバインドすることで、選択された範囲を用いてデータのフィルタリング、アクションのトリガー、または Salesforce UI の他の動的な側面を制御することが容易になります。
最終更新
役に立ちましたか？