Commit @98e46c9a160d7d09ba6307cd88cff6e1836e9fd3

mycoms 2024-03-12

240312 김하영 레이아웃 수정

@98e46c9a160d7d09ba6307cd88cff6e1836e9fd3

707ab52

98e46c9

Global.js

--- Global.js

+++ Global.js


 const LOG_BASE_DIR = `${__dirname}/server/logs`;
 const SERVICE_STATUS = process.env.NODE_ENV;//development, production
 const PORT = 80;
-const API_SERVER_HOST = 'localhost:8080';
+const API_SERVER_HOST = 'localhost:9090';
 
 module.exports = {
     PROJECT_NAME,

707ab52

98e46c9

client/resources/css/component.css

--- client/resources/css/component.css

+++ client/resources/css/component.css


 }
 
 .box-overflow {
-    height: 100%;
+    height: 90%;
     min-height: 320px; 
     max-height: 650px;
     overflow-y: auto;

707ab52

98e46c9

client/resources/css/reset.css

--- client/resources/css/reset.css

+++ client/resources/css/reset.css


 
 
 table{
-    min-width: 100%;
+    width: 100%;
     border-collapse: collapse;
     table-layout: fixed;
 }

707ab52

98e46c9

client/resources/css/style.css

--- client/resources/css/style.css

+++ client/resources/css/style.css


     color: var(--navbarblue);
     position: relative;
     text-align: left !important;
+    margin-right: 10px;
     /* left: 2%; */
     font-size: 1.3rem;
     font-weight: 600;

 }
 
 .section-wrap table {
-    height: 230px;
     overflow-y: auto;
 
 }

 .Bi003-list table {
     text-align: center;
     border-top: 1px solid var(--borderlightgray);
-    word-break: keep-all;
 }
 
 /* 잔액 이월 전표 등록 */

707ab52

98e46c9

client/views/pages/AccountingManagement/BaselineInformation/Bi001.vue

--- client/views/pages/AccountingManagement/BaselineInformation/Bi001.vue

+++ client/views/pages/AccountingManagement/BaselineInformation/Bi001.vue

...	...	@@ -19,73 +19,85 @@
19	19	분류목록
20	20	</div>
21	21	<div class="content-table pd4 ">
22		- <div class="box-overflow" style="border-top: 1px solid var(--borderlightgray);">
	22	+ <div style="border-top: 1px solid var(--borderlightgray);">
23	23
24	24	<table class="list-table">
25	25	<!-- col 꼭 너비 기재해야함! 그래야 100%로 차지함 -->
26	26	<colgroup>
27	27	<col style="width: 20%;">
28	28	<col style="width: 80%;">
29		-
	29	+
30	30	</colgroup>
31	31	<thead>
32	32	<tr class="table-header"
33	33	style="background-color: var(--tableblue); color: var(--navbarblue); ">
34	34	<th>코드분류</th>
35	35	<th>코드분류명</th>
36		-
	36	+
37	37	</tr>
38	38	</thead>
39	39	<tbody class="table-border">
40	40	<tr v-for="(codeNum) in codeList" key="codeNum.id">
41		- <td :class="{ 'selected': selectedId === codeNum.id }">{{ codeNum.pathNum }}</td>
	41	+ <td :class="{ 'selected': selectedId === codeNum.id }">{{ codeNum.pathNum }}
	42	+ </td>
42	43	<td @click="clickCodeName(codeNum.id)"
43	44	:class="{ 'selected': selectedId === codeNum.id }" class="wrap-text">{{
44	45	codeNum.pathName }}</td>
45		-
	46	+
46	47	</tr>
47		-
48		-
	48	+
	49	+
49	50	</tbody>
50	51	</table>
51	52	</div>
52	53	</div>
53		-
54	54	</div>
	55	+
55	56	<div class="content gd-10 flex-column content-wrap" style="width: 100%;">
56	57	<div>
57		- <div class="content-title mb1 list-box">코드등록</div>
58		- <div class="code-area table-input">
	58	+ <div class="flex justify-between">
	59	+ <div class="content-title mb1 list-box">코드등록</div>
	60	+ <div><button>등록하기</button></div>
	61	+ </div>
	62	+ <div class=" flex section-wrap pd2">
	63	+ <table class="Bi001-table flex " style="overflow-x: hidden; width: 100%;">
	64	+ <!-- col 꼭 너비 기재해야함! 그래야 100%로 차지함 -->
	65	+ <colgroup>
	66	+ <col style="width: 16%;">
	67	+ <col style="width: 16%;">
	68	+ <col style="width: 16%;">
	69	+ <col style="width: 16%;">
	70	+ <col style="width: 16%;">
	71	+ <col style="width: 5%;">
59	72
60		- <table>
61		-
	73	+ </colgroup>
62	74	<tbody v-for="(codeInput, id) in filteredCodeBox" :key="id" class="filter-table">
63	75	<tr>
64		- <th class="blue-text text-befor">분류코드</th>
65		- <td><input type="text" name="" id=""></td>
66		- <th class="blue-text text-befor">분류명</th>
67		- <td><input type="text" name="" id=""></td>
68		- <th class="blue-text text-befor">코드</th>
69		- <td><input style="width: 50px;" type="text" name="" id=""></td>
70		- <th>정렬순서</th>
71		- <td><input style="width: 50px;" type="text" name="" id=""></td>
72		- <th class="blue-text text-befor">사용여부</th>
73		- <td><input type="checkbox" name="" id="" class="ui-checkbox"></td>
	76	+ <th>분류코드</th>
	77	+ <td><input type="text"></td>
	78	+ <th>분류명</th>
	79	+ <td><input type="text"></td>
	80	+ <th>코드</th>
	81	+ <td><input type="text" class="input-wrap"></td>
	82	+ <td colspan="2">
	83	+ <th>정렬순서</th>
	84	+ <td><input type="text" class="input-wrap"></td>
	85	+ <th>사용여부</th>
	86	+ <td><input type="checkbox" class="ui-checkbox"></td>
	87	+ </td>
	88	+
	89	+
74	90	</tr>
75	91	<tr v-show="activeItemId === codeInput.id">
76	92	<th>코드명</th>
77		- <td><input type="text" name="" id=""></td>
	93	+ <td><input type="text"></td>
78	94	<th>코드약명</th>
79		- <td><input type="text" name="" id=""></td>
80		-
	95	+ <td><input type="text"></td>
81	96	<th>{{ codeInput.pathName1 }}</th>
82		- <td><input type="text" name="" id=""></td>
	97	+ <td><input type="text"></td>
83	98	<th>{{ codeInput.pathName2 }}</th>
84		- <td colspan="4"><input type="text" name="" id=""></td>
85		-
	99	+ <td><input type="text"></td>
