|
|
@@ -0,0 +1,122 @@
|
|
|
+<template>
|
|
|
+ <Dialog v-model="visible" :title="dialogTitle" width="600px" @close="handleDialogClose">
|
|
|
+ <el-form ref="formRef" :model="form" label-width="100px" :rules="formRules">
|
|
|
+ <el-form-item label="出库日期" prop="orderDate">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="form.orderDate"
|
|
|
+ type="date"
|
|
|
+ placeholder="选择日期"
|
|
|
+ value-format="YYYY-MM-DD"
|
|
|
+ style="width: 100%"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="领用部门" prop="outDeptId">
|
|
|
+ <el-tree-select
|
|
|
+ v-model="form.outDeptId"
|
|
|
+ :data="departmentOptions"
|
|
|
+ :props="defaultProps"
|
|
|
+ check-strictly
|
|
|
+ node-key="id"
|
|
|
+ placeholder="请选择领用部门"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="领用人" prop="outUser">
|
|
|
+ <el-input v-model="form.outUser" placeholder="请输入领用人" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="出库原因" prop="outReason">
|
|
|
+ <el-input v-model="form.outReason" placeholder="请输入出库原因" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="备注" prop="remark">
|
|
|
+ <el-input v-model="form.remark" type="textarea" :rows="3" placeholder="请输入备注信息" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <template #footer>
|
|
|
+ <el-button @click="visible = false">取消</el-button>
|
|
|
+ <el-button type="primary" :loading="submitLoading" @click="handleSubmit">保存</el-button>
|
|
|
+ </template>
|
|
|
+ </Dialog>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { computed, reactive, ref, watch } from 'vue'
|
|
|
+import { ElMessage } from 'element-plus'
|
|
|
+import { defaultProps } from '@/utils/tree'
|
|
|
+import { generateMaterialOutboundByInbound } from '@/api/material/stockInAndOut'
|
|
|
+
|
|
|
+defineOptions({ name: 'GenerateOutboundDialog' })
|
|
|
+
|
|
|
+const props = defineProps({
|
|
|
+ modelValue: { type: Boolean, default: false },
|
|
|
+ inboundOrderId: { type: [Number, String], default: undefined },
|
|
|
+ tenantId: { type: [Number, String], default: undefined },
|
|
|
+ departmentOptions: { type: Array, default: () => [] },
|
|
|
+})
|
|
|
+
|
|
|
+const emit = defineEmits(['update:modelValue', 'success'])
|
|
|
+
|
|
|
+const visible = computed({
|
|
|
+ get: () => props.modelValue,
|
|
|
+ set: (val) => emit('update:modelValue', val),
|
|
|
+})
|
|
|
+
|
|
|
+const formRef = ref(null)
|
|
|
+const submitLoading = ref(false)
|
|
|
+
|
|
|
+const form = reactive({
|
|
|
+ orderDate: new Date().toISOString().split('T')[0],
|
|
|
+ outDeptId: undefined,
|
|
|
+ outUser: '',
|
|
|
+ outReason: '',
|
|
|
+ remark: '',
|
|
|
+})
|
|
|
+
|
|
|
+const formRules = reactive({
|
|
|
+ orderDate: [{ required: true, message: '请选择出库日期' }],
|
|
|
+ outDeptId: [{ required: true, message: '请选择领用部门' }],
|
|
|
+ outUser: [{ required: true, message: '请输入领用人' }],
|
|
|
+ outReason: [{ required: true, message: '请输入出库原因' }],
|
|
|
+})
|
|
|
+
|
|
|
+watch(
|
|
|
+ () => props.modelValue,
|
|
|
+ (opened) => {
|
|
|
+ if (!opened) return
|
|
|
+ form.orderDate = new Date().toISOString().split('T')[0]
|
|
|
+ form.outDeptId = undefined
|
|
|
+ form.outUser = ''
|
|
|
+ form.outReason = ''
|
|
|
+ form.remark = ''
|
|
|
+ }
|
|
|
+)
|
|
|
+
|
|
|
+const dialogTitle = computed(() => '生成出库单')
|
|
|
+
|
|
|
+const handleDialogClose = () => {
|
|
|
+ formRef.value?.resetFields?.()
|
|
|
+}
|
|
|
+
|
|
|
+const handleSubmit = async () => {
|
|
|
+ await formRef.value?.validate?.()
|
|
|
+ submitLoading.value = true
|
|
|
+ try {
|
|
|
+ const payload = {
|
|
|
+ inboundOrderId: Number(props.inboundOrderId),
|
|
|
+ orderDate: form.orderDate,
|
|
|
+ outDeptId: form.outDeptId,
|
|
|
+ outUser: form.outUser,
|
|
|
+ outReason: form.outReason,
|
|
|
+ remark: form.remark || undefined,
|
|
|
+ tenantId: props.tenantId,
|
|
|
+ }
|
|
|
+ await generateMaterialOutboundByInbound(payload)
|
|
|
+ ElMessage.success('生成成功')
|
|
|
+ visible.value = false
|
|
|
+ emit('success')
|
|
|
+ } catch (e) {
|
|
|
+ ElMessage.error(e?.message || '生成失败')
|
|
|
+ } finally {
|
|
|
+ submitLoading.value = false
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|