E-Commerce-Example-Flutter

一个仅供客户使用的Flutter电商应用程序。支持身份验证操作（注册-登录-登出），以两种语言（阿拉伯语和英语）展示市场上的产品，并支持购买和添加到个人购物车。

兼容Android, IOS, Web, Windows, MacOS平台。

功能 ?

  • 注册新客户、登录、登出以及保存用户令牌。
  • 浏览产品并展示单个产品在自己的页面上。
  • 支持分页将文档分成页面。
  • 将产品添加到购物车/从购物车中删除。
  • 显示购物车摘要以及已购买的产品。
  • 支持多种语言（阿拉伯语 – 英语）。
  • 适应不同屏幕尺寸的屏幕、尺寸和字体大小。

功能描述

截图 ?

products-desktop

浏览产品 注册新账户 登录
products register login
显示产品本身 购物车 设置
product cart settings

cart-desktop

应用于您的项目

  • 在*lib\core\api\api_config.dart*文件中更改您的基础URL和其他路由。
  • 您从API检索到的关于用户的JSON数据（当发送请求时：登录-注册-检查令牌）应包含如下键：

{
  "data": {
    "id": 278,
    "name": "test user",
    "email": "[email protected]"
  }
}
  • 您从API检索到的关于产品的JSON数据（当发送请求时：getProductById-getProducts）应包含如下键：

{
  "data": {
    "id": 1,
    "title": "Maxime qui incidunt quas nobis porro fugit.",
    "description": "Asperiores et nihil in sed consequatur at. Quia laboriosam ullam numquam sint unde ipsa eius. Aperiam ad necessitatibus non qui.",
    "price": {
      "value": "3764.33",
      "currency": "SYP",
      "formatted": "SYP3,764"
    },
    "image": {
      "id": 1,
      "file_name": "Product-1.png",
      "conversions": {
        "small": "https://your_base_url/storage/1/conversions/Product-1-small.png",
        "medium": "https://your_base_url/storage/1/conversions/Product-1-medium.png",
        "large": "https://your_base_url/storage/1/conversions/Product-1-large.png",
        "default": "https://your_base_url/storage/1/conversions/Product-1-default.png"
      }
    }
  }
}
  • 您从API检索到的关于带分页的产品的JSON数据（当发送请求时：getProducts）应包含如下键：

{
    "data": [
        {
            "id": 1,
            "title": "Maxime qui incidunt quas nobis porro fugit.",
            "description": "Asperiores et nihil in sed consequatur at. Quia laboriosam ullam numquam sint unde ipsa eius. Aperiam ad necessitatibus non qui.",
            "price": {
                "value": "3764.33",
                "currency": "SYP",
                "formatted": "SYP3,764"
            },
            "image": {
                "id": 1,
                "file_name": "Product-1.png",
                "conversions": {
                    "small": "https://your_base_url/storage/1/conversions/Product-1-small.png",
                    "medium": "https://your_base_url/storage/1/conversions/Product-1-medium.png",
                    "large": "https://your_base_url/storage/1/conversions/Product-1-large.png",
                    "default": "https://your_base_url/storage/1/conversions/Product-1-default.png"
                }
            }
        },
        
        ...
    ],
    "links": {
        "first": "https://your_base_url/api/product?page=1",
        "last": "https://your_base_url/api/product?page=4",
        "prev": null,
        "next": "https://your_base_url/api/product?page=2"
    },
    "meta": {
        "current_page": 1,
        "from": 1,
        "last_page": 4,
        "links": [
            {
                "url": null,
                "label": "« Previous",
                "active": false
            },
            {
                "url": "https://your_base_url/api/product?page=1",
                "label": "1",
                "active": true
            },
            ...
            {
                "url": "https://your_base_url/api/product?page=2",
                "label": "Next »",
                "active": false
            }
        ],
        "path": "https://your_base_url/api/product",
        "per_page": "10",
        "to": 10,
        "total": 40
    }
}
  • 您从API检索到的关于购物车的JSON数据（当发送请求时：getCart-addToCart-deleteFromCart）应包含如下键：

{
  "data": {
    "id": 78,
    "total": {
      "value": "11292.99",
      "currency": "SYP",
      "formatted": "SYP11,293"
    },
    "items": 1,
    "products": [
      {
        "id": 497,
        "product_id": 1,
        "total": {
          "value": "11292.99",
          "currency": "SYP",
          "formatted": "SYP11,293"
        },
        "unit_price": {
          "value": "3764.33",
          "currency": "SYP",
          "formatted": "SYP3,764"
        },
        "total_quantity": 3
      },
      ...
    ]
  }
}
  • 或者，您可以通过编辑*models*和*remote_datasources*来定制检索到的数据。

GitHub

查看 Github