neo-cmp-cli 1.12.7 → 1.12.9

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);
-*/

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

@@ -1,440 +0,0 @@
-/**
- * @file 数值指标组件
- * @description 基于 Neo 平台的 XObject 实体对象数值指标组件，用于展示多个关键数值指标
- */
-import * as React from 'react';
-// @ts-ignore
-import { xObject } from 'neo-open-api'; // Neo Open API
-
-// 引入 neo-ui-common / NeoEvent
-// @ts-ignore
-import { BaseCmp, StatusHoc, NeoEvent } from 'neo-ui-common';
-
-import './style.scss';
-
-interface EntityApiKey {
-  xObjectApiKey: string;
-  objectId: string;
-  fieldDescList?: any[];
-  fields?: string[];
-  autoFetchData?: boolean;
-}
-
-/**
- * 字段描述信息接口
- */
-interface FieldDesc {
-  value: string;
-  label: string;
-  type?: string;
-}
-
-/**
- * 自定义样式配置接口
- */
-interface TargetNumberStyle {
-  baseStyle?: {
-    backgroundColor?: string;
-    paddingMargin?: {
-      margin?: string;
-      padding?: string;
-      quantity?: string;
-    };
-  };
-  layoutStyle?: {
-    alignClass?: string;
-    legendOrient?: string;
-  };
-  titleStyle?: {
-    show?: boolean;
-    text?: string;
-    fontSize?: number;
-    fontWeight?: number;
-    color?: string;
-    backgroundColor?: string;
-  };
-  numberStyle?: {
-    fontSize?: number;
-    fontWeight?: number;
-    color?: string;
-    linkHref?: string;
-  };
-  numberTitleStyle?: {
-    fontSize?: number;
-    fontWeight?: number;
-    color?: string;
-    linkHref?: string;
-  };
-}
-
-/**
- * 组件属性接口
- */
-interface TargetNumberProps {
-  /** 实体对象的 API Key */
-  entityApiKey?: EntityApiKey;
-  /** 绑定的字段描述信息数组 */
-  selectFieldDesc?: FieldDesc[];
-  /** 自定义样式配置 */
-  targetNumberStyle?: TargetNumberStyle;
-  /** 数值格式化函数 */
-  formatter?: (value: any, fieldDesc?: FieldDesc) => string;
-  /** Neo 平台传递的数据 */
-  data?: any;
-  /** 组件类名 */
-  className?: string;
-}
-
-/**
- * 字段值接口
- */
-interface FieldValue {
-  fieldDesc: FieldDesc;
-  value: any;
-}
-
-/**
- * 组件状态接口
- */
-interface TargetNumberState {
-  recordData: any; // 数据列表
-  /** 当前字段值数组 */
-  targetNumbers: FieldValue[];
-  /** 加载状态 */
-  loading: boolean;
-  /** 错误信息 */
-  error: string | null;
-}
-
-/**
- * 数值指标组件
- * 用于展示多个关键数值指标，支持从 XObject 实体对象获取动态数据
- * 每个字段都会显示为一个独立的数值块，包含字段标签和数值
- */
-class TargetNumber extends BaseCmp<TargetNumberProps, TargetNumberState> {
-  constructor(props: TargetNumberProps) {
-    super(props);
-
-    // 初始化组件状态
-    this.state = {
-      recordData: {},
-      targetNumbers: [],
-      loading: false,
-      error: null,
-    };
-
-    // 绑定方法上下文
-    this.loadData = this.loadData.bind(this);
-  }
-
-  componentDidMount() {
-    const { entityApiKey, selectFieldDesc } = this.props;
-
-    if (entityApiKey && this.hasValidFieldDesc(selectFieldDesc)) {
-      // 加载数据
-      this.loadData();
-    }
-
-    // 监听一个广播事件
-    console.log('TargetNumber 注册了一个广播事件 SavePageEvent');
-    NeoEvent.listen('SavePageEvent', (eventData: any) => {
-      console.log(
-        'TargetNumber 监听到了一个广播事件 SavePageEvent: ',
-        eventData,
-      );
-    });
-  }
-
-  /**
-   * 检查字段描述是否有效
-   */
-  hasValidFieldDesc(selectFieldDesc?: FieldDesc[]): boolean {
-    return Array.isArray(selectFieldDesc);
-  }
-
-  componentWillReceiveProps(nextProps: TargetNumberProps) {
-    const { selectFieldDesc } = nextProps;
-    if (selectFieldDesc && this.hasValidFieldDesc(selectFieldDesc)) {
-      this.getTargetNumbers(selectFieldDesc);
-    }
-  }
-
-  /**
-   * 组件更新后执行
-   * 当 entityApiKey 或 selectFieldDesc 发生变化时重新加载数据
-   */
-  async componentDidUpdate(prevProps: TargetNumberProps) {
-    const { entityApiKey, selectFieldDesc } = this.props;
-    const { entityApiKey: prevEntityApiKey } = prevProps;
-
-    if (
-      entityApiKey?.xObjectApiKey !== prevEntityApiKey?.xObjectApiKey ||
-      entityApiKey?.objectId !== prevEntityApiKey?.objectId
-    ) {
-      if (entityApiKey?.xObjectApiKey && entityApiKey?.objectId) {
-        this.loadData();
-      } else {
-        this.setState({
-          recordData: {},
-          targetNumbers: [],
-          error: null,
-        });
-      }
-    }
-  }
-
-  /**
-   * 提取数值指标数据
-   * 根据配置的 selectFieldDesc 数组，提取数据列表中的字段值
-   */
-  getTargetNumbers(selectFieldDesc: FieldDesc[]) {
-    const { recordData } = this.state;
-
-    let fieldValues: FieldValue[] = [];
-    if (selectFieldDesc && selectFieldDesc.length > 0) {
-      fieldValues = selectFieldDesc.map((fieldDesc: FieldDesc) => ({
-        fieldDesc,
-        value: recordData[fieldDesc.value],
-      }));
-    }
-
-    this.setState({
-      targetNumbers: fieldValues,
-    });
-  }
-
-  /**
-   * 加载数据
-   * 从 Neo 平台获取 XObject 实体数据，直接使用查询结果的第一条记录
-   */
-  @NeoEvent.function
-  async loadData() {
-    const { entityApiKey, selectFieldDesc } = this.props;
-    this.setState({ loading: true, error: null });
-
-    try {
-      // 查询数据
-      const result = await xObject.get(entityApiKey);
-
-      if (result && result.status) {
-        const recordData = result.data || {};
-        let fieldValues: FieldValue[] = [];
-
-        if (selectFieldDesc && selectFieldDesc.length > 0) {
-          fieldValues = selectFieldDesc.map((fieldDesc) => ({
-            fieldDesc,
-            value: recordData[fieldDesc.value],
-          }));
-        }
-
-        this.setState({
-          recordData: recordData,
-          targetNumbers: fieldValues,
-          loading: false,
-        });
-      } else {
-        this.setState({
-          recordData: {},
-          error: result?.msg || '获取数据失败',
-          loading: false,
-        });
-      }
-    } catch (error: any) {
-      this.setState({
-        recordData: {},
-        error: error.message || '获取数据失败',
-        loading: false,
-      });
-    }
-  }
-
-  /**
-   * 格式化数值
-   */
-  formatValue(value: any, fieldDesc?: FieldDesc): string {
-    const { formatter } = this.props;
-
-    if (value === null || value === undefined) {
-      return '-';
-    }
-
-    // 如果提供了自定义格式化函数，使用自定义格式化
-    if (formatter) {
-      return formatter(value, fieldDesc);
-    }
-
-    // 根据字段类型进行格式化
-    if (
-      fieldDesc &&
-      (fieldDesc.type === 'number' || fieldDesc.type === 'currency')
-    ) {
-      // 数字类型，添加千分位
-      const numValue = Number(value);
-      if (!isNaN(numValue)) {
-        return numValue.toLocaleString('zh-CN');
-      }
-    }
-
-    return String(value);
-  }
-
-  /**
-   * 渲染组件
-   */
-  render() {
-    const { targetNumbers, loading, error } = this.state;
-    const { className, targetNumberStyle = {} } = this.props;
-
-    console.log('TargetNumber:', this.props);
-
-    // 从 targetNumberStyle 中获取样式配置
-    const {
-      baseStyle = {},
-      layoutStyle = {},
-      titleStyle: titleStyleConfig = {},
-      numberStyle: numberStyleConfig = {},
-      numberTitleStyle: numberTitleStyleConfig = {},
-    } = targetNumberStyle;
-
-    // 获取布局方式，默认为 flex-col
-    // 兼容 configSchema 中的值映射：horizontal -> flex-col
-    let alignClass = layoutStyle?.alignClass || 'flex-col';
-    if (alignClass === 'horizontal') {
-      alignClass = 'flex-col';
-    }
-
-    // 获取基础样式
-    const baseStyleObj: React.CSSProperties = {
-      backgroundColor: baseStyle?.backgroundColor || '#ffffff',
-    };
-
-    // 处理内外边距
-    const paddingMargin = baseStyle?.paddingMargin || {};
-    const margin = paddingMargin.margin || '0';
-    const padding = paddingMargin.padding || '0';
-    const quantity = paddingMargin.quantity || 'px';
-
-    // 应用单位到 margin 和 padding
-    const formatSpacing = (value: string, unit: string) => {
-      if (!value || value === '0') return '0';
-      // 如果值已经包含单位，直接返回；否则添加单位
-      if (/\d+(px|rem|em|%)$/.test(value.trim())) {
-        return value;
-      }
-      return `${value}${unit}`;
-    };
-
-    baseStyleObj.margin = formatSpacing(margin, quantity);
-    // 如果 padding 为 0，使用默认的 16px（保持原有样式）
-    const finalPadding =
-      padding === '0' ? '16px' : formatSpacing(padding, quantity);
-    baseStyleObj.padding = finalPadding;
-
-    // 数值样式
-    const numberStyle: React.CSSProperties = {
-      fontSize: numberStyleConfig?.fontSize
-        ? `${numberStyleConfig.fontSize}px`
-        : '32px',
-      fontWeight: numberStyleConfig?.fontWeight || 600,
-      color: numberStyleConfig?.color || '#262626',
-    };
-
-    // 数值标题样式（字段标签）
-    const numberTitleStyle: React.CSSProperties = {
-      fontSize: numberTitleStyleConfig?.fontSize
-        ? `${numberTitleStyleConfig.fontSize}px`
-        : '14px',
-      fontWeight: numberTitleStyleConfig?.fontWeight || 400,
-      color: numberTitleStyleConfig?.color || '#8c8c8c',
-    };
-
-    // 组件标题样式（根据 titleStyle 配置，仅当 show 为 true 时展示）
-    const showTitle = titleStyleConfig?.show === true;
-    const titleStyle: React.CSSProperties = {
-      fontSize:
-        titleStyleConfig?.fontSize != null
-          ? `${titleStyleConfig.fontSize}px`
-          : '24px',
-      fontWeight: titleStyleConfig?.fontWeight ?? 400,
-      color: titleStyleConfig?.color || '#000000',
-      backgroundColor: titleStyleConfig?.backgroundColor || '#eaf3fc',
-    };
-
-    // 渲染单个数值块
-    const renderFieldValue = (fieldValue: FieldValue, index: number) => {
-      const fieldLabel = fieldValue.fieldDesc?.label || '数值指标';
-      const formattedValue = this.formatValue(
-        fieldValue.value,
-        fieldValue.fieldDesc,
-      );
-
-      // 处理数值链接
-      const numberLinkHref = numberStyleConfig?.linkHref;
-      const numberContent = numberLinkHref ? (
-        <a
-          href={numberLinkHref}
-          style={{ ...numberStyle, textDecoration: 'none' }}
-        >
-          {formattedValue}
-        </a>
-      ) : (
-        formattedValue
-      );
-
-      // 处理标题链接
-      const titleLinkHref = numberTitleStyleConfig?.linkHref;
-      const titleContent = titleLinkHref ? (
-        <a
-          href={titleLinkHref}
-          style={{ ...numberTitleStyle, textDecoration: 'none' }}
-        >
-          {fieldLabel}
-        </a>
-      ) : (
-        fieldLabel
-      );
-
-      return (
-        <div key={index} className={`target-number-item ${alignClass}`}>
-          <div className="target-number-value" style={numberStyle}>
-            {numberContent}
-          </div>
-          <div className="target-number-label" style={numberTitleStyle}>
-            {titleContent}
-          </div>
-        </div>
-      );
-    };
-
-    return (
-      <div
-        className={`targetNumber__c ${className || ''}`}
-        style={baseStyleObj}
-      >
-        {showTitle && (titleStyleConfig?.text ?? '') !== '' && (
-          <div className="target-number-title" style={titleStyle}>
-            {titleStyleConfig?.text}
-          </div>
-        )}
-        <div className="target-number-block multiple-fields">
-          {loading ? (
-            <div className="target-number-loading">加载中...</div>
-          ) : error ? (
-            <div className="target-number-error">{error}</div>
-          ) : targetNumbers.length > 0 ? (
-            <div className="target-number-list">
-              {targetNumbers.map((fieldValue, index) =>
-                renderFieldValue(fieldValue, index),
-              )}
-            </div>
-          ) : (
-            <div className="target-number-empty">暂无数据</div>
-          )}
-        </div>
-      </div>
-    );
-  }
-}
-
-// 使用 StatusHoc 包裹组件，用于支持组件显示隐藏控制
-export default StatusHoc(TargetNumber);

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

