deepvoice_client/lib/modules/agent/views/music_card.dart

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import '../../../routes/app_routes.dart';
import '../controllers/agent_controller.dart';
import '../widgets/circular_progress_button.dart';

/// 构建音乐项目
Widget buildMusicItem(
    BuildContext context, int id, String name, String singer, String image) {
  final controller = Get.find<AgentController>(); // 获取控制器
  final isDarkMode = Theme.of(context).brightness == Brightness.dark;
  Map<String, dynamic> song = {
    'id': id,
    'title': name,
    'artist': singer,
    'coverUrl': image,
  };

  return Container(
    padding: EdgeInsets.all(14.w),
    decoration: BoxDecoration(
      color: isDarkMode ? const Color(0xFF1E1E1E) : Colors.white,
      borderRadius: BorderRadius.circular(12.r),
      boxShadow: [
        BoxShadow(
          color: Colors.black.withValues(alpha: isDarkMode ? 0.2 : 0.03),
          blurRadius: 3,
          spreadRadius: 1,
          offset: const Offset(0, 1),
        ),
      ],
    ),
    child: Row(
      children: [
        Container(
          width: 50.w,
          height: 50.h,
          decoration: BoxDecoration(
            color: isDarkMode ? Colors.grey[800] : Colors.grey[100],
            borderRadius: BorderRadius.circular(8.r),
          ),
          child: Stack(
            children: [
              // 主图片
              Container(
                width: 50.w,
                height: 50.h,
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(8.r),
                  image: image.isNotEmpty
                      ? DecorationImage(
                          image: NetworkImage(image),
                          fit: BoxFit.cover,
                        )
                      : null,
                ),
                child: image.isEmpty
                    ? Icon(
                        Icons.music_note,
                        size: 18.sp,
                        color: Theme.of(context).primaryColor,
                      )
                    : null,
              ),
              // 右下角音乐图标
              if (image.isNotEmpty)
                Positioned(
                  right: 2.w,
                  bottom: 2.w,
                  child: Container(
                    width: 16.w,
                    height: 16.w,
                    // decoration: BoxDecoration(
                    //   color: Colors.white,
                    //   borderRadius: BorderRadius.circular(2.r),
                    //   boxShadow: [
                    //     BoxShadow(
                    //       color: Colors.black.withOpacity(0.2),
                    //       blurRadius: 1,
                    //       offset: const Offset(0, 0.5),
                    //     ),
                    //   ],
                    // ),
                    child: ClipRRect(
                      borderRadius: BorderRadius.circular(2.r),
                      child: Image.asset(
                        'assets/images/qqmusic.png',
                        fit: BoxFit.contain,
                      ),
                    ),
                  ),
                ),
            ],
          ),
        ),
        SizedBox(width: 12.w),
        Expanded(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                name,
                style: TextStyle(
                  fontSize: 13.sp,
                  fontWeight: FontWeight.w500,
                  color: isDarkMode
                      ? Colors.white.withValues(alpha: 0.9)
                      : Colors.grey[800],
                ),
                overflow: TextOverflow.ellipsis,
              ),
              SizedBox(height: 2.h),
              Text(
                singer,
                style: TextStyle(
                  fontSize: 12.sp,
                  color: isDarkMode ? Colors.grey[400] : Colors.grey[600],
                ),
                overflow: TextOverflow.ellipsis,
              ),
            ],
          ),
        ),
        Obx(() {
          final isThisPlaying =
              controller.isPlaying.value && controller.currentId.value == id;

          // 只有当前播放的歌曲才显示进度
          final currentProgress =
              isThisPlaying ? controller.progress.value : 0.0;

          return CircularProgressButton(
            isPlaying: isThisPlaying,
            progress: currentProgress,
            primaryColor: Theme.of(context).primaryColor,
            backgroundColor: Colors.grey,
            size: 36.0,
            strokeWidth: 2.0,
            onPlayPause: () async {
              try {
                if (controller.isPlaying.value) {
                  if (controller.currentId.value == id) {
                    // 当前歌曲正在播放，暂停它
                    await controller.musicPause();
                  } else {
                    // 其他歌曲正在播放，播放这首歌
                    await controller.musicPlay(song);
                  }
                } else {
                  if (controller.currentId.value == id) {
                    // 当前歌曲已暂停，恢复播放
                    await controller.musicResume();
                  } else {
                    // 播放新歌曲
                    await controller.musicPlay(song);
                  }
                }
              } catch (e) {
                // 静默处理错误，避免影响用户体验
              }
            },
            onSeek: isThisPlaying
                ? (seekProgress) {
                    // 只有当前播放的歌曲才允许跳转
                    final targetPosition =
                        (controller.duration.value * seekProgress).round();
                    controller.seekToPosition(targetPosition);
                  }
                : null,
          );
        }),
      ],
    ),
  );
}

/// 构建音乐内容卡片
Widget buildMusicContent(
    BuildContext context, List<Map<String, dynamic>> playlist) {
  final isDarkMode = Theme.of(context).brightness == Brightness.dark;
  final controller = Get.find<AgentController>(); // 获取控制器
  controller.updateCurrentPlaylistContext(playlist, controller.currentId.value);
  return Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      Text(
        'recommendedMusic'.tr, //以下是一些推荐的音乐:
        style: TextStyle(
          color:
              isDarkMode ? Colors.white.withValues(alpha: 0.9) : Colors.black87,
          fontSize: 14,
          height: 1.4,
          fontWeight: FontWeight.w400,
        ),
      ),
      const SizedBox(height: 12),
      Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              Container(
                width: 18.w,
                height: 18.w,
                child: Image.asset(
                  'assets/images/qqmusic.png',
                  fit: BoxFit.contain,
                ),
              ),
              const SizedBox(width: 6),
              Text(
                'playList'.tr, //播放列表
                style: TextStyle(
                  fontSize: 13,
                  fontWeight: FontWeight.w600,
                  color: Theme.of(context).brightness == Brightness.dark
                      ? Colors.grey[300]
                      : Colors.grey[700],
                ),
              ),
            ],
          ),
          const SizedBox(height: 10),

          // 动态生成音乐条目
          ...playlist.asMap().entries.take(4).map((entry) {
            final index = entry.key;
            final item = entry.value;
            final id = item["id"];
            final name = item["name"] ?? "未知歌曲";
            final singer = item["singer"] ?? "未知歌手";
            final image = item["image"] ?? "";
            return Column(
              children: [
                buildMusicItem(context, id, name, singer, image),
                if (index != playlist.length - 1)
                  Divider(
                    height: 1,
                    thickness: 1,
                    color: Theme.of(context).brightness == Brightness.dark
                        ? Colors.grey[800]
                        : Colors.grey[100],
                  ),
              ],
            );
          }).toList(),
          const SizedBox(height: 8),
          Center(
            child: TextButton(
              onPressed: () {
                // 跳转到完整歌单页面，传递完整的歌单数据
                Get.toNamed(Routes.musicPlaylist, arguments: playlist);
              },
              style: TextButton.styleFrom(
                minimumSize: Size.zero,
                padding:
                    const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
                tapTargetSize: MaterialTapTargetSize.shrinkWrap,
              ),
              child: Text(
                'moreMusic'.tr, //更多音乐,
                style: TextStyle(
                  fontSize: 12,
                  color: Theme.of(context).primaryColor,
                  fontWeight: FontWeight.w500,
                ),
              ),
            ),
          ),
        ],
      ),
    ],
  );
}