| | |
| | | <div> |
| | | <el-dialog |
| | | v-model="isShow" |
| | | title="领用" |
| | | :title="TEXT.title" |
| | | width="800" |
| | | @close="closeModal" |
| | | > |
| | | <el-form label-width="140px" :model="formState" label-position="top" ref="formRef"> |
| | | <el-form-item |
| | | label="产品名称" |
| | | :label="TEXT.productName" |
| | | prop="productModelId" |
| | | :rules="[ |
| | | { |
| | | required: true, |
| | | message: '请选择产品', |
| | | message: TEXT.selectProduct, |
| | | trigger: 'change', |
| | | } |
| | | }, |
| | | ]" |
| | | > |
| | | <el-button type="primary" @click="showProductSelectDialog = true" disabled> |
| | | {{ formState.productName ? formState.productName : '选择产品' }} |
| | | {{ formState.productName ? formState.productName : TEXT.selectProduct }} |
| | | </el-button> |
| | | </el-form-item> |
| | | |
| | | <el-form-item |
| | | label="规格" |
| | | prop="productModelName" |
| | | > |
| | | <el-form-item :label="TEXT.specification" prop="productModelName"> |
| | | <el-input v-model="formState.model" disabled /> |
| | | </el-form-item> |
| | | |
| | | <el-form-item |
| | | label="单位" |
| | | prop="unit" |
| | | > |
| | | <el-form-item :label="TEXT.unit" prop="unit"> |
| | | <el-input v-model="formState.unit" disabled /> |
| | | </el-form-item> |
| | | |
| | | <el-form-item |
| | | label="数量" |
| | | prop="qualitity" |
| | | > |
| | | <el-input-number v-model="formState.qualitity" :step="1" :min="1" :max="maxQuality" style="width: 100%" /> |
| | | <el-form-item :label="TEXT.quantity" prop="qualitity"> |
| | | <el-input-number |
| | | v-model="formState.qualitity" |
| | | :step="1" |
| | | :min="1" |
| | | :max="maxQuality" |
| | | style="width: 100%" |
| | | /> |
| | | </el-form-item> |
| | | |
| | | <el-form-item label="备注" prop="remark"> |
| | | <el-form-item |
| | | :label="TEXT.inboundTime" |
| | | prop="inboundTime" |
| | | :rules="[ |
| | | { |
| | | required: true, |
| | | message: TEXT.selectInboundTime, |
| | | trigger: 'change', |
| | | }, |
| | | ]" |
| | | > |
| | | <el-date-picker |
| | | v-model="formState.inboundTime" |
| | | type="datetime" |
| | | format="YYYY-MM-DD HH:mm:ss" |
| | | value-format="YYYY-MM-DD HH:mm:ss" |
| | | :placeholder="TEXT.selectInboundTime" |
| | | style="width: 100%" |
| | | /> |
| | | </el-form-item> |
| | | |
| | | <el-form-item :label="TEXT.remark" prop="remark"> |
| | | <el-input v-model="formState.remark" type="textarea" /> |
| | | </el-form-item> |
| | | </el-form> |
| | | |
| | | <!-- 产品选择弹窗 --> |
| | | <ProductSelectDialog |
| | | v-model="showProductSelectDialog" |
| | | @confirm="handleProductSelect" |
| | | single |
| | | /> |
| | | |
| | | <template #footer> |
| | | <div class="dialog-footer"> |
| | | <el-button type="primary" @click="handleSubmit">确认</el-button> |
| | | <el-button @click="closeModal">取消</el-button> |
| | | <el-button type="primary" @click="handleSubmit">{{ TEXT.confirm }}</el-button> |
| | | <el-button @click="closeModal">{{ TEXT.cancel }}</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | |
| | | </template> |
| | | |
| | | <script setup> |
| | | import {ref, computed, getCurrentInstance} from "vue"; |
| | | import { computed, getCurrentInstance, onMounted, ref } from "vue"; |
| | | import ProductSelectDialog from "@/views/basicData/product/ProductSelectDialog.vue"; |
| | | import {subtractStockInventory} from "@/api/inventoryManagement/stockInventory.js"; |
| | | import {subtractStockUnInventory} from "@/api/inventoryManagement/stockUninventory.js"; |
| | | |
| | | const TEXT = { |
| | | title: "\u9886\u7528", |
| | | productName: "\u4ea7\u54c1\u540d\u79f0", |
| | | selectProduct: "\u8bf7\u9009\u62e9\u4ea7\u54c1", |
| | | specification: "\u89c4\u683c", |
| | | unit: "\u5355\u4f4d", |
| | | quantity: "\u6570\u91cf", |
| | | inboundTime: "\u5165\u5e93\u65f6\u95f4", |
| | | selectInboundTime: "\u8bf7\u9009\u62e9\u5165\u5e93\u65f6\u95f4", |
| | | remark: "\u5907\u6ce8", |
| | | confirm: "\u786e\u8ba4", |
| | | cancel: "\u53d6\u6d88", |
| | | submitSuccess: "\u63d0\u4ea4\u6210\u529f", |
| | | selectSpec: "\u8bf7\u9009\u62e9\u89c4\u683c", |
| | | }; |
| | | |
| | | const props = defineProps({ |
| | | visible: { |
| | |
| | | type: { |
| | | type: String, |
| | | required: true, |
| | | default: 'qualified', |
| | | default: "qualified", |
| | | }, |
| | | }); |
| | | |
| | | const emit = defineEmits(['update:visible', 'completed']); |
| | | const emit = defineEmits(["update:visible", "completed"]); |
| | | |
| | | onMounted(() => { |
| | | initFormData() |
| | | }) |
| | | const getCurrentDateTime = () => { |
| | | const now = new Date(); |
| | | const pad = (value) => String(value).padStart(2, "0"); |
| | | return `${now.getFullYear()}-${pad(now.getMonth() + 1)}-${pad(now.getDate())} ${pad(now.getHours())}:${pad(now.getMinutes())}:${pad(now.getSeconds())}`; |
| | | }; |
| | | |
| | | const maxQuality = computed(() => { |
| | | return props.record.unLockedQuantity ? props.record.unLockedQuantity : 0; |
| | | }) |
| | | }); |
| | | |
| | | const initFormData = () => { |
| | | if (props.record) { |
| | | formState.value = { |
| | | ...props.record, |
| | | } |
| | | } |
| | | } |
| | | |
| | | // 响应式数据(替代选项式的 data) |
| | | const formState = ref({ |
| | | productId: undefined, |
| | | productModelId: undefined, |
| | |
| | | model: "", |
| | | unit: "", |
| | | qualitity: 0, |
| | | remark: '', |
| | | inboundTime: getCurrentDateTime(), |
| | | remark: "", |
| | | }); |
| | | |
| | | const isShow = computed({ |
| | |
| | | return props.visible; |
| | | }, |
| | | set(val) { |
| | | emit('update:visible', val); |
| | | emit("update:visible", val); |
| | | }, |
| | | }); |
| | | |
| | | const showProductSelectDialog = ref(false); |
| | | const { proxy } = getCurrentInstance(); |
| | | |
| | | let { proxy } = getCurrentInstance() |
| | | const initFormData = () => { |
| | | if (props.record) { |
| | | formState.value = { |
| | | ...props.record, |
| | | inboundTime: props.record.inboundTime || getCurrentDateTime(), |
| | | }; |
| | | } |
| | | }; |
| | | |
| | | onMounted(() => { |
| | | initFormData(); |
| | | }); |
| | | |
| | | const closeModal = () => { |
| | | // 重置表单数据 |
| | | formState.value = { |
| | | productId: undefined, |
| | | productModelId: undefined, |
| | | productName: "", |
| | | productModelName: "", |
| | | description: '', |
| | | description: "", |
| | | inboundTime: getCurrentDateTime(), |
| | | }; |
| | | isShow.value = false; |
| | | }; |
| | | |
| | | // 产品选择处理 |
| | | const handleProductSelect = async (products) => { |
| | | if (products && products.length > 0) { |
| | | const product = products[0]; |
| | | console.log(product) |
| | | formState.value.productId = product.productId; |
| | | formState.value.productName = product.productName; |
| | | formState.value.productModelName = product.model; |
| | | formState.value.productModelId = product.id; |
| | | formState.value.unit = product.unit; |
| | | showProductSelectDialog.value = false; |
| | | // 触发表单验证更新 |
| | | proxy.$refs["formRef"]?.validateField('productModelId'); |
| | | proxy.$refs["formRef"]?.validateField("productModelId"); |
| | | } |
| | | }; |
| | | |
| | | const handleSubmit = () => { |
| | | proxy.$refs["formRef"].validate(valid => { |
| | | if (valid) { |
| | | // 验证是否选择了产品和规格 |
| | | if (!formState.value.productModelId) { |
| | | proxy.$modal.msgError("请选择产品"); |
| | | proxy.$refs["formRef"].validate((valid) => { |
| | | if (!valid) { |
| | | return; |
| | | } |
| | | if (!formState.value.productModelId) { |
| | | proxy.$modal.msgError("请选择规格"); |
| | | return; |
| | | } |
| | | if (props.type === 'qualified') { |
| | | subtractStockInventory(formState.value).then(res => { |
| | | // 关闭模态框 |
| | | isShow.value = false; |
| | | // 告知父组件已完成 |
| | | emit('completed'); |
| | | proxy.$modal.msgSuccess("提交成功"); |
| | | }) |
| | | } else { |
| | | subtractStockUnInventory(formState.value).then(res => { |
| | | // 关闭模态框 |
| | | isShow.value = false; |
| | | // 告知父组件已完成 |
| | | emit('completed'); |
| | | proxy.$modal.msgSuccess("提交成功"); |
| | | }) |
| | | } |
| | | } |
| | | }) |
| | | }; |
| | | |
| | | if (!formState.value.productModelId) { |
| | | proxy.$modal.msgError(TEXT.selectProduct); |
| | | return; |
| | | } |
| | | if (!formState.value.productModelId) { |
| | | proxy.$modal.msgError(TEXT.selectSpec); |
| | | return; |
| | | } |
| | | if (!formState.value.inboundTime) { |
| | | proxy.$modal.msgError(TEXT.selectInboundTime); |
| | | return; |
| | | } |
| | | |
| | | const submitApi = |
| | | props.type === "qualified" ? subtractStockInventory : subtractStockUnInventory; |
| | | |
| | | submitApi(formState.value).then(() => { |
| | | isShow.value = false; |
| | | emit("completed"); |
| | | proxy.$modal.msgSuccess(TEXT.submitSuccess); |
| | | }); |
| | | }); |
| | | }; |
| | | |
| | | defineExpose({ |
| | | closeModal, |