335 lines
12 KiB
Vue
335 lines
12 KiB
Vue
<template>
|
||
<view class="db-page">
|
||
<view class="db-header" :style="safeAreaStyle">
|
||
<view class="db-header__nav">
|
||
<view class="db-header__left">
|
||
<text class="db-header__back" @click="goBack">←</text>
|
||
<text class="db-header__title">{{ title }}</text>
|
||
</view>
|
||
<view /><!-- 胶囊占位 -->
|
||
</view>
|
||
</view>
|
||
|
||
<view class="db-form-section">
|
||
<view class="db-form-item">
|
||
<view class="db-form-label">车牌号 <text class="req">*</text></view>
|
||
<view v-if="isView" class="db-form-value">{{ form.vehicleNo || '--' }}</view>
|
||
<view v-else class="db-form-value" @click="showVehicle = true">
|
||
<text :class="{ ph: !form.vehicleNo }">{{ form.vehicleNo || '请选择车牌号' }}</text>
|
||
<text>›</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="db-form-item">
|
||
<view class="db-form-label">货物名称 <text class="req">*</text></view>
|
||
<view v-if="isView" class="db-form-value">{{ cargoDisplay || '--' }}</view>
|
||
<view v-else class="db-form-value" @click="showCargo = true">
|
||
<text :class="{ ph: !cargoDisplay }">{{ cargoDisplay || '请选择货物名称' }}</text>
|
||
<text>›</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="db-form-item">
|
||
<view class="db-form-label">业务类型 <text class="req">*</text></view>
|
||
<db-radio-group v-model="form.businessType" :disabled="isView" />
|
||
</view>
|
||
|
||
<view class="db-form-item">
|
||
<view class="db-form-label">供货单位 <text class="req">*</text></view>
|
||
<view v-if="isView" class="db-form-value">{{ form.supplier || '--' }}</view>
|
||
<view v-else class="db-form-value" @click="pickSupplier = true">
|
||
<text :class="{ ph: !form.supplier }">{{ form.supplier || '请选择供货单位' }}</text>
|
||
<text>›</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="db-form-item">
|
||
<view class="db-form-label">收货单位 <text class="req">*</text></view>
|
||
<view v-if="isView" class="db-form-value">{{ form.consignee || '--' }}</view>
|
||
<view v-else class="db-form-value" @click="pickConsignee = true">
|
||
<text :class="{ ph: !form.consignee }">{{ form.consignee || '请选择收货单位' }}</text>
|
||
<text>›</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="db-form-item">
|
||
<view class="db-form-label">毛重(kg)</view>
|
||
<view v-if="isView" class="db-form-value">{{ form.grossWeight ?? '--' }}</view>
|
||
<db-field
|
||
v-else
|
||
v-model="form.grossWeight"
|
||
type="digit"
|
||
placeholder="请输入毛重"
|
||
@change="onGross"
|
||
/>
|
||
</view>
|
||
|
||
<view class="db-form-item">
|
||
<view class="db-form-label">毛重时间</view>
|
||
<view v-if="isView" class="db-form-value">{{ form.grossWeightTime || '--' }}</view>
|
||
<view v-else class="db-form-value" @click="fillGrossTime">
|
||
<text :class="{ ph: !form.grossWeightTime }">{{ form.grossWeightTime || '点此填当前时间' }}</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="db-form-item">
|
||
<view class="db-form-label">皮重(kg)</view>
|
||
<view v-if="isView" class="db-form-value">{{ form.tareWeight ?? '--' }}</view>
|
||
<db-field
|
||
v-else
|
||
v-model="form.tareWeight"
|
||
type="digit"
|
||
placeholder="请输入皮重"
|
||
@change="onTare"
|
||
/>
|
||
</view>
|
||
|
||
<view class="db-form-item">
|
||
<view class="db-form-label">皮重时间</view>
|
||
<view v-if="isView" class="db-form-value">{{ form.tareWeightTime || '--' }}</view>
|
||
<view v-else class="db-form-value" @click="fillTareTime">
|
||
<text :class="{ ph: !form.tareWeightTime }">{{ form.tareWeightTime || '点此填当前时间' }}</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="db-form-item">
|
||
<view class="db-form-label">扣杂(kg)</view>
|
||
<view v-if="isView" class="db-form-value">{{ form.deduction || 0 }}</view>
|
||
<db-field
|
||
v-else
|
||
v-model="form.deduction"
|
||
type="digit"
|
||
placeholder="请输入扣杂"
|
||
@change="onDeduction"
|
||
/>
|
||
</view>
|
||
|
||
<view class="db-form-item">
|
||
<view class="db-form-label">净重(kg)</view>
|
||
<view class="db-form-value">
|
||
<text :style="{ color: netInvalid ? '#ee0a24' : '#111827' }">
|
||
{{ canShowNet ? netWeight : '--' }}
|
||
</text>
|
||
</view>
|
||
<view v-if="netInvalid" style="color: #ee0a24; font-size: 12px; margin-top: 4px">净重必须大于0</view>
|
||
</view>
|
||
|
||
<view class="db-form-item">
|
||
<view class="db-form-label">计划号</view>
|
||
<view v-if="isView" class="db-form-value">{{ form.planNo || '--' }}</view>
|
||
<db-field
|
||
v-else
|
||
v-model="form.planNo"
|
||
placeholder="请输入计划号"
|
||
|
||
/>
|
||
</view>
|
||
|
||
<view class="db-form-item">
|
||
<view class="db-form-label">备注</view>
|
||
<view v-if="isView" class="db-form-value">{{ form.remarks || '--' }}</view>
|
||
<db-field
|
||
v-else
|
||
v-model="form.remarks"
|
||
type="textarea"
|
||
autosize
|
||
placeholder="请输入备注"
|
||
|
||
/>
|
||
</view>
|
||
</view>
|
||
|
||
<view v-if="!isView" class="db-form-actions">
|
||
<db-btn block type="primary" :loading="saving" :disabled="netInvalid" @click="save">保存</db-btn>
|
||
<db-btn block plain style="margin-top:12px" @click="goBack">取消</db-btn>
|
||
</view>
|
||
|
||
<db-product-picker :show="showCargo" @update:show="(v) => (showCargo = v)" @select="onProduct" />
|
||
<db-customer-picker :show="pickSupplier" @update:show="(v) => (pickSupplier = v)" @select="onSupplier" />
|
||
<db-customer-picker :show="pickConsignee" @update:show="(v) => (pickConsignee = v)" @select="onConsignee" />
|
||
<db-vehicle-picker :show="showVehicle" @update:show="(v) => (showVehicle = v)" @select="onVehicle" />
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref, reactive, computed } from 'vue'
|
||
import { onLoad } from '@dcloudio/uni-app'
|
||
import { PAGE_PATHS } from '@/config/api'
|
||
import { getSafeAreaStyle } from '@/utils/safeArea'
|
||
import { weighingApi } from '@/pages/db/api/db'
|
||
import { nowYmdHms } from '@/pages/db/utils/dbDate'
|
||
import DbField from '@/components/db-ui/db-field.vue'
|
||
import DbBtn from '@/components/db-ui/db-btn.vue'
|
||
import DbRadioGroup from '@/components/db-ui/db-radio-group.vue'
|
||
import DbCustomerPicker from '@/components/db-customer-picker/db-customer-picker.vue'
|
||
import DbProductPicker from '@/components/db-product-picker/db-product-picker.vue'
|
||
import DbVehiclePicker from '@/components/db-vehicle-picker/db-vehicle-picker.vue'
|
||
|
||
const safeAreaStyle = getSafeAreaStyle()
|
||
const mode = ref('create')
|
||
const id = ref('')
|
||
const saving = ref(false)
|
||
const showVehicle = ref(false)
|
||
const showCargo = ref(false)
|
||
const pickSupplier = ref(false)
|
||
const pickConsignee = ref(false)
|
||
const cargoDisplay = ref('')
|
||
|
||
const form = reactive({
|
||
vehicleNo: '',
|
||
planNo: '',
|
||
productId: '',
|
||
businessType: '入库',
|
||
supplier: '',
|
||
consignee: '',
|
||
grossWeight: 0,
|
||
grossWeightTime: '',
|
||
tareWeight: 0,
|
||
tareWeightTime: '',
|
||
deduction: 0,
|
||
netWeight: 0,
|
||
purchasePlanId: undefined,
|
||
inboundOutboundId: undefined,
|
||
remarks: ''
|
||
})
|
||
|
||
const isView = computed(() => mode.value === 'view')
|
||
const isEdit = computed(() => mode.value === 'edit')
|
||
const title = computed(() => (isEdit.value ? '编辑地磅单' : isView.value ? '查看地磅单' : '新增地磅单'))
|
||
|
||
const netWeight = computed(() => {
|
||
const g = Number(form.grossWeight) || 0
|
||
const t = Number(form.tareWeight) || 0
|
||
const d = Number(form.deduction) || 0
|
||
return Math.max(0, g - t - d)
|
||
})
|
||
const canShowNet = computed(() => Number(form.grossWeight) > 0 && Number(form.tareWeight) > 0)
|
||
const netInvalid = computed(() => canShowNet.value && netWeight.value <= 0)
|
||
|
||
function calcNet() {
|
||
form.netWeight = netWeight.value
|
||
}
|
||
function onGross(v) {
|
||
form.grossWeight = Number(v) || 0
|
||
if (form.grossWeight && !form.grossWeightTime) form.grossWeightTime = nowYmdHms()
|
||
calcNet()
|
||
}
|
||
function onTare(v) {
|
||
form.tareWeight = Number(v) || 0
|
||
if (form.tareWeight && !form.tareWeightTime) form.tareWeightTime = nowYmdHms()
|
||
calcNet()
|
||
}
|
||
function onDeduction(v) {
|
||
form.deduction = Number(v) || 0
|
||
calcNet()
|
||
}
|
||
function fillGrossTime() {
|
||
form.grossWeightTime = nowYmdHms()
|
||
}
|
||
function fillTareTime() {
|
||
form.tareWeightTime = nowYmdHms()
|
||
}
|
||
|
||
function goBack() {
|
||
uni.navigateBack({ fail: () => uni.redirectTo({ url: PAGE_PATHS.dbWeighingList }) })
|
||
}
|
||
function onVehicle(plate) {
|
||
form.vehicleNo = plate
|
||
}
|
||
function onProduct(item) {
|
||
form.productId = item.id
|
||
cargoDisplay.value = item.productName
|
||
}
|
||
function onSupplier(item) {
|
||
form.supplier = item.customerName
|
||
}
|
||
function onConsignee(item) {
|
||
form.consignee = item.customerName
|
||
}
|
||
|
||
async function loadDetail() {
|
||
const data = await weighingApi.get(id.value)
|
||
Object.assign(form, {
|
||
vehicleNo: data.vehicleNo || '',
|
||
planNo: data.planNo || '',
|
||
productId: data.productId || '',
|
||
businessType: data.businessType || '入库',
|
||
supplier: data.supplier || '',
|
||
consignee: data.consignee || '',
|
||
grossWeight: data.grossWeight ?? 0,
|
||
grossWeightTime: data.grossWeightTime || '',
|
||
tareWeight: data.tareWeight ?? 0,
|
||
tareWeightTime: data.tareWeightTime || '',
|
||
deduction: data.deduction ?? 0,
|
||
netWeight: data.netWeight ?? 0,
|
||
purchasePlanId: data.purchasePlanId,
|
||
inboundOutboundId: data.inboundOutboundId,
|
||
remarks: data.remarks || ''
|
||
})
|
||
cargoDisplay.value = data.cargoName || ''
|
||
}
|
||
|
||
async function save() {
|
||
if (!form.vehicleNo || !form.productId || !form.supplier || !form.consignee) {
|
||
uni.showToast({ title: '请完善必填项', icon: 'none' })
|
||
return
|
||
}
|
||
if (netInvalid.value) {
|
||
uni.showToast({ title: '净重必须大于0', icon: 'none' })
|
||
return
|
||
}
|
||
calcNet()
|
||
saving.value = true
|
||
try {
|
||
const payload = {
|
||
vehicleNo: form.vehicleNo,
|
||
planNo: form.planNo || undefined,
|
||
productId: form.productId,
|
||
businessType: form.businessType,
|
||
supplier: form.supplier,
|
||
consignee: form.consignee,
|
||
grossWeight: Number(form.grossWeight) || 0,
|
||
grossWeightTime: form.grossWeightTime || nowYmdHms(),
|
||
tareWeight: Number(form.tareWeight) || 0,
|
||
tareWeightTime: form.tareWeightTime || (Number(form.tareWeight) ? nowYmdHms() : ''),
|
||
deduction: Number(form.deduction) || 0,
|
||
netWeight: form.netWeight,
|
||
purchasePlanId: form.purchasePlanId,
|
||
inboundOutboundId: form.inboundOutboundId,
|
||
remarks: form.remarks || undefined
|
||
}
|
||
if (id.value) await weighingApi.update(id.value, payload)
|
||
else await weighingApi.create(payload)
|
||
uni.showToast({ title: '保存成功', icon: 'success' })
|
||
setTimeout(goBack, 500)
|
||
} finally {
|
||
saving.value = false
|
||
}
|
||
}
|
||
|
||
onLoad(async (q) => {
|
||
mode.value = q.mode || (q.id ? 'edit' : 'create')
|
||
id.value = q.id || ''
|
||
if (q.vehicleNo) form.vehicleNo = decodeURIComponent(q.vehicleNo)
|
||
if (q.productId) form.productId = decodeURIComponent(q.productId)
|
||
if (q.cargoName) cargoDisplay.value = decodeURIComponent(q.cargoName)
|
||
if (q.businessType) form.businessType = decodeURIComponent(q.businessType)
|
||
if (q.supplier) form.supplier = decodeURIComponent(q.supplier)
|
||
if (q.consignee) form.consignee = decodeURIComponent(q.consignee)
|
||
if (q.planNo) form.planNo = decodeURIComponent(q.planNo)
|
||
if (q.inboundOutboundId) form.inboundOutboundId = decodeURIComponent(q.inboundOutboundId)
|
||
if (q.purchasePlanId) form.purchasePlanId = decodeURIComponent(q.purchasePlanId)
|
||
if (id.value) {
|
||
try {
|
||
await loadDetail()
|
||
} catch (e) {
|
||
// handled
|
||
}
|
||
}
|
||
})
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
@import '@/styles/db-theme.scss';
|
||
</style>
|