From c6ebecda4ba83d195625003c12ac086fce0c0325 Mon Sep 17 00:00:00 2001
From: bestlee <bestlee@djxinxi.net>
Date: Thu, 24 Sep 2026 15:18:40 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=89=E5=85=A8=E5=B7=A5=E7=A8=8B=E5=B8=88?=
 =?UTF-8?q?=E9=A6=96=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/home/modules/template4.vue |   2 +-
 src/views/home/modules/template6.vue | 263 +++++++++++++++------------
 2 files changed, 147 insertions(+), 118 deletions(-)

diff --git a/src/views/home/modules/template4.vue b/src/views/home/modules/template4.vue
index 0635f74..46565bc 100644
--- a/src/views/home/modules/template4.vue
+++ b/src/views/home/modules/template4.vue
@@ -378,7 +378,7 @@ onUnmounted(() => {
                 <div v-for="h in highRisk" :key="h.title" class="rounded-md border border-amber-200 bg-amber-50/60 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">{{ h.title }}</span>
-                    <NButton size="small" type="warning" class="text-xs">查看分析</NButton>
+                    <NButton size="tiny" ghost type="warning" class="text-xs">查看分析</NButton>
                     </div>
                     <div class="mt-1 text-[11px]" :style="{ color: themeStore.otherColor.warning }">{{ h.why }}</div>
                 </div>
diff --git a/src/views/home/modules/template6.vue b/src/views/home/modules/template6.vue
index 0635f74..9a00e75 100644
--- a/src/views/home/modules/template6.vue
+++ b/src/views/home/modules/template6.vue
@@ -1,16 +1,21 @@
 <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 { getColorWithOpacity, tagTextColor, tagBgColor, tagBorderColor, downloadFileFun } from '@/utils/common';
 import { systemConfigApi } from "@/service/api/system";
 import { homeApi } from "@/service/api/statistics";
+import previewComponent from '@/components/previewFile/index.vue'
 
 const themeStore = useThemeStore();
 const { routerPushByKey } = useRouterPush();
 
 const loading = ref<boolean>(false);
+// 附件在线预览弹窗
+const previewModal = ref<boolean>(false);
+// 附件在线预览文件
+const previewFile = ref<any>(null);
 // 变更临期天数
 const remindDays = ref<number>(0);
 // 变更类型列表
@@ -27,6 +32,10 @@ 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" },
+];
 
 
 // 跳转变更申请页面、变更台账、我的任务、发起变更
@@ -64,6 +73,20 @@ const tick = () => {
   timer = setTimeout(tick, delay);
 }
 
+// 查看
+const viewFile = (file: any) => {
+    previewFile.value = file;
+    previewModal.value = true;
+};
+// 下载
+const downloadFile = (file: any) => {
+    downloadFileFun(file.file_url, file.file_name);
+};
+// 下载模板
+const downloadTemplate = (record: any) => {
+    window.$message?.info('还差接口')
+};
+
 // 匹配对象
 const matchObj = (list:any,val:number) => {
   const obj = list.find((item:any) => item.value == val);
@@ -127,7 +150,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:12">
+        <NGi span="24 s:24 m:10">
             <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"
@@ -138,10 +161,13 @@ onUnmounted(() => {
                 <p class="pl-12px text-14px font-semibold">我的工作台</p>
             </div>
         </NGi>
-        <NGi span="24 s:24 m:12" class="flex items-center justify-end gap-12px">
+        <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>
+            <NButton ghost size="small" @click="jumpTo('changeledger')">
+                全厂风险看板
             </NButton>
             <NButton type="primary" size="small" @click="jumpTo('my_mytask')">
                 <Icon icon="lucide:clipboard-check" class="size-14px" />
@@ -152,6 +178,46 @@ onUnmounted(() => {
     </NCard>
     <!-- 卡片数据 -->
     <NGrid cols="s:1 m:2 l:4" responsive="screen" :x-gap="16" :y-gap="16">
+    <NGi>
+        <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')"
+        >
+            <div class="flex justify-between">
+                <CountTo
+                :start-value="0"
+                :end-value="homeData?.dept_stats?.reject_count || 0"
+                class="text-26px font-600"
+                :style="{ color: themeStore.themeColor }"
+                />
+            </div>
+            <div>
+                <p class="text-12px font-600">待我审批</p>
+                <p class="text-12px text-slate-400">安全审查节点 · 与我的任务同源</p>
+            </div>
+        </div>
+    </NGi>
+    <NGi>
+        <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')"
+        >
+            <div class="flex justify-between">
+                <CountTo
+                :start-value="0"
+                :end-value="homeData?.dept_stats?.reject_count || 0"
+                class="text-26px font-600"
+                :style="{ color: themeStore.themeColor }"
+                />
+            </div>
+            <div>
+                <p class="text-12px font-600">PSSR监督</p>
+                <p class="text-12px text-slate-400">待PSSR / 待验收 · 按变更状态实时统计</p>
+            </div>
+        </div>
+    </NGi>
     <NGi>
         <div 
         class="flex-1 bg-[#fff] px-16px py-12px cursor-pointer flex items-center gap-3"
@@ -167,8 +233,8 @@ onUnmounted(() => {
                 />
             </div>
             <div>
-                <p class="text-12px font-600">待我会签</p>
-                <p class="text-12px" :style="{ color: themeStore.otherColor.error }">其中超期 1 项 · 请优先处理</p>
+                <p class="text-12px font-600">高风险在办</p>
+                <p class="text-12px" :style="{ color: themeStore.otherColor.error }">全厂 · 需重点跟踪</p>
             </div>
         </div>
     </NGi>
@@ -183,52 +249,12 @@ onUnmounted(() => {
                 :start-value="0"
                 :end-value="homeData?.dept_stats?.reject_count || 0"
                 class="text-26px font-600"
-                :style="{ color: themeStore.themeColor }"
+                :style="{ color: themeStore.otherColor.error }"
                 />
             </div>
             <div>
-                <p class="text-12px font-600">本月已会签</p>
-                <p class="text-12px text-slate-400">含驳回 1 起 · 系统自动采集</p>
-            </div>
-        </div>
-    </NGi>
-    <NGi>
-        <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')"
-        >
-            <div class="flex justify-between">
-                <CountTo
-                :start-value="0"
-                :end-value="homeData?.dept_stats?.reject_count || 0"
-                class="text-26px font-600"
-                :style="{ color: themeStore.themeColor }"
-                />
-            </div>
-            <div>
-                <p class="text-12px font-600">在办高风险</p>
-                <p class="text-12px text-slate-400">本专业相关 · 建议关注</p>
-            </div>
-        </div>
-    </NGi>
-    <NGi>
-        <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')"
-        >
-            <div class="flex justify-between">
-                <CountTo
-                :start-value="0"
-                :end-value="homeData?.dept_stats?.reject_count || 0"
-                class="text-26px font-600"
-                :style="{ color: themeStore.themeColor }"
-                />
-            </div>
-            <div>
-                <p class="text-12px font-600">参与风险分析</p>
-                <p class="text-12px text-slate-400">作为分析组成员（选择式）· 近一年</p>
+                <p class="text-12px font-600">临时变更到期</p>
+                <p class="text-12px" :style="{ color: themeStore.otherColor.error }">含超期 1 起 · 红色预警</p>
             </div>
         </div>
     </NGi>
@@ -237,13 +263,13 @@ onUnmounted(() => {
     <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="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>
+            <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')">
             我的任务
@@ -323,40 +349,35 @@ onUnmounted(() => {
             <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="ix:success" 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: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')">
+                            进入管理
+                            <Icon icon="formkit:right" class="size-12px" />
+                        </NButton>
                     </div>
                     <div 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>
                                 <p class="min-w-0 flex-1 truncate text-sm font-medium text-slate-800 dark:text-white">R-102 安全阀校验周期调整</p>
                                 <p class="font-mono text-[11px] text-slate-400">
-                                    <span>MOC-2026-R02-0037</span>
-                                    <span> · 07-30 10:24</span>
+                                    <span class="mt-0.5 block text-[11px] text-slate-400">MOC-2026-R02-0038 · 一车间 · 李四</span>
                                 </p>
                             </div>
-                            <NTag size="small" type="success" class="text-xs">同意</NTag>
-                        </div>
-                        <div class="rounded-md border px-3 py-2 flex items-center justify-between gap-2 cursor-pointer">
-                            <div>
-                                <p class="min-w-0 flex-1 truncate text-sm font-medium text-slate-800 dark:text-white">R-102 安全阀校验周期调整</p>
-                                <p class="font-mono text-[11px] text-slate-400">
-                                    <span>MOC-2026-R02-0037</span>
-                                    <span> · 07-30 10:24</span>
-                                </p>
+                            <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>
+                                <!-- <template v-if="s.pssr_attachment"> -->
+                                    <span class="max-w-[150px] truncate text-[11px] text-slate-400">pssr检查确认表</span>
+                                    <NButton ghost size="tiny" class="text-11px" @click="viewFile({})">查看</NButton>
+                                    <NButton ghost size="tiny" class="text-11px" @click="downloadFile({})">下载</NButton>
+                                <!-- </template> -->
+                                <!-- <template v-else>
+                                    <span class="text-[11px] text-[var(--warning-color)]">待传</span>
+                                    <NButton ghost size="tiny" class="text-11px" @click="downloadTemplate(s)">下载模板</NButton>
+                                </template> -->
                             </div>
-                            <NTag size="small" type="success" class="text-xs">同意</NTag>
-                        </div>
-                        <div class="rounded-md border px-3 py-2 flex items-center justify-between gap-2 cursor-pointer">
-                            <div>
-                                <p class="min-w-0 flex-1 truncate text-sm font-medium text-slate-800 dark:text-white">R-102 安全阀校验周期调整</p>
-                                <p class="font-mono text-[11px] text-slate-400">
-                                    <span>MOC-2026-R02-0037</span>
-                                    <span> · 07-30 10:24</span>
-                                </p>
-                            </div>
-                            <NTag size="small" type="success" class="text-xs">同意</NTag>
                         </div>
                     </div>
                     <!-- <p class="text-xs text-slate-400 text-center">暂无数据</p> -->
@@ -366,21 +387,25 @@ onUnmounted(() => {
     </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="lucide:shield-alert" 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-13px font-700 text-#64749a">高风险变更跟踪</p>
+            <p class="text-11px text-#94a3b8">重要等级 · 未关闭 · 实时推导</p>
         </div>
         <template v-if="highRisk.length">
             <div class="space-y-2.5">
-                <div v-for="h in highRisk" :key="h.title" class="rounded-md border border-amber-200 bg-amber-50/60 px-3.5 py-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 class="flex items-center gap-2">
-                    <span class="min-w-0 flex-1 truncate text-sm font-medium text-slate-800">{{ h.title }}</span>
-                    <NButton size="small" type="warning" class="text-xs">查看分析</NButton>
+                    <span class="min-w-0 flex-1 truncate text-sm font-medium text-slate-800">{{ c.title }}</span>
+                    <NButton size="tiny" ghost type="error" class="text-xs">查看分析</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>审批中</span>
+                        <span>一车间</span>
                     </div>
-                    <div class="mt-1 text-[11px]" :style="{ color: themeStore.otherColor.warning }">{{ h.why }}</div>
                 </div>
             </div>
         </template>
@@ -388,47 +413,51 @@ 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="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">系统自动采集 · 近 30 天</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">
-                <div class="flex items-center gap-2">
-                    <span class="text-xs text-slate-500 w-16">平均耗时</span>
-                    <NProgress
-                        type="line"
-                        status="info"
-                        :percentage="50"
-                        :height="10"
-                        border-radius="6px"
-                    >
-                        <span class="text-xs text-slate-700 font-semibold">1.8天</span>
-                    </NProgress>
-                </div>
-                <div class="flex items-center gap-2">
-                    <span class="text-xs text-slate-500 w-16">平均耗时</span>
-                    <NProgress
-                        type="line"
-                        status="error"
-                        :percentage="50"
-                        :height="10"
-                        border-radius="6px"
-                    >
-                        <span class="text-xs text-slate-700 font-semibold" :style="{ color: themeStore.otherColor.error }">2.6天</span>
-                    </NProgress>
-                </div>
-                <div class="flex items-center justify-between text-[11px] text-slate-400">
-                    <span>会签及时率 <b :style="{ color: themeStore.otherColor.success }">92%</b></span>
-                    <span>目标 2 天内签署</span>
+            <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>
+<!-- 附件在线预览弹窗 -->
+<NModal
+    v-model:show="previewModal"
+    preset="card"
+    :auto-focus="false"
+    :style="{ width: '80%', height: 'auto' }"
+    :segmented="{ content: true, footer: true }"
+>
+    <template #header>
+        <div class="flex items-center gap-2 text-base font-semibold text-slate-800">
+        <Icon icon="akar-icons:file" class="size-18px" /> {{ previewFile?.file_name }}
+        </div>
+    </template>
+    <template #default>
+        <div class="space-y-3">
+            <div class="flex flex-wrap gap-x-4 gap-y-1 text-xs text-slate-400">
+                <span>上传人：{{ previewFile?.uploader_name }}</span>
+                <span>上传时间：{{ previewFile?.created_at?.slice(0, 16) }}</span>
+                <span v-if="previewFile?.version">{{ `版本：${previewFile?.version}（受控）` }}</span>
+            </div>
+            <previewComponent v-if="previewFile" :previewFile="previewFile" />
+        </div>
+    </template>
+</NModal>
 </NSpin>
 </template>