diff --git a/package-lock.json b/package-lock.json
index cb8a9cf..c1a0400 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,6 +8,8 @@
       "name": "signstream",
       "version": "0.0.0",
       "dependencies": {
+        "@vant/area-data": "^1.5.1",
+        "@varlet/ui": "^2.22.2",
         "normalize.css": "^8.0.1",
         "vant": "^4.8.4",
         "vue": "^3.3.11",
@@ -19,6 +21,7 @@
         "postcss": "^8.4.33",
         "postcss-px-to-viewport": "^1.1.1",
         "sass": "^1.70.0",
+        "unplugin-auto-import": "^0.17.5",
         "unplugin-vue-components": "^0.26.0",
         "vite": "^5.0.8"
       }
@@ -448,6 +451,11 @@
         "node": ">= 8"
       }
     },
+    "node_modules/@popperjs/core": {
+      "version": "2.11.8",
+      "resolved": "https://registry.npmmirror.com/@popperjs/core/-/core-2.11.8.tgz",
+      "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A=="
+    },
     "node_modules/@rollup/pluginutils": {
       "version": "5.1.0",
       "resolved": "https://registry.npmmirror.com/@rollup/pluginutils/-/pluginutils-5.1.0.tgz",
@@ -645,6 +653,11 @@
       "integrity": "sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==",
       "dev": true
     },
+    "node_modules/@vant/area-data": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmmirror.com/@vant/area-data/-/area-data-1.5.1.tgz",
+      "integrity": "sha512-gR5TPEzTbxN1cTK1aDhCoyikSCLX7DAacxyXoKyI4SAsYYTZrDl/nLgQFIm9vLsvWzlPIda8xV8/U3x7M9k6ww=="
+    },
     "node_modules/@vant/auto-import-resolver": {
       "version": "1.0.2",
       "resolved": "https://registry.npmmirror.com/@vant/auto-import-resolver/-/auto-import-resolver-1.0.2.tgz",
@@ -664,6 +677,43 @@
         "vue": "^3.0.0"
       }
     },
+    "node_modules/@varlet/icons": {
+      "version": "2.22.2",
+      "resolved": "https://registry.npmmirror.com/@varlet/icons/-/icons-2.22.2.tgz",
+      "integrity": "sha512-LNvJcahqlTYhLQ7M8gvbYf7yoAX3tHoXcs6y3c06jedFAmyTwPvUDW/259i2t+cdKtH1tOhk9n0e5WfR2rkR/g=="
+    },
+    "node_modules/@varlet/shared": {
+      "version": "2.22.2",
+      "resolved": "https://registry.npmmirror.com/@varlet/shared/-/shared-2.22.2.tgz",
+      "integrity": "sha512-g3RRaVNqbIHsOfjl6T1IpTDrBZ/Ehe+0oUWYtgh0we3cuD09PytHviZGewwqiPso2wd/5wQJpkSm4hETRJoq0A=="
+    },
+    "node_modules/@varlet/ui": {
+      "version": "2.22.2",
+      "resolved": "https://registry.npmmirror.com/@varlet/ui/-/ui-2.22.2.tgz",
+      "integrity": "sha512-oyqvpW2zlHavgjYTCgjMZZs4tGa8NepfphzwjCYreFjgaBl4d/V1vK8FDn3mOxJHLPMhbfnUZd+UixmHHHosxQ==",
+      "dependencies": {
+        "@popperjs/core": "^2.11.6",
+        "@varlet/icons": "2.22.2",
+        "@varlet/shared": "2.22.2",
+        "@varlet/use": "2.22.2",
+        "dayjs": "^1.10.4",
+        "decimal.js": "^10.2.1"
+      },
+      "peerDependencies": {
+        "vue": "^3.2.0"
+      }
+    },
+    "node_modules/@varlet/use": {
+      "version": "2.22.2",
+      "resolved": "https://registry.npmmirror.com/@varlet/use/-/use-2.22.2.tgz",
+      "integrity": "sha512-iyCof9HX5dGh67y+7QiP3cCuF7hBMoKYfNo1Xn8D0tC9qaq5PSn+Es55HlguhW0bOe4f2fyAQD+eBM2q2oIRxg==",
+      "dependencies": {
+        "@varlet/shared": "2.22.2"
+      },
+      "peerDependencies": {
+        "vue": "^3.2.0"
+      }
+    },
     "node_modules/@vitejs/plugin-vue": {
       "version": "4.6.2",
       "resolved": "https://registry.npmmirror.com/@vitejs/plugin-vue/-/plugin-vue-4.6.2.tgz",
@@ -859,6 +909,11 @@
       "resolved": "https://registry.npmmirror.com/csstype/-/csstype-3.1.3.tgz",
       "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
     },