86	100	</tr>
87		- </tbody>
88		- <tbody v-for="(codeInput, id) in filteredCodeBox" :key="id" class="filter-table">
89	101	<tr>
90	102	<th>{{ codeInput.pathName3 }}</th>
91	103	<td><input type="text" name="" id=""></td>
...	...	@@ -94,11 +106,8 @@
94	106	<th>{{ codeInput.pathName5 }}</th>
95	107	<td><input type="text" name="" id=""></td>
96	108	<th>{{ codeInput.pathName6 }}</th>
97		- <td colspan="3"><input type="text" name="" id=""></td>
98		-
	109	+ <td><input type="text" name="" id=""></td>
99	110	</tr>
100		- </tbody>
101		- <tbody v-for="(codeInput, id) in filteredCodeBox" :key="id" class="filter-table">
102	111	<tr>
103	112	<th>{{ codeInput.pathName7 }}</th>
104	113	<td><input type="text" name="" id=""></td>
...	...	@@ -107,104 +116,379 @@
107	116	<th>{{ codeInput.pathName9 }}</th>
108	117	<td><input type="text" name="" id=""></td>
109	118	<th>{{ codeInput.pathName10 }}</th>
110		- <td colspan="3"><input type="text" name="" id=""></td>
111		-
	119	+ <td><input type="text" name="" id=""></td>
112	120	</tr>
113	121	</tbody>
114		-
115	122	</table>
116		-
117		-
118		-
119		-
	123	+
120	124	</div>
121		- </div>
122		- <div class="table-border ">
123		- <div class="content-title mb1">코드목록</div>
124		- <div class="box-overflow">
	125	+ <div class="table-border">
	126	+ <div class="content-title mb1">코드목록</div>
	127	+ <div class="" style="height: 398px ; overflow-y: auto;">
125	128
126	129
127		- <table class="list-table">
128		- <!-- col 꼭 너비 기재해야함! 그래야 100%로 차지함 -->
129		- <colgroup>
130		- <col style="width: 5%;">
131		- <col style="width: 10%;">
132		- <col style="width: 5%;">
133		- <col style="width: 5%;">
134		- <col style="width: 5%;">
135		- <col style="width: 5%;">
136		- <col style="width: 5%;">
137		- <col style="width: 5%;">
138		- <col style="width: 5%;">
139		- <col style="width: 5%;">
140		- <col style="width: 5%;">
141		- <col style="width: 5%;">
142		- <col style="width: 5%;">
143		- <col style="width: 5%;">
144		- <col style="width: 5%;">
145		- <col style="width: 5%;">
146		- <col style="width: 5%;">
	130	+ <table class="list-table" style="height: 100%; overflow-y: auto;">
	131	+ <!-- col 꼭 너비 기재해야함! 그래야 100%로 차지함 -->
	132	+ <colgroup>
	133	+ <col style="width: 5%;">
	134	+ <col style="width: 10%;">
	135	+ <col style="width: 5%;">
	136	+ <col style="width: 5%;">
	137	+ <col style="width: 5%;">
	138	+ <col style="width: 5%;">
	139	+ <col style="width: 5%;">
	140	+ <col style="width: 5%;">
	141	+ <col style="width: 5%;">
	142	+ <col style="width: 5%;">
	143	+ <col style="width: 5%;">
	144	+ <col style="width: 5%;">
	145	+ <col style="width: 5%;">
	146	+ <col style="width: 5%;">
	147	+ <col style="width: 5%;">
	148	+ <col style="width: 5%;">
	149	+ <col style="width: 5%;">
147	150
148	151
149	152
150		- </colgroup>
151		- <thead class="list-table">
152		- <tr v-for="(codeInput, id) in filteredCodeBox" :key="id"
153		- style="background-color: var(--tableblue);">
154		- <th>코드</th>
155		- <th>코드명칭</th>
156		- <th>코드약칭</th>
157		- <th>정렬순서</th>
158		- <th>사용</th>
159		- <th class="wrap-text">{{ codeInput.pathName1 }}</th>
160		- <th>{{ codeInput.pathName2 }}</th>
161		- <th>{{ codeInput.pathName3 }}</th>
162		- <th>{{ codeInput.pathName4 }}</th>
163		- <th>{{ codeInput.pathName5 }}</th>
164		- <th>{{ codeInput.pathName6 }}</th>
165		- <th>{{ codeInput.pathName7 }}</th>
166		- <th>{{ codeInput.pathName8 }}</th>
167		- <th>{{ codeInput.pathName9 }}</th>
168		- <th>{{ codeInput.pathName10 }}</th>
169		- <th>{{ codeInput.pathName11 }}</th>
170		- <th class="wrap-text">{{ codeInput.pathName12 }}</th>
	153	+ </colgroup>
	154	+ <thead class="list-table">
	155	+ <tr v-for="(codeInput, id) in filteredCodeBox" :key="id"
	156	+ style="background-color: var(--tableblue);">
	157	+ <th>코드</th>
	158	+ <th>코드명칭</th>
	159	+ <th>코드약칭</th>
	160	+ <th>정렬순서</th>
	161	+ <th>사용</th>
	162	+ <th class="wrap-text">{{ codeInput.pathName1 }}</th>
	163	+ <th>{{ codeInput.pathName2 }}</th>
	164	+ <th>{{ codeInput.pathName3 }}</th>
	165	+ <th>{{ codeInput.pathName4 }}</th>
	166	+ <th>{{ codeInput.pathName5 }}</th>
	167	+ <th>{{ codeInput.pathName6 }}</th>
	168	+ <th>{{ codeInput.pathName7 }}</th>
	169	+ <th>{{ codeInput.pathName8 }}</th>
	170	+ <th>{{ codeInput.pathName9 }}</th>
	171	+ <th>{{ codeInput.pathName10 }}</th>
	172	+ <th>{{ codeInput.pathName11 }}</th>
	173	+ <th class="wrap-text">{{ codeInput.pathName12 }}</th>
