import 'package:fis_i18n/i18n.dart';
import 'package:fis_jsonrpc/rpc.dart';
import 'package:fis_theme/theme.dart';
import 'package:fis_ui/base_define/page.dart';
import 'package:fis_ui/index.dart';
import 'package:flutter/material.dart';
import 'package:flyinsono/architecture/define.dart';
import 'package:flyinsono/pages/user/user_id_auth_apply/controller.dart';

///已选擅长领域标签
class SelectedLabels extends FisView<UserIdAuthApplyController>
    implements FPage {
  @override
  final String pageName = 'SelectedLabels';
  @override
  FWidget build(BuildContext context) {
    return FContainer(
      alignment: Alignment.centerLeft,
      width: 390,
      constraints: BoxConstraints(minHeight: 38),
      child: FObx(
        () => FWrap(
          runAlignment: WrapAlignment.start,
          runSpacing: 5,
          spacing: 10,
          children: _buildLabelArea(),
        ),
      ),
    );
  }

  /// 单个标签构造器
  FWidget _buildLabel(index) {
    return FContainer(
      margin: EdgeInsets.only(bottom: 10),
      decoration: new BoxDecoration(
        borderRadius: BorderRadius.all(Radius.circular(4.0)), //圆角弧度
        border: new Border.all(
          width: 1,
          color: FTheme.ins.colorScheme.primary,
        ),
      ),
      child: FRow(
        mainAxisSize: MainAxisSize.min,
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisAlignment: MainAxisAlignment.start,
        children: [
          FSizedBox(
              width: controller.state.applyState == ApplyStateEnum.NotApply
                  ? 5
                  : 10),
          FContainer(
            alignment: Alignment.center,
            child: FText(
              controller.state.selectedLables[index],
              style: TextStyle(fontSize: 16),
            ),
          ),
          const FSizedBox(width: 10),
          if (controller.state.applyState == ApplyStateEnum.NotApply ||
              controller.state.inEditing)
            FContainer(
              alignment: Alignment.center,
              child: FGestureDetector(
                name: "removeAt:$index",
                businessParent: this,
                onTap: () {
                  controller.state.selectedLables.removeAt(index);
                },
                child: FIcon(
                  Icons.close,
                  color: FTheme.ins.colorScheme.primary,
                ),
              ),
            ),
        ],
      ),
    );
  }

  /// 构建标签显示区域
  List<FWidget> _buildLabelArea() {
    if (controller.state.selectedLables.length == 0) {
      return [
        FText(i18nBook.user.waitToAdd.t,
            style: TextStyle(color: Colors.grey[500]))
      ];
    } else {
      return List.generate(controller.state.selectedLables.length,
          (index) => _buildLabel(index));
    }
  }
}
