Etusivu Tutki Apua
Rekisteröidy Kirjaudu sisään
orderqueen
/
oqpo-view
Tarkkaile 3
Äänestä 0
Fork 0
Tiedostot Ongelmat 0 Pull-pyynnöt 0 Wiki
Selaa lähdekoodia

메인 대시보드, 납품서 출력수장

isna 2 vuotta sitten
vanhempi
2ec97c5f1f
commit
23afa7d54f
4 muutettua tiedostoa jossa 130 lisäystä ja 84 poistoa
Jaettu näkymä Näytä diff tilastot
  1. 36 2
      src/main/webapp/css/style.css
  2. 45 24
      src/main/webapp/js/app/main.js
  3. 8 5
      src/main/webapp/js/app/popup/biz/ITP_BIZPOP_DLV_STTMT_PRN.js
  4. 41 53
      src/main/webapp/main.html

+ 36 - 2
src/main/webapp/css/style.css
Näytä tiedosto 

@@ -1,6 +1,6 @@
1 1 
 @charset "UTF-8";
2 2 
 @media print {
3 
-	*{visibility: hidden; margin:0; paddig:0;}
3 
+	*{ margin:0; paddig:0;}
4 4 
 }
5 5 
 /* COMMON */
6 6 
 html, body {width:100%; height:100%; background:#eee; overflow-y:hidden;}
 
@@ -774,5 +774,39 @@ _:-ms-fullscreen, :root .itp_logs {max-width: 1287px}
774 774 
 /* 폼스타일 */
775 775
776 776 
 .form-readonly {
777 
-	background: #fff;
777 
+	background: #fff!important;
778 
+}
779 
+#ITP_MAIN_GRAPH_AREA {
780 
+	display: grid;
781 
+	height: auto;
782 
+	grid-template-columns: 1fr 1fr 1fr 1fr;
783 
+	align-items: center;
784 
+	grid-column-gap: 16px;
785 
+	grid-row-gap: 20px;
786 
+	margin-top: 16px;
787 
+}
788 
+.itp_graph_panel .itp_graph_side {
789 
+	display: none;
790 
+}
791 
+.itp_graph_panel .itp_graph_area {
792 
+	width: 100%;
793 
+}
794 
+.itp_graph_title .itp_graph_info {
795 
+	font-size: 18px;
796 
+	color: #776;
797 
+	text-shadow: 2px 2px 3px rgb(255 255 255 / 20%);
798 
+}
799 
+.itp_graph_title {
800 
+	display: flex;
801 
+	align-items: center;
802 
+	margin-bottom: 20px;
803 
+	width: 100%;
804 
+	flex-direction: row;
805 
+}
806 
+
807 
+.itp_graph_title .itp_graph_info {
808 
+	font-size: 20px;
809 
+}
810 
+.itp_graph_title select {
811 
+	margin-left: 16px;
778 812 
 }

+ 45 - 24
src/main/webapp/js/app/main.js
Näytä tiedosto 

