✨ feat(mes): 添加到货通知单精简列表接口及状态筛选功能

新增获取到货通知单的精简列表接口，支持按状态筛选。更新相关状态枚举和校验逻辑，优化采购入库单的审批和取消功能，确保系统在处理入库单时的状态管理更加清晰和高效。

src/api/mes/wm/arrivalnotice/index.ts

@@ -57,5 +57,10 @@ export const WmArrivalNoticeApi = {
   // 导出到货通知单 Excel
   exportArrivalNotice: async (params: any) => {
     return await request.download({ url: '/mes/wm/arrival-notice/export-excel', params })
+  },
+
+  // 获得到货通知单精简列表（可按状态筛选）
+  getArrivalNoticeSimpleList: async (status?: number) => {
+    return await request.get({ url: '/mes/wm/arrival-notice/simple-list', params: { status } })
   }
 }

src/api/mes/wm/itemreceipt/index.ts

@@ -56,9 +56,9 @@ export const WmItemReceiptApi = {
     return await request.put({ url: '/mes/wm/item-receipt/submit?id=' + id })
   },
 
-  // 审批采购入库单
+  // 执行上架
-  approveItemReceipt: async (id: number) => {
+  shelvingItemReceipt: async (id: number) => {
-    return await request.put({ url: '/mes/wm/item-receipt/approve?id=' + id })
+    return await request.put({ url: '/mes/wm/item-receipt/shelving?id=' + id })
   },
 
   // 执行入库
@@ -66,6 +66,11 @@ export const WmItemReceiptApi = {
     return await request.put({ url: '/mes/wm/item-receipt/execute?id=' + id })
   },
 
+  // 取消采购入库单
+  cancelItemReceipt: async (id: number) => {
+    return await request.put({ url: '/mes/wm/item-receipt/cancel?id=' + id })
+  },
+
   // 导出采购入库单 Excel
   exportItemReceipt: async (params: any) => {
     return await request.download({ url: '/mes/wm/item-receipt/export-excel', params })

src/views/mes/utils/constants.ts

@@ -200,33 +200,20 @@ export const MesProFeedbackTypeEnum = {
 }
 
 /** MES 到货通知单状态枚举 */
-// TODO @AI（4 个状态）：草稿
-// 待质检
-// 已完成
-// 待入库
 export const MesWmArrivalNoticeStatusEnum = {
-  PREPARE: 0,    // 草稿
+  PREPARE: 0,        // 草稿
-  SUBMITTED: 1,  // 已提交
+  PENDING_QC: 1,     // 待质检
-  APPROVED: 2,   // 已审批
+  PENDING_RECEIPT: 2, // 待入库
-  FINISHED: 3    // 已完成
+  FINISHED: 3         // 已完成
 }
 
 /** MES 采购入库单状态枚举 */
-// TODO @AI（5 个状态）：草稿
-// 待上架
-// 待执行入库
-// 已完成
-// 已取消
-  // 创建：进入草稿
-  // 提交：待上架
-  // 上架：待执行入库
-  // 执行入库：已完成
-  // 取消：已取消
 export const MesWmItemReceiptStatusEnum = {
   PREPARE: 0,    // 草稿
-  SUBMITTED: 1,  // 已提交
+  APPROVING: 1,  // 待上架
-  APPROVED: 2,   // 已审批
+  APPROVED: 2,   // 待入库
-  FINISHED: 3    // 已完成
+  FINISHED: 3,   // 已完成
+  CANCELED: 4    // 已取消
 }
 
 /** 获取物料/产品标识的标签 */

src/views/mes/wm/arrivalnotice/components/WmArrivalNoticeSelect.vue

@@ -0,0 +1,96 @@
+<!-- MES 到货通知单选择器：纯下拉，前端过滤（支持 code、vendorName），支持按状态筛选 -->
+<template>
+  <el-select
+    v-model="selectValue"
+    :placeholder="placeholder"
+    :disabled="disabled"
+    :clearable="clearable"
+    filterable
+    :filter-method="handleFilter"
+    class="!w-1/1"
+    @change="handleChange"
+  >
+    <el-option v-for="item in filteredList" :key="item.id" :label="item.code" :value="item.id">
+      <div class="flex items-center gap-8px">
+        <span>{{ item.code }}</span>
+        <el-tag v-if="item.vendorName" size="small" type="info" class="ml-4px">
+          {{ item.vendorName }}
+        </el-tag>
+      </div>
+    </el-option>
+  </el-select>
+</template>
+
+<script setup lang="ts">
+import { WmArrivalNoticeApi, WmArrivalNoticeVO } from '@/api/mes/wm/arrivalnotice'
+
+defineOptions({ name: 'WmArrivalNoticeSelect' })
+
+const props = withDefaults(
+  defineProps<{
+    modelValue?: number
+    status?: number
+    disabled?: boolean
+    clearable?: boolean
+    placeholder?: string
+  }>(),
+  {
+    disabled: false,
+    clearable: true,
+    placeholder: '请选择到货通知单'
+  }
+)
+
+const emit = defineEmits<{
+  'update:modelValue': [value: number | undefined]
+  change: [item: WmArrivalNoticeVO | undefined]
+}>()
+
+const allList = ref<WmArrivalNoticeVO[]>([])
+const filteredList = ref<WmArrivalNoticeVO[]>([])
+
+const selectValue = computed({
+  get: () => props.modelValue,
+  set: (val) => emit('update:modelValue', val)
+})
+
+/** 前端过滤（code + vendorName） */
+const handleFilter = (query: string) => {
+  if (!query) {
+    filteredList.value = allList.value
+    return
+  }
+  const keyword = query.toLowerCase()
+  filteredList.value = allList.value.filter(
+    (item) =>
+      item.code?.toLowerCase().includes(keyword) ||
+      item.vendorName?.toLowerCase().includes(keyword)
+  )
+}
+
+/** 选中变化 */
+const handleChange = (val: number | undefined) => {
+  const item = allList.value.find((o) => o.id === val)
+  emit('change', item)
+}
+
+/** 加载列表 */
+const loadList = async () => {
+  allList.value = await WmArrivalNoticeApi.getArrivalNoticeSimpleList(props.status)
+  filteredList.value = allList.value
+}
+
+/** 监听状态变化，重新加载列表 */
+watch(
+  () => props.status,
+  async () => {
+    selectValue.value = undefined
+    await loadList()
+  }
+)
+
+/** 初始化 */
+onMounted(async () => {
+  await loadList()
+})
+</script>

src/views/mes/wm/arrivalnotice/index.vue

@@ -157,13 +157,13 @@
           >
             提交
           </el-button>
-          <!-- TODO @AI：是不是没这个操作，而是通过【采购入库】解决的状态变更的； -->
+          <!-- TODO @AI：是不是没这个操作，而是通过【采购入库】解决的状态变更的；（确实是的） -->
           <el-button
             link
             type="success"
             @click="handleApprove(scope.row.id)"
             v-hasPermi="['mes:wm-arrival-notice:update']"
-            v-if="scope.row.status === MesWmArrivalNoticeStatusEnum.SUBMITTED"
+            v-if="scope.row.status === MesWmArrivalNoticeStatusEnum.PENDING_QC"
           >
             审批
           </el-button>

src/views/mes/wm/itemreceipt/ItemReceiptDetailList.vue

@@ -1,8 +1,8 @@
 <!-- MES 采购入库明细列表子组件（上架分配） -->
-<!-- TODO @AI：待 review -->
+<!-- TODO @AI：这个列表，可能需要融合到 /Users/yunai/Java/yudao-all-in-one/yudao-ui-admin-vue3/src/views/mes/wm/itemreceipt/ItemReceiptLineList.vue 里；因为 ItemReceiptLineList 的列表，是个折叠的（当有 detail 数据时，可以打开）；展示：仓库名称、区库名称、库位名称、数量、操作； -->
 <template>
   <div>
-    <el-button type="primary" plain @click="openForm('create')" class="mb-10px">
+    <el-button v-if="!isReadonly" type="primary" plain @click="openForm('create')" class="mb-10px">
       <Icon icon="ep:plus" class="mr-5px" /> 添加上架明细
     </el-button>
     <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true" border>
@@ -15,10 +15,12 @@
       <el-table-column label="库区" align="center" prop="locationName" min-width="100" />
       <el-table-column label="库位" align="center" prop="areaName" min-width="100" />
       <el-table-column label="备注" align="center" prop="remark" min-width="120" />
-      <el-table-column label="操作" align="center" width="120">
+      <el-table-column v-if="!isReadonly" label="操作" align="center" width="120" fixed="right">
         <template #default="scope">
+          <!-- TODO @AI：只有初始的 2 个状态，可以编辑、删除 -->
           <el-button link type="primary" @click="openForm('update', scope.row.id)">编辑</el-button>
           <el-button link type="danger" @click="handleDelete(scope.row.id)">删除</el-button>
+          <!-- TODO @AI： -->
         </template>
       </el-table-column>
     </el-table>
@@ -31,6 +33,7 @@
   </div>
 
   <!-- 添加/编辑上架明细弹窗 -->
+  <!-- TODO @AI：展示在 /Users/yunai/Java/yudao-all-in-one/yudao-ui-admin-vue3/src/views/mes/wm/itemreceipt/ItemReceiptLineList.vue 列表里，操作里有以列表【上架】，然后弹出这个窗口：添加物料入库单明细；里面是：物料（已经选择，只读）、入库仓库、数量； -->
   <Dialog :title="dialogTitle" v-model="dialogVisible" width="700px">
     <el-form
       ref="formRef"
@@ -73,31 +76,20 @@
       <el-row>
         <el-col :span="8">
           <el-form-item label="仓库" prop="warehouseId">
-            <el-select
+            <WmWarehouseSelect v-model="formData.warehouseId" />
-              v-model="formData.warehouseId"
-              placeholder="请选择仓库"
-              clearable
-              class="!w-1/1"
-            >
-              <el-option
-                v-for="warehouse in warehouseList"
-                :key="warehouse.id"
-                :label="warehouse.name"
-                :value="warehouse.id"
-              />
-            </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
-          <!-- TODO @芋艿：后续需要通过仓库联动查询库区 -->
           <el-form-item label="库区" prop="locationId">
-            <el-input v-model="formData.locationId" placeholder="请输入库区ID" />
+            <WmWarehouseLocationSelect
+              v-model="formData.locationId"
+              :warehouse-id="formData.warehouseId"
+            />
           </el-form-item>
         </el-col>
         <el-col :span="8">
-          <!-- TODO @芋艿：后续需要通过库区联动查询库位 -->
           <el-form-item label="库位" prop="areaId">
-            <el-input v-model="formData.areaId" placeholder="请输入库位ID" />
+            <WmWarehouseAreaSelect v-model="formData.areaId" :location-id="formData.locationId" />
           </el-form-item>
         </el-col>
       </el-row>
@@ -119,15 +111,21 @@
 <script setup lang="ts">
 import { WmItemReceiptDetailApi, WmItemReceiptDetailVO } from '@/api/mes/wm/itemreceipt/detail'
 import { MdItemApi } from '@/api/mes/md/item'
-import { WmWarehouseApi } from '@/api/mes/wm/warehouse'
+import WmWarehouseSelect from '@/views/mes/wm/warehouse/components/WmWarehouseSelect.vue'
+import WmWarehouseLocationSelect from '@/views/mes/wm/warehouse/components/WmWarehouseLocationSelect.vue'
+import WmWarehouseAreaSelect from '@/views/mes/wm/warehouse/components/WmWarehouseAreaSelect.vue'
 
 defineOptions({ name: 'ItemReceiptDetailList' })
 
 const props = defineProps<{
   receiptId: number
   lineId: number
+  formType: string
 }>()
 
+/** 明细在 execute/detail 模式下只读，shelving 模式下可编辑 */
+const isReadonly = computed(() => ['execute', 'detail'].includes(props.formType))
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 
@@ -170,18 +168,17 @@ const handleDelete = async (id: number) => {
 const dialogVisible = ref(false) // 弹窗的是否展示
 const dialogTitle = ref('') // 弹窗的标题
 const formLoading = ref(false) // 表单的加载中
-const formType = ref('') // 表单的类型
+const detailFormType = ref('') // 明细表单的类型
 const itemList = ref<any[]>([]) // 物料列表
-const warehouseList = ref<any[]>([]) // 仓库列表
 const formData = ref({
   id: undefined,
   lineId: undefined as number | undefined,
   receiptId: undefined as number | undefined,
   itemId: undefined,
   quantity: undefined,
-  warehouseId: undefined,
+  warehouseId: undefined as number | undefined,
-  locationId: undefined,
+  locationId: undefined as number | undefined,
-  areaId: undefined,
+  areaId: undefined as number | undefined,
   batchId: undefined,
   remark: undefined
 })
@@ -195,15 +192,10 @@ const formRef = ref() // 表单 Ref
 const openForm = async (type: string, id?: number) => {
   dialogVisible.value = true
   dialogTitle.value = t('action.' + type)
-  formType.value = type
+  detailFormType.value = type
   resetForm()
-  // 加载物料和仓库列表
+  // 加载物料列表
-  const [items, warehouses] = await Promise.all([
+  itemList.value = await MdItemApi.getItemSimpleList()
-    MdItemApi.getItemSimpleList(),
-    WmWarehouseApi.getWarehouseSimpleList()
-  ])
-  itemList.value = items
-  warehouseList.value = warehouses
   if (id) {
     formLoading.value = true
     try {
@@ -224,7 +216,7 @@ const submitForm = async () => {
       receiptId: props.receiptId,
       lineId: props.lineId
     } as unknown as WmItemReceiptDetailVO
-    if (formType.value === 'create') {
+    if (detailFormType.value === 'create') {
       await WmItemReceiptDetailApi.createItemReceiptDetail(data)
       message.success(t('common.createSuccess'))
     } else {

src/views/mes/wm/itemreceipt/ItemReceiptForm.vue

@@ -9,11 +9,11 @@
     >
       <el-row>
         <el-col :span="8">
-          <!-- 入库单编号：新增时可自动生成，编辑时不可生成 -->
+          <!-- 入库单编号：新增时可自动生成，其他模式不可生成 -->
           <el-form-item label="入库单编号" prop="code">
-            <el-input v-model="formData.code" placeholder="请输入入库单编号">
+            <el-input v-model="formData.code" placeholder="请输入入库单编号" :disabled="isHeaderReadonly">
               <template #append>
-                <el-button @click="generateCode" :disabled="formType === 'update'">
+                <el-button @click="generateCode" :disabled="formType !== 'create'">
                   生成
                 </el-button>
               </template>
@@ -22,50 +22,24 @@
         </el-col>
         <el-col :span="8">
           <el-form-item label="入库单名称" prop="name">
-            <el-input v-model="formData.name" placeholder="请输入入库单名称" />
+            <el-input v-model="formData.name" placeholder="请输入入库单名称" :disabled="isHeaderReadonly" />
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="采购订单编号" prop="purchaseOrderCode">
-            <el-input v-model="formData.purchaseOrderCode" placeholder="请输入采购订单编号" />
+            <el-input v-model="formData.purchaseOrderCode" placeholder="请输入采购订单编号" :disabled="isHeaderReadonly" />
           </el-form-item>
         </el-col>
       </el-row>
       <el-row>
         <el-col :span="8">
-          <!-- TODO @AI：使用 select 组件，已经封装 -->
           <el-form-item label="供应商" prop="vendorId">
-            <el-select
+            <MdVendorSelect v-model="formData.vendorId" :disabled="isHeaderReadonly" />
-              v-model="formData.vendorId"
-              placeholder="请选择供应商"
-              clearable
-              class="!w-1/1"
-            >
-              <el-option
-                v-for="vendor in vendorList"
-                :key="vendor.id"
-                :label="vendor.name"
-                :value="vendor.id"
-              />
-            </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
-          <!-- TODO @AI：使用 select 组件，已经封装 -->
           <el-form-item label="仓库" prop="warehouseId">
-            <el-select
+            <WmWarehouseSelect v-model="formData.warehouseId" :disabled="isHeaderReadonly" />
-              v-model="formData.warehouseId"
-              placeholder="请选择仓库"
-              clearable
-              class="!w-1/1"
-            >
-              <el-option
-                v-for="warehouse in warehouseList"
-                :key="warehouse.id"
-                :label="warehouse.name"
-                :value="warehouse.id"
-              />
-            </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
@@ -76,27 +50,55 @@
               value-format="x"
               placeholder="请选择入库日期"
               class="!w-1/1"
+              :disabled="isHeaderReadonly"
             />
           </el-form-item>
         </el-col>
-        <!-- TODO @AI：到货通知单（id，封装一个 select 组件，对方，参考其他的） -->
       </el-row>
       <el-row>
-        <el-col :span="24">
+        <el-col :span="8">
+          <el-form-item label="到货通知单" prop="noticeId">
+            <WmArrivalNoticeSelect
+              v-model="formData.noticeId"
+              :disabled="isHeaderReadonly"
+              @change="handleNoticeChange"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="16">
           <el-form-item label="备注" prop="remark">
-            <el-input v-model="formData.remark" type="textarea" placeholder="请输入备注" />
+            <el-input v-model="formData.remark" type="textarea" placeholder="请输入备注" :disabled="isHeaderReadonly" />
           </el-form-item>
         </el-col>
       </el-row>
     </el-form>
-    <!-- 编辑时展示行项目信息（入库物料） -->
+    <!-- 非新建模式展示行项目信息（入库物料） -->
     <template v-if="formData.id">
       <el-divider content-position="center">行项目信息</el-divider>
-      <ItemReceiptLineList :receipt-id="formData.id" />
+      <ItemReceiptLineList :receipt-id="formData.id" :form-type="formType" />
     </template>
     <template #footer>
-      <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
+      <!-- create/update 模式 -->
-      <el-button @click="dialogVisible = false">取 消</el-button>
+      <template v-if="formType === 'create' || formType === 'update'">
+        <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
+        <el-button @click="dialogVisible = false">取 消</el-button>
+      </template>
+      <!-- shelving 模式 -->
+      <template v-else-if="formType === 'shelving'">
+        <el-button @click="handleShelving" type="primary" :disabled="formLoading">执行上架</el-button>
+        <el-button @click="handleCancelReceipt" type="danger" :disabled="formLoading">取消入库单</el-button>
+        <el-button @click="dialogVisible = false">关 闭</el-button>
+      </template>
+      <!-- execute 模式 -->
+      <template v-else-if="formType === 'execute'">
+        <el-button @click="handleExecute" type="primary" :disabled="formLoading">执行入库</el-button>
+        <el-button @click="handleCancelReceipt" type="danger" :disabled="formLoading">取消入库单</el-button>
+        <el-button @click="dialogVisible = false">关 闭</el-button>
+      </template>
+      <!-- detail 模式 -->
+      <template v-else>
+        <el-button @click="dialogVisible = false">关 闭</el-button>
+      </template>
     </template>
   </Dialog>
 </template>
@@ -104,23 +106,21 @@
 <script setup lang="ts">
 import { generateRandomStr } from '@/utils'
 import { WmItemReceiptApi, WmItemReceiptVO } from '@/api/mes/wm/itemreceipt'
-import { MdVendorApi } from '@/api/mes/md/vendor'
+import MdVendorSelect from '@/views/mes/md/vendor/components/MdVendorSelect.vue'
-import { WmWarehouseApi } from '@/api/mes/wm/warehouse'
+import WmWarehouseSelect from '@/views/mes/wm/warehouse/components/WmWarehouseSelect.vue'
+import WmArrivalNoticeSelect from '@/views/mes/wm/arrivalnotice/components/WmArrivalNoticeSelect.vue'
 import ItemReceiptLineList from './ItemReceiptLineList.vue'
 
 defineOptions({ name: 'ItemReceiptForm' })
 
-const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 
 const dialogVisible = ref(false) // 弹窗的是否展示
 const dialogTitle = ref('') // 弹窗的标题
 const formLoading = ref(false) // 表单的加载中
-const formType = ref('') // 表单的类型：create - 新增；update - 修改
+const formType = ref<string>('create') // 表单的类型：create / update / shelving / execute / detail
-const vendorList = ref<any[]>([]) // 供应商列表
-const warehouseList = ref<any[]>([]) // 仓库列表
 const formData = ref({
-  id: undefined,
+  id: undefined as number | undefined,
   code: undefined,
   name: undefined,
   purchaseOrderCode: undefined,
@@ -138,25 +138,40 @@ const formRules = reactive({
 })
 const formRef = ref() // 表单 Ref
 
+/** Header fields are read-only in shelving/execute/detail modes */
+const isHeaderReadonly = computed(() =>
+  ['shelving', 'execute', 'detail'].includes(formType.value)
+)
+
+/** 弹窗标题映射 */
+const dialogTitleMap: Record<string, string> = {
+  create: '新增采购入库单',
+  update: '编辑采购入库单',
+  shelving: '执行上架',
+  execute: '执行入库',
+  detail: '采购入库单详情'
+}
+
 /** 生成入库单编号 */
 const generateCode = () => {
   formData.value.code = 'IR' + generateRandomStr(10)
 }
 
+/** 到货通知单变化时，自动填充供应商和采购订单号 */
+const handleNoticeChange = (notice: any) => {
+  if (notice) {
+    formData.value.vendorId = notice.vendorId
+    formData.value.purchaseOrderCode = notice.purchaseOrderCode
+  }
+}
+
 /** 打开弹窗 */
 const open = async (type: string, id?: number) => {
   dialogVisible.value = true
-  dialogTitle.value = t('action.' + type)
   formType.value = type
+  dialogTitle.value = dialogTitleMap[type] || type
   resetForm()
-  // 加载供应商和仓库列表
+  // 修改/上架/执行/详情时，加载数据
-  const [vendors, warehouses] = await Promise.all([
-    MdVendorApi.getVendorSimpleList(),
-    WmWarehouseApi.getWarehouseSimpleList()
-  ])
-  vendorList.value = vendors
-  warehouseList.value = warehouses
-  // 修改时，设置数据
   if (id) {
     formLoading.value = true
     try {
@@ -168,7 +183,7 @@ const open = async (type: string, id?: number) => {
 }
 defineExpose({ open })
 
-/** 提交表单 */
+/** 提交表单（create/update 模式） */
 const emit = defineEmits(['success'])
 const submitForm = async () => {
   // 校验表单
@@ -179,19 +194,63 @@ const submitForm = async () => {
     const data = formData.value as unknown as WmItemReceiptVO
     if (formType.value === 'create') {
       await WmItemReceiptApi.createItemReceipt(data)
-      message.success(t('common.createSuccess'))
+      message.success('新增成功')
     } else {
       await WmItemReceiptApi.updateItemReceipt(data)
-      message.success(t('common.updateSuccess'))
+      message.success('修改成功')
     }
     dialogVisible.value = false
-    // 发送操作成功的事件
     emit('success')
   } finally {
     formLoading.value = false
   }
 }
 
+/** 执行上架（shelving 模式） */
+const handleShelving = async () => {
+  try {
+    await message.confirm('确认执行上架？')
+    formLoading.value = true
+    await WmItemReceiptApi.shelvingItemReceipt(formData.value.id!)
+    message.success('上架成功')
+    dialogVisible.value = false
+    emit('success')
+  } catch {
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 执行入库（execute 模式） */
+const handleExecute = async () => {
+  try {
+    await message.confirm('确认执行入库？执行后将更新库存台账。')
+    formLoading.value = true
+    await WmItemReceiptApi.executeItemReceipt(formData.value.id!)
+    message.success('入库成功')
+    dialogVisible.value = false
+    emit('success')
+  } catch {
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 取消入库单 */
+const handleCancelReceipt = async () => {
+  try {
+    await message.confirm('确认取消该采购入库单？取消后不可恢复。')
+    formLoading.value = true
+    await WmItemReceiptApi.cancelItemReceipt(formData.value.id!)
+    message.success('取消成功')
+    dialogVisible.value = false
+    emit('success')
+  } catch {
+  } finally {
+    formLoading.value = false
+  }
+}
+
 /** 重置表单 */
 const resetForm = () => {
   formData.value = {

src/views/mes/wm/itemreceipt/ItemReceiptLineList.vue

@@ -1,7 +1,7 @@
 <!-- MES 采购入库单行列表子组件 -->
 <template>
   <div>
-    <el-button type="primary" plain @click="openForm('create')" class="mb-10px">
+    <el-button v-if="!isReadonly" type="primary" plain @click="openForm('create')" class="mb-10px">
       <Icon icon="ep:plus" class="mr-5px" /> 添加物料
     </el-button>
     <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true" border>
@@ -16,16 +16,7 @@
         prop="productionBatchNumber"
         min-width="120"
       />
-      <!-- TODO @AI：删除是否检验、检验单号、备注 -->
+      <el-table-column v-if="!isReadonly" label="操作" align="center" width="120" fixed="right">
-      <el-table-column label="是否检验" align="center" prop="iqcCheckFlag" width="90">
-        <template #default="scope">
-          <dict-tag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="scope.row.iqcCheckFlag" />
-        </template>
-      </el-table-column>
-      <el-table-column label="检验单号" align="center" prop="iqcCode" min-width="140" />
-      <el-table-column label="备注" align="center" prop="remark" min-width="120" />
-      <!-- TODO @AI：操作需要 fixed； -->
-      <el-table-column label="操作" align="center" width="120">
         <template #default="scope">
           <el-button link type="primary" @click="openForm('update', scope.row.id)">编辑</el-button>
           <el-button link type="danger" @click="handleDelete(scope.row.id)">删除</el-button>
@@ -52,6 +43,7 @@
       <el-row>
         <el-col :span="12">
           <el-form-item label="物料" prop="itemId">
+            <!-- TODO 物料的 select 组件 -->
             <el-select
               v-model="formData.itemId"
               placeholder="请选择物料"
@@ -81,21 +73,10 @@
         </el-col>
       </el-row>
       <el-row>
+        <!-- TODO @AI：此时不需要这个字段！ -->
         <el-col :span="8">
           <el-form-item label="仓库" prop="warehouseId">
-            <el-select
+            <WmWarehouseSelect v-model="formData.warehouseId" />
-              v-model="formData.warehouseId"
-              placeholder="请选择仓库"
-              clearable
-              class="!w-1/1"
-            >
-              <el-option
-                v-for="warehouse in warehouseList"
-                :key="warehouse.id"
-                :label="warehouse.name"
-                :value="warehouse.id"
-              />
-            </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
@@ -103,6 +84,7 @@
             <el-input v-model="formData.productionBatchNumber" placeholder="请输入生产批号" />
           </el-form-item>
         </el-col>
+        <!-- TODO @芋艿：可能不需要这个字段，界面上没有。【待定】 -->
         <el-col :span="8">
           <el-form-item label="是否检验" prop="iqcCheckFlag">
             <el-switch v-model="formData.iqcCheckFlag" />
@@ -144,7 +126,11 @@
     <!-- 编辑时展示上架明细 -->
     <template v-if="formData.id">
       <el-divider content-position="center">上架明细</el-divider>
-      <ItemReceiptDetailList :receipt-id="props.receiptId" :line-id="formData.id" />
+      <ItemReceiptDetailList
+        :receipt-id="props.receiptId"
+        :line-id="formData.id"
+        :form-type="props.formType"
+      />
     </template>
     <template #footer>
       <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
@@ -154,18 +140,23 @@
 </template>
 
 <script setup lang="ts">
-import { DICT_TYPE } from '@/utils/dict'
 import { WmItemReceiptLineApi, WmItemReceiptLineVO } from '@/api/mes/wm/itemreceipt/line'
 import { MdItemApi } from '@/api/mes/md/item'
-import { WmWarehouseApi } from '@/api/mes/wm/warehouse'
+import WmWarehouseSelect from '@/views/mes/wm/warehouse/components/WmWarehouseSelect.vue'
 import ItemReceiptDetailList from './ItemReceiptDetailList.vue'
 
 defineOptions({ name: 'ItemReceiptLineList' })
 
 const props = defineProps<{
   receiptId: number
+  formType: string
 }>()
 
+/** 行列表在 shelving/execute/detail 模式下只读 */
+const isReadonly = computed(() =>
+  ['shelving', 'execute', 'detail'].includes(props.formType)
+)
+
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 
@@ -206,9 +197,8 @@ const handleDelete = async (id: number) => {
 const dialogVisible = ref(false) // 弹窗的是否展示
 const dialogTitle = ref('') // 弹窗的标题
 const formLoading = ref(false) // 表单的加载中
-const formType = ref('') // 表单的类型
+const lineFormType = ref('') // 行表单的类型
 const itemList = ref<any[]>([]) // 物料列表
-const warehouseList = ref<any[]>([]) // 仓库列表
 const formData = ref({
   id: undefined,
   receiptId: undefined as number | undefined,
@@ -234,15 +224,10 @@ const formRef = ref() // 表单 Ref
 const openForm = async (type: string, id?: number) => {
   dialogVisible.value = true
   dialogTitle.value = t('action.' + type)
-  formType.value = type
+  lineFormType.value = type
   resetForm()
-  // 加载物料和仓库列表
+  // 加载物料列表
-  const [items, warehouses] = await Promise.all([
+  itemList.value = await MdItemApi.getItemSimpleList()
-    MdItemApi.getItemSimpleList(),
-    WmWarehouseApi.getWarehouseSimpleList()
-  ])
-  itemList.value = items
-  warehouseList.value = warehouses
   if (id) {
     formLoading.value = true
     try {
@@ -259,7 +244,7 @@ const submitForm = async () => {
   formLoading.value = true
   try {
     const data = { ...formData.value, receiptId: props.receiptId } as unknown as WmItemReceiptLineVO
-    if (formType.value === 'create') {
+    if (lineFormType.value === 'create') {
       await WmItemReceiptLineApi.createItemReceiptLine(data)
       message.success(t('common.createSuccess'))
     } else {

src/views/mes/wm/itemreceipt/index.vue

@@ -101,13 +101,7 @@
 
   <ContentWrap>
     <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
-      <el-table-column label="入库单编号" align="center" prop="code" min-width="160">
+      <el-table-column label="入库单编号" align="center" prop="code" min-width="160" />
-        <template #default="scope">
-          <el-button link type="primary" @click="openForm('update', scope.row.id)">
-            {{ scope.row.code }}
-          </el-button>
-        </template>
-      </el-table-column>
       <el-table-column label="入库单名称" align="center" prop="name" min-width="150" />
       <el-table-column
         label="采购订单编号"
@@ -137,6 +131,7 @@
       />
       <el-table-column label="操作" align="center" width="240" fixed="right">
         <template #default="scope">
+          <!-- 草稿：编辑、提交、删除 -->
           <el-button
             link
             type="primary"
@@ -155,26 +150,6 @@
           >
             提交
           </el-button>
-          <!-- TODO @AI：审批 => 执行上架； -->
-          <!-- todo @AI：阅读下 /Users/yunai/Java/yudao-all-in-one/yudao-ui-admin-vue3/src/views/mes/utils/constants.ts 最新状态；前后端，字典都需要调整下； -->
-          <el-button
-            link
-            type="success"
-            @click="handleApprove(scope.row.id)"
-            v-hasPermi="['mes:wm-item-receipt:update']"
-            v-if="scope.row.status === MesWmItemReceiptStatusEnum.SUBMITTED"
-          >
-            审批
-          </el-button>
-          <el-button
-            link
-            type="primary"
-            @click="handleExecute(scope.row.id)"
-            v-hasPermi="['mes:wm-item-receipt:execute']"
-            v-if="scope.row.status === MesWmItemReceiptStatusEnum.APPROVED"
-          >
-            执行入库
-          </el-button>
           <el-button
             link
             type="danger"
@@ -184,6 +159,55 @@
           >
             删除
           </el-button>
+          <!-- 待上架：执行上架、取消 -->
+          <el-button
+            link
+            type="success"
+            @click="openForm('shelving', scope.row.id)"
+            v-hasPermi="['mes:wm-item-receipt:update']"
+            v-if="scope.row.status === MesWmItemReceiptStatusEnum.APPROVING"
+          >
+            执行上架
+          </el-button>
+          <!-- 待入库：执行入库、取消 -->
+          <!-- TODO @AI：执行入库时，不需要弹窗，只需要 confirm 之后，调用下接口就 ok 了 -->
+          <el-button
+            link
+            type="primary"
+            @click="openForm('execute', scope.row.id)"
+            v-hasPermi="['mes:wm-item-receipt:execute']"
+            v-if="scope.row.status === MesWmItemReceiptStatusEnum.APPROVED"
+          >
+            执行入库
+          </el-button>
+          <!-- 待上架/待入库：取消 -->
+          <!-- TODO @AI：使用 include 去判断 -->
+          <!-- TODO @AI：需要在确认下，哪些状态可以取消！取消是个危险的动作； -->
+          <el-button
+            link
+            type="danger"
+            @click="handleCancel(scope.row.id)"
+            v-hasPermi="['mes:wm-item-receipt:update']"
+            v-if="
+              scope.row.status === MesWmItemReceiptStatusEnum.APPROVING ||
+              scope.row.status === MesWmItemReceiptStatusEnum.APPROVED
+            "
+          >
+            取消
+          </el-button>
+          <!-- 已完成/已取消：详情 -->
+          <!-- TODO @AI：使用 include 去判断 -->
+          <el-button
+            link
+            type="info"
+            @click="openForm('detail', scope.row.id)"
+            v-if="
+              scope.row.status === MesWmItemReceiptStatusEnum.FINISHED ||
+              scope.row.status === MesWmItemReceiptStatusEnum.CANCELED
+            "
+          >
+            详情
+          </el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -253,7 +277,7 @@ const resetQuery = () => {
   handleQuery()
 }
 
-/** 新增/修改 */
+/** 新增/修改/上架/执行/详情 */
 const formRef = ref() // 表单弹窗
 const openForm = (type: string, id?: number) => {
   formRef.value.open(type, id)
@@ -269,22 +293,12 @@ const handleSubmit = async (id: number) => {
   } catch {}
 }
 
-/** 审批 */
+/** 取消 */
-const handleApprove = async (id: number) => {
+const handleCancel = async (id: number) => {
   try {
-    await message.confirm('确认审批通过该采购入库单？')
+    await message.confirm('确认取消该采购入库单？取消后不可恢复。')
-    await WmItemReceiptApi.approveItemReceipt(id)
+    await WmItemReceiptApi.cancelItemReceipt(id)
-    message.success('审批成功')
+    message.success('取消成功')
-    await getList()
-  } catch {}
-}
-
-/** 执行入库 */
-const handleExecute = async (id: number) => {
-  try {
-    await message.confirm('确认执行入库？执行后将更新库存台账。')
-    await WmItemReceiptApi.executeItemReceipt(id)
-    message.success('入库成功')
     await getList()
   } catch {}
 }

src/views/mes/wm/warehouse/components/WmWarehouseAreaSelect.vue

@@ -0,0 +1,103 @@
+<!-- MES 库位选择器：纯下拉，前端过滤（支持 name、code），支持按库区筛选 -->
+<template>
+  <el-select
+    v-model="selectValue"
+    :placeholder="placeholder"
+    :disabled="disabled"
+    :clearable="clearable"
+    filterable
+    :filter-method="handleFilter"
+    class="!w-1/1"
+    @change="handleChange"
+  >
+    <el-option v-for="item in filteredList" :key="item.id" :label="item.name" :value="item.id">
+      <div class="flex items-center gap-8px">
+        <span>{{ item.name }}</span>
+        <el-tag v-if="item.code" size="small" type="info" class="ml-4px">
+          编号: {{ item.code }}
+        </el-tag>
+      </div>
+    </el-option>
+  </el-select>
+</template>
+
+<script setup lang="ts">
+import { WmWarehouseAreaApi, WmWarehouseAreaVO } from '@/api/mes/wm/warehouse/area'
+
+defineOptions({ name: 'WmWarehouseAreaSelect' })
+
+const props = withDefaults(
+  defineProps<{
+    modelValue?: number
+    locationId?: number
+    disabled?: boolean
+    clearable?: boolean
+    placeholder?: string
+  }>(),
+  {
+    disabled: false,
+    clearable: true,
+    placeholder: '请选择库位'
+  }
+)
+
+const emit = defineEmits<{
+  'update:modelValue': [value: number | undefined]
+  change: [item: WmWarehouseAreaVO | undefined]
+}>()
+
+const allList = ref<WmWarehouseAreaVO[]>([])
+const filteredList = ref<WmWarehouseAreaVO[]>([])
+const filterQuery = ref('')
+
+const selectValue = computed({
+  get: () => props.modelValue,
+  set: (val) => emit('update:modelValue', val)
+})
+
+/** 前端过滤（name + code） */
+const handleFilter = (query: string) => {
+  filterQuery.value = query
+  applyFilter()
+}
+
+/** 应用过滤 */
+const applyFilter = () => {
+  if (!filterQuery.value) {
+    filteredList.value = allList.value
+    return
+  }
+  const keyword = filterQuery.value.toLowerCase()
+  filteredList.value = allList.value.filter(
+    (item) =>
+      item.name?.toLowerCase().includes(keyword) ||
+      item.code?.toLowerCase().includes(keyword)
+  )
+}
+
+/** 选中变化 */
+const handleChange = (val: number | undefined) => {
+  const item = allList.value.find((o) => o.id === val)
+  emit('change', item)
+}
+
+/** 加载库位列表 */
+const loadList = async () => {
+  allList.value = await WmWarehouseAreaApi.getWarehouseAreaSimpleList(props.locationId)
+  applyFilter()
+}
+
+/** 监听库区变化，重新加载库位列表 */
+watch(
+  () => props.locationId,
+  async () => {
+    selectValue.value = undefined
+    await loadList()
+  }
+)
+
+/** 初始化 */
+onMounted(async () => {
+  await loadList()
+})
+</script>