页面优化

package.json

@@ -7,8 +7,6 @@
     "preview": "vite preview --port 4173"
   },
   "dependencies": {
-    "@vant/auto-import-resolver": "^1.1.0",
-    "@vant/touch-emulator": "^1.4.0",
     "@vicons/ionicons5": "^0.12.0",
     "@wangeditor/editor": "^5.1.23",
     "@wangeditor/editor-for-vue": "^5.1.12",
@@ -26,7 +24,6 @@
     "rapidoc": "^9.3.4",
     "unplugin-auto-import": "^0.15.2",
     "unplugin-vue-components": "^0.24.1",
-    "vant": "^4.8.7",
     "vfonts": "^0.0.3",
     "vite-svg-loader": "^4.0.0",
     "vue": "^3.2.37",

src/components/menu.vue

@@ -155,6 +155,7 @@ function goConsole() {
 
 :deep(.orange) {
   color: #ffa500;
+  font-size: 24px;
 }
 
 :deep(.menu-item) {

src/main.js

@@ -3,7 +3,6 @@ import { createApp } from "vue";
 
 import http from '@/api/index.js';
 import icon from "@/icon/index.js";
-import "@vant/touch-emulator";
 import "@wangeditor/editor/dist/css/style.css"; // 引入 css
 import "qweather-icons/font/qweather-icons.css";
 import "tailwindcss/tailwind.css";

src/util/menu.js

@@ -12,19 +12,19 @@ const menuInfo = {
     },
     {
       key: "1",
-      label: () => h(RouterLink, { to: "/home", class: "menu-item" }, { default: () => "首页" }),
+      label: () => h(RouterLink, { to: "/home", class: "menu-item font-[500] text-lg" }, { default: () => "首页" }),
     },
     {
       key: "2",
-      label: () => h(RouterLink, { to: "/gallery", class: "menu-item" }, { default: () => "画廊" }),
+      label: () => h(RouterLink, { to: "/gallery", class: "menu-item font-[500] text-lg" }, { default: () => "画廊" }),
     },
     {
       key: "3",
-      label: () => h(RouterLink, { to: "/article", class: "menu-item" }, { default: () => "文章" }),
+      label: () => h(RouterLink, { to: "/article", class: "menu-item font-[500] text-lg" }, { default: () => "文章" }),
     },
     {
       key: "4",
-      label: () => h(RouterLink, { to: "/plink", class: "menu-item" }, { default: () => "友链" }),
+      label: () => h(RouterLink, { to: "/plink", class: "menu-item font-[500] text-lg" }, { default: () => "友链" }),
     },
   ],
   menuList: ["/home", "/gallery", "/article","/plink"],

src/views/console/menu/index.vue

@@ -125,8 +125,8 @@ const columns = createColumns({
     show.value = 'edit'
   },
   remove: (row) => {
-    showModal.value = true
+    // showModal.value = true
-    delId.value = row.id
+    // delId.value = row.id
   }
 })
 

src/views/home/navMenu.vue

@@ -78,7 +78,11 @@ onMounted(async () => {
 }
 
 :deep(.n-tabs-tab__label) {
+  color: #31101b;
   font-size: 20px;
   font-weight: 600;
 }
+:deep(.n-tabs-tab--active) .n-tabs-tab__label{
+  color: @purple;
+}
 </style>

src/views/home/search.vue

@@ -1,10 +1,10 @@
 <template>
-  <div class="py-10 px-20 md:px-4 search-box" round>
+  <div class="py-10 px-40 md:px-4 search-box" round>
     <img class="h-[50px] mb-4 mx-auto" height="30" :src="img" alt="">
-    <n-input-group>
+    <n-input-group size="large">
-      <n-select class="w-[13%] md:w-[40%]" @change="updateEngine" v-model:value="engine" :options="selectOptions" />
+      <!-- <n-select size="large" round class="w-[13%] md:w-[40%]" @change="updateEngine" v-model:value="engine" :options="selectOptions" /> -->
-      <n-input class="w-[74%] md:w-[50%]" v-model:value="searchValue" clearable @keyup.enter="toSearch" />
+      <n-input size="large" round class="w-[85%] md:w-[70%]" v-model:value="searchValue" clearable @keyup.enter="toSearch" />
-      <n-button class="w-[13%] md:w-[20%]" type="primary" @click="toSearch">搜索</n-button>
+      <n-button size="large" round class="w-[15%] md:w-[30%]" type="primary" @click="toSearch">搜索</n-button>
     </n-input-group>
   </div>
 </template>

src/views/home/side.vue

@@ -37,7 +37,7 @@
     <div class="lianxi w-[80%] ml-[10%] mt-4 mb-4 bg-[#fafbfc] p-2">
       <div class="t">
         <n-divider title-placement="center">
-          <div class="flex items-center font-bold" >
+          <div class="flex items-center font-bold text-xl" >
             百度热搜
           </div>
         </n-divider>

vite.config.js

@@ -4,9 +4,8 @@ import vue from "@vitejs/plugin-vue";
 import { resolve } from "path";
 import { defineConfig } from "vite";
 
-import { VantResolver } from '@vant/auto-import-resolver';
 import AutoImport from "unplugin-auto-import/vite";
-import { ElementPlusResolver, NaiveUiResolver } from "unplugin-vue-components/resolvers";
+import { NaiveUiResolver } from "unplugin-vue-components/resolvers";
 import Components from "unplugin-vue-components/vite";
 import svgLoader from "vite-svg-loader";
 
@@ -19,11 +18,11 @@ export default defineConfig({
       include: [/\.[tj]sx?$/, /\.vue$/, /\.vue\?vue/, /\.md$/],
       imports: ["vue", "pinia", "vue-router"],
       dirs: ['./src/api/art'],
-      resolvers: [NaiveUiResolver(), ElementPlusResolver(),VantResolver()],
+      resolvers: [NaiveUiResolver()],
 
     }),
     Components({
-      resolvers: [NaiveUiResolver(), ElementPlusResolver(),VantResolver()],
+      resolvers: [NaiveUiResolver()],
     }),
   ],
   esbuild: {

yarn.lock

@@ -646,26 +646,6 @@
     "@uppy/utils" "^4.1.2"
     nanoid "^3.1.25"
 
-"@vant/auto-import-resolver@^1.1.0":
-  version "1.1.0"
-  resolved "https://registry.npmmirror.com/@vant/auto-import-resolver/-/auto-import-resolver-1.1.0.tgz#ab99b4cfc843b67964b95aa0c38f5ee378596135"
-  integrity sha512-Et3efh3OA617a9AdA+ZQrIXFuBeMv1t6OGLNFXAvgI59lI6U1k5QxHBj8/S7NVST9LB+2xn71TB6Vix5GKI6YQ==
-
-"@vant/popperjs@^1.3.0":
-  version "1.3.0"
-  resolved "https://registry.npmmirror.com/@vant/popperjs/-/popperjs-1.3.0.tgz#e0eff017124b5b2352ef3b36a6df06277f4400f2"
-  integrity sha512-hB+czUG+aHtjhaEmCJDuXOep0YTZjdlRR+4MSmIFnkCQIxJaXLQdSsR90XWvAI2yvKUI7TCGqR8pQg2RtvkMHw==
-
-"@vant/touch-emulator@^1.4.0":
-  version "1.4.0"
-  resolved "https://registry.npmmirror.com/@vant/touch-emulator/-/touch-emulator-1.4.0.tgz#02420ca5f312a7eb6c36c349cbb8e80e6f29ff2f"
-  integrity sha512-Zt+zISV0+wpOew2S1siOJ3G22y+hapHAKmXM+FhpvWzsRc4qahaYXatCAITuuXt0EcDp7WvEeTO4F7p9AtX/pw==
-
-"@vant/use@^1.6.0":
-  version "1.6.0"
-  resolved "https://registry.npmmirror.com/@vant/use/-/use-1.6.0.tgz#237df3091617255519552ca311ffdfea9de59001"
-  integrity sha512-PHHxeAASgiOpSmMjceweIrv2AxDZIkWXyaczksMoWvKV2YAYEhoizRuk/xFnKF+emUIi46TsQ+rvlm/t2BBCfA==
-
 "@vicons/ionicons4@^0.12.0":
   version "0.12.0"
   resolved "https://registry.npmmirror.com/@vicons/ionicons4/-/ionicons4-0.12.0.tgz#20fc1c76b048638a49e76880c10846843b63dc1f"
@@ -760,7 +740,7 @@
     "@vue/compiler-ssr" "3.4.21"
     "@vue/shared" "3.4.21"
 
-"@vue/shared@3.4.21", "@vue/shared@^3.0.0":
+"@vue/shared@3.4.21":
   version "3.4.21"
   resolved "https://registry.npmmirror.com/@vue/shared/-/shared-3.4.21.tgz#de526a9059d0a599f0b429af7037cd0c3ed7d5a1"
   integrity sha512-PuJe7vDIi6VYSinuEbUIQgMIRZGgM8e4R+G+/dQTk0X1NEdvgvvgv7m+rfmDH1gZzyA1OjjoWskvHlfRNfQf3g==
@@ -3023,15 +3003,6 @@ util-deprecate@^1.0.1, util-deprecate@^1.0.2:
   resolved "https://registry.npmmirror.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
   integrity sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==
 
-vant@^4.8.7:
-  version "4.8.7"
-  resolved "https://registry.npmmirror.com/vant/-/vant-4.8.7.tgz#327e191ecd343fa1d34da6806f729cd347d40f40"
-  integrity sha512-puBsqVzC94niN2fFLbkpZGInE8fYK+jjoOAhQ7XAreFCn8xkxnjGpcLNoLvQSP2hUYKN7+kES1bbz/h7RHF7vQ==
-  dependencies:
-    "@vant/popperjs" "^1.3.0"
-    "@vant/use" "^1.6.0"
-    "@vue/shared" "^3.0.0"
-
 vdirs@^0.1.4, vdirs@^0.1.8:
   version "0.1.8"
   resolved "https://registry.npmmirror.com/vdirs/-/vdirs-0.1.8.tgz#a103bc43baca738f8dea912a7e9737154a19dbc2"