+    "node_modules/dayjs": {
+      "version": "1.11.10",
+      "resolved": "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.10.tgz",
+      "integrity": "sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ=="
+    },
     "node_modules/debug": {
       "version": "4.3.4",
       "resolved": "https://registry.npmmirror.com/debug/-/debug-4.3.4.tgz",
@@ -876,6 +931,11 @@
         }
       }
     },
+    "node_modules/decimal.js": {
+      "version": "10.4.3",
+      "resolved": "https://registry.npmmirror.com/decimal.js/-/decimal.js-10.4.3.tgz",
+      "integrity": "sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA=="
+    },
     "node_modules/entities": {
       "version": "4.5.0",
       "resolved": "https://registry.npmmirror.com/entities/-/entities-4.5.0.tgz",
@@ -922,6 +982,15 @@
         "@esbuild/win32-x64": "0.19.12"
       }
     },
+    "node_modules/escape-string-regexp": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmmirror.com/escape-string-regexp/-/escape-string-regexp-5.0.0.tgz",
+      "integrity": "sha512-/veY75JbMK4j1yjvuUxuVsiS/hr/4iHs9FTT6cgTexxdE0Ly/glccBAkloH/DofkjRbZU3bnoj38mOmhkZ0lHw==",
+      "dev": true,
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/estree-walker": {
       "version": "2.0.2",
       "resolved": "https://registry.npmmirror.com/estree-walker/-/estree-walker-2.0.2.tgz",
@@ -1065,6 +1134,12 @@
         "node": ">=0.12.0"
       }
     },
+    "node_modules/jsonc-parser": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmmirror.com/jsonc-parser/-/jsonc-parser-3.2.1.tgz",
+      "integrity": "sha512-AilxAyFOAcK5wA1+LeaySVBrHsGQvUFCDWXKpZjzaL0PqW+xfBOttn8GNtWKFWqneyMZj41MWF9Kl6iPWLwgOA==",
+      "dev": true
+    },
     "node_modules/local-pkg": {
       "version": "0.4.3",
       "resolved": "https://registry.npmmirror.com/local-pkg/-/local-pkg-0.4.3.tgz",
@@ -1119,6 +1194,18 @@
         "node": ">=16 || 14 >=14.17"
       }
     },
+    "node_modules/mlly": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmmirror.com/mlly/-/mlly-1.5.0.tgz",
+      "integrity": "sha512-NPVQvAY1xr1QoVeG0cy8yUYC7FQcOx6evl/RjT1wL5FvzPnzOysoqB/jmx/DhssT2dYa8nxECLAaFI/+gVLhDQ==",
+      "dev": true,
+      "dependencies": {
+        "acorn": "^8.11.3",
+        "pathe": "^1.1.2",
+        "pkg-types": "^1.0.3",
+        "ufo": "^1.3.2"
+      }
+    },
     "node_modules/ms": {
       "version": "2.1.2",
       "resolved": "https://registry.npmmirror.com/ms/-/ms-2.1.2.tgz",
@@ -1165,6 +1252,12 @@
       "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
       "dev": true
     },
+    "node_modules/pathe": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmmirror.com/pathe/-/pathe-1.1.2.tgz",
+      "integrity": "sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ==",
+      "dev": true
+    },
     "node_modules/picocolors": {
       "version": "1.0.0",
       "resolved": "https://registry.npmmirror.com/picocolors/-/picocolors-1.0.0.tgz",
@@ -1179,6 +1272,17 @@
         "node": ">=8.6"
       }
     },
+    "node_modules/pkg-types": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmmirror.com/pkg-types/-/pkg-types-1.0.3.tgz",
+      "integrity": "sha512-nN7pYi0AQqJnoLPC9eHFQ8AcyaixBUOwvqc5TDnIKCMEE6I0y8P7OKA7fPexsXGCGxQDl/cmrLAp26LhcwxZ4A==",
+      "dev": true,
+      "dependencies": {
+        "jsonc-parser": "^3.2.0",
+        "mlly": "^1.2.0",
+        "pathe": "^1.1.0"
+      }
+    },
     "node_modules/postcss": {
       "version": "8.4.33",
       "resolved": "https://registry.npmmirror.com/postcss/-/postcss-8.4.33.tgz",
@@ -1302,6 +1406,12 @@
         "node": ">=14.0.0"
       }
     },
