April 2018 – Page 14 – ソフトウェアエンジニアの技術ブログ：Software engineer tech blog

tableにスケジュールを入れていく2

$timelist = array(540, 570, 600, 630, 660, 690, 780, 810, 840, 870, 900, 930, 960, 990, 1020);
$list = array("予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可");
$list1 = array("予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可");
$list2 = array("予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可");
$charge = array('松島','小野','草野');

foreach($result as $value){
	if($value['charge'] == $charge[0]){
		for($i=0; $i < count($timelist); $i++){
		if($timelist&#91;$i&#93; >= $value['time1'] and $timelist[$i] < $value&#91;'time2'&#93;){
			 $list&#91;$i&#93; = "×";
		}
	   }
	} elseif($value&#91;'charge'&#93; == $charge&#91;1&#93;){
		for($i=0; $i < count($timelist); $i++){
		if($timelist&#91;$i&#93; >= $value['time1'] and $timelist[$i] < $value&#91;'time2'&#93;){
			 $list1&#91;$i&#93; = "×";
		}
	   } 
	}elseif($value&#91;'charge'&#93; == $charge&#91;2&#93;){
		for($i=0; $i < count($timelist); $i++){
		if($timelist&#91;$i&#93; >= $value['time1'] and $timelist[$i] < $value&#91;'time2'&#93;){
			 $list2&#91;$i&#93; = "×";
		}
	  }
	 }
}

?>
<style>
#tbl-bdr table,#tbl-bdr td,#tbl-bdr th {
border-collapse: collapse;
border: 1px solid #000000;
}
table td{
	width:45px;
}
</style>

<br>
<div id="tbl-bdr">
<table>
<tr>
<td></td><td>9:00~</td><td>9:30~</td><td>10:00~</td><td>10:30~</td><td>11:00~</td><td>11:30~</td><td>13:00~</td><td>13:30~</td><td>14:00~</td><td>14:30~</td><td>15:00~</td><td>15:30~</td><td>16:00~</td><td>16:30~</td><td>17:00~</td>
</tr>
<tr>
<td><?php echo $charge&#91;0&#93;; ?></td>
<?php
	foreach($list as $value){
		echo "<td>". $value."</td>";
	}	
?>
</tr>
<tr>
<td><?php echo $charge&#91;1&#93;; ?></td>
<?php
	foreach($list1 as $value){
		echo "<td>". $value."</td>";
	}	
?>
</tr>
<tr>
<td><?php echo $charge&#91;2&#93;; ?></td>
<?php
	foreach($list2 as $value){
		echo "<td>". $value."</td>";
	}	
?>
</tr>
</table>

表示はこれでほぼOK(最終版は、現在時刻以降を表示したい)なんだが、これ、どうやって書くんだ？？

あ、$listはfor文の中に書いて、かつ、tdもfor文で回すのか？？？

名前ごとにforeachを回す仕様に書き換えました。

<style>
#tbl-bdr table,#tbl-bdr td,#tbl-bdr th {
border-collapse: collapse;
border: 1px solid #000000;
}
table td{
	width:45px;
}
</style>

<br>
<div id="tbl-bdr">
<table>
<tr>
<td></td><td>9:00~</td><td>9:30~</td><td>10:00~</td><td>10:30~</td><td>11:00~</td><td>11:30~</td><td>13:00~</td><td>13:30~</td><td>14:00~</td><td>14:30~</td><td>15:00~</td><td>15:30~</td><td>16:00~</td><td>16:30~</td><td>17:00~</td>
</tr>
<?php 
$charge = array('松島','小野','草野');

foreach($charge as $value){
 echo "<tr><td>".$value. "</td>";

 $timelist = array(540, 570, 600, 630, 660, 690, 780, 810, 840, 870, 900, 930, 960, 990, 1020);
 $list = array("予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可");

	 foreach($result as $result1){
		if($result1['charge'] == $value){
			for($i=0; $i < count($timelist); $i++){
			if($timelist&#91;$i&#93; >= $result1['time1'] and $timelist[$i] < $result1&#91;'time2'&#93;){
				 $list&#91;$i&#93; = "×";
			} 
		  }
		}
	 }

	 foreach($list as $value){
	 	echo "<td>".$value."</td>";
	 }
 echo "</tr>";
}
?>
</table>

お！

formから草野さんに予約を入れます。

WoW！
次は、本日出勤の担当者のみ表示できるようにしたいですね。
mysql側で欠勤スケジュールのテーブルおよびdatepickerのformをつくります。

