【泛微低代码开发平台e-builder】控制eb表单按钮显示(请求拦截方式)
·
业务需求
用户想通过目前eb提供的按钮权限配置项外的方式,根据实际业务逻辑控制表单按钮显示
实现方式
给当前表单所有按钮开启所有人权限,ecode使用 axios.interceptors 对eb的 /api/ebuilder/form/data/getFormButtons 接口返回数据进行拦截处理,在拦截到数据后请求自行编写的业务按钮过滤逻辑接口,该接口需要返回当前用户不能进行操作的按钮id,遍历拦截的按钮数据,将用户不能操作的按钮清除,再返回给前端组件渲染,达到根据业务控制按钮显示的目的
具体示例代码:
// 按钮拦截
axios.interceptors.request.use(
req=>{
if(req.url.includes('/api/ebuilder/form/data/getFormButtons')) {
window.sessionStorage.setItem('governTaskDataId',req.data.dataId);
}
return req;
}, // 对发起的请求进行处理,方法写在{}中,req是请求参数
err=>{
return Promise.reject(err);
}, // 出现请求错误时进行的处理
);
axios.interceptors.response.use(
function (response) {
// 响应状态码为 2xx 时触发成功的回调,形参中的 response 是“成功的结果”
let buttonData = {};
if (
response.status === 200 &&
response.config.url.includes('/api/ebuilder/form/data/getFormButtons')
) {
let formId = window.ebdFormSdk && window.ebdFormSdk.getObjId();
let dataId = window.sessionStorage.getItem('governTaskDataId');
if (!formId || !dataId) return response;
var oldButtonMap = new Map();
let newButtonArray = new Array();
response.data.data.forEach((item,index) => {
oldButtonMap.set(item.id,item);
});
return new Promise(function (resolve, reject) {
weappUtils.request({
url: '/api/government/base/getCurrentUserCannotOperateButtonId?dataId='+dataId+"&formId="+formId,
method: 'post',
}).then((res) => {
if (res.status && Object.keys(res.data).length > 0 && res.data.isGovernApp) {
res.buttonIdSet = res.data?.buttonIdSet.map((item) => {
if(oldButtonMap.has(item) > 0) {
oldButtonMap.delete(item);
}
});
for(let item of oldButtonMap.entries()){
newButtonArray.push(item[1]);
}
response.data.data = newButtonArray;
console.log(response);
resolve({
...response,
});
}
else {
resolve({
...response,
});
}
}).catch(()=> {
resolve({
...response,
});
});
});
// return response;
}else {
return response;
}
},
function (error) {
// console.log(error)
// 响应状态码不是 2xx 时触发失败的回调,形参中的 error 是“失败的结果”
return Promise.reject(error);
},
);
更多推荐

所有评论(0)