고객센터 페이지, 결제/취소 내역

두개의 페이지다 별 다른 기능을 아직 넣지 못하고 그림만 그렸다..

 

 

 

고객센터

import 'package:finalproject_front/constants.dart';
import 'package:finalproject_front/size.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/src/foundation/key.dart';
import 'package:flutter/src/widgets/framework.dart';

class PaymentInstallmentListPage extends StatelessWidget {
  const PaymentInstallmentListPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: _buildAppbar(context),
      body: ListView(
        children: [
          _buildInstallmentLists(context),
        ],
      ),
    );
  }

  Column _buildInstallmentLists(
    BuildContext context,
  ) {
    return Column(
      children: [
        SizedBox(height: gap_l),
        _buildSalesList(context, "깔끔하고 감각적인 최고의 홈페이지를 제작해드립니다", "50,000",
            "22.01.09", "/lessonDetail"),
        SizedBox(height: gap_l),
        _buildSalesList(context, "출장 메이크업을 합리적인 가격에 진행해 드립니다", "77,000",
            "22.01.09", "/lessonDetail"),
        SizedBox(height: gap_l),
        _buildSalesList(context, "천연향료 에센셜오일을 알아본 후 향수를 만들어드립니다", "70,000",
            "22.01.09", "/lessonDetail"),
        SizedBox(height: gap_l),
        _buildSalesList(context, "레슨경력 7년차 전문댄서가 맞춤형 댄스 수업해 드립니다", "50,000",
            "22.01.09", "/lessonDetail"),
        SizedBox(height: gap_l),
        _buildSalesList(context, "깔끔하고 감각적인 최고의 홈페이지를 제작해드립니다", "50,000",
            "22.01.09", "/lessonDetail"),
        SizedBox(height: gap_l),
        _buildSalesList(context, "깔끔하고 감각적인 최고의 홈페이지를 제작해드립니다", "50,000",
            "22.01.09", "/lessonDetail"),
        SizedBox(height: gap_l),
        _buildSalesList(context, "깔끔하고 감각적인 최고의 홈페이지를 제작해드립니다", "50,000",
            "22.01.09", "/lessonDetail"),
        SizedBox(height: gap_l),
        _buildSalesList(context, "깔끔하고 감각적인 최고의 홈페이지를 제작해드립니다", "50,000",
            "22.01.09", "/lessonDetail"),
        SizedBox(height: gap_l),
      ],
    );
  }

  InkWell _buildSalesList(
      context, String saletitle, String price, String date, String routePath) {
    return InkWell(
      onTap: () {
        Navigator.pushNamed(context, "${routePath}");
      },
      child: Container(
        child: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 20),
          child: Container(
            decoration: BoxDecoration(
              border: Border.all(color: gBorderColor, width: 3),
              borderRadius: BorderRadius.circular(10),
            ),
            child: Padding(
              padding: const EdgeInsets.all(15.0),
              child: Column(
                children: [
                  Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Container(
                        width: 320,
                        height: 50,
                        child: Text(
                          "${saletitle}.",
                          style: TextStyle(
                              fontSize: 14, fontWeight: FontWeight.bold),
                          maxLines: 2,
                          overflow: TextOverflow.ellipsis,
                        ),
                      ),
                      Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Text(
                            "가격 : ${price}원",
                            style: TextStyle(fontSize: 14),
                          ),
                          Text(
                            "결제 날짜 : ${date}",
                            style: TextStyle(fontSize: 14),
                          ),
                        ],
                      )
                    ],
                  ),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }

  AppBar _buildAppbar(BuildContext context) {
    return AppBar(
      backgroundColor: Colors.white,
      elevation: 1.0,
      leading: IconButton(
          icon: Icon(
            CupertinoIcons.back,
            color: Colors.black,
            size: 30,
          ),
          onPressed: () {
            Navigator.pop(context);
          }),
      title: Text(
        "결제/취소내역",
        style: TextStyle(
          color: Colors.black,
          fontSize: 20,
          fontWeight: FontWeight.bold,
        ),
      ),
      centerTitle: true,
    );
  }
}

 

고객센터

import 'package:finalproject_front/constants.dart';
import 'package:finalproject_front/size.dart';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/src/foundation/key.dart';
import 'package:flutter/src/widgets/framework.dart';

class CustomerServicePage extends StatelessWidget {
  const CustomerServicePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: _buildAppbar(context),
      body: ListView(
        children: [
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 20),
            child: Column(
              children: [
                _buildImageBox("https://picsum.photos/200"),
                _buildCustomerNotice(),
                _buildFrequentlyAskedQuestion(),
              ],
            ),
          )
        ],
      ),
    );
  }

  Container _buildFrequentlyAskedQuestion() {
    return Container(
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          SizedBox(
            height: gap_xl,
          ),
          Text(
            "FAQ",
            style: TextStyle(fontSize: 14, fontWeight: FontWeight.bold),
          ),
          _buildFaqList("[서비스 소개] 이걸 완료할 수 있을까요?"),
          _buildFaqList("[이용 방법] 전문가에게 어떻게 문의하나요?"),
          _buildFaqList("[문제 해결] 거래 중 분쟁이 발생하면 어떡하나요?"),
          _buildFaqList("[이용 방법] 쿠폰은 어떻게 사용하나요?"),
        ],
      ),
    );
  }

  Column _buildFaqList(String faqText) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Padding(
          padding: const EdgeInsets.only(top: 8, bottom: 8),
          child: Text(
            "${faqText}",
            style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
          ),
        ),
        Divider(
          thickness: 1,
          color: gBorderColor,
        )
      ],
    );
  }

  Container _buildCustomerNotice() {
    return Container(
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "공지사항",
            style: TextStyle(fontSize: 14, fontWeight: FontWeight.bold),
          ),
          _buildNotice("11월 고객센터 운영시간 안내"),
          _buildNotice("사칭하는 메시지, 조심하세요!"),
          _buildNotice("패널티 정책 안내(시행일: 7월 4일)"),
          _buildNotice("개인정보처리방침 계정 안내(시행일: 1월 7일)"),
        ],
      ),
    );
  }

  Column _buildNotice(String noticeText) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Padding(
          padding: const EdgeInsets.only(top: 8, bottom: 8),
          child: Text(
            "${noticeText}",
            style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
          ),
        ),
        Divider(
          thickness: 1,
          color: gBorderColor,
        )
      ],
    );
  }

  Padding _buildImageBox(String imagePath) {
    return Padding(
      padding: const EdgeInsets.only(top: 20, bottom: 30),
      child: Container(
        height: 100,
        width: double.infinity,
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(10),
          image: DecorationImage(image: NetworkImage("${imagePath}"), fit: BoxFit.cover),
        ),
      ),
    );
  }

  AppBar _buildAppbar(BuildContext context) {
    return AppBar(
      elevation: 1.0,
      leading: IconButton(
        onPressed: () {
          Navigator.pop(context);
        },
        icon: Icon(
          CupertinoIcons.back,
          color: Colors.black,
          size: 26,
        ),
      ),
      centerTitle: true,
      title: TextButton(
        onPressed: () {},
        child: Text(
          "크몽 고객센터",
          style: TextStyle(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold),
        ),
      ),
    );
  }
}