+    "node_modules/scule": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmmirror.com/scule/-/scule-1.2.0.tgz",
+      "integrity": "sha512-CRCmi5zHQnSoeCik9565PONMg0kfkvYmcSqrbOJY4txFfy1wvVULV4FDaiXhUblUgahdqz3F2NwHZ8i4eBTwUw==",
+      "dev": true
+    },
     "node_modules/source-map-js": {
       "version": "1.0.2",
       "resolved": "https://registry.npmmirror.com/source-map-js/-/source-map-js-1.0.2.tgz",
@@ -1310,6 +1420,15 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/strip-literal": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmmirror.com/strip-literal/-/strip-literal-1.3.0.tgz",
+      "integrity": "sha512-PugKzOsyXpArk0yWmUwqOZecSO0GH0bPoctLcqNDH9J04pVW3lflYE0ujElBGTloevcxF5MofAOZ7C5l2b+wLg==",
+      "dev": true,
+      "dependencies": {
+        "acorn": "^8.10.0"
+      }
+    },
     "node_modules/supports-preserve-symlinks-flag": {
       "version": "1.0.0",
       "resolved": "https://registry.npmmirror.com/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz",
@@ -1331,6 +1450,55 @@
         "node": ">=8.0"
       }
     },
+    "node_modules/ufo": {
+      "version": "1.3.2",
+      "resolved": "https://registry.npmmirror.com/ufo/-/ufo-1.3.2.tgz",
+      "integrity": "sha512-o+ORpgGwaYQXgqGDwd+hkS4PuZ3QnmqMMxRuajK/a38L6fTpcE5GPIfrf+L/KemFzfUpeUQc1rRS1iDBozvnFA==",
+      "dev": true
+    },
+    "node_modules/unimport": {
+      "version": "3.7.1",
+      "resolved": "https://registry.npmmirror.com/unimport/-/unimport-3.7.1.tgz",
+      "integrity": "sha512-V9HpXYfsZye5bPPYUgs0Otn3ODS1mDUciaBlXljI4C2fTwfFpvFZRywmlOu943puN9sncxROMZhsZCjNXEpzEQ==",
+      "dev": true,
+      "dependencies": {
+        "@rollup/pluginutils": "^5.1.0",
+        "acorn": "^8.11.2",
+        "escape-string-regexp": "^5.0.0",
+        "estree-walker": "^3.0.3",
+        "fast-glob": "^3.3.2",
+        "local-pkg": "^0.5.0",
+        "magic-string": "^0.30.5",
+        "mlly": "^1.4.2",
+        "pathe": "^1.1.1",
+        "pkg-types": "^1.0.3",
+        "scule": "^1.1.1",
+        "strip-literal": "^1.3.0",
+        "unplugin": "^1.5.1"
+      }
+    },
+    "node_modules/unimport/node_modules/estree-walker": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmmirror.com/estree-walker/-/estree-walker-3.0.3.tgz",
+      "integrity": "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==",
+      "dev": true,
+      "dependencies": {
+        "@types/estree": "^1.0.0"
+      }
+    },
+    "node_modules/unimport/node_modules/local-pkg": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmmirror.com/local-pkg/-/local-pkg-0.5.0.tgz",
+      "integrity": "sha512-ok6z3qlYyCDS4ZEU27HaU6x/xZa9Whf8jD4ptH5UZTQYZVYeb9bnZ3ojVhiJNLiXK1Hfc0GNbLXcmZ5plLDDBg==",
+      "dev": true,
+      "dependencies": {
+        "mlly": "^1.4.2",
+        "pkg-types": "^1.0.3"
+      },
+      "engines": {
+        "node": ">=14"
+      }
+    },
     "node_modules/unplugin": {
       "version": "1.6.0",
       "resolved": "https://registry.npmmirror.com/unplugin/-/unplugin-1.6.0.tgz",
@@ -1343,6 +1511,50 @@
         "webpack-virtual-modules": "^0.6.1"
       }
     },
