neo-cmp-cli 1.2.8 → 1.2.10

package/src/template/neo-custom-cmp-template/src/components/xobject-table-v2/model.ts

@@ -0,0 +1,122 @@
+/**
+ * @file XObject 表格组件对接编辑器的描述文件
+ * @description 定义组件在 Neo 平台编辑器中的配置信息
+ * @author Neo Custom Widget CLI
+ * @version 1.0.0
+ */
+export class XObjectTableModel {
+  /**
+   * 组件类型标识
+   * 用于标识组件的唯一性，在构建时根据当前组件目录名称自动生成
+   * 注意：此字段在构建时会被自动替换，不需要手动设置
+   */
+  // cmpType: string = 'xobject-table';
+
+  /** 组件名称，用于设置在编辑器左侧组件面板中展示的名称 */
+  label: string = '实体对象数据v2';
+
+  /** 组件描述，用于设置在编辑器左侧组件面板中展示的描述 */
+  description: string = '基于 XObject 的数据表格组件，支持增删改查操作';
+
+  /** 分类标签，用于设置在编辑器左侧组件面板哪个分类中展示（可设置多个分类标签） */
+  tags: string[] = ['自定义组件'];
+
+  /** 组件图标，用于设置在编辑器左侧组件面板中展示的图标 */
+  iconSrc: string = 'https://custom-widgets.bj.bcebos.com/table.svg';
+
+  /** 初次插入页面的默认属性数据 */
+  defaultComProps = {
+    title: '实体数据表格',
+    xObjectApiKey: 'account',
+    showAddButton: true,
+    showEditButton: true,
+    showDeleteButton: true,
+    custom: true,
+  };
+
+  /** 设计器端预览时展示的默认数据 */
+  previewComProps = {
+    title: '实体数据表格',
+    xObjectApiKey: 'account',
+  };
+
+  /**
+   * 组件属性配置模式
+   * 支持静态配置：propsSchema，优先级比 propsSchemaCreator 低
+   * 定义组件在编辑器中可配置的属性
+   */
+  propsSchema = [
+    {
+      type: 'select',
+      name: 'custom',
+      label: '实体类型',
+      value: true,
+      placeholder: '请选择要操作的实体类型',
+      options: [
+        {
+          label: '标准实体',
+          value: false,
+        },
+        {
+          label: '自定义实体',
+          value: true,
+        },
+      ],
+    },
+    {
+      type: 'select',
+      name: 'xObjectApiKey',
+      label: '选择实体对象',
+      source: {
+        url: '/rest/metadata/v2.0/xobjects/filter?custom=${custom}&active=true',
+        method: 'GET',
+        adaptor: (resp: any) => {
+          const entityList = resp.data?.data?.records || [];
+          return {
+            status: 0,
+            data: {
+              options: entityList.map((item: any) => ({
+                label: item.label || item.name,
+                value: item.apiKey || item.name,
+              })),
+            },
+          };
+        },
+      },
+      searchable: true,
+      value: 'account',
+      placeholder: '请选择要操作的实体对象',
+    },
+    {
+      type: 'switch',
+      name: 'showAddButton',
+      label: '显示新增按钮',
+      value: true,
+    },
+    {
+      type: 'switch',
+      name: 'showEditButton',
+      label: '显示编辑按钮',
+      value: true,
+    },
+    {
+      type: 'switch',
+      name: 'showDeleteButton',
+      label: '显示删除按钮',
+      value: true,
+    },
+  ];
+
+  /**
+   * 支持函数式写法：propsSchemaCreator
+   * com 为组件实例，优先级比 propsSchema 高
+   * 可以根据组件实例动态生成属性配置
+   */
+  /*
+  propsSchemaCreator = (com: any) => {
+    return [];
+  };
+  */
+}
+
+export default XObjectTableModel;

package/src/template/neo-custom-cmp-template/src/components/xobject-table-v2/style.scss

