Commit @e6e6599d735044ecb889d152be2e2602c7b283ea

김성원 2023-07-31

화면수정

@e6e6599d735044ecb889d152be2e2602c7b283ea

6408a52

e6e6599

client/views/index.html

--- client/views/index.html

+++ client/views/index.html


     <link rel="stylesheet" href="/client/resources/css/main.css" />
     <!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/ol/dist/ol.css" /> -->
 
-    <title>Node Vue Web</title>
+    <title>AI 횡단보도 API 관리 시스템</title>
 </head>
 
 <body>

6408a52

e6e6599

client/views/pages/SystemManagement/ApiTokenManagement.vue

--- client/views/pages/SystemManagement/ApiTokenManagement.vue

+++ client/views/pages/SystemManagement/ApiTokenManagement.vue


 }
 
 .select_row{
-    background: #cd7d09 !important;
+    background: #ffbe5f !important;
     color: white;
 }
 

6408a52

e6e6599

client/views/pages/SystemManagement/RequestLogView.vue

--- client/views/pages/SystemManagement/RequestLogView.vue

+++ client/views/pages/SystemManagement/RequestLogView.vue


             <col style="width: 10%;">
             <col style="width: 10%;">
             <col style="width: 15%;">           
-            <col style="width: 40%;">
-          
+            <col style="width: 20%;">
+            <col style="width: 20%;">          
           </colgroup>
           <thead>
             <tr>

               <th>오류발생여부</th>
               <th>호출시간</th>
               <th>메세지</th>
-             
+              <th>접속IP</th>             
             </tr>
           </thead>
           <tbody>            
-            <tr v-for="(item, idx) in apiLogList" :key="idx">
+            <tr v-for="(item, idx) in apiLogList" :key="idx"  @click="selectApiLog = item"  v-bind:class="{'select_row' : (item.call_dt == selectApiLog.call_dt) }">
               <td data-title="NO">{{ pagenation.totalRow -  ((pagenation.currentPage ) * pagenation.perPage) + ( pagenation.perPage - idx) }}</td>
               <td data-title="ID">{{ item.node_id }}({{change_code(item.crslk_az)}})</td>
               <td data-title="이름">{{ item.user_nm }}</td>
               <td data-title="오류발생여부">{{ item.err_yn }}</td>
               <td data-titel="호출시간">{{ item.call_dt}}</td>
               <td data-title="메세지">{{ item.msg }}</td>           
+              <td data-title="접속IP">{{ item.cntn_ip }}</td>         
             </tr>
             <tr v-if="apiLogList.length == 0">
                  <td data-title="NO" colspan="6">조회된 데이터가 없습니다.</td>

           v-model:currentPage="pagenation.currentPage"
           :per-page="pagenation.perPage" :total-count="pagenation.totalRow" :max-range="5"
           :click="search" />        
+      </div>
+
+      <div>
+        <div class="sub-title-wrap" style="margin-bottom: 30px;">
+          <h3 class="sub-title">로그 상세정보 </h3>       
+        </div>
+        <div >
+          <table>
+            <colgroup>
+              <col style="width: 25%;">
+              <col style="width: 25%;">
+              <col style="width: 25%;">
+              <col style="width: 25%;">            
+            </colgroup>
+            <tbody><div class=""></div>
+              <tr>
+                <th >노드</th>
+                <td>{{ selectApiLog.node_id }}({{change_code(selectApiLog.crslk_az)}})</td>
+                <th>업체명</th>
+                <td>{{ selectApiLog.user_nm }}</td>
+              </tr>
+              <tr>
+                <th>오류발생여부</th>
+                <td>{{ selectApiLog.err_yn }}</td> 
+                <th>호출시간</th>
+                <td>{{ selectApiLog.call_dt}}</td>            
+              </tr>
+              <tr>
+                <th>메세지</th>           
+                <td>{{ selectApiLog.msg }}</td>
+                <th>수신내용</th>
+                <td>{{ selectApiLog.contents }}</td>
+              </tr>           
+            </tbody>
+          </table>
+        </div>     
       </div>
     </div>
   </div>

         msg : '',
       },      
       apiLogList: [],
+      selectApiLog : {},
       userIdx: 0
     };
   },

   top: 1.5em;
   z-index: 10;
 }
+
+.select_row{
+    background: #ffbe5f !important;
+    color: white;
+}
 </style>

6408a52

e6e6599

client/views/pages/SystemManagement/ResponseLogView.vue

--- client/views/pages/SystemManagement/ResponseLogView.vue

+++ client/views/pages/SystemManagement/ResponseLogView.vue


             </tr>
           </thead>
           <tbody>            