+    "node_modules/unplugin-auto-import": {
+      "version": "0.17.5",
+      "resolved": "https://registry.npmmirror.com/unplugin-auto-import/-/unplugin-auto-import-0.17.5.tgz",
+      "integrity": "sha512-fHNDkDSxv3PGagX1wmKBYBkgaM4AKAgZmdJw/bxjhNljx9KSXSgHpGfX0MwUrq9qw6q1bhHIZVWyOwoY2koo4w==",
+      "dev": true,
+      "dependencies": {
+        "@antfu/utils": "^0.7.7",
+        "@rollup/pluginutils": "^5.1.0",
+        "fast-glob": "^3.3.2",
+        "local-pkg": "^0.5.0",
+        "magic-string": "^0.30.5",
+        "minimatch": "^9.0.3",
+        "unimport": "^3.7.1",
+        "unplugin": "^1.6.0"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "peerDependencies": {
+        "@nuxt/kit": "^3.2.2",
+        "@vueuse/core": "*"
+      },
+      "peerDependenciesMeta": {
+        "@nuxt/kit": {
+          "optional": true
+        },
+        "@vueuse/core": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/unplugin-auto-import/node_modules/local-pkg": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmmirror.com/local-pkg/-/local-pkg-0.5.0.tgz",
+      "integrity": "sha512-ok6z3qlYyCDS4ZEU27HaU6x/xZa9Whf8jD4ptH5UZTQYZVYeb9bnZ3ojVhiJNLiXK1Hfc0GNbLXcmZ5plLDDBg==",
+      "dev": true,
+      "dependencies": {
+        "mlly": "^1.4.2",
+        "pkg-types": "^1.0.3"
+      },
+      "engines": {
+        "node": ">=14"
+      }
+    },
     "node_modules/unplugin-vue-components": {
       "version": "0.26.0",
       "resolved": "https://registry.npmmirror.com/unplugin-vue-components/-/unplugin-vue-components-0.26.0.tgz",
@@ -1693,6 +1905,11 @@
         "fastq": "^1.6.0"
       }
     },
+    "@popperjs/core": {
+      "version": "2.11.8",
+      "resolved": "https://registry.npmmirror.com/@popperjs/core/-/core-2.11.8.tgz",
+      "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A=="
+    },
     "@rollup/pluginutils": {
       "version": "5.1.0",
       "resolved": "https://registry.npmmirror.com/@rollup/pluginutils/-/pluginutils-5.1.0.tgz",
@@ -1801,6 +2018,11 @@
       "integrity": "sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==",
       "dev": true
     },
+    "@vant/area-data": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmmirror.com/@vant/area-data/-/area-data-1.5.1.tgz",
+      "integrity": "sha512-gR5TPEzTbxN1cTK1aDhCoyikSCLX7DAacxyXoKyI4SAsYYTZrDl/nLgQFIm9vLsvWzlPIda8xV8/U3x7M9k6ww=="
+    },
     "@vant/auto-import-resolver": {
       "version": "1.0.2",
       "resolved": "https://registry.npmmirror.com/@vant/auto-import-resolver/-/auto-import-resolver-1.0.2.tgz",
@@ -1818,6 +2040,37 @@
       "integrity": "sha512-PHHxeAASgiOpSmMjceweIrv2AxDZIkWXyaczksMoWvKV2YAYEhoizRuk/xFnKF+emUIi46TsQ+rvlm/t2BBCfA==",
       "requires": {}
     },
+    "@varlet/icons": {
+      "version": "2.22.2",
+      "resolved": "https://registry.npmmirror.com/@varlet/icons/-/icons-2.22.2.tgz",
+      "integrity": "sha512-LNvJcahqlTYhLQ7M8gvbYf7yoAX3tHoXcs6y3c06jedFAmyTwPvUDW/259i2t+cdKtH1tOhk9n0e5WfR2rkR/g=="
+    },
+    "@varlet/shared": {
+      "version": "2.22.2",
+      "resolved": "https://registry.npmmirror.com/@varlet/shared/-/shared-2.22.2.tgz",
+      "integrity": "sha512-g3RRaVNqbIHsOfjl6T1IpTDrBZ/Ehe+0oUWYtgh0we3cuD09PytHviZGewwqiPso2wd/5wQJpkSm4hETRJoq0A=="
+    },
+    "@varlet/ui": {
+      "version": "2.22.2",
+      "resolved": "https://registry.npmmirror.com/@varlet/ui/-/ui-2.22.2.tgz",
+      "integrity": "sha512-oyqvpW2zlHavgjYTCgjMZZs4tGa8NepfphzwjCYreFjgaBl4d/V1vK8FDn3mOxJHLPMhbfnUZd+UixmHHHosxQ==",
+      "requires": {
+        "@popperjs/core": "^2.11.6",
+        "@varlet/icons": "2.22.2",
+        "@varlet/shared": "2.22.2",
+        "@varlet/use": "2.22.2",
+        "dayjs": "^1.10.4",
+        "decimal.js": "^10.2.1"
+      }
+    },
+    "@varlet/use": {
+      "version": "2.22.2",
+      "resolved": "https://registry.npmmirror.com/@varlet/use/-/use-2.22.2.tgz",
+      "integrity": "sha512-iyCof9HX5dGh67y+7QiP3cCuF7hBMoKYfNo1Xn8D0tC9qaq5PSn+Es55HlguhW0bOe4f2fyAQD+eBM2q2oIRxg==",
+      "requires": {
+        "@varlet/shared": "2.22.2"
+      }
+    },
     "@vitejs/plugin-vue": {
       "version": "4.6.2",
       "resolved": "https://registry.npmmirror.com/@vitejs/plugin-vue/-/plugin-vue-4.6.2.tgz",
@@ -1984,6 +2237,11 @@
       "resolved": "https://registry.npmmirror.com/csstype/-/csstype-3.1.3.tgz",
       "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
     },
