渲染数据。

code/db/常用语句.sql

@@ -1,3 +1,9 @@
 SELECT *
   FROM reward_gainers
-   FOR UPDATE
+   FOR UPDATE;
+
+SELECT b.reward_name,
+       a.*
+  FROM reward_gainers  a,
+       reward_projects b
+ WHERE a.reward_index = b.reward_index;

code/web/task_schedule/src/components/ArchievementChartComponent.vue

@@ -67,8 +67,6 @@ export default {
             initCharts();
         });
 
-        console.log(props);
-
         return { ui, initCharts, props, };
     },
 };

code/web/task_schedule/src/components/HonorListComponent.vue

@@ -43,14 +43,14 @@ export default {
             default: () => "本",
         },
         leadingReward: {
-            type: String,
+            type: Array,
             require: true,
-            default: () => "",
+            default: () => ["",],
         },
         advanceReward: {
-            type: String,
+            type: Array,
             require: true,
-            default: () => "",
+            default: () => ["",],
         },
     },
     setup()

code/web/task_schedule/src/utils/archievement.ts

@@ -16,7 +16,7 @@ interface Archievement
     success: boolean;
     message: string;
     total_archievement: number;
-    mensual_archievement_list: string[];
+    mensual_archievement_list: number[];
     insurance_renewal_rate: string;
     attaching_rate: string;
     leading_reward_gainers: string[];

code/web/task_schedule/src/views/DesktopArchievement.vue

@@ -8,7 +8,10 @@
  * Copyright (c) ${2022} by Kane, All Rights Reserved.
 -->
 <template>
-    <div class="view-wrapper">
+    <div
+        v-if="ui.showUI"
+        class="view-wrapper"
+    >
         <div class="center-wrapper">
             <span class="slogan">对标先进&nbsp;比学赶超</span>
             <div class="total-archievement-wrapper">
@@ -19,14 +22,16 @@
                 <div class="total-archievement-rate-wrapper">
                     <ArchievementCompleteRateComponent
                         indicator="续保完成率"
-                        percentage="95"
+                        :percentage="ui.insurance_renewal_rate"
                     />
                     <ArchievementCompleteRateComponent
                         indicator="车非渗透率"
-                        percentage="95"
+                        :percentage="ui.attaching_rate"
                     />
                 </div>
-                <div class="total-archievement-charts-wrapper">
+                <div
+                    class="total-archievement-charts-wrapper"
+                >
                     <ArchievementChart
                         :chart-data="ui.chartData"
                     />
@@ -35,8 +40,8 @@
             <div class="reward-wrapper">
                 <HonorListComponent
                     month="二"
-                    leading-reward="王炜"
+                    :leading-reward="ui.leading_reward_gainers"
-                    advance-reward="王炜"
+                    :advance-reward="ui.advance_reward_gainers"
                 />
                 <DishonorListComponent
                     month="二"
@@ -49,7 +54,7 @@
 </template>
 
 <script lang="ts">
-import { computed, reactive } from "vue";
+import { computed, reactive, onBeforeMount } from "vue";
 import { useRouter } from "vue-router";
 import { loadStaffInfo } from "@/utils/api/localStorage.js";
 import { ElMessage } from "element-plus";
