neo-cmp-cli 1.12.8 → 1.12.10

package/template/neo-bi-cmps/src/components/targetNumber__c/README.md

@@ -1,100 +0,0 @@
-# 数值指标组件 (targetNumber__c)
-
-## 组件描述
-
-数值指标组件用于展示关键数值指标，支持从 XObject 实体对象获取动态数据。组件支持绑定多个字段，每个字段都会显示为一个独立的数值块，支持自定义样式和布局方式。
-
-## 功能特性
-
-- ✅ 支持从 XObject 实体对象获取动态数据
-- ✅ 支持数据源配置（使用 `xObjectEntityList`）
-- ✅ 支持多个字段绑定（使用 `selectFieldDescApi`，必填）
-- ✅ 支持自定义字体大小、颜色等样式配置
-- ✅ 支持两种布局方式：上图下文、左图右文
-- ✅ 支持数值格式化（数字类型自动添加千分位）
-- ✅ 支持加载状态和错误提示
-- ✅ 响应式设计，适配移动端和桌面端
-- ✅ 每个字段自动显示自己的标签和数值
-
-## 使用方法
-
-### 基础用法
-
-```tsx
-<TargetNumber
-  entityApiKey="customContact__c"
-  selectFieldDesc={[
-    {
-      apiKey: "amount__c",
-      label: "合同金额",
-      type: "currency"
-    },
-    {
-      apiKey: "count__c",
-      label: "合同数量",
-      type: "number"
-    }
-  ]}
-/>
-```
-
-### 配置项说明
-
-| 属性名 | 类型 | 默认值 | 说明 |
-|--------|------|--------|------|
-| `entityApiKey` | `string` | - | 实体对象的 API Key |
-| `selectFieldDesc` | `object[]` | - | 绑定的字段描述信息数组（包含 apiKey、label、type），至少需要配置一个字段 |
-| `fontSize` | `number \| string` | `32` | 数值字体大小（单位：px） |
-| `fontColor` | `string` | `#262626` | 数值字体颜色 |
-| `fontWeight` | `number \| string` | `600` | 数值字体粗细 |
-| `titleFontSize` | `number \| string` | `14` | 字段标签字体大小（单位：px） |
-| `titleColor` | `string` | `#8c8c8c` | 字段标签字体颜色 |
-| `alignClass` | `'flex-col' \| 'flex-row'` | `'flex-col'` | 布局方式：flex-col（上图下文）或 flex-row（左图右文） |
-| `formatter` | `function` | - | 自定义数值格式化函数，接收 (value, fieldDesc) 参数 |
-| `className` | `string` | - | 组件类名 |
-
-### 编辑器配置
-
-组件在 Neo 平台编辑器中支持以下配置项：
-
-1. **实体对象** (`xObjectEntityList`): 选择要获取数据的实体对象
-2. **绑定字段** (`selectFieldDescApi`): 选择要显示的字段，支持多选，至少需要选择一个字段
-3. **数值字体大小**: 设置数值的字体大小
-4. **数值字体颜色**: 设置数值的字体颜色
-5. **数值字体粗细**: 设置数值的字体粗细
-6. **标签字体大小**: 设置字段标签的字体大小
-7. **标签字体颜色**: 设置字段标签的字体颜色
-8. **布局方式**: 选择上图下文或左图右文
-
-### 支持的函数
-
-组件支持以下函数，可在其他组件中触发：
-
-- `loadData`: 刷新数据，重新加载数值指标数据
-
-## 数据获取方式
-
-组件通过以下方式获取数据：
-
-1. 使用 `xObject.query()` API 查询实体数据
-2. 根据配置的 `entityApiKey` 和 `selectFieldDesc` 数组获取字段值
-3. 直接使用查询结果的第一条记录的字段值，不进行前端聚合计算
-4. 从第一条记录中提取所有选中字段的值，每个字段显示为一个独立的数值块
-
-## 样式定制
-
-组件使用 SCSS 编写样式，支持通过以下方式定制：
-
-1. 修改 `style.scss` 文件
-2. 通过 `className` 属性添加自定义类名
-3. 通过内联样式属性（`fontSize`、`fontColor` 等）动态调整样式
-
-## 注意事项
-
-1. 使用组件前需要先配置 `entityApiKey` 和 `selectFieldDesc`（至少一个字段）
-2. `selectFieldDesc` 必须是一个数组，至少包含一个有效的字段描述
-3. 字段类型为 `number` 或 `currency` 时，会自动添加千分位格式化
-4. 如果数据加载失败，会显示错误提示信息
-5. 组件支持响应式设计，在不同屏幕尺寸下自动调整样式
-6. 组件直接使用查询结果的第一条记录，不进行前端聚合计算
-7. 每个字段都会显示自己的标签和数值，标签使用字段的 `label` 属性

