安全工程师首页完成

src/views/home/modules/template4.vue

@@ -23,12 +23,6 @@ let timer: any = null;
 // 首页数据
 const homeData = ref<any>(null);
 
-const highRisk = [
-  { title: "聚合反应温度控制上限调整", why: "涉及工艺安全边界，建议参与 HAZOP 分析" },
-  { title: "R-101 搅拌提速至 180rpm", why: "搅拌轴强度与密封形式需校核" },
-];
-
-
 // 跳转变更申请页面、变更台账、我的任务、发起变更
 const jumpTo = (key: string,qid:number = 0) => {
   if(key==='my_initiatechange' && qid){
@@ -75,7 +69,6 @@ const getData = async () => {
   loading.value = true;
   const {data,error} = await homeProfessionalApi();
   if(!error){
-    console.log(data)
     homeData.value = data;
   }
   loading.value = false;
@@ -377,7 +370,7 @@ onUnmounted(() => {
                     <NProgress
                         type="line"
                         status="info"
-                        :percentage="((homeData?.sign_stats?.avg_audit_days || 0) / 3) * 100"
+                        :percentage="((homeData?.sign_stats?.avg_audit_days || 0) / 2) * 100"
                         :height="10"
                         border-radius="6px"
                     >
@@ -389,7 +382,7 @@ onUnmounted(() => {
                     <NProgress
                         type="line"
                         status="error"
-                        :percentage="((homeData?.sign_stats?.max_audit_days || 0) / 3) * 100"
+                        :percentage="((homeData?.sign_stats?.max_audit_days || 0) / 2) * 100"
                         :height="10"
                         border-radius="6px"
                     >

src/views/home/modules/template6.vue

@@ -28,30 +28,14 @@ let timer: any = null;
 // 首页数据
 const homeData = ref<any>(null);
 
-const highRisk = [
+// 跳转页面
-  { title: "聚合反应温度控制上限调整", why: "涉及工艺安全边界，建议参与 HAZOP 分析" },
-  { title: "R-101 搅拌提速至 180rpm", why: "搅拌轴强度与密封形式需校核" },
-];
-const LEVEL_UPGRADES = [
-  { id: "MOC-2026-R01-0036", title: "聚合反应温度控制上限调整", change: "一般 → 重要", reason: "涉及聚合工艺温度安全边界", date: "2026-07-26" },
-  { id: "MOC-2026-R02-0027", title: "冷冻机组载冷剂更换", change: "一般 → 重要", reason: "与检修交叉作业，风险叠加", date: "2026-07-10" },
-];
-
-
-// 跳转变更申请页面、变更台账、我的任务、发起变更
 const jumpTo = (key: string,qid:number = 0) => {
-  if(key==='my_initiatechange' && qid){
+  if(key==='details_approval' && qid){
-    routerPushByKey(key,{ query: { id: qid.toString() } });
-  }else if(key==='details_closedoc' && qid){
     routerPushByKey(key,{ query: { id: qid.toString(),key:'home' } });
   }else{
     routerPushByKey(key as any);
   }
 }
-// 打开审批详情
-const openDetail = (row: any) => {
-  routerPushByKey("details_approval",{ query: { id: row?.change_id?.toString(),key:'home' } });
-};
 
 // 获取当前时间字符串
 const getCurrentTimeStr = () => {
@@ -98,7 +82,6 @@ const getData = async () => {
   loading.value = true;
   const {data,error} = await homeSafeApi();
   if(!error){
-    console.log(data)
     homeData.value = data;  
   }
   loading.value = false;
@@ -163,10 +146,10 @@ onUnmounted(() => {
         </NGi>
         <NGi span="24 s:24 m:14" class="flex items-center justify-end gap-12px">
             <p class="text-#999 text-xs">{{clock}}</p>
-            <NButton ghost size="small" @click="jumpTo('changeledger')">
+            <NButton ghost size="small" @click="jumpTo('my_pssr')">
                 投用与验收总览
             </NButton>
-            <NButton ghost size="small" @click="jumpTo('changeledger')">
+            <NButton ghost size="small" @click="jumpTo('my_highrisk')">
                 全厂风险看板
             </NButton>
             <NButton type="primary" size="small" @click="jumpTo('my_mytask')">
@@ -187,14 +170,15 @@ onUnmounted(() => {
             <div class="flex justify-between">
                 <CountTo
                 :start-value="0"
-                :end-value="homeData?.dept_stats?.reject_count || 0"
+                :end-value="homeData?.todo_sign?.total || 0"
                 class="text-26px font-600"
-                :style="{ color: themeStore.themeColor }"
+                :style="{ color: homeData?.todo_sign?.overdue_count > 0?themeStore.otherColor.error:themeStore.themeColor }"
                 />
             </div>
             <div>
                 <p class="text-12px font-600">待我审批</p>
-                <p class="text-12px text-slate-400">安全审查节点 · 与我的任务同源</p>
+                <p v-if="homeData?.todo_sign?.overdue_count > 0" class="text-12px" :style="{ color: themeStore.otherColor.error }">其中超期 {{homeData?.todo_sign?.overdue_count}} 项 · 请优先处理</p>
+                <p v-else class="text-12px text-slate-400">安全审查节点 · 与我的任务同源</p>
             </div>
         </div>
     </NGi>
@@ -202,12 +186,12 @@ onUnmounted(() => {
         <div 
         class="flex-1 bg-[#fff] px-16px py-12px cursor-pointer flex items-center gap-3"
         :style="{ borderRadius: themeStore.themeRadius + 'px' }"
-            @click="jumpTo('my_mytask')"
+            @click="jumpTo('my_pssr')"
         >
             <div class="flex justify-between">
                 <CountTo
                 :start-value="0"
-                :end-value="homeData?.dept_stats?.reject_count || 0"
+                :end-value="homeData?.pssr_supervise?.total || 0"
                 class="text-26px font-600"
                 :style="{ color: themeStore.themeColor }"
                 />
@@ -222,12 +206,12 @@ onUnmounted(() => {
         <div 
         class="flex-1 bg-[#fff] px-16px py-12px cursor-pointer flex items-center gap-3"
         :style="{ borderRadius: themeStore.themeRadius + 'px' }"
-            @click="jumpTo('my_mytask')"
+            @click="jumpTo('my_highrisk')"
         >
             <div class="flex justify-between">
                 <CountTo
                 :start-value="0"
-                :end-value="homeData?.dept_stats?.reject_count || 0"
+                :end-value="homeData?.high_risk?.total || 0"
                 class="text-26px font-600"
                 :style="{ color: themeStore.otherColor.error }"
                 />
@@ -242,19 +226,20 @@ onUnmounted(() => {
         <div 
         class="flex-1 bg-[#fff] px-16px py-12px cursor-pointer flex items-center gap-3"
         :style="{ borderRadius: themeStore.themeRadius + 'px' }"
-            @click="jumpTo('my_mytask')"
+            @click="jumpTo('changeledger')"
         >
             <div class="flex justify-between">
                 <CountTo
                 :start-value="0"
-                :end-value="homeData?.dept_stats?.reject_count || 0"
+                :end-value="homeData?.temp_expiry_scope?.total || 0"
                 class="text-26px font-600"
-                :style="{ color: themeStore.otherColor.error }"
+                :style="{ color: homeData?.temp_expiry_scope?.overdue_count > 0?themeStore.otherColor.error:themeStore.themeColor }"
                 />
             </div>
             <div>
                 <p class="text-12px font-600">临时变更到期</p>
-                <p class="text-12px" :style="{ color: themeStore.otherColor.error }">含超期 1 起 · 红色预警</p>
+                <p v-if="homeData?.temp_expiry_scope?.overdue_count > 0" class="text-12px" :style="{ color: themeStore.otherColor.error }">含超期 {{homeData?.temp_expiry_scope?.overdue_count}} 项 · 红色预警</p>
+                <p v-else class="text-12px text-slate-400">无超期</p>
             </div>
         </div>
     </NGi>
@@ -271,14 +256,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_sign?.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">
+            <template v-if="homeData?.todo_sign?.total > 0">
-            <div v-for="row in homeData?.my_changes_progress?.items?.slice(0, 3) || []" :key="row.change_id" @click="openDetail(row)"
+            <div v-for="row in homeData?.todo_sign?.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',
@@ -288,7 +273,7 @@ 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>
+                    <span class="text-[11px] text-slate-400">{{ row.change_no }}</span>
                     <NTag class="text-[11px]" v-if="row.urgent===1" type="error" size="small">紧急</NTag>
                     <!-- 变更等级 -->
                     <NTag 
@@ -311,25 +296,18 @@ onUnmounted(() => {
 
                     <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 class="text-xs" :style="{ color: themeStore.otherColor.error }">已超期 3 天</span>
+                    <span v-if="row.overdue_status===2" class="text-xs" :style="{ color: themeStore.otherColor.error }">已超期 {{row.overdue_days || 0}} 天</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>
-                    <!-- 状态标签 -->
+                    <NTag v-if="row.step_name" size="small" type="warning">审批：{{row.step_name}}</NTag>
-                    <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>
                     <NButton size="small" type="primary" class="text-xs">
                         去审批
                         <Icon icon="akar-icons:arrow-right" class="size-13px ml-1" />
                     </NButton>
                 </div>
                 <div class="mt-0.5 truncate text-[11px] text-slate-400 flex items-center gap-2">
-                    <p>申请人：{{row.step_name}}</p>
+                    <p>申请人：{{row.applicant_name}}</p>
                     <span v-if="row.apply_time" class="text-[11px] text-slate-400">{{ row.apply_time?.slice(0, 10) }}</span>
                 </div>
                 </div>
@@ -345,42 +323,44 @@ onUnmounted(() => {
         </NCard>
 
         <NGrid :x-gap="16" :y-gap="16" responsive="screen" item-responsive class="mt-[16px]">
-            <!-- 最近已会签 -->
+            <!-- 通过审批的变更（未关闭） -->
             <NGi span="24 s:24 m:24 l:24">
                 <NCard :bordered="false" size="small" :style="{ borderRadius: themeStore.themeRadius + 'px' }">
                     <div class="flex items-center mb-3 gap-2">
                         <Icon icon="lucide:list-checks" class="size-16px" :style="{ color: themeStore.themeColor }" />
                         <p class="text-13px font-700 text-#64749a">通过审批的变更（未关闭）</p>
                         <p class="text-11px text-#94a3b8 mt-2px">PSSR 材料同行显示 · 查看 / 下载</p>
-                        <NButton ghost size="small" class="text-xs ml-auto" @click="jumpTo('my_mytask')">
+                        <NButton ghost size="small" class="text-xs ml-auto" @click="jumpTo('my_pssr')">
                             进入管理
                             <Icon icon="formkit:right" class="size-12px" />
                         </NButton>
                     </div>
-                    <div class="flex flex-col gap-3">
+                    <div v-if="homeData?.pssr_supervise?.total>0" class="flex flex-col gap-3">
-                        <div class="rounded-md border px-3 py-2 flex items-center justify-between gap-2 cursor-pointer">
+                        <div v-for="item in homeData?.pssr_supervise?.items" :key="item.id" class="rounded-md border px-3 py-2 flex items-center justify-between gap-2">
                             <div>
-                                <p class="min-w-0 flex-1 truncate text-sm font-medium text-slate-800 dark:text-white">R-102 安全阀校验周期调整</p>
+                                <p class="min-w-0 flex-1 truncate text-sm font-medium text-slate-800 dark:text-white">{{item.title}}</p>
-                                <p class="font-mono text-[11px] text-slate-400">
+                                <p class="mt-0.5 text-[11px] text-slate-400 flex items-center gap-2">
-                                    <span class="mt-0.5 block text-[11px] text-slate-400">MOC-2026-R02-0038 · 一车间 · 李四</span>
+                                    <span>{{item.change_no}}</span>
+                                    <span>{{item.org_name}}</span>
+                                    <span>{{item.applicant_name}}</span>
                                 </p>
                             </div>
                             <div class="flex items-center gap-1.5 rounded-md border bg-slate-50/60 px-2 py-1">
                                 <Icon icon="akar-icons:file" class="size-14px" :style="{ color: themeStore.themeColor }" />
-                                <span class="text-[11px] font-medium text-slate-600">PSSR 检查确认表</span>
+                                <span class="text-[11px] font-medium text-slate-600">PSSR 确认表</span>
-                                <!-- <template v-if="s.pssr_attachment"> -->
+                                <template v-if="item.pssr_attachment">
-                                    <span class="max-w-[150px] truncate text-[11px] text-slate-400">pssr检查确认表</span>
+                                    <span class="max-w-[150px] truncate text-[11px] text-slate-400">{{ item.pssr_attachment?.file_name }}</span>
-                                    <NButton ghost size="tiny" class="text-11px" @click="viewFile({})">查看</NButton>
+                                    <NButton ghost size="tiny" class="text-11px" @click="viewFile(item.pssr_attachment)">查看</NButton>
-                                    <NButton ghost size="tiny" class="text-11px" @click="downloadFile({})">下载</NButton>
+                                    <NButton ghost size="tiny" class="text-11px" @click="downloadFile(item.pssr_attachment)">下载</NButton>
-                                <!-- </template> -->
+                                </template>
-                                <!-- <template v-else>
+                                <template v-else>
-                                    <span class="text-[11px] text-[var(--warning-color)]">待传</span>
+                                    <span class="text-[11px]" :style="{ color: themeStore.otherColor.warning }">待传</span>
-                                    <NButton ghost size="tiny" class="text-11px" @click="downloadTemplate(s)">下载模板</NButton>
+                                    <NButton ghost size="tiny" class="text-11px" @click="downloadTemplate(item)">下载模板</NButton>
-                                </template> -->
+                                </template>
                             </div>
                         </div>
                     </div>
-                    <!-- <p class="text-xs text-slate-400 text-center">暂无数据</p> -->
+                    <p v-else class="text-xs text-slate-400 text-center">暂无数据</p>
                 </NCard>
             </NGi>
         </NGrid>
@@ -394,17 +374,24 @@ onUnmounted(() => {
             <p class="text-13px font-700 text-#64749a">高风险变更跟踪</p>
             <p class="text-11px text-#94a3b8">重要等级 · 未关闭 · 实时推导</p>
         </div>
-        <template v-if="highRisk.length">
+        <template v-if="homeData?.high_risk?.total > 0">
             <div class="space-y-2.5">
-                <div v-for="c in highRisk" :key="c.title" class="rounded-lg border border-red-200 bg-red-50/50 px-3.5 py-2.5">
+                <div v-for="c in homeData?.high_risk?.items || []" :key="c.record_id" class="rounded-lg border border-red-200 bg-red-50/50 px-3.5 py-2.5">
                     <div class="flex items-center gap-2">
-                    <span class="min-w-0 flex-1 truncate text-sm font-medium text-slate-800">{{ c.title }}</span>
+                    <span class="min-w-0 flex-1 truncate text-sm font-medium text-slate-800">{{ c.change_title }}</span>
-                    <NButton size="tiny" ghost type="error" class="text-xs">查看分析</NButton>
+                    <NButton size="tiny" ghost type="error" class="text-xs" @click="jumpTo('my_highrisk')">查看分析</NButton>
                     </div>
                     <div class="mt-1 text-[11px] flex items-center gap-2" :style="{ color: themeStore.otherColor.error }">
-                        <span>MOC-2026-R01-0035</span>
+                        <span>{{ c.change_no }}</span>
-                        <span>审批中</span>
+                        <!-- 状态 -->
-                        <span>一车间</span>
+                        <span v-if="c.status==='APPROVING'">审批中</span>
+                        <span v-if="c.status==='APPROVED'">已通过</span>
+                        <span v-if="c.status==='IMPLEMENTED'">待验收</span>
+                        <span v-if="c.status==='ACCEPTED'">待关闭</span>
+                        <span v-if="c.status==='CLOSED'">已关闭</span>
+                        <span v-if="c.status==='WITHDRAWN'">已撤回</span>
+                        <span v-if="c.status==='REJECTED'">已驳回</span>
+                        <span>{{c.org_name}}</span>
                     </div>
                 </div>
             </div>
@@ -413,24 +400,6 @@ onUnmounted(() => {
             <p class="text-xs text-slate-400 text-center">暂无数据</p>
         </template>
         </NCard>
-        <!-- 等级调整记录 -->
-        <NCard :bordered="false" size="small" :style="{ borderRadius: themeStore.themeRadius + 'px',marginTop:'16px' }">
-            <div class="flex items-center mb-3 gap-2">
-                <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="space-y-3">
-                <div v-for="u in LEVEL_UPGRADES" :key="u.id" class="rounded-md border px-4 py-3">
-                    <div class="flex items-center gap-2">
-                        <NTag size="small" type="error" class="text-xs">{{ u.change }}</NTag>
-                        <span class="ml-auto text-[11px] text-slate-400">{{ u.date }}</span>
-                    </div>
-                    <div class="mt-1 text-sm font-medium text-slate-800">{{ u.title }}</div>
-                    <div class="mt-0.5 text-[11px] text-slate-400">{{ u.reason }} · {{ u.id }}</div>
-                </div>
-            </div>
-        </NCard>
     </NGi>
     </NGrid>
 </div>