@@ -27,7 +27,7 @@ require(['config'], function() {
27 27 
 			// 조회
28 28 
 	    	itp_fn_MAIN_NOTICE_search();
29 29 
 			itp_fn_MAIN_COUNT();
30 
-
30 
+
31 31 
 			$('#ITP_FORM_MAIN_SEARCH_PR_TYPE').on('change', function() {
32 32 
 				drawChartReq();
33 33 
 			});
 
@@ -56,6 +56,7 @@ require(['config'], function() {
56 56 
 			google.charts.load('current', {'packages':['corechart']});
57 57 
 			google.charts.load('current', {'packages':['bar']});
58 58
59 
+			/*
59 60 
 			$('#ITP_MAIN_HEADER_BRAND').hide();
60 61 
 			$('#ITP_MAIN_HEADER_STORE').hide();
61 62 
 			$('#ITP_MAIN_HEADER_SPPLY').hide();
 
@@ -68,11 +69,13 @@ require(['config'], function() {
68 69 
 			$('#ITP_MAIN_DRAW_DELI_CHART').hide(); 		// 입고
69 70 
 			$('#ITP_MAIN_DRAW_RELEASE_CHART').hide();	// 출고
70 71 
 			$('#ITP_MAIN_DRAW_ORDERS_CHART').hide();	// 수주내역
71 
-
72 
-			var authTpCd = fn_make_user_info.get('authTpCd'); // 10:관리자, 20:영업담당자, 30:가맹점, 40:브랜드, 50:매장, 60:공급사
72 
+			*/
73 
+
74 
+			var authTpCd = fn_make_user_info.get('authTpCd');
75 
+			// 10:관리자, 20:영업담당자, 30:가맹점, 40:브랜드, 50:매장, 60:공급사
73 76 
 			// console.log('>>>> authTpCd = ' + authTpCd);
74 
-
75 
-			if( authTpCd == '40' ) { // 브랜드
77 
+			var chartCnt=0;
78 
+			if( authTpCd == '40' || authTpCd == '10' ) { // 브랜드
76 79 
 				$('#ITP_MAIN_HEADER_BRAND').show();
77 80
78 81 
 				$('#ITP_MAIN_DRAW_CHART_REQ').show();  
@@ -84,8 +87,13 @@ require(['config'], function() {
84 87 
 				$('#ITP_MAIN_DRAW_CHART_REQ_UP').show();
85 88 
 				google.charts.setOnLoadCallback(drawChartReqUp); // 매출순위
86 89
87 
-				$('#ITP_MAIN_DRAW_CHART_CORE').show();
88 
-				google.charts.setOnLoadCallback(drawChartcore); // 정산
90 
+				if(fn_make_user_info.get('brandId')) {
91 
+					$('#ITP_MAIN_DRAW_CHART_CORE').show();
92 
+					google.charts.setOnLoadCallback(drawChartcore); // 정산
93 
+					chartCnt=4;
94 
+				} else {
95 
+					chartCnt=3;
96 
+				}
89 97
90 98 
 				$('#ITP_MAIN_DRAW_LINE').show();
91 99 
 				$('#ITP_MAIN_DRAW_LINE .itp_main_draw_line').show();	
@@ -104,7 +112,7 @@ require(['config'], function() {
104 112
105 113 
 				$('#ITP_MAIN_DRAW_CHART_CORE').show();
106 114 
 				google.charts.setOnLoadCallback(drawChartcore); // 정산
107 
-
115 
+				chartCnt=4;
108 116 
 			} else if( authTpCd == '60' ) { // 공급사
109 117 
 				$('#ITP_MAIN_HEADER_SPPLY').show();
110 118 
 			
@@ -119,7 +127,12 @@ require(['config'], function() {
119 127
120 128 
 				$('#ITP_MAIN_DRAW_CHART_CORE').show();
121 129 
 				google.charts.setOnLoadCallback(drawChartcore); // 정산
122 
-			}
130 
+				chartCnt=4;
131 
+			}
132 
+
133 
+			if(chartCnt==3) {
134 
+				$('#ITP_MAIN_GRAPH_AREA').css('grid-template-columns','1fr 1fr 1fr');
135 
+			}
123 136
124 137 
 		}, 300);
125 138 
 	});
 
@@ -129,20 +142,21 @@ require(['config'], function() {
129 142 
 function drawChartReq() {
130 143
131 144 
 	const key = { brandId:fn_make_user_info.get('brandId'), storeId:fn_make_user_info.get('storeId'), prType: $('#ITP_FORM_MAIN_SEARCH_PR_TYPE').val() };
132 
-	var param = $.param(key);
145 
+	var param = $.param(key);
133 146 
 	fn_ajax_call(MAIN_CHART_PCH_REQ_CHART, param, function(result) {
134 147
135 148 
 		var data = google.visualization.arrayToDataTable( eval(result.chartData) );
136 149 
 	  	var options = {
137 150 
 			legend: { position: 'left' },
138 
-			bar: { groupWidth: "90%" }
151 
+			bar: { groupWidth: "50%" },
152 
+			width: 300,
139 153 
 	  	};
140 154 
 	  	var chart = new google.charts.Bar(document.getElementById('ITP_PCH_REQ_GRAPH'));
141 155 
 	  	// chart.draw(data, options);
156 
+		console.log("xx draw char req xx", param, data, chart)
142 157 
 		chart.draw(data, google.charts.Bar.convertOptions(options));
143 158
144 
-	}, 'GET');
145 
-
159 
+	}, 'GET');
146 160 
 }
147 161
148 162 
 //수주내역 그래프
 
@@ -156,8 +170,9 @@ function drawChartOrders() {
156 170
157 171 
 		var data = google.visualization.arrayToDataTable( eval(result.chartData) );
158 172 
 	  	var options = {
159 
-			legend: { position: 'left' }
160 
-	  	};
173 
+			legend: { position: 'left' },
174 
+			width: 300,
175 
+		};
161 176 
 	  	var chart = new google.charts.Bar(document.getElementById('ITP_ORDERS_GRAPH'));
162 177 
 	  	chart.draw(data, options);
163 178 
 		
@@ -176,8 +191,9 @@ function drawChartDeli() {
176 191
177 192 
 		var data = google.visualization.arrayToDataTable( eval(result.chartData) );
178 193 
 	  	var options = {
179 
-			legend: { position: 'left' }
180 
-	  	};
194 
+			legend: { position: 'left' },
195 
+			width: 300,
196 
+		};
181 197 
 	  	var chart = new google.charts.Bar(document.getElementById('ITP_DELI_GRAPH'));
182 198 
 	  	chart.draw(data, options);
183 199 
 		
@@ -196,7 +212,8 @@ function drawChartRelease() {
196 212
197 213 
 		var data = google.visualization.arrayToDataTable( eval(result.chartData) );
198 214 
 	  	var options = {
199 
-			legend: { position: 'left' }
215 
+			legend: { position: 'left' },
216 
+			width: 300,
200 217 
 	  	};
201 218 
 	  	var chart = new google.charts.Bar(document.getElementById('ITP_RELEASE_GRAPH'));
202 219 
 	  	chart.draw(data, options);
 
@@ -216,7 +233,8 @@ function drawChartPodr() {
216 233
217 234 
 		var options = {
218 235 
 			legend: { position: 'left' },
219 
-			bar: { groupWidth: "90%" }
236 
+			bar: { groupWidth: "50%" },
237 
+			width: 300,
220 238 
 		};
221 239 
 		var chart = new google.charts.Bar(document.getElementById('ITP_PCH_PODR_GRAPH'));
222 240 
 		// chart.draw(data, options);
 
@@ -238,8 +256,10 @@ function drawChartReqUp() {
238 256 
 		var options = {
239 257 
 			title: '구매요청 상위 품목',
240 258 
 			legend: { position: 'left' },
241 
-			bars: 'horizontal'
259 
+			bars: 'horizontal',
260 
+			width: 300,
242 261 
 		};
262 
+		console.log("xxxxxxxxxxx drawChartReqUp xxxxxxxxxxx")
243 263
244 264 
 		var chart = new google.charts.Bar(document.getElementById('ITP_PCH_REQ_UP_ITEM_GRAPH'));
245 265 
 		chart.draw(data, options);
 
@@ -259,11 +279,12 @@ function drawChartcore() {
259 279 
 		var data = google.visualization.arrayToDataTable( eval(result.chartData) );
260 280
261 281 
 	    var options = {
262 
-			// title: '정산',
263 
-			legend: { position: 'left' }
264 
-	    };
265 
-
282 
+			// title: '정산',
283 
+			legend: { position: 'left' },
284 
+			width: 300,
285 
+	    };
266 286 
 	    var chart = new google.visualization.PieChart(document.getElementById('ITP_STTL_GRAPH'));
287 
+		console.log("xxxxxxxxxxx drawChartcore xxxxxxxxxxx", data, options )
267 288 
 	    chart.draw(data, options);
268 289
269 290 
 	}, 'GET');

+ 8 - 5
src/main/webapp/js/app/popup/biz/ITP_BIZPOP_DLV_STTMT_PRN.js
Näytä tiedosto 

@@ -121,16 +121,19 @@ let pageObj = {
121 121 
 	button: function() {
122 122 
 		$('#ITP_BIZPOP_DLV_STTMT_PRN_BTN_PRINT').on('click', function (printDiv){
123 123 
 			  var divToPrint=document.getElementById('ITP_BIZPOP_DLV_STTMT_PRN_PRINT_AREA');
124 
-
124 
+			  $('#ITP_BIZPOP_DLV_STTMT_PRN_BTN_PRINT').hide();
125 
+			  $('#ITP_ASIDE .itp_modal .itp_form').css("margin-bottom", "20px");
126 
+			  $('#ITP_POPUP_CONTAINER .itp_company_type').css("width", "auto");
127 
+			  /*
125 128 
 			  var newWin=window.open('','Print-Window');
126 
-
127 129 
 			  newWin.document.open();
128 
-
129 130 
 			  newWin.document.write('<html><body onload="window.print()">'+divToPrint.innerHTML+'</body></html>');
130 
-
131 131 
 			  newWin.document.close();
132 
-
133 132 
 			  setTimeout(function(){newWin.close();},10);
133 
+			  */
134 
+			  itp_fn_printDiv(divToPrint);
135 
+			  $('#ITP_BIZPOP_DLV_STTMT_PRN_BTN_PRINT').show();
136 
+			  $('#ITP_ASIDE .itp_modal .itp_form').css("margin-bottom", "5px");
134 137 
 		});
135 138
136 139

+ 41 - 53
src/main/webapp/main.html
Näytä tiedosto 

@@ -40,6 +40,7 @@
40 40
41 41 
 	<script src="./js/app/properties.js"></script>
42 42 
 	<script src="./js/require.min.js" data-main="./js/app/config.js"></script>
43 
+
43 44 
 </head>
44 45 
 <body>
45 46 
 	<div id="ITP_WRAPPER">
 
@@ -253,113 +254,98 @@
253 254 
 								</div>
254 255
255 256 
 								<div id="ITP_MAIN_GRAPH_AREA">
256 
-									<div class="itp_graph_box" id="ITP_MAIN_DRAW_CHART_REQ" style="display: none;">
257 
-										<div class="itp_graph_side">
257 
+									<div class="itp_graph_panel" id="ITP_MAIN_DRAW_CHART_REQ" style="display: none;">
258 
+
259 
+										<div class="itp_graph_title">
260 
+											<div class="itp_graph_info">구매요청</div>
258 261 
 											<select id="ITP_FORM_MAIN_SEARCH_PR_TYPE" name="prType">
259 262 
 												<option value="A">당일</option>
260 263 
 												<option value="B">1주일</option>
261 264 
 												<option value="C">15일</option>
262 265 
 												<option value="D">1개월</option>
263 266 
 											</select>
264 
-											<div class="itp_graph_info_bar">
265 
-												<div class="itp_graph_info">구매요청</div>
266 
-											</div>
267 267 
 										</div>
268 268 
 										<div id="ITP_PCH_REQ_GRAPH" class="itp_graph_area"></div>
269 269 
 									</div>
270 270
271 
-									<div class="itp_graph_box" id="ITP_MAIN_DRAW_DELI_CHART" style="display: none;">
272 
-										<div class="itp_graph_side">
273 
-											<select id="ITP_FORM_MAIN_SEARCH_DELI_TYPE" name="deliType">
271 
+									<div class="itp_graph_panel" id="ITP_MAIN_DRAW_DELI_CHART" style="display: none;">
272 
+										<div class="itp_graph_title">
273 
+											<div class="itp_graph_info">입고</div>
274 
+											<select id="ITP_FORM_MAIN_SEARCH_PR_TYPE" name="prType">
274 275 
 												<option value="A">당일</option>
275 276 
 												<option value="B">1주일</option>
276 277 
 												<option value="C">15일</option>
277 278 
 												<option value="D">1개월</option>
278 279 
 											</select>
279 
-											<div class="itp_graph_info_bar">
280 
-												<div class="itp_graph_info">입고</div>
281 
-											</div>
282 280 
 										</div>
283 281 
 										<div id="ITP_DELI_GRAPH" class="itp_graph_area"></div>
284 282 
 									</div>
285 283
286 
-									<div class="itp_graph_box" id="ITP_MAIN_DRAW_ORDERS_CHART" style="display: none;">
287 
-										<div class="itp_graph_side">
288 
-											<select id="ITP_FORM_MAIN_SEARCH_ORDERS_TYPE">
284 
+									<div class="itp_graph_panel" id="ITP_MAIN_DRAW_ORDERS_CHART" style="display: none;">
285 
+										<div class="itp_graph_title">
286 
+											<div class="itp_graph_info">수주내역</div>
287 
+											<select id="ITP_FORM_MAIN_SEARCH_PR_TYPE" name="prType">
289 288 
 												<option value="A">당일</option>
290 289 
 												<option value="B">1주일</option>
291 290 
 												<option value="C">15일</option>
292 291 
 												<option value="D">1개월</option>
293 292 
 											</select>
294 
-											<div class="itp_graph_info_bar">
295 
-												<div class="itp_graph_info">수주내역</div>
296 
-											</div>
297 
-										</div>
293 
+										</div>
298 294 
 										<div id="ITP_ORDERS_GRAPH" class="itp_graph_area"></div>
299 295 
 									</div>
300 296
301 
-									<div class="itp_graph_box" id="ITP_MAIN_DRAW_RELEASE_CHART" style="display: none;">
302 
-										<div class="itp_graph_side">
303 
-											<select id="ITP_FORM_MAIN_SEARCH_RELEASE_TYPE">
297 
+									<div class="itp_graph_panel" id="ITP_MAIN_DRAW_RELEASE_CHART" style="display: none;">
298 
+										<div class="itp_graph_title">
299 
+											<div class="itp_graph_info">출고</div>
300 
+											<select id="ITP_FORM_MAIN_SEARCH_PR_TYPE" name="prType">
304 301 
 												<option value="A">당일</option>
305 302 
 												<option value="B">1주일</option>
306 303 
 												<option value="C">15일</option>
307 304 
 												<option value="D">1개월</option>
308 305 
 											</select>
309 
-											<div class="itp_graph_info_bar">
310 
-												<div class="itp_graph_info">출고</div>
311 
-											</div>
312 
-										</div>
306 
+										</div>
313 307 
 										<div id="ITP_RELEASE_GRAPH" class="itp_graph_area"></div>
314 308 
 									</div>
315 309
316 
-									<div class="itp_graph_box" id="ITP_MAIN_DRAW_CHART_PODR" style="display: none;">
317 
-										<div class="itp_graph_side">
318 
-											<select id="ITP_FORM_MAIN_SEARCH_PO_TYPE" name="poType">
310 
+									<div class="itp_graph_panel" id="ITP_MAIN_DRAW_CHART_PODR" style="display: none;">
311 
+										<div class="itp_graph_title">
312 
+											<div class="itp_graph_info">구매발주</div>
313 
+											<select id="ITP_FORM_MAIN_SEARCH_PR_TYPE" name="prType">
319 314 
 												<option value="A">당일</option>
320 315 
 												<option value="B">1주일</option>
321 316 
 												<option value="C">15일</option>
322 317 
 												<option value="D">1개월</option>
323 318 
 											</select>
324 
-											<div class="itp_graph_info_bar">
325 
-												<div class="itp_graph_info">구매발주</div>
326 
-											</div>
327 
-										</div>
319 
+										</div>
328 320 
 										<div id="ITP_PCH_PODR_GRAPH" class="itp_graph_area"></div>
329 321 
 									</div>
330 322
331 
-									<div class="itp_graph_box" id="ITP_MAIN_DRAW_CHART_REQ_UP" style="display: none;">
332 
-										<div class="itp_graph_side">
333 
-											<select id="ITP_FORM_MAIN_SEARCH_ITEM_CNT_TYPE" name="itemCntType">
323 
+									<div class="itp_graph_panel" id="ITP_MAIN_DRAW_CHART_REQ_UP" style="display: none;">
324 
+										<div class="itp_graph_title">
325 
+											<div class="itp_graph_info">매출순위</div>
326 
+											<select id="ITP_FORM_MAIN_SEARCH_PR_TYPE" name="prType">
334 327 
 												<option value="A">당일</option>
335 328 
 												<option value="B">1주일</option>
336 329 
 												<option value="C">15일</option>
337 330 
 												<option value="D">1개월</option>
338 331 
 											</select>
339 
-											<div class="itp_graph_info_bar">
340 
-												<div class="itp_graph_info">매출순위</div>
341 
-											</div>
342 
-										</div>
332 
+										</div>
343 333 
 										<div id="ITP_PCH_REQ_UP_ITEM_GRAPH" class="itp_graph_area"></div>
344 334 
 									</div>
345 335
346 
-									<div class="itp_graph_box" id="ITP_MAIN_DRAW_CHART_CORE" style="display: none;">
347 
-										<div class="itp_graph_side">
348 
-											<div class="itp_graph_info_bar">
349 
-												<div class="itp_graph_info" style="padding-top:8px;">&nbsp;정&nbsp;&nbsp;산</div>
350 
-											</div>
351 
-										</div>
336 
+									<div class="itp_graph_panel" id="ITP_MAIN_DRAW_CHART_CORE" style="display: none;">
337 
+										<div class="itp_graph_title">
338 
+											<div class="itp_graph_info">정&nbsp;&nbsp;산</div>
339 
+										</div>
352 340 
 										<div id="ITP_STTL_GRAPH" class="itp_graph_area"></div>
353 341 
 									</div>
354 342
355 
-									<div class="itp_graph_box" style="width:100%" id="ITP_MAIN_DRAW_LINE" style="display: none;">
356 
-										<div class="itp_graph_side itp_main_draw_line" style="width:12%; display: none;" >
357 
-											<div class="itp_graph_info_bar">
358 
-												<div class="itp_graph_info">안전재고</div>
359 
-											</div>
360 
-										</div>
361 
-										<div id="ITP_SAFE_STCK_GRAPH" class="itp_graph_area" style="width:87%;"></div>
343 
+								</div>
344 
+								<div class="itp_graph_box" style="width:100%" id="ITP_MAIN_DRAW_LINE" style="display: none;">
345 
+									<div class="itp_graph_title">
346 
+										<div class="itp_graph_info">안전재고</div>
362 347 
 									</div>
348 
+									<div id="ITP_SAFE_STCK_GRAPH" class="itp_graph_area" style="width:87%;"></div>
363 349 
 								</div>
364 350 
 							</div>
365 351 
 						</article>
 
@@ -690,7 +676,9 @@
690 676 
 			</div>
691 677 
 		</footer>
692 678
693 
-		<aside id="ITP_ASIDE"></aside>
679 
+		<aside id="ITP_ASIDE"></aside>
680 
+
681 
+
694 682 
 	</div>
695 683 
 </body>
696 684 
 </html>