import 'package:flutter/material.dart';
import 'package:skywood/global/client/play_client.dart';
import 'package:skywood/main/lib_file.dart';
import 'package:skywood/pages/home/players/page/drama_detail_page.dart';
import 'package:skywood/pages/widgets/pixel_widgets.dart';
import 'package:skywood/utils/models/drama/skywood_drama.dart';
import 'package:skywood/utils/tools/sky_time_tool.dart';
import 'package:skywood/utils/tools/widgets/sky_app_bar.dart';
import 'package:skywood/utils/tools/widgets/sky_common_widget.dart';

import '../../../utils/tools/widgets/sky_text_field.dart';
import '../widget/search_util.dart';

class ResultPage extends StatefulWidget {

  const ResultPage({super.key,
    required this.keyword,
  });

  final String keyword;

  @override
  State<StatefulWidget> createState() {
    return _ResultPageState();
  }
}

class _ResultPageState extends State<ResultPage> {

  final _searchController = TextEditingController();
  final _searchFocus = FocusNode();
  List<SkywoodDrama> _searchResult = [];

  @override
  void initState() {
    super.initState();

    _searchController.text = widget.keyword;
    _search();
  }

  void _search() async {
    String keyword = _searchController.text;
    if (keyword.trim().isEmpty) {
      _searchFocus.requestFocus();
      return;
    }
    await SearchUtil.addSearch(keyword);
    PlayClient.search(keyword: keyword).then((valuer) {
      setState(() {
        _searchResult = valuer;
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: SkyAppBar(

        titleWidget: SkyTextField(
          controller: _searchController,
          focusNode: _searchFocus,
          border: Border.all(width: 0.6, color: CommonColor.black),
          borderRadius: BorderRadius.circular(20),
          width: 300, height: 36,
          placeholder: 'Search',
          prefix: HelpImg.asset(ConstImg.search, width: 14.w, height: 14.w),
          textInputAction: TextInputAction.search,
          onEditingComplete: () {
            _searchFocus.unfocus();
            if (_searchController.text.trim().isEmpty) return;
            _search();
          },
        ),
      ),
      body: ListView.separated(
          itemBuilder: (context, index) => ResultItemView(
            drama: _searchResult[index],
            onTap: () {
              HelpNav.to(DramaDetailPage(dramaBean: _searchResult[index]));
            },
          ),
          separatorBuilder: (context, index) => SizedBox(height: 12),
          itemCount: _searchResult.length
      ),
    );
  }
}

class ResultItemView extends StatelessWidget {

  const ResultItemView({super.key,
    required this.drama,
    this.onTap
  });

  final SkywoodDrama drama;
  final Function()? onTap;

  @override
  Widget build(BuildContext context) {
    String tag = 'Satisfying';
    if (drama.categoryList!.isNotEmpty) {
      tag = drama.categoryList![0].name;
    }
    return Container(
      height: 140.h,
      padding: const EdgeInsets.symmetric(horizontal: 15),
      child: Row(
        children: [
          HelpImg.networkRadius(drama.imageUrl, width: 105.w, height: 140.h,
            borderRadius: BorderRadius.circular(6),
          ),
          const SizedBox(width: 10),
          Expanded(child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              SkyText(text: drama.name,
                fontSize: 14,
                fontWeight: FontWeight.bold,
                color: CommonColor.black,
              ),
              const SizedBox(height: 12),
              _tagView(tag),
              const SizedBox(height: 12),
              SkyText(text: '${drama.description}',
                fontSize: 11,
                color: CommonColor.withValue('4D4047'),
                maxLines: 2,
              ),
              Spacer(),
              Row(
                children: [
                  _tipView(true, text: '10.0'),
                  const SizedBox(width: 15),
                  _tipView(false, text: SkyTimeTool.formatNum(drama.watchTotal, unit: 'k')),
                ],
              )
            ],
          ))
        ],
      ),
    ).addInkWell(onTap: onTap);
  }

  Widget _tipView(bool isStar, {required String text}) {
    String imgName = isStar ? ConstImg.star : ConstImg.look;
    return Row(
      children: [
        HelpImg.asset(imgName, width: 12.w, height: 12.w),
        const SizedBox(width: 2),
        SkyText(text: text, fontSize: 10, color: Colors.grey)
      ],
    );
  }

  Widget _tagView(String tag) {
    return Container(
      padding: const EdgeInsets.only(top: 3, left: 6, right: 6, bottom: 4),
      decoration: ShapeDecoration(
        color: const Color(0xFFEBFFE5),
        shape: RoundedRectangleBorder(
          side: BorderSide(
            width: 0.50,
            color: const Color(0xFF9BE89C),
          ),
          borderRadius: BorderRadius.circular(1),
        ),
      ),
      child: Row(
        mainAxisSize: MainAxisSize.min,
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.center,
        spacing: 10,
        children: [
          Text(
            tag,
            style: TextStyle(
              color: const Color(0xFF040408) /* 主题黑 */,
              fontSize: 10,
              fontFamily: 'Inter',
              fontWeight: FontWeight.w400,
              height: 1,
            ),
          ),
        ],
      ),
    );
  }
}