From e09e2fcb5362279a7bf3fd0e0f239ada09287e50 Mon Sep 17 00:00:00 2001
From: bestlee <bestlee@djxinxi.net>
Date: Tue, 29 Sep 2026 12:04:11 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=86=E7=AE=A1=E9=A2=86=E5=AF=BC=E9=A6=96?=
 =?UTF-8?q?=E9=A1=B5=E5=AE=8C=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/home/modules/template8.vue | 138 ++++++++++++---------------
 1 file changed, 61 insertions(+), 77 deletions(-)

diff --git a/src/views/home/modules/template8.vue b/src/views/home/modules/template8.vue
index 38cee6f..7bdff38 100644
--- a/src/views/home/modules/template8.vue
+++ b/src/views/home/modules/template8.vue
@@ -1,11 +1,11 @@
 <script setup lang="ts">
-import { computed, onMounted, onUnmounted, ref } from 'vue';
+import { onMounted, onUnmounted, ref } from 'vue';
 import { Icon } from '@iconify/vue'
 import { useThemeStore } from '@/store/modules/theme';
 import { useRouterPush } from '@/hooks/common/router';
 import { getColorWithOpacity, tagTextColor, tagBgColor, tagBorderColor } from '@/utils/common';
 import { systemConfigApi } from "@/service/api/system";
-import { homeApi } from "@/service/api/statistics";
+import { homeLeaderApi } from "@/service/api/statistics";
 
 const themeStore = useThemeStore();
 const { routerPushByKey } = useRouterPush();
@@ -13,8 +13,6 @@ const { routerPushByKey } = useRouterPush();
 const loading = ref<boolean>(false);
 // 变更临期天数
 const remindDays = ref<number>(0);
-// 变更类型列表
-const typeList = ref<any>([]);
 // 变更等级列表
 const levelList = ref<any>([]);
 // 时间显示
@@ -22,21 +20,10 @@ const clock = ref<string>('');
 let timer: any = null;
 // 首页数据
 const homeData = ref<any>(null);
