neo-cmp-cli 1.13.16 → 1.13.18

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

@@ -1,158 +0,0 @@
-/**
- * @file 预测看板图表组件
- * @description 展示预测数据的堆叠柱状图，包含Closed、Commit、Best Case、Pipeline等
- */
-import * as React from 'react';
-// @ts-ignore
-import { BaseCmp, StatusHoc, NeoEvent } from 'neo-ui-common';
-
-import './style.scss';
-
-interface ChartColumn {
-  label: string;
-  value: string;
-  height: number;
-  color: string;
-}
-
-interface ForecastChartProps {
-  title?: string;
-  quotaValue?: string;
-  forecastValue?: string;
-  aiValue?: string;
-  columns?: ChartColumn[];
-  showAiButton?: boolean;
-  className?: string;
-  style?: React.CSSProperties;
-}
-
-interface ForecastChartState {
-  loading: boolean;
-}
-
-class ForecastChart extends BaseCmp<ForecastChartProps, ForecastChartState> {
-  constructor(props: ForecastChartProps) {
-    super(props);
-    this.state = {
-      loading: false,
-    };
-  }
-
-  componentDidMount() {
-    console.log('ForecastChart 组件挂载');
-  }
-
-  getScaleHeight = (value: string, max: string): number => {
-    const numValue = parseFloat(value.replace(/[$,M]/g, ''));
-    const numMax = parseFloat(max.replace(/[$,M]/g, ''));
-    if (isNaN(numValue) || isNaN(numMax) || numMax === 0) return 0;
-    return (numValue / numMax) * 100;
-  };
-
-  render() {
-    const {
-      title = 'Forecast Overview',
-      quotaValue = '$10M',
-      forecastValue = '$7.5M',
-      aiValue = '$6.8M',
-      columns = [],
-      showAiButton = true,
-      className,
-      style,
-    } = this.props;
-
-    const maxValue = 10; // 默认最大值 $10M
-    const chartHeight = 190; // 总高度
-    const gridLineHeight = chartHeight * 0.8; // 网格区域高度
-
-    // 计算Quota、Forecast、AI基准线位置
-    const quotaPos = 0; // 顶部
-    const forecastPos = this.getScaleHeight(forecastValue, quotaValue);
-    const aiPos = this.getScaleHeight(aiValue, quotaValue);
-
-    return (
-      <div className={`forecast-chart__c ${className || ''}`} style={style}>
-        <div className="chart-header">
-          <h3 className="chart-title">{title}</h3>
-          {showAiButton && (
-            <span
-              className="ai-btn"
-              onClick={() => console.log('AI Analysis clicked')}
-              title="AI Analysis"
-            >
-              ✨
-            </span>
-          )}
-        </div>
-
-        <div className="chart-content">
-          <div className="chart-y-axis">
-            <span>$10M</span>
-            <span>$8M</span>
-            <span>$6M</span>
-            <span>$4M</span>
-            <span>$2M</span>
-            <span>$0</span>
-          </div>
-
-          <div className="chart-main">
-            {/* 网格线 */}
-            <div className="chart-grid">
-              <div style={{ top: '0%' }} />
-              <div style={{ top: '20%' }} />
-              <div style={{ top: '40%' }} />
-              <div style={{ top: '60%' }} />
-              <div style={{ top: '80%' }} />
-              <div style={{ top: '100%' }} />
-            </div>
-
-            {/* Quota基准线 */}
-            <div className="chart-quota-line" style={{ top: `${quotaPos}%` }}>
-              <span className="quota-label">Quota: {quotaValue}</span>
-            </div>
-
-            {/* Forecast基准线 */}
-            <div
-              className="chart-forecast-line"
-              style={{ top: `${forecastPos}%` }}
-            >
-              <span className="forecast-label">Forecast {forecastValue}</span>
-            </div>
-
-            {/* AI基准线 */}
-            <div className="chart-ai-line" style={{ top: `${aiPos}%` }}>
-              <span className="ai-label">✨ AI {aiValue}</span>
-            </div>
-
-            {/* 柱状图 */}
-            <div className="chart-bars">
-              {columns.map((col, index) => {
-                const heightPercent = this.getScaleHeight(
-                  col.value,
-                  quotaValue,
-                );
-                return (
-                  <div key={index} className="chart-bar">
-                    <span className="bar-value" style={{ color: col.color }}>
-                      {col.value}
-                    </span>
-                    <div
-                      className="bar-column"
-                      style={{
-                        height: `${(heightPercent / 100) * gridLineHeight}px`,
-                        backgroundColor: col.color,
-                      }}
-                    />
-                    <span className="bar-label">{col.label}</span>
-                  </div>
-                );
-              })}
-            </div>
-          </div>
-        </div>
-      </div>
-    );
-  }
-}
-
-export default StatusHoc(ForecastChart);

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