package/template/neo-bi-cmps/src/components/targetNumber__c/customStyleConfig/configSchema.ts

@@ -1,253 +0,0 @@
-/**
- * 用于定制组件的样式配置
- * 备注：使用 JSONEditor 渲染配置内容。
- * 说明：以下 configSchema 可使用 JSONSchemaEditor 生成。使用方式见 https://github.com/wibetter/json-editor。
- * JSONEditor 在线地址：https://wibetter.github.io/json-editor/online-demo/6.0.0/index.html。
- */
-export const configSchema = {
-  type: 'object',
-  name: 'targetNumber',
-  title: '自定义样式配置',
-  properties: {
-    baseStyle: {
-      type: 'object',
-      title: '基础样式',
-      isFixed: false,
-      properties: {
-        backgroundColor: {
-          type: 'color',
-          title: '背景色',
-          default: '#ffffff',
-          description: '',
-        },
-        paddingMargin: {
-          type: 'padding-margin',
-          title: '内外边距',
-          isContainer: false,
-          properties: {
-            margin: {
-              title: '外边距',
-              type: 'input',
-              default: '0',
-              description: '',
-            },
-            padding: {
-              title: '内边距',
-              type: 'input',
-              default: '0',
-              description: '',
-            },
-            quantity: {
-              type: 'select',
-              default: 'px',
-              options: [
-                {
-                  label: 'px',
-                  value: 'px',
-                },
-                {
-                  label: 'rem',
-                  value: 'rem',
-                },
-                {
-                  label: 'em',
-                  value: 'em',
-                },
-                {
-                  label: '%',
-                  value: '%',
-                },
-              ],
-              title: '单位类型',
-            },
-          },
-          propertyOrder: ['margin', 'padding', 'quantity'],
-          description: '',
-        },
-      },
-      propertyOrder: ['backgroundColor', 'paddingMargin'],
-    },
-    layoutStyle: {
-      type: 'object',
-      title: '布局配置',
-      isFixed: false,
-      properties: {
-        legendOrient: {
-          type: 'radio',
-          title: '图例排列方向',
-          options: [
-            {
-              label: '水平方向',
-              value: 'horizontal',
-            },
-            {
-              label: '垂直方向',
-              value: 'vertical',
-            },
-          ],
-          description: '',
-        },
-        alignClass: {
-          type: 'radio',
-          title: '排列方式',
-          options: [
-            {
-              label: '上图下文',
-              value: 'horizontal',
-            },
-            {
-              label: '上文下图',
-              value: 'flex-col-reverse',
-            },
-            {
-              label: '左图右文',
-              value: 'flex-row',
-            },
-            {
-              label: '左文右图',
-              value: 'flex-row-reverse',
-            },
-          ],
-          description: '用于设置数值和标题的排列方式',
-          default: 'horizontal',
-        },
-      },
-      propertyOrder: ['legendOrient', 'alignClass'],
-    },
-    titleStyle: {
-      type: 'object',
-      title: '标题样式',
-      isFixed: true,
-      properties: {
-        show: {
-          type: 'boolean',
-          title: '显示标题',
-          default: false,
-          description: '',
-        },
-        text: {
-          title: '标题文字',
-          type: 'input',
-          default: '',
-          description: '',
-          placeholder: '',
-          onShow: 'show',
-        },
-        fontSize: {
-          type: 'number',
-          title: '标题字号',
-          default: 24,
-          minimum: 0,
-          maximum: 1000,
-          description: '',
-          onShow: 'show',
-        },
-        fontWeight: {
-          type: 'number',
-          title: '标题字重',
-          default: 400,
-          minimum: 0,
-          maximum: 1000,
-          description: '',
-          onShow: 'show',
-        },
-        color: {
-          type: 'color',
-          title: '字体颜色',
-          default: '#000000',
-          description: '',
-          onShow: 'show',
-        },
-      },
-      propertyOrder: ['show', 'text', 'fontSize', 'fontWeight', 'color'],
-    },
-    numberStyle: {
-      type: 'object',
-      title: '数值样式',
-      isFixed: false,
-      properties: {
-        fontSize: {
-          type: 'number',
-          title: '标题字号',
-          default: 18,
-          minimum: 0,
-          maximum: 1000,
-          description: '',
-          onShow: '',
-        },
-        fontWeight: {
-          type: 'number',
-          title: '标题字重',
-          default: 800,
-          minimum: 0,
-          maximum: 1000,
-          description: '',
-          onShow: '',
-        },
-        color: {
-          type: 'color',
-          title: '字体颜色',
-          default: '#ffffff',
-          description: '',
-          onShow: '',
-        },
-        linkHref: {
-          type: 'url',
-          title: '数值链接',
-          default: '',
-          description: '配置点击数值跳转的地址',
-          placeholder: '',
-        },
-      },
-      propertyOrder: ['fontSize', 'fontWeight', 'color', 'linkHref'],
-    },
-    numberTitleStyle: {
-      type: 'object',
-      title: '数值标题样式',
-      isFixed: false,
-      properties: {
-        fontSize: {
-          type: 'number',
-          title: '标题字号',
-          default: 16,
-          minimum: 0,
-          maximum: 1000,
-          description: '',
-          onShow: '',
-        },
-        fontWeight: {
-          type: 'number',
-          title: '标题字重',
-          default: 400,
-          minimum: 0,
-          maximum: 1000,
-          description: '',
-          onShow: '',
-        },
-        color: {
-          type: 'color',
-          title: '字体颜色',
-          default: '#ffffff',
-          description: '',
-          onShow: '',
-        },
-        linkHref: {
-          type: 'url',
-          title: '数值标题链接',
-          default: '',
-          description: '配置点击数值标题跳转的地址',
-          placeholder: '',
-        },
-      },
-      propertyOrder: ['fontSize', 'fontWeight', 'color', 'linkHref'],
-    },
-  },
-  propertyOrder: [
-    'baseStyle',
-    'layoutStyle',
-    'titleStyle',
-    'numberStyle',
-    'numberTitleStyle',
-  ],
-  lastUpdateTime: 1769497373733,
-};