+    "dayjs": {
+      "version": "1.11.10",
+      "resolved": "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.10.tgz",
+      "integrity": "sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ=="
+    },
     "debug": {
       "version": "4.3.4",
       "resolved": "https://registry.npmmirror.com/debug/-/debug-4.3.4.tgz",
@@ -1993,6 +2251,11 @@
         "ms": "2.1.2"
       }
     },
+    "decimal.js": {
+      "version": "10.4.3",
+      "resolved": "https://registry.npmmirror.com/decimal.js/-/decimal.js-10.4.3.tgz",
+      "integrity": "sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA=="
+    },
     "entities": {
       "version": "4.5.0",
       "resolved": "https://registry.npmmirror.com/entities/-/entities-4.5.0.tgz",
@@ -2029,6 +2292,12 @@
         "@esbuild/win32-x64": "0.19.12"
       }
     },
+    "escape-string-regexp": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmmirror.com/escape-string-regexp/-/escape-string-regexp-5.0.0.tgz",
+      "integrity": "sha512-/veY75JbMK4j1yjvuUxuVsiS/hr/4iHs9FTT6cgTexxdE0Ly/glccBAkloH/DofkjRbZU3bnoj38mOmhkZ0lHw==",
+      "dev": true
+    },
     "estree-walker": {
       "version": "2.0.2",
       "resolved": "https://registry.npmmirror.com/estree-walker/-/estree-walker-2.0.2.tgz",
@@ -2141,6 +2410,12 @@
       "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
       "dev": true
     },
+    "jsonc-parser": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmmirror.com/jsonc-parser/-/jsonc-parser-3.2.1.tgz",
+      "integrity": "sha512-AilxAyFOAcK5wA1+LeaySVBrHsGQvUFCDWXKpZjzaL0PqW+xfBOttn8GNtWKFWqneyMZj41MWF9Kl6iPWLwgOA==",
+      "dev": true
+    },
     "local-pkg": {
       "version": "0.4.3",
       "resolved": "https://registry.npmmirror.com/local-pkg/-/local-pkg-0.4.3.tgz",
@@ -2180,6 +2455,18 @@
         "brace-expansion": "^2.0.1"
       }
     },
+    "mlly": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmmirror.com/mlly/-/mlly-1.5.0.tgz",
+      "integrity": "sha512-NPVQvAY1xr1QoVeG0cy8yUYC7FQcOx6evl/RjT1wL5FvzPnzOysoqB/jmx/DhssT2dYa8nxECLAaFI/+gVLhDQ==",
+      "dev": true,
+      "requires": {
+        "acorn": "^8.11.3",
+        "pathe": "^1.1.2",
+        "pkg-types": "^1.0.3",
+        "ufo": "^1.3.2"
+      }
+    },
     "ms": {
       "version": "2.1.2",
       "resolved": "https://registry.npmmirror.com/ms/-/ms-2.1.2.tgz",
@@ -2214,6 +2501,12 @@
       "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
       "dev": true
     },
+    "pathe": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmmirror.com/pathe/-/pathe-1.1.2.tgz",
+      "integrity": "sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ==",
+      "dev": true
+    },
     "picocolors": {
       "version": "1.0.0",
       "resolved": "https://registry.npmmirror.com/picocolors/-/picocolors-1.0.0.tgz",
@@ -2225,6 +2518,17 @@
       "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
       "dev": true
     },