セル毎にデフォルトは〇、if文でその時間帯が開始時間と終了時間の間であれば×を計算でしょうか。
いや、予約が入っているところだけ、計算した方が速いような気がします。
なんか凄い難しいぞ。
あ、仮置きで、9:00->a 9:30->b, 10:00->c, 10:30->d .. として、aが〇か×か判定の判定をfor文で回せばいいのでしょうか？　いや、for文で回すと$iと$jを入れ子で回すので、担当者のid(テーブル)を作る必要がありそうです。

あ、こういうことですかね？

$timelist = array(540, 570, 600, 630, 660, 690, 780, 810, 840, 870, 900, 930, 960, 990, 1020);

for($i=0; $i < count($timelist); $i++){
	if($timelist&#91;$i&#93; >= $result[0]['time1'] and $timelist[$i] < $result&#91;0&#93;&#91;'time2'&#93;){
		echo "予約あり<br>";
	}else{
		echo "予約なし<br>";
	}
}

小野:10:00～11:00 (60分)
予約なし
予約なし
予約あり
予約あり
予約なし
予約なし
予約なし
予約なし
予約なし
予約なし
予約なし
予約なし
予約なし
予約なし
予約なし

修正します。

$timelist = array(540, 570, 600, 630, 660, 690, 780, 810, 840, 870, 900, 930, 960, 990, 1020);
$list = array("予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可","予約可");

foreach($result as $value){
	for($i=0; $i < count($timelist); $i++){
	if($timelist[$i] >= $value['time1'] and $timelist[$i] < $value['time2']){
		 $list[$i] = "×";
	}
 }
}

a little close?

更に修正

今日の予約状況を表示する

order by time1 ascで予約の早い時間から表示する

<?php

$date = date("Y年m月d日");
$week = array( "日", "月", "火", "水", "木", "金", "土" );
$today = $date."(".$week&#91;date("w")&#93;.")";
echo "本日の予約状況(".$today.")<hr>";

$dsn = "mysql:dbname=reserve;host=localhost";
$user = "hoge";
$password = "hogehoge";	 
try {
    $dbh = new PDO($dsn, $user, $password);
} catch (PDOException $e){
    print('connection failed:'.$e->getMessage());
} 

$sql = "select * from masters where day = '".$today."' order by time1 asc";
$stmt = $dbh->query($sql);
 
$result = $stmt->fetchAll(PDO::FETCH_ASSOC);

foreach($result as $value){
	$t1h = floor($value['time1'] / 60);
	$t1m = $value['time1'] % 60;
	if(!$t1m == NUll ){
		$t1 = $t1h.":".$t1m;
	}else{
		$t1 = $t1h.":00";
	}
	$t2h = floor($value['time2'] / 60);
	$t2m = $value['time2'] % 60;
	if(!$t2m == NUll ){
		$t2 = $t2h.":".$t2m;
	}  else {
		$t2 = $t2h.":00";
	}
	echo $value['charge']. ":".$t1."～".$t2." ".$value['name']."様<br>";
}

ホットペッパーのような〇×のマトリックスを横軸で作りたいですね。

ソースを見ると、普通にtable tr tdのようです。

予約時間のバリデーション

予約希望が入った場合は、whereでその日の担当者の予約済時間帯を参照する。
希望開始時間が予約済開始時間～予約済終了時間の間、もしくは、
希望終了時間が予約済開始時間～予約済終了時間の間の場合は、予約できないようにする。

　　　　$validation = 0;
　　　　$sql = "select * from masters where day = '".$day."' and charge = '".$charge."'";
	$stmt = $dbh->query($sql);
	 
	$result = $stmt->fetchAll(PDO::FETCH_ASSOC);
　
	foreach($result as $value){
		if($time1 >= $value["time1"] and $time1 <= $value&#91;"time2"&#93;){
			$validation = 1;
		} elseif($time2 >= $value["time1"] and $time2 <= $value&#91;"time2"&#93;){
			$validation = 1;
		}
	}
&#91;/php&#93;


viewはif, elseifで表示を切り分ける。
&#91;php&#93;
<?php if($validation == 0): ?>
<?php elseif($validation == 1): ?>
<?php endif; ?>

予約済み時間との間を30分あける場合などは、$time1 >= $value[“time1”] and $time1 <= $value["time2"]を変更すればよい。あれ？　思ってたより直ぐできた？

次は予約一覧の表示ですね。

メールアドレスのバリデーション

function check(){
	var flag = 0;
	if(!document.form.mail.value.match(/.+@.+\..+/)){
		flag = 1;
	}
	if(flag){
		window.alert('メールアドレスが正しくありません');
		return false;
	} else{
		true;
	}
}

