diff --git a/src/api/log-manage.ts b/src/api/log-manage.ts
index e002adb..3341e37 100644
--- a/src/api/log-manage.ts
+++ b/src/api/log-manage.ts
@@ -1,21 +1,32 @@
 import request, {CommonHeaderEnum} from "@/utils/request";
 
 const getMonthlyLogCountUrl = '/admin/log/getMonthlyLogCount'
+const getPageUrl = "/admin/log/page";
 
 export function getMonthlyLogCount(startTime: string, endTime: string) {
-    return new Promise(resolve => {
-        request({
-            url: getMonthlyLogCountUrl,
-            method: 'post',
-            data: {
-                startTime,
-                endTime
-            },
-            headers: {
-                'Content-Type': CommonHeaderEnum.FORM_CONTENT_TYPE,
-            },
-        }).then(res => {
-            resolve(res.data);
-        })
-    })
+	return new Promise(resolve => {
+		request({
+			url: getMonthlyLogCountUrl,
+			method: 'post',
+			data: {
+				startTime,
+				endTime
+			},
+			headers: {
+				'Content-Type': CommonHeaderEnum.FORM_CONTENT_TYPE,
+			},
+		}).then(res => {
+			resolve(res.data);
+		})
+	})
+}
+
+export function getPage(current: number, size: number) {
+	return new Promise((resolve, reject) => {
+		request.get(getPageUrl + `?current=${current}&size=${size}`).then((res: any) => {
+			resolve(res.data);
+		}).catch(err => {
+			reject(err);
+		})
+	})
 }
\ No newline at end of file
diff --git a/src/components/system-logs.vue b/src/components/system-logs.vue
index 38eacd3..3529954 100644
--- a/src/components/system-logs.vue
+++ b/src/components/system-logs.vue
@@ -1,23 +1,28 @@
 <template>
     <el-timeline>
-        <el-timeline-item v-for="(item, index) in activities" :key="index" :timestamp="item.time">
-            {{ item.title + '-' + item.ip }}
+        <el-timeline-item v-for="(item, index) in activities" :key="index" :timestamp="item.createTime">
+            {{ item.title + '-' + item.remoteAddr }}
         </el-timeline-item>
     </el-timeline>
 </template>
 
 <script lang='ts' setup>
-import { onMounted, reactive, ref, toRefs, watch } from 'vue'
-import { dateFormater } from '@/utils/date-util';
+import {onMounted, ref} from 'vue'
+import * as logManageApi from "@/api/log-manage";
 
-const activities: any = []
+const activities = ref([] as any);
 
-while (activities.length < 10) {
-    activities.push({
-        time: dateFormater('yyyy-MM-dd HH:mm:ss'),
-        title: '登录成功',
-        ip: '127.0.0.1'
-    })
+onMounted(function () {
+	getLogList();
+});
+
+function getLogList() {
+	logManageApi.getPage(0, 100).then((res: any) => {
+		if (res.code == 0) {
+			activities.value = res.data.records;
+			console.log(activities.value)
+		}
+	})
 }
 </script>