+    "pkg-types": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmmirror.com/pkg-types/-/pkg-types-1.0.3.tgz",
+      "integrity": "sha512-nN7pYi0AQqJnoLPC9eHFQ8AcyaixBUOwvqc5TDnIKCMEE6I0y8P7OKA7fPexsXGCGxQDl/cmrLAp26LhcwxZ4A==",
+      "dev": true,
+      "requires": {
+        "jsonc-parser": "^3.2.0",
+        "mlly": "^1.2.0",
+        "pathe": "^1.1.0"
+      }
+    },
     "postcss": {
       "version": "8.4.33",
       "resolved": "https://registry.npmmirror.com/postcss/-/postcss-8.4.33.tgz",
@@ -2320,11 +2624,26 @@
         "source-map-js": ">=0.6.2 <2.0.0"
       }
     },
+    "scule": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmmirror.com/scule/-/scule-1.2.0.tgz",
+      "integrity": "sha512-CRCmi5zHQnSoeCik9565PONMg0kfkvYmcSqrbOJY4txFfy1wvVULV4FDaiXhUblUgahdqz3F2NwHZ8i4eBTwUw==",
+      "dev": true
+    },
     "source-map-js": {
       "version": "1.0.2",
       "resolved": "https://registry.npmmirror.com/source-map-js/-/source-map-js-1.0.2.tgz",
       "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw=="
     },
+    "strip-literal": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmmirror.com/strip-literal/-/strip-literal-1.3.0.tgz",
+      "integrity": "sha512-PugKzOsyXpArk0yWmUwqOZecSO0GH0bPoctLcqNDH9J04pVW3lflYE0ujElBGTloevcxF5MofAOZ7C5l2b+wLg==",
+      "dev": true,
+      "requires": {
+        "acorn": "^8.10.0"
+      }
+    },
     "supports-preserve-symlinks-flag": {
       "version": "1.0.0",
       "resolved": "https://registry.npmmirror.com/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz",
@@ -2340,6 +2659,54 @@
         "is-number": "^7.0.0"
       }
     },
+    "ufo": {
+      "version": "1.3.2",
+      "resolved": "https://registry.npmmirror.com/ufo/-/ufo-1.3.2.tgz",
+      "integrity": "sha512-o+ORpgGwaYQXgqGDwd+hkS4PuZ3QnmqMMxRuajK/a38L6fTpcE5GPIfrf+L/KemFzfUpeUQc1rRS1iDBozvnFA==",
+      "dev": true
+    },
+    "unimport": {
+      "version": "3.7.1",
+      "resolved": "https://registry.npmmirror.com/unimport/-/unimport-3.7.1.tgz",
+      "integrity": "sha512-V9HpXYfsZye5bPPYUgs0Otn3ODS1mDUciaBlXljI4C2fTwfFpvFZRywmlOu943puN9sncxROMZhsZCjNXEpzEQ==",
+      "dev": true,
+      "requires": {
+        "@rollup/pluginutils": "^5.1.0",
+        "acorn": "^8.11.2",
+        "escape-string-regexp": "^5.0.0",
+        "estree-walker": "^3.0.3",
+        "fast-glob": "^3.3.2",
+        "local-pkg": "^0.5.0",
+        "magic-string": "^0.30.5",
+        "mlly": "^1.4.2",
+        "pathe": "^1.1.1",
+        "pkg-types": "^1.0.3",
+        "scule": "^1.1.1",
+        "strip-literal": "^1.3.0",
+        "unplugin": "^1.5.1"
+      },
+      "dependencies": {
+        "estree-walker": {
+          "version": "3.0.3",
+          "resolved": "https://registry.npmmirror.com/estree-walker/-/estree-walker-3.0.3.tgz",
+          "integrity": "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==",
+          "dev": true,
+          "requires": {
+            "@types/estree": "^1.0.0"
+          }
+        },
+        "local-pkg": {
+          "version": "0.5.0",
+          "resolved": "https://registry.npmmirror.com/local-pkg/-/local-pkg-0.5.0.tgz",
+          "integrity": "sha512-ok6z3qlYyCDS4ZEU27HaU6x/xZa9Whf8jD4ptH5UZTQYZVYeb9bnZ3ojVhiJNLiXK1Hfc0GNbLXcmZ5plLDDBg==",
+          "dev": true,
+          "requires": {
+            "mlly": "^1.4.2",
+            "pkg-types": "^1.0.3"
+          }
+        }
+      }
+    },
     "unplugin": {
       "version": "1.6.0",
       "resolved": "https://registry.npmmirror.com/unplugin/-/unplugin-1.6.0.tgz",
@@ -2352,6 +2719,34 @@
         "webpack-virtual-modules": "^0.6.1"
       }
     },