-// 尚未关闭总数
-const openTotal = computed(() => {
-  return homeData.value?.unclosed_status?.items?.reduce((sum:number, item:any) => sum + item.count, 0) || 0;
-});
-// 临时变更到期提醒情况
-const tempTotal = computed(() => {
-  return (homeData.value?.dept_stats?.unclosed_total || 0) + (homeData.value?.dept_stats?.near_overdue_total || 0) + (homeData.value?.dept_stats?.overdue_total || 0);
-});
-
 
 // 跳转变更申请页面、变更台账、我的任务、发起变更
 const jumpTo = (key: string,qid:number = 0) => {
-  if(key==='my_initiatechange' && qid){
-    routerPushByKey(key,{ query: { id: qid.toString() } });
-  }else if(key==='details_closedoc' && qid){
+ if(key==='details_approval' && qid){
     routerPushByKey(key,{ query: { id: qid.toString(),key:'home' } });
   }else if(key==='details_index' && qid){
     routerPushByKey(key,{ query: { id: qid.toString(),key:'home' } });
@@ -44,10 +31,6 @@ const jumpTo = (key: string,qid:number = 0) => {
     routerPushByKey(key as any);
   }
 }
-// 打开变更详情
-const openDetail = (row: any) => {
-  routerPushByKey("details_index",{ query: { id: row?.change_id?.toString(),key:'home' } });
-};
 
 // 获取当前时间字符串
 const getCurrentTimeStr = () => {
@@ -69,6 +52,12 @@ const tick = () => {
   timer = setTimeout(tick, delay);
 }
 
+// 获取正常、临期、超期数量
+const getNormalNearOverdue = (key:string) => {
+  const targetItem = homeData.value?.temp_expiry_scope?.items?.find((item:any) => item.key === key);
+  return targetItem?.count || 0;
+}
+
 // 匹配对象
 const matchObj = (list:any,val:number) => {
   const obj = list.find((item:any) => item.value == val);
@@ -78,10 +67,9 @@ const matchObj = (list:any,val:number) => {
 // 获取数据
 const getData = async () => {
   loading.value = true;
-  const {data,error} = await homeApi();
+  const {data,error} = await homeLeaderApi();
   if(!error){
     homeData.value = data;
-    console.log(data)
   }
   loading.value = false;
 }
@@ -99,11 +87,6 @@ const getConfig = async () => {
         }
       })
     }
-    // 解析 变更类型设置
-    const changeTypeGroup = data.find((group:{group_key:string}) => group.group_key === 'change_type');
-    if (changeTypeGroup) {
-      typeList.value = changeTypeGroup.items;
-    }
     // 解析 变更等级设置
     const changeLevelGroup = data.find((group:{group_key:string}) => group.group_key === 'change_level');
     if (changeLevelGroup) {
@@ -145,7 +128,7 @@ onUnmounted(() => {
         </NGi>
         <NGi span="24 s:24 m:16" class="flex items-center justify-end gap-12px">
         <p class="text-#999 text-xs">{{clock}}</p>
-        <NButton ghost size="small" @click="jumpTo('my_mytask')">
+        <NButton ghost size="small" @click="jumpTo('factoryoverview')">
             全厂变更看板
         </NButton>
         <NButton type="primary" size="small" @click="jumpTo('my_mytask')">
@@ -172,6 +155,7 @@ onUnmounted(() => {
             <div 
                 class="h-100% flex-1 flex items-center gap-3 bg-white px-16px py-12px cursor-pointer transition hover:-translate-y-1"
                 :style="{ borderRadius: themeStore.themeRadius + 'px' }"
+                @click="jumpTo('my_mytask')"
             >
                 <span class="shrink-0 rounded-lg p-2.5 bg-[var(--theme-bg)]">
                     <Icon icon="lucide:clipboard-check" class="size-24px text-[--theme-color]" />
@@ -179,7 +163,7 @@ onUnmounted(() => {
                 <div class="flex flex-col">
                     <CountTo
                     :start-value="0"
-                    :end-value="126"
+                    :end-value="homeData?.todo_approvals?.total || 0"
                     class="text-26px font-600"
                     />
                     <p class="text-[11px] font-semibold text-slate-400">待我终批 · 均为重要变更</p>
@@ -190,6 +174,7 @@ onUnmounted(() => {
             <div 
                 class="h-100% flex-1 flex items-center gap-3 bg-white px-16px py-12px cursor-pointer transition hover:-translate-y-1"
                 :style="{ borderRadius: themeStore.themeRadius + 'px' }"
+                @click="jumpTo('changeledger')"
             >
                 <span class="shrink-0 rounded-lg p-2.5 bg-[var(--success-bg)]">
                     <Icon icon="akar-icons:file" class="size-24px text-[--success-color]" />
@@ -197,10 +182,13 @@ onUnmounted(() => {
                 <div class="flex flex-col">
                     <CountTo
                     :start-value="0"
-                    :end-value="86.4"
+                    :end-value="homeData?.unclosed_status?.total || 0"
                     class="text-26px font-600"
                     />
-                    <p class="text-[11px] font-semibold text-slate-400">当前未关闭变更 · 审批中 14 · 实施中 9 · 待关闭 81</p>
+                    <div class="text-[11px] font-semibold text-slate-400 flex items-center gap-x-2 flex-wrap">
+                        当前未关闭变更
+                        <span v-for="item in homeData?.unclosed_status?.items || []" :key="item.status">{{item.label}} {{item.count}}</span>
+                    </div>
                 </div>
             </div>
         </NGi>
@@ -208,6 +196,7 @@ onUnmounted(() => {
             <div 
                 class="h-100% flex-1 flex items-center gap-3 bg-white px-16px py-12px cursor-pointer transition hover:-translate-y-1"
                 :style="{ borderRadius: themeStore.themeRadius + 'px' }"
+                @click="jumpTo('changeledger')"
             >
                 <span class="shrink-0 rounded-lg p-2.5 bg-[var(--warning-bg)]">
                     <Icon icon="lets-icons:clock" class="size-24px text-[--warning-color]" />
@@ -215,10 +204,13 @@ onUnmounted(() => {
                 <div class="flex flex-col">
                     <CountTo
                     :start-value="0"
-                    :end-value="18"
+                    :end-value="homeData?.temp_expiry_scope?.total || 0"
                     class="text-26px font-600 text-[var(--warning-color)]"
                     />
-                    <p class="text-[11px] font-semibold text-slate-400">临时变更临期或到期 · 临期 1 · 已超期 1 · 需落实恢复 / 延期 / 转永久</p>
+                    <div class="text-[11px] font-semibold text-slate-400 flex items-center gap-x-2 flex-wrap">
+                        临时变更临期或到期
+                        <span v-for="item in homeData?.temp_expiry_scope?.items || []" :key="item.status">{{item.label}} {{item.count}}</span>
+                    </div>
                 </div>
             </div>
         </NGi>
@@ -226,6 +218,7 @@ onUnmounted(() => {
             <div 
                 class="h-100% flex-1 flex items-center gap-3 bg-white px-16px py-12px cursor-pointer transition hover:-translate-y-1"
                 :style="{ borderRadius: themeStore.themeRadius + 'px' }"
+                @click="jumpTo('changeledger')"
             >
                 <span class="shrink-0 rounded-lg p-2.5 bg-[var(--error-bg)]">
                     <Icon icon="proicons:alert-triangle" class="size-24px text-[--error-color]" />
@@ -234,7 +227,7 @@ onUnmounted(() => {
                     <div class="flex items-center">
                         <CountTo
                             :start-value="0"
-                            :end-value="4"
+                            :end-value="homeData?.overdue_unclosed?.total || 0"
                             class="text-26px font-600 text-[var(--error-color)]"
                         />
                     </div>
@@ -255,14 +248,14 @@ onUnmounted(() => {
             <p class="text-13px font-700 text-#64749a">重要变更审批</p>
             <p class="text-11px text-#94a3b8 mt-2px">仅重要变更到达此节点</p>
             </div>
-            <NButton v-if="homeData?.my_changes_progress?.total > 0" ghost size="small" class="text-xs" @click="jumpTo('my_mytask')">
+            <NButton v-if="homeData?.todo_approvals?.total > 0" ghost size="small" class="text-xs" @click="jumpTo('my_mytask')">
             我的任务
             <Icon icon="formkit:right" class="size-12px" />
             </NButton>
         </div>
         <div class="flex flex-col gap-3">
-            <template v-if="homeData?.my_changes_progress?.total > 0">
-            <div v-for="row in homeData?.my_changes_progress?.items?.slice(0, 3) || []" :key="row.change_id" @click="openDetail(row)"
+            <template v-if="homeData?.todo_approvals?.total > 0">
+            <div v-for="row in homeData?.todo_approvals?.items?.slice(0, 3) || []" :key="row.change_id" @click="jumpTo('details_approval',row.change_id)"
                 class="cursor-pointer flex w-full items-center gap-3 border px-3.5 py-2.5 text-left transition hover:border-[var(--hover-border)] hover:bg-[var(--hover-bg)] hover:bg-[#EAF0F9]/40"
                 :style="{ 
                 borderRadius: themeStore.themeRadius + 'px',
@@ -287,8 +280,8 @@ onUnmounted(() => {
                     <div class="mt-1 flex items-center gap-2">
                         <span class="min-w-0 flex-1 truncate text-sm font-medium text-slate-800 dark:text-white">{{ row.title }}</span>
                     </div>
-                    <div class="mt-0.5 truncate text-[11px] text-slate-400 flex items-center">
-                        <p>申请人：{{row.apply_name}}</p>
+                    <div class="mt-0.5 truncate text-[11px] text-slate-400 flex items-center gap-2">
+                        <p>申请人：{{row.applicant_name}}</p>
                         <p>{{row.apply_time?.slice(0, 10)}}</p>
                     </div>
                 </div>
@@ -312,9 +305,9 @@ onUnmounted(() => {
                         <div class="flex items-center gap-2">
                             <Icon icon="lets-icons:clock" class="size-16px" :style="{ color: themeStore.themeColor }" />
                             <p class="text-13px font-700 text-#64749a">各部门 / 人员审批时长</p>
-                            <p class="text-11px text-#94a3b8">近一年 · 平均耗时（天）</p>
+                            <p class="text-11px text-#94a3b8 mt-2px">近一年 · 平均耗时（天）</p>
                         </div>
-                        <NButton v-if="homeData?.my_changes_progress?.total > 0" ghost size="small" class="text-xs" @click="jumpTo('my_datachangecenter')">
+                        <NButton ghost size="small" class="text-xs" @click="jumpTo('my_datachangecenter')">
                         变更数据中心
                         <Icon icon="formkit:right" class="size-12px" />
                         </NButton>
@@ -324,42 +317,26 @@ onUnmounted(() => {
                             <div class="w-50%">
                                 <div class="mb-2 text-[11px] font-semibold text-slate-500">按部门（全流程平均）</div>
                                 <div class="space-y-3">
-                                    <div v-for="s in homeData?.unclosed_status?.items" :key="s.status" class="flex items-center">
-                                        <p class="text-slate-500 w-90px text-xs">{{ s.label }}</p>
+                                    <div v-for="s in homeData?.dept_efficiency?.items" :key="s.org_id" class="flex items-center">
+                                        <p class="text-slate-500 w-90px text-xs">{{ s.org_name }}</p>
                                         <div class="h-2.5 flex-1 overflow-hidden rounded-full bg-slate-100">
-                                            <!-- 审批中 -->
-                                            <div v-if="s.status === 'APPROVING'" class="h-full rounded-full" :style="{ width: `${openTotal ? (s.count / openTotal) * 100 : 0}%`, background: themeStore.otherColor.warning }"></div>
-                                            <!-- 已驳回 -->
-                                            <div v-if="s.status === 'REJECTED'" class="h-full rounded-full" :style="{ width: `${openTotal ? (s.count / openTotal) * 100 : 0}%`, background: themeStore.otherColor.error }"></div>
-                                            <!-- 已批准待投用 -->
-                                            <div v-if="s.status === 'APPROVED'" class="h-full rounded-full" :style="{ width: `${openTotal ? (s.count / openTotal) * 100 : 0}%`, background: themeStore.themeColor }"></div>
-                                            <!-- 待验收 -->
-                                            <div v-if="s.status === 'IMPLEMENTED'" class="h-full rounded-full" :style="{ width: `${openTotal ? (s.count / openTotal) * 100 : 0}%`, background: themeStore.otherColor.success }"></div>
-                                            <!-- 待关闭 -->
-                                            <div v-if="s.status === 'ACCEPTED'" class="h-full rounded-full" :style="{ width: `${openTotal ? (s.count / openTotal) * 100 : 0}%`, background: themeStore.otherColor.error }"></div>
+                                            <div v-if="s.avg_days > homeData?.person_efficiency?.slowest?.avg_days " class="h-full rounded-full" :style="{ width: `${(s.avg_days / s.total) * 100}%`, background: themeStore.otherColor.error }"></div>
+                                            <div v-else class="h-full rounded-full" :style="{ width: `${(s.avg_days / s.total) * 100}%`, background: themeStore.themeColor }"></div>
                                         </div>
-                                        <p class="w-45px font-semibold text-slate-600 text-xs text-right">{{ s.count }} 天</p>
+                                        <p class="w-45px font-semibold text-slate-600 text-xs text-right">{{ s.avg_days || 0 }} 天</p>
                                     </div>
                                 </div>
                             </div>
                             <div class="w-50%">
                                 <div class="mb-2 text-[11px] font-semibold text-slate-500">按人员（审批 / 会签环节平均）</div>
                                 <div class="space-y-3">
-                                    <div v-for="s in homeData?.unclosed_status?.items" :key="s.status" class="flex items-center">
-                                        <p class="text-slate-500 w-90px text-xs">{{ s.label }}</p>
+                                    <div v-for="s in homeData?.person_efficiency?.items" :key="s.user_id" class="flex items-center">
+                                        <p class="text-slate-500 w-90px text-xs">{{ s.user_name }}</p>
                                         <div class="h-2.5 flex-1 overflow-hidden rounded-full bg-slate-100">
-                                            <!-- 审批中 -->
-                                            <div v-if="s.status === 'APPROVING'" class="h-full rounded-full" :style="{ width: `${openTotal ? (s.count / openTotal) * 100 : 0}%`, background: themeStore.otherColor.warning }"></div>
-                                            <!-- 已驳回 -->
-                                            <div v-if="s.status === 'REJECTED'" class="h-full rounded-full" :style="{ width: `${openTotal ? (s.count / openTotal) * 100 : 0}%`, background: themeStore.otherColor.error }"></div>
-                                            <!-- 已批准待投用 -->
-                                            <div v-if="s.status === 'APPROVED'" class="h-full rounded-full" :style="{ width: `${openTotal ? (s.count / openTotal) * 100 : 0}%`, background: themeStore.themeColor }"></div>
-                                            <!-- 待验收 -->
-                                            <div v-if="s.status === 'IMPLEMENTED'" class="h-full rounded-full" :style="{ width: `${openTotal ? (s.count / openTotal) * 100 : 0}%`, background: themeStore.otherColor.success }"></div>
-                                            <!-- 待关闭 -->
-                                            <div v-if="s.status === 'ACCEPTED'" class="h-full rounded-full" :style="{ width: `${openTotal ? (s.count / openTotal) * 100 : 0}%`, background: themeStore.otherColor.error }"></div>
+                                            <div v-if="s.avg_days > homeData?.person_efficiency?.slowest?.avg_days " class="h-full rounded-full" :style="{ width: `${(s.avg_days / s.total) * 100}%`, background: themeStore.otherColor.error }"></div>
+                                            <div v-else class="h-full rounded-full" :style="{ width: `${(s.avg_days / s.total) * 100}%`, background: themeStore.themeColor }"></div>
                                         </div>
-                                        <p class="w-45px font-semibold text-slate-600 text-xs text-right">{{ s.count }} 天</p>
+                                        <p class="w-45px font-semibold text-slate-600 text-xs text-right">{{ s.avg_days || 0 }} 天</p>
                                     </div>
                                 </div>
                             </div>
@@ -370,7 +347,7 @@ onUnmounted(() => {
                             '--warning-bg': getColorWithOpacity(themeStore.otherColor.warning, 0.1),
                             '--warning-color': themeStore.otherColor.warning,
                         }"
-                        >专业会签环节平均 2.2 天，为全流程最慢环节，建议优化会签并行机制</div>
+                        >专业会签环节平均 {{homeData?.person_efficiency?.slowest?.avg_days || 0}} 天，为全流程最慢环节，建议优化会签并行机制</div>
                     </div>
                 </NCard>
             </NGi>
@@ -386,9 +363,9 @@ onUnmounted(() => {
             <p class="text-11px text-#94a3b8">已升级上报 · 催办由属地车间主任执行</p>
         </div>
         <div class="flex flex-col gap-3">
-            <template v-if="homeData?.rejected_todo?.total > 0">
+            <template v-if="homeData?.overdue_unclosed?.total > 0">
             <div 
-                v-for="r in homeData?.rejected_todo?.items?.slice(0, 1)" 
+                v-for="r in homeData?.overdue_unclosed?.items" 
                 :key="r.id" 
                 class="border border-red-100 bg-red-50/50 px-3.5 py-2.5"
                 :style="{ 
@@ -396,15 +373,22 @@ onUnmounted(() => {
                 }"
             >
                 <div class="flex items-center gap-2">
-                    <NTag type="error" size="small" class="text-11px">待关闭</NTag>
-                    <NTag type="error" size="small" class="text-11px">超期4天</NTag>
+                    <!-- 状态标签 -->
+                    <NTag v-if="r.status==='APPROVING'" size="small" type="warning">审批中</NTag>
+                    <NTag v-if="r.status==='APPROVED'" size="small" type="success">已通过</NTag>
+                    <NTag v-if="r.status==='IMPLEMENTED'" size="small" type="success">待验收</NTag>
+                    <NTag v-if="r.status==='ACCEPTED'" size="small" type="error">待关闭</NTag>
+                    <NTag v-if="r.status==='CLOSED'" size="small" type="success">已关闭</NTag>
+                    <NTag v-if="r.status==='WITHDRAWN'" size="small" type="error">已撤回</NTag>
+                    <NTag v-if="r.status==='REJECTED'" size="small" type="error">已驳回</NTag>
+                    <NTag type="error" size="small" class="text-11px">超期{{r.overdue_days || 0}}天</NTag>
                     <NButton ghost size="tiny" class="text-xs ml-auto" @click="jumpTo('details_index',r.change_id)">打开变更单</NButton>
                 </div>
                 <p class="mt-0.5 text-sm font-medium text-slate-800">{{ r.title }}</p>
                 <div class="mt-0.5 text-[11px] text-slate-400 flex items-center gap-2">
                     <span>{{ r.change_no }}</span>
-                    <span>一车间</span>
-                    <span>张工艺</span>
+                    <span>{{r.org_name}}</span>
+                    <span>{{r.applicant_name}}</span>
                 </div>
             </div>
             </template>
@@ -432,21 +416,21 @@ onUnmounted(() => {
                     <div class="flex items-center gap-2 text-xs">
                         <span class="h-2 w-2 rounded-full" :style="{ background: themeStore.otherColor.success }"></span>
                         <span class="font-medium text-slate-700">正常（到期 > {{remindDays}} 天）</span>
-                        <span class="ml-auto font-semibold text-slate-600">{{homeData?.dept_stats?.unclosed_total || 0}} 项</span>
+                        <span class="ml-auto font-semibold text-slate-600">{{getNormalNearOverdue('normal')}} 项</span>
                     </div>
                 </div>
                 <div class="rounded-lg border px-3 py-2">
                     <div class="flex items-center gap-2 text-xs">
                         <span class="h-2 w-2 rounded-full" :style="{ background: themeStore.otherColor.warning }"></span>
                         <span class="font-medium text-slate-700">临期（到期 ≤ {{remindDays}} 天）</span>
-                        <span class="ml-auto font-semibold text-slate-600">{{homeData?.dept_stats?.near_overdue_total || 0}} 项</span>
+                        <span class="ml-auto font-semibold text-slate-600">{{getNormalNearOverdue('near')}} 项</span>
                     </div>
                 </div>
                 <div class="rounded-lg border px-3 py-2">
                     <div class="flex items-center gap-2 text-xs">
                     <span class="h-2 w-2 rounded-full" :style="{ background: themeStore.otherColor.error }"></span>
                     <span class="font-medium text-slate-700">已超期</span>
-                    <span class="ml-auto font-semibold text-slate-600">{{homeData?.dept_stats?.overdue_total || 0}} 项</span>
+                    <span class="ml-auto font-semibold text-slate-600">{{getNormalNearOverdue('overdue')}} 项</span>
                     </div>
                 </div>
             </div>