import 'package:dotted_border/dotted_border.dart';
import 'package:flutter/material.dart';
import 'package:openclosenew/23-ServiceListing.dart';

import 'FontFamily.dart';
import 'colors.dart';
import 'fontsize.dart';

class addservice extends StatefulWidget {
  const addservice({Key? key}) : super(key: key);

  @override
  State<addservice> createState() => _addserviceState();
}

class _addserviceState extends State<addservice> {
  List<DropdownMenuItem<String>> listDrop = [];
  String? selected = null;
  void loadData() {
    listDrop = [];
    listDrop.add(new DropdownMenuItem(
      child: new Text('Rice'),
      value: 'val-1',
    ));
    listDrop.add(new DropdownMenuItem(
      child: new Text('Others'),
      value: 'val-2',
    ));
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomInset: false,
      backgroundColor: White,
      body: SafeArea(
        child: Padding(
          padding: const EdgeInsets.only(top: 10, left: 20, right: 20),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                children: [
                  InkWell(
                    child: Icon(Icons.arrow_back, size: 24),
                    onTap: () {
                      Navigator.pop(context);
                    },
                  ),
                  SizedBox(
                    width: 20,
                  ),
                  Text(
                    'Add Service',
                    style: TextStyle(
                      fontSize: HeadText,
                      color: DarkGray,
                      fontFamily: Font,
                    ),
                  ),
                ],
              ),
              Spacer(),
              Text(
                'Service Name',
                style: TextStyle(
                  fontFamily: Font,
                  fontStyle: FontStyle.normal,
                  fontWeight: FontWeight.w300,
                  fontSize: HeadText,
                  color: DarkGray,
                ),
              ),
              SizedBox(height: 10),
              TextField(
                decoration: InputDecoration(
                  contentPadding: EdgeInsets.only(left: 10, right: 10),
                  border: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(5)),
                  hintText: 'Type here...',
                ),
              ),
              Spacer(),
              Text(
                'Category',
                style: TextStyle(
                  fontFamily: Font,
                  fontStyle: FontStyle.normal,
                  fontWeight: FontWeight.w300,
                  fontSize: HeadText,
                  color: DarkGray,
                ),
              ),
              SizedBox(height: 10),
              InputDecorator(
                decoration: InputDecoration(
                  contentPadding:
                      EdgeInsets.only(left: 10, top: 1, bottom: 1, right: 5),
                  border: OutlineInputBorder(
                    borderRadius: BorderRadius.all(Radius.circular(5)),
                  ),
                ),
                child: DropdownButtonHideUnderline(
                  child: new DropdownButton(
                    borderRadius: BorderRadius.circular(5),
                    value: selected,
                    items: listDrop,
                    icon: Icon(Icons.keyboard_arrow_down, size: 24),
                    hint: new Text('Choose...'),
                    onChanged: (value) {
                      selected = value as String?;
                      setState(() {});
                    },
                  ),
                ),
              ),
              Spacer(),
              Text(
                'Price',
                style: TextStyle(
                  fontFamily: Font,
                  fontStyle: FontStyle.normal,
                  fontWeight: FontWeight.w300,
                  fontSize: HeadText,
                  color: DarkGray,
                ),
              ),
              Padding(
                padding: const EdgeInsets.only(top: 10),
                child: Row(
                  children: [
                    Text(
                      'From',
                      style: TextStyle(
                        fontFamily: Font,
                        fontStyle: FontStyle.normal,
                        fontWeight: FontWeight.w300,
                        fontSize: HeadText,
                        color: DarkGray,
                      ),
                    ),
                    SizedBox(width: 140),
                    Text(
                      'To',
                      style: TextStyle(
                        fontFamily: Font,
                        fontStyle: FontStyle.normal,
                        fontWeight: FontWeight.w300,
                        fontSize: HeadText,
                        color: DarkGray,
                      ),
                    ),
                  ],
                ),
              ),
              SizedBox(height: 10),
              Row(
                children: [
                  Expanded(
                    child: TextField(
                      keyboardType: TextInputType.number,
                      decoration: InputDecoration(
                        prefixIcon: Image.asset(
                          'assets/images/dollor.png',
                          width: 10,
                          height: 10,
                        ),
                        contentPadding:
                            EdgeInsets.only(left: 10, top: 10, bottom: 10),
                        border: OutlineInputBorder(
                          borderRadius: BorderRadius.only(
                            topLeft: Radius.circular(5),
                            bottomLeft: Radius.circular(5),
                          ),
                        ),
                        hintText: '00.00',
                      ),
                    ),
                  ),
                  Expanded(
                    child: TextField(
                      keyboardType: TextInputType.number,
                      decoration: InputDecoration(
                        prefixIcon: Image.asset(
                          'assets/images/dollor.png',
                          width: 10,
                          height: 10,
                        ),
                        contentPadding:
                            EdgeInsets.only(left: 10, top: 10, bottom: 10),
                        border: OutlineInputBorder(
                          borderRadius: BorderRadius.only(
                            topRight: Radius.circular(5),
                            bottomRight: Radius.circular(5),
                          ),
                        ),
                        hintText: '00.00',
                      ),
                    ),
                  ),
                ],
              ),
              Spacer(),
              Text(
                'Description',
                style: TextStyle(
                  fontFamily: Font,
                  fontStyle: FontStyle.normal,
                  fontWeight: FontWeight.w300,
                  fontSize: HeadText,
                  color: DarkGray,
                ),
              ),
              SizedBox(height: 10),
              TextField(
                maxLines: 4,
                decoration: InputDecoration(
                  contentPadding:
                      EdgeInsets.only(top: 10, left: 10, right: 10, bottom: 10),
                  border: OutlineInputBorder(
                    borderRadius: BorderRadius.circular(5),
                  ),
                  hintText: 'Type here...',
                ),
              ),
              Spacer(),
              Text(
                'Add photo',
                style: TextStyle(
                  fontFamily: Font,
                  fontStyle: FontStyle.normal,
                  fontWeight: FontWeight.w300,
                  fontSize: HeadText,
                  color: DarkGray,
                ),
              ),
              SizedBox(height: 10),
              InkWell(
                onTap: () {
                  showModalBottomSheet<void>(
                    context: context,
                    builder: (BuildContext context) {
                      return Container(
                        height: 200,
                        color: Colors.white,
                        child: Center(
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.start,
                            children: <Widget>[
                              SizedBox(
                                height: 20,
                              ),
                              Text(
                                "Choose You Image",
                                style: TextStyle(
                                    fontSize: 20,
                                    fontFamily: Font,
                                    fontStyle: FontStyle.normal,
                                    fontWeight: FontWeight.bold),
                              ),
                              SizedBox(height: 30),
                              Row(
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: [
                                  IconButton(
                                    onPressed: () {},
                                    icon: Icon(Icons.camera),
                                    iconSize: 30,
                                  ),
                                  Text(
                                    'Camera',
                                    style: TextStyle(
                                      fontSize: 15,
                                      fontFamily: Font,
                                      fontStyle: FontStyle.normal,
                                      fontWeight: FontWeight.w300,
                                      color: DarkGray,
                                    ),
                                  ),
                                  SizedBox(
                                    width: 50,
                                  ),
                                  IconButton(
                                    onPressed: () {},
                                    icon: Icon(Icons.image_rounded),
                                    iconSize: 30,
                                  ),
                                  Text(
                                    'Gallery',
                                    style: TextStyle(
                                      fontSize: 15,
                                      fontFamily: Font,
                                      fontStyle: FontStyle.normal,
                                      fontWeight: FontWeight.w300,
                                      color: DarkGray,
                                    ),
                                  ),
                                ],
                              )
                            ],
                          ),
                        ),
                      );
                    },
                  );
                },
                child: DottedBorder(
                  padding: EdgeInsets.all(45),
                  dashPattern: [4, 4, 4, 4],
                  radius: Radius.circular(10),
                  color: primaryColor,
                  child: Image.asset(
                    'assets/images/insert_logo.png',
                    width: 30,
                    height: 30,
                    color: primaryColor,
                  ),
                ),
              ),
              Spacer(),
              Padding(
                padding: const EdgeInsets.only(bottom: 24),
                child: Row(
                  children: [
                    Expanded(
                      child: MaterialButton(
                        height: 50,
                        minWidth: double.infinity,
                        shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(4)),
                        onPressed: () {
                          Navigator.pop(context);
                        },
                        child: Text(
                          "Cancel",
                          style: TextStyle(
                            color: Gray,
                            fontFamily: Font,
                          ),
                        ),
                      ),
                    ),
                    Expanded(
                      child: MaterialButton(
                        height: 50,
                        minWidth: double.infinity,
                        color: primaryColor,
                        shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(4)),
                        onPressed: () {
                          Navigator.push(
                              context,
                              MaterialPageRoute(
                                  builder: (_) => serviceslisting()));
                        },
                        child: Text(
                          'Save',
                          style: TextStyle(
                            color: White,
                            fontSize: HeadText,
                            fontFamily: Font,
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}