@@ -72,9 +77,14 @@ export default {
         const router = useRouter();
         const staffInfo = loadStaffInfo();
         const ui = reactive({
-            chartData: [200, 230, 224, 218, 135, 147, 260, 800,],
+            chartData: [0,], // 业绩表
-            totalArchievement: 120000000,
+            totalArchievement: 0, // 总业绩
-            dishonorPersons: ["张三", "李四",],
+            attaching_rate: "", // 车非渗透率
+            insurance_renewal_rate: "", // 续保率
+            leading_reward_gainers: ["",], // 领跑奖
+            advance_reward_gainers: ["",], // 飞跃奖
+            dishonorPersons: ["",],
+            showUI: true, // 用来刷新页面的开关
         });
 
         const getTotalArchievement = computed(() =>
@@ -90,19 +100,20 @@ export default {
             return archievement;
         });
 
-        const requestArchievement = () =>
+        // 绘制数据
+        const renderData = (data:Archievement) =>
         {
-            const archievement: Archievement = {
+            console.log("部门业绩数据", data);
-                success: false,
+
-                message: "",
+            ui.chartData = data.mensual_archievement_list;
-                total_archievement: 0,
+            ui.totalArchievement = data.total_archievement;
-                mensual_archievement_list: [],
+            ui.attaching_rate = data.attaching_rate;
-                insurance_renewal_rate: "",
+            ui.insurance_renewal_rate = data.insurance_renewal_rate;
-                attaching_rate: "",
+
-                leading_reward_gainers: [],
+            // 更新UI
-                advance_reward_gainers: [],
+            ui.showUI = false;
-                backward_list: [],
+
-            };
+            setTimeout(() => { ui.showUI = true; }, 0);
         };
 
         // 检查存储的登录信息，不存在则返回登录页面
@@ -117,7 +128,12 @@ export default {
             router.push("/login");
         }
 
-        return { ui, getTotalArchievement, requestArchievement, };
+        onBeforeMount(() =>
+        {
+            queryDepartmentArchievement(renderData);
+        });
+
+        return { ui, getTotalArchievement, renderData, };
     },
 };
 </script>

code/后端/desktop_archievement_backend/src/main/java/com/cpic/xim/web/controllers/archievement/ArchievementQueryController.java

@@ -39,22 +39,23 @@ public class ArchievementQueryController
 
     void genTestDepartmentData( DepartmentArchievementQueryResult data )
     {
-        Vector<String> mensual_archievement = new Vector<String>();
+        Vector<Integer> mensual_archievement = new Vector<Integer>();
 
-        mensual_archievement.add( "200" );
+        mensual_archievement.add( 200 );
-        mensual_archievement.add( "213" );
+        mensual_archievement.add( 213 );
-        mensual_archievement.add( "333" );
+        mensual_archievement.add( 333 );
-        mensual_archievement.add( "444" );
+        mensual_archievement.add( 444 );
-        mensual_archievement.add( "555" );
+        mensual_archievement.add( 555 );
-        mensual_archievement.add( "666" );
+        mensual_archievement.add( 666 );
 
         data.setSuccess( true );
         data.setMessage( "成功" );
-        data.setTotalArchievement( 12000000 );
+        data.setTotalArchievement( 1234567890 );
         data.setInsuranceRenewalRate( "65" );
         data.setAttachingRate( "75" );
-        data.addAdvanceRewardGainer( "王炜" );
+        data.addAdvanceRewardGainer( "沈群" );
-        data.addLeadingRewardGainer( "王炜" );
+        data.addLeadingRewardGainer( "王鸿津" );
+        data.addLeadingRewardGainer( "林宗泽" );
         data.addBackwardStaff( "王炜" );
         data.setMensualArchievementList( null );
         data.setMensualArchievementList( mensual_archievement );

code/后端/desktop_archievement_backend/src/main/java/com/cpic/xim/web/controllers/archievement/DepartmentArchievementQueryResult.java

@@ -21,7 +21,7 @@ public class DepartmentArchievementQueryResult
 {
     DepartmentArchievementQueryResult()
     {
-        mensualArchievementList = new Vector<String>();
+        mensualArchievementList = new Vector<Integer>();
         advanceRewardGainers = new Vector<String>();
         leadingRewardGainers = new Vector<String>();
         backwardList = new Vector<String>();
@@ -37,12 +37,12 @@ public class DepartmentArchievementQueryResult
         this.totalArchievement = totalArchievement;
     }
 
-    public Vector<String> getMensualArchievementList()
+    public Vector<Integer> getMensualArchievementList()
     {
         return mensualArchievementList;
     }
 
-    public void setMensualArchievementList( Vector<String> mensualArchievementList )
+    public void setMensualArchievementList( Vector<Integer> mensualArchievementList )
     {
         this.mensualArchievementList = mensualArchievementList;
     }
@@ -144,7 +144,7 @@ public class DepartmentArchievementQueryResult
     // 每月业绩列表
     // 要保证数据是按照月份排序。
     @JsonProperty( "mensual_archievement_list" )
-    private Vector<String> mensualArchievementList;
+    private Vector<Integer> mensualArchievementList;
 
     @JsonProperty( "insurance_renewal_rate" )
     private String insuranceRenewalRate; // 续保率