| | |
| | | <template> |
| | | <el-form :model="form" label-width="100px"> |
| | | <el-form :model="form" label-width="100px" :rules="formRules" ref="formRef"> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="设备名称" prop="deviceName"> |
| | |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="规格型号" prop="deviceModel"> |
| | | <el-input v-model="form.deviceModel" placeholder="请输入规格型号" /> |
| | | <el-input v-model="form.deviceModel" :disabled="form.deviceModel != null ? true : false" placeholder="请输入规格型号" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="数量" prop="number"> |
| | | <el-input |
| | | <el-input-number :step="0.01" :min="0" style="width: 100%" |
| | | v-model="form.number" |
| | | placeholder="请输入数量" |
| | | type="number" |
| | | @change="mathNum" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="含税单价" prop="taxIncludingPriceUnit"> |
| | | <el-input |
| | | <el-input-number :step="0.01" :min="0" style="width: 100%" |
| | | v-model="form.taxIncludingPriceUnit" |
| | | placeholder="请输入含税单价" |
| | | type="number" |
| | | maxlength="10" |
| | | @change="mathNum" |
| | | @input="handleNumberInput" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | |
| | | <el-form-item label="含税总价" prop="taxIncludingPriceTotal"> |
| | | <el-input |
| | | v-model="form.taxIncludingPriceTotal" |
| | | placeholder="请输入含税总价" |
| | | placeholder="自动生成" |
| | | type="number" |
| | | disabled |
| | | /> |
| | |
| | | <el-form-item label="不含税总价" prop="unTaxIncludingPriceTotal"> |
| | | <el-input |
| | | v-model="form.unTaxIncludingPriceTotal" |
| | | placeholder="请输入不含税总价" |
| | | placeholder="自动生成" |
| | | type="number" |
| | | disabled |
| | | /> |
| | |
| | | calculateTaxExclusiveTotalPrice, |
| | | } from "@/utils/summarizeTable"; |
| | | import { ElMessage } from "element-plus"; |
| | | import {ref} from "vue"; |
| | | |
| | | defineOptions({ |
| | | name: "设备台账表单", |
| | | }); |
| | | const formRef = ref(null); |
| | | const formRules = { |
| | | deviceName: [{ required: true, trigger: "blur", message: "请输入" }], |
| | | deviceModel: [{ required: true, trigger: "blur", message: "请输入" }], |
| | | supplierName: [{ required: true, trigger: "blur", message: "请输入" }], |
| | | unit: [{ required: true, trigger: "blur", message: "请输入" }], |
| | | number: [{ required: true, trigger: "blur", message: "请输入" }], |
| | | taxIncludingPriceUnit: [{ required: true, trigger: "blur", message: "请输入" }], |
| | | taxRate: [{ required: true, trigger: "change", message: "请输入" }], |
| | | } |
| | | |
| | | const { form, resetForm } = useFormData({ |
| | | deviceName: undefined, // 设备名称 |
| | |
| | | } |
| | | }; |
| | | |
| | | const handleNumberInput = (value) => { |
| | | // 移除所有非数字字符 |
| | | let num = value.replace(/[^\d.]/g, ""); |
| | | // 清除表单校验状态 |
| | | const clearValidate = () => { |
| | | formRef.value?.clearValidate(); |
| | | }; |
| | | |
| | | // 限制长度为10 |
| | | if (num.length > 10) { |
| | | num = num.slice(0, 10); |
| | | } |
| | | |
| | | // 更新值 |
| | | form.taxIncludingPriceUnit = num; |
| | | // 重置表单数据和校验状态 |
| | | const resetFormAndValidate = () => { |
| | | resetForm(); |
| | | clearValidate(); |
| | | }; |
| | | |
| | | defineExpose({ |
| | | form, |
| | | loadForm, |
| | | resetForm, |
| | | clearValidate, |
| | | resetFormAndValidate, |
| | | formRef, |
| | | }); |
| | | </script> |