-            <tr v-for="(item, idx) in apiLogList" :key="idx">
+            <tr v-for="(item, idx) in apiLogList" :key="idx" @click="selectApiLog = item"  v-bind:class="{'select_row' : (item.call_dt == selectApiLog.call_dt) }">
               <td data-title="NO">{{ pagenation.totalRow -  ((pagenation.currentPage ) * pagenation.perPage) + ( pagenation.perPage - idx) }}</td>
               <td data-title="ID">{{ item.node_id }}({{change_code(item.crslk_az)}})</td>
               <td data-title="이름">{{ item.user_nm }}</td>

           v-model:currentPage="pagenation.currentPage"
           :per-page="pagenation.perPage" :total-count="pagenation.totalRow" :max-range="5"
           :click="search" />        
+      </div>
+      <div>
+        <div class="sub-title-wrap" style="margin-bottom: 30px;">
+          <h3 class="sub-title">로그 상세정보 </h3>       
+        </div>
+        <div >
+          <table>
+            <colgroup>
+              <col style="width: 25%;">
+              <col style="width: 25%;">
+              <col style="width: 25%;">
+              <col style="width: 25%;">            
+            </colgroup>
+            <tbody><div class=""></div>
+              <tr>
+                <th >노드</th>
+                <td>{{ selectApiLog.node_id }}({{change_code(selectApiLog.crslk_az)}})</td>
+                <th>업체명</th>
+                <td>{{ selectApiLog.user_nm }}</td>
+              </tr>
+              <tr>
+                <th>오류발생여부</th>
+                <td>{{ selectApiLog.err_yn }}</td> 
+                <th>호출시간</th>
+                <td>{{ selectApiLog.call_dt}}</td>            
+              </tr>
+              <tr>
+                <th>메세지</th>           
+                <td>{{ selectApiLog.msg }}</td>
+                <th>수신내용</th>
+                <td>{{ selectApiLog.contents }}</td>
+              </tr>           
+            </tbody>
+          </table>
+        </div>     
       </div>
     </div>
   </div>

         msg : '',
       },      
       apiLogList: [],
+      selectApiLog : {},
       userIdx: 0
     };
   },

   top: 1.5em;
   z-index: 10;
 }
+
+.select_row{
+    background: #ffbe5f !important;
+    color: white;
+}
 </style>

Add a comment

Open 0
Closed 0

List

...	...	@@ -14,7 +14,7 @@
14	14	<link rel="stylesheet" href="/client/resources/css/main.css" />
15	15	<!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/ol/dist/ol.css" /> -->
16	16
17		- <title>Node Vue Web</title>
	17	+ <title>AI 횡단보도 API 관리 시스템</title>
18	18	</head>
19	19
20	20	<body>

...	...	@@ -303,7 +303,7 @@
303	303	}
304	304
305	305	.select_row{
306		- background: #cd7d09 !important;
	306	+ background: #ffbe5f !important;
307	307	color: white;
308	308	}
309	309

...	...	@@ -38,8 +38,8 @@
38	38	<col style="width: 10%;">
39	39	<col style="width: 10%;">
40	40	<col style="width: 15%;">
41		- <col style="width: 40%;">
42		-
	41	+ <col style="width: 20%;">
	42	+ <col style="width: 20%;">
43	43	</colgroup>
44	44	<thead>
45	45	<tr>
...	...	@@ -49,17 +49,18 @@
49	49	<th>오류발생여부</th>
50	50	<th>호출시간</th>
51	51	<th>메세지</th>
52		-
	52	+ <th>접속IP</th>
53	53	</tr>
54	54	</thead>
55	55	<tbody>
56		- <tr v-for="(item, idx) in apiLogList" :key="idx">
	56	+ <tr v-for="(item, idx) in apiLogList" :key="idx" @click="selectApiLog = item" v-bind:class="{'select_row' : (item.call_dt == selectApiLog.call_dt) }">
57	57	<td data-title="NO">{{ pagenation.totalRow - ((pagenation.currentPage ) * pagenation.perPage) + ( pagenation.perPage - idx) }}</td>
58	58	<td data-title="ID">{{ item.node_id }}({{change_code(item.crslk_az)}})</td>
59	59	<td data-title="이름">{{ item.user_nm }}</td>
60	60	<td data-title="오류발생여부">{{ item.err_yn }}</td>
61	61	<td data-titel="호출시간">{{ item.call_dt}}</td>
62	62	<td data-title="메세지">{{ item.msg }}</td>
	63	+ <td data-title="접속IP">{{ item.cntn_ip }}</td>
