diff --git a/code/web/task_schedule/src/test/test.ts b/code/web/task_schedule/src/test/test.ts
index 2883091..f9bf9dd 100644
--- a/code/web/task_schedule/src/test/test.ts
+++ b/code/web/task_schedule/src/test/test.ts
@@ -8,6 +8,6 @@
  * Copyright (c) ${2022} by Kane, All Rights Reserved.
  */
 
-import { testNewCitizen } from "./identify.js";
+import { testRankingListRequest } from "./testRankingListRequest.js";
 
-testNewCitizen();
+testRankingListRequest();
diff --git a/code/web/task_schedule/src/utils/api/request.ts b/code/web/task_schedule/src/utils/api/request.ts
index e989643..9113c06 100644
--- a/code/web/task_schedule/src/utils/api/request.ts
+++ b/code/web/task_schedule/src/utils/api/request.ts
@@ -13,7 +13,7 @@ import axios, { type AxiosInstance } from "axios";
 const service: AxiosInstance = axios.create(
     {
         baseURL: "",
-        timeout: 5000,
+        timeout: 10000,
     }
 );
 
diff --git a/code/web/task_schedule/src/utils/ranking.ts b/code/web/task_schedule/src/utils/ranking.ts
index a592a9c..3d73c8d 100644
--- a/code/web/task_schedule/src/utils/ranking.ts
+++ b/code/web/task_schedule/src/utils/ranking.ts
@@ -32,4 +32,81 @@ interface RankingListResponse
     renewalRankintList: RankingListItem[];
 };
 
-export { type RankingListRequest, type RankingListResponse };
+/**
+ * 请求坐席排行榜。
+ * @param reqParam 请求参数
+ * @param rander 保存请求结果的回调函数
+ * @returns 返回RankingListResponse对象，里面包含请求状态和数据。
+ */
+function requestRankingList( reqParam: RankingListRequest, rander: any ): void // eslint-disable-line
+{
+    // let attachingRankingList: RankingListItem[];
+    // let renewalRankintList: RankingListItem[];
+
+    const rankingListResponse: RankingListResponse = {
+        success: false,
+        message: "",
+        departmentCode: reqParam.departmentCode,
+        year: reqParam.year,
+        month: reqParam.month,
+        attachingRankingList: [],
+        renewalRankintList: [],
+    };
+
+    instance.request(
+        {
+            method: "post",
+            url: API_URL.URL_RANKINGLIST,
+            data: reqParam,
+        })
+        .then(( response ) =>
+        {
+            const data: RankingListResponse = response.data as RankingListResponse;
+
+            rankingListResponse.success = data.success ?? false;
+            rankingListResponse.message = data.message ?? "";
+            rankingListResponse.departmentCode = data.departmentCode ?? "";
+            rankingListResponse.year = data.year ?? "";
+            rankingListResponse.month = data.month ?? "";
+
+            // 遍历排行榜元素
+            for ( const item of ( data.attachingRankingList ?? [] )) // eslint-disable-line
+            {
+                const index: number = item.index ?? -1;
+
+                if ( index === -1 )
+                {
+                    continue;
+                }
+
+                rankingListResponse.attachingRankingList.push( item );
+            }
+
+            for ( const item of ( data.renewalRankintList ?? [] )) // eslint-disable-line
+            {
+                const index: number = item.index ?? -1;
+
+                if ( index === -1 )
+                {
+                    continue;
+                }
+
+                rankingListResponse.renewalRankintList.push( item );
+            }
+
+            // 调用回调函数保存数据
+            rander( rankingListResponse );
+
+            console.log( data );
+        })
+        .catch(( error ) =>
+        {
+            console.log( error );
+        });
+}
+
+export {
+    type RankingListRequest,
+    type RankingListResponse,
+    requestRankingList
+};
diff --git a/code/web/task_schedule/src/views/DesktopArchievement.vue b/code/web/task_schedule/src/views/DesktopArchievement.vue
index 0942247..c4d5bf1 100644
--- a/code/web/task_schedule/src/views/DesktopArchievement.vue
+++ b/code/web/task_schedule/src/views/DesktopArchievement.vue
@@ -64,6 +64,8 @@ import { useRouter } from "vue-router";
 import { getCallerInfo } from "@/utils/api/localStorage.js";
 import { ElMessage } from "element-plus";
 import { type Archievement, queryDepartmentArchievement } from "@/utils/archievement.js";
+import { RankingListItem } from "@/types/cpicxim/RankingListItem.js";
+import { type RankingListRequest, type RankingListResponse, requestRankingList } from "@/utils/ranking.js";
 import { type Department } from "@/types/cpicxim/Department";
 import ArchievementChart from "@/components/ArchievementChartComponent.vue";
 import ArchievementCompleteRateComponent from "@/components/ArchievementCompleteRateComponent.vue";
