import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:news_getx/data/services/config.dart';
import 'package:news_getx/modules/main/main_controller.dart';
import 'package:news_getx/modules/widgets/image.dart';
import 'package:news_getx/routes/app_pages.dart';
import 'package:news_getx/theme/app_colors.dart';
import 'package:news_getx/utils/date.dart';

class NewsRecommendWidget extends GetView<MainController> {
  @override
  Widget build(BuildContext context) {
    return Obx(
      () => controller.state.newsRecommend == null
          ? Container()
          : Container(
              margin: EdgeInsets.all(20.w),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  // 图
                  InkWell(
                    onTap: () {
                      Get.toNamed(AppRoutes.Detail, arguments:  controller.state.newsRecommend!);
                    },
                    child: netImageCached(
                      controller.state.newsRecommend?.thumbnail ?? "",
                      width: 335.w,
                      height: 290.h,
                    ),
                  ),
                  // 作者
                  Container(
                    margin: EdgeInsets.only(top: 14.h),
                    child: Text(
                      controller.state.newsRecommend!.author ?? "",
                      style: TextStyle(
                        fontFamily: 'Avenir',
                        fontWeight: FontWeight.normal,
                        color: AppColors.thirdElementText,
                        fontSize: 14.sp,
                      ),
                    ),
                  ),
                  // 标题

                  // 一行 3 列
                  Container(
                    margin: EdgeInsets.only(top: 10.h),
                    child: Row(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: <Widget>[
                        ConstrainedBox(
                          constraints: const BoxConstraints(maxWidth: 120),
                          child: Text(
                            controller.state.newsRecommend!.category ?? "",
                            style: TextStyle(
                              fontFamily: 'Avenir',
                              fontWeight: FontWeight.normal,
                              color: AppColors.secondaryElementText,
                              fontSize: 14.sp,
                              height: 1,
                            ),
                            overflow: TextOverflow.clip,
                            maxLines: 1,
                          ),
                        ),
                        // 添加时间
                        Container(
                          width: 15.w,
                        ),
                        ConstrainedBox(
                          constraints: const BoxConstraints(maxWidth: 120),
                          child: Text(
                            '• ${timeLineFormat(controller.state.newsRecommend!.addtime!)}',
                            style: TextStyle(
                              fontFamily: 'Avenir',
                              fontWeight: FontWeight.normal,
                              color: AppColors.thirdElementText,
                              fontSize: 14.sp,
                              height: 1,
                            ),
                            overflow: TextOverflow.clip,
                            maxLines: 1,
                          ),
                        ),
                        // 占满剩余空间
                        Spacer(),
                        // 更多
                        InkWell(
                          child: Icon(
                            Icons.more_horiz,
                            color: AppColors.primaryText,
                            size: 24,
                          ),
                          onTap: () {
                            print('查看更多...');
                          },
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ),
    );
  }
}