基礎から応用まで ~EC-CUBEカスタマイズの全て~ STEP1.1:商品登録・編集カスタマイズ 【アイピーロジック株式会社】

小髙 知彦

EC-CUBEの開発を始めたい方必見!
弊社で行っているEC-CUBE研修を紹介させていただきます。

今回は「STEP1.1:商品登録・編集カスタマイズ」を紹介します。

基礎から応用まで ~EC-CUBEカスタマイズの全て~ 序章
http://ecnomikata.com/column/detail.php?id=8635

課題紹介

研修課題は以下になります。

【課題】
管理画面の商品登録画面に全てのinput項目(text,select,radio,checkbox)を追加し、登録・更新できるようにする。

【追加項目】
text - メーカーコード
select - 配送種別(通常、大型、冷蔵、冷凍、その他)
radio - 保証期間(1ヶ月、3ヶ月、6ヶ月、12ヶ月)
checkbox - ギフト対応(包装、リボン、メッセージカード)

商品情報の項目追加を行う研修内容となっています。EC-CUBEには、商品に対して様々な管理項目を用意していますが、扱う商材や配送の仕方などによって項目の追加が必要になるケースが多いため、実装方法をしっかりと習得しましょう。

ポイント① 選択項目はマスターデータで管理する

EC-CUBEでは、select、radio、checkboxの選択肢はマスターデータで管理しています。新しい項目となりますので、マスターテーブルの追加が必要となります。MySQLに新しいマスターテーブルを作成しましょう。

▼配送種別マスター - mtb_delivery_type

▼保証期間マスター - mtb_warranty_period

▼ギフトマスター - mtb_gift


テーブルの構成は「ID」「名前」「表示順」の3項目です。マスターテーブルの作成が完了すると、管理画面「システム設定>マスターデータ管理」よりデータの追加が可能となります。早速データを登録してみましょう。

▼マスターデータ管理画面


次にPHPからマスターデータを取得するプログラムを書いてみましょう。商品登録のプログラムは data/class/pages/admin/products/LC_Page_Admin_Products_Product.php になります。エディタ等で開き、init関数のプログラムを見て下さい。以下のように書かれていると思います。
※init処理のみを抜粋しています。

▼商品登録PHP - LC_Page_Admin_Products_Product.php


注目すべきは、上記12~19行目になります。SC_DB_MasterDataクラスはマスターデータを操作するための汎用的なクラスになります。インスタンス化し、getMasterData関数の引数にマスターテーブル名を設定すると、マスターデータ内の値が配列で取得できます。取得後は商品登録ページに表示が必要なため、変数はクラス変数として定義してください。それでは、今回追加するマスターデータを取得してみましょう。下記21~24行目で追加項目のマスターデータを取得しています。

▼商品登録PHP - LC_Page_Admin_Products_Product.php


※注意点※
マスターデータを登録する際は、必ず「システム設定>マスターデータ管理」より登録を行って下さい。上記のgetMasterData関数は、マスターデータをdata/cache/マスター名.serial ファイルより取得しています。「システム設定>マスターデータ管理」からマスターデータを編集すると、必ずserialファイルも上書きされますので、SQLで直接編集することは避けたほうがよいです。

次に、取得したマスターデータを管理画面で表示させてみましょう。商品登録画面のSmartyテンプレートは、data/Smarty/templates/admin/products/product.tpl ファイルになります。任意の位置に、以下のプログラムを追加して下さい。

▼商品登録画面テンプレート - product.tpl


上記9~32行目までが選択項目になります。select項目のoption値は、上記15行目のように「html_options」関数を用いて定義します。options属性には、先ほどPHPでマスターデータを取得したクラス変数を定義します。radioやcheckboxも同様に、「html_radios」「html_checkboxes」関数を用いて定義します。実装後に下記の項目が追加されていれば成功です。
(select項目の選択肢も設定されていることを確認して下さい。)

▼商品登録画面(抜粋)


ポイント② Formクラスへの項目追加

管理項目を追加した場合、Formクラスへの項目追加が必要となります。LC_Page_Admin_Products_Product.php の lfInitFormParam関数を見て下さい。

▼商品登録PHP - LC_Page_Admin_Products_Product.php


$objFormParamは、data/class/SC_FormParam.php をインスタンス化した変数です。SC_FormParamクラスは、汎用的なFormクラスです。addParam関数で項目名、文字列長、全角/半角変換ルール、エラーチェック内容を定義し、setParam関数でPOST値の設定、convParam関数で文字列の全角/半角変換、checkError関数でエラーチェックを行います。画面から入力されたPOST値は、必ずSC_FormParamクラスを経由してデータ処理を行います。

追加項目は、上記64~68行目に定義しています。文字列長の「INT_LEN」「STEXT_LEN」は、「システム設定>パラメーター設定」で定義されている定数を用いています。全角/半角変換の「KVa」「n」は、mb_convert_kana関数の変換オプションになります。エラーチェックの「EXIST_CHECK」「NUM_CHECK」などは、data/class/SC_CheckError.php に関数が定義されていますので、どのような処理を行っているか確認してください。

【参考】mb_convert_kana - Manual - PHP
http://php.net/manual/ja/function.mb-convert-kana.php

ポイント③ 商品データ登録、更新

画面項目の追加を行いましたので、MySQLのテーブルにも追加が必要となります。以下、追加内容になります。

▼商品情報テーブル - dtb_products

