1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
/*
* @Title:新产品动态
* @Author: hongmye
* @Date: 2023-12-26 18:34:42
*/
import React, { useMemo, useEffect, useState, memo } from 'react';
import { Tooltip, message } from 'antd';
import classNames from 'classnames';
import DataCarousel from '../DataCarousel';
import styles from './index.less';
const RightItem = props => {
const { listData, handToProduct } = props;
const toPage = row => {
if (row.ID === 0) return;
if (!row['产品地址']) return message.warning('未配置产品地址，请联系管理人员');
if (!row['产品地址'].includes('https')) return message.warning('产品地址配置错误，请联系管理人员');
if (row['产品地址'] && row['产品地址'].includes('https')) {
handToProduct(row['产品地址'], row['产品名称'], row['产品名称']);
}
};
const renderRow = (row, index) => {
const rIndex = `r_${index % 6}`;
return (
<div
className={styles.r_list_item}
key={row['产品名称']}
name={row.ID === 0 ? '敬请期待' : ''}
rIndex={rIndex}
type={row['产品地址'] && row['产品地址'].includes('https') ? 'jump' : 'none'}
onClick={() => toPage(row)}
>
<div className={styles.r_list_item_title}>{row['产品名称']}</div>
<div className={styles.r_list_item_tip} />
</div>
);
};
return (
<div className={classNames(styles.right_item, 'right_item')}>
<div className={styles.r_title_wrap}>
<div className={styles.r_title_sub}>熊猫智慧水务</div>
<div className={styles.r_title}>新产品动态：</div>
</div>
<div className={styles.r_list}>
<DataCarousel
gap={1}
autoplay={5000}
itemHeight={350}
list={listData}
renderItem={renderRow}
config={{
loop: false,
slidesPerView: 6,
}}
/>
</div>
</div>
);
};
export default memo(RightItem);