From 74fa22d3e9436c364048de786e05732ddd95b3f7 Mon Sep 17 00:00:00 2001
From: bootx <xxm1995@outlook.com>
Date: Wed, 24 Jun 2026 12:32:16 +0800
Subject: [PATCH] =?UTF-8?q?refactor(h5):=20=E4=BC=98=E5=8C=96=E4=B8=A4?=
 =?UTF-8?q?=E7=AB=AF=20404=20=E9=A1=B5=E9=9D=A2,=20PC=20=E7=AB=AF=E6=94=B9?=
 =?UTF-8?q?=E7=94=A8=E6=8F=92=E7=94=BB=E9=A3=8E=E6=A0=BC=E5=AF=B9=E9=BD=90?=
 =?UTF-8?q?=E5=95=86=E4=B8=9A=E7=89=88?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- PC NotFound：去掉 logo + 文字 404 + 原生按钮，改用 404 插画 + 文案 +
  主题色按钮，scoped px + 媒体查询；插画以 import 方式引入
- 移动端 404：文案 p→h1 语义化，间距对齐商业版
---
 src/mobile/views/exception/404.vue |  8 +++----
 src/pc/views/NotFound.vue          | 37 +++++++++++-------------------
 2 files changed, 17 insertions(+), 28 deletions(-)

diff --git a/src/mobile/views/exception/404.vue b/src/mobile/views/exception/404.vue
index 856ef16..da67261 100644
--- a/src/mobile/views/exception/404.vue
+++ b/src/mobile/views/exception/404.vue
@@ -10,12 +10,12 @@ function goHome() {
 <template>
   <div class="page-container flex flex-col justify-center">
     <div class="text-center">
-      <img src="~@/shared/assets/icons/exception/404.svg" alt="">
+      <img src="~@/shared/assets/icons/exception/404.svg" alt="404">
     </div>
     <div class="text-center">
-      <p class="m-4 text-base">
+      <h1 class="m-4 text-base">
         抱歉，你访问的页面不存在
-      </p>
+      </h1>
       <van-button type="primary" @click="goHome">
         回到首页
       </van-button>
@@ -24,7 +24,7 @@ function goHome() {
 </template>
 
 <style lang="less" scoped>
-  .page-container {
+.page-container {
   height: 100%;
 
   .text-center {
diff --git a/src/pc/views/NotFound.vue b/src/pc/views/NotFound.vue
index d1ebad2..6719284 100644
--- a/src/pc/views/NotFound.vue
+++ b/src/pc/views/NotFound.vue
@@ -1,4 +1,6 @@
 <script lang="ts" setup>
+import notFoundImg from '@/shared/assets/icons/exception/404.svg'
+
 defineOptions({ name: 'PcNotFound' })
 
 const router = useRouter()
@@ -10,13 +12,10 @@ function goHome() {
 
 <template>
   <div class="pc-notfound">
-    <img class="pc-notfound__logo" src="/logo.svg" alt="DaxPay">
-    <p class="pc-notfound__code">
-      404
-    </p>
-    <p class="pc-notfound__text">
+    <img class="pc-notfound__img" :src="notFoundImg" alt="404">
+    <h1 class="pc-notfound__text">
       抱歉，你访问的页面不存在
-    </p>
+    </h1>
     <button class="pc-notfound__btn" type="button" @click="goHome">
       返回首页
     </button>
@@ -34,27 +33,21 @@ function goHome() {
   background: #f7f8fa;
 }
 
-.pc-notfound__logo {
-  width: 160px;
+.pc-notfound__img {
+  width: 400px;
   height: auto;
 }
 
-.pc-notfound__code {
-  margin: 24px 0 8px;
-  font-size: 56px;
-  font-weight: 900;
-  line-height: 1;
-  color: #1d2129;
-}
-
 .pc-notfound__text {
-  margin: 0 0 32px;
+  margin: 24px 0 32px;
   font-size: 16px;
+  font-weight: 500;
+  line-height: 1.5;
   color: #4e5969;
 }
 
 .pc-notfound__btn {
-  padding: 10px 28px;
+  padding: 10px 32px;
   font-size: 14px;
   color: #ffffff;
   background: #5d9dfe;
@@ -69,12 +62,8 @@ function goHome() {
 }
 
 @media (max-width: 768px) {
-  .pc-notfound__logo {
-    width: 120px;
-  }
-
-  .pc-notfound__code {
-    font-size: 44px;
+  .pc-notfound__img {
+    width: 280px;
   }
 }
 </style>