pdoで予約情報をmysqlに格納する

■mysql側
まず、テーブルを作ります。
1.管理画面側で予約情報をcake.phpで閲覧できるようにしたいので、テーブル名は複数にします。
2.いたずらの予約が複数回あった場合は、そのipアドレスをhtaccessでアクセス制御できるようにしたいので、ipアドレスと、user agentのカラムを作ります。
3.予約送信時間の型は、yyyy-mm-ddではなくyyyy-mm-dd h:i:sなので、dateではなくdatetimeにします。(間違えました)
4.管理者画面で後からメモをinsert出来るようにしたいので、memoのカラムを作ります。

create table reserve.masters(
        id int unsigned auto_increment primary key,
        day varchar(255),
	time1 varchar(41),
	time2 varchar(41),
	course varchar(41),
	charge varchar(41),
	name varchar(41),
	mail varchar(41),
	ip varchar(255),
	useragent varchar(255),
	created datetime,
	memo varchar(255)
);

■php側
普通のpdoです。REMOTE_ADDRとHTTP_USER_AGENTでユーザー情報を取得しています。

$start = $_POST['stime'];
	$end = $_POST['etime'];

	$ip = $_SERVER['REMOTE_ADDR'];
	$useragent = $_SERVER['HTTP_USER_AGENT'];
	$date = date('Y-m-d H:i:s');

	$dsn = "mysql:dbname=reserve;host=localhost";
	$user = "hoge";
	$password = "hogehoge";	 
	try {
	    $dbh = new PDO($dsn, $user, $password);
	} catch (PDOException $e){
	    print('connection failed:'.$e->getMessage());
	} 

	$stmt = $dbh -> prepare("INSERT INTO masters (day, time1, time2, course, charge, name, mail, ip, useragent, created) VALUES(:day, :time1, :time2, :course, :charge, :name, :mail, :ip, :useragent, :created)");
	$stmt->bindParam(':day', $_POST['day'], PDO::PARAM_STR);
	$stmt->bindParam(':time1', $_POST['time1'], PDO::PARAM_STR);
	$stmt->bindParam(':time2', $_POST['time2'], PDO::PARAM_STR);
	$stmt->bindParam(':course', $_POST['course'], PDO::PARAM_STR);
	$stmt->bindParam(':charge', $_POST['charge'], PDO::PARAM_STR);
	$stmt->bindParam(':name', $_POST['name'], PDO::PARAM_STR);
	$stmt->bindParam(':mail', $_POST['mail'], PDO::PARAM_STR);
	$stmt->bindParam(':ip', $ip, PDO::PARAM_STR);
	$stmt->bindParam(':useragent', $useragent, PDO::PARAM_STR);
	$stmt->bindParam(':created', $date, PDO::PARAM_STR);
    $stmt->execute();

■画面遷移
1．入力フォーム

2.確認画面

3.thankyou画面

4.メール受信

5.mysql

ここまでは特に問題なさそうです。
次はvalidation周りを作っていきたいと思います。

簡易的な確認画面

mb_send_mailでメールを送る。

if(!isset($_POST['name'])){
   header('Location: http://192.168.33.10:8000');
} else {
	$name = $_POST['name'];
	$mail = $_POST['mail'];
	$day = $_POST['day'];
	$time = $_POST['time'];
	$hour = floor($time / 60);
	$minutes = $time % 60;
	if(!$minutes == NUll ){
			$stime = $hour.":".$minutes;
		}  else {
			$stime = $hour.":00";
		}
	$time =$_POST['time'] + $_POST['course'];
	$hour = floor($time / 60);
	$minutes = $time % 60;
	if(!$minutes == NUll ){
			$etime = $hour.":".$minutes;
		}  else {
			$etime = $hour.":00";
		}
	$course = $_POST['course'];
	$lawyer = $_POST['lawyer'];
}

