STEP:01 はじめに


▼Smartyを使用したオンライン請求書作成フォームを作成します

Smartyの機能(プラグイン)を使用しプルダウンを生成します


商品データ(名称、金額等)を配列で指定する事により、自動で入力用のフォームが生成されます


生成されたフォームで各商品の個数を選択し会社名、支払期日を入力する事で
次ページで税込み合計金額まで含まれた請求書が生成されます


各商品別に選択可能な個数の最大値、商品別の単位の設定が可能です


会社名が未入力、もしくは商品の個数が1つも選択されていない場合にエラーとなります


STEP:02 設置方法


▼必要なファイルの作成

動作させる為に必要な

  • Smarty、請求書作成用プログラム「document.php
  • Smarty雛形用ディレクトリ「templates」、「templates_c
  • 雛形用ディレクトリtemplates以下に入力フォーム用HTML「form.html
  • 雛形用ディレクトリtemplates以下に請求書用HTML「document.html

1つのPHP、2つのディレクトリ、2つのHTMLを用意します


本マニュアルのsampleディレクトリ以下にファイルとフォルダが用意されています


※Smartyが事前にインストールされている必要があります

templates_cには書き込み権限が必要です


▼請求書作成用プログラムの作成「document.php

<?php
//  Smartyの読み込み
  require_once('Smarty.class.php');

//  税率を指定
  define("TAX",0.05);

//  現在の時間を取得
  define("TIME",time());

//  Smartyのインスタンス化
  $smarty = new Smarty();

//  雛形にてnumber_formatを使用する為、定義
  $smarty->register_modifier("number_format","number_format");

//  雛形等のディレクトリを指定
  $smarty->template_dir = './templates/';
  $smarty->compile_dir = './templates_c/';

//  商品データの取得
  $items = getItems();

//  商品別のプルダウンを作成
  $options = array();
  foreach($items as $key => $value){
  //  0からmaxで指定された数までの選択枝を作成
    for($i=0;$i<=$value["max"];$i++){
      $options[$key][$i] = $i?$i.$value["unit"]:"希望注文数を選択してください";
    }
  }


//  支払期限(年)のプルダウンを作成(翌年分まで)
  $year = array();
  for($i=date("Y",TIME);$i<=(date("Y",TIME)+1);$i++){
    $year[$i] = $i;
  }

//  支払期限(月)のプルダウンを作成
  $month = array();
  for($i=1;$i<=12;$i++){
    $month[$i] = $i;
  }

//  支払期限(日)のプルダウンを作成
  $day = array();
  for($i=1;$i<=31;$i++){
    $day[$i] = $i;
  }


//  作成ボタンが押された場合の処理
  $_post = $_POST;
  if($_post["next"] == 1){
    $item_count = array();
    if(is_array($_post["item_count"])){
    //  入力チェック(不正、想定外のデータを除外)
      foreach($_post["item_count"] as $id => $count){
        if(isset($items[$id]) && preg_match("/^[0-9]+$/",$count) && $count > 0 && $count <= $items[$id]["max"]){
          $item_count[$id] = $count;
        }
      }
    }
  //  入力チェックのフラグ
    $check = false;
    if(trim($_post["company"]) != ""){
    //  会社名をassign
      $smarty->assign("company",htmlspecialchars(trim($_post["company"])));
      $check = true;
    }

  //  日付プルダウンの選択状態をassign
    $smarty->assign("limit_year",(isset($year[$_post["limit_year"]])?$_post["limit_year"]:date("Y",TIME)));
    $smarty->assign("limit_month",(isset($month[$_post["limit_month"]])?$_post["limit_month"]:date("n",TIME)));
    $smarty->assign("limit_day",(isset($day[$_post["limit_day"]])?$_post["limit_day"]:date("j",TIME)));

  //  請求書用データ計算
    if($check && count($item_count)){
      $orderItems = array();
      $all = 0;
      foreach($item_count as $id => $count){
      //  商品データに注文数と商品別合計金額の追加
        $items[$id]["count"] = $count;
        $items[$id]["total"] = $count*$items[$id]["price"];
        $all += $items[$id]["total"];
        $orderItems[$id] = $items[$id];
      }

    //  税抜きの小計金額
      $smarty->assign("ALL",$all);
      $tax = floor($all*TAX);
    //  税
      $smarty->assign("TAX",$tax);

    //  税込みの合計金額
      $smarty->assign("ALL_TAX",$all+$tax);

    //  選択された商品一覧
      $smarty->assign("ORDER_ITEMS",$orderItems);

    //  請求書ページ表示
      $smarty->display("document.html");
      exit();
    }else{
    //  会社名が未入力、もしくは商品が選択されていなかった場合の処理
      $smarty->assign("item_count",$item_count);
      $smarty->assign("ERR",1);
    }
  }else{
  //  日付プルダウンのデフォルトの選択状態(当日)
    $smarty->assign("limit_year",date("Y",TIME));
    $smarty->assign("limit_month",date("n",TIME));
    $smarty->assign("limit_day",date("j",TIME));
  }

