/*
 * @Author: WuWei
 * @Date: 2020-07-15 14:49:51
 * @LastEditors: ChenYaJin
 * @LastEditTime: 2023-03-30 15:42:20
 * @Description:
 */

import 'package:app_package/app_package.dart';
import 'package:flutter/material.dart';
import 'package:wisdom_cli/wisdom_cli.dart';
import '../../view_models/private_detail_model.dart';

class SolvePage extends StatelessWidget {
  const SolvePage({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
      create: (_) => RepairDetailStore(context),
      child: _PageView(),
      lazy: false,
    );
  }
}

class _PageView extends StatefulWidget {
  _PageView({Key? key}) : super(key: key);
  @override
  _PageViewState createState() => _PageViewState();
}

class _PageViewState extends State<_PageView> {
  @override
  Widget build(BuildContext context) {
    final style = WTheme.of(context);
    final colorScheme = style.colorScheme;
    final store = Provider.of<RepairDetailStore>(context, listen: true);
    return Scaffold(
      appBar: WAppBar(
        brightness: Brightness.light,
        iconTheme: IconThemeData(
          color: colorScheme.mainTitle,
          size: 19.pt,
        ),
        backgroundColor: Colors.white,
        title: WisText('确认解决',
            size: 19.pt, weight: FontWeight.w600, color: colorScheme.mainTitle),
      ),
      body: WisScrollView(
        slivers: <Widget>[
          SliverToBoxAdapter(
            child: Wisdom.column(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: <Widget>[
                Wisdom.column(
                  crossAxisAlignment: CrossAxisAlignment.stretch,
                  children: <Widget>[
                    Wisdom(
                      margin: EdgeInsets.all(15.pt),
                      child: Text(
                        '绘制美好服务，从您的用心开始',
                        style: TextStyle(
                          fontSize: 13.pt,
                          color: Color(0xFF00BC84),
                        ),
                      ),
                    ),
                    WisCard(
                      color: Colors.white,
                      padding: EdgeInsets.fromLTRB(15.pt, 0, 15.pt, 15.pt),
                      margin: EdgeInsets.symmetric(horizontal: 15.pt),
                      elevation: 0,
                      child: Wisdom.column(
                        children: <Widget>[
                          WFormTile(
                            required: true,
                            leading: WisText('解决说明'),
                          ),
                          Wisdom(
                            // color: Color(0xfff8f8f8),
                            padding: EdgeInsets.only(bottom: 12.pt),
                            // border: Border.all(
                            //     width: 1.pt, color: Color(0xffe5e5e5)),
                            // borderRadius:
                            //     BorderRadius.all(Radius.circular(4.pt)),
                            child: TextFormField(
                              initialValue: store.solveRemark,
                              onChanged: (v) => store.solveRemarkChange(v),
                              validator: (v) => (v != '') ? null : '解决说明不可为空',
                              scrollPadding: EdgeInsets.zero,
                              decoration: InputDecoration(
                                fillColor: Colors.white,
                                contentPadding:
                                    EdgeInsets.fromLTRB(9.pt, 0, 9.pt, 9.pt),
                                hintText:
                                    '简要说明解决本次报修的工作内容，该内容将会发送业主，请仔细填写。必须不少于5字。',
                              ),
                              minLines: 3,
                              maxLines: 5,
                              maxLength: 290,
                            ),
                          ),
                          Divider(
                            height: 30.pt,
                          ),
                          Wisdom.wrap(
                            maxWidth: double.infinity,
                            alignment: Alignment.centerLeft,
                            wrapAlignment: WrapAlignment.start,
                            spacing: 10.pt,
                            runSpacing: 10.pt,
                            children: <Widget>[
                              if (store.solvePhotos!.length < 6)
                                WImageSelecter(
                                  maxCount: 6,
                                  currentCount: store.solvePhotos?.length ?? 0,
                                  onSelected: (files) =>
                                      store.pickImageSolve(files),
                                  size: 58.pt,
                                ),
                              ...WImagePreview.buildList(
                                size: 58.pt,
                                images: store.solvePhotos!
                                    .map((e) => CachedNetworkImageProvider(
                                        AppParseUtil.image(e)))
                                    .toList(),
                                onDelete: (index) =>
                                    store.removeImageSolve(index),
                              ),
                            ],
                          ),
                          Container(
                            margin: EdgeInsets.only(top: 15.pt),
                            child: Text(
                              '最多上传6张图片，推荐上传问题解决前后的对比图片。图片会发送给业主，请勿发送无关图片。',
                              style: TextStyle(
                                fontSize: 14.pt,
                                color: Color(0xffcccccc),
                              ),
                            ),
                          ),
                        ],
                      ),
                    ),
                  ],
                )
              ],
            ),
          ),
        ],
      ),
      bottomNavigationBar: BottomAppBar(
        child: Wisdom.row(
          height: 60.pt,
          padding: EdgeInsets.symmetric(horizontal: 15.pt),
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            Expanded(
              child: Wisdom(
                height: 44.pt,
                onTap: () => store.putSolve(),
                color: store.solveRemark == null || store.solveRemark == ''
                    ? Color.fromRGBO(192, 220, 250, 1)
                    : colorScheme.primary,
                borderRadius: BorderRadius.circular(25.pt),
                child: Wisdom(
                  alignment: Alignment.center,
                  child: WisText.white('确定已解决', size: 16.pt),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}
