<template>
|
<div>
|
<el-dialog v-model="isShow"
|
title="编辑库存"
|
width="800"
|
@close="closeModal">
|
<el-form label-width="140px"
|
:model="formState"
|
label-position="top"
|
ref="formRef">
|
<el-form-item label="产品名称"
|
prop="productName">
|
<el-input v-model="formState.productName" disabled />
|
</el-form-item>
|
<el-form-item label="规格"
|
prop="model">
|
<el-input v-model="formState.model" disabled />
|
</el-form-item>
|
<el-form-item label="单位"
|
prop="unit">
|
<el-input v-model="formState.unit" disabled />
|
</el-form-item>
|
<el-form-item label="批号"
|
prop="batchNo">
|
<el-input v-model="formState.batchNo" disabled />
|
</el-form-item>
|
<el-form-item label="合格库存数量"
|
prop="qualifiedQuantity">
|
<el-input-number v-model="formState.qualifiedQuantity"
|
:step="1"
|
:min="0"
|
style="width: 100%" />
|
</el-form-item>
|
<el-form-item label="不合格库存数量"
|
prop="unQualifiedQuantity">
|
<el-input-number v-model="formState.unQualifiedQuantity"
|
:step="1"
|
:min="0"
|
style="width: 100%" />
|
</el-form-item>
|
<el-form-item label="库存预警数量"
|
prop="warnNum">
|
<el-input-number v-model="formState.warnNum"
|
:step="1"
|
:min="0"
|
style="width: 100%" />
|
</el-form-item>
|
<el-form-item label="备注"
|
prop="remark">
|
<el-input v-model="formState.remark"
|
type="textarea" />
|
</el-form-item>
|
</el-form>
|
<template #footer>
|
<div class="dialog-footer">
|
<el-button type="primary"
|
@click="handleSubmit">确认</el-button>
|
<el-button @click="closeModal">取消</el-button>
|
</div>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script setup>
|
import { ref, computed, watch, getCurrentInstance } from "vue";
|
import { ElMessage } from "element-plus";
|
import { updateStockInventory } from "@/api/inventoryManagement/stockInventory.js";
|
|
const { proxy } = getCurrentInstance();
|
|
const props = defineProps({
|
visible: {
|
type: Boolean,
|
default: false,
|
},
|
record: {
|
type: Object,
|
default: () => ({}),
|
},
|
});
|
|
const emits = defineEmits(["update:visible", "completed"]);
|
|
const isShow = computed({
|
get: () => props.visible,
|
set: (val) => emits("update:visible", val),
|
});
|
|
const formRef = ref();
|
|
const formState = ref({
|
id: undefined,
|
productId: undefined,
|
productModelId: undefined,
|
productName: "",
|
model: "",
|
unit: "",
|
batchNo: "",
|
qualifiedQuantity: 0,
|
unQualifiedQuantity: 0,
|
warnNum: 0,
|
remark: "",
|
});
|
|
// 监听弹窗显示，回填数据
|
watch(
|
() => props.visible,
|
(val) => {
|
if (val && props.record) {
|
const row = props.record;
|
console.log('编辑数据:', row);
|
formState.value.id = row.id;
|
formState.value.productId = row.productId;
|
formState.value.productModelId = row.productModelId;
|
formState.value.productName = row.productName || '';
|
formState.value.model = row.model || '';
|
formState.value.unit = row.unit || '';
|
formState.value.batchNo = row.batchNo || '';
|
formState.value.qualifiedQuantity = row.qualifiedQuantity || 0;
|
formState.value.unQualifiedQuantity = row.unQualifiedQuantity || 0;
|
formState.value.warnNum = row.warnNum || 0;
|
formState.value.remark = row.remark || '';
|
}
|
},
|
{ immediate: true }
|
);
|
|
const closeModal = () => {
|
isShow.value = false;
|
resetForm();
|
};
|
|
const resetForm = () => {
|
formState.value = {
|
id: undefined,
|
productId: undefined,
|
productModelId: undefined,
|
productName: "",
|
model: "",
|
unit: "",
|
batchNo: "",
|
qualifiedQuantity: 0,
|
unQualifiedQuantity: 0,
|
warnNum: 0,
|
remark: "",
|
};
|
};
|
|
const handleSubmit = () => {
|
proxy.$refs["formRef"].validate((valid) => {
|
if (valid) {
|
const params = { ...formState.value };
|
updateStockInventory(params)
|
.then(() => {
|
ElMessage.success("编辑成功");
|
closeModal();
|
emits("completed");
|
})
|
.catch(() => {
|
ElMessage.error("编辑失败");
|
});
|
}
|
});
|
};
|
</script>
|
|
<style scoped lang="scss"></style>
|
