neo-cmp-cli 1.2.7 → 1.2.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "neo-cmp-cli",
-  "version": "1.2.7",
+  "version": "1.2.9",
   "description": "前端脚手架：自定义组件开发工具，支持react 和 vue2.0技术栈。",
   "keywords": [
     "neo-cli",

package/src/cmpUtils/getCmpPreview.js

@@ -18,16 +18,6 @@ const getCmpPreview = (cmpsDir, cmpName) => {
     process.exit(1);
   }
 
-  if (!fs.existsSync(cpmModelDir)) {
-    return `
-import * as React from 'react';
-import ReactDOM from 'react-dom';
-import CustomCmp from '${cpmDir}';
-import '$public/css/base.css';
-ReactDOM.render(<CustomCmp />, document.getElementById('root'),);
-  `;
-  }
-
   return `
 import * as React from 'react';
 import ReactDOM from 'react-dom';
@@ -39,9 +29,6 @@ const curDefaultComProps = new CustomCmpModel().defaultComProps;
 const previewComProps = new CustomCmpModel().previewComProps;
 const curPreviewComProps = Object.assign(curDefaultComProps, previewComProps);
 
-/* 引入公共的静态资源 */
-import '$public/css/base.css';
-
 // 预览 自定义组件
 ReactDOM.render(
   <CustomCmp {...curPreviewComProps} />,

package/src/module/index.js

@@ -76,13 +76,11 @@ yargs
             value: 'echarts',
             short: 'echarts'
           },
-          /*
           {
             name: 'Neo 自定义组件',
             value: 'neo',
             short: 'neo'
           },
-          */
           {
             name: 'react 自定义组件',
             value: 'react',

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

@@ -47,7 +47,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/develop/neo-custom-cmp-template/package.json

@@ -51,7 +51,7 @@
     "@types/react": "^16.9.11",
     "@types/react-dom": "^16.9.15",
     "@types/axios": "^0.14.0",
-    "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/echarts-custom-cmp-template/package.json

@@ -47,7 +47,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/neo-custom-cmp-template/neo.config.js

@@ -23,7 +23,7 @@ module.exports = {
         '@': resolve('src'),
         $assets: resolve('src/assets'),
         $public: resolve('public'),
-        '@utils': resolve('src/utils'),
+        $utils: resolve('src/utils'),
       },
     },
     // sassResources中的sass文件会自动注入每一个sass文件中

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

@@ -43,7 +43,8 @@
     "react-dom": "^16.9.0",
     "axios": "^0.27.2",
     "antd": "^4.9.4",
-    "lodash": "^4.17.21"
+    "lodash": "^4.17.21",
+    "neo-open-api": "^1.0.2"
   },
   "devDependencies": {
     "@commitlint/cli": "^8.3.5",
@@ -51,7 +52,7 @@
     "@types/react": "^16.9.11",
     "@types/react-dom": "^16.9.15",
     "@types/axios": "^0.14.0",
-    "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/neo-custom-cmp-template/src/components/contact-card-list/index.tsx

@@ -1,7 +1,8 @@
 import * as React from 'react';
 import { Card, Row, Col, Spin, Empty, Avatar, Button } from 'antd';
 import { UserOutlined, PhoneOutlined, ReloadOutlined } from '@ant-design/icons';
-import { queryXObjectData } from '@utils/queryObjectData';
+// @ts-ignore
+import { xObject } from 'neo-open-api'; // Neo Open API
 import './style.scss';
 
 interface ContactCardListProps {
@@ -47,16 +48,15 @@ export default class ContactCardList extends React.PureComponent<
     this.setState({ loading: true, error: null });
 
     try {
-      // 使用 queryXObjectData 获取 customContact__c 数据
-      const response = await queryXObjectData({
+      // 使用 Neo Open API 获取 customContact__c 数据
+      const result = await xObject.query({
         xObjectApiKey: 'customContact__c',
         fields: ['id', 'name', 'phone__c'],
       });
 
-      if (response && response.code === 200) {
-        const curResult = response.result || {};
-        const records = curResult.records || [];
-        const totalSize = curResult.totalSize || 0;
+      if (result?.status) {
+        const records = result.data || [];
+        const totalSize = result.totalSize || 0;
         this.setState({
           contactList: records,
           totalSize,
@@ -64,12 +64,11 @@ export default class ContactCardList extends React.PureComponent<
         });
       } else {
         this.setState({
-          error: response?.message || '获取联系人数据失败',
+          error: result?.msg || '获取联系人数据失败',
           loading: false,
         });
       }
     } catch (error: any) {
-      console.error('获取联系人数据失败:', error);
       this.setState({
         error: error.message || '获取联系人数据失败',
         loading: false,

package/src/template/neo-custom-cmp-template/src/components/contact-form/index.tsx

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { Form, Input, Select, Button, message, Card } from 'antd';
-import { getEntityTypeList, createXObject } from '@utils/xobjects';
+// @ts-ignore
+import { xObject } from 'neo-open-api'; // Neo Open API
 const { Option } = Select;
 
 import './style.scss';
@@ -39,11 +40,10 @@ export default class ContactForm extends React.PureComponent<
     };
 
     // 获取业务类型列表
-    getEntityTypeList('customContact__c').then((res: any) => {
-      if (res && res.code === '200') {
-        const result = res.data || {};
+    xObject.getEntityTypeList('customContact__c').then((res: any) => {
+      if (res && res.status) {
         this.setState({
-          entityTypeList: result.records || [],
+          entityTypeList: res.data || [],
         });
       }
     });
@@ -115,19 +115,19 @@ export default class ContactForm extends React.PureComponent<
       }
 
       // 调用 API 提交数据
-      const response: any = await createXObject('customContact__c', {
+      const response: any = await xObject.create('customContact__c', {
         method: 'POST',
         data: submitData,
       });
 
-      if (response && response.code === '200') {
+      if (response && response.status) {
         message.success('联系人创建成功！');
         // 成功后重置表单
         setTimeout(() => {
           this.resetForm();
         }, 1000);
       } else {
-        message.error('创建联系人失败:', response.message);
+        message.error('创建联系人失败:', response.msg);
       }
     } catch (error: any) {
       message.error('创建联系人失败:', error);

package/src/template/neo-custom-cmp-template/src/components/xobject-table/index.tsx

@@ -29,14 +29,14 @@ import {
   ReloadOutlined,
 } from '@ant-design/icons';
 import moment from 'moment';
-import { queryXObjectData } from '@utils/queryObjectData';
+import { queryXObjectData } from '$utils/queryObjectData';
 import {
   getEntityTypeList,
   getXObjectDesc,
   createXObject,
   updateXObject,
   deleteXObject,
-} from '@utils/xobjects';
+} from '$utils/xobjects';
 import './style.scss';
 
 const { Option } = Select;
@@ -297,16 +297,15 @@ export default class XObjectTable extends React.PureComponent<
     try {
       // 获取所有字段的 API Key
       const fields = this.state.fieldList.map((field) => field.apiKey);
-      const response = await queryXObjectData({
+      const result = await queryXObjectData({
         xObjectApiKey,
         fields,
         page,
         pageSize,
       });
 
-      if (response && response.code === 200) {
-        const result = response.result || {};
-        const records = result.records || [];
+      if (result && result.status) {
+        const records = result.data || [];
         const totalSize = result.totalSize || 0;
 
         this.setState({
@@ -320,12 +319,11 @@ export default class XObjectTable extends React.PureComponent<
         });
       } else {
         this.setState({
-          error: response?.message || '获取数据失败',
+          error: result?.msg || '获取数据失败',
           loading: false,
         });
       }
     } catch (error: any) {
-      console.error('获取数据失败:', error);
       this.setState({
         error: error.message || '获取数据失败',
         loading: false,

package/src/template/neo-custom-cmp-template/src/components/xobject-table-v2/README.md

@@ -0,0 +1,113 @@
+# XObject 数据表格组件
+基于 XObject 的数据表格组件，支持增删改查操作，表格列根据 `getXObjectDesc` 返回的 fields 动态生成。
+
+- 对应的生成指令
+```
+@utils/ 请根据这里提供的方法，参照 @contact-card-list/ 使用 antd 组件 写一个 表格组件，展示属性配置 xobject 对应的 业务数据列表，支持创建、编辑、删除操作。其中表格展示的列 根据 getXObjectDesc 返回的 fields 生成，表格的 Title 根据 其返回的 label 显示。另外 请使用 propsSchemaCreator 生成自定义组件的属性配置，支持 xobject 选择配置，其中 xobject 的选项 使用 getEntityList获取。
+```
+
+## 功能特性
+
+- 📊 **动态表格列**：根据 XObject 字段描述自动生成表格列
+- ➕ **新增记录**：支持通过弹窗表单新增数据记录
+- ✏️ **编辑记录**：支持编辑现有数据记录
+- 🗑️ **删除记录**：支持删除数据记录，带确认提示
+- 🔄 **数据刷新**：支持手动刷新数据
+- 📄 **分页支持**：支持分页显示，可配置每页显示条数
+- 🎨 **响应式设计**：适配不同屏幕尺寸
+- ⚙️ **属性配置**：支持通过编辑器配置组件属性
+
+## 组件属性
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|--------|------|--------|------|
+| title | string | '数据表格' | 表格标题 |
+| xObjectApiKey | string | '' | 数据对象的 API Key |
+| pageSize | number | 10 | 每页显示条数 |
+| showPagination | boolean | true | 是否显示分页 |
+| showAddButton | boolean | true | 是否显示新增按钮 |
+| showEditButton | boolean | true | 是否显示编辑按钮 |
+| showDeleteButton | boolean | true | 是否显示删除按钮 |
+
+## 使用方法
+
+### 1. 在编辑器中使用
+
+1. 从组件面板拖拽 "XObject 数据表格" 组件到页面
+2. 在右侧属性面板中选择要操作的数据对象
+3. 配置其他属性（可选）
+4. 保存并预览
+
+### 2. 代码中使用
+
+```tsx
+import XObjectTable from './components/xobject-table';
+
+// 使用组件
+<XObjectTable
+  title="联系人列表"
+  xObjectApiKey="customContact__c"
+  pageSize={20}
+  showPagination={true}
+  showAddButton={true}
+  showEditButton={true}
+  showDeleteButton={true}
+/>
+```
+
+## 技术实现
+
+### 核心依赖
+
+- **Ant Design**：UI 组件库
+- **React**：前端框架
+- **TypeScript**：类型支持
+
+### 主要方法
+
+- `getXObjectDesc()`：获取 XObject 字段描述
+- `getEntityList()`：获取实体列表
+- `queryXObjectData()`：查询数据列表
+- `createXObject()`：创建数据记录
+- `updateXObject()`：更新数据记录
+- `deleteXObject()`：删除数据记录
+
+### 数据流程
+
+1. **初始化**：组件挂载时获取实体列表和字段描述
+2. **列生成**：根据字段描述动态生成表格列
+3. **数据加载**：使用 `queryXObjectData` 获取数据列表
+4. **操作处理**：通过对应的 API 方法处理增删改操作
+
+## 样式定制
+
+组件提供了完整的 SCSS 样式文件，支持以下定制：
+
+- 表格样式（边框、悬停效果等）
+- 按钮样式（颜色、大小、间距等）
+- 弹窗样式（表单布局、输入框样式等）
+- 响应式设计（移动端适配）
+
+## 注意事项
+
+1. **权限要求**：确保用户有对应 XObject 的读写权限
+2. **字段类型**：目前支持 text、textarea、select 等基础字段类型
+3. **必填字段**：表单会根据字段的 required 属性进行验证
+4. **错误处理**：组件内置了完善的错误处理和用户提示
+
+## 扩展开发
+
+如需扩展功能，可以：
+
+1. **添加字段类型支持**：在 `renderForm()` 方法中添加新的字段类型
+2. **自定义操作列**：修改 `generateColumns()` 方法中的操作列配置
+3. **添加批量操作**：扩展表格功能支持批量删除等操作
+4. **自定义样式**：修改 `style.scss` 文件定制组件外观
+
+## 更新日志
+
+### v1.0.0
+- 初始版本发布
+- 支持基础的增删改查功能
+- 支持动态列生成
+- 支持属性配置面板