@@ -1,40 +0,0 @@
-export class ForecastChartModel {
-  label: string = '预测看板图表';
-  description: string =
-    '展示预测数据的堆叠柱状图，包含Closed、Commit、Best Case、Pipeline等';
-  iconUrl: string = 'https://custom-widgets.bj.bcebos.com/forecastChart.svg';
-  targetPage: string[] = ['all'];
-  targetDevice: string = 'all';
-
-  defaultComProps = {
-    title: 'Forecast Overview',
-    quotaValue: '$10M',
-    forecastValue: '$7.5M',
-    aiValue: '$6.8M',
-    columns: [
-      { label: 'Closed', value: '$3.2M', height: 61, color: '#3b82f6' },
-      { label: 'Commit', value: '$2.5M', height: 47, color: '#22c55e' },
-      { label: 'Best Case', value: '$1.8M', height: 34, color: '#10b981' },
-      { label: 'Pipeline', value: '$2.5M', height: 47, color: '#93c5fd' },
-    ],
-    showAiButton: true,
-  };
-
-  functions = [
-    {
-      apiKey: 'refreshData',
-      label: '刷新数据',
-      helpTextKey: '刷新预测图表数据',
-    },
-  ];
-
-  propsSchema = [
-    {
-      type: 'string',
-      name: 'title',
-      label: '标题',
-    },
-  ];
-}
-
-export default ForecastChartModel;

package/template/neo-bi-cmps/src/components/forecastChart__c/style.scss

@@ -1,154 +0,0 @@
-.forecast-chart__c {
-  background: #fff;
-  border-radius: 8px;
-  padding: 20px;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
-
-  .chart-header {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    margin-bottom: 16px;
-  }
-
-  .chart-title {
-    font-size: 14px;
-    font-weight: 600;
-    margin: 0;
-  }
-
-  .ai-btn {
-    cursor: pointer;
-    font-size: 16px;
-    transition: transform 0.2s;
-
-    &:hover {
-      transform: scale(1.1);
-    }
-  }
-
-  .chart-content {
-    display: flex;
-    gap: 16px;
-    flex: 1;
-    align-items: flex-end;
-    height: 220px;
-  }
-
-  .chart-y-axis {
-    width: 50px;
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    align-items: flex-end;
-    padding-right: 8px;
-    font-size: 11px;
-    color: #999;
-  }
-
-  .chart-main {
-    flex: 1;
-    position: relative;
-    padding: 16px 16px 40px 0;
-  }
-
-  .chart-grid {
-    position: absolute;
-    left: 0;
-    right: 0;
-    top: 20px;
-    bottom: 50px;
-
-    div {
-      position: absolute;
-      width: 100%;
-      border-top: 1px solid #eee;
-    }
-  }
-
-  .chart-quota-line {
-    position: absolute;
-    left: 0;
-    right: 0;
-    border-top: 2.5px solid #22c55e;
-    z-index: 5;
-
-    .quota-label {
-      position: absolute;
-      top: -18px;
-      left: 0;
-      font-size: 11px;
-      background: #22c55e;
-      color: #fff;
-      padding: 1px 8px;
-      border-radius: 3px;
-    }
-  }
-
-  .chart-forecast-line {
-    position: absolute;
-    left: 0;
-    right: 0;
-    border-top: 2px solid #8b5cf6;
-    z-index: 5;
-
-    .forecast-label {
-      position: absolute;
-      top: -16px;
-      right: 0;
-      font-size: 10px;
-      color: #8b5cf6;
-    }
-  }
-
-  .chart-ai-line {
-    position: absolute;
-    left: 0;
-    right: 0;
-    border-top: 2px dashed #a78bfa;
-    z-index: 5;
-
-    .ai-label {
-      position: absolute;
-      top: -16px;
-      right: 80px;
-      font-size: 10px;
-      color: #a78bfa;
-    }
-  }
-
-  .chart-bars {
-    position: absolute;
-    left: 0;
-    right: 0;
-    top: 20px;
-    bottom: 50px;
-    display: flex;
-    align-items: flex-end;
-    gap: 0;
-  }
-
-  .chart-bar {
-    flex: 0 0 60px;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-  }
-
-  .bar-value {
-    font-size: 11px;
-    font-weight: 600;
-    margin-bottom: 4px;
-  }
-
-  .bar-column {
-    width: 50px;
-    border-radius: 4px 4px 0 0;
-  }
-
-  .bar-label {
-    font-size: 10px;
-    color: #666;
-    margin-top: 6px;
-  }
-}

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