package/template/neo-bi-cmps/src/components/targetNumber__c/customStyleConfig/index.scss

@@ -1,76 +0,0 @@
-.properties-panel-custom-style-config {
-  .custom-style-config-input-container {
-    display: flex;
-    flex-direction: row !important;
-    align-items: center;
-    gap: 0;
-
-    .custom-style-config-input {
-      flex: 1;
-      height: 35px;
-      padding: 4px 11px;
-      border: 1px solid #d9d9d9;
-      // border-right: none;
-      border-radius: 2px 0 0 2px;
-      background: var(--background-light);
-      color: #262626;
-      transition: all 0.2s ease;
-      cursor: not-allowed;
-
-      &::placeholder {
-        color: #aaaaaa;
-      }
-
-      &:focus {
-        box-shadow: none;
-        border-color: #d9d9d9;
-      }
-
-      &.ant-input-disabled {
-        color: var(--font-secondary);
-        cursor: not-allowed;
-        background: #f5f5f5;
-      }
-
-      &[readonly] {
-        cursor: not-allowed;
-        background: #fafafa;
-      }
-    }
-
-    .custom-style-config-setting-btn {
-      flex-shrink: 0;
-      width: 35px;
-      height: 35px;
-      padding: 0;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      border: 1px solid #d9d9d9;
-      // border-left: none;
-      border-radius: 0 2px 2px 0;
-      background: var(--background-light);
-      cursor: pointer;
-      transition: all 0.2s ease;
-      margin-left: 0;
-
-      &:hover:not(:disabled) {
-        border-color: #40a9ff;
-        color: #40a9ff;
-      }
-
-      &:disabled {
-        color: var(--font-secondary);
-        border-color: #d9d9d9;
-        background: #f5f5f5;
-        cursor: not-allowed;
-      }
-    }
-  }
-}
-
-.custom-style-config-modal-content {
-  min-height: 400px;
-  max-height: 600px;
-  overflow-y: auto;
-}

