MicroShop

Docs

Подключение

<script src="main.js" charset="utf-8"></script>
<link rel="stylesheet" href="main.css">

HTML

Карточка товара

<div class="card">
  <input type="hidden" name="art" value="2">
  <input type="hidden" name="id" value="2">
  <input type="hidden" name="count" value="1">
  <input type="hidden" name="size" value="1">
  <input type="hidden" name="url" value="#">
  <input type="hidden" name="name" value="Продукт 2">
  <img src="product.png" class="card-img-top" alt="...">
  <div class="card-body">
    <h5 class="card-title">Продукт 2</h5>
    <div class="price">
      1200
    </div>
    <p class="card-text">Описание продукта</p>
    <a href="#" class="btn btn-primary">Подробнее</a>
    <button type="submit" class="btn btn-success" value="cart/add">
      <i class="fas fa-cart-plus"></i>
      В корзину
    </button>
    <div class="text-right cart_add_status">
      <a href="/cart.html">В корзине</a>
    </div>
  </div>
</div>

Иконка корзины

С количеством товаров и ссылкой на корзину

<div class="shop_cart">
  <a href="[[~ID_PAGE_CART]]" class="shop_cart_btn">
    <i class="fas fa-shopping-cart"></i>
    <span></span>
  </a>
</div>

* где [[~ID_PAGE_CART]] ссылка на страницу с корзиной

Корзина с оформлением заказа

<!-- Страница оформление заказа -->
<div class="form_order_null col-12">
  <p class="text-center">
    В корзине нет товаров
  </p>
</div>

<div class="form_order_success col-12">
  <h3 class="text-center">
    Заказ успешно оформлен!
  </h3>
</div>

<form id="form_order" class="form_order col-12">
  <!-- Товары -->
  <div class="_block form_order_cart" id="msCart">
    <div class="_title">
      <h3>Корзина</h3>
    </div>
    <div class="table-responsive">
      <table class="table table-striped">
        <thead>
          <tr class="header">
            <th class="number text-center">№</th>
            <th class="title">Наименование</th>
            <th class="art text-center">Артикул</th>
            <th class="price text-center">Цена</th>
            <th class="count text-center">Количество</th>
            <th class="remove"></th>
          </tr>
        </thead>
      </table>
    </div>

    <input type="hidden" id="input_products" name="products" value="">
  </div>

  <!-- Инфа -->
  <div class="row _block">
    <div class="col-12 _title">
      <h3>Оформление закза</h3>
    </div>

    <div class="col-12">
      <div class="form-group row">
        <label for="input_fio" class="col-sm-3 col-form-label">ФИО</label>
        <div class="col-sm-9">
          <input type="text" name="fio" class="form-control" id="input_fio" aria-describedby="emailHelp" placeholder="ФИО">
        </div>
      </div>
      <div class="form-group row">
        <label for="input_tel" class="col-sm-3 col-form-label">Телефон</label>
        <div class="col-sm-9">
          <input type="text" name="tel" class="form-control" id="input_tel" placeholder="Телефон" required="required">
        </div>
      </div>
      <div class="form-group row">
        <label for="input_email" class="col-sm-3 col-form-label">Email</label>
        <div class="col-sm-9">
          <input type="text" name="email" class="form-control" id="input_email" placeholder="Email">
        </div>
      </div>
      <div class="form-group row">
        <label for="input_comment" class="col-sm-3 col-form-label">Комментарий</label>
        <div class="col-sm-9">
          <textarea name="comment" rows="3" class="form-control" id="input_comment" placeholder="Комментарий"></textarea>
        </div>
      </div>
    </div>
  </div>

  <!-- Оформление -->
  <div class="row _block">
    <div class="col-12 mb-2">
      <div class="form-gorup text-right">
        <button type="submit" class="btn">Оформить</button>
      </div>
    </div>
  </div>
</form>
<!-- Страница оформление заказа x-->

Server

<php
$iUserId = 1; // id Пользователя
switch ($_REQUEST['MicroShop']) {
  case 'show':  // Вывод корзины из базы
    if ( $iUserId ) {
      // Получаем корзину
      $result = $modx->query("SELECT * FROM `modx_microshop` WHERE `user` = " . $iUserId);
      if ( is_object($result) ) echo json_encode( $result->fetch(PDO::FETCH_ASSOC) );
    }
    die(); break;

  case 'update':  // Оновление товаров
    // Получаем продукты
    // print_r($_POST);
    $arrProducts = json_encode($_REQUEST['products']);
    // Обновляем продукты
    // print_r($arrProducts);
    foreach ($arrProducts as &$arrProduct) $arrProduct = MicroShop_product_update($arrProduct);
    // Возвращяем продукты
    print_r($arrProducts);
    die(); break;

  case 'save': // Сохраняем коризну в базу
    if ( $iUserId ) {
      // Получаем продукты
      $arrProducts = json_encode($_REQUEST['products']);
      // Сохраняем продукты
      $modx->query("INSERT INTO `modx_microshop` (`products`,`user`,`last_update`) VALUES('". $arrProducts . "','" . $iUserId . "', '" . date('Y-m-d H:i:s') . "')");
    }
    die(); break;
}
MODX

Demo

...
Продукт
1200
Описание продукта
Подробнее
...
Продукт 2
1200

Описание продукта

Подробнее
...
Продукт 3
1200

Описание продукта

Подробнее