+    "unplugin-auto-import": {
+      "version": "0.17.5",
+      "resolved": "https://registry.npmmirror.com/unplugin-auto-import/-/unplugin-auto-import-0.17.5.tgz",
+      "integrity": "sha512-fHNDkDSxv3PGagX1wmKBYBkgaM4AKAgZmdJw/bxjhNljx9KSXSgHpGfX0MwUrq9qw6q1bhHIZVWyOwoY2koo4w==",
+      "dev": true,
+      "requires": {
+        "@antfu/utils": "^0.7.7",
+        "@rollup/pluginutils": "^5.1.0",
+        "fast-glob": "^3.3.2",
+        "local-pkg": "^0.5.0",
+        "magic-string": "^0.30.5",
+        "minimatch": "^9.0.3",
+        "unimport": "^3.7.1",
+        "unplugin": "^1.6.0"
+      },
+      "dependencies": {
+        "local-pkg": {
+          "version": "0.5.0",
+          "resolved": "https://registry.npmmirror.com/local-pkg/-/local-pkg-0.5.0.tgz",
+          "integrity": "sha512-ok6z3qlYyCDS4ZEU27HaU6x/xZa9Whf8jD4ptH5UZTQYZVYeb9bnZ3ojVhiJNLiXK1Hfc0GNbLXcmZ5plLDDBg==",
+          "dev": true,
+          "requires": {
+            "mlly": "^1.4.2",
+            "pkg-types": "^1.0.3"
+          }
+        }
+      }
+    },
     "unplugin-vue-components": {
       "version": "0.26.0",
       "resolved": "https://registry.npmmirror.com/unplugin-vue-components/-/unplugin-vue-components-0.26.0.tgz",
diff --git a/package.json b/package.json
index b7a214a..7b67f33 100644
--- a/package.json
+++ b/package.json
@@ -9,6 +9,8 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@vant/area-data": "^1.5.1",
+    "@varlet/ui": "^2.22.2",
     "normalize.css": "^8.0.1",
     "vant": "^4.8.4",
     "vue": "^3.3.11",
@@ -20,6 +22,7 @@
     "postcss": "^8.4.33",
     "postcss-px-to-viewport": "^1.1.1",
     "sass": "^1.70.0",
+    "unplugin-auto-import": "^0.17.5",
     "unplugin-vue-components": "^0.26.0",
     "vite": "^5.0.8"
   }
diff --git a/src/App.vue b/src/App.vue
index 267034a..1a3de86 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -9,4 +9,8 @@
 </template>
 
 <style>
+*, *::before, *::after {
+  box-sizing: border-box;
+}
+
 </style>
diff --git a/src/request/index.js b/src/request/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/src/util/storage.js b/src/utils/storage.js
similarity index 100%
rename from src/util/storage.js
rename to src/utils/storage.js
diff --git a/src/views/logon/index.vue b/src/views/logon/index.vue
index 5e1e475..bc4d5bd 100644
--- a/src/views/logon/index.vue
+++ b/src/views/logon/index.vue
@@ -1,13 +1,18 @@
 <script setup>
 import { useRouter } from 'vue-router';
 const router = useRouter();
-import storage from '@/util/storage.js';
+import storage from '@/utils/storage.js';
 import {ref,onBeforeUnmount} from "vue";
 const isCountingDown = ref(false);
 const timeLeft = ref(60);
 const countdownInterval = ref(null);