@@ -1,128 +0,0 @@
-// 导入自定义配置项（用于对接复杂自定义配置）
-// import './customStyleConfig';
-
-/**
- * @file 数值指标组件对接编辑器的描述文件
- * @description 定义组件在 Neo 平台编辑器中的配置信息
- * @author Neo Custom Widget CLI
- * @version 1.0.0
- */
-export class TargetNumberModel {
-  /**
-   * 组件类型标识
-   * 用于标识组件的唯一性，在构建时根据当前组件目录名称自动生成
-   * 注意：此字段在构建时会被自动替换，不需要手动设置
-   */
-  // cmpType: string = 'targetNumber';
-
-  /** 组件名称，用于设置在编辑器左侧组件面板中展示的名称 */
-  label: string = '数值指标';
-
-  /** 组件描述，用于设置在编辑器左侧组件面板中展示的描述 */
-  description: string =
-    '用于展示关键数值指标，支持从 XObject 实体对象获取动态数据，支持绑定多个字段进行展示';
-
-  /** 分类标签，用于设置在编辑器左侧组件面板哪个分类中展示  */
-  // tags: string[] = ['自定义组件'];
-
-  /** 组件图标，用于设置在编辑器左侧组件面板中展示的图标 */
-  iconUrl: string = 'https://custom-widgets.bj.bcebos.com/TargetNumber.svg';
-
-  /**
-   * 用于设置组件支持的页面类型
-   *
-   * 当前 NeoCRM 平台存在的页面类型：
-   * all:	1	全页面
-   * entityFormPage:	4	实体表单页
-   * customPage:	6	自定义页面
-   */
-  targetPage: string[] = ['all'];
-
-  /**
-   * 用于设置组件支持的终端类型
-   *
-   * 当前 NeoCRM 平台存在的终端类型：
-   * web:	网页端
-   * mobile: 移动端
-   */
-  targetDevice: string = 'all';
-
-  /** 初次插入页面的默认属性数据 */
-  defaultComProps = {
-    entityApiKey: '',
-    targetNumberStyle: {
-      baseStyle: {
-        backgroundColor: '#ffffff',
-        paddingMargin: {
-          margin: '0',
-          padding: '0',
-        },
-      },
-      layoutStyle: {
-        alignClass: 'flex-col',
-      },
-      titleStyle: {
-        show: true,
-        text: '>> 关键数据',
-        fontSize: 18,
-        fontWeight: 700,
-        color: '#333',
-        backgroundColor: '#eaf3fc',
-      },
-      numberStyle: {
-        fontSize: 32,
-        fontWeight: 600,
-        color: '#262626',
-      },
-      numberTitleStyle: {
-        fontSize: 14,
-        fontWeight: 400,
-        color: '#8c8c8c',
-      },
-    },
-  };
-
-  // 当前组件支持的函数列表（其他组件可触发当前组件的函数）
-  functions = [
-    {
-      apiKey: 'loadData',
-      label: '刷新BI看板数据',
-      helpTextKey: '刷新BI看板组件数据',
-    },
-  ];
-
-  /**
-   * 组件属性配置模式
-   * 支持静态配置：propsSchema，优先级比 propsSchemaCreator 低
-   * 定义组件在编辑器中可配置的属性
-   */
-  propsSchema = [
-    {
-      type: 'xObjectDetailApi',
-      name: 'entityApiKey',
-      label: '绑定实体业务数据',
-      placeholder: '绑定实体业务数据源',
-      disabledFieldSelect: true,
-      disabledAutoFetchData: true,
-    },
-    {
-      type: 'selectFieldDescApi',
-      name: 'selectFieldDesc',
-      xObjectApiKey: 'entityApiKey.xObjectApiKey',
-      mode: 'tags', // 多选，必填
-      label: '绑定字段',
-      placeholder: '请至少选择一个要显示的字段',
-    },
-    /*
-    {
-      type: 'customStyleConfig',
-      name: 'targetNumberStyle',
-      label: '自定义样式配置',
-      viewStyle: 'tabs', // 'tabs'、'fold'
-      wideScreen: false, // 是否开启宽屏展示模式
-    },
-    */
-  ];
-}
-
-export default TargetNumberModel;