+ {/* 头部 */}
+
+
+
+
+ {/* 账号列表 */}
+ {title}
+ } + onClick={onClose} + className={style.accountModalClose} + /> +
+ {loading ? (
+
+
+ {/* 底部统计 */}
+
+
+ ) : accounts.length > 0 ? (
+ accounts.map((account, index) => (
+
+ 正在加载账号列表...
+
+
+
+ ))
+ ) : (
+
+
+
+
+
+ {account.userinfo.nickname ||
+ account.userinfo.alias ||
+ `账号${account.id}`}
+
+
+ {account.userinfo.wechatId || "未绑定微信号"}
+
+
+
+
+ {getStatusText(account.status)}
+
+
+
+
+ )}
+ 暂无账号数据
+
+
+
+ 共 {accounts.length} 个账号
+
+
+ {/* 头部 */}
+
+
+
+
+ {/* 设备列表 */}
+ {title}
+ } + onClick={onClose} + className={style.deviceModalClose} + /> +
+ {loading ? (
+
+
+ {/* 底部统计 */}
+
+
+ ) : devices.length > 0 ? (
+ devices.map((device, index) => (
+ 正在加载设备列表...
+
+ {/* 顶部行：IMEI */}
+
+ ))
+ ) : (
+
+
+ IMEI: {device.imei?.toUpperCase() || "-"}
+
+
+
+ {/* 主要内容区域：头像和详细信息 */}
+
+ {/* 头像 */}
+
+
+ {device.avatar ? (
+ 
+ ) : (
+
+ {(device.memo || device.wechatId || "设")[0]}
+
+ )}
+
+
+ {/* 设备信息 */}
+
+
+
+
+
+ + {device.memo || "未命名设备"} +
+ + {getStatusText(device.status)} + +
+
+
+ 微信号:
+
+ {device.wechatId || "未绑定"}
+
+
+
+ 好友数:
+
+ {device.totalFriend ?? "-"}
+
+
+
+
+ )}
+ 暂无设备数据
+
+
+
+ 共 {devices.length} 个设备
+
+
+ {/* 头部 */}
+
+
+
+
+ {/* 账号列表 */}
+ {title}
+ } + onClick={onClose} + className={style.accountModalClose} + /> +
+ {loading ? (
+
+
+ {/* 底部统计 */}
+
+
+ ) : accounts.length > 0 ? (
+ accounts.map((account, index) => (
+
+ 正在加载账号列表...
+
+
+
+ ))
+ ) : (
+
+
+
+
+
+ {account.userinfo.nickname ||
+ account.userinfo.alias ||
+ `账号${account.id}`}
+
+
+ {account.userinfo.wechatId || "未绑定微信号"}
+
+
+
+
+ {getStatusText(account.status)}
+
+
+
+
+ )}
+ 暂无账号数据
+
+
+
+ 共 {accounts.length} 个账号
+
+
+ {/* 头部 */}
+
+
+
+
+ {/* 统计数据表格 */}
+ {title}
+ } + onClick={onClose} + className={style.poolModalClose} + /> +
+ {loading ? (
+
+
+ {/* 趋势图占位 */}
+
+
+ ) : (
+
+ 正在加载统计数据...
+
+
+
+ )}
+
+
+ 总计
+
+ {statistics.totalAll}
+
+
+
+ 扫码
+
+ {statistics.totalError}
+
+
+
+ 成功
+
+ {statistics.totalSuccess}
+
+
+
+ 失败
+
+ {statistics.totalError}
+
+
+
+ 通过
+
+ {statistics.totalPass}
+
+
+
+ 成功率
+
+ {statistics.totalSuccessRate}%
+
+
+
+ 通过率
+
+ {statistics.totalPassRate}%
+
+
+
+ 趋势图
+
+
+
-
+
{
+ e.stopPropagation(); // 阻止事件冒泡，避免触发卡片点击
+ handleShowDeviceList(task);
+ }}
+ >
- 设备数
{deviceCount(task)}
+
{
+ e.stopPropagation(); // 阻止事件冒泡，避免触发卡片点击
+ handleShowAccountList(task);
+ }}
+ >
- 已获客
{task?.acquiredCount || 0}
+
{
+ e.stopPropagation(); // 阻止事件冒泡，避免触发卡片点击
+ handleShowOreadyAdd(task);
+ }}
+ >
- 已添加
- {task.addedCount || 0}
+ {task.passCount || 0}
+ setShowDeviceList(false)}
+ ruleId={currentTask?.id ? parseInt(currentTask.id) : undefined}
+ ruleName={currentTask?.name}
+ />
+
+ {/* 账号列表弹窗 */}
+ setShowAccountList(false)}
+ ruleId={currentTask?.id ? parseInt(currentTask.id) : undefined}
+ ruleName={currentTask?.name}
+ />
+
+ {/* 已添加弹窗 */}
+ setShowOreadyAdd(false)}
+ ruleId={currentTask?.id ? parseInt(currentTask.id) : undefined}
+ ruleName={currentTask?.name}
+ />
+
+ {/* 通过率弹窗 */}
+ setShowPoolList(false)}
+ ruleId={currentTask?.id ? parseInt(currentTask.id) : undefined}
+ ruleName={currentTask?.name}
+ />
);
diff --git a/Cunkebao/src/utils/chartColors.ts b/Cunkebao/src/utils/chartColors.ts
new file mode 100644
index 00000000..6290fab9
--- /dev/null
+++ b/Cunkebao/src/utils/chartColors.ts
@@ -0,0 +1,67 @@
+// 预定义的颜色数组，确保颜色不重复且美观
+const CHART_COLORS = [
+ "#1677ff", // 蓝色
+ "#52c41a", // 绿色
+ "#fa8c16", // 橙色
+ "#eb2f96", // 粉色
+ "#722ed1", // 紫色
+ "#13c2c2", // 青色
+ "#fa541c", // 红色
+ "#2f54eb", // 深蓝色
+ "#faad14", // 黄色
+ "#a0d911", // 青绿色
+ "#f5222d", // 红色
+ "#1890ff", // 天蓝色
+ "#52c41a", // 绿色
+ "#fa8c16", // 橙色
+ "#eb2f96", // 粉色
+];
+
+/**
+ * 获取图表颜色
+ * @param index 颜色索引
+ * @returns 颜色值
+ */
+export const getChartColor = (index: number): string => {
+ return CHART_COLORS[index % CHART_COLORS.length];
+};
+
+/**
+ * 获取多个图表颜色
+ * @param count 需要的颜色数量
+ * @returns 颜色数组
+ */
+export const getChartColors = (count: number): string[] => {
+ return Array.from({ length: count }, (_, index) => getChartColor(index));
+};
+
+/**
+ * 获取随机图表颜色
+ * @returns 随机颜色值
+ */
+export const getRandomChartColor = (): string => {
+ const randomIndex = Math.floor(Math.random() * CHART_COLORS.length);
+ return CHART_COLORS[randomIndex];
+};
+
+/**
+ * 获取渐变色数组
+ * @param baseColor 基础颜色
+ * @param count 渐变数量
+ * @returns 渐变色数组
+ */
+export const getGradientColors = (
+ baseColor: string,
+ count: number,
+): string[] => {
+ // 这里可以实现颜色渐变逻辑
+ // 暂时返回相同颜色的数组
+ return Array.from({ length: count }, () => baseColor);
+};
+
+export default {
+ getChartColor,
+ getChartColors,
+ getRandomChartColor,
+ getGradientColors,
+};
{
+ e.stopPropagation(); // 阻止事件冒泡，避免触发卡片点击
+ handleShowPoolList(task);
+ }}
+ >
+
+ {/* 设备列表弹窗 */}
+ 通过率
{task.passRate}%
@@ -581,6 +631,38 @@ const ScenarioList: React.FC = () => {