if(isset($_POST["submit"])){
	mb_language('ja');
	mb_internal_encoding("utf-8");

	$start = $_POST['stime'];
	$end = $_POST['etime'];

	$subject = "[自動送信]お問い合わせありがとうございます";

	$body = <<< EOM

　{$name} 様

この度はご予約ありがとうございます。
以下のご予約内容を承りました。
===================================================
【 お名前 】 
{$name} 様

【 メールアドレス 】 
{$mail}

【 ご予約日時 】 
{$day} {$start} ～　{$end}

【 コース 】
{$course} 分

【 担当弁護士 】 
{$lawyer}
===================================================

内容を確認のうえ、回答させて頂きます。

〇〇弁護士事務所
EOM;
     $fromEmail = "hoge@gmail.com";
     $fromName = "〇〇事務所";
     $header = "From:".mb_encode_mimeheader($fromName)."<$fromEmail>";
     mb_send_mail($mail,$subject,$body,$header);

     // header("Location: thanks.php");
     exit;
}
?>
<form action="" method="post">
<input type="hidden" name="name" value="<?php echo $name; ?>">
<input type="hidden" name="mail" value="<?php echo $mail; ?>">
<input type="hidden" name="day" value="<?php echo $day; ?>">
<input type="hidden" name="stime" value="<?php echo $stime; ?>">
<input type="hidden" name="etime" value="<?php echo $etime; ?>">
<input type="hidden" name="course" value="<?php echo $course; ?>">
<input type="hidden" name="lawyer" value="<?php echo $lawyer; ?>">
<h1>お問い合わせ内容の確認</h1>
<p>お問い合わせ内容はこちらで宜しいでしょうか？<br>
よろしければ「送信する」ボタンを押してください。<hr>
<b>お名前</b><br>
<?php echo $name; ?>様<br>
<b>メールアドレス</b><br>
<?php echo $mail; ?><br>
<b>日付</b><br>
<?php echo $day; ?><br>
<b>時間</b><br>
<?php echo $stime; ?>～<?php echo $etime; ?><br>
<b>コース</b><br>
<?php echo $course; ?>分<br>
<b>担当</b><br>
<?php echo $lawyer; ?><br><br>
<input type="button" value="内容を修正する" onclick="history.back(-1)">
<button type="submit" name="submit">送信する</button>
</form>

メール

予約日(datepicker)が今日の場合は、現在時刻以降のselectを表示

onSelectのところで、dateTextが今日を選択された場合、idと現在時刻の分を比較して、idが現在時刻より前(値が小さければ)、display noneに変更する。

onSelect: function(dateText, inst) {
                    $("#date_val").val(dateText);
                    if(today == dateText){
                    	for(var i = 0; i < timelist.length; i++){
                    		if(timelist[i] < time){
                    			document.getElementById(timelist[i]).style.display = "none";
                    		}
                    	}
                    	
                    } else{
                    	for(var i = 0; i < timelist.length; i++){
                    			document.getElementById(timelist[i]).style.display = "";
                    	}
                    }              
        }

デフォルト

今日の日付が選択された場合
->現在時刻以降しか選択できない

きた！

if(timelist[i] < time + 60) とすれば、現在時刻から、1時間後以降しか選べなくなりますね♪♪♪

javascriptでyyyymmdd形式で日付を取得

var dt = new Date();
  var y = dt.getFullYear();
  var m = ("00" + (dt.getMonth()+1)).slice(-2);
  var d = ("00" + dt.getDate()).slice(-2);
  var today = y + "年"　+ m + "月" + d + "日";
  console.log(today);

世の中、頭いい人多いですね。

phpで予約システムを作くろう3 予約時間

予約時間をselectできるようにします。

<b>予約フォーム</b><br>
<form method="POST" action="">
1.お名前(必須)<br>
<input class="form1" type="text" name="username" placeholder="　お名前"/><br><br>
2.メールアドレス(必須)<br>
<input class="form1" type="text" name="username" placeholder="　〇〇@gmail.com"/><br><br>
3.カレンダーから日付を選択してください<br>
<input type="text" id="date_val"　placeholder="　2018年〇月〇日"/><br>
<div id="datepicker"></div><br>
4.時間を選択してください<br>
	<select name="time">
	<option value=""> 選択してください</option>
	<option value="">9:00～</option>
	<option value="">10:00～</option>
	<option value="">11:00～</option>
	<option value="">13:00～</option>
	<option value="">14:00～</option>
	<option value="">15:00～</option>
	<option value="">16:00～</option>
	<option value="">17:00～</option>
	</select>

	<select name="time">
	<option value="">30分</option>
	<option value=""　selected>60分</option>
	<option value="">90分</option>
	<option value="">120分</option>
	</select>

	<br><br>
5.ご希望される弁護士を選択してください<br>
	<select name="lawyer">
	<option value=""> 選択してください</option>
	<option value="">松島</option>
	<option value="">小野</option>
	<option value="">草野</option>
	</select>
	<br><br>
	<input type="submit" value="予約する" class="submit">
</form>

あれ、これ、もしかして、valueをminuteで変換すればいいだけじゃないですかね？
おいおいおい、結構簡単ではないですか。