Month: April 2018

border-collapse: separateの左右の余白

divタグの横並びで、border-collapse: separateを使った際に、囲ったエリアにborder-spacingを使うと、左右に余白ができてしまいます。

.class_areaname{
	border-collapse: separate;
	border-spacing: 5px 0; 
}
.class_name{
        display: table-cell;
}

そのため、各cell(divタグ)の方に、padding-right:;を設定すれば、左揃えになります。

.class_areaname{
	border-collapse: separate;
}
.class_name{
        display: table-cell;
        padding-right:5px;
}

右だけ余白ができました。

table tdの中のlinkのcss

1.table tdのcssは

td {
  write something;
}

2. table td にclassを付けた場合
例

<td class="selected">hoge</td>

cssは、

td.selected {
   write something;
}

3.table tdの中にlink(aタグ)のcss

td a{
  write something;
}

4.table classを付けたtdの中のlink(aタグ)のcss

<td class="selected"><a href="?param=hoge">foo</a></td>

cssは

td.selected a{
  write something;
}

下のキャプチャのように、classをつけているtdの中のaタグのcolorを#fffにできました。

予約数と予約時間を2軸でchart.jsで表示する

php側
1.DBから取得した予約データで、時間は+=,予約数は++で連想配列をつくる
2.array_multisortで時間の多い順に連想配列をソート
3.jsに値を渡す

$i = 0; 
while($result = $stmt->fetch(PDO::FETCH_ASSOC)){
	if($year == substr($result['day'], 0, 4) && $month == substr($result['day'], 7, 2)){
		$charge = $result['charge'];
		$book[$charge]['course'] += $result['course'];
		$book[$charge]['count']++;
		$total += $result['course'];
		$i++;
	} 
}

foreach($book as $key => $value){
	$time[$key]["course"] = $value["course"];
}
array_multisort($time, SORT_DESC, $book);

foreach($book as $key => $value){
	$name_list[] = $key;
	$time_list[] = $value["course"];
	$count_list[] = $value["count"];
}

chart.js
オプションで、左右の軸を指定する
tickのmaxは配列の中の最も大きい数 x N とする
Math.max.apply(null, array)*N

ただし、javascriptの IEEE 754の計算だと、誤差が生じることがある
例　Math.max.apply(null, array)*1.1 = 90.00000000000001(!?)
IEEE 754は、2進法計算だかららしい。※wikipediaを読んだが、何故二進法だと誤差が出るのかは私の頭では理解不能


そのため、 Math.floor(Math.max.apply(null, array)*N) として、小数点以下切り捨て

var name_arr = JSON.parse('<?php echo $name_l; ?>');
var time_arr = JSON.parse('<?php echo $time_l; ?>');
var count_arr = JSON.parse('<?php echo $count_l; ?>');
var ctx = document.getElementById("BarChart");
var BarChart = new Chart(ctx, {
	type: 'bar',
	data:{
		labels:name_arr,
		datasets:[{
			label:'予約時間',
			data: time_arr,
			backgroundColor: "rgba(255,136,86,0.8)",
			yAxisID: "y-axis-1",
		},{
			label:'予約数',
			data: count_arr,
			backgroundColor: "rgba(54,264,235,0.4)",
			yAxisID: "y-axis-2",
		}]
		},
		options:{
			responsive: true,
			scales:{
				yAxes:[{
					id: "y-axis-1",
					type: "linear",
					position: "left",
					ticks:{
						max: Math.floor(Math.max.apply(null, time_arr)*1.1),
						min:0,
						stepSize: 30
					}
				},{
					id: "y-axis-2",
					type: "linear",
					position: "right",
					ticks:{
						max: Math.max.apply(null, count_arr)+1,
						min:0,
						stepSize: 1
					}
				}],
				
			}
		}
		
});

結果:今月

翌月

営業成績をchart.jsの棒グラフで表示する

php側

1.今日の年・月を取得する
2.Getパラメーターで先月・翌月の場合は、$monthを変更する
3.今月が1月の場合は前月の年、12月の場合は翌月の年を変更
4.年と月が一致するデータをDBから取得して、名前と営業成績を連想配列にする
5.array_multisortで、成績順にソートする
6.chart.jsにラベルとデータを渡すため、keyとvalueを配列にしてデコードする

