手持机-制定出库页面

This commit is contained in:
刘汗青
2026-06-16 13:29:22 +08:00
parent aab14ac716
commit 4cf67d3610
8 changed files with 758 additions and 266 deletions

View File

@@ -0,0 +1,287 @@
<template>
<view class="container">
<view class="form-card">
<uni-forms label-width="160rpx">
<!-- 托盘码输入 -->
<uni-forms-item label="托盘码">
<view class="input-row">
<uni-easyinput
v-model="trayCode"
placeholder="请扫描或输入托盘码"
:clearable="true"
class="tray-input"
@confirm="handleQuery"
/>
<button class="query-btn" :loading="querying" hover-class="button-hover" @click="handleQuery">查询</button>
</view>
</uni-forms-item>
<!-- 查询结果信息展示 -->
<template v-if="materialInfo">
<uni-forms-item label="物料编码">
<view class="info-field"><text class="info-value">{{ materialInfo.productId || '-' }}</text></view>
</uni-forms-item>
<uni-forms-item label="物料名称">
<view class="info-field"><text class="info-value">{{ materialInfo.productName || '-' }}</text></view>
</uni-forms-item>
<uni-forms-item label="库存数量">
<view class="info-field"><text class="info-value">{{ (materialInfo.quantity || '0') + ' ' + (materialInfo.spare3 || '') }}</text></view>
</uni-forms-item>
<uni-forms-item label="部门">
<view class="info-field"><text class="info-value">{{ materialInfo.deptName || '-' }}</text></view>
</uni-forms-item>
<uni-forms-item label="所在货位">
<view class="info-field"><text class="info-value">{{ materialInfo.cargoSpaceName || materialInfo.cargoSpaceId || '-' }}</text></view>
</uni-forms-item>
<!-- 三个出库按钮(带权限控制)-->
<view class="btn-group">
<!-- 出来看看:exitId=1, type=2 权限: job:outmydoJob:pointOut -->
<button
v-if="$auth.hasPermi('job:outmydoJob:pointOut')"
class="submit-button btn-primary"
:loading="submitting === 'out'"
hover-class="button-hover"
@click="handleOut('out')"
>出来看看</button>
<!-- 出库端出库:exitId=2, type=2 权限: job:outmydoJob:pointOut1 -->
<button
v-if="$auth.hasPermi('job:outmydoJob:pointOut1')"
class="submit-button btn-warning"
:loading="submitting === 'out1'"
hover-class="button-hover"
@click="handleOut('out1')"
>出库端出库</button>
<!-- 入库端出库:exitId=1, type=2 权限: job:outmydoJob:pointOut2 -->
<button
v-if="$auth.hasPermi('job:outmydoJob:pointOut2')"
class="submit-button btn-danger"
:loading="submitting === 'out2'"
hover-class="button-hover"
@click="handleOut('out2')"
>入库端出库</button>
</view>
</template>
<!-- 空状态 -->
<view v-if="queried && !materialInfo" class="empty-tip">
<uni-icons type="info" size="30" color="#ccc"></uni-icons>
<text class="empty-text">未查询到该托盘的物料信息</text>
</view>
</uni-forms>
</view>
</view>
</template>
<script>
import { queryTrayInfo, pointOut } from '@/api/out/appointOut.js'
/**
* 三种出库方式(对应 pointOut.vue 逻辑)
* out → 出来看看 exitId=1 type=2 权限: job:outmydoJob:pointOut
* out1 → 出库端出库 exitId=2 type=2 权限: job:outmydoJob:pointOut1
* out2 → 入库端出库 exitId=1 type=2 权限: job:outmydoJob:pointOut2
*/
const TYPE_MAP = {
out: { exitId: '1', type: '2', label: '出来看看', permi: 'job:outmydoJob:pointOut' },
out1: { exitId: '2', type: '2', label: '出库端出库', permi: 'job:outmydoJob:pointOut1' },
out2: { exitId: '1', type: '2', label: '入库端出库', permi: 'job:outmydoJob:pointOut2' }
}
export default {
data() {
return {
trayCode: '',
querying: false,
queried: false,
materialInfo: null,
submitting: '' // 当前提交中的按钮 key:'out' | 'out1' | 'out2' | ''
}
},
methods: {
// ─── 查询托盘 ─────────────────────────────────────────────
async handleQuery() {
const code = this.trayCode.trim()
if (!code) {
uni.showToast({ title: '请输入托盘码', icon: 'none' })
return
}
this.querying = true
this.materialInfo = null
this.queried = false
try {
const res = await queryTrayInfo({ trayCode: code })
this.queried = true
if (res.code === 200 && res.rows && res.rows.length > 0) {
this.materialInfo = res.rows[0]
} else {
uni.showToast({ title: res.msg || '未查询到物料信息', icon: 'none' })
}
} catch (e) {
this.queried = true
uni.showToast({ title: '查询失败,请重试', icon: 'none' })
} finally {
this.querying = false
}
},
// ─── 出库(三种方式共用) ──────────────────────────────────
handleOut(btnKey) {
if (!this.materialInfo) {
uni.showToast({ title: '请先查询托盘信息', icon: 'none' })
return
}
const cfg = TYPE_MAP[btnKey]
const stockId = this.materialInfo.stockId || this.materialInfo.trayCode
uni.showModal({
title: '出库确认',
content: `托盘:${this.materialInfo.trayCode}\n物料:${this.materialInfo.productName || this.materialInfo.productId}\n方式:${cfg.label}`,
success: async (modal) => {
if (!modal.confirm) return
this.submitting = btnKey
try {
const res = await pointOut(stockId, cfg.exitId, cfg.type)
if (res.code === 200) {
uni.showToast({ title: '出库作业已生成', icon: 'success', duration: 2000 })
setTimeout(() => {
this.trayCode = ''
this.materialInfo = null
this.queried = false
}, 1500)
} else {
uni.showToast({ title: res.msg || '出库失败', icon: 'none' })
}
} catch (e) {
uni.showToast({ title: '出库操作失败,请重试', icon: 'none' })
} finally {
this.submitting = ''
}
}
})
}
}
}
</script>
<style lang="scss" scoped>
.container {
padding: 30rpx;
background-color: #f5f5f5;
min-height: 100vh;
}
.form-card {
background-color: #fff;
border-radius: 16rpx;
padding: 40rpx 30rpx;
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
}
:deep(.uni-forms-item) {
padding-bottom: 30rpx;
// label 固定宽度,不换行
.uni-forms-item__label {
width: 160rpx !important;
min-width: 160rpx !important;
font-size: 28rpx;
color: #333;
font-weight: 500;
white-space: nowrap;
overflow: visible;
}
}
// ── 物料信息只读展示行(替代 disabled input,颜色完全自控)──
.info-field {
width: 100%;
min-height: 72rpx;
background-color: #f5f7fa;
border-radius: 8rpx;
padding: 0 24rpx;
display: flex;
align-items: center;
}
.info-value {
font-size: 28rpx;
color: #222;
font-weight: 500;
}
// ── 托盘码输入行 ───────────────────────────────────
.input-row {
display: flex;
align-items: center;
gap: 16rpx;
}
.tray-input {
flex: 1;
}
.query-btn {
flex-shrink: 0;
width: 140rpx;
height: 80rpx;
line-height: 80rpx;
font-size: 28rpx;
background-color: #3B7FFF;
color: #fff;
border-radius: 8rpx;
padding: 0;
}
// ── 三按钮组 ──────────────────────────────────────
.btn-group {
display: flex;
gap: 20rpx;
margin-top: 20rpx;
}
.submit-button {
flex: 1;
height: 88rpx;
line-height: 88rpx;
font-size: 28rpx;
border-radius: 44rpx;
color: #fff;
padding: 0;
}
.btn-primary {
background-color: #3B7FFF;
}
.btn-warning {
background-color: #fa8c16;
}
.btn-danger {
background-color: #f5222d;
}
.button-hover {
opacity: 0.8;
transform: translateY(2rpx);
}
// ── 空状态 ────────────────────────────────────────
.empty-tip {
display: flex;
flex-direction: column;
align-items: center;
padding: 60rpx 0 20rpx;
gap: 16rpx;
}
.empty-text {
font-size: 28rpx;
color: #bbb;
}
</style>