timi/gao-customer-h5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add unit transfer

Browse Source
This commit is contained in:
Timi
2026-09-16 01:39:57 +08:00
parent a6f9fabcec
commit 5dcf77f79f
1 changed files with 69 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/product/ProductStockDetail.vue
+69 -8
View File
@@ -9,6 +9,13 @@
</template>
</product-profile>
<t-cell-group theme="card" title="库存" v-entrance-transition="70">
<t-cell
v-if="1 < unitList.length"
title="显示单位"
:note="selectedUnitName"
arrow
@click="openUnitPicker"
/>
<t-cell class="empty-cell-title-margin">
<template #title>
<span></span>
@@ -18,20 +25,20 @@
<div class="main">
<span class="label">库存</span>
<div class="value">
<strong class="text" v-text="getProductQuantityText(stock.onHandQuantity)" />
<span class="unit" v-text="getProductBaseUnitName(sku) || '基础单位'" />
<strong class="text" v-text="displayStock.onHandQuantity" />
<span class="unit" v-text="selectedUnitName" />
</div>
</div>
<div class="footer">
<div class="available">
<span class="label">可用</span>
<strong class="value" v-text="getProductQuantityText(stock.availableQuantity)" />
<span class="unit" v-text="getProductBaseUnitName(sku) || '基础单位'" />
<strong class="value" v-text="displayStock.availableQuantity" />
<span class="unit" v-text="selectedUnitName" />
</div>
<div class="reserved">
<span class="label">预占</span>
<strong class="value" v-text="getProductQuantityText(stock.reservedQuantity)" />
<span class="unit" v-text="getProductBaseUnitName(sku) || '基础单位'" />
<strong class="value" v-text="displayStock.reservedQuantity" />
<span class="unit" v-text="selectedUnitName" />
</div>
</div>
</div>
@@ -74,22 +81,33 @@
:operation="operationType"
@success="loadAll"
/>
<t-popup v-model="unitPickerVisible" placement="bottom">
<t-picker
v-model="unitPickerDraft"
:columns="unitPickerOptions"
title="选择库存展示单位"
@cancel="unitPickerVisible = false"
@confirm="confirmUnit"
/>
</t-popup>
</div>
</template>
<script setup lang="ts">
import { shallowRef } from "vue";
import { useUserStore } from "timi-web-api";
import ProductAPI from "@/api/ProductAPI";
import ProductProfile from "@/pages/product/component/ProductProfile.vue";
import ProductStockOperationPopup from "@/pages/product/ProductStockOperationPopup.vue";
import { useNavBarStore } from "@/store/navBarStore";
import type { Product, ProductSku, ProductStock, StockOperationType } from "@/types/Product";
import type { Product, ProductSku, ProductStock, ProductSkuUnit, StockOperationType } from "@/types/Product";
import { getErrorMessage } from "@/utils/error";
import { getProductBaseUnitName, getProductQuantityText } from "@/utils/product";
import { convertBaseQuantityToPackageQuantity } from "@/utils/package";
import { Message } from "@/utils/message";
import { permissionCodes } from "@/utils/permission";
type ManualStockOperation = Extract<StockOperationType, "MANUAL_IN" | "MANUAL_OUT" | "STOCKTAKE_GAIN" | "STOCKTAKE_LOSS">;
type PickerValue = string | number;
defineOptions({ name: "ProductStockDetail" });
@@ -103,7 +121,21 @@ const stock = ref<ProductStock>();
const isLoading = ref(false);
const operationVisible = ref(false);
const operationType = ref<ManualStockOperation>("MANUAL_IN");
const selectedUnitId = shallowRef("");
const unitPickerVisible = shallowRef(false);
const unitPickerDraft = ref<PickerValue[]>([]);
const canOperate = computed(() => userStore.hasPermissions(permissionCodes.productStock.create));
const unitList = computed(() => (sku.value?.unitList || []).filter(unit => !!unit.id));
const selectedUnit = computed<ProductSkuUnit | undefined>(() => unitList.value.find(unit => unit.id === selectedUnitId.value)
|| unitList.value.find(unit => unit.isBase)
|| unitList.value[0]);
const selectedUnitName = computed(() => selectedUnit.value?.name || "基础单位");
const unitPickerOptions = computed(() => [unitList.value.map(unit => ({ label: unit.name || "未命名单位", value: unit.id || "" }))]);
const displayStock = computed(() => ({
onHandQuantity: getStockQuantityText(stock.value?.onHandQuantity),
availableQuantity: getStockQuantityText(stock.value?.availableQuantity),
reservedQuantity: getStockQuantityText(stock.value?.reservedQuantity)
}));
const operationList: Array<{ text: string; icon: string; type: ManualStockOperation; theme: "primary" | "danger" }> = [
{ text: "手工入库", icon: "import", type: "MANUAL_IN", theme: "primary" },
{ text: "手工出库", icon: "export", type: "MANUAL_OUT", theme: "danger" },
@@ -129,6 +161,34 @@ function getStockTheme(item: ProductStock): "danger" | "success" | "default" {
return 0 < min && available < min ? "danger" : "success";
}
function getStockQuantityText(value?: number | string): string {
return convertBaseQuantityToPackageQuantity(value ?? "0", selectedUnit.value?.baseQuantityPerUnit ?? "1") || "0";
}
function setDefaultUnit(nextSku: ProductSku): void {
const nextUnitList = nextSku.unitList || [];
if (selectedUnitId.value && nextUnitList.some(unit => unit.id === selectedUnitId.value)) {
return;
}
selectedUnitId.value = nextUnitList.find(unit => unit.isBase)?.id || nextUnitList[0]?.id || "";
}
function openUnitPicker(): void {
if (1 >= unitList.value.length) {
return;
}
unitPickerDraft.value = [selectedUnit.value?.id || ""];
unitPickerVisible.value = true;
}
function confirmUnit(value: PickerValue[]): void {
const unitId = String(value[0] || "");
if (unitList.value.some(unit => unit.id === unitId)) {
selectedUnitId.value = unitId;
}
unitPickerVisible.value = false;
}
async function loadAll(): Promise<void> {
const skuId = String(route.params.skuId || "");
if (!skuId) {
@@ -143,6 +203,7 @@ async function loadAll(): Promise<void> {
]);
product.value = productResult;
sku.value = skuResult;
setDefaultUnit(skuResult);
stock.value = { ...stockResult, sku: skuResult };
} finally {
isLoading.value = false;