package/template/neo-bi-cmps/src/components/targetNumber__c/customStyleConfig/index.tsx

@@ -1,148 +0,0 @@
-// @ts-ignore
-import { FormItem, RendererProps } from 'amis';
-import React from 'react';
-import { Input, Button, Modal, message } from 'antd';
-import { SettingOutlined } from '@ant-design/icons';
-// @ts-ignore
-import JSONEditor from '@wibetter/json-editor';
-import '@wibetter/json-editor/lib/index.css';
-
-import { configSchema } from './configSchema';
-import './index.scss';
-
-interface ICustomStyleConfigProps {
-  onChange?: Function;
-  value?: any;
-  name: string;
-}
-
-interface ICustomStyleConfigState {
-  isModalVisible: boolean;
-  editorValue: any;
-}
-
-@FormItem({
-  type: 'customStyleConfig',
-  detectProps: ['data'],
-})
-export default class CustomStyleConfigRenderer extends React.Component<
-  RendererProps & ICustomStyleConfigProps,
-  ICustomStyleConfigState
-> {
-  constructor(props: RendererProps & ICustomStyleConfigProps) {
-    super(props);
-
-    this.state = {
-      isModalVisible: false,
-      editorValue: props.value || {},
-    };
-
-    this.showModal = this.showModal.bind(this);
-    this.handleModalOk = this.handleModalOk.bind(this);
-    this.handleModalCancel = this.handleModalCancel.bind(this);
-    this.handleEditorChange = this.handleEditorChange.bind(this);
-  }
-
-  handleEditorChange = (value: any) => {
-    this.setState({ editorValue: value });
-  };
-
-  handleModalOk = () => {
-    const { editorValue } = this.state;
-    const { onChange } = this.props;
-
-    try {
-      onChange && onChange(editorValue);
-      this.setState({ isModalVisible: false });
-    } catch (error) {
-      message.error('保存配置失败');
-    }
-  };
-
-  handleModalCancel = () => {
-    // 取消时恢复原始值
-    const value = this.props.value || {};
-    this.setState({
-      isModalVisible: false,
-      editorValue: value,
-    });
-  };
-
-  showModal = () => {
-    const value = this.props.value || {};
-    this.setState({
-      isModalVisible: true,
-      editorValue: value,
-    });
-  };
-
-  getDisplayValue = () => {
-    const { value } = this.props;
-
-    if (!value || Object.keys(value).length === 0) {
-      return '';
-    }
-
-    return '已配置自定义样式';
-  };
-
-  render() {
-    const { disabled, viewStyle, wideScreen, value } = this.props;
-    const { isModalVisible } = this.state;
-    console.log('customStyleConfig:', this.props);
-    console.log('test1:', this.props.data['__NeoPageInfo']);
-
-    return (
-      <div className="properties-panel-custom-style-config">
-        <div className="custom-style-config-input-container">
-          <Input
-            value={this.getDisplayValue()}
-            placeholder="请配置自定义样式"
-            disabled={disabled}
-            readOnly
-            className="custom-style-config-input"
-          />
-          <Button
-            type="text"
-            icon={<SettingOutlined />}
-            onClick={this.showModal}
-            disabled={disabled}
-            className="custom-style-config-setting-btn"
-          />
-        </div>
-        <Modal
-          title="自定义样式配置"
-          visible={isModalVisible}
-          onOk={this.handleModalOk}
-          onCancel={this.handleModalCancel}
-          width={800}
-          centered={true}
-          okText="确定"
-          cancelText="取消"
-          destroyOnClose={false}
-        >
-          <div className="custom-style-config-modal-content">
-            {isModalVisible && (
-              <JSONEditor
-                schemaData={configSchema}
-                jsonData={value}
-                onChange={this.handleEditorChange}
-                viewStyle={viewStyle || 'tabs'}
-                tabPosition="left"
-                wideScreen={wideScreen ?? false}
-              />
-            )}
-          </div>
-        </Modal>
-      </div>
-    );
-  }
-}
-
-/*
-// 通过 普通方式进行
-FormItem({
-  type: 'customStyleConfig',
-  detectProps: ['data'],
-})(CustomStyleConfigRenderer);
-*/