From 0280df114fc86c1f99d87e4599146e68774c0f36 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Mon, 18 May 2026 22:55:37 +0800
Subject: [PATCH] =?UTF-8?q?feat=EF=BC=88wms=EF=BC=89=EF=BC=9A=E5=AE=8C?=
 =?UTF-8?q?=E6=88=90=20inventory=20history=20=E7=9A=84=E8=BF=81=E7=A7=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/views/wms/inventory/history/data.ts   | 159 ++++++++++++++++++
 .../src/views/wms/inventory/history/index.vue | 104 ++++++++++++
 .../src/views/wms/inventory/history/data.ts   | 159 ++++++++++++++++++
 .../src/views/wms/inventory/history/index.vue | 104 ++++++++++++
 4 files changed, 526 insertions(+)
 create mode 100644 apps/web-antd/src/views/wms/inventory/history/data.ts
 create mode 100644 apps/web-antd/src/views/wms/inventory/history/index.vue
 create mode 100644 apps/web-ele/src/views/wms/inventory/history/data.ts
 create mode 100644 apps/web-ele/src/views/wms/inventory/history/index.vue

diff --git a/apps/web-antd/src/views/wms/inventory/history/data.ts b/apps/web-antd/src/views/wms/inventory/history/data.ts
new file mode 100644
index 000000000..02c33d7fb
--- /dev/null
+++ b/apps/web-antd/src/views/wms/inventory/history/data.ts
@@ -0,0 +1,159 @@
+import type { VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { getWarehouseSimpleList } from '#/api/wms/md/warehouse';
+import { getRangePickerDefaultProps } from '#/utils';
+
+/** 搜索表单 */
+export function useGridFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'orderType',
+      label: '单据类型',
+      component: 'Select',
+      componentProps: {
+        allowClear: true,
+        options: getDictOptions(DICT_TYPE.WMS_ORDER_TYPE, 'number'),
+        placeholder: '请选择单据类型',
+      },
+    },
+    {
+      fieldName: 'orderNo',
+      label: '单据号',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入单据号',
+      },
+    },
+    {
+      fieldName: 'warehouseId',
+      label: '仓库',
+      component: 'ApiSelect',
+      componentProps: {
+        allowClear: true,
+        api: getWarehouseSimpleList,
+        labelField: 'name',
+        placeholder: '请选择仓库',
+        showSearch: true,
+        valueField: 'id',
+      },
+    },
+    {
+      fieldName: 'itemCode',
+      label: '商品编号',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入商品编号',
+      },
+    },
+    {
+      fieldName: 'itemName',
+      label: '商品名称',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入商品名称',
+      },
+    },
+    {
+      fieldName: 'skuCode',
+      label: '规格编号',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入规格编号',
+      },
+    },
+    {
+      fieldName: 'skuName',
+      label: '规格名称',
+      component: 'Input',
+      componentProps: {
+        allowClear: true,
+        placeholder: '请输入规格名称',
+      },
+    },
+    {
+      fieldName: 'createTime',
+      label: '操作时间',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+        allowClear: true,
+      },
+    },
+  ];
+}
+
+/** 库存流水列表字段 */
+export function useGridColumns(): VxeTableGridOptions['columns'] {
+  return [
+    {
+      field: 'orderNo',
+      title: '单据号',
+      width: 180,
+      fixed: 'left',
+    },
+    {
+      field: 'orderType',
+      title: '单据类型',
+      width: 110,
+      fixed: 'left',
+      align: 'center',
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.WMS_ORDER_TYPE },
+      },
+    },
+    {
+      field: 'itemInfo',
+      title: '商品信息',
+      minWidth: 220,
+      slots: { default: 'itemInfo' },
+    },
+    {
+      field: 'skuInfo',
+      title: '规格信息',
+      minWidth: 220,
+      slots: { default: 'skuInfo' },
+    },
+    {
+      field: 'warehouseName',
+      title: '仓库',
+      minWidth: 160,
+    },
+    {
+      field: 'beforeQuantity',
+      title: '操作前',
+      align: 'right',
+      minWidth: 110,
+      slots: { default: 'beforeQuantity' },
+    },
+    {
+      field: 'afterQuantity',
+      title: '操作后',
+      align: 'right',
+      minWidth: 110,
+      slots: { default: 'afterQuantity' },
+    },
+    {
+      field: 'quantityPrice',
+      title: '数量/金额(元)',
+      minWidth: 180,
+      slots: { default: 'quantityPrice' },
+    },
+    {
+      field: 'createTime',
+      title: '操作时间',
+      width: 180,
+      fixed: 'right',
+      align: 'center',
+      formatter: 'formatDateTime',
+    },
+  ];
+}
diff --git a/apps/web-antd/src/views/wms/inventory/history/index.vue b/apps/web-antd/src/views/wms/inventory/history/index.vue
new file mode 100644
index 000000000..bdb911c05
--- /dev/null
+++ b/apps/web-antd/src/views/wms/inventory/history/index.vue
@@ -0,0 +1,104 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { WmsInventoryHistoryApi } from '#/api/wms/inventory/history';
+
+import { DocAlert, Page } from '@vben/common-ui';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getInventoryHistoryPage } from '#/api/wms/inventory/history';
+import { formatPrice, formatQuantity } from '#/views/wms/utils/format';
+
+import { useGridColumns, useGridFormSchema } from './data';
+
+defineOptions({ name: 'WmsInventoryHistory' });
+
+function hasValue(value: unknown) {
+  return value !== undefined && value !== null;
+}
+
+const [Grid] = useVbenVxeGrid({
+  formOptions: {
+    schema: useGridFormSchema(),
+  },
+  gridOptions: {
+    columns: useGridColumns(),
+    height: 'auto',
+    keepSource: true,
+    showOverflow: false,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues) => {
+          return await getInventoryHistoryPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<WmsInventoryHistoryApi.InventoryHistory>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【库存】库存记录、流水、统计"
+        url="https://doc.iocoder.cn/wms/inventory/"
+      />
+    </template>
+
+    <Grid table-title="库存流水">
+      <template #itemInfo="{ row }">
+        <div class="flex flex-col gap-1 py-1 leading-5">
+          <div class="text-sm">{{ row.itemName || '-' }}</div>
+          <div v-if="row.itemCode" class="break-all text-xs text-gray-500">
+            商品编号：{{ row.itemCode }}
+          </div>
+        </div>
+      </template>
+      <template #skuInfo="{ row }">
+        <div class="flex flex-col gap-1 py-1 leading-5">
+          <div class="text-sm">{{ row.skuName || '-' }}</div>
+          <div v-if="row.skuCode" class="break-all text-xs text-gray-500">
+            规格编号：{{ row.skuCode }}
+          </div>
+        </div>
+      </template>
+      <template #beforeQuantity="{ row }">
+        {{ formatQuantity(row.beforeQuantity) || '-' }}
+      </template>
+      <template #afterQuantity="{ row }">
+        {{ formatQuantity(row.afterQuantity) || '-' }}
+      </template>
+      <template #quantityPrice="{ row }">
+        <div class="flex flex-col gap-1 py-1 leading-5">
+          <div class="flex justify-between gap-2">
+            <span class="shrink-0">数量：</span>
+            <span>{{ formatQuantity(row.quantity) }}</span>
+          </div>
+          <div v-if="hasValue(row.price)" class="flex justify-between gap-2">
+            <span class="shrink-0">单价：</span>
+            <span>{{ formatPrice(row.price) }}</span>
+          </div>
+          <div
+            v-if="hasValue(row.totalPrice)"
+            class="flex justify-between gap-2"
+          >
+            <span class="shrink-0">金额：</span>
+            <span>{{ formatPrice(row.totalPrice) }}</span>
+          </div>
+        </div>
+      </template>
+    </Grid>
+  </Page>
+</template>
diff --git a/apps/web-ele/src/views/wms/inventory/history/data.ts b/apps/web-ele/src/views/wms/inventory/history/data.ts
new file mode 100644
index 000000000..9ee6b4731
--- /dev/null
+++ b/apps/web-ele/src/views/wms/inventory/history/data.ts
@@ -0,0 +1,159 @@
+import type { VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+
+import { DICT_TYPE } from '@vben/constants';
+import { getDictOptions } from '@vben/hooks';
+
+import { getWarehouseSimpleList } from '#/api/wms/md/warehouse';
+import { getRangePickerDefaultProps } from '#/utils';
+
+/** 搜索表单 */
+export function useGridFormSchema(): VbenFormSchema[] {
+  return [
+    {
+      fieldName: 'orderType',
+      label: '单据类型',
+      component: 'Select',
+      componentProps: {
+        clearable: true,
+        options: getDictOptions(DICT_TYPE.WMS_ORDER_TYPE, 'number'),
+        placeholder: '请选择单据类型',
+      },
+    },
+    {
+      fieldName: 'orderNo',
+      label: '单据号',
+      component: 'Input',
+      componentProps: {
+        clearable: true,
+        placeholder: '请输入单据号',
+      },
+    },
+    {
+      fieldName: 'warehouseId',
+      label: '仓库',
+      component: 'ApiSelect',
+      componentProps: {
+        api: getWarehouseSimpleList,
+        clearable: true,
+        filterable: true,
+        labelField: 'name',
+        placeholder: '请选择仓库',
+        valueField: 'id',
+      },
+    },
+    {
+      fieldName: 'itemCode',
+      label: '商品编号',
+      component: 'Input',
+      componentProps: {
+        clearable: true,
+        placeholder: '请输入商品编号',
+      },
+    },
+    {
+      fieldName: 'itemName',
+      label: '商品名称',
+      component: 'Input',
+      componentProps: {
+        clearable: true,
+        placeholder: '请输入商品名称',
+      },
+    },
+    {
+      fieldName: 'skuCode',
+      label: '规格编号',
+      component: 'Input',
+      componentProps: {
+        clearable: true,
+        placeholder: '请输入规格编号',
+      },
+    },
+    {
+      fieldName: 'skuName',
+      label: '规格名称',
+      component: 'Input',
+      componentProps: {
+        clearable: true,
+        placeholder: '请输入规格名称',
+      },
+    },
+    {
+      fieldName: 'createTime',
+      label: '操作时间',
+      component: 'RangePicker',
+      componentProps: {
+        ...getRangePickerDefaultProps(),
+        clearable: true,
+      },
+    },
+  ];
+}
+
+/** 库存流水列表字段 */
+export function useGridColumns(): VxeTableGridOptions['columns'] {
+  return [
+    {
+      field: 'orderNo',
+      title: '单据号',
+      width: 180,
+      fixed: 'left',
+    },
+    {
+      field: 'orderType',
+      title: '单据类型',
+      width: 110,
+      fixed: 'left',
+      align: 'center',
+      cellRender: {
+        name: 'CellDict',
+        props: { type: DICT_TYPE.WMS_ORDER_TYPE },
+      },
+    },
+    {
+      field: 'itemInfo',
+      title: '商品信息',
+      minWidth: 220,
+      slots: { default: 'itemInfo' },
+    },
+    {
+      field: 'skuInfo',
+      title: '规格信息',
+      minWidth: 220,
+      slots: { default: 'skuInfo' },
+    },
+    {
+      field: 'warehouseName',
+      title: '仓库',
+      minWidth: 160,
+    },
+    {
+      field: 'beforeQuantity',
+      title: '操作前',
+      align: 'right',
+      minWidth: 110,
+      slots: { default: 'beforeQuantity' },
+    },
+    {
+      field: 'afterQuantity',
+      title: '操作后',
+      align: 'right',
+      minWidth: 110,
+      slots: { default: 'afterQuantity' },
+    },
+    {
+      field: 'quantityPrice',
+      title: '数量/金额(元)',
+      minWidth: 180,
+      slots: { default: 'quantityPrice' },
+    },
+    {
+      field: 'createTime',
+      title: '操作时间',
+      width: 180,
+      fixed: 'right',
+      align: 'center',
+      formatter: 'formatDateTime',
+    },
+  ];
+}
diff --git a/apps/web-ele/src/views/wms/inventory/history/index.vue b/apps/web-ele/src/views/wms/inventory/history/index.vue
new file mode 100644
index 000000000..bdb911c05
--- /dev/null
+++ b/apps/web-ele/src/views/wms/inventory/history/index.vue
@@ -0,0 +1,104 @@
+<script lang="ts" setup>
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+import type { WmsInventoryHistoryApi } from '#/api/wms/inventory/history';
+
+import { DocAlert, Page } from '@vben/common-ui';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getInventoryHistoryPage } from '#/api/wms/inventory/history';
+import { formatPrice, formatQuantity } from '#/views/wms/utils/format';
+
+import { useGridColumns, useGridFormSchema } from './data';
+
+defineOptions({ name: 'WmsInventoryHistory' });
+
+function hasValue(value: unknown) {
+  return value !== undefined && value !== null;
+}
+
+const [Grid] = useVbenVxeGrid({
+  formOptions: {
+    schema: useGridFormSchema(),
+  },
+  gridOptions: {
+    columns: useGridColumns(),
+    height: 'auto',
+    keepSource: true,
+    showOverflow: false,
+    proxyConfig: {
+      ajax: {
+        query: async ({ page }, formValues) => {
+          return await getInventoryHistoryPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            ...formValues,
+          });
+        },
+      },
+    },
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      refresh: true,
+      search: true,
+    },
+  } as VxeTableGridOptions<WmsInventoryHistoryApi.InventoryHistory>,
+});
+</script>
+
+<template>
+  <Page auto-content-height>
+    <template #doc>
+      <DocAlert
+        title="【库存】库存记录、流水、统计"
+        url="https://doc.iocoder.cn/wms/inventory/"
+      />
+    </template>
+
+    <Grid table-title="库存流水">
+      <template #itemInfo="{ row }">
+        <div class="flex flex-col gap-1 py-1 leading-5">
+          <div class="text-sm">{{ row.itemName || '-' }}</div>
+          <div v-if="row.itemCode" class="break-all text-xs text-gray-500">
+            商品编号：{{ row.itemCode }}
+          </div>
+        </div>
+      </template>
+      <template #skuInfo="{ row }">
+        <div class="flex flex-col gap-1 py-1 leading-5">
+          <div class="text-sm">{{ row.skuName || '-' }}</div>
+          <div v-if="row.skuCode" class="break-all text-xs text-gray-500">
+            规格编号：{{ row.skuCode }}
+          </div>
+        </div>
+      </template>
+      <template #beforeQuantity="{ row }">
+        {{ formatQuantity(row.beforeQuantity) || '-' }}
+      </template>
+      <template #afterQuantity="{ row }">
+        {{ formatQuantity(row.afterQuantity) || '-' }}
+      </template>
+      <template #quantityPrice="{ row }">
+        <div class="flex flex-col gap-1 py-1 leading-5">
+          <div class="flex justify-between gap-2">
+            <span class="shrink-0">数量：</span>
+            <span>{{ formatQuantity(row.quantity) }}</span>
+          </div>
+          <div v-if="hasValue(row.price)" class="flex justify-between gap-2">
+            <span class="shrink-0">单价：</span>
+            <span>{{ formatPrice(row.price) }}</span>
+          </div>
+          <div
+            v-if="hasValue(row.totalPrice)"
+            class="flex justify-between gap-2"
+          >
+            <span class="shrink-0">金额：</span>
+            <span>{{ formatPrice(row.totalPrice) }}</span>
+          </div>
+        </div>
+      </template>
+    </Grid>
+  </Page>
+</template>