$year = date("Y");
$month = date("m");
if(!empty($_GET["m"])){
  $month =  date("m", strtotime("".$_GET["m"]." month"));
  if($_GET["m"] == -1 && $month == 12){
  		$year= date("Y", strtotime("-1 year"));
  }elseif($_GET["m"] == 1 && $month == 1){
  		$year= date("Y", strtotime("+1 year"));
  }
}
$i = 0; 
while($result = $stmt->fetch(PDO::FETCH_ASSOC)){
	if($year == substr($result['day'], 0, 4) && $month == substr($result['day'], 7, 2)){
		$charge = $result['charge'];
		$book[$charge] += $result['course'];
		$total += $result['course'];
		$i++;
	} 
}

foreach($book as $key => $value){
	$time[$value] = $value;
}
array_multisort($time, SORT_DESC, $book);

foreach($book as $key => $value){
	$name_list[] = $key;
	$time_list[] = $value;
}

$name_l =json_encode($name_list);
$time_l = json_encode($time_list);

js側
普通のchart.js棒グラフ

var name_arr = JSON.parse('<?php echo $name_l; ?>');
var time_arr = JSON.parse('<?php echo $time_l; ?>');
var ctx = document.getElementById("BarChart");
var BarChart = new Chart(ctx, {
	type : 'bar',
	data: {
		labels: name_arr,
		datasets:[{
			label: "予約時間(分)",
			backgroundColor: "rgba(75, 192, 192, 0.4)",
			borderColor:"rgba(75, 192, 192, 1)",
			data: time_arr
		}]
	},
	options: {
		scales: {
			yAxes: [{
				ticks : {
					beginAtZero:true,
				}
			}]
		}
	}
});

view側
1. switch文で、今月・先月・翌月を表示を出し分ける(if elseの方が良かったかも。。。)
2. canvasはdiv wrapperで囲ってサイズ調整

<?php 
switch($_GET&#91;"m"&#93;){
	case -1:
	echo "先月の総予約数: ".$i."件<br>";
	echo "先月の総予約時間: ".$total."分<br>";
	break;
	case 1:
	echo "来月の総予約数: ".$i."件<br>";
	echo "来月の総予約時間: ".$total."分<br>";
	break;
	default:
	echo "今月の総予約数: ".$i."件<br>";
	echo "今月の総予約時間: ".$total."分<br>";
	break;
}
?>
<div class="wrapper">
<canvas id="BarChart"></canvas><br>
<center><a href="?m=-1">先月</a> | <a href="analytics.php">今月</a> | <a href="?m=1">翌月</a></center>
</div>

結果：今月

翌月

あ、getパラメータは、date(“Ym”, strtotime(+-1 month));で良かったですね。。。

祝日判定　new HolidayDateTime()

HolidayDateTimeを使います。
https://qiita.com/chiyoyo/items/539dc2840a1b70a8e2c3

require_once("holiday.php");

$datetime = new HolidayDateTime('2018-05-03');
echo $datetime->holiday();

すごいっすね。。頭いいっすね。

ifに書き方を変えると、平日・祝日の判定ができます。

require_once("holiday.php");

$date = '2018-04-29';
$datetime = new HolidayDateTime($date);
if($datetime->holiday()){
	echo $datetime->holiday();
}else {
	echo "平日";
}

応用すると、

$y = substr($today, 0, 4);
$m = substr($today, 7, 2);
$d = substr($today, 12, 2);
$target_day = $y."-".$m."-".$d;

require_once("holiday.php");
$datetime = new HolidayDateTime($target_day);
if($datetime->holiday()){
	echo "<b>".$today. "(".$datetime->holiday().") 予約状況</b><hr>";
	$holiday = 1;
}else {
	echo "<b>".$today. " 予約状況</b><hr>";
	$holiday = 0;
}

祝日判定をして、祝日の場合は予約できないようにします。

<?php elseif($validation == 4): ?>
<h1>ご予約内容の確認</h1>
<p>ご希望いただいた<?php echo $day; ?>は、<?php echo $holiday; ?>でお休みの為、ご予約できません。<br>
前のページに戻り、異なる日程にてご入力くださいませ。</p>
<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 $charge; ?><br><br>
<input type="button" value="内容を修正する" onclick="history.back(-1)">
</form>

うわー

画像認証 securimage

git hubからdownloadします。
https://github.com/dapphp/securimage

git clone https://github.com/dapphp/securimage.git

早速使ってみます。

