diff --git a/payment_headend/.gitignore b/payment_headend/.gitignore
new file mode 100644
index 0000000..99d8734
--- /dev/null
+++ b/payment_headend/.gitignore
@@ -0,0 +1,30 @@
+# Python:
+*.ipynb
+*/__pycache__
+/.vagrant
+/scrapy.iml
+*.pyc
+_trial_temp*
+dropin.cache
+docs/build
+*egg-info
+.tox
+venv
+build
+dist
+.idea
+htmlcov/
+.coverage
+.pytest_cache/
+.coverage.*
+.cache/
+.mypy_cache/
+/tests/keys/localhost.crt
+/tests/keys/localhost.key
+key.txt
+key.txt.pub
+
+# Windows
+Thumbs.db
+ehthumbs.db
+Desktop.ini
diff --git a/payment_headend/index.html b/payment_headend/index.html
new file mode 100644
index 0000000..432556d
--- /dev/null
+++ b/payment_headend/index.html
@@ -0,0 +1,131 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <title>创建订单</title>
+    <style>
+        /* 简单的样式 */
+        .hidden { display: none; }
+        .error { color: red; }
+    </style>
+</head>
+<body>
+<h1>创建订单</h1>
+<form id="order-form">
+    <label for="phone">手机号:</label>
+    <input type="text" id="phone" name="phone"><br><br>
+
+    <label for="email">邮箱:</label>
+    <input type="email" id="email" name="email"><br><br>
+
+    <label for="address">地址:</label>
+    <input type="text" id="address" name="address"><br><br>
+
+    <button type="submit">提交订单</button>
+</form>
+
+<div id="message" class="hidden"></div>
+<div id="addresses" class="hidden">
+    <h2>请选择一个地址：</h2>
+    <ul id="address-list"></ul>
+</div>
+<div id="error" class="error hidden"></div>
+
+<script>
+    async function createOrder(phone = "", email = "", address = "") {
+        try {
+            const response = await fetch('/create_order', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                body: JSON.stringify({ phone, email, address })
+            });
+
+            const data = await response.json();
+
+            if (response.ok) {
+                if (data.order_id) {
+                    handleOrderSuccess(data.order_id);
+                } else if (data.addresses && Array.isArray(data.addresses)) {
+                    handleMultipleAddresses(data.addresses);
+                }
+            } else {
+                if (data.message === "地址不能为空，请输入地址。") {
+                    promptUserForAddress();
+                } else {
+                    handleError(data.message || '发生未知错误。');
+                }
+            }
+        } catch (error) {
+            console.error('网络或服务器错误:', error);
+            handleError('网络或服务器错误，请稍后再试。');
+        }
+    }
+
+    function handleOrderSuccess(orderId) {
+        document.getElementById('message').innerText = `订单创建成功！您的订单号是：${orderId}`;
+        document.getElementById('message').classList.remove('hidden');
+        document.getElementById('addresses').classList.add('hidden');
+        document.getElementById('error').classList.add('hidden');
+    }
+
+    function handleMultipleAddresses(addresses) {
+        const addressList = document.getElementById('address-list');
+        addressList.innerHTML = ''; // 清空现有列表
+
+        addresses.forEach((addr, index) => {
+            const li = document.createElement('li');
+            const button = document.createElement('button');
+            button.innerText = `选择地址 ${index + 1}`;
+            button.addEventListener('click', () => {
+                // 选择地址后重新提交订单
+                createOrder(null, null, addr);
+            });
+            li.innerText = addr + ' ';
+            li.appendChild(button);
+            addressList.appendChild(li);
+        });
+
+        document.getElementById('addresses').classList.remove('hidden');
+        document.getElementById('message').classList.add('hidden');
+        document.getElementById('error').classList.add('hidden');
+    }
+
+    function promptUserForAddress() {
+        const address = prompt('地址不能为空，请输入您的地址：');
+        if (address && address.trim() !== "") {
+            createOrder(null, null, address.trim());
+        } else {
+            handleError('地址输入为空，无法创建订单。');
+        }
+    }
+
+    function handleError(message) {
+        const errorDiv = document.getElementById('error');
+        errorDiv.innerText = `错误：${message}`;
+        errorDiv.classList.remove('hidden');
+        document.getElementById('message').classList.add('hidden');
+        document.getElementById('addresses').classList.add('hidden');
+    }
+
+    // 绑定表单提交事件
+    document.getElementById('order-form').addEventListener('submit', function(event) {
+        event.preventDefault(); // 阻止表单默认提交行为
+
+        // 获取表单输入值
+        const phone = document.getElementById('phone').value.trim();
+        const email = document.getElementById('email').value.trim();
+        const address = document.getElementById('address').value.trim();
+
+        // 清除之前的消息
+        document.getElementById('message').classList.add('hidden');
+        document.getElementById('addresses').classList.add('hidden');
+        document.getElementById('error').classList.add('hidden');
+
+        // 调用createOrder函数
+        createOrder(phone, email, address);
+    });
+</script>
+</body>
+</html>
diff --git a/payment_headend/index.js b/payment_headend/index.js
new file mode 100644
index 0000000..04bf26e
--- /dev/null
+++ b/payment_headend/index.js
@@ -0,0 +1 @@
+console.log('Happy developing ✨')
diff --git a/payment_headend/package.json b/payment_headend/package.json
new file mode 100644
index 0000000..340c6a1
--- /dev/null
+++ b/payment_headend/package.json
@@ -0,0 +1,10 @@
+{
+  "name": "payment_headend",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "private": true
+}
