山东省质量建设监督总站网站,企业网站怎么扣费的,wordpress4.x下载,企业网络搭建案例最近使用jeecgboot些项目#xff0c;总结使用过程中的问题。
form表单
1.下拉框 — 使用字典方式
{label: 工单状态,field: orderStatus,component: JDictSelectTag,componentProps: {dictCode: emergency_order_status,},
}
2.下拉框—使用接口获取数据方式
配置项
{ l…最近使用jeecgboot些项目总结使用过程中的问题。
form表单
1.下拉框 — 使用字典方式
{label: 工单状态,field: orderStatus,component: JDictSelectTag,componentProps: {dictCode: emergency_order_status,},
}
2.下拉框—使用接口获取数据方式
配置项
{ label: 工单状态,field: orderStatus,component: Input,componentProps: {api: employeeUnit,fieldNames: {label: departName,value: orgCode,},},
} Api
export const employeeUnit (params) {return defHttp.get({ url: Api.employeeUnit, params });
};
3.表单发送之前对数据操作 表格查询发送之前的方法searchInfo和beforeFetch都可以添加参数 const { tableContext } useListPage({tableProps: {api: queryTenantPackUserList,immediate: false,columns: tenantPackUserColumns,searchInfo:{}, // 额外的请求参数canResize: false,useSearchForm: false,beforeFetch: (params) {//可以在请求之前默认添加参数params.tenantId tenantPackData.tenantId;return params;},actionColumn: {width: 120,fixed: right,},},
});
4.表单数据联动方式 1. componentProps 传入回调函数配置通过表单的事件来控制数据联动 2.formModel 表单数据 例 选择二级部门后再选择三级部门 {label: 二级部门,field: deptId,component: ApiSelect,componentProps: ({ formModel }) {return {api: getSecondaryDepartmentList,resultField: list,labelField: departName,valueField: id,immediate: false,onChange: (val, option) {if (val) {option.thirdDepart ;if (formModel.hasOwnProperty(thirdDepartId)) {formModel.thirdDepartId ;}}},onDeselect: () {formModel.deptId ;if (formModel.hasOwnProperty(thirdDepartId)) {formModel.thirdDepartId ;}},};},
},
{label: 三级部门,field: thirdDepartId,component: ApiSelect,componentProps: ({ formModel }) {return {api: getThirdDepartmentList,resultField: list,labelField: departName,params: {secondDepartId: formModel.deptId,},valueField: id,immediate: false,onFocus: () {if (!formModel.deptId) {return createMessage.warn(请先选择二级部门);}};},
}, 5.获取表格查询条件参数,在你需要的方法中就可以拿到数据 const [registerTable, { getForm, reload }, { rowSelection, selectedRowKeys }] tableContext;function getTableForm(){console.log(getForm().getFieldsValue())
}6.弹窗下拉框和时间空间加上下面这句就可以超出弹窗了 getPopupContainer: () document.body,{label: 允许预约日期,field: orderDate,component: RangePicker,componentProps: () {return {valueType: Date,getPopupContainer: () document.body,valueFormat: YYYY-MM-DD,};},rules: [{ required: true }],}, 7.使用RangePicker时间空间在初始化表格中的属性fieldMapToTime可设置开始时间和结束时间字段以及格式 字段配置 {label: 日期,field: medicalDate,component: RangePicker,componentProps: () {return {valueType: Date,getPopupContainer: () document.body,};},rules: [{ required: true }],}, 页面设置开始时间和结束时间字段 const { tableContext } useListPage({tableProps: {title: ,columns,canResize: false,formConfig: {schemas: searchFormSchema,autoSubmitOnEnter: true,showAdvancedButton: false,fieldMapToNumber: [],fieldMapToTime: [[medicalDate, [medicalDateStart, medicalDateEnd], YYYY-MM-DD]],},actionColumn: {width: 160,fixed: right,},},}); 8.设置表格查询样式 formConfig: { baseColProps: {xs: 24,sm: 8,md: 6,lg: 8,xl: 6,xxl: 10,},
}
