app主要样式
搜索
// 构建查询参数
function buildQueryParam(pageNum) {
queryForm.pageNum = pageNum;
return Object.assign({}, queryForm, { pageNum });
}
将
pageNum
(当前页面)赋值给queryForm.pageNum
。使用
Object.assign
方法创建一个新的对象,包含queryForm
的所有属性,并添加或覆盖pageNum
属性。返回这个新的对象作为查询参数。
// 查询
async function query(mescroll, isDownFlag, param) {
try {
let res = await purchaseOrderApi.getPurchaseOrderList(param);
if (!isDownFlag) {
purchaseOrderList.value = purchaseOrderList.value.concat(res.data.list);
} else {
purchaseOrderList.value = res.data.list;
}
mescroll.endSuccess(res.data.list.length, res.data.pages > res.data.pageNum);
} catch (e) {
smartSentry.captureError(e);
//联网失败, 结束加载
mescroll.endErr();
}
}
异步函数用于从服务器获取采购订单列表。
mescroll
是滚动插件实例。isDownFlag
表示是否是下拉刷新操作。如果是下拉刷新,值为true
;否则为false
。param
是查询参数,通过buildQueryParam
函数构建。使用
try...catch
块来处理请求和错误。如果请求成功,根据isDownFlag
的值决定是追加数据还是替换数据。最后调用mescroll.endSuccess
方法结束加载动画。如果请求失败,捕获异常并调用mescroll.endErr
方法结束加载动画。
//搜索
function search() {
query(getMescroll(), true, buildQueryParam(1));
uni.pageScrollTo({
scrollTop: 0,
});
}
这个函数用于触发搜索操作。
它调用了
query
函数,传入getMescroll()
(获取滚动插件实例)、true
(表示是下拉刷新)和buildQueryParam(1)
(构建查询参数)。然后调用
uni.pageScrollTo
方法将页面滚动到顶部。
弹窗
父组件
<!-- 弹窗组件 -->
<purchasemodal ref="queryFormPopUpRef" @close="searchUpdate"/>
//弹窗
function toggleModal() {
queryFormPopUpRef.value.show();
}
//关闭
function searchUpdate(data) {
if(data===null){
return;
}else{
queryForm.purchaseOrderStatus = data.purchaseOrderStatus;
query(getMescroll(), true, buildQueryParam(1));
uni.pageScrollTo({
scrollTop: 0,
});
}
}
将
data.purchaseOrderStatus
赋值给queryForm.purchaseOrderStatus
。然后调用
query
函数,传入getMescroll()
(获取滚动插件实例)、true
(表示是下拉刷新)和buildQueryParam(1)
(构建查询参数)。最后调用
uni.pageScrollTo
方法将页面滚动到顶部。
子组件
function cancel() {
close();
temp.value = '';
emits('close', null);
}
function ok() {
close();
emits('close', toRaw(form));
temp.value = '';
}
emits('close', toRaw(form))
: 触发一个名为 'close'
的事件,并传递 toRaw(form)
作为参数。toRaw
是 Vue.js 中的一个方法,用于获取原始对象,而不是其响应式代理
带参跳转
父组件
//跳转到详情页
function navigateToDetail(qualityInspectionOrderCode) {
// 调用 uni.navigateTo 方法进行页面跳转
uni.navigateTo({
url: `/pages/workbench/quality-control/incoming-inspection/incoming-inspection-confirm3/components/incoming-inspection-query-detail3?qualityInspectionOrderCode=${qualityInspectionOrderCode}`
});
}
子组件
async function getQualityControlDetail(qualityInspectionCode) {
formData.value = {};
try {
let res = await qualityControlApi.getQualityControlDetail(qualityInspectionCode);
formData.value = res.data;
materials.value = res.data.qualityInspectionOrderGoodsDetailsList.map((item, index) => ({
createTime: item.createTime,
goodsCode:item.goodsCode,
goodsName: item.goodsName,
goodsSpecification: item.goodsSpecification,
expectedQualityInspectGoodsNumber: item.expectedQualityInspectGoodsNumber,
updaterName: item.updaterName,
updateTime: item.updateTime,
goodsUnitId: item.goodsUnitId,
goodsUnitName:item.goodsUnitName,
expectedQualityInspectGoodsNumber:item.expectedQualityInspectGoodsNumber,
qualityInspectionPassedGoodsNumber:item.qualityInspectionPassedGoodsNumber,
defectiveItemCause:item.defectiveItemCause
}));
} catch (error) {
console.error('获取数据失败:', error);
}
}
// 组件挂载时获取数据
onMounted(() => {
if (qualityInspectionCode) {
getQualityControlDetail(qualityInspectionCode);
} else {
console.error('质检单编号未提供');
}
});