171	174
172	175
173	176
174		- </tr>
175		- </thead>
176		- <tbody>
177		- <tr>
178		- <td>000101</td>
179		- <td>합계잔액시산표</td>
180		- <td></td>
181		- <td>0</td>
182		- <td><input type="checkbox" checked name="" id="" class="ui-checkbox"></td>
183		- <td></td>
184		- <td></td>
185		- <td></td>
186		- <td></td>
187		- <td></td>
188		- <td></td>
189		- <td></td>
190		- <td></td>
191		- <td></td>
192		- <td></td>
193		- <td></td>
194		- <td></td>
195		- </tr>
	177	+ </tr>
	178	+ </thead>
	179	+ <tbody style="height: 100%; ">
	180	+ <tr>
	181	+ <td>000101</td>
	182	+ <td>합계잔액시산표</td>
	183	+ <td></td>
	184	+ <td>0</td>
	185	+ <td><input type="checkbox" checked name="" id="" class="ui-checkbox">
	186	+ </td>
	187	+ <td></td>
	188	+ <td></td>
	189	+ <td></td>
	190	+ <td></td>
	191	+ <td></td>
	192	+ <td></td>
	193	+ <td></td>
	194	+ <td></td>
	195	+ <td></td>
	196	+ <td></td>
	197	+ <td></td>
	198	+ <td></td>
	199	+ </tr>
	200	+ <tr>
	201	+ <td>000101</td>
	202	+ <td>합계잔액시산표</td>
	203	+ <td></td>
	204	+ <td>0</td>
	205	+ <td><input type="checkbox" checked name="" id="" class="ui-checkbox">
	206	+ </td>
	207	+ <td></td>
	208	+ <td></td>
	209	+ <td></td>
	210	+ <td></td>
	211	+ <td></td>
	212	+ <td></td>
	213	+ <td></td>
	214	+ <td></td>
	215	+ <td></td>
	216	+ <td></td>
	217	+ <td></td>
	218	+ <td></td>
	219	+ </tr>
	220	+ <tr>
	221	+ <td>000101</td>
	222	+ <td>합계잔액시산표</td>
	223	+ <td></td>
	224	+ <td>0</td>
	225	+ <td><input type="checkbox" checked name="" id="" class="ui-checkbox">
	226	+ </td>
	227	+ <td></td>
	228	+ <td></td>
	229	+ <td></td>
	230	+ <td></td>
	231	+ <td></td>
	232	+ <td></td>
	233	+ <td></td>
	234	+ <td></td>
	235	+ <td></td>
	236	+ <td></td>
	237	+ <td></td>
	238	+ <td></td>
	239	+ </tr>
	240	+ <tr>
	241	+ <td>000101</td>
	242	+ <td>합계잔액시산표</td>
	243	+ <td></td>
	244	+ <td>0</td>
	245	+ <td><input type="checkbox" checked name="" id="" class="ui-checkbox">
	246	+ </td>
	247	+ <td></td>
	248	+ <td></td>
	249	+ <td></td>
	250	+ <td></td>
	251	+ <td></td>
	252	+ <td></td>
	253	+ <td></td>
	254	+ <td></td>
	255	+ <td></td>
	256	+ <td></td>
	257	+ <td></td>
	258	+ <td></td>
	259	+ </tr>
	260	+ <tr>
	261	+ <td>000101</td>
	262	+ <td>합계잔액시산표</td>
	263	+ <td></td>
	264	+ <td>0</td>
	265	+ <td><input type="checkbox" checked name="" id="" class="ui-checkbox">
	266	+ </td>
	267	+ <td></td>
	268	+ <td></td>
	269	+ <td></td>
	270	+ <td></td>
	271	+ <td></td>
	272	+ <td></td>
	273	+ <td></td>
	274	+ <td></td>
	275	+ <td></td>
	276	+ <td></td>
	277	+ <td></td>
	278	+ <td></td>
	279	+ </tr>
	280	+ <tr>
	281	+ <td>000101</td>
	282	+ <td>합계잔액시산표</td>
	283	+ <td></td>
	284	+ <td>0</td>
	285	+ <td><input type="checkbox" checked name="" id="" class="ui-checkbox">
	286	+ </td>
	287	+ <td></td>
	288	+ <td></td>
	289	+ <td></td>
	290	+ <td></td>
	291	+ <td></td>
	292	+ <td></td>
	293	+ <td></td>
	294	+ <td></td>
	295	+ <td></td>
	296	+ <td></td>
	297	+ <td></td>
	298	+ <td></td>
	299	+ </tr>
	300	+ <tr>
	301	+ <td>000101</td>
	302	+ <td>합계잔액시산표</td>
	303	+ <td></td>
	304	+ <td>0</td>
	305	+ <td><input type="checkbox" checked name="" id="" class="ui-checkbox">
	306	+ </td>
	307	+ <td></td>
	308	+ <td></td>
	309	+ <td></td>
	310	+ <td></td>
	311	+ <td></td>
	312	+ <td></td>
	313	+ <td></td>
	314	+ <td></td>
	315	+ <td></td>
	316	+ <td></td>
	317	+ <td></td>
	318	+ <td></td>
	319	+ </tr>
	320	+ <tr>
	321	+ <td>000101</td>
	322	+ <td>합계잔액시산표</td>
	323	+ <td></td>
	324	+ <td>0</td>
	325	+ <td><input type="checkbox" checked name="" id="" class="ui-checkbox">
	326	+ </td>
	327	+ <td></td>
	328	+ <td></td>
	329	+ <td></td>
	330	+ <td></td>
	331	+ <td></td>
	332	+ <td></td>
	333	+ <td></td>
	334	+ <td></td>
	335	+ <td></td>
	336	+ <td></td>
	337	+ <td></td>
	338	+ <td></td>
	339	+ </tr>
	340	+ <tr>
	341	+ <td>000101</td>
	342	+ <td>합계잔액시산표</td>
	343	+ <td></td>
	344	+ <td>0</td>
	345	+ <td><input type="checkbox" checked name="" id="" class="ui-checkbox">
	346	+ </td>
	347	+ <td></td>
	348	+ <td></td>
	349	+ <td></td>
	350	+ <td></td>
	351	+ <td></td>
	352	+ <td></td>
	353	+ <td></td>
	354	+ <td></td>
	355	+ <td></td>
	356	+ <td></td>
	357	+ <td></td>
	358	+ <td></td>
	359	+ </tr>
	360	+ <tr>
	361	+ <td>000101</td>
	362	+ <td>합계잔액시산표</td>
	363	+ <td></td>
	364	+ <td>0</td>
	365	+ <td><input type="checkbox" checked name="" id="" class="ui-checkbox">
	366	+ </td>
	367	+ <td></td>
	368	+ <td></td>
	369	+ <td></td>
	370	+ <td></td>
	371	+ <td></td>
	372	+ <td></td>
	373	+ <td></td>
	374	+ <td></td>
	375	+ <td></td>
	376	+ <td></td>
	377	+ <td></td>
	378	+ <td></td>
	379	+ </tr>
	380	+ <tr>
	381	+ <td>000101</td>
	382	+ <td>합계잔액시산표</td>
	383	+ <td></td>
	384	+ <td>0</td>
	385	+ <td><input type="checkbox" checked name="" id="" class="ui-checkbox">
	386	+ </td>
	387	+ <td></td>
	388	+ <td></td>
	389	+ <td></td>
	390	+ <td></td>
	391	+ <td></td>
	392	+ <td></td>
	393	+ <td></td>
	394	+ <td></td>
	395	+ <td></td>
	396	+ <td></td>
	397	+ <td></td>
	398	+ <td></td>
	399	+ </tr>
	400	+ <tr>
	401	+ <td>000101</td>
	402	+ <td>합계잔액시산표</td>
	403	+ <td></td>
	404	+ <td>0</td>
	405	+ <td><input type="checkbox" checked name="" id="" class="ui-checkbox">
	406	+ </td>
	407	+ <td></td>
	408	+ <td></td>
	409	+ <td></td>
	410	+ <td></td>
	411	+ <td></td>
	412	+ <td></td>
	413	+ <td></td>
	414	+ <td></td>
	415	+ <td></td>
	416	+ <td></td>
	417	+ <td></td>
	418	+ <td></td>
	419	+ </tr>
	420	+ <tr>
	421	+ <td>000101</td>
	422	+ <td>합계잔액시산표</td>
	423	+ <td></td>
	424	+ <td>0</td>
	425	+ <td><input type="checkbox" checked name="" id="" class="ui-checkbox">
	426	+ </td>
	427	+ <td></td>
	428	+ <td></td>
	429	+ <td></td>
	430	+ <td></td>
	431	+ <td></td>
	432	+ <td></td>
	433	+ <td></td>
	434	+ <td></td>
	435	+ <td></td>
	436	+ <td></td>
	437	+ <td></td>
	438	+ <td></td>
	439	+ </tr>
	440	+ <tr>
	441	+ <td>000101</td>
	442	+ <td>합계잔액시산표</td>
	443	+ <td></td>
	444	+ <td>0</td>
	445	+ <td><input type="checkbox" checked name="" id="" class="ui-checkbox">
	446	+ </td>
	447	+ <td></td>
	448	+ <td></td>
	449	+ <td></td>
	450	+ <td></td>
	451	+ <td></td>
	452	+ <td></td>
	453	+ <td></td>
	454	+ <td></td>
	455	+ <td></td>
	456	+ <td></td>
	457	+ <td></td>
	458	+ <td></td>
	459	+ </tr>
	460	+ <tr>
	461	+ <td>000101</td>
	462	+ <td>합계잔액시산표</td>
	463	+ <td></td>
	464	+ <td>0</td>
	465	+ <td><input type="checkbox" checked name="" id="" class="ui-checkbox">
	466	+ </td>
	467	+ <td></td>
	468	+ <td></td>
	469	+ <td></td>
	470	+ <td></td>
	471	+ <td></td>
	472	+ <td></td>
	473	+ <td></td>
	474	+ <td></td>
	475	+ <td></td>
	476	+ <td></td>
	477	+ <td></td>
	478	+ <td></td>
	479	+ </tr>
