WMS/wms-ui
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化称重页面

Browse Source
This commit is contained in:
zc
2026-03-03 17:59:37 +08:00
parent cbd73d4312
commit 85dd8102a3
8 changed files with 235 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
src/views/weightManage/index.vue
View File

@@ -25,8 +25,8 @@
<div class="main-content">
<!-- 左侧表单 -->
<div class="left-section">
<a-image v-if="!formData.imageUrl" :src="formData.imageUrl"/>
<img v-else :src="formData.imageUrl" class="sample-image square-image" alt="样图">
<a-image v-if="!formData.photoUrl" :src="formData.photoUrl"/>
<img v-else :src="formData.photoUrl" class="sample-image square-image" alt="样图">
<a-form :model="formData" layout="vertical">
<div class="form-row">
@@ -44,12 +44,12 @@
<div class="form-row">
<div class="form-item">
<a-form-item label="物料编码">
<a-input v-model="formData.materialCode" placeholder="物料编码" disabled />
<a-input v-model="formData.encoding" placeholder="物料编码" disabled />
</a-form-item>
</div>
<div class="form-item">
<a-form-item label="重量">
<a-input v-model="formData.weight" placeholder="Kg" disabled />
<a-input v-model="formData.unitWeight" placeholder="Kg" disabled />
</a-form-item>
</div>
</div>
@@ -83,7 +83,7 @@
</div>
<div class="info-item">
<span class="label">物料编码:</span>
<span class="value">{{ formData.materialCode || '-' }}</span>
<span class="value">{{ formData.encoding || '-' }}</span>
</div>
</div>
@@ -123,19 +123,19 @@
<div class="form-row">
<div class="form-item">
<label>输入数量:</label>
<a-input v-model="inputQuantity" placeholder="请输入数量" />
<a-input v-model="inputQuantity" placeholder="请输入数量" @change="calculateWeight" />
</div>
</div>
<div class="form-row">
<div class="form-item">
<label>计算重量:</label>
<a-input v-model="calculatedWeight" placeholder="-" disabled />
</div>
</div>
<div class="form-row">
<div class="form-item">
<label>对应重量:</label>
<a-input v-model="inputWeight" placeholder="请输入重量" />
</div>
</div>
<div class="form-row">
<div class="form-item">
<label>称重次数:</label>
<a-input v-model="weighingCount" placeholder="称重次数" disabled />
<a-input v-model="inputWeight" placeholder="-" disabled/>
</div>
</div>
<div class="image-placeholder large-image">实时画面</div>
@@ -185,7 +185,7 @@
</div>
<div class="info-item">
<span class="label">物料编码:</span>
<span class="value">{{ formData.materialCode }}</span>
<span class="value">{{ formData.encoding }}</span>
</div>
<div class="info-item">
<span class="label">物料规格:</span>
@@ -193,7 +193,7 @@
</div>
<div class="info-item">
<span class="label">重量:</span>
<span class="value">{{ formData.weight }}</span>
<span class="value">{{ formData.unitWeight }}</span>
</div>
</div>
<div class="completion-actions">
@@ -211,10 +211,11 @@
>
上一步
</a-button>
<a-button
v-if="activeStep < 3"
type="primary"
<a-button
v-if="activeStep < 3"
type="primary"
@click="handleNext"
:disabled="activeStep === 1 && formData.matchResult !== 'success'"
class="next-button"
>
{{ activeStep === 2 ? '完成' : '下一步' }}
@@ -226,8 +227,8 @@
<script setup lang="ts">
import { ref, reactive, computed } from 'vue'
import { Modal, Icon } from '@arco-design/web-vue'
import {getMaterialDetail, type WeighManageQuery} from "@/apis/weightManage/weightManage";
import { Modal } from '@arco-design/web-vue'
import { getMaterialDetail } from "@/apis/weightManage/weightManage";
// 当前步骤
const activeStep = ref(1)
@@ -235,17 +236,18 @@ const activeStep = ref(1)
// 表单数据
const formData = reactive({
inputMaterialCode: '', // 输入的物料编码
materialCode: '', // 物料编码
encoding: '', // 物料编码
materialName: '', // 物料名称
materialSpec: '', // 物料规格
weight: 0, // 重量
imageUrl: '', // 样图URL
unitWeight: 0, // 重量
photoUrl: '', // 样图URL
matchResult: '' // 比对结果
})
// 称重登记页面数据
const inputQuantity = ref('')
const inputWeight = ref('')
const calculatedWeight = ref('')
const weighingCount = ref(1)
// 称重列表数据
@@ -257,7 +259,7 @@ const weighingList = ref([
const taskId = computed(() => {
const date = new Date().toISOString().slice(0, 10).replace(/-/g, '')
const random = Math.floor(1000 + Math.random() * 9000)
return `${date}${formData.materialCode}${random}`
return `${date}${formData.encoding}${random}`
})
// 称重表格列
@@ -279,6 +281,12 @@ const columns = [
key: 'weight',
className: 'green-bg'
},
{
title: '计算重量',
dataIndex: 'calculatedWeight',
key: 'calculatedWeight',
className: 'green-bg'
},
{
title: '抓拍图片',
dataIndex: 'image',
@@ -304,29 +312,25 @@ const handleMaterialCodeChange = async () => {
console.error('获取物料数据失败:', error)
}
} else {
formData.materialCode = "";
formData.encoding = "";
formData.materialName = "";
formData.materialSpec = "";
formData.weight = 0;
formData.imageUrl = "";
formData.unitWeight = 0;
formData.photoUrl = "";
formData.matchResult = "";
}
};
// 模拟调用后端接口
const fetchMaterialData = async (code: string) => {
const query: WeighManageQuery = {
materialCode: code
}
getMaterialDetail(query).then(res => {
getMaterialDetail(code).then(res => {
if (res.code == '0') {
// 更新表单数据
formData.materialCode = res.data.materialCode
formData.encoding = res.data.encoding
formData.materialName = res.data.materialName
formData.materialSpec = res.data.materialSpec
formData.weight = res.data.weight
// formData.imageUrl = res.data.imageUrl
formData.imageUrl = "https://menjing.hzjj.cn/uploadPath/2024/01/20/XMT-Q3_20240120171349A257.jpg"
formData.unitWeight = res.data.unitWeight
formData.photoUrl = res.data.photoUrl
// 假设后端返回比对结果
// formData.matchResult = res.data.matchResult || 'failed' // 这里根据实际接口返回调整
formData.matchResult = res.data.matchResult || 'success' // 这里根据实际接口返回调整
@@ -365,6 +369,19 @@ const handleBackToFirst = () => {
activeStep.value = 1
}
// 计算重量
const calculateWeight = () => {
if (inputQuantity.value && formData.unitWeight) {
const singleWeight = parseFloat(formData.unitWeight.toString())
const quantity = parseFloat(inputQuantity.value)
if (!isNaN(singleWeight) && !isNaN(quantity)) {
calculatedWeight.value = (singleWeight * quantity).toFixed(2) + 'g'
}
} else {
calculatedWeight.value = ''
}
}
// 处理确定
@@ -375,7 +392,8 @@ const handleConfirm = () => {
count: weighingCount.value,
name: formData.materialName,
quantity: inputQuantity.value,
weight: inputWeight.value,
unitWeight: inputWeight.value,
calculatedWeight: calculatedWeight.value,
image: '图片'
}
// 添加到列表
@@ -383,6 +401,7 @@ const handleConfirm = () => {
// 重置输入
inputQuantity.value = ''
inputWeight.value = ''
calculatedWeight.value = ''
// 称重次数累加
weighingCount.value = weighingList.value.length + 1
}
@@ -391,6 +410,7 @@ const handleConfirm = () => {
const handleReset = () => {
inputQuantity.value = ''
inputWeight.value = ''
calculatedWeight.value = ''
}
// 处理删除