style: 备件出入库功能优化

master
zhongwenkai 6 days ago
parent 3a848c6a3a
commit 226b7009b0

@ -17,6 +17,15 @@ export function getSparepartInboundPage(params = {}) {
})
}
// 备件入库单提交审核(提交后变为待审核状态)
export function submitSparepartInbound(data) {
return request({
url: '/admin-api/erp/stock-in/submit',
method: 'put',
data
})
}
// 备件入库单审核status: 20=通过, 1=驳回)
export function auditSparepartInbound(data) {
return request({

@ -18,6 +18,15 @@ export function getSparepartOutboundPage(params = {}) {
})
}
// 备件出库单提交审核
export function submitSparepartOutbound(data) {
return request({
url: '/admin-api/erp/stock-out/submit',
method: 'put',
data
})
}
// 备件出库单审核status: 20=通过, 1=驳回)
export function auditSparepartOutbound(data) {
return request({

@ -1396,7 +1396,7 @@ export default {
},
sparepartInbound: {
moduleName: '备件入库',
tabPending: '待提交',
tabPending: '待入库',
tabAuditing: '待审核',
searchPlaceholder: '搜索入库单号',
sparepartInfo: '备件信息',
@ -1404,7 +1404,7 @@ export default {
creator: '创建人',
quantity: '数量',
reviewer: '审核人',
approve: '已通过',
approve: '已入库',
reject: '驳回',
confirmApprove: '确定审核通过该入库单吗?',
confirmReject: '确定驳回该入库单吗?',
@ -1437,7 +1437,7 @@ export default {
},
sparepartOutbound: {
moduleName: '备件出库',
tabPending: '待提交',
tabPending: '待出库',
tabAuditing: '待审核',
searchPlaceholder: '搜索出库单号',
sparepartInfo: '备件信息',
@ -1445,7 +1445,7 @@ export default {
creator: '创建人',
quantity: '数量',
reviewer: '审核人',
approve: '已通过',
approve: '已出库',
reject: '驳回',
confirmApprove: '确定审核通过该出库单吗?',
confirmReject: '确定驳回该出库单吗?',

@ -388,6 +388,13 @@
"navigationStyle": "custom"
}
},
{
"path": "sparepartInbound/sparepartConfirm",
"style": {
"navigationBarTitleText": "确认备件入库",
"navigationStyle": "custom"
}
},
{
"path": "sparepartOutbound/index",
"style": {
@ -402,6 +409,13 @@
"navigationStyle": "custom"
}
},
{
"path": "sparepartOutbound/sparepartConfirm",
"style": {
"navigationBarTitleText": "确认备件出库",
"navigationStyle": "custom"
}
},
{
"path": "keypart/index",

File diff suppressed because it is too large Load Diff

@ -71,10 +71,14 @@
<text class="value">{{ textValue(item.auditUserName) }}</text>
</view>
</view>
<!-- 操作按钮待审核状态显示 -->
<!-- 待入库提交审核 -->
<view v-if="Number(item.status) === 0" class="card-actions">
<view class="action-btn submit-btn" @click.stop="openSubmitAudit(item)">提交审核</view>
</view>
<!-- 待审核通过 / 驳回 -->
<view v-if="Number(item.status) === 10" class="card-actions">
<view class="action-btn approve-btn" @click.stop="handleApprove(item)">{{ t('sparepartInbound.approve') }}</view>
<view class="action-btn reject-btn" @click.stop="handleReject(item)">{{ t('sparepartInbound.reject') }}</view>
<view class="action-btn approve-btn" @click.stop="handleApprove(item)">审核通过</view>
<view class="action-btn reject-btn" @click.stop="handleReject(item)">审核驳回</view>
</view>
</view>
@ -94,6 +98,43 @@
<view class="add-btn" @click="goAdd">
<text class="add-icon">+</text>
</view>
<!-- 提交审核弹框 -->
<view v-if="showAuditModal" class="modal-overlay" @click="closeAuditModal">
<view class="modal-card" @click.stop>
<view class="modal-header">
<text class="modal-title">提交审核</text>
<text class="modal-close" @click="closeAuditModal"></text>
</view>
<view class="modal-body">
<!-- 审核人 -->
<view class="modal-field">
<text class="modal-label"><text class="required">*</text>审核人</text>
<view class="modal-dropdown" @click="toggleAuditorDropdown">
<text :class="{ placeholder: !selectedAuditor }">{{ selectedAuditor ? selectedAuditor.label : '请选择' }}</text>
<text class="dropdown-arrow"></text>
<view v-if="showAuditorDropdown" class="dropdown-panel">
<scroll-view scroll-y class="dropdown-scroll">
<view v-for="u in auditorOptions" :key="u.value" class="dropdown-item" :class="{ active: selectedAuditor?.value === u.value }" @click.stop="selectAuditor(u)">
<text class="dropdown-item-text">{{ u.label }}</text>
<text v-if="selectedAuditor?.value === u.value" class="dropdown-check"></text>
</view>
</scroll-view>
</view>
</view>
</view>
<!-- 备注 -->
<view class="modal-field">
<text class="modal-label">备注</text>
<textarea v-model="auditRemark" class="modal-textarea" placeholder="请输入备注" placeholder-class="textarea-placeholder" :maxlength="200" />
</view>
</view>
<view class="modal-footer">
<view class="modal-btn cancel-btn" @click="closeAuditModal"></view>
<view class="modal-btn confirm-btn" @click="confirmSubmitAudit"></view>
</view>
</view>
</view>
</view>
</template>
@ -102,7 +143,8 @@ import { computed, nextTick, ref } from 'vue'
import { onShow, onUnload } from '@dcloudio/uni-app'
import { useI18n } from 'vue-i18n'
import NavBar from '@/components/common/NavBar.vue'
import { getSparepartInboundPage, auditSparepartInbound } from '@/api/mes/sparepartInbound'
import { getSparepartInboundPage, auditSparepartInbound, submitSparepartInbound } from '@/api/mes/sparepartInbound'
import { getSimpleUserList } from '@/api/mes/moldget'
const { t } = useI18n()
@ -156,15 +198,15 @@ function formatDateTime(value) {
return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())} ${pad(date.getHours())}:${pad(date.getMinutes())}`
}
const STATUS_MAP = { 0: '待入库', 10: '待审核', 20: '已通过', 1: '已驳回' }
const STATUS_MAP = { 0: '待入库', 10: '待审核', 20: '已入库', 1: '已驳回' }
function statusText(s) {
const num = Number(s)
return STATUS_MAP[num] || textValue(num)
}
function statusClass(s) {
const num = Number(s)
if (num === 0) return 'text-warning'
if (num === 10) return 'text-primary'
if (num === 0) return 'text-primary'
if (num === 10) return 'text-warning'
if (num === 20) return 'text-success'
if (num === 1) return 'text-danger'
return ''
@ -292,6 +334,75 @@ async function handleReject(item) {
})
}
//
const showAuditModal = ref(false)
const currentAuditItem = ref(null)
const auditorOptions = ref([])
const selectedAuditor = ref(null)
const showAuditorDropdown = ref(false)
const auditRemark = ref('')
function openSubmitAudit(item) {
currentAuditItem.value = item
selectedAuditor.value = null
auditRemark.value = ''
showAuditModal.value = true
loadAuditorOptions()
}
function closeAuditModal() {
showAuditModal.value = false
currentAuditItem.value = null
showAuditorDropdown.value = false
}
function toggleAuditorDropdown() {
showAuditorDropdown.value = !showAuditorDropdown.value
}
function selectAuditor(u) {
selectedAuditor.value = u
showAuditorDropdown.value = false
}
async function loadAuditorOptions() {
if (auditorOptions.value.length) return
try {
const res = await getSimpleUserList()
const data = Array.isArray(res) ? res : (Array.isArray(res?.data) ? res.data : [])
auditorOptions.value = data.map((u) => ({
value: u.id || u.userId,
label: u.nickname || u.userName || u.name || String(u.id || '')
}))
} catch (e) {
console.error('loadAuditorOptions error', e)
}
}
async function confirmSubmitAudit() {
if (!selectedAuditor.value) {
uni.showToast({ title: '请选择审核人', icon: 'none' })
return
}
if (!currentAuditItem.value?.id) return
try {
uni.showLoading({ title: '提交中...', mask: true })
await submitSparepartInbound({
id: currentAuditItem.value.id,
auditUserId: selectedAuditor.value.value,
remark: auditRemark.value || undefined
})
uni.hideLoading()
uni.showToast({ title: '提交审核成功', icon: 'success' })
closeAuditModal()
fetchList(true)
} catch (e) {
uni.hideLoading()
uni.showToast({ title: '提交失败', icon: 'none' })
}
}
function onScroll(event) {
showGoTop.value = (event?.detail?.scrollTop || 0) > 600
}
@ -505,6 +616,11 @@ onUnload(() => {
color: #dc2626;
}
&.submit-btn {
background: #dbeafe;
color: #1d4ed8;
}
&:active {
opacity: 0.8;
}
@ -591,4 +707,60 @@ onUnload(() => {
line-height: 1;
margin-top: -4rpx;
}
/* ====== 提交审核弹框 ====== */
.modal-overlay {
position: fixed; top: 0; left: 0; right: 0; bottom: 0;
background: rgba(0, 0, 0, 0.45); z-index: 999;
display: flex; align-items: center; justify-content: center;
}
.modal-card {
width: 640rpx; background: #fff; border-radius: 20rpx;
box-shadow: 0 16rpx 48rpx rgba(0,0,0,0.15);
}
.modal-header {
display: flex; align-items: center; justify-content: space-between;
padding: 32rpx 32rpx 20rpx; border-bottom: 1rpx solid #f0f0f0;
}
.modal-title { font-size: 32rpx; font-weight: 700; color: #1a1a1a; }
.modal-close { font-size: 32rpx; color: #999; padding: 8rpx; }
.modal-body { padding: 28rpx 32rpx; }
.modal-field { margin-bottom: 28rpx;
&:last-child { margin-bottom: 0; }
}
.modal-label { font-size: 28rpx; color: #374151; font-weight: 500; margin-bottom: 14rpx; display: block; }
.modal-label .required { color: #ef4444; }
.modal-dropdown {
position: relative; display: flex; align-items: center; justify-content: space-between;
height: 80rpx; padding: 0 24rpx;
background: #f8fafc; border: 1rpx solid #e0e0e0; border-radius: 12rpx;
font-size: 28rpx; color: #374151;
.placeholder { color: #bbb; }
.dropdown-arrow { font-size: 20rpx; color: #999; }
}
.modal-textarea {
width: 100%; min-height: 140rpx; padding: 20rpx;
background: #f8fafc; border: 1rpx solid #e0e0e0;
border-radius: 12rpx; font-size: 27rpx; color: #374151;
box-sizing: border-box;
}
.textarea-placeholder { color: #bbb; }
.dropdown-panel {
position: absolute; top: 100%; left: 0; right: 0; z-index: 200; margin-top: 4rpx;
background: #fff; border: 1rpx solid #e0e0e0; border-radius: 12rpx;
box-shadow: 0 8rpx 30rpx rgba(0,0,0,0.1); overflow: hidden;
}
.dropdown-scroll { height: 300rpx; }
.dropdown-item { display: flex; align-items: center; justify-content: space-between; padding: 20rpx 24rpx; border-bottom: 1rpx solid #f0f0f0;
&:last-child { border-bottom: 0; }
&.active { background: #f0f5ff; }
}
.dropdown-item-text { font-size: 27rpx; color: #333; }
.dropdown-check { font-size: 28rpx; color: #2563eb; font-weight: 700; }
.modal-footer { display: flex; gap: 18rpx; padding: 24rpx 32rpx; border-top: 1rpx solid #f0f0f0; }
.modal-btn { flex: 1; height: 80rpx; line-height: 80rpx; text-align: center; border-radius: 14rpx; font-size: 30rpx; font-weight: 600;
&:active { opacity: 0.85; }
&.cancel-btn { background: #f0f0f0; color: #6b7280; }
&.confirm-btn { background: #1f4b79; color: #fff; }
}
</style>

@ -0,0 +1,492 @@
<template>
<view class="page-container">
<NavBar :title="'确认备件入库'" />
<!-- 已选备件 -->
<view class="sparepart-section">
<view class="section-title-bar">
<view class="section-bar-line"></view>
<text class="section-title">已选备件</text>
</view>
<view class="sparepart-card">
<view class="card-top">
<view class="card-image-wrap">
<image
v-if="sparepartImage"
:src="sparepartImage"
class="card-image"
mode="aspectFill"
/>
<view v-else class="card-image-empty">
<text class="empty-img-icon">📦</text>
</view>
</view>
<view class="card-info-right">
<view class="info-item">
<text class="info-label">备件名称</text>
<text class="info-name">{{ textValue(sparepart.name) }}</text>
</view>
<view class="info-item">
<text class="info-label">规格</text>
<text class="info-value">{{ textValue(sparepart.standard || sparepart.deviceSpec) }}</text>
</view>
<view class="info-item">
<text class="info-label">当前库存</text>
<text class="info-value stock-highlight">{{ sparepart.count != null ? sparepart.count : 0 }}{{ textUnit(sparepart.unitName || sparepart.minStockUnitName || '个') }}</text>
</view>
</view>
</view>
<view class="card-bottom">
<view class="detail-row two-col">
<view class="detail-col">
<text class="detail-label">采购单位</text>
<text class="detail-value">{{ textValue(sparepart.purchaseUnitName) }}</text>
</view>
<view class="detail-col">
<text class="detail-label">库存单位</text>
<text class="detail-value">{{ textValue(sparepart.unitName || sparepart.minStockUnitName || '个') }}</text>
</view>
</view>
<view class="detail-row">
<text class="detail-label">换算关系</text>
<text class="detail-value">1{{ textValue(sparepart.purchaseUnitName) }}={{ textValue(sparepart.purchaseUnitConvertQuantity) }}{{ stockUnitLabel(sparepart) }}</text>
</view>
</view>
</view>
<!-- 入库数量 -->
<view class="section-title-bar" style="padding-top: 24rpx;">
<view class="section-bar-line"></view>
<text class="section-title">入库数量</text>
</view>
<view class="qty-input-card">
<view class="form-field">
<text class="form-label">入库数量</text>
<input
v-model="inboundQty"
class="form-input"
placeholder="请输入"
confirm-type="done"
/>
<text class="form-suffix-text">单位{{ textValue(sparepart.purchaseUnitName) }}</text>
</view>
<view class="convert-row">
<text class="convert-label-inline">折算后库存数量</text>
<text class="convert-value-inline">{{ calculatedStock }}</text>
<text class="convert-unit-inline">{{ stockUnitLabel(sparepart) }}</text>
</view>
<view class="convert-formula-inline">
{{ inboundQty || 0 }}{{ textValue(sparepart.purchaseUnitName) }} × {{ textValue(sparepart.purchaseUnitConvertQuantity) }}{{ stockUnitLabel(sparepart) }} = {{ calculatedStock }}{{ stockUnitLabel(sparepart) }}
</view>
</view>
<!-- 供应商 -->
<view class="section-title-bar" style="padding-top: 24rpx;">
<view class="section-bar-line"></view>
<text class="section-title">供应商</text>
</view>
<view class="select-row-card">
<view class="full-dropdown">
<text :class="{ placeholder: !defaultSupplierName }">
{{ defaultSupplierName || '未配置默认供应商' }}
</text>
</view>
</view>
<!-- 仓库/库区 -->
<view class="section-title-bar" style="padding-top: 24rpx;">
<view class="section-bar-line"></view>
<text class="section-title">仓库/库区</text>
</view>
<view class="select-row-card warehouse-area-card">
<view class="warehouse-area-rows">
<view class="warehouse-area-row">
<text class="warehouse-area-label">仓库</text>
<view class="warehouse-area-dropdown" @click="toggleWarehouseDropdown">
<view class="dropdown-input">
<text :class="['dropdown-value', { placeholder: !selectedWarehouse }]">
{{ selectedWarehouse ? selectedWarehouse.label : '请选择' }}
</text>
<text class="dropdown-arrow"></text>
</view>
<view v-if="showWarehouseDropdown" class="dropdown-panel">
<scroll-view scroll-y class="dropdown-scroll">
<view
v-for="item in warehouseOptions"
:key="item.value"
class="dropdown-item"
:class="{ active: selectedWarehouse?.value === item.value }"
@click.stop="handleSelectWarehouse(item)"
>
<text class="dropdown-item-text">{{ item.label }}</text>
<text v-if="selectedWarehouse?.value === item.value" class="dropdown-check"></text>
</view>
<view v-if="!warehouseOptions.length" class="dropdown-empty"></view>
</scroll-view>
</view>
</view>
</view>
<view class="warehouse-area-row">
<text class="warehouse-area-label">库区</text>
<view class="warehouse-area-dropdown" @click="toggleAreaDropdown">
<view class="dropdown-input">
<text :class="['dropdown-value', { placeholder: !selectedArea }]">
{{ selectedArea ? selectedArea.label : (loadingAreas ? '加载中...' : '请选择') }}
</text>
<text class="dropdown-arrow"></text>
</view>
<view v-if="showAreaDropdown" class="dropdown-panel">
<scroll-view scroll-y class="dropdown-scroll">
<view
v-for="item in areaOptions"
:key="item.value"
class="dropdown-item"
:class="{ active: selectedArea?.value === item.value }"
@click.stop="handleSelectArea(item)"
>
<text class="dropdown-item-text">{{ item.label }}</text>
<text v-if="selectedArea?.value === item.value" class="dropdown-check"></text>
</view>
<view v-if="!areaOptions.length" class="dropdown-empty"></view>
</scroll-view>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 底部确认按钮 -->
<view class="bottom-actions">
<view class="bottom-btn cancel-btn" @click="handleCancel"></view>
<view class="bottom-btn confirm-btn" @click="handleConfirm"></view>
</view>
</view>
</template>
<script setup>
import { ref, computed } from 'vue'
import { onShow, onHide } from '@dcloudio/uni-app'
import NavBar from '@/components/common/NavBar.vue'
import { getWarehouseSimpleList, getWarehouseAreaSimpleList } from '@/api/mes/moldget'
import { getSparepartDetail, getSparepartStockCount } from '@/api/mes/sparepart'
const sparepart = ref({})
const inboundQty = ref(null)
const supplierId = ref(undefined)
const supplierName = ref('')
//
const warehouseOptions = ref([])
const selectedWarehouse = ref(null)
const showWarehouseDropdown = ref(false)
//
const areaOptions = ref([])
const selectedArea = ref(null)
const showAreaDropdown = ref(false)
const loadingAreas = ref(false)
const sparepartImage = computed(() => {
const images = sparepart.value.images
if (!images) return ''
if (Array.isArray(images)) return String(images[0] || '')
return String(images).split(',')[0]?.trim() || ''
})
const calculatedStock = computed(() => {
const qty = Number(inboundQty.value) || 0
const ratio = Number(sparepart.value.purchaseUnitConvertQuantity) || 0
return qty * ratio
})
const defaultSupplierName = computed(() => {
const suppliers = sparepart.value.suppliers
const defaultId = sparepart.value.defaultSupplierId
if (!suppliers || !suppliers.length) return ''
if (defaultId) {
const found = suppliers.find(s => s.supplierId === defaultId || s.id === defaultId)
if (found) return found.supplierName || ''
}
const firstDefault = suppliers.find(s => s.defaultStatus === 1)
return firstDefault?.supplierName || ''
})
function textValue(v) {
if (v === 0) return '0'
if (v == null) return '-'
const s = String(v).trim()
return s || '-'
}
function textUnit(v) {
if (v === 0) return '0'
if (v == null) return ''
return String(v).trim()
}
function stockUnitLabel(item) {
return item.unitName || item.minStockUnitName || '个'
}
function handleCancel() {
uni.navigateBack()
}
function handleConfirm() {
if (!inboundQty.value || Number(inboundQty.value) <= 0) {
uni.showToast({ title: '请输入入库数量', icon: 'none' })
return
}
if (!selectedWarehouse.value) {
uni.showToast({ title: '请选择仓库', icon: 'none' })
return
}
if (!selectedArea.value) {
uni.showToast({ title: '请选择库区', icon: 'none' })
return
}
// globalData
const item = {
//
productId: sparepart.value.id,
productName: sparepart.value.name || '',
productBarCode: sparepart.value.barCode || '',
productUnitName: sparepart.value.unitName || sparepart.value.minStockUnitName || '',
purchaseUnitName: sparepart.value.purchaseUnitName || '',
purchaseUnitConvertQuantity: Number(sparepart.value.purchaseUnitConvertQuantity) || 1,
//
inputCount: Number(inboundQty.value),
count: Number(inboundQty.value) * (Number(sparepart.value.purchaseUnitConvertQuantity) || 1),
//
supplierId: sparepart.value.defaultSupplierId,
supplierName: defaultSupplierName.value,
//
warehouseId: selectedWarehouse.value.value,
warehouseName: selectedWarehouse.value.label,
areaId: selectedArea.value.value,
areaName: selectedArea.value.label,
// sparepart
_sparepart: { ...sparepart.value }
}
// globalData
if (!getApp().globalData._sparepartInboundItems) {
getApp().globalData._sparepartInboundItems = []
}
getApp().globalData._sparepartInboundItems.push(item)
uni.showToast({ title: '已添加: ' + (sparepart.value.name || ''), icon: 'success', duration: 1200 })
setTimeout(() => {
// (delta=1) vs (delta=2select)
const fromScan = getApp().globalData._sparepartFromScan
getApp().globalData._sparepartFromScan = false
uni.navigateBack({ delta: fromScan ? 1 : 2 })
}, 800)
}
//
function toggleWarehouseDropdown() {
showWarehouseDropdown.value = !showWarehouseDropdown.value
}
function handleSelectWarehouse(item) {
selectedWarehouse.value = item
showWarehouseDropdown.value = false
selectedArea.value = null
areaOptions.value = []
loadAreas(item.value)
}
async function loadWarehouses() {
try {
const res = await getWarehouseSimpleList()
const data = Array.isArray(res) ? res : (Array.isArray(res?.data) ? res.data : [])
warehouseOptions.value = data.map((w) => ({
value: w.id,
label: w.name || String(w.id || '')
}))
} catch (e) {
console.error('loadWarehouses error', e)
}
}
//
function toggleAreaDropdown() {
if (!selectedWarehouse.value) {
uni.showToast({ title: '请先选择仓库', icon: 'none' })
return
}
showAreaDropdown.value = !showAreaDropdown.value
}
function handleSelectArea(item) {
selectedArea.value = item
showAreaDropdown.value = false
}
async function loadAreas(warehouseId) {
if (!warehouseId) return
loadingAreas.value = true
areaOptions.value = []
try {
const res = await getWarehouseAreaSimpleList(warehouseId)
const data = Array.isArray(res) ? res : (Array.isArray(res?.data) ? res.data : [])
areaOptions.value = data.map((a) => ({
value: a.id,
label: a.name || a.areaName || String(a.id || '')
}))
} catch (e) {
console.error('loadAreas error', e)
} finally {
loadingAreas.value = false
}
}
onShow(async () => {
// globalData
const selectResult = getApp().globalData?._sparepartBeforeConfirm
if (selectResult) {
sparepart.value = selectResult
inboundQty.value = null
getApp().globalData._sparepartBeforeConfirm = null
//
if (selectResult.id) {
try {
const res = await getSparepartDetail(selectResult.id)
const detail = res?.data || res
if (detail) {
sparepart.value = { ...sparepart.value, ...detail }
loadStockCount()
}
} catch (e) {
console.error('获取备件详情失败:', e)
}
}
}
loadWarehouses()
})
async function loadStockCount() {
const id = sparepart.value.id
if (!id) return
try {
const res = await getSparepartStockCount(id)
const count = res?.data ?? res
sparepart.value.count = (count != null) ? Number(count) : 0
} catch (e) {
console.error('获取库存失败:', e)
sparepart.value.count = 0
}
}
onHide(() => {
showWarehouseDropdown.value = false
showAreaDropdown.value = false
})
</script>
<style lang="scss" scoped>
.page-container {
min-height: 100vh;
background: #f5f6f8;
padding-bottom: calc(120rpx + env(safe-area-inset-bottom));
}
.sparepart-section { padding: 0; }
.section-title-bar { display: flex; align-items: center; gap: 10rpx; padding: 24rpx 24rpx 18rpx; }
.section-bar-line { width: 6rpx; height: 32rpx; border-radius: 3rpx; background: #2563eb; flex-shrink: 0; }
.section-title { font-size: 30rpx; font-weight: 700; color: #1a1a1a; }
.sparepart-card {
background: #fff; border-radius: 16rpx; padding: 24rpx; margin: 0 24rpx 20rpx;
box-shadow: 0 4rpx 16rpx rgba(15, 23, 42, 0.04);
}
.card-top { display: flex; position: relative; }
.card-image-wrap {
width: 160rpx; height: 160rpx; border-radius: 12rpx; overflow: hidden;
background: #f8fafc; border: 1rpx solid #f0f0f0; flex-shrink: 0; margin-right: 20rpx;
}
.card-image { width: 100%; height: 100%; }
.card-image-empty { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: #f8fafc; }
.empty-img-icon { font-size: 56rpx; opacity: 0.3; }
.card-info-right { flex: 1; min-width: 0; }
.info-item { display: flex; align-items: center; margin-bottom: 8rpx; }
.info-label { font-size: 26rpx; color: #6b7280; flex-shrink: 0; }
.info-name { font-size: 30rpx; font-weight: 700; color: #0f172a; }
.info-value { font-size: 26rpx; color: #374151; &.stock-highlight { color: #2563eb; font-weight: 500; } }
.card-bottom { margin-top: 20rpx; padding-top: 20rpx; border-top: 1rpx solid #f0f0f0; }
.detail-row { display: flex; align-items: center; margin-bottom: 14rpx;
&:last-child { margin-bottom: 0; }
&.two-col { justify-content: space-between; }
}
.detail-col { display: flex; align-items: center; flex: 1; }
.detail-label { font-size: 24rpx; color: #9ca3af; flex-shrink: 0; }
.detail-value { font-size: 24rpx; color: #4b5563; }
.qty-input-card {
background: #fff; border-radius: 16rpx; padding: 24rpx; margin: 0 24rpx;
box-shadow: 0 4rpx 16rpx rgba(15, 23, 42, 0.04);
}
.form-field { display: flex; flex-direction: column; gap: 12rpx; }
.form-label { font-size: 26rpx; color: #4b5563; font-weight: 500; }
.form-input { width: 100%; height: 88rpx; padding: 0 24rpx; font-size: 28rpx; color: #374151; background: #f8fafc; border-radius: 14rpx; box-sizing: border-box; }
.form-suffix-text { display: block; margin-top: 10rpx; font-size: 24rpx; color: #9ca3af; }
.convert-row { margin-top: 20rpx; padding-top: 20rpx; border-top: 1rpx solid #f0f0f0; display: flex; align-items: center; }
.convert-label-inline { font-size: 26rpx; color: #6b7280; }
.convert-value-inline { font-size: 36rpx; font-weight: 700; color: #1f2937; margin-left: auto; }
.convert-unit-inline { font-size: 24rpx; color: #64748b; margin-left: 8rpx; }
.convert-formula-inline { margin-top: 10rpx; font-size: 22rpx; color: #9ca3af; }
.select-row-card {
position: relative; display: flex; align-items: center; justify-content: space-between;
background: #fff; border-radius: 16rpx; padding: 24rpx; margin: 0 24rpx 20rpx;
box-shadow: 0 4rpx 16rpx rgba(15, 23, 42, 0.04);
.dropdown-panel {
position: absolute; top: 100%; left: 0; right: 0; z-index: 200; margin-top: 4rpx;
background: #fff; border: 1rpx solid #e0e0e0; border-radius: 12rpx;
box-shadow: 0 8rpx 30rpx rgba(0, 0, 0, 0.1); overflow: hidden;
}
}
.full-dropdown { display: flex; align-items: center; justify-content: space-between; width: 100%; font-size: 28rpx; color: #374151;
.placeholder { color: #9ca3af; }
}
.warehouse-area-card { align-items: flex-start; }
.warehouse-area-rows { width: 100%; display: flex; flex-direction: column; gap: 16rpx; }
.warehouse-area-row { display: flex; align-items: center; }
.warehouse-area-label { width: 80rpx; font-size: 26rpx; color: #6b7280; flex-shrink: 0; }
.warehouse-area-dropdown { flex: 1; min-width: 0; position: relative;
.dropdown-panel {
position: absolute; top: 100%; left: 0; right: 0; z-index: 100; margin-top: 4rpx;
background: #fff; border: 1rpx solid #e0e0e0; border-radius: 12rpx;
box-shadow: 0 8rpx 30rpx rgba(0, 0, 0, 0.1); overflow: hidden;
}
}
.dropdown-input { display: flex; align-items: center; height: 64rpx; padding: 0 20rpx; border: 1rpx solid #e0e0e0; border-radius: 10rpx; background: #f9fafb; }
.dropdown-value { flex: 1; font-size: 27rpx; color: #333; &.placeholder { color: #bbb; } }
.dropdown-arrow { font-size: 20rpx; color: #999; flex-shrink: 0; }
.dropdown-panel { position: absolute; top: 68rpx; left: 0; right: 0; z-index: 200; background: #fff; border: 1rpx solid #e0e0e0; border-radius: 12rpx; box-shadow: 0 8rpx 30rpx rgba(0, 0, 0, 0.1); overflow: hidden; }
.dropdown-scroll { height: 360rpx; }
.dropdown-item { display: flex; align-items: center; justify-content: space-between; padding: 20rpx 24rpx; border-bottom: 1rpx solid #f0f0f0;
&:last-child { border-bottom: 0; }
&.active { background: #f0f5ff; }
}
.dropdown-item-text { font-size: 27rpx; color: #333; }
.dropdown-check { font-size: 28rpx; color: #2563eb; font-weight: 700; }
.dropdown-empty { padding: 32rpx; text-align: center; color: #999; font-size: 26rpx; }
.bottom-actions {
position: fixed; left: 0; right: 0; bottom: 0; display: flex; gap: 18rpx;
padding: 18rpx 24rpx calc(18rpx + env(safe-area-inset-bottom));
background: #ffffff; box-shadow: 0 -8rpx 24rpx rgba(15, 23, 42, 0.06); z-index: 99;
}
.bottom-btn { flex: 1; height: 84rpx; line-height: 84rpx; text-align: center; border-radius: 16rpx; font-size: 30rpx; font-weight: 600;
&:active { opacity: 0.85; }
}
.cancel-btn { background: #eef2f7; color: #475569; }
.confirm-btn { background: #1f4b79; color: #ffffff; }
</style>

@ -143,9 +143,15 @@ function handleConfirm() {
return
}
const item = sparepartList.value.find((d) => d.id === selectedId.value)
// globalData onShow
getApp().globalData._sparepartSelectResult = item || null
uni.navigateBack()
if (!item) return
// globalData
getApp().globalData._sparepartBeforeConfirm = item
const from = getApp().globalData._sparepartSelectFrom || 'inbound'
getApp().globalData._sparepartSelectFrom = null
const url = from === 'outbound'
? '/pages_function/pages/sparepartOutbound/sparepartConfirm'
: '/pages_function/pages/sparepartInbound/sparepartConfirm'
uni.navigateTo({ url })
}
onShow(async () => {

File diff suppressed because it is too large Load Diff

@ -2,82 +2,40 @@
<view class="page-container">
<NavBar :title="t('sparepartOutbound.moduleName')" />
<!-- 搜索栏 -->
<view class="filter-bar">
<view class="keyword-box">
<input
v-model="searchKeyword"
class="keyword-input"
:placeholder="t('sparepartOutbound.searchPlaceholder')"
confirm-type="search"
@input="handleKeywordInput"
@confirm="handleSearch"
/>
<input v-model="searchKeyword" class="keyword-input" :placeholder="t('sparepartOutbound.searchPlaceholder')" confirm-type="search" @input="handleKeywordInput" @confirm="handleSearch" />
</view>
<picker mode="selector" :range="statusLabels" :value="statusIndex" @change="onStatusChange">
<view class="status-box">
<text class="status-box-text">{{ currentStatusLabel }}</text>
<uni-icons type="bottom" size="14" color="#9ca3af"></uni-icons>
</view>
<view class="status-box"><text class="status-box-text">{{ currentStatusLabel }}</text><uni-icons type="bottom" size="14" color="#9ca3af"></uni-icons></view>
</picker>
<view class="reset-filter-btn" @click="resetFilters">{{ t('functionCommon.reset') }}</view>
</view>
<!-- 列表 -->
<scroll-view
scroll-y
class="list-scroll"
:scroll-top="scrollTop"
@scroll="onScroll"
@scrolltolower="loadMore"
:lower-threshold="80"
>
<scroll-view scroll-y class="list-scroll" :scroll-top="scrollTop" @scroll="onScroll" @scrolltolower="loadMore" :lower-threshold="80">
<view class="list-wrap">
<view
v-for="item in list"
:key="item.id"
class="task-card"
@click="openDetail(item)"
>
<view v-for="item in list" :key="item.id" class="task-card" @click="openDetail(item)">
<view class="card-header">
<view class="header-main">
<view class="header-left">
<text class="task-no">{{ textValue(item.no) }}</text>
</view>
<view class="header-tags">
<text :class="['record-tag', statusClass(item.status)]">{{ statusText(item.status) }}</text>
</view>
<view class="header-left"><text class="task-no">{{ textValue(item.no) }}</text></view>
<view class="header-tags"><text :class="['record-tag', statusClass(item.status)]">{{ statusText(item.status) }}</text></view>
</view>
</view>
<view class="card-body">
<view class="row">
<text class="label">{{ t('sparepartOutbound.sparepartInfo') }}</text>
<text class="value">{{ textValue(item.productNames) }}</text>
</view>
<view class="row">
<text class="label">{{ t('sparepartOutbound.outboundTime') }}</text>
<text class="value">{{ formatDateTime(item.outTime || item.createTime) }}</text>
</view>
<view class="row">
<text class="label">{{ t('sparepartOutbound.creator') }}</text>
<text class="value">{{ textValue(item.creatorName || item.creator) }}</text>
</view>
<view class="row">
<text class="label">{{ t('sparepartOutbound.quantity') }}</text>
<text class="value highlight">{{ textValue(item.totalCount) }}</text>
</view>
<view class="row">
<text class="label">{{ t('sparepartOutbound.reviewer') }}</text>
<text class="value">{{ textValue(item.auditUserName) }}</text>
</view>
<view class="row"><text class="label">{{ t('sparepartOutbound.sparepartInfo') }}</text><text class="value">{{ textValue(item.productNames) }}</text></view>
<view class="row"><text class="label">{{ t('sparepartOutbound.outboundTime') }}</text><text class="value">{{ formatDateTime(item.outTime || item.createTime) }}</text></view>
<view class="row"><text class="label">{{ t('sparepartOutbound.creator') }}</text><text class="value">{{ textValue(item.creatorName || item.creator) }}</text></view>
<view class="row"><text class="label">{{ t('sparepartOutbound.quantity') }}</text><text class="value highlight">{{ textValue(item.totalCount) }}</text></view>
<view class="row"><text class="label">{{ t('sparepartOutbound.reviewer') }}</text><text class="value">{{ textValue(item.auditUserName) }}</text></view>
</view>
<view v-if="Number(item.status) === 0" class="card-actions">
<view class="action-btn submit-btn" @click.stop="openSubmitAudit(item)">提交审核</view>
</view>
<!-- 操作按钮待审核状态显示 -->
<view v-if="Number(item.status) === 10" class="card-actions">
<view class="action-btn approve-btn" @click.stop="handleApprove(item)">{{ t('sparepartOutbound.approve') }}</view>
<view class="action-btn reject-btn" @click.stop="handleReject(item)">{{ t('sparepartOutbound.reject') }}</view>
<view class="action-btn approve-btn" @click.stop="handleApprove(item)">审核通过</view>
<view class="action-btn reject-btn" @click.stop="handleReject(item)">审核驳回</view>
</view>
</view>
<view v-if="loading && pageNo === 1" class="hint">{{ t('functionCommon.loading') }}</view>
<view v-else-if="!list.length" class="hint">{{ t('sparepartOutbound.empty') }}</view>
<view v-else-if="loadingMore" class="hint">{{ t('functionCommon.loadingMore') }}</view>
@ -85,46 +43,65 @@
</view>
</scroll-view>
<!-- 回顶部 -->
<view v-if="showGoTop" class="go-top-btn" @click="goTop">
<uni-icons type="arrow-up" size="20" color="#1f4b79"></uni-icons>
</view>
<!-- 新增按钮 -->
<view class="add-btn" @click="goAdd">
<text class="add-icon">+</text>
<view v-if="showGoTop" class="go-top-btn" @click="goTop"><uni-icons type="arrow-up" size="20" color="#1f4b79"></uni-icons></view>
<view class="add-btn" @click="goAdd"><text class="add-icon">+</text></view>
<!-- 提交审核弹框 -->
<view v-if="showAuditModal" class="modal-overlay" @click="closeAuditModal">
<view class="modal-card" @click.stop>
<view class="modal-header"><text class="modal-title">提交审核</text><text class="modal-close" @click="closeAuditModal"></text></view>
<view class="modal-body">
<view class="modal-field">
<text class="modal-label"><text class="required">*</text>审核人</text>
<view class="modal-dropdown" @click="toggleAuditorDropdown">
<text :class="{ placeholder: !selectedAuditor }">{{ selectedAuditor ? selectedAuditor.label : '请选择' }}</text>
<text class="dropdown-arrow"></text>
<view v-if="showAuditorDropdown" class="dropdown-panel">
<scroll-view scroll-y class="dropdown-scroll">
<view v-for="u in auditorOptions" :key="u.value" class="dropdown-item" :class="{ active: selectedAuditor?.value === u.value }" @click.stop="selectAuditor(u)">
<text class="dropdown-item-text">{{ u.label }}</text>
<text v-if="selectedAuditor?.value === u.value" class="dropdown-check"></text>
</view>
</scroll-view>
</view>
</view>
</view>
<view class="modal-field">
<text class="modal-label">备注</text>
<textarea v-model="auditRemark" class="modal-textarea" placeholder="请输入备注" placeholder-class="textarea-placeholder" :maxlength="200" />
</view>
</view>
<view class="modal-footer">
<view class="modal-btn cancel-btn" @click="closeAuditModal"></view>
<view class="modal-btn confirm-btn" @click="confirmSubmitAudit"></view>
</view>
</view>
</view>
</view>
</template>
<script setup>
import { computed, nextTick, ref } from 'vue'
import { computed, ref } from 'vue'
import { onShow, onUnload } from '@dcloudio/uni-app'
import { useI18n } from 'vue-i18n'
import NavBar from '@/components/common/NavBar.vue'
import { getSparepartOutboundPage, auditSparepartOutbound } from '@/api/mes/sparepartOutbound'
import { getSparepartOutboundPage, auditSparepartOutbound, submitSparepartOutbound } from '@/api/mes/sparepartOutbound'
import { getSimpleUserList } from '@/api/mes/moldget'
const { t } = useI18n()
const selectedStatus = ref('')
const searchKeyword = ref('')
const statusOptions = computed(() => [
{ label: t('functionCommon.all'), value: '' },
{ label: t('sparepartOutbound.tabPending'), value: '0' },
{ label: t('sparepartOutbound.tabAuditing'), value: '10' },
{ label: t('sparepartOutbound.approve'), value: '20' }
])
const statusLabels = computed(() => statusOptions.value.map((item) => item.label))
const statusIndex = computed(() => {
const index = statusOptions.value.findIndex((item) => item.value === selectedStatus.value)
return index >= 0 ? index : 0
})
const currentStatusLabel = computed(() => {
const current = statusOptions.value.find((item) => item.value === selectedStatus.value)
return current ? current.label : t('functionCommon.all')
})
const statusLabels = computed(() => statusOptions.value.map(i => i.label))
const statusIndex = computed(() => { const idx = statusOptions.value.findIndex(i => i.value === selectedStatus.value); return idx >= 0 ? idx : 0 })
const currentStatusLabel = computed(() => { const cur = statusOptions.value.find(i => i.value === selectedStatus.value); return cur ? cur.label : t('functionCommon.all') })
const list = ref([])
const loading = ref(false)
const loadingMore = ref(false)
@ -133,38 +110,22 @@ const pageNo = ref(1)
const pageSize = ref(10)
const scrollTop = ref(0)
const showGoTop = ref(false)
let searchTimer = null
function textValue(v) {
if (v === 0) return '0'
if (v == null) return '-'
const s = String(v).trim()
return s || '-'
}
function textValue(v) { if (v === 0) return '0'; if (v == null) return '-'; const s = String(v).trim(); return s || '-' }
function formatDateTime(value) {
if (!value) return '-'
if (Array.isArray(value) && value.length >= 3) {
const [year, month, day, hour = 0, minute = 0, second = 0] = value
const pad = (n) => String(n).padStart(2, '0')
return `${year}-${pad(month)}-${pad(day)} ${pad(hour)}:${pad(minute)}:${pad(second)}`
}
const date = new Date(Number(value))
if (Number.isNaN(date.getTime())) return String(value)
const pad = (n) => String(n).padStart(2, '0')
return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())} ${pad(date.getHours())}:${pad(date.getMinutes())}`
if (Array.isArray(value) && value.length >= 3) { const [y,m,d,h=0,mi=0,s=0]=value; const p=n=>String(n).padStart(2,'0'); return `${y}-${p(m)}-${p(d)} ${p(h)}:${p(mi)}:${p(s)}` }
const date = new Date(Number(value)); if (Number.isNaN(date.getTime())) return String(value)
const p=n=>String(n).padStart(2,'0'); return `${date.getFullYear()}-${p(date.getMonth()+1)}-${p(date.getDate())} ${p(date.getHours())}:${p(date.getMinutes())}`
}
const STATUS_MAP = { 0: '待出库', 10: '待审核', 20: '已通过', 1: '已驳回' }
function statusText(s) {
const num = Number(s)
return STATUS_MAP[num] || textValue(num)
}
const STATUS_MAP = { 0: '待出库', 10: '待审核', 20: '已出库', 1: '已驳回' }
function statusText(s) { const num = Number(s); return STATUS_MAP[num] || textValue(num) }
function statusClass(s) {
const num = Number(s)
if (num === 0) return 'text-warning'
if (num === 10) return 'text-primary'
if (num === 0) return 'text-primary'
if (num === 10) return 'text-warning'
if (num === 20) return 'text-success'
if (num === 1) return 'text-danger'
return ''
@ -172,423 +133,138 @@ function statusClass(s) {
function normalizePageData(res) {
const root = res && res.data !== undefined ? res.data : res
const candidateList = root?.list || root?.rows || root?.records || root?.data?.list || root?.data?.rows || []
const candidateTotal = root?.total ?? root?.data?.total ?? (Array.isArray(candidateList) ? candidateList.length : 0)
return {
list: Array.isArray(candidateList) ? candidateList : [],
total: Number(candidateTotal || 0)
}
const l = root?.list || root?.rows || root?.records || root?.data?.list || root?.data?.rows || []
const t = root?.total ?? root?.data?.total ?? (Array.isArray(l) ? l.length : 0)
return { list: Array.isArray(l) ? l : [], total: Number(t || 0) }
}
async function fetchList(reset) {
if (reset) {
pageNo.value = 1
finished.value = false
}
if (pageNo.value === 1) {
loading.value = true
} else {
loadingMore.value = true
}
if (reset) { pageNo.value = 1; finished.value = false }
if (pageNo.value === 1) loading.value = true; else loadingMore.value = true
try {
const params = {
pageNo: pageNo.value,
pageSize: pageSize.value,
no: searchKeyword.value.trim() || undefined,
status: selectedStatus.value || undefined
}
const params = { pageNo: pageNo.value, pageSize: pageSize.value, no: searchKeyword.value.trim() || undefined, status: selectedStatus.value || undefined }
const res = await getSparepartOutboundPage(params)
const page = normalizePageData(res)
list.value = reset ? page.list : [...list.value, ...page.list]
finished.value = list.value.length >= page.total || page.list.length < pageSize.value
} catch (e) {
if (!reset) pageNo.value = Math.max(1, pageNo.value - 1)
uni.showToast({ title: t('functionCommon.loadFailed'), icon: 'none' })
} finally {
loading.value = false
loadingMore.value = false
}
} catch (e) { if (!reset) pageNo.value = Math.max(1, pageNo.value - 1); uni.showToast({ title: t('functionCommon.loadFailed'), icon: 'none' }) }
finally { loading.value = false; loadingMore.value = false }
}
function onStatusChange(event) {
const index = Number(event?.detail?.value || 0)
selectedStatus.value = statusOptions.value[index]?.value ?? ''
fetchList(true)
}
function handleSearch() {
clearSearchTimer()
uni.hideKeyboard()
fetchList(true)
}
function handleKeywordInput() {
clearSearchTimer()
searchTimer = setTimeout(() => {
fetchList(true)
}, 300)
}
function resetFilters() {
clearSearchTimer()
searchKeyword.value = ''
selectedStatus.value = ''
fetchList(true)
}
async function loadMore() {
if (loading.value || loadingMore.value || finished.value) return
pageNo.value += 1
await fetchList(false)
}
function openDetail(item) {
if (!item?.id) {
uni.showToast({ title: t('functionCommon.noIdView'), icon: 'none' })
return
}
uni.navigateTo({
url: `/pages_function/pages/sparepartOutbound/detail?id=${encodeURIComponent(String(item.id))}`
})
}
function onStatusChange(e) { const idx = Number(e?.detail?.value || 0); selectedStatus.value = statusOptions.value[idx]?.value ?? ''; fetchList(true) }
function handleSearch() { clearSearchTimer(); uni.hideKeyboard(); fetchList(true) }
function handleKeywordInput() { clearSearchTimer(); searchTimer = setTimeout(() => fetchList(true), 300) }
function resetFilters() { clearSearchTimer(); searchKeyword.value = ''; selectedStatus.value = ''; fetchList(true) }
async function loadMore() { if (loading.value || loadingMore.value || finished.value) return; pageNo.value += 1; await fetchList(false) }
function openDetail(item) { if (!item?.id) { uni.showToast({ title: t('functionCommon.noIdView'), icon: 'none' }); return }; uni.navigateTo({ url: `/pages_function/pages/sparepartOutbound/detail?id=${encodeURIComponent(String(item.id))}` }) }
async function handleApprove(item) {
if (!item?.id) return
uni.showModal({
title: t('functionCommon.confirmTitle'),
content: t('sparepartOutbound.confirmApprove'),
confirmColor: '#16a34a',
success: async (res) => {
if (res.confirm) {
try {
await auditSparepartOutbound({ id: item.id, status: 20 })
uni.showToast({ title: t('sparepartOutbound.approveSuccess'), icon: 'success' })
fetchList(true)
} catch (e) {
uni.showToast({ title: t('functionCommon.saveFailed'), icon: 'none' })
}
}
}
uni.showModal({ title: t('functionCommon.confirmTitle'), content: t('sparepartOutbound.confirmApprove'), confirmColor: '#16a34a',
success: async (res) => { if (res.confirm) { try { await auditSparepartOutbound({ id: item.id, status: 20 }); uni.showToast({ title: t('sparepartOutbound.approveSuccess'), icon: 'success' }); fetchList(true) } catch (e) { uni.showToast({ title: t('functionCommon.saveFailed'), icon: 'none' }) } } }
})
}
async function handleReject(item) {
if (!item?.id) return
uni.showModal({
title: t('functionCommon.confirmTitle'),
content: t('sparepartOutbound.confirmReject'),
confirmColor: '#dc2626',
success: async (res) => {
if (res.confirm) {
try {
await auditSparepartOutbound({ id: item.id, status: 1 })
uni.showToast({ title: t('sparepartOutbound.rejectSuccess'), icon: 'success' })
fetchList(true)
} catch (e) {
uni.showToast({ title: t('functionCommon.saveFailed'), icon: 'none' })
}
}
}
uni.showModal({ title: t('functionCommon.confirmTitle'), content: t('sparepartOutbound.confirmReject'), confirmColor: '#dc2626',
success: async (res) => { if (res.confirm) { try { await auditSparepartOutbound({ id: item.id, status: 1 }); uni.showToast({ title: t('sparepartOutbound.rejectSuccess'), icon: 'success' }); fetchList(true) } catch (e) { uni.showToast({ title: t('functionCommon.saveFailed'), icon: 'none' }) } } }
})
}
function onScroll(event) {
showGoTop.value = (event?.detail?.scrollTop || 0) > 600
}
function goTop() {
scrollTop.value = 0
}
function goAdd() {
uni.navigateTo({
url: '/pages_function/pages/sparepartOutbound/create'
})
}
function clearSearchTimer() {
if (searchTimer) {
clearTimeout(searchTimer)
searchTimer = null
}
}
onShow(() => {
fetchList(true)
})
onUnload(() => {
clearSearchTimer()
})
//
const showAuditModal = ref(false)
const currentAuditItem = ref(null)
const auditorOptions = ref([])
const selectedAuditor = ref(null)
const showAuditorDropdown = ref(false)
const auditRemark = ref('')
function openSubmitAudit(item) { currentAuditItem.value = item; selectedAuditor.value = null; auditRemark.value = ''; showAuditModal.value = true; loadAuditorOptions() }
function closeAuditModal() { showAuditModal.value = false; currentAuditItem.value = null; showAuditorDropdown.value = false }
function toggleAuditorDropdown() { showAuditorDropdown.value = !showAuditorDropdown.value }
function selectAuditor(u) { selectedAuditor.value = u; showAuditorDropdown.value = false }
async function loadAuditorOptions() { if (auditorOptions.value.length) return; try { const res = await getSimpleUserList(); const data = Array.isArray(res) ? res : (Array.isArray(res?.data) ? res.data : []); auditorOptions.value = data.map(u => ({ value: u.id || u.userId, label: u.nickname || u.userName || u.name || String(u.id || '') })) } catch (e) {} }
async function confirmSubmitAudit() {
if (!selectedAuditor.value) { uni.showToast({ title: '请选择审核人', icon: 'none' }); return }
if (!currentAuditItem.value?.id) return
try { uni.showLoading({ title: '提交中...', mask: true }); await submitSparepartOutbound({ id: currentAuditItem.value.id, auditUserId: selectedAuditor.value.value, remark: auditRemark.value || undefined }); uni.hideLoading(); uni.showToast({ title: '提交审核成功', icon: 'success' }); closeAuditModal(); fetchList(true) }
catch (e) { uni.hideLoading(); uni.showToast({ title: '提交失败', icon: 'none' }) }
}
function onScroll(e) { showGoTop.value = (e?.detail?.scrollTop || 0) > 600 }
function goTop() { scrollTop.value = 0 }
function goAdd() { uni.navigateTo({ url: '/pages_function/pages/sparepartOutbound/create' }) }
function clearSearchTimer() { if (searchTimer) { clearTimeout(searchTimer); searchTimer = null } }
onShow(() => { fetchList(true) })
onUnload(() => { clearSearchTimer() })
</script>
<style lang="scss" scoped>
.page-container {
min-height: 100vh;
background: #f4f5f7;
}
/* ====== 搜索栏 ====== */
.filter-bar {
display: flex;
align-items: center;
gap: 12rpx;
padding: 18rpx 24rpx;
background: #fff;
}
.keyword-box {
flex: 1;
min-width: 0;
height: 66rpx;
padding: 0 28rpx;
background: #f4f5f7;
border: 1rpx solid #e5e7eb;
border-radius: 12rpx;
display: flex;
align-items: center;
}
.keyword-input {
width: 100%;
font-size: 24rpx;
color: #374151;
}
.status-box {
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: space-between;
height: 66rpx;
padding: 0 28rpx;
min-width: 160rpx;
background: #fff;
border: 1rpx solid #e5e7eb;
border-radius: 12rpx;
}
.status-box-text {
font-size: 24rpx;
color: #374151;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.reset-filter-btn {
height: 66rpx;
line-height: 66rpx;
padding: 0 28rpx;
font-size: 24rpx;
color: #4b5563;
background: #fff;
border: 1rpx solid #e5e7eb;
border-radius: 12rpx;
flex-shrink: 0;
}
/* ====== 列表 ====== */
.list-scroll {
height: calc(100vh - 194rpx);
}
.list-wrap {
padding: 0 24rpx 60rpx;
}
.task-card {
position: relative;
margin-top: 20rpx;
padding: 28rpx;
background: #fff;
border-radius: 22rpx;
box-shadow: 0 8rpx 28rpx rgba(15, 23, 42, 0.06);
}
.card-header {
margin-bottom: 18rpx;
}
.header-main {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16rpx;
}
.header-left {
min-width: 0;
flex: 1;
}
.task-no {
font-size: 32rpx;
font-weight: 700;
color: #0f172a;
}
.header-tags {
display: flex;
align-items: center;
gap: 12rpx;
flex-shrink: 0;
}
.record-tag {
padding: 8rpx 18rpx;
border-radius: 999rpx;
font-size: 22rpx;
line-height: 1;
background: #e2e8f0;
color: #64748b;
}
.card-body .row {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 20rpx;
margin-top: 12rpx;
&:first-child {
margin-top: 0;
}
}
.label {
width: 140rpx;
font-size: 25rpx;
color: #94a3b8;
flex-shrink: 0;
}
.value {
flex: 1;
text-align: right;
font-size: 27rpx;
color: #334155;
line-height: 1.5;
&.highlight {
color: #1f4b79;
font-weight: 600;
}
}
/* ====== 操作按钮 ====== */
.card-actions {
display: flex;
gap: 16rpx;
margin-top: 20rpx;
padding-top: 20rpx;
border-top: 1rpx solid #f0f0f0;
}
.action-btn {
flex: 1;
height: 64rpx;
line-height: 64rpx;
text-align: center;
border-radius: 10rpx;
font-size: 26rpx;
font-weight: 500;
&.approve-btn {
background: #dcfce7;
color: #16a34a;
}
&.reject-btn {
background: #fee2e2;
color: #dc2626;
}
&:active {
opacity: 0.8;
}
}
/* ====== 状态标签颜色 ====== */
.text-success {
color: #16a34a;
}
.text-danger {
color: #dc2626;
}
.text-warning {
color: #d97706;
}
.text-primary {
color: #2563eb;
}
.record-tag.text-success {
color: #15803d;
background: #dcfce7;
}
.record-tag.text-danger {
color: #dc2626;
background: #fee2e2;
}
.record-tag.text-warning {
color: #d97706;
background: #fef3c7;
}
.record-tag.text-primary {
color: #1d4ed8;
background: #dbeafe;
}
/* ====== 提示 ====== */
.hint {
padding: 36rpx 0;
text-align: center;
color: #94a3b8;
font-size: 26rpx;
}
/* ====== 回顶部 ====== */
.go-top-btn {
position: fixed;
right: 28rpx;
bottom: calc(140rpx + env(safe-area-inset-bottom));
width: 92rpx;
height: 92rpx;
border-radius: 46rpx;
background: rgba(255, 255, 255, 0.96);
box-shadow: 0 8rpx 24rpx rgba(15, 23, 42, 0.12);
display: flex;
align-items: center;
justify-content: center;
}
/* ====== 新增按钮 ====== */
.add-btn {
position: fixed;
right: 28rpx;
bottom: calc(56rpx + env(safe-area-inset-bottom));
width: 92rpx;
height: 92rpx;
border-radius: 46rpx;
background: #1f4b79;
box-shadow: 0 14rpx 30rpx rgba(24, 63, 108, 0.24);
display: flex;
align-items: center;
justify-content: center;
}
.add-icon {
color: #ffffff;
font-size: 64rpx;
line-height: 1;
margin-top: -4rpx;
.page-container { min-height: 100vh; background: #f4f5f7; }
.filter-bar { display: flex; align-items: center; gap: 12rpx; padding: 18rpx 24rpx; background: #fff; }
.keyword-box { flex: 1; min-width: 0; height: 66rpx; padding: 0 28rpx; background: #f4f5f7; border: 1rpx solid #e5e7eb; border-radius: 12rpx; display: flex; align-items: center; }
.keyword-input { width: 100%; font-size: 24rpx; color: #374151; }
.status-box { flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; height: 66rpx; padding: 0 28rpx; min-width: 160rpx; background: #fff; border: 1rpx solid #e5e7eb; border-radius: 12rpx; }
.status-box-text { font-size: 24rpx; color: #374151; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.reset-filter-btn { height: 66rpx; line-height: 66rpx; padding: 0 28rpx; font-size: 24rpx; color: #4b5563; background: #fff; border: 1rpx solid #e5e7eb; border-radius: 12rpx; flex-shrink: 0; }
.list-scroll { height: calc(100vh - 194rpx); }
.list-wrap { padding: 0 24rpx 60rpx; }
.task-card { position: relative; margin-top: 20rpx; padding: 28rpx; background: #fff; border-radius: 22rpx; box-shadow: 0 8rpx 28rpx rgba(15,23,42,0.06); }
.card-header { margin-bottom: 18rpx; }
.header-main { display: flex; align-items: center; justify-content: space-between; gap: 16rpx; }
.header-left { min-width: 0; flex: 1; }
.task-no { font-size: 32rpx; font-weight: 700; color: #0f172a; }
.header-tags { display: flex; align-items: center; gap: 12rpx; flex-shrink: 0; }
.record-tag { padding: 8rpx 18rpx; border-radius: 999rpx; font-size: 22rpx; line-height: 1; background: #e2e8f0; color: #64748b; }
.card-body .row { display: flex; justify-content: space-between; align-items: flex-start; gap: 20rpx; margin-top: 12rpx; &:first-child { margin-top: 0; } }
.label { width: 140rpx; font-size: 25rpx; color: #94a3b8; flex-shrink: 0; }
.value { flex: 1; text-align: right; font-size: 27rpx; color: #334155; line-height: 1.5; &.highlight { color: #1f4b79; font-weight: 600; } }
.card-actions { display: flex; gap: 16rpx; margin-top: 20rpx; padding-top: 20rpx; border-top: 1rpx solid #f0f0f0; }
.action-btn { flex: 1; height: 64rpx; line-height: 64rpx; text-align: center; border-radius: 10rpx; font-size: 26rpx; font-weight: 500;
&.approve-btn { background: #dcfce7; color: #16a34a; }
&.reject-btn { background: #fee2e2; color: #dc2626; }
&.submit-btn { background: #dbeafe; color: #1d4ed8; }
&:active { opacity: 0.8; }
}
.text-success { color: #16a34a; } .text-danger { color: #dc2626; } .text-warning { color: #d97706; } .text-primary { color: #2563eb; }
.record-tag.text-success { color: #15803d; background: #dcfce7; }
.record-tag.text-danger { color: #dc2626; background: #fee2e2; }
.record-tag.text-warning { color: #d97706; background: #fef3c7; }
.record-tag.text-primary { color: #1d4ed8; background: #dbeafe; }
.hint { padding: 36rpx 0; text-align: center; color: #94a3b8; font-size: 26rpx; }
.go-top-btn { position: fixed; right: 28rpx; bottom: calc(140rpx + env(safe-area-inset-bottom)); width: 92rpx; height: 92rpx; border-radius: 46rpx; background: rgba(255,255,255,0.96); box-shadow: 0 8rpx 24rpx rgba(15,23,42,0.12); display: flex; align-items: center; justify-content: center; }
.add-btn { position: fixed; right: 28rpx; bottom: calc(56rpx + env(safe-area-inset-bottom)); width: 92rpx; height: 92rpx; border-radius: 46rpx; background: #1f4b79; box-shadow: 0 14rpx 30rpx rgba(24,63,108,0.24); display: flex; align-items: center; justify-content: center; }
.add-icon { color: #fff; font-size: 64rpx; line-height: 1; margin-top: -4rpx; }
/* 提交审核弹框 */
.modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.45); z-index: 999; display: flex; align-items: center; justify-content: center; }
.modal-card { width: 640rpx; background: #fff; border-radius: 20rpx; box-shadow: 0 16rpx 48rpx rgba(0,0,0,0.15); }
.modal-header { display: flex; align-items: center; justify-content: space-between; padding: 32rpx 32rpx 20rpx; border-bottom: 1rpx solid #f0f0f0; }
.modal-title { font-size: 32rpx; font-weight: 700; color: #1a1a1a; }
.modal-close { font-size: 32rpx; color: #999; padding: 8rpx; }
.modal-body { padding: 28rpx 32rpx; }
.modal-field { margin-bottom: 28rpx; &:last-child { margin-bottom: 0; } }
.modal-label { font-size: 28rpx; color: #374151; font-weight: 500; margin-bottom: 14rpx; display: block; }
.modal-label .required { color: #ef4444; }
.modal-dropdown { position: relative; display: flex; align-items: center; justify-content: space-between; height: 80rpx; padding: 0 24rpx; background: #f8fafc; border: 1rpx solid #e0e0e0; border-radius: 12rpx; font-size: 28rpx; color: #374151;
.placeholder { color: #bbb; }
.dropdown-arrow { font-size: 20rpx; color: #999; }
}
.modal-textarea { width: 100%; min-height: 140rpx; padding: 20rpx; background: #f8fafc; border: 1rpx solid #e0e0e0; border-radius: 12rpx; font-size: 27rpx; color: #374151; box-sizing: border-box; }
.textarea-placeholder { color: #bbb; }
.dropdown-panel { position: absolute; top: 100%; left: 0; right: 0; z-index: 200; margin-top: 4rpx; background: #fff; border: 1rpx solid #e0e0e0; border-radius: 12rpx; box-shadow: 0 8rpx 30rpx rgba(0,0,0,0.1); overflow: hidden; }
.dropdown-scroll { height: 300rpx; }
.dropdown-item { display: flex; align-items: center; justify-content: space-between; padding: 20rpx 24rpx; border-bottom: 1rpx solid #f0f0f0; &:last-child { border-bottom: 0; } &.active { background: #f0f5ff; } }
.dropdown-item-text { font-size: 27rpx; color: #333; }
.dropdown-check { font-size: 28rpx; color: #2563eb; font-weight: 700; }
.modal-footer { display: flex; gap: 18rpx; padding: 24rpx 32rpx; border-top: 1rpx solid #f0f0f0; }
.modal-btn { flex: 1; height: 80rpx; line-height: 80rpx; text-align: center; border-radius: 14rpx; font-size: 30rpx; font-weight: 600; &:active { opacity: 0.85; }
&.cancel-btn { background: #f0f0f0; color: #6b7280; }
&.confirm-btn { background: #1f4b79; color: #fff; }
}
</style>

@ -0,0 +1,590 @@
<template>
<view class="page-container">
<NavBar :title="'确认备件出库'" />
<view class="sparepart-section">
<view class="section-title-bar">
<view class="section-bar-line"></view>
<text class="section-title">已选备件</text>
</view>
<view class="sparepart-card">
<view class="card-top">
<view class="card-image-wrap">
<image v-if="sparepartImage" :src="sparepartImage" class="card-image" mode="aspectFill" />
<view v-else class="card-image-empty"><text class="empty-img-icon">📦</text></view>
</view>
<view class="card-info-right">
<view class="info-item"><text class="info-label">备件名称</text><text class="info-name">{{ textValue(sparepart.name) }}</text></view>
<view class="info-item"><text class="info-label">规格</text><text class="info-value">{{ textValue(sparepart.standard || sparepart.deviceSpec) }}</text></view>
<view class="info-item"><text class="info-label">当前库存</text><text class="info-value stock-highlight">{{ sparepart.count != null ? sparepart.count : 0 }}{{ textUnit(sparepart.unitName || sparepart.minStockUnitName || '个') }}</text></view>
</view>
</view>
<view class="card-bottom">
<view class="detail-row two-col">
<view class="detail-col"><text class="detail-label">采购单位</text><text class="detail-value">{{ textValue(sparepart.purchaseUnitName) }}</text></view>
<view class="detail-col"><text class="detail-label">库存单位</text><text class="detail-value">{{ textValue(sparepart.unitName || sparepart.minStockUnitName || '个') }}</text></view>
</view>
<view class="detail-row"><text class="detail-label">换算关系</text><text class="detail-value">1{{ textValue(sparepart.purchaseUnitName) }}={{ textValue(sparepart.purchaseUnitConvertQuantity) }}{{ stockUnitLabel(sparepart) }}</text></view>
</view>
</view>
<!-- 出库用途 -->
<view class="section-title-bar" style="padding-top: 24rpx;">
<view class="section-bar-line"></view>
<text class="section-title">出库用途</text>
</view>
<view class="purpose-card">
<view class="purpose-item" :class="{ active: selectedPurpose === 'repair' }" @click="setPurpose('repair')">
<text class="iconfont icon-repair purpose-icon"></text>
<text class="purpose-text">维修领用</text>
</view>
<view class="purpose-item" :class="{ active: selectedPurpose === 'maintain' }" @click="setPurpose('maintain')">
<text class="iconfont icon-shield purpose-icon"></text>
<text class="purpose-text">保养领用</text>
</view>
<view class="purpose-item" :class="{ active: selectedPurpose === 'other' }" @click="setPurpose('other')">
<text class="iconfont icon-box purpose-icon"></text>
<text class="purpose-text">其他出库</text>
</view>
</view>
<!-- 关联信息 -->
<view v-if="selectedPurpose === 'repair' || selectedPurpose === 'maintain'" class="section-title-bar" style="padding-top: 24rpx;">
<view class="section-bar-line"></view><text class="section-title">关联信息</text>
</view>
<view v-if="selectedPurpose === 'repair' || selectedPurpose === 'maintain'" class="select-row-card warehouse-area-card">
<view class="warehouse-area-rows">
<view class="warehouse-area-row">
<text class="warehouse-area-label">关联设备</text>
<view class="warehouse-area-dropdown" @click="toggleDeviceDropdown">
<view class="dropdown-input">
<text :class="['dropdown-value', { placeholder: !selectedDevice }]">{{ selectedDevice ? selectedDevice.label : '请选择' }}</text>
<text class="dropdown-arrow"></text>
</view>
<view v-if="showDeviceDropdown" class="dropdown-panel">
<scroll-view scroll-y class="dropdown-scroll">
<view v-for="item in filteredDeviceOptions" :key="item.value" class="dropdown-item" :class="{ active: selectedDevice?.value === item.value }" @click.stop="handleSelectDevice(item)">
<text class="dropdown-item-text">{{ item.label }}</text>
<text v-if="selectedDevice?.value === item.value" class="dropdown-check"></text>
</view>
<view v-if="deviceLoading" class="dropdown-empty">...</view>
<view v-else-if="!filteredDeviceOptions.length" class="dropdown-empty">{{ selectedPurpose === 'maintain' ? '暂无保养设备' : '暂无设备数据' }}</view>
</scroll-view>
</view>
</view>
</view>
<view class="warehouse-area-row">
<text class="warehouse-area-label">{{ selectedPurpose === 'repair' ? '维修单号' : '保养单号' }}</text>
<view class="warehouse-area-dropdown" @click="toggleOrderDropdown">
<view class="dropdown-input">
<text :class="['dropdown-value', { placeholder: !currentOrder }]">{{ currentOrder ? currentOrder.label : '请选择' }}</text>
<text class="dropdown-arrow"></text>
</view>
<view v-if="showOrderDropdown" class="dropdown-panel">
<scroll-view scroll-y class="dropdown-scroll">
<view v-for="item in currentOrderOptions" :key="item.value" class="dropdown-item" :class="{ active: currentOrder?.value === item.value }" @click.stop="handleSelectOrder(item)">
<text class="dropdown-item-text">{{ item.label }}</text>
<text v-if="currentOrder?.value === item.value" class="dropdown-check"></text>
</view>
<view v-if="!currentOrderOptions.length" class="dropdown-empty">{{ selectedPurpose === 'repair' ? '' : '' }}</view>
</scroll-view>
</view>
</view>
</view>
</view>
</view>
<!-- 出库数量 -->
<view class="section-title-bar" style="padding-top: 24rpx;">
<view class="section-bar-line"></view><text class="section-title">出库数量</text>
</view>
<view class="qty-input-card">
<view class="form-field">
<text class="form-label">出库数量</text>
<input v-model="outboundQty" class="form-input" placeholder="请输入" confirm-type="done" />
<text class="form-suffix-text">单位{{ textValue(sparepart.purchaseUnitName) }}</text>
</view>
<view class="convert-row">
<text class="convert-label-inline">出库后剩余库存</text>
<text :class="['convert-value-inline', { 'text-danger': stockExceeded }]">{{ remainingStock }}</text>
<text class="convert-unit-inline">{{ stockUnitLabel(sparepart) }}</text>
</view>
<view class="convert-helper">{{ currentStockText }}</view>
<view class="convert-formula-inline">{{ outboundQty || 0 }}{{ textValue(sparepart.purchaseUnitName) }} × {{ textValue(sparepart.purchaseUnitConvertQuantity) }}{{ stockUnitLabel(sparepart) }} = {{ calculatedStock }}{{ stockUnitLabel(sparepart) }}</view>
<!-- 库存不足提示 -->
<view v-if="stockExceeded" class="stock-warning">
<text class="warning-icon"></text>
<view class="warning-text">
<text class="warning-line">当前库存不足不能出库</text>
<text class="warning-line">当前库存{{ stockCount }}{{ stockUnitLabel(sparepart) }}{{ stockPackText }}</text>
<text class="warning-line">本次出库{{ calculatedStock }}{{ stockUnitLabel(sparepart) }}{{ outboundPackText }}</text>
</view>
</view>
</view>
<!-- 供应商 -->
<view class="section-title-bar" style="padding-top: 24rpx;">
<view class="section-bar-line"></view><text class="section-title">供应商</text>
</view>
<view class="select-row-card">
<view class="full-dropdown">
<text :class="{ placeholder: !defaultSupplierName }">{{ defaultSupplierName || '未配置默认供应商' }}</text>
</view>
</view>
<!-- 仓库/库区 -->
<view class="section-title-bar" style="padding-top: 24rpx;">
<view class="section-bar-line"></view><text class="section-title">仓库/库区</text>
</view>
<view class="select-row-card warehouse-area-card">
<view class="warehouse-area-rows">
<view class="warehouse-area-row">
<text class="warehouse-area-label">仓库</text>
<view class="warehouse-area-dropdown" @click="toggleWarehouseDropdown">
<view class="dropdown-input">
<text :class="['dropdown-value', { placeholder: !selectedWarehouse }]">{{ selectedWarehouse ? selectedWarehouse.label : '请选择' }}</text>
<text class="dropdown-arrow"></text>
</view>
<view v-if="showWarehouseDropdown" class="dropdown-panel">
<scroll-view scroll-y class="dropdown-scroll">
<view v-for="item in warehouseOptions" :key="item.value" class="dropdown-item" :class="{ active: selectedWarehouse?.value === item.value }" @click.stop="handleSelectWarehouse(item)">
<text class="dropdown-item-text">{{ item.label }}</text>
<text v-if="selectedWarehouse?.value === item.value" class="dropdown-check"></text>
</view>
</scroll-view>
</view>
</view>
</view>
<view class="warehouse-area-row">
<text class="warehouse-area-label">库区</text>
<view class="warehouse-area-dropdown" @click="toggleAreaDropdown">
<view class="dropdown-input">
<text :class="['dropdown-value', { placeholder: !selectedArea }]">{{ selectedArea ? selectedArea.label : (loadingAreas ? '加载中...' : '请选择') }}</text>
<text class="dropdown-arrow"></text>
</view>
<view v-if="showAreaDropdown" class="dropdown-panel">
<scroll-view scroll-y class="dropdown-scroll">
<view v-for="item in areaOptions" :key="item.value" class="dropdown-item" :class="{ active: selectedArea?.value === item.value }" @click.stop="handleSelectArea(item)">
<text class="dropdown-item-text">{{ item.label }}</text>
<text v-if="selectedArea?.value === item.value" class="dropdown-check"></text>
</view>
</scroll-view>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="bottom-actions">
<view class="bottom-btn cancel-btn" @click="handleCancel"></view>
<view class="bottom-btn confirm-btn" @click="handleConfirm"></view>
</view>
</view>
</template>
<script setup>
import { ref, computed } from 'vue'
import { onShow, onHide } from '@dcloudio/uni-app'
import NavBar from '@/components/common/NavBar.vue'
import { getDeviceLedgerList } from '@/api/mes/moldoperate'
import { getWarehouseSimpleList, getWarehouseAreaSimpleList } from '@/api/mes/moldget'
import { getEquipmentRepairListByDeviceId, getMaintenanceTicketPage } from '@/api/mes/equipment'
import { getDvRepairPage } from '@/api/mes/dvrepair'
import { getSparepartDetail, getSparepartStockCount } from '@/api/mes/sparepart'
const sparepart = ref({})
const outboundQty = ref(null)
const selectedPurpose = ref('repair')
function setPurpose(value) {
selectedPurpose.value = value
selectedDevice.value = null
selectedRepairOrder.value = null
selectedMaintainOrder.value = null
repairOrderOptions.value = []
maintainOrderOptions.value = []
}
const deviceOptions = ref([])
const selectedDevice = ref(null)
const showDeviceDropdown = ref(false)
const repairOrderOptions = ref([])
const selectedRepairOrder = ref(null)
const maintainOrderOptions = ref([])
const selectedMaintainOrder = ref(null)
const maintainDeviceIds = ref(new Set())
const deviceLoading = ref(false)
const filteredDeviceOptions = computed(() => {
if (selectedPurpose.value === 'maintain') return deviceOptions.value.filter(d => maintainDeviceIds.value.has(d.value))
return deviceOptions.value
})
const showOrderDropdown = ref(false)
const currentOrder = computed(() => selectedPurpose.value === 'repair' ? selectedRepairOrder.value : selectedMaintainOrder.value)
const currentOrderOptions = computed(() => selectedPurpose.value === 'repair' ? repairOrderOptions.value : maintainOrderOptions.value)
// /
const warehouseOptions = ref([])
const selectedWarehouse = ref(null)
const showWarehouseDropdown = ref(false)
const areaOptions = ref([])
const selectedArea = ref(null)
const showAreaDropdown = ref(false)
const loadingAreas = ref(false)
const sparepartImage = computed(() => {
const images = sparepart.value.images
if (!images) return ''
if (Array.isArray(images)) return String(images[0] || '')
return String(images).split(',')[0]?.trim() || ''
})
const stockCount = computed(() => sparepart.value.count ?? 0)
const calculatedStock = computed(() => {
const qty = Number(outboundQty.value) || 0
const ratio = Number(sparepart.value.purchaseUnitConvertQuantity) || 1
return qty * ratio
})
const remainingStock = computed(() => {
return Math.max(stockCount.value - calculatedStock.value, 0)
})
const stockExceeded = computed(() => {
return outboundQty.value > 0 && calculatedStock.value > stockCount.value
})
// XY
function formatStockPack(count) {
const ratio = Number(sparepart.value.purchaseUnitConvertQuantity) || 1
if (ratio === 1) return ''
const packs = Math.floor(count / ratio)
const remain = count % ratio
const parts = []
if (packs > 0) parts.push(`${packs}${textValue(sparepart.value.purchaseUnitName)}`)
if (remain > 0) parts.push(`${remain}${stockUnitLabel(sparepart)}`)
return parts.join('') || ''
}
const currentStockText = computed(() => {
const text = formatStockPack(stockCount.value)
return text ? `当前库存:${text}` : ''
})
const stockPackText = computed(() => {
return formatStockPack(stockCount.value) || `${stockCount.value}${stockUnitLabel(sparepart)}`
})
const outboundPackText = computed(() => {
return formatStockPack(calculatedStock.value) || `${calculatedStock.value}${stockUnitLabel(sparepart)}`
})
const defaultSupplierName = computed(() => {
const suppliers = sparepart.value.suppliers
if (!suppliers || !suppliers.length) return ''
const defaultId = sparepart.value.defaultSupplierId
if (defaultId) {
const found = suppliers.find(s => s.supplierId === defaultId || s.id === defaultId)
if (found) return found.supplierName || ''
}
const firstDefault = suppliers.find(s => s.defaultStatus === 1)
return firstDefault?.supplierName || ''
})
function textValue(v) { if (v === 0) return '0'; if (v == null) return '-'; const s = String(v).trim(); return s || '-' }
function textUnit(v) { if (v === 0) return '0'; if (v == null) return ''; return String(v).trim() }
function stockUnitLabel(item) { return item.unitName || item.minStockUnitName || '个' }
function handleCancel() { uni.navigateBack() }
// repair1, maintain2, other3
const PURPOSE_MAP = { repair: 1, maintain: 2, other: 3 }
function handleConfirm() {
if (!outboundQty.value || Number(outboundQty.value) <= 0) {
uni.showToast({ title: '请输入出库数量', icon: 'none' }); return
}
if (stockExceeded.value) {
uni.showModal({
title: '库存不足',
content: `当前库存:${stockCount.value}${stockUnitLabel(sparepart)}${stockPackText.value}\n本次出库${calculatedStock.value}${stockUnitLabel(sparepart)}${outboundPackText.value}`,
showCancel: false,
confirmText: '知道了'
})
return
}
if (selectedPurpose.value === 'repair' && !selectedDevice.value) {
uni.showToast({ title: '请选择关联设备', icon: 'none' }); return
}
if (selectedPurpose.value === 'maintain' && !selectedDevice.value) {
uni.showToast({ title: '请选择关联设备', icon: 'none' }); return
}
if (!selectedWarehouse.value) {
uni.showToast({ title: '请选择仓库', icon: 'none' }); return
}
const item = {
productId: sparepart.value.id,
productName: sparepart.value.name || '',
productBarCode: sparepart.value.barCode || '',
productUnitName: sparepart.value.unitName || sparepart.value.minStockUnitName || '',
purchaseUnitName: sparepart.value.purchaseUnitName || '',
purchaseUnitConvertQuantity: Number(sparepart.value.purchaseUnitConvertQuantity) || 1,
inputCount: Number(outboundQty.value),
count: Number(outboundQty.value) * (Number(sparepart.value.purchaseUnitConvertQuantity) || 1),
supplierId: sparepart.value.defaultSupplierId,
supplierName: defaultSupplierName.value,
purpose: selectedPurpose.value,
outUsageType: PURPOSE_MAP[selectedPurpose.value] || 3,
warehouseId: selectedWarehouse.value?.value,
warehouseName: selectedWarehouse.value?.label || '',
areaId: selectedArea.value?.value,
areaName: selectedArea.value?.label || '',
_sparepart: { ...sparepart.value }
}
if (selectedDevice.value) {
item.repairDeviceId = selectedDevice.value.value
item.deviceName = selectedDevice.value.deviceName || selectedDevice.value.label || ''
}
if (selectedPurpose.value === 'repair' && selectedRepairOrder.value) {
item.repairId = selectedRepairOrder.value.value
} else if (selectedPurpose.value === 'maintain' && selectedMaintainOrder.value) {
item.maintenanceId = selectedMaintainOrder.value.value
}
if (!getApp().globalData._sparepartOutboundItems) {
getApp().globalData._sparepartOutboundItems = []
}
getApp().globalData._sparepartOutboundItems.push(item)
uni.showToast({ title: '已添加: ' + (sparepart.value.name || ''), icon: 'success', duration: 1200 })
setTimeout(() => {
const fromScan = getApp().globalData._sparepartFromScan
getApp().globalData._sparepartFromScan = false
uni.navigateBack({ delta: fromScan ? 1 : 2 })
}, 800)
}
// Device dropdown
function toggleDeviceDropdown() {
showDeviceDropdown.value = !showDeviceDropdown.value
if (showDeviceDropdown.value && selectedPurpose.value === 'maintain' && maintainDeviceIds.value.size === 0) {
loadMaintainDeviceIds()
}
}
async function loadMaintainDeviceIds() {
deviceLoading.value = true
try {
const res = await getMaintenanceTicketPage({})
const data = res && res.data !== undefined ? res.data : res
const records = Array.isArray(data) ? data : (data?.list || data?.records || [])
const deviceNames = new Set(records.map(r => r.deviceName).filter(Boolean))
const ids = new Set()
for (const d of deviceOptions.value) {
if (deviceNames.has(d.label) || deviceNames.has(d.deviceName)) ids.add(d.value)
}
maintainDeviceIds.value = ids
} catch (e) { console.error('loadMaintainDeviceIds error', e) }
finally { deviceLoading.value = false }
}
async function handleSelectDevice(item) {
selectedDevice.value = item; showDeviceDropdown.value = false
selectedRepairOrder.value = null; selectedMaintainOrder.value = null
repairOrderOptions.value = []; maintainOrderOptions.value = []
if (selectedPurpose.value === 'repair') loadRepairOrders(item.deviceCode)
else loadMaintainOrders(item.deviceCode)
}
async function loadDevices() {
try {
const res = await getDeviceLedgerList({ pageNo: 1, pageSize: 100 })
const data = res && res.data !== undefined ? res.data : res
let list = []
if (Array.isArray(data)) list = data
else if (data && Array.isArray(data.data)) list = data.data
else if (data?.data?.list) list = data.data.list
else if (data?.data?.rows) list = data.data.rows
else if (data?.data?.records) list = data.data.records
else if (data?.list) list = data.list
else if (data?.rows) list = data.rows
deviceOptions.value = list.map((d) => ({
value: d.id, label: d.name || d.deviceName || d.deviceCode || String(d.id || ''),
deviceCode: d.deviceCode || d.code || '', deviceName: d.name || d.deviceName || ''
}))
} catch (e) { console.error('loadDevices error', e) }
}
function toggleOrderDropdown() { if (!selectedDevice.value) return; showOrderDropdown.value = !showOrderDropdown.value }
function handleSelectOrder(item) {
if (selectedPurpose.value === 'repair') selectedRepairOrder.value = item
else selectedMaintainOrder.value = item
showOrderDropdown.value = false
}
async function loadMaintainOrders(deviceCode) {
const deviceId = selectedDevice.value?.value
if (deviceId) await loadMaintainOrdersById(deviceId)
}
async function loadMaintainOrdersById(deviceId) {
if (!deviceId) return
try {
const deviceName = selectedDevice.value?.deviceName || selectedDevice.value?.label || ''
const res = await getMaintenanceTicketPage({ deviceName })
const data = res && res.data !== undefined ? res.data : res
const list = Array.isArray(data) ? data : (data?.list || data?.records || [])
maintainOrderOptions.value = list.map((m) => ({ value: m.id, label: m.planNo || String(m.id || ''), deviceId: m.deviceId }))
} catch (e) { console.error('loadMaintainOrdersById error', e) }
}
async function loadRepairOrders(deviceCode) {
if (!deviceCode) { const deviceId = selectedDevice.value?.value; if (deviceId) await loadRepairOrdersById(deviceId); return }
try {
const res = await getDvRepairPage({ machineryCode: deviceCode, pageNo: 1, pageSize: 100 })
const root = res && res.data !== undefined ? res.data : res
let list = []
if (Array.isArray(root)) list = root
else if (root && Array.isArray(root.data)) list = root.data
else if (root?.data?.list) list = root.data.list
else if (root?.data?.rows) list = root.data.rows
else if (root?.list) list = root.list
repairOrderOptions.value = list.map((r) => ({ value: r.id, label: r.repairCode || r.repairName || r.subjectName || String(r.id || '') }))
} catch (e) { console.error('loadRepairOrders error', e) }
}
async function loadRepairOrdersById(deviceId) {
if (!deviceId) return
try {
const res = await getEquipmentRepairListByDeviceId(deviceId)
const data = res && res.data !== undefined ? res.data : res
let list = []
if (Array.isArray(data)) list = data
else if (data && Array.isArray(data.data)) list = data.data
else if (data?.data?.list) list = data.data.list
else if (data?.list) list = data.list
repairOrderOptions.value = list.map((r) => ({ value: r.id, label: r.repairName || String(r.id || '') }))
} catch (e) { console.error('loadRepairOrdersById error', e) }
}
//
function toggleWarehouseDropdown() { showWarehouseDropdown.value = !showWarehouseDropdown.value }
function handleSelectWarehouse(item) { selectedWarehouse.value = item; showWarehouseDropdown.value = false; selectedArea.value = null; areaOptions.value = []; loadAreas(item.value) }
async function loadWarehouses() {
try {
const res = await getWarehouseSimpleList()
const data = Array.isArray(res) ? res : (Array.isArray(res?.data) ? res.data : [])
warehouseOptions.value = data.map(w => ({ value: w.id, label: w.name || String(w.id || '') }))
// ""
const defaultWh = warehouseOptions.value.find(w => (w.label || '').includes('备件仓'))
if (defaultWh) { selectedWarehouse.value = defaultWh; loadAreas(defaultWh.value) }
} catch (e) {}
}
//
function toggleAreaDropdown() { if (!selectedWarehouse.value) { uni.showToast({ title: '请先选择仓库', icon: 'none' }); return }; showAreaDropdown.value = !showAreaDropdown.value }
function handleSelectArea(item) { selectedArea.value = item; showAreaDropdown.value = false }
async function loadAreas(warehouseId) {
if (!warehouseId) return
loadingAreas.value = true
areaOptions.value = []
try {
const res = await getWarehouseAreaSimpleList(warehouseId)
const data = Array.isArray(res) ? res : (Array.isArray(res?.data) ? res.data : [])
areaOptions.value = data.map(a => ({ value: a.id, label: a.name || a.areaName || String(a.id || '') }))
// ""
const defaultArea = areaOptions.value.find(a => (a.label || '').includes('备件库'))
if (defaultArea) selectedArea.value = defaultArea
} catch (e) {} finally { loadingAreas.value = false }
}
onShow(async () => {
const selectResult = getApp().globalData?._sparepartBeforeConfirm
if (selectResult) {
sparepart.value = selectResult
outboundQty.value = null
getApp().globalData._sparepartBeforeConfirm = null
if (selectResult.id) {
try {
const res = await getSparepartDetail(selectResult.id)
const detail = res?.data || res
if (detail) { sparepart.value = { ...sparepart.value, ...detail }; loadStockCount() }
} catch (e) { console.error('获取备件详情失败:', e) }
}
}
loadDevices()
loadWarehouses()
})
async function loadStockCount() {
const id = sparepart.value.id
if (!id) return
try { const res = await getSparepartStockCount(id); sparepart.value.count = (res?.data ?? res) != null ? Number(res?.data ?? res) : 0 }
catch (e) { sparepart.value.count = 0 }
}
onHide(() => { showDeviceDropdown.value = false; showOrderDropdown.value = false })
</script>
<style lang="scss" scoped>
.page-container { min-height: 100vh; background: #f5f6f8; padding-bottom: calc(120rpx + env(safe-area-inset-bottom)); }
.sparepart-section { padding: 0; }
.section-title-bar { display: flex; align-items: center; gap: 10rpx; padding: 24rpx 24rpx 18rpx; }
.section-bar-line { width: 6rpx; height: 32rpx; border-radius: 3rpx; background: #2563eb; flex-shrink: 0; }
.section-title { font-size: 30rpx; font-weight: 700; color: #1a1a1a; }
.sparepart-card { background: #fff; border-radius: 16rpx; padding: 24rpx; margin: 0 24rpx 20rpx; box-shadow: 0 4rpx 16rpx rgba(15,23,42,0.04); }
.card-top { display: flex; position: relative; }
.card-image-wrap { width: 160rpx; height: 160rpx; border-radius: 12rpx; overflow: hidden; background: #f8fafc; border: 1rpx solid #f0f0f0; flex-shrink: 0; margin-right: 20rpx; }
.card-image { width: 100%; height: 100%; }
.card-image-empty { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: #f8fafc; }
.empty-img-icon { font-size: 56rpx; opacity: 0.3; }
.card-info-right { flex: 1; min-width: 0; }
.info-item { display: flex; align-items: center; margin-bottom: 8rpx; }
.info-label { font-size: 26rpx; color: #6b7280; flex-shrink: 0; }
.info-name { font-size: 30rpx; font-weight: 700; color: #0f172a; }
.info-value { font-size: 26rpx; color: #374151; &.stock-highlight { color: #2563eb; font-weight: 500; } }
.card-bottom { margin-top: 20rpx; padding-top: 20rpx; border-top: 1rpx solid #f0f0f0; }
.detail-row { display: flex; align-items: center; margin-bottom: 14rpx; &:last-child { margin-bottom: 0; } &.two-col { justify-content: space-between; } }
.detail-col { display: flex; align-items: center; flex: 1; }
.detail-label { font-size: 24rpx; color: #9ca3af; flex-shrink: 0; }
.detail-value { font-size: 24rpx; color: #4b5563; }
.purpose-card { display: flex; gap: 20rpx; margin: 0 24rpx 20rpx; }
.purpose-item { flex: 1; display: flex; align-items: center; justify-content: center; gap: 12rpx; height: 92rpx; background: #fff; border: 2rpx solid #e5e7eb; border-radius: 14rpx; font-size: 28rpx; color: #6b7280;
&.active { border-color: #2563eb; background: #eff6ff; color: #2563eb; font-weight: 600; }
}
.purpose-icon { font-size: 32rpx; }
.qty-input-card { background: #fff; border-radius: 16rpx; padding: 24rpx; margin: 0 24rpx; box-shadow: 0 4rpx 16rpx rgba(15,23,42,0.04); }
.form-field { display: flex; flex-direction: column; gap: 12rpx; }
.form-label { font-size: 26rpx; color: #4b5563; font-weight: 500; }
.form-input { width: 100%; height: 88rpx; padding: 0 24rpx; font-size: 28rpx; color: #374151; background: #f8fafc; border-radius: 14rpx; box-sizing: border-box; }
.form-suffix-text { display: block; margin-top: 10rpx; font-size: 24rpx; color: #9ca3af; }
.convert-row { margin-top: 20rpx; padding-top: 20rpx; border-top: 1rpx solid #f0f0f0; display: flex; align-items: center; }
.convert-label-inline { font-size: 26rpx; color: #6b7280; }
.convert-value-inline { font-size: 36rpx; font-weight: 700; color: #1f2937; margin-left: auto; }
.convert-unit-inline { font-size: 24rpx; color: #64748b; margin-left: 8rpx; }
.convert-formula-inline { margin-top: 10rpx; font-size: 22rpx; color: #9ca3af; }
.convert-helper { margin-top: 8rpx; font-size: 24rpx; color: #9ca3af; }
.text-danger { color: #dc2626 !important; }
.stock-warning { display: flex; gap: 12rpx; margin-top: 20rpx; padding: 20rpx; background: #fef2f2; border: 1rpx solid #fecaca; border-radius: 12rpx; }
.warning-icon { font-size: 32rpx; flex-shrink: 0; }
.warning-text { flex: 1; display: flex; flex-direction: column; gap: 6rpx; }
.warning-line { font-size: 24rpx; color: #991b1b; line-height: 1.6; display: block; }
.select-row-card { position: relative; display: flex; align-items: center; justify-content: space-between; background: #fff; border-radius: 16rpx; padding: 24rpx; margin: 0 24rpx 20rpx; box-shadow: 0 4rpx 16rpx rgba(15,23,42,0.04); }
.full-dropdown { display: flex; align-items: center; justify-content: space-between; width: 100%; font-size: 28rpx; color: #374151; .placeholder { color: #9ca3af; } }
.warehouse-area-card { align-items: flex-start; }
.warehouse-area-rows { width: 100%; display: flex; flex-direction: column; gap: 16rpx; }
.warehouse-area-row { display: flex; align-items: center; }
.warehouse-area-label { width: 120rpx; font-size: 26rpx; color: #6b7280; flex-shrink: 0; }
.warehouse-area-dropdown { flex: 1; min-width: 0; position: relative;
.dropdown-panel { position: absolute; top: 100%; left: 0; right: 0; z-index: 200; margin-top: 4rpx; background: #fff; border: 1rpx solid #e0e0e0; border-radius: 12rpx; box-shadow: 0 8rpx 30rpx rgba(0,0,0,0.15); overflow: hidden; }
}
.dropdown-input { display: flex; align-items: center; height: 64rpx; padding: 0 20rpx; border: 1rpx solid #e0e0e0; border-radius: 10rpx; background: #f9fafb; }
.dropdown-value { flex: 1; font-size: 27rpx; color: #333; &.placeholder { color: #bbb; } }
.dropdown-arrow { font-size: 20rpx; color: #999; flex-shrink: 0; }
.dropdown-panel { position: absolute; top: 68rpx; left: 0; right: 0; z-index: 200; background: #fff; border: 1rpx solid #e0e0e0; border-radius: 12rpx; box-shadow: 0 8rpx 30rpx rgba(0,0,0,0.1); overflow: hidden; }
.dropdown-scroll { height: 360rpx; }
.dropdown-item { display: flex; align-items: center; justify-content: space-between; padding: 20rpx 24rpx; border-bottom: 1rpx solid #f0f0f0; &:last-child { border-bottom: 0; } &.active { background: #f0f5ff; } }
.dropdown-item-text { font-size: 27rpx; color: #333; }
.dropdown-check { font-size: 28rpx; color: #2563eb; font-weight: 700; }
.dropdown-empty { padding: 32rpx; text-align: center; color: #999; font-size: 26rpx; }
.bottom-actions { position: fixed; left: 0; right: 0; bottom: 0; display: flex; gap: 18rpx; padding: 18rpx 24rpx calc(18rpx + env(safe-area-inset-bottom)); background: #fff; box-shadow: 0 -8rpx 24rpx rgba(15,23,42,0.06); z-index: 99; }
.bottom-btn { flex: 1; height: 84rpx; line-height: 84rpx; text-align: center; border-radius: 16rpx; font-size: 30rpx; font-weight: 600; &:active { opacity: 0.85; } }
.cancel-btn { background: #eef2f7; color: #475569; }
.confirm-btn { background: #1f4b79; color: #ffffff; }
</style>
Loading…
Cancel
Save