@@ -1,36 +0,0 @@
-# ForecastGrid 组件
-
-预测矩阵表格组件，展示预测矩阵数据。
-
-## 使用方式
-
-```tsx
-import ForecastGrid from './components/forecastGrid__c';
-
-<ForecastGrid
-  title="Forecast Grid"
-  rows={[
-    { name: 'Alice', quota: '$3,000,000', aiForecast: '$2,400,000', closed: '$1,200,000', commit: '$1,800,000', bestCase: '$2,500,000', pipeline: '$8,400,000', coverage: '2.8x' },
-  ]}
-/>
-```
-
-## Props
-
-| 属性 | 说明 | 类型 | 默认值 |
-|------|------|------|--------|
-| title | 标题 | string | 'Forecast Grid' |
-| rows | 表格数据 | ForecastRow[] | [] |
-
-## ForecastRow
-
-| 属性 | 说明 | 类型 |
-|------|------|------|
-| name | 名称 | string |
-| quota | Quota | string |
-| aiForecast | AI预测 | string |
-| closed | 已关闭 | string |
-| commit | 提交 | string |
-| bestCase | 最佳情况 | string |
-| pipeline | 管道 | string |
-| coverage | 覆盖率 | string |

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

@@ -1,86 +0,0 @@
-/**
- * @file 预测矩阵表格组件
- * @description 展示预测矩阵数据，包含Quota、AI Forecast、Closed、Commit、Best Case、Pipeline等
- */
-import * as React from 'react';
-// @ts-ignore
-import { BaseCmp, StatusHoc, NeoEvent } from 'neo-ui-common';
-
-import './style.scss';
-
-interface ForecastRow {
-  name: string;
-  quota: string;
-  aiForecast: string;
-  closed: string;
-  commit: string;
-  bestCase: string;
-  pipeline: string;
-  coverage: string;
-}
-
-interface ForecastGridProps {
-  title?: string;
-  rows?: ForecastRow[];
-  className?: string;
-  style?: React.CSSProperties;
-}
-
-interface ForecastGridState {
-  loading: boolean;
-}
-
-class ForecastGrid extends BaseCmp<ForecastGridProps, ForecastGridState> {
-  constructor(props: ForecastGridProps) {
-    super(props);
-    this.state = {
-      loading: false,
-    };
-  }
-
-  componentDidMount() {
-    console.log('ForecastGrid 组件挂载');
-  }
-
-  render() {
-    const { title = 'Forecast Grid', rows = [], className, style } = this.props;
-
-    return (
-      <div className={`forecast-grid__c ${className || ''}`} style={style}>
-        <h3 className="grid-title">{title}</h3>
-        <div className="table-wrapper">
-          <table className="grid-table">
-            <thead>
-              <tr>
-                <th>Name</th>
-                <th style={{ textAlign: 'right' }}>Quota</th>
-                <th style={{ textAlign: 'right' }}>✨ AI Forecast</th>
-                <th style={{ textAlign: 'right' }}>Closed</th>
-                <th style={{ textAlign: 'right' }}>Commit</th>
-                <th style={{ textAlign: 'right' }}>Best Case</th>
-                <th style={{ textAlign: 'right' }}>Pipeline</th>
-                <th style={{ textAlign: 'right' }}>Coverage</th>
-              </tr>
-            </thead>
-            <tbody>
-              {rows.map((row, index) => (
-                <tr key={index}>
-                  <td style={{ textAlign: 'left' }}>{row.name}</td>
-                  <td style={{ textAlign: 'right' }}>{row.quota}</td>
-                  <td style={{ textAlign: 'right' }}>{row.aiForecast}</td>
-                  <td style={{ textAlign: 'right' }}>{row.closed}</td>
-                  <td style={{ textAlign: 'right' }}>{row.commit}</td>
-                  <td style={{ textAlign: 'right' }}>{row.bestCase}</td>
-                  <td style={{ textAlign: 'right' }}>{row.pipeline}</td>
-                  <td style={{ textAlign: 'right' }}>{row.coverage}</td>
-                </tr>
-              ))}
-            </tbody>
-          </table>
-        </div>
-      </div>
-    );
-  }
-}
-
-export default StatusHoc(ForecastGrid);

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