//  商品データのassign
  $smarty->assign("ITEMS",$items);
//  個数選択用のプルダウンのassign
  $smarty->assign("ITEMS_OPTIONS",$options);

//	日付用プルダウンのassgin
  $smarty->assign("year",$year);
  $smarty->assign("month",$month);
  $smarty->assign("day",$day);


//  フォームの表示
  $smarty->display("form.html");

//  商品データの取得
  function getItems(){
    $items = array(
          //  商品ごとに下記のような配列を作成します
            array(
                "name" => "○○サーバー",  //  商品名
                "price" => 247000,  //  単価(税抜) 1以上の半角数字で指定する必要があります
                "max" => 10,  //  注文可能最大数 1以上の半角数字で指定する必要があります
                "unit" => "台",  //  商品の単位
                "note" => "RAID対応、2Uサーバ",  //  備考
            ),
          //  2つ目の商品
            array(
                "name" => "増設用メモリ4G",  //  商品名
                "price" => 20000,  //  単価(税抜) 1以上の半角数字で指定する必要があります
                "max" => 10,  //  注文可能最大数 1以上の半角数字で指定する必要があります
                "unit" => "個",  //  商品の単位
                "note" => "○○サーバー専用",  //  備考
            ),
          //  3つ目の商品
            array(
                "name" => "17インチ・ディスプレイ",  //  商品名
                "price" => 10800,  //  単価(税抜) 1以上の半角数字で指定する必要があります
                "max" => 30,  //  注文可能最大数 1以上の半角数字で指定する必要があります
                "unit" => "台",  //  商品の単位
                "note" => "",  //  備考
            ),
          //  4つ目の商品
            array(
                "name" => "キーボード",  //  商品名
                "price" => 1980,  //  単価(税抜) 1以上の半角数字で指定する必要があります
                "max" => 50,  //  注文可能最大数 1以上の半角数字で指定する必要があります
                "unit" => "個",  //  商品の単位
                "note" => "マウスは付属していません",  //  備考
            ),
  //        配列データを増やすことにより商品を追加可能です
  //          array(
  //              "name" => "追加商品",  //  商品名
  //              "price" => 1000,  //  単価(税抜) 1以上の半角数字で指定する必要があります
  //              "max" => 10,  //  注文可能最大数 1以上の半角数字で指定する必要があります
  //              "unit" => "個",  //  商品の単位
  //              "note" => "サンプルが付属",  //  備考
  //          ),
        );
    $return = array();
    $i = 1;
    foreach($items as $key => $value){
      $value["id"] = $i;
      $value["tax"] = floor($value["price"]*TAX);
      $value["price_tax"] = $value["price"]+$value["tax"];
      $return[$i] = $value;
      $i++;
    }
    return $return;
  }

▼入力フォーム用のHTML作成「form.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>オンライン請求書</title>
<!--{literal}-->
<style type="text/css">
<!--
  table{
    border: solid 1px #999999;
    border-collapse: collapse;
  }
  th {
    padding: 5px;
    background: #F5F5F5;
    border: solid 1px #999999;
    text-align: center;
  }
  td {
    border: solid 1px #999999;
    padding: 5px;
    text-align: left;
  }

-->
</style>
<!--{/literal}-->
</head>
<body>
  <!-- エラー表示部 START -->
    {if $ERR}
      <p style="color:red;">未入力があります</p>
    {/if}
  <!-- エラー表示部 END -->
    <h1>オンライン請求書作成</h1>
  <!-- 入力フォーム表示部 START -->
  <table>
    <form action="./document.php" method="post">
    <tr>
      <th colspan="3">
        発行先社名<font size="2">(請求書に記載されます)</font>
      </th>
      <td colspan="3">
        <input type="text" name="company" value="{$company}" size="60" />
      </td>
    </tr>
    <tr>
      <th colspan="3">
        支払い期限
      </th>
      <td colspan="3">
        {html_options options=$year name="limit_year" selected=$limit_year}年
        {html_options options=$month name="limit_month" selected=$limit_month}月
        {html_options options=$day name="limit_day" selected=$limit_day}日
      </td>
    </tr>
    <tr>
      <th>商品名</th>
      <th>単価(税抜き)</th>
      <th>単価(税込み)</th>
      <th>在庫</th>
      <th>注文数</th>
      <th>備考</th>
    </tr>
  <!-- 商品データ表示部 START -->
  {foreach from=$ITEMS key=item_id item=value}
    <tr>
      <td>{$value.name}</td>
      <td style="text-align:right;">{$value.price|number_format}円 </td>
      <td style="text-align:right;">{$value.price_tax|number_format}円 </td>
      <td>{$value.max|number_format}{$value.unit} </td>
      <td>
        <!-- 個数選択用プルダウン表示部 START -->
        <select name="item_count[{$item_id}]">
          {html_options options=$ITEMS_OPTIONS.$item_id selected=$item_count.$item_id}
        </select>
        <!-- 個数選択用プルダウン表示部 END -->
      </td>
      <td>{$value.note} </td>
    </tr>
  {foreachelse}
  {/foreach}
  <!-- 商品データ表示部 END -->
    <tr>
      <td colspan="5" style="text-align:center;">
        <input type="submit" value="請求書を作成する" />
      </td>
    </tr>
    </table>
    <!-- データ送信を確認する為にパラメータを設定 -->
    <input type="hidden" value="1" name="next">
    </form>
  <!-- 入力フォーム表示部 END -->