63	64	</tr>
64	65	<tr v-if="apiLogList.length == 0">
65	66	<td data-title="NO" colspan="6">조회된 데이터가 없습니다.</td>
...	...	@@ -72,6 +73,42 @@
72	73	v-model:currentPage="pagenation.currentPage"
73	74	:per-page="pagenation.perPage" :total-count="pagenation.totalRow" :max-range="5"
74	75	:click="search" />
	76	+ </div>
	77	+
	78	+ <div>
	79	+ <div class="sub-title-wrap" style="margin-bottom: 30px;">
	80	+ <h3 class="sub-title">로그 상세정보 </h3>
	81	+ </div>
	82	+ <div >
	83	+ <table>
	84	+ <colgroup>
	85	+ <col style="width: 25%;">
	86	+ <col style="width: 25%;">
	87	+ <col style="width: 25%;">
	88	+ <col style="width: 25%;">
	89	+ </colgroup>
	90	+ <tbody><div class=""></div>
	91	+ <tr>
	92	+ <th >노드</th>
	93	+ <td>{{ selectApiLog.node_id }}({{change_code(selectApiLog.crslk_az)}})</td>
	94	+ <th>업체명</th>
	95	+ <td>{{ selectApiLog.user_nm }}</td>
	96	+ </tr>
	97	+ <tr>
	98	+ <th>오류발생여부</th>
	99	+ <td>{{ selectApiLog.err_yn }}</td>
	100	+ <th>호출시간</th>
	101	+ <td>{{ selectApiLog.call_dt}}</td>
	102	+ </tr>
	103	+ <tr>
	104	+ <th>메세지</th>
	105	+ <td>{{ selectApiLog.msg }}</td>
	106	+ <th>수신내용</th>
	107	+ <td>{{ selectApiLog.contents }}</td>
	108	+ </tr>
	109	+ </tbody>
	110	+ </table>
	111	+ </div>
75	112	</div>
76	113	</div>
77	114	</div>
...	...	@@ -102,6 +139,7 @@
102	139	msg : '',
103	140	},
104	141	apiLogList: [],
	142	+ selectApiLog : {},
105	143	userIdx: 0
106	144	};
107	145	},
...	...	@@ -357,4 +395,9 @@
357	395	top: 1.5em;
358	396	z-index: 10;
359	397	}
	398	+
	399	+.select_row{
	400	+ background: #ffbe5f !important;
	401	+ color: white;
	402	+}
360	403	</style> (No newline at end of file)

...	...	@@ -52,7 +52,7 @@
52	52	</tr>
53	53	</thead>
54	54	<tbody>
55		- <tr v-for="(item, idx) in apiLogList" :key="idx">
	55	+ <tr v-for="(item, idx) in apiLogList" :key="idx" @click="selectApiLog = item" v-bind:class="{'select_row' : (item.call_dt == selectApiLog.call_dt) }">
56	56	<td data-title="NO">{{ pagenation.totalRow - ((pagenation.currentPage ) * pagenation.perPage) + ( pagenation.perPage - idx) }}</td>
57	57	<td data-title="ID">{{ item.node_id }}({{change_code(item.crslk_az)}})</td>
58	58	<td data-title="이름">{{ item.user_nm }}</td>
...	...	@@ -71,6 +71,41 @@
71	71	v-model:currentPage="pagenation.currentPage"
72	72	:per-page="pagenation.perPage" :total-count="pagenation.totalRow" :max-range="5"
73	73	:click="search" />
	74	+ </div>
	75	+ <div>
	76	+ <div class="sub-title-wrap" style="margin-bottom: 30px;">
	77	+ <h3 class="sub-title">로그 상세정보 </h3>
	78	+ </div>
	79	+ <div >
	80	+ <table>
	81	+ <colgroup>
	82	+ <col style="width: 25%;">
	83	+ <col style="width: 25%;">
	84	+ <col style="width: 25%;">
	85	+ <col style="width: 25%;">
	86	+ </colgroup>
	87	+ <tbody><div class=""></div>
	88	+ <tr>
	89	+ <th >노드</th>
	90	+ <td>{{ selectApiLog.node_id }}({{change_code(selectApiLog.crslk_az)}})</td>
	91	+ <th>업체명</th>
	92	+ <td>{{ selectApiLog.user_nm }}</td>
	93	+ </tr>
	94	+ <tr>
	95	+ <th>오류발생여부</th>
	96	+ <td>{{ selectApiLog.err_yn }}</td>
	97	+ <th>호출시간</th>
	98	+ <td>{{ selectApiLog.call_dt}}</td>
	99	+ </tr>
	100	+ <tr>
	101	+ <th>메세지</th>
	102	+ <td>{{ selectApiLog.msg }}</td>
	103	+ <th>수신내용</th>
	104	+ <td>{{ selectApiLog.contents }}</td>
	105	+ </tr>
	106	+ </tbody>
	107	+ </table>
	108	+ </div>
74	109	</div>
75	110	</div>
76	111	</div>
...	...	@@ -101,6 +136,7 @@
101	136	msg : '',
102	137	},
103	138	apiLogList: [],
	139	+ selectApiLog : {},
104	140	userIdx: 0
105	141	};
106	142	},
...	...	@@ -356,4 +392,9 @@
356	392	top: 1.5em;
357	393	z-index: 10;
358	394	}
	395	+
	396	+.select_row{
	397	+ background: #ffbe5f !important;
	398	+ color: white;
	399	+}
359	400	</style> (No newline at end of file)

Delete comment