196	480
197		- <tr v-if="postList === 0">
198		- <td colspan="5" class="no-list">검색조건에 해당하는 데이터가 없습니다.</td>
199		- </tr>
200		- </tbody>
201		- </table>
	481	+ <tr v-if="postList === 0">
	482	+ <td colspan="5" class="no-list">검색조건에 해당하는 데이터가 없습니다.</td>
	483	+ </tr>
	484	+ </tbody>
	485	+ </table>
	486	+ </div>
202	487	</div>
203	488	</div>
204	489	</div>
205	490	</div>
206	491	</div>
207		-
208	492	</div>
209	493	</template>
210	494
...	...	@@ -301,7 +585,7 @@
301	585
302	586	.content-wrap {
303	587	padding-left: 30px;
304		- gap: 30px;
	588	+
305	589	}
306	590
307	591	.container {
...	...	@@ -337,4 +621,13 @@
337	621	.wrap-text {
338	622	word-break: keep-all;
339	623	}
	624	+input[type="text"]{
	625	+ width: 100%;
	626	+ padding-right: 20px;
	627	+}
	628	+.Bi001-table th{
	629	+ padding:0 20px;
	630	+ word-break: keep-all;
	631	+}
	632	+
340	633	</style> (파일 끝에 줄바꿈 문자 없음)

707ab52

98e46c9

client/views/pages/AccountingManagement/BaselineInformation/Bi002.vue

--- client/views/pages/AccountingManagement/BaselineInformation/Bi002.vue

+++ client/views/pages/AccountingManagement/BaselineInformation/Bi002.vue


                     </div>
                     <div>
                         <div style="border-top: 1px solid var(--borderlightgray); " class="scrollable-table mb2">
-                            <table class="list-table text section-table">
+                            <table class="list-table text section-table bank-wrap">
                                 <!-- col 꼭 너비 기재해야함! 그래야 100%로 차지함 -->
                                 <colgroup>
                                     <col style="width: 5%;">

     text-align: center;
     margin: 0 auto;
 }
+.section-wrap table {
+    height: 230px;
+    overflow-y: auto;
+
+}
+.bank-wrap td{
+    padding: 2px 0;
+}
 </style>

707ab52

98e46c9

client/views/pages/AccountingManagement/BaselineInformation/Bi003.vue

--- client/views/pages/AccountingManagement/BaselineInformation/Bi003.vue

+++ client/views/pages/AccountingManagement/BaselineInformation/Bi003.vue


                                     <col style="width: 4%;">
                                     <col style="width: 5%;">
                                     <col style="width: 3%;">
-                                    <col style="width: 2%;">
-                                    <col style="width: 2%;">
-                                    <col style="width: 2%;">
-                                    <col style="width: 2%;">
-                                    <col style="width: 2%;">
-                                    <col style="width: 2%;">
+                                    <col style="width: 3%;">
+                                    <col style="width: 3%;">
+                                    <col style="width: 3%;">
+                                    <col style="width: 3%;">
+                                    <col style="width: 3%;">
+                                    <col style="width: 3%;">
                                     <col style="width: 4%;">
                                     <col style="width: 4%;">
                                     <col style="width: 4%;">

                                         <td>{{ listTable.list21 }}</td>
                                     </tr>
 
-                                    <tr v-if="postList === 0">
-                                        <td colspan="5" class="no-list">검색조건에 해당하는 데이터가 없습니다.</td>
-                                    </tr>
+                                  
                                 </tbody>
                             </table>
                         </div>

                                     <div class="content-title flex justify-between ">
                                         계정과목목록
                                     </div>
-                                    <div class="table-zone table-scroll">
+                                    <div class="table-zone">
                                         <table class="list-table">
                                             <!-- col 꼭 너비 기재해야함! 그래야 100%로 차지함 -->
                                             <colgroup>

 
 <style scoped>
 
+ .modal-td {
+    text-align: center;
+    word-break: keep-all;
+}
 </style>

707ab52

98e46c9

client/views/pages/AccountingManagement/BaselineInformation/Bi004.vue

--- client/views/pages/AccountingManagement/BaselineInformation/Bi004.vue

+++ client/views/pages/AccountingManagement/BaselineInformation/Bi004.vue