▼商品ギフト設定テーブル - dtb_gift


dtb_productsテーブルは、商品の基本情報を格納するテーブルになります。text、select、radio項目はdtb_productsテーブルにカラムを追加します。checkbox項目については、複数選択が可能であるため、dtb_giftテーブルを新設し、dtb_productsと「n:1」の関係になるようにしています。

テーブルの設定が完了したら、まず「登録画面 -> 確認画面」までの遷移を実装しましょう。登録画面で「確認ページへ」ボタンを押下すると、LC_Page_Admin_Products_Product.php の action関数に大きなswitch文があると思いますが、$mode変数には「edit」が設定されます。editモードのプログラム中に遷移先である確認画面のSmartyテンプレートを下記のように定義しています。

$this->tpl_mainpage = 'products/confirm.tpl';

よって、確認画面のSmartyテンプレートが、data/Smarty/templates/admin/products/confirm.tpl であることが理解できると思います。確認画面の役割は、登録画面で入力および選択をしたデータの表示になります。任意の位置に、以下のプログラムを追加して下さい。

▼商品登録確認画面テンプレート - confirm.tpl


checkboxは複数選択が可能なため、foreachでループ処理を行っています。表示のみですので、特に難しいことはありませんが、各項目の変数の後ろに |h が付いていると思います。これは、サニタイジング(エスケープ)と言われ、クロスサイトスクリプティング(XSS)への対策となります。詳細は以下を参照して下さい。

【参考】サニタイジング(エスケープ)とは?HTML特殊文字を無害化しない事による脅威と対策のまとめ
http://viral-community.com/blog/html-sanitizing-escape-1859/

実装後、登録画面から確認画面に遷移し、登録画面で設定したデータが確認画面で表示確認できればOKです。

▼商品登録確認画面(抜粋)


確認画面までの遷移が確認できましたら、データベースへのデータ登録の実装を行いましょう。確認画面から完了画面までの遷移時には、$mode変数には「complete」が設定されます。データ登録はcompleteモードから呼び出される lfRegistProduct関数で行われます。

▼商品登録PHP - LC_Page_Admin_Products_Product.php


変更箇所は、上記33~36行目および145~147行目となります。33~36行目は、text、select、radioの項目値をデータベース登録/更新を行うための連想配列に設定しています。145~147行目については、checkboxの項目値を登録するための関数を呼び出しています。SC_Productクラスは、商品を扱うための汎用的なクラスです。setGift関数を追加しましたので、以下を確認してください。

▼商品汎用クラス - SC_Product.php


dtb_giftテーブルに対し、既存レコードのdelete後、新規レコードをinsertしています。SC_Queryクラスは、SQLの構築および実行を行ってくれる汎用クラスです。delete関数の引数には「テーブル名」「where条件」「プレースホルダへのバインド値」を設定し、insert関数の引数には「テーブル名」「カラム名と値の連想配列」を設定し実行します。

商品の登録が完了しましたら、画面およびデータベースから登録が成功しているか確認して下さい。

ポイント④ 戻る処理

確認画面から登録画面に戻った際に、以前に入力および選択したデータが保持されていなければなりません。そのため、confirm.tpl の上部にhidden項目を設定している部分があると思いますが、少し追加が必要になります。

▼商品登録確認画面テンプレート - confirm.tpl


追加箇所は、上記15~18行目になります。checkbox項目は複数選択が可能なため、配列でデータを保持しています。そのままhiddenで表示すると、value値が「array」となってしまうため、配列の要素を1つずつhidden項目として設定しています。

ポイント⑤ 商品一覧から編集モード、複製モードで遷移

最後になりますが、商品一覧画面から「編集」「複製」リンクを押下し、商品登録画面に遷移する際に、既存の商品のデータを検索し、編集画面を初期表示します。追加した項目についても検索する必要がありますので、プログラムの修正が必要になります。商品一覧から「編集」「複製」リンクを押下した場合、$mode変数には「pre_edit」「copy」が設定されます。商品の検索処理は、lfGetProductData_FromDB関数内で行われています。

▼商品登録PHP - LC_Page_Admin_Products_Product.php


上記9行目でSELECT句に「*」を指定していますので、text、select、radio項目については修正の必要がありません。checkbox項目はテーブルが異なりますので、上記54~56行目で検索を行っています。検索については、SC_ProductクラスにgetGift関数を追加しましたので、下記をご参照下さい。

▼商品汎用クラス - SC_Product.php


商品IDをキーに、ギフトIDを取得し返却しています。複数の商品を検索する作りになっていますが、これはフロントの商品一覧画面に表示を行うことを考慮したものですので、特にそのようなことを考える必要がない場合は、1商品の検索に対応した作りでも全く問題ありません。

次回

以上で「STEP1.1:商品登録・編集カスタマイズ」は終了となります。
次回は「STEP1.2:商品検索カスタマイズ」を紹介させていただきます。


著者

小髙 知彦 (Tomohiko Kodaka)

2000年、システムエンジニアとしてSI企業に新卒入社。オープン系、Web系における大小様々なシステム開発に携わった後、新人教育専任者として約200名のエンジニア育成に勤しむ。退社後、フリーエンジニアを経て、2013年にアイピーロジックに入社。ECサイト構築におけるプロジェクトマネージャー兼EC-CUBEエンジニアの育成責任者としても活躍中。

アイピーロジック株式会社:http://www.iplogic.co.jp/