From de92a5fd2e2cf83a4bd307ff61c448d025d3b28a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B0=B1=E7=9C=A0=E5=84=80=E5=BC=8F?= <854085467@qq.com> Date: Sat, 29 Jan 2022 23:07:16 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=20exception=20=E7=BB=84?= =?UTF-8?q?=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- example/docs/zh-CN/components/exception.md | 28 + src/component/exception/image/401.svg | 85 +++ src/component/exception/image/403.svg | 573 +++------------------ src/component/exception/image/404.svg | 400 ++++---------- src/component/exception/image/500.svg | 294 ++++------- src/component/exception/index.less | 11 +- src/component/exception/index.vue | 16 +- 7 files changed, 381 insertions(+), 1026 deletions(-) create mode 100644 src/component/exception/image/401.svg diff --git a/example/docs/zh-CN/components/exception.md b/example/docs/zh-CN/components/exception.md index 73733253..49083155 100644 --- a/example/docs/zh-CN/components/exception.md +++ b/example/docs/zh-CN/components/exception.md @@ -1,6 +1,34 @@ ::: anchor ::: +::: title 401 +::: + +::: demo 使用 `lay-exception` 标签, 创建一个异常页面 + + + + + +::: + ::: title 403 ::: diff --git a/src/component/exception/image/401.svg b/src/component/exception/image/401.svg new file mode 100644 index 00000000..0800b5b2 --- /dev/null +++ b/src/component/exception/image/401.svg @@ -0,0 +1,85 @@ + + + 401 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/component/exception/image/403.svg b/src/component/exception/image/403.svg index 610f136f..b09f6a8c 100644 --- a/src/component/exception/image/403.svg +++ b/src/component/exception/image/403.svg @@ -1,506 +1,73 @@ - - - - Group 9 - Created with Sketch. - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + 403 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/component/exception/image/404.svg b/src/component/exception/image/404.svg index 5531d05c..44dcd11e 100644 --- a/src/component/exception/image/404.svg +++ b/src/component/exception/image/404.svg @@ -1,313 +1,93 @@ - - - - Group 4 - Created with Sketch. - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + 404 -白 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/component/exception/image/500.svg b/src/component/exception/image/500.svg index de723b1e..2327d2f7 100644 --- a/src/component/exception/image/500.svg +++ b/src/component/exception/image/500.svg @@ -1,207 +1,93 @@ - - - - Group 4 - Created with Sketch. - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + 500 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/component/exception/index.less b/src/component/exception/index.less index 68abfb6b..2bc0e041 100644 --- a/src/component/exception/index.less +++ b/src/component/exception/index.less @@ -4,11 +4,13 @@ display: inline-block; vertical-align: top; > div { - width: 200px; height: 200px; background-size: 100% 100%; background-repeat: no-repeat; } + .error-401 { + background-image: url(./image/401.svg); + } .error-403 { background-image: url(./image/403.svg); } @@ -21,16 +23,17 @@ } .layui-exception-details{ .layui-exception-details-content { + margin-left: 100px; .layui-exception-details-title{ - font-size: 68px; + font-size: 60px; color: #434e59; margin-bottom: 24px; font-weight: 600; } .layui-exception-details-describe{ - font-size: 20px; + font-size: 18px; color: rgba(0, 0, 0, .45); - margin-bottom: 16px; + margin-bottom: 26px; } } width: 50%; diff --git a/src/component/exception/index.vue b/src/component/exception/index.vue index 96c95d85..0eca9879 100644 --- a/src/component/exception/index.vue +++ b/src/component/exception/index.vue @@ -1,4 +1,5 @@
-
-
-
+ +