...	...	@@ -1,11 +1,53 @@
1	1	<template>
2		- <div class="row gd-10" >Main.vue</div>
	2	+ <div class="gd-10 Bi001-page container">
	3	+ <div class="wrap pd2 flex-column">
	4	+ <div class="wrap-title pb1 mb1 flex justify-between">
	5	+ <h1>제무제표 양식 등록</h1>
	6	+ <div class="flex justify-end gd-5">
	7	+
	8	+ <div class="flex justify-between button-wrap">
	9	+ <button class="rest-btn">초기화</button>
	10	+ </div>
	11	+
	12	+
	13	+ </div>
	14	+ </div>
	15	+ <div class="content flex-column">
	16	+ <div class="row">
	17	+ <div class="content-title flex justify-between mb1">
	18	+ 조회조건
	19	+ </div>
	20	+ <div class="flex justify-between pb1" style="border-bottom: 2px solid var(--bordergray);">
	21	+
	22	+ <div class="flex justify-start box-wrap gd-10">
	23	+
	24	+ <div class="flex mr5">
	25	+ <div>
	26	+ <p class="blue-text">사업장</p>
	27	+ </div>
	28	+ <select name="" id="" style="width: 150px;">
	29	+ <option value="본점">본점(제지)</option>
	30	+ <option value="본점(포장)">본점(포장)</option>
	31	+ <option value="에너지솔루션(주)">에너지솔루션(주)</option>
	32	+ </select>
	33	+ </div>
	34	+ </div>
	35	+ <div class="flex align-center">
	36	+ <button class="blue-btn" style="padding-top: 7px ; padding-bottom: 7px;">조회(F12)</button>
	37	+ </div>
	38	+
	39	+
	40	+ </div>
	41	+ </div>
	42	+ </div>
	43	+ </div>
	44	+ </div>
3	45
4	46	</template>
5	47
6	48	<script>
7	49	export default {
8		- data () {
	50	+ data() {
9	51	return {
10	52	}
11	53	},
...	...	@@ -23,6 +65,4 @@
23	65	}
24	66	}
25	67	</script>
26		-<style>
27		-
28		-</style> (파일 끝에 줄바꿈 문자 없음)
	68	+<style></style> (파일 끝에 줄바꿈 문자 없음)

707ab52

98e46c9

client/views/pages/AccountingManagement/ChitManagement/Cm002.vue

--- client/views/pages/AccountingManagement/ChitManagement/Cm002.vue

+++ client/views/pages/AccountingManagement/ChitManagement/Cm002.vue


                                     <p class="blue-text">발의자</p>
                                 </div>
                                 <div class="flex  box-area">
-                                    <select name="" id="" class="flex30" >
+                                    <select name="" id="" class="flex30">
                                         <option value="">박정현(180516)</option>
                                         <option value="">권문기(210702)</option>
                                         <option value="">김황석(200702)</option>

                             <col style="width: 5%;">
                             <col style="width: 15%;">
                             <col style="width: 5%;">
+                            <col style="width: 15%;">
+                            <col style="width: 5%;">
+                            <col style="width: 15%;">
+                            <col style="width: 5%;">
+                            <col style="width: 15%;">
                         </colgroup>
                         <tbody>
                             <tr class="">

                     </table>
                 </div>
                 <div class="flex" style="gap: 15px; height: 100% ; flex-wrap: nowrap;">
-                    <div class="gd-3 pd1 table-area">
-                        <div class="content-title flex justify-between mb1">
+                    <div class="gd-3 pd1 table-area" style=" height: 65%;">
+                        <div class="content-title mb1">
                             전표목록
                         </div>
-                        
-                        <div class="box-overflow">
+                        <div class="flex-column justify-between">
 
-                            <table class="list-table">
-                                <!-- col 꼭 너비 기재해야함! 그래야 100%로 차지함 -->
-                                <colgroup>
-                                    <col style="width: 10%;">
-                                    <col style="width: 15%;">
-                                    <col style="width: 20%;">
-                                    <col style="width: 10%;">
-                                    <col style="width: 10%;">
+                            <div class="box-overflow">
 
-                                </colgroup>
-                                <thead>
-                                    <tr class="table-header"
-                                        style="background-color: var(--tableblue); color: var(--navbarblue); ">
-                                        <th>선택</th>
-                                        <th>발의번호</th>
-                                        <th>전송일시</th>
-                                        <th>상태</th>
-                                        <th>자동</th>
-                                        <th>G/W</th>
-                                    </tr>
-                                </thead>
-                                <tbody>
-                                    <tr class="table-border">
-                                        <td><input type="checkbox"></td>
-                                        <td></td>
-                                        <td></td>
-                                        <td></td>
-                                        <td></td>
-                                        <td></td>
-                                    </tr>
+                                <table class="list-table ">
+                                    <!-- col 꼭 너비 기재해야함! 그래야 100%로 차지함 -->
+                                    <colgroup>
+                                        <col style="width: 10%;">
+                                        <col style="width: 15%;">
+                                        <col style="width: 20%;">
+                                        <col style="width: 10%;">
+                                        <col style="width: 10%;">
+
+                                        </colgroup>
+                                    <thead>
+                                        <tr class="table-header table-border"
+                                            style="background-color: var(--tableblue); color: var(--navbarblue); ">
+                                            <th>선택</th>
+                                            <th>발의번호</th>
+                                            <th>전송일시</th>
+                                            <th>상태</th>
+                                            <th>자동</th>
+                                            <th>G/W</th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                        <tr class="table-border">
+                                            <td><input type="checkbox"></td>
+                                            <td></td>
+                                            <td></td>
+                                            <td></td>
+                                            <td></td>
+                                            <td></td>
+                                        </tr>
 
 
-                                </tbody>
-                            </table>
-                            <div class="button-wrap flex justify-end mb2">
-                            <button>전표 전송</button>
-                            <button style="border: 1px solid var(--red); color: var(--red);">전표 취소</button>
-                            <button>G/W 전송</button>
+                                    </tbody>
+                                </table>
+                                <div class="button-wrap flex justify-end mb2">
+                                    <button>전표 전송</button>
+                                    <button style="border: 1px solid var(--red); color: var(--red);">전표 취소</button>
+                                    <button>G/W 전송</button>
+                                </div>
                             </div>
                         </div>
                     </div>
-                    <div class=" pd1 table-area content-wrap" style="width: 80%;">
+                    <div class=" pd1 table-area content-wrap" style="width: 80%; height: 65%;">
                         <div class="content-title flex justify-between mb1">
                             전표등록
                         </div>
                         <div class="box-overflow ">
 
-                            <table class="list-table" >
+                            <table class="list-table">
                                 <!-- col 꼭 너비 기재해야함! 그래야 100%로 차지함 -->
                                 <colgroup>
                                     <col style="width: 10%;">

 </script>
 
 <style scoped>
