feat ui设计稿

src/views/service/cpns/ChatInput.vue

@@ -86,42 +86,49 @@ function onFileChange(event: Event): void {
 
 <style lang="less" scoped>
 .chat-input {
-  .flex(column, flex-start);
-  gap: @spacing-sm;
-  padding: @spacing-base;
-  border-top: 1px solid @border-color;
+  .flex(column, flex-start, stretch);
+  gap: 16px; // 输入框→提示行 23 × 0.77
+  padding: 12px 16px 24px; // 上 13 / 左右 21 / 下 36 × 0.77
+  border-top: 1px solid @project-divider; // 设计 38 分割线 @project-divider
   background: @white;
 
+  // 设计 38：文本域灰底无描边，占位文案 #1F2937（13 → 11）
   &__textarea {
     width: 100%;
-    padding: @spacing-sm @spacing-base;
-    border: 1px solid @border-color;
-    border-radius: @radius-base;
-    background: @bg-color-light;
-    color: @text-color;
-    font-size: @font-size-base;
+    height: 57px; // 文本域高 74 × 0.77（覆盖 rows 固有高）
+    padding: 11px 10px;
+    border: none;
+    border-radius: 6px;
+    background: @finance-row-bg; // 设计 38 实取 @finance-row-bg
+    color: @heading-color;
+    font-size: 11px;
     line-height: 1.6;
     resize: none;
     outline: none;
-    transition: border-color 0.2s;
+    transition: background 0.2s;
     box-sizing: border-box;
 
     &:focus {
-      border-color: @primary-color;
+      border: none;
+      background: @finance-row-bg;
     }
 
     &::placeholder {
-      color: @text-color-disabled;
+      color: @heading-color; // 设计 38 占位即标注 @heading-color
     }
   }
 
   &__bar {
     .flex(row, space-between);
     gap: @spacing-base;
+    align-items: center;
+    width: 100%;
   }
 
+  // 设计 38：提示 11 / #9CA3AF（覆盖 text-secondary）
   &__hint {
-    font-size: @font-size-sm;
+    font-size: 11px;
+    color: @text-color-disabled;
   }
 
   &__actions {
@@ -131,22 +138,38 @@ function onFileChange(event: Event): void {
 
   &__attach {
     .flex(row, center);
-    width: 32px;
-    height: 32px;
-    border: 1px solid @border-color;
-    border-radius: @radius-base;
-    background: @white;
-    font-size: @font-size-lg;
+    width: 28px;
+    height: 28px;
+    border: none;
+    border-radius: @radius-sm;
+    background: transparent;
+    font-size: 14px;
     cursor: pointer;
     transition: all 0.2s;
 
     &:hover {
-      border-color: @primary-color;
+      background: @bg-color-light;
     }
   }
 
   &__file {
     display: none;
   }
+
+  // 「发送」：设计 38 #024FFF 小按钮（12 → 11 / 500）
+  .app-button {
+    height: 24px; // 31 × 0.77
+    padding: 0 14px;
+    border-radius: 6px;
+    background: @primary-strong;
+    color: @white;
+    font-size: 11px;
+    font-weight: 500;
+
+    &:hover {
+      background: @primary-strong;
+      color: @white;
+    }
+  }
 }
 </style>