</body>
</html>

▼請求書用のHTML作成「document.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>オンライン請求書</title>
</head>
<body>
<center>
  <table id="outside" width="630">
    <tr id="header">
      <td>
        <table width="100%" id="header_1" border="0">
          <tr>
            <td colspan="2" align="right">
              <font size="2"><u>発行日 {$smarty.now|date_format:"%Y年%m月%d日"}<!-- 現在の日付が表示されます --></u></font>
            </td>
          </tr>
          <tr>
            <td rowspan="2" width="370">
              <font size="6"><b><u>御 請 求 書</u></b></font>
            </td>
            <td>
              <font size="4"><b><u>株式会社 ○○○○</u></b></font>
            </td>
          </tr>
          <tr>
            <td>
              <font size="2">東京都○○区○○町○-○-○</font>
            </td>
          </tr>
          <tr>
            <td rowspan="2">
               
            </td>
            <td>
              <font size="2">○○ビル ○階</font>
            </td>
          </tr>
          <tr>
            <td>
              <font size="2">TEL:○○(○○○○)-○○○○</font>
            </td>
          </tr>
          <tr>
            <td rowspan="2">
              <font size="5"><b>{$company} 御中</b><!-- 入力された会社名が表示されます --></font>
            </td>
            <td>
              <font size="2">FAX:○○(○○○○)-○○○○</font>
            </td>
          </tr>
          <tr>
            <td>
              <font size="2">担当:○○ ○○○</font>
            </td>
          </tr>
        </table><!-- header_1 END -->
        <br />
        <table id="header_2" width="100%" border="0" cellspacing="0" style="border-collapse: collapse;">
          <tr>
            <td rowspan="2">
              <font size="2">平素よりご高配賜り、誠に有難うございます。<br />
              下記の通りご請求申し上げます。</font>
            </td>
            <td style="border:solid 1px #000000;" align="center" valign="center">
              部長
            </td>
            <td style="border:solid 1px #000000;" align="center" valign="center">
              担当
            </td>
          </tr>
          <tr>
            <td style="border:solid 1px #000000;" width="60" rowspan="3" align="center" valign="center">
              印<!-- 印の画像等を表示する等設定が可能です -->
            </td>
            <td style="border:solid 1px #000000;" width="60" rowspan="3" align="center" valign="center">
              印<!-- 印の画像等を表示する等設定が可能です -->
            </td>
          </tr>
          <tr>
            <td height="30">
              <font size="5">合計金額 <u> ¥{$ALL_TAX|number_format} </u></font><font size="3">(消費税含)</font>
            </td>
          </tr>
          <tr>
            <td height="30">
              <font size="4">お支払い期日 <u> {$limit_year}年{$limit_month}月{$limit_day}日 </u></font>
            </td>
          </tr>
        </table><!-- header_2 END -->
        <br />
      </td>
    </tr><!-- header END -->
    <tr id="main">
      <td>
        <table width="100%"  cellspacing="0" style="border-collapse: collapse;" id="main_1">
          <tr>
            <th style="border:solid 1px #000000;" bgcolor="#CCCCFF">品名</th>
            <th style="border:solid 1px #000000;" bgcolor="#CCCCFF">数量</th>
            <th style="border:solid 1px #000000;" bgcolor="#CCCCFF">単価</th>
            <th style="border:solid 1px #000000;" bgcolor="#CCCCFF">金額</th>
            <th style="border:solid 1px #000000;" bgcolor="#CCCCFF">備考</th>
          </tr>
        <!-- 注文データ表示部 START -->
        {foreach from=$ORDER_ITEMS key=item_id item=value}
          <tr>
            <td style="border:solid 1px #000000;"> {$value.name} </td>
            <td style="border:solid 1px #000000;"> {$value.count|number_format}{$value.unit} </td>
            <td style="border:solid 1px #000000;" align="right">{$value.price|number_format}円 </td>
            <td style="border:solid 1px #000000;" align="right">{$value.total|number_format}円 </td>
            <td style="border:solid 1px #000000;"> {$value.note} </td>
          </tr>
        {foreachelse}
        {/foreach}
        <!-- 注文データ表示部 END -->
          <tr>
            <td> </td>
            <td> </td>
            <td style="border:solid 1px #000000;" align="center"> 小  計 </td>
            <td style="border:solid 1px #000000;" align="right">{$ALL|number_format}円 </td>
            <td style="border:solid 1px #000000;"> </td>
          </tr>
          <tr>
            <td> </td>
            <td> </td>
            <td style="border:solid 1px #000000;" align="center"> 消 費 税 </td>
            <td style="border:solid 1px #000000;" align="right">{$TAX|number_format}円 </td>
            <td style="border:solid 1px #000000;"> </td>
          </tr>
          <tr>
            <td> </td>
            <td> </td>
            <td style="border:solid 1px #000000;" align="center"> 合  計 </td>
            <td style="border:solid 1px #000000;" align="right">  {$ALL_TAX|number_format}円 </td>
            <td style="border:solid 1px #000000;"> </td>
          </tr>
        </table><!-- main_1 END -->
      </td>
    </tr><!-- main END -->
    <tr id="footer">
      <td align="left">
        <br />
        <table id="footer_1" width="100%" cellspacing="0" style="border:solid 1px #000000;border-collapse: collapse;">
          <tr>
            <th style="border:solid 1px #000000;" rowspan="3" width="20%" valign="middle">
              振込口座
            </th>
            <td>
                ○○銀行 ○○支店
            </td>
          </tr>
          <tr>
            <td>
                当座 ○○○○○○
            </td>
          </tr>
          <tr>
            <td>
                カ)○○○○○○○○
            </td>
          </tr>
        </table>
        <br />
          恐れ入りますが、お振込手数料は御社でご負担いただけますようお願い申し上げます。
      </td>
    </tr><!-- footer END -->
  </table><!-- outside END -->

