엑셀 다운 구현

pom.xml

@@ -215,7 +215,6 @@
         <dependency>
             <groupId>javax.servlet</groupId>
             <artifactId>jstl</artifactId>
-            <version>1.2</version>
         </dependency>
         <dependency>
             <groupId>taglibs</groupId>
@@ -278,31 +277,6 @@
         </dependency>
 
 
-        <!-- JSTL -->
-        <dependency>
-            <groupId>javax.servlet</groupId>
-            <artifactId>jstl</artifactId>
-        </dependency>
-
-        <!--
-        <dependency>
-            <groupId>nl.captcha</groupId>
-            <artifactId>captcha</artifactId>
-            <version>1.0</version>
-            <scope>system</scope>
-            <systemPath>${webapp.lib}/simple-captcha-1.2.1.jar</systemPath>
-        </dependency>
-        -->
-        <!--
-		<dependency>
-		    <groupId>commons-httpclient</groupId>
-		    <artifactId>commons-httpclient</artifactId>
-		    <version>3.1</version>
-		    <scope>system</scope>
-            <systemPath>${webapp.lib}/commons-httpclient-3.1.jar</systemPath>
-		</dependency>
-		-->
-
         <dependency>
             <groupId>org.projectlombok</groupId>
             <artifactId>lombok</artifactId>

src/main/java/com/ns/mobile/website/biz/dto/SellInfoDto.java

@@ -95,7 +95,25 @@ public class SellInfoDto extends BaseDto{
         
         return sellInfoDto;
     }
