perf: 走查样式调整

src/layouts/components/navbar/components/middle-side/index.vue

@@ -1,6 +1,6 @@
 <script lang="jsx">
 import { Input } from 'ant-design-vue';
-import { handleUserHome } from '@/utils/user.ts';
+// import { handleUserHome } from '@/utils/user.ts';
 import { useChatStore } from '@/stores/modules/chat';
 
 export default {
@@ -23,10 +23,7 @@ export default {
           placeholder="随时告诉我你想做什么，比如查数据、发任务、写内容，我会立刻帮你完成。"
           v-slots={{
             suffix: () => (
-              <div
-                class="bg-#F0EDFF rounded-16px w-32px h-32px flex justify-center items-center icon cursor-pointer"
-                onClick={handleSearch}
-              >
+              <div class=" rounded-16px w-32px h-32px flex justify-center items-center icon " onClick={handleSearch}>
                 <icon-arrow-right size={20} class="color-#6D4CFE" />
               </div>
             ),

src/layouts/components/navbar/components/middle-side/style.scss

@@ -1,21 +1,29 @@
 .middle-wrap {
   display: flex;
   align-items: center;
-  .sender-input-wrap {
+  :deep(.ant-input-affix-wrapper) {
     width: 560px;
     height: 36px;
     padding: 0 2px 0 16px;
     border-radius: 50px;
     background: rgba(255, 255, 255, 0.6);
     backdrop-filter: blur(8px);
+    border-color: #fff;
     box-shadow: none;
     transition: all 0.3s;
     display: flex;
     align-items: center;
-    :deep(.ant-input-suffix) {
+    &.ant-input-affix-wrapper-focused {
+      border-color: #6d4cfe;
+      caret-color: #6d4cfe;
+    }
+    &:hover {
+      border-color: #6d4cfe;
+    }
+    .ant-input-suffix {
       margin-inline-start: 0;
     }
-    :deep(.ant-input) {
+    .ant-input {
       padding-right: 16px;
       border: none !important;
       background-color: transparent;
@@ -26,16 +34,9 @@
       font-style: normal;
       font-weight: 400;
       line-height: 20px;
-      &:hover {
-        border-color: #6d4cfe;
-      }
       &::placeholder {
         color: #939499;
       }
-      &:focus {
-        border-color: #6d4cfe !important;
-        caret-color: #6D4CFE;
-      }
 
       &:focus-within {
         &::after {
@@ -44,6 +45,8 @@
       }
     }
     .icon {
+      cursor: pointer;
+      background: #f0edff;
       transition: background 0.3s;
       &:hover {
         background: linear-gradient(0deg, rgba(0, 0, 0, 0.04) 0%, rgba(0, 0, 0, 0.04) 100%), var(--Brand-1, #f0edff);