</center>

</body>
</html>

右上(HTML表示時)の○○で表記されている部分に御社の情報を入力してください


STEP:03 カスタマイズ


▼商品データの追加

下記のように配列を追加する事により商品の追加が簡単に行なえます

    $items = array(
          //  商品ごとに下記のような配列を作成します
            array(
                "name" => "○○サーバー",  //  商品名
                "price" => 247000,  //  単価(税抜) 1以上の半角数字で指定する必要があります
                "max" => 10,  //  注文可能最大数 1以上の半角数字で指定する必要があります
                "unit" => "台",  //  商品の単位
                "note" => "RAID対応、2Uサーバ",  //  備考
            ),
          //  2つ目の商品
            array(
                "name" => "増設用メモリ4G",  //  商品名
                "price" => 20000,  //  単価(税抜) 1以上の半角数字で指定する必要があります
                "max" => 10,  //  注文可能最大数 1以上の半角数字で指定する必要があります
                "unit" => "個",  //  商品の単位
                "note" => "○○サーバー専用",  //  備考
            ),
          //  3つ目の商品
            array(
                "name" => "17インチ・ディスプレイ",  //  商品名
                "price" => 10800,  //  単価(税抜) 1以上の半角数字で指定する必要があります
                "max" => 30,  //  注文可能最大数 1以上の半角数字で指定する必要があります
                "unit" => "台",  //  商品の単位
                "note" => "",  //  備考
            ),
          //  4つ目の商品
            array(
                "name" => "キーボード",  //  商品名
                "price" => 1980,  //  単価(税抜) 1以上の半角数字で指定する必要があります
                "max" => 50,  //  注文可能最大数 1以上の半角数字で指定する必要があります
                "unit" => "個",  //  商品の単位
                "note" => "マウスは付属していません",  //  備考
            ),
  //        配列データを増やすことにより商品を追加可能です
            array(
                "name" => "追加商品",  //  商品名
                "price" => 1000,  //  単価(税抜) 1以上の半角数字で指定する必要があります
                "max" => 10,  //  注文可能最大数 1以上の半角数字で指定する必要があります
                "unit" => "個",  //  商品の単位
                "note" => "サンプルが付属",  //  備考
            ),
  //        配列データを増やすことにより商品を追加可能です
            array(
                "name" => "追加商品",  //  商品名
                "price" => 1000,  //  単価(税抜) 1以上の半角数字で指定する必要があります
                "max" => 10,  //  注文可能最大数 1以上の半角数字で指定する必要があります
                "unit" => "個",  //  商品の単位
                "note" => "サンプルが付属",  //  備考
            ),
        );

当マニュアルに記載されているすべての社名および製品名はそれぞれの企業の商標もしくは登録商標です。

Copyright(C) 2000,2009 E-CLASSIS Inc. All Rights Reserved.