JPwise-docs

Appearance

JPwise-Web 快速参考 - Claude Code ​

项目基础 ​

启动命令 ​

bash
npm i                    # 安装依赖
npm run dev             # 开发环境
npm run build           # 生产构建
npm run lint -- --fix  # 代码格式修复

配置文件 ​

  • 开发环境：src/utils/define.js - 修改 APIURl
  • 生产环境：public/config.js - 修改 APIURl

核心概念 ​

功能类型 (webType) ​

  • 0 = 列表 | 1 = 表单 | 2 = 台账 | 3 = 流程

流程状态 (FLOWPHASE) ​

  • 0 = 等待提交 | 1 = 等待审核 | 2 = 审核通过
  • 3 = 审核驳回 | 4 = 流程撤回 | 5 = 审核终止

打开来源 (opType) ​

  • -1 = 新建/编辑 | 0 = 详情 | 1 = 待办 | 2 = 已办
  • 3 = 抄送待办 | 4 = 流程监控 | 5 = 抄送已办

最常用功能 ​

1. 弹窗函数 openWindow（使用频率 ⭐⭐⭐⭐⭐） ​

javascript
openWindow({
  url: "views/basic/dynamicModel/list/Form",  // 表单页面
  title: "编辑数据",
  width: "800px", 
  height: "600px",
  data: {
    TmplCode: "功能设计ID",  // 必需
    id: "数据ID",
    formType: 2,  // 1-开发模式，2-配置模式
    opType: "1"   // 流程状态
  },
  onDestroy: {
    confirm: ({ data }) => console.log('确认', data),
    componentClose: () => console.log('关闭')
  }
});

2. 表单数据操作（使用频率 ⭐⭐⭐⭐⭐） ​

javascript
// 表单脚本中使用
setFormData("字段名", "值");           // 设置值
setShowOrHide("字段名", true);        // 显示/隐藏
setRequired("字段名", true);          // 设置必填
setDisabled("字段名", true);          // 设置禁用
setFieldOptions("字段名", [options]); // 设置选项

3. 常用工具方法（使用频率 ⭐⭐⭐⭐） ​

javascript
this.jnpf.toDate(value, 'YYYY-MM-DD')     // 日期格式化
this.jnpf.getEnumText(codes, enumList)    // 枚举转文本
this.jnpf.storageSet({key: value})        // 存储数据
this.jnpf.storageGet("key")               // 读取数据
this.jnpf.hasP("权限码")                   // 权限检查

4. 必须使用的混入（使用频率 ⭐⭐⭐⭐⭐） ​

javascript
// 列表页面
import listMixin from '@/mixins/basics/list'
export default {
  mixins: [listMixin],
  data() { return { apiUrl: '/api/module/list' } }
}

// 表单页面  
import formMixin from '@/mixins/basics/form'
export default {
  mixins: [formMixin],
  data() { return { apiUrl: '/api/module' } }
}

// 权限控制
import btnPermission from '@/mixins/btn_permission'

快速开发 ​

列表页面核心结构 ​

javascript
// 数据结构
data() {
  return {
    list: [],
    apiUrl: "接口路径",
    query: { $LK$NAME: "" },
    listQuery: { currentPage: 1, pageSize: 20 },
    loadListMethod: getPageList
  }
}

表单页面核心结构 ​

javascript
// 表单脚本事件
// onLoad: 表单加载时
// beforeSubmit: 提交前（有 eventType 参数）

// 可用对象
formData          // 表单数据
userState         // 用户信息
flowTaskInfo      // 流程信息

调试技巧 ​

常用调试方法 ​

javascript
console.log('formData:', formData);
console.log('用户信息:', userState.userInfo);
console.log('流程信息:', flowTaskInfo);

权限检查 ​

javascript
this.jnpf.hasFormP('字段名')     // 表单字段权限
this.jnpf.hasBtnP({code: 'edit'}) // 按钮权限

常见问题解决 ​

  1. 弹窗不显示 → 检查 TmplCode 或 flowId 参数
  2. 表单数据不更新 → 使用 setFormData 而不是直接赋值
  3. 权限控制无效 → 检查权限码是否正确
  4. 枚举不显示 → 检查 enumCode 和 enumFormat 配置

这个快速参考涵盖了 80% 的常用场景，可以让你快速上手开发。