-
-table td,table td{
+table td,
+table td {
     text-align: center;
 }
-
 </style>

707ab52

98e46c9

client/views/pages/App.vue

--- client/views/pages/App.vue

+++ client/views/pages/App.vue


   <div class="flex-column layout-wrap">
     <Header></Header>
     <Menu @itemSelected="handleItemSelected"></Menu>
-    <div class="wrapper flex" :class="loginUser != null ? 'main' : 'login'">
+    <div class="wrapper flex" >
       <SideMenu :selectedId="selectedId" class="gd-2"></SideMenu>
       <Login v-if="!isUserLoggedIn" @login="handleLogin" />
 

 import Header from '../pages/layout/Header.vue';
 import Menu from '../pages/layout/Menu.vue';
 import SideMenu from '../pages/layout/sideMenu.vue';
-// import axios from 'axios';
+import axios from 'axios';
 import Login from './login/Login.vue';
 
 const App = {
   data: () => {
     return {
       selectedId: true,
-      SideMenu: true,
       isUserLoggedIn: true,
     }
   },
   methods: {
     handleItemSelected(id) {
       this.selectedId = id;
+     
     },
     handleLogin() {
       this.isUserLoggedIn = true;
-    }
+    },
+    
 
   },
   watch: {

707ab52

98e46c9

client/views/pages/layout/Menu.vue

--- client/views/pages/layout/Menu.vue

+++ client/views/pages/layout/Menu.vue


     <nav class="main-nav flex justify-between align-center">
         <router-link to="/Bi002.page" class="logo gd-1"></router-link>
 
-        <ul class="flex justify-between topmenu-wrap align-center" >
+        <ul class="flex justify-between topmenu-wrap align-center">
 
             <li v-for="(topMenu, idx) in menuList" key="idx">
                 <p @click="selectItem(topMenu.id)" :class="{ active: topMenu.isActive }">{{ topMenu.pathName }}</p>
             </li>
 
         </ul>
-        <div class="logo-wrap flex justify-between align-center logo-btn "
-            style="flex-wrap: nowrap; width: 10%;">
+        <div class="logo-wrap flex justify-between align-center logo-btn " style="flex-wrap: nowrap; width: 10%;">
 
             <div class=" header-btn">
                 <p class="btn-img1"></p>
                 <a href="/">사용설명서</a>
             </div>
-            <!-- <div class=" header-btn">
-                <p class="btn-img3"></p>
-                <a href="/">박정현님</a>
-            </div>
-            <div class=" header-btn">
-                <p class="btn-img2"></p>
-                <a href="/">로그아웃</a>
-            </div> -->
+
         </div>
 
 

 
             console.log(id);
             this.$emit('itemSelected', id);
-
+            console.log("상단 메뉴 클릭됨. 사이드 메뉴 상태 변경 예정.");
+            
         }
     },
     watch: {

707ab52

98e46c9

client/views/pages/layout/sideMenu.vue

--- client/views/pages/layout/sideMenu.vue

+++ client/views/pages/layout/sideMenu.vue


                     <ul class="sidemenu-wrap">
                         <li v-for="(subMenu, idx) in sidetitle.subList" :key="idx">
                             <router-link v-show="sidetitle.show" :to="subMenu.path" class="mb2"
-                                @click="selectSubMenu(subMenu)" :class="{ 'active-text': subMenu.isActive }">{{
+                                @click="selectSubMenu(idx)" :class="{ 'active-text': isActive(idx) }">{{
                 subMenu.pathName
             }}</router-link>
                         </li>

         return {
             selectedId: 1,
             selectedSubMenu: false,
+            activeIndex: null,
             menuList: [
                 {
                     // 인사/급여관리

                             show: true,
 
                             subList: [
-                                { path: "/Bi001.page", pathName: "(회계)공통코드 등록"},
-                                { path: "/Bi002.page", pathName: "거래처 정보 등록" },
-                                { path: "/Bi003.page", pathName: "계정과목 등록"},
-                                { path: "/Bi004.page", pathName: "재무제표 양식 등록"},
-                                { path: "/Bi005.page", pathName: "재무제표 계정 설정 등록"},
+                                { path: "/Bi001.page", pathName: "(회계)공통코드 등록" },
+                                { path: "/Bi002.page", isActive: true, pathName: "거래처 정보 등록" },
+                                { path: "/Bi003.page", pathName: "계정과목 등록" },
+                                { path: "/Bi004.page", pathName: "재무제표 양식 등록" },
+                                { path: "/Bi005.page", pathName: "재무제표 계정 설정 등록" },
                                 { path: "/Bi006.page", pathName: "은행 계좌 등록" },
-                                { path: "/Bi007.page", pathName: "거래처 대장"},
+                                { path: "/Bi007.page", pathName: "거래처 대장" },
                             ],
                         },
                         {

         toggleMenu(menu) {
             menu.show = !menu.show;
         },
-        selectSubMenu(subMenu) {
-            // 이전에 선택된 메뉴가 있다면 비활성화
-            if (this.selectedSubMenu) {
-                this.selectedSubMenu.isActive = false;
-            }
-
-            // 새로 선택된 메뉴를 활성화하고 저장
-            subMenu.isActive = true;
-            this.selectedSubMenu = subMenu;
+        selectSubMenu(index) {
+            this.activeIndex = index; // 클릭된 항목의 인덱스로 활성화 상태 변경
         },
+        isActive(index) {
+            return this.activeIndex === index; // 현재 인덱스가 활성화 상태인지 판단
+        },
+
 
     },
     watch: {

         },
     },
     mounted() {
-
+        this.activeIndex = 0;
     }
 }
 </script>

     width: 100%;
 
 }
-nav::-webkit-scrollbar{
+
+nav::-webkit-scrollbar {
     width: 2px;
 }
-nav::-webkit-scrollbar-thumb{
+
+nav::-webkit-scrollbar-thumb {
     background-color: var(--navbarblue);
 }
 

Add a comment

Open 0
Closed 0

List

...	...	@@ -849,7 +849,7 @@
849	849	}
850	850
851	851	.box-overflow {
852		- height: 100%;
	852	+ height: 90%;
853	853	min-height: 320px;
854	854	max-height: 650px;
855	855	overflow-y: auto;

...	...	@@ -4,7 +4,7 @@
4	4	const LOG_BASE_DIR = `${__dirname}/server/logs`;
5	5	const SERVICE_STATUS = process.env.NODE_ENV;//development, production
6	6	const PORT = 80;
7		-const API_SERVER_HOST = 'localhost:8080';
	7	+const API_SERVER_HOST = 'localhost:9090';
8	8
9	9	module.exports = {
10	10	PROJECT_NAME,

...	...	@@ -174,7 +174,7 @@
174	174
175	175
176	176	table{
177		- min-width: 100%;
	177	+ width: 100%;
178	178	border-collapse: collapse;
179	179	table-layout: fixed;
180	180	}

...	...	@@ -337,6 +337,7 @@
337	337	color: var(--navbarblue);
338	338	position: relative;
339	339	text-align: left !important;
	340	+ margin-right: 10px;
340	341	/* left: 2%; */
341	342	font-size: 1.3rem;
342	343	font-weight: 600;
...	...	@@ -464,7 +465,6 @@
464	465	}
465	466
466	467	.section-wrap table {
467		- height: 230px;
468	468	overflow-y: auto;
469	469
470	470	}
...	...	@@ -546,7 +546,6 @@
546	546	.Bi003-list table {
547	547	text-align: center;
548	548	border-top: 1px solid var(--borderlightgray);
549		- word-break: keep-all;
550	549	}
551	550
552	551	/* 잔액 이월 전표 등록 */

...	...	@@ -359,7 +359,7 @@
359	359	</div>
360	360	<div>
361	361	<div style="border-top: 1px solid var(--borderlightgray); " class="scrollable-table mb2">
362		- <table class="list-table text section-table">
	362	+ <table class="list-table text section-table bank-wrap">
363	363	<!-- col 꼭 너비 기재해야함! 그래야 100%로 차지함 -->
364	364	<colgroup>
365	365	<col style="width: 5%;">
...	...	@@ -624,4 +624,12 @@
624	624	text-align: center;
625	625	margin: 0 auto;
626	626	}
	627	+.section-wrap table {
	628	+ height: 230px;
	629	+ overflow-y: auto;
	630	+
	631	+}
	632	+.bank-wrap td{
	633	+ padding: 2px 0;
	634	+}
627	635	</style> (파일 끝에 줄바꿈 문자 없음)

...	...	@@ -207,12 +207,12 @@
207	207	<col style="width: 4%;">
208	208	<col style="width: 5%;">
209	209	<col style="width: 3%;">
210		- <col style="width: 2%;">
211		- <col style="width: 2%;">
212		- <col style="width: 2%;">
213		- <col style="width: 2%;">
214		- <col style="width: 2%;">
215		- <col style="width: 2%;">
	210	+ <col style="width: 3%;">
	211	+ <col style="width: 3%;">
	212	+ <col style="width: 3%;">
	213	+ <col style="width: 3%;">
	214	+ <col style="width: 3%;">
	215	+ <col style="width: 3%;">
216	216	<col style="width: 4%;">
217	217	<col style="width: 4%;">
218	218	<col style="width: 4%;">
...	...	@@ -285,9 +285,7 @@
285	285	<td>{{ listTable.list21 }}</td>
286	286	</tr>
287	287
288		- <tr v-if="postList === 0">
289		- <td colspan="5" class="no-list">검색조건에 해당하는 데이터가 없습니다.</td>
290		- </tr>
	288	+
291	289	</tbody>
292	290	</table>
293	291	</div>
...	...	@@ -323,7 +321,7 @@
323	321	<div class="content-title flex justify-between ">
324	322	계정과목목록
325	323	</div>
326		- <div class="table-zone table-scroll">
	324	+ <div class="table-zone">
327	325	<table class="list-table">
328	326	<!-- col 꼭 너비 기재해야함! 그래야 100%로 차지함 -->
329	327	<colgroup>
...	...	@@ -445,4 +443,8 @@
445	443
446	444	<style scoped>
447	445
	446	+ .modal-td {
	447	+ text-align: center;
	448	+ word-break: keep-all;
	449	+}
448	450	</style> (파일 끝에 줄바꿈 문자 없음)

...	...	@@ -47,7 +47,7 @@
47	47	<p class="blue-text">발의자</p>
48	48	</div>
49	49	<div class="flex box-area">
50		- <select name="" id="" class="flex30" >
	50	+ <select name="" id="" class="flex30">
51	51	<option value="">박정현(180516)</option>
52	52	<option value="">권문기(210702)</option>
53	53	<option value="">김황석(200702)</option>
...	...	@@ -74,6 +74,11 @@
74	74	<col style="width: 5%;">
75	75	<col style="width: 15%;">
76	76	<col style="width: 5%;">
	77	+ <col style="width: 15%;">
	78	+ <col style="width: 5%;">
	79	+ <col style="width: 15%;">
	80	+ <col style="width: 5%;">
	81	+ <col style="width: 15%;">
77	82	</colgroup>
78	83	<tbody>
79	84	<tr class="">
...	...	@@ -132,61 +137,63 @@
132	137	</table>
133	138	</div>
134	139	<div class="flex" style="gap: 15px; height: 100% ; flex-wrap: nowrap;">
135		- <div class="gd-3 pd1 table-area">
136		- <div class="content-title flex justify-between mb1">
	140	+ <div class="gd-3 pd1 table-area" style=" height: 65%;">
	141	+ <div class="content-title mb1">
137	142	전표목록
138	143	</div>
139		-
140		- <div class="box-overflow">
	144	+ <div class="flex-column justify-between">
141	145
142		- <table class="list-table">
143		- <!-- col 꼭 너비 기재해야함! 그래야 100%로 차지함 -->
144		- <colgroup>
145		- <col style="width: 10%;">
146		- <col style="width: 15%;">
147		- <col style="width: 20%;">
148		- <col style="width: 10%;">
149		- <col style="width: 10%;">
	146	+ <div class="box-overflow">
150	147
151		- </colgroup>
152		- <thead>
153		- <tr class="table-header"
154		- style="background-color: var(--tableblue); color: var(--navbarblue); ">
155		- <th>선택</th>
156		- <th>발의번호</th>
157		- <th>전송일시</th>
158		- <th>상태</th>
159		- <th>자동</th>
160		- <th>G/W</th>
161		- </tr>
162		- </thead>
163		- <tbody>
164		- <tr class="table-border">
165		- <td><input type="checkbox"></td>
166		- <td></td>
167		- <td></td>
168		- <td></td>
169		- <td></td>
170		- <td></td>
171		- </tr>
	148	+ <table class="list-table ">
	149	+ <!-- col 꼭 너비 기재해야함! 그래야 100%로 차지함 -->
	150	+ <colgroup>
	151	+ <col style="width: 10%;">
	152	+ <col style="width: 15%;">
	153	+ <col style="width: 20%;">
	154	+ <col style="width: 10%;">
	155	+ <col style="width: 10%;">
	156	+
	157	+ </colgroup>
	158	+ <thead>
	159	+ <tr class="table-header table-border"
	160	+ style="background-color: var(--tableblue); color: var(--navbarblue); ">
	161	+ <th>선택</th>
	162	+ <th>발의번호</th>
	163	+ <th>전송일시</th>
	164	+ <th>상태</th>
	165	+ <th>자동</th>
	166	+ <th>G/W</th>
	167	+ </tr>
	168	+ </thead>
	169	+ <tbody>
	170	+ <tr class="table-border">
	171	+ <td><input type="checkbox"></td>
	172	+ <td></td>
	173	+ <td></td>
	174	+ <td></td>
	175	+ <td></td>
	176	+ <td></td>
	177	+ </tr>
172	178
173	179
174		- </tbody>
175		- </table>
176		- <div class="button-wrap flex justify-end mb2">
177		- <button>전표 전송</button>
178		- <button style="border: 1px solid var(--red); color: var(--red);">전표 취소</button>
179		- <button>G/W 전송</button>
	180	+ </tbody>
	181	+ </table>
	182	+ <div class="button-wrap flex justify-end mb2">
	183	+ <button>전표 전송</button>
	184	+ <button style="border: 1px solid var(--red); color: var(--red);">전표 취소</button>
	185	+ <button>G/W 전송</button>
	186	+ </div>
180	187	</div>
181	188	</div>
182	189	</div>
183		- <div class=" pd1 table-area content-wrap" style="width: 80%;">
	190	+ <div class=" pd1 table-area content-wrap" style="width: 80%; height: 65%;">
184	191	<div class="content-title flex justify-between mb1">
185	192	전표등록
186	193	</div>
187	194	<div class="box-overflow ">
188	195
189		- <table class="list-table" >
	196	+ <table class="list-table">
190	197	<!-- col 꼭 너비 기재해야함! 그래야 100%로 차지함 -->
191	198	<colgroup>
192	199	<col style="width: 10%;">
...	...	@@ -487,9 +494,8 @@
487	494	</script>
488	495
489	496	<style scoped>
490		-
491		-table td,table td{
	497	+table td,
	498	+table td {
492	499	text-align: center;
493	500	}
494		-
495	501	</style> (파일 끝에 줄바꿈 문자 없음)

...	...	@@ -2,7 +2,7 @@
2	2	<div class="flex-column layout-wrap">
3	3	<Header></Header>
4	4	<Menu @itemSelected="handleItemSelected"></Menu>
5		- <div class="wrapper flex" :class="loginUser != null ? 'main' : 'login'">
	5	+ <div class="wrapper flex" >
6	6	<SideMenu :selectedId="selectedId" class="gd-2"></SideMenu>
7	7	<Login v-if="!isUserLoggedIn" @login="handleLogin" />
8	8
...	...	@@ -15,24 +15,25 @@
15	15	import Header from '../pages/layout/Header.vue';
16	16	import Menu from '../pages/layout/Menu.vue';
17	17	import SideMenu from '../pages/layout/sideMenu.vue';
18		-// import axios from 'axios';
	18	+import axios from 'axios';
19	19	import Login from './login/Login.vue';
20	20
21	21	const App = {
22	22	data: () => {
23	23	return {
24	24	selectedId: true,
25		- SideMenu: true,
26	25	isUserLoggedIn: true,
27	26	}
28	27	},
29	28	methods: {
30	29	handleItemSelected(id) {
31	30	this.selectedId = id;
	31	+
32	32	},
33	33	handleLogin() {
34	34	this.isUserLoggedIn = true;
35		- }
	35	+ },
	36	+
36	37
37	38	},
38	39	watch: {

...	...	@@ -9,7 +9,7 @@
9	9	<ul class="sidemenu-wrap">
10	10	<li v-for="(subMenu, idx) in sidetitle.subList" :key="idx">
11	11	<router-link v-show="sidetitle.show" :to="subMenu.path" class="mb2"
12		- @click="selectSubMenu(subMenu)" :class="{ 'active-text': subMenu.isActive }">{{
	12	+ @click="selectSubMenu(idx)" :class="{ 'active-text': isActive(idx) }">{{
13	13	subMenu.pathName
14	14	}}</router-link>
15	15	</li>
...	...	@@ -33,6 +33,7 @@
33	33	return {
34	34	selectedId: 1,
35	35	selectedSubMenu: false,
	36	+ activeIndex: null,
36	37	menuList: [
37	38	{
38	39	// 인사/급여관리
...	...	@@ -88,13 +89,13 @@
88	89	show: true,
89	90
90	91	subList: [
91		- { path: "/Bi001.page", pathName: "(회계)공통코드 등록"},
92		- { path: "/Bi002.page", pathName: "거래처 정보 등록" },
93		- { path: "/Bi003.page", pathName: "계정과목 등록"},
94		- { path: "/Bi004.page", pathName: "재무제표 양식 등록"},
95		- { path: "/Bi005.page", pathName: "재무제표 계정 설정 등록"},
	92	+ { path: "/Bi001.page", pathName: "(회계)공통코드 등록" },
	93	+ { path: "/Bi002.page", isActive: true, pathName: "거래처 정보 등록" },
	94	+ { path: "/Bi003.page", pathName: "계정과목 등록" },
	95	+ { path: "/Bi004.page", pathName: "재무제표 양식 등록" },
	96	+ { path: "/Bi005.page", pathName: "재무제표 계정 설정 등록" },
96	97	{ path: "/Bi006.page", pathName: "은행 계좌 등록" },
97		- { path: "/Bi007.page", pathName: "거래처 대장"},
	98	+ { path: "/Bi007.page", pathName: "거래처 대장" },
98	99	],
99	100	},
100	101	{
...	...	@@ -240,16 +241,13 @@
240	241	toggleMenu(menu) {
241	242	menu.show = !menu.show;
242	243	},
243		- selectSubMenu(subMenu) {
244		- // 이전에 선택된 메뉴가 있다면 비활성화
245		- if (this.selectedSubMenu) {
246		- this.selectedSubMenu.isActive = false;
247		- }
248		-
249		- // 새로 선택된 메뉴를 활성화하고 저장
250		- subMenu.isActive = true;
251		- this.selectedSubMenu = subMenu;
	244	+ selectSubMenu(index) {
	245	+ this.activeIndex = index; // 클릭된 항목의 인덱스로 활성화 상태 변경
252	246	},
	247	+ isActive(index) {
	248	+ return this.activeIndex === index; // 현재 인덱스가 활성화 상태인지 판단
	249	+ },
	250	+
253	251
254	252	},
255	253	watch: {
...	...	@@ -268,7 +266,7 @@
268	266	},
269	267	},
270	268	mounted() {
271		-
	269	+ this.activeIndex = 0;
272	270	}
273	271	}
274	272	</script>
...	...	@@ -282,10 +280,12 @@
282	280	width: 100%;
283	281
284	282	}
285		-nav::-webkit-scrollbar{
	283	+
	284	+nav::-webkit-scrollbar {
286	285	width: 2px;
287	286	}
288		-nav::-webkit-scrollbar-thumb{
	287	+
	288	+nav::-webkit-scrollbar-thumb {
289	289	background-color: var(--navbarblue);
290	290	}
291	291

Delete comment