<template>
|
<el-dialog
|
v-model="dialogVisible"
|
title="杂发平账"
|
width="600px"
|
:close-on-click-modal="false"
|
:destroy-on-close="true"
|
@closed="handleDialogClosed"
|
>
|
<div class="reconciliation-container">
|
<!-- 移除单据ID展示，仅保留条码输入框 -->
|
<!-- 条码输入框 -->
|
<div class="barcode-input-container">
|
<el-input
|
v-model="barcode"
|
placeholder="请输入/扫描条码后平账"
|
clearable
|
@keyup.enter="handleEnterConfirm"
|
class="barcode-input"
|
:disabled="loading"
|
/>
|
</div>
|
|
<!-- 空提示（仅条码为空时显示） -->
|
<div class="empty-tip" v-if="!barcode && !loading">
|
<span>请输入条码后进行平账操作</span>
|
</div>
|
</div>
|
|
<template #footer>
|
<el-button @click="dialogVisible = false">关闭</el-button>
|
<el-button
|
type="primary"
|
@click="handleConfirm"
|
:disabled="!barcode || loading"
|
:loading="loading"
|
>
|
{{ loading ? "平账中..." : "确认平账" }}
|
</el-button>
|
</template>
|
</el-dialog>
|
|
<!-- 打印组件（保留原有逻辑） -->
|
<printView ref="printViewRef" @parentcall="parentcall"></printView>
|
</template>
|
|
<script setup>
|
import { ref } from "vue";
|
import printView from "@/extension/outbound/extend/printView.vue";
|
import { ElMessage, ElMessageBox } from "element-plus";
|
import axios from "axios";
|
|
// 弹窗显示状态
|
const dialogVisible = ref(false);
|
// 条码输入框值
|
const barcode = ref("");
|
// 加载状态
|
const loading = ref(false);
|
// 打印组件ref引用
|
const printViewRef = ref(null);
|
|
// 打开弹窗方法（无参数，供父组件直接调用）
|
const open = () => {
|
barcode.value = ""; // 每次打开弹窗重置条码
|
dialogVisible.value = true;
|
};
|
|
// 弹窗关闭时的处理
|
const handleDialogClosed = () => {
|
barcode.value = "";
|
loading.value = false;
|
};
|
|
// 父组件调用的回调（保留原有逻辑）
|
const parentcall = (params) => {
|
console.log("printView回调参数：", params);
|
};
|
|
// 回车触发平账（扫码枪自动回车时调用）
|
const handleEnterConfirm = async () => {
|
if (!barcode.value) {
|
ElMessage.warning("请输入条码后再操作");
|
return;
|
}
|
await handleConfirm();
|
};
|
|
// 确认平账操作（核心逻辑）
|
const handleConfirm = async () => {
|
if (!barcode.value) {
|
ElMessage.warning("请输入条码进行平账处理");
|
return;
|
}
|
|
try {
|
// 确认提示
|
await ElMessageBox.confirm(
|
`确定要对条码 ${barcode.value} 进行平账处理吗？`,
|
"平账确认",
|
{
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning",
|
}
|
);
|
|
loading.value = true;
|
|
// 调用平账接口（仅传递barcode参数）
|
const params = {
|
barcode: barcode.value,
|
};
|
|
const response = await axios.get(
|
"/api/TakeStockOrder/DocumentReconciliation",
|
{
|
params: params,
|
}
|
);
|
|
console.log("接口完整返回值：", response); // 调试用
|
|
// 校验接口返回状态
|
if (response.data?.status) {
|
ElMessage.success("平账操作成功");
|
|
// 解析返回数据（保留原有打印逻辑）
|
const thirdLayerData = response.data.data?.data;
|
const scannedDetail = thirdLayerData?.scannedDetail;
|
|
console.log("解析后的scannedDetail：", scannedDetail);
|
|
// 判断打印条件并触发打印
|
if (scannedDetail?.isUnpacked && scannedDetail?.materialCodes?.length > 0) {
|
if (printViewRef.value) {
|
console.log("触发打印方法，参数：", scannedDetail.materialCodes);
|
printViewRef.value.open(scannedDetail.materialCodes);
|
} else {
|
ElMessage.warning("打印组件未加载完成，请检查组件引用");
|
}
|
} else {
|
ElMessage.info("无需打印：未满足拆包条件或无物料编码数据");
|
}
|
|
dialogVisible.value = false; // 平账成功后关闭弹窗
|
} else {
|
ElMessage.error(response.data?.message || "平账操作失败");
|
}
|
} catch (error) {
|
// 区分用户取消和真实错误
|
if (error === "cancel" || error === "close") {
|
ElMessage.info("已取消平账操作");
|
return;
|
}
|
console.error("平账接口调用失败：", error);
|
ElMessage.error(`平账操作失败：${error.message || "网络异常"}`);
|
} finally {
|
loading.value = false; // 无论成功失败，结束加载状态
|
}
|
};
|
|
// 暴露方法给父组件
|
defineExpose({
|
open,
|
});
|
</script>
|
|
<style scoped>
|
.reconciliation-container {
|
padding: 10px 0;
|
}
|
|
/* 条码输入框样式 */
|
.barcode-input-container {
|
margin: 20px 0;
|
}
|
|
.barcode-input {
|
width: 100%;
|
font-size: 16px;
|
height: 48px;
|
}
|
|
.empty-tip {
|
text-align: center;
|
padding: 50px 0;
|
color: #909399;
|
}
|
</style>
|