-	
+	public String getPayBackYnText() {
+		if(payBack == 0) {
+			return "";
+		}else {
+			if(payBackYn) {
+				return "지급완료";
+			}else {
+				return "지급대기";
+			}
+		}
+	}
+	public String getPhoneNumberText() {
+		 String regEx = "(\\d{3})(\\d{3,4})(\\d{4})";
+		 return phoneNumber.replaceAll(regEx, "$1-$2-$3");
+	}
+	public String getPphoneNumberText() {
+		String regEx = "(\\d{3})(\\d{3,4})(\\d{4})";
+		return pphoneNumber.replaceAll(regEx, "$1-$2-$3");
+	}
 	public String getInsertTypeText(){
 		switch(insertType) {
 		case "move":

src/main/java/com/ns/mobile/website/biz/service/SellInfoService.java

@@ -12,4 +12,6 @@ public interface SellInfoService {
 	public SellAddInfoModel getSellAddInfo();
 	
 	public void insertSellAdd(SellAddInfoParameter parameter);
+	
+	public void sellExcelDownload();
 }

src/main/java/com/ns/mobile/website/biz/service/impl/SellInfoServiceImpl.java

@@ -1,11 +1,27 @@
 package com.ns.mobile.website.biz.service.impl;
 
+import java.io.File;
+import java.io.FileOutputStream;
 import java.time.LocalDate;
 import java.time.YearMonth;
 import java.time.format.DateTimeFormatter;
 import java.util.ArrayList;
 import java.util.List;
 
+import org.apache.poi.hssf.usermodel.HSSFFont;
+import org.apache.poi.hssf.usermodel.HSSFSheet;
+import org.apache.poi.hssf.usermodel.HSSFWorkbook;
+import org.apache.poi.ss.usermodel.BorderStyle;
+import org.apache.poi.ss.usermodel.Cell;
+import org.apache.poi.ss.usermodel.CellStyle;
+import org.apache.poi.ss.usermodel.HorizontalAlignment;
+import org.apache.poi.ss.usermodel.Row;
+import org.apache.poi.ss.util.CellRangeAddress;
+import org.apache.poi.xssf.usermodel.XSSFCell;
+import org.apache.poi.xssf.usermodel.XSSFFont;
+import org.apache.poi.xssf.usermodel.XSSFRow;
+import org.apache.poi.xssf.usermodel.XSSFSheet;
+import org.apache.poi.xssf.usermodel.XSSFWorkbook;
 import org.springframework.stereotype.Service;
 
 import com.ns.mobile.website.biz.dto.SellInfoDto;
@@ -124,4 +140,146 @@ public class SellInfoServiceImpl implements SellInfoService{
 		sellInfoRepository.save(sellInfo);
 	}
 
+	@Override
+	public void sellExcelDownload() {
+		
+	}
+//	@Override
+//	public void sellExcelDownload() {
+//		//.xls 확장자 지원
+//		HSSFWorkbook wb = null;
+//		HSSFSheet sheet = null;
+//		Row row = null;
+//		Cell cell = null;
+//		
+//		//.xlsx 확장자 지원
+//		XSSFWorkbook xssfWb = null; // .xlsx
+//		XSSFSheet xssfSheet = null; // .xlsx
+//		XSSFRow xssfRow = null; // .xlsx
+//		XSSFCell xssfCell = null;// .xlsx
+//			
+//		try {
+//			int rowNo = 0; // 행 갯수 
+//			// 워크북 생성
+//			xssfWb = new XSSFWorkbook();
+//			xssfSheet = xssfWb.createSheet("엑셀 테스트"); // 워크시트 이름
+//			
+//			//헤더용 폰트 스타일
+//			XSSFFont font = xssfWb.createFont();
+//			font.setFontName(HSSFFont.FONT_ARIAL); //폰트스타일
+//			font.setFontHeightInPoints((short)14); //폰트크기
+//			font.setBold(true); //Bold 유무
+//			
+//			//테이블 타이틀 스타일
+//			CellStyle cellStyle_Title = xssfWb.createCellStyle();
+//			
+//			xssfSheet.setColumnWidth(3, (xssfSheet.getColumnWidth(3))+(short)2048); // 3번째 컬럼 넓이 조절
+//			xssfSheet.setColumnWidth(4, (xssfSheet.getColumnWidth(4))+(short)2048); // 4번째 컬럼 넓이 조절
+//			xssfSheet.setColumnWidth(5, (xssfSheet.getColumnWidth(5))+(short)2048); // 5번째 컬럼 넓이 조절
+//			
+//			xssfSheet.setColumnWidth(8, (xssfSheet.getColumnWidth(8))+(short)4096); // 8번째 컬럼 넓이 조절
+//			
+//			cellStyle_Title.setFont(font); // cellStle에 font를 적용
+//			cellStyle_Title.setAlignment(HorizontalAlignment.CENTER); // 정렬
+//			
+//			//셀병합
+//			xssfSheet.addMergedRegion(new CellRangeAddress(0, 0, 0, 8)); //첫행, 마지막행, 첫열, 마지막열( 0번째 행의 0~8번째 컬럼을 병합한다)
+//			//타이틀 생성
+//			xssfRow = xssfSheet.createRow(rowNo++); //행 객체 추가
+//			xssfCell = xssfRow.createCell((short) 0); // 추가한 행에 셀 객체 추가
+//			xssfCell.setCellStyle(cellStyle_Title); // 셀에 스타일 지정
+//			xssfCell.setCellValue("타이틀 입니다."); // 데이터 입력
+//			
+//			xssfRow = xssfSheet.createRow(rowNo++);  // 빈행 추가
+//			
+//			CellStyle cellStyle_Body = xssfWb.createCellStyle(); 
+//			cellStyle_Body.setAlignment(HorizontalAlignment.LEFT); 
+//			
+//			//헤더 생성
+//			xssfSheet.addMergedRegion(new CellRangeAddress(rowNo, rowNo, 0, 1)); //첫행,마지막행,첫열,마지막열
+//			xssfRow = xssfSheet.createRow(rowNo++); //헤더 01
+//			xssfCell = xssfRow.createCell((short) 0);
+//			xssfCell.setCellStyle(cellStyle_Body);
+//			xssfCell.setCellValue("헤더01 셀01");
+//			xssfCell = xssfRow.createCell((short) 8);
+//			xssfCell.setCellStyle(cellStyle_Body);
+//			xssfCell.setCellValue("헤더01 셀08");
+//			xssfRow = xssfSheet.createRow(rowNo++); //헤더 02
+//			xssfCell = xssfRow.createCell((short) 0);
+//			xssfCell.setCellStyle(cellStyle_Body);
+//			xssfCell.setCellValue("헤더02 셀01");
+//			xssfCell = xssfRow.createCell((short) 8);
+//			xssfCell.setCellStyle(cellStyle_Body);
+//			xssfCell.setCellValue("헤더02 셀08");
+//			xssfRow = xssfSheet.createRow(rowNo++); //헤더 03
+//			xssfCell = xssfRow.createCell((short) 0);
+//			xssfCell.setCellStyle(cellStyle_Body);
+//			xssfCell.setCellValue("헤더03 셀01");
+//			xssfCell = xssfRow.createCell((short) 8);
+//			xssfCell.setCellStyle(cellStyle_Body);
+//			xssfCell.setCellValue("헤더03 셀08");
+//			xssfRow = xssfSheet.createRow(rowNo++); //헤더 04
+//			xssfCell = xssfRow.createCell((short) 0);
+//			xssfCell.setCellStyle(cellStyle_Body);
+//			xssfCell.setCellValue("헤더04 셀01");
+//			xssfCell = xssfRow.createCell((short) 8);
+//			xssfCell.setCellStyle(cellStyle_Body);
+//			xssfCell.setCellValue("헤더04 셀08");
+//			
+//			//테이블 스타일 설정
+//			CellStyle cellStyle_Table_Center = xssfWb.createCellStyle();
+//			cellStyle_Table_Center.setBorderTop(BorderStyle.THIN); //테두리 위쪽
+//			cellStyle_Table_Center.setBorderBottom(BorderStyle.THIN); //테두리 아래쪽
+//			cellStyle_Table_Center.setBorderLeft(BorderStyle.THIN); //테두리 왼쪽
+//			cellStyle_Table_Center.setBorderRight(BorderStyle.THIN); //테두리 오른쪽
+//			cellStyle_Table_Center.setAlignment(HorizontalAlignment.CENTER);
+//			
+//			xssfRow = xssfSheet.createRow(rowNo++);
+//			xssfCell = xssfRow.createCell((short) 0);
+//			xssfCell.setCellStyle(cellStyle_Table_Center);
+//			xssfCell.setCellValue("테이블 셀1");
+//			xssfCell = xssfRow.createCell((short) 1);
+//			xssfCell.setCellStyle(cellStyle_Table_Center);
+//			xssfCell.setCellValue("테이블 셀2");
+//			xssfCell = xssfRow.createCell((short) 2);
+//			xssfCell.setCellStyle(cellStyle_Table_Center);
+//			xssfCell.setCellValue("테이블 셀3");
+//			xssfCell = xssfRow.createCell((short) 3);
+//			xssfCell.setCellStyle(cellStyle_Table_Center);
+//			xssfCell.setCellValue("테이블 셀4");
+//			xssfCell = xssfRow.createCell((short) 4);
+//			xssfCell.setCellStyle(cellStyle_Table_Center);
+//			xssfCell.setCellValue("테이블 셀5");
+//			xssfCell = xssfRow.createCell((short) 5);
+//			xssfCell.setCellStyle(cellStyle_Table_Center);
+//			xssfCell.setCellValue("테이블 셀6");
+//			xssfCell = xssfRow.createCell((short) 6);
+//			xssfCell.setCellStyle(cellStyle_Table_Center);
+//			xssfCell.setCellValue("테이블 셀7");
+//			xssfCell = xssfRow.createCell((short) 7);
+//			xssfCell.setCellStyle(cellStyle_Table_Center);
+//			xssfCell.setCellValue("테이블 셀8");
+//			xssfCell = xssfRow.createCell((short) 8);
+//			xssfCell.setCellStyle(cellStyle_Table_Center);
+//			xssfCell.setCellValue("테이블 셀9");
+//			
+//			String localFile = "D:\\Desktop\\" + "테스트_엑셀" + ".xlsx";
+//			File file = new File(localFile);
+//			FileOutputStream fos = null;
+//			fos = new FileOutputStream(file);
+//			xssfWb.write(fos);
+//
+//			if (xssfWb != null)	xssfWb.close();
+//			if (fos != null) fos.close();
+//			
+//			//ctx.put("FILENAME", "입고상세출력_"+ mapList.get(0).get("PRINT_DATE"));
+//			//if(file != null) file.deleteOnExit();
+//			}
+//			catch(Exception e){
+//	        	
+//			}finally{
+//				
+//		    }
+//		}
+
 }

src/main/java/com/ns/mobile/website/web/controller/home/SellInfoController.java

@@ -1,12 +1,26 @@
 package com.ns.mobile.website.web.controller.home;
 
+import java.net.URLEncoder;
+import java.util.Calendar;
+import java.util.Date;
+
 import javax.servlet.http.HttpServletRequest;
+import javax.servlet.http.HttpServletResponse;
 import javax.servlet.http.HttpSession;
 
+import org.apache.poi.hssf.usermodel.HSSFDataFormat;
+import org.apache.poi.ss.usermodel.Cell;
+import org.apache.poi.ss.usermodel.CellStyle;
+import org.apache.poi.ss.usermodel.CreationHelper;
+import org.apache.poi.ss.usermodel.Row;
+import org.apache.poi.ss.usermodel.Sheet;
+import org.apache.poi.xssf.usermodel.XSSFWorkbook;
+import org.json.JSONArray;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Controller;
 import org.springframework.ui.Model;
 import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestParam;
 
 import com.ns.mobile.website.biz.service.SellInfoService;
 import com.ns.mobile.website.web.auth.PublicAccess;
@@ -22,7 +36,7 @@ public class SellInfoController extends BaseController {
 	private final LaneduProperties laneduProperties;
 	
 	@Autowired
-	private SellInfoService sellService;
+	private SellInfoService sellInfoService;
 	
 	@PublicAccess
 	@RequestMapping(value = {"sell/info"})
@@ -40,7 +54,116 @@ public class SellInfoController extends BaseController {
 		return "sell/add";
 	}
 	
+	@PublicAccess
+	@RequestMapping(value = {"sell/excel/info"})
+	String excelInfo(Model model, HttpServletRequest request, HttpSession session
+		) {
+		model.addAttribute("version", laneduProperties.getVersion());
+		return "sell/excel/info";
+	}
 	
+	@PublicAccess
+	@RequestMapping(value = {"sell/excel/download.do"})
+	public void excelDown(HttpServletRequest request, HttpServletResponse response,
+	        @RequestParam(value = "title") String title, @RequestParam(value = "contents") String contents,
+	        @RequestParam(value = "name") String name, @RequestParam(value = "rows") String rows,
+	        @RequestParam(value = "columns") String columns) throws Exception{
+	
+		 try {
+			 
+		        // request로 json 데이터 받기 String으로 받아 json으로 변환
+		        JSONArray dataArry = new JSONArray(contents);
+		        String[] myTitle = title.split(",");
+		 
+		        // 로우 파라미터 int로 변환
+		        int myRows = Integer.parseInt(rows);
+		 
+		        // 컬럼 파라미터 int로 변환
+		        int myColumns = Integer.parseInt(columns);
+		 
+		        // Workbook 생성
+		        XSSFWorkbook xlsWb = new XSSFWorkbook(); // Excel 2007 이전 버전
+		 
+		        // Sheet 생성
+		        Sheet sheet1 = xlsWb.createSheet(name);
+		        Row row = null;
+		        Cell cell = null;
+		 
+		        row = sheet1.createRow(0);
+		 
+		        // excel 파일 저장
+		        for (int r = 0; r < myRows; r++) {
+		 
+		            // 셀 제목 설정
+		            if (r == 0) {
+		 
+		                for (int c = 0; c < myColumns; c++) {
+		 
+		                    cell = row.createCell(c);
+		                    cell.setCellValue(myTitle[c]);
+		 
+		                }
+		            }
+		 
+		            row = sheet1.createRow(r + 1); // 두번째줄을 생성(i+1)
+		 
+		            for (int c = 0; c < myColumns; c++) {
+		 
+		                cell = row.createCell(c);
+		                if(!dataArry.getJSONObject(r).getString(myTitle[c]).equals("0")) {
+		                	if(myTitle[c].equals("개통일")) {
+		                		CellStyle formatCs = xlsWb.createCellStyle();
+		                		CreationHelper createHelper = xlsWb.getCreationHelper();
+		                		formatCs.setDataFormat(
+		                		    createHelper.createDataFormat().getFormat("MM월dd일"));
+		                		Calendar date1 = Calendar.getInstance();
+		                		int yyyy = Integer.parseInt(dataArry.getJSONObject(r).getString(myTitle[c]).substring(0,4));
+		                		int MM = Integer.parseInt(dataArry.getJSONObject(r).getString(myTitle[c]).substring(4,6))-1;
+		                		int dd = Integer.parseInt(dataArry.getJSONObject(r).getString(myTitle[c]).substring(6,8));
+		                		date1.set(yyyy, MM, dd);
+		                		cell.setCellValue(date1);
+		                		cell.setCellStyle(formatCs);
+		                	}else if(myTitle[c].equals("정산금액") || myTitle[c].equals("세금") || myTitle[c].equals("실마진")) {
+		                		Long money = Long.parseLong(dataArry.getJSONObject(r).getString(myTitle[c]).replaceAll(",", ""));
+		                		cell.setCellValue(money);                	
+		                	}else {
+		                		cell.setCellValue(dataArry.getJSONObject(r).getString(myTitle[c]));
+		                	}
+		                }else {
+		                	cell.setCellValue("");
+		                }
+		 
+		            }
+		 
+		        }
+		 
+		        // 브라우저 별 한글 인코딩
+		        String header = request.getHeader("User-Agent");
+		        if (header.contains("MSIE") || header.contains("Trident")) { // IE 11버전부터 Trident로 변경되었기때문에 추가해준다.
+		            name = URLEncoder.encode(name, "UTF-8").replaceAll("\\+", "%20");
+		            response.setHeader("Content-Disposition", "attachment;filename=" + name + ".xls;");
+		        } else if (header.contains("Chrome")) {
+		            name = new String(name.getBytes("UTF-8"), "ISO-8859-1");
+		            response.setHeader("Content-Disposition", "attachment; filename=\"" + name + "\".xls");
+		        } else if (header.contains("Opera")) {
+		            name = new String(name.getBytes("UTF-8"), "ISO-8859-1");
+		            response.setHeader("Content-Disposition", "attachment; filename=\"" + name + "\".xls");
+		        } else if (header.contains("Firefox")) {
+		            name = new String(name.getBytes("UTF-8"), "ISO-8859-1");
+		            response.setHeader("Content-Disposition", "attachment; filename=\"" + name + "\".xls");
+		        }
+		 
+		        // 엑셀 출력
+		        xlsWb.write(response.getOutputStream());
+		        xlsWb.close();
+		        System.out.println("Excel 출력 완료");
+		    } catch (Exception e) {
+		        e.printStackTrace();
+		        response.setHeader("Set-Cookie", "fileDownload=false; path=/");
+		        System.out.println("Excel 출력 실패");
+		    }
+		
+	}
 }
 
 

src/main/java/com/ns/mobile/website/web/controller/home/api/ApiSellInfoController.java

@@ -47,6 +47,7 @@ public class ApiSellInfoController extends BaseController {
 		sellInfoService.insertSellAdd(parameter);
 		return ResponseResult.success();
 	}
+	
 //	
 //	@PublicAccess
 //	@PostMapping("/api/phone/detail.api")

src/main/resources/static/res/front/css/default.css

@@ -25,6 +25,15 @@
 #container {
     min-width: 100vw;
 }
