Compare commits
11 Commits
2bf7b6872a
...
master_lz
| Author | SHA1 | Date | |
|---|---|---|---|
| df67f63137 | |||
|
|
0f7efec0e1 | ||
|
|
2171c83d55 | ||
|
|
db40b1733b | ||
|
|
fe56422336 | ||
|
|
dc395406c3 | ||
|
|
41db731e40 | ||
|
|
35fcd40bd3 | ||
|
|
e27e44a3c3 | ||
|
|
47463c9b14 | ||
|
|
3f8b6e4695 |
@@ -1,6 +1,6 @@
|
|||||||
import http from '@/utils/http'
|
import http from '@/utils/http'
|
||||||
|
|
||||||
const BASE_URL = '/weighManage/material'
|
const BASE_URL = '/weighManage/workOrder'
|
||||||
|
|
||||||
export interface WeighManageResp {
|
export interface WeighManageResp {
|
||||||
id: string
|
id: string
|
||||||
@@ -21,7 +21,17 @@ export function getMaterialDetail(code: string) {
|
|||||||
return http.get<WeighManageResp>(`/admin/materialInfo/code/${code}`)
|
return http.get<WeighManageResp>(`/admin/materialInfo/code/${code}`)
|
||||||
}
|
}
|
||||||
|
|
||||||
/** @desc 新增人员管理 */
|
/** @desc 校验称重信息 */
|
||||||
export function addPeople(data: any) {
|
export function validateWeighing(data: any) {
|
||||||
return http.post(`${BASE_URL}`, data)
|
return http.post(`${BASE_URL}/validateWeighing`, data)
|
||||||
|
}
|
||||||
|
|
||||||
|
/** @desc 校验称重信息 */
|
||||||
|
export function vmSend(code: string) {
|
||||||
|
return http.get<WeighManageResp>(`/vm/send?msg=${code}`)
|
||||||
|
}
|
||||||
|
|
||||||
|
/** @desc 获取图片 */
|
||||||
|
export function getImg() {
|
||||||
|
return http.get<string>(`/vm/latest-photo`)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -18,6 +18,7 @@ export interface WorkOrderResp {
|
|||||||
updateUserString: string
|
updateUserString: string
|
||||||
matchResult: string
|
matchResult: string
|
||||||
workOrderInfos: Array<WorkOrderInfoResp>
|
workOrderInfos: Array<WorkOrderInfoResp>
|
||||||
|
qrCodeData: string
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface WorkOrderInfoResp {
|
export interface WorkOrderInfoResp {
|
||||||
|
|||||||
8
src/types/components.d.ts
vendored
8
src/types/components.d.ts
vendored
@@ -26,6 +26,8 @@ declare module 'vue' {
|
|||||||
AEmpty: typeof import('@arco-design/web-vue')['Empty']
|
AEmpty: typeof import('@arco-design/web-vue')['Empty']
|
||||||
AForm: typeof import('@arco-design/web-vue')['Form']
|
AForm: typeof import('@arco-design/web-vue')['Form']
|
||||||
AFormItem: typeof import('@arco-design/web-vue')['FormItem']
|
AFormItem: typeof import('@arco-design/web-vue')['FormItem']
|
||||||
|
AGrid: typeof import('@arco-design/web-vue')['Grid']
|
||||||
|
AGridItem: typeof import('@arco-design/web-vue')['GridItem']
|
||||||
AIcon: typeof import('@arco-design/web-vue')['Icon']
|
AIcon: typeof import('@arco-design/web-vue')['Icon']
|
||||||
AImage: typeof import('@arco-design/web-vue')['Image']
|
AImage: typeof import('@arco-design/web-vue')['Image']
|
||||||
AInput: typeof import('@arco-design/web-vue')['Input']
|
AInput: typeof import('@arco-design/web-vue')['Input']
|
||||||
@@ -39,15 +41,19 @@ declare module 'vue' {
|
|||||||
AMenu: typeof import('@arco-design/web-vue')['Menu']
|
AMenu: typeof import('@arco-design/web-vue')['Menu']
|
||||||
AMenuItem: typeof import('@arco-design/web-vue')['MenuItem']
|
AMenuItem: typeof import('@arco-design/web-vue')['MenuItem']
|
||||||
AModal: typeof import('@arco-design/web-vue')['Modal']
|
AModal: typeof import('@arco-design/web-vue')['Modal']
|
||||||
|
AOverflowList: typeof import('@arco-design/web-vue')['OverflowList']
|
||||||
APagination: typeof import('@arco-design/web-vue')['Pagination']
|
APagination: typeof import('@arco-design/web-vue')['Pagination']
|
||||||
APopover: typeof import('@arco-design/web-vue')['Popover']
|
APopover: typeof import('@arco-design/web-vue')['Popover']
|
||||||
|
AProgress: typeof import('@arco-design/web-vue')['Progress']
|
||||||
ARadio: typeof import('@arco-design/web-vue')['Radio']
|
ARadio: typeof import('@arco-design/web-vue')['Radio']
|
||||||
ARadioGroup: typeof import('@arco-design/web-vue')['RadioGroup']
|
ARadioGroup: typeof import('@arco-design/web-vue')['RadioGroup']
|
||||||
|
ARangePicker: typeof import('@arco-design/web-vue')['RangePicker']
|
||||||
ARow: typeof import('@arco-design/web-vue')['Row']
|
ARow: typeof import('@arco-design/web-vue')['Row']
|
||||||
AScrollbar: typeof import('@arco-design/web-vue')['Scrollbar']
|
AScrollbar: typeof import('@arco-design/web-vue')['Scrollbar']
|
||||||
ASelect: typeof import('@arco-design/web-vue')['Select']
|
ASelect: typeof import('@arco-design/web-vue')['Select']
|
||||||
ASpace: typeof import('@arco-design/web-vue')['Space']
|
ASpace: typeof import('@arco-design/web-vue')['Space']
|
||||||
ASpin: typeof import('@arco-design/web-vue')['Spin']
|
ASpin: typeof import('@arco-design/web-vue')['Spin']
|
||||||
|
AStatistic: typeof import('@arco-design/web-vue')['Statistic']
|
||||||
ASubMenu: typeof import('@arco-design/web-vue')['SubMenu']
|
ASubMenu: typeof import('@arco-design/web-vue')['SubMenu']
|
||||||
ASwitch: typeof import('@arco-design/web-vue')['Switch']
|
ASwitch: typeof import('@arco-design/web-vue')['Switch']
|
||||||
ATable: typeof import('@arco-design/web-vue')['Table']
|
ATable: typeof import('@arco-design/web-vue')['Table']
|
||||||
@@ -56,6 +62,8 @@ declare module 'vue' {
|
|||||||
ATag: typeof import('@arco-design/web-vue')['Tag']
|
ATag: typeof import('@arco-design/web-vue')['Tag']
|
||||||
ATooltip: typeof import('@arco-design/web-vue')['Tooltip']
|
ATooltip: typeof import('@arco-design/web-vue')['Tooltip']
|
||||||
ATreeSelect: typeof import('@arco-design/web-vue')['TreeSelect']
|
ATreeSelect: typeof import('@arco-design/web-vue')['TreeSelect']
|
||||||
|
ATypographyParagraph: typeof import('@arco-design/web-vue')['TypographyParagraph']
|
||||||
|
AUpload: typeof import('@arco-design/web-vue')['Upload']
|
||||||
Avatar: typeof import('./../components/Avatar/index.vue')['default']
|
Avatar: typeof import('./../components/Avatar/index.vue')['default']
|
||||||
AWatermark: typeof import('@arco-design/web-vue')['Watermark']
|
AWatermark: typeof import('@arco-design/web-vue')['Watermark']
|
||||||
Breadcrumb: typeof import('./../components/Breadcrumb/index.vue')['default']
|
Breadcrumb: typeof import('./../components/Breadcrumb/index.vue')['default']
|
||||||
|
|||||||
@@ -36,18 +36,23 @@
|
|||||||
|
|
||||||
<!-- 标签预览 -->
|
<!-- 标签预览 -->
|
||||||
<div v-if="labelData.partName" class="label-preview-section">
|
<div v-if="labelData.partName" class="label-preview-section">
|
||||||
|
<!-- <div class="label-preview-section">-->
|
||||||
<h3>标签预览</h3>
|
<h3>标签预览</h3>
|
||||||
<div class="label-container" ref="labelContainer">
|
<div class="label-container" ref="labelContainer">
|
||||||
<div class="label" v-for="index in 1" :key="index">
|
<div class="label" v-for="index in 1" :key="index">
|
||||||
<table class="label-table">
|
<table class="label-table">
|
||||||
<tr>
|
<tr>
|
||||||
<td class="label-cell">
|
<td class="label-cell">
|
||||||
<div class="label-field">零件名称</div>
|
<div class="label-row">
|
||||||
<div class="label-value">{{ labelData.partName }}</div>
|
<div class="label-field">零件名称</div>
|
||||||
|
<div class="label-value">{{ labelData.partName }}</div>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="label-cell">
|
<td class="label-cell">
|
||||||
<div class="label-field">生产日期</div>
|
<div class="label-row">
|
||||||
<div class="label-value">{{ labelData.productionDate }}</div>
|
<div class="label-field">生产日期</div>
|
||||||
|
<div class="label-value">{{ labelData.productionDate }}</div>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="label-cell qr-cell" rowspan="4">
|
<td class="label-cell qr-cell" rowspan="4">
|
||||||
<div class="qr-code">
|
<div class="qr-code">
|
||||||
@@ -57,32 +62,44 @@
|
|||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="label-cell">
|
<td class="label-cell">
|
||||||
<div class="label-field">零件号</div>
|
<div class="label-row">
|
||||||
<div class="label-value">{{ labelData.partNumber }}</div>
|
<div class="label-field">零件号</div>
|
||||||
|
<div class="label-value">{{ labelData.partNumber }}</div>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="label-cell">
|
<td class="label-cell">
|
||||||
<div class="label-field">数量</div>
|
<div class="label-row">
|
||||||
<div class="label-value">{{ labelData.totalCount }}</div>
|
<div class="label-field">数量</div>
|
||||||
|
<div class="label-value">{{ labelData.totalCount }}</div>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="label-cell">
|
<td class="label-cell">
|
||||||
<div class="label-field">标重(kg)</div>
|
<div class="label-row">
|
||||||
<div class="label-value">{{ labelData.totalCalculatedWeight }}</div>
|
<div class="label-field">标重(kg)</div>
|
||||||
|
<div class="label-value">{{ labelData.totalCalculatedWeight }}</div>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="label-cell">
|
<td class="label-cell">
|
||||||
<div class="label-field">包装签字</div>
|
<div class="label-row">
|
||||||
<div class="label-value">{{ labelData.packingSignature || '' }}</div>
|
<div class="label-field">包装签字</div>
|
||||||
|
<div class="label-value">{{ labelData.packingSignature || '' }}</div>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="label-cell">
|
<td class="label-cell">
|
||||||
<div class="label-field">实重(kg)</div>
|
<div class="label-row">
|
||||||
<div class="label-value">{{ labelData.totalWeight || '' }}</div>
|
<div class="label-field">实重(kg)</div>
|
||||||
|
<div class="label-value">{{ labelData.totalWeight || '' }}</div>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="label-cell">
|
<td class="label-cell">
|
||||||
<div class="label-field">检验签字</div>
|
<div class="label-row">
|
||||||
<div class="label-value">{{ labelData.inspectionSignature || '' }}</div>
|
<div class="label-field">检验签字</div>
|
||||||
|
<div class="label-value">{{ labelData.inspectionSignature || '' }}</div>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
@@ -113,7 +130,8 @@ const formData = reactive({
|
|||||||
totalCalculatedWeight: '',
|
totalCalculatedWeight: '',
|
||||||
totalWeight: '',
|
totalWeight: '',
|
||||||
totalCount: '',
|
totalCount: '',
|
||||||
productionBatch: ''
|
productionBatch: '',
|
||||||
|
qrCodeData: '',
|
||||||
})
|
})
|
||||||
|
|
||||||
// 标签数据
|
// 标签数据
|
||||||
@@ -129,6 +147,19 @@ const labelData = reactive({
|
|||||||
qrCodeData: '',
|
qrCodeData: '',
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// 标签数据
|
||||||
|
// const labelData = reactive({
|
||||||
|
// partName: '物料3',
|
||||||
|
// partNumber: '1',
|
||||||
|
// totalCalculatedWeight: '100',
|
||||||
|
// totalWeight: '100',
|
||||||
|
// productionDate: '202401010000',
|
||||||
|
// totalCount: '100',
|
||||||
|
// packingSignature: '',
|
||||||
|
// inspectionSignature: '',
|
||||||
|
// qrCodeData: '10#$$DY',
|
||||||
|
// })
|
||||||
|
|
||||||
// 标签容器引用
|
// 标签容器引用
|
||||||
const labelContainer = ref<HTMLElement | null>(null)
|
const labelContainer = ref<HTMLElement | null>(null)
|
||||||
|
|
||||||
@@ -152,6 +183,10 @@ const generateLabel = async () => {
|
|||||||
String(now.getHours()).padStart(2, '0') +
|
String(now.getHours()).padStart(2, '0') +
|
||||||
String(now.getMinutes()).padStart(2, '0')
|
String(now.getMinutes()).padStart(2, '0')
|
||||||
|
|
||||||
|
const formattedDate2 = now.getFullYear().toString() +
|
||||||
|
String(now.getMonth() + 1).padStart(2, '0') +
|
||||||
|
String(now.getDate()).padStart(2, '0');
|
||||||
|
|
||||||
// 直接从 formData 中获取数据
|
// 直接从 formData 中获取数据
|
||||||
Object.assign(labelData, {
|
Object.assign(labelData, {
|
||||||
partName: formData.materialName || '',
|
partName: formData.materialName || '',
|
||||||
@@ -162,7 +197,8 @@ const generateLabel = async () => {
|
|||||||
totalCount: formData.totalCount || '',
|
totalCount: formData.totalCount || '',
|
||||||
packingSignature: '',
|
packingSignature: '',
|
||||||
inspectionSignature: '',
|
inspectionSignature: '',
|
||||||
qrCodeData: `PART:${formData.encoding || 'PP0449002'},NAME:${formData.materialName || 'PP0449002护套'},DATE:${formattedDate},QTY:200`,
|
//10#零件号$11#供应商代码$12#生产批次$17#数量$20#包装日期$31#唯一号$DY
|
||||||
|
qrCodeData: `10#${formData.materialName}$11#9DP$12#${formData.productionBatch}$17#${formData.totalCount}$20#${formattedDate2}$31#${formData.orderNo}$DY`
|
||||||
})
|
})
|
||||||
|
|
||||||
Message.success('标签生成成功')
|
Message.success('标签生成成功')
|
||||||
@@ -187,7 +223,6 @@ onMounted(() => {
|
|||||||
formData.totalCalculatedWeight = res.data.totalCalculatedWeight
|
formData.totalCalculatedWeight = res.data.totalCalculatedWeight
|
||||||
formData.totalWeight = res.data.totalWeight
|
formData.totalWeight = res.data.totalWeight
|
||||||
formData.totalCount = res.data.totalCount
|
formData.totalCount = res.data.totalCount
|
||||||
|
|
||||||
} else {
|
} else {
|
||||||
Message.error('获取详情失败')
|
Message.error('获取详情失败')
|
||||||
}
|
}
|
||||||
@@ -202,38 +237,111 @@ onMounted(() => {
|
|||||||
const printLabel = async () => {
|
const printLabel = async () => {
|
||||||
await nextTick()
|
await nextTick()
|
||||||
if (labelContainer.value) {
|
if (labelContainer.value) {
|
||||||
// 克隆标签容器内容用于打印
|
|
||||||
const printContent = labelContainer.value.cloneNode(true) as HTMLElement
|
|
||||||
|
|
||||||
// 创建打印窗口
|
// 创建打印窗口
|
||||||
const printWindow = window.open('', '_blank')
|
const printWindow = window.open('', '_blank')
|
||||||
if (printWindow) {
|
if (printWindow) {
|
||||||
printWindow.document.write(`
|
// 直接构建打印内容,确保二维码图片正确生成
|
||||||
|
const printHTML = `
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>标签打印</title>
|
<title>标签打印</title>
|
||||||
<style>
|
<style>
|
||||||
body { margin: 0; padding: 10mm; font-family: Arial, sans-serif; }
|
body { margin: 0; padding: 10mm; font-family: Arial, sans-serif; }
|
||||||
.label-container { display: flex; flex-wrap: wrap; gap: 10mm; justify-content: center; }
|
.label-container { display: flex; flex-wrap: wrap; gap: 10mm; justify-content: center; }
|
||||||
.label { width: 90mm; height: 36mm; border: 1px solid #000; padding: 0; box-sizing: border-box; page-break-inside: avoid; }
|
.label { width: 90mm; height: 38.5mm; border: 1px solid #000; padding: 0; box-sizing: border-box; page-break-inside: avoid; }
|
||||||
.label-table { width: 100%; height: 100%; border-collapse: collapse; }
|
.label-table { width: 100%; height: 100%; border-collapse: collapse; }
|
||||||
.label-cell { border: 1px solid #000; padding: 1mm; vertical-align: top; }
|
.label-cell { border: 1px solid #000; padding: 1mm; vertical-align: top; }
|
||||||
.qr-cell { width: 24mm; text-align: center; vertical-align: middle; }
|
.qr-cell { width: 24mm; text-align: center; vertical-align: middle; border: 1px solid #000; }
|
||||||
.label-field { font-size: 7pt; font-weight: bold; margin-bottom: 0.5mm; }
|
.label-row { display: flex; align-items: center; }
|
||||||
.label-value { font-size: 7pt; }
|
.label-field { font-size: 7pt; font-weight: bold; margin-right: 2mm; min-width: 25pt; }
|
||||||
|
.label-value { font-size: 7pt; flex: 1; }
|
||||||
.qr-code img { width: 20mm; height: 20mm; margin: 1mm 0; }
|
.qr-code img { width: 20mm; height: 20mm; margin: 1mm 0; }
|
||||||
.serial-number { font-size: 7pt; margin-top: 1mm; }
|
.serial-number { font-size: 7pt; margin-top: 1mm; }
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
${printContent.innerHTML}
|
<div class="label-container">
|
||||||
|
<div class="label">
|
||||||
|
<table class="label-table">
|
||||||
|
<tr>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">零件名称</div>
|
||||||
|
<div class="label-value">${labelData.partName}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">生产日期</div>
|
||||||
|
<div class="label-value">${labelData.productionDate}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="label-cell qr-cell" rowspan="4">
|
||||||
|
<div class="qr-code">
|
||||||
|
<img src="https://api.qrserver.com/v1/create-qr-code/?size=120x120&data=${encodeURIComponent(labelData.qrCodeData)}" alt="QR Code" />
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">零件号</div>
|
||||||
|
<div class="label-value">${labelData.partNumber}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">数量</div>
|
||||||
|
<div class="label-value">${labelData.totalCount}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">标重(kg)</div>
|
||||||
|
<div class="label-value">${labelData.totalCalculatedWeight}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">包装签字</div>
|
||||||
|
<div class="label-value">${labelData.packingSignature || ''}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">实重(kg)</div>
|
||||||
|
<div class="label-value">${labelData.totalWeight || ''}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">检验签字</div>
|
||||||
|
<div class="label-value">${labelData.inspectionSignature || ''}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
`)
|
`
|
||||||
|
|
||||||
|
printWindow.document.write(printHTML)
|
||||||
printWindow.document.close()
|
printWindow.document.close()
|
||||||
printWindow.focus()
|
|
||||||
printWindow.print()
|
// 等待图片加载完成后再打印
|
||||||
printWindow.close()
|
printWindow.onload = () => {
|
||||||
|
setTimeout(() => {
|
||||||
|
printWindow.focus()
|
||||||
|
printWindow.print()
|
||||||
|
printWindow.close()
|
||||||
|
}, 500)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -330,14 +438,21 @@ defineOptions({ name: 'BarcodePrint' })
|
|||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.label-row {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
.label-field {
|
.label-field {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
margin-bottom: 2px;
|
margin-right: 10px;
|
||||||
|
min-width: 60px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.label-value {
|
.label-value {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.qr-code img {
|
.qr-code img {
|
||||||
|
|||||||
@@ -49,7 +49,7 @@ const columns: ColumnItem[] = reactive([
|
|||||||
field: 'configKey',
|
field: 'configKey',
|
||||||
type: 'input',
|
type: 'input',
|
||||||
span: 24,
|
span: 24,
|
||||||
disabled: true,
|
disabled: isUpdate.value,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '参数键值',
|
label: '参数键值',
|
||||||
|
|||||||
@@ -57,10 +57,10 @@
|
|||||||
<div class="form-item">
|
<div class="form-item">
|
||||||
<a-form-item label="物料编码">
|
<a-form-item label="物料编码">
|
||||||
<a-input
|
<a-input
|
||||||
v-model="formData.inputMaterialCode"
|
v-model="formData.inputMaterialCode"
|
||||||
placeholder="请点击此处确保光标闪烁,并使用扫码枪扫描物料编码"
|
placeholder="请点击此处确保光标闪烁,并使用扫码枪扫描物料编码"
|
||||||
@keydown="handleKeyDown"
|
@keydown="handleKeyDown"
|
||||||
@input="handleMaterialCodeChange"
|
@input="handleMaterialCodeChange"
|
||||||
/>
|
/>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
</div>
|
</div>
|
||||||
@@ -71,8 +71,14 @@
|
|||||||
<!-- 右侧信息 -->
|
<!-- 右侧信息 -->
|
||||||
<div class="right-section">
|
<div class="right-section">
|
||||||
<div class="camera-section">
|
<div class="camera-section">
|
||||||
<div class="image-placeholder square-image">实时画面 相机1</div>
|
<!-- 图片展示 -->
|
||||||
<div class="image-placeholder square-image">实时画面 相机2</div>
|
<div class="image-placeholder square-image">
|
||||||
|
<img
|
||||||
|
:src="imgData.imgUrl"
|
||||||
|
alt="图片展示"
|
||||||
|
style="width: 100%; height: 100%; object-fit: cover; border-radius: 4px;"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="info-section">
|
<div class="info-section">
|
||||||
@@ -93,16 +99,15 @@
|
|||||||
<div class="info-item">
|
<div class="info-item">
|
||||||
<span class="label">比对结果:</span>
|
<span class="label">比对结果:</span>
|
||||||
<span
|
<span
|
||||||
class="value match-result" :class="{
|
class="value match-result" :class="{
|
||||||
'match-success': formData.matchResult === 'success',
|
'match-success': compareMatchResult === 'success',
|
||||||
'match-failed': formData.matchResult === 'failed',
|
'match-failed': compareMatchResult === 'failed',
|
||||||
'match-pending': !formData.matchResult,
|
'match-pending': !compareMatchResult,
|
||||||
}"
|
}"
|
||||||
>
|
>
|
||||||
<icon-check-circle-fill v-if="formData.matchResult === 'success'" style="color: #52c41a; margin-right: 8px; font-size: 25px;" />
|
<icon-check-circle-fill v-if="compareMatchResult === 'success'" style="color: #52c41a; margin-right: 8px; font-size: 25px;" />
|
||||||
<icon-close-circle-fill v-else-if="formData.matchResult === 'failed'" style="color: #ff4d4f; margin-right: 8px; font-size: 25px;" />
|
<icon-close-circle-fill v-else-if="compareMatchResult === 'failed'" style="color: #ff4d4f; margin-right: 8px; font-size: 25px;" />
|
||||||
|
{{ compareMatchResult === 'success' ? '成功' : compareMatchResult === 'failed' ? '失败' : '请放置需比对的物料到扫描区域!' }}
|
||||||
{{ formData.matchResult === 'success' ? '成功' : formData.matchResult === 'failed' ? '失败' : '-' }}
|
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -144,11 +149,11 @@
|
|||||||
<!-- 这里是摄像头画面 - 替换成FLV播放器 -->
|
<!-- 这里是摄像头画面 - 替换成FLV播放器 -->
|
||||||
<div class="video-container large-image">
|
<div class="video-container large-image">
|
||||||
<video
|
<video
|
||||||
ref="cameraVideo"
|
ref="cameraVideo"
|
||||||
autoplay
|
autoplay
|
||||||
muted
|
muted
|
||||||
playsinline
|
playsinline
|
||||||
style="width: 100%; height: 100%; object-fit: cover;"
|
style="width: 100%; height: 100%; object-fit: cover;"
|
||||||
></video>
|
></video>
|
||||||
|
|
||||||
<!-- 加载状态 -->
|
<!-- 加载状态 -->
|
||||||
@@ -247,20 +252,19 @@
|
|||||||
<!-- 操作按钮 -->
|
<!-- 操作按钮 -->
|
||||||
<div class="action-buttons">
|
<div class="action-buttons">
|
||||||
<a-button
|
<a-button
|
||||||
v-if="activeStep > 1 && activeStep < 3"
|
v-if="activeStep > 1 && activeStep < 3"
|
||||||
class="previous-button"
|
class="previous-button"
|
||||||
@click="handlePrevious"
|
@click="handlePrevious"
|
||||||
>
|
>
|
||||||
上一步
|
上一步
|
||||||
</a-button>
|
</a-button>
|
||||||
<a-button
|
<a-button
|
||||||
v-if="activeStep < 3"
|
v-if="activeStep < 3"
|
||||||
type="primary"
|
type="primary"
|
||||||
:disabled="activeStep === 1 && formData.matchResult !== 'success'"
|
class="next-button"
|
||||||
class="next-button"
|
@click="handleNext"
|
||||||
@click="handleNext"
|
|
||||||
>
|
>
|
||||||
{{ activeStep === 2 ? '完成' : '下一步' }}
|
{{ activeStep === 2 ? '完成' : (compareMatchResult === 'success' ? '下一步' : '开始比对') }}
|
||||||
</a-button>
|
</a-button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -270,9 +274,8 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { nextTick, onBeforeUnmount, onMounted, onUnmounted, reactive, ref } from 'vue'
|
import { nextTick, onBeforeUnmount, onMounted, onUnmounted, reactive, ref } from 'vue'
|
||||||
import { Message, Modal, Notification } from '@arco-design/web-vue'
|
import { Message, Modal, Notification } from '@arco-design/web-vue'
|
||||||
|
import {getImg, getMaterialDetail, validateWeighing, vmSend} from '@/apis/weightManage/weightManage'
|
||||||
import { getMaterialDetail } from '@/apis/weightManage/weightManage'
|
import {type WorkOrderResp, addWorkOrder, getWorkOrder} from '@/apis/workOrder/workOrder'
|
||||||
import { type WorkOrderResp, addWorkOrder } from '@/apis/workOrder/workOrder'
|
|
||||||
import { catchPhoto } from '@/apis/material/materialInfo'
|
import { catchPhoto } from '@/apis/material/materialInfo'
|
||||||
|
|
||||||
defineOptions({ name: 'WeightManage' })
|
defineOptions({ name: 'WeightManage' })
|
||||||
@@ -292,9 +295,28 @@ const formData = reactive({
|
|||||||
materialSpec: '', // 物料规格
|
materialSpec: '', // 物料规格
|
||||||
unitWeight: 0, // 重量
|
unitWeight: 0, // 重量
|
||||||
photoUrl: '', // 样图URL
|
photoUrl: '', // 样图URL
|
||||||
matchResult: '', // 比对结果
|
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const imgData = reactive({
|
||||||
|
imgUrl: '', // 样图URL
|
||||||
|
})
|
||||||
|
|
||||||
|
// 定时器引用
|
||||||
|
let pollingInterval = null
|
||||||
|
|
||||||
|
// 获取图片的方法
|
||||||
|
const getImage = () => {
|
||||||
|
|
||||||
|
getImg().then((res) => {
|
||||||
|
if (res.code === '0') {
|
||||||
|
imgData.imgUrl = res.data?.imgUrl || ''
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
//比对结果
|
||||||
|
const compareMatchResult = ref('')
|
||||||
|
|
||||||
// 摄像头状态
|
// 摄像头状态
|
||||||
const cameraStatus = ref<'connected' | 'connecting' | 'disconnected' | 'error'>('disconnected')
|
const cameraStatus = ref<'connected' | 'connecting' | 'disconnected' | 'error'>('disconnected')
|
||||||
|
|
||||||
@@ -304,8 +326,8 @@ const cameraVideo = ref<HTMLVideoElement | null>(null)
|
|||||||
// FLV播放器实例
|
// FLV播放器实例
|
||||||
let player: any = null
|
let player: any = null
|
||||||
|
|
||||||
const reconnectCount = ref(0)
|
const reconnectCount = ref(1)
|
||||||
const maxReconnectAttempts = 5
|
const maxReconnectAttempts = 3
|
||||||
const reconnectTimer = ref<any>(null)
|
const reconnectTimer = ref<any>(null)
|
||||||
|
|
||||||
// 直接写死FLV流地址(根据你的实际地址修改)
|
// 直接写死FLV流地址(根据你的实际地址修改)
|
||||||
@@ -367,12 +389,13 @@ const initCamera = () => {
|
|||||||
player.load()
|
player.load()
|
||||||
player.play().then(() => {
|
player.play().then(() => {
|
||||||
cameraStatus.value = 'connected'
|
cameraStatus.value = 'connected'
|
||||||
reconnectCount.value = 0 // 连接成功,重置重连计数
|
reconnectCount.value = 1 // 连接成功,重置重连计数
|
||||||
}).catch((error: any) => {
|
}).catch((error: any) => {
|
||||||
cameraStatus.value = 'error'
|
cameraStatus.value = 'error'
|
||||||
Message.error('摄像头播放失败,正在重连')
|
Message.error('摄像头播放失败,正在重连')
|
||||||
// 触发自动重连
|
// 触发自动重连
|
||||||
handleReconnect()
|
handleReconnect()
|
||||||
|
return
|
||||||
})
|
})
|
||||||
|
|
||||||
// 监听各种事件
|
// 监听各种事件
|
||||||
@@ -404,7 +427,6 @@ const handleReconnect = () => {
|
|||||||
|
|
||||||
// 检查重连次数
|
// 检查重连次数
|
||||||
if (reconnectCount.value >= maxReconnectAttempts) {
|
if (reconnectCount.value >= maxReconnectAttempts) {
|
||||||
Message.error('摄像头连接失败,请手动重试')
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -427,7 +449,7 @@ const handleReconnect = () => {
|
|||||||
|
|
||||||
// 重新连接摄像头(手动)
|
// 重新连接摄像头(手动)
|
||||||
const reconnectCamera = () => {
|
const reconnectCamera = () => {
|
||||||
reconnectCount.value = 0 // 手动重连时重置计数
|
reconnectCount.value = 1 // 手动重连时重置计数
|
||||||
initCamera()
|
initCamera()
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -454,7 +476,7 @@ let statusCheckTimer: any = null
|
|||||||
watch(activeStep, (newVal) => {
|
watch(activeStep, (newVal) => {
|
||||||
if (newVal === 2) {
|
if (newVal === 2) {
|
||||||
// 进入称重登记页面,启动摄像头
|
// 进入称重登记页面,启动摄像头
|
||||||
reconnectCount.value = 0 // 重置重连计数
|
reconnectCount.value = 1 // 重置重连计数
|
||||||
nextTick(() => {
|
nextTick(() => {
|
||||||
initCamera()
|
initCamera()
|
||||||
})
|
})
|
||||||
@@ -472,7 +494,7 @@ watch(activeStep, (newVal) => {
|
|||||||
clearTimeout(reconnectTimer.value)
|
clearTimeout(reconnectTimer.value)
|
||||||
reconnectTimer.value = null
|
reconnectTimer.value = null
|
||||||
}
|
}
|
||||||
reconnectCount.value = 0
|
reconnectCount.value = 1
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
@@ -514,9 +536,10 @@ const stopCamera = () => {
|
|||||||
clearTimeout(reconnectTimer.value)
|
clearTimeout(reconnectTimer.value)
|
||||||
reconnectTimer.value = null
|
reconnectTimer.value = null
|
||||||
}
|
}
|
||||||
reconnectCount.value = 0
|
reconnectCount.value = 1
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// 监听步骤变化
|
// 监听步骤变化
|
||||||
watch(activeStep, (newVal) => {
|
watch(activeStep, (newVal) => {
|
||||||
if (newVal === 2) {
|
if (newVal === 2) {
|
||||||
@@ -525,7 +548,7 @@ watch(activeStep, (newVal) => {
|
|||||||
initCamera()
|
initCamera()
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
// 离开称重登记页面,停止摄像头
|
// 离开相关页面,停止摄像头
|
||||||
stopCamera()
|
stopCamera()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
@@ -533,6 +556,7 @@ watch(activeStep, (newVal) => {
|
|||||||
// 组件挂载时
|
// 组件挂载时
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await loadFlvJs()
|
await loadFlvJs()
|
||||||
|
pollingInterval = setInterval(getImg, 1000)
|
||||||
})
|
})
|
||||||
|
|
||||||
// 组件卸载时
|
// 组件卸载时
|
||||||
@@ -556,11 +580,12 @@ const workOrderResp = ref<WorkOrderResp>({
|
|||||||
totalCalculatedWeight: '',
|
totalCalculatedWeight: '',
|
||||||
workOrderInfos: [],
|
workOrderInfos: [],
|
||||||
matchResult: 'failed',
|
matchResult: 'failed',
|
||||||
|
qrCodeData: '',
|
||||||
})
|
})
|
||||||
|
|
||||||
// 称重登记页面数据
|
// 称重登记页面数据
|
||||||
const inputQuantity = ref('')
|
const inputQuantity = ref('')
|
||||||
const ahDeviceWeight = ref('10')
|
const ahDeviceWeight = ref('')
|
||||||
const calculatedWeight = ref('')
|
const calculatedWeight = ref('')
|
||||||
const weighingCount = ref(1)
|
const weighingCount = ref(1)
|
||||||
|
|
||||||
@@ -648,7 +673,7 @@ const originalHandleMaterialCodeChange = async () => {
|
|||||||
formData.materialSpec = ''
|
formData.materialSpec = ''
|
||||||
formData.unitWeight = 0
|
formData.unitWeight = 0
|
||||||
formData.photoUrl = ''
|
formData.photoUrl = ''
|
||||||
formData.matchResult = ''
|
compareMatchResult.value = '';
|
||||||
|
|
||||||
// 如果有物料编码输入,获取物料数据
|
// 如果有物料编码输入,获取物料数据
|
||||||
if (materialCode) {
|
if (materialCode) {
|
||||||
@@ -698,9 +723,6 @@ const fetchMaterialData = async (code: string) => {
|
|||||||
formData.materialSpec = res.data?.materialSpec || ''
|
formData.materialSpec = res.data?.materialSpec || ''
|
||||||
formData.unitWeight = res.data?.unitWeight || 0
|
formData.unitWeight = res.data?.unitWeight || 0
|
||||||
formData.photoUrl = res.data?.photoUrl || ''
|
formData.photoUrl = res.data?.photoUrl || ''
|
||||||
// 假设后端返回比对结果
|
|
||||||
// formData.matchResult = res.data.matchResult || 'failed' // 这里根据实际接口返回调整
|
|
||||||
formData.matchResult = res.data?.matchResult || 'success' // 这里根据实际接口返回调整
|
|
||||||
return true
|
return true
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
@@ -748,6 +770,35 @@ const handleNext = async () => {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
} else if (activeStep.value === 1 && compareMatchResult.value !== 'success') {
|
||||||
|
// 当在扫码核验页面点击开始比对时,调用后端接口获取比对结果
|
||||||
|
try {
|
||||||
|
// 这里应该调用后端的比对接口,暂时使用fetchMaterialData模拟
|
||||||
|
// 实际项目中应该替换为专门的比对接口
|
||||||
|
const materialCode = formData.inputMaterialCode?.trim()
|
||||||
|
if (!materialCode) {
|
||||||
|
Message.error('请先扫描物料编码')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
// 调用后端接口获取比对结果
|
||||||
|
vmSend(materialCode).then((res) => {
|
||||||
|
if (res.code === '0') {
|
||||||
|
compareMatchResult.value = JSON.parse(res.data?.matchResult || '')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
if (compareMatchResult.value === 'success') {
|
||||||
|
// 比对成功,按钮变为下一步
|
||||||
|
Message.success('比对成功')
|
||||||
|
} else {
|
||||||
|
// 比对失败,提示错误
|
||||||
|
Message.error('比对失败')
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('比对失败:', error)
|
||||||
|
Message.error('比对失败,请重试')
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
activeStep.value++
|
activeStep.value++
|
||||||
// 进入称重页面时建立WebSocket连接
|
// 进入称重页面时建立WebSocket连接
|
||||||
@@ -758,6 +809,8 @@ const handleNext = async () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// 处理上一步
|
// 处理上一步
|
||||||
const handlePrevious = () => {
|
const handlePrevious = () => {
|
||||||
if (activeStep.value > 1) {
|
if (activeStep.value > 1) {
|
||||||
@@ -782,11 +835,12 @@ const handleBackToFirst = () => {
|
|||||||
formData.materialSpec = ''
|
formData.materialSpec = ''
|
||||||
formData.unitWeight = 0
|
formData.unitWeight = 0
|
||||||
formData.photoUrl = ''
|
formData.photoUrl = ''
|
||||||
formData.matchResult = ''
|
|
||||||
|
compareMatchResult.value = ''
|
||||||
|
|
||||||
// 重置称重登记页面数据
|
// 重置称重登记页面数据
|
||||||
inputQuantity.value = ''
|
inputQuantity.value = ''
|
||||||
ahDeviceWeight.value = '10'
|
ahDeviceWeight.value = ''
|
||||||
calculatedWeight.value = ''
|
calculatedWeight.value = ''
|
||||||
weighingCount.value = 1
|
weighingCount.value = 1
|
||||||
// 清空称重列表
|
// 清空称重列表
|
||||||
@@ -812,45 +866,8 @@ const calculateWeight = () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 处理确定
|
|
||||||
/* const handleConfirm = async () => {
|
|
||||||
// 校验输入数量是否为空
|
|
||||||
if (!inputQuantity.value || inputQuantity.value.trim() === '') {
|
|
||||||
Message.error('请输入数量')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if (!ahDeviceWeight.value || ahDeviceWeight.value.trim() === '') {
|
|
||||||
Message.error('电子秤称重结果为空!')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
// 2. 抓拍当前画面
|
|
||||||
let captureUrl = ''
|
|
||||||
if (cameraVideo.value && cameraStatus.value === 'connected') {
|
|
||||||
captureUrl = await capturePhoto()
|
|
||||||
}
|
|
||||||
console.log(captureUrl)
|
|
||||||
// 生成新的列表数据
|
|
||||||
const newItem = {
|
|
||||||
key: (weighingList.value.length + 1).toString(),
|
|
||||||
weightTime: weighingCount.value,
|
|
||||||
materialId: formData.id,
|
|
||||||
quantity: inputQuantity.value,
|
|
||||||
weight: ahDeviceWeight.value,
|
|
||||||
calculatedWeight: calculatedWeight.value,
|
|
||||||
image: captureUrl || '未抓拍',
|
|
||||||
}
|
|
||||||
// 添加到列表
|
|
||||||
weighingList.value.push(newItem)
|
|
||||||
// 重置输入
|
|
||||||
inputQuantity.value = ''
|
|
||||||
ahDeviceWeight.value = '10'
|
|
||||||
calculatedWeight.value = ''
|
|
||||||
// 称重次数累加
|
|
||||||
weighingCount.value = weighingList.value.length + 1
|
|
||||||
Message.success('添加成功')
|
|
||||||
} */
|
|
||||||
|
|
||||||
|
//处理确定
|
||||||
const handleConfirm = () => {
|
const handleConfirm = () => {
|
||||||
// 校验输入数量是否为空
|
// 校验输入数量是否为空
|
||||||
if (!inputQuantity.value || inputQuantity.value.trim() === '') {
|
if (!inputQuantity.value || inputQuantity.value.trim() === '') {
|
||||||
@@ -862,6 +879,18 @@ const handleConfirm = () => {
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const data = {
|
||||||
|
materialId: formData.id,
|
||||||
|
inputQuantity: inputQuantity.value,
|
||||||
|
ahDeviceWeight: ahDeviceWeight.value,
|
||||||
|
}
|
||||||
|
|
||||||
|
validateWeighing(data).then(res => {
|
||||||
|
if (res.code != '0') {
|
||||||
|
Message.error(res.msg || '系统异常!')
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
// 立即创建一个新项的基本数据
|
// 立即创建一个新项的基本数据
|
||||||
const newItem = {
|
const newItem = {
|
||||||
key: (weighingList.value.length + 1).toString(),
|
key: (weighingList.value.length + 1).toString(),
|
||||||
@@ -878,7 +907,7 @@ const handleConfirm = () => {
|
|||||||
|
|
||||||
// 重置输入(让用户能继续输入)
|
// 重置输入(让用户能继续输入)
|
||||||
inputQuantity.value = ''
|
inputQuantity.value = ''
|
||||||
ahDeviceWeight.value = '10'
|
ahDeviceWeight.value = ''
|
||||||
calculatedWeight.value = ''
|
calculatedWeight.value = ''
|
||||||
weighingCount.value = weighingList.value.length + 1
|
weighingCount.value = weighingList.value.length + 1
|
||||||
|
|
||||||
@@ -1033,6 +1062,9 @@ const closeWebSocket = () => {
|
|||||||
// 组件卸载时关闭WebSocket连接
|
// 组件卸载时关闭WebSocket连接
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
closeWebSocket()
|
closeWebSocket()
|
||||||
|
if (pollingInterval) {
|
||||||
|
clearInterval(pollingInterval)
|
||||||
|
}
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user