本专业高风险静态页面完成

2026-08-20 17:21:37 +08:00
parent b8571da035
commit 2ac8cf91e9
12 changed files with 1274 additions and 212 deletions
@@ -0,0 +1,86 @@
+<script setup lang="ts">
+import { ref, computed, onMounted } from 'vue';
+import { Icon } from '@iconify/vue'
+import { useThemeStore } from '@/store/modules/theme';
+import { useRouterPush } from '@/hooks/common/router';
+import { useRoute } from 'vue-router';
+
+const themeStore = useThemeStore();
+const { routerPushByKey } = useRouterPush();
+const route = useRoute();
+
+const loading = ref<boolean>(false);
+// 当前高风险详情
+const currentInfo = ref<any>(null);
+// 是否开启 AI 标注
+const aiOn = ref<boolean>(false);
+const editMode = ref<boolean>(false);
+
+// 返回
+const back = () => {
+    routerPushByKey('home_highrisk')
+};
+
+onMounted(() => {
+    if(route.query && route.query.params){
+        currentInfo.value = JSON.parse(route.query.params as string);
+    }
+})
+</script>
+
+<template>
+<NSpace vertical :size="16">
+    <!-- 本专业高风险 -->
+    <NSpin :show="loading" size="small">
+        <NCard :bordered="false" size="small" :style="{ borderRadius: themeStore.themeRadius + 'px' }">
+            <div 
+                class="flex flex-wrap items-center gap-3 border border-slate-200 px-3 py-2 mb-3"
+                :style="{ borderRadius: themeStore.themeRadius + 'px' }"
+            >
+                <NButton ghost type="primary" @click="back">
+                    <Icon icon="ep:back" class="size-16px mr-1" />返回
+                </NButton>
+                <div class="min-w-0 flex-1 truncate text-base font-bold text-slate-800">{{ currentInfo?.title }}</div>
+                <NTag size="small" type="info" class="font-mono text-xs">编号：{{ currentInfo?.cid }}</NTag>
+                <NButton 
+                    v-if="currentInfo?.status === '审批中'"
+                    ghost 
+                    size="small"
+                    class="text-xs"
+                    :type="aiOn ? 'success' : 'default'"
+                    @click="aiOn = !aiOn"
+                >
+                    <Icon icon="lucide:sparkles" class="size-12px mr-1" /> AI 标注{{ aiOn ? ' · 已开启' : ' · 已关闭' }}
+                </NButton>
+            </div>
+            <div class="space-y-3 scroll">
+                <!-- 直接修改：红线留痕示例 -->
+                <div v-if="editMode" class="rounded-lg border border-dashed border-red-300 bg-white p-3 text-sm">
+                    <div class="mb-1 text-xs font-semibold text-red-500">红线留痕示例</div>
+                    <p>
+                        变更等级：<del class="text-red-500 line-through">一般</del>
+                        <ins class="bg-emerald-50 px-1 text-emerald-600 no-underline">重要</ins>
+                        <span class="ml-2 text-xs text-slate-400">王海燕 · 2026-07-30 14:22 修改，已通知申请人确认</span>
+                    </p>
+                </div>
+                <div class="flex items-center justify-between">
+                    <p 
+                        class="rounded-sm bg-[var(--theme-color)] px-3 py-1 text-xs font-semibold text-white"
+                        :style="{'--theme-color': themeStore.themeColor}"
+                    >变更申请表</p>
+                    <NButton ghost size="small" class="text-xs"><Icon icon="material-symbols:download" class="size-16px" />导出变更申请表</NButton>
+                </div>
+            </div>
+
+
+        </NCard>
+    </NSpin>
+</NSpace>
+</template>
+
+<style scoped lang="scss">
+.scroll {
+  height: calc(100vh - 303px);
+  overflow-y: auto;
+}
+</style>