## 注意事项
### 设计相关
- 一个表单只能绑定一个流程，一个流程也只能绑定一个表单，虽然框架支持单流程带多表单，但是我们在代码中屏蔽了这部分设计，如果表单内容较多，建议以子流程、tab页、分区等方式合理显示。
- 一旦某表单绑定了流程，该表单就只能以绑定流程的方式使用（展示一个流程的纯表单部分无意义，用户一定是想和流程一起查看或者审批）
- 流程草稿在单据列表里不会显示（草稿箱中可以找到），这是延续老系统的设计，不属于bug
- 因为代码生成器的特殊性，建议在设计的时候尽可能完善，或者预留某些字段，隐藏起来以便需求调整，开发者需要评估重新生成代码与自行添加字段的工作量
### 界面与用户体验
- 设计器支持响应式布局，因为设计器架构问题，并未默认打开，对于表单内字段，除了附件、多行文本框等占用宽度较大的组件外，都建议开启响应式布局
- 表单和表格需要合理调整字段宽度，响应式布局下需要使用定宽模式，一般情况下，字段的宽度取平均字长 + 2个汉字的宽度为宜，不要留太长的label，也要避免出现label换行

## 在Tab页中打开表单/流程
如果你需要自己编程实现Tab页跳转，或者升级旧版框架的页面，可以参考下面步骤：
```typescript
const { currentRoute } = useRouter();
// 获取表单的绑定的流程 schemaId通过菜单中的路由参数给出
const schemaIdComputedRef = computed(() => currentRoute.value.meta.schemaId as string);
//处理新增逻辑
function handleAdd(){
    if (schemaIdComputedRef.value) {
        router.push({
            path: '/flow/' + schemaIdComputedRef.value + '/0/createFlow'
        });
    } else {
        router.push({
            path: '/form/bizoutapply/0/createForm',
            query: {
                formPath: 'dev/bizoutapply' //这里是表单的所在目录
            }
        });
    }
}
// 处理行的双击逻辑，其他地方可以类似处理
function dbClickRow(record) {
    const workflowData = record.workflowData || {};
    const { processId, taskIds, schemaId } = workflowData;
    if (schemaId && taskIds) {
        // 待办
        router.push({
            path: '/flow/' + schemaId + '/' + processId + '/approveFlow',
            query: {
                taskId: taskIds[0]
            }
        });
    } else if (schemaId && !taskIds) {
        // 已审批的单子
        router.push({
            path: '/flow/' + schemaId + '/' + processId + '/approveFlow',
            query: {
                readonly: 1,
                taskId: ''
            }
        });
    } else {
        // 非流程
        router.push({
            path: '/form/overtimeapply/' + record.id + '/viewForm',
            query: {
                formPath: 'dev/overtimeapply' // 模块路径也要跟着改
            }
        });
    }
}
```
同时，因为外层封装页面需要表单加载后的元数据，需要通过事件将表单数据传出。
```javascript
// 这行是原来有的
import { formProps, formEventConfigs } from './config';

onMounted(async () => {
    emits('form-mounted', formProps); // 补上这一句
});
```