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('质检单编号未提供');
  }

});


app主要样式
http://localhost:8090//archives/appwen-ti-zong-jie
作者
文伊仪
发布于
2025年04月23日
许可协议