카페 주문 pos 만들기 html javascript

// mouse over tr idx

var trIdx = 0;

//주문추가

function addOrder(orderNameNewObj,price){

//alert(orderName+price);

var orderNameNew = orderNameNewObj.innerHTML;

//테이블 리스트 가져오기.

var table = document.getElementById('orderList');

var rowList = table.rows;

var rowCount = rowList.length;

//alert(rowCount);

if(rowCount>1){

var isOrderExist = false;

for (i=1; i<rowCount; i++) {

var row = rowList[i];

var orderName = row.cells[0].innerHTML;

if(orderName==orderNameNew){

isOrderExist=true;

//수량

var orderCount=row.cells[2].innerHTML;

var orderCountNew = Number(orderCount)+1;

//단가 한개가격

var orderPrice=row.cells[1].innerHTML;

//금액

var rowSumPrice = orderCountNew * orderPrice;

row.cells[2].innerText=orderCountNew;

row.cells[3].innerText=rowSumPrice;

}

showAllPrice();

if(!isOrderExist){

addOrderNew(orderNameNew,price);

}

// 주문 새로이 추가.

else{

addOrderNew(orderNameNew,price);

}

//신규주문 추가.

function addOrderNew(orderNameNew,price){

var table = document.getElementById('orderList');

var newRow = table.insertRow();

var newCell1 = newRow.insertCell(0);

newCell1.innerText = orderNameNew;

var newCell2 = newRow.insertCell(1);

newCell2.innerText = price;

var newCell3 = newRow.insertCell(2);

newCell3.innerText = 1;

var newCell4 = newRow.insertCell(3);

newCell4.innerText = price;

//마이너스

var newCell5 = newRow.insertCell(4);

newCell5.innerHTML = '<button style="font-size:20px" type="button" onclick="miunsOrder(this);">빼기</button> <button style="font-size:20px" type="button" onclick="plusOrder(this);">추가</button>';

//row 삭제

var newCell6 = newRow.insertCell(5);

newCell6.innerHTML = '<button style="font-size:20px" type="button" onclick="deleteRow(this);">X</button>';

showAllPrice();

}

//수량감소

function miunsOrder(btn){

var rowIdx = btn.parentNode.parentNode.rowIndex;

var table = document.getElementById('orderList');

//alert(rowIdx);

var row = table.rows[rowIdx];

var orderCount=row.cells[2].innerHTML;

if(orderCount>1){

var orderCountNew = Number(orderCount)-1;

//단가 한개가격

var orderPrice=row.cells[1].innerHTML;

//금액

var rowSumPrice = orderCountNew * orderPrice;

row.cells[2].innerText=orderCountNew;

row.cells[3].innerText=rowSumPrice;

}

showAllPrice();

}

//수량추가

function plusOrder(btn){

var rowIdx = btn.parentNode.parentNode.rowIndex;

var table = document.getElementById('orderList');

//alert(rowIdx);

var row = table.rows[rowIdx];

var orderCount=row.cells[2].innerHTML;

var orderCountNew = Number(orderCount)+1;

//단가 한개가격

var orderPrice=row.cells[1].innerHTML;

//금액

var rowSumPrice = orderCountNew * orderPrice;

row.cells[2].innerText=orderCountNew;

row.cells[3].innerText=rowSumPrice;

showAllPrice();

}

//로우 삭제

function deleteRow(btn){

var rowIdx = btn.parentNode.parentNode.rowIndex;

var table = document.getElementById('orderList');

//alert(rowIdx);

var row = table.rows[rowIdx];

table.deleteRow(rowIdx);

showAllPrice();

}

//전체 합계금액 표시.

function showAllPrice(){

var showTable = document.getElementById('sumPrice');

var showCell = showTable.rows[0].cells[1];

var table = document.getElementById('orderList');

var rowList = table.rows;

var rowCount = rowList.length;

if(rowCount>1){

var sumPrice = 0;

for (i=1; i<rowCount; i++) {

var row = rowList[i];

var orderRowSumPrice = row.cells[3].innerHTML;

sumPrice += Number(orderRowSumPrice);

}

showCell.innerText = sumPrice;

}

else{

showCell.innerText = 0;

}

//전체삭제

function allDelete(){

var table = document.getElementById('orderList');

var rowList = table.rows;

var rowCount = rowList.length;

for (i=rowCount; i>1; i--) {

table.deleteRow(i-1);

}

showAllPrice();

}

var enter='\n';

// 현재 주문 목록 밑에 넣기.

function addBottomList(){

var currentDate = new Date();

// 각 구성 요소를 가져오기

const year = currentDate.getFullYear();

const month = currentDate.getMonth() + 1;

const day = currentDate.getDate();

const hours = currentDate.getHours();

const minutes = currentDate.getMinutes();

const seconds = currentDate.getSeconds();

// 날짜와 시간을 문자열로 포맷팅

const formattedDate = `${year}-${String(month).padStart(2, '0')}-${String(day).padStart(2, '0')} ${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}`;

// 이전 글자

var orderedListObj = document.getElementById('orderedList');

var orderedListStr = orderedListObj.value;

//새로 추가할 글자

var newAddStr = formattedDate+enter;

var table = document.getElementById('orderList');

var rowList = table.rows;

var rowCount = rowList.length;

//합계금액

var sumPrice = 0;

for (i=1; i<rowCount; i++) {

var row = rowList[i];

var orderName = row.cells[0].innerHTML;

//수량

var orderCount=row.cells[2].innerHTML;

//단가 한개가격

var orderPrice=row.cells[1].innerHTML;

//금액

var rowSumPrice = orderCount * orderPrice;

sumPrice += rowSumPrice;

newAddStr += orderName+"\t"+orderCount+"*"+orderPrice+"="+rowSumPrice+enter;

}

//합계

newAddStr += "합계 : "+sumPrice+enter;

newAddStr += enter;

newAddStr += orderedListStr;

orderedListObj.value=newAddStr;

//이후 목록 삭제.

allDelete();

}

//주문 목록 삭제.

function deleteBottomList(){

var orderedListObj = document.getElementById('orderedList');

orderedListObj.value="";

}

// 오늘 총 주문 현황

function showAllOrder(){

var orderedListObj = document.getElementById('orderedList');

var orderListStr = orderedListObj.value;

const allMenuList = new Array();

//일자시간 별 합계금액

var dayTimeStr = "";

const dayTimeList = new Array();

//enter 로 split

var spltStrs = orderListStr.split(enter);

for (i=0; i<spltStrs.length; i++) {

var rowStr = spltStrs[i];

// 날짜시간 값 .

if(rowStr.indexOf(":")>-1){

dayTimeStr = rowStr.split(":")[0];

}

// 날짜와 합계 제외.

if(rowStr.indexOf("=")>-1 && !(rowStr.indexOf("합계")>-1) ){

var rowSpltStr = rowStr.split("\t");

var orderName = rowSpltStr[0];

// 수량 단가 , 합계.

var lastTabStr = rowSpltStr[1];

var lastTabSplts = lastTabStr.split("=");

//수량 단가

var menuCount=Number(lastTabSplts[0].split("*")[0]);

var menuAmt=Number(lastTabSplts[0].split("*")[1]);

// array 에 있는지 확인

var isExist = false;

for(j=0;j<allMenuList.length;j++){

var rowArray = allMenuList[j];

var chkName = rowArray[0];

if(chkName==orderName){

isExist=true;

//기존 수량 가져오기.

var oldCount = rowArray[1];

var newSumCount = menuCount+oldCount;

allMenuList[j] = new Array(orderName,newSumCount,menuAmt);

}

// 없으면 추가.

if(!isExist){

var newAddArray = new Array(orderName,menuCount,menuAmt);

allMenuList.push(newAddArray);

}

//일자시간 array에 있는지 확인

var isDayTimeExist = false;

for(j=0;j<dayTimeList.length;j++){

var rowArray = dayTimeList[j];

var chkName = rowArray[0];

if(chkName==dayTimeStr){

isDayTimeExist=true;

//기존 합계 가져오기.

var oldSum = rowArray[1];

var newSum = (menuCount*menuAmt)+oldSum;

dayTimeList[j] = new Array(dayTimeStr,newSum);

}

if(!isDayTimeExist){

var newAddArray = new Array(dayTimeStr,menuCount*menuAmt);

dayTimeList.push(newAddArray);

}

}//end for

var showSumAmt = 0;

var showStr = "";

for(j=0;j<allMenuList.length;j++){

var rowArray = allMenuList[j];

var menuName = rowArray[0];

var menuCount = rowArray[1];

var menuAmt = rowArray[2];

showSumAmt += menuCount*menuAmt;

showStr += menuName + " " + menuCount+"*"+menuAmt+"="+menuCount*menuAmt+enter;

}

showStr += "합계 "+showSumAmt+enter+enter;

for(j=0;j<dayTimeList.length;j++){

var rowArray = dayTimeList[j];

var dayTime = rowArray[0];

var datTimeSum = rowArray[1];

showStr += dayTime+" "+datTimeSum+enter;

}

var totalSumObj = document.getElementById('totalSum');

totalSumObj.value=showStr;

}

</script>

<head>

<style>

table{font-size: 20px; }

button{font-size: 20px; margin:5px; }

textarea{font-size: 20px; }

td, th {

vertical-align : top;

}

</style>

</head>

<tr>

<pre>

500

<button style="font-size:20px" type="button" onclick='addOrder(this,500);'>아이스추가 500</button>

1000

1500

<button style="font-size:20px" type="button" onclick='addOrder(this,1500);'>아메리카노</button> <button style="font-size:20px" type="button" onclick='addOrder(this,1500);'>콜라</button> <button style="font-size:20px" type="button" onclick='addOrder(this,1500);'>사이다</button> <button style="font-size:20px" type="button" onclick='addOrder(this,1500);'>훈제계란</button> <button style="font-size:20px" type="button" onclick='addOrder(this,1500);'>빵 1500</button>

2000

<button style="font-size:20px" type="button" onclick='addOrder(this,2000);'>아이스 아메리카노</button> <button style="font-size:20px" type="button" onclick='addOrder(this,2000);'>오렌지 쥬스</button> <button style="font-size:20px" type="button" onclick='addOrder(this,2000);'>망고 쥬스</button>

<button style="font-size:20px" type="button" onclick='addOrder(this,2000);'>홍도라지 작두콩차</button> <button style="font-size:20px" type="button" onclick='addOrder(this,2000);'>캐모마일</button> <button style="font-size:20px" type="button" onclick='addOrder(this,2000);'>히비스커스</button>

2500

3500

<button style="font-size:20px" type="button" onclick='addOrder(this,3500);'>레몬에이드</button> <button style="font-size:20px" type="button" onclick='addOrder(this,3500);'>자몽에이드</button> <button style="font-size:20px" type="button" onclick='addOrder(this,3500);'>유자에이드</button>

</pre>

</td>

<td >

<pre >

<tr>

품목

</td>

단가

</td>

수량

</td>

금액

</td>

감소 추가

</td>

삭제

</td>

</tr>

</table><table id="sumPrice" border="0">

<tr>

합계

</td>

</td>

</td>

</tr>

</table>

<br>

</textarea><button type="button" onclick='deleteBottomList();'>삭제</button>

</textarea>

</pre>

</td>

</tr>

</table>