@@ -73,6 +75,21 @@ import RankingListComponent from "@/components/RankingListComponent.vue";
 import { logout } from "@/utils/account.js";
 import { type TelSaler } from "@/types/cpicxim/TelSaler";
 
+interface ui
+{
+    currentMonth: string;
+    chartData: number[];
+    totalArchievement: number;
+    attaching_rate: string;
+    insurance_renewal_rate: string; // 续保率
+    leading_reward_gainers: string[]; // 领跑奖
+    advance_reward_gainers: string[]; // 飞跃奖
+    dishonorPersons: string[];
+    showUI: boolean; // 用来刷新页面的开关
+    attachingRankingList: RankingListItem[]; // 坐席车非渗透率榜单
+    renewalRankingList: RankingListItem[];
+};
+
 export default {
     name: "DesktopArchievement",
     components: {
@@ -88,7 +105,7 @@ export default {
         const numInChinese = ["一", "二", "三", "四", "五", "六", "七", "八", "九", "十", "十一", "十二",];
         const router = useRouter();
         const callerInfo: TelSaler = getCallerInfo();
-        const ui = reactive({
+        const ui: ui = reactive({
             currentMonth: numInChinese[monthIndex.getMonth() - 1],
             chartData: [0,], // 业绩表
             totalArchievement: 0, // 总业绩
@@ -98,6 +115,8 @@ export default {
             advance_reward_gainers: ["",], // 飞跃奖
             dishonorPersons: ["",],
             showUI: true, // 用来刷新页面的开关
+            attachingRankingList: [], // 坐席车非渗透率榜单
+            renewalRankingList: [], // 坐席续保率榜单
         });
         const timerHandler = 0;
 
@@ -114,8 +133,8 @@ export default {
             return archievement;
         });
 
-        // 绘制数据
-        const renderData = ( data:Archievement ) =>
+        // 保存业绩数据
+        const applyArchievementData = ( data:Archievement ) =>
         {
             console.log( "部门业绩数据", data );
 
@@ -134,6 +153,18 @@ export default {
             setTimeout(() => { ui.showUI = true; }, 0 );
         };
 
+        const applyRankingListData = ( data: RankingListResponse ): void =>
+        {
+            ui.attachingRankingList = data.attachingRankingList;
+            ui.renewalRankingList = data.renewalRankintList;
+
+            // 更新UI
+            // 先不显示界面，往队列中加入显示队列的回调，让vue刷新组件。
+            ui.showUI = false;
+
+            setTimeout(() => { ui.showUI = true; }, 0 );
+        };
+
         // 退出桌面霸屏
         const logoutDesktopArchievement = () =>
         {
@@ -155,6 +186,9 @@ export default {
             router.push( "/login" );
         }
 
+        /**
+         * 刷新页面
+         */
         const refresh = () =>
         {
             const deparmentInfo:Department =
@@ -163,9 +197,20 @@ export default {
                 departmentName: callerInfo.departmentName,
             };
 
-            queryDepartmentArchievement( deparmentInfo, renderData );
+            const rankinglistRequest: RankingListRequest =
+            {
+                departmentCode: callerInfo.departmentCode,
+                year: "2023",
+                month: "06",
+            };
+
+            queryDepartmentArchievement( deparmentInfo, applyArchievementData );
+            requestRankingList( rankinglistRequest, applyRankingListData );
         };
 
+        /**
+         * 加载前
+         */
         onBeforeMount(() =>
         {
             // 设置每10分钟刷新一次
@@ -174,13 +219,16 @@ export default {
             refresh();
         });
 
+        /**
+         * 页面卸载前
+         */
         onUnmounted(():void =>
         {
             // 退出页面前关掉定时器
             clearInterval( timerHandler );
         });
 
-        return { ui, callerInfo, timerHandler, getTotalArchievement, renderData, refresh, logoutDesktopArchievement, };
+        return { ui, callerInfo, timerHandler, getTotalArchievement, renderData: applyArchievementData, refresh, logoutDesktopArchievement, };
     },
 };
 </script>
diff --git a/code/web/task_schedule/vite.config.js b/code/web/task_schedule/vite.config.js
index c22deeb..f68f44f 100644
--- a/code/web/task_schedule/vite.config.js
+++ b/code/web/task_schedule/vite.config.js
@@ -2,7 +2,7 @@
  * @Author: Kane
  * @Date: 2023-02-15 09:25:52
  * @LastEditors: Kane
- * @LastEditTime: 2023-03-30 21:09:30
+ * @LastEditTime: 2023-06-07 15:53:53
  * @FilePath: /task_schedule/vite.config.js
  * @Description: 
  * 
@@ -18,6 +18,7 @@ export default defineConfig(( command, mode ) =>
     const env = loadEnv( mode, process.cwd(), "" );
 
     return {
+        server:{ host: "localhost", port: 3000, },
         plugins: [vue(),],
         base: "./",
         resolve: {