<img id="captcha" src="securimage/securimage_show.php">

なにこれ？

つかっていきます。

<?php
if($_POST&#91;"captcha_code"&#93;){
	require_once "securimage/securimage.php";
	$securimage = new Securimage();
	if($securimage->check($_POST['captcha_code'])==false){
			echo "error";
	} else {
		 	echo "success";
	}
}

?>
<form method="POST" name="form" action="">
<img id="captcha" src="securimage/securimage_show.php"><br>
<input type="text" name="captcha_code"><br>
<input type="submit" value="送信" class="submit">
</form>

おおおお

phpで.htaccessに制限するipアドレスを追加する

初期
.htaccess
192.168.33.11と192.168.33.12をアクセスdenyしています。

.htaccessの行数をカウントし、2行目から、最終行の前までをfgetsで1行ずつ取得し、新たに制限するipを追加して、file_put_contentsします。

$count = count(file(".htaccess"));

$file = fopen(".htaccess", "r");
$body = "<Files ~ \"^form\.php$\">\n";
$i = 0;
if($file){
  while ($line = fgets($file)) {
  	$i++;
  	if($i < $count and $i !== 1){
  		$body .= $line;
  	}
  }
}
$ip = "192.168.33.13";
$body .= "deny from ".$ip."\n";
$body .= "</Files>";
file_put_contents('.htaccess', $body);

.htaccessに、新たにdeny fromが追加されました。

土日を除いて5営業日先までを出し分ける

今日から5営業日先までを表示したいとすると、今日が月曜日の場合は、strtotime(‘+1 day’)、strtotime(‘+2 day’), strtotime(‘+3 day’)…とすればいいが、土日をまたぐ場合は、strtotimeをその分追加する必要があるため、date(“w”)をswitch文で分ける。

$week = array( "日", "月", "火", "水", "木", "金", "土" );

