flutter_wisetronic/lib/widgets/desktop/desktop_view_blog.dart

import 'package:flutter/material.dart';
import 'package:flutter_spinkit/flutter_spinkit.dart';
import 'package:photo_view/photo_view.dart';

import '../../constants.dart';
import '../../generated/l10n.dart';
import '../../models/blog.dart';
import '../../routes.dart';
import '../../store/actions.dart';
import '../../store/store.dart';
import '../../utils/http_util.dart';
import '../../utils/utils.dart';
import '../../widgets/general/breadcrumbs.dart';

import '../../utils/util_io.dart' if (dart.library.html) '../../utils/util_web.dart';

class DesktopViewBlog extends StatefulWidget {
  final Key key;
  final int bid;

  const DesktopViewBlog(this.bid, {this.key}) : super(key: key);

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

class DesktopViewBlogState extends State<DesktopViewBlog> {
  Blog blog;

  double sideSpace = 0;
  double mainSpace = 1200;

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

  void _loadBlog() {
    HttpUtil.httpGet(
      'v1/blog/${widget.bid}',
      businessId: Constants.BUSINESS_ID,

    ).then((value) {
      if (mounted) {
        setState(() {
          blog = Blog.fromJson(value);
          print('blog: $blog');
        });
      }
    }).catchError((error) {
      Utils.showMessageDialog(context, error, onOk: () {
        Routes.router.pop(context);
        Routes.router.pop(context);
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    store.dispatch(UpdateContext(context));

    if (MediaQuery.of(context).size.width <= 1200) {
      mainSpace = MediaQuery.of(context).size.width;
      sideSpace = 0;
    } else {
      mainSpace = 1200;
      sideSpace = (MediaQuery.of(context).size.width - 1200) / 2;
    }

    if (blog == null) {
      return Container(
        padding: EdgeInsets.all(50.0),
        child: Center(
          child: SpinKitThreeBounce(
            color: Colors.lightBlueAccent,
            size: 40.0,
          ),
        ),
      );
    }

    BuildContext mainContext = context;

    Column blogCol = Column(
      mainAxisAlignment: MainAxisAlignment.start,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        Container(
          padding: EdgeInsets.only(left: 16.0, top: 16.0, right: 16.0),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            crossAxisAlignment: CrossAxisAlignment.end,
            children: [
              Expanded(
                child: Text(
                  '${blog.title}',
                  style: TextStyle(
                      fontSize: 24.0,
                      color: Colors.black
                  ),
                ),
              ),
              Text(
                Utils.utcDatetimeStringToLocalDatetimeString(context, blog.createdAt),
                style: TextStyle(
                  fontSize: 14.0,
                  color: Colors.black38,
                ),
              )
            ],
          ),
        ),
        Container(
          width: double.maxFinite,
          padding: EdgeInsets.only(top: 8.0, left: 16.0, right: 16.0, bottom: 24.0),
          child: Container(
            child: Text(
              '${blog.body}',
              style: TextStyle(
                color: Colors.black87,
                fontSize: 17.0,
              ),
            ),
          ),
          decoration: BoxDecoration(
            border: Border(
              bottom: BorderSide(
                width: 0.5,
                color: Colors.black12,
              ),
            ),
          ),
        ),
      ],
    );

    Widget view = SingleChildScrollView(
      child: Row(
        children: [
          Container(
            width: sideSpace,
          ),
          Container(
            width: mainSpace,
            child: IntrinsicHeight(
              child: Row(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Container(
                    width: mainSpace / 2,
                    margin: EdgeInsets.only(top: 16.0, bottom: 16.0),
                    padding: EdgeInsets.all(10.0),
                    child: blogCol,
                    decoration: BoxDecoration(
                      border: Border(
                        right: BorderSide(
                          width: 1.0,
                          color: Colors.black12,
                        ),
                      ),
                    ),
                  ),
                  Container(
                    width: mainSpace / 2,
                    margin: EdgeInsets.only(top: 16.0, bottom: 16.0),
                    padding: EdgeInsets.all(10.0),
                    child: (blog.imageUrl == null) ?
                    SizedBox.shrink()
                    : Container(
                      width: mainSpace / 2 - 100.0,
                      height: mainSpace / 2 - 100.0,
                      child: Util.showImage('https:${blog.imageUrl}'),
                    ),
                  ),
                ],
              ),
            ),
          ),
          Container(
            width: sideSpace,
          ),
        ],
      ),
    );
    return view;
  }
}