@@ -0,0 +1,304 @@
+.xobject-table-container {
+  .table-header {
+    margin-bottom: 16px;
+
+    .header-content {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      flex-wrap: wrap;
+      gap: 12px;
+
+      .header-title {
+        margin: 0;
+        font-size: 18px;
+        font-weight: 600;
+        color: #262626;
+        flex: 1;
+        min-width: 200px;
+      }
+
+      .ant-space {
+        flex-shrink: 0;
+      }
+    }
+  }
+
+  .table-content {
+    .ant-table {
+      .ant-table-thead > tr > th {
+        background-color: #fafafa;
+        font-weight: 600;
+        color: #262626;
+        border-bottom: 1px solid #f0f0f0;
+      }
+
+      .ant-table-tbody > tr > td {
+        border-bottom: 1px solid #f0f0f0;
+        padding: 12px 16px;
+      }
+
+      .ant-table-tbody > tr:hover > td {
+        background-color: #f5f5f5;
+      }
+
+      .ant-table-pagination {
+        margin-top: 16px;
+        text-align: right;
+      }
+    }
+
+    .ant-empty {
+      padding: 40px 0;
+
+      .ant-empty-description {
+        color: #8c8c8c;
+        font-size: 14px;
+      }
+    }
+
+    .error-container {
+      text-align: center;
+      padding: 40px 0;
+
+      .retry-button {
+        background: #1890ff;
+        border: 1px solid #1890ff;
+        color: #fff;
+        padding: 6px 15px;
+        border-radius: 4px;
+        cursor: pointer;
+        font-size: 14px;
+        transition: all 0.3s;
+
+        &:hover {
+          background: #40a9ff;
+          border-color: #40a9ff;
+        }
+      }
+    }
+  }
+
+  .ant-modal {
+    .ant-form {
+      .ant-form-item {
+        margin-bottom: 16px;
+
+        .ant-form-item-label {
+          padding-bottom: 4px;
+
+          label {
+            font-weight: 500;
+            color: #262626;
+          }
+        }
+
+        .ant-input,
+        .ant-select-selector,
+        .ant-input-number {
+          border-radius: 4px;
+          border: 1px solid #d9d9d9;
+          transition: all 0.3s;
+
+          &:hover {
+            border-color: #40a9ff;
+          }
+
+          &:focus,
+          &.ant-input-focused,
+          &.ant-select-focused .ant-select-selector {
+            border-color: #40a9ff;
+            box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
+          }
+        }
+
+        .ant-input-textarea {
+          resize: vertical;
+          min-height: 80px;
+        }
+      }
+    }
+  }
+
+  .ant-btn {
+    border-radius: 4px;
+    font-weight: 500;
+    transition: all 0.3s;
+
+    &.ant-btn-primary {
+      background: #1890ff;
+      border-color: #1890ff;
+
+      &:hover {
+        background: #40a9ff;
+        border-color: #40a9ff;
+      }
+
+      &:focus {
+        background: #40a9ff;
+        border-color: #40a9ff;
+      }
+    }
+
+    &.ant-btn-link {
+      padding: 4px 8px;
+      height: auto;
+      line-height: 1.5;
+
+      &:hover {
+        background-color: #f5f5f5;
+      }
+    }
+
+    &.ant-btn-link.ant-btn-dangerous {
+      color: #ff4d4f;
+
+      &:hover {
+        color: #ff7875;
+        background-color: #fff2f0;
+      }
+    }
+  }
+
+  .ant-popconfirm {
+    .ant-popover-inner-content {
+      padding: 12px 16px;
+    }
+
+    .ant-popover-buttons {
+      text-align: right;
+      margin-top: 8px;
+
+      .ant-btn {
+        margin-left: 8px;
+
+        &:first-child {
+          margin-left: 0;
+        }
+      }
+    }
+  }
+
+  .ant-spin {
+    .ant-spin-dot {
+      font-size: 20px;
+    }
+
+    .ant-spin-text {
+      color: #8c8c8c;
+      font-size: 14px;
+    }
+  }
+
+  // 响应式设计
+  @media (max-width: 768px) {
+    .table-header {
+      .header-content {
+        flex-direction: column;
+        align-items: flex-start;
+
+        .header-title {
+          margin-bottom: 8px;
+        }
+
+        .ant-space {
+          width: 100%;
+          justify-content: flex-end;
+        }
+      }
+    }
+
+    .table-content {
+      .ant-table {
+        .ant-table-thead > tr > th,
+        .ant-table-tbody > tr > td {
+          padding: 8px 12px;
+          font-size: 13px;
+        }
+      }
+    }
+  }
+
+  @media (max-width: 576px) {
+    .table-header {
+      .header-content {
+        .header-title {
+          font-size: 16px;
+        }
+      }
+    }
+
+    .table-content {
+      .ant-table {
+        .ant-table-thead > tr > th,
+        .ant-table-tbody > tr > td {
+          padding: 6px 8px;
+          font-size: 12px;
+        }
+      }
+
+      .ant-table-pagination {
+        .ant-pagination-options {
+          display: none;
+        }
+      }
+    }
+  }
+}
+
+// 全局样式覆盖
+.ant-card {
+  border-radius: 6px;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+
+  .ant-card-body {
+    padding: 20px;
+  }
+}
+
+.ant-modal {
+  .ant-modal-header {
+    border-bottom: 1px solid #f0f0f0;
+    padding: 16px 24px;
+
+    .ant-modal-title {
+      font-size: 16px;
+      font-weight: 600;
+      color: #262626;
+    }
+  }
+
+  .ant-modal-body {
+    padding: 24px;
+  }
+
+  .ant-modal-footer {
+    border-top: 1px solid #f0f0f0;
+    padding: 12px 24px;
+    text-align: right;
+
+    .ant-btn {
+      margin-left: 8px;
+
+      &:first-child {
+        margin-left: 0;
+      }
+    }
+  }
+}
+
+.ant-modal-content {
+  display: flex;
+  flex-direction: column;
+
+  .ant-modal-header,
+  .ant-modal-footer {
+    flex: 0;
+  }
+
+  .ant-modal-body {
+    flex: 1;
+    max-height: 500px;
+    overflow-y: auto;
+  }
+}