@@ -1,62 +0,0 @@
-export class ForecastGridModel {
-  label: string = '预测矩阵表格';
-  description: string =
-    '展示预测矩阵数据，包含Quota、AI Forecast、Closed、Commit、Best Case、Pipeline等';
-  iconUrl: string = 'https://custom-widgets.bj.bcebos.com/forecastGrid.svg';
-  targetPage: string[] = ['all'];
-  targetDevice: string = 'all';
-
-  defaultComProps = {
-    title: 'Forecast Grid',
-    rows: [
-      {
-        name: 'Alice',
-        quota: '$3,000,000',
-        aiForecast: '$2,400,000',
-        closed: '$1,200,000',
-        commit: '$1,800,000',
-        bestCase: '$2,500,000',
-        pipeline: '$8,400,000',
-        coverage: '2.8x',
-      },
-      {
-        name: 'Steve',
-        quota: '$3,500,000',
-        aiForecast: '$2,800,000',
-        closed: '$800,000',
-        commit: '$2,200,000',
-        bestCase: '$3,000,000',
-        pipeline: '$10,850,000',
-        coverage: '3.1x',
-      },
-      {
-        name: 'Chloe',
-        quota: '$3,500,000',
-        aiForecast: '$1,600,000',
-        closed: '$1,200,000',
-        commit: '$1,500,000',
-        bestCase: '$2,300,000',
-        pipeline: '$8,750,000',
-        coverage: '2.5x',
-      },
-    ],
-  };
-
-  functions = [
-    {
-      apiKey: 'refreshData',
-      label: '刷新数据',
-      helpTextKey: '刷新预测矩阵数据',
-    },
-  ];
-
-  propsSchema = [
-    {
-      type: 'string',
-      name: 'title',
-      label: '标题',
-    },
-  ];
-}
-
-export default ForecastGridModel;

package/template/neo-bi-cmps/src/components/forecastGrid__c/style.scss

@@ -1,48 +0,0 @@
-.forecast-grid__c {
-  background: #fff;
-  border-radius: 8px;
-  padding: 20px;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
-  overflow-x: auto;
-
-  .grid-title {
-    font-size: 14px;
-    font-weight: 600;
-    margin-bottom: 12px;
-  }
-
-  .table-wrapper {
-    overflow-x: auto;
-  }
-
-  .grid-table {
-    width: 100%;
-    border-collapse: collapse;
-    font-size: 13px;
-
-    th,
-    td {
-      padding: 10px 12px;
-      border-bottom: 1px solid #f0f0f0;
-    }
-
-    th {
-      background: #f8f9fa;
-      font-weight: 600;
-      color: #333;
-      border-bottom: 2px solid #e5e7eb;
-    }
-
-    td {
-      color: #333;
-    }
-
-    tbody tr {
-      transition: background 0.15s;
-
-      &:hover {
-        background: #fafafa;
-      }
-    }
-  }
-}

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

@@ -1,24 +0,0 @@
-# GapCloser 组件
-
-Gap Closer组件，展示Rescue Commit和Upgrade Candidates两类卡片。
-
-## 使用方式
-
-```tsx
-import GapCloser from './components/gapCloser__c';
-
-<GapCloser
-  cards={[
-    { type: 'rescue', title: 'Rescue Commit', amount: '$1,200,000', dealCount: 3, description: '...' },
-    { type: 'upgrade', title: 'Upgrade Candidates', amount: '$2,500,000', dealCount: 4, description: '...' },
-  ]}
-  onViewDeals={(type) => console.log('View deals:', type)}
-/>
-```
-
-## Props
-
-| 属性 | 说明 | 类型 | 默认值 |
-|------|------|------|--------|
-| cards | Gap卡片数据 | GapCloserCard[] | [] |
-| onViewDeals | 查看商机回调 | (type: 'rescue' \| 'upgrade') => void | - |