コンテンツにスキップ

税率カテゴリの Storefront 表示テキスト

背景

軽減税率対象商品など、価格まわりに税区分の注記を出したい商品がある。 税率そのものは Vendure の TaxCategory(標準税率10% / 軽減税率8% / 非課税)で計算するが、 顧客向けの注記文言は税率カテゴリ単位で 1 度だけ設定し、そのカテゴリに属する全商品の 価格直下へ自動表示したい。税計算ロジックとは切り離した表示専用の自由テキストを正本として持つ。

要件

  • TaxCategory の public custom field storefrontNoticeLabel(型 string)を正本とし、 税率カテゴリごとに価格直下へ出す自由テキストを設定できること。例: 「※軽減税率適用商品」。
  • 表示テキストは税率カテゴリ単位で管理し、その税率カテゴリに属する商品すべてに適用すること。 商品単位の入力欄は設けない(DRY)。
  • storefrontNoticeLabel は表示専用であり、税計算・税率判定(TaxCategory 解決 / @ritsubi/plugins の tax helper)には一切影響しないこと。
  • Storefront の商品カード(ProductCard の default / compact 両 density)で、価格(ProductPriceSummary)の直下に表示すること。 表示値は当該商品の代表 variant(product.variants[0])の taxCategory.customFields.storefrontNoticeLabel を解決して使う。
  • Storefront の商品詳細(ProductHeaderSection)で、価格の直下に表示すること。 表示値は選択中 variant(selectedVariant)の taxCategory.customFields.storefrontNoticeLabel を解決して使う。
  • 値が未設定または空白のみの場合は、いずれの画面でも何も表示しないこと(既定文言は持たない)。
  • 表示は apps/storefront/src/components/product/tax-category-label.tsxProductTaxCategoryLabel を共通入口にし、カードと詳細で同じ描画ロジックを使うこと。
  • storefront 側では Shop API の ProductVariant.taxCategory.customFields.storefrontNoticeLabel を variant 選択へ含め、mapper(toStorefrontVariant)で StorefrontProductVariant.taxCategoryNotice に解決すること。
  • custom field の Dashboard ラベルは Storefront 表示テキスト とし、SMILE 由来ではない Vendure 編集前提のフィールドのため (SMILE SSoT)マーカーは付けず、自作 custom field の マーカーのみ(build() による自動付与)を持つこと。

受け入れ観点

  1. Vendure Dashboard の税率カテゴリ編集(/tax-categories/:id)で storefrontNoticeLabel を自由テキストで設定できる。
  2. storefrontNoticeLabel を設定した税率カテゴリに属する商品では、その文言が商品カード(default / compact)の価格直下に表示される。
  3. 同上の商品では、その文言が商品詳細の価格直下に表示される。
  4. storefrontNoticeLabel が未設定または空白のみの税率カテゴリの商品では、カード・詳細とも当該行が描画されない。
  5. storefrontNoticeLabel の有無や内容によって税込・税抜の計算結果や表示価格が変化しない(表示専用である)。