bestlee/moc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

分管领导首页

Browse Source
This commit is contained in:
bestlee
2026-09-28 13:43:16 +08:00
parent c31924a8d8
commit 4e7b217588
2 changed files with 263 additions and 249 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/home/modules/template3.vue
+21 -21
View File
@@ -314,31 +314,31 @@ onUnmounted(() => {
</div>
<div class="flex flex-col gap-3">
<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.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>
</div>
<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>
</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>
<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>
</div>
</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>
<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>
</div>
</div>
<div class="text-[11px] text-slate-400">提醒规则：到期前 {{remindDays}} 天触发（可在「我的任务 · 我的申请」中调整）· 临期 / 超期项请按期办理延期、恢复或转永久</div>
<NButton dashed type="primary" size="small" class="text-xs" @click="jumpTo('my_mytask')">
前往「我的任务」办理延期 / 恢复 / 转永久 →
</NButton>
</div>
</div>
<div class="text-[11px] text-slate-400">提醒规则：到期前 {{remindDays}} 天触发（可在「我的任务 · 我的申请」中调整）· 临期 / 超期项请按期办理延期、恢复或转永久</div>
<NButton dashed type="primary" size="small" class="text-xs" @click="jumpTo('my_mytask')">
前往「我的任务」办理延期 / 恢复 / 转永久 →
</NButton>
</div>
</NCard>
</NGi>
<!-- 尚未关闭的变更所处状态 -->
src/views/home/modules/template8.vue
+242 -228
View File
@@ -38,6 +38,8 @@ const jumpTo = (key: string,qid:number = 0) => {
routerPushByKey(key,{ query: { id: qid.toString() } });
}else if(key==='details_closedoc' && qid){
routerPushByKey(key,{ query: { id: qid.toString(),key:'home' } });
}else if(key==='details_index' && qid){
routerPushByKey(key,{ query: { id: qid.toString(),key:'home' } });
}else{
routerPushByKey(key as any);
}
@@ -130,7 +132,7 @@ onUnmounted(() => {
<div class="space-y-3.5">
<NCard :bordered="false" size="small" :style="{ borderRadius: themeStore.themeRadius + 'px' }">
<NGrid :x-gap="16" :y-gap="16" responsive="screen" item-responsive>
<NGi span="24 s:24 m:16">
<NGi span="24 s:24 m:8">
<div class="flex-y-center">
<p
class="py-1.5 px-1.5 flex items-center justify-center bg-[rgb(var(--primary-color))] text-white text-xs font-bold"
@@ -141,100 +143,120 @@ onUnmounted(() => {
<p class="pl-12px text-14px font-semibold">我的工作台</p>
</div>
</NGi>
<NGi span="24 s:24 m:8" class="flex items-center justify-end gap-12px">
<NGi span="24 s:24 m:16" class="flex items-center justify-end gap-12px">
<p class="text-#999 text-xs">{{clock}}</p>
<NButton type="primary" size="small" @click="jumpTo('my_initiatechange')">
<Icon icon="ic:round-plus" class="size-18px" />
发起变更
<NButton ghost size="small" @click="jumpTo('my_mytask')">
全厂变更看板
</NButton>
<NButton type="primary" size="small" @click="jumpTo('my_mytask')">
<Icon icon="lucide:clipboard-check" class="size-14px" />
重要变更审批
</NButton>
</NGi>
</NGrid>
</NCard>
<!-- 卡片数据 -->
<NGrid cols="s:1 m:2 l:4" responsive="screen" :x-gap="16" :y-gap="16">
<NGi>
<div
class="flex-1 bg-[#fff2f0] px-16px py-12px text-[#e15555] cursor-pointer"
:style="{ borderRadius: themeStore.themeRadius + 'px' }"
@click="jumpTo('my_mytask')"
>
<p class="text-12px font-600">待修改驳回</p>
<div class="flex justify-between">
<CountTo
:start-value="0"
:end-value="homeData?.dept_stats?.reject_count || 0"
class="text-26px font-600"
/>
</div>
<p class="text-12px">修改后重新提交</p>
</div>
</NGi>
<NGi>
<div
class="flex-1 bg-white px-16px py-12px text-[#94a3b8] cursor-pointer"
:style="{ borderRadius: themeStore.themeRadius + 'px' }"
@click="jumpTo('my_mytask')"
>
<p class="text-12px font-600">待上传资料</p>
<div class="flex justify-between">
<CountTo
:start-value="0"
:end-value="homeData?.archive_todo?.total || 0"
class="text-26px font-600 text-[#333]"
/>
</div>
<p class="text-12px">培训 / PSSR / 验收材料补交</p>
</div>
</NGi>
<NGi>
<div
class="flex-1 bg-white px-16px py-12px text-[#94a3b8] cursor-pointer"
:style="{ borderRadius: themeStore.themeRadius + 'px' }"
@click="jumpTo('my_mytask')"
>
<p class="text-12px font-600">临时变更到期</p>
<div class="flex justify-between">
<CountTo
:start-value="0"
:end-value="homeData?.dept_stats?.near_overdue_total || 0"
class="text-26px font-600 text-[#333]"
/>
</div>
<p class="text-12px">到期 ≤ {{remindDays}} 天 · 及时处置</p>
</div>
</NGi>
<NGi>
<div
class="flex-1 bg-[#fff2f0] px-16px py-12px text-[#e15555] cursor-pointer"
:style="{ borderRadius: themeStore.themeRadius + 'px' }"
@click="jumpTo('my_mytask')"
>
<p class="text-12px font-600">超期未处置</p>
<div class="flex justify-between">
<CountTo
:start-value="0"
:end-value="homeData?.dept_stats?.overdue_total || 0"
class="text-26px font-600"
/>
</div>
<p class="text-12px">超期临时变更 · 需恢复 / 延期 / 转永久</p>
</div>
</NGi>
<NGrid cols="s:1 m:2 l:4" responsive="screen" :x-gap="16" :y-gap="16"
:style="{
'--theme-color': themeStore.themeColor,
'--theme-bg': getColorWithOpacity(themeStore.themeColor, 0.2),
'--warning-bg': getColorWithOpacity(themeStore.otherColor.warning, 0.2),
'--warning-color': themeStore.otherColor.warning,
'--success-color': themeStore.otherColor.success,
'--success-bg': getColorWithOpacity(themeStore.otherColor.success, 0.2),
'--error-color': themeStore.otherColor.error,
'--error-bg': getColorWithOpacity(themeStore.otherColor.error, 0.2),
}"
>
<NGi>
<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' }"
>
<span class="shrink-0 rounded-lg p-2.5 bg-[var(--theme-bg)]">
<Icon icon="lucide:clipboard-check" class="size-24px text-[--theme-color]" />
</span>
<div class="flex flex-col">
<CountTo
:start-value="0"
:end-value="126"
class="text-26px font-600"
/>
<p class="text-[11px] font-semibold text-slate-400">待我终批 · 均为重要变更</p>
</div>
</div>
</NGi>
<NGi>
<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' }"
>
<span class="shrink-0 rounded-lg p-2.5 bg-[var(--success-bg)]">
<Icon icon="akar-icons:file" class="size-24px text-[--success-color]" />
</span>
<div class="flex flex-col">
<CountTo
:start-value="0"
:end-value="86.4"
class="text-26px font-600"
/>
<p class="text-[11px] font-semibold text-slate-400">当前未关闭变更 · 审批中 14 · 实施中 9 · 待关闭 81</p>
</div>
</div>
</NGi>
<NGi>
<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' }"
>
<span class="shrink-0 rounded-lg p-2.5 bg-[var(--warning-bg)]">
<Icon icon="lets-icons:clock" class="size-24px text-[--warning-color]" />
</span>
<div class="flex flex-col">
<CountTo
:start-value="0"
:end-value="18"
class="text-26px font-600 text-[var(--warning-color)]"
/>
<p class="text-[11px] font-semibold text-slate-400">临时变更临期或到期 · 临期 1 · 已超期 1 · 需落实恢复 / 延期 / 转永久</p>
</div>
</div>
</NGi>
<NGi>
<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' }"
>
<span class="shrink-0 rounded-lg p-2.5 bg-[var(--error-bg)]">
<Icon icon="proicons:alert-triangle" class="size-24px text-[--error-color]" />
</span>
<div class="flex flex-col">
<div class="flex items-center">
<CountTo
:start-value="0"
:end-value="4"
class="text-26px font-600 text-[var(--error-color)]"
/>
</div>
<p class="text-[11px] font-semibold text-slate-400">超期未关闭 · 已升级上报 · 明细见右侧清单</p>
</div>
</div>
</NGi>
</NGrid>
<NGrid :x-gap="16" :y-gap="16" responsive="screen" item-responsive>
<!-- 左侧 -->
<NGi span="24 s:24 m:24 l:16">
<!-- 我的变更进度 -->
<!-- 重要变更审批 -->
<NCard :bordered="false" size="small" :style="{ borderRadius: themeStore.themeRadius + 'px' }">
<div class="flex items-center justify-between mb-3">
<div class="flex items-center gap-2">
<Icon icon="akar-icons:file" class="size-16px" :style="{ color: themeStore.themeColor }" />
<p class="text-13px font-700 text-#64749a">我的变更进度</p>
<p class="text-11px text-#94a3b8 mt-2px">阶段进度与台账实时联动</p>
<Icon icon="lucide:clipboard-check" class="size-16px" :style="{ color: themeStore.themeColor }" />
<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('changeledger')">
全部台账
<NButton v-if="homeData?.my_changes_progress?.total > 0" ghost size="small" class="text-xs" @click="jumpTo('my_mytask')">
我的任务
<Icon icon="formkit:right" class="size-12px" />
</NButton>
</div>
@@ -249,53 +271,32 @@ onUnmounted(() => {
}"
>
<div class="min-w-0 flex-1">
<div class="flex flex-wrap items-center gap-2">
<span class="font-mono text-[11px] text-slate-400">{{ row.change_no }}</span>
<NTag class="text-[11px]" v-if="row.urgent===1" type="error" size="small">紧急</NTag>
<!-- 变更等级 -->
<NTag
size="small"
:color="{
color: tagBgColor(matchObj(levelList,row.change_level)?.color),
textColor: tagTextColor(matchObj(levelList,row.change_level)?.color),
borderColor: tagBorderColor(matchObj(levelList,row.change_level)?.color),
}"
>{{matchObj(levelList,row.change_level)?.label}}</NTag>
<!-- 变更类型 -->
<NTag
size="small"
:color="{
color: tagBgColor(matchObj(typeList,row.change_type)?.color),
textColor: tagTextColor(matchObj(typeList,row.change_type)?.color),
borderColor: tagBorderColor(matchObj(typeList,row.change_type)?.color),
}"
>{{matchObj(typeList,row.change_type)?.label}}</NTag>
<NTag class="text-[11px]" v-if="row.duration_type===2" type="warning" size="small">临时</NTag>
<NTag class="text-[11px]" v-else type="info" size="small">永久</NTag>
<span v-if="row.apply_time" class="ml-auto text-[11px] text-slate-400">申请时间 {{ row.apply_time?.slice(0, 10) }}</span>
</div>
<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>
<span class="shrink-0 text-[11px] text-slate-400">当前状态</span>
<!-- 状态标签 -->
<NTag v-if="row.status==='APPROVING'" size="small" type="warning">审批中</NTag>
<NTag v-if="row.status==='APPROVED'" size="small" type="success">已通过</NTag>
<NTag v-if="row.status==='IMPLEMENTED'" size="small" type="success">待验收</NTag>
<NTag v-if="row.status==='ACCEPTED'" size="small" type="error">待关闭</NTag>
<NTag v-if="row.status==='CLOSED'" size="small" type="success">已关闭</NTag>
<NTag v-if="row.status==='WITHDRAWN'" size="small" type="error">已撤回</NTag>
<NTag v-if="row.status==='REJECTED'" size="small" type="error">已驳回</NTag>
</div>
<div class="mt-0.5 truncate text-[11px] text-slate-400">
<p v-if="row.status === 'CLOSED'">阶段全部完成，流程闭环已归档</p>
<p v-else>当前节点：{{row.step_name}}</p>
</div>
<div class="flex flex-wrap items-center gap-2">
<span class="font-mono text-[11px] text-slate-400">{{ row.change_no }}</span>
<!-- 变更等级 -->
<NTag
size="small"
:color="{
color: tagBgColor(matchObj(levelList,row.change_level)?.color),
textColor: tagTextColor(matchObj(levelList,row.change_level)?.color),
borderColor: tagBorderColor(matchObj(levelList,row.change_level)?.color),
}"
>{{matchObj(levelList,row.change_level)?.label}}</NTag>
<NTag class="text-[11px]" v-if="row.urgent===1" type="error" size="small">紧急</NTag>
</div>
<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>
<p>{{row.apply_time?.slice(0, 10)}}</p>
</div>
</div>
<NButton size="small" type="primary" class="text-xs">
去审批
<Icon icon="akar-icons:arrow-right" class="size-13px ml-1" />
</NButton>
</div>
<NButton dashed type="primary" size="small" class="text-xs" @click="jumpTo('changeledger')">
还有{{(homeData?.my_changes_progress?.total - 3) > 0 ? (homeData?.my_changes_progress?.total - 3) : 0}}条，前往台账查看全部 →
</NButton>
</template>
<template v-else>
<p class="text-xs text-slate-400 text-center">暂无数据</p>
@@ -304,87 +305,85 @@ onUnmounted(() => {
</NCard>
<NGrid :x-gap="16" :y-gap="16" responsive="screen" item-responsive class="mt-[16px]">
<!-- 临时变更到期提醒情况 -->
<NGi span="12 s:12 m:12 l:12">
<NCard :bordered="false" size="small" :style="{ borderRadius: themeStore.themeRadius + 'px' }">
<div class="flex items-center mb-3 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">共 {{tempTotal}} 项</p>
</div>
<div class="flex flex-col gap-3">
<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.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>
</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>
</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>
</div>
</div>
<div class="text-[11px] text-slate-400">提醒规则：到期前 {{remindDays}} 天触发（可在「我的任务 · 我的申请」中调整）· 临期 / 超期项请按期办理延期、恢复或转永久</div>
<NButton dashed type="primary" size="small" class="text-xs" @click="jumpTo('my_mytask')">
前往「我的任务」办理延期 / 恢复 / 转永久 →
</NButton>
</div>
</NCard>
</NGi>
<!-- 尚未关闭的变更所处状态 -->
<NGi span="12 s:12 m:12 l:12">
<NCard :bordered="false" size="small" :style="{ borderRadius: themeStore.themeRadius + 'px',height:'100%' }">
<div class="flex items-center mb-3 gap-2">
<Icon icon="akar-icons:file" class="size-16px" :style="{ color: themeStore.themeColor }" />
<p class="text-13px font-700 text-#64749a">尚未关闭的变更所处状态</p>
<p class="text-11px text-#94a3b8">共 {{openTotal}} 项</p>
</div>
<div class="flex flex-col gap-3">
<div v-for="s in homeData?.unclosed_status?.items" :key="s.status">
<div class="flex items-center gap-2 text-xs">
<span class="min-w-0 flex-1 text-slate-700">{{ s.label }}</span>
<span class="shrink-0 font-semibold text-slate-600">{{ s.count }} 项</span>
</div>
<div class="mt-1 h-1.5 w-full 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>
</div>
<div class="text-[11px] text-slate-400">阶段口径：审批中（含会签）→ 已批准待投用 → 待验收 → 待关闭 · 培训 / PSSR 线下签字后拍照上传，并入资料归档</div>
<NButton dashed type="primary" size="small" class="text-xs" @click="jumpTo('changeledger')">
明细见变更台账 →
</NButton>
</div>
</NCard>
</NGi>
<!-- 各部门 / 人员审批时长 -->
<NGi span="24 s:24 m:24 l:24">
<NCard :bordered="false" size="small" :style="{ borderRadius: themeStore.themeRadius + 'px',height:'100%' }">
<div class="flex items-center justify-between mb-3">
<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>
</div>
<NButton v-if="homeData?.my_changes_progress?.total > 0" ghost size="small" class="text-xs" @click="jumpTo('my_datachangecenter')">
变更数据中心
<Icon icon="formkit:right" class="size-12px" />
</NButton>
</div>
<div class="space-y-3">
<div class="flex justify-between gap-6">
<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 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>
<p class="w-45px font-semibold text-slate-600 text-xs text-right">{{ s.count }} 天</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 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>
<p class="w-45px font-semibold text-slate-600 text-xs text-right">{{ s.count }} 天</p>
</div>
</div>
</div>
</div>
<div
class="mt-3 rounded-lg bg-[var(--warning-bg)] px-3 py-2 text-[11px] text-[var(--warning-color)]"
:style="{
'--warning-bg': getColorWithOpacity(themeStore.otherColor.warning, 0.1),
'--warning-color': themeStore.otherColor.warning,
}"
>专业会签环节平均 2.2 天，为全流程最慢环节，建议优化会签并行机制</div>
</div>
</NCard>
</NGi>
</NGrid>
</NGi>
<!-- 右侧 -->
<NGi span="24 s:24 m:24 l:8">
<!-- 被驳回信息处理 -->
<!-- 超期未关闭变更 -->
<NCard :bordered="false" size="small" :style="{ borderRadius: themeStore.themeRadius + 'px' }">
<div class="flex items-center mb-3 gap-2">
<Icon icon="system-uicons:reset" class="size-16px" :style="{ color: themeStore.themeColor }" />
<p class="text-13px font-700 text-#64749a">被驳回信息处理</p>
<p class="text-11px text-#94a3b8">修改后可重新提交</p>
<Icon icon="proicons:alert-triangle" class="size-16px" :style="{ color: themeStore.themeColor }" />
<p class="text-13px font-700 text-#64749a">超期未关闭变更</p>
<p class="text-11px text-#94a3b8">已升级上报 · 催办由属地车间主任执行</p>
</div>
<div class="flex flex-col gap-3">
<template v-if="homeData?.rejected_todo?.total > 0">
@@ -397,45 +396,60 @@ onUnmounted(() => {
}"
>
<div class="flex items-center gap-2">
<NTag type="error" size="small" class="text-11px">已驳回</NTag>
<span class="font-mono text-[11px] text-slate-400">{{ r.change_no }}</span>
<span class="ml-auto text-[11px] text-slate-400">{{ r.rejected_at?.slice(0, 10) }}</span>
<NTag type="error" size="small" class="text-11px">待关闭</NTag>
<NTag type="error" size="small" class="text-11px">超期4天</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>
</div>
<div class="mt-0.5 text-sm font-medium text-slate-800">{{ r.title }}</div>
<div class="mt-0.5 text-[11px] leading-4 text-red-600/80">驳回原因：{{ r.reject_comment }}</div>
<div class="mt-0.5 text-[11px] text-slate-400">驳回人：{{r.reject_user_name}}</div>
<NButton ghost type="error" size="small" class="text-xs mt-1.5" @click="jumpTo('my_initiatechange',r.change_id)">修改重报 →</NButton>
</div>
<NButton dashed type="error" size="small" class="text-xs" @click="jumpTo('my_mytask')">
还有 {{ (homeData?.rejected_todo?.total - 1) > 0 ? (homeData?.rejected_todo?.total - 1) : 0 }} 条驳回，前往我的任务处理 →
</NButton>
</template>
<template v-else>
<p class="text-xs text-slate-400 text-center">暂无数据</p>
</template>
</div>
</NCard>
<!-- 资料归档待办 -->
<!-- 临时变更临期或到期 -->
<NCard :bordered="false" size="small" :style="{ borderRadius: themeStore.themeRadius + 'px',marginTop:'16px' }">
<div class="flex items-center mb-3 gap-2">
<Icon icon="quill:folder-open" class="size-16px" :style="{ color: themeStore.themeColor }" />
<p class="text-13px font-700 text-#64749a">资料归档待办</p>
<p class="text-11px text-#94a3b8">{{homeData?.archive_todo?.total || 0}} 项待补交</p>
</div>
<div class="flex flex-col gap-3">
<div v-for="d in homeData?.archive_todo?.items" :key="d.change_id" class="rounded-lg border border-[#ACC6E5] bg-[#EAF0F9]/40 px-3.5 py-2.5">
<div class="flex items-center gap-2">
<NTag type="warning" size="small" class="text-11px">待归档</NTag>
<span class="font-mono text-[11px] text-slate-400">{{ d.change_no }}</span>
<div class="flex items-center justify-between">
<div class="flex-1">
<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>
</div>
<p class="text-11px text-#94a3b8">到期前提醒 · 恢复 / 延期 / 转永久</p>
</div>
<NButton size="small" class="text-xs" @click="jumpTo('changeledger')">
变更台账<Icon icon="formkit:right" class="size-12px" />
</NButton>
</div>
<div class="mt-0.5 text-sm font-medium text-slate-800">{{ d.title }}</div>
<div class="mt-0.5 line-clamp-1 text-[11px] leading-4 text-slate-400">缺项：{{ d.missing_names }}</div>
<NButton type="primary" size="small" class="text-xs mt-1.5" @click="jumpTo('details_closedoc',d.change_id)">
去补交（资料关闭页上传）→
</NButton>
<div class="space-y-3 mt-3">
<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.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>
</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>
</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>
</div>
</div>
</div>
<div class="text-[11px] leading-4 text-slate-400">上传纸质扫描件 / 照片即视为完成确认并联动归档清单；支持传错删除重传、阶段性保存</div>
</div>
</NCard>
</NGi>
</NGrid>