diff --git a/src/service/api/auth.ts b/src/service/api/auth.ts
index 90765cd..c954e8e 100644
--- a/src/service/api/auth.ts
+++ b/src/service/api/auth.ts
@@ -3,7 +3,7 @@ import { request } from '../request';
 /**
  * 登录
  *
- * @param userName User name
+ * @param username User name
  * @param password Password
  */
 export function fetchLogin(username: string, password: string) {
@@ -17,7 +17,9 @@ export function fetchLogin(username: string, password: string) {
   });
 }
 
-/** Get user info */
+/** 获取用户信息
+ *
+ */
 export function fetchGetUserInfo() {
   return request<Api.Auth.UserInfo>({ url: '/api/auth/me' });
 }
diff --git a/src/service/api/role.ts b/src/service/api/role.ts
new file mode 100644
index 0000000..7613329
--- /dev/null
+++ b/src/service/api/role.ts
@@ -0,0 +1,24 @@
+import { request } from '../request';
+
+/** 获取角色列表
+ *
+ */
+export function roleListApi() {
+  return request({ url: '/api/role' });
+}
+/**
+ * 登录
+ *
+ * @param username User name
+ * @param password Password
+ */
+export function fetchLogin(username: string, password: string) {
+  return request({
+    url: '/api/auth/login',
+    method: 'post',
+    data: {
+      username,
+      password
+    }
+  });
+}
diff --git a/src/store/modules/auth/index.ts b/src/store/modules/auth/index.ts
index 8fb9117..9791d9b 100644
--- a/src/store/modules/auth/index.ts
+++ b/src/store/modules/auth/index.ts
@@ -22,7 +22,7 @@ export const useAuthStore = defineStore(SetupStoreId.Auth, () => {
 
   const userInfo: Api.Auth.UserInfo = reactive({
     userId: '',
-    username: '',
+    userName: '',
     roles: [],
     buttons: []
   });
@@ -130,6 +130,7 @@ export const useAuthStore = defineStore(SetupStoreId.Auth, () => {
   async function loginByToken(loginToken: Api.Auth.LoginToken) {
     // 1. stored in the localStorage, the later requests need it in headers
     localStg.set('token', loginToken.token);
+    localStg.set('refreshToken', loginToken.refreshToken);
 
     // 2. get user info
     const pass = await getUserInfo();
diff --git a/src/views/systemManage/role/index.vue b/src/views/systemManage/role/index.vue
index bf48254..76c2f0c 100644
--- a/src/views/systemManage/role/index.vue
+++ b/src/views/systemManage/role/index.vue
@@ -5,6 +5,7 @@ import { Icon } from '@iconify/vue'
 import { useThemeStore } from '@/store/modules/theme';
 import { useRouter } from 'vue-router';
 import { NButton, NPopconfirm } from 'naive-ui';
+import { roleListApi } from '@/service/api/role';
 
 const router = useRouter();
 const appStore = useAppStore();
@@ -100,28 +101,17 @@ const columns = ref([
     }
   },
 ])
-const list = ref<{ id: number, name: string }[]>([])
+const list = ref<{ id: number, name: string, intro: string, perms: string[] }[]>([])
 
 // 获取列表
 const getList = async () => {
   loading.value = true;
-  setTimeout(() => {
+  try {
+    const res = await roleListApi();
+    list.value = res.data;
+  } finally {
     loading.value = false;
-    list.value = [
-      {id:1,name:'角色名称1'},
-      {id:2,name:'角色名称2'},
-      {id:3,name:'角色名称3'},
-      {id:4,name:'角色名称4'},
-      {id:5,name:'角色名称5'},
-      {id:6,name:'角色名称6'},
-      {id:7,name:'角色名称7'},
-      {id:8,name:'角色名称8'},
-      {id:9,name:'角色名称9'},
-      {id:10,name:'角色名称10'},
-      {id:11,name:'角色名称11'},
-      {id:12,name:'角色名称12'},
-    ]
-  }, 1000)
+  }
 }
 
 // 打开添加角色弹框