minipos

Coffeeman Mini POS

A simple and beautiful web-based Point of Sale (POS) system designed for small coffee shops and kiosks. Manage your menu, process orders, and track history all in one place. Built with HTML, CSS, and Vanilla JavaScript.

##🚀 Features ✅ Menu Management: Easily add or delete items and set prices.

✅ Quick Order Grid: Visual product cards for fast item selection.

✅ Cart System: View and manage current orders in real-time.

✅ Change Calculator: Automatic calculation of total and change based on cash input.

✅ Digital Receipts: Generate a clean, printable receipt for every completed order.

✅ Order History: Keep a log of all previous transactions with detailed views.

✅ Stored Locally: All data is saved in your browser (no database required).

📱 How to Use

Click “⚙️ Items” to add your coffee products and set their prices.

Click on the Product Cards in the menu to add them to the cart.

Enter the amount of Cash received in the input box.

Click “COMPLETE & PRINT” to finish the transaction and see the receipt.

Click “📜 Order History” to view or reprint past orders.

Use “VOID” to clear the current cart and start over.

🔐 Data Storage & Privacy

All data (menu and orders) is saved locally on your device using Local Storage.

This means your data stays private and is not uploaded to any server.

If you clear your browser cache or use a different device/browser, your data will not appear.

We recommend keeping the browser data intact to maintain your sales history.

👉 (Click here to use the app)[https://coffeemanapp.github.io/minipos/pos.html]

📲 Add to Home Screen (For Easy Access)

You can install this app like a native app on your phone! Here’s how:

✅ For iPhone (iOS Safari):

Open this app in Safari.

Tap the Share button (the square with the arrow).

Scroll down and tap Add to Home Screen.

Tap Add in the top-right corner.

✅ For Android (Chrome or Edge):

Open this app in Google Chrome or Microsoft Edge.

Tap the three-dot menu in the top-right corner.

Tap Add to Home screen.

Confirm by tapping Add.

🛠️ Tech Stack

HTML5 & CSS3: For a responsive and clean user interface.

JavaScript (ES6): For logic, calculations, and DOM manipulation.

LocalStorage: For offline data persistence.

CoffeeMan Mini POS 迷你收银系统

一个简单又美观的网页版收银系统,专为小型咖啡店或摊位设计。轻松管理菜单、处理订单并追踪销售记录。 基于 HTML、CSS 和原生 JavaScript 开发。

##🚀 功能特点 ✅ 菜单管理:轻松添加或删除商品,并设置价格。

✅ 快速点单:网格式商品卡片,点击即可加入购物车。

✅ 购物车系统:实时查看和管理当前订单。

✅ 自动找零:输入现金金额,系统自动计算找零。

✅ 电子小票:每笔订单完成后生成精美的电子收据。

✅ 订单历史:记录所有销售数据,支持随时回看。

✅ 本地存储:数据保存在浏览器中(无需账号登录)。

📱 使用方法

点击 “⚙️ Items” 设置你的菜单商品和价格。

点击左侧的 商品卡片 将其加入当前订单。

在 Cash 框中输入顾客支付的现金金额。

点击 “COMPLETE & PRINT” 完成订单并弹出收据。

点击 “📜 Order History” 查看之前的销售记录。

点击 “VOID” 可清空当前购物车。

🔐 数据存储与隐私

所有数据(菜单和订单)都保存在你设备的本地存储(Local Storage)。

你的数据不会上传到任何地方,完全私密且安全。

如果你清空浏览器缓存或更换设备,数据将会丢失。

🌐 应用链接

👉 (点击这里即可使用)[https://coffeemanapp.github.io/minipos/pos.html]

🛠️ 技术栈

HTML, CSS, JavaScript LocalStorage(离线数据存储)

🧔 Author

Created by @CoffeeManApp Donation: @Buymeacoffee