정지윤 / project_opensource

Go to a project
Toggle navigation Toggle navigation pinning
정지윤
c099e225 1 parent 7828c3bb

결제 모듈 추가

Inline Side-by-side
Showing 6 changed files with 447 additions and 49 deletions
......@@ -9,21 +9,16 @@ var bodyParser = require('body-parser');
var router = express.Router();
// configuration ===============================================================
router.get('/reservation',function(req,res){
res.render('reservation',{title : "첫번째 화면~"});
})
router.get('/first',function(req,res){
res.render('first',{title : "첫번째 화면~"});
res.render('first',{title : "첫번째 화면"});
})
router.get('/', function(req, res){
res.render('index',{title: "첫화면"});
});
router.get('/list', function(req, res){
res.render('list',{title :"게시판"});
router.get('/reservation',function(req,res){
res.render('reservation',{title : "예약"});
});
......@@ -54,49 +49,33 @@ router.post('/reservation',function(req, res){
router.get('/resconfirm', function(req, res){
res.render('resconfirm',{title : "예약확인"});
})
});
router.get('/menu',function(req,res){
res.render('menu',{title : "메뉴판"});
});
router.get('/write2',function(req,res){
res.render('write',{title : "게시판"});
res.redirect('/');
connection.release();
})
router.post('/write2',function(req, res){
var creater_id = req.body.creater_id;
var title = req.body.title;
var content = req.body.content;
router.get('/db', function(req, res){
pool.getConnection(function (err, connection)
{
// Use the connection
var sqlForInsertBoard = "insert into db2(creater_id, title, content) values('"+creater_id+"', '"+title+"', '"+content+"')";
connection.query(sqlForInsertBoard, function (err, rows) {
//var sqlForInsertBoard = "insert into menu(creater_id, phone, email, num, restime, resmin,date,food,content) values('"+creater_id+"', '"+phone+"', '"+email+"','"+num+"','"+restime+"','"+resmin+"','"+date+"','"+food+"','"+content+"')";
var sqlForSelect = 'SELECT * from menu'
connection.query(sqlForSelect, function (err, rows) {
if (err) console.error("err : " + err);
console.log("rows : " + JSON.stringify(rows));
res.redirect('/');
res.render('first');
connection.release();
// Don't use the connection here, it has been returned to the pool.
});
});
})
router.get('/persons', function(req, res){
connection.query('SELECT * from Persons', function(err, rows) {
if(err) throw err;
console.log('The solution is: ', rows);
res.send(rows);
});
});
router.get('/page',function(req, res){
connection.query('SELECT * from db2', function(err, rows) {
if(err) throw err;
console.log('The solution is: ', rows);
res.send(rows);
});
/* GET home page. */
router.get('/pay', function(req, res, next) {
res.render('pay', { title: '결제' });
});
module.exports = router;
......
......@@ -13,7 +13,7 @@ var smtpTransport = nodemailer.createTransport({
var mailOptions = {
from: '정지윤 <violet3073@gmail.com>',
to: 'djkaiden@naver.com',
to: 'jju0807@naver.com',
subject: '예약 게시판 확인해주세요!',
text: '예약이 도착했습니다'
};
......
......@@ -38,6 +38,11 @@
<li class="nav-item">
<a class="nav-link js-scroll-trigger" href="#about">About</a>
</li>
<li class="nav-item">
<a class="nav-link js-scroll-trigger" href="#menu">Menu</a>
</li>
<li class="nav-item">
<a class="nav-link js-scroll-trigger" href="#download">Reservation</a>
</li>
......@@ -75,23 +80,40 @@
<div class="container">
<div class="row">
<div class="col-lg-8 mx-auto">
<h2>About GROTTO</h2>
<h2>About 별빛바다 달빛초원</h2>
<p>
<a href="http://startbootstrap.com/template-overviews/grayscale/">Grotto - Let your senses fly</a>.
<br>당신의 오감을 날려드립니다.</p>
<a href="http://startbootstrap.com/template-overviews/grayscale/">01</a>.
<br>건강한 식재료와 제철 음식을 지향합니다.</p>
<p>
<a href="http://gratisography.com/">Coffee - Kona coffee</a>
<br>세계 3대 커피 하와이안 코나 원두를 사용합니다.</p>
<a href="http://gratisography.com/">02</a>
<br>활어회/신선한 초밥/해산물 잔뜩 요리전문점</p>
<p>
<a href="http://snazzymaps.com/">Wine - Wine expert</a>.
<br>150가지 종류의 와인을 와인을 닮은 공간에서 편하게 즐기세요.</p>
<a href="http://snazzymaps.com/">03</a>.
<br>수원에서 가장 깔끔하고 싱싱한 횟집</p>
</div>
</div>
</div>
</section>
<!-- Menu Section -->
<section id="menu" class=" content-section text-center">
<div class="container">
<div class="row">
<div class="col-lg-8 mx-auto">
<h2>Menu</h2>
<p>별빛바다 달빛초원은 항상 싱싱한 생선만 손질합니다.</p>
<a href="/menu" class="btn btn-default btn-lg">메뉴 보러가기</a>
</div>
</div>
</div>
</section>
<!-- Download Section -->
<section id="download" class="download-section content-section text-center">
<div class="container">
......@@ -108,7 +130,7 @@
<div class="container">
<div class="row">
<div class="col-lg-8 mx-auto">
<h2>Contact GROTTO</h2>
<h2>Contact 별빛바다 달빛초원</h2>
<p>전화번호 : 031-205-7220</p>
<p>영업시간 : 매일 10:00 - 23:30 (Last Order 22:00)</p>
<ul class="list-inline banner-social-buttons">
......@@ -118,12 +140,13 @@
<span class="network-name">facebook</span>
</a>
</li>
<li class="list-inline-item">
<!--<li class="list-inline-item">
<a href="https://www.instagram.com/grotto_since2011/" class="btn btn-default btn-lg">
<i class="fa fa-instagram fa-fw"></i>
<span class="network-name">Instagram</span>
</a>
</li>
-->
</ul>
</div>
</div>
......@@ -153,7 +176,7 @@
}
</style>
<body>
<p>경기도 수원시 영통구 영통동 1030-2</p>
<p>경기도 수원시 영통구 영통동 1025-1(경기도 수원시 영통구 청명로 28) 1층 별빛바다 달빛초원</p>
<section id="contact" class="content-section text-center">
<div class="container">
<div class="row">
......@@ -185,7 +208,7 @@
<script>
function initMap() {
var cnt = 1; //마커 카운트 해서 우선 2개만 제한
var initLatLng = {lat: 37.251797, lng: 127.076747};
var initLatLng = {lat: 37.2497462, lng: 127.0785575};
var geocoder = new google.maps.Geocoder;
var map = new google.maps.Map(document.getElementById('map'), {
center: initLatLng,
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<!-- Bootstrap core CSS -->
<link rel="stylesheet" type="text/css" href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom fonts for this template -->
<link href="vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic" rel="stylesheet" type="text/css">
<link href='https://fonts.googleapis.com/css?family=Cabin:700' rel='stylesheet' type='text/css'>
<!-- Custom styles for this template -->
<link href="css/grayscale.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="https://jqueryui.com/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<title>식당 예약</title>
<style type="text/css">
.reservationTheme{
background:url('/img/res2.jpg') no-repeat;
}
</style>
<section id="about" class="reservationTheme content-section ">
<div class="container">
<br><br>
<h2>Reservation</h2>
<br><br>
<form class="well form-horizontal" action=" " method="post" id="contact_form">
<fieldset>
<form method="POST" action="/reservation">
<!-- Form Name -->
<!-- Text input-->
<div class="form-group">
<div class="col-md-4 inputGroupContainer ">
<div class="input-group">
<label class="col-md-4 control-label ">이름</label>
<i class="glyphicon glyphicon-envelope"></i>
<input name="creater_id" placeholder="홍길동" class="form-control" type="text">
</div>
</div>
</div>
<!-- 휴대전화-->
<div class="form-group">
<div class="col-md-4 inputGroupContainer">
<div class="input-group">
<label class="col-md-4 control-label">휴대전화</label>
<i class="glyphicon glyphicon-earphone"></i>
<input name="phone" placeholder="0101234567" class="form-control" type="text">
</div>
</div>
</div>
<!-- Text input-->
<div class="form-group">
<div class="col-md-4 inputGroupContainer">
<div class="input-group">
<label class="col-md-4 control-label">이메일주소</label>
<i class="glyphicon glyphicon-envelope"></i>
<input name="email" placeholder="E-Mail Address" class="form-control" type="text">
</div>
</div>
</div>
<!--인원수-->
<div class="form-group">
<div class="col-md-4 selectContainer">
<div class="input-group">
<label class="col-md-4 control-label">인원 수</label>
<i class="glyphicon glyphicon-list"></i>
<select name="num" class="form-control selectpicker" >
<option>1~4명</option>
<option>5~10명</option>
<option >10명~15명</option>
<option >15명~20명</option>
<option >20명 이상</option>
</select>
</div>
</div>
</div>
<!--예약시간-->
<div class="form-group">
<div class="col-md-4 selectContainer">
<div class="input-group">
<label class="col-md-4 control-label">예약 시간</label>
<i class="glyphicon glyphicon-list"></i>
<select name="restime" class="form-control selectpicker" >
<option value=" " >시간</option>
<option>10시</option>
<option>11시</option>
<option>12시</option>
<option>13시</option>
<option>14시</option>
<option>15시</option>
<option>16시</option>
<option>17시</option>
<option>18시</option>
<option>19시</option>
<option>20시</option>
</select>
&nbsp;
<select name="resmin" class="form-control selectpicker" >
<option value=" " >분</option>
<option>00분</option>
<option>15분</option>
<option>30분</option>
<option>45분</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-4 selectContainer">
<div class="input-group">
<label class="col-md-4 control-label">예약 날짜</label>
<div class="input-group input-append date" id="dateRangePicker"> </div>
<script>
$('#dateRangePicker').datepicker({
format: "yyyy-mm-dd",
language: "kr"
});
</script>
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-4 selectContainer">
<div class="input-group">
<label class="col-md-4 control-label"></label>
<i class="glyphicon glyphicon-list"></i>
<select name="date" class="form-control selectpicker" >
<option><script language="JavaScript">
var today = new Date( )
document.write(today.getMonth( )+1 , "월 " , today.getDate( ) , "일")
</script> </option>
<option><script language="JavaScript">
var today = new Date( )
document.write(today.getMonth( )+1 , "월 " , today.getDate( )+1 , "일")
</script> </option>
<option><script language="JavaScript">
var today = new Date( )
document.write(today.getMonth( )+1 , "월 " , today.getDate( )+2 , "일")
</script> </option>
<option><script language="JavaScript">
var today = new Date( )
document.write(today.getMonth( )+1 , "월 " , today.getDate( )+3 , "일")
</script> </option>
<option><script language="JavaScript">
var today = new Date( )
document.write(today.getMonth( )+1 , "월 " , today.getDate( )+4 , "일")
</script> </option>
<option><script language="JavaScript">
var today = new Date( )
document.write(today.getMonth( )+1 , "월 " , today.getDate( )+5 , "일")
</script> </option>
<option><script language="JavaScript">
var today = new Date( )
document.write(today.getMonth( )+1 , "월 " , today.getDate( )+6 , "일")
</script> </option>
<option><script language="JavaScript">
var today = new Date( )
document.write(today.getMonth( )+1 , "월 " , today.getDate( )+7 , "일 (예약은 1주일까지만 가능합니다)")
</script> </option>
</select>
</div>
</div>
</div>
<!-- radio checks-->
<div class="form-group">
<div class="col-md-4 selectContainer">
<div class="input-group">
<label class="col-md-4 control-label">메뉴</label>
<div class="checkbox">
<label>
<image src = "/img/pizza.jpg" width=100 height=100>
<br><input type="checkbox" name="food" value="pizza" /> 피자
</label>
</div>
&nbsp;
&nbsp;
&nbsp;
<div class="checkbox">
<label>
<image src = "/img/파스타.jpg" width=100 height=100>
<br><input type="checkbox" name="food" value="pasta" /> 파스타
</label>
</div>
&nbsp;
&nbsp;
&nbsp;
<div class="checkbox">
<label>
<image src = "/img/와인.jpg" width=100 height=100>
<br><input type="checkbox" name="food" value="wine" /> 와인
</label>
</div>
</div>
</div>
</div>
<br>
<div class="form-group">
<div class="col-md-4 selectContainer">
<div class="input-group">
<label class="col-md-4 control-label">요청 사항</label>
<i class="glyphicon glyphicon-pencil"></i>
<textarea class="form-control" name="content" placeholder="요청 사항을 적어주세요." style="width:310px; height:100px;"></textarea>
</div>
</div>
<!-- Button -->
<div class="form-group">
<label class="col-md-4 control-label"></label>
<div class="col-md-4">
<button type="submit" class="btn btn-default btn-lg" >예약하기 <span class="glyphicon glyphicon-send "></span></button>
</div>
</div>
</form>
</fieldset>
</form>
</div>
</div>
</script>
<script type="text/javascript" src="/mail"></script>
<script>
function onWriteSubmit()
{
if ( $("#creater_id").val().trim() == "" )
{
var message = "아이디를 입력해주세요";
$("#creater_id").val("");
$("#creater_id").focus();
alert(message);
return false;
}
if ( $("#phone").val().trim() == "" )
{
var message = "폰번호를 입력해주세요";
$("#phone").val("");
$("#phone").focus();
alert(message);
return false;
}
if ( $("#email").val().trim() == "" )
{
var message = "이메일 주소를 입력해주세요";
$("#email").val("");
$("#email").focus();
alert(message);
return false;
}if ( $("#num").val().trim() == "" )
{
var message = "인원수를 입력해주세요";
$("#num").val("");
$("#num").focus();
alert(message);
return false;
}if ( $("#restime").val().trim() == "" )
{
var message = "예약시간을 입력해주세요";
$("#restime").val("");
$("#restime").focus();
alert(message);
return false;
}
if ( $("#resmin").val().trim() == "" )
{
var message = "예약 분을 입력해주세요";
$("#resmin").val("");
$("#resmin").focus();
alert(message);
return false;
}
if ( $("#date").val().trim() == "" )
{
var message = "예약 날짜를 입력해주세요";
$("#date").val("");
$("#date").focus();
alert(message);
return false;
}
if ( $("#food").val().trim() == "" )
{
var message = "예약 메뉴를 입력해주세요";
$("#food").val("");
$("#food").focus();
alert(message);
return false;
}
if ( $("#content").val().trim() == "" )
{
var message = "비고사항을 입력해주세요";
$("#content").val("");
$("#content").focus();
alert(message);
return false;
}
}
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<!-- 모든 컴파일된 플러그인을 포함합니다 (아래), 원하지 않는다면 필요한 각각의 파일을 포함하세요 -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
</head>
</html>
<!DOCTYPE html>
<html>
<head>
<title><%= title %></title>
<link rel='stylesheet' href='/stylesheets/style.css' />
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.min.js" ></script>
<script type="text/javascript" src="https://service.iamport.kr/js/iamport.payment-1.1.5.js"></script>
</head>
<body>
<h1>결제창</h1>
</body>
<script>
var IMP = window.IMP;
IMP.init('imp90003971');
IMP.request_pay({
pg : 'kakao', // version 1.1.0부터 지원.
pay_method : 'card',
merchant_uid : 'merchant_' + new Date().getTime(),
name : '주문명:결제테스트',
amount : 100,
buyer_email : 'jju0807@naver.com',
buyer_name : '정지윤',
buyer_tel : '010-8762-3073',
buyer_addr : '서울특별시 강남구 삼성동',
buyer_postcode : '123-456',
m_redirect_url : 'https://localhost:3000'
}, function(rsp) {
if ( rsp.success ) {
var msg = '결제가 완료되었습니다.';
msg += '고유ID : ' + rsp.imp_uid;
msg += '상점 거래ID : ' + rsp.merchant_uid;
msg += '결제 금액 : ' + rsp.paid_amount;
msg += '카드 승인번호 : ' + rsp.apply_num;
} else {
var msg = '결제에 실패하였습니다.';
msg += '에러내용 : ' + rsp.error_msg;
}
alert(msg);
});
</script>
</html>
......@@ -61,7 +61,7 @@
<div class="input-group">
<label class="col-md-4 control-label">휴대전화</label>
<i class="glyphicon glyphicon-earphone"></i>
<input name="phone" placeholder="010-123-4567" class="form-control" type="text">
<input name="phone" placeholder="0101234567" class="form-control" type="text">
</div>
</div>
</div>
......