| | |
| | | <el-form-item label="供应商名称" prop="supplierName"> |
| | | <el-input v-model="form.supplierName" placeholder="请输入" /> |
| | | </el-form-item> |
| | | <el-form-item label="煤种" prop="category"> |
| | | <el-input v-model="form.category" placeholder="请输入" /> |
| | | </el-form-item> |
| | | <el-form-item label="煤种" prop="coal"> |
| | | <el-select v-model="form.coal" placeholder="请选择煤种" clearable style="width: 100%"> |
| | | <el-option label="瘦煤" value="瘦煤" /> |
| | | <el-option label="气煤" value="气煤" /> |
| | | <el-option label="无烟煤" value="无烟煤" /> |
| | | <el-option label="长焰煤" value="长焰煤" /> |
| | | <el-option label="贫煤" value="贫煤" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="单位" prop="unit"> |
| | | <el-input v-model="form.unit" placeholder="请输入" /> |
| | | <el-select v-model="form.unit" placeholder="请选择单位" clearable style="width: 100%"> |
| | | <el-option label="吨" value="吨" /> |
| | | <el-option label="千克" value="千克" /> |
| | | </el-select> |
| | | </el-form-item> <el-form-item label="采购数量" prop="purchaseQuantity"> |
| | | <el-input |
| | | v-model.number="form.purchaseQuantity" |
| | | placeholder="请输入" |
| | | @blur="handleQuantityBlur" |
| | | > |
| | | <template v-slot:suffix> |
| | | <i style="font-style:normal;">{{form.unit?form.unit:''}}</i> |
| | | </template> |
| | | </el-input> |
| | | </el-form-item><el-form-item label="税率" prop="taxRate"> |
| | | <el-input |
| | | v-model.number="form.taxRate" |
| | | placeholder="请输入税率" |
| | | @blur="handleTaxRateBlur" |
| | | > |
| | | <template v-slot:suffix> |
| | | <i style="font-style:normal;">%</i> |
| | | </template> |
| | | </el-input> |
| | | </el-form-item> |
| | | <el-form-item label="采购数量" prop="purchaseAmount"> |
| | | <el-input v-model="form.purchaseAmount" placeholder="请输入" /> |
| | | <el-form-item label="单价(不含税)" prop="priceExcludingTax"> |
| | | <el-input |
| | | v-model.number="form.priceExcludingTax" |
| | | placeholder="请输入" |
| | | @blur="handlePriceBlur" |
| | | > |
| | | <template v-slot:suffix> |
| | | <i style="font-style:normal;">元</i> |
| | | </template> |
| | | </el-input> |
| | | </el-form-item> <el-form-item label="单价(含税)" prop="priceIncludingTax"> |
| | | <el-input |
| | | v-model.number="form.priceIncludingTax" |
| | | placeholder="自动计算" |
| | | > |
| | | <template v-slot:suffix> |
| | | <i style="font-style:normal;">元</i> |
| | | </template> |
| | | </el-input> |
| | | </el-form-item> |
| | | <el-form-item label="单价(税前)" prop="priceBeforeTax"> |
| | | <el-input v-model="form.priceBeforeTax" placeholder="请输入" /> |
| | | <el-form-item label="总价(不含税)" prop="totalPriceExcludingTax"> |
| | | <el-input |
| | | v-model.number="form.totalPriceExcludingTax" |
| | | placeholder="自动计算" |
| | | > |
| | | <template v-slot:suffix> |
| | | <i style="font-style:normal;">元</i> |
| | | </template> |
| | | </el-input> |
| | | </el-form-item> |
| | | <el-form-item label="总价(税前)" prop="totalBeforeTax"> |
| | | <el-input v-model="form.totalBeforeTax" placeholder="请输入" /> |
| | | <el-form-item label="总价(含税)" prop="totalPriceIncludingTax"> |
| | | <el-input |
| | | v-model.number="form.totalPriceIncludingTax" |
| | | placeholder="自动计算" |
| | | > |
| | | <template v-slot:suffix> |
| | | <i style="font-style:normal;">元</i> |
| | | </template> |
| | | </el-input> |
| | | </el-form-item> |
| | | <el-form-item label="热值" prop="calorificValue"> |
| | | <el-input v-model="form.calorificValue" placeholder="请输入" /> |
| | | </el-form-item> |
| | | <el-form-item label="登记人" prop="registrant"> |
| | | <el-input v-model="form.registrant" placeholder="请输入" /> |
| | | <el-form-item label="登记人" prop="registrantId"> |
| | | <el-input v-model="form.registrantId" disabled placeholder="请输入" /> |
| | | </el-form-item> |
| | | <el-form-item label="登记日期" prop="registrationDate"> |
| | | <el-date-picker |
| | | disabled |
| | | v-model="form.registrationDate" |
| | | type="date" |
| | | placeholder="YYYY-MM-DD" |
| | |
| | | </el-form> |
| | | <template #footer> |
| | | <div class="dialog-footer"> |
| | | <el-button type="primary" @click="handleSubmit">保存</el-button> |
| | | <!-- 重置和取消 --> |
| | | <el-button |
| | | type="primary" |
| | | @click="handleClose" |
| | | v-if="title.includes('新增')" |
| | | >取消</el-button |
| | | > |
| | | <el-button |
| | | type="primary" |
| | | @click="handleReset" |
| | | v-if="title.includes('编辑')" |
| | | >重置</el-button |
| | | > |
| | | <el-button type="primary" @click="handleSubmit">确认</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | |
| | | </template> |
| | | |
| | | <script setup name="ProductionDialog"> |
| | | import { ref, defineProps, watch } from "vue"; |
| | | import { ref, defineProps, watch, onMounted, nextTick, computed } from "vue"; |
| | | import { ElMessage } from "element-plus"; |
| | | import useUserStore from '@/store/modules/user' |
| | | import {addOrEditPR} from "@/api/procureMent"; |
| | | const props = defineProps({ |
| | | title: { |
| | | type: String, |
| | |
| | | required: true, |
| | | type: Object, |
| | | }); |
| | | const copyForm = defineModel("copyForm", { |
| | | required: true, |
| | | type: Object, |
| | | }); |
| | | |
| | | const toFixed = (num, precision = 2) => { |
| | | if (isNaN(num) || num === null || num === undefined || num === '') { |
| | | return 0; |
| | | } |
| | | return Math.floor(parseFloat(num) * Math.pow(10, precision)) / Math.pow(10, precision); |
| | | }; |
| | | // 含税单价计算 |
| | | const unitPriceWithTax = computed(() => { |
| | | const priceExcludingTax = parseFloat(form.value.priceExcludingTax) || 0; |
| | | const taxRate = parseFloat(form.value.taxRate) || 0; |
| | | if (!priceExcludingTax || !taxRate) { |
| | | return 0; |
| | | } |
| | | const result = priceExcludingTax * (1 + taxRate / 100); |
| | | return toFixed(result, 2); |
| | | }); |
| | | |
| | | // 含税总价计算 |
| | | const totalUnitPriceWithTax = computed(() => { |
| | | const priceExcludingTax = parseFloat(form.value.priceExcludingTax) || 0; |
| | | const taxRate = parseFloat(form.value.taxRate) || 0; |
| | | const purchaseQuantity = parseFloat(form.value.purchaseQuantity) || 0; |
| | | |
| | | if (!priceExcludingTax || !taxRate || !purchaseQuantity) { |
| | | return 0; |
| | | } |
| | | |
| | | const unitPriceWithTaxValue = priceExcludingTax * (1 + taxRate / 100); |
| | | const result = unitPriceWithTaxValue * purchaseQuantity; |
| | | return toFixed(result, 2); |
| | | }); |
| | | |
| | | // 不含税总价计算 |
| | | const taxExclusiveTotalPrice = computed(() => { |
| | | const purchaseQuantity = parseFloat(form.value.purchaseQuantity) || 0; |
| | | const priceExcludingTax = parseFloat(form.value.priceExcludingTax) || 0; |
| | | |
| | | if (!purchaseQuantity || !priceExcludingTax) { |
| | | return 0; |
| | | } |
| | | |
| | | const result = purchaseQuantity * priceExcludingTax; |
| | | return toFixed(result, 2); |
| | | }); |
| | | |
| | | // 监听计算值变化,同步到 form 对象中 |
| | | watch(unitPriceWithTax, (newValue) => { |
| | | form.value.priceIncludingTax = newValue; |
| | | }); |
| | | |
| | | watch(totalUnitPriceWithTax, (newValue) => { |
| | | form.value.totalPriceIncludingTax = newValue; |
| | | }); |
| | | |
| | | watch(taxExclusiveTotalPrice, (newValue) => { |
| | | form.value.totalPriceExcludingTax = newValue; |
| | | }); |
| | | |
| | | const userStore = useUserStore() |
| | | const userInfo = ref({}); |
| | | |
| | | // 处理税率输入框失焦,确保精度 |
| | | const handleTaxRateBlur = () => { |
| | | if (form.value.taxRate !== null && form.value.taxRate !== undefined && form.value.taxRate !== '') { |
| | | form.value.taxRate = toFixed(parseFloat(form.value.taxRate), 2); |
| | | } |
| | | }; |
| | | |
| | | // 处理不含税单价输入框失焦,确保精度 |
| | | const handlePriceBlur = () => { |
| | | if (form.value.priceExcludingTax !== null && form.value.priceExcludingTax !== undefined && form.value.priceExcludingTax !== '') { |
| | | form.value.priceExcludingTax = toFixed(parseFloat(form.value.priceExcludingTax), 2); |
| | | } |
| | | }; |
| | | |
| | | // 处理采购数量输入框失焦,确保精度 |
| | | const handleQuantityBlur = () => { |
| | | if (form.value.purchaseQuantity !== null && form.value.purchaseQuantity !== undefined && form.value.purchaseQuantity !== '') { |
| | | form.value.purchaseQuantity = toFixed(parseFloat(form.value.purchaseQuantity), 3); // 数量保留3位小数 |
| | | } |
| | | }; |
| | | |
| | | onMounted(async () => { |
| | | let res = await userStore.getInfo() |
| | | userInfo.value = res; |
| | | }) |
| | | const rules = { |
| | | supplierName: [ |
| | | { required: true, message: "请输入供应商名称", trigger: "blur" }, |
| | | ], |
| | | category: [{ required: true, message: "请输入煤种", trigger: "blur" }], |
| | | coal: [{ required: true, message: "请输入煤种", trigger: "blur" }], |
| | | unit: [{ required: true, message: "请输入单位", trigger: "blur" }], |
| | | purchaseAmount: [ |
| | | purchaseQuantity: [ |
| | | { required: true, message: "请输入采购数量", trigger: "blur" }, |
| | | { type: "number", message: "采购数量必须为数字", trigger: "blur" }, |
| | | ], |
| | | priceBeforeTax: [{ required: true, message: "请输入单价", trigger: "blur" }], |
| | | totalBeforeTax: [{ required: true, message: "请输入总价", trigger: "blur" }], |
| | | calorificValue: [{ required: true, message: "请输入热值", trigger: "blur" }], |
| | | registrant: [{ required: true, message: "请输入登记人", trigger: "blur" }], |
| | | priceExcludingTax: [{ required: true, message: "请输入单价", trigger: "blur" }], |
| | | totalPriceExcludingTax: [{ required: true, message: "请输入总价", trigger: "blur" }], |
| | | priceIncludingTax: [{ required: true, message: "请输入含税单价", trigger: "blur" }], |
| | | totalPriceIncludingTax: [{ required: true, message: "请输入含税总价", trigger: "blur" }], |
| | | taxRate: [{ required: true, message: "请输入税率", trigger: "blur" }], |
| | | registrantId: [{ required: true, message: "请输入登记人", trigger: "blur" }], |
| | | registrationDate: [ |
| | | { required: true, message: "请选择登记日期", trigger: "change" }, |
| | | ], |
| | |
| | | // 关闭弹窗 |
| | | const handleClose = () => { |
| | | dialogFormVisible.value = false; |
| | | console.log(form.value); |
| | | }; |
| | | const handleReset = () => { |
| | | if (!formRef.value) return; |
| | | formRef.value.resetFields(); |
| | | ElMessage.success("表单已重置"); |
| | | }; |
| | | // 持续监听form.value的变化 |
| | | watch( |
| | | () => form.value, |
| | | (val) => { |
| | | console.log(val); |
| | | const handleReset = async () => { |
| | | // 重置表单数据 |
| | | form.value = JSON.parse(JSON.stringify(copyForm.value)); |
| | | // 等待DOM更新完成后清除表单验证状态 |
| | | await nextTick(); |
| | | if (formRef.value) { |
| | | formRef.value.clearValidate(); |
| | | } |
| | | ); |
| | | }; |
| | | const formRef = ref(null); |
| | | // 提交表单 |
| | | const handleSubmit = async () => { |
| | | console.log("提交表单", form.value); |
| | | if (!formRef.value) return; |
| | | await formRef.value.validate((valid) => { |
| | | await formRef.value.validate(async (valid) => { |
| | | if (valid) { |
| | | try { |
| | | emit("success", { ...form.value }); |
| | | handleClose(); |
| | | ElMessage.success("保存成功"); |
| | | } catch (error) { |
| | | console.error("保存失败:", error); |
| | | ElMessage.error("保存失败"); |
| | | const obj = ref({}); |
| | | if (props.title.includes('新增')) { |
| | | let result = await addOrEditPR({ |
| | | ...form.value, |
| | | }) |
| | | obj.value = { |
| | | title: "新增", |
| | | ...form.value, |
| | | result |
| | | }; |
| | | } else { |
| | | delete form.value.updateTime |
| | | delete form.value.createTime |
| | | let result = await addOrEditPR({ |
| | | ...form.value, |
| | | }) |
| | | obj.value = { |
| | | title: "编辑", |
| | | ...form.value, |
| | | result |
| | | }; |
| | | } |
| | | emit("submit", obj.value); |
| | | } |
| | | }); |
| | | }; |