✨ ERP：增加 ERP 盘点单的实现 50%

Author: YunaiV

src/api/erp/stock/check/index.ts

@@ -0,0 +1,61 @@
+import request from '@/config/axios'
+
+// ERP 库存盘点单 VO
+export interface StockCheckVO {
+  id: number // 出库编号
+  no: string // 出库单号
+  outTime: Date // 出库时间
+  totalCount: number // 合计数量
+  totalPrice: number // 合计金额，单位：元
+  status: number // 状态
+  remark: string // 备注
+}
+
+// ERP 库存盘点单 API
+export const StockCheckApi = {
+  // 查询库存盘点单分页
+  getStockCheckPage: async (params: any) => {
+    return await request.get({ url: `/erp/stock-check/page`, params })
+  },
+
+  // 查询库存盘点单详情
+  getStockCheck: async (id: number) => {
+    return await request.get({ url: `/erp/stock-check/get?id=` + id })
+  },
+
+  // 新增库存盘点单
+  createStockCheck: async (data: StockCheckVO) => {
+    return await request.post({ url: `/erp/stock-check/create`, data })
+  },
+
+  // 修改库存盘点单
+  updateStockCheck: async (data: StockCheckVO) => {
+    return await request.put({ url: `/erp/stock-check/update`, data })
+  },
+
+  // 更新库存盘点单的状态
+  updateStockCheckStatus: async (id: number, status: number) => {
+    return await request.put({
+      url: `/erp/stock-check/update-status`,
+      params: {
+        id,
+        status
+      }
+    })
+  },
+
+  // 删除库存盘点单
+  deleteStockCheck: async (ids: number[]) => {
+    return await request.delete({
+      url: `/erp/stock-check/delete`,
+      params: {
+        ids: ids.join(',')
+      }
+    })
+  },
+
+  // 导出库存盘点单 Excel
+  exportStockCheck: async (params) => {
+    return await request.download({ url: `/erp/stock-check/export-excel`, params })
+  }
+}

src/views/erp/stock/check/StockCheckForm.vue

@@ -0,0 +1,148 @@
+<template>
+  <Dialog :title="dialogTitle" v-model="dialogVisible" width="1080">
+    <el-form
+      ref="formRef"
+      :model="formData"
+      :rules="formRules"
+      label-width="100px"
+      v-loading="formLoading"
+      :disabled="disabled"
+    >
+      <el-row :gutter="20">
+        <el-col :span="8">
+          <el-form-item label="盘点单号" prop="no">
+            <el-input disabled v-model="formData.no" placeholder="保存时自动生成" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="盘点时间" prop="checkTime">
+            <el-date-picker
+              v-model="formData.checkTime"
+              type="date"
+              value-format="x"
+              placeholder="选择盘点时间"
+              class="!w-1/1"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="16">
+          <el-form-item label="备注" prop="remark">
+            <el-input
+              type="textarea"
+              v-model="formData.remark"
+              :rows="1"
+              placeholder="请输入备注"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="附件" prop="fileUrl">
+            <UploadFile :is-show-tip="false" v-model="formData.fileUrl" :limit="1" />
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <!-- 子表的表单 -->
+    <ContentWrap>
+      <el-tabs v-model="subTabsName" class="-mt-15px -mb-10px">
+        <el-tab-pane label="盘点产品清单" name="item">
+          <StockCheckItemForm ref="itemFormRef" :items="formData.items" :disabled="disabled" />
+        </el-tab-pane>
+      </el-tabs>
+    </ContentWrap>
+    <template #footer>
+      <el-button @click="submitForm" type="primary" :disabled="formLoading" v-if="!disabled">
+        确 定
+      </el-button>
+      <el-button @click="dialogVisible = false">取 消</el-button>
+    </template>
+  </Dialog>
+</template>
+<script setup lang="ts">
+import { StockCheckApi, StockCheckVO } from '@/api/erp/stock/check'
+import StockCheckItemForm from './components/StockCheckItemForm.vue'
+
+/** ERP 其它盘点单表单 */
+defineOptions({ name: 'StockCheckForm' })
+
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+
+const dialogVisible = ref(false) // 弹窗的是否展示
+const dialogTitle = ref('') // 弹窗的标题
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const formType = ref('') // 表单的类型：create - 新增；update - 修改；detail - 详情
+const formData = ref({
+  id: undefined,
+  customerId: undefined,
+  checkTime: undefined,
+  remark: undefined,
+  fileUrl: '',
+  items: []
+})
+const formRules = reactive({
+  checkTime: [{ required: true, message: '盘点时间不能为空', trigger: 'blur' }]
+})
+const disabled = computed(() => formType.value === 'detail')
+const formRef = ref() // 表单 Ref
+
+/** 子表的表单 */
+const subTabsName = ref('item')
+const itemFormRef = ref()
+
+/** 打开弹窗 */
+const open = async (type: string, id?: number) => {
+  dialogVisible.value = true
+  dialogTitle.value = t('action.' + type)
+  formType.value = type
+  resetForm()
+  // 修改时，设置数据
+  if (id) {
+    formLoading.value = true
+    try {
+      formData.value = await StockCheckApi.getStockCheck(id)
+    } finally {
+      formLoading.value = false
+    }
+  }
+}
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+const submitForm = async () => {
+  // 校验表单
+  await formRef.value.validate()
+  await itemFormRef.value.validate()
+  // 提交请求
+  formLoading.value = true
+  try {
+    const data = formData.value as unknown as StockCheckVO
+    if (formType.value === 'create') {
+      await StockCheckApi.createStockCheck(data)
+      message.success(t('common.createSuccess'))
+    } else {
+      await StockCheckApi.updateStockCheck(data)
+      message.success(t('common.updateSuccess'))
+    }
+    dialogVisible.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 重置表单 */
+const resetForm = () => {
+  formData.value = {
+    id: undefined,
+    customerId: undefined,
+    checkTime: undefined,
+    remark: undefined,
+    fileUrl: undefined,
+    items: []
+  }
+  formRef.value?.resetFields()
+}
+</script>