+const sendCodeApi=()=>{
 
+}
 const sendCode = async () => {
+  if (!isCountingDown.value){
+
+  }
   isCountingDown.value = true;
   countdownInterval.value = setInterval(() => {
     if (timeLeft.value > 0) {
diff --git a/src/views/signup/index.vue b/src/views/signup/index.vue
index 5c5e1b4..fa8c4da 100644
--- a/src/views/signup/index.vue
+++ b/src/views/signup/index.vue
@@ -1,7 +1,6 @@
 <script setup>
 import { useRouter } from 'vue-router';
-import storage from '@/util/storage.js';
-
+import storage from '@/utils/storage.js';
 const router = useRouter();
 const goRouter=()=>{
   storage.setItem('top-title','登录')
diff --git a/src/views/upload-id-card/content/one.vue b/src/views/upload-id-card/content/one.vue
index 62cc49c..d79f98a 100644
--- a/src/views/upload-id-card/content/one.vue
+++ b/src/views/upload-id-card/content/one.vue
@@ -8,7 +8,10 @@
     <van-uploader>
       <div class="wrap1">
         <div class="wrap1_1">
-          <img src="@/assets/images/zu1172@2x.png" alt="">
+          <div class="wrap1_1_1">
+            <img src="@/assets/images/zu1172@2x.png" alt="">
+          </div>
+          <div class="wrap1_1_2">更换</div>
         </div>
         <div class="wrap1_2">上传身份证人像面</div>
       </div>
@@ -18,12 +21,33 @@
     <van-uploader>
       <div class="wrap1">
         <div class="wrap1_1">
-          <img src="@/assets/images/zu1169@2x.png" alt="">
+          <div class="wrap1_1_1">
+            <img src="@/assets/images/zu1172@2x.png" alt="">
+          </div>
+          <div class="wrap1_1_2">更换</div>
         </div>
         <div class="wrap1_2">上传身份证国徽面</div>
       </div>
     </van-uploader>
   </div>
+  <div class="content4">
+    <div class="wrap1">
+      <div class="wrap1_1">
+        <div class="wrap1_1_1">姓名</div>
+        <div class="wrap1_1_2">某某某</div>
+      </div>
+
+    </div>
+    <div class="wrap1">
+      <div class="wrap1_1">
+        <div class="wrap1_1_1">姓名</div>
+        <div class="wrap1_1_2">某某某</div>
+      </div>
+
+    </div>
+  </div>
+  <div class="content5">*自动识别内容，请仔细核对</div>
+  <div class="content6">证件即将过期，请尽快更新，否则将影响部分功能使用！</div>
 </div>
 </template>
 
@@ -31,6 +55,57 @@
 .one-content{
   margin-bottom: 54px;
 }
+.content6{
+  margin-top: 5px;
+  width: 100%;
+  height: 46px;
+  background-color: #E74747;
+  color: #fff;
+  font-size: 12px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: 10px;
+}
+.content5{
+  text-align: right;
+  font-size: 10px;
+  color: #FFFFFF;
+  margin-top: 8px;
+}
+.content4{
+  margin-top: 20px;
+  background-color: #fff;
+  overflow: hidden;
+  border-radius: 12px;
+  .wrap1{
+    padding-left: 14px;
+    padding-right: 14px;
+    &:last-child .wrap1_1{
+      border-bottom:none;
+    }
+    .wrap1_1{
+      padding-top: 14px;
+      padding-bottom: 14px;
+      border-bottom: #BBC5E0 solid 1px;
+      display: flex;
+
+      .wrap1_1_2{
+        padding-left: 10px;
+        color: #24437E;
+        font-size: 12px;
+      }
+      .wrap1_1_1{
+        border-right: #BBC5E0 solid 1px;
+        width: 92px;
+        font-size: 12px;
+        color: #000;
+        padding-left: 10px;
+
+      }
+    }
+  }
+}
 .content3 {
   .wrap1 {
     width: 332px;
@@ -49,11 +124,28 @@
     .wrap1_1 {
       width: 293px;
       height: 170px;
-
-      img {
-        width: 100%;
-        height: 100%;
+      position: relative;
+      .wrap1_1_2{
+        font-size: 14px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        color: white;
+        background-color: #2159C4;
+        width: 48px;
+        height: 32px;
+        border-radius: 20px;
+        position: absolute;
+        bottom: 12px;
+        right: 12px;
       }
+      .wrap1_1_1{
+        img {
+          width: 100%;
+          height: 100%;
+        }
+      }
+
     }
   }
 }
@@ -76,11 +168,28 @@
     .wrap1_1 {
       width: 293px;
       height: 170px;
-
-      img {
-        width: 100%;
-        height: 100%;
+      position: relative;
+      .wrap1_1_2{
+        font-size: 14px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        color: white;
+        background-color: #2159C4;
+        width: 48px;
+        height: 32px;
+        border-radius: 20px;
+        position: absolute;
+        bottom: 12px;
+        right: 12px;
       }
+      .wrap1_1_1{
+        img {
+          width: 100%;
+          height: 100%;
+        }
+      }
+
     }
   }
 }