switch(date("w")){
	case 0:
		$date = date("Y年m月d日", strtotime('+1 day'));
		$today = $date."(".$week[date("w", strtotime('+1 day'))].")";
		$date1 = date("m/d", strtotime('+1 day'));
		$date1 = $date1."(".$week[date("w", strtotime('+1 day'))].")";
		$date2 = date("m/d", strtotime('+2 day'));
		$date2 = $date2."(".$week[date("w", strtotime('+2 day'))].")";
		$date3 = date("m/d", strtotime('+3 day'));
		$date3 = $date3."(".$week[date("w", strtotime('+3 day'))].")";
		$date4 = date("m/d", strtotime('+4 day'));
		$date4 = $date4."(".$week[date("w", strtotime('+4 day'))].")";
		$date5 = date("m/d", strtotime('+5 day'));
		$date5 = $date5."(".$week[date("w", strtotime('+5 day'))].")";
		break;
	case 1:
		$date = date("Y年m月d日");
		$today = $date."(".$week[date("w")].")";
		$date1 = date("m/d");
		$date1 = $date1."(".$week[date("w")].")";
		$date2 = date("m/d", strtotime('+1 day'));
		$date2 = $date2."(".$week[date("w", strtotime('+1 day'))].")";
		$date3 = date("m/d", strtotime('+2 day'));
		$date3 = $date3."(".$week[date("w", strtotime('+2 day'))].")";
		$date4 = date("m/d", strtotime('+3 day'));
		$date4 = $date4."(".$week[date("w", strtotime('+3 day'))].")";
		$date5 = date("m/d", strtotime('+4 day'));
		$date5 = $date5."(".$week[date("w", strtotime('+4 day'))].")";
		break;
	case 2:
		$date = date("Y年m月d日");
		$today = $date."(".$week[date("w")].")";
		$date1 = date("m/d");
		$date1 = $date1."(".$week[date("w")].")";
		$date2 = date("m/d", strtotime('+1 day'));
		$date2 = $date2."(".$week[date("w", strtotime('+1 day'))].")";
		$date3 = date("m/d", strtotime('+2 day'));
		$date3 = $date3."(".$week[date("w", strtotime('+2 day'))].")";
		$date4 = date("m/d", strtotime('+3 day'));
		$date4 = $date4."(".$week[date("w", strtotime('+3 day'))].")";
		$date5 = date("m/d", strtotime('+6 day'));
		$date5 = $date5."(".$week[date("w", strtotime('+6 day'))].")";
		break;
	case 3:
		$date = date("Y年m月d日");
		$today = $date."(".$week[date("w")].")";
		$date1 = date("m/d");
		$date1 = $date1."(".$week[date("w")].")";
		$date2 = date("m/d", strtotime('+1 day'));
		$date2 = $date2."(".$week[date("w", strtotime('+1 day'))].")";
		$date3 = date("m/d", strtotime('+2 day'));
		$date3 = $date3."(".$week[date("w", strtotime('+2 day'))].")";
		$date4 = date("m/d", strtotime('+5 day'));
		$date4 = $date4."(".$week[date("w", strtotime('+5 day'))].")";
		$date5 = date("m/d", strtotime('+6 day'));
		$date5 = $date5."(".$week[date("w", strtotime('+6 day'))].")";
		break;
	case 4:
		$date = date("Y年m月d日");
		$today = $date."(".$week[date("w")].")";
		$date1 = date("m/d");
		$date1 = $date1."(".$week[date("w")].")";
		$date2 = date("m/d", strtotime('+1 day'));
		$date2 = $date2."(".$week[date("w", strtotime('+1 day'))].")";
		$date3 = date("m/d", strtotime('+4 day'));
		$date3 = $date3."(".$week[date("w", strtotime('+4 day'))].")";
		$date4 = date("m/d", strtotime('+5 day'));
		$date4 = $date4."(".$week[date("w", strtotime('+5 day'))].")";
		$date5 = date("m/d", strtotime('+6 day'));
		$date5 = $date5."(".$week[date("w", strtotime('+6 day'))].")";
		break;
	case 5:
		$date = date("Y年m月d日");
		$today = $date."(".$week[date("w")].")";
		$date1 = date("m/d");
		$date1 = $date1."(".$week[date("w")].")";
		$date2 = date("m/d", strtotime('+3 day'));
		$date2 = $date2."(".$week[date("w", strtotime('+3 day'))].")";
		$date3 = date("m/d", strtotime('+4 day'));
		$date3 = $date3."(".$week[date("w", strtotime('+4 day'))].")";
		$date4 = date("m/d", strtotime('+5 day'));
		$date4 = $date4."(".$week[date("w", strtotime('+5 day'))].")";
		$date5 = date("m/d", strtotime('+6 day'));
		$date5 = $date5."(".$week[date("w", strtotime('+6 day'))].")";
		break;
	case 6:
		$date = date("Y年m月d日", strtotime('+2 day'));
		$today = $date."(".$week[date("w", strtotime('+2 day'))].")";
		$date1 = date("m/d", strtotime('+2 day'));
		$date1 = $date1."(".$week[date("w", strtotime('+2 day'))].")";
		$date2 = date("m/d", strtotime('+3 day'));
		$date2 = $date2."(".$week[date("w", strtotime('+3 day'))].")";
		$date3 = date("m/d", strtotime('+4 day'));
		$date3 = $date3."(".$week[date("w", strtotime('+4 day'))].")";
		$date4 = date("m/d", strtotime('+5 day'));
		$date4 = $date4."(".$week[date("w", strtotime('+5 day'))].")";
		$date5 = date("m/d", strtotime('+6 day'));
		$date5 = $date5."(".$week[date("w", strtotime('+6 day'))].")";
		break;
}

上手く土日がスキップされています。月末、年末でも、strtotimeなので、処理を加える必要はありません。

パラメーターによって、予定も出し分けます。

if(!empty($_GET["d"])){
	$date = date("Y年m月d日", strtotime("+".$_GET["d"]." day"));
	$today = $date."(".$week[date("w", strtotime("+".$_GET["d"]." day"))].")";
}

4/6(金)

4/9(月)

Yes!
formへのリンク&Getパラメーターもつけて、大分出来てきました。次は管理画面側の設計と、担当者の個別ページの作成ですね。祝日の際の対応や、コメントの追加機能なども必要です。

休みの担当者のスケジュールは非表示にする

absenceのテーブルをつくり、その日が休みの場合は、配列から削除する。

$sql3 = "select * from absence where day = '".$today."'";
$stmt3 = $dbh->query($sql3);
 
while($result3 = $stmt3->fetch(PDO::FETCH_ASSOC)){
	$absence[] = $result3['name'];
}

foreach($absence as $value){
		if(($key = array_search($value, $charge)) !== false) {
	    unset($charge[$key]);
	} 
}

$charge = array_values($charge);