neo-cmp-cli 1.13.8 → 1.13.10

package/template/neo-web-entity-grid/src/components/searchForm__c/style.scss

@@ -1,38 +1,105 @@
+/* 查询表单：仅作用于 .searchForm__c，避免污染全局 Ant 组件 */
 .searchForm__c {
+  --sf-accent: #1890ff;
+  --sf-accent-soft: rgba(24, 144, 255, 0.12);
+  --sf-text: #262626;
+  --sf-text-secondary: #595959;
+  --sf-text-muted: #8c8c8c;
+  --sf-border: rgba(0, 0, 0, 0.08);
+  --sf-radius: 10px;
+  --sf-radius-sm: 8px;
+  --sf-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 8px 24px rgba(0, 0, 0, 0.06);
+
+  color: var(--sf-text);
+
+  .searchForm__c-card {
+    border-radius: var(--sf-radius);
+    border: 1px solid var(--sf-border);
+    box-shadow: var(--sf-shadow);
+    background: #fff;
+    overflow: hidden;
+    transition: box-shadow 0.25s ease, border-color 0.25s ease;
+
+    &:hover {
+      border-color: rgba(24, 144, 255, 0.18);
+      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 12px 32px rgba(0, 0, 0, 0.08);
+    }
+
+    .ant-card-body {
+      padding: 20px 24px 22px;
+    }
+  }
+
   .form-header {
-    margin-bottom: 24px;
+    display: flex;
+    align-items: flex-start;
+    gap: 14px;
+    margin: 0 0 20px;
     padding-bottom: 16px;
-    border-bottom: 1px solid #f0f0f0;
+    border-bottom: 1px solid var(--sf-border);
+
+    &::before {
+      content: '';
+      flex-shrink: 0;
+      width: 4px;
+      min-height: 22px;
+      margin-top: 3px;
+      border-radius: 2px;
+      background: linear-gradient(180deg, var(--sf-accent) 0%, #69c0ff 100%);
+    }
+
+    .form-header-text {
+      flex: 1;
+      min-width: 0;
+    }
 
     .form-title {
       margin: 0;
-      font-size: 18px;
+      font-size: 17px;
       font-weight: 600;
-      color: #262626;
+      color: var(--sf-text);
+      letter-spacing: -0.02em;
+      line-height: 1.35;
+    }
+
+    .form-tenant {
+      margin-top: 6px;
+      font-size: 13px;
+      color: var(--sf-text-muted);
+      line-height: 1.4;
     }
   }
 
   .form-content {
+    .ant-spin-nested-loading > div > .ant-spin {
+      max-height: none;
+    }
+
+    .ant-spin {
+      .ant-spin-dot {
+        font-size: 22px;
+      }
+
+      .ant-spin-text {
+        color: var(--sf-text-muted);
+        font-size: 13px;
+        margin-top: 8px;
+      }
+    }
+
     .ant-form {
       .ant-form-item {
-        margin-bottom: 20px;
+        margin-bottom: 18px;
 
         .ant-form-item-label {
-          padding-bottom: 6px;
+          padding-bottom: 4px;
 
-          label {
+          > label {
             font-weight: 500;
-            color: #262626;
+            color: var(--sf-text-secondary);
             font-size: 14px;
-
-            &::before {
-              display: inline-block;
-              margin-right: 4px;
-              color: #ff4d4f;
-              font-size: 14px;
-              font-family: SimSun, sans-serif;
-              line-height: 1;
-            }
+            height: auto;
+            line-height: 1.5;
           }
         }
 
@@ -40,21 +107,21 @@
         .ant-select-selector,
         .ant-input-number,
         .ant-picker {
-          border-radius: 4px;
-          border: 1px solid #d9d9d9;
-          transition: all 0.3s;
+          border-radius: var(--sf-radius-sm);
+          border-color: var(--sf-border);
+          transition: border-color 0.2s ease, box-shadow 0.2s ease;
 
           &:hover {
-            border-color: #40a9ff;
+            border-color: #91d5ff;
           }
+        }
 
-          &:focus,
-          &.ant-input-focused,
-          &.ant-select-focused .ant-select-selector,
-          &.ant-picker-focused {
-            border-color: #40a9ff;
-            box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
-          }
+        .ant-input:focus,
+        .ant-input-focused,
+        .ant-select-focused:not(.ant-select-disabled) .ant-select-selector,
+        .ant-picker-focused {
+          border-color: var(--sf-accent);
+          box-shadow: 0 0 0 3px var(--sf-accent-soft);
         }
 
         .ant-input-number {
@@ -65,7 +132,8 @@
           textarea {
             resize: vertical;
             min-height: 80px;
-            border-radius: 4px;
+            border-radius: var(--sf-radius-sm);
+            padding: 8px 11px;
           }
         }
 
@@ -78,7 +146,6 @@
         }
       }
 
-      // 错误提示样式
       .ant-form-item-has-error {
         .ant-input,
         .ant-select-selector,
@@ -86,9 +153,10 @@
         .ant-picker {
           border-color: #ff4d4f;
 
-          &:focus {
-            border-color: #ff4d4f;
-            box-shadow: 0 0 0 2px rgba(255, 77, 79, 0.2);
+          &:focus,
+          &.ant-input-focused,
+          &.ant-picker-focused {
+            box-shadow: 0 0 0 3px rgba(255, 77, 79, 0.12);
           }
         }
       }
@@ -99,12 +167,12 @@
       padding: 12px 16px;
       background-color: #f6ffed;
       border: 1px solid #b7eb8f;
-      border-radius: 4px;
+      border-radius: var(--sf-radius-sm);
       color: #52c41a;
       font-size: 14px;
       display: flex;
       align-items: center;
-      animation: fadeIn 0.3s ease-in;
+      animation: searchFormFadeIn 0.3s ease;
 
       .anticon {
         margin-right: 8px;
@@ -113,79 +181,96 @@
     }
 
     .form-actions {
-      margin-top: 32px;
-      padding-top: 24px;
-      border-top: 1px solid #f0f0f0;
-      text-align: center;
+      display: flex;
+      justify-content: flex-end;
+      flex-wrap: wrap;
+      gap: 12px;
+      margin-top: 8px;
+      padding-top: 20px;
+      border-top: 1px solid var(--sf-border);
 
       .ant-space {
-        .ant-btn {
-          min-width: 100px;
-          height: 40px;
-          font-size: 15px;
-          border-radius: 4px;
-          font-weight: 500;
-          transition: all 0.3s;
-
-          &.ant-btn-primary {
-            background: #1890ff;
-            border-color: #1890ff;
-
-            &:hover {
-              background: #40a9ff;
-              border-color: #40a9ff;
-              transform: translateY(-2px);
-              box-shadow: 0 4px 12px rgba(24, 144, 255, 0.3);
-            }
-
-            &:active {
-              background: #096dd9;
-              border-color: #096dd9;
-              transform: translateY(0);
-            }
-
-            &:disabled {
-              background: #f5f5f5;
-              border-color: #d9d9d9;
-              color: rgba(0, 0, 0, 0.25);
-              transform: none;
-              box-shadow: none;
-            }
+        flex-wrap: wrap;
+      }
+
+      .ant-btn {
+        min-width: 96px;
+        height: 38px;
+        padding: 0 18px;
+        font-size: 14px;
+        border-radius: var(--sf-radius-sm);
+        font-weight: 500;
+        transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
+
+        &.ant-btn-primary {
+          background: var(--sf-accent);
+          border-color: var(--sf-accent);
+          box-shadow: 0 2px 0 rgba(0, 0, 0, 0.02);
+
+          &:hover:not(:disabled) {
+            background: #40a9ff;
+            border-color: #40a9ff;
+            box-shadow: 0 4px 12px rgba(24, 144, 255, 0.35);
+          }
+
+          &:active:not(:disabled) {
+            background: #096dd9;
+            border-color: #096dd9;
           }
 
-          &:not(.ant-btn-primary) {
-            &:hover {
-              color: #40a9ff;
-              border-color: #40a9ff;
-              transform: translateY(-2px);
-              box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
-            }
-
-            &:active {
-              color: #096dd9;
-              border-color: #096dd9;
-              transform: translateY(0);
-            }
+          &:disabled {
+            background: #f5f5f5;
+            border-color: #d9d9d9;
+            color: rgba(0, 0, 0, 0.25);
+            box-shadow: none;
+          }
+        }
+
+        &:not(.ant-btn-primary) {
+          border-color: var(--sf-border);
+          color: var(--sf-text-secondary);
+
+          &:hover:not(:disabled) {
+            color: var(--sf-accent);
+            border-color: #91d5ff;
           }
         }
       }
     }
 
     .ant-empty {
-      padding: 40px 0;
+      padding: 36px 16px;
 
       .ant-empty-description {
-        color: #8c8c8c;
+        color: var(--sf-text-muted);
         font-size: 14px;
       }
     }
   }
 
-  // 动画效果
-  @keyframes fadeIn {
+  .ant-input-number {
+    .ant-input-number-handler-wrap {
+      opacity: 0;
+      transition: opacity 0.2s ease;
+    }
+
+    &:hover .ant-input-number-handler-wrap {
+      opacity: 1;
+    }
+
+    .ant-input-number-handler {
+      border-left: 1px solid var(--sf-border);
+
+      &:hover {
+        background-color: #fafafa;
+      }
+    }
+  }
+
+  @keyframes searchFormFadeIn {
     from {
       opacity: 0;
-      transform: translateY(-10px);
+      transform: translateY(-6px);
     }
     to {
       opacity: 1;
@@ -193,178 +278,69 @@
     }
   }
 
-  // 响应式设计
   @media (max-width: 768px) {
+    .searchForm__c-card .ant-card-body {
+      padding: 16px 16px 18px;
+    }
+
     .form-header {
       margin-bottom: 16px;
       padding-bottom: 12px;
+      gap: 10px;
 
       .form-title {
         font-size: 16px;
       }
+
+      .form-tenant {
+        font-size: 12px;
+      }
     }
 
     .form-content {
-      .ant-form {
-        .ant-form-item {
-          margin-bottom: 16px;
-
-          .ant-form-item-label {
-            label {
-              font-size: 13px;
-            }
-          }
+      .ant-form .ant-form-item {
+        margin-bottom: 14px;
 
-          .ant-input,
-          .ant-select-selector,
-          .ant-input-number,
-          .ant-picker {
-            font-size: 14px;
-          }
+        .ant-form-item-label > label {
+          font-size: 13px;
         }
       }
 
-      .form-actions {
-        margin-top: 24px;
-        padding-top: 16px;
-
-        .ant-space {
-          .ant-btn {
-            min-width: 80px;
-            height: 36px;
-            font-size: 14px;
-          }
-        }
+      .form-actions .ant-btn {
+        min-width: 88px;
+        height: 36px;
+        font-size: 13px;
       }
     }
   }
 
   @media (max-width: 576px) {
-    .form-header {
-      .form-title {
-        font-size: 15px;
-      }
+    .form-header .form-title {
+      font-size: 15px;
     }
 
     .form-content {
-      .ant-form {
-        // 在小屏幕上强制单列显示
-        .ant-row {
-          .ant-col {
-            max-width: 100% !important;
-            flex: 0 0 100% !important;
-          }
-        }
-
-        .ant-form-item {
-          margin-bottom: 14px;
-
-          .ant-form-item-label {
-            label {
-              font-size: 13px;
-            }
-          }
-        }
+      .ant-form .ant-row .ant-col {
+        max-width: 100% !important;
+        flex: 0 0 100% !important;
       }
 
       .form-actions {
+        justify-content: stretch;
+
         .ant-space {
           width: 100%;
+        }
 
-          .ant-space-item {
-            flex: 1;
-          }
+        .ant-space-item {
+          flex: 1;
+        }
 
-          .ant-btn {
-            width: 100%;
-            min-width: auto;
-          }
+        .ant-btn {
+          width: 100%;
+          min-width: 0;
         }
       }
     }
   }
 }
-
-// 全局样式覆盖
-.ant-card {
-  border-radius: 6px;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-
-  .ant-card-body {
-    padding: 24px;
-  }
-}
-
-// Spin 加载样式
-.ant-spin {
-  .ant-spin-dot {
-    font-size: 20px;
-  }
-
-  .ant-spin-text {
-    color: #8c8c8c;
-    font-size: 14px;
-  }
-}
-
-// Select 下拉样式优化
-.ant-select-dropdown {
-  border-radius: 4px;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
-
-  .ant-select-item {
-    padding: 8px 12px;
-
-    &:hover {
-      background-color: #f5f5f5;
-    }
-
-    &.ant-select-item-option-selected {
-      background-color: #e6f7ff;
-      color: #1890ff;
-      font-weight: 500;
-    }
-  }
-}
-
-// DatePicker 日期选择器样式优化
-.ant-picker-dropdown {
-  .ant-picker-panel-container {
-    border-radius: 4px;
-    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
-  }
-
-  .ant-picker-cell-selected {
-    .ant-picker-cell-inner {
-      background-color: #1890ff;
-    }
-  }
-
-  .ant-picker-cell:hover:not(.ant-picker-cell-selected) {
-    .ant-picker-cell-inner {
-      background-color: #f5f5f5;
-    }
-  }
-}
-
-// InputNumber 数字输入框样式优化
-.ant-input-number {
-  .ant-input-number-handler-wrap {
-    opacity: 0;
-    transition: opacity 0.3s;
-  }
-
-  &:hover {
-    .ant-input-number-handler-wrap {
-      opacity: 1;
-    }
-  }
-
-  .ant-input-number-handler {
-    border-left: 1px solid #d9d9d9;
-
-    &:hover {
-      background-color: #f5f5f5;
-    }
-  }
-}

package/template/neo-web-form/.prettierrc.js

@@ -0,0 +1,12 @@
+/*
+  prettier 配置文件
+  更多配置信息：https://prettier.io/docs/en/options.html
+ */
+module.exports = {
+  semi: true, // Semicolons 分号，默认需要分号
+  tabWidth: 2, // 空格，默认 2,
+  useTabs: false,
+  singleQuote: true, // 单引号还是双引号，默认为false 双引号
+  trailingComma: 'all', // 逗号
+  jsxBracketSameLine: false, // 默认为false，Put the > of a multi-line JSX element at the end of the last line instead of being alone on the next line (does not apply to self closing elements).
+};

package/template/neo-web-form/@types/neo-ui-common.d.ts

@@ -0,0 +1,36 @@
+import * as React from 'react';
+
+/**
+ * BaseCmpProps 基础组件属性接口
+ */
+export interface BaseCmpProps {
+  [key: string]: any;
+}
+
+/**
+ * ScopedComponentType 作用域组件类型接口
+ */
+export interface ScopedComponentType {
+  [key: string]: any;
+}
+
+/**
+ * BaseCmp 基础组件类
+ * 继承自 React.PureComponent，提供基础组件功能
+ */
+export declare class BaseCmp<
+  T extends BaseCmpProps = BaseCmpProps,
+  S = any
+> extends React.PureComponent<T, S> implements ScopedComponentType {
+  props: Readonly<T> & Readonly<{ children?: React.ReactNode }>;
+  state: Readonly<S>;
+  setState<K extends keyof S>(
+    state:
+      | ((prevState: Readonly<S>, props: Readonly<T>) => Pick<S, K> | S | null)
+      | (Pick<S, K> | S | null),
+    callback?: () => void
+  ): void;
+  forceUpdate(callback?: () => void): void;
+  render(): React.ReactNode;
+}
+