赵忠林
eac1102eb1
- 改进 index.tsx 模板，增加智能字段检测和条件性功能生成 - 修复字段注释为空时模板渲染失败的问题 - 添加自动更新 app.config.ts 页面路径的功能 - 新增 ShopArticle相关的实体、Mapper、Service 等代码 - 优化 add.tsx 和 add.config.ts模板，提高用户体验
109 lines
3.1 KiB
Markdown
109 lines
3.1 KiB
Markdown
# index.tsx 模板改进说明
|
|
|
|
## 🔍 发现的问题
|
|
|
|
### 1. 硬编码字段名
|
|
**问题**：原模板假设所有表都有 `name` 和 `description` 字段
|
|
```typescript
|
|
// 原来的硬编码方式
|
|
<View>{item.name}</View>
|
|
<View>{item.description}</View>
|
|
```
|
|
|
|
### 2. 固定的业务逻辑
|
|
**问题**：所有表都生成"默认选项"功能，即使表中没有 `isDefault` 字段
|
|
|
|
### 3. 不够灵活的显示方式
|
|
**问题**：没有根据实际表结构动态调整显示内容
|
|
|
|
## ✅ 改进内容
|
|
|
|
### 1. 智能字段检测
|
|
```typescript
|
|
<% var hasIsDefaultField = false; %>
|
|
<% for(field in table.fields){ %>
|
|
<% if(field.propertyName == 'isDefault'){ %>
|
|
<% hasIsDefaultField = true; %>
|
|
<% } %>
|
|
<% } %>
|
|
```
|
|
|
|
### 2. 条件性功能生成
|
|
- **有 `isDefault` 字段**：生成完整的默认选项功能
|
|
- **无 `isDefault` 字段**：只生成基本的列表和编辑功能
|
|
|
|
### 3. 动态字段显示
|
|
```typescript
|
|
<% var displayFields = []; %>
|
|
<% for(field in table.fields){ %>
|
|
<% if(field.propertyName != 'id' && field.propertyName != 'createTime' && field.propertyName != 'updateTime' && field.propertyName != 'isDefault'){ %>
|
|
<% displayFields.add(field); %>
|
|
<% } %>
|
|
<% } %>
|
|
```
|
|
|
|
自动选择前两个可显示字段作为主要显示内容。
|
|
|
|
## 🎯 改进效果
|
|
|
|
### 有 `isDefault` 字段的表（如地址、支付方式）
|
|
- ✅ 生成默认选项设置功能
|
|
- ✅ 支持点击选择默认项
|
|
- ✅ 显示默认选项状态图标
|
|
|
|
### 无 `isDefault` 字段的表（如商品、分类）
|
|
- ✅ 只生成基本的列表显示
|
|
- ✅ 支持编辑和删除操作
|
|
- ✅ 不生成不必要的默认选项功能
|
|
|
|
### 字段显示逻辑
|
|
- **第一个字段**：作为主标题显示（较大字体）
|
|
- **第二个字段**：作为副标题显示（较小字体）
|
|
- **自动过滤**：排除 `id`、`createTime`、`updateTime`、`isDefault` 等系统字段
|
|
|
|
## 📋 生成示例
|
|
|
|
### 地址表（有 isDefault 字段）
|
|
```typescript
|
|
// 会生成完整的默认地址功能
|
|
const selectItem = async (item: ShopUserAddress) => {
|
|
// 设置默认地址逻辑
|
|
}
|
|
|
|
// 显示默认选项图标
|
|
{item.isDefault ? <Checked /> : <CheckNormal />}
|
|
```
|
|
|
|
### 商品表（无 isDefault 字段）
|
|
```typescript
|
|
// 只生成基本列表功能，无默认选项相关代码
|
|
<Cell className={'flex flex-col gap-1'}>
|
|
<View>{item.name}</View> // 第一个字段
|
|
<View>{item.description}</View> // 第二个字段
|
|
</Cell>
|
|
```
|
|
|
|
## 🔧 技术实现
|
|
|
|
### Beetl 模板语法
|
|
- `<% var hasIsDefaultField = false; %>` - 定义变量
|
|
- `<% displayFields.add(field); %>` - 数组操作
|
|
- `<% if(hasIsDefaultField){ %>` - 条件判断
|
|
- `${displayFields[0].propertyName}` - 动态字段访问
|
|
|
|
### 字段过滤规则
|
|
排除以下系统字段：
|
|
- `id` - 主键
|
|
- `createTime` - 创建时间
|
|
- `updateTime` - 更新时间
|
|
- `isDefault` - 默认标志（单独处理）
|
|
|
|
## 🎉 优势
|
|
|
|
1. **更加通用**：适用于各种不同结构的表
|
|
2. **智能适配**：根据表结构自动调整功能
|
|
3. **减少冗余**：不生成不必要的代码
|
|
4. **更好维护**：生成的代码更符合实际业务需求
|
|
|
|
现在生成的移动端列表页面更加智能和实用了！
|