package/src/template/neo-custom-cmp-template/src/utils/queryObjectData.ts

@@ -1,5 +1,4 @@
-import { message } from 'antd';
-import axiosFetcher from './axiosFetcher';
+import axiosFetcher from '$utils/axiosFetcher';
 
 /**
  * 这里存放通用查询类 Open API
@@ -46,19 +45,31 @@ export const queryXObjectData = async (options?: any) => {
 
     const resultData = await axiosFetcher(config);
 
-    // 返回包含分页信息的结果
+    if (resultData.code === 200) {
+      const { records, totalSize } = resultData.result || {};
+      return {
+        status: true,
+        code: resultData.code,
+        msg: resultData.msg || '获取业务对象数据列表成功',
+        totalSize,
+        data: records || [],
+      };
+    }
+
     return {
-      ...resultData,
-      pagination: {
-        page,
-        pageSize,
-        offset,
-      },
+      status: false,
+      code: resultData.code,
+      msg: resultData.msg || '获取业务对象数据列表失败',
+      data: [],
     };
   } catch (error) {
-    console.error('获取业务类型失败:', error);
-    message.error('获取业务类型失败。');
-    return {};
+    console.error('获取业务对象数据列表失败:', error);
+
+    return {
+      status: false,
+      msg: error.msg || error.message || '获取业务对象数据列表失败',
+      data: [],
+    };
   }
 };
 

package/src/template/neo-custom-cmp-template/tsconfig.json

@@ -44,7 +44,7 @@
       "@": ["./src"],
       "@assets/*": ["src/assets/*"],
       "@components/*": ["src/components/*"],
-      "@utils/*": ["src/utils/*"]
+      "$utils/*": ["src/utils/*"]
     } /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */,
     // "rootDirs": [],                        /* List of root folders whose combined content represents the structure of the project at runtime. */
     /* 指定声明文件或文件夹的路径列表，如果指定了此项，则只有在这里列出的声明文件才会被加载 */

package/src/template/react-custom-cmp-template/package.json

@@ -44,7 +44,7 @@
   "devDependencies": {
     "@commitlint/cli": "^8.3.5",
     "@commitlint/config-conventional": "^9.1.1",
-    "neo-cmp-cli": "^1.2.3",
+    "neo-cmp-cli": "^1.2.9",
     "husky": "^4.2.5",
     "lint-staged": "^10.2.9",
     "prettier": "^2.0.5"

package/src/template/react-ts-custom-cmp-template/package.json

@@ -46,7 +46,7 @@
     "@commitlint/config-conventional": "^9.1.1",
     "@types/react": "^16.9.11",
     "@types/react-dom": "^16.9.15",
-    "neo-cmp-cli": "^1.2.3",
+    "neo-cmp-cli": "^1.2.9",
     "husky": "^4.2.5",
     "lint-staged": "^10.2.9",
     "prettier": "^2.0.5"

package/src/template/vue2-custom-cmp-template/package.json

@@ -44,7 +44,7 @@
   "devDependencies": {
     "@commitlint/cli": "^8.3.5",
     "@commitlint/config-conventional": "^9.1.1",
-    "neo-cmp-cli": "^1.2.3",
+    "neo-cmp-cli": "^1.2.9",
     "husky": "^4.2.5",
     "lint-staged": "^10.2.9",
     "prettier": "^2.0.5",