增加会员手机号检索
This commit is contained in:
parent
d7aafd537b
commit
b886ad9298
110
CLAUDE.md
110
CLAUDE.md
|
|
@ -1,110 +0,0 @@
|
|||
# 大数集市商户端 Demo 项目
|
||||
|
||||
## 项目概述
|
||||
这是一个中文商户后台管理系统的原型demo项目，用于快速说明项目意图。项目采用纯HTML/CSS/JavaScript技术栈，分为web端和H5端两套界面，内部业务逻辑相近但页面呈现方式不同。
|
||||
|
||||
## 项目结构
|
||||
```
|
||||
chinese-merchant-dashboard/
|
||||
├── web/merchant/ # Web端 (桌面端)
|
||||
│ ├── index.html # 主页面
|
||||
│ ├── css/styles.css # Web端样式
|
||||
│ ├── js/ # Web端JavaScript
|
||||
│ │ ├── main.js # 主要逻辑
|
||||
│ │ ├── common.js # 公共函数
|
||||
│ │ ├── sidebar.js # 侧边栏逻辑
|
||||
│ │ ├── member-tabs.js # 会员标签页管理
|
||||
│ │ └── pages/ # 各页面逻辑
|
||||
│ ├── pages/ # Web端页面
|
||||
│ └── demo/ # 演示版本
|
||||
├── H5/merchant/ # H5端 (移动端)
|
||||
│ ├── index.html # H5主页面
|
||||
│ ├── css/mobile.css # H5样式
|
||||
│ ├── js/ # H5 JavaScript
|
||||
│ │ ├── mobile-common.js # H5公共函数
|
||||
│ │ └── pages/ # H5页面逻辑
|
||||
│ └── pages/ # H5页面
|
||||
```
|
||||
|
||||
## 核心功能模块
|
||||
|
||||
### 会员管理系统
|
||||
- **等级设置**: 会员等级的创建、编辑和管理
|
||||
- **会员查看**: 会员信息的查看和筛选
|
||||
- **批量编辑**: 支持多步骤的批量会员信息编辑流程
|
||||
|
||||
### 积分系统
|
||||
- **积分任务**: 积分获取任务的配置和管理
|
||||
- **积分商品**: 积分兑换商品的管理
|
||||
- **积分订单**: 积分相关订单的处理
|
||||
|
||||
### 营销工具
|
||||
- **优惠券营销**: 优惠券的创建、发放和管理
|
||||
- **预售营销**: 预售活动的配置和管理
|
||||
|
||||
### 数据中心
|
||||
- **业务数据**: 各类业务数据的统计和展示
|
||||
- **运营分析**: 运营指标的分析和报表
|
||||
|
||||
## 技术特点
|
||||
|
||||
### Web端特性
|
||||
- 基于Tailwind CSS的响应式布局
|
||||
- 左侧折叠式菜单导航
|
||||
- Tab页面管理系统
|
||||
- 实时搜索功能
|
||||
- 开关切换和表单交互
|
||||
|
||||
### H5端特性
|
||||
- 移动端优化的触摸交互
|
||||
- 简化的导航结构
|
||||
- 分步骤的操作流程
|
||||
- 移动端适配的表单设计
|
||||
|
||||
### 共同特性
|
||||
- 纯前端静态页面，无后端依赖
|
||||
- 模拟数据展示完整业务流程
|
||||
- 统一的绿色主题设计
|
||||
- 中文本地化界面
|
||||
|
||||
## 开发指南
|
||||
|
||||
### 本地运行
|
||||
```bash
|
||||
# 推荐使用本地服务器
|
||||
python -m http.server 8000
|
||||
# 或
|
||||
npx serve .
|
||||
```
|
||||
|
||||
### 文件编辑原则
|
||||
1. **优先编辑现有文件**，避免创建新文件
|
||||
2. **保持Web端和H5端功能同步**
|
||||
3. **遵循现有的命名规范和代码风格**
|
||||
4. **所有文本保持中文**
|
||||
|
||||
### 样式系统
|
||||
- Web端: 基于Tailwind CSS类名
|
||||
- H5端: 自定义CSS，针对移动端优化
|
||||
- 主题色: 绿色系 (#059669, #10b981)
|
||||
|
||||
### JavaScript架构
|
||||
- 使用原生JavaScript ES6+
|
||||
- 模块化的页面逻辑组织
|
||||
- 事件驱动的交互模式
|
||||
- 状态管理通过全局变量
|
||||
|
||||
## 测试和构建
|
||||
- 这是静态演示项目，无需构建步骤
|
||||
- 在浏览器中直接测试所有功能
|
||||
- 支持Chrome 60+, Firefox 55+, Safari 12+, Edge 79+
|
||||
|
||||
## 注意事项
|
||||
1. 所有数据都是模拟数据，仅用于界面演示
|
||||
2. 不包含真实的后端API调用
|
||||
3. 表单提交和数据操作仅有视觉反馈
|
||||
4. 项目用于原型展示，不适合生产环境直接使用
|
||||
|
||||
## 快捷键
|
||||
- `ESC`: 返回首页 (Web端)
|
||||
- `Ctrl+F`: 聚焦搜索框 (Web端)
|
||||
|
|
@ -350,7 +350,7 @@ function showGrowthDetail(changeTime, changeValue, relatedOrder) {
|
|||
<div class="detail-value">${getRandomStore()}</div>
|
||||
</div>
|
||||
<div class="detail-section">
|
||||
<div class="detail-label">成长值受化:</div>
|
||||
<div class="detail-label">成长值变化:</div>
|
||||
<div class="detail-value positive">${changeValue}</div>
|
||||
</div>
|
||||
`;
|
||||
|
|
@ -483,11 +483,11 @@ function showPointsDetail(changeTime, changeValue, relatedOrder) {
|
|||
<div class="detail-value">${changeTime}</div>
|
||||
</div>
|
||||
<div class="detail-section">
|
||||
<div class="detail-label">订单归属据点:</div>
|
||||
<div class="detail-label">订单归属摊位:</div>
|
||||
<div class="detail-value">${getRandomStore()}</div>
|
||||
</div>
|
||||
<div class="detail-section">
|
||||
<div class="detail-label">积分受化:</div>
|
||||
<div class="detail-label">积分变化:</div>
|
||||
<div class="detail-value ${changeValue.startsWith('+') ? 'positive' : 'negative'}">${changeValue}</div>
|
||||
</div>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -43,18 +43,20 @@ function toggleSelectAll() {
|
|||
function searchMembers() {
|
||||
const storeFilter = document.getElementById('storeFilter').value;
|
||||
const nicknameFilter = document.getElementById('nicknameFilter').value;
|
||||
const phoneFilter = document.getElementById('phoneFilter').value;
|
||||
const levelFilter = document.getElementById('levelFilter').value;
|
||||
const registrationDate = document.getElementById('registrationDate').value;
|
||||
|
||||
console.log('筛选条件:', {
|
||||
store: storeFilter,
|
||||
nickname: nicknameFilter,
|
||||
phone: phoneFilter,
|
||||
level: levelFilter,
|
||||
date: registrationDate
|
||||
});
|
||||
|
||||
// 这里实现筛选逻辑
|
||||
filterMemberTable(storeFilter, nicknameFilter, levelFilter, registrationDate);
|
||||
filterMemberTable(storeFilter, nicknameFilter, phoneFilter, levelFilter, registrationDate);
|
||||
}
|
||||
|
||||
// 筛选表格数据
|
||||
|
|
|
|||
|
|
@ -19,6 +19,10 @@
|
|||
<label>用户昵称</label>
|
||||
<input type="text" id="nicknameFilter" placeholder="请输入用户昵称">
|
||||
</div>
|
||||
<div class="filter-item">
|
||||
<label>手机号</label>
|
||||
<input type="text" id="phoneFilter" placeholder="请输入手机号">
|
||||
</div>
|
||||
<div class="filter-item">
|
||||
<label>会员等级</label>
|
||||
<select id="levelFilter">
|
||||
|
|
|
|||
Loading…
Reference in New Issue