+.one-line-table thead > tr > th{
+	white-space:nowrap;
+}
+.one-line-table tbody > tr > th{
+	white-space:nowrap;
+}
+.one-line-table tbody > tr > td{
+	white-space:nowrap;
+}
 
 body.sb-sidenav-toggled #wrapper #sidebar-wrapper {
     margin-left: 0;

src/main/resources/static/res/front/js/biz/common/common.js

@@ -324,11 +324,13 @@ function moneyText(value){
 	return moneyText(value,'N');
 }
 function moneyText(value,numYn){
-	if(numYn == 'N')
+	if(numYn == 'N' || numYn == undefined)
 		value = Number(value.replaceAll(',', ''));
 	
-	if(value < 999){
+	if((0 < value && value < 999) || value == ""){
     	value = value*10000;
+	}else{
+		value = Number(value);
 	}
 	
 	if(isNaN(value)) {         //NaN인지 판별
@@ -338,6 +340,7 @@ function moneyText(value,numYn){
     	return formatValue;
   	}
 }
+
 //Toggle Menu 버튼
 window.addEventListener('DOMContentLoaded', event => {
 

src/main/resources/static/res/front/js/biz/sell/add.js

@@ -28,7 +28,7 @@ let appVue = new Vue({
 		installment: '0',
 		phoneId: '',
 		insertType: 'change',
-		usim: '0',
+		usim: '',
 		formula: '',
 		faceValueRebate: '',
 		guestMoney: '',
@@ -46,6 +46,7 @@ let appVue = new Vue({
     },
     mounted: function () {
         this.init();
+document.body.classList.toggle('sb-sidenav-toggled');
     },
     computed: {},
 	updated: function(){
@@ -128,7 +129,7 @@ let appVue = new Vue({
 				alert('출고가를 입력하세요');
 				return false;
 			}
-			if($this.disclosureSubsidy != '' ||  $this.disclosureSubsidy != 0){
+			if($this.disclosureSubsidy != '' ||  $this.disclosureSubsidy != 0 ||  $this.disclosureSubsidy != '0'){
 				$this.disclosureSubsidyYn = true;
 			}
 			
@@ -174,7 +175,7 @@ let appVue = new Vue({
                     return false;
                 }
 				alert("저장 되었습니다.");
-				//location.reload();
+				location.reload();
             });
 		},
 		openingDayBlur: function (){

src/main/resources/static/res/front/js/biz/sell/info.js

@@ -75,10 +75,8 @@ let appVue = new Vue({
 		},
 		getSettlementAmount: function(x){
 			//(액면리베이트+고객현금)-(현금수납+유심비+수수료) = 정산금액
-			var fees = 0;
-			if(x.insertType == 'move'){
-				fees = 800;
-			}
+			let $this = this;      
+			let fees = $this.getFees(x);
 			var settlementAmount = (x.faceValueRebate+x.guestMoney) - (x.cashRebate+x.usim+fees);
 
 			return moneyText(settlementAmount,'Y');			
@@ -114,10 +112,8 @@ let appVue = new Vue({
 		getBondIssuanceAmount: function(x){
 			//(액면리베이트+추가리베이트+유심)-(현금수납+수수료+차감) = 채권발생액 //차감없음
 			let $this = this;        	
-			var fees = 0;
-			if(x.insertType == 'move'){
-				fees = 800;
-			}
+			let fees = $this.getFees(x);
+			
 			var settlementAmount = Number($this.getSettlementAmount(x).replaceAll(',',''));
 			var bondIssuanceAmount = ((settlementAmount + x.addRebate + x.usim)-(x.guestMoney+fees));
 					
@@ -131,6 +127,12 @@ let appVue = new Vue({
 			
 			return moneyText(realBondIssuanceAmount,'Y');
 		},
+		getinstallmentPrincipal: function(x){
+			//출고가-공시지원금 = 할부원금
+			let $this = this;        				
+			var installmentPrincipal = x.factoryPrice - x.disclosureSubsidy;
+			return moneyText(installmentPrincipal,'Y');
+		},
 		searchDateBlur: function (){
 			let $this = this;
 			
@@ -140,6 +142,95 @@ let appVue = new Vue({
 			else if($this.searchDate.length == 4){
 				$this.searchDate = '20' + $this.searchDate;
 			}
+		},
+		getFees: function (x){
+			var fees = 0;
+			if(x.insertType == 'move'){
+				fees = 800;
+			}
+			return fees;
+		},
+		getSubPlan: function (x,i){
+			var fullText = x.subRatePlan;
+			var subPlanList = fullText.split(',');
+			if(subPlanList.length > i){
+				if(i==2){
+					var temp = '';
+					for(var j=2;j<subPlanList.length;j++){
+						temp += subPlanList[j]+',';
+					}
+					return temp.substring(0,temp.length -1);
+				}else{
+		    		return subPlanList[i];
+				}
+		  	}else{
+		    	return "";
+		  	}
+		},
+		changeDateFormat: function(date, format){
+			date = new Date(date);
+			return date.format(format);
+		},
+		getMaintenancePeriod: function(x){
+			if(x.disclosureSubsidyYn){
+				return 190;
+			}
+			return 130;
+		},
+		getChangeDay: function(x){
+			let $this = this;
+			var date = new Date(x.openingDate);
+		    date.setDate(date.getDate() + $this.getMaintenancePeriod(x));
+		    return $this.changeDateFormat(date,'MM월dd일');
+		},
+		excelDown: function(){
+			let $this = this;
+			if (confirm("엑셀파일로 저장하시겠습니까?") == true) {
+			    var myTable = $("#amountTable");
+			    var rows = $("table > tbody > tr").length;
+			    var columns = $("table > thead > tr > th").length;
+			    if (rows < 2) {
+			        alert("엑셀파일로 저장할 데이터가 없습니다.");
+			        return;
+			    }
+			    var dataParam = $this.tableToJson(myTable);
+			    var myTitle = dataParam[0].toString();
+			    var myContents = dataParam[1];
+			    var name = "판매일보";
+			    var form = "<form action='/sell/excel/download.do' method='post'>";
+			    form += "<input type='hidden' name='title' value='" + myTitle + "' />";
+			    form += "<input type='hidden' name='contents' value='" + myContents + "' />";
+			    form += "<input type='hidden' name='name' value='" + name + "' />";
+			    form += "<input type='hidden' name='rows' value='" + rows + "' />";
+			    form += "<input type='hidden' name='columns' value='" + columns + "' />";
+			    form += "</form>";
+			            
+			    jQuery(form).appendTo("body").submit().remove();
+			}
+		},
+		tableToJson: function(table) {
+		    var myRows = [];
+		    var title = [];
+		    var $headers = table.find('th');
+		    table.find('th').each(function(index, item) {
+		        title[index] = $(item).html();
+		    });
+		 
+		    var $rows = table.find('tbody tr').each(
+		            function(index) {
+		                $cells = $(this).find("td");
+		                myRows[index] = {};
+		                $cells.each(function(cellIndex) {
+		                    myRows[index][$($headers[cellIndex]).html()] = $(
+		                            this).html();
+		                });
+		            });
+		 
+		    var myObj = {};
+		    myObj = myRows;
+		 
+		    var myJson = JSON.stringify(myObj);
+		    return [ title, myJson ];
 		}
     }
 });

src/main/webapp/WEB-INF/view/sell/add.jsp

@@ -23,7 +23,7 @@
                 <div class="container-fluid" id="vueApp">                                        					
 					<h3 class="mt-3 mb-3">고객정보 등록</h3>
 					
-					<h5 class="mt-3 mb-3">거래 정보</h5>
+					<h5 class="mt-3 mb-3">뒷면</h5>
 					<div class="border border-2 mb-3">
 						<div class="row d-flex justify-content-center">
 							<label for="openingDate" class="col-sm-1 col-form-label mb-3 pt-3">날짜</label>
@@ -33,7 +33,7 @@
 						    <label for="businessPartner" class="col-sm-1 col-form-label mb-3 pt-3">거래처</label>
 						    <div class="col-sm-3 mb-3 pt-3">
 								<select class="selectpicker show-tick" data-width="100%" title='' data-live-search="true" id="businessPartner" v-model="businessPartner" @change="businessPartnerChange" tabindex="2" >
-							        	<option v-for="(x, index) in info.businessPartnerList" :index="x.id" :value="x.id">{{x.partnerName}}</option>
+							        	<option v-for="(x, index) in info.businessPartnerList" :index="x.id" :value="x.id">{{x.partnerName}} | {{x.carrierName}}</option>
 								</select>
 						    </div>
 						    <label for="mobileCarrier" class="col-sm-1 col-form-label mb-3 pt-3">통신사</label>
@@ -42,42 +42,78 @@
 						    </div>
 						</div>
 					</div>
+					<div class="border border-2 mb-3">
+						<div class="row d-flex justify-content-center">
+							<label for="formula" class="col-sm-2 col-form-label mb-3 pt-3">계산식</label>
+						    <div class="col-sm-3 mb-3 pt-3">
+						    	<input type="text" class="form-control" id="formula" value="1+2+4+5+6-2" v-model="formula" @input="formulaChange" tabindex="4">
+						    </div>
+						    <div class="vr p-0 m-0"></div>
+						    <label for="faceValueRebate" class="col-sm-2 col-form-label mb-3 pt-3">R(액면R/B)</label>
+						    <div class="col-sm-3 mb-3 pt-3">
+						    	<input type="text" class="form-control" id="faceValueRebate" v-model="faceValueRebate" disabled="disabled" value="160000">
+						    </div>
+						</div>
+						<div class="row d-flex justify-content-center">
+							<label for="cashRebate" class="col-sm-2 col-form-label mb-3">P(현금수납 or 상품권)</label>
+						    <div class="col-sm-3 mb-3">
+						    	<input type="text" class="form-control" id="cashRebate" v-model="cashRebate" value="0" @blur="cashRebate = callMoneyText(cashRebate)" tabindex="5">
+						    </div>
+						    <div class="vr p-0 m-0"></div>
+							<label for="guestMoney" class="col-sm-2 col-form-label mb-3">고객현금</label>
+						    <div class="col-sm-3 mb-3">
+						    	<input type="text" class="form-control" id="guestMoney" v-model="guestMoney" value="130000" @blur="guestMoney = callMoneyText(guestMoney)" tabindex="6">
+						    </div>
+						</div>
+						
+						<div class="row d-flex justify-content-center">
+							<label for="introductionPay" class="col-sm-2 col-form-label mb-3">소개비</label>
+						    <div class="col-sm-3 mb-3">
+						    	<input type="text" class="form-control" id="introductionPay" v-model="introductionPay" value="10000" @blur="introductionPay = callMoneyText(introductionPay)" tabindex="7">
+						    </div>
+						    <div class="vr p-0 m-0"></div>
+						    <label for="payBack" class="col-sm-2 col-form-label mb-3">페이백(P/B)</label>
+						    <div class="col-sm-3 mb-3">
+						    	<input type="text" class="form-control" id="payBack" v-model="payBack" value="30000" @input="payBackChange" @blur="payBack = callMoneyText(payBack)" tabindex="8">
+						    </div>
+						</div>
+					</div>
 					
 					<h5 class="mt-3 mb-3">고객정보 등록</h5>
 					<div class="border border-2 mb-3">
 						<div class="row d-flex justify-content-center">
 							<label for="name" class="col-sm-2 col-form-label mb-3 pt-3">이름</label>
 						    <div class="col-sm-3 mb-3 pt-3">
-						    	<input type="text" class="form-control" id="name" v-model="name" value="한강욱" tabindex="3">
+						    	<input type="text" class="form-control" id="name" v-model="name" value="한강욱" tabindex="9">
 						    </div>
 						    <div class="vr p-0 m-0"></div>
 						    <label for="pname" class="col-sm-2 col-form-label mb-3 pt-3">법대이름</label>
 						    <div class="col-sm-3 mb-3 pt-3">
-						    	<input type="text" class="form-control" id="pname" v-model="pname" value="황민창" tabindex="6" disabled="disabled">
+						    	<input type="text" class="form-control" id="pname" v-model="pname" value="황민창" tabindex="12" disabled="disabled">
 						    </div>
 						</div>
 						
 						<div class="row d-flex justify-content-center">
 							<label for="birthday" class="col-sm-2 col-form-label mb-3">생년월일</label>
 						    <div class="col-sm-3 mb-3">
-						    	<input type="text" class="form-control" id="birthday" v-model="birthday" value="" tabindex="4" @input="birthdayChange" @blur="birthdayBlur">
+						    	<input type="text" class="form-control" id="birthday" v-model="birthday" value="" tabindex="10" @input="birthdayChange" @blur="birthdayBlur">
 						    </div>
 						    <div class="vr p-0 m-0"></div>
 						    <label for="pbirthday" class="col-sm-2 col-form-label mb-3">법대생년월일</label>
 						    <div class="col-sm-3 mb-3">
-						    	<input type="text" class="form-control" id="pbirthday" v-model="pbirthday" value="" tabindex="7" disabled="disabled" @blur="pbirthdayBlur">
+						    	<input type="text" class="form-control" id="pbirthday" v-model="pbirthday" value="" tabindex="13" disabled="disabled" @blur="pbirthdayBlur">
 						    </div>
 						</div>
 						
 						<div class="row d-flex justify-content-center">
 							<label for="phoneNumber" class="col-sm-2 col-form-label mb-3">핸드폰번호</label>
 						    <div class="col-sm-3 mb-3">
-						    	<input type="text" class="form-control" id="phoneNumber" v-model="phoneNumber" value="" tabindex="5">
+						    	<input type="text" class="form-control" id="phoneNumber" v-model="phoneNumber" value="" tabindex="11">
 						    </div>
 						    <div class="vr p-0"></div>
 						    <label for="pphoneNumber" class="col-sm-2 col-form-label mb-3">법대핸드폰번호</label>
 						    <div class="col-sm-3 mb-3">
-						    	<input type="text" class="form-control" id="pphoneNumber" v-model="pphoneNumber" value="" tabindex="8" disabled="disabled">
+						    	<input type="text" class="form-control" id="pphoneNumber" v-model="pphoneNumber" value="" tabindex="14" disabled="disabled">
 						    </div>
 						</div>
 					</div>
@@ -85,33 +121,16 @@
 					<h5 class="mt-3 mb-3">개통정보</h5>
 					<div class="border border-2 mb-3">
 						<div class="row d-flex justify-content-center">
-							<label for="installment" class="col-sm-2 col-form-label mb-3 pt-3">할부개월</label>
-						    <div class="col-sm-3 mb-3 pt-3">
-						    	<select class="form-select" v-model="installment">
-									<option value="0" selected>0개월</option>
-									<option value="12">12개월</option>
-									<option value="24">24개월</option>
-									<option value="36">36개월</option>
-								</select>						    	
-						    </div>
-						    <div class="vr p-0 m-0"></div>
 						    <label for="phoneId" class="col-sm-2 col-form-label mb-3 pt-3">핸드폰</label>
 						    <div class="col-sm-3 mb-3 pt-3">
-						    	<select class="selectpicker show-tick" data-width="100%"  title='' data-live-search="true" id="phoneId" v-model="phoneId">
+						    	<select class="selectpicker show-tick" data-width="100%"  title='' data-live-search="true" id="phoneId" v-model="phoneId" tabindex="15">
 						    		<option v-for="(x, index) in info.phoneList" :index="x.id" :value="x.id">{{x.petName}} | {{x.model}}</option>
 						    	</select>
 						    </div>
-						</div>
-						
-						<div class="row d-flex justify-content-center">
-							<label for="serialNumber" class="col-sm-2 col-form-label mb-3">일련번호</label>
-						    <div class="col-sm-3 mb-3">
-						    	<input type="text" class="form-control" id="serialNumber" v-model="serialNumber" value="JYNWTXQC7W">
-						    </div>
 						    <div class="vr p-0 m-0"></div>
-						    <label for="insertType" class="col-sm-2 col-form-label mb-3">가입구분</label>
-						    <div class="col-sm-3 mb-3">
-						    	<select class="form-select" v-model="insertType" @change="insertTypeChange">
+						    <label for="insertType" class="col-sm-2 col-form-label mb-3 pt-3">가입구분</label>
+						    <div class="col-sm-3 mb-3 pt-3">
+						    	<select class="form-select" v-model="insertType" @change="insertTypeChange" tabindex="16">
 									<option value="change" selected>기변</option>
 									<option value="move">MNP</option>
 									<option value="new">신규</option>
@@ -120,94 +139,78 @@
 						    </div>
 						</div>
 						
+						<div class="row d-flex justify-content-center">
+							<label for="serialNumber" class="col-sm-2 col-form-label mb-3">일련번호</label>
+						    <div class="col-sm-3 mb-3">
+						    	<input type="text" class="form-control" id="serialNumber" v-model="serialNumber" value="JYNWTXQC7W" tabindex="17">
+						    </div>
+						    <div class="vr p-0 m-0"></div>
+						    <label for="installment" class="col-sm-2 col-form-label mb-3">할부개월</label>
+						    <div class="col-sm-3 mb-3">
+						    	<select class="form-select" v-model="installment" tabindex="18">
+									<option value="0" selected>0개월</option>
+									<option value="12">12개월</option>
+									<option value="24">24개월</option>
+									<option value="36">36개월</option>
+								</select>						    	
+						    </div>
+						</div>
+						
 						<div class="row d-flex justify-content-center">
 							<label for="factoryPrice" class="col-sm-2 col-form-label mb-3">출고가</label>
 						    <div class="col-sm-3 mb-3">
-						    	<input type="text" class="form-control" id="factoryPrice" v-model="factoryPrice" value="" @blur="factoryPrice = callMoneyText(factoryPrice)">
+						    	<input type="text" class="form-control" id="factoryPrice" v-model="factoryPrice" value="" @blur="factoryPrice = callMoneyText(factoryPrice)" tabindex="19">
 						    </div>
 						    <div class="vr p-0 m-0"></div>
 						    <label for="disclosureSubsidy" class="col-sm-2 col-form-label mb-3">공시지원금(안적으면 선약)</label>
 						    <div class="col-sm-3 mb-3">
-						    	<input type="text" class="form-control" id="disclosureSubsidy" v-model="disclosureSubsidy" value="" @blur="disclosureSubsidy = callMoneyText(disclosureSubsidy)">
+						    	<input type="text" class="form-control" id="disclosureSubsidy" v-model="disclosureSubsidy" value="" @blur="disclosureSubsidy = callMoneyText(disclosureSubsidy)" tabindex="20">
 						    </div>
 						</div>
 						
 						<div class="row d-flex justify-content-center">
-							<label for="phoneNumber" class="col-sm-2 col-form-label mb-3">부가서비스</label>
+							<label for="mainRatePlan" class="col-sm-2 col-form-label mb-3">요금제</label>
 						    <div class="col-sm-3 mb-3">
-						    	<select class="selectpicker show-tick" multiple data-width="100%" title='' data-live-search="true" id="subRatePlan" v-model="subRatePlan" >
-							        	<option v-for="(x, index) in view.subRatePlanList" :index="x.id">{{x.planName}}</option>
-								</select>
-						    </div>
-						    <div class="vr p-0"></div>
-						    <label for="mainRatePlan" class="col-sm-2 col-form-label mb-3">요금제</label>
-						    <div class="col-sm-3 mb-3">
-								<select class="selectpicker show-tick" data-width="100%" title='' data-live-search="true" id="mainRatePlan" v-model="mainRatePlan" >
+								<select class="selectpicker show-tick" data-width="100%" title='' data-live-search="true" id="mainRatePlan" v-model="mainRatePlan" tabindex="21" >
 							        	<option v-for="(x, index) in view.mainRatePlanList" :index="x.id">{{x.planName}}</option>
 								</select>
 						    </div>
+						    <div class="vr p-0"></div>
+							<label for="phoneNumber" class="col-sm-2 col-form-label mb-3">부가서비스</label>
+						    <div class="col-sm-3 mb-3">
+						    	<select class="selectpicker show-tick" multiple data-width="100%" title='' data-live-search="true" id="subRatePlan" v-model="subRatePlan" tabindex="22" >
+							        	<option v-for="(x, index) in view.subRatePlanList" :index="x.id">{{x.planName}}</option>
+								</select>
+						    </div>
+						   
 						</div>
 					</div>
 					
-					<h5 class="mt-3 mb-3">리베이트</h5>
+					<h5 class="mt-3 mb-3">기타</h5>
 					<div class="border border-2 mb-3">
 						<div class="row d-flex justify-content-center">
-							<label for="formula" class="col-sm-2 col-form-label mb-3 pt-3">계산식</label>
+							<label for="addRebate" class="col-sm-2 col-form-label mb-3 pt-3">추가R/B</label>
 						    <div class="col-sm-3 mb-3 pt-3">
-						    	<input type="text" class="form-control" id="formula" value="1+2+4+5+6-2" v-model="formula" @input="formulaChange">
+						    	<input type="text" class="form-control" id="addRebate" v-model="addRebate" value="130000" @blur="addRebate = callMoneyText(addRebate)" tabindex="23">
 						    </div>
 						    <div class="vr p-0 m-0"></div>
-						    <label for="faceValueRebate" class="col-sm-2 col-form-label mb-3 pt-3">액면R/B</label>
+						    <label for="usim" class="col-sm-2 col-form-label mb-3 pt-3">유심비</label>
 						    <div class="col-sm-3 mb-3 pt-3">
-						    	<input type="text" class="form-control" id="faceValueRebate" v-model="faceValueRebate" disabled="disabled" value="160000">
+						    	<input type="text" class="form-control" id="usim" v-model="usim" value="7700" @blur="usim = callMoneyText(usim)" tabindex="24">
 						    </div>
 						</div>
 						
-						<div class="row d-flex justify-content-center">
-							<label for="addRebate" class="col-sm-2 col-form-label mb-3">추가R/B</label>
-						    <div class="col-sm-3 mb-3">
-						    	<input type="text" class="form-control" id="addRebate" v-model="addRebate" value="130000" @blur="addRebate = callMoneyText(addRebate)">
-						    </div>
-						    <div class="vr p-0 m-0"></div>
-						    <label for="cashRebate" class="col-sm-2 col-form-label mb-3">현금수납</label>
-						    <div class="col-sm-3 mb-3">
-						    	<input type="text" class="form-control" id="cashRebate" v-model="cashRebate" value="0" @blur="cashRebate = callMoneyText(cashRebate)">
-						    </div>
-						</div>
+						
 						
 						<div class="row d-flex justify-content-center">
-							<label for="guestMoney" class="col-sm-2 col-form-label mb-3">고객현금</label>
+							<label for="payBackDay" class="col-sm-2 col-form-label mb-3">페이백 지급예정일자</label>
 						    <div class="col-sm-3 mb-3">
-						    	<input type="text" class="form-control" id="guestMoney" v-model="guestMoney" value="130000" @blur="guestMoney = callMoneyText(guestMoney)">
-						    </div>
-						    <div class="vr p-0 m-0"></div>
-						    <label for="usim" class="col-sm-2 col-form-label mb-3">유심비</label>
-						    <div class="col-sm-3 mb-3">
-						    	<input type="text" class="form-control" id="usim" v-model="usim" value="7700" @blur="usim = callMoneyText(usim)">
-						    </div>
-						</div>
-						
-						<div class="row d-flex justify-content-center">
-							<label for="introductionPay" class="col-sm-2 col-form-label mb-3">소개비</label>
-						    <div class="col-sm-3 mb-3">
-						    	<input type="text" class="form-control" id="introductionPay" v-model="introductionPay" value="10000" @blur="introductionPay = callMoneyText(introductionPay)">
-						    </div>
-						    <div class="vr p-0 m-0"></div>
-						    <label for="payBack" class="col-sm-2 col-form-label mb-3">페이백(P/B)</label>
-						    <div class="col-sm-3 mb-3">
-						    	<input type="text" class="form-control" id="payBack" v-model="payBack" value="30000" @input="payBackChange" @blur="payBack = callMoneyText(payBack)">
-						    </div>
-						</div>
-						
-						<div class="row d-flex justify-content-center">
-							<label for="payBackDay" class="col-sm-2 col-form-label mb-3">지급예정일자</label>
-						    <div class="col-sm-3 mb-3">
-						    	<input type="text" class="form-control" disabled id="payBackDay" v-model="payBackDay" value="22-12-30" @blur="payBackgDayBlur">
+						    	<input type="text" class="form-control" disabled id="payBackDay" v-model="payBackDay" value="22-12-30" @blur="payBackgDayBlur" tabindex="25">
 						    </div>
 						    <div class="vr p-0 m-0"></div>
 						    <label for="payBackYn" class="col-sm-2 col-form-label mb-3">지급여부</label>
 						    <div class="col-sm-3 mb-3">
-						    	<select class="form-select" id="payBackYn" disabled v-model="payBackYn">
+						    	<select class="form-select" id="payBackYn" disabled v-model="payBackYn" tabindex="26">
 									<option value="false" selected>지급대기</option>
 									<option value="true">지급완료</option>									
 								</select>		
@@ -216,7 +219,7 @@
 						<div class="row d-flex justify-content-center">
 							<label for="payBackBank" class="col-sm-2 col-form-label mb-3">지급계좌은행</label>
 						    <div class="col-sm-3 mb-3">
-						    	<select class="selectpicker show-tick" disabled data-width="100%" title='' data-live-search="true" id="payBackBank" v-model="payBackBank">
+						    	<select class="selectpicker show-tick" disabled data-width="100%" title='' data-live-search="true" id="payBackBank" v-model="payBackBank" tabindex="27">
 									<option>카카오뱅크</option>
 									<option>농협</option>
 									<option>국민</option>
@@ -244,13 +247,13 @@
 						    <div class="vr p-0"></div>
 						    <label for="payBackNumber" class="col-sm-2 col-form-label mb-3">지급계좌번호</label>
 						    <div class="col-sm-3 mb-3">
-						    	<input type="text" class="form-control" disabled id="payBackNumber" v-model="payBackNumber" value="111999111222333">
+						    	<input type="text" class="form-control" disabled id="payBackNumber" v-model="payBackNumber" value="111999111222333" tabindex="28">
 						    </div>
 						</div>
 					</div>
 					
 					<div class="row d-flex justify-content-center">
-		            	<button type="button" class="btn btn-primary btn-round mb-3 col-sm-2" @click="save">저장</button>
+		            	<button type="button" class="btn btn-primary btn-round mb-3 col-sm-2" @click="save" tabindex="29">저장</button>
 	            	</div>
                 </div>
             </div>

src/main/webapp/WEB-INF/view/sell/excel/info.jsp

@@ -0,0 +1,164 @@
+<%@ page contentType="text/html;charset=UTF-8"%>
+<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
+<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
+<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
+<!DOCTYPE html>
+<html lang="ko">
+<head>
+	<jsp:include page="/WEB-INF/view/include/inc_head.jsp"/>
+</head>
+<body>
+	<!-- wrapper : s -->
+	<div class="d-flex" id="wrapper">
+		<!-- Sidebar : s-->
+		<jsp:include page="/WEB-INF/view/include/inc_body_sidebar.jsp"/>
+		<!-- Sidebar : e-->
+		
+		<!-- container : s-->
+        <div id="container">
+                <!-- header : s-->
+            	<jsp:include page="/WEB-INF/view/include/inc_body_header.jsp"/>
+            	<!-- header : e-->    
+                
+                <div class="container-fluid" id="vueApp">
+               		<div class="row d-flex justify-content">
+               			<div class="pt-3">
+	                		<h3>조회 할 달1</h3>
+                		</div>
+                		<label for="businessPartner" class="col-sm-1 col-form-label mb-3">년월</label>
+               			<div class="col-sm-2 mb-3">
+                			<input type="text" class="form-control" id="searchDate" v-model="searchDate" tabindex="1"  @blur="searchDateBlur">
+               			</div>
+               			<div class="col-sm-1 mb-3">
+                			<button type="button" class="btn btn-primary btn-round" @click="bindData">검색</button>
+               			</div>
+               			<label for="businessPartner" class="col-sm-1 col-form-label mb-3">거래처</label>
+					    <div class="col-sm-3 mb-3">
+							<select class="selectpicker show-tick" multiple data-width="100%" title='' data-live-search="true" id="businessPartner" v-model="businessPartner" tabindex="2" >
+						        	<option v-for="(x, index) in info.businessPartnerList" :index="x.id" :value="x.id">{{x.partnerName}}</option>
+							</select>
+					    </div>
+					    <div>
+					    	<button type="button" @click="excelDown" class="btn btn-primary btn-round">다운로드</button>
+					    </div>
+               		</div>
+               		<div class="table-responsive" style="max-width:100%">	
+						<table class="table one-line-table" id="amountTable">
+							<thead>
+								<tr>
+									<th scope="col">연번</th>
+									<th scope="col">개통일</th>
+							      	<th scope="col">거래처</th>
+							      	<th scope="col">통신사</th>
+									<th scope="col">명의자</th>
+							      	<th scope="col">주민번호</th>
+							      	<th scope="col">개통번호</th>
+							      	<th scope="col">고객종류</th>
+							      	<th scope="col">법대</th>
+							      	<th scope="col">법대 전화번호</th>
+							      	<th scope="col">할부개월</th>
+							      	<th scope="col">펫네임</th>
+							      	<th scope="col">일련번호</th>
+							      	<th scope="col">가입구분</th>
+							      	<th scope="col">부가서비스1</th>
+							      	<th scope="col">부가서비스2</th>
+							      	<th scope="col">부가서비스3</th>
+							      	<th scope="col">요금제</th>
+							      	<th scope="col">유지기간</th>
+							      	<th scope="col">변경일</th>
+							      	
+							      	<th scope="col">액면R/B</th>
+							      	<th scope="col">추가R/B</th>
+							      	<th scope="col">고객현금</th>
+							      	<th scope="col">차감</th>
+							      	<th scope="col">차감내용</th>
+							      	<th scope="col">현금수납 or 유선상품권</th>
+							      	<th scope="col">유심비</th>
+							      	<th scope="col">수수료</th>
+							      	<th scope="col">정산금액</th>
+							      	<th scope="col">세금</th>
+							      	<th scope="col">치팅비(삐삐)</th>
+							      	<th scope="col">소개비</th>
+							      	
+							      	<th scope="col">P/B</th>
+							      	<th scope="col">지급예정일자</th>
+							      	<th scope="col">지급여부</th>
+							      	
+							      	<th scope="col">중간마진</th>
+							      	<th scope="col">세금키핑</th>
+							      	<th scope="col">실마진</th>
+							      	
+							      	<th scope="col">채권발생액</th>
+							      	<th scope="col">현금영수증</th>
+							      	<th scope="col">출고가</th>
+							      	<th scope="col">공시지원금</th>
+							      	<th scope="col">할부원금</th>
+							      	<th scope="col">리베이트 계산</th>
+							      	<th scope="col">입금 계좌</th>
+							      	
+							      	<th scope="col">참고할 내용</th>
+							      	<th scope="col">실채권입금액</th>
+							      	<th scope="col">세금키핑</th>
+							    </tr>
+							</thead>
+						  	<tbody>
+						    	<tr v-for="(x, index) in info.sellInfoList" :index="x.id">					    		
+						      		<td scope="row">{{x.id}}</td>
+						      		<td>{{changeDateFormat(x.openingDate,'yyyyMMdd')}}</td>
+						      		<td>{{info.businessPartnerList[x.businessPartner-1].partnerName}}</td>
+						      		<td>{{info.businessPartnerList[x.businessPartner-1].carrierName}}</td>
+						      		<td>{{x.name}}</td>
+						      		<td>{{changeDateFormat(x.birthday,'yyyyMMdd').substring(2,8)}}</td>
+						      		<td>{{x.phoneNumberText}}</td>
+						      		<td></td> <!-- 고객종류 -->
+						      		<td>{{x.pname}}{{changeDateFormat(x.pbirthday,'yyyyMMdd').substring(2,8)}}</td>
+						      		<td>{{x.pphoneNumberText}}</td>
+						      		<td>{{x.installment}}</td>
+						      		<td>{{info.phoneList[x.phoneId-1].petName}}</td>
+						      		<td>{{x.serialNumber}}</td>
+						      		<td>{{x.insertTypeText}}</td>
+						      		<td>{{getSubPlan(x,0)}}</td>
+						      		<td>{{getSubPlan(x,1)}}</td>
+						      		<td>{{getSubPlan(x,2)}}</td>
+						      		<td>{{x.mainRatePlan}}</td>
+						      		<td>{{getMaintenancePeriod(x)}}</td>
+						      		<td>{{getChangeDay(x)}}</td>
+						      		<td>{{callMoneyText(x.faceValueRebate)}}</td>
+						      		<td>{{callMoneyText(x.addRebate)}}</td>
+						      		<td>{{callMoneyText(x.guestMoney)}}</td>
+						      		<td>0</td>
+						      		<td>0</td>
+						      		<td>{{callMoneyText(x.cashRebate)}}</td>
+						      		<td>{{callMoneyText(x.usim)}}</td>
+						      		<td>{{getFees(x)}}</td>
+						      		<td>{{getSettlementAmount(x)}}</td>
+						      		<td>{{getTex(x)}}</td>
+						      		<td></td>
+						      		<td>{{callMoneyText(x.introductionPay)}}</td>
+						      		<td>{{callMoneyText(x.payBack)}}</td>
+						      		<td></td>
+						      		<td>{{x.payBackYnText}}</td>
+						      		<td>{{getMiddleMargin(x)}}</td>
+						      		<td></td>
+						      		<td>{{getRealMargin(x)}}</td>
+						      		<td>{{getBondIssuanceAmount(x)}}</td>
+						      		<td></td>
+						      		<td>{{callMoneyText(x.factoryPrice)}}</td>
+						      		<td>{{callMoneyText(x.disclosureSubsidy)}}</td>
+						      		<td>{{getinstallmentPrincipal(x)}}</td>
+						      		<td>{{x.formula}}</td>
+						      		<td>{{x.payBackBank}} {{x.payBackBankNumber}}</td>
+						      		<td></td>
+						      		<td>{{getRealBondIssuanceAmount(x)}}</td>
+						      		<td></td>
+						    	</tr>
+						  	</tbody>
+						</table>
+					</div>
+                </div>
+            </div>
+        </div>
+        <!-- container : e-->        
+        <script src="/res/front/js/biz/sell/info.js?v=${timestamp}"></script>
+</body>
+</html>

src/main/webapp/WEB-INF/view/sell/info.jsp

@@ -32,72 +32,82 @@
                			<div class="col-sm-1 mb-3">
                 			<button type="button" class="btn btn-primary btn-round" @click="bindData">검색</button>
                			</div>
-               			<label for="businessPartner" class="col-sm-1 col-form-label mb-3 pt-3">거래처</label>
+               			<label for="businessPartner" class="col-sm-1 col-form-label mb-3">거래처</label>
 					    <div class="col-sm-3 mb-3">
 							<select class="selectpicker show-tick" multiple data-width="100%" title='' data-live-search="true" id="businessPartner" v-model="businessPartner" tabindex="2" >
 						        	<option v-for="(x, index) in info.businessPartnerList" :index="x.id" :value="x.id">{{x.partnerName}}</option>
 							</select>
 					    </div>
                		</div>
-					<table class="table" id="amountTable">
-						<thead>
-							<tr>
-								<th scope="col">#</th>
-								<th scope="col">개통일</th>
-								<th scope="col">이름</th>
-						      	<th scope="col">생년월일</th>
-						      	<th scope="col">핸드폰번호</th>
-						      	<th scope="col">거래처</th>
-						      	<th scope="col">모델명</th>
-						      	<th scope="col">일련번호</th>
-						      	<th scope="col">가입구분</th>
-						      	<th scope="col">부가가입여부</th>
-						      	<th scope="col">리베이트</th>
-						      	<th scope="col">부가차감금액</th>
-						      	<th scope="col">현금수납금액</th>
-						      	<th scope="col">채권발생액</th>
-						      	<th scope="col">실마진</th>
-						    </tr>
-						</thead>
-					  	<tbody>
-					    	<tr v-for="(x, index) in info.sellInfoList" :index="x.id">					    		
-					      		<th scope="row">{{x.id}}</th>
-					      		<td>{{x.openingDate}}</td>
-					      		<td>{{x.name}}</td>
-					      		<td>{{x.birthday}}</td>
-					      		<td>{{x.phoneNumber}}</td>
-					      		<td>{{info.businessPartnerList[x.businessPartner-1].partnerName}}</td>
-					      		<td>{{info.phoneList[x.phoneId-1].petName}}</td>
-					      		<td>{{x.serialNumber}}</td>
-					      		<td>{{x.insertTypeText}}</td>
-					      		<td>{{x.subRatePlan}}</td>
-					      		<td>{{callMoneyText(x.faceValueRebate)}}</td>
-					      		<td></td>
-					      		<td>{{callMoneyText(x.cashRebate)}}</td>
-					      		<td>{{getBondIssuanceAmount(x)}}</td>
-					      		<td>{{getRealMargin(x)}}</td>
-					    	</tr>
-					    	<tr>
-					      		<th scope="row">합계</th>
-					      		<td></td>
-					      		<td></td>
-					      		<td></td>
-					      		<td></td>
-					      		<td></td>
-					      		<td></td>
-					      		<td></td>
-					      		<td></td>
-					      		<td></td>
-					      		<td></td>
-					      		<td></td>
-					      		<td></td>
-					      		<td>{{view.bondIssuanceAmountSum}}</td>
-					      		<td>{{view.realMarginSum}}</td>
-					    	</tr>
-					  	</tbody>
-					</table>
-					
-					<table class="table" id="businessPartnerTable">
+               		<div class="table-responsive" style="max-width:100%">	
+						<table class="table one-line-table" id="amountTable">
+							<thead>
+								<tr>
+									<th scope="col">#</th>
+									<th scope="col">개통일</th>
+									<th scope="col">이름</th>
+							      	<th scope="col">생년월일</th>
+							      	<th scope="col">핸드폰번호</th>
+							      	<th scope="col">거래처</th>
+							      	<th scope="col">모델명</th>
+							      	<th scope="col">일련번호</th>
+							      	<th scope="col">가입구분</th>
+							      	<th scope="col">부가가입여부</th>
+							      	<th scope="col">리베이트</th>
+							      	<th scope="col">부가차감금액</th>
+							      	<th scope="col">현금수납금액</th>
+							      	<th scope="col">채권발생액</th>
+							      	<th scope="col">실마진</th>
+							      	<th scope="col">실마진</th>
+							      	<th scope="col">실마진</th>
+							      	<th scope="col">실마진</th>
+							    </tr>
+							</thead>
+						  	<tbody>
+						    	<tr v-for="(x, index) in info.sellInfoList" :index="x.id">					    		
+						      		<th scope="row">{{x.id}}</th>
+						      		<td>{{x.openingDate}}</td>
+						      		<td>{{x.name}}</td>
+						      		<td>{{x.birthday}}</td>
+						      		<td>{{x.phoneNumber}}</td>
+						      		<td>{{info.businessPartnerList[x.businessPartner-1].partnerName}}</td>
+						      		<td>{{info.phoneList[x.phoneId-1].petName}}</td>
+						      		<td>{{x.serialNumber}}</td>
+						      		<td>{{x.insertTypeText}}</td>
+						      		<td>{{x.subRatePlan}}</td>
+						      		<td>{{callMoneyText(x.faceValueRebate)}}</td>
+						      		<td></td>
+						      		<td>{{callMoneyText(x.cashRebate)}}</td>
+						      		<td>{{getBondIssuanceAmount(x)}}</td>
+						      		<td>{{getRealMargin(x)}}</td>
+						      		<td>{{getRealMargin(x)}}</td>
+						      		<td>{{getRealMargin(x)}}</td>
+						      		<td>{{getRealMargin(x)}}</td>
+						    	</tr>
+						    	<tr>
+						      		<th scope="row">합계</th>
+						      		<td></td>
+						      		<td></td>
+						      		<td></td>
+						      		<td></td>
+						      		<td></td>
+						      		<td></td>
+						      		<td></td>
+						      		<td></td>
+						      		<td></td>
+						      		<td></td>
+						      		<td></td>
+						      		<td></td>
+						      		<td>{{view.bondIssuanceAmountSum}}</td>
+						      		<td>{{view.realMarginSum}}</td>
+						      		<td>{{view.realMarginSum}}</td>
+						      		<td>{{view.realMarginSum}}</td>
+						      		<td>{{view.realMarginSum}}</td>
+						    	</tr>
+						  	</tbody>
+						</table>
+					</div>
+					<!-- <table class="table" id="businessPartnerTable">
 						<thead>
 							<tr>
 								<th scope="col">#</th>
@@ -126,7 +136,7 @@
 					      		<td>{{view.realMarginSum}}</td>
 					    	</tr>
 					  	</tbody>
-					</table>
+					</table> -->
 					
 					
                 </div>