gt_client_pad/src/pages/SmartOps/predictionAnalysis/PredictionAnalysis.js

import { RightOutlined } from '@ant-design/icons';
import SubTitle from '../components/SubTitle';
import styles from './PredictionAnalysis.less';

const UFList = [
  { label: '超滤模组A (UF-4001A)' },
  { label: '超滤模组A (UF-4001B)' },
  { label: '超滤模组A (UF-4001C)' },
  { label: '超滤模组A (UF-4001D)' },
];

const PredictionAnalysis = () => {
  return (
    <>
      <div className="card-box" style={{ padding: '0.2rem' }}>
        <SubTitle title="超滤工艺单元" />
        {UFList.map((item, index) => {
          return (
            <div
              key={item.label}
              className={styles.itemContainer}
              onClick={() => {
                console.log(index);
              }}
            >
              <div>{item.label}</div>
              <div className={styles.toDetail}>
                预测分析
                <RightOutlined
                  style={{ marginLeft: '0.1rem', color: 'gray' }}
                />
              </div>
            </div>
          );
        })}
      </div>
    </>
  );
};

export default PredictionAnalysis;