From 0e2049bfe687150b5624919cb7c9b8da0d0fe36a Mon Sep 17 00:00:00 2001
From: LCJ-MinYa <1049468118@qq.com>
Date: Tue, 9 Sep 2025 09:35:45 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=B8=80=E4=BA=9B=E6=8A=80=E5=B7=A7?=
 =?UTF-8?q?=E8=AE=B0=E5=BD=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/utils/tools.ts         |  9 ++++++++-
 src/views/demo/cssDemo.vue | 27 +++++++++++++++++++++++++++
 2 files changed, 35 insertions(+), 1 deletion(-)

diff --git a/src/utils/tools.ts b/src/utils/tools.ts
index 55d247d..cc0c999 100644
--- a/src/utils/tools.ts
+++ b/src/utils/tools.ts
@@ -21,7 +21,14 @@ export const url = {
      * @returns {Record<string, any>} { x: 1, y: 2, z: 3 }
      */
     getUrlToParams: (url: string = window.location.href): Record<string, any> => {
-        const urlParams = new URLSearchParams(url.split('?')[1]);
+        /**
+         * 匹配?与#之间的字符串，即url后面的参数
+         * 例1: http://127.0.0.1:8080/?x=1&y=2#/index
+         * 例2: http://127.0.0.1:8080/#/index?x=1&y=2
+         * 匹配上面两种格式的url参数（主要是#号位置不同导致的判断不同）
+         */
+        const match = url.match(/\?(.+?)(?:#|$)/);
+        const urlParams = new URLSearchParams(match ? match[1] : '');
         const params = {};
         for (const [key, value] of urlParams.entries()) {
             params[key] = value;
diff --git a/src/views/demo/cssDemo.vue b/src/views/demo/cssDemo.vue
index 71fbde9..846b55b 100644
--- a/src/views/demo/cssDemo.vue
+++ b/src/views/demo/cssDemo.vue
@@ -11,6 +11,12 @@
                 <div class="child1">子元素3</div>
             </div>
         </el-card>
+
+        <el-card header="border渐变实现">
+            <div class="input-box">
+                <div class="input" />
+            </div>
+        </el-card>
     </base-container>
 </template>
 
@@ -32,4 +38,25 @@
         background: yellow;
     }
 }
+
+.input-box {
+    box-sizing: border-box;
+    position: relative;
+    width: 100%;
+    height: 70px;
+    padding: 15px;
+}
+.input {
+    box-sizing: border-box;
+    border-radius: 8px;
+    overflow: hidden;
+    display: block;
+    width: 100%;
+    height: 100%;
+    border: 2px solid transparent;
+    background:
+        linear-gradient(white, white) padding-box,
+        linear-gradient(45deg, #f6855c, #e29cf9, #5cacfe) border-box;
+    padding-left: 5px;
+}
 </style>