From f072d636c0f4c88c29a00f31bb7140e3a80b6b5a Mon Sep 17 00:00:00 2001 From: biss Date: Sat, 28 Mar 2026 20:31:07 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9Etickets?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ticket/README.md | 156 +++++++++++++++++++++++ ticket/detail.html | 304 +++++++++++++++++++++++++++++++++++++++++++++ ticket/index.html | 240 +++++++++++++++++++++++++++++++++++ 3 files changed, 700 insertions(+) create mode 100644 ticket/README.md create mode 100644 ticket/detail.html create mode 100644 ticket/index.html diff --git a/ticket/README.md b/ticket/README.md new file mode 100644 index 0000000..30f74a2 --- /dev/null +++ b/ticket/README.md @@ -0,0 +1,156 @@ +# 单据查询系统 - Supabase 配置指南 + +## 1. Supabase 数据库设置 + +### 1.1 创建数据表 + +在您的 Supabase 项目中执行以下 SQL 语句创建 `tickets` 表： + +```sql +-- 创建单据表 +CREATE TABLE tickets ( + id UUID DEFAULT gen_random_uuid() PRIMARY KEY, + ticket_number VARCHAR(50) NOT NULL UNIQUE, -- 编号 + customer_name VARCHAR(100), -- 姓名 + reason TEXT, -- 事由 + result TEXT, -- 处理结果 + amount DECIMAL(10, 2) DEFAULT 0, -- 金额 + issuer VARCHAR(100), -- 开具人 + created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(), -- 日期 + processed BOOLEAN DEFAULT FALSE, -- 处理状态 + -- 兼容原字段，保留以便现有代码不报错 + ticket_type VARCHAR(20) DEFAULT 'other', + status VARCHAR(20) DEFAULT 'pending', + contact_phone VARCHAR(20), + email VARCHAR(100), + remarks TEXT, + completed_at TIMESTAMP WITH TIME ZONE, + updated_at TIMESTAMP WITH TIME ZONE DEFAULT NOW() +); + +-- 创建索引以提高查询性能 +CREATE INDEX idx_ticket_number ON tickets(ticket_number); +CREATE INDEX idx_ticket_type ON tickets(ticket_type); +CREATE INDEX idx_status ON tickets(status); +CREATE INDEX idx_created_at ON tickets(created_at); + +-- 创建自动更新时间戳的触发器 +CREATE OR REPLACE FUNCTION update_updated_at_column() +RETURNS TRIGGER AS $$ +BEGIN + NEW.updated_at = NOW(); + RETURN NEW; +END; +$$ LANGUAGE plpgsql; + +CREATE TRIGGER update_tickets_updated_at + BEFORE UPDATE ON tickets + FOR EACH ROW + EXECUTE FUNCTION update_updated_at_column(); +``` + +### 1.2 设置行级安全策略（RLS） + +```sql +-- 启用行级安全 +ALTER TABLE tickets ENABLE ROW LEVEL SECURITY; + +-- 允许所有人读取（根据需要调整） +CREATE POLICY "Allow public read access" ON tickets + FOR SELECT USING (true); + +-- 允许认证用户插入和更新 +CREATE POLICY "Allow authenticated insert" ON tickets + FOR INSERT TO authenticated WITH CHECK (true); + +CREATE POLICY "Allow authenticated update" ON tickets + FOR UPDATE TO authenticated WITH CHECK (true); +``` + +## 2. 获取 Supabase 凭证 + +1. 登录 [Supabase](https://supabase.com) +2. 选择您的项目 +3. 进入 **Settings** > **API** +4. 复制以下内容： + - **Project URL** (替换代码中的 `YOUR_SUPABASE_URL`) + - **anon/public key** (替换代码中的 `YOUR_SUPABASE_ANON_KEY`) + +## 3. 配置前端代码 + +打开 `index.html` 和 `detail.html`，找到以下代码： + +```javascript +const SUPABASE_URL = 'YOUR_SUPABASE_URL'; +const SUPABASE_ANON_KEY = 'YOUR_SUPABASE_ANON_KEY'; +``` + +替换为您从 Supabase 获取的实际值。 + +## 4. Vercel 部署 + +### 4.1 安装 Vercel CLI（可选） + +```bash +npm install -g vercel +``` + +### 4.2 部署步骤 + +1. **使用 Vercel Dashboard 部署**： + - 访问 [vercel.com](https://vercel.com) + - 导入您的 Git 仓库 + - Vercel 会自动检测 HTML 文件并部署 + +2. **使用 CLI 部署**： + ```bash + cd ticket + vercel + ``` + +### 4.3 环境变量（推荐） + +为安全起见，建议使用环境变量： + +1. 在 Vercel 项目设置中添加环境变量： + - `NEXT_PUBLIC_SUPABASE_URL` + - `NEXT_PUBLIC_SUPABASE_ANON_KEY` + +2. 修改代码使用环境变量： +```javascript +const SUPABASE_URL = process.env.NEXT_PUBLIC_SUPABASE_URL || 'YOUR_SUPABASE_URL'; +const SUPABASE_ANON_KEY = process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY || 'YOUR_SUPABASE_ANON_KEY'; +``` + +## 5. 测试数据 + +您可以插入一些测试数据： + +```sql +INSERT INTO tickets (ticket_number, ticket_type, amount, status, customer_name, contact_phone, email, remarks) VALUES +('TKT20260328001', 'invoice', 1500.00, 'completed', '张三', '13800138000', 'zhangsan@example.com', '办公用品采购'), +('TKT20260328002', 'receipt', 800.00, 'processing', '李四', '13900139000', 'lisi@example.com', '咨询服务费'), +('TKT20260328003', 'order', 2500.00, 'pending', '王五', '13700137000', 'wangwu@example.com', '设备租赁'), +('TKT20260328004', 'invoice', 3200.00, 'completed', '赵六', '13600136000', 'zhaoliu@example.com', '软件授权费'), +('TKT20260328005', 'other', 500.00, 'cancelled', '钱七', '13500135000', 'qianqi@example.com', '其他费用'); +``` + +## 6. 功能说明 + +- ✅ 按单据编号模糊查询 +- ✅ 按单据类型筛选 +- ✅ 按日期范围查询 +- ✅ 查看单据详情 +- ✅ 打印单据功能 +- ✅ 响应式设计，支持移动端 + +## 7. 注意事项 + +1. **安全性**：生产环境务必使用环境变量存储敏感信息 +2. **权限控制**：根据实际需求调整 RLS 策略 +3. **性能优化**：大数据量时考虑分页和更多索引 +4. **错误处理**：已包含基本的错误提示机制 + +## 8. 自定义样式 + +如需修改样式，可以编辑 HTML 文件中的 ` + + + +
+ ← 返回查询页面 + +
+
正在加载详情...
+
+
+ + + + \ No newline at end of file diff --git a/ticket/index.html b/ticket/index.html new file mode 100644 index 0000000..523eaee --- /dev/null +++ b/ticket/index.html @@ -0,0 +1,240 @@ + + + + + + 单据查询 + + + + + + + +
+ ← 返回首页 + +

单据查询

+ +
+
+ + +
+ +
+ + +
+ +
+ + +
+ + +
+ +
+ +
+
+ + + + \ No newline at end of file