import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:zhiying_base_widget/widgets/custom/search/model/custom_search_model.dart';
import 'package:zhiying_comm/zhiying_comm.dart';

///
/// 通用模块的搜索栏
///
class CustomSearchWidget extends StatelessWidget {
  final Map<String, dynamic> data;
  CustomSearchModel model;

  CustomSearchWidget(this.data, {Key key}) : super(key: key) {
    try {
      model = CustomSearchModel.fromJson(jsonDecode(data['data']));
    } catch (e, s) {
      Logger.warn(e, s);
    }
  }

  // 点击事件
  void _onClickListener(BuildContext context, SkipModel skipModel) {
    RouterUtil.route(skipModel, skipModel.toJson(), context);
  }

  @override
  Widget build(BuildContext context) {
    return _buildStyle1Widget(context);
  }

  /// 样式1
  Widget _buildStyle1Widget(BuildContext context) {
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: () => _onClickListener(context, model?.listStyle?.searchCss),
      child: Container(
        width: double.infinity,
        decoration: BoxDecoration(color: HexColor.fromHex(model?.bgColor ?? '#FFFFFF')),
        padding: const EdgeInsets.symmetric(horizontal: 12.5, vertical: 4),
        child: Container(
          width: double.infinity,
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(40),
            color: HexColor.fromHex(model?.listStyle?.searchCss?.bgColor ?? '#F9F9F9'),
          ),
          padding: const EdgeInsets.symmetric(vertical: 6),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              /// 搜索按钮
              CachedNetworkImage(
                imageUrl: model?.listStyle?.searchCss?.image ?? '',
                height: 20,
                width: 20,
              ),
              const SizedBox(width: 7.5),

              /// 提示文字
              Text(
                model?.listStyle?.searchCss?.text ?? '搜索更多优惠商品',
                style: TextStyle(fontSize: 14, color: HexColor.fromHex(model?.listStyle?.searchCss?.textColor ?? '#999999')),
              )
            ],
          ),
        ),
      ),
    );
  }
}