Ver código fonte

[edit][错误页]

zhangwei 2 anos atrás
pai
commit
85f10d6577
3 arquivos alterados com 100 adições e 5 exclusões
  1. 44 2
      layouts/error.vue
  2. 53 3
      pages/_system/404.vue
  3. 3 0
      static/svg/icon-warn.svg

+ 44 - 2
layouts/error.vue

@@ -1,13 +1,23 @@
 <template>
-	<div v-if="error.statusCode == 500">{{ error.message || 'error' }}</div>
+	<div class="content">
+		<v-logo></v-logo>
+		<div class="warn">
+			<img src="@/static/svg/icon-warn.svg" alt="" />
+			<p v-if="error.statusCode == 500">{{ error.message || 'error' }}</p>
+		</div>
+	</div>
 </template>
 
 <script>
 import Report from '@/log-center/log';
+import VLogo from '@/components/logo.vue';
 import { getMid, appVersionCode } from '@/utils/help';
 export default {
 	name: 'error',
 	props: ['error'],
+	components: {
+		VLogo,
+	},
 	data() {
 		return {
 			mid: getMid(),
@@ -30,4 +40,36 @@ export default {
 };
 </script>
 
-<style lang="scss"></style>
+<style lang="scss">
+html,
+body,
+#__nuxt,
+#__layout {
+	width: 100%;
+	height: 100%;
+	padding: 0;
+	margin: 0;
+}
+
+.content {
+	width: 100%;
+	height: 100%;
+	background: linear-gradient(180deg, #d8efff 0%, #ffffff 44.3%);
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	.warn {
+		text-align: center;
+		color: #aab4b9;
+		img {
+			width: 100px;
+			height: 100px;
+		}
+		p {
+			margin-top: 20px;
+			font-weight: 700;
+			font-size: 30px;
+		}
+	}
+}
+</style>

+ 53 - 3
pages/_system/404.vue

@@ -1,7 +1,57 @@
 <template>
-	<div>404</div>
+	<div class="content">
+		<v-logo></v-logo>
+		<div class="warn">
+			<img src="@/static/svg/icon-warn.svg" alt="" />
+			<p>404</p>
+		</div>
+	</div>
 </template>
 
-<script></script>
+<script>
+import VLogo from '@/components/logo.vue';
+export default {
+	name: 'error',
+	components: {
+		VLogo,
+	},
+	data() {
+		return {};
+	},
+	mounted() {},
+};
+</script>
 
-<style lang="scss"></style>
+<style lang="scss">
+html,
+body,
+#__nuxt,
+#__layout {
+	width: 100%;
+	height: 100%;
+	padding: 0;
+	margin: 0;
+}
+
+.content {
+	width: 100%;
+	height: 100%;
+	background: linear-gradient(180deg, #d8efff 0%, #ffffff 44.3%);
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	.warn {
+		text-align: center;
+		color: #aab4b9;
+		img {
+			width: 100px;
+			height: 100px;
+		}
+		p {
+			margin-top: 20px;
+			font-weight: 700;
+			font-size: 30px;
+		}
+	}
+}
+</style>

+ 3 - 0
static/svg/icon-warn.svg

@@ -0,0 +1,3 @@
+<svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M50 6.25C25.8594 6.25 6.25 25.8594 6.25 50C6.25 74.1406 25.8594 93.75 50 93.75C74.1406 93.75 93.75 74.1406 93.75 50C93.75 25.8594 74.1406 6.25 50 6.25ZM53.125 75H46.875V68.75H53.125V75ZM46.875 62.5V25H53.125V62.5H46.875Z" fill="#AAB4B9"/>
+</svg>