hjjeong
546e8e8e02
- 견적서 메일 발송 API 추가 (ContractMgmtController, ContractMgmtService) - 견적관리 리스트에 메일 발송 상태 및 발송일시 컬럼 추가 - 메일 내용을 견적서 형식과 동일하게 변경 (품목 테이블 포함) - 메일 제목에 영업번호 및 OBJID 포함하여 발송 이력 추적 가능 - 견적서 템플릿: 단가/금액 콤마 표시 기능 추가 - 견적서 템플릿: 비고 컬럼 너비 확대 - S/N 모달창 텍스트 색상 개선 (가독성 향상) - 견적서 수정 시 특정 템플릿만 업데이트되도록 SQL 쿼리 수정
674 lines
21 KiB
Plaintext
674 lines
21 KiB
Plaintext
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
|
|
<%@ page import="com.pms.common.utils.*"%>
|
|
<%@ page import="java.util.*" %>
|
|
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
|
|
<%@include file= "/init.jsp" %>
|
|
<%
|
|
PersonBean person = (PersonBean)session.getAttribute(Constants.PERSON_BEAN);
|
|
String userId = CommonUtils.checkNull(person.getUserId());
|
|
String objId = CommonUtils.checkNull(request.getParameter("objId"));
|
|
String templateObjId = CommonUtils.checkNull(request.getParameter("templateObjId"));
|
|
%>
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
|
<title><%=Constants.SYSTEM_NAME%> - 견적서 양식1</title>
|
|
<style type="text/css">
|
|
@media print {
|
|
@page {
|
|
size: A4;
|
|
margin: 10mm;
|
|
}
|
|
body {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
.no-print {
|
|
display: none !important;
|
|
}
|
|
}
|
|
|
|
body {
|
|
font-family: "Malgun Gothic", "맑은 고딕", Arial, sans-serif;
|
|
font-size: 12pt;
|
|
margin: 0;
|
|
padding: 20px;
|
|
background-color: #f5f5f5;
|
|
}
|
|
|
|
.estimate-container {
|
|
width: 210mm;
|
|
min-height: 297mm;
|
|
background: white;
|
|
margin: 0 auto;
|
|
padding: 20mm;
|
|
box-shadow: 0 0 10px rgba(0,0,0,0.1);
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.header-section {
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.title {
|
|
text-align: center;
|
|
font-size: 28pt;
|
|
font-weight: bold;
|
|
letter-spacing: 20px;
|
|
margin-bottom: 40px;
|
|
padding: 10px 0;
|
|
}
|
|
|
|
.info-table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.info-table td {
|
|
padding: 5px 8px;
|
|
border: 1px solid #000;
|
|
font-size: 9pt;
|
|
}
|
|
|
|
.info-table .label {
|
|
background-color: #f0f0f0;
|
|
font-weight: bold;
|
|
width: 80px;
|
|
text-align: center;
|
|
}
|
|
|
|
.company-info {
|
|
float: right;
|
|
text-align: right;
|
|
margin-top: -80px;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.company-stamp {
|
|
width: 120px;
|
|
height: 120px;
|
|
border: 2px solid #e74c3c;
|
|
border-radius: 50%;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-bottom: 10px;
|
|
position: relative;
|
|
}
|
|
|
|
.company-stamp-text {
|
|
writing-mode: vertical-rl;
|
|
font-size: 16pt;
|
|
font-weight: bold;
|
|
color: #e74c3c;
|
|
letter-spacing: 3px;
|
|
}
|
|
|
|
.company-details {
|
|
font-size: 9pt;
|
|
line-height: 1.6;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.greeting {
|
|
font-size: 11pt;
|
|
margin-bottom: 20px;
|
|
line-height: 1.8;
|
|
}
|
|
|
|
.items-table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.items-table th,
|
|
.items-table td {
|
|
border: 1px solid #000;
|
|
padding: 6px 8px;
|
|
text-align: center;
|
|
font-size: 9pt;
|
|
}
|
|
|
|
.items-table th {
|
|
background-color: #f0f0f0;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.items-table .col-no { width: 6%; }
|
|
.items-table .col-desc { width: 20%; }
|
|
.items-table .col-spec { width: 22%; }
|
|
.items-table .col-qty { width: 7%; }
|
|
.items-table .col-unit { width: 8%; }
|
|
.items-table .col-price { width: 11%; }
|
|
.items-table .col-amount { width: 11%; }
|
|
.items-table .col-note { width: 15%; }
|
|
|
|
.items-table .text-left {
|
|
text-align: left;
|
|
}
|
|
|
|
.items-table .text-right {
|
|
text-align: right;
|
|
}
|
|
|
|
.notes-section {
|
|
margin-top: 30px;
|
|
font-size: 10pt;
|
|
line-height: 1.8;
|
|
}
|
|
|
|
.notes-title {
|
|
font-weight: bold;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.footer-company {
|
|
text-align: right;
|
|
margin-top: 40px;
|
|
font-size: 12pt;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.btn-area {
|
|
text-align: right;
|
|
margin-top: 20px;
|
|
padding: 10px;
|
|
}
|
|
|
|
.plm_btns {
|
|
padding: 10px 30px;
|
|
margin: 0 5px;
|
|
font-size: 14px;
|
|
cursor: pointer;
|
|
border: 1px solid #ddd;
|
|
background-color: #f8f9fa;
|
|
transition: background-color 0.2s;
|
|
}
|
|
|
|
.plm_btns:hover {
|
|
background-color: #e2e6ea;
|
|
border-color: #dae0e5;
|
|
}
|
|
|
|
input[type="text"],
|
|
textarea {
|
|
border: none;
|
|
outline: none;
|
|
background: transparent;
|
|
width: 100%;
|
|
font-family: inherit;
|
|
font-size: inherit;
|
|
}
|
|
|
|
textarea {
|
|
resize: vertical;
|
|
min-height: 30px;
|
|
}
|
|
|
|
.editable {
|
|
background-color: #fffef0;
|
|
}
|
|
|
|
@media print {
|
|
.editable {
|
|
background-color: transparent;
|
|
}
|
|
}
|
|
</style>
|
|
<script type="text/javascript">
|
|
// 전역 변수로 저장 (데이터 로드 시 설정됨)
|
|
var g_contractObjId = "<%=objId%>";
|
|
var g_templateObjId = "<%=templateObjId%>";
|
|
|
|
$(function(){
|
|
|
|
// templateObjId가 있으면 기존 데이터 로드
|
|
var templateObjId = "<%=templateObjId%>";
|
|
if(templateObjId && templateObjId !== ""){
|
|
fn_loadTemplateData(templateObjId);
|
|
}
|
|
|
|
// 인쇄 버튼
|
|
$("#btnPrint").click(function(){
|
|
window.print();
|
|
});
|
|
|
|
// 저장 버튼
|
|
$("#btnSave").click(function(){
|
|
if(confirm("견적서를 저장하시겠습니까?")) {
|
|
fn_save();
|
|
}
|
|
});
|
|
|
|
// 닫기 버튼
|
|
$("#btnClose").click(function(){
|
|
self.close();
|
|
});
|
|
|
|
// 행 추가 버튼
|
|
$("#btnAddRow").click(function(){
|
|
fn_addItemRow();
|
|
});
|
|
|
|
// 금액 자동 계산
|
|
$(document).on("change keyup", ".item-qty, .item-price", function(){
|
|
fn_calculateAmount($(this).closest("tr"));
|
|
});
|
|
|
|
// 콤마 자동 추가 (동적 요소 포함)
|
|
$(document).on("blur", ".item-price, .item-amount", function(){
|
|
var val = $(this).val().replace(/,/g, "").replace(/₩/g, "");
|
|
if(!isNaN(val) && val !== "") {
|
|
$(this).val(addComma(val));
|
|
}
|
|
});
|
|
|
|
// 단가 입력 시 실시간 콤마 처리
|
|
$(document).on("input", ".item-price", function(){
|
|
var val = $(this).val().replace(/,/g, "");
|
|
var cursorPos = this.selectionStart;
|
|
var commasBefore = ($(this).val().substring(0, cursorPos).match(/,/g) || []).length;
|
|
|
|
if(!isNaN(val) && val !== "") {
|
|
$(this).val(addComma(val));
|
|
// 커서 위치 조정
|
|
var commasAfter = ($(this).val().substring(0, cursorPos).match(/,/g) || []).length;
|
|
var newPos = cursorPos + (commasAfter - commasBefore);
|
|
this.setSelectionRange(newPos, newPos);
|
|
}
|
|
});
|
|
|
|
// 데이터 로드
|
|
if("<%=objId%>" !== "" && "<%=objId%>" !== "-1") {
|
|
fn_loadData();
|
|
}
|
|
});
|
|
|
|
// 금액 계산
|
|
function fn_calculateAmount(row) {
|
|
var qty = row.find(".item-qty").val().replace(/,/g, "") || "0";
|
|
var price = row.find(".item-price").val().replace(/,/g, "") || "0";
|
|
|
|
var amount = parseInt(qty) * parseInt(price);
|
|
if(!isNaN(amount)) {
|
|
row.find(".item-amount").val(addComma(amount));
|
|
}
|
|
}
|
|
|
|
// 콤마 추가
|
|
function addComma(num) {
|
|
var regexp = /\B(?=(\d{3})+(?!\d))/g;
|
|
return num.toString().replace(regexp, ',');
|
|
}
|
|
|
|
// 행 추가 함수
|
|
function fn_addItemRow() {
|
|
// 비고 행 제외하고 마지막 품목 행 찾기
|
|
var $lastRow = $("#itemsTableBody tr").not(":last");
|
|
var lastRowIndex = $lastRow.length;
|
|
var nextNo = lastRowIndex + 1;
|
|
|
|
// 새 행 생성
|
|
var newRow = '<tr>' +
|
|
'<td>' + nextNo + '</td>' +
|
|
'<td class="text-left editable"><input type="text" class="item-desc" value=""></td>' +
|
|
'<td class="text-left editable"><textarea class="item-spec"></textarea></td>' +
|
|
'<td class="editable"><input type="text" class="item-qty" value=""></td>' +
|
|
'<td class="editable"><input type="text" class="item-unit" value="EA"></td>' +
|
|
'<td class="text-right editable"><input type="text" class="item-price" value=""></td>' +
|
|
'<td class="text-right editable"><input type="text" class="item-amount" value="₩0" readonly></td>' +
|
|
'<td class="editable"><input type="text" class="item-note" value=""></td>' +
|
|
'</tr>';
|
|
|
|
// 비고 행 바로 위에 추가 (이벤트는 이미 document에 바인딩되어 있으므로 별도 바인딩 불필요)
|
|
$("#itemsTableBody tr:last").before(newRow);
|
|
}
|
|
|
|
// 데이터 로드
|
|
function fn_loadData() {
|
|
$.ajax({
|
|
url: "/contractMgmt/getEstimateDetail.do",
|
|
type: "POST",
|
|
data: {
|
|
objId: "<%=objId%>"
|
|
},
|
|
dataType: "json",
|
|
success: function(data) {
|
|
if(data && data.estimate) {
|
|
// 데이터 바인딩
|
|
$("#executor").val(data.estimate.EXECUTOR || "");
|
|
$("#recipient").val(data.estimate.RECIPIENT || "");
|
|
$("#estimate_no").val(data.estimate.ESTIMATE_NO || "");
|
|
$("#contact_person").val(data.estimate.CONTACT_PERSON || "");
|
|
$("#greeting_text").val(data.estimate.GREETING_TEXT || "견적을 요청해 주셔서 대단히 감사합니다.\n하기와 같이 견적서를 제출합니다.");
|
|
|
|
// 품목 데이터 로드
|
|
if(data.items && data.items.length > 0) {
|
|
// 기존 행 초기화 후 데이터 추가
|
|
var itemsHtml = "";
|
|
for(var i = 0; i < data.items.length; i++) {
|
|
var item = data.items[i];
|
|
itemsHtml += '<tr>';
|
|
itemsHtml += '<td>' + (i + 1) + '</td>';
|
|
itemsHtml += '<td class="text-left editable"><input type="text" class="item-desc" value="' + (item.DESCRIPTION || '') + '"></td>';
|
|
itemsHtml += '<td class="text-left editable"><textarea class="item-spec">' + (item.SPECIFICATION || '') + '</textarea></td>';
|
|
itemsHtml += '<td class="editable"><input type="text" class="item-qty" value="' + (item.QUANTITY || '') + '"></td>';
|
|
itemsHtml += '<td class="editable"><input type="text" class="item-unit" value="' + (item.UNIT || 'EA') + '"></td>';
|
|
itemsHtml += '<td class="text-right editable"><input type="text" class="item-price" value="' + (item.UNIT_PRICE ? addComma(item.UNIT_PRICE) : '') + '"></td>';
|
|
itemsHtml += '<td class="text-right editable"><input type="text" class="item-amount" value="' + (item.AMOUNT ? addComma(item.AMOUNT) : '₩0') + '" readonly></td>';
|
|
itemsHtml += '<td class="editable"><input type="text" class="item-note" value="' + (item.NOTE || '') + '"></td>';
|
|
itemsHtml += '</tr>';
|
|
}
|
|
$("#itemsTableBody").html(itemsHtml);
|
|
}
|
|
|
|
// 비고 로드
|
|
$("#note1").val(data.estimate.NOTE1 || "1. 견적유효기간: 일");
|
|
$("#note2").val(data.estimate.NOTE2 || "2. 납품기간: 발주 후 1주 이내");
|
|
$("#note3").val(data.estimate.NOTE3 || "3. VAT 별도");
|
|
$("#note4").val(data.estimate.NOTE4 || "4. 결제 조건 : 기존 결제조건에 따름.");
|
|
}
|
|
},
|
|
error: function() {
|
|
Swal.fire("데이터를 불러오는데 실패했습니다.");
|
|
}
|
|
});
|
|
}
|
|
|
|
// 기존 견적서 데이터 로드 (templateObjId 기준)
|
|
function fn_loadTemplateData(templateObjId){
|
|
$.ajax({
|
|
url: "/contractMgmt/getEstimateTemplateDataByObjId.do",
|
|
type: "POST",
|
|
data: { templateObjId: templateObjId },
|
|
dataType: "json",
|
|
success: function(data){
|
|
console.log("견적서 데이터:", data); // 디버깅용
|
|
|
|
if(data.result === "success" && data.template){
|
|
var template = data.template;
|
|
|
|
// CONTRACT_OBJID를 전역 변수에 저장 (저장 시 사용)
|
|
var contractObjId = template.CONTRACT_OBJID || template.contract_objid || template.contractObjId || "";
|
|
if(contractObjId) {
|
|
g_contractObjId = contractObjId;
|
|
}
|
|
|
|
// 대문자/소문자 모두 지원
|
|
var executor = template.EXECUTOR || template.executor || "";
|
|
var recipient = template.RECIPIENT || template.recipient || "";
|
|
var estimateNo = template.ESTIMATE_NO || template.estimate_no || template.estimateNo || "";
|
|
var contactPerson = template.CONTACT_PERSON || template.contact_person || template.contactPerson || "";
|
|
var greetingText = template.GREETING_TEXT || template.greeting_text || template.greetingText || "";
|
|
var note1 = template.NOTE1 || template.note1 || "";
|
|
var note2 = template.NOTE2 || template.note2 || "";
|
|
var note3 = template.NOTE3 || template.note3 || "";
|
|
var note4 = template.NOTE4 || template.note4 || "";
|
|
|
|
// 기본 정보 채우기
|
|
$("#executor").val(executor);
|
|
$("#recipient").val(recipient);
|
|
$("#estimate_no").val(estimateNo);
|
|
$("#contact_person").val(contactPerson);
|
|
$("#greeting_text").val(greetingText);
|
|
$("#note1").val(note1);
|
|
$("#note2").val(note2);
|
|
$("#note3").val(note3);
|
|
$("#note4").val(note4);
|
|
|
|
// 품목 데이터 채우기
|
|
if(data.items && data.items.length > 0){
|
|
$("#itemsTableBody").empty();
|
|
data.items.forEach(function(item, idx){
|
|
var description = item.DESCRIPTION || item.description || '';
|
|
var specification = item.SPECIFICATION || item.specification || '';
|
|
var quantity = item.QUANTITY || item.quantity || '';
|
|
var unit = item.UNIT || item.unit || '';
|
|
var unitPrice = item.UNIT_PRICE || item.unit_price || item.unitPrice || '';
|
|
var amount = item.AMOUNT || item.amount || '';
|
|
var note = item.NOTE || item.note || '';
|
|
|
|
// 단가와 금액에 콤마 추가
|
|
var unitPriceFormatted = unitPrice ? addComma(unitPrice) : '';
|
|
var amountFormatted = amount ? addComma(amount) : '₩0';
|
|
|
|
var row = $("<tr>");
|
|
row.append('<td>' + (idx + 1) + '</td>');
|
|
row.append('<td class="text-left editable"><input type="text" class="item-desc" value="' + description + '"></td>');
|
|
row.append('<td class="text-left editable"><textarea class="item-spec">' + specification + '</textarea></td>');
|
|
row.append('<td class="editable"><input type="text" class="item-qty" value="' + quantity + '"></td>');
|
|
row.append('<td class="editable"><input type="text" class="item-unit" value="' + unit + '"></td>');
|
|
row.append('<td class="text-right editable"><input type="text" class="item-price" value="' + unitPriceFormatted + '"></td>');
|
|
row.append('<td class="text-right editable"><input type="text" class="item-amount" value="' + amountFormatted + '" readonly></td>');
|
|
row.append('<td class="editable"><input type="text" class="item-note" value="' + note + '"></td>');
|
|
$("#itemsTableBody").append(row);
|
|
});
|
|
}
|
|
} else {
|
|
console.error("데이터 로드 실패:", data);
|
|
Swal.fire("데이터를 불러오는데 실패했습니다.");
|
|
}
|
|
},
|
|
error: function(xhr, status, error){
|
|
console.error("AJAX 오류:", xhr, status, error);
|
|
Swal.fire("데이터를 불러오는데 실패했습니다.");
|
|
}
|
|
});
|
|
}
|
|
|
|
// 저장
|
|
function fn_save() {
|
|
var items = [];
|
|
$("#itemsTableBody tr").each(function(idx) {
|
|
var row = $(this);
|
|
var unitPrice = row.find(".item-price").val() || "";
|
|
var amount = row.find(".item-amount").val() || "";
|
|
|
|
items.push({
|
|
seq: idx + 1,
|
|
description: row.find(".item-desc").val() || "",
|
|
specification: row.find(".item-spec").val() || "",
|
|
quantity: row.find(".item-qty").val() || "",
|
|
unit: row.find(".item-unit").val() || "",
|
|
unit_price: unitPrice.replace(/,/g, ""),
|
|
amount: amount.replace(/,/g, "").replace(/₩/g, ""),
|
|
note: row.find(".item-note").val() || ""
|
|
});
|
|
});
|
|
|
|
// objId는 CONTRACT_OBJID를 의미함
|
|
var contractObjId = g_contractObjId;
|
|
|
|
// 유효성 검사
|
|
if(!contractObjId || contractObjId === "" || contractObjId === "-1") {
|
|
Swal.fire("견적서를 저장할 수 없습니다. 영업정보가 없습니다.");
|
|
return;
|
|
}
|
|
|
|
var formData = {
|
|
objId: contractObjId,
|
|
template_type: "1",
|
|
executor: $("#executor").val(),
|
|
recipient: $("#recipient").val(),
|
|
estimate_no: $("#estimate_no").val(),
|
|
contact_person: $("#contact_person").val(),
|
|
greeting_text: $("#greeting_text").val(),
|
|
note1: $("#note1").val(),
|
|
note2: $("#note2").val(),
|
|
note3: $("#note3").val(),
|
|
note4: $("#note4").val(),
|
|
items: JSON.stringify(items)
|
|
};
|
|
|
|
// templateObjId가 있을 때만 추가 (기존 견적서 수정 시에만)
|
|
if(g_templateObjId && g_templateObjId !== "" && g_templateObjId !== "-1") {
|
|
formData.templateObjId = g_templateObjId;
|
|
}
|
|
|
|
console.log("저장 데이터:", formData); // 디버깅용
|
|
console.log("신규 작성:", !formData.templateObjId); // 디버깅용
|
|
|
|
$.ajax({
|
|
url: "/contractMgmt/saveEstimate.do",
|
|
type: "POST",
|
|
data: formData,
|
|
dataType: "json",
|
|
success: function(data) {
|
|
console.log("저장 결과:", data); // 디버깅용
|
|
if(data.result === "success") {
|
|
Swal.fire({
|
|
title: "저장되었습니다.",
|
|
icon: "success"
|
|
}).then(function() {
|
|
if(opener && opener.fn_search) {
|
|
opener.fn_search();
|
|
}
|
|
self.close();
|
|
});
|
|
} else {
|
|
Swal.fire("저장에 실패했습니다." + (data.message ? "\n" + data.message : ""));
|
|
}
|
|
},
|
|
error: function(xhr, status, error) {
|
|
console.error("저장 오류:", xhr, status, error); // 디버깅용
|
|
Swal.fire("저장 중 오류가 발생했습니다.");
|
|
}
|
|
});
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div class="estimate-container">
|
|
<!-- 제목 -->
|
|
<div class="title">견 적 서</div>
|
|
|
|
<!-- 상단 정보 테이블 -->
|
|
<table class="info-table">
|
|
<colgroup>
|
|
<col width="80px" />
|
|
<col width="*" />
|
|
<col width="300px" />
|
|
</colgroup>
|
|
<tr>
|
|
<td class="label">시행일자</td>
|
|
<td class="editable">
|
|
<input type="text" id="executor" value="">
|
|
</td>
|
|
<td rowspan="4" style="text-align: center; border: none; vertical-align: middle; padding: 0;">
|
|
<div style="width: 100%; text-align: center; margin-bottom: 5px;">
|
|
<img src="/images/company_stamp.png" alt="회사 도장" style="width: 100%; height: auto;"
|
|
onerror="this.style.display='none'; this.nextElementSibling.style.display='flex';">
|
|
<div class="company-stamp" style="display: none; width: 100%; height: 250px;">
|
|
<div class="company-stamp-text">㈊알피에스<br>RPS CO., LTD<br>대표이사이동준</div>
|
|
</div>
|
|
</div>
|
|
<div style="text-align: left; font-size: 9pt; line-height: 1.8; padding: 0 5px;">
|
|
담당자 : 영업부<br>
|
|
연락처 :
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="label">수신처</td>
|
|
<td class="editable">
|
|
<input type="text" id="recipient" value="">
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="label">수신인</td>
|
|
<td class="editable">
|
|
<input type="text" id="contact_person" value="구매 담당자님 귀하">
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="label">견적번호</td>
|
|
<td class="editable">
|
|
<input type="text" id="estimate_no" value="">
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
|
|
<!-- 인사말 -->
|
|
<div style="margin-bottom: 10px; padding: 0px 5px; line-height: 1.6; font-size: 10pt;">
|
|
견적을 요청해 주셔서 대단히 감사합니다.<br>
|
|
하기와 같이 견적서를 제출합니다.
|
|
</div>
|
|
|
|
<!-- 부가세 별도 표시 -->
|
|
<div style="text-align: right; margin-top: -30px; margin-bottom: 20px; padding-right: 10px; font-size: 10pt;">
|
|
부가세 별도
|
|
</div>
|
|
|
|
<!-- 품목 테이블 -->
|
|
<table class="items-table">
|
|
<thead>
|
|
<tr>
|
|
<th class="col-no">번호<br>NO.</th>
|
|
<th class="col-desc">품 명<br>DESCRIPTION</th>
|
|
<th class="col-spec">규 격<br>SPECIFICATION</th>
|
|
<th class="col-qty">수량<br>Q'TY</th>
|
|
<th class="col-unit">단위<br>UNIT</th>
|
|
<th class="col-price">단 가<br>UNIT<br>PRICE</th>
|
|
<th class="col-amount">금 액<br>AMOUNT</th>
|
|
<th class="col-note">비고</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="itemsTableBody">
|
|
<tr>
|
|
<td>1</td>
|
|
<td class="text-left editable"><input type="text" class="item-desc" value=""></td>
|
|
<td class="text-left editable"><textarea class="item-spec"></textarea></td>
|
|
<td class="editable"><input type="text" class="item-qty" value=""></td>
|
|
<td class="editable"><input type="text" class="item-unit" value="EA"></td>
|
|
<td class="text-right editable"><input type="text" class="item-price" value=""></td>
|
|
<td class="text-right editable"><input type="text" class="item-amount" value="₩0" readonly></td>
|
|
<td class="editable"><input type="text" class="item-note" value=""></td>
|
|
</tr>
|
|
<tr>
|
|
<td>2</td>
|
|
<td class="text-left editable"><input type="text" class="item-desc" value=""></td>
|
|
<td class="text-left editable"><textarea class="item-spec"></textarea></td>
|
|
<td class="editable"><input type="text" class="item-qty" value=""></td>
|
|
<td class="editable"><input type="text" class="item-unit" value="EA"></td>
|
|
<td class="text-right editable"><input type="text" class="item-price" value=""></td>
|
|
<td class="text-right editable"><input type="text" class="item-amount" value="" readonly></td>
|
|
<td class="editable"><input type="text" class="item-note" value=""></td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="8" style="height: 100px; vertical-align: top; padding: 10px; text-align: left;">
|
|
<div style="font-weight: bold; margin-bottom: 10px; text-align: left;"><비고></div>
|
|
<textarea id="note_remarks" style="width: 100%; height: 70px; border: none; resize: none; font-family: inherit; font-size: 10pt; text-align: left;"></textarea>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
<!-- 참조사항 섹션 -->
|
|
<div class="notes-section">
|
|
<div class="notes-title"><참조사항></div>
|
|
<div class="editable"><input type="text" id="note1" value="1. 견적유효기간: 일"></div>
|
|
<div class="editable"><input type="text" id="note2" value="2. 납품기간: 발주 후 1주 이내"></div>
|
|
<div class="editable"><input type="text" id="note3" value="3. VAT 별도"></div>
|
|
<div class="editable"><input type="text" id="note4" value="4. 결제 조건 : 기존 결제조건에 따름."></div>
|
|
</div>
|
|
|
|
<!-- 하단 회사명 -->
|
|
<div class="footer-company">
|
|
㈜알피에스
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 버튼 영역 -->
|
|
<div class="btn-area no-print">
|
|
<input type="button" value="행 추가" id="btnAddRow" class="plm_btns">
|
|
<input type="button" value="인쇄" id="btnPrint" class="plm_btns">
|
|
<input type="button" value="저장" id="btnSave" class="plm_btns">
|
|
<input type="button" value="닫기" id="btnClose" class="plm_btns">
|
|